﻿
#SiteHeader nav.navbar {
    position:       relative;
    min-height:     50px;
    margin-bottom:  0;
    border:         none;
    height:         0px;
    background:     none;
}


#siteheader-navigation-container .navbar-top        { float:right; width:100%; margin-bottom:15px; }
#siteheader-navigation-container .navbar-top-right  { float:right; font-size:118%; }
#siteheader-navigation-container .navbar-top-right a { color:#96aad1; }


@media(min-width: 992px) {
    #SiteHeader { position: absolute; height: 100%; width: 100%; right: 0px; top: 0px; bottom: 0px; }
    #SiteHeader nav.navbar { border: none; background: none; display: table; height: 100%; float: left; width: 100%; margin: 0px; table-layout: fixed; min-height:680px; }
    #siteheader-navigation-container {  display: table-cell; vertical-align: middle; float: none; width: 100%; }
    #siteheader-navigation-container .navbar-header { float: left; width: 100%; padding-bottom: 35%; text-align: center; }
    #siteheader-navigation-container .navbar-header { float: left; width: 100%; text-align: center; position:absolute; top:45px;  }

    #siteheader-navigation-container .navbar-brand {  padding: 0px; height: auto; width: 100%; display: inline-block; float: none; }
    #navbar-collapse-main { float: right; padding: 0px; font-size: 100%; margin-bottom: 10px; text-align: center; width: 100%; }
    #navbar-collapse-main .navbar-nav { padding: 0px; margin: 0px; padding-bottom: 10px; padding-top: 15px; display: inline-block; width: auto; float: none !important; }
/*    .nav.navbar-nav:before, ul.nav.navbar-nav:after { content: " "; position: static; background: url('../../../000Frames/site/images/main-menu-ornam-separator.png'); background-repeat: no-repeat; background-position: center; height: 8px; width: 100%; max-width: 180px; /* right: 50%; transform: translateX(50%); -webkit-transform: translateX(50%); background-size: contain; } */
    .nav.navbar-nav:before, ul.nav.navbar-nav:after {content: " "; position: static; background: url('../../../000Frames/site/images/main-menu-ornam-separator.png'); background-repeat: no-repeat; background-position: center; height: 7px; width: 230px; max-width: 180px; background-size: cover; margin-top: 10px; margin-bottom: 10px; }


    .nav.navbar-nav:before { top: -10px; }
    .nav.navbar-nav:after  { bottom: -10px; }
    /*#navbar-share { float: left; width: 100%; padding-top: 35%; }*/
    #navbar-share { float: left; width: 100%; position:absolute; bottom:5px; }

    #navbar-share ul { padding: 0px; margin-top: 4%; float: left; width: 100%; margin-bottom: 0px; }
    #navbar-share ul li { display: inline-block; }
    #navbar-share ul li+li { margin-left: 4%; }
    #navbar-share ul li a { font-size: 150%; color: #333; }
    #navbar-collapse-main .navbar-nav > li { text-align: center; display: block; margin: 0 auto; clear: both; float: none !important; }
    #navbar-collapse-main .navbar-nav > li > a { border-bottom: 2px solid transparent; color: inherit; padding: 0px !important; padding-bottom: 8px !important; margin-bottom: 15.5%; display: inline-block; font-size: 120%; margin-left: 0px !important; }
    #navbar-collapse-main .navbar-nav > li:last-child a { margin-bottom: 0%; }

    #navbar-collapse-main .navbar-nav > li.mobileonly {display: none;}

    #navbar-share .accessability {font-size: 120%;padding-top: 3%;clear: both;}


    .navbar-collapse.collapse {
        display: block!important;
        height: auto!important;
        padding-bottom: 0;
        overflow: visible!important;
    }
}

@media(max-width: 991px) {
    #siteheader-navigation-container .navbar-toggle             { margin: 0px; border: none; background: none; height: 100%; padding-top: 0px; padding-bottom: 0px; display: table; padding: 9px 17.5px; position: static; width: 77px; }
    #siteheader-navigation-container .navbar-toggle:before      { content: ""; position: absolute; top: 0px; left: 0px; background: #fff; z-index: 0; max-width: 80px; width: 100%; height: 0%; -webkit-transition-property: height; transition-property: height; -webkit-transition-duration: .3s, .3s; transition-duration: .3s, .3s; -webkit-transition-delay: .3s, 0s; transition-delay: .3s, 0s; }
    #siteheader-navigation-container .navbar-toggle[aria-expanded=true]:before      { height: 100%; -webkit-transition-property: height; transition-property: height; -webkit-transition-duration: .35s; transition-duration: .35s; }
    #siteheader-navigation-container .navbar-toggle .icon-bar   { position: absolute; margin: 0px !important; width: 42px; height: 3px; background: #000; -webkit-transition-property: margin, -webkit-transform; transition-property: margin, transform; -webkit-transition-duration: .3s, .3s; transition-duration: .3s, .3s; -webkit-transition-delay: .3s, 0s; transition-delay: .3s, 0s; }
    #navbar-collapse-main,#navbar-collapse-main .navbar-nav     { position: relative; }

    #siteheader-navigation-container .navbar-toggle .icon-bar.up { margin-top: -10.5px !important; }

    #siteheader-navigation-container .navbar-toggle .icon-bar:not(.up):not(.down) { -webkit-transition: background 0s .3s; transition: background 0s .3s; }

    #siteheader-navigation-container .navbar-toggle .icon-bar.down {
        margin-top: 9.5px !important;
    }

    #siteheader-navigation-container .navbar-toggle[aria-expanded=true] .icon-bar.up {
        margin-top: 0px !important;
        -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        transform: rotate(45deg);
        -webkit-transition-property: -webkit-transform, margin;
        transition-property: transform, margin;
    }

    #siteheader-navigation-container .navbar-toggle[aria-expanded=true] .icon-bar:not(.up):not(.down) {
        background: 0 0 !important;
    }

    #siteheader-navigation-container .navbar-toggle[aria-expanded=true] .icon-bar.down {
        margin-top: 0px !important;
        -webkit-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        transform: rotate(-45deg);
        -webkit-transition-property: -webkit-transform, margin;
        transition-property: transform, margin;
    }

    #siteheader-navigation-container .navbar-toggle[aria-expanded=true] .icon-bar { background: #000; } 

    #siteheader-navigation-container .navbar-toggle  > div      { display: table-cell; vertical-align: middle; position: relative; }


}


@media(max-width:767px) {
    #siteheader-navigation-container .navbar-top        { margin-bottom:0px; }
    #siteheader-navigation-container .navbar-top-right  { float:none; text-align:center; margin-bottom:5px; }
}

#siteheader-navigation-container .navbar-top-left   { float:left;font-size:118%; }
#siteheader-navigation-container .navbar-top-left > a   { margin-right:20px; color:#96aad1; }
#siteheader-navigation-container .navbar-top-left .Hicon   { background-repeat:no-repeat; width:18px; height:18px; margin-left:5px;}
#siteheader-navigation-container .navbar-top-left .facebookicon      {color:initial;width:24px;height:27px;text-align:center; padding-top:1px; border-radius: 4px;background-image:url(../../../000Frames/site/images/facebook-bt.png);display:inline-block; background-repeat:no-repeat; vertical-align:middle;}

#siteheader-navigation-container .navbar-header { }

#siteheader-navigation-container .navbar-brand  { max-width: 140px; padding: 0px; height: auto; }
#siteheader-navigation-container #logo-icon     { max-height: 100%; }
#siteheader-navigation-container .navbar-header > .mobile-button { display:none; }

@media(max-width:991px) {
    #siteheader-navigation-container .navbar-brand { max-width: 100px; }
    #navbar-share { display: none; }
    #SiteHeader nav.navbar { height: auto; }
    #SiteHeader { margin: 0px -15px; }
    #siteheader-navigation-container #logo-icon             { margin-right: 15px; }

    #siteheader-navigation-container .navbar-header         { display: table; width: 100%;  }
    #siteheader-navigation-container .navbar-header > .mobile-button   { display:table-cell; vertical-align: middle; }
    #siteheader-navigation-container .navbar-brand          { display: table-cell; float: none; text-align: left; padding: 0px; direction: ltr; width: 100px; padding: 5px 0px; }
    #siteheader-navigation-container .navbar-header-login   { cursor:pointer; }
    #siteheader-navigation-container #cart-top-button           { position:relative; }
    #siteheader-navigation-container #cart-top-button::after    { position:absolute; top:-12px; left:-12px; border-radius:100%; content:attr(data-counter); background:#F68B1F; font-size:100%; color:#fff; width:23px; }

    #navbar-collapse-main               { width: 100%; background-color:#fff; border:0px; z-index:10; margin: 0px !important; position: relative; }
    #navbar-collapse-main .navbar-nav   { width:100%; padding-top:0px; max-height: 340px; overflow-y: auto; overflow-x: hidden; }
    #navbar-collapse-main .navbar-nav > li          { float:right; border: none; width: 100%; }
    #navbar-collapse-main .navbar-nav > li > a          { padding:12px 27px 12px 27px; border:0px; display: inline-block; }
    #navbar-collapse-main .navbar-nav > li > a:hover    { border:0px; }
    #navbar-collapse-main .navbar-nav > li > a.selected { border:0px; }
    #navbar-collapse-main .navbar-nav > li > .dropdown-menu {  border-radius:0px; background-color:transparent; margin-top: -10px }
    #navbar-collapse-main .navbar-nav > li > .dropdown-menu > li > a        { color:#999; padding: 7px 40px; line-height:normal; }
    #navbar-collapse-main .navbar-nav > li > .dropdown-menu > li > a:hover  { color:#F68B1F; }
}

@media(min-width:768px) and (max-width:991px) {
    #siteheader-navigation-container { float: left; width: 100%; }
    #navbar-collapse-main { padding: 0px; font-size: 125%; margin-bottom: 0px; float: none; vertical-align: middle; width: 100%; direction: ltr; }
    .navbar-collapse.collapse {
        display: none;
        height: auto!important;
        padding-bottom: 0;
        overflow: visible!important;
    }

     .navbar-collapse.collapse.in {
        display: block;
        visibility: visible;
    }

    .navbar-collapse.collapsing {
        position: relative;
        height: 0;
        overflow: hidden;
        -webkit-transition-timing-function: ease;
        -o-transition-timing-function: ease;
        transition-timing-function: ease;
        -webkit-transition-duration: .35s;
        -o-transition-duration: .35s;
        transition-duration: .35s;
        -webkit-transition-property: height,visibility;
        -o-transition-property: height,visibility;
        transition-property: height,visibility;
    }
}


@media(max-width:320px) {
    #siteheader-navigation-container .navbar-brand { height:50px; }
    #siteheader-navigation-container .navbar-header > .mobile-button { padding-top:8px; }
}

#navbar-collapse-main                           { float:right; padding:0px; font-size:125%; margin-bottom:10px; position: relative; }
#navbar-collapse-main .navbar-nav               { float:right; padding:0px; margin:0px;padding-bottom:10px;padding-top:15px; }
#navbar-collapse-main .navbar-nav > li          { float:right; }
#navbar-collapse-main .navbar-nav > li > a          { border-bottom: 2px solid transparent; color:inherit; padding:7px; margin-left:10px;}
#navbar-collapse-main .navbar-nav > li > a:hover    { border-bottom: 2px solid #0089cf; color: #0089cf; }
#navbar-collapse-main .navbar-nav > li > a.selected { border-bottom: 2px solid #0089cf; color: #0089cf; }
#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:#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-collapse-main .navbar-nav > li > .dropdown-menu > li > a        { color:#333; padding: 3px 15px; line-height:normal; }
#navbar-collapse-main .navbar-nav > li > .dropdown-menu > li > a:hover  { color:#999; } 
#navbar-collapse-main .navbar-nav > li > .dropdown-menu > li > a.selected  { color:#F68B1F; } 



#siteheader-navigation-container .navbar-search     { float:left; margin-top:12px; border:1px solid; border-radius:4px;font-size:118%; opacity:0.8; display:block; margin-top:70px; }
#siteheader-navigation-container .navbar-search input {height:31px;border:none; background:none; color:white; float:right; padding-right:10px; }
#siteheader-navigation-container .navbar-search input[type="submit"]  { background-color:#F68B1F; width:35px;  border-radius:4px; border-color:transparent; background-image:url('../images/search-icon.png'); background-position:center center; background-repeat:no-repeat; }


.text-bigger {
    position: absolute;
    top: 0px;
    left: 10px;
    background: #fff;
    padding: 3px 10px 8px 10px;
}

.langBtn {
    position: absolute;
    top: 0px;
    right: 10px;
    padding: 12px 10px 8px 10px;
    font-size:18px;
}


.text-changer {
    text-decoration: none !important;
}


@media(max-width: 991px) {
    .text-bigger {
        left: 50%;
        padding: 3px 10px 8px 10px;
        top: 20px;
        background: none;
        font-size: 120%;
    }
    .langBtn {
        right: 50%;
        padding: 6px 10px 8px 10px;
        top: 20px;
        background: none;
        font-size: 150%;
    }
}

@media(max-width:321px) {
    .text-bigger {top:5px !important;}
    .langBtn {top:7px !important;}
}