/*==========================================
Old Screen
==========================================*/

@media screen and (max-width: 1280px ) and (min-width: 1000px) {
.wrap {width:980px}
.nav li {margin-left:70px}
.contactList li {margin:0}
.searchBar {right:55px}
.bgAbout {height:650px}
.bgAbout h1 {margin-top:210px}
#newsYear .tabs-menu li {width:150px; margin-right:15px}
.newsList li {width:470px; }
.newsList li .imgThumb {height:auto; line-height:0}
.newsDetail .mainPhoto {width:360px}
.products {padding:0 20px}
.productCate ul li > a {font-size:15px; line-height:24px}
.mapArea {height:280px}
}

/*==========================================
Tablet
==========================================*/

@media screen and (max-width: 1000px ) and (min-width: 768px) {
.wrap {width:748px}
.nav li {margin-left:45px}
.nav .hover {display:none}
.searchBar {right:15px}
.contactList li {width:185px; margin:0}
.contactList li .circle {width:150px; height:150px}
.copyright {margin:30px 0}
.homeSection.bgAbout {height:auto; padding:120px 0; background-size:100%}
.homeSection.bgAbout h1 {margin:15px 0}
#newsYear .tabs-menu li {width:105px; margin:0 20px 20px 0}
#newsYear .tabs-menu li a {line-height:35px}
.newsList li {width:360px; margin-bottom:30px}
.newsList li .imgThumb {height:auto; line-height:0}
.newsDetail .mainPhoto {width:265px}
.products {padding:0 20px}
.productCate ul li > a {font-size:15px; line-height:24px}
.productCate {width:40%}
.productListBox {width:60%}
.productListBox .productList li {width:50%}
#productImages {width:360px; height:360px}
#productImages img {width:360px}
#productDesc, #productSpec {width:100%; margin-bottom:30px}
/*
#service-wrap .roundabout-holder {width:500px}
#service-wrap .roundabout-moveable-item {width:360px;}
*/
.contactInfo {width:100%}
.enquiry {width:100%}
.mapArea {height:200px}
}

/*==========================================
Mobile
==========================================*/

@media screen and (max-width: 767px ) {
.wrap {width:94%}

#header .topBar, #header .nav {display:none}
#mobileHead {display:block}

.mobileIcon {display:block}
.nav .hover {display:none}

.banner > img {display:none}
.mBanner {display:block}

.flexFloatL li {width:48%; margin-right:4%}
.flexFloatL li:nth-child(even) {margin-right:0}
#promoSlider .imgThumb a {background-size:30%}
.contactList {width:100%; }
.contactList li, .contactInfo .contactList li {position:relative; clear:both; width:100%; margin:0; margin-bottom:10px; }
.contactList li:nth-child(even), .contactInfo .contactList li:nth-child(even) {float:right; clear:right}
.contactList li .circle, .contactInfo .contactList li .circle {position:absolute; top:0; left:0; width:65px; height:65px; background-size:60%}
.contactList li p, .contactInfo .contactList li p {text-align:left; line-height:65px; margin-left:80px}
.contactList li:nth-child(1) p {line-height:22px}
.homeSection.bgAbout {height:auto; padding:60px 0; background-size:100%}
.bgAbout h1 {margin-top:20px}
.copyright {margin:20px 0; font-size:13px; line-height:20px}
#bannerSlider {display:none}
#mobileSlider {display:block}
.homeSection, .homeSection.bgGrey {padding:30px 0}
#homeProductTab .tabs-menu ul li {margin:0}
#homeProductTab .tabs-menu a {padding:0 8px}
.searchBar {right:30px; height:40px; margin-top:10px}
.searchBar a {width:40px; height:40px}
.searchBar .inputWrap {width:200px}
.searchBar input {float:left}
.langNav {margin-right:20px}
.langNav a {color:#fff; margin:0 8px}
.langNav a.selected {color:#00a0e9}
.homeSection.bgAbout {background-size:100% 100%}
.aboutImage {display:none}
.aboutContent {width:100%}
h1.innerTitle {margin:40px 0 20px 0}
.banner {margin-top:46px}
.newsList li {width:48%; margin-bottom:20px}
.newsList li .imgThumb {height:auto; line-height:0}
#newsYear .tabs-menu {display:none; text-align:center}
#newsYear .tabs-menu li {float:none; width:150px; display:inline-block; margin:0 5px 20px 5px}
.newsList li .date {font-size:15px; line-height:18px; height:75px}
.newsList li .date span {font-size:24px}
.newsDetail .mainPhoto {float:none; width:300px; margin:0 auto}
.newsDetail .smallPhoto {width:100%; text-align:center}
.newsDetail .smallPhoto li {float:none; display:inline-block; margin:0 10px 20px 10px}
.newsContent {padding-left:0}
.products {padding:0}
.productCate {width:100%; padding: 0 10px}
.productListBox {width:100%}
.productListBox .productList li {width:50%; margin-right:0}

.productList li {width:50%; margin-right:0}
.productList li:nth-child(odd) .imgThumb {}
.productList .imgThumb a.blackBox {opacity:1; position:static; height:auto; background:none; }
.productList .imgThumb a.blackBox .line {display:block; width:70px}
.productList .imgThumb a.blackBox div {margin:0 auto}
.productList .imgThumb .title {color:#00a0e9}
.productList .imgThumb p {color:#424242}
.productList .imgThumb p {display:none; }
#homeProductTab .productList li {width:100%; padding:4%; margin-bottom:3%}
#homeProductTab .productList .imgThumb {border-right:0}
#homeProductTab .productList .imgThumb p {width:100%; margin:0; display:block }
/*
.productList .imgThumb .title {font-size:15px}
.productList .imgThumb p {display:none}
*/
.productCate ul li > a {font-size:15px; line-height:24px}
#productInfo {display:block}
#productDesc, #productSpec {width:100%; margin-bottom:30px; padding:0; border:0}
#productDesc {padding-bottom:30px; border-bottom:1px solid #d7d7d7}
#productDesc li {width:100%}
#service-wrap .roundabout-holder {width:360px}
#service-wrap .roundabout-moveable-item {width:360px;}
.contactInfo {width:100%}
.contactInfo .contactList {width:100%; }
.enquiry {width:100%}
.mapArea {height:200px}
.btnCate {margin:0 auto 20px auto }
.cateList {width:100%; margin:0 auto 25px auto }
}


@media screen and (max-width: 460px ) {
p {font-size:15px}
#productSpec .tableTr {margin-bottom:15px}
#productSpec .tableTr > div:nth-child(1) {width:100%}
.productList .imgThumb {border:0}
.productIntro {font-size:15px; font-weight:bold}
.productList .imgThumb .title {font-size:15px; font-weight:bold}
/*
.productListBox .productList li {width:100%}

*/
.newsList li {padding-top:0}
.newsList li .date {position:relative; left:0; width:100%; height:auto; padding:5px 10px; text-align:right}
.newsList li .date span {float:left; margin-bottom:0; line-height:36px}
.newsList li .caption {font-size:15px}
.btnCate {width:100%}
.enquiry .tableTr > div:nth-child(1) {width:100%; margin-bottom:0}
.enquiry .tableTr > div:nth-child(2) {width:100%}
#productImage .mask {width:50px}
}