/* CSS Document */

body{
	background-image:url(../images/4_bg.jpg); background-repeat:repeat;	 font-family:Arial, Helvetica, sans-serif; margin:0; padding:0;	
	}

img{
	border:0; padding:0;
	}
@font-face {
	font-family: 'calibri';
	src: url('../fonts/calibri.eot');
	src: local('☺'), url('../fonts/calibri.woff') format('woff'), url('../fonts/calibri.ttf') format('truetype'), url('../fonts/calibri.html') format('svg');
	font-weight: normal;
	font-style: normal;
}
a{text-decoration:none;  color:inherit;}
ul{margin:0; padding:0;}
h1{font-family:Calibri, Geneva, sans-serif; font-size:28px; color:#0081d5; font-weight:normal; margin:0; }
h2{font-family:Calibri, Geneva, sans-serif; font-size:23px; color:#333; font-weight:normal; margin:0; }
h3{font-family: Calibri, Geneva, sans-serif; font-size:19px; color:#0081d5; font-weight:normal; margin:0;  }
h3 a{color:#0081d5; float:left; padding-top:10px;  }


h4{font-family: Arial, Helvetica, sans-serif; font-size:15px; color:#0081d5; font-weight:normal; margin:0;  }
h5{font-family: Arial, Helvetica, sans-serif; font-size:15px; color:#0081d5; font-weight:normal; margin:0;  }


#wrapper{width:980px; height:auto; margin:0 auto; background:#FFF}
#wrapper_in{width:980px; height:auto; float:left; background:#FFF;
/*box-shadow:2px 2px 3px 3px #E1E1E1;
-webkit-box-shadow:2px 2px 3px 3x #E1E1E1;
-moz-box-shadow:2px 2px 3px 3px #E1E1E1;}*/}

.head{width:980px; height:115px; float:left;}
.logo{width:184px; height:85px; float:left; padding:21px 0px 0px 24px;}
.headerright{width:238px; height:78px; float:right; padding:30px 0px 0px 0px;}
.headerright1{width:238px; height:34px; float:left;}
.headerright2{width:238px; height:30px; float:left;}
.txt1{	background-color:#fff; padding-left:5px;	color:#9d9d9d;	border-style:solid;	border-color:#CCC;	border-width:1px; float:left;
	width:145px;	height:22px;	font-family:Arial, Helvetica, sans-serif;	font-size:12px;		margin-bottom:7px;
	}
.txt2{	background-color:#fff; padding-left:5px;	color:#9d9d9d;	border-style:solid;	border-color:#CCC;	border-width:1px;
	width:212px;	height:22px;	font-family:Arial, Helvetica, sans-serif;	font-size:12px;		margin-bottom:7px;
	}
.txt3{	background-color:#fff; padding-left:5px;	color:#9d9d9d;	border-style:solid;	border-color:#CCC;	border-width:1px; float:left;
	width:202px;	height:22px;	font-family:Arial, Helvetica, sans-serif;	font-size:12px;		margin-bottom:7px;	}
.textBox1{	background-color:#fff; padding-left:5px;	color:#9d9d9d;	border-style:solid;	border-color:#CCC;	border-width:1px; float:left;
	width:202px;	height:90px;	font-family:Arial, Helvetica, sans-serif;	font-size:12px;		margin-bottom:7px;	}
.textBox2{	background-color:#DFDFDF; padding-left:5px;	color:#9d9d9d;	float:left;
	width:202px;	height:40px;	font-family:Arial, Helvetica, sans-serif;	font-size:12px;		margin-bottom:7px;	}
#bookbuttons{	width:212px;	text-align:right;}
.menu{width:980px; height:41px; float:left; background:#a2a2a2;}
.slide{width:980px; height:334px; float:left;}
.shareImg{ margin-left:10px;}
.shareImg img{padding:3px 0px 0px 8px; }
.imagemenu{width:990px; height:132px; float:left; padding:10px 0px 0px 4px;}

#footerLast{width:100%; background-color:#cdcdcd; height:48px; float:left;}
#footer_in{width:980px;height:28px; margin:0 auto; text-align:center; color:#9d9d9d; font-size:11px; padding-top:18px;}
#footer_in a:hover{ color:#666;}
#templatemo_menu {
	width: 980px;
	height: 62px;
	
}


.videoHead{width:143px; text-align:center; padding:5px 8px 5px 0px; float:left;}
.videoHead img{ width:138px; height:82px;  }	

.photo{height:380px; width:682px; float:left}


.item {
	width:176px;	height:117px;		border:2px solid #CCC;		margin:5px 5px 5px 0;	
	/* required to hide the image after resized */
	overflow:hidden;	
	/* for child absolute position */
	position:relative;	
	/* display div in line */
	float:left;
}


.marginRgt{margin-right:18px;}
.item .caption {	width:176px;	height:117px;	background:#000;	color:#fff;	font-weight:bold;			/* fix it at the bottom */
	position:absolute;	left:0;
	/* hide it by default */
	display:none;
	/* opacity setting */
	filter:alpha(opacity=80);    /* ie  */
	-moz-opacity:0.8;    /* old mozilla browser like netscape  */
	-khtml-opacity: 0.8;    /* for really really old safari */  
	opacity: 0.8;    /* css standard, currently it works in most modern browsers like firefox,  */

}

.item .caption a {	text-decoration:none;	color:#42b4ff;	font-size:19px;	 font-family: Arial, Helvetica, sans-serif;	
	/* add spacing and make the whole row clickable*/
	padding:5px;	display:block;
}

.item .caption p {
	padding:5px;		margin:0;	font-size:10px;}

.item img {
	border:0;
	
	/* allow javascript moves the img position*/
	position:absolute;
}

.clear {
	clear:both;	
}




.welcome{width:980px; height:auto; float:left;  margin-bottom:30px;}
.about{width:425px; min-height:212px; float:left;  font-size:13px;  padding:18px 0px 0px 35px; color:#838383; text-align:justify; line-height:18px;}
.aboutLeft{width:440px; min-height:212px; float:left; font-family: Arial, Helvetica, sans-serif; font-size:14px;  padding:18px 0px 0px 35px; color:#838383; text-align:justify;}
.aboutLeft ul{margin:0; padding:0;}
.aboutRight{width:605px; min-height:212px; float:left;  font-family: Arial, Helvetica, sans-serif;  font-size:13px;  padding:18px 0px 0px 35px; color:#838383; text-align:justify;}
.aboutRight2{width:440px; min-height:212px; float:left;  font-family: Arial, Helvetica, sans-serif;  font-size:13px;  padding:18px 0px 0px 35px; color:#838383; text-align:justify;}
.aboutRight a{color:#333;}

.underline{width:100%;height:1px;background:#CCC; margin-bottom:14px; margin-top:3px;}
.underline2{width:915px;height:1px;background:#CCC; margin:3px 0px 14px 35px; }
.more{width:60px; height:18px; background:#CCC; float:right; padding:4px; text-align:center; margin-top:16px; }
.more:hover{background:#B6B6B6;color:#FFF; }
.more2{min-width:60px; height:18px; background:#CCC; float:right; padding:4px 6px 4px 6px; text-align:center; margin-top:6px; }
.more2:hover{background:#B6B6B6;color:#FFF; }
.save{width:447px; height:128px; float:left; padding:40px  0px 0px 34px; }
.save img{padding-right:20px;}
.save2{width:447px; height:128px; float:left; padding:15px  0px 0px 11px; }
.save2 img{padding-right:20px;}
.newsletter{width:430px; height:28px; float:left; padding:30px 0px 0px 30px;}
.newsletterText{ float:left; color:#0081d5; margin-right:10px; font-family:Verdana, Geneva, sans-serif; font-size:15px;}
.newsletterSend{ float:right; padding-top:2px; }

.video{width:340px; min-height:250px; float:left; font-family: Arial, Helvetica, sans-serif; font-size:14px; padding:0px 0px 0px 35px; color:#838383;}
.latest{width:541px; float:left; font-family: Arial, Helvetica, sans-serif; font-size:12px; padding:0px 0px 0px 35px; color:#838383; }
.latest img{padding-bottom:10px;}
.project1{width:164px; min-height:240px; float:left; text-align:justify; margin-right:24px;  line-height:18px;}
.project2{width:164px; height:240px; float:left; text-align:justify; line-height:18px;}

.footer{width:980px; height:255px; float:left;  margin:15px 0px 20px 0px;}
.footer1{height:195px; width:137px;  float:left; margin:0px 15px 0px 35px; }
.footer2{height:195px; width:88px;  float:left; margin:0px 15px 0px 20px; }
.footer3{height:195px; width:154px;  float:left; margin:0px 15px 0px 20px; }
.footer4{height:195px; width:184px;  float:left; margin:0px 15px 0px 20px;  }
.footer5{height:195px; width:205px;  float:left; margin:0px 0px 0px 20px; }
.footer ul{list-style:none; padding-left:0px; margin:10px 0px 0px 0px; line-height:22px; }
.footerBreak{height:212px; margin-top:42px; width:1px; background-color:#DADADA; float:left;}
.footer a{ font-size:11px;color:#838383;} 
.footer a:hover{ color:#333;} 


.productLeft{width:268px; min-height:212px; float:left; margin:10px 0px 0px 10px; 
padding:18px 0px 0px 35px; color:#838383; border:1px solid #CCC;}

.contact1{width:220px; min-height:100px; float:left}
.contact2{width:210px; min-height:100px; float:right}


/*-------LOGIN STARTS HERE -------*/

/* Login Container (default to float:right) */
#loginContainer {
    position:relative; z-index:1000;
    float:right;
    font-size:12px; margin-right:5px;
}

/* Login Button */
#loginButton { 
    display:inline-block;
    float:right;
    background:#E4E4E4;    border:1px solid #CCC; 
    
    position:relative;
    z-index:30;
    cursor:pointer;
}

/* Login Button Text */
#loginButton span {
    color:#838383; 
    font-size:12px; 
    padding:4px 29px 4px 10px;
    background:url(../images/loginArrow.png) no-repeat 53px 2px;
    display:block;
}

#loginButton:hover {
   /* background:url(../images/buttonbgHover.png) repeat-x;*/
   background:#FFF;
}

/* Login Box */
#loginBox {
    position:absolute;
    top:27px;
    right:0;
    display:none;
    z-index:29;
}

/* If the Login Button has been clicked */    
#loginButton.active {
    border-radius:3px 3px 0 0;
}

#loginButton.active span {
    background-position:53px -79px;
}

/* A Line added to overlap the border */
#loginButton.active em {
    position:absolute;
    width:100%;
    height:1px;
    background:#d2e0ea;
    bottom:-1px;
}

/* Login Form */
#loginForm {
    width:248px; 
    border:1px solid #CCC;
    border-radius:3px 0 3px 3px;
    -moz-border-radius:3px 0 3px 3px;
    margin-top:-1px;
    background:#E4E4E4;
    padding:6px;
}

#loginForm fieldset {
    margin:0 0 12px 0;
    display:block;
    border:0;
    padding:0;
}

fieldset#body {
    background:#fff;
    border-radius:3px;
    -moz-border-radius:3px;
    padding:10px 13px;
    margin:0;
}

#loginForm #checkbox {
    width:auto;
    margin:1px 9px 0 0;
    float:left;
    padding:0;
    border:0;
    *margin:-3px 9px 0 0; /* IE7 Fix */
}

#body label {
    color:#0081D5;
    margin:9px 0 0 0;
    display:block;
    float:left;
}

#loginForm #body fieldset label {
    display:block;
    float:none;
    margin:0 0 6px 0;
}

/* Default Input */
#loginForm input {
    width:92%;
    border:1px solid #899caa;
    border-radius:3px;
    -moz-border-radius:3px;
    color:#838383;
   padding:8px 8px;
    box-shadow:inset 0px 1px 3px #bbb;
    -webkit-box-shadow:inset 0px 1px 3px #bbb;
    -moz-box-shadow:inset 0px 1px 3px #bbb;
    font-size:13px;
}

/* Sign In Button */
#loginForm #login {
    width:auto;
    float:left;
    background:#339cdf url(../images/loginbuttonbg.png) repeat-x;
    color:#fff;
    padding:7px 10px 8px 10px;
    text-shadow:0px -1px #278db8;
    border:1px solid #339cdf;
    box-shadow:none;
    -moz-box-shadow:none;
    -webkit-box-shadow:none;
    margin:0 12px 0 0;
    cursor:pointer;
    *padding:7px 2px 8px 2px; /* IE7 Fix */
}

/* Forgot your password */
#loginForm span {
    text-align:center;
    display:block;
    padding:7px 0 4px 0;
}

#loginForm span a {
    color:#838383;
        font-size:12px;
}

input:focus {
    outline:none;
}/*login*/

/* aacordion*/

.topnav {
	width:254px;
	padding: 40px 28px 25px 0;
	 font-family: Arial, Helvetica, sans-serif;
}

ul.topnav {
	padding: 0;
	margin: 0;
	font-size: 1em;
	line-height: 0.5em;
	/* list-style: none;*/
}

ul.topnav li {}

ul.topnav li a {
	line-height: 10px;
	font-size: 15px;
	padding: 10px 5px;
	color:#0081d5;
	display: block;
	text-decoration: none; text-align:
	
}

ul.topnav li a:hover {
	background-color:#CCC;
	color:white;
}

ul.topnav ul {
	margin: 0;
	padding: 0;
	display: none;
}

ul.topnav ul li {
	margin: 0;
	padding: 0;
	clear: both;
}

ul.topnav ul li a {
	padding-left: 20px; color:#333;
	font-size: 14px;
	font-weight: normal;
	outline:0; 
}

ul.topnav ul li a:hover {
	background-color:#CCC;
	color:#675C7C;
}

ul.topnav ul ul li a {
	color:#666;
	padding-left: 40px;
}

ul.topnav ul ul li a:hover{
	background-color:#CCC;
	color:#675C7C;
}



ul.topnav span{
	float:right;
}
/* aacordion*/




.smallimage1{padding-left:10px; float:right}
.productimage1{ width:200px; float:left}
.productimage3{ width:250px; float:right}
.productimage3 img{ width:250px;}
.productimage2{ width:400px; float:left}

.productimage1 img{width:250px;}
.colorTable{padding:0px 10px ; width:138px; height:62px; font-size:13px; color:#FFF; }
.colorTable2{padding:0px 10px; width:122px; height:62px; font-size:13px; color:#000; }

.proTableImg{ width:173px; height:190px; float:left;text-align:center; border:1px dotted #CCC; padding:13px;}
.proTableImg img{max-width:170px; float:left; max-height:120px; hspace:50%; }

.dotline{clear:both; height:2px; border-bottom:1px dotted #CCC;}
.important{color:#0081d5; font-weight:bold} 

.mainImage{width:605px;}