@charset "UTF-8";
@import "variables.css";

/*--------------------------------------------------------------
BREAKPOINT > 1400 (Above)
--------------------------------------------------------------*/
@media (min-width: 1400px) {	
	
}

/*--------------------------------------------------------------
BREAKPOINT < 1400 (larger desktops)
--------------------------------------------------------------*/
@media (max-width: 1400px) {

}

/*--------------------------------------------------------------
BREAKPOINT < 1200 (large desktops)
--------------------------------------------------------------*/
@media (max-width: 1200px) {

}

/*--------------------------------------------------------------
BREAKPOINT < 992 (desktops)
--------------------------------------------------------------*/
@media (max-width:992px) {
  #masthead {
      height: 60px;
  }	
  .module-navbar {
      height: 60px;
	  margin: 0 3rem;	  
  }		
  .module-navbar .left img {
      height: 46px;
  }	
  .nav__links {
      top: 100px;
  }	


}



/*--------------------------------------------------------------
BREAKPOINT < 768 (tablets)
--------------------------------------------------------------*/
@media (max-width:768px) {
  .module-navbar .left img {
      height: 46px;
  }		
	
}

/*--------------------------------------------------------------
BREAKPOINT < 576 (landscape phones)
--------------------------------------------------------------*/
@media (max-width:576px) {
  .module-navbar .left img {
      height: 38px;
  }	
  .module-navbar {
      margin: 0 1rem;
  }	
  .menu li {
      display: inline-block;
      padding-left: 4px;
      padding-right: 4px;
  }	
	
}

/*--------------------------------------------------------------
BREAKPOINT < 400 (portrait phones)
--------------------------------------------------------------*/
@media only screen and (max-width: 400px) {
	  .module-navbar .left img {
      height: 30px;
  }	
  .module-navbar {
      margin: 0 12px;
  }		

}