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

/* - - - - - - - - - - - - - - - - - - - - -

Title : Zhonghui Floor Heating
URL : http://www.zhonghui.com.au/

Author : FOX DESIGN creative
URL: www.foxdesign.com.au

- - - - - - - - - - - - - - - - - - - - - */

/*----------------------------------------------------------------------------- 
Global Styles
-----------------------------------------------------------------------------*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea, blockquote,th,td { 
	margin:0;
	padding:0;
}

 
table {
	border-collapse:collapse;
	border-spacing:0;
}




html,body,div,dl,dt,dd,pre,form,fieldset,input,textarea,blockquote { 
	margin:0; 
	padding:0; 
}

html { 
	margin:0; 
	padding:0; 
	overflow: -moz-scrollbars-vertical;
}

html,body {
	margin:0;
	padding:0;
}

/* Perfect Full Page Background Image*/
html { 
  background: #f7f1e8; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='.myBackground.jpg', sizingMethod='scale');
-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='myBackground.jpg', sizingMethod='scale')";
}

/* set image max width to 100% */
img {
	max-width: 100%;
	height: auto;
	width: auto\9; /* ie8 */
}

body,td,th,p,li {font-family: 'Raleway', sans-serif; font-weight: 400; font-size:16px; line-height:24px; color: #2f2f2f; }
body {
 	margin-left: 0px;	margin-top: 0px;	margin-right: 0px;	margin-bottom: 0px; 
}

a { text-decoration:none; color: #252525;}
a:hover { color: #ff2324;}

h1 { font-size:30px; line-height:40px; color:#c02244; padding: 0px; padding-right:32px; margin:0px; text-align:left; font-family: 'Raleway', sans-serif; font-weight:700; }

h2 {font-size:26px; line-height:26px;  color:#c02244; padding: 0px; margin:0px;  text-align:left; font-family: 'Raleway', sans-serif; font-weight:400; }

h3 {font-size:22px; line-height:22px;  color: #c02244; padding: 0px; margin:0px;  text-align:left; font-family: 'Raleway', sans-serif; font-weight:400;}

h4 {font-size:18px; line-height:18px;  color: #c02244; padding: 0px; margin:0px;  text-align:left; font-family: 'Raleway', sans-serif; font-weight:400;}
 

fieldset { 	border: 0; }

.clear { 
	clear: both; 
	font-size: 0; 
	height: 0; 
	line-height: 0; 
}
a img{ border:none;}
hr {height: 1px; color: #e6e4e2;  }

b{font-size:14px}
p{ padding:0px;}

/* end of global*/

#wrap{ float:left; 
width:100%; height:100%; 
min-height:100%; 
height:auto !important; /* real browsers */
height:100%; /* IE6: treaded as min-height*/
min-height:100%; /* real browsers */
position:relative;
}

#wrap_product-page
{ float:left; 
width:100%; height:100%; 
min-height:100%; 
height:auto !important; /* real browsers */
height:100%; /* IE6: treaded as min-height*/
min-height:100%; /* real browsers */
position:relative;

background-color:#f5f5f6; background-image:url(../images/body_bg.png); background-repeat:no-repeat; background-position:left top; 
}

.wrap_general{ float:left; width:100%; height:20px; min-height:20px;}
html>body .wrap_general{ height:auto;}

.wrap_general-50{ float:left; width:50%; height:20px; min-height:20px;}
html>body .wrap_general-50{ height:auto;}
  
@media screen and (max-width: 560px) {
.wrap_general-50{ float:left; width:100%; }
	}

/* header */

#header_wrap{ float:left; width:100%; height:40px; min-height:40px; background: #FFF;}
html>body #header_wrap{ height:auto;}
#header{ margin:0 auto; width:1200px; height:30px; min-height:30px; padding-bottom:10px;}
html>body #header{ height:auto;}

#logo{ float:left; width:32%; height:30px; min-height:30px; text-align:center; padding:20px 0;}
html>body  #logo{ height:auto;}

#header-right{ float:right; width:65%; height:34px; padding:30px 0 20px 0;}
#header_phone{ float:right; font-size:27px; color:#000; line-height:34px; height:34px; padding-right:25px; border-right:2px solid #c02244; margin-right:25px;font-family: Helvetica, Arial,  sans-serif; font-weight:bold;}
#call_icon{ float:right;  width:25px; height:34px; padding-right:15px; border-right:2px solid #eab49a; margin-right:85px; display:none; }

#header_icons{ float:right; height:34px; width:auto; padding:0 17px;}
.header_icons{ float:right; height:34px; width:34px; padding:0 5px;}

#nav_wrap{ float:right; width:65%; height:40px;}


@media screen and (max-width: 1200px) {
#header{width: 100%; padding-right:0;}
	}
 
@media screen and (max-width: 800px) {
#logo{width:200px; padding:15px 10px 0 10px;}
#header-right{width:135px;}
#header_phone{display:none;} 
#call_icon{display: block; }
#header_icons{ display:none;}
#nav_wrap{ float:right; width:95%; height:10px;}
	}

/* home page slider show */
#slider-show{ float:left; width:100%; height:640px;}
 
  
@media screen and (max-width: 800px) {
#slider-show{ height:540px;}
	}
	
/* home page short cut*/
.wrap02_out{ float:left; width:100%; height:40px; min-height:40px; background:#ede6e6;}
html>body .wrap02_out{ height:auto;}
.wrap02{ margin:0 auto;  width:1200px; height:40px; min-height:40px;}
html>body .wrap02{ height:auto;}

#shortcut_wrap_out{margin:0 auto;  width:1162px; height:40px; min-height:40px; padding-bottom:20px;}
html>body #shortcut_wrap_out{ height:auto;}
#shortcut_wrap_title{ float: left; width:100%; height:50px; line-height:50px; padding:20px 0;}
#shortcut_wrap_title h2{font-family: 'Raleway', sans-serif; font-weight: 400; font-size:25px; line-height:50px; color:#c02244; text-align: center;}
.shortcut_wrap01{ float:left; width:202px; margin:10px 0;}
.shortcut_wrap02{ float:left; width:38px; margin:10px 0; padding-top:48px; }
 

.shortcut_img{ float:left; width:100%; text-align:center; height:auto; padding-bottom:20px;}
.shortcut_title{ float:left; width:100%; height:30px; line-height:30px; font-size:25px; font-family: 'Raleway', sans-serif; font-weight: 700; text-transform:uppercase; color:#000; text-align:center; height:auto;}
.shortcut_title a{color:#000;} .shortcut_title a:hover{color:#c02244;}
.shortcut_des{ float:left; width:100%; height:18px; line-height:18px; font-size:12px; font-family: 'Raleway', sans-serif; font-weight: 400; color:#eab49a; text-align:center; height:auto;}

@media screen and (max-width: 1200px) {
.wrap02{ width:95%; }
#shortcut_wrap_out{margin:0 auto;  width:100%; }
	}
 

/* home page about*/
.wrap03_out{ float:left; width:100%; height:40px; min-height:40px; background:#f7f1e8;}
html>body .wrap03_out{ height:auto;}
.wrap03{ margin:0 auto;  width:1200px; height:40px; min-height:40px;}
html>body .wrap03{ height:auto;}

#home-about_wrap{ float:left; width:100%; height:20px; min-height:20px; margin:3.167% 0; background:#f7f1e8;}
html>body #home-about_wrap{ height:auto;}
#home-about_text{ float: left; width:27%; padding:3% 2% 1% 2%; height:auto; background:#FFF; color:#2f2f2f;}

#home-about_text h1{font-family: 'Raleway', sans-serif; font-weight: 400; font-size:25px; line-height:30px;  padding-bottom:24px; color:#c02244;}
#home-about_text p{font-family: 'Raleway', sans-serif; font-weight: 400; font-size:18px; line-height:24px; color:#000; padding-bottom:24px;}
#home-about_img{ float:right; width:67.5%; height:auto; border-left: solid 12px #f7f1e8;}

#home-about_text ul{ list-style:none;}
#home-about_text li{ list-style:none; padding-bottom:12px;}

@media screen and (max-width: 1200px) {
.wrap03{ width:95%; }
#home-about_text{ width:94%; padding:5.58% 3% 1% 3%; background:#ffffff;}
#home-about_img{ width:100%;  border-left:none; text-align:center;}
	}


/*-footer-*/
#footer_logo{ float:left; width:30%; height:48px; min-height:48px; text-align:center; margin:30px 0; }
html>body #footer_logo{ height:auto;}
#footer_contact{ float:left; width:30%; height:48px; min-height:48px;  margin:50px 0;}
html>body #footer_contact{height:auto;}

.footer{ font-family: 'Raleway', sans-serif; font-weight:200; color:#5f5f5f; font-size:16px; line-height:24px;}
.footer b{ font-family: Arial, Helvetica, sans-serif; font-weight:bold; color:#5f5f5f; font-size:18px;}

#footer_link{ float:right; width:32%; height:48px; min-height:48px; margin:50px 0;}
html>body #footer_link{height:auto;}
.footer-link, .footer-link a{font-family: 'Raleway', sans-serif; font-weight:200; color:#5f5f5f; font-size:16px; line-height:24px;}
.footer-link a:hover{ color: #a6a6a6;}

@media screen and (max-width: 1200px) {
#footer_logo{ width:40%; height:48px; min-height:48px; text-align:center; margin:40px 0;}
#footer_contact{ width:60%; height:48px; min-height:48px;  margin:40px 0;}
#footer_link{ width:100%; height:48px; min-height:48px; margin:0 0 20px 0; text-align:center;} 
	}
@media screen and (max-width: 560px) {
#footer_logo{ width:100%; height:48px; min-height:48px; text-align:center; margin:30px 0 10px 0;}
#footer_contact{ width:100%; height:48px; min-height:48px;  margin:0 0 20px 0; text-align:center;}
	}
	
/* inner page */
#inner-title_img{ float:left; width:100%; height:20px; min-height:20px; padding-bottom:30px; background:#f7f1e8;}
html>body #inner-title_img{ height:auto;}

#inner-title{ float:left; width:100%; background:#FFF; padding:25px 0; height:auto;}

#inner-title h1{ font-size:30px; line-height:40px; color:#c02244; padding: 0px; margin:0px; font-family: 'Raleway', sans-serif; font-weight:700; margin-left:30px; border-left: solid 5px #f0f0f0; padding-left:10px; }

#inner-left{ float:left; width:58.33%; height:20px; min-height:20px; padding:3.66%; background:#FFF;}
html>body #inner-left{ height:auto;}

#inner-left p{ padding-bottom:20px;}
#inner-left h2{font-size:26px; line-height:26px;  color:#c02244; padding: 0px; margin:0px;  text-align:left; font-family: 'Raleway', sans-serif; font-weight:400; padding-bottom:10px; text-transform:uppercase;}
#inner-left h3 {font-size:22px; line-height:22px;  color: #c02244; padding: 0px; margin:0px;  text-align:left; font-family: 'Raleway', sans-serif; font-weight:700; padding-bottom:10px;}
#inner-left h4 {font-size:18px; line-height:18px;  color: #F30; padding: 0px; margin:0px;  text-align:left; font-family: 'Raleway', sans-serif; font-weight:400; padding-bottom:6px;}

#inner-left ul{ list-style:none; padding:15px 0;}
#inner-left li{ list-style:none; padding-bottom:20px; padding-left:40px; background:url(../images/list-icon.png); background-repeat:no-repeat;}
#inner-right{ float:right; width:33.33%; height:20px; min-height:20px; background:#FFF;}
html>body #inner-right{ height:auto;}

#right-title{ float:left; width:100%; height:22px; padding:20px 0; background: #e03034; margin-bottom:10px;}
#right-title h3{ font-size:28px; line-height:22px; color:#ffffff; padding: 0px; margin:0px; font-family: 'Raleway', sans-serif; font-weight:200; margin-left:30px; border-left: solid 5px #ffffff; padding-left:8px; }

#inner-right_content{ float:left; width:84%; height:20px; min-height:20px; padding:0 8% 8% 8%; background:#FFF;}
html>body #inner-right_content{ height:auto;}

@media screen and (max-width: 800px) {
#inner-left{ width:90%; padding:5%; }
#inner-right{ width:90%; padding:5%;}
#inner-right_content{  width:100%;  padding:0 0 8% 0;  }
	}


/* about us page */

#about_wrap-out{ float:left; width:100%; height:69px; min-height:69px; margin:38px 0;}
html>body #about_wrap-out{height:auto;}
#about_wrap { margin:0 auto; width:1200px; height:20px; min-height:20px; background: url(../images/about_bg.png);}
html>body #about_wrap {height:auto;}
#about { float:left; width:90%; padding:3% 5% 2% 5%;height:20px; min-height:20px;}
html>body #about {height:auto;}
#about h1{font-family: 'Raleway', sans-serif; font-weight: 200; font-size:40px; line-height:40px; color: #eab49a; padding-bottom:24px; }
#about p{font-family: 'Raleway', sans-serif; font-weight: 200; font-size:18px; line-height:24px; color: #ffffff; padding-bottom:24px;}
@media screen and (max-width: 1200px) {
#about_wrap { width:95%; }
 }
 
/* services page */
#services_page-title{ float:left; width:100%; height:auto;}
.services_title{ float:left; width:100%; height:40px; line-height:40px; background:#eab49a; text-align:center; font-family: 'Raleway', sans-serif; font-weight: 400; font-size:20px; color: #ffffff; margin-top:30px;}
.services{ float:left; width:44%; margin:0 3%;  height:auto; border-bottom:solid 1px #eab49a; }
.services_left{ float:left; width:75%;height:16px; padding:13px 0; min-height:13px; line-height:16px;  font-family: 'Raleway', sans-serif; font-weight: 200; font-size:16px; color: #ffffff;}
html>body .services_left{ height:auto;}

.services_right{ float:right; width:25%;height:16px; padding:13px 0; min-height:13px; line-height:16px;  font-family: 'Raleway', sans-serif; font-weight: 200; font-size:16px; color: #ffffff; text-align:right;}
html>body .services_right{ height:auto;}

@media screen and (max-width: 800px) {
.services{ width:96%; margin:0 2%;  height:auto; border-bottom:solid 1px #eab49a; }
 }

/* gallery page */
#gallery_wrap-out{ float:left; width:100%; height:69px; min-height:69px; margin:38px 0;}
html>body #gallery_wrap-out{height:auto;}
#gallery_wrap { margin:0 auto; width:1200px; height:20px; min-height:20px; background: url(../images/about_bg.png);}
html>body #gallery_wrap {height:auto;}
#gallery { float:left; width:95%; padding:3% 0 2% 5%;height:20px; min-height:20px; text-align:center;}
html>body #gallery {height:auto;}
#gallery_page-title{ float:left; width:100%; height:auto;}
#gallery h1{font-family: 'Raleway', sans-serif; font-weight: 200; font-size:40px; line-height:40px; color: #eab49a; padding-bottom:24px; }
@media screen and (max-width: 1200px) {
#gallery_wrap { width:100%; }
 }
 
 @media screen and (max-width: 568px) {
 
 }

/*-contact us-*/

#contact-us_left{float:left; width:50%; height:26px; min-height:26px; color:#FFF;} 
html>body #contact-us_left{ height:auto}
#contact-us_left a {color:#FFF;}


#contact-us_right{float:right; width:45%; height:26px; min-height:26px; margin-bottom:20px; font-family: 'Raleway', sans-serif; font-weight: 400; font-size:16px; line-height:24px; color: #d5d5d5;}
html>body #contact-us_right{ height:auto}

@media screen and (max-width: 850px) {

#contact-us_left{ width:100%;}

#contact-us_right{width:100% }
.inputfield-contact{width:100%}
.inputfield_drop{ width:100%}
.submitBtn{ width:100%}
}

/* contact form */			

.inputfield-contact
{ 
 border-width:0px;
 padding:1px 1% 2px 3%;
 width: 97%;
 background-image: url(image/bg_contact.gif);
 background-repeat:repeat;
 font-family: 'Raleway', sans-serif; font-weight: 400; font-size:16px; line-height:24px; color: #000;
}

.inputfield_drop
{ 
 border-width:0px;
 padding:1px 1% 2px 3%;
font-family: 'Raleway', sans-serif; font-weight: 400; font-size:16px; line-height:24px; color: #000;
 width: 97%;
background: #FFF ;
}

.submitBtn{ width:100%; text-align:center; cursor:pointer; background: #eab49a; border:none;   color: #ffffff; margin-top:10px;font-family: 'Raleway', sans-serif; font-weight: 200; font-size:30px; line-height:40px; color: #FFF;}
.submitBtn:hover{color:#eab49a; background:#FFF; text-align:center; }

/* validate */

#PicValidate { font-size:12px; color:#FF0000; width:32px; line-height:22px;}
#call-submit2 { width:218px; height:22px; cursor:pointer;}

#validate_inputfield{ float:left; width:60px; height:30px; margin-right:20px;}
.inputfield-validate
{ 
 border-width:1px;
 border: thin;
 padding:0px 3px 0px 3px;
 font: normal 12px/30px Arial, Helvetica, sans-serif ;
 width: 60px;
 height:30px;
 color:#1e5692;
 background:#FFF;}
#validete_image{ float:left; width:100px; height:30px; overflow:hidden; overflow:hidden;}
#change-picture{ float:right; height:30px; width:32px; margin-right:16px;}
.change-picture{ width:32px; height:30px; background: url(../images/change-picture.png); cursor:pointer; background-position:center; border:0px;}
.change-picture:hover{background:url(../images/change-picture_hover.png); cursor:pointer; background-position:center;}