Radio Toggles

In this demo, labels for hidden radios toggle the content. This is based on the behavior in which clicked labels for a radio or checkbox input will check that input.

<input id="radio-1" type="radio" name="demo-radios">
<input id="radio-2" type="radio" name="demo-radios">
#radio-1: #radio-2:
<label for="radio-1">Toggle #radio-1</label>
<label for="radio-2">Toggle #radio-2</label>

Click one of the labels above and see its effect on the radios above it.

The radios for this pen's tabs are displayed semi-transparently at the top of this demo page.

Conference of Youth 15

The official gathering of YOUNGO members happens every year at the Conference of YOUTH (COY), which takes place for 3 days preceding the annual Conference of the Parties (COP). COY serves as a preparation session of youth NGOs to develop position papers, network and meet new members, and hold strategic discussions on climate change solutions. Annually, the Youth Conference, or COY, is held in the same country and prior to the dealings in COP to unify the opinion and experience of young people during the year and enforce them at that meeting.

Since 2005, ahead of COP11 in Montreal, a Conference of Youth has been held annually. Since 2014, COP20 in Lima, participation has grown massively, with a peak of 4,000 youth participating in COY11 in Paris (COP21).

COY primarily serves as a space for capacity building and policy training to prepare young people for their participation at COP. The participants are introduced to the various Working Groups of YOUNGO, where they develop common policy positions (lobby points) and develop strategies to best advocate for the interests of youth in those policy areas.

We are part of the Core Team

We’re proud to be part of the chilean organising team for the Conference of Youth (COY15). Our president, Juan José Martin is the General Coordinator, and one of our members, Ignacio Cabrera is the Food and Accommodation Coordinator. They are joined by five volunteers supporting the work of the commissions of: Food and Accommodation, Finance and General Coordination.

The COY is an international gathering for young people intrigued by the environmental future and climate emergency that scientists assure will affect the planet in the short term. Since its creation, the COY has involved thousands of young people from all sectors, societies and countries around the world.

It takes place in the host country for the Conference of Parties (COP), previous to the negotiations that will take place at the COP in order to unify the opinion and experience of the youth and make them count at said meeting.

More information at


We are part of the Civil Society for Climate Action (SCAC for its name in Spanish), a network of collaborating organizations whose main goal is to coordinate efforts for climate action. It is formed by private individuals from Chilean and other Latin American countries with the goal of promoting concrete initiatives to raise awareness on climate emergency, to propose alternatives and to expose political proposals that are not conducive to the current goals of improving the biological, social and climate situation. 

As one of its first projects, SCAC is currently preparing a letter for President Sebastián Piñera presenting a series of 15 measures to tackle global warming in the framework of the COP25 Conference, which will take place this year in Chile. The Society also made a direct call to the national Worker’s Union (CUT), the Government and other major authorities, demanding their support and subscription of the Declaration of a state of Climate Emergency, and to take effective measures to curb global warming. SCAC created the organization of the Social Summit for Climate Action, born to raise the climate commitment of our governments, and currently promotes a satellite event, alternative and simultaneous to the COP25: a conference by civilians and for civilians seeking to influence the discussion and decisions in this year’s summit conference on climate change.  

For more information visit:

Sustainable COP

Sustainable COP is a global request that arises from the concern of perceiving a lack of consequence between the objectives that the COP’s seek, and the development of these as an event. For this reason, we, as a civil society, seek to raise minimum standards on a global scale so that the next COP’s can, and will, be consistent with their objective of reducing greenhouse gas emissions and adapting to climate change, whilst at the same time having an event that follows the footsteps and objectives of sustainability that their corporation wishes to achieve.

For more information, follow on instagram@sustainableCOP

Sign the petition here: UN Climate Change Conference (COP) to be a coherent meeting


On small screens, the tabs fold down into an expandable menu. To trigger the menu, I use a checkbox (note that it appears at the top of the screen on smaller screen sizes). There are two labels that trigger this checkbox. One opens and the other closes the menu. The one that opens is absolutely positioned invisibly over the "active" menu item. The closing label is at the bottom of the open menu.

The best way I have found to show and hide content without using absolute positioning is to use a combination of max-height and opacity. When "inactive", the content has a max-height: 0 and opacity: 0.

It also has a transition: opacity when I don't know the future height (this panel's content for example) and transition: opacity, max-height when I do know the future height (like the menu). When "active", the max-height and opacity get positive values and the content will transition in. I'm sure flexbox could get me around this hack, but this works for now.

Suscribe to our mailing list