/* //////////////////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////  Navigation  /////////////////////////////////////// */
/* //////////////////////////////////////////////////////////////////////////////////// */


#navtrigger {
  display:none;
   position: fixed;
   top: 0;
   right: 0;
   padding: 12px 2px;
   z-index: 99;
   cursor: pointer;
}


/* //////  Mainnav  ////// */

#mainnav {
  position: fixed;
  top:160px;
  width: 200px;
  transition: all ease 0.4s;
  z-index: 80;
}


#mainnav ul {
  padding: 0;
  margin: 0;
}

#mainnav ul li {
  list-style: none;
  line-height: 30px;
  margin: 4px 0;
}

#mainnav ul li span {
  	display: inline-block;
   	padding: 1px 6px; 
  	background-color: #fdf9f6;
}

/*#mainnav ul li:hover span {
  background-color: #CFB161;
}*/

#mainnav ul li a {
  text-decoration: none;
  font-size: 1.25em;
  color: #3d4a93;
}


#mainnav ul li:hover a {
  color: #CFB161;
}

/*  #mainnav ul li.active span {
  background-color: #CFB161;
}*/

#mainnav ul li.active a {
  color: #CFB161;
}




/* ////////// Mobile Navigation ///////////////*/

#mobilenav {
  display:none;
  position: fixed;
  top: 0;
  left:-100vw;
  width: 80vw;
  z-index: 98;
  padding: 30px 0;
  background-color: #3d4a93;
  box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
  transition: all ease 0.4s;
  min-height: 100vh;
}

.open-mobilenav #mobilenav {
  left: 0px;
}

#mobilenav ul {
	padding: 0 0 0 20px;
}

#mobilenav ul li {
  list-style: none;
  line-height: 30px;
  margin: 12px 0;
}

#mobilenav ul li span {
  	display: inline-block;
   	padding: 2px 6px; 
}

#mobilenav ul li:hover span {
  background-color: #CFB161;
}

#mobilenav ul li.active span {
  background-color: #CFB161;
}

#mobilenav ul a {
  color: #ffffff;
  font-size: 1.25rem;
  text-decoration:none;
}

.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
    background-color: #3d4a93;  
}

.hamburger.is-active .hamburger-inner, .hamburger.is-active .hamburger-inner::before, .hamburger.is-active .hamburger-inner::after {
    background-color: #3d4a93;
}

/* small screens */
@media screen and (max-width: 1024px) {

}




/* mobile desvices */
@media screen and (max-width: 575px) {
  
  	#navtrigger, #mobilenav {
  		display: block;
	}
  
    #mainnav {
      display: none;
    }

}