* If using a CSS pre-processor, tell it to overwrite this file. If not, place
 * your custom CSS modifications here.
 */

body, .mm-wrapper {
  margin-top: 0 !important;
}

body, html {
  scroll-behavior: smooth;
  margin: 0 !important;
}

#mm-0 {
  background: #ffffff;
}

/*******************
********************
NOTICE AREA
********************
*******************/

.notice-wrapper {
  background: #ffffff;
  padding: 20px 0;
  color: #fff;
}

#sticky-wrapper.is-sticky .notice-wrapper {
  transition: .3s ease;
  opacity: 1 !important;
  z-index: 10 !important;
}

.logo img {
  max-height: 95px;
  width: auto;
}


.links-wrapper {
  padding: 25px 0;
}

.path-frontpage .links-wrapper {
  margin-bottom: 0;
}

.logo.navbar-btn.pull-left {
  margin: 0;
  float: left !important;
  width: 80%;
}
@media (min-width: 960px) {
	.logo.navbar-btn.pull-left {
	  width: 20%;
	}	
}

#block-therapeutic-horizontalmenu {
  float: left;
  width: 20%;
  text-align: right;
}
@media (min-width: 960px) {
	#block-therapeutic-horizontalmenu {
	  width: 80%;
	}	
}

#horizontal-menu {
  padding-top: 20px;
}

#block-therapeutic-responsivemenumobileicon {
  float: left;
  width: 20%;
  text-align: right;
  margin-top: 25px;
}
@media (min-width: 992px) {
	#block-therapeutic-responsivemenumobileicon {
	  width: 60%;
	}	
}

#block--therapeutic-responsivemenumobileicon #toggle-icon {
  float: right;
  margin-top: 5px;
}

.responsive-menu-toggle-icon::before, .responsive-menu-toggle-icon::after, .responsive-menu-toggle-icon span.icon {
  background: #2C3E50;	
}

.responsive-menu-toggle-icon span.label {
  left: -55px;
  top: 4px;
  color: #2C3E50;
}

.horizontal-menu li a, .horizontal-menu li span {
  color: #2C3E50;
  padding: 10px 15px;
  font-size: 18px;
  transition: .3s ease;
  font-weight: 700;
  display: block;
  background: none;
}

.horizontal-menu li a:hover, .horizontal-menu li span:hover {
  color: #2C3E50;
}

.horizontal-menu li a:hover, .horizontal-menu li span:hover, .horizontal-menu li a:focus, .horizontal-menu li span:focus {
  color: #D4AF37;
  text-decoration: none !important;
}

.horizontal-menu li a.is-active, .horizontal-menu li span.is-active {
  color: #D4AF37;
}

.horizontal-menu li a.menu-bg, .horizontal-menu li span.menu-bg {
  color: #ffffff;
  background-image: linear-gradient(to right, #d4af37, #dab94a, #e0c35b, #e7cd6c, #edd77d, #edd77d, #edd77d, #edd77d, #e7cd6c, #e0c35b, #dab94a, #d4af37);
  transition: .3s ease;
}

.horizontal-menu li a.menu-bg:hover, .horizontal-menu li a.menu-bg.is-active, .horizontal-menu li span.menu-bg:hover, .horizontal-menu li span.menu-bg.is-active {
  color: #ffffff;
  background: #2C3E50;
}

a.menu-bg, span.menu-bg {
  color: #ffffff;
  background-image: linear-gradient(to right, #d4af37, #dab94a, #e0c35b, #e7cd6c, #edd77d, #edd77d, #edd77d, #edd77d, #e7cd6c, #e0c35b, #dab94a, #d4af37);
  transition: .3s ease;
  padding: 10px 15px;
}

a.menu-bg:hover, a.menu-bg.is-active, span.menu-bg:hover, span.menu-bg.is-active {
  color: #ffffff;
  background: #2C3E50;
  text-decoration: none;
}

.horizontal-menu .menu.sub-nav {
  text-align: left;
  background: #2C3E50;
}

.horizontal-menu .menu.sub-nav li{
  border-bottom: 1px solid #2C3E50;
}

.horizontal-menu .menu.sub-nav li a, .horizontal-menu .menu.sub-nav li span {
  font-size: 16px;
  color: #ffffff;
  padding: 5px 10px;
  transition: .3s ease;
}

.horizontal-menu .menu.sub-nav li a:hover, .horizontal-menu .menu.sub-nav li span:hover, .horizontal-menu .menu.sub-nav li a.is-active, .horizontal-menu .menu.sub-nav li span.is-active {
  color: #D4AF37;
}

.mm-panel, .mm-panels {
  background: #1C1C1C;	
}

.mm-navbar, .mm-menu a, .mm-menu a:active, .mm-menu a:hover, .mm-menu a:link, .mm-menu a:visited.mm-menu a, .mm-menu a:active, .mm-menu a:hover, .mm-menu a:link, .mm-menu a:visited {
  background: #1C1C1C;
  padding: 20px 25px;
  font-size: 18px;
  transition: .3s ease;
  color: #D4AF37;
  text-align: center;
}

.mm-menu a:hover, .mm-menu a:hover {
  opacity: 0.8;
  font-size: 20px;
}

/*******************
********************
END NOTICE AREA
********************
*******************/

/*******************
********************
SLIDER
********************
*******************/

.slider-wrapper {
  background: url('../images/slider-bg.png') no-repeat 50% / cover!important;
  padding: 65px 0;
  text-align: center;
  color: #fff;
}

/*******************
********************
END SLIDER
********************
*******************/