/* ---- 
Menu style sheet.
Colors, fonts, etc are specific to style id 2286 
and should be changes to match other designs.
---- */

/* ---- basic properties ---- */

.sm{position:relative;z-index:15;}
.sm,.sm ul,.sm li{display:block;list-style:none;margin:0;padding:0;line-height:normal;direction:ltr;text-align:left;-webkit-tap-highlight-color:rgba(0,0,0,0);}
.sm-rtl,.sm-rtl ul,.sm-rtl li{direction:rtl;text-align:right;}
.sm>li>h1,.sm>li>h2,.sm>li>h3,.sm>li>h4,.sm>li>h5,.sm>li>h6{margin:0;padding:0;}
.sm ul{display:none;}
.sm li,.sm a{position:relative;}
.sm a{display:block;}
.sm a.disabled{cursor:not-allowed;}
.sm:after{content:"\00a0";display:block;height:0;font:0px/0 serif;clear:both;visibility:hidden;overflow:hidden;}
.sm,.sm *,.sm *:before,.sm *:after{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;}
.sm .currentli a { color:#fff; }

/* ---- desktop (break point set to 1199px, if changed change the mobile break point below) ---- */

.click-to-close { display:none; }

@media (min-width: 1199px) {  
    .main-menu-container { position:relative; z-index:9; }
    .sm-clean ul { position: absolute; width: 12em; }
    .sm-clean li { float: left; }
    .sm-clean.sm-rtl li { float: right; }
    .sm-clean ul li, .sm-clean.sm-rtl ul li, .sm-clean.sm-vertical li { float: none; }
    .sm-clean a { white-space: nowrap; font-size:16px; font-weight:600; }
    .sm-clean ul a { font-size:14px; font-weight:400; }
    .sm-clean ul a, .sm-clean.sm-vertical a { white-space: normal; }
    .sm-clean .sm-nowrap > li > a, .sm-clean .sm-nowrap > li > :not(ul) a { white-space: nowrap; }
    .sm-clean { position:relative; left:initial; top:initial; width:100%; background:none; overflow:initial; }
    .sm-clean a, .sm-clean a:hover, .sm-clean a:focus, .sm-clean a:active, .sm-clean a.highlighted { padding: 12px 12px; color: #bbb; }
    .sm-clean a:hover, .sm-clean a:focus, .sm-clean a:active, .sm-clean a.highlighted { color: #fff; }
    .sm-clean a.current { color: #fff; }
    .sm-clean a.disabled { color: #bbbbbb; }
    .sm-clean a.has-submenu { padding-right: 24px; }
    .sm-clean a span.sub-arrow { top: 50%; margin-top: -2px; position:absolute; right: 8px; width: 0; height: 0; border-width: 4px; border-style: solid dashed dashed dashed; border-color: #bbb transparent transparent transparent; background: transparent; font-size:0; }
    .sm-clean a.highlighted span.sub-arrow:before { display: none; }
    .sm-clean li { border-top: 0; }
    .sm-clean > li > ul:before,
    .sm-clean > li > ul:after { content: ''; position: absolute; top: -18px; left: 30px; width: 0; height: 0; overflow: hidden; border-width: 9px; border-style: dashed dashed solid dashed; border-color: transparent; }
    .sm-clean > li > ul:after { top: -16px; left: 31px; border-width: 8px; border-color: transparent transparent #1a1a1a transparent; }
    .sm-clean ul { padding: 0; background: rgba(0,0,0,0.9); }
    .sm-clean ul a { border: 0 !important; padding: 10px 20px; color: #bbb; }
    .sm-clean ul a:hover, .sm-clean ul a:focus, .sm-clean ul a:active, .sm-clean ul a.highlighted { border: 0 !important; padding: 10px 20px; color: #fff; }
    .sm-clean ul a.disabled { color: #cccccc; }
    .sm-clean ul a.has-submenu { padding-right: 40px; }
    .sm-clean ul a span.sub-arrow { right: 8px; top: 50%; border-width: 5px; border-style: dashed dashed dashed solid; border-color: transparent transparent transparent #bbb; }
    .sm-clean span.scroll-up,
    .sm-clean span.scroll-down { position: absolute; display: none; visibility: hidden; overflow: hidden; background: #000; height: 20px!important; }
    .sm-clean span.scroll-up:hover,
    .sm-clean span.scroll-down:hover { background: #111; }
    .sm-clean span.scroll-up:hover span.scroll-up-arrow, .sm-clean span.scroll-up:hover span.scroll-down-arrow { border-color: transparent transparent #ddd transparent; }
    .sm-clean span.scroll-down:hover span.scroll-down-arrow { border-color: #ddd transparent transparent transparent; }
    .sm-clean span.scroll-up-arrow, .sm-clean span.scroll-down-arrow { position: absolute; top: 0; left: 50%; margin-left: -6px; width: 0; height: 0; overflow: hidden; border-width: 6px; border-style: dashed dashed solid dashed; border-color: transparent transparent #bbb transparent; }
    .sm-clean span.scroll-down-arrow { top: 8px; border-style: solid dashed dashed dashed; border-color: #eee transparent transparent transparent; }
    .sm-clean.sm-rtl a.has-submenu { padding-right: 12px; padding-left: 24px; }
    .sm-clean.sm-rtl a span.sub-arrow { right: auto; left: 12px; }
    .sm-clean.sm-rtl.sm-vertical a.has-submenu { padding: 10px 20px; }
    .sm-clean.sm-rtl.sm-vertical a span.sub-arrow { right: auto; left: 8px; border-style: dashed solid dashed dashed; border-color: transparent #bbb transparent transparent; }
    .sm-clean.sm-rtl > li > ul:before { left: auto; right: 30px; }
    .sm-clean.sm-rtl > li > ul:after { left: auto; right: 31px; }
    .sm-clean.sm-rtl ul a.has-submenu { padding: 10px 20px !important; }
    .sm-clean.sm-rtl ul a span.sub-arrow { right: auto; left: 8px; border-style: dashed solid dashed dashed; border-color: transparent #bbb transparent transparent; }
}

/* ---- mobile (break point set to 1199px, if changed change the desktop break point above) ---- */

@media (max-width: 1199px) {
    
    .click-to-close { position:fixed; z-index:12; top:0; left:0; height:100vh; width:100vw; background:rgba(0,0,0,0.8); }
    .whole { display:block; width:100%; height:100%; margin:0; padding:0; position:relative; z-index:1; }
    .whole.mobile-menu, .mobile-menu nav, .mobile-menu .scroll-back-to-top { margin-left:250px; }
    nav ul li a { display:inline-block; color:inherit; font-size:16px; font-weight:600; }
    .sm-clean { display:none; height:auto; max-height:85%; position:fixed; max-width:300px; left:50%; top:10%; z-index:10; background:#f00; overflow:auto; transition: transform 0.25s ease; padding:30px 0; transform:translate(-50%,0); -webkit-transform:translate(-50%,0); -moz-transform:translate(-50%,0); -ms-transform:translate(-50%,0); -o-transform:translate(-50%,0); }
    .mobile-menu .sm-clean { left:0!important; }
    .sm-clean a { color:#ddd; padding:12px 45px 12px 20px; font-size:14px; }
    .sm-clean a span.sub-arrow { position:absolute; top:50%; margin-top:-17px; left:auto; right:10px; width:32px; height:32px; overflow:hidden; font-size:16px; line-height:26px; text-align: center; text-shadow: none; border:2px solid rgba(255,255,255,0.15); border-radius:100%; color:rgba(255,255,255,0.9); }
    .sm-clean a.highlighted span.sub-arrow:before { display: block; content: '-'; }
    .sm-clean ul { background: rgba(255,255,255, 0.1); } 
    header #main-menu { display:none; width:90vw; margin:0; padding:0; overflow-x:hidden; }
    header #main-menu.mobile-menu { transform:translate(-50%,0) scale(1); -webkit-transform:translate(-50%,0) scale(1); -moz-transform:translate(-50%,0) scale(1); -ms-transform:translate(-50%,0) scale(1); -o-transform:translate(-50%,0) scale(1); }
    header #main-menu li { display:block; padding:0; margin:0; float:none; }
    header #main-menu a { margin:0!important; padding:15px 20px!important; }
    header #main-menu a:hover { background:transparent!important; }
    header #main-menu li li:first-child::before {content:'\f0d8';position:absolute;color: #148e76;font-family:'FontAwesome';padding:0;margin:-8px 0 0 0;font-size:28px;line-height:10px;display:block;text-align:center;height:10px;width:100%;}
    header #main-menu li li li:first-child::before { color: #0e6a58; }
    header #main-menu li li li li:first-child::before { color: #0b5547; }
    header #main-menu li li li li li:first-child::before { color: #094539; }
    header #main-menu li li li li li li:first-child::before { color: #062e26; }
    header #main-menu ul { background:#148e76; box-shadow:none; font-size:20px; }
    header #main-menu ul ul { background:#0e6a58; }
    header #main-menu ul ul ul { background:#0b5547; }
    header #main-menu ul ul ul ul { background:#094539; }
    header #main-menu ul ul ul ul ul { background:#062e26; }
    header #main-menu ul a { }
    header #main-menu li li a { font-size:18px; font-weight:300; padding:10px 25px; margin:0; }
    header #main-menu .sub-arrow { border:inherit; margin-top:-14px; font-size:24px; font-weight:900; opacity:0.8; }
    header #main-menu .sub-arrow::after { display:none; }
    header #main-menu li .sub-arrow { margin-right:5px; }
    .click-to-close::before { content: '\f00d'; font-family: 'FontAwesome'; font-size: 20px; color: #fff; padding: 20px 0; display: block; text-transform: uppercase; font-weight: 900; letter-spacing: 1px; opacity: 0.9; width: 100%; text-align: center; }
    .mobile-menu { display:none!important; }
}

@media (max-width:1199px){.active-menu header #main-menu{visibility:visible!important;opacity:1!important;display:block!important}}