/*------------------------------------------------*/
/* GLOBAL                                         */
/*------------------------------------------------*/


/*------------------------------------------------*/
/* HOME                                           */
/*------------------------------------------------*/

@media only screen and (max-width : 1200px) {
    .mnav-main li {
        padding: 0px 0.1em;
    }   
}

@media only screen and (max-width : 1240px) {
    footer .half, 
    footer .flinks { width: auto; }
    footer .flinks { justify-content: space-around; }
    footer .flinks .links { width: auto; }
    footer .halves { justify-content: space-around; }
    
    footer .company, footer .contact { margin: 0 20px; }
}


@media only screen and (max-width : 1190px) {
    .blog-posts .eats-2 .dpost-detail { max-width: 100%; } 
    .blog-posts .eats-2 .p-image { max-width: 100%;
      background-position: 50% 50%;
    }
    
    footer .wrap { padding: 50px 0; }
}

@media only screen and (max-width : 992px) and (min-width : 768px) {
   .dtab li { max-width: 120px; height: auto; }  
   .q-inner .carousel-item .detail { margin-right: 50px; }    
   .q-inner .carousel-item .detail .text { 
      margin: 0px;
       margin-bottom: 20px;
    }
    
    .technology .shelf { 
        background-size: auto;
        height: 575px;
    }    
    
    
}

@media only screen and (max-width : 830px) { 
    footer .half { justify-content: center; }   
    footer .flinks { width: 100%;  }
}

@media only screen and (max-width : 768px) and (min-width : 481px) {
    .home-header .slogan { padding: 50px 0 0;  }   
    .home-header .slogan .title { font-size: 48px; }
    .wrap { padding: 20px !important; }
    .home-header .slogan { padding: 150px 0 0;  }       
    
    .carousel-indicators { margin-bottom: 30px;  }    
    
    .dtab { margin-left: 0;  justify-content: center;}
    .dtab li { max-width: 120px; height: auto; }    
    .q-inner .carousel-item .detail { margin-right: 0px; }   
    .what-we-do .floor { margin: 0px auto;
        margin-bottom: 30px;
    }
    .what-we-do .stat .item { justify-content: center; }
    .what-we-do .floor-wrap { padding: 0; }
    
    .technology .shelf { 
        background-size: auto;
        height: 575px;
    }
    
    .prod-main, .prod-rec .product-detail { max-width: 100%; 
        margin: 0px auto;
    }

    .blog-news .col-md-4 { margin-bottom: 35px; }
    .latest-news .blog-news .npost { 
        max-width: 500px;
        margin-left: auto;
        margin-right: auto;
    }
    
    .promoters .promo .comp { width: 33%; }
    
    .request-demo .title { margin-bottom: 15px; }
    footer .company, footer .contact { margin: 0 20px; text-align: center; }
    footer .half, footer .flinks { width: 100% }
    footer .half { margin: 0px auto 30px; justify-content: center; }
    footer .flinks { justify-content: space-between;  }
    footer .flinks .links { width: auto; }
    footer .copyright { justify-content: center; }
}




@media only screen and (max-width : 767px) { 
      .prod-main .prod-bullets-2 {  
        background-size: cover;
        width: 63%;    
    }
}

@media only screen and (max-width : 600px) {
    .prod-main .prod-bullets-2 { display: none; }
}



@media only screen and (max-width : 480px) {
    

    .wrap { padding: 20px 0 !important; }
    
    .home-header .slogan { padding: 100px 0 50px;  }   
    .home-header .slogan .title { 
        font-size: 42px; 
        line-height: 150%; 
    }
    
    .retailers { max-width: 100%;  overflow-x: hidden; }
    .retailers .top  { margin: 0px; }
    
    .carousel-container { padding-top: 30px; }
    .carousel-indicators, 
    .carousel-container { margin: 0px auto; max-width: 90%; overflow-x: hidden; }
    
    .dtab {  justify-content: center;}
    .dtab li { max-width: 86px; height: auto; }
    .carousel-indicators { 
        margin-bottom: 30px; 
    }
    
    .q-inner .carousel-item .detail .text { 
        padding: 0px 15px;
        margin: 0;
        margin-bottom: 10px;
    }
    
    .q-inner .carousel-item { align-items: flex-start; }
    
    .what-we-do .top { padding: 0; }
    .what-we-do .floor { 
        background-position: 11% -1px;
        background-image: url(../../images/floor-mobile.jpg);
    }
    
    .what-we-do .floor .elem-2 { top: 52%; }
    .what-we-do .floor .marker-2 { top: 68%; }
    
    .what-we-do .stat-wrap { padding-left: 0px; }
    .what-we-do .floor-wrap { padding-bottom: 0; }
    
    
    .prob-we-solve .top { margin-bottom: 0; }
    .prob-we-solve .banner { margin-bottom: 25px; }
    .prob-we-solve .button-area { margin-bottom: 35px; }
    
    .technology .text-wrap {
        padding-top: 25px;
    }
    
    .technology .text, .technology .text p {
        padding: 0;
    }
    
    .technology .shelf { 
        height: 535px;
        background-size: auto;
    }
    
    .prod-main { width: 100%; }
    .prod-main .prod-bullets-2 { display: none; }
    
    .why-choose-us .top { 
        margin-bottom: 10px; 
        padding: 10px 0 0 0;
    }
    
    .why-choose-us .banner {
        padding: 15px 0;
    }
    
    .why-choose-us .button-area { padding: 0; margin-bottom: 25px; }
    
    .latest-news .top { margin-bottom: 0; }
    
    .blog-news .col-md-4 { margin-bottom: 35px; }
    
    .partners .wrap { padding: 20px 0; }
    
    .promoters .top { margin-bottom: 20px; padding-top: 0; }
    .promoters .promo { margin-bottom: 30px; justify-content: center; }
    .promoters .promo .comp { margin-bottom: 15px; }
    
    .promoters .wrap { padding-top: 0px !important; }
    
    .request-demo .title { text-align: center; margin-bottom: 20px; margin-top: 5px; }
    .request-demo .btn { margin-bottom: 10px; }
    
    .partners .partners-slider .slick-prev { margin-left: 20px; }
    .partners .partners-slider .slick-next { margin-right: 20px; }
    
    
    footer .wrap { padding: 0px;  padding-top: 30px; }
    footer .social { justify-content: space-around; margin-bottom: 30px; }
    footer .footer-logo { margin-bottom: 30px; margin-top: 10px; }
    footer .company, footer .contact { 
        width: 100%;
        max-width: 100%;
        text-align: center;
        padding: 0;
    }
    footer .flinks { width: 100%; }    
    footer .flinks .links { margin-left: 0; width: 33%; text-align: center; }
    footer .copyright {text-align: center; justify-content: center;}
    footer .copyright p { width: 100%; }
    footer .tdd { text-align: center !important;}
}


/*------------------------------------------------*/
/* HOME                                           */
/*------------------------------------------------*/



@media only screen and (max-width : 992px) { 
    /* careers */
    .content-c .d-content .d-image-right .text-panel { 
        margin-left: 0;
        background-color: rgba(255,255,255,0.6)
    }
    
    .content-c .d-content .d-image-left .text-panel {
        background-color: rgba(255,255,255,0.6)
    }
    
    .page-case-study .dtab { margin: 0px auto; max-width: 100%; justify-content: center; }
    .page-case-study .dtab li { width: 150px; height: 150px; }
    .page-case-study .dtab li img { max-width: 100%; }
    .page-case-study .q-inner .carousel-item .detail { width: auto; }

}

@media only screen and (max-width : 768px) {
    /* blog */
    .page-blog { padding-top: 25px; }    
    
    /* careers */
    .content-c .d-content .d-panel { flex-wrap: wrap; margin-bottom: 0; }
    .content-c .d-content .d-image-left .text-panel,
    .content-c .d-content .d-image-right .image-panel { margin-left: 0; }
    .content-c .d-content .d-panel .image-panel { max-width: 100%; margin-bottom: 30px; }
    .content-c .d-content .d-panel .text-panel { max-width: 100%; }
    .content-c .d-content .d-panel .text-panel { min-height: 0; padding-top: 0; }
    
    .job-opening { background-image: none; }
    .job-opening .list-1 { background-color: #136C96; padding: 20px 20px; }
    .job-form, .job-list { margin: 0px auto; }
    .job-opening .form-1 { background-color: #6694B7; padding: 20px 20px 30px; }
    .job-opening .list-1, .job-opening .form-1 {
        max-width: 100%;
        flex: 0 0 100%;
    }
    
    .our-values .top { padding-top: 0; }
    .our-values .detail { max-width: 100%; text-align: center;}
    .our-values .detail .text { text-align: center !important}
    .rep-gallery { margin-bottom: 20px; }
    
    .content-c .top { margin-bottom: 20px; }
    
    .page-case-study .dtab li { width: 140px; height: 140px; }
    .page-case-study .q-inner .carousel-item .detail { 
        margin: 0px auto;
        padding: 0px 20px;
    }  
    .page-case-study .q-inner .carousel-item .detail .text { padding: 0; }
    .page-case-study .retailers { background-image: none; }
    .gf-body .gravity-form { margin-left: 0; }    

    #accContact-1  { margin: 0px auto; max-width: 100%; }
    #accContact-1 .card-body .detail .item { justify-content: center; }
    .gform-wrap { background-image: none; }
    .gf-body .gravity-form .top { text-align: center; }
    #accContact-1 .card-body .detail .g-map-m { margin: 0px auto; }
    
    /* single post */
    .single-post .post-navi { margin-bottom: 30px; }
}


@media only screen and (max-width : 480px) {
    .page-blog { padding-top: 25px; }
    .blog-posts .eats-2 .p-image { max-width: 100%; }
    .page-news .latest-news { padding-top: 15px; }
    .page-news .wrap { padding-bottom: 10px !important; }

    .gf-body .gchecks { margin-left: 50px; }
    .gf-body .gchecks label { display: block; }
    
    .single-post .post-content .alignleft,
    .job-opening { max-width: 95%; margin: 0px auto; overflow-x: hidden; }
    .job-form, .job-list { max-width: 100%; }
    
    .what-we-do .floor .elem-4 { left: 40%; top: 36%; }    
    .what-we-do .floor .marker-4 { top: 29%; left: 4%;  }
    .content-c .d-content .d-panel .text-panel { padding-left: 0; padding-right: 0; }
    .job-list .accordion .card { cursor: pointer; }
}

@media only screen and (max-width : 430px) {
    .what-we-do .floor .elem-4 { left: 42%; }     
}


@media only screen and (max-width : 410px) {
    .what-we-do .floor .elem-4 { left: 48%; }     
}

@media only screen and (max-width : 390px) {
    .what-we-do .floor .elem-4 { left: 46%; }     
}