@font-face {font-family: 'futura-bookbook'; src: url('../fonts/futura-book/futura-book-webfont.woff2') format('woff2'),url('../fonts/futura-book/futura-book-webfont.woff') format('woff');font-weight: normal;font-style: normal;}
@font-face {font-family: 'FuturaStd-Bold';src: url('../fonts/FuturaStd-Bold/FuturaStd-Bold.eot?#iefix') format('embedded-opentype'),  url('../fonts/FuturaStd-Bold/FuturaStd-Bold.woff') format('woff'), url('../fonts/FuturaStd-Bold/FuturaStd-Bold.ttf')  format('truetype'), url('../fonts/FuturaStd-Bold/FuturaStd-Bold.svg#FuturaStd-Bold') format('svg');font-weight: normal;font-style: normal;}
@font-face {font-family: 'Graphik-Regular';src: url('../fonts/Graphik/Graphik-Regular.otf')  format('opentype'),url('../fonts/graphik/Graphik-Regular.woff') format('woff'), url('../fonts/Graphik/Graphik-Regular.ttf')  format('truetype');font-weight: normal;font-style: normal;}
@font-face {font-family: 'Graphik-Light';src: url('../fonts/Graphik/Graphik-Light.otf')  format('opentype'),url('../fonts/graphik/Graphik-Light.woff') format('woff'), url('../fonts/Graphik/Graphik-Light.ttf')  format('truetype');font-weight: normal;font-style: normal;}

p{font-family: 'Graphik-Light',sans-serif;line-height: 1.5em;font-size: 14px}

/*.future-book{font-family: 'futura-bookbook',sans-serif}*/
.future-book{font-family: 'Graphik-Light',sans-serif}
.future-std{font-family: 'FuturaStd-Bold',sans-serif}
.graphik{font-family: 'Graphik-Regular',sans-serif}
.graphik-light{font-family: 'Graphik-Light',sans-serif}

/*text-size*/
.f-12{font-size: 12px}
.f-13{font-size: 13px}
.f-14{font-size: 14px}
.f-15{font-size: 15px}
.f-16{font-size: 16px}
.f-18{font-size: 18px}
.f-20{font-size: 20px}
.f-26{font-size: 26px}

/*bg-colors*/
.mt-s{margin-top: 7px}
.lightBg1{background: #f7f8f8}
.lightBg2{background: #f9fafa}
.redBg{background: #f00017}
.blue1Bg{background: #2b3482}
.blue2Bg{background: #2d6a9d}
.whiteBg{background: white}
.done3{background: green!important;;color: white!important;}


/*text-colors*/
.white{color: white}
.red{color: #f00017}
.dark{color: #463e3f}
.blue1{color: #2b3482}
.yellow{color: #dace0d}
.light{color: #878787}

.red-out{border: 1px solid red;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;}
/*fn*/
.empty{height: 166px}
.text-center{text-align: center}
.caps{text-transform: uppercase}
.bold{font-weight: bold}

/*header*/
header{height:186px; position: relative; -webkit-transition: ease all 0.5s ;-moz-transition: ease all 0.5s ;-ms-transition: ease all 0.5s ;-o-transition: ease all 0.5s ;transition: ease all 0.5s;}
.header{position: fixed; left:0;width: 100%;background: white; top:0;z-index: 999}
header .logo img{max-width: 160px;-webkit-transition: ease all 0.5s ;-moz-transition: ease all 0.5s ;-ms-transition: ease all 0.5s ;-o-transition: ease all 0.5s ;transition: ease all 0.5s;}
header .logo .tag{padding-bottom: 5px;line-height: 1.2em;display: block;margin-left: 4px;-webkit-transition: ease all 0.5s ;-moz-transition: ease all 0.5s ;-ms-transition: ease all 0.5s ;-o-transition: ease all 0.5s ;transition: ease all 0.5s;}
header .logo > aside{padding: 0 6px;-webkit-transition: ease all 0.5s ;-moz-transition: ease all 0.5s ;-ms-transition: ease all 0.5s ;-o-transition: ease all 0.5s ;transition: ease all 0.5s;}
header.scrolled .logo .tag{font-size: 9px}
header.scrolled .logo img{max-width: 100px;-webkit-transition: ease all 0.5s ;-moz-transition: ease all 0.5s ;-ms-transition: ease all 0.5s ;-o-transition: ease all 0.5s ;transition: ease all 0.5s;}
header.scrolled{-webkit-transition: ease all 0.5s ;-moz-transition: ease all 0.5s ;-ms-transition: ease all 0.5s ;-o-transition: ease all 0.5s ;transition: ease all 0.5s;}
header.scrolled .logo.content-padding {padding: 8px;}
header.scrolled nav.content-padding,
header .category-nav .category > li > a {-webkit-transition: ease all 0.5s;-moz-transition: ease all 0.5s;-ms-transition: ease all 0.5s;-o-transition: ease all 0.5s;transition: ease all 0.5s;}
header.scrolled nav.content-padding,
header.scrolled .category-nav .category > li > a {padding: 10px; -webkit-transition: ease all 0.5s ;-moz-transition: ease all 0.5s ;-ms-transition: ease all 0.5s ;-o-transition: ease all 0.5s ;transition: ease all 0.5s;}
header .nav-holder{background: #da0015;}
header .nav-holder nav{justify-content: space-around;position: relative}
header .nav-holder a{color: white;display: inline-block}
header nav .searchMe{position: absolute;top: 100%;right: 0;border: 1px solid #eeeeee;display: none; z-index: 30}
.block{display: block!important;}
header nav .searchMe input{padding: 8px;outline: none;border: 1px solid #c1c1c1;-webkit-border-radius:7px;-moz-border-radius:7px;border-radius:7px;min-width: 220px}
header nav .searchMe p{text-align: left;border-bottom: 1px solid #eeeeee;margin-bottom: 11px}
header nav .searchMe button{display: block;margin-top: 14px;background: #ed1c24;color: white;padding:9px 14px;border: none;min-width: 220px;text-align: center;outline: none}

.mob-header, .mob-cat-nav-bar, .mob-cat-nav{display: none}

.cart-summary{display: flex!important;}
.cart-summary .text-right{margin-right: 6px;}
.cart-summary .info{font-size: 12px;align-self: center}

/*banner*/
.banner > img{width: 100%}


/*feature pro card home*/
.pro-fet-card{border: 1px solid #ebebeb;box-shadow: 0 0 4px 1px #f8f8f8;position: relative}
.pro-fet-card .img-holder{padding: 14px;object-fit: contain}
.pro-fet-card .img-holder img{width: 100%;height: 100%;object-fit: contain}
.pro-fet-card .content-holder .title{border-bottom: 1px solid #ebebeb;line-height: 1.3em;min-height: 69px}
.pro-fet-card .content-holder .option{display: block}
.pro-fet-card .content-holder .option:hover{background: #ffefe4}

/*footer*/
.f-top{margin-top: 36px}
.f-top .p-method-block {align-items: center}
.f-top .p-method-block aside:last-child p{max-width: 380px}
.f-mid{border-top: 1px solid #eeeeee;padding: 14px 12px 28px }
.f-mid .category-list .list-box ul li, .f-main-nav ul li{margin: 8px 0;}
.f-mid .category-list .list-box ul li a,.f-main-nav ul li a{color: #463e3f}
.f-mid .f-contact-info div p{margin-top: 6px}
.f-mid .payment-mt li{display: inline-block;margin:0 8px 0 0}
.f-mid .payment-mt li img{max-width: 60px}

@media all and (max-width: 1280px) {
    .layout-xl-flex-50{max-width:50% !important;width:50% !important;-webkit-box-flex:1 1 50% !important;-moz-box-flex:1 1 50% !important;;-webkit-flex:1 1 50% !important;;-ms-flex:1 1 50% !important;;flex:1 1 50% !important;;}
    .featured-pro-row{padding: 12px}
    .red-out{padding: 8px}
}

@media all and (max-width: 1024px) {
    .f-18{font-size: 16px}
    .f-12{font-size: 11px}
    .red-out span{font-size: 12px}

    #MissonVision{display: block}
    #MissonVision aside:last-child{margin-top: 24px}
    .product .data-sec{padding: 7px}
}

@media all and (max-width: 768px) {
    .header{display:none}

    .mob-cat-nav-bar{display: flex;padding: 4px;background: #ed1c24;color: white;font-size: 14px}
    .mob-cat-nav-bar aside:first-child{padding-left: 4px}
    .mob-cat-nav-bar aside:last-child i{padding:0 18px;font-size: 26px}

    .mob-cat-nav{display: block;position: fixed;width:100%;height: 0;z-index: 100;background: white;top: 87px;padding: 0;overflow: hidden}
    .mob-cat-nav ul li i{display: inline-block;background: #f4f4f4;padding: 8px;border-bottom: 2px solid white}
    .mob-cat-nav ul li a{font-weight: bold;color: #444444;font-size: 14px;display: inline-block;padding: 9px;background: #f4f4f4;border: 1px solid white;position: relative;width: 90%}
    .mobCatNavOpen{height: 100%;-webkit-transition: height ease 0.6s ; -moz-transition: height ease 0.6s ; -ms-transition: height ease 0.6s ; -o-transition: height ease 0.6s ; transition: height ease 0.6s ;padding: 16px}
    .mob-cat-nav .subCats{margin-left: 34px}
    .mob-cat-nav .subCats a{background: none}
    .navDrop{-webkit-transform: rotate(180deg); -moz-transform: rotate(180deg);-ms-transform: rotate(180deg);-o-transform: rotate(180deg);transform: rotate(180deg);-webkit-transition: all ease 0.6s ;-moz-transition: all ease 0.6s ; -ms-transition: all ease 0.6s ;-o-transition: all ease 0.6s ;transition: all ease 0.6s ;}
    .mob-header{display:block;z-index: 99;position: fixed;width: 100%;background: white}
    .mob-header .logo img{max-width: 100px}
    .mob-header .logo h3{margin-left: 7px;line-height: 1.3em;font-size: 11px}
    .drop{display: block!important;}

    header{height: 87px}
    .nav-bars{display: inline-block;padding: 2px;margin: 0 14px}
    .nav-bars span{width: 30px;height: 3px;background: #444444;display: inline-block;position: relative}
    .nav-bars span:before, .nav-bars span:after{content:"";position: absolute;width: 100%;height: 3px;background: #444444;}
    .nav-bars span:before{top: -7px;left: 0;right: 0}
    .nav-bars span:after{top: 7px;left: 0;right: 0}
    .mobNavBt{background: rgba(0, 0, 0, 0)!important;}
    .mobNavBt:before{-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);-ms-transform: rotate(45deg);-o-transform: rotate(45deg);transform: rotate(45deg););top: 0!important;-webkit-transition: all ease 0.6s ;-moz-transition: all ease 0.6s ;-ms-transition: all ease 0.6s ;-o-transition: all ease 0.6s ;transition: all ease 0.6s ;}
    .mobNavBt:after{-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);-ms-transform: rotate(-45deg);-o-transform: rotate(-45deg);transform: rotate(-45deg);top: 0!important;-webkit-transition: all ease 0.6s ;-moz-transition: all ease 0.6s ;-ms-transition: all ease 0.6s ;-o-transition: all ease 0.6s ;transition: all ease 0.6s ;}

    .mob-nav{position: fixed;width: 100%;height: 0;z-index: 98;background: white;top: 0;left: 0;right: 0;overflow: hidden}
    .mob-nav a{margin: 24% 0;color: #444444;font-weight: bold}
    .mobNavOpen{height: 100%;-webkit-transition: height ease 0.6s ; -moz-transition: height ease 0.6s ; -ms-transition: height ease 0.6s ; -o-transition: height ease 0.6s ; transition: height ease 0.6s ;}

    .mob-search input, .mob-search button{background: #ec6f74;color: white;border: 1px solid #ec6f74;padding: 3px ;outline: none}
    .mob-search input::placeholder{color: white}


    /*by-category pg*/
    .by-cats .filter-sec{display: none}
    .products-container, .pro-holder{padding: 0}

    /*contact us*/
    #contact{padding: 0}
    #contact > div{display: block}

    /*footer*/
    .f-mid{display: block;padding: 0}
    .f-mid > aside{padding: 7px}
    .f-mid .category-list{display: none}
    .f-mid .f-main-nav{text-align: center;border-top: 1px solid #eeeeee}
    .f-mid .f-main-nav aside{margin: 6px 0}
    .f-mid .f-main-nav aside:first-child ul{display: flex;flex-wrap: wrap;justify-content: space-around}
    .f-mid .f-contact-info{display: flex;flex-wrap: wrap;-webkit-flex-wrap: wrap;-ms-flex-wrap: wrap;background: #eeeeee}
    .f-mid .f-contact-info > div{width: 50%;text-align: center}

    #ProductDetails{display: block;overflow: hidden}
    .pro-view-info-block{overflow: hidden;}
}

@media all and (max-width: 540px) {
    .empty{height: 28px}
    p,.f-14{font-size: 13px}
    .f-26{font-size: 21px}
    .pro-pg-title{margin: 20px 0!important;}
    .content-padding.xl{padding: 7px}
    .content-padding.lg{padding: 22px 16px}
    .layout-xs-flex-100{max-width:100% !important;width:100% !important;-webkit-box-flex:1 1 100% !important;-moz-box-flex:1 1 100% !important;;-webkit-flex:1 1 100% !important;;-ms-flex:1 1 100% !important;;flex:1 1 100% !important;;}

    .nav-bars span{width: 25px}
    .f-mid .f-contact-info > div{width: 100%}
    .f-btm > div{display: block}
    .f-btm > div > aside{text-align: center;margin-top: 4px}

    header{height: 76px}
    .mob-cat-nav ul li a{width: 84%}
    .mob-header .logo img{max-width: 80px}
    .mob-cat-nav{top: 76px}

    .faqLink{font-size: 12px}
    #Cart .table{font-size: 11px}
    #Cart .table thead tr th:nth-child(2), #Cart .table thead tr th:last-child{display: none}
    #Cart .table tbody tr td:nth-child(2),#Cart .table tbody tr td:last-child{display: none}
    #Cart .table tfoot tr td:nth-child(2),#Cart .table tfoot tr td:nth-child(3){display: none}
}