/* reset */






ol, ul { list-style: none }


@media (max-width:767px) {

body input + label {position: fixed; top: 0px; right: 0px; height: 108px; width: 130px; z-index: 5; background-color: #45bbb4; padding: 30px 45px;}
body input + label span {position: absolute; width: 40px; height: 4px; margin-top: 25%; display: block; background: #ffffff; transition: .5s;}
body input + label span:first-child { top: 10px; }
body input + label span:last-child { top: 20px; }
body label:hover { cursor: pointer; }
body input:checked + label span {opacity: 0; top: 20%;}
body input:checked + label span:first-child {opacity: 1; transform: rotate(405deg);}
body input:checked + label span:last-child {opacity: 1; transform: rotate(-405deg);}
body input ~ nav {background: #ffffff; position: fixed; top: 0; left: 0; width: 100%; height: 108px; z-index: 3; transition: .5s; transition-delay: .5s; overflow: hidden;}
body input ~ nav > ul {text-align: center; position: absolute; top: 20%; left:-40px; }
body input ~ nav > ul > li {opacity: 0; transition: .5s; transition-delay: 0s;}
body input ~ nav > ul > li > a {text-decoration: none; text-transform: uppercase; color: #020304; display: block; padding: 10px;}
body input:checked ~ nav {height: 100%; transition-delay: 0s;}
body input:checked ~ nav > ul > li {opacity: 1; transition-delay: .5s;} 
 }



@media(min-width:992px) {

body input + label {position: fixed; top: 0px; right: 40px; height: 108px; width: 130px; z-index: 5; background-color: #45bbb4; padding: 30px 45px;}
body input + label span {position: absolute; width: 40px; height: 4px; margin-top: 25%; display: block; background: #ffffff; transition: .5s;}
body input + label span:first-child { top: 10px; }
body input + label span:last-child { top: 20px; }
body label:hover { cursor: pointer; }
body input:checked + label span {opacity: 0; top: 20%;}
body input:checked + label span:first-child {opacity: 1; transform: rotate(405deg);}
body input:checked + label span:last-child {opacity: 1; transform: rotate(-405deg);}
body input ~ nav {background: #ffffff; position: fixed; top: 0; left: 0; width: 100%; height: 108px; z-index: 3; transition: .5s; transition-delay: .5s; overflow: hidden;}
body input ~ nav > ul {text-align: center; position: absolute; top: 10%; left: 20%; right: 20%;}
body input ~ nav > ul > li {opacity: 0; transition: .5s; transition-delay: 0s;}
body input ~ nav > ul > li > a {text-decoration: none; text-transform: uppercase; color: #020304; display: block; padding: 5px;}
body input:checked ~ nav {height: 100%; transition-delay: 0s;}
body input:checked ~ nav > ul > li {opacity: 1; transition-delay: .5s;} 

}