/* =============================================================== */
/* CUSTOM RESPONSIVE
/* =============================================================== */

@media (max-width: 1000px) and (min-width: 980px) {
    .container {
        width: 100% !important;
        max-width: 900px !important;
    }
}

.block-service .media-left img{width: 210px !important;height: 200px;}

@media (max-width: 768px) {
    /* phones */
    .container {
        width: 100% !important;
        max-width: 900px !important;
    }
    body{
	    font-size: 15px
    }
    .block-new .item h2{
	    font-size: 16px;
	    height: 40px;
	    line-height: 21px
    }
    .block-service .item h2,.block-product .media-heading{
	    font-size: 16px;
	    line-height: 21px;
	    min-height: 54px;
    }
    .block-new .media .media-body .desc{font-size: 15px;height: auto}
    .block-product .desc,.block-pro .item .media-body,.infomation .media-body h3, .infomation .media-body h3 a,.infomation .media-body{font-size: 15px}
    .detail p, .detail span{font-size: 15px !important}
    .block-products .thumbnail .title{
	    font-size: 16px;
	    line-height: 21px;
	    height: auto
    }
    .block-products .thumbnail .caption .pageIntro{
	    font-size: 15px
    }
}

@media only screen and (min-width : 320px) and (max-width : 480px) {/*--- Mobile portrait ---*/
    .container {
        min-width: 310px;
    }
    #topmenu,.menu-top ul li:nth-child(1n+2){display: none}

    .menu-top .navbar-nav{margin: 0}
    .navbar-top .navbar-nav > li > a{padding: 0}
    .slogan{margin-bottom: 15px}
    .slogan h2{font-size: 14px}
    .slogan h2 span{font-size: 22px;display: block}

    .hotline strong{font-size: 16px}
    .text_rotate{width: 100%;margin-top: 20px}
    .text_rotate .desc{height: 130px;overflow: hidden}
    .text_rotate .desc p *{font-size: 15px !important}
	.desc p *{font-size: 14px !important}
    .block-product .col-xs-6,.block-pro .col-xs-6,.infomation .col-xs-4,.copyright .col-xs-6,.block-new .col-xs-6,.block-products .col-xs-6{width: 100%}
    .block-product .media-left,.infomation .media-left,.block-service .media-left{display: block;text-align: center;margin-bottom: 20px}
    .block-product .media-body,.block-pro .item .media-body,.infomation .media-body,.block-service .media-body{display: block;width: 100%;padding-left: 0}
    .block-pro .item .media-left{display: block;text-align: center;padding: 0}
    .wide-container2,.wide-container2 .container img{height: 200px}
	.block-pro .item .media-left img{width: 100%!important;height: auto !important}
	.block-pro .item .media-body{padding: 15px}
	.thumbnail .pageIntro{height: auto !important}

    .block-service .media-left img{width: 100% !important;height: 250px;}
    .block-service .media-body{border-top: none;border-left: 1px solid #e5e5e5;margin-bottom: 20px;padding:15px}

    .detail .block-title{border: none}
    .detail .block-title h2{border-bottom: 2px solid #b797cc;display: block;float: none !important;padding-bottom: 10px}

    .block-detail .addthis_toolbox{position: static;top:0}

    .infomation .row > div:nth-child(2){border: none}
    .infomation .media-body{text-align: center;font-size: 13px}

    .copyright div:first-child{text-align: center;width: 100%;padding: 0}
    .copyright div:last-child{width: 280px; text-align: center; margin: 0px auto;}
    .copyright .share{float: none !important;}

    .wide-container{height: 470px}
    .share li{margin-right: 2px}

    @media only screen and (min-width : 450px) and (max-width : 480px){
        .block-service .item{margin-bottom: 15px}
        .block-service .media-left{display: table-cell;margin-bottom: 0}
        .block-service .media-left img{width: 210px !important;height: 200px;}
        .block-service .media-body{display: table-cell;border-left: none;border-top: 1px solid #e5e5e5;margin-bottom: 0;padding: 10px}
        .block-products .col-xs-6{width: 50%}
    }
}


@media only screen and (min-width : 480px) and (max-width : 595px) {/*--- Mobile landscape ---*/
    .container {
        min-width: 310px;
    }
    #topmenu,.menu-top ul li:nth-child(1n+2){display: none}
    .menu-top .navbar-nav{margin: 0}
    .navbar-top .navbar-nav > li > a{padding: 0}
    .slogan{margin-bottom: 15px}
    .slogan h2{font-size: 14px}
    .slogan h2 span{font-size: 25px;display: block}
/*     .hotline span{display: block} */
    .text_rotate{width: 100%;margin-top: 60px}
    .wide-container2,.wide-container2 .container img{height: 250px}

    .block-product .col-xs-6,.block-pro .col-xs-6,.infomation .col-xs-4,.copyright .col-xs-6{width: 100%}

    .block-pro .item .media-left img{width: 240px!important;height: auto !important}

    .block-service .item{margin-bottom: 15px}

    .infomation .row > div:nth-child(2){border: none}
    .infomation .media-left{display: block;text-align: center;margin-bottom: 20px}
    .infomation .media-body{display: block;width: 100%;text-align: center}

    .block-detail .addthis_toolbox{position: static;top:0}

    .copyright div:first-child{text-align: center;width: 100%;padding: 0}
    .copyright div:last-child{width: 320px; text-align: center; margin: 0px auto;}
    .copyright .share{float: none !important;}

}
@media only screen and (min-width : 595px) and (max-width : 690px) {/*--- Small tablet portrait ---*/
    #topmenu,.menu-top ul li:nth-child(1n+2){display: none}
    .menu-top .navbar-nav{margin: 0}
    .navbar-top .navbar-nav > li > a{padding: 0}
    .slogan{margin-bottom: 15px}
    .slogan h2{font-size: 14px}
    .slogan h2 span{font-size: 25px;display: block}
    .hotline span{display: block}
    .hotline span:nth-child(1n+2){display: inline-block}

    .text_rotate{margin-top: 60px}
    .wide-container2,.wide-container2 .container img{height: 250px}
    .block-product .media-left,.infomation .media-left{display: block;text-align: center;margin-bottom: 20px}
    .block-product .media-body,.block-pro .item .media-body,.infomation .media-body{display: block;width: 100%;padding-left: 0}
    .block-pro .item .media-left{display: block;text-align: center;padding: 0}
    .block-pro .item .media-left img{height: 218px!important;width: 100%!important;}
    .block-pro .item .media-body{padding: 15px;height: 160px;overflow: hidden}
    .block-service .item{margin-bottom: 15px}
    .block-detail .addthis_toolbox{position: static;top:0}
    .share li{margin-right: 2px}
}
@media only screen and (min-width : 690px) and (max-width : 850px) {/*--- Tablet portrait ---*/
    .container {
        width: 100% !important;
        max-width: 900px !important;
    }
    #topmenu,.menu-top ul li:nth-child(1n+2){display: none}
    .menu-top .navbar-nav{margin: 0}
    .navbar-top .navbar-nav > li > a{padding: 0}

    .navbar-header{float: none}
    .navbar-toggle{display: block}
    .container-fluid > .navbar-collapse, .container-fluid > .navbar-header, .container > .navbar-collapse, .container > .navbar-header{margin: 0 -15px}
    .navbar-nav{float: none;margin: 7.5px -15px}
    .navbar-nav > li {
        display: block;
        position: relative;
        float: none;
    }
    .navbar-nav > li > a {
        display: block;
        padding: 10px 15px;
        position: relative;
    }

    .slogan{margin-bottom: 15px}
    .block-product .media-left,.infomation .media-left{display: block;text-align: center;margin-bottom: 20px}
    .block-product .media-body,.block-pro .item .media-body,.infomation .media-body{display: block;width: 100%;padding-left: 0}
    .block-pro .item .media-left{display: block;text-align: center;padding: 0}
    .block-pro .item .media-left img{height: 218px!important;width: 100%!important;display: block;max-width: 100%}
    .block-pro .item .media-body{padding: 15px;height: 160px;overflow: hidden}
    .block-service .item{margin-bottom: 15px}
    .block-detail .addthis_toolbox{position: static;top:0}

    @media (min-width: 768px) {
        .block-detail .addthis_toolbox{position: absolute; right: 0px; top: -55px}
    }
}
@media only screen and (min-width : 850px) and (max-width : 1023px) {

    .container {
        width: 100% !important;
        max-width: 970px !important;
    }

    .slogan{margin-bottom: 15px}
    .navbars-i4sn .navbar-nav > li > a{padding: 16px 10px;font-size: 14px}
    .block-product .media-left,.infomation .media-left{display: block;text-align: center;margin-bottom: 20px}
    .block-product .media-body,.block-pro .item .media-body,.infomation .media-body{display: block;width: 100%;padding-left: 0}
    .block-pro .item .media-left{display: block;text-align: center;padding: 0}
    .block-pro .item .media-left img{height: 320px!important;width: 100%!important;}
    .block-pro .item .media-body{padding: 15px;height: 160px;overflow: hidden}
    .block-product .media-heading{
	    height: 52px
    }

}

@media only screen and (min-width : 1024px){
    .container {
        width: 100% !important;
        max-width: 1024px !important;
    }

    .block-product .col-sm-11,.block-pro .col-sm-11{width: 83.3333%}
    .block-product .col-sm-1,.block-pro .col-sm-1{width: 16.6667%}

    #navbar{display: none !important;}

    .block-pro .item .media-left img{height: 218px!important;width: 240px!important;}
}