﻿#canvas
{
	max-width: 1107px;
	margin: 0px auto;
	padding:0;
	background-color:#fff;
}
#page
{
	padding: 15px 0;
	opacity: 1;
	position: relative;
}
img[data-src]
{
	opacity: 1;
	-webkit-transition: opacity .3s ease-out;
	-moz-transition: opacity .3s ease-out;
	-o-transition: opacity .3s ease-out;
	transition: opacity .3s ease-out;
}
#productHome, #productList
{
	width: 100%;
	clear: both;
	overflow:hidden;
	margin-bottom: 50px;
}
#productHome > .wrapper, #productList > .wrapper
{
	width: 102%;
	margin-left: -2%;
	margin-top: 0%;
}

#productHome .project
{
	position: relative;
	float: left;
	margin-left: 2%;
	margin-top: 3%;
	width: 23%;
	/*width: 17%;
	cursor: pointer;*/
	-webkit-transform: translatez(0);
}
#productList .project
{
	position: relative;
	float: left;
	margin-left: 2.912621359223301%;
	margin-top: 3%;
	width: 30.420711974110034%;
	cursor: pointer;
	-webkit-transform: translatez(0);
	}
#productHome .project:nth-child(4n+1)
{
	clear: left;
}
#productList .project:nth-child(3n+1)
{
	clear: left;
}
#productHome .project .project-image, #productList .project .project-image
{
	background: #eee;
	margin-bottom: 3%;
}
#productHome .project .project-image img, #productList .project .project-image img { max-height:100%;}
#productHome .project .project-image .intrinsic, #productList .project .project-image .intrinsic
{
	padding-bottom: 100%;
	line-height: 0;
	text-align: center;
	position: relative;
	overflow: hidden;
}
#productHome .project .project-image .intrinsic, #productList .project .project-image .intrinsic
{
	opacity: 1;
	-webkit-transition: opacity .14s ease-out;
	transition: opacity .14s ease-out;
}
#productHome .project .project-image .content-fill, #productList .project .project-image .content-fill
{
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	overflow: hidden;
}
#productHome .project .project-title, #productList .project .project-title
{
	font-family: Georgia,serif;
	font-weight: normal;
	font-style: italic;
	font-size: 12px;
	letter-spacing: 0px;
	font-family: UTMAvo;
	line-height: 1.6em;
	text-decoration: none;
	letter-spacing: .06em;
	text-align: center;
	font-weight: 300;
	font-style: normal;
	color: #036699;
	min-height:44px;
}
.project .project-title a {color: #036699; font-size:24px;}
.project .project-title a:hover {color: #000;font-size:24px;}

.project .project-code { clear:both; overflow:hidden; padding:0 10px;}
.project .project-code .code { width:60%; float:left; min-height:30px; color:#999;}
.project .project-code .status { width:100%; min-height:30px; text-align:center;}
#productHome .title, #productList .title { clear:both; border-bottom:3px solid #036699; padding:0; font-size:15pt;}
#productHome .title h2, #productList .title h2 { font-size:16px; font-weight:bold; color:#036699}
#productHome .title h2 a, #productList .title h2 a{ color:#036699; text-transform:uppercase; font-weight:bold;}
#productHome .title h2 a:hover, #productList .title h2 a:hover{  color:#000}

.project .Price { clear:both; text-align:center; padding:5px 0;}
.pBox .title
{
	font-family: UTMAvo;
	letter-spacing: 0px;
	font-size: 16px;
	line-height: 1.6em;
	clear: both;
	width: 100%;
}
#header
{
	margin-bottom: 40px;
	position:relative;
	/*background: url(../../images/bg_header.jpg) no-repeat 0 0;*/
}


.mnTop
{
	min-height: 35px;
	z-index: 9999;
	float: left;
	background-color:#036699;
	width:100%;
	clear:both;
}
.footer
{
	clear: both;
	padding: 30px 0 0 0;
	overflow: hidden;
	margin: 0; color:#fff;
	
}
.footer h2 { clear:both; padding:5px 0; color:#fff;}
.footer p { padding:0;}
.footer .FooterCopyright { padding:10px 0;	clear:both;background-color:#ececec;overflow:hidden; color:#333;}
.footer .FooterCopyright h2 { color:#000;}
.footer .FooterMenu { clear:both;background-color:#036699; padding:10px 0; overflow:hidden;}
.footer .FooterCopyright a { color:#333;}
.footer .FooterMenu a { color:#fff;}
.footer .FooterCopyright a:hover { color:#036699;}
.footer .FooterMenu a:hover { color:#000;}
.footer .FooterSocial {	clear:both; font-size:10pt; overflow:hidden; color: #333333;background-color:#e8e8e8; padding:10px 0;overflow:hidden;}
.footer .FooterSocial a { color:#333;}
.footer .FooterSocial a:hover { color:#000;}
.footer .FooterCopyright ul li
{
	display: inline;
}
.mainContent
{
	width: 69.11%;
	float: left;
}
.Right
{
	width: 29.89%;
	float: right; 
	margin-right: 0;
}
.breadcrumbs { clear:both; padding:5px 2px; min-height:34px; font-size:11pt; margin:auto; position:relative; }
.breadcrumbs a { color:#999;}
.breadcrumbs a:hover { color:#111;}
.pBox { clear:both; overflow:hidden; margin: 0 0 30px 0;}
.pBox .title { border-bottom:0px solid #999;}
.pBox .title h1 { color: #036699;padding: 5px 0; font-size:16pt; text-align: left;text-transform: uppercase; margin:0; font-family:UTMAvo; border-bottom:3px solid #036699;}
.pBox .content { padding:5px 0;line-height: 1.7em;}
.pBox .content .desc { text-align:justify; padding:10px 0px; overflow:hidden;}
.pBox .content .desc img { max-height:100px; border:0px; margin-right:10px; float:left;}

.newsItem { clear:both; overflow:hidden; padding:20px 0; border-bottom:1px dotted #CCC;}
.newsItem img { max-width:100%; margin-bottom:10px; overflow:hidden; border:0px;}
.newsItem .title {  overflow:hidden; font-family:UTMAvo; border-bottom:0 !important; float:left; padding:0;color: #666; margin-top:-10px; clear:none;}
.newsItem .title a {  color: #333 !important; font-weight:bold;}
.newsItem .title a:hover {   color: #036699 !important; font-weight:bold;}
.newsItem .desc {  padding:0 !important; font-size:16px; overflow:hidden; float:left;}

.nDetail { clear:both;}
h1.nTitle {text-align: left;padding: 15px 0;color: #036699; margin:0;font-family: UTMAvo;border-bottom: 1px solid #EEE;}

.nIntro {text-align:justify; color:#747474; padding-bottom:10px; font-weight:bold;}
.nDate { text-align:right; clear:both; color:#333333; padding:0 15px 0 0; font-size:15px;}
.nImage { width:100%; clear:both; margin-bottom:10px; text-align:center;}
.nImage img { max-width:100%; border:0px;}
.nContent { text-align:justify;line-height: 1.7em; padding:10px 0;}
.nContent img { max-width:98% !important; border:0px; height:auto;}
.nContent h2 { background:transparent !important; clear:both; font-size: 17pt;font-weight: bold;color: #036699; width:100%; padding:15px 0 5px 0}
.nContent h3 { background:transparent !important; clear:both; font-size: 15pt;font-weight: bold;color: #036699;width:100%; padding:15px 0 5px 0}
.nContact { padding:10px; border-radius:5px; background-color:#efefef; border:1px solid #EEE;}
.nAuthor { clear:both; text-align:right; padding:5px;}
.nSource { clear:both; text-align:right; padding:5px;}
.nButton { clear:both; text-align:right; padding:5px;}
.nClips { clear:both; text-align:center; padding:5px;}

.nContent table,.nGallery table {width:100%;	border: 1px solid #CCC; }
.nContent thead tr,.nGallery thead tr { background-color:#EEE; }
.nContent tr,.nGallery tr { border: 1px solid #CCC; }	
.nContent td,.nGallery td { 		border: none;	padding:5px;	border-bottom: 1px solid #CCC; border-right: 1px solid #CCC;	}

.socialBox { clear:both; padding:5px; position:relative; height:35px;}
.socialBox .tw {width: 85px;position: absolute;top: 10px;left: 230px;overflow: hidden;}
.socialBox .fb {width: 150px;position: absolute;top: 10px;left: 0px;}
.socialBox .gl {width: 85px;position: absolute;top: 10px;left: 150px;overflow: hidden;}
.socialBox .pin {width: 85px;position: absolute;top: 10px;left: 340px;overflow: hidden;}
/*pro detail*/
.ProDetail { width:100%; clear:both;}
.ProImg { position: relative; width:32%; float:left; text-align:center; padding-right:3%; padding-bottom:10px; padding-top:10px;}
.ProImg img { max-width:100%;}
.ProName { width:65%;font:bold 15pt arial; color:Blue; float:right;}
.ProInfo { width:65%; float:right;}
.ProInfo .short { clear:both; margin:5px 0; text-align:justify;}
.ProInfo .rows { padding:3px 0;}
.ProInfo .size, .ProInfo .color { clear:both; overflow:hidden; margin:3px 0;}
.ProInfo .color ul li { float:left; padding:0 10px 0 0; }
.ProInfo .color ul li b { background-color:#CCC; border-radius:3px; padding:3px 10px; color:#333;}
.ProInfo .size ul li { float:left; padding:0 10px 0 0; }
.ProInfo .size ul li b { background-color:#CCC; border-radius:3px; padding:3px 10px; color:#333; font-weight:normal !important;}
.ProInfo .color ul li img, .ProInfo .size ul li img { border:1px solid #EEE; max-width:24px;}
.ProOther { clear:both; padding-bottom:3px; padding-top:5px;  width:100%;}
.pAll { clear:both; width:100%; margin:10px 0;}
.pAll img { max-width:100%; height:auto;}
.addtocart { text-align:left;}

.aGallery, .GalleryProBox { clear:both;}
.aGallery ul li, .GalleryProBox ul li { padding:5px 5px 5px 0px; float:left; text-align:center; }
.aGallery ul li img, .GalleryProBox ul li img { max-width:100px;}

.aImage img { max-width:100%;}
.aDetail { width:65%; float:left;}
.aRight { width:30%; float:right; margin-top:-7px;}
.aRight h1 { margin-top:0;}