@media only screen and (min-width: 1170px) {
  
}

@media only screen and (min-width:1003px) and (max-width:1024px)
{
    #header{padding: 15px 0 0 0;}
    #header .navbar-brand{margin: 0; }
    #main-menu ul{margin: 15px 0 0;}
    #main-menu ul li{margin-left: 50px;}
    #main-menu ul li a{font-size: 110%; padding: 0 0 45px;}
    #main-menu ul li.submenu-one:hover > ul{top: 65px;}

    #banner .banner-title p{font-size: 45px; line-height: 50px;}
    
    #product-block .item .block .title{font-size: 100%;}
    .block-outer .item{margin: 10px; }
    .block-outer .owl-buttons{right: 0; left: 0;}
 
}
@media only screen and (min-width:768px) and (max-width:1002px)
{
    #main-menu{display: none;}
    
    #mobile-menu #main-menu{display: block;}

    #wrapper{ width:100%; position:relative; box-shadow:0 0 10px 10px rgba(0,0,0,.2); z-index:10; background:#fff;  }
    #mobile-menu-icon{display: block; top: 20px;}
    #mobile-menu {display:block;}


    body#page{overflow-x: hidden; position: relative; right: 0;}
    body#page.active {left:0;}
    body#page.active #header{ right:250px;} 
    #header{padding: 10px 0;}
    #header #main-menu{ display:none !important;} 
    #header .navbar-brand{margin: 0;}
    #header .container{ width: 100%;}

    #mobile-menu{position: fixed; width: 250px; top: 0; height:100%; z-index:2; overflow-y: scroll; background-color:#E5E5E5; right: -250px;}
    #mobile-menu.active{right:-250px;}

    #mobile-menu #main-menu{ display:block !important;}
    
    #header .navbar-brand{margin: 0; max-width: 140px;}
    #banner .banner-title p{font-size: 30px; line-height: 35px;}
    
    #product-block .item .block .title{font-size: 100%;}
    .basic-title{max-width:90%;}
    .block-outer .item{margin: 10px; }
    .block-outer .owl-buttons{right: 0; left: 0;}

/*    #main-menu ul{ margin:0;}
    #main-menu{ float:none; padding:0; border: none; box-shadow: none;}
    #main-menu ul{ float:none !important;} 
    #main-menu ul li{ float:none; padding:0; margin:0; border:none; position:relative; border-bottom:1px solid #283230;}
    #main-menu ul li ul li ul{ border:none;}
    #main-menu ul li a{ text-transform:capitalize; -moz-border-radius:0; -webkit-border-radius:0; border-radius:0; font-size:100%; border-bottom:none; padding:12px 20px; display:block; color:#dbdbdb; text-transform:none; font-weight:400; background-color:#495965; margin-bottom:0;}
    #main-menu ul li ul li a{border-bottom:none; color:#f0f0f0; font-size:100%; text-decoration:none;}
    #main-menu ul li.active ul li a{ color: #f0f0f0;}
    #main-menu ul li ul li a:hover{ color: #f0f0f0;}
    #main-menu ul li > a:hover, #main-menu ul li.active > a{ color:#fff; border-bottom:none; background-color:#2aa687;}
    #main-menu ul li.changebg > a{ color:#fff;}
    #main-menu ul li:hover > a{ border-bottom:none;}
    #main-menu ul li a .submenu{ position:absolute; width:42px; height:42px; right:0; top:1px; display:block;  cursor:pointer; -moz-transition:transform 0.3s ease-in-out;  -webkit-transition:transform 0.3s ease-in-out;  transition:transform 0.3s ease-in-out; }
    #main-menu ul li a .submenu:before,#main-menu ul li a .submenu:after{ content:""; background-color:#fff; display:block;  -moz-transition:transform 0.3s ease-in-out;  -webkit-transition:transform 0.3s ease-in-out;  transition:transform 0.3s ease-in-out; }
    #main-menu ul li a .submenu:before{ width:2px; height:15px; position:relative; left:20px; top:12px;}
    #main-menu ul li a .submenu:after{ width:15px; height:2px; position:relative; left:13px; top:4px;}
    #main-menu ul li.changebg>a>.submenu:before { transform:rotate(-90deg);}
    #main-menu ul li.changebg>a>.submenu:after { display:none;}

    #main-menu ul li > ul{ padding:0; border:none;}
    #main-menu ul li.submenu-one:hover > ul{ top:0;}
    #main-menu ul li.submenu-one ul{margin-bottom: -1px;}
    #main-menu ul li ul,#main-menu ul li:hover>ul,#main-menu ul li ul li ul,#main-menu ul li ul li:hover>ul{ width:auto; display:none; opacity:1; position:relative; left:0; top:0; visibility:visible; transition:none; box-shadow:none;}
    #main-menu ul li ul li a{ padding:12px 30px;}
    #main-menu ul li ul li ul li a{padding:12px 40px;}
    #main-menu ul li ul li{ border-bottom:1px solid #283230;}*/

/*    #banner ul,#banner ul li{ height: 430px;}
    #banner ul li .banner-img{top:80px; position: relative;}
    #banner .banner-title{background-color: transparent; padding:0 30px;}
    #banner .banner-txt{ height: 60px; line-height: 60px;}
    #banner .bx-wrapper .bx-controls-direction a{ height: 59px;}
    #banner .bx-wrapper .bx-controls-direction a{width: 30px;}
    #banner .gold-coin{ bottom:70px; right: 20px;}
    #banner .gold-coin img{max-width: 30%;}
    #banner .banner-txt{ font-size: 130%;}*/

    #banner ul li{background-size: cover; height: 400px;}
    #banner .slide01 .banner-title.title01 p:first-child{font-size:20px; line-height: 25px;}
    #banner .slide01 .banner-title.title01 p:first-child .red-txt{font-size: 45px;}
    #banner .slide01 .banner-title.title01 p{font-size: 40px; line-height: normal;}
    
    #banner .slide02 .banner-image{max-width1: 250px; max-width: 170px; right: 0; left: 0; top: 120px;}
    #banner .slide02 .banner-title{max-width: 100%; top: 50px;}
    #banner .slide02 .banner-title .title,#banner .slide06 .banner-title p,#banner .slide02 .banner-title .title{font-size: 34px; line-height: 40px; margin-bottom: 20px;}
    #banner .slide02 .banner-title .title br{display: none;}
    #banner .slide02 .banner-title p,#banner .slide02 .banner-title p.large{font-size: 18px; line-height: 24px;}
    #banner .slide06 .banner-image {left: 0;}
    #banner .slide02 .name{font-size: 16px;}
    #banner .slide02 .name br{display: none;}
    #banner .slide02 .banner-title p.large br{display: none;}


    #banner .slide03 .banner-image{max-width:330px; right: 0; left: 0; top:70px;}
    #banner .slide03 .banner-title{max-width: 100%; top: 30px;}
    #banner .slide03 .banner-title .title{font-size: 38px; line-height: 45px; margin-bottom:10px;}
    #banner .slide03 .banner-title p{font-size: 18px; line-height: 24px;}
    #banner .slide03 .banner-title a{font-size: 15px; line-height: 22px; margin-top: 10px;}
    
    .side-menu{display: none;}
    .about-info p{ font-size: 130%;}

    #home-bottom .support,#home-bottom .download{background-size: 100% auto;}
    #home-bottom .support .details{max-width: 260px;}
    #home-bottom .download .details{ max-width: 100%;}
    .title-wrap .gold-coin{right: 0;}
    .title-wrap .gold-coin img{max-width: 60%;}
    .about-info{width: 90%;}
    .main-title h1{width: 80%;}

    form .btn-set{float: left; margin-top: 0;}
    form .btn-set .submit-btn{float: left; margin: 0 12px 0 0;}
    #banner-inner .title-outer{margin: 15px 0;}
    .about-us .help-outer{top: 0;}
    .get-help{}
    .stackholder-slider .owl-buttons{left: 0; right: 0;}
    .row-flex{display: block;}
}


@media only screen and (max-width:767px)
{
    #wrapper{ width:100%; position:relative; box-shadow:0 0 10px 10px rgba(0,0,0,.2); z-index:10; background:#fff;  }
    #header{padding:10px 0;}
    #header #main-menu{ display:none !important;} 
    #header .navbar-brand{margin: 0; width:140px; }
   
    #main-menu{display: none;}
    #mobile-menu{display: block;}
    #mobile-menu #main-menu{ display:block !important;}
    #mobile-menu-icon{ display: block; top: 20px;}
    
    #mobile-menu{position: fixed; width: 250px; top: 0; height:100%; z-index:2; overflow-y: scroll; background-color:#E5E5E5; right: -250px;}
    #mobile-menu.active{right:-250px;}

    #banner-inner1{min-height: 200px; background-size:cover;}
    #banner-inner.product-page .breadcrumb,#banner-inner .breadcrumb{display: none;}
    #banner-inner{min-height: 180px; background-position: center center;}
    #banner-inner h1{font-size:250%; }
    #banner-inner.product-page .title-outer h2{ font-size: 150%;}
    #banner-inner .title-outer{margin: 30px 0 0;}
    .get-help {font-size: 170%; height: 100px; line-height: 90%; padding: 30px 0 25px 20px; width: 100px; background-size: cover;}
    .product-pic{padding-top: 110px;}
    
    #tab-outer{min-height: aut0; margin: 50px 0;}
    
    #sidebar{display: none;}
/*    #banner ul,#banner ul li{ height: 540px;}
    #banner ul li{ background-size: cover;}
    #banner .banner-title{left: 10px; right: 10px;top: 10px;}
    #banner .banner-title p{font-size: 20px; line-height: 25px; font-weight: 300;}
    #banner .banner-title p br{display: none;}
    #banner .bx-wrapper .bx-controls .bx-pager .bx-pager-item{margin-bottom: 0;}
    #banner .bx-wrapper .bx-controls .bx-pager .bx-pager-item a{margin: 0 5px;}*/
    
    .pd-logo{width: 80px; padding: 5px; border-radius: 5px;}

    #banner ul li{background-size: cover; }
    #banner ul,#banner ul li{height: 400px; background-position: 44% bottom;}
    #banner .banner-title .title span,#banner .slide02 .name{font-size: 13px; line-height: 18px; margin-top: 5px;}
    #banner .slide02 .name br{display: none;}
    #banner .slide02 .name{margin-top: 50px; margin-bottom: -20px; text-align: left;}
    #banner .slide01 .banner-title{top: 20px;}
    #banner .slide01 .banner-title.title01 p:first-child{font-size:16px; line-height: 22px;}
    #banner .slide01 .banner-title.title01 p:first-child .red-txt{font-size:22px;}
    #banner .slide01 .banner-title.title01 p{font-size: 18px; line-height: normal; left: 0; margin-left: 0;}
    #banner .slide02 .banner-title .title br{display: none;}
    #banner .slide02 .banner-title .title,#banner .slide06 .banner-title p{font-size: 16px; line-height: 20px; margin-bottom: 10px;}
    #banner .slide02 .banner-title p,#banner .slide02 .banner-title p.large{display1: none; font-size: 11px; line-height: 18px;}
    
    #banner .slide02 .banner-image{max-width: 40%; left: 0; right: 0; top: 20px;}
    #banner .slide02 .banner-title{max-width: 100%; top: 30px;}
    #banner .slide02 .banner-title .title br{display: none;}
    #banner .slide06 .banner-image{left: 0;}
    
    #banner .slide03 .banner-image{max-width: 45%; top: 20px; left: 0; right: 0;}
    #banner .slide03 .banner-title{top: 25px;}
    #banner .slide03 .banner-title .title{ font-size: 16px; line-height:22px; margin-bottom: 10px;}
    #banner .slide03 .banner-title .title span{font-size: 13px;}
    #banner .slide03 .banner-title p{font-size: 11px; line-height: 18px;}
    #banner .slide03 .banner-title a{position:absolute; right: 0; top: 0; font-size: 14px; line-height:18px; margin-top: 10px;}
    .basic-title p{font-size: 110%;}
    .block-outer .owl-buttons{top: -40px;}
    
    #content .large h3{margin: 20px 0; min-height: auto;}
    #content .large h3 br{display: none;}
    
    #product-slider .owl-buttons{left: 0; right: 0;}
    #product-block-inner h3{font-size: 140%; width: 90%;}
    
    .download-block{padding: 20px; margin: 0 0 60px;}
    form .btn-set{ margin-top:10px}
    
    .solution-type{margin: -58px 0 20px;}
    .solution-type li{font-size: 120%; margin: 0 5px 10px; padding: 10px; height: 85px; width: 100px;}
    #solution-block .info{margin: 0;}
    #solution-block .info h2{ font-size: 200%; margin:15px 0 10px 0;}
    #solution-block .info p{font-size: 120%;}
    #solution-block .info .btn-set .btn{margin-top:35px; font-size: 130%;}
    .block-outer .owl-buttons{ left: 0; right: 0;}
    
    #product-block .item{ margin:0 10px;}
    #product-block .item .pro-img img{max-width: 100%;}
    #product-block .item .block .title{font-size: 110%;}
    #what-we-do h2{font-size: 250%;}
    #what-we-do .info{width: 100%;}
    
    #product-slider .item{ margin:0 10px;}
    
    #home-bottom .left-block{width: 100%;}
    #home-bottom #slider{max-width: 95%;}
    #home-bottom #slider .owl-item li{ margin:5px;}
    #slider .owl-prev{left: -30px;}
    #slider .owl-next{right: -30px;}
    #download-block a{font-size: 130%; padding: 10px; margin-top: 10px;}
    
    #home-bottom .service-block,#home-bottom .update-block{ height: auto; padding:30px 15px; }
    #home-bottom .right-block{width: 100%; margin: 0;}
    #service-list{ text-align: center;}
    /* #service-list li{margin: 0 2%; width:28.5%; display: inline-block; vertical-align: top; float: none;  }
    #service-list li:first-child{margin: 0 2%;} */
    #service-list li .circle-bg{width: 131px; height: 130px;background-size: cover; margin: 0 auto;}
    #service-list li img{left: 14px; top: 13px;}
    #service-list li p{font-size: 110%; margin:20px auto 0; width: 100%; }
    
    footer{padding: 15px 0;}
    footer .copyright{font-size: 110%;}
    #footer-links h3.title{display: block; margin-bottom:15px; cursor: pointer;}
    #footer-links h3{display: none;}
    #footer-links h3 span{display: block;}
    footer .address{text-align: center;}
    footer .copyright{text-align: center; font-size: 100%; margin-top: 10px;}
    footer .designed-by{text-align: center;}
    #footer-links ul{display: none;}
    #footer-links ul li a:hover, #footer-links ul li a:focus{text-indent: 0;}
    
    #banner-inner.product-page{background-position: center top;}
    .about-us .help-outer{top: 40px; right: 20px;}
    
    #banner .bx-wrapper .bx-controls .bx-pager{bottom: 0;}
    #banner .bx-wrapper .bx-controls .bx-pager .bx-pager-item a{margin: 0 5px;}
    
    #enquiry-form{padding: 20px;}
    form .btn-set{float: left;}
    form .btn-set .submit-btn{float: left; margin: 0 12px 0 0;}
    
    
    .address-details h3{width: auto; font-size: 150%;}
    
    .d-table{display: block;}
    .d-cell{display: block;}

    #home-bottom .row.no-gutters{flex-direction: column;}
    .stackholder-slider .owl-buttons{left: 0; right: 0;}
    .row-flex{display: block;}
    .pg-size .flex-row{display: block;}
    #mobile-menu ul{display: block;}
    .stackholder-slider .owl-nav{left: 0; right: 0;}
    #mobile-menu ul li.inquiry-link { margin: 10px; border: none;}
}


@media only screen and (max-width:640px) {
   #product-block .item .block .title{font-size: 100%;} 
   #product-block-inner .item .block .title{font-size: 100%;} 
   .basic-title{max-width: 490px;}

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

    #news-block [class^="col-"]{ width:100%;} 
    #home-bottom #slider{max-width: 280px;}
    #slider .owl-buttons{top: 20%;}
    #slider .owl-next{right: -10px;} 
    #slider .owl-prev{left: -10px;} 
    
    #download-block [class^="col-"]{ width:100%;} 
    #home-bottom .service-block, #home-bottom .update-block{background-size: cover;}
    #service-list{text-align: center;}
    #service-list li,#service-list li:first-child{width: 47%; margin: 0 1%; display: inline-block; vertical-align: top;}
    #service-list li .circle-bg{margin: 0 auto;}
    #service-list li p{margin: 10px auto 30px;}
    .solution-type li{font-size: 80%; width: 80px; height: 70px;}
    #solution-block .info h2{font-size: 170%;} 
    
}

@media only screen and (max-width:767px) and (orientation: landscape) {
    

}

@media only screen and (max-width:767px) and (orientation: portrait){
    
}

@media only screen and (max-width:480px) and (orientation: landscape) {
/*    #banner ul,#banner ul li{height:250px;}
    #banner ul li .banner-img{ top: 20px;}*/
    

}

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

/*    #banner ul,#banner ul li{height: 200px;}
    #banner ul li .banner-img{ top: 20px;}*/
    .input-group-addon, .input-group-btn, .input-group .form-control{display: inline;}
    .form-group.has-captcha .input-group-addon{display: inline-block; margin-top: 5px; width: auto;}
    
}