﻿

@media screen and  (min-width: 900px) {
  html {
    font-size: 14px;
  }
}

.mainmenu_navigation {
  display: block;
  width: 100%;
  position: relative;
  list-style-type: none;
  text-align: left;
  padding: 0 !important;
  margin: 0 !important;
  
}

.mainmenu_navigation a:hover {
  text-decoration: none !important;
}
.mainmenu_navigation li {
  width: 15%;
  overflow: hidden;
}
.mainmenu_navigation li.dropdown > a {
  padding-right: 4rem;
}

.mainmenu_navigation li a i {
  margin-right: 0.25rem;
}
.mainmenu_navigation li a .drop_caret {
  position: absolute;
  line-height: 2.75rem;
  right: 0;
  top: 0;
  bottom: 0;
  width: 3rem;
}
.mainmenu_navigation li a .drop_caret:after {
  content: '\f0d7';
  font-family: FontAwesome;
  text-align: center;
  color: inherit;
  position: absolute;
  line-height: 2.75rem;
  right: 0em;
  top: 0;
  bottom: 0;
  width: 3rem;
  background: rgba(0, 0, 0, 0.15);
}
.mainmenu_navigation li.has_search {
  padding: 0 0.5rem;
  position: relative;
}
.mainmenu_navigation li.has_search:hover {
  background: none !important;
}
.mainmenu_navigation li.has_search .search {
  position: relative;
}
.mainmenu_navigation li.has_search .search .search_box {
  width: 100%;
  height: 2rem;
  margin: 0.5667rem 0;
  border: none;
  box-sizing: border-box;
  padding: 0 3em 0em 1em;
  font: 400 0.875rem/2rem "Helvetica Neue", Helvetica, Arial, sans-serif;
  border-radius: 1.125rem;
  outline: none !important;
}


.mainmenu_navigation > li:last-child > a {
  border: none;
}
.mainmenu_navigation ul {
  max-height: 0;
  overflow: hidden;
  padding: 0 !important;
  margin: 0 !important;
}
.mainmenu_navigation ul.expanded {
  transition: max-height 500ms ease-out;
  max-height: 999px !important;
}
.mainmenu_navigation ul li a {
  background: #ddd;
  color: #333 !important;
}
.mainmenu_navigation ul li ul li a {
  background: #fff;
}
.charm_nav.mainmenu_navigation {
  display: flex;
  justify-content: space-around;
}
.charm_nav.mainmenu_navigation .menu_expander {
  display: none;
}
.charm_nav.mainmenu_navigation li:last-child a {
  border: none;
}
.charm_nav.mainmenu_navigation li a {
  white-space: nowrap;
  display: block;
  padding: 0;
  border: none;
  background: none;
  position: relative;
  /*border-right: 0.1rem solid rgba(0, 0, 0, 0.1);*/
  line-height: 3.5rem;
  text-align: center;
  color: transparent;

}
.charm_nav.mainmenu_navigation li a i {
  position: absolute;
  left: calc(50% - 0.5rem);
  top: 0;
  line-height: 3.5rem;
  font-size: 1.75rem;
  color: #8D9898;
  transition: top 133ms linear;
}
.charm_nav.mainmenu_navigation li a:hover {
  transition: color 80ms linear 200ms;
  background: none;

}
.charm_nav.mainmenu_navigation li a:hover i {
  top: -0.35rem;
  transition: top 133ms linear;
  color:#888;
}




.charm_nav.mainmenu_navigation a:hover .fa {
    color:#e03030;
    z-index: -1;
}


#mainmenu_nav_text {
    font-weight: bold;
    padding-top:-50px;
    font-size: 0.95em;
}




.mainmenu_navigation .overflow.dropdown {
  width: 2rem;
}
.mainmenu_navigation .menu_expander {
  padding: 0.5rem 0.5rem;
}
.mainmenu_navigation .menu_expander .expand_button {
  display: inline-block;
  clear: both;
  right: 0;
  position: relative;
  border-radius: 1.25rem;
}
.mainmenu_navigation .menu_expander .expand_button:before {
  content: '\f0c9';
  display: block;
  font: 1em/1em "FontAwesome";
  padding: 0.5rem 0.5rem;
  height: 1rem;
  width: 1rem;
  text-align: center;
}
.mainmenu_navigation .menu_expander .expand_button:after {
  position: absolute;
  right: 3rem;
  width: 50vw;
  top: 0;
  bottom: 0;
  line-height: 2rem;
}
.mainmenu_navigation .logo_holder {
  overflow: hidden;
}
.mainmenu_navigation .logo_holder:before {
  content: '';
  margin-top: 0em;
  display: block;
  transition: margin 200ms ease-in-out;
}
.expanded.mainmenu_navigation {
  max-height: 900px;
  display: block;
  overflow: visible;
}
.expanded.mainmenu_navigation .logo_holder:before {
  margin-top: -5rem !important;
  transition: margin 200ms ease-in-out;
}
.expanded.mainmenu_navigation li {
  max-height: 999px !important;
}


@media screen and (min-width: 900px) {
  .mainmenu_navigation {
    text-align: left;
    white-space: nowrap;
    font-size: 0;
  }
  .mainmenu_navigation .menu_expander {
    display: none;
  }
  .mainmenu_navigation li {
    display: inline-block;
    max-height: 9999px;
    overflow: visible;
    position: relative;
    font-size: 1rem;
  }
  .mainmenu_navigation li:hover {
    background: none;
    
  }
  .mainmenu_navigation li.selected:hover {
    background: none;
    
  }
  .mainmenu_navigation li a {
    background: none;
    border: none;
    padding-left: 1rem;
    padding-right: 1rem;
    font: 400 0.9375rem/3.125rem "Helvetica Neue", Helvetica, Arial, sans-serif;
  }
  .mainmenu_navigation li.dropdown.left_side li:hover > ul {
    top: 0;
    left: -100%;
  }
  .mainmenu_navigation li.dropdown > a {
    padding-right: 2rem;
  }
  .mainmenu_navigation li.dropdown > a .drop_caret:after, .mainmenu_navigation li.dropdown > a .drop_dots:after {
    content: '\f0d7';
    font-family: FontAwesome;
    color: inherit;
    position: absolute;
    background: none !important;
    line-height: 3.125rem;
    right: 0.5rem;
    width: 1rem;
    top: 0;
    bottom: 0;
  }
  .mainmenu_navigation li.dropdown > a .drop_dots:after {
    content: '\f142';
  }
  .mainmenu_navigation li.dropdown:hover > ul {
    max-height: 999px;
    overflow: visible;
    z-index: 9001;
  }
  .mainmenu_navigation li.dropdown ul {
    display: block;
    position: absolute;
    max-height: 0px;
    top: 100%;
    min-width: 100%;
    left: 0;
    box-shadow: 0 0.0125rem 0.0125rem rgba(0, 0, 0, 0.3), 0 0.125rem 0.25rem rgba(0, 0, 0, 0.25), 0 0.25em 2em rgba(0, 0, 0, 0.25);
  }
  .mainmenu_navigation li.dropdown ul li {
    display: block;
  }
  .mainmenu_navigation li.dropdown ul li:hover > ul {
    top: 0;
    left: 100%;
  }
  .mainmenu_navigation li.dropdown ul li:last-child > a {
    border: none;
  }
  .mainmenu_navigation li.dropdown ul li a {
    background: rgba(255, 255, 255, 0.93);
    display: block;
    text-align: left;
    white-space: nowrap;
    border-bottom: 0.125rem solid rgba(0, 0, 0, 0.1);
    line-height: 2.25rem;
  }
  .mainmenu_navigation li.dropdown ul li a .drop_caret:after {
    line-height: 2.5rem;
    content: '\f0da';
  }
  .mainmenu_navigation li.has_search {
    float: right;
    overflow: hidden;
    padding: 0 0.5rem;
  }
  .mainmenu_navigation li.has_search .search .search_button {
    pointer-events: none;
    right: 0;
  }
  .mainmenu_navigation > li > a {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    /*font-family: "Oswald", "Roboto", Arial, Helvetica, sans-serif;*/
    letter-spacing: 0.025rem;
    font-size: 0.875rem;
    position: relative;
    	/*&:after, &:before {
    	content: '';
    	position: absolute;
    	top: 0;
    	bottom: 0;
    	border: 0.025rem solid rgba(0,0,0,0.1);
    }
    	&:after {
    	right: -0.05rem;
    }
    	&:before {
    	left: -0.05rem;
    }*/
  }
  .mainmenu_navigation > li:first-child > a:before {
    display: none;
  }
  .mainmenu_navigation > li:last-child > a:after {
    display: none;
  }
  .charm_nav.mainmenu_navigation {
    display: block;
  }
  .charm_nav.mainmenu_navigation li {
    display: inline-block;
  }
  .charm_nav.mainmenu_navigation li a {
    border: none;
    padding: 0 2rem;
  }
  .charm_nav.mainmenu_navigation li a i {
    position: relative;
    display: inline-block;
    left: initial;
    font-size: 1.25rem;
    padding-right: 0.25rem;
  }
  .charm_nav.mainmenu_navigation li a:hover i {
    top: 0px;
  }

  

}


.charm_nav.mainmenu_navigation {
  background: #333;
}
.charm_nav.mainmenu_navigation li a:hover {
  background: #222;
  color: #eee;
}
.charm_nav.mainmenu_navigation li.has_search .search .search_box {
  background: none;
  color: none;
}
.charm_nav.mainmenu_navigation li.has_search .search .search_box:focus, .charm_nav.mainmenu_navigation li.has_search .search .search_box:hover {
  box-shadow: -0.125rem 0 0 #222, 0.125rem 0 0 #222, 0 -0.125rem 0 #222, 0 0.125rem 0 #222;
}
.charm_nav.mainmenu_navigation li.has_search .search .search_box::-webkit-input-placeholder {
  color: none;
}
.charm_nav.mainmenu_navigation li.has_search .search .search_box:-moz-placeholder {
  /* Firefox 18- */
  color: none;
}
.charm_nav.mainmenu_navigation li.has_search .search .search_box::-moz-placeholder {
  /* Firefox 19+ */
  color: none;
}
.charm_nav.mainmenu_navigation li.has_search .search .search_box:-ms-input-placeholder {
  color: none;
}
.charm_nav.mainmenu_navigation li.has_search .search .search_button {
  color: none;
}
.charm_nav.mainmenu_navigation ul li a:hover {
  color: #eee !important;
  background: #222 !important;
}
.charm_nav.mainmenu_navigation .overflow.dropdown {
  color: #eee;
}
.charm_nav.mainmenu_navigation .menu_expander .expand_button {
  background: none;
}
.charm_nav.mainmenu_navigation .menu_expander .expand_button:before {
  color: none;
}
.charm_nav.mainmenu_navigation .menu_expander .expand_button:after {
  content: "";
  color: #ddd;
  /*font-family: "Oswald", "Roboto", Arial, Helvetica, sans-serif !important;*/
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}

.charm_nav.mainmenu_navigation li:first-child {
    width: 270px;
}

@media screen and (min-width: 900px) {
  .charm_nav.mainmenu_navigation {
    display: flex;
    position: relative;
  }


  .charm_nav.navigation:after, .charm_nav.navigation:before {
    display: block;
    content: '';
    position: absolute;
    background: #333;
    top: 0;
    bottom: 0;
  }
  .charm_nav.navigation:after {
    width: 3rem;
    right: -3rem;
  }
  .charm_nav.navigation:before {
    width: 3rem;
    left: -3rem;
  }
  .charm_nav.mainmenu_navigation li:hover > a {
    background: #222 !important;
    color: #eee !important;

  }
  .charm_nav.mainmenu_navigation li.selected > a {
    background: #fff !important;
    box-shadow: 0 -0.125rem 0 transparent;
    color: #333;
  }
  .charm_nav.mainmenu_navigation li.selected:hover > a {
    background: #222 !important;
    color: #eee !important;
  }
  .charm_nav.mainmenu_navigation li a {
    color: #ddd;
  }
  .charm_nav.mainmenu_navigation li.dropdown ul li a {
    color: #ddd;
  }
  .charm_nav.mainmenu_navigation li.dropdown ul li a:hover {
    background: #222;
    color: #eee;
  }
  .charm_nav.mainmenu_navigation > li > a {
    color: #fff;
  }
  .charm_nav.navigation.charm_nav li a span {
    color: #fff;
  }

  .charm_nav.mainmenu_navigation a:hover .fa {
    color:#e03030;
    z-index: 1;
}

}


.charm_nav.mainmenu_navigation .fa {
    top: 0.3rem;
    font-size: 1.65rem;
    padding-right: 0.5rem;
    z-index: 10;
    color: #e03030;
}


