﻿body {
}


#logo{  margin-top:-25px;}
.footer img { display:none;}

.qr_outer{position:fixed; width:100%; height:100%; background-color:rgba(0, 0, 0, 0.5); z-index:1009;}
.qr_inner{width:60%; margin:80px auto; background-color:#fff; border-radius:10px; padding:10px;}
.qr_head{text-align:center;font-size:22px;font-weight:bold;}
.flex{display:flex; align-items: center;width:100%;height:100%;}
.qr_imgouter{width:40%;}
.qr_co{font-size:15px;font-weight:bold;text-align:center;padding-bottom:5px;}
.or{width:20%;font-size:15px;text-align:center;color:grey;}
.qr_button{width:30%;margin-left:20px;}
.qr_catelog {  width: 90%;color: #fff;background-color: #009933; padding: 7px 20px;cursor: pointer;
   border-radius: 5px;font-size: 15px;text-align:center; }
.qr_arrow{position:absolute;top:10px;right:10px;width:30px;cursor:pointer;}
.display_no{display:none;}

.download_catelog {
    width: auto;
    float: left;
    color: #fff;
    background-color: #009933;
    padding: 7px 20px;
    margin-right: 30px;
    cursor: pointer;
    border-radius: 5px;
    font-size: 15px;
    display:none;
}
.download_catelog1 {
    width: auto;
    float: left;
    color: #fff;
    background-color: #009933;
    padding: 7px 20px;
    margin-right: 30px;
    cursor: pointer;
    border-radius: 5px;
    font-size: 15px;
    
}
    .card-gallery {
            width: 98%;
            display: block;
            float: left;
            box-sizing: border-box;
            /*background-color: white;*/
            /*padding: 20px;*/
            margin-left: 10px;
            margin-top: 25px;
            margin-right: 10px;
            margin-bottom: 5px;
            min-height:490px;
        }
/* Extra small devices (phones, 600px and down) 
        @media only screen and (max-width: 600px) {
        }

         Small devices (portrait tablets and large phones, 600px and up) 
       @media only screen and (min-width: 600px) {
        }

         Medium devices (landscape tablets, 768px and up) 
       @media only screen and (min-width: 768px) {
        }

         Large devices (laptops/desktops, 992px and up) 
       @media only screen and (min-width: 992px) {
        }

         Extra large devices (large laptops and desktops, 1200px and up) 
        @media only screen and (min-width: 1200px) {
        }*/
.mobile_device_header {
    display: flex;
    width: 100%;
    min-height: 17vh;
    background-color: rgba(0, 0, 0, 0.4);
    position: fixed;
    z-index: 3;
}

.searchform-mobile {
    width: 100%;
    /*display: inline-block;*/
    margin-right: 1vw;
}

    .searchform-mobile .input-group {
        width: 240px;
    }

    .searchform-mobile .btn {
        color: rgba(200,200,200,.5);
        border: 1px solid transparent;
        background-color: #009933;
    }

    .searchform-mobile .form-control {
        border: 0;
        background-color: #fff;
        color: #000;
        width: 160px !important;
        -webkit-transition: all .5s ease;
        -moz-transition: all .5s ease;
        transition: all .5s ease;
    }

        .searchform-mobile .form-control:hover, .searchform-mobile .form-control:focus {
            width: 160px !important;
        }

.product-description {
    display: flex;
    flex-direction: row;
    width: 100%;
}

.product-description-sub {
    width: 50%;
}

.news-events-row {
    display: flex;
    flex-direction: row;
    width: 100%;
}

.news-events-column-1 {
    width: 65%;
}

.news-events-column-2 {
    width: 30%;
}

.sub-card-sub-padding-container {
    display: flex;
    flex-direction: row;
    width: 100%;
}

.sub-card-sub-padding-div {
    width: 50%;
}

.row-column {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.column-4 {
    width: 33.33%;
    padding: 10px;
}

.column-8 {
    width: 66.66%;
    padding: 10px;
}

.log-menu {
    width: 130px;
    height: auto;
}
/*.col-content{
            width:60%;
        
        }*/

/*.row > .elements:nth-child(2) {
     float:right;   
    }*/
/*#241f1f*/
#menu {
    height: 45px;
    border: 1px solid #1a1616;
}

    #menu ul, #menu li {
        margin: 0;
        padding: 0;
        list-style: none;
    }

    #menu ul {
        height: 45px;
    }

#menu {
    width: 100%;
}

    #menu li {
        float: left;
        display: inline;
        position: relative;
        font: bold 13px Arial;
    }

    #menu a {
        display: block;
        line-height: 45px;
        padding: 0 14px;
        text-decoration: none;
        color: #ccc;
    }

    #menu ul li:hover a {
        background: #009933;
        color: #fff !important;
    }

    #menu input {
        display: none;
        margin: 0 0;
        padding: 0 0;
        width: 100%;
        height: 45px;
        opacity: 0;
        cursor: pointer;
    }

    #menu label {
        font: bold 30px Arial;
        display: none;
        width: 100%;
        padding-left: 15px;
        height: 45px;
        line-height: 45px;
        text-align: left;
        color: #fff;
    }

        #menu label span {
            font-size: 13px;
            position: absolute;
            right: 5px;
            text-align: end;
            width: 100%;
        }

    #menu ul li ul {
        height: auto;
        overflow: hidden;
        position: absolute;
        z-index: 99;
        color: #333;
    }

        #menu ul li ul li a {
            color: #fff;
            width: 180px;
            height: 35px;
            line-height: 35px;
            background: #333;
        }

    #menu a.prett {
        padding: 0 27px 0 14px;
    }

        #menu a.prett::after {
            content: "";
            width: 0;
            height: 0;
            border-width: 6px 5px;
            border-style: solid;
            border-color: #ccc transparent transparent transparent;
            position: absolute;
            top: 20px;
            right: 9px;
        }

        #menu a.prett:hover::after, #menu ul li:hover a.prett::after {
            content: "";
            width: 0;
            height: 0;
            border-width: 6px 5px;
            border-style: solid;
            border-color: #333 transparent transparent transparent;
            position: absolute;
            top: 20px;
            right: 9px;
        }

    #menu ul li ul li a:hover {
        background: #BABABA;
    }

@media screen and (max-width: 1060px) {
    #menu {
        position: relative;
    }

        #menu ul {
            background: #333;
            position: absolute;
            top: 100%;
            right: 0;
            left: 0;
            z-index: 3;
            height: auto;
            display: none;
        }

            #menu ul.menus {
                width: 100%;
                position: static;
                border: none;
            }

        #menu li {
            display: block;
            float: none;
            width: auto;
            text-align: left;
        }

            #menu li a {
                color: #fff;
            }

                #menu li a:hover {
                    color: #333;
                }

            #menu li:hover {
                background: #BABABA;
                color: #333;
            }

                #menu li:hover > a.prett, #menu a.prett:hover {
                    background: #009933;
                    color: #333;
                }

        #menu ul.menus a {
            background: #009933;
        }

            #menu ul.menus a:hover {
                background: #1a1616;
            }

        #menu input, #menu label {
            position: absolute;
            top: 0;
            left: 0;
            display: block;
        }

        #menu input {
            z-index: 4;
        }

        #menu ul li ul li a {
            width: 100%;
        }
}





.col-sm-6 > .searchform-mobile:first-child {
    float: right;
}

.row-left {
    width: 30%;
    display: flexbox;
}

.row-right {
    width: 70%;
    display: flexbox;
}
/* if desktop */
.mobile_device_380px {
    display: none;
}

.mobile_device {
    display: none;
    background-color: #333;
}

/* if mobile device max width 380px  and if desktop max width 380px*/
@media only screen and (max-device-width: 380px),screen and (max-width:380px) {
    .mobile_device_380px {
        display: block;
    }

    .desktop {
        display: none;
    }
}

/* if mobile device max width 480px and if desktop max width 480px*/
@media only screen and (max-device-width: 480px), screen and (max-width:480px) {
    .mobile_device {
        display: block;
    }

    .desktop {
        display: none;
    }
}
/* if mobile device max width 510px and if desktop max width 510px*/
@media only screen and (min-device-width: 180px) and (max-device-width: 510px), screen and (min-width: 180px) and (max-width: 510px) {
    .mobile_device {
        display: block;
    }

    .desktop {
        display: none;
    }
}

/* if mobile device max width 510px and if desktop max width 510px*/
@media only screen and (min-device-width: 510px) and (max-device-width: 875px), screen and (min-width: 510px) and (max-width: 875px) {
    .mobile_device {
        display: block;
    }

    .desktop {
        display: none;
    }


    /*other detilas*/

}
/* if mobile device max width 510px and if desktop max width 510px*/
@media only screen and (min-width: 875px) and (max-width: 1060px) {
    .mobile_device {
        display: block;
    }

    .desktop {
        display: none;
    }
}

/* if mobile device max width 510px and if desktop max width 510px*/
/*@media only screen and (min-device-width: 1060px) and (max-device-width: 1250px),screen and (min-width: 1060px) and (max-width: 1250px) {


    .col-image {
        float: none;
        width: 50%;
    }

    .col-content {
        width: 50%;
        float: none;
    }

    .detail {
        margin-left: 0px;
    }
}*/

/* if mobile device max width 510px and if desktop max width 510px*/
@media only screen and (min-device-width: 150px) and (max-device-width: 1080px),screen and (min-width: 200px) and (max-width: 1080px) {

    .product-description {
        flex-direction: column;
    }

    /*.detail {
        margin-left: 0px;
        width: 100%;
    }*/

    .news-events-row {
        flex-direction: column;
    }

    .news-events-column-1 {
        width: 100%;
    }

    .news-events-column-2 {
        width: 100%;
    }

    .sub-card-sub-padding-container {
        flex-direction: column;
    }

    .sub-card-sub-padding-div {
        width: 100%;
    }
}

/*@media only screen and (min-device-width: 1475px) and (max-device-width: 1500px),screen and (min-width: 1475px) and (max-width: 1500px) {
    .column-4 {
        width:  32.33%;
    }
}

@media only screen and (min-device-width: 1450px) and (max-device-width: 1475px),screen and (min-width: 1450px) and (max-width: 1475px) {
    .column-4 {
        width: 31.33%;
    }
}
@media only screen and (min-device-width: 1425px) and (max-device-width: 1450px),screen and (min-width: 1425px) and (max-width: 1450px) {
    .column-4 {
        width: 30.33%;
    }
}

@media only screen and (min-device-width: 1400px) and (max-device-width: 1425px),screen and (min-width: 1400px) and (max-width: 1425px) {
    .column-4 {
        width: 29.33%;
    }
}

@media only screen and (min-device-width: 1375px) and (max-device-width: 1400px),screen and (min-width: 1375px) and (max-width: 1400px) {
    .column-4 {
        width: 28.33%;
    }
}*/


@media only screen and (min-device-width: 150px) and (max-device-width: 1000px),screen and (min-width: 150px) and (max-width: 1000px) {
    .column-4 {
        width: 70%;
    }

    .row-column {
        flex-direction: column;
        justify-content: center;
    }

    .carousel-item {
        /*height: 100vh;*/
        /*height: 700px;*/
        height: 350px;
    }

    .w-100 {
        height: 350px;
        /*height: 700px;*/
    }
    /*.carousel-caption {
                margin-top: 500px;
            }
    .carousel-caption {
            bottom: 10px;
            top: 200px;
        }*/

    .the-company-img {
        margin-top: -4vh;
        top: -15vh;
        left: -9vh;
        /*margin-left:-15vh;*/
    }

    .the-company-descrption {
        margin-top: -4vh;
        top: -18vh;
        left: -9vh;
    }

    .product-tumb img {
        max-width: 350px;
        max-height: 350px;
        min-width: 350px;
        min-height: 350px;
    }
    .product-tumb {
        height: 360px;
    }
    .product-details img{
    width:100%;
    height:auto;
}
    .msd img{
          max-width: 250px;
        max-height: 250px;
        min-width: 250px;
        min-height: 250px;
    }
    .msd{
 max-height: 250px;
    }
}

@media only screen and (min-device-width: 350px) and (max-device-width: 450px),screen and (min-width: 350px) and (max-width: 450px) {
    /*.log-menu {
        width: 110px;
    }*/

    .div-focussed-client-row-1 {
        align-items: center;
        justify-content: center;
    }

    .div-focussed-client-main-col {
        margin-left: 60px;
    }

    /*#container-s {
        flex-direction: column;
    }*/
    /*.div-focussed-client-main-col {
        margin-left: -60px;
    }*/
}

@media only screen and (min-device-width: 500px) and (max-device-width:700px),screen and (min-width: 500px) and (max-width: 700px) {
    /*.log-menu {
        width: 110px;
    }*/

    /*#container-s {
        flex-direction: column;
    }*/
    /*.div-focussed-client-row-1{
          align-items: center;
    justify-content:center;
    }*/
    .div-focussed-client-main-col {
        margin-left: 80px;
    }
}

@media only screen and (min-device-width: 450px) and (max-device-width: 500px),screen and (min-width: 450px) and (max-width: 500px) {
    /*.log-menu {
        width: 110px;
    }*/

    /*#container-s {
        flex-direction: column;
    }*/
    /*.div-focussed-client-row-1{
          align-items: center;
    justify-content:center;
    }*/
    .div-focussed-client-main-col {
        margin-left: 60px;
    }
}

@media only screen and (min-device-width: 150px) and (max-device-width: 370px),screen and (min-width: 150px) and (max-width: 370px) {
    /*.log-menu {
        width: 90px;
    }*/

    /*#container-s {
        flex-direction: column;
    }*/
    /*.div-focussed-client-row-1{
            align-items: center;
    justify-content:center;
    margin:0px auto;
    }*/
    /*.div-focussed-client-main-col {
        margin-left: -100px;
    }*/
    .div-focussed-client-main-col {
        margin-left: 60px;
    }
}





@media only screen and (min-device-width: 350px) and (max-device-width: 450px),screen and (min-width: 350px) and (max-width: 450px) {
    /*.log-menu {
        width: 110px;
    }*/

    .div-focussed-client-row-1 {
        align-items: center;
        justify-content: center;
    }

    .div-focussed-client-main-col {
        margin-left: 60px;
    }

    /*#container-s {
        flex-direction: column;
    }*/
    /*.div-focussed-client-main-col {
        margin-left: -60px;
    }*/
}

@media only screen and (min-device-width: 500px) and (max-device-width:700px),screen and (min-width: 500px) and (max-width: 700px) {
    /*.log-menu {
        width: 110px;
    }*/

    /*#container-s {
        flex-direction: column;
    }*/
    /*.div-focussed-client-row-1{
          align-items: center;
    justify-content:center;
    }*/
    .div-focussed-client-main-col {
        margin-left: 80px;
    }
}

@media only screen and (min-device-width: 450px) and (max-device-width: 500px),screen and (min-width: 450px) and (max-width: 500px) {
    /*.log-menu {
        width: 110px;
    }*/

    /*#container-s {
        flex-direction: column;
    }*/
    /*.div-focussed-client-row-1{
          align-items: center;
    justify-content:center;
    }*/
    .div-focussed-client-main-col {
        margin-left: 60px;
    }
}

@media only screen and (min-width: 150px) and (max-width: 1400px) {
    .log-menu {
        width: 130px;
    }
}

@media only screen and (min-device-width: 150px) and (max-device-width: 700px) {
    .log-menu {
        width: 110px;
    }
}
/*@media only screen and (min-device-width: 1325px) and (max-device-width: 1350px)
,screen and (min-width: 1325px) and (max-width: 1350px) {
    .column-4 {
        width: 26.33%;
    }
}
@media only screen and (min-device-width: 1300px) and (max-device-width: 1325px)
,screen and (min-width: 1300px) and (max-width: 1325px) {
    .column-4 {
        width: 25.33%;
    }
}*/
