/*demo lay*/

@media screen and (min-width: 320px) and (max-width: 768px) {
    .btn.btn-md {
        padding: 1.07em 2.15em;
        font-size: 8px;
    }

    .input-wrapper input.form-control {
        flex: 1;
        min-width: 8px !important;
        font-size: 1.2rem;
    }

    .text-news {
        font-size: 16px;
        text-align: center;
    }

    .footer .copyright {
        margin: 0;
        font-size: 12px !important;
        font-weight: 500;
        letter-spacing: -0.01em;
        line-height: 1.5;
        color: #fff;
    }

    .traslate {
        margin-left: 24px;
        margin-right: 18px;
    }

    .top-heading h1 {
        font-size: 20px;
        line-height: 25px;
        font-weight: 500;
    }

    .top-heading h6 {
        font-size: 15px;
        line-height: 32px;
        letter-spacing: 2px;
    }

    .top-heading p {
        font-family: "Arial Nova", Arial, sans-serif;
        font-size: 15px;
        line-height: 25px;
        max-width: 1200px;
        margin: 17px;
        margin-top: 17px;
        margin-top: 17px;
        padding: 0px 0px;
        text-align: center;
    }

    .intro-slide2 .banner-subtitle {
        font-size: 10px;
        line-height: 1.1;
    }

    .intro-slide2 p {
        font-size: 12px;
        line-height: 1.33;
    }

    .intro-slide2 .banner-title {
        font-size: 12px;
        margin-right: -2px;
    }

    .intro-slider .banner figure {
        height: 24rem;
        overflow: hidden;
    }

    .owl-carousel .slide-animate.show-content {
        visibility: visible;
        opacity: 1;
        margin-top: -6px;
        margin-bottom: 6px;
        font-size:14px;
    }

    .intro-slider .banner .btn {
        font-size: 10px;
    }

    .col-sm-6 {
        width: 50%;
    }

    .col-sm-12 {
        width: 100%;
    }


    .career-actiontblue {
        height: 298px;
        background-color: #000066 !important;
        margin-bottom: 47px;
    }


    .banner-background .banner-title {
        margin-bottom: 0.7rem;
        font-size: 2em;
        letter-spacing: -0.025em;
    }

    .banner-background p {
        margin-bottom: 2.8rem;
        font-weight: 500;
        font-size: 14px;
    }


    .banner-background h1 {
        font-size: 25px;
    }

    .bluebtn {
        z-index: 4 !important;
        position: absolute;
        bottom: 0px;
        color: white !important;
        text-align: center !important;
        display: flex;
        justify-content: center;
        padding: 1em 0;
        background-color: #166cd7;
        font-family: "Arial Nova", Arial, sans-serif;
        font-size: 1.4rem;
        font-weight: 500;
        line-height: 1.2;
        letter-spacing: 1px;
        text-transform: uppercase;
        transition: opacity 0.3s;
        margin-left: 0px;
        border-radius: 0px 0px 19px 19px;
        width: 100%;
    }

    .margitp {
        margin-left: 0px !important;
        margin-bottom: -24px !important;
    }

    .product-single .product-name {
        font-size: 20px;
    }

    .product-single .btn-compare, .product-single .btn-wishlist {
        font-size: 10px;
    }

    .tubing_bg1 {
        margin-bottom: 10px;
    }

    .kest_bg2 {
        margin-bottom: 10px;
    }

    .community-section {
        display: block;
    }

    .social-links {
        /*   margin-left: 25%;*/
        margin-bottom: 12px;
    }

    .banner-content h4 {
        font-size: 12px;
    }

    .btn-primary {
        color: #fff;
        border-color: #26c;
        background-color: #26c;
        font-size: 12px;
    }

    .product-navigation .breadcrumb {
        font-size: 12px;
    }

    .member img {
        height: 14em;
        width: 23em;
        margin-bottom: -80px;
    }

    .kest_bg3 {
        margin-bottom: 12px;
    }

    .kest-app {
        height: auto;
        margin-bottom: 12px;
    }

    .banner figure img {
        display: block;
        width: 100%;
        height: auto;
        margin-bottom: 12px;
    }

    .Conversion-text {
        font-size: 18px;
        line-height: 1.6;
        text-align: justify !important;
    }

    .sizes-table td, th {
        font-size: 11px;
    }

    .btn-cate span {
        font-size: 11px;
        color: white;
        font-weight: 700;
        margin-top: 12px;
    }

    .btn-cate {
        margin-bottom: 20px;
    }


    .margin-btn {
        margin-left: 5px;
    }


    /*banner related */
    .intro-slide3 .banner-title {
        font-size: 30px;
    }

    .intro-slide3 .banner-subtitle {
        font-size: 20px;
    }
    /*
    .none-moblie{
        display:none;
    }*/


    /*responsive kest tank*/

    .kest-content .dis {
        display: flex;
    }

        .kest-content .dis h4 {
            color: #000066;
            text-align: center;
            font-size: 9px;
            margin-bottom: 6px;
        }

        /*    .kest-content .dis img {
        height: 102px;
        margin-top: 0px;
        margin-bottom: 21px;
       margin-left: 10px !important;
       margin-right: 10px !important;
    }*/

        .kest-content .dis img {
            height: 75px;
            margin-top: 24px;
            margin-bottom: auto;
            margin-right: 6px !important;
        }

        .kest-content .dis p {
            font-size: 9px;
            text-align: justify;
        }

    .kest-tank {
        width: 63%;
        height: 110%;
        margin-left: -27px;
    }


    .product-kest1:hover {
        width: 655px;
        height: auto;
    }

        .product-kest1:hover .kestproduct-text1 {
            display: block;
            margin-left: 27%;
            margin-right: 48%;
            border: 1px solid #c9c8c8;
            padding: 5px 5px 5px 5px;
            background-color: white;
            margin-top: -36%;
        }

    .product-kest2:hover {
        width: 655px;
        height: auto;
    }

        .product-kest2:hover .kestproduct-text2 {
            display: block;
            margin-left: 27%;
            margin-right: 48%;
            border: 1px solid #c9c8c8;
            padding: 5px 5px 5px 5px;
            background-color: white;
            margin-top: -32%;
        }



    .product-kest3:hover {
        width: 655px;
        height: auto;
    }

        .product-kest3:hover .kestproduct-text3 {
            display: block;
            margin-left: 27%;
            margin-right: 48%;
            border: 1px solid #c9c8c8;
            padding: 5px 5px 5px 5px;
            background-color: white;
            margin-top: -29%;
        }


    .product-kest4:hover {
        width: 655px;
        height: auto;
    }

        .product-kest4:hover .kestproduct-text4 {
            display: block;
            margin-left: 27%;
            margin-right: 48%;
            border: 1px solid #c9c8c8;
            padding: 5px 5px 5px 5px;
            background-color: white;
            margin-top: -26%;
        }


    .product-kest5:hover {
        width: 655px;
        height: auto;
    }

        .product-kest5:hover .kestproduct-text5 {
            display: block;
            margin-left: 27%;
            margin-right: 48%;
            border: 1px solid #c9c8c8;
            padding: 5px 5px 5px 5px;
            background-color: white;
            margin-top: -21%;
        }

    .line-style1 {
        margin-top: -57%;
        margin-right: -10em;
        border: 3px solid #ecebec;
        width: 0%;
        position: absolute;
        z-index: 19;
        margin-left: 46%;
        display: block;
        color: white;
        border-radius: 35%;
    }

    .line-style2 {
        margin-top: -49%;
        margin-right: -10em;
        border: 3px solid #ecebec;
        width: 0%;
        position: absolute;
        z-index: 19;
        margin-left: 30%;
        display: block;
        color: white;
        border-radius: 35%;
    }


    .line-style3 {
        margin-top: -44%;
        border: 3px solid #ecebec;
        width: 0%;
        position: absolute;
        z-index: 19;
        margin-left: 28%;
        display: block;
        color: white;
        border-radius: 35%;
    }


    .line-style4 {
        margin-top: -36%;
        margin-right: -10em;
        border: 3px solid #ecebec;
        width: 0%;
        position: absolute;
        z-index: 19;
        margin-left: 30%;
        display: block;
        color: white;
        border-radius: 35%;
    }


    .line-style5 {
        margin-top: -28%;
        margin-right: -10em;
        border: 3px solid #ecebec;
        width: 0%;
        position: absolute;
        z-index: 19;
        margin-left: 33%;
        display: block;
        color: white;
        border-radius: 35%;
    }


    .line-style6 {
        margin-top: 11%;
        border: 2px solid #ecebec;
        position: absolute;
        margin-left: -10%;
        display: block;
        color: white;
        width: 100%;
        z-index: -2;
    }

    .line-style7 {
        margin-top: 11%;
        border: 2px solid #ecebec;
        position: absolute;
        margin-left: -24%;
        display: block;
        color: white;
        width: 22%;
        z-index: 0;
    }

    .line-style8 {
        margin-top: 10%;
        border: 2px solid #ecebec;
        position: absolute;
        margin-left: -25%;
        display: block;
        color: white;
        width: 23%;
    }

    .line-style9 {
        margin-top: 12%;
        border: 2px solid #ecebec;
        position: absolute;
        margin-left: -24%;
        display: block;
        color: white;
        width: 22%;
    }

    .line-style10 {
        margin-top: 10%;
        border: 2px solid #ecebec;
        position: absolute;
        margin-left: -20%;
        display: block;
        color: white;
        width: 19%;
    }

    /*responsive kest tank*/

    .enquiry {
        padding: 10px;
    }

    .enquiry-form {
        padding: 20px;
    }

    .btn-primary1 {
        color: #26c;
        border-color: white;
        background-color: white;
        font-size: 10px;
        padding: 12px;
    }

    .map-point {
        display: inline-block;
        position: absolute;
        top: -10px;
        left: -10px;
        width: 10px;
        height: 10px;
        background: #ecebec;
        border-radius: 100%;
        cursor: pointer;
        border: 2px solid #26c;
        z-index: 0 !important;
    }

    #pic .shape1 a:hover {
        border: 1px solid #006;
        background-color: gray;
        height: 99%;
        width: 35%;
        opacity: 0.2;
    }

    #pic .shape2 a {
        top: 0px;
        left: 35%;
    }

        #pic .shape2 a:hover {
            border: 1px solid #006;
            background-color: gray;
            height: 99%;
            width: 18%;
            opacity: 0.2;
        }

    #pic .shape3 a {
        top: 0px;
        left: 53%;
    }

        #pic .shape3 a:hover {
            border: 1px solid #006;
            background-color: gray;
            height: 99%;
            width: 10%;
            opacity: 0.2;
        }

    #pic .shape4 a {
        top: 0px;
        left: 64%;
    }

        #pic .shape4 a:hover {
            border: 1px solid #006;
            background-color: gray;
            height: 99%;
            width: 36%;
            opacity: 0.2;
        }

    .app-area .hover-txt {
        display: none;
        margin-top: -73%;
    }

    .app-area h4 {
        font-size: 10px;
    }

    .hover-txt h6 {
        font-size: 12px;
        color: #006;
        background-color: #f4f4f4;
        padding: 12px;
        text-align: center;
    }


    .map-location-details {
        display: none;
        background: #fff;
        padding: 5px;
        border: 1px solid #ccc;
        border-radius: 6px;
        box-shadow: 0 0px 20px rgba(0,0,0,0.1);
        height: auto;
        width: 287px;
        margin-top: 0%;
        margin-left: -83%;
    }

    .nyc1 {
        top: 10%;
        left: 90%;
    }

    .nyc2 {
        top: 30%;
        left: 62%;
    }

    .nyc3 {
        top: 44%;
        left: 62%;
    }

    .nyc4 {
        top: 60%;
        left: 65%;
    }

    .nyc5 {
        top: 72%;
        left: 71%;
    }


    .sizes-table td, th {
        font-size: 12px;
    }


    .app-area:hover .text-style {
        font-size: 11px;
        color: #006;
        background-color: #f4f4f4;
        padding: 7px 5px 1px 5px;
        text-align: center;
        display: block;
        margin-top: -71%;
    }

    .app-area .text-style h6 {
        color: #006;
        font-size: 10px;
    }

    .app-area .filter1 {
        height: 200%;
        width: 65%;
        margin-top: 62% !important;
    }

    .app-area .filter2 {
        height: 200%;
        width: 34%;
        margin-top: 62% !important;
        margin-left: -34%;
    }


    .app-area .filter3 {
        height: 200%;
        width: 20%;
        margin-top: 17% !important;
        margin-left: 100%;
    }


    .app-area .filter4 {
        height: 200%;
        width: 69%;
        margin-top: 31% !important;
        margin-left: 20%;
    }


    .app-area .hover-txt {
        display: none;
        margin-top: 56%;
    }

    .app-area .heading :hover {
        font-size: 10px;
        padding: 11px;
    }

    .intro-slide1 .banner-title {
        font-size: 30px;
    }

    .intro-slide1 .banner-subtitle {
        font-size: 20px;
    }


    .phra-heading {
        text-align: center;
        font-size: 14px;
    }

    .events td, th {
        font-size: 10px;
    }

    .text-single {
        font-size: 25px;
    }

    .login-popup {
        padding: 0rem !important;
    }

    .brandkestp {
        font-weight: 500 !important;
        font-size: 14px !important;
    }


    .hide-m {
        display: none;
    }

    .box-filter {
        background-color: white;
        box-shadow: 0 0 10px 0 rgb(203 225 231 / 85%);
        height: auto;
        margin-top: 0px;
        margin-bottom: 0px;
        padding: 25px;
    }

    .intro-slide3 .brand-margin {
        margin-top: 117px !important;
    }

    .intro-slide3 .brand-title {
        font-size: 2em !important;
    }

    .banner-small {
        height: 13rem !important;
        object-fit: cover;
        width: 100%;
    }

    .intro-slide3 .banner-content1 {
        margin-top: 100px !important;
        margin-right: 0%;
    }

    .intro-slide3 .banner-smallh {
        font-size: 15px;
        line-height: 1.1;
    }

    .banner-smallh2 {
        font-size: 13px !important;
        line-height: 1.1;
    }

    .intro-slider figure {
        height: 175px;
    }

    .demo1 .mbset {
        margin-top: 50px;
        margin-bottom: 50px;
    }

    .brand .mbset {
        margin-top: 50px;
        margin-bottom: 50px;
    }

    .enquiry-form {
        margin-top: -8px;
    }

    .intro-slide2 .banner-content {
        max-width: 38rem;
        right: 0.5%;
        margin-top: 33px;
    }

    .intro-slide3 figure::after {
        background: none;
    }

    .intro-slide2 figure::after {
        background: none;
    }

    .top-heading1 p {
        padding: 0 !important;
    }

    .page-title {
       font-size: 30px;
    }

    .header-middle {
        padding-bottom: 0.7rem;
    }

    .intro-slider .banner img, .intro-slider .banner video {
        height: 20rem;
        object-fit: contain;
        width: 100%;
    }

    .contact-us .grey-section {
        padding: 23.5rem 3.2rem 1.4rem;

        height: 28em !important;
        margin-top: -105px;
    }

    .settingscroller1 {
        height: auto;
        width: auto;
    }

    .settingscroller2 {
        height: 20em;
        width: auto;
    }

    .heading-text h3 {
        color: #006;
        text-shadow: 1px 1px 3px #fff;
        font-size: 20px;
    }

    .applynowcontent h3 {
        color: white !important;
        font-size: 20px;
    }

    .applyarea h3 {
        font-size: 20px;
    }

    .container > .login-popup h3 {
        font-size: 20px;
        padding-top:12px;
    }

    .settingscroller3 {
        height: 13em;
        width: 28em;
    }

    .owl-dot-inner .owl-dots {
        position: absolute;
        bottom: 5.5rem;
        left: 50%;
        transform: translateX(-50%);
    }

    .b1 {
        font-size: 15px !important;
        width: 17em;
        font-weight: 500;
        text-align: left !important;
        color: #666;
        background-color: #f4f4f4;
        padding: 12px;
        width: 10em;
    }

    .tablespecification, td th {
        text-align: left !important;
        font-size: 15px;
        color: #666;
    }

    .hose-box {
        height: auto;
        border-radius: 12px;
    }

    .widthboxes {
        width: auto;
    }


    .overlay {
        position: fixed;
        top: -12%;
        bottom: 0;
        left: -3em;
        right: -3em;
        transition: opacity 500ms;
        visibility: hidden;
        opacity: 0;
        z-index: 19;
    }

    .sticky-icon-links, .demos-list {
        display: block !important;
    }

}