﻿

a:focus{border:1px solid}

#SiteHeader nav.navbar {position:relative;margin-bottom:0;border:none;background:none;height:100%;}

div#siteheader-navigation-container {height: 100%;}
#siteheader-navigation-container .navbar-header { float:none; position:relative;  width:100%;text-align:center;height:100%; }

.topLogo {padding:0px; height:140px;max-height:140px;position:absolute;top:10px;z-index:99;left:50%;transform:translateX(-50%);-webkit-transform: translateX(-50%);-moz-transform:translateX(-50%);-ms-transform:translateX(-50%);-o-transform:translateX(-50%);transition:height 500ms;-ms-transition:height 5ms;-webkit-transition: height 500ms;-moz-transition: height 500ms;-o-transition: height 500ms;}
#siteheader-navigation-container .navbar-brand  { padding:0px; height:100%;}
header.bg .topLogo {max-height: 120px;}
#siteheader-navigation-container #logo-icon     { width:140px;max-width: 140px; transition: all 500ms ease-in-out;-moz-transition:all 500ms ease-in;-ms-transition:all 1ms; -webkit-transition: all 500ms ease-in;-o-transition: all 500ms ease-in; }
header.bg #siteheader-navigation-container #logo-icon     {max-width: 120px; }

#SiteUnderHeader .header-bg-layer {position: absolute;top: 0;right: 0;bottom: 0;left: 0;background: linear-gradient(to left, rgba(0,0,0,0.4) 30%, transparent 40%);background: -webkit-linear-gradient(to left, rgba(0,0,0,0.4) 20%, transparent 40%);background:-moz-linear-gradient(to left, rgba(0,0,0,0.4) 30%, transparent 40%);background:-o-linear-gradient(to left, rgba(0,0,0,0.4) 30%, transparent 40%);background: -ms-linear-gradient(to left, rgba(0,0,0,0.4) 30%, transparent 40%);}


#buttons-container { float:left; position:relative;display:table;height:100%; }

#buttons-container .nav-buttons         { position:relative; margin:0px; padding:0px;display: table-cell;vertical-align: middle;float:none; }
#buttons-container .nav-buttons .dropdown           { height: 77px; width: 96px; text-align: center; background: #5D707E; position: static; }

#buttons-container .nav-buttons .dropdown > a       { padding: 0px; height: 100%; display: table; width: 100%; }
#buttons-container .nav-buttons .dropdown > a > div   { vertical-align: middle; display: table-cell; color: #fff; }
#buttons-container .nav-buttons .dropdown a div span  { display: block; margin-top: 5px; line-height: 1; }

#buttons-container .nav-buttons #navbar-cart > a                  { background-color: blue; }
#buttons-container .nav-buttons #navbar-cart.open > a   { background-color: lightsteelblue; }
#buttons-container .nav-buttons #navbar-user > a                  { background-color: red; }
#buttons-container .nav-buttons #navbar-user.open > a   { background-color: orange; }

#buttons-container .nav-buttons #navbar-cart i[data-counter]:after    { position: absolute; left: 60%; border-radius: 50%; content: attr(data-counter); background: #5C707B; font-size: 71%; padding: 4px 7px; color: #fff; max-width: 30px; word-break: break-all; }

#buttons-container .nav-buttons #navbar-user .sign-in     { display:block; }
#buttons-container .nav-buttons #navbar-user .logged-in   { display:none; }
#buttons-container .nav-buttons #navbar-user.logged-in .sign-in     { display:none; }
#buttons-container .nav-buttons #navbar-user.logged-in .logged-in   { display:block; }

#buttons-container .nav-buttons .dropdown-menu      { right:0px; left:0px;float:left;position:relative !important;top:0; position: static; background-color: #fff; -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);box-shadow: 0 6px 12px rgba(0,0,0,.175);}

#buttons-container .nav-buttons li {background-color: #1a1a1a;border-radius: 3px;margin-left:10px;}
#buttons-container .nav-buttons li:focus {background-color: #ffffff;color: #000000;}
#buttons-container .nav-buttons li:focus a {color: #000000;}
#buttons-container .nav-buttons li:hover {background: #000000;}
#buttons-container .nav-buttons li a {color:#fff;padding:10px;width:170px;}
#buttons-container .nav-buttons li .locationImg {display: inline-block;width: 15px;height: 20px;vertical-align: middle;}
#buttons-container .nav-buttons li .menuImg{display: inline-block;vertical-align: middle;width:28px;height:20px;}
#buttons-container .nav-buttons li .giftImg{display: inline-block;vertical-align: middle;width:20px;height:20px;}
#buttons-container .nav-buttons li span { display: inline-block;vertical-align: middle;margin-right: 5px;font-size:150%;font-family:reforma;}

#headerRight {float: right;display: table;height: 100%;}
.mobile-button {float: right;height: 100%;position: relative;transition:all 300ms ease-in-out;-webkit-transition: all 300ms ease-in-out;-moz-transition: all 300ms ease-in-out;-o-transition: all 300ms ease-in-out;padding-left:5px;display:table;}
.mobile-button.active {background:#000000;}
.mobile-button:focus {
    outline: -webkit-focus-ring-color auto 5px;
}
/*.mobile-button {position: absolute;top: 50%;transform: translateY(-50%);-webkit-transform: translateY(-50%);-moz-transform:translateY(-50%);-ms-transform:translateY(-50%);-o-transform:translateY(-50%);}*/
/*.mobile-button .menuText{display: inline-block;vertical-align: middle;font-size: 160%;line-height: 1;position: absolute;white-space: nowrap;top: 50%;transform: translateY(-50%);-webkit-transform: translateY(-50%);-moz-transform:translateY(-50%);-ms-transform:translateY(-50%);-o-transform:translateY(-50%);}*/
.menu-closed {width: 100%;height: 100%;}


@media (max-width: 991px) {
    #buttons-container .nav-buttons li .locationImg {display: none;}
    #buttons-container .nav-buttons li .menuImg{display:none;}
    #buttons-container .nav-buttons li a {width:120px;}
}
@media (max-width: 767px) {
    #buttons-container .nav-buttons li .locationImg {display: inline-block;}
    #buttons-container .nav-buttons li .menuImg{display:inline-block;}
    #buttons-container .nav-buttons li a {width:35px;height:35px;padding:5px;}
    #buttons-container .nav-buttons li span{display:none;}
    #buttons-container .nav-buttons li{border-radius:50%;margin-top:-15px;}
    .social-links li {width:45px;height:45px;}
    .social-links li:first-child{display:none;}
    .topLogo{height:75px;}
    #buttons-container .nav-buttons li .menuImg{width:22PX;height:13PX;}
    #buttons-container .nav-buttons li .locationImg{width:13px;height:13px;}
}

.navbar-default .navbar-toggle  {border:0;margin-right:15px;}
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus{background-color:transparent;}
.nav-menu-anim {width: 50px;height: auto;margin: 0;margin-left: 10px;display: inline-block;vertical-align: middle;cursor: pointer;margin-right: 15px;margin-top:40%;transition:all 400ms ease-in-out;-webkit-transition: all 400ms ease-in-out;-moz-transition: all 400ms ease-in-out;-o-transition: all 400ms ease-in-out;}
.bg .nav-menu-anim {margin-top:35%;}
#nav-toggle, #nav-toggle-mobile { position: absolute;top: 0;left: 0;right: 0;bottom: 0;z-index:1}
#nav-toggle span, #nav-toggle span:before, #nav-toggle span:after,
#nav-toggle-mobile span,#nav-toggle-mobile span:before, #nav-toggle-mobile span:after {cursor: pointer;border-radius: 1px;height: 5.5px;width: 50px;background: #F2691B;position: absolute;display: block;content: '';margin-left: 0% !important; margin-right: 0 !important;display: block !important;}
#nav-toggle span, #nav-toggle-mobile span {top: 50%;transform: translateY(-50%); -webkit-transform: translateY(-50%);-moz-transform:translateY(-50%);-ms-transform:translateY(-50%);-o-transform:translateY(-50%);}
#nav-toggle span:before, #nav-toggle-mobile span:before { top: -10px;}
#nav-toggle span:after, #nav-toggle-mobile span:after {bottom: -10px; }
#nav-toggle span, #nav-toggle span:before, #nav-toggle span:after,
#nav-toggle-mobile span, #nav-toggle-mobile span:before, #nav-toggle-mobile span:after {transition: all 400ms ease-in-out;-webkit-transition: all 400ms ease-in-out;-moz-transition: all 400ms ease-in-out;-o-transition: all 400ms ease-in-out;}
#nav-toggle.active span,#nav-toggle-mobile.active span {background-color: transparent;}
#nav-toggle.active span:before, #nav-toggle.active span:after,
#nav-toggle-mobile.active span:before, #nav-toggle-mobile.active span:after {  top: 0;}
#nav-toggle.active span:before,#nav-toggle-mobile.active span:before { transform: rotate(45deg); -webkit-transform:rotate(45deg);-moz-transform:rotate(45deg); -ms-transform:rotate(45deg);-o-transform:rotate(45deg);}
#nav-toggle.active span:after,#nav-toggle-mobile.active span:after { transform: rotate(-45deg); -webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform: rotate(-45deg);}

.menuText {display: table-cell;vertical-align: middle;font-size: 175%;line-height: 1;transition:opacity 400ms ease-in-out;-webkit-transition: opacity 400ms ease-in-out;-moz-transition: opacity 400ms ease-in-out;-o-transition: opacity 400ms ease-in-out;opacity:1;font-family:reforma;}
.menuText.active {opacity:0;}
.social{display: table-cell;vertical-align: middle;padding-right: 20px;}
.social-links {padding: 0;margin: 0;list-style: none;}
.social-links li {display: inline-block;/*background: #F2691B;border-radius: 50%;*/width: 35px;height: 35px;}
.social-links li:first-child {margin-left: 8px;}
.social-links li a {vertical-align: -webkit-baseline-middle;display: inline-block;width:100%;}
.social-links li i {color:#ffffff;vertical-align: -webkit-baseline-middle;}
.facebookMobile {display:none;}

@media (max-width: 767px) {
    .nav-menu-anim {margin-top:37%;width:35px;margin-left:5px;}
    .social{padding-right: 0px;}
    .search_form_header_input { width: calc(100% - 50px); }
    #siteheader-navigation-container .navbar-brand {float:right;}
    #siteheader-navigation-container .navbar-brand  {height: 100px;}
    #buttons-container .nav-buttons .dropdown       { max-height: 49px; width: 62px; text-align: center; background: #5D707E; position: static; }
    /*#navbar-collapse-main .navbar-nav > li.dropdown > a:after { content:" ";  width:24px; height:24px; background-image:url('https://cdn1.iconfinder.com/data/icons/general-9/500/left_arrow-24.png'); float: left; }*/
    #navbar-collapse-main .navbar-nav > li.dropdown > a {float:right;width:100%;}
    #navbar-collapse-main .navbar-nav > li.dropdown > button {float: left; position:absolute;left:0; background-image: url('../../../000Frames/site/images/menu_left_arrow.png'); width: 24px; height: 24px; background-color: transparent; border: none; margin-left: 15px;outline:none;display:none;}
    #navbar-collapse-main .navbar-nav > li.dropdown.open > button {-ms-transform: rotate(-90deg); /* IE 9 */ -webkit-transform: rotate(-90deg); /* Chrome, Safari, Opera */ transform: rotate(-90deg);} 
    .menuText{display:none;}
    .social-links {display:none;}
    .facebookMobile {background-color: #1a1a1a;width: 35px;height: 35px;border-radius: 50%;display: inline-block;vertical-align: text-top;margin-right:15px;}
    .facebookMobile svg {fill: #FC6719;width: 10px;height: 35px;vertical-align: middle;}
    
    #nav-toggle span, #nav-toggle span:before, #nav-toggle span:after, #nav-toggle-mobile span, #nav-toggle-mobile span:before, #nav-toggle-mobile span:after{width:35px;}
    #siteheader-navigation-container #logo-icon{width:85px;}
    .mobile-text {color: #000000;font-family: reforma;text-align: center;margin-right: 15px;}
    #buttons-container .mobile-text {margin-top: 10px;margin-right: 0;}
}
@media (max-width:320px) {
       .facebookMobile {margin-right:10px}
        .mobile-text {margin-right:10px;}
        #siteheader-navigation-container .navbar-brand{height:85px;}
        #siteheader-navigation-container #logo-icon{width:85px;}

}
@media (min-width:768px) {
        #navbar-collapse-main .navbar-nav > li.dropdown > button {display:none}

}

#navbar-top     {   padding:0px; padding-top:20px; display:none; /*display:inline-block;*/ }
#navbar-top .navbar-nav  { display:none;  /*display: inline-block;*/ margin: 0px; }
#navbar-top .navbar-nav > li  { float: right; color:blue;  }
#navbar-top .navbar-nav > li a  { color: blue; border:0px; padding:0px; }
#navbar-top .navbar-nav > li a:hover { color: red; text-decoration:none; }
#navbar-top .navbar-nav > li a:focus { color: red; text-decoration:none; }
#navbar-top .navbar-nav > li:not(:last-child) > a:after { content: " "; display: inline-block; width: 1px; background: #5D707c; position: relative; height: 8px; margin: 0px 7px; }
#navbar-top .navbar-nav > li.dropdown.open a     {  }
#navbar-top .navbar-nav > li > .dropdown-menu    {  text-align:right;
                                                    padding:5px;
                                                    font-size:100%;
                                                    background-color:#ffffff;
                                                    text-align:right;
                                                    border: 1px solid rgba(0,0,0,0.15); border-radius:0px;
                                                    box-shadow: 0 6px 12px rgba(0,0,0,.175); -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175); }
#navbar-top .navbar-nav > li > .dropdown-menu > li > a        { color:#333; padding: 0px; line-height:normal; }
#navbar-top .navbar-nav > li > .dropdown-menu > li > a:hover  { color:#333; }
@media(min-width:768px){
    #navbar-top {display:inline-block}
    #navbar-header {text-align:center}
}
@media(max-width:767px) {
    #navbar-top { display:none; }
    .navbar-default .navbar-collapse, .navbar-default .navbar-form {border-color:transparent;}
}

#navbar-collapse-main                           { float:right; padding:0px; font-size:125%;  width:100%; background-color:black; margin-bottom:5px; margin-top:0px; position: absolute; right: 0; z-index: 3; width: 250px;box-shadow:-2px 2px 10px 0px rgba(255, 255, 255, 0.2);max-height:0; -webkit-transition: all 0.5s ease-in-out;-moz-transition: all 0.5s ease-in-out;-o-transition: all 0.5s ease-in-out;transition: all 0.5s ease-in-out;top:100%;}
#navbar-collapse-main.collapse.in               {max-height:100vh;}
#navbar-collapse-main .navbar-nav               { float:right; padding:0px; margin:0px; padding-bottom:5px; padding-top:5px;opacity:0;visibility:hidden;-webkit-transition: all 0.5s ease-in-out;-moz-transition: all 0.5s ease-in-out;-o-transition: all 0.5s ease-in-out;transition: all 0.5s ease-in-out;}
#navbar-collapse-main.collapse.in .navbar-nav   {opacity:1;visibility:visible;}
#navbar-collapse-main .navbar-nav > li          { border-bottom: 1px solid #0f0f0f;font-size: 150%; clear:both;float:none;}
#navbar-collapse-main .navbar-nav > li.dropdown:after {content: "\f107";font-family:'FontAwesome';position: absolute;left: 20px;color: #ffffff;top: 7px;/*transform: translateY(-50%);*/}
#navbar-collapse-main .navbar-nav > li.dropdown.Mobileopen:after,#navbar-collapse-main .navbar-nav > li.dropdown.open:after {content: "\f106";}

#navbar-collapse-main .navbar-nav > li > a              { color:#ffffff; padding:20px 18px; margin-left:20px;border-bottom:1px solid rgba(255, 255, 255, 0.1);font-family:reforma,'Yanone Kaffeesatz', sans-serif;width: 100%;text-align: right;}
#navbar-collapse-main .navbar-nav > li:last-child > a   { border-bottom:0;}

#navbar-collapse-main .navbar-nav > li > a:hover    { color:#ff671b;border:0; }

#navbar-collapse-main .navbar-nav > li.dropdown.open a      { background-color:transparent; }
#navbar-collapse-main .navbar-nav > li > .dropdown-menu     {   right:0px; left:auto;
                                                                padding:5px;
                                                                font-size:100%;
                                                                background-color:transparent;
                                                                text-align:right;
                                                                border: 1px solid rgba(0,0,0,0.15); border-radius:0px;
                                                                box-shadow: 0 6px 12px rgba(0,0,0,.175); -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175); position:relative;float:right;}
#navbar-collapse-main .navbar-nav > li > .dropdown-menu > li > a        { color:#ffffff; padding: 9px 15px; line-height:normal;font-size:87%; font-family:reforma;}
#navbar-collapse-main .navbar-nav > li > .dropdown-menu > li > a:hover  { color:#ff671b; } 

@media(min-width:767px){
    /*#navbar-collapse-main  {display:none !important;}*/    
    #navbar-collapse-main .navbar-nav > li{float:none;}
}
@media(max-width:767px) {  
    #navbar-collapse-main           { width: 100%; }
    #navbar-collapse-main .navbar-nav               { width:100%; }
    #navbar-collapse-main .navbar-nav > li          { float:right;clear:both;width:100%; }
    #navbar-collapse-main .navbar-nav > li > a      { padding:15px; }
    #navbar-collapse-main .navbar-nav > li > .dropdown-menu {  border-radius:0px; background-color:transparent;padding:0px; }
    #navbar-collapse-main .navbar-nav > li > .dropdown-menu > li > a        { color:#ffffff; padding: 3px 15px; line-height:normal; }
    #navbar-collapse-main .navbar-nav > li > .dropdown-menu > li > a:hover  { color:#333; }
}

@media(max-width:991px) {
    /*#siteheader-navigation-container .navbar-brand  { position:static; transform:none; width:calc(100% - 205px); float:none; display:inline-block; vertical-align:middle; height:100%; }*/
    /*#buttons-container { float:none; display:inline-block; vertical-align:middle; }*/
    .mobile-button      {  vertical-align:middle; }
    /*.mobile-button .navbar-toggle   { margin-right:5px; float:none; }*/
}


#siteheader-navigation-container .navbar-search     { float:left; margin-top:12px; border:1px solid; border-radius:4px;font-size:118%; opacity:0.8;  }
#siteheader-navigation-container .navbar-search input {height:31px;border:none; background:none; color:white; }
#siteheader-navigation-container .navbar-search .searchicon    {background-color:#F68B1F;height: 34px; padding-top: 7px;width: 36px;text-align: center; border-radius:4px;}


