/* CSS Document */

body, h1, h2, h3, h4, h5, h6, div, p, dl, dd, ul, ol, li, form, fieldset {
    margin: 0;
    padding: 0;
}

body{
 margin:0;
 background:url(../imgs/bg1.jpg) #fff repeat;
}


/*Letter*/


h1 {
 position: relative;	
 width:auto;
 height:50px;
 margin:10px 0px;
 padding: 5px 15px 5px 10px;
 color:#333333;
 font-family:Verdana;
 font-weight:bold;
 font-size:140%;
 border-bottom:4px solid #cccccc;
 background-color:transparent;
}
h1:first-letter {
 margin-right: .1em;
 font-size: 1.5em;
}

h1::after {
 position: absolute;
 bottom: -4px;
 left: 0;
 z-index: 2;
 content: '';
 width: 20%;
 height: 4px;
 background-color: #3498db;
}

h2 {
 position: relative;
 width:auto;
 height:auto;
 padding:.75em 0em .75em 0em;
 color:#333333;
 font-family:Verdana;
 font-weight:bold;
 font-size:100%;
}

h3 {
 margin:10px 0px;
 padding:0px;
 color:#333333;
 font-family:Verdana;
 font-weight:bold;
 font-size:80%;
}


/*Paragraph*/
p {
 margin:0px;
 padding:0px;
 color:#333333;
 line-height:1em;
 font-family:Verdana;
 font-weight:normal;
 font-size:80%;
 background-color:transparent;
}

/*Link Color*/
a:link {
 color:#000066;
 text-decoration:none;
}
a:visited {
 color:#660066;
}
a:hover {
 color:#00CCFF;
}
a:active {
 color:#FF99FF;
}


/*Site Box Layout*/

#sitebox{
 height:auto;
 width:954px;
 margin:0px auto;
 padding:0px;
 background-color:transparent;
}

#header{
 clear:both;
 float:left;
 height:90px;
 width:950px;
 margin:0px;
 padding:0px;
 background-color:#ffffff;
 border-left:2px solid #ffffff;
 border-right:2px solid #ffffff;
}

#main{
 clear:both;
 float:left;
 height:auto;
 width:950px;
 margin:0px;
 padding:0px 0px 0px 0px;
 border-left:2px solid #ffffff;
 border-right:2px solid #ffffff;
}

#footer{
 clear:both;
 float:left;
 height:auto;
 width:950px;
 margin:0px;
 padding:0px;
 border-top:1px solid #b5c2c9;
 background-color:#cccccc;
 border-left:2px solid #ffffff;
 border-right:2px solid #ffffff;
}



/*Header -- logo*/

.header-logo {
 float:left;
 height:60px;
 width:250px;
 margin:0px;
 padding:20px 0px 0px 30px;
 background-color:#ffffff;
}


/*Header -- menu*/

.header-menu {
 float:right;
 width:550px;
 height:30px;
 margin:53px 0px 0px 0px;
 padding:0px 15px;
 background-color:#888888;
 box-shadow: 0px 3px 8px 0px #aaa;
 border-radius: 6px 0px 0px 6px; 
}

.menu ul li {
 list-style: none;
 margin:0;
 padding:0px 15px;
 font-size:14px;
 float: left;
 position: relative;
 width: auto;
 height: 30px;
 line-height: 30px;
 background:#888888;
 color: #cccccc;
 font-family:Verdana;
 text-align:center;
 font-weight:bold;
}
.menu ul li a {
  color: #e5e5e5;
  display: block;
  text-decoration: none;
}
.menu ul li:hover, .menu ul li a:hover {
  background:#22597d;
  color:#fff;
}
.menu ul li ul {
  position: absolute;
  top: 30px;
  left: 0px;
  width: 470px;
}
.menu ul li ul li {
  visibility: hidden;
  overflow: hidden;
  width: 470px;
  height: 0;
  text-align:left;
  background:#22597d;
}
.menu ul li ul li:hover, .menu ul li ul li a:hover {
  background:#3498db;
}
.menu ul li:hover ul li, .menu ul li a:hover ul li{
  visibility: visible;
  overflow: visible;
  height:30px;
  z-index: 10;
}
.menu * {
  -webkit-transition: 0.5s;
  -moz-transition: 0.5s;
  -ms-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;
}



/*Main --Ad*/
.main-ad{
 float:left;
 width:950px;
 height:200px;
 margin:0px 0px 0px 0px;
 padding:0px;
 background: -webkit-gradient(linear, left top, left bottom, color-stop(0.99, #ebf0ec), color-stop(0.74, #ffffff));
 background: -webkit-linear-gradient(top, #ffffff 74%, #ebf0ec 99%);
 background: -moz-linear-gradient(top, #ffffff 74%, #ebf0ec 99%);
 background: -o-linear-gradient(top, #ffffff 74%, #ebf0ec 99%);
 background: -ms-linear-gradient(top, #ffffff 74%, #ebf0ec 99%);
 background: linear-gradient(top, #ffffff 74%, #ebf0ec 99%);
}


/*Main --Index*/
.main-index{
 float:left;
 width:950px;
 height:44px;
 margin:0px 0px 0px 0px;
 padding:3px 0px;
 color:#ffffff;
 font-family:Verdana;
 font-weight:normal;
 font-size:120%;
 text-align:center;
 background:url(../imgs/bg2.png) #ffffff no-repeat;
}


/*Main  --Product*/
.main-product{
 float:left;
 width:920px;
 height:auto;
 margin:0px;
 padding:30px 15px 50px 15px;
 background: -webkit-gradient(linear, left top, left bottom, color-stop(0.99, #ebf0ec), color-stop(0.80, #ffffff), color-stop(0.20, #ffffff), color-stop(0.05, #ebf0ec));
 background: -webkit-linear-gradient(top, #ebf0ec 5%, #ffffff 21%, #ffffff 80%, #ebf0ec 99%);
 background: -moz-linear-gradient(top, #ebf0ec 5%, #ffffff 20%, #ffffff 80%, #ebf0ec 99%);
 background: -o-linear-gradient(top, #ebf0ec 5%, #ffffff 20%, #ffffff 80%, #ebf0ec 99%);
 background: -ms-linear-gradient(top, #ebf0ec 5%, #ffffff 20%, #ffffff 80%, #ebf0ec 99%);
 background: linear-gradient(top, #ebf0ec 5%, #ffffff 20%, #ffffff 80%, #ebf0ec 99%);
}

.main-product table {
 float:left;
 width:auto;
 height:auto;
 margin:0px 0px 0px 0px;
 padding:0px;
 border-collapse:collapse; 
 border:none;
}

.main-product th {
 width:200px;
 height:30px;
 margin:0px;
 padding:5px 15px 0px 15px;
 color:#5a5a55;
 text-align:left;
 vertical-align:center;
 font-family:Verdana;
 font-weight:bold;
 font-size:80%;
 border-collapse:collapse; 
 border:none;
}

.main-product th a {
 display:block;
 color:#5a5a55;
 text-align:left;
 text-decoration:none;
 background-color:transparent;
}
.main-product th a:hover {
 color:#3498db;
}

.main-product td{
 width:200px;
 height:auto;
 margin:0px;
 padding:5px 15px 20px 15px;
 text-align:center;
 color:#3498db;
 font-family:Verdana;
 font-size:80%;
 border-collapse:collapse; 
 border:none;
 background-color:transparent;
}
.main-product td a {
 display:block;
 color:#5a5a55;
 text-align: left;
 text-decoration: none;
 background-color:transparent;
}
.main-product td a:hover {
 color:#3498db;
}

.image-layout {
 border-radius: 20px;
 -webkit-border-radius: 20px;
 -moz-border-radius: 20px;
 -moz-box-shadow: 0px 2px 3px 3px #aaaaaa; 
 -webkit-box-shadow: 0px 2px 3px 3px #aaaaaa; 
 box-shadow: 0px 2px 3px 3px #aaaaaa; 
}


/*Main --Index2*/
.main-index2{
 float:left;
 width:950px;
 height:35px;
 margin:0px;
 padding:0px;
 background:url(../imgs/bg4.png) #ffffff no-repeat;
}

/*Main --Contact*/
.main-contact{
 float:left;
 width:920px;
 height:auto;
 margin:0px;
 padding:0px 15px;
 background-color:#3498db;
}

.main-contact-index{
 margin:0px 0px 5px 0px;
 padding:0px;
 width:100%
 height:auto;
 text-align:left;
}

.main-contact-index span{
 color:#ffffff;
 font-family:Verdana;
 font-weight:normal;
 font-size:130%;
}

.main-contact-call{
 float:left;
 width:330px;
 height:auto;
 margin:0px;
 padding:10px 15px;
}

.main-contact-call p{
 color:#444444;
 margin:0px 0px 0px 60px;
 padding:10px 0px 0px 0px;
 text-align:left;
 font-family:Verdana;
 font-weight:bold;
 font-size:150%;
}


.main-contact-email{
 float:right;
 width:520px;
 height:auto;
 margin:0px;
 padding:10px 15px;
}

.main-contact-email span{
 color:#444444;
 margin:20px 10px 5px 10px;
 text-align:left;
 font-family:Verdana;
 font-weight:;
 font-size:120%;
}


/*Footer -- Logo*/
.copyright{
 clear:both;
 color:#333333;
 text-align:right;
 width:auto;
 font:normal 12px Arial, Helvetica, sans-serif;
 margin:10px 13px 10px 10px;
}


/*For latest browsers*/
.cf:before,
.cf:after {
 content:"";
 display:block;
 overflow:hidden;
}
 
.cf:after {6:50 PM 11/30/2011
 clear:both;
}
 
/* For IE 6/7 (trigger hasLayout) */
.cf {
 zoom:1;
}

/*For Float Clear*/
.cl {  
 display: inline-block;  
}  
cl:after {  
 content: "";  
 display: block;  
 clear: both;  
}

