/* Large Laptops */
@media (min-width: 1400px) {

    .prod-1,
    .prod-2,
    .prod-3,
    .prod-4 {
        margin: 10px 10px;
        width: 298px;
        height: 358px;
    }

    .prod-1 img,
    .prod-2 img,
    .prod-3 img,
    .prod-4 img {
        height: 256px;
    }
}

/* Medium Laptops  */

@media (min-width:1200px) and (max-width: 1400px) {

    .prod-1,
    .prod-2,
    .prod-3,
    .prod-4 {
        margin: 10px 10px;
        width: 253px;
        height: 328px;
    }
    .ab-img img{
        height: 304px;
    }
    .ab-img .vs_c{
        height: 180px;
    }

    .c-n {
        font-size: 1.4rem;
        text-align: start;
    }
    .prod-1 img,
    .prod-2 img,
    .prod-3 img,
    .prod-4 img {
        height: 233px;
    }
    .ban-co {
        font-size: 2.2rem; 
        line-height: 3rem;

    }
    .ban-btn,
    .ab-btn {
        margin: 1.1rem 0;
    }
    .ser h4, .ql h4, .con h4 {
        font-size: 1.6rem
    }
    .flg p,.ab-co p,.prod-1 h5, .prod-2 h5, .prod-3 h5, .prod-4 h5,.ser ul li .se-flt, .ql ul li .ql-ft{
        font-size: 0.9rem;
    }
}

/* LapTops */

@media (min-width:992px) and (max-width: 1200px) {

    .prod-1,
    .prod-2,
    .prod-3,
    .prod-4 {
        margin: 10px 10px;
        width: 208px;
        height: 274px;
    }

    .ab-img .vs_c{
        height: 140px;
    }
    .prod-1 img,
    .prod-2 img,
    .prod-3 img,
    .prod-4 img {
        height: 178px;
    }

    .ban-btn {
        margin: 0.8rem 0;
    }

    .ab-cont .ab-para {
        font-size: 1.8rem;
        padding: 0px 0px;
    }

    .ban-co {
        font-size: 1.8rem;
        line-height: 3.2rem;
    }

    .ban-img img,
    .ab-img img {
        height: 230px;
    }

    .ab-co h2,
    .pr-co h2 {
        font-size: 1.8rem;
    }

    .ab-co p {
        font-size: 0.9rem;
    }

    .info .i-para {
        width: 49%;
    }

    .ab-btn {
        margin: 1.2rem 0;
    }

    .c-n {
        font-size: 1.2rem;
        text-align: start;
        margin-right: 30px;
    }
}

/* Large Tablets */


@media (min-width: 768px) and (max-width:992px) {
    .ab-img img {
        height: 280px;
    }
    .ab-img .vs_c{
        height: 120px;
    }
    .ab-co p.ser ul li .se-flt,
    .ql ul li .ql-ft,
    .flg p,
    .em-ft p,
    .tel-ft p {
        font-size: 0.9rem;
    }

    .ban-co {
        font-size: 1.6rem;
        line-height: 3rem;
    }

    .flg h2,
    .ser h4,
    .ql h4,
    .con h4 {
        font-size: 1.5rem;
    }

    .prod-1,
    .prod-2,
    .prod-3,
    .prod-4 {
        margin: 10px auto;
        width: 300px;
        height: 340px;
    }

    .prod-1 img,
    .prod-2 img,
    .prod-3 img,
    .prod-4 img {
        height: 240px;
    }

    .tel h4,
    .ab-co p,
    .flg p,
    .ser ul li .se-flt,
    .ql ul li .ql-ft,
    .em-ft p,
    .tel-ft p,
    .cp h6,
    .prod-1 h5,
    .prod-2 h5,
    .prod-3 h5,
    .prod-4 h5 {
        font-size: 0.8rem;
    }

    .ban-btn {
        margin: 0.8rem 0;
    }

    .flg h2,
    .ban-btn .bnt,
    .ab-btn .ab-bnt {
        font-size: 1rem;
    }

    .ser h4,
    .ql h4,
    .ab-cont .ab-para,
    .con h4 {
        font-size: 1.6rem;
        padding: 0px 0px;
    }

    .ab-co p.ser ul li .se-flt,
    .ql ul li .ql-ft,
    .flg p,
    .em-ft p,
    .tel-ft p {
        font-size: 0.9rem;
    }

    .flg h2,
    .ser h4,
    .ql h4,
    .con h4 {
        font-size: 1.5rem;
    }

    .info .i-para {
        width: 75%;
    }
    .c-n{
        font-size: 1.2rem;
    }
}

/* Tablets */

@media (min-width: 576px) and (max-width:768px) {

    .logo,
    .tel h4,
    .con,
    .flg,
    .ql,
    .ser {
        text-align: start;
    }

    .ban-img,
    .prod-1,
    .prod-2,
    .prod-3,
    .prod-4 {
        width: 85%;
        margin: 10px auto;
    }

    .ban-co,
    .ab-cont .ab-para,
    .flg h2 {
        text-align: start;
        font-size: 1.9rem;
        line-height: 3.2rem;
        padding: 1px 0px;
    }

    .ban-btn {
        text-align: start;
        margin: 0.8rem 0;
    }

    .info .i-para {
        width: 54%;
    }

    .ser h4,
    .ql h4,
    .con h4 {
        font-size: 1.5rem;
    }

    .tel h4,
    .ab-co p,
    .flg p,
    .ser ul li .se-flt,
    .ql ul li .ql-ft,
    .em-ft p,
    .tel-ft p,
    .cp h6,
    .ban-btn .bnt,
    .ab-btn .ab-bnt,
    .prod-1 h5,
    .prod-2 h5,
    .prod-3 h5,
    .prod-4 h5 {
        font-size: 0.9rem;
    }

}

/* Mobiles  */


@media (max-width: 576px) and (min-width: 320px) {

    .pr-co,
    .ban-c,
    .tel h4 {
        text-align: start !important;
    }
    .ban-img {
        width: 83%;
        margin: 10px auto 10px 10px;
    }

    .ban-co,
    .ab-co h2,
    .pr-co h2 {
        font-size: 2.2rem;
        line-height: 3.2rem;
    }

    .ban-btn {
        margin: 0.8rem 0;
    }

    .prod-1,
    .prod-2,
    .prod-3,
    .prod-4 {
        width: 100%;
        margin: 10px auto 10px 10px;
        height: 380px;
    }

    .prod-1 img,
    .prod-2 img,
    .prod-3 img,
    .prod-4 img {
        height: 300px;
        width: 386px;
    }

    .info .i-para {
        width: 75%;
    }

    .flg h2,
    .ab-cont .ab-para {
        font-size: 1.8rem;
        padding: 1px 0px;
    }

    .ser h4,
    .ql h4,
    .con h4 {
        font-size: 1.4rem;
    }

    .tel h4,
    .ab-co p,
    .flg p,
    .ser ul li .se-flt,
    .ql ul li .ql-ft,
    .em-ft p,
    .tel-ft p,
    .cp h6,
    .ban-btn .bnt,
    .ab-btn .ab-bnt,
    .prod-1 h5,
    .prod-2 h5,
    .prod-3 h5,
    .prod-4 h5 {
        font-size: 0.9rem;
    }
    .cp h6 {
        font-size: 13px;
    }
}