@charset "utf-8";
/* ************************************** */
#inp_burger {
  visibility: 					hidden;
}

@media (max-width: 530px), (max-height: 400px) {
body h1 > span {
  text-transform: 			none;
  opacity: 							.5;
  font-weight: 					700;
  font-size: 						2em;
}
#lbl_burger {
}
body input + label {
  position: 						fixed;
  top: 									30px;
  right: 								0px;
  height: 							20px;
  width: 								20px;
  z-index: 							5;
}
body input + label span {
  position: 						absolute;
  width: 								100%;
  height: 							3px;
  top: 									50%;
  margin-top: 					-1px;
  left: 								0;
  display: 							block;
  background: 					var(--link-color);
  transition: 					.5s;
}
body input + label span:first-child {
  top: 									5px;
}
body input + label span:last-child {
  top: 									15px;
}
body label:hover {
  cursor: 							pointer;
}
body input:checked + label span {
  opacity: 							0;
  top: 									50%;
}
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: 					rgba(245,245,245,0.9);
  position: 						fixed;
  top: 									0;
  right: 								0;
  height: 							0px;
  width: 								100%;
  z-index: 							3;
  transition: 					.5s;
  transition-delay: 		.5s;
  overflow: 						hidden;
}
body input ~ nav > ul {
  position: 						absolute;
  bottom:								5%;
  left: 								30%;
}
body input ~ nav > ul > li {
  opacity: 							0;
  transition: 					.5s;
  transition-delay: 		0s;
  display: 							block;
  font-size: 						1.3em;
}
body input ~ nav > ul > li > a {
  text-decoration: 			none;
  font-weight: 					700;
  font-family: 					sans-serif;
  display: 							block;
  padding: 							30px;
}
body input:checked ~ nav {
  height: 							100%;
  transition-delay: 		0s;
}
body input:checked ~ nav > ul > li {
  opacity: 							1;
  transition-delay: 		.5s;
}
}