@charset "utf-8";
/* CSS Document */
/* Table of Contents
-----------------------------
1. Mobile
2. iPad
3. large desktop
4. Other
*/
/* 1. Mobile responsive css 767px
-----------------------------------*/
.mobile-nav{
    display: none;
}
.cf:after, .cf:before{
    display: table;
    content: ""
}
.cf:after{
    clear: both;
}
.custom-dropdown-wrap .select-trigger{
    display: none;
}
#home_container .slider_wrapper img{
    display: block;
}
#home_container .slider_wrapper .img_wrap{
    background-size: 0;
    display: block;
}
#home_container .slider_wrapper ul li{
    height: auto;
    max-height: 635px;
    display: block !important;
}
@media (max-width: 767px){
    body{
        min-width: inherit;
    }
    .wrapper{
        width: 100%;
        padding-left: 13px;
        padding-right: 13px;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    h3{
        font-size: 22px;
    }
    .ul-logo{
        display: none;
    }
    /*----   header   ----*/
    /* mobile menu */
    .mobile-nav, #menu-trigger{
        display: block;
    }
    #menu-trigger{
        display: block;
        width: 40px;
        height: 40px;
        position: absolute;
        -ms-touch-action: manipulation;
        touch-action: manipulation;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        background-image: none;
        white-space: nowrap;
        z-index: 999;
        right: 6px;
        bottom: 18px;
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;
        transition: all 0.5s ease;
        border-radius: 5px
    }
    .mobile-nav .shield{
        position: fixed;
        top: 0;
        right: 0;
        width: 0;
        height: 100%;
        background: rgba(0, 0, 0, 0.80);
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;
        transition: all 0.5s ease;
        z-index: 99999;
    }
    .mobile-nav .shield.open{
        width: 100%;
    }
    #menu-trigger.open{
        bottom: 40px;
        z-index: 9999999;
        background: rgba(250, 250, 253, 0.60);
        position: fixed;
        top: 5px;
    }
    #menu-trigger span{
        width: 26px;
        height: 2px;
        display: block;
        position: relative;
        top: 50%;
        margin-top: -1px;
        left: 0;
        margin: auto;
    }
    #menu-trigger span, #menu-trigger span:before, #menu-trigger span:after{
        background: #017fc1;
    }
    #menu-trigger span:before, #menu-trigger span:after{
        content: "";
        position: absolute;
        top: -7px;
        left: 0;
        width: 100%;
        height: 2px;
        transition: all 0.5s ease;
    }
    #menu-trigger span:after{
        bottom: -7px;
        top: initial;
    }
    /*    #menu-trigger.open span:after, #menu-trigger.open span:before {background: #fff;}*/
    #menu-trigger.open span:before{
        transform: rotate(-45deg);
        top: 0;
    }
    #menu-trigger.open span:after{
        transform: rotate(45deg);
        bottom: 0;
    }
    #menu-trigger.open span{
        background: rgba(0, 0, 0, 0.0);
    }
    #mobile-navbar{ /*background:rgba(1, 127, 193, 0.90)*/;
        position: fixed;
        top: 0;
        width: 100%;
        height: 100%;
        right: -100%;
        box-sizing: border-box;
        z-index: 99999; /*overflow-y: auto;*/
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;
        transition: all 0.5s ease;
        max-width: 320px;
        box-shadow: 0 0 20px 6px rgb(45, 44, 44);
        opacity: 0;
    }
    #mobile-navbar.open{
        right: 0;
        opacity: 1;
    }
    #mobile-navbar:after{
        content: "";
        position: fixed;
        top: 0;
        right: 0;
        width: 0;
        height: 50px;
        z-index: 99;
        background: url('/assets/graphics/dot_bkgd_repeater.jpg');
        max-width: 0;
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;
        transition: all 0.5s ease;
    }
    #mobile-navbar.open:after{
        width: 100%;
        max-width: 320px;
    }
    #mobile-navbar nav{
        padding-bottom: 20px;
        margin: 0;
        background: url('/assets/graphics/dot_bkgd_repeater.jpg');
        position: absolute;
        top: 50px;
        right: 0;
        width: 100%;
        height: calc(100% - 50px); /*overflow-y: auto;*/
        box-sizing: border-box
    }
    #mobile-navbar ul ul{
        display: none;
        background: #017fc1;
        position: relative;
        top: 0;
        border-width: 0;
        width: 100%;
        box-shadow: none;
    }
    #mobile-navbar ul ul ul{
        background: rgb(71, 71, 68)
    }
    #mobile-navbar li{
        border-bottom: 1px solid rgb(204, 197, 197);
        list-style: none;
        position: relative;
        display: block;
        margin: 0;
    }
    #mobile-navbar li:last-child{
        border-bottom-width: 0;
        padding-bottom: 0;
    }
    #mobile-navbar li em{
        display: block;
        position: absolute;
        top: 12px;
        right: 12px;
        width: 15px;
        height: 15px;
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;
        transition: all 0.5s ease;
    }
    #mobile-navbar li em:before, #mobile-navbar li em:after{
        content: "";
        position: absolute;
        top: 50%;
        margin-top: -1px;
        left: 0;
        width: 100%;
        height: 2px;
        background: #017fc1;
    }
    #mobile-navbar li em:after{
        transform: rotate(90deg);
    }
    #mobile-navbar li em.toggled{
        transform: rotate(225deg);
    }
    #mobile-navbar li a{
        color: #000000;
        padding: 10px 0 8px 15px;
        margin-right: 30px;
        display: block;
        text-transform: uppercase;
        line-height: 20px;
        font-size: 14px;
        font-weight: 700;
        letter-spacing: 0.09em;
        font-family: "Varela Round", sans-serif
    }
    #mobile-navbar li li{
        border-color: rgb(30, 144, 204)
    }
    #mobile-navbar li li a{
        text-transform: none;
        padding-left: 20px;
        color: #ffffff !important;
        margin-right: 0;
        padding-right: 10px;
    }
    #mobile-navbar li li li a{
        padding-left: 25px;
        margin-right: 0;
    }
    #mobile-navbar li a.active{
        color: #ece4d8;
    }
    #mobile-navbar li a img{
        max-width: 200px;
        margin-left: 48px;
    }
    header nav li ul li a:hover, header nav li ul li a.current{
        color: #ffffff !important;
        background-color: transparent
    }
    header nav{
        display: none;
    }
    header #mobile-navbar nav{
        display: block;
    }
    header nav ul{
        text-align: left;
    }
    #mobile-navbar li a.current{
        color: #e4ae0a !important;
    }
    .overflow-hidden{
        overflow: hidden;
        height: 100%;
    }
    .header_searchbar{
        border: 1px solid #017fc1;
        width: calc(100% - 95px);
        margin-top: 10px;
        margin-left: 15px;
        position: absolute;
        z-index: 9999;
    }
    .header_searchbar input[type="text"], .header_searchbar input[type="search"]{
        width: 100%;
        box-sizing: border-box;
        height: 30px;
        line-height: 30px;
        font-size: 15px;
    }
    .header_searchbar ::-webkit-input-placeholder{
        color: #000000;
    }
    .header_searchbar :-moz-placeholder{
        color: #000000;
    }
    .header_searchbar ::-moz-placeholder{
        color: #000000;
    }
    .header_searchbar :-ms-input-placeholder{
        color: #000000;
    }
    .header_searchbar input[type="submit"]{
        position: absolute;
        top: calc(50% - 6px);
        right: 5px;
        margin: 0;
    }
    /*--------- home page ------------*/
    header{
        padding: 0;
    }
    header .wrapper .brand{
        width: 180px;
    }
    header .wrapper .brand img{
        max-width: 100%
    }
    header .wrapper{
        width: 100%;
        padding-top: 15px;
    }
    header .wrapper .contact_no{
        position: absolute;
        top: 5px;
        right: 1px;
        width: 100%;
        text-align: right;
    }
    header .wrapper .header_searchbar{
        display: none;
    }
    header .wrapper .contact_no a{
        margin: 0 5px;
    }
    #home_container .slider_wrapper ul li{
        height: auto;
    }
    #home_container .slider_wrapper img{
        display: block;
        max-width: 100%
    }
    #home_container .slider_wrapper img.hide{
        opacity: 0;
    }
    #home_container .slider_wrapper .img_wrap{
        display: block;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        min-height: 220px
    }
    #home_container .slider_wrapper .nav_control .home_slider_nav{
        top: initial !important;
        bottom: 18%;
        margin-top: 0;
    }
    #home_container .slider_wrapper .nav_control .prev{
        left: 7px;
    }
    #home_container .slider_wrapper .nav_control .next{
        right: 7px;
    }
    #home_container .slider_wrapper .slider_caption{
        bottom: 0;
        left: 0;
        position: relative;
        padding: 15px 30px;
        text-align: center;
        box-sizing: border-box;
        background-color: #0181c4;
        min-height: 200px
    }
    #home_container .slider_wrapper .slider_caption .slider_caption_inner{
        width: 100%;
    }
    #home_container .slider_wrapper ul li{
        display: block !important;
    }
    #home_container .slider_wrapper .slider_caption h3{
        font-size: 25px;
        line-height: 34px;
        text-align: center;
        margin-bottom: 10px;
    }
    #home_container .slider_wrapper .slider_caption h4{
        font-size: 18px;
        line-height: 22px;
        text-align: center;
    }
    #home_container .slider_wrapper .slider_caption a{
        min-width: 200px;
        padding: 5px 0;
    }
    #home_container .product_container .select_box{
        width: 100%;
        padding-left: 0;
    }
    #home_container .product_container .seprate{
        width: 100%;
    }
    #home_container .product_container .browse_btn{
        width: 100%;
        padding-right: 0;
    }
    #home_container .product_container .select_box div.fancy-select{
        float: initial
    }
    #home_container .product_container .select_box div.fancy-select{
        display: block;
        margin: auto;
    }
    #home_container .product_container .select_box div.fancy-select{
        width: 100%;
    }
    #home_container .product_container .browse_btn .common_btn{
        margin: auto;
        width: 100%;
    }
    div.fancy-select div.trigger{
        padding: 8px 20px 8px 10px !important;
    }
    div.fancy-select div.trigger:after{
        right: 5px !important;
    }
    #home_container .product_container .top_pdct{
        padding: 15px 13px 0;
    }
    #home_container .row{
        margin: auto;
        padding: 15px 0;
        max-width: 300px;
    }
    #home_container .product_container .yt_image{
        width: 100%;
    }
    #home_container .product_container .video_title{
        width: 100%;
        box-sizing: border-box;
        padding: 20px 13px;
        text-align: center;
    }
    #home_container .product_container .video_title a{
        margin-top: 10px;
    }
    #home_container .product_container .product_left{
        width: 100%;
    }
    #home_container .product_container .product_right{
        width: 100%;
    }
    #home_container .product_container .product_right{
        margin: 0 !important;
    }
    #home_container .product_container .calloutbutton_block a{
        display: block;
        padding: 20px 0;
    }
    #home_container .product_container .calloutbutton_block .inner{
        display: block;
    }
    #home_container .product_container .calloutbutton_block .icon{
        width: 80px;
    }
    #home_container .product_container .calloutbutton_block .btn_content{
        width: calc(100% - 80px);
        padding-right: 20px;
        box-sizing: border-box;
        margin-right: 0;
    }
    #home_container .product_container .calloutbutton_block a:first-child, #home_container .product_container .calloutbutton_block a.first{
        background-color: #102336
    }
    #home_container .news_container{
        padding-top: 20px;
    }
    #home_container .news_container article{
        width: 100%;
        margin: 0;
        padding: 0;
        text-align: center;
    }
    #home_container .news_container .left_art{
        padding: 20px 0;
        margin: 0;
        border-right-width: 0;
        border-bottom: 1px solid #404c58
    }
    #home_container .news_container .right_art{
        margin: 0;
        padding: 20px 0;
    }
    #home_container .news_container img{
        display: block;
        margin: auto;
        margin-bottom: 15px;
    }
    #home_container .product_container{
        margin-top: 0 !important;
    }
    #full_wrapper{
        margin-bottom: 0 !important;
    }
    .push{
        display: none;
    }
    /* footer */
    footer{
        text-align: center;
        padding: 15px 0;
    }
    footer .wrapper{
        padding: 0;
    }
    footer .certifications{
        width: 100%;
        margin: 0;
    }
    footer .certifications a{
        margin: 0 8px;
    }
    footer .certifications h5{
        margin-bottom: 5px;
    }
    footer .connect a{
        margin: 0 8px;
    }
    footer .connect{
        width: 100%;
        padding: 8px 13px 11px 13px;
        background: rgba(245, 246, 250, 0.80);
        box-sizing: border-box;
        margin: 10px 0 15px 0;
    }
    footer .copy_right{
        width: 100%;
        margin: 0;
    }
    footer h5{
        display: block;
        vertical-align: middle;
        margin-bottom: 10px;
        font-size: 16px;
    }
    /*--------- company page ------------*/
    #inner_container .intro_text .inner{
        width: 100%;
    }
    #inner_container .intro_text{
        padding: 15px 20px;
        margin-bottom: 20px;
    }
    #inner_container .company_content .avtar{
        width: 100%;
        margin-right: 0;
        height: auto;
        margin-bottom: 20px;
    }
    #inner_container .company_content .avtar_desc{
        width: 100%;
        margin-bottom: 20px;
    }
    #inner_container .company_content .bios_slideshow .avtar_desc{
        box-sizing: border-box;
        padding: 0 15px;
        text-align: center;
    }
    #inner_container .company_content .bios_staff .avtar img{
        display: block;
        margin: auto;
    }
    #inner_container .company_content .bios_staff .avtar{
        width: 100%;
        margin-right: 0;
        height: auto;
        box-sizing: border-box;
        padding: 0 15px;
    }
    /*    #inner_container .company_content .bios_staff{width: 750px !important;}*/
    #inner_container .company_content .bios_tab{
        padding: 0 15px;
    }
    #inner_container .company_content .bios_tab .tab_btn{
        max-width: inherit;
        padding: 12px 7px;
        margin: 0 10px;
    }
    #inner_container .company_content .avtar_desc p{
        padding-bottom: 7px;
    }
    #inner_container .company_content .bios_slideshow{
        margin-bottom: 10px;
    }
    #inner_container .subnav_bar li a:hover:after, #inner_container .subnav_bar li a.current:after{
        display: none;
    }
    #inner_container .company_content .bios_staff .owl-prev, #inner_container .company_content .bios_staff .owl-next{
        top: 17%;
        margin-top: 0;
    }
    .custom-dropdown-wrap{
        width: calc(100% - 30px);
        position: relative;
        text-align: left;
        display: block;
        margin: auto;
    }
    .custom-dropdown{
        position: initial;
        top: 32px;
        left: 0;
        width: 100%;
        border: 1px solid #a9a9a9;
        box-sizing: border-box;
        background: #ffffff;
        z-index: 1;
    }
    .custom-dropdown li{
        display: inline-block;
        vertical-align: top;
        list-style: none;
    }
    .custom-dropdown li a{
        display: block;
        padding: 5px 10px;
    }
    .custom-dropdown li a:hover{
        background: #d4cdcd;
        color: #000000;
    }
    .custom-dropdown-wrap .select-trigger{
        display: none;
        padding: 7px 10px;
        background: #ffffff;
        cursor: pointer;
        border: 1px solid #a9a9a9;
        position: relative;
        font-size: 15px;
        box-shadow: 2px 2px 0 0 rgba(226, 226, 226, .70) inset
    }
    .custom-dropdown-wrap .select-trigger:after{
        content: "";
        position: absolute;
        top: 50%;
        right: 8px;
        width: 12px;
        height: 7px;
        background: url('/assets/graphics/dropdown_delta.png') no-repeat;
    }
    .custom-dropdown{
        position: absolute;
        display: none;
    }
    .custom-dropdown li{
        display: block;
    }
    .custom-dropdown-wrap .select-trigger{
        display: block;
    }
    #inner_container .subnav_bar li{
        margin: 0;
        display: block;
    }
    .custom-dropdown li a.current{
        background: #0088c5;
        color: #ffffff !important;
    }
    /*--------- products page ------------*/
    #inner_container .pdct_feature_container .col_left, #inner_container .pdct_feature_container .col_right{
        width: 100%;
    }
    #inner_container .pdct_feature_container .col_left .list_row, #inner_container .pdct_feature_container .list_row{
        width: 100%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    #inner_container .pdct_feature_container .pdct_list{
        padding-left: 13px;
        padding-right: 13px;
    }
    #inner_container .pdct_feature_container .pdct_list h3 a{
        font-size: 20px;
        line-height: 25px;
    }
    #inner_container .pdct_feature_container .pdct_list h4{
        margin-top: 6px;
    }
    #inner_container .by_search, #inner_container .by_dropdown{
        width: 100% !important;
        margin: 0;
        left: inherit !important;
        margin-left: inherit !important;
        transform: inherit !important;
    }
    #inner_container .filter_wrap h5{
        display: block;
        margin-bottom: 4px;
    }
    #inner_container .by_search .search_box{
        width: 100%;
    }
    #inner_container .by_search input[type="text"]{
        display: inline-block;
        vertical-align: middle;
        width: calc(100% - 29px);
        box-sizing: border-box
    }
    #inner_container .by_search input[type="submit"]{
        display: inline-block;
        vertical-align: middle;
    }
    #inner_container .by_dropdown .fancy-select{
        width: 100%;
    }
    #inner_container .by_dropdown{
        margin-top: 18px;
    }
    #inner_container .filter_wrap{
        padding: 15px 0;
    }
    #inner_container.pro_detail .productentry_container .col_left{
        padding-top: 20px;
        width: 100%;
        margin-right: 0;
    }
    #inner_container.pro_detail .productentry_container .col_right{
        margin-top: 20px;
        width: 100%
    }
    #request_spec_form, #requestFormWrapper, #order_form{
        overflow-y: auto;
        z-index: 99999;
    }
    #inner_container .form_popup .form_container{
        position: absolute;
        transform: translateX(-50%);
        width: 96%;
        max-width: 660px;
        margin-left: 0;
        margin-bottom: 20px;
        top: 0;
        margin-top: 30px;
    }
    #inner_container .productentry_container .formula_box{
        background-size: cover;
    }
    #inner_container .form_container .column{
        width: 50% !important;
        padding: 0 10px;
        box-sizing: border-box;
    }
    #inner_container .form_popup .column-last{
        margin-left: 0 !important;
    }
    #inner_container .form_popup .text{
        width: 100% !important;
        box-sizing: border-box;
        height: 32px;
    }
    #inner_container .form_popup .dfcolumns{
        margin-left: 0 !important;
        padding: 0 10px;
    }
    #inner_container .form_popup .dform_textarea{
        padding: 0 10px !important;
    }
    #inner_container .form_popup .dform_textarea textarea{
        width: 100% !important;
        display: block;
        box-sizing: border-box;
        margin-top: 5px;
    }
    #inner_container .form_popup .submit{
        padding: 6px 0;
        min-width: 180px;
    }
    #inner_container .form_popup .submit_button{
        padding: 18px 0;
    }
    #inner_container .form_popup .dform_container .dfinput_full{
        min-height: inherit;
        margin-bottom: 0;
    }
    #inner_container .form_popup .form_container .close_popup{
        right: 5px;
        top: -6px;
    }
    #inner_container .form_popup .req_text{
        padding: 28px 20px 0;
    }
    #inner_container .form_popup .form_content{
        margin-top: 18px;
    }
    /*    #inner_container .form_popup br{display: none;}*/
    #inner_container .dform_radio .dform_label{
        width: 60px;
    }
    #inner_container .dform_radio .dform_container{
        width: calc(100% - 60px);
    }
    #inner_container .dform_radio .radios li{
        margin-right: 15px;
    }
    #inner_container .productentry_container .formula_box input[type="button"]{
        margin: 3px;
    }
    /*--------- services page ------------*/
    #inner_container .head_line{
        padding: 20px 0;
    }
    #inner_container .intro_text .inner{
        width: 100%;
        box-sizing: border-box;
        padding: 0 20px;
    }
    #inner_container .intro_text{
        margin-bottom: 20px;
    }
    #inner_container .services_list{
        padding: 15px 13px 30px;
    }
    #inner_container .services_list .column{
        width: 100%;
        padding: 0;
    }
    #inner_container .services_list .column + .column{
        width: 100%;
        padding: 0;
    }
    #inner_container .intro_text{
        padding: 15px 0;
    }
    #inner_container .services_list .ser_ico{
        width: 50px;
        height: 50px;
        background-size: 100% 100%;
    }
    #inner_container .services_list .ser_desc{
        width: calc(100% - 54px);
        box-sizing: border-box;
        padding-left: 11px;
    }
    #inner_container .services_list .list_row{
        margin-bottom: 20px;
    }
    /*--------- re-calculator page ------------*/
    #inner_container .component_content h1{
        padding: 15px 0 25px 0;
    }
    #inner_container .component_content .cal_content h4{
        padding: 15px 13px;
    }
    #inner_container .component_content .formula_action{
        padding: 15px 13px 8px 13px;
        margin-bottom: 15px;
    }
    #inner_container .component_content .formula_action br{
        display: none;
    }
    #inner_container .component_content .select_box{
        width: 100%;
        display: block;
        margin-bottom: 8px;
    }
    #inner_container .component_content{
        width: 100%;
        max-width: 620px;
        box-sizing: border-box;
        padding: 20px 13px;
    }
    #inner_container .component_content .cal_content p{
        margin: 0 7px;
        padding: 12px 2px;
    }
    #inner_container .component_content .cal_content p strong{
        min-width: 115px;
    }
    #inner_container .component_content .cal_content p span{
        font-size: 15px;
    }
    #inner_container .calculator_bg{
        padding-bottom: 50px;
    }
    #inner_container .component_content .cal_content{
        padding-bottom: 40px;
    }
    /*--------- contact page ------------*/
    #inner_container .address_bar div.column{
        width: 50% !important;
    }
    #inner_container .form_container{
        padding-bottom: 15px;
    }
    #inner_container .required_line{
        padding: 20px 0 15px;
    }
    #inner_container .address_bar div.column + div.column{
        width: 50% !important;
    }
    #inner_container .contact_map{
        height: 400px;
        margin-bottom: 0;
        padding-bottom: 20px;
    }
    #inner_container .contact_map #map{
        height: 100% !important;
    }
    #inner_container .form_container{
        width: 100%;
        max-width: 740px;
    }
    #inner_container .form_container .text{
        width: 100%;
        height: 32px;
        box-sizing: border-box;
    }
    #inner_container .form_container .column{
        float: left;
        padding-left: 0;
    }
    #inner_container .form_container .column-last{
        margin: 0;
        padding-right: 0;
    }
    #inner_container .form_container textarea{
        width: 100%;
        display: block;
        box-sizing: border-box;
    }
    #contact_form{
        text-align: left
    }
    /*--------- thank / error page ------------*/
    #inner_container.thank .mainbar{
        width: 100%;
        padding-right: 0;
        padding-top: 20px;
    }
    #inner_container.thank .banner h2{
        font-size: 35px;
        line-height: 40px;
    }
    #inner_container.thank .banner{
        padding: 35px 0;
    }
    #inner_container.thank{
        padding-bottom: 20px;
    }
}
/* 2. iPad responsive css 768px to 1024px
-----------------------------------------*/
@media (min-width: 768px) and (max-width: 1024px){
    /* default  */
    body{
        min-width: inherit;
    }
    .wrapper{
        width: 100%;
        padding-left: 13px;
        padding-right: 13px;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    h3{
        font-size: 20px;
        line-height: 25px;
    }
    /*--------- home page ------------*/
    #home_container .slider_wrapper ul li{
        height: auto;
        display: block !important;
    }
    #home_container .slider_wrapper img{
        display: block;
    }
    header .wrapper{
        width: 100%;
    }
    header .wrapper .brand{
        width: 190px
    }
    header .wrapper .brand img{
        max-width: 100%
    }
    header .wrapper .right_header{
        width: calc(100% - 360px);
        margin-right: 155px;
    }
    header nav li{
        margin: -3px 4px;
        font-size: 11px
    }
    header nav a{
        font-size: 10.5px;
    }
    .ul-logo img{
        top: 2px;
        right: 10px;
        width: 140px;
    }
    #home_container .slider_wrapper .slider_caption h3{
        font-size: 35px;
    }
    #home_container .slider_wrapper .slider_caption h4{
        font-size: 20px;
    }
    #home_container .slider_wrapper .slider_caption a{
        margin-top: 10px;
    }
    #home_container .product_container .product_left{
        width: 55%;
    }
    #home_container .product_container .product_right{
        width: 45%;
    }
    #home_container .product_container .calloutbutton_block .icon{
        width: 80px;
    }
    #home_container .product_container .calloutbutton_block .btn_content{
        width: calc(100% - 80px);
        margin-right: 0;
        box-sizing: border-box;
        padding-right: 13px;
    }
    #home_container .product_container .top_pdct{
        padding: 20px 13px;
    }
    #home_container .product_container .select_box div.fancy-select{
        width: 100%;
    }
    #home_container .product_container .seprate{
        width: 10%;
    }
    #home_container .product_container .browse_btn .common_btn{
        width: 100%;
    }
    #home_container .product_container .select_box{
        width: 50%;
        padding-left: 0;
    }
    #home_container .product_container .browse_btn{
        width: 40%;
        padding-right: 0;
    }
    div.fancy-select div.trigger{
        padding: 8px 20px 8px 5px !important;
    }
    div.fancy-select div.trigger:after{
        right: 5px !important;
    }
    #home_container .product_container .video_title{
        box-sizing: border-box;
        padding: 15px;
        width: 45%;
    }
    #home_container .product_container .video_title a{
        margin-top: 10px;
    }
    /*    #home_container .calloutbutton_block p {font-size: 14px;line-height: 16px;}
    #home_container .calloutbutton_block h4{font-size: 13px;}*/
    #home_container .product_container .calloutbutton_block a{
        display: block;
        position: relative;
    }
    #home_container .product_container .calloutbutton_block .inner{
        display: block;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
    }
    #home_container .news_container .wrapper{
        max-width: 770px;
    }
    #home_container .news_container article{
        box-sizing: border-box;
    }
    #home_container .news_container .left_art{
        width: 49%;
        padding-right: 50px;
    }
    #home_container .news_container .right_art{
        margin-left: 0;
        width: 50%;
        padding-left: 50px;
    }
    footer .certifications a, footer .connect a{
        margin-left: 10px;
    }
    footer .certifications{
        margin-right: 0;
        width: 32%;
    }
    footer .connect{
        margin-right: 0;
        width: 25%;
    }
    footer .copy_right{
        width: 42%;
    }
    /*--------- company page ------------*/
    #inner_container .company_content .avtar{
        width: 47%;
        margin-right: 0;
        padding-right: 30px;
        height: auto;
    }
    #inner_container .company_content .avtar_desc{
        width: 45%;
    }
    #inner_container .company_content .bios_staff .avtar{
        width: 45%;
        margin-right: 0;
        height: auto;
    }
    /*    #inner_container .company_content .bios_staff{width: 750px !important;}*/
    #inner_container .company_content .bios_tab{
        padding: 0;
    }
    #inner_container .company_content .bios_tab .tab_btn{
        max-width: inherit;
        padding: 12px 7px;
        margin: 0 10px;
    }
    #inner_container .company_content .avtar_desc p{
        padding-bottom: 7px;
    }
    .bios_slideshow .owl-carousel .owl-wrapper-outer{ /*width: 695px !important;*/
        margin: auto;
    }
    .bios_slideshow .owl-carousel .item{
        width: 695px !important;
        margin: auto;
    }
    #inner_container .company_content .bios_slideshow{
        margin-bottom: 10px;
    }
    /*--------- products page ------------*/
    #inner_container .pdct_feature_container .col_left{
        width: 50%;
        margin-right: -2px;
        box-sizing: border-box;
        padding-right: 7px;
    }
    #inner_container #col_left, #inner_container #col_right{
        margin-bottom: 5px;
    }
    #inner_container .pdct_feature_container .col_right{
        width: 50%;
        margin-left: -2px;
        box-sizing: border-box;
        padding-left: 7px;
    }
    #inner_container .pdct_feature_container .col_left .list_row, #inner_container .pdct_feature_container .list_row{
        width: 100%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    #inner_container .pdct_feature_container .pdct_list{
        padding-left: 13px;
        padding-right: 13px;
    }
    #inner_container .pdct_feature_container .pdct_list h3 a{
        font-size: 20px;
        line-height: 25px;
    }
    #inner_container .pdct_feature_container .pdct_list h4{
        margin-top: 6px;
    }
    #inner_container .by_search{
        width: 59%;
        margin-right: -2px;
    }
    #inner_container .by_dropdown{
        width: 41% !important;
        margin: 0;
        left: inherit !important;
        margin-left: inherit !important;
        transform: inherit !important;
    }
    #inner_container.pro_detail .productentry_container .col_left{
        padding-top: 30px;
        width: 53%;
        max-width: 460px;
        box-sizing: border-box;
        margin-right: 0;
        padding-right: 50px;
    }
    #inner_container.pro_detail .productentry_container .col_right{
        margin-top: 30px;
        width: 46%;
        max-width: 402px;
    }
    #inner_container .form_popup .form_container{
        width: 653px;
        margin-left: -326px;
    }
    #inner_container .form_popup .dform_textarea textarea{
        margin-top: 4px;
    }
    /*--------- services page ------------*/
    #inner_container .intro_text .inner{
        width: 100%;
        max-width: 700px;
    }
    #inner_container .intro_text{
        margin-bottom: 20px;
    }
    #inner_container .services_list{
        padding: 15px 13px 30px;
    }
    #inner_container .services_list .column{
        width: 50%;
        margin-right: -2px;
        box-sizing: border-box;
        padding-right: 15px;
        padding-left: 0;
    }
    #inner_container .services_list .column + .column{
        width: 50%;
        margin-right: 0;
        margin-left: -2px;
        padding-right: 0;
        padding-left: 15px;
    }
    #inner_container .services_list .ser_desc{
        width: calc(100% - 75px)
    }
    /*--------- contact page ------------*/
    #inner_container .required_line{
        padding: 25px 0 15px;
    }
    /*--------- thank / erroe page ------------*/
    #inner_container.thank .banner{
        padding: 50px 0;
    }
    #inner_container.thank .banner h2{
        font-size: 50px;
    }
    #inner_container.thank .mainbar{
        width: 100%;
        padding-right: 0;
    }
}
/* 3. large desktop responsive css 1025px to 1200px
----------------------------------------------------*/
@media (min-width: 1025px) and (max-width: 1200px){
}
/* 4. Other media-query
------------------------------------------------*/
@media (max-width: 480px){
    #inner_container .form_container .column{
        width: 100% !important;
    }
    #inner_container .form_container .column{
        width: 100% !important;
        padding: 0;
        margin-bottom: 10px !important;
    }
    #inner_container .address_bar div.column{
        width: 100% !important;
    }
}