#section3 { background-color: #53bf65; } .content > div { display: none; padding: 20px 25px 5px; } #tab1:checked ~ .content #content1, #tab2:checked ~ .content #content2, #tab3:checked ~ .content #content3, #tab4:checked ~ .content #content4 { display: block; } .tab { display: block; float: left; clear: left; margin: 0px; width: 14%; left: 0; overflow: hidden; margin-right: 6mm; border: 6mm solid hsla(0, 100%, 50%, 0); padding-left: 2mm; border-left-color: #357840; transition: border-left-color 500ms; border-bottom-right-radius: 5mm; border-top-right-radius: 5mm; } .tab:hover { color: aqua; background-color: #357840; transition: background-color 500ms; } .ratiobtn:checked + .tab { border-left-color: aqua; transition: border-left-color 500ms; } .content { position: relative; float: left; width: 80%; top: -200px; height: 260px; background-color: #357840; color: white; border-radius: 5mm;; } .ratiobtn { display: none; } #experiencecontentcontainer { margin-top: 100px; } .experiencetitle{ font-size: x-large; } .companyname{ color: aqua; } .experienceworktext{ margin-top: 5mm; font-size: large; }