/*==========================================
Old Screen
==========================================*/
@media (max-width:1800px) {
.homeRightCircle h1{font-size: 40px;}
.homeRightCircle p{font-size: 20px; margin-bottom: 15px; line-height: 30px; word-spacing: 2px;}
}
@media (max-width: 1620px) and (min-width: 1501px){
.homeRightCircle h1{font-size: 40px;}
.homeRightCircle p{font-size: 20px; margin-bottom: 15px; line-height: 25px; word-spacing: 2px;}
}
	

@media screen and (max-width: 1580px ) and (min-width: 1281px) {
#contact-us-content{width: 77%;}
#contact-us-content .address, #contact-us-content .tel, #contact-us-content .fax, #contact-us-content .email{padding-left: 0px;}

#contact-us-content2{width: 77%;}
#contact-us-content2 .address, #contact-us-content2 .tel, #contact-us-content2 .fax, #contact-us-content2 .website{padding-left: 0px;}
.contact-form{width: 77%;}
#back-top{width: 69px; margin: 0px auto; position: initial;}
}

@media (max-width:1500px) and (min-width: 1401px) {
.homeRightCircle h1{font-size: 30px;}
.homeRightCircle p{font-size: 22px; margin-bottom: 15px; line-height: 20px; word-spacing: 2px;}
.homeRightCircle{padding-right: 20px;}
}

@media (max-width:1500px) and (min-width: 1341px) {
.homeRightCircle h1{font-size: 30px;}
.homeRightCircle p{font-size: 19px; margin-bottom: 15px; line-height: 22px; word-spacing: 2px;}
.homeRightCircle{padding-right: 20px;}
}

@media (max-width:1340px) and (min-width: 1281px) {
.homeRightCircle h1{font-size: 30px;}
.homeRightCircle p{font-size: 19px; margin-bottom: 15px; line-height: 22px; word-spacing: 2px;}
.homeRightCircle{padding-right: 20px; top: 12%;}
}

@media (max-width: 1280px){
.homeRightCircle h1{font-size: 25px}
.homeRightCircle p{font-size: 15px; margin-bottom: 15px; line-height: 19px; text-align: inherit;}
.homeRightCircle .readMore{font-size: 15px;}

header.fixed hgroup.fRight nav a{margin-right: 70px;}

#productDetail .mainContent #productDetailContent2{width: 80%}

/*
.wrap{padding: 0px 15px 0px 0px;}	
	
#homeRight{display:none;}
#homeLeft{width: 100%;}
#mobileBelow{display: block; background-color: #76cffc; width: 100%;}
#mobileCircle{display: block; background-color: #85d5fd; width: 100%;}
#mobileBelow h1{font-size: 50px; color: #fff; font-weight: 300;}
#mobileBelow p{color: #fff; text-align: initial; font-size: 22px; word-spacing: 4px; font-weight: lighter; margin-bottom: 20px;}
#mobileBelow #mobileText{width:55%; margin: 0px auto; padding: 40px 0px;}
#mobileCircle #mobileCircleArea{width:55%; margin: 0px auto; padding: 40px 0px; height: 100%}
#mobileBelow #mobileText .readMore{text-align: right;}
#mobileBelow #mobileText .readMore:hover {color: #2a4c8a;}
#mobileBelow #mobileText .readMore img {padding-left: 20px;}
*/
}	
@media(max-width: 1450px) and (min-width: 1101px){
#productDetailContent2 #detailRight{padding-left: 20px}
}

@media(max-width: 1200px){
.homeRightCircle h1{font-size: 25px}
.homeRightCircle p{font-size: 15px; margin-bottom: 10px; line-height: 19px; text-align: inherit;}
.homeRightCircle .readMore{font-size: 15px;}
.homeRightCircle{padding-right:10px; top:13%;}
}

@media(max-width: 1100px){
.about-us-right{height: initial;}
.wrap{padding: 0px 15px 0px 0px;}	
#homeRight{display:none;}
#homeLeft{width: 100%;}
#mobileBelow{display: block; background-color: #76cffc; width: 100%;}
#mobileCircle{display: block; background-color: #85d5fd; width: 100%;}
#mobileBelow h1{font-size: 50px; color: #fff; font-weight: 300;}
#mobileBelow p{color: #fff; text-align: initial; font-size: 22px; word-spacing: 4px; font-weight: lighter; margin-bottom: 20px;}
#mobileBelow #mobileText{width:55%; margin: 0px auto; padding: 40px 0px;}
#mobileCircle #mobileCircleArea{width:55%; margin: 0px auto; padding: 40px 0px; height: 100%}
#mobileBelow #mobileText .readMore{text-align: right;}
#mobileBelow #mobileText .readMore:hover {color: #2a4c8a;}
#mobileBelow #mobileText .readMore img {padding-left: 20px;}
}

@media (max-width: 1100px){
 .mobileIcon {display: block;}
hgroup.fRight{display:none;}
}

@media screen and (max-width: 1100px ) and (min-width: 1000px) {
.wrap {/*width:1000px*/}


.mainContent{margin-top:85px;}
#back-top{width: 69px; margin: 0px auto; position: initial;}
.breadcrumb{font-size: 16px;}

.newsGrid{width:45%;}
#newsDetail {margin-top:-10px;}

.productsGrid{width:21%;}

/*----------
about-us
----------*/
.about-us-mobile{display:block;}
.about-us-left{display:none;}
.about-us-right{width:100%; background: #76cffc;}
.about-us-text {margin: 25px 30px 80px 30px;}
.about-us-text p{text-align:justify;}

/*----------
contact-us
----------*/
#contact-us-content{width: 55%;}
#contact-us-content2{width: 55%;}
.contact-form{width: 55%;}
#contact-us-content ul li:first-child{width: 100%;}
#contact-us-content ul li{width: 33.3%;}
#contact-us-content2 ul li:first-child{width: 100%;}
#contact-us-content2 ul li{width: 33.3%;}
.icon_title{font-size: 16px;}
.details{font-size: 16px;}
.address .map{font-size: 16px;}
#contact-us-content ul li{margin-bottom: 30px;}
#contact-us-content2 ul li{margin-bottom: 30px;}
.contact-form .fLeft, .contact-form .fRight{width: 100%;}
.contact-form .fLeft .tableTr div{width:100%;}
.contact-form .fRight .tableTr div{width:100%;}
.contact-form .tableTr div:nth-of-type(1){padding-right: 10px;}
.contact-form .tableTr div:nth-of-type(2){padding-left: 10px;}
.contact-form .tableTr div.contact-textarea{padding-right: 0px;}

/*----------
productDetail
----------*/
.swipe{display: block;}
#productDetailTop{height: 100%;}
#productDetailContent2{width: 55%;}
/*#productDetailContent2 #detailLeft{width: 100%; float: none; margin-bottom: 50px;}*/
#productDetailContent2 #detailLeft{width: 303px; float: none; margin: 0 auto; margin-bottom: 50px;}
.mainPhoto{width: 100%;}
.thumbnail{width: 100%;}
#productDetailContent2 #detailRight{width: 100%; float: none;}
.productStyle{text-align: left; margin-left: 0px; margin-right: 0px;}
.productStyle ul li{display: inline-block; /*width: 45%;*/margin-right: 50px; margin-bottom: 10px; font-size: 16px;}
.productTable{overflow: auto; margin-left: 0px; font-size: 16px;}
.productTable table{width: 800px;}
#productDetail .backBtnSection{margin-bottom: 30px;}
.remarks{ margin-left: 0px; font-size: 15px;}


}

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

@media screen and (max-width: 1000px ) and (min-width: 768px) {
.wrap {/*width:748px*/}
.mobileIcon {display: block;}
hgroup.fRight{display:none;}

.mainContent{margin-top:85px;}
.breadcrumb{font-size: 16px;}
#back-top{width: 69px; margin: 0px auto; position: initial;}

/*----------
index
----------*/
#homeLeft{width: 100%;}
#mobileBelow{display: block; background-color: #76cffc; width: 100%;}
#mobileBelow h1{font-size: 50px; color: #fff; font-weight: 300;}
#mobileBelow p{color: #fff; text-align: initial; font-size: 22px; word-spacing: 4px; font-weight: lighter; margin-bottom: 20px;}
#mobileBelow #mobileText{width:85%; margin: 0px auto; padding: 40px 0px;}
#mobileBelow #mobileText .readMore{text-align: right;}
#mobileBelow #mobileText .readMore:hover {color: #2a4c8a;}
#mobileBelow #mobileText .readMore img {padding-left: 20px;}
#mobileCircle #mobileCircleArea{width: 85%;}
.mobileCircle1{width: 200px; height: 200px;}

.newsGrid{width:45%;}
/*----------
newsDetail
----------*/
#newsDetail {margin-top:-10px;}

#newsDetail .breadcrumb {position: relative; top: -75px; margin-bottom:30px;}
#newsDetail .breadcrumb img {vertical-align: bottom;}
#newsDetailContent, #newsDetailContent2 {width:85%;}
#newsDetail h1 {position: relative; top: 95px; font-size:30px;}
#newsDetailTop {padding-top: 35px;}
#newsDetailContent2 p{line-height:30px;}


/*----------
productList
----------*/
.productsGrid{width:28%;}
.productCateBox{font-size:17px;}
.pearlCateBox{font-size:17px;}

/*----------
productDetail
----------*/
.swipe{display: block;}
#productDetailTop{height: 100%;}
#productDetailContent2{width: 85%;}
/*#productDetailContent2 #detailLeft{width: 100%; float: none; margin-bottom: 50px;}*/
#productDetailContent2 #detailLeft{width: 303px; float: none; margin: 0 auto; margin-bottom: 50px;}
.mainPhoto{width: 100%;}
.thumbnail{width: 100%;}
#productDetailContent2 #detailRight{width: 100%; float: none;}
.productStyle{text-align: left; margin-left: 0px; margin-right: 0px;}
.productStyle ul li{display: inline-block; /*width: 45%;*/margin-right: 50px; margin-bottom: 10px; font-size: 16px;}
.productTable{overflow: auto; margin-left: 0px; font-size: 16px;}
.productTable table{width: 800px;}
#productDetail .backBtnSection{margin-bottom: 30px;}
.remarks{ margin-left: 0px; font-size: 15px;}


/*----------
contact-us
----------*/
#contact-us-content{width: 85%;}
#contact-us-content2{width: 85%;}
.contact-form{width: 85%;}
#contact-us-content ul li:first-child{width: 100%;}
#contact-us-content ul li{width: 33.3%;}
#contact-us-content2 ul li:first-child{width: 100%;}
#contact-us-content2 ul li{width: 33.3%;}
.icon_title{font-size: 16px;}
.details{font-size: 16px;}
.address .map{font-size: 16px;}
#contact-us-content ul li{margin-bottom: 30px;}
#contact-us-content2 ul li{margin-bottom: 30px;}
.contact-form .fLeft, .contact-form .fRight{width: 100%;}
.contact-form .fLeft .tableTr div{width:100%;}
.contact-form .fRight .tableTr div{width:100%;}
.contact-form .tableTr div:nth-of-type(1){padding-right: 10px;}
.contact-form .tableTr div:nth-of-type(2){padding-left: 10px;}
.contact-form .tableTr div.contact-textarea{padding-right: 0px;}

/*----------
about-us
----------*/
.about-us-mobile{display:block; margin-bottom:25px;}
.about-us-left{display:none;}
.about-us-right{width:100%; background: #76cffc;}
.about-us-text {margin: 25px 30px 80px 30px; position:relative; top:40px;}
.about-us-text p{text-align:justify;}
.about-us-mobile img{width:50%; margin:0;}
#about-us .breadcrumb{margin-bottom:40px;}


}

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

@media screen and (max-width: 767px ) and (min-width: 551px) {
#contact-us-content{width: 85%;}
#contact-us-content2{width: 85%;}
.contact-form{width: 85%;}
.breadcrumb{font-size: 16px;}
#contact-us-content ul li:first-child{width: 100%;}
#contact-us-content ul li{width: 33.3%;}
#contact-us-content2 ul li:first-child{width: 100%;}
#contact-us-content2 ul li{width: 33.3%;}
#back-top{width: 69px; margin: 0px auto; position: initial;}
.icon_title{font-size: 16px;}
.details{font-size: 16px;}
.address .map{font-size: 16px;}
#contact-us-content ul li{margin-bottom: 30px;}
#contact-us-content2 ul li{margin-bottom: 30px;}
.contact-form .fLeft, .contact-form .fRight{width: 100%;}
.contact-form .fLeft .tableTr div{width:100%;}
.contact-form .fRight .tableTr div{width:100%;}
.contact-form .tableTr div:nth-of-type(1){padding-right: 10px;}
.contact-form .tableTr div:nth-of-type(2){padding-left: 10px;}
.contact-form .tableTr div.contact-textarea{padding-right: 0px;}
}

@media screen and (max-width: 767px ) and (min-width: 524px) {
.swipe{display: block;}
.breadcrumb{font-size: 16px;}
#productDetailTop{height: 100%;}
#productDetailContent2{width: 85%;}
/*#productDetailContent2 #detailLeft{width: 100%; float: none; margin-bottom: 50px;}*/
#productDetailContent2 #detailLeft{width: 303px; float: none; margin: 0 auto; margin-bottom: 50px;}
.mainPhoto{width: 100%;}
.thumbnail{width: 100%;}
#productDetailContent2 #detailRight{width: 100%; float: none;}
.productStyle{text-align: left; margin-left: 0px; margin-right: 0px;}
.productStyle ul li{display: inline-block; /*width: 45%;*/margin-right: 50px; margin-bottom: 10px; font-size: 16px;}
.productTable{overflow: auto; margin-left: 0px; font-size: 16px;}
.productTable table{width: 800px;}
#productDetail .backBtnSection{margin-bottom: 30px;}
.remarks{ margin-left: 0px; font-size: 15px;}
#back-top{width: 69px; margin: 0px auto; position: initial;}
}

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

.mobileIcon {display: block;}
hgroup.fRight{display:none;}

.flexFloatL li {width:48%; margin-right:4%;}
.flexFloatL li:nth-child(even) {margin-right:0;}

.mainContent{margin-top:85px;}

/*----------
index
----------*/
#homeRight{display:none;}
#homeLeft{width: 100%;}
#mobileBelow{display: block; background-color: #76cffc; width: 100%;}
#mobileBelow h1{font-size: 50px; color: #fff; font-weight: 300;}
#mobileBelow p{color: #fff; text-align: initial; font-size: 22px; word-spacing: 4px; font-weight: lighter; margin-bottom: 20px; line-height: 30px;} 
#mobileBelow #mobileText{width:85%; margin: 0px auto; padding: 40px 0px;}
#mobileBelow #mobileText .readMore{text-align: right;}
#mobileBelow #mobileText .readMore:hover {color: #2a4c8a;}
#mobileBelow #mobileText .readMore img {padding-left: 20px;}
#mobileCircle #mobileCircleArea{width: 85%;}
.mobileCircle1{width: 180px; height: 180px;}

/*----------
newsList
----------*/
.newsListLeft{display:none;}
.newsListMiddle{display:none;}
.newsListRight{width:100%; left:0;}
.newsGrid{width:44%;}
.newsListContent{padding-left:15px;}
.yearBox-mobile{display:block;}
#newsList .mainContent{min-height:0px;}

/*----------
newsDetail
----------*/
#newsDetail {margin-top:-10px;}

#newsDetail .breadcrumb {position: relative; top: -75px; font-size:13px; margin-bottom:30px;}
#newsDetail .breadcrumb img {vertical-align: bottom;}
#newsDetailContent, #newsDetailContent2 {width:85%;}
#newsDetail h1 {position: relative; top: 100px; font-size:25px; line-height:35px;}
#newsDetailTop {padding-top: 35px;}
#newsDetail h2{font-size:22px;}
#newsDetailContent2 p{line-height:30px;}

/*----------
productList
----------*/
.productsListLeft{display:none;}
.productsListMiddle{display:none;}
.productsListRight{width:100%; left:0;}
.productsGrid{width:44%;}
.productsListContent{padding-left:5%;}
.productBox-mobile , .pearlBox-mobile {display:inline-block;}

/*----------
about-us
----------*/
.about-us-mobile{display:block; margin-bottom:25px;}
.about-us-left{display:none;}
.about-us-right{width:100%; background: #76cffc;}
.about-us-text {margin: 25px 30px 80px 30px; position:relative; top:40px;}
.about-us-text p{text-align:justify;}
.about-us-mobile img{width:50%; margin:0;}
#about-us .breadcrumb{margin-bottom:40px;}


.footer-desktop{display:none;}
.footer-mobile{display:block;}
p.font13{line-height:20px;}


}
@media screen and (max-width: 650px) and (min-width: 500px){
#mobileCircle #mobileCircleArea{width: 85%;}
#mobileCircleArea ul li{width: 50%;}
.mobileCircle1{width: 200px; height: 200px;}
}

@media screen and (max-width: 499px){
#mobileCircle #mobileCircleArea{width: 85%;}
#mobileCircleArea ul li{width: 50%;}
.mobileCircle1{width: 150px; height: 150px;}
}
	
	
@media screen and (max-width: 550px ) {
#contact-us-content{width: 85%;}
#contact-us-content2{width: 85%;}
.contact-form{width: 85%;}
.breadcrumb{font-size: 16px;}
#contact-us-content ul li{width: 100%;}
#contact-us-content2 ul li{width: 100%;}
#back-top{width: 69px; margin: 0px auto; position: initial;}
.icon_title{font-size: 16px;}
.details{font-size: 16px;}
.address .map{font-size: 16px;}
#contact-us-content ul li{margin-bottom: 30px;}
#contact-us-content2 ul li{margin-bottom: 30px;}
.contact-form .fLeft, .contact-form .fRight{width: 100%;}
.contact-form .fLeft .tableTr div{width:100%;}
.contact-form .fRight .tableTr div{width:100%;}
.contact-form .tableTr div:nth-of-type(1){padding-right: 10px;}
.contact-form .tableTr div:nth-of-type(2){padding-left: 10px;}
.contact-form .tableTr div.contact-textarea{padding-right: 0px;}
.contact-us-Title{font-size: 25px;}
}

@media screen and (max-width: 523px ) and (min-width: 320px) {
.swipe{display: block;}
.breadcrumb{font-size: 16px;}
#productDetailTop{height: 100%;}
#productDetailContent2{width: 85%;}
/*#productDetailContent2 #detailLeft{width: 100%; float: none; margin-bottom: 50px;}*/
#productDetailContent2 #detailLeft{width: 303px; float: none; margin: 0 auto; margin-bottom: 50px;}
.mainPhoto{width: 100%;}
.thumbnail{width: 100%;}
#productDetailContent2 #detailRight{width: 100%; float: none;}
.productStyle{text-align: left; margin-left: 0px; margin-right: 0px;}
.productStyle ul li{display: inline-block; /*width: 45%;*/margin-right: 50px; margin-bottom: 10px; font-size: 16px;}
.productTable{overflow: auto; margin-left: 0px; font-size: 16px;}
.productTable table{width: 800px;}
#productDetail .backBtnSection{margin-bottom: 30px;}
.remarks{ margin-left: 0px; font-size: 15px;}
#back-top{width: 69px; margin: 0px auto; position: initial;}
}

@media screen and (max-width: 460px ) {
.mobileIcon {display: block;}
hgroup.fRight{display:none;}
.flexFloatL li {width:100%; margin-right:0}

.mainContent{margin-top:85px;}

/*----------
index
----------*/
#homeRight{display:none;}
#homeLeft{width: 100%;}
#mobileBelow{display: block; background-color: #76cffc; width: 100%;}
#mobileBelow h1{font-size: 40px; color: #fff; font-weight: 300;}
#mobileBelow p{color: #fff; text-align: initial; font-size: 20px; word-spacing: 4px; font-weight: lighter; margin-bottom: 20px; line-height: 25px;}
#mobileBelow #mobileText{width:85%; margin: 0px auto; padding: 40px 0px;}
#mobileBelow #mobileText .readMore{text-align: right;}
#mobileBelow #mobileText .readMore:hover {color: #2a4c8a;}
#mobileBelow #mobileText .readMore img {padding-left: 20px;}

/*----------
newsList
----------*/
.newsListLeft{display:none;}
.newsListMiddle{display:none;}
.newsListRight{width:100%; left:0;}
.newsGrid{width:88%;}
.newsListContent{text-align:center;}
.newsListTitle{font-size:16px;}
.newsListDate{font-size:14px;}

.yearBox-mobile{display:block;}
.sub-nav-mobile{left:85%;}

.yearBox-mobile span{font-size:20px;}
#newsList .backBtn{font-size:14px;}
#newsList .sub-nav-tab ul {font-size:20px;}

/*----------
newsDetail
----------*/
#newsDetail {margin-top:-10px;}

#newsDetail .breadcrumb {position: relative; top: -75px; font-size:12px; margin-bottom:30px;}
#newsDetail .breadcrumb img {vertical-align: bottom;}
#newsDetailContent, #newsDetailContent2 {width:85%;}
#newsDetail h1 {position: relative; top: 100px; font-size:26px; line-height:30px;}
#newsDetailTop {padding-top: 35px;}
#newsDetail h2{font-size:20px;}
#newsDetailContent2 p{line-height:25px; font-size:16px;}

/*----------
productList
----------*/
.productsListLeft{display:none;}
.productsListMiddle{display:none;}
.productsListRight{width:100%; left:0;}
.productsGrid{width:42%;}
.productsListContent{padding-left:15px;}
.productBox-mobile , .pearlBox-mobile {display:inline-block;}
.productBox-mobile span , .pearlBox-mobile span{font-size: 15px;}
#productsList .sub-nav-tab ul, #productsList .sub-nav-tab2 ul{font-size:15px;}
#productsList .backBtn{font-size:14px;}

/*----------
about-us
----------*/
.about-us-mobile{display:block; margin-bottom:25px;}
.about-us-left{display:none;}
.about-us-right{width:100%; background: #76cffc;}
.about-us-text {margin: 25px 30px 80px 30px; position:relative; top:40px;}
.about-us-text p{text-align:justify; font-size:16px; line-height:25px;}
.about-us-mobile img{width:50%; margin:0;}
#about-us .breadcrumb{margin-bottom:40px;}


.footer-desktop{display:none;}
.footer-mobile{display:block;}
p.font13{line-height:20px;}
}