@charset "utf-8";
/* CSS Document */
* {
   margin: 0;
   padding: 0;
   box-sizing: border-box;
   font-family: sans-serif;
}
header {
   height: 70px;
   background-color: #22292F;
   padding: 10px 0;  
}
.menu-wrap {
   display: flex;
   justify-content: space-between;
   padding: 0 15px;
}
.logo-img {
   height: 50px;
}
.menu-icon {
   font-size: 2.4em;
   color: #ffffff;
   line-height: 50px;
}
nav {
   position: absolute;
   background-color: #3D4852;
   top:70px;
   left:0;
}
nav ul {
   list-style-type: none;
}
nav ul li {
   padding: 0 15px;
}
nav ul li a {
   display:inline-block;
   padding: 12px;
   /* Add your custom styles below to change appearance of links */
   color: #DAE1E7;
   text-decoration: none;
   letter-spacing: 0.05em;
}
nav ul li a:hover, nav ul li a:focus {
   color: #eb6f4a;     
   max-height:none;
   overflow:hidden;
}
    #checkbox {
   display:none;
}
	#checkbox:checked ~ nav ul {
   max-height: 200px;
   padding: 15px 0;  
   transition: all 0.5s;
}

@media only screen and (min-width: 768px) {
}

@media only screen and (min-width: 768px) {
  .menu-icon {
	 display: none;
  }
}

@media only screen and (min-width: 768px) {
  nav {
	position: relative;
    top:-10px;
    background-color: transparent;
    /*position:static;
    top:-10px;
    background-color: transparent;
	height: 100vh;
     flex-direction: column; 
     width: 100%;*/
  }
  nav ul {
    max-height: 70px;
    text-align: right;
	padding: 15px 0;
  }
  nav ul li {
    display: inline-flex;
	 padding-left: 20px;
  }
}