@charset "utf-8";
/* CSS Document */

body{ padding:0px; margin:0px; background-color:#fff; text-decoration:none; font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#000;     }

html {padding:0px; margin:0px; }

* {padding:0px; margin:0px; }

a{ text-decoration:none; color:#036; font-family:Arial, Helvetica, sans-serif; font-size:12px; }

a:hover{ text-decoration:underline; color:#030;  }

p{  margin:0px; text-align:justify; font-size:12px; font-family:Arial, Helvetica, sans-serif; color:#000; line-height:22px; }

ul li { padding:0px; list-style:none; }

ol, ul {list-style: none;}

img { border:none; }

a img{border: 0px;}

h1{ font-family:Arial, Helvetica, sans-serif; padding:0px; font-size:20px; color:#062772; text-transform:none;   }

b{ font-family:Arial, Helvetica, sans-serif; color:#006699; font-size:14px; text-decoration:none; }

div{ margin:0px; padding:0xp; background:transparent; }

.clear{ clear:both; }

#top-part { width:100%; height:92px; background-image:url(images/top-bg.png); background-repeat:repeat-x;}

 .top-site{ width:1003px; margin:auto;    }
 .header-left{ float:left; width:230px;  }
 .logo{ width:230px;  }
 .logo-text{ float:left; padding-top:12px;  }
 .logo-text-up{font-family:Arial, Helvetica, sans-serif; font-size:22px; text-transform:uppercase; }
 .logo-text-dwon{font-family:"Trebuchet MS"; font-size:16px; }
 .header-right{ float:right; width:770px; }
 .link{ float:right;padding-right:10px;}
 
 .flag{ float:right;  margin-right:5PX; margin-top:8px;  }
 
 .top-link{ font-family:Arial, Helvetica, sans-serif; font-size:11px; 
 text-decoration:none; color:#615959; padding-left:5px; padding-right:5px;  }
  .top-link a{ color:#036;  }
 .header-call-email{ float:right; width:545px; padding-top:5px; margin-right:20px;   }
 .shred-button{float:right;  font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#000;}
 .support{float:left; font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#006633; padding-left:10px; padding-right:10px; margin-left:40px; font-weight:bold;} 

 .call{float:left; font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#093576; padding-left:20px; background-image:url(images/call.gif); background-repeat:no-repeat; background-position:left; font-weight:bold;} 
 .email{ float:left; font-family:Arial, Helvetica, sans-serif; margin-left:10px; color:#093576; padding-left:20px; background-image:url(images/email.gif); background-repeat:no-repeat; background-position:left; }
 .email a{ color:#000; font-size:13px; font-weight:bold; color:#093576;}
 .email a:hover{ color:#069; text-decoration:underline; }
 .menu{ margin-top:20px; float:right;  }
 .menu-bg{ float:right; margin-right:3px; margin-top:10px;  }

 ul#menu-link{margin:0;	padding:0; list-style-type:none; position:relative;	display:block; font-size:13px; font-family:Arial,Verdana,sans-serif; padding-left:25px; margin-right:2px; padding-top:3px; }
 ul#menu-link li{display:block; float:left; margin:0px;  pading:0px;    	}
 ul#menu-link li a{display:block; float:left; color:#0342ab; text-decoration:none;  font-size:13px;  ppadding-right:7px; text-align:center; padding-left:7px; padding-right:20px; margin-left:1px;
   }
 ul#menu-link li a:hover{ color:#000000;   }
 ul#menu-link li a.active,ul#menu-link li a.current:hover{ text-decoration:underline;}   
  
  
  
  
 
 
 /* */



#site-div{ background-color:#FFF; margin:auto; width:1003px;    }


ul.dot{ display:block; margin-left:20px; }
ul.dot li{ line-height:20px; font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#333333; list-style:disc; text-decoration:none;   }

 


/* banner  */

#banner{ width:1000px; margin-top:5px; height:204px; border:1px solid #b0b0b0;  } 
.banner-left{  float:left; }
.banner{ width:675px; height:204px; float:left; }
.banner-right{ background-color:#094e7e; width:315px; height:204px; float:right; background-repeat:no-repeat; }
.banner-video{ margin:auto; width:300px; height:190px; margin-top:8px; margin-left:7px; } 

.banner-text { float:left; margin-top:20px; margin-left:10px; width:450px;  padding-left:30px; padding-top:80px; padding-right:20px;  }

.banner-text h1{ font-family:Arial, Helvetica, sans-serif; font-size:26px; color:#fff; margin:0px; padding:0px;   }

.banner-text .txt{ font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#000000; line-height:22px; text-align:justify; margin-top:20px;  }


.slide-bg{ float:right; width:415px; height:190px;   margin-right:15px; margin-top:5px;     }
 .slide{ margin-left:2px; margin-top:4px;   }
 

#main-banner{ width:980px; margin:auto; }





.marq-bg{
	background-image:url(images/marq-bg.png);
	background-repeat:no-repeat;
	width:138px;
	height:22px;
	padding-left:10px;
	float:left;
	z-index:999;
	font-family:Arial, Helvetica, sans-serif;
	font-size:13px;
	color:#fff;
	padding-top:8px;
	margin-top:1px;
}

.marq-text{ float:right; width:840px; margin-right:10px;  font-family:Arial, Helvetica, sans-serif; font-size:12px;    }

.marq-box{ width:1002px; margin-top:5px; border:1px solid #CCCCCC; 	   }


.webwidget_scroller_roll{ padding: 0px;  margin: 0px; float: left;  overflow: hidden; }
.webwidget_scroller_roll ul{ padding: 0px; margin: 0px; float: left; }
.webwidget_scroller_roll ul li{ padding: 0px;   margin: 0px;  margin-left:2px; margin-right:2px; list-style: none; float: left; text-align: center; display:inline; }
.webwidget_scroller_roll ul li a{ text-decoration: none; }
.webwidget_scroller_roll ul li a:hover{ text-decoration: underline; }
.webwidget_scroller_roll ul li a img{ border: none; }

div.jMyCarousel .prev{background: url('images/left.png') center center no-repeat; width:47px;	height:61px; border:0px; }
div.jMyCarousel .next{background: url('images/right.png') center center no-repeat; width:40px; height:61px; border:0px; }
div.jMyCarousel .up{ background: url('images/up.png') center center no-repeat;	width:61px;	border:0px; }

div.jMyCarousel .down{background: url('images/down.png') center center no-repeat; width:47px; height:61px; border:0px;}


/** carousel 1 **/
div.jMyCarousel ul li{margin-left:10px;	line-height:0px;}

/* in case of link */
div.jMyCarousel ul li a{ display:block;	border:0px; }

div.jMyCarousel ul li a img{ display:block;	border:0px; }


#wrapper {width:980px; margin:auto; }
#container {position:absolute; background:#fff;  height:298px; overflow:hidden;}


.pagination {position:absolute; top:40px; right:61px; list-style:none; height:25px}
.pagination li {float:left; cursor:pointer; height:8px; width:8px; background:#ccc; margin:0 4px 0 0; border:1px solid #fff}
.pagination li:hover, li.current {background:#fff}


/* top-footer  */

#main-mid-site{ width:1000px; margin:auto;  }

.mid-left{ width:200px; float:left; }
 .mid-left-link{ display:block; margin-top:5px; background-image:url(images/left-bg.jpg); background-repeat:repeat-y; min-height:1100px; padding-top:10px; }
ul.mid-left-link .head-text { padding-left:10px; padding-top:3px; padding-bottom:3px; border-bottom:1px solid #003300; width:180px; text-decoration:none; text-decoration:none; }
ul.mid-left-link .head-text a{ padding-bottom:3px;  text-decoration:none; text-decoration:none;  }
ul.mid-left-link .head-text a:hover{ color:#990000; }
 ul.mid-left-link{ display:block; margin:0px; padding:0px;     }
 
  ul.mid-left-link div.probg{ background-image:url(images/pro-bg.jpg); background-repeat:no-repeat; height:23px;    }
  ul.mid-left-link div.probg h3{ font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#094e7e;  margin:0px; padding:0px; padding-left:5px; padding-top:3px;   }
  ul.mid-left-link li{ font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#333333;   padding-left:10px; background-image:url(images/arrow.jpg); background-repeat:no-repeat; background-position:left; margin-left:10px;   }
  ul.mid-left-link li a{ font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#003399;   line-height:22px; text-decoration:none;  }
  
  ul.mid-left-link li a:hover{ font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#006600;   text-decoration:underline;  }




.topnav {width: 190px; font-family: Arial, Helvetica, sans-serif;}

ul.topnav {	padding: 0;	margin: 0; font-size: 12px;	line-height:20px; list-style: none; }

ul.topnav li {}

ul.topnav li a { line-height: 10px; font-size: 12px; padding: 8px 5px; color: #000; line-height:20px; display: block; text-decoration: none; font-weight: bolder; }

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

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

ul.topnav ul li {margin: 0;	padding: 0; line-height:17px; clear: both; }

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

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

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

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

ul.topnav span{ float:right; }  

.mid-center{ width:600px; float:left; background-color:#fff; padding-top:10px;     }
 .mid-box-main{ width:585px; }
 .mid-box-left{  margin-top:15px;   width:285px; height:220px;  border:1px #666666 solid; float:left; }
 .video-big{ width:252px; height:175px; float:left; }
 .mid-box-left h3{font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#094e7e;  margin:0px; padding-left:10px; padding-top:5px;  }
 .mid-box-right h3{ font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#094e7e;  margin:0px; padding-left:10px; padding-top:5px;  }
  .mid-box-right{ float:right;  margin-top:15px;  width:285px; height:220px;  border:1px #666666 solid;}
  .marq-txt{ padding-left:8px;  padding-bottom:7px; padding-top:0px; color:#2D519B; font-family:Arial; line-height:normal; font-size:12px;    background-image:url(images/marq-icon.png); background-repeat:no-repeat; background-repeat:no-repeat; margin-left:5px; margin-right:5px; padding-right:5px; margin-bottom:5px; font-weight:800px; border-bottom:1px solid #CCC;  }
  
  

  
  
  .marq-txt:hover{ color:#527CD2; }
  
.form_area{width:260px; float:left;}
.form_area h3{background:none; width:100%; float:left; padding:2px 0 0; font:bold 12px/24px Arial, Helvetica, sans-serif; text-align:center; color:#fff;}
.form_area form{width:100%; float:left;}
.form_area fieldset{padding:0; margin:0; border:none;}
.form_area .inputbg{width:260px; float:left; background:#fff; border:1px #777777 solid; height:22px; margin:6px 6px 0; display:inline; padding:0 6px; color:#939191; font:normal 11px/19px Arial, Helvetica, sans-serif;}
.form_area .selectbg{width:206px; float:left; background:#fff; border:1px #777777 solid; height:21px; margin:5px 5px 0; display:inline; padding:0; color:#939191; font:normal 11px/19px Arial, Helvetica, sans-serif;}
.form_area .captcha_input{width:112px; float:right; background:#fff; border:1px #777777 solid; height:19px; margin:5px 5px 0 0; display:inline; padding:0 6px; color:#939191; font:normal 11px/19px Arial, Helvetica, sans-serif;}
.form_area .textareabg{width:265px; float:left; background:#fff; border:1px #777777 solid; height:55px; margin:5px 5px 0; display:inline; padding:0 0 0 6px; color:#939191; font:normal 11px/19px Arial, Helvetica, sans-serif; resize:none;}
.form_area .captcha_image{width:74px; float:left; padding:5px 0 0 5px;}
.form_area .captcha_image img{float:left; border:1px #777777 solid;}
.form_area .btn_row{width:97%; float:left; background:#bb0404; padding:5px 0; margin:5px 0 0; margin-left:5px;}
.form_area .submit_btn{width:66px; float:right; height:21px; background:url(images/submit_btn.gif) no-repeat 0 0; border:none; cursor:pointer; padding:0; margin:0 5px 0 0; display:inline;}


.footer-box{ width:585px; margin-top:10px; }

.footer-box h3{font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#094e7e;  margin:0px; padding-left:10px; padding-top:5px;  }
.footer-button{ width:72px; height:55px; border-right:1px dotted #e9e9e9; float:left; clear:right; background-color:#0466b9; }

.footer-button:hover{ background-color:#034f90; }

.footer-button-text{   font-family:Arial, Helvetica, sans-serif; font-size:12px; padding-top:15px; color:#FFFFFF; text-align:center; padding-left:5px; padding-right:5px; line-height:18px;  }

.footer-button-text a{  font-family:Arial, Helvetica, sans-serif; font-size:12px; padding-top:15px; color:#FFFFFF; text-align:center; line-height:18px;  }

.footer-button-text a:hover{ text-decoration:none; color:#FFFFFF;   }

.mid-center h2{ font-size:14px; color:#003300; padding:0px; margin:0px;  }
 .text{ padding:10px; text-align:justify; padding-left:0px; pad
 ding-right:0px; font-family:Arial, Helvetica, sans-serif; color:#000; font-size:12px; line-height:22px; padding-right:10px;   }
  .main-box-bg { background-color:#f4f3f3; margin-top:10px;  }
 
 .new-project{ background-color:#FFFFFF; margin:auto;  border:1px solid #989898; width:585px; margin-top:20px; font-size:12px; color:#333333; }

#newsticker-demo { width:580px; }
.newsticker-jcarousellite { width:580px; }
.newsticker-jcarousellite ul li{  margin-bottom:2px; padding-left:10px; padding-right:10px; background-color:#fafafa; font-family:Arial, Helvetica, sans-serif; font-size:12px; margin-left:5px; margin-right:5px; text-align:left; height:auto; line-height:20px; text-align:justify;   }




 .new-project-text{ display:block; margin:0px; padding:0px;  }
 
 ul.new-project-text{ display:block; margin:0px; padding:0px; padding-bottom:10px;  }
 
 ul.new-project-text li{  padding:5px; padding-top:0px; font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#333333; line-height:20px; list-style:none;   }
 
 .new-project-img{ background-image:url(images/new-project.png); background-repeat:no-repeat; width:100px; height:25px; position:relative; z-index:9999; bottom:10px; left:10px;  }
 
 .new-projectimg{}
 
   
 ul.new-projectimg{ margin:0px; padding:0px;  }
 
 ul.new-projectimg li{ width:110px; height:100px; float:left; list-style:none;   margin-left:6px; margin-bottom:5px;  }
  
 .main-box-link{width:190px; background-color:#dcf0f6; float:left; margin-left:5px; margin-top:10px; margin-bottom:10px;}
 .main-box-text{ font-family:Arial, Helvetica, sans-serif; font-size:12px; padding:5px; text-align:left;  }
 .main-box-text .head{ font-family:Arial, Helvetica, sans-serif; font-size:11px; font-weight:bold; padding:5px; color:#003366; font-weight:bold; margin:0px; padding:0px;}
  
 
.mid-right{ width:200px; float:left; padding-top:10px;   background-image:url(images/left-bg.jpg); background-repeat:repeat-y; margin-top:5px; padding-bottom:5px; min-height:1100px; }

 .box-link{ padding:10px; font-family:Arial, Helvetica, sans-serif; font-size:16px; color:#FFFFFF; margin-top:5px; width:160px; margin-left:5px; border:1px solid #1f5072; }
  .box-link a{font-size:16px; color:#FFFFFF; text-decoration:none;  }
  
   .box-link:hover{  background-color:#006600; text-decoration:none;  }

   .frist{ background-color:#2d046a;   }
   .second{ background-color:#346e05; }
   .thried{ background-color:#044485; background-image:url(images/contact-icon.png); background-repeat:no-repeat; background-position:left; padding-left:50px; width:120px; padding-top:5px; line-height:20px; font-size:15px; padding-bottom:5px; }
   
 .client{  font-family:Arial, Helvetica, sans-serif; font-size:16px; color:#FFFFFF; margin-top:10px; width:180px; margin-left:5px; margin-top:10px; }  
.client  h3{ font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#094e7e;  margin:0px; padding:0px; padding-top:5px; padding-bottom:5px;   }

 .video{  font-family:Arial, Helvetica, sans-serif; font-size:16px; color:#FFFFFF; margin-top:10px; width:180px; margin-left:5px;  margin-top:10px; }  
.video  h3{ font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#094e7e;  margin:0px; padding:0px; padding-top:5px; padding-bottom:5px;   }
 .right-img{  margin-top:10px; width:180px;  margin-top:10px; margin-left:5px; }
  #slider { width:180px; height:140px; margin:0 auto;  position:relative; }
.jcarousel-clip,
.slider-carousel { float:left; display:inline; width:180px; position:relative; }
.slider-carousel ul {  list-style-type:none; }
.slider-carousel ul li {  display:inline; width:180px; }
#slider .image { float:left;   border:none;  }
#slider .image img {  border:none; }
#slider .info { float:left; width:253px; padding-top:40px; padding-left:16px;  }
#slider .info p { color:#c7c7c7; line-height:19px; padding-top:13px; height:168px; overflow:hidden; }
a.button-big { width:124px; height:40px; display:block; background:url('images/buttom-big.gif') no-repeat 0 top; font-size: 0; line-height: 0; text-indent: -4000px; cursor:pointer; }

.contact{ float:left;   width:290px; border-right:#CCCCCC 1px solid;  }
.feedback { float:right; width:290px;  }


.enquery{ width:325px; float:right; }

.txt{ padding:10px; text-align:justify; font-family:Arial, Helvetica, sans-serif; color:#000; font-size:12px; line-height:22px;   }

.title{ font-size:18px; color:#990; padding:10px 15px 10px; text-decoration:underline;   }

.title a{ font-size:18px; color:#990;  text-decoration:underline;   }

.title a:hover{ font-size:18px; color:#990;  text-decoration:underline;   }

.left-part{ width:270px; float:left; margin-left:10px; background-color:#f3f3ee;   }

.left-img img{border: 2px solid #d4d4cb; width:200px; margin-top:5px; }

.left-img:hover img{border: 2px solid navy;}


.img-box{ width:975px; margin:auto; margin-top:50px; border:#f1f0f0 solid 2px;   }



.pic{ width:214px;  margin-left:35px; margin:4px 0px  4px 38px; float:left; clear:right; }

.pic-link{ font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#000; text-transform:uppercase; padding-top:5px; }

.pic-link a{ font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#000; text-transform:uppercase; text-decoration:underline; }

.pic-link a:hover{ text-decoration:none; }



/* footer banner */

.footer-baner{  width:973px; margin:auto; margin-top:50px; border:2px solid #2188ab;   }

.titel-box{ font-family:"Myriad Pro"; font-size:22px; color:#14417e; padding:10px 0px 0px 10px;    }



#gallery_container2 { margin-top:10px;	position:relative; width:973px; }







/*  footer   */

.footer{ width:100%; background-color:#ededed; height:70px; margin-top:10px; padding-top:10px;   }

.footer-site{ width:1003px; background-color:#ededed; margin:auto;   }

.footer-left{ width:400px; float:left; font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#000; padding:10px 0px 0px 10px;   }


.footer-left a{  font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#000; text-decoration:underline; }   
.footer-left a:hover{ text-decoration:none; }   



.footer-right{ width:500px; float:right; font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#fff; padding-top:10px;  }

.add-button{ float:right; }



.footer-right a{ font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#fff; padding:10px 8px 0px 8px  }



.footer-right a:hover{  color:#090; }


.site-map{ margin:0px; padding:0px; }

ul.site-map{ margin:0px; padding:0px; display:block; margin-left:40px;}

ul.site-map li {list-style:disc; font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#333333;  }

ul.site-map li ul { margin:0px; padding:0px; display:block; margin-left:20px; }

ul.site-map li ul li {list-style:circle; font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#000000;}

ul.site-map li ul li a {list-style:circle; font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#000000; padding:5px; line-height:30px; }


ul.site-map li ul li a:hover {color:#003300;}

ul.site-map li a {list-style:disc; font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#333333; padding:5px; line-height:30px; }


ul.site-map li a:hover { color:#003300;}





#hongkiat-form { box-sizing: border-box; }



#hongkiat-form input#name {
background: #fff url('images/user.png') 5px 4px no-repeat;
}
#hongkiat-form input#email {
background: #fff url('images/email.png') 5px 4px no-repeat;
}
#hongkiat-form input#website {
background: #fff url('images/location.png') 5px 4px no-repeat;
}
#hongkiat-form input#telephone {
background: #fff url('images/phone.png') 5px 4px no-repeat;
}



#hongkiat-form #slider { width: 60%; }

#hongkiat-form #aligned { box-sizing: border-box; float: left; width: 450px; margin-right: 50px; }
#hongkiat-form #aside {	float: left; width: 250px; 	padding: 0;	box-sizing: border-box; }

#wrapping { width: 100%; box-sizing: border-box; }

span.radiobadge { display: block; margin-bottom: 8px; }
span.radiobadge label { font-size: 1.2em; padding-bottom: 4px; }

select.selmenu {font-size: 17px; color: #676767; padding: 9px !important; border: 1px solid #aaa; width: 200px; }

/** custom buttons **/

#buttons { display: block; padding-top: 10px; }


.project-index{ width:595px; border:1px solid #ececec; margin-top:5px; background-color:#fdfdfd;}

.project-img{ border:1px solid #f0f0f0; float:left; margin:5px; width:120px; height:120px;}
.project-text{ font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#333333; float:right;margin:5px; width:450px;   }
.project-head{ font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#003366; padding-top:5px; }



#hongkiat-form { box-sizing: border-box; }

#hongkiat-form .txtinput { display: block;font-family: "Helvetica Neue", Arial, sans-serif;border-style: solid;border-width: 1px;border-color: #dedede;margin-bottom: 10px;font-size: 12px;
padding: 6px 25px;padding-left: 40px;width: 60%;color: #777;box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset;-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset;-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset; transition: border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;-webkit-transition: border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;-moz-transition: border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;-o-transition: border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s; }

#hongkiat-form .txtinput:focus { color: #333;border-color: rgba(41, 92, 161, 0.4);box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset, 0 0 8px rgba(41, 92, 161, 0.6);-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset, 0 0 8px rgba(41, 92, 161, 0.6);-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset, 0 0 8px rgba(41, 92, 161, 0.6);outline: 0 none; }

#hongkiat-form input#name {background: #fff url('images/user.png') 5px 4px no-repeat;}
#hongkiat-form input#email {background: #fff url('images/email.png') 5px 4px no-repeat;}
#hongkiat-form input#website {background: #fff url('images/location.png') 5px 4px no-repeat;}
#hongkiat-form input#telephone {background: #fff url('images/phone.png') 5px 4px no-repeat;}

#hongkiat-form textarea {display: block;font-family: "Helvetica Neue", Arial, sans-serif;border-style: solid;border-width: 1px;border-color: #dedede;margin-bottom: 0px;font-size: 12px;padding: 11px 25px;padding-left: 40px;width: 65%;height: 150px;color: #777;box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset;-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset;-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset; transition: border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;-webkit-transition: border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;-moz-transition: border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;-o-transition: border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;}
#hongkiat-form textarea:focus {color: #333;border-color: rgba(41, 92, 161, 0.4);box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset, 0 0 8px rgba(40, 90, 160, 0.6);-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset, 0 0 8px rgba(40, 90, 160, 0.6);-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset, 0 0 8px rgba(40, 90, 160, 0.6);outline: 0 none; }
#hongkiat-form textarea.txtblock {background: #fff url('images/speech.png') 5px 4px no-repeat;}

#hongkiat-form #slider { width: 60%; }

#hongkiat-form #aligned { box-sizing: border-box; float: left; width: 450px; margin-right: 50px; }
#hongkiat-form #aside {	float: left; width: 250px; padding: 0; box-sizing: border-box;}

#wrapping { width: 100%; box-sizing: border-box; }

span.radiobadge { display: block; margin-bottom: 8px; }
span.radiobadge label { font-size: 1.2em; padding-bottom: 4px; }

select.selmenu {font-size: 17px;color: #676767;padding: 9px !important;border: 1px solid #aaa;width: 200px;}

/** custom buttons **/

#buttons { display: block; padding-top: 10px; }
#buttons #resetbtn {display: block;float: left;color: #515151;text-shadow: -1px 1px 0px #fff;margin-right: 20px;height: 30px;padding: 0 1em;outline: 0;font-weight: bold;font-size: 12px;white-space: nowrap;word-wrap: normal;vertical-align: middle;cursor: pointer;-moz-border-radius: 2px;-webkit-border-radius: 2px;border-radius: 2px;background-color: #fff;background-image: -moz-linear-gradient(top,  rgb(255,255,255) 2%, rgb(240,240,240) 2%, rgb(222,222,222) 100%);background-image: -webkit-gradient(linear, left top, left bottom, color-stop(2%,rgb(255,255,255)), color-stop(2%,rgb(240,240,240)), color-stop(100%,rgb(222,222,222)));background-image: -webkit-linear-gradient(top,  rgb(255,255,255) 2%,rgb(240,240,240) 2%,rgb(222,222,222) 100%);
background-image: -o-linear-gradient(top,  rgb(255,255,255) 2%,rgb(240,240,240) 2%,rgb(222,222,222) 100%); background-image: -ms-linear-gradient(top,  rgb(255,255,255) 2%,rgb(240,240,240) 2%,rgb(222,222,222) 100%);background-image: linear-gradient(top,  rgb(255,255,255) 2%,rgb(240,240,240) 2%,rgb(222,222,222) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#dedede',GradientType=0 );border: 1px solid #969696;box-shadow: 0 1px 2px rgba(144, 144, 144, 0.4);-moz-box-shadow: 0 1px 2px rgba(144, 144, 144, 0.4);
-webkit-box-shadow: 0 1px 2px rgba(144, 144, 144, 0.4);text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);}

#buttons #resetbtn:hover {text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);	color: #818181;background-color: #fff;background-image: -moz-linear-gradient(top,  rgb(255,255,255) 2%, rgb(244,244,244) 2%, rgb(229,229,229) 100%);background-image: -webkit-gradient(linear, left top, left bottom, color-stop(2%,rgb(255,255,255)), color-stop(2%,rgb(244,244,244)), color-stop(100%,rgb(229,229,229)));background-image: -webkit-linear-gradient(top,  rgb(255,255,255) 2%,rgb(244,244,244) 2%,rgb(229,229,229) 100%);background-image: -o-linear-gradient(top,  rgb(255,255,255) 2%,rgb(244,244,244) 2%,rgb(229,229,229) 100%); background-image: -ms-linear-gradient(top,  rgb(255,255,255) 2%,rgb(244,244,244) 2%,rgb(229,229,229) 100%); background-image: linear-gradient(top,  rgb(255,255,255) 2%,rgb(244,244,244) 2%,rgb(229,229,229) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 );border-color: #aeaeae;box-shadow: inset 0 1px 0 rgba(256,256,256,0.4),0 1px 3px rgba(0,0,0,0.5);}

#buttons #submitbtn {display: block;float: left;height: 30px;padding: 0 1em;border: 1px solid;outline: 0;font-weight: bold;font-size: 12px;color:  #fff;text-shadow: 0px 1px 0px #222;
white-space: nowrap;word-wrap: normal;vertical-align: middle;cursor: pointer;-moz-border-radius: 2px;-webkit-border-radius: 2px;border-radius: 2px;border-color: #5e890a #5e890a #000;
-moz-box-shadow: inset 0 1px 0 rgba(256,256,256, .35);-ms-box-shadow: inset 0 1px 0 rgba(256,256,256, .35);-webkit-box-shadow: inset 0 1px 0 rgba(256,256,256, .35);box-shadow: inset 0 1px 0 rgba(256,256,256, .35);background-color: rgb(226,238,175);background-image: -moz-linear-gradient(top, rgb(226,238,175) 3%, rgb(188,216,77) 3%, rgb(144,176,38) 100%);background-image: -webkit-gradient(linear, left top, left bottom, color-stop(3%,rgb(226,238,175)), color-stop(3%,rgb(188,216,77)), color-stop(100%,rgb(144,176,38))); background-image: -webkit-linear-gradient(top, rgb(226,238,175) 3%,rgb(188,216,77) 3%,rgb(144,176,38) 100%);background-image: -o-linear-gradient(top, rgb(226,238,175) 3%,rgb(188,216,77) 3%,rgb(144,176,38) 100%);background-image: -ms-linear-gradient(top, rgb(226,238,175) 3%,rgb(188,216,77) 3%,rgb(144,176,38) 100%);background-image: linear-gradient(top, rgb(226,238,175) 3%,rgb(188,216,77) 3%,rgb(144,176,38) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2eeaf', endColorstr='#90b026',GradientType=0 );}

#buttons #submitbtn:hover, #buttons #submitbtn:active {border-color: #7c9826 #7c9826 #000;color: #fff;-moz-box-shadow: inset 0 1px 0 rgba(256,256,256,0.4),0 1px 3px rgba(0,0,0,0.5);
-ms-box-shadow: inset 0 1px 0 rgba(256,256,256,0.4),0 1px 3px rgba(0,0,0,0.5);-webkit-box-shadow: inset 0 1px 0 rgba(256,256,256,0.4),0 1px 3px rgba(0,0,0,0.5);
box-shadow: inset 0 1px 0 rgba(256,256,256,0.4),0 1px 3px rgba(0,0,0,0.5);background: rgb(228,237,189);background: -moz-linear-gradient(top, rgb(228,237,189) 2%, rgb(207,219,120) 3%, rgb(149,175,54) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(2%,rgb(228,237,189)), color-stop(3%,rgb(207,219,120)), color-stop(100%,rgb(149,175,54))); 
background: -webkit-linear-gradient(top, rgb(228,237,189) 2%,rgb(207,219,120) 3%,rgb(149,175,54) 100%); background: -o-linear-gradient(top, rgb(228,237,189) 2%,rgb(207,219,120) 3%,rgb(149,175,54) 100%); background: -ms-linear-gradient(top, rgb(228,237,189) 2%,rgb(207,219,120) 3%,rgb(149,175,54) 100%); background: linear-gradient(top, rgb(228,237,189) 2%,rgb(207,219,120) 3%,rgb(149,175,54) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e4edbd', endColorstr='#95af36',GradientType=0 ); 
}


.img-left{ float:left; border:1px solid #CCCCCC; outline:#FAFAFA 1px solid; margin-top:10px;  }

.img-right{ float:right; border:1px solid #CCCCCC; outline:#FAFAFA 1px solid;  margin-top:10px;}