#masthead {
  height:10em;
}

.desktop {
  display:none;
}

.header {
  display:none;
}

.col-2-xs {
  width:49.5%;
  float:left;
}

.col-2-xs:nth-child(odd){
  margin-right:.5%;
}

.col-2-xs:nth-child(even){
  margin-left:.5%;
}

/* mobile navigation container ///////////*/

.navigation {
  width:100%;
  padding:0;
  background-color:#21c1ff;
  position:relative;
  margin:0;
  z-index:510;
  min-height:58px;
}

/* mobile menu ///////////*/


.mobile--logo {
  float:left;
}

.mobile {
  display:block;
  height: auto;
  width: 100%;
  background-color: #21c1ff;
  position:relative;
  transition:.2s opacity ease;
}


/* menu calendar */

.mobile--calendar {
  width: 4em;
  float: right;
  padding: 1.3em;
  color: #fff;
}

.mobile--calendar i {
  color:#fff;
  font-size:1.4em;
}


/* menu search  */

.search--button {
  color: #fff;
  font-size: 1.3em;
  padding: 1em;
  display: block;
  width: 60px;
  text-align: center;
  float: right;
  position:relative;
  z-index:700;
}

.mobile--search__slide {
  display:block !important;
  position:absolute;
  z-index:600;
  width:100%;
  padding:.765em;
  animation: fadein .2s forwards ease;
/*   background-color:rgba(0,0,0,.25); */
  background-color: rgba(0, 132, 183, 0.90);
}

@keyframes search-slide {
  0% {
    transform:translateX(100%);
  }
  100% {
    transform:translateX(0);
  }
}


.search--button:hover {
  cursor:pointer;
}

.search--form {
  display:none;
  opacity: 0;
  text-align: right;
  padding:0 4em 0 0;
}

.search--form input[type="text"] {
  padding: 1.45em;
  border: 0;
  font-size: 1em;
  background-color: rgba(255,255,255,.9);
  transition: .1s background-color ease;
  float: left;
  width: 83%;
}

.search--form input[type="text"]:focus {
  outline:none;
  background-color:rgba(0,0,0,.7);
  color:#fff;
}

.search--form input[type="text"]:focus::-webkit-input-placeholder {
  color:#fff;
  letter-spacing:.02em;
}
.search--form input[type="text"]:focus::-moz-placeholder {
  color:#fff;
  letter-spacing:.02em;
}
.search--form input[type="text"]:focus::-ms-input-placeholder {
  color:#fff;
  letter-spacing:.02em;
}

.search--form button {
  border-radius: 0;
  border: 0;
  padding: 1em 1em;
  width: 15%;
  font-size: 1.3em;
  display: flex;
  background: transparent;
  color: #fff;
  float: right;
}

.mobile__full-screen {
  min-height:100%;
  position:absolute;
  background-color:#21c1ff;
}


/* menu list */

.mobile .navigation--menu {
  display:none;
  margin: 0;
  padding: 0;
  width:100%;
  height: 90.5%;
  position: fixed;
  overflow-y: overlay;
/*   background-color:#f8f8f8; */
/*   background-color: rgba(15,110,155,.9); */
  background-color:rgba(175, 240, 255, 0.95);
  list-style-type:none;
}

.navigation--menu li a{
  text-decoration:none;
  display:block;
  color:#333; 
/*   color:#fff; */
  font-weight:100;
  font-size:1em;
  padding:1.2em 2em;
  text-transform:uppercase;
/*   border-bottom:1px solid #ccc; */
/*   border-bottom:1px solid #666; */
  border-bottom:#a1a1a1;
}

.navigation--menu li a:hover {
/*   background-color:#01abf0; */
  background-color: rgba(33, 193, 255,.80);
  color:#fff;
}

/* mobile sub-menu */

.menu--sub-menu {
  display:none;
  overflow-y: overlay;
  list-style-type:none;
  margin:0;
  padding:0;
}

.menu--sub-menu li a {
  font-size:.9em;
  padding-left:3.5em;
  border:0;
/*   background-color:#fff; */
/*   background-color: rgba(255,255,255,.1); */
  background-color:rgba(255,255,255,.5);
}

/* mobile-sub nested menu */

.sub-menu--category {
  list-style-type:none;
  margin:0px;
  padding:0;
}

.sub-menu--category li a {
  border-bottom: 0;
  font-size: .85em;
  padding-left: 4.5em;
  padding: 1em 2em 1em 5em;
}

.underline {
/*   text-decoration:underline !important; */
  font-weight:600 !important;
}

/* navigation hamburger button //////////*/

.body__fixed {
  overflow:hidden;
}

.call-to-action {
  margin-top:1.5em;
}

.call-to-action a{
  background-color:#CAF5FF;
  color:#333;
  margin:.1em 0;
}

.nav-mobile--button {
  float:left;
  width: 4.5em;
  position:relative;
  display:block;
  top:0;
  z-index: 501;
}

.mobile--button {
  display:block;
  top:0;
  z-index:500;
}

.mobile--button:after {
    content: ">";
    position: absolute;
    right: 1em;
    font-size: 1.4em;
    margin-top: 0em;
    transition:.2s transform ease;
    transform:rotate(90deg);
    transform-origin:center center;
    margin-top:-.2em;
}

.mobile--button__open:after {
  margin-top:-.2em;
  transform-origin: 50% 50%;
  transform: rotate(45deg);
}

.navigation--menu__fixed {
  position: fixed;
  display: block;
  width: 100%;
  top: 0;
}

.mobile__fixed {
  position: fixed;
  display: block;
  width: 100%;
  height:100%;
  top: 0;
}

.button--hamburger:focus:focus {
  outline:none;
}

.button--hamburger {
  font-size:1.2em;
  background-color:#01abf0;
  border-radius:0;
  padding:1.09em 1.5em;
  width:100%;
  border:0;
  color:#fff;
  margin:0 auto;
  display:block;
}

/* navigation button animation */

.mobile__fade-in {  
  position: fixed;
  display: block;
  width: 100%;
  height:100%;
  top: 0;
  animation:fadein .3s ease alternate;
}

.mobile--menu__fade-in {  
  position: fixed;
  animation:fadein .3s ease alternate;
}

.mobile__fade-out {
  animation:fadein .3s ease reverse;
}

@keyframes fadein {
  0% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}

.mobile__slideup {
  animation:slideup .2s linear;
}

@keyframes slideup {
  0% {
    transform:translateY(0);
  }
  100% {
    transform:translateY(-100%);
  }
}

/* Desktop Navigation //////////*/

@media(min-width:680px) {
  
  .header {
    display:block;
  }
  
  .mobile {
    display:none;
  }
  
  .desktop {
    display:block;
  }
  
  .col-2-md {
    display:inline;
  }
  
  .col-4-sm {
    width:25%;
    float:left;
    display:block;
  }
  
  .navigation {
/*     background-color:#f1f1f1; */
    background-color:#21c1ff;
    min-height:42px;
  }
  
  
  .nav-mobile--button {
    display:none;
  }
  
  li.mobile--link {
    display:none !important;
  } 
  
  .navigation--menu {
    display:flex !important;
    list-style-type:none;
    margin:0;
    padding:0;
    background-color: #21c1ff;
    padding-left:2%;
    transition:all 0s ease;
  }
  
  .navigation--menu li {
    display:inline-block;
  }
  
  .navigation--menu li .menu--sub-menu {
    opacity:0;
  }
  
/*
  .navigation--menu li:hover .menu--sub-menu {
    display:block;
    position: absolute;
    z-index: 510;
    background-color:rgba(175, 240, 255, 0.95);
    padding: .5em 0 1.5em 1em;
    width: 100%;
    margin:0 auto;
    left: 50%;
    opacity:1;
    transform: translateX(-50%);
  }
*/
  .navigation--menu .menu--sub-menu.sub-menu-about .sub-menu--container{
    margin-left:6%;
  }
  
  .navigation--menu li.hover-state .menu--sub-menu {
    display:block;
    position: absolute;
    z-index: 510;
    background-color:rgba(175, 240, 255, 0.95);
    padding: .5em 0 1.5em 1em;
    width: 100%;
    margin:0 auto;
    left: 50%;
    opacity:1;
    transform: translateX(-50%);
    word-wrap:break-word;
  }
  
  .navigation--menu .menu--sub-menu .sub-menu--container {
    max-width:1200px;
    margin-left:1%;
  }
  
  .navigation--menu li.short-dropdown.hover-state {
    position:relative;
    width:auto;
  }
  
  .navigation--menu li.short-dropdown.hover-state .menu--sub-menu {
    display:block;
    position:absolute;
  }
  
  .navigation--menu li a {
    width:auto;
    display:block;
    color:#f8f8f8;
    background-color:#21c1ff;
    border-bottom:0;
    font-size:.9em;
    padding: 1em .85em;
    transition:.1s all ease;
  }
  
  .navigation--menu li a:hover {
    background-color:rgba(113, 228, 255, 0.99);
    color:#444;
  }
  
  .navigation--quick-links {
    display:none;
  }
  
  .menu--sub-menu li {
    display:inline-block;
  }
  
  .menu--sub-menu li a{
    color:#333;
    font-size:.85em;
    background-color:transparent;
    padding:1em 1em 1em 0;
  }
  
  .menu--sub-menu li a:hover {
    text-decoration:underline;
    background-color:transparent;
  }
  
  .navigation--menu li a.globnavhere {
    background-color:rgba(169, 235, 251, 0.89);
    color:#444;
  }
  
  .navigation--menu li a.globnavhere li {
    background-color:none;
  }
  
  .sub-menu--category {
    margin:0;
    padding-left: 1.6em;
  }
  
  .sub-menu--category li{
    display:inline-block;
    padding-right:2em;
  }
  
  .menu--sub-menu .sub-menu--category li a {
    font-size:.9em;
    padding:.25em 0;
  }
  
  .sub-menu--category .category--arts {
    display:block;
  }
  
  .underline {
/*     text-decoration:underline !important; */
    font-weight:600;
  }
  
  .stronger {
    margin-top:.5em;
    font-weight:600;
    display:block;
  }
  
  .menu--sub-menu .col-4:last-child {
    padding-right:0;
  }
  
}


@media(min-width:980px) {
  
  .navigation {
    min-height:42px;
  }
  
  .navigation--menu .menu--sub-menu .sub-menu--container {
    max-width:1200px;
    margin-left:6.4%;
  }
  
  .menu--sub-menu li a.underline {
    font-size:1em;
    margin:0;
    padding-bottom:.15em;
    padding-left: 1em;    
    padding-top: .5em;
  }
  
  .col-4-sm {
    width:100%;
    float:none;
  }
  
  .col-2-md {
    width:100%;
    float:none;
  }
  
  .sub-menu--category {
    padding-bottom:1em;
    padding-left:1em;
  }
  
  .sub-menu--category li {
    display:block;
    padding:0;
  }

  .navigation--menu {
    padding:0 2%;
  }

  .navigation--menu li a{
    font-size:1em;
    padding:.7em 1.5em;
  }
  
  .navigation--quick-links {
    display:block;
    float:right;
    list-style-type:none;
    position:absolute;
    top:0;
    right:0;
  }
  
  .navigation--quick-links li {
    display:inline-block;
  }
  
  .navigation--quick-links a {
    font-size:1em;
    padding:.7em 2em;
    text-decoration: none;
    color:#fff;
  }
  
  .sub-menu--category li a {
    
    padding:.5em 0;
  }

  .menu--sub-menu {
    padding:3em;
  }
  
  .menu--sub-menu li {
    display:block;
  }
  
  .menu--sub-menu li a{
    font-size:.85em;
  }
  
}

@media (min-width:1000px) {
  .navigation--menu {
    padding:0 7%;
  }
  
  .navigation--menu li a {
    padding:.7em 1.5em;
  }
}