/*
    Follwoing are the objectives of this style sheet
    1. Overwrite bootstrape
    2. Have Copies of used hover.css
    3. Site required css
    4. Media query accoding to bootstrap
*/

/* 
    Created on : Mar 30, 2015, 4:52:59 PM
    Author     : Khalid Anwar
*/

/* OVERWRITE BOOTSTAP                       BEGIN
-----------------------------------------------*/

.navbar-default {
    background-color: #ffb94c;
    border-color: #f0ad4e;
}

/*.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover {
    background-color: #ff9c00;
    color: #f8f8f8;
    font-weight: bold;
}*/
.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus{
    background-color: #ff9c00;
    color: #f8f8f8;
/*    font-weight: bold;*/
}

.input-group-addon, .input-group-btn {
    width: auto;
}

.bg-default {
    background-color: #fcf8d3;
    border-color: #fcf8c3;
}

.btn-default.active, .btn-default.focus, .btn-default:active, .btn-default:focus, .btn-default:hover, .open > .dropdown-toggle.btn-default {
    background-color: #EC971F;
    border-color: orange;
    color: #fff;
}
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover {
  background-color: #ff9c00;
  color: #555;
}

.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:focus, .navbar-default .navbar-nav > .open > a:hover {
    background-color: #EC971F;
    border-color: orange;
    color: #fff;
}

.btn-own {
    background-color: #EC971F;
    border-color: orange;
    color: #fff;
}
btn-own.btn.focus, .btn-own.btn:focus, .btn-own.btn:hover {
    background-color: orange;
    color: #fff;
    text-decoration: none;
}

.glyphicon {
  top: 0;
}

.h1override{ 
    font-size: 18px;
}

blockquote {
  font-size: 14px;
}
.blockquote-default {border-left: 5px solid #eee;}
.blockquote-primary {border-left: 5px solid #23527c;}
.blockquote-orange {border-left: 5px solid orange;}

/*dropdown menu link hight separation for touch*/
.navbar-xs ul > li > a {  padding-top: 0px; padding-bottom: 0px; line-height: 25px; }

/*nav bar height reduction*/
.navbar-xs { min-height:40px; height: 41px; }
.navbar-xs .navbar-brand{ padding: 0px 12px;font-size: 16px;line-height: 40px; }
.navbar-xs ul.navbar-nav > li > a {  padding-top: 0px; padding-bottom: 0px; line-height: 40px; }


.bg-footer {background-color: #353535; color: #f8f8f8}

#nav-bar .dropdown-menu.container-fluid {min-width: 500px; max-width: 700px}
#cursor-pointer,.form-control,.cursor-pointer{cursor: pointer;}
.modal-backdrop.fade.in {z-index: 999}
hr {margin-top: 9px}
.modal{
    display:none;
    position:fixed;
    z-index:1000;
    top:0;
    left:0;
    height:100%;
    width:100%;
/*    background: rgba(28, 28, 28, .9) url('/images/ajax-loader.gif') 50% 50% no-repeat;*/
    background: rgba(28, 28, 28, .1)url('/images/ajax-loader.gif')50% 50% no-repeat;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 90);
    filter: alpha(opacity = 80);
            }
            
#bs-navbar-collapse h4{
    font-size: 15px;
    font-weight: bold;
}

/*reduce nav bar height*/
.navbar {
    min-height: auto;
}
.navbar-brand {
    padding: 10px;
    height: auto;
}
.navbar-nav > li > a {
  padding-bottom: 10px;
  padding-top: 10px;
}
#head-middle-bar{
    margin-bottom: 1em;
}
#detail-prod-name  h1 {
    font-size: 14px;
    line-height: 20px;
    margin: 1px;
}
#listing-prod-count{
    font-size:19px;
    margin: 7px;
    
}
input[type="text"],input[type="email"],input[type="url"],input[type="password"]{
    cursor:text;
}
/*reduce nav bar height END*/
/*Vendor CSS of Menus*/
            #mainmenu{width:29%;}
            .Firmenu {list-style: none;display:none;}
            .Firmenu li {text-align: left;margin-left: -41px;width:181px;}
            #mainmenu li {padding: -1px 2px 2px 2px;background-color: white;}
            /*#mainmenu > li{background-color: #FFB94C;}*/
            .Firmenu{margin:-27px 31px 0px 149px;z-index: 9999;position: absolute;}
            #mainmenu_1:hover #sub-menu_1 {display:block;}
            #mainmenu_2:hover #sub-menu_2 {display:block;}
#sortby{width: 160px;}
#pagesize{width: 160px;}
#pageno{width: 51px;}
#sortby, #pagesize,#pageno{padding:4px 3px;}
#cursor-pointer-right{cursor: pointer;width: 44.667%;}

.navbar-default .navbar-nav > li > a {
  color: #333;
}
.navbar-default .navbar-brand {
  color: #333;
}
#gift-section .img-thumbnail{
    width:359px;
    height:143px;
}
.custom_bg_color{
    background-color: white;
    border-color:#B9BABE;
    border-top: none;
    border-right: none;
    border-left: none;
    
}
 #listing_bullet,#listing_prod_name a{font-weight: normal;color: #6e6e6e;} 
 #listing_prod_name a{text-align: center;cursor: pointer;line-height: 13px;}
 #listing_prod_name{margin-top: 1em;font-family: Georgia;}
 #filters-warpper li a {font-size: 13px;color: #6e6e6e;padding: 1px 3px 1px 0px;font-weight: normal;font-family: "Arial", Helvetica, sans-serif;text-transform: capitalize;}

/*-----------------------------------------------
OVERWRITE BOOTSTAP                          END*/


/* HOVER CSS                               BEGIN
-----------------------------------------------*/
/* Grow */
.hvr-grow {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -moz-osx-font-smoothing: grayscale;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: transform;
    transition-property: transform;
}
.hvr-grow:hover, .hvr-grow:focus, .hvr-grow:active {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

/* Grow Shadow */
.hvr-grow-shadow {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -moz-osx-font-smoothing: grayscale;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: box-shadow, transform;
    transition-property: box-shadow, transform;
}
.hvr-grow-shadow:hover, .hvr-grow-shadow:focus, .hvr-grow-shadow:active {
    box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5);
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

/* Buzz Out */
@-webkit-keyframes hvr-buzz-out {
    10% {
        -webkit-transform: translateX(3px) rotate(2deg);
        transform: translateX(3px) rotate(2deg);
    }

    20% {
        -webkit-transform: translateX(-3px) rotate(-2deg);
        transform: translateX(-3px) rotate(-2deg);
    }

    30% {
        -webkit-transform: translateX(3px) rotate(2deg);
        transform: translateX(3px) rotate(2deg);
    }

    40% {
        -webkit-transform: translateX(-3px) rotate(-2deg);
        transform: translateX(-3px) rotate(-2deg);
    }

    50% {
        -webkit-transform: translateX(2px) rotate(1deg);
        transform: translateX(2px) rotate(1deg);
    }

    60% {
        -webkit-transform: translateX(-2px) rotate(-1deg);
        transform: translateX(-2px) rotate(-1deg);
    }

    70% {
        -webkit-transform: translateX(2px) rotate(1deg);
        transform: translateX(2px) rotate(1deg);
    }

    80% {
        -webkit-transform: translateX(-2px) rotate(-1deg);
        transform: translateX(-2px) rotate(-1deg);
    }

    90% {
        -webkit-transform: translateX(1px) rotate(0);
        transform: translateX(1px) rotate(0);
    }

    100% {
        -webkit-transform: translateX(-1px) rotate(0);
        transform: translateX(-1px) rotate(0);
    }
}

@keyframes hvr-buzz-out {
    10% {
        -webkit-transform: translateX(3px) rotate(2deg);
        transform: translateX(3px) rotate(2deg);
    }

    20% {
        -webkit-transform: translateX(-3px) rotate(-2deg);
        transform: translateX(-3px) rotate(-2deg);
    }

    30% {
        -webkit-transform: translateX(3px) rotate(2deg);
        transform: translateX(3px) rotate(2deg);
    }

    40% {
        -webkit-transform: translateX(-3px) rotate(-2deg);
        transform: translateX(-3px) rotate(-2deg);
    }

    50% {
        -webkit-transform: translateX(2px) rotate(1deg);
        transform: translateX(2px) rotate(1deg);
    }

    60% {
        -webkit-transform: translateX(-2px) rotate(-1deg);
        transform: translateX(-2px) rotate(-1deg);
    }

    70% {
        -webkit-transform: translateX(2px) rotate(1deg);
        transform: translateX(2px) rotate(1deg);
    }

    80% {
        -webkit-transform: translateX(-2px) rotate(-1deg);
        transform: translateX(-2px) rotate(-1deg);
    }

    90% {
        -webkit-transform: translateX(1px) rotate(0);
        transform: translateX(1px) rotate(0);
    }

    100% {
        -webkit-transform: translateX(-1px) rotate(0);
        transform: translateX(-1px) rotate(0);
    }
}
.hvr-buzz-out {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -moz-osx-font-smoothing: grayscale;
}
.hvr-buzz-out:hover, .hvr-buzz-out:focus, .hvr-buzz-out:active {
    -webkit-animation-name: hvr-buzz-out;
    animation-name: hvr-buzz-out;
    -webkit-animation-duration: 0.75s;
    animation-duration: 0.75s;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
}


/* Wobble Top */
@-webkit-keyframes hvr-wobble-top {
    16.65% {
        -webkit-transform: skew(-12deg);
        transform: skew(-12deg);
    }

    33.3% {
        -webkit-transform: skew(10deg);
        transform: skew(10deg);
    }

    49.95% {
        -webkit-transform: skew(-6deg);
        transform: skew(-6deg);
    }

    66.6% {
        -webkit-transform: skew(4deg);
        transform: skew(4deg);
    }

    83.25% {
        -webkit-transform: skew(-2deg);
        transform: skew(-2deg);
    }

    100% {
        -webkit-transform: skew(0);
        transform: skew(0);
    }
}

@keyframes hvr-wobble-top {
    16.65% {
        -webkit-transform: skew(-12deg);
        transform: skew(-12deg);
    }

    33.3% {
        -webkit-transform: skew(10deg);
        transform: skew(10deg);
    }

    49.95% {
        -webkit-transform: skew(-6deg);
        transform: skew(-6deg);
    }

    66.6% {
        -webkit-transform: skew(4deg);
        transform: skew(4deg);
    }

    83.25% {
        -webkit-transform: skew(-2deg);
        transform: skew(-2deg);
    }

    100% {
        -webkit-transform: skew(0);
        transform: skew(0);
    }
}

.hvr-wobble-top {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -moz-osx-font-smoothing: grayscale;
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
}
.hvr-wobble-top:hover, .hvr-wobble-top:focus, .hvr-wobble-top:active {
    -webkit-animation-name: hvr-wobble-top;
    animation-name: hvr-wobble-top;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
}
/* HOVER CSS                                   END
------------------------------------------------*/


/* OFF-CANVAS SIDEBAR                       BEGIN
-------------------------------------------------*/
#sidebar > .list-group {margin-left: 1em}
/*
 * Style tweaks
 * ------------
 */
html,
body {
    overflow-x: hidden; /* Prevent scroll on narrow devices */
}          
/*
 * Off Canvas
 * ----------
 */
@media screen and (max-width: 480px) {
 .Firmenu{margin:-32px 31px 0px 31px}
 #cursor-pointer-right{width: 30.667%;margin-left: -4%;}
 #cursor-pointer-left{margin-right: -5%;}
 #arrow-left{margin-left: -16%;};
 #gift-section .img-thumbnail{
    width:359px;
    height:143px;
}
}
@media screen and (max-width: 767px) {
    .row-offcanvas {
        position: relative;
        -webkit-transition: all .25s ease-out;
        -o-transition: all .25s ease-out;
        transition: all .25s ease-out;
        
    }

    .row-offcanvas-right {
        right: 0;
    }

    .row-offcanvas-left {
        left: 0;
    }

    .row-offcanvas-right
    .sidebar-offcanvas {
        right: -30%; /* 6 columns */
    }

    .row-offcanvas-left
    .sidebar-offcanvas {
        left: -70%; /* 6 columns */
    }

    .row-offcanvas-right.active {
        right: 30%; /* 6 columns */
    }

    .row-offcanvas-left.active {
        left: 70%; /* 6 columns */
    }

    .sidebar-offcanvas {
        position: absolute;
        top: 0;
        width: 70%; /* 6 columns */
    }
    #gift-section .img-thumbnail{
    width:359px;
    height:143px;
}
}

/* OFF-CANVAS SIDEBAR                           END
-------------------------------------------------*/






/* OTHER SITE BASED/REQUIRED                BEGIN
-----------------------------------------------*/

.vertical-align {
    display: flex;
    align-items: center;
}


#search-keyword {width: 400px}
footer #search-keyword {width: auto}
#cart-widget, #search {margin-top: 1em}
#social-icons img {height: 32px}
footer a, footer a:hover {color: #fff}
#toolbar-actions > .row { margin-top: 0.3em}
#toolbar-actions > .row .row .glyphicon { vertical-align: bottom}
#product-tool-bar #description .badge {vertical-align: middle}
#product-tool-bar {border-radius: 3px; border: 1px solid #f8f8f8}
.of-hidden {overflow: hidden}
.pos-relative {position: relative}
.margin-around-sm {margin: .2em}
.margin-around-md {margin: .3em}
.margin-around-lg {margin: .5em}
.margin-around-xl {margin: 1em}
.margin-around-sm-tb {margin: .2em 0}
.margin-around-md-tb {margin: .3em 0}
.margin-around-lg-tb {margin:4px 0px 4px 0px}
.margin-around-xl-tb {margin: 1em 0}
.filter-button-xs {position: absolute; top: 40%; left: -1em; z-index: 1}
span[data-toggle="popover"] {cursor: help}
#cart-wrapper input[name="qty"] {width: 50px}
#cart-wrapper input[name="couponcode"] {width: 70%; display: inline-block}
#btn-cc-checkout .glyphicon {vertical-align: middle}
#product-attributes select[name="size"], #product-attributes select[name="color"], #product-attributes input[name="qty"] {width: 70%; display: inline-block}
#product-attributes > .row {margin: .5em 0;}
#nav-item-best-deal {color: maroon;}
.margin-auto {margin: auto}
.breadcrumb_margin{margin:10px 0px 15px 0px;}
.breadcrumb_margin_pd{margin:5px 0px 15px 15px;}
.itemnotemessage_pd{font-size:12px;float:left;color:red;font-style:italic;}
.ekko-lightbox-container img {max-height: 600px; margin: auto}

/* make typeahead compitible with bootstrap 3 */
.tt-menu {
  background: #f8f8f8 none repeat scroll 0 0;
  border: 1px solid #eee;
  border-radius: 5px;
  font-size: 12px;
  padding: 0.5em;
  width: 100%;
  box-shadow: 2px 2px 3px #666;
}
.tt-cursor {
    background: #FFB94C;
}
.tt-suggestion.tt-selectable {
    padding: .3em .5em;
    border-radius: 3px
}
.input-group .form-control { float: none} /* overwrite bootstrap to make typeahead compitible with bootstrap 3 */
/* make typeahead compitible with bootstrap 3 */


mark#tnt {cursor: pointer}
#terms-n-condition .modal-body {max-height: 400px; overflow-y: auto;}
.price-input-wrapper .table > tbody > tr > td{
    border-top:none;
}

#social-icons img{
        height: 22px;
    }
    #top-links{
        padding-top: .3em;
    }

    /* For Bootstrap Affix Sticky Nav
    ----------------------------------*/
    #nav-bar{
        margin: 0 -15px;
    }
    #nav-bar.affix {
        position: fixed;
        top: 0;
        width: 100%;
        z-index:9998;
    }
    #nav-bar.affix .navbar {
        box-shadow: 0px 2px 3px #333;   
    }
    #nav-bar .navbar {
        border-radius: 0px;
    }
    /* For Bootstrap Affix Sticky Nav
    ----------------------------------END*/

    /*Page ScrollerTop Start*/
    #scrollUp {
        /*bottom: -10px;*/
        bottom: 50px;
        right: 20px;
        width: 60px;
        height: 60px;
        padding: 5px;
        font-family: sans-serif;
        font-size: 14px;
        line-height: 20px;
        text-align: center;
        text-decoration: none;
        text-shadow: 0px 1px 0px #FFF;
        color: #828282;
        /*	box-shadow: 0px 0px 2px 1px rgba(0, 0, 0, 0.2);
                background-color: #E6E6E6;
                background-image: linear-gradient(to bottom, #EBEBEB, #DEDEDE);*/
        /*background-image: linear-gradient(to bottom, #000, #666);*/
        background-repeat: repeat-x;
        /*background-image: url('/images/arrow-up-orange.png');*/
        transition: bottom 150ms linear 0s;
    }
    /*#scrollUp:hover{
        bottom: 0;
    }*/


    /*Page ScrollerTop End*/


/*-----------------------------------------------
OTHER SITE BASED/REQUIRED                    END*/



/* MEDIA QUERY                              BEGIN
-------------------------------------------------*/
/* Extra small devices (phones, less than 768px) */
/* No media query since this is the default in Bootstrap */

/* Small devices (tablets, 768px and up) */
@media (max-width: 768px) {}



/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) { 

}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {  

}



/* Extra small devices (phones, less than 768px) */
@media (max-width: 767px) { 
    #search-keyword {width: 180px}
    footer #search-keyword {width: 125px}
    
    #bs-navbar-collapse li li img { max-width: 75%; margin: auto}
    #bs-navbar-collapse .dropdown-menu li {line-height: 30px; margin-left: 1em;}
  
    #nav-bar .dropdown-menu.container-fluid {min-width: 300px; max-width: 400px}
    
    #nav-bar.affix .navbar-collapse.collapse.in {
        max-height: 500px;
        overflow-y: scroll;
    }
    
}

@media (max-width: 767px) and (orientation: landscape){
    #nav-bar.affix .navbar-collapse.collapse.in {
        max-height: 300px;
        overflow-y: scroll;
    }
}

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991px) {  }

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199px) { 
    #product-attributes .form-control {
        padding: 3px 6px;
        height: auto;
    }
}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { 
    #product-attributes .form-control {
        padding: 3px 6px;
        height: auto;
    }
    
}

/* MEDIA QUERY                                  END
-------------------------------------------------*/