/* STYLE FOR MOBILE DEVICE */
@media screen and (max-width:1320px) {
    #donate .prod-rotator{
        /* margin: 80px 0 0;
        padding: 0 20px; */
    }
    #donate .container{
        width: 100%;
    }
    .products .slick-next.slick-arrow{
        right: 0;
    }
    .products .slick-prev.slick-arrow{
        left: 0;
    }
    #faq_content,.page-template-page-contact .main-content{
        background-size: 100% !important;
    }
}

@media (max-width: 1300px) {
    .navbar-right > div { width: 70px; }
    .navbar-right >  .search-box { width: 53px; }
    .hdr-menu { padding-right: 15px; }
    .main-nav ul li { margin-left: 28px; }
}

@media (max-width: 1200px) {
    .hdr-bg { min-height: 350px; }
    .hdr-title { padding-top: 140px; }
    .give-back-content { margin-top: 150px; }

    .give-back-content h1.compl-ttl span.title-left { width: 100%; margin-left: 0; text-align: center; font-size: 80px; margin-bottom: 10px; }
    .give-back-content h1.compl-ttl span.title-right { width: 100%; text-align: center; font-size: 42px; }
}

@media screen and (max-width:1170px) {
    .main-nav ul li a, .main-nav ul li a:hover, .main-nav ul li a:active, .main-nav ul li a:focus {
        font-size: 20px;
    }
    #shop.wrapper .container{
        width: 100%;
    }
    .home h1{
        font-size:250px;
    }
    #banner .container, .container{
        width: 100%;
    }
    .col-sm-12.padd-0{
        padding-right: 15px !important;
        padding-left: 15px !important;
    }
    .woocommerce .products ul, .woocommerce ul.products{
        padding: 0 20px 40px;
    }

}
@media screen and (max-width:1050px) {
    .woocommerce-images{
        width: 58.33333333% !important;
    }
    .woocommerce-images .woocommerce-images, .woocommerce-images >  div:not(.jssort03),
    .woocommerce-images > div[u=slides],.woocommerce-images > div[u=slides] div
    {
        width: 100% !important;
    }
}
@media screen and (max-width:1000px) {
    .main-nav div > ul > li,.main-nav div > ul > li:first-child{
        margin-left: 10px;
    }
    .home h1{
        font-size: 200px;
    }
    .home .products .product-wrap{
        height: auto;
    }
    .home .woocommerce ul.products li.product a img{
        height: auto;
    }
    .about-content{
        height: auto;
    }
    .about-content .banner:first-child .banner-text {
        padding: 10% 12% 5% 15% !important;
    }
    .about-content .banner:last-child .banner-text {
        padding: 10% 15% 5% 12% !important;
    }


}
@media screen and (max-width:860px) {
    .navbar-right > div { width: 88px; }
    .navbar-toggle{
        display: block;
        position: absolute;
        z-index: 200;
        top: 40px;
        right: 0;
        z-index: 200;
        -webkit-transition: all linear 0.3s;
           -moz-transition: all linear 0.3s;
                transition: all linear 0.3s;

    }
    .open .navbar-toggle{
        position: fixed;
    }
    .navbar-toggle:hover, .navbar-toggle:active, .navbar-toggle:focus{
        border-color: transparent;
        outline: none;
    }
    .main-nav{
        background: #ec0075;
        display: block;
        position: fixed;
        right: 0;
        top: 0;
        bottom: 0;
        z-index: 100;
        width: 0;
        padding-top: 60px;
        overflow-y: auto;
        -webkit-box-shadow: 1px 0 10px rgba(0, 0, 0, 0.2);
           -moz-box-shadow: 1px 0 10px rgba(0, 0, 0, 0.2);
                box-shadow: 1px 0 10px rgba(0, 0, 0, 0.2);
    }
    .main-nav > div{
        overflow-y: auto;
        height: 100%;
    }
    .main-nav div > ul{
        padding-left: 40px;
    }
    .main-nav ul li{
        display: block;
        text-align: left;
    }
    .main-nav ul li a,.main-nav ul li a:hover,
    .main-nav ul li a:active, .main-nav ul li a:focus{
        white-space: nowrap;
        font-size: 30px;
    }
    .navbar-right{
        margin-right: 60px;
    }
    .navbar-right > div{
        border: none;
    }
    .main-nav  ul.sub-menu{
        position: relative;
        left: 0;
        margin-left: 0;
    }
    .navbar-right > .cart-box{
        border-right: 1px solid #d3d3d3;
    }
    .navbar-toggle .icon-bar{
        background: #ffffff;
    }
    .main-nav  ul.sub-menu li a{
        font-size: 20px;
        opacity: 0.7;
    }
    .search-box-form{
        z-index: 200;
        width: 85%;
    }
    .home h1{
        font-size: 150px;
    }
    .home .hdr-title{
        top: 25%;
    }
    .background-video,.background-video iframe{
        height: auto;

    }
    .main-content:not(.faq-content){
        padding: 50px 0 !important;
    }
    .main-content.padd-top-0{
        padding: 0 !important;
        height: auto;
    }
    h1.compl-ttl{
        font-size: 40px;
        padding-top: 25px;
    }
    h1.compl-ttl span{
        font-size: 86px;
    }
    .about-content .banner{
        display: block;
        width: 100%;
        height: auto;
    }
    .about-content .banner .banner-text{
        padding: 30px 20px;
        text-align: center;
    }
    .about-content .btn-more{
        margin: 20px auto 0;
    }
    .woocommerce #content div.product div.images, .woocommerce div.product div.images,
    .woocommerce-page #content div.product div.images, .woocommerce-page div.product div.images,
    .woocommerce #content div.product div.summary, .woocommerce div.product div.summary,
    .woocommerce-page #content div.product div.summary, .woocommerce-page div.product div.summary,
    .woocommerce-images {
        display: block;
        float: none !important;
        width: 100% !important;
        padding-right: 0;
        padding-left: 0;
    }
    .woocommerce-images > div[u=slides] div a{
        width: 100%;
    }
    .woocommerce #content div.product div.images, .woocommerce div.product div.images > a,
    .woocommerce-images{
        display: block;
        max-width: 500px;
        margin: 0 auto 30px;
    }
    .woocommerce-page #content div.product div.summary, .woocommerce-page div.product div.summary{
        text-align: center;
    }
    div.summary .prod-details{
        display: inline-block;
        text-align: left;
    }
    .woocommerce div.product div.images div.thumbnails,
    .woocommerce div.product form.cart, .woocommerce div.product p.cart,
    .description.product h2{
        text-align: center;
        margin-bottom: 25px;
    }
    h2.categoty-title,
    .related.products h2,
    .prod-details h3,
    .description.product h2{
        text-align: center;
        line-height: normal;
    }
    .woocommerce div.product form.cart div.quantity,
    .woocommerce div.product form.cart .button{
        display: inline-block;
        float: none;
        vertical-align: top;
    }
}
@media screen and (max-width:768px) {
    .navbar-header{
        float: left;
    }
    .navbar-right{
        float: right !important;
    }
    .row.hdr-elems .col-sm-3,
    .row.hdr-bg .col-sm-3{
        float: left;
        width: 25%;
    }
    .ttl-line h3,.ttl-line.purple h3{
        line-height: normal;
        font-size: 28px;
    }
    #shop.wrapper{
        padding: 35px 0;
    }
    #shop.wrapper h2{
        font-size: 65px;
    }
    .gray-feat-box .prod-feat-box{
        padding-right: 0;
    }
    .blue-feat-box .prod-feat-box{
        padding-left: 0;
    }
    .prod-feat-box h3{
        padding-top: 20px;
    }
    #banner.wrapper{
        padding-top: 35px;
    }
    #banner h2,#soc-hashtag{
        padding-bottom: 20px;
        font-size: 55px;
        line-height: normal;
    }
    #donate.wrapper{
        padding-bottom: 25px;
    }
    #social.wrapper{
        padding-top: 35px;
    }
    .insta-row{
        margin-top: 25px;
    }
    footer .col-sm-6{
        text-align: center;
    }
    .prod-box .logo-row{
        text-align: center;
    }
    .product-row .prod-box{
        padding-bottom: 30px;
    }
    .product-row{
        padding-bottom: 0;
        margin-top: 0;
        border-bottom: none;
    }
    .product-row .prod-descript{
        min-height: 0;
    }
    .product-row .prod-descript br{
        display: none;
    }
    h1.compl-ttl + p{
        margin-bottom: 30px;
    }
    .faq-steps .steps{
        background-size: 90% !important;
        padding-top: 160px;
    }
    .about-content .banner:first-child .banner-text {
        padding: 30px 20px !important;
    }
    .about-content .banner:last-child .banner-text {
        padding: 30px 20px !important;
    }
    .woocommerce-page .cart-collaterals .cart_totals {
        width: 100%;
    }

    .woocommerce-checkout #customer_details > div { width: 100%; }
    .hdr-bg { min-height: 200px; }
    .woocommerce-account .woocommerce-MyAccount-navigation { width: 100%; padding-right: 0; }
    .woocommerce-account .woocommerce-MyAccount-content { width: 100%; }
    .woocommerce-account .woocommerce-MyAccount-content .addresses > div { width: 100%; }
}

@media screen and (max-width:670px) {
    .home h1{
        font-size: 120px;
    }
    #shop .btn-row{
        margin-top: 0;
    }
    .gray-feat-box, .blue-feat-box{
        display: block;
    }
    .blue-feat-box .prod-feat-box,
    .gray-feat-box .prod-feat-box{
        float: none;
    }
    .prod-feat-box{
        padding: 25px 0;
        text-align: center;
        max-width: 100%;
    }
    .blue-feat-box h3:after, .blue-feat-box .prod-ph:after{
        display: none;
    }
    .prod-feat-box img{
        display: inline-block;
        max-width: 70%;
        margin-top: 20px;
    }
    #banner p{
        font-size: 22px;
        line-height: normal;
        padding-bottom: 25px;
    }
    #banner .btn:before{
        display: none;
    }
    #banner .btn{
        margin-top: 20px;
    }
    #donate .prod-rotator{
        margin-top: 30px;
    }
    .soc-btn-row .btn{
        display: block;
        margin: 0 auto 15px !important;
    }
    .cart-overlay .cart-btn-box a,.cart-overlay .cart-btn-box a:hover{
        margin-right: 10px;
    }
    .products .product-wrap{
        height: auto;
    }
    #livechat{
        left: 50%;
        margin-left: -105px;
    }
    h1.compl-ttl span{
        float: none;
        font-size: 40px;
        margin-right: 0;
    }
    .faq-steps .steps{
        padding-top: 130px;
    }
    #faq_content{
        background-position: center top !important;
    }
    .banner-ttl{
        font-size: 70px;
    }
    .about-content .banner-text h2{
        font-size: 45px;
        line-height: normal;
    }
    .main-content h1{
        font-size: 55px;
        text-align: center;
    }
}

@media screen and (max-width:500px) {
    .home h1{
        font-size: 75px;
    }
    .hdr-sub-title span{
        background-size: 100%;
    }
    #donate h2{
        font-size: 30px;
        line-height: 1.2;
    }
    #social h3{
        line-height: normal;
        font-size: 30px;
        padding-bottom: 10px;
    }
    #banner h2, #soc-hashtag{
        font-size: 40px;
    }
    #donate .purple{
        margin-top: 0;
    }
    .banner-ttl{
        font-size: 60px;
        line-height: normal;
    }
    .main-content:not(.faq-content){
        padding: 25px 0 !important;
    }
    .main-content.padd-top-0{
        padding: 0 !important;
    }
    h1.compl-ttl{
        padding-top: 65px;
        white-space: normal;
    }
    .prod-box .logo-row img:last-child{
        display: block;
        margin: 10px auto 0;
    }
    .prod-box .logo-row{
        padding-bottom: 25px;
    }
    .faq-content h1{
        font-size: 70px;
    }
    #faq-infograf h2{
        font-size: 36px;
    }
    #faq_content .col-md-12{
        padding: 0;
    }
    .faq-steps .col-sm-5th{
        float: none;
        width: 100%;
    }
    .faq-steps .steps{
        padding-top: 0;
        background: none;
        padding: 0 30px 20px;
        font-size: 24px;
    }
    .faq-content .entry-content{
        padding: 0 10px 0 0;
    }
    .page-template-page-contact .banner-ttl{
        font-size: 55px;
    }
    .woocommerce img, .woocommerce-page img{
        display: block;
        float: none;
        margin-right: 0;
    }

}
@media screen and (max-width:340px) {
    .hdr-menu{
        height: 100px;
        padding: 18px 17px 18px 10px;
    }
    .logo{
        width: 100px;
        font-size: 70px;
        background-size: 100%;
    }
    .banner-ttl{
        margin-bottom: 20px;
    }
}
@media screen and (min-height:1000px){
    .row.hdr-elems .col-sm-3{
        background-position: 50% 60% !important;
    }
    .hdr-sub-title{
        bottom:35%;
    }
}
@media screen and (max-height:700px) {
    .row.hdr-elems .col-sm-3{
        background-position: 50% 90% !important;
    }
    .hdr-sub-title{
        bottom: 14%;
    }
    .about-content .banner:first-child .banner-text {
        padding: 15% 12% 0 20%;
    }
    .about-content .banner:last-child .banner-text {
        padding: 15% 20% 0 12%;
    }

}
@media screen and (max-height:600px) {
    .row.hdr-elems .col-sm-3{
        background-position: 50% 93% !important;
    }
    .hdr-sub-title{
        bottom: 7%;
    }
    .home .hdr-title{
        top: 34%;
    }

}
@media screen and (max-height:500px) {
    .row.hdr-elems{
        display: none;
    }
    .hdr-sub-title{
        bottom: 10%;
    }
    .hdr-sub-title span{
        background-size: 60%;
    }
    .hdr-sub-title span{
        height: 124px;
    }
}

@media screen and (max-width: 530px) {
    .woocommerce-page table.cart td.actions .coupon { width: 100%; margin-bottom: 10px; padding-left: 5px; padding-right: 5px; }
    .woocommerce-page table.cart td.actions .coupon + .button { margin-right: 5px; }
}

@media (max-width: 460px) {
    .woocommerce-cart table.cart .product-thumbnail { display: none; }
}

@media (max-width: 420px) {
    .woocommerce-cart table.cart tbody tr td { padding-left: 2px; padding-right: 2px; }
    .woocommerce-cart table.cart tbody .product-quantity .quantity { text-align: center; }
    .woocommerce-cart table.cart th { padding-left: 2px; padding-right: 2px; }
}

@media screen and (max-height:390px) {
    .hdr-sub-title{
        bottom: 0;
    }
}

@media (max-width: 400px) {
    .content-setup-block { width: 100%; }
}

@media (max-width: 380px) {
    .woocommerce-page table.cart td.actions .coupon #coupon_code { width: 105px; }
}

@media (max-width: 360px) {
    .home h1 { font-size: 60px; }
    #wc-pin_payments-cc-form .form-row-first { width: 100%; }
    #wc-pin_payments-cc-form .form-row-last { width: 100%; }
}

@media (max-width: 340px) {
    body .row.hdr-bg .hdr-title { padding-top: 100px; }
    .navbar-toggle { top: 27px; }
}