/* MARMORIT.CO.UK MAIN STYLESHEET BY BUDD 7
--------------------------------------------------------------------------*/

/* STYLE GUIDE
--------------------------------------------------------------------------*/
/*

	MARMORIT GREEN: #038846
	KNAUF MARMORIT BLUE: #0097d1
	KNAUF MARMORIT GREY: #b0b0b0

	Slightly darker blue for text: 0097d1
	Anchor tags blue: 

*/



/* PRE-LIMS
--------------------------------------------------------------------------*/

* {
padding:0;
margin:0;
}

html { 
font-size:100%;
}

body {
color:#333333; 
text-align: center; 
background: #ffffff url("../images/bg_gradient.jpg") left top repeat-x fixed; 
font-family:arial, tahoma, Verdana, Helvetica, sans-serif;
}

p {
font-size:1.0em;	/* now define all fonts in ems, 1em = 10px */
}

a:link, a:visited {
color:#333333; text-decoration:none;
}

a:hover, a:focus { 
text-decoration:underline;
}

#container { 
background-color:#ffffff; 
text-align:left; 
width: 780px; 
margin: 0 auto; 
position: relative; 
padding:10px 0 20px 0px; 
}

/****************************** pageheader controls *****************/
#pageheader { 
min-height:100px; 					/* IE 6 fix needed*/
overflow:auto; 
border:0px solid #000; 
background: url("../images/marmorit_logo.jpg") right top #ffffff no-repeat;
}

#pageheader h2 { 
font-size:1.0em; 
font-weight:bolder; 
margin:10px 0 0 0; 
font-family:Arial, Helvetica, sans-serif; 
z-index:5000; 
position:relative; 
padding:0 0 0 10px;
}


/*********************************************** masthead controls ***************/
#masthead { 
position:relative; 
z-index:20; 
width:554px; 
min-height:161px; 				/* IE 6 fix needed*/
background: url("../images/masthead_index.jpg") left bottom #ffffff no-repeat; 
margin: -65px 0 0 55px;
}

#masthead2 { 
position:relative; 
width:554px; 
min-height:161px;				/* IE 6 fix needed*/
margin: -65px 0 0 55px;
}

/*************************************** top of page graphic controls **************/
.masthead_tech { 
background: transparent url("../images/masthead_tech.jpg") left bottom no-repeat;
}

.masthead_products { 
background: transparent url("../images/masthead_products.jpg") left bottom no-repeat;
}

.masthead_service { 
background: transparent url("../images/masthead_services.jpg") left bottom no-repeat;
}

.masthead_links { 
background: transparent url("../images/masthead_links.jpg") left bottom no-repeat;
}

.masthead_uvalue { 
background: transparent url("../images/masthead_uvalue.jpg") left bottom no-repeat;
}

.masthead_colours { 
background: transparent url("../images/masthead_colours.jpg") left bottom no-repeat;
}

.masthead_contact { 
background: transparent url("../images/masthead_contact.jpg") left bottom no-repeat;
}

.masthead_news { 
background: transparent url("../images/masthead_news.jpg") left bottom no-repeat;
}

/************************ subheader ***************************/
#subheader { 
background-color: transparent; 
border:0px solid #ccc; 
margin:-72px 0 0 0; 
z-index:100; 
border:0px solid #ccc; 
min-height:76px;
}

#subheader span { 
position:relative; 
float:right; 
z-index:2000; 
width:180px; 
font-size:0.7em; 
margin:20px 15px 0 10px; 
border:0px solid #ccc;
}

/******************************* main content area governor **************/
#text_box_gov { 
position:relative; 
float:right; 
width:650px; 
border:0px solid #cc0000; 
}

/********** backgrounds for various main content areas *******************/
.bg1  { 
min-height:273px; 
overflow:visible;
}

.bg_tech { 
background: url("../images/bg_tech.gif") left top no-repeat; 
min-height:255px; overflow:visible;
}

.bg_prod { 
background: url("../images/bg_prod.gif") left top no-repeat; 
min-height:255px; 
overflow:visible;
}

.bg_service { 
background: url("../images/bg_service.gif") left top no-repeat; 
min-height:255px; 
overflow:visible;
}

.bg_links { 
background: url("../images/bg_links.gif") left top no-repeat; 
min-height:255px; 
overflow:visible;
}

.bg_uvalue {
background: url("../images/bg_uvalue.gif") left top no-repeat; 
min-height:255px; 
overflow:visible;
}

.bg_colours {
background: url("../images/bg_colours2.gif") left top no-repeat; 
min-height:255px; 
overflow:visible;
}

.bg_contact {
background: url("../images/bg_contact.gif") left top no-repeat; 
min-height:255px; 
overflow:visible;
}

/**************************** content zone controls **************/
#contentbox { 
margin:30px 15px 0 10px; 
border:0px solid #000; 
font-size:0.9em;
}

#contentbox h3 {
font-size:1.1em;
padding:0 0 10px 0;
}

#text_box_gov #contentbox #index { 
position:relative; 
float:right; 
width:180px; 
font-size:0.75em;  
border:0px solid #ccc;	/* for position testing */
}



/* NEWS PAGE FORMATS
---------------------------------------------------------------------------------*/

h3.news { color:#0097d1; }

h4.news { margin:0; padding-top:0px; padding-bottom:10px; color:#0097d1; font-size:1.0em; }

ul.news { margin-left:15px; list-style-type:square; margin-bottom:10px; font-size:0.9em; }

#news_pictures img { padding-bottom:15px; }


/****************************** technical page type layout ***************/
#technical { 
background:none;
}

#technical dl, #link_page dl, #technical p { 
font-weight:bold;
}

#technical dd { 
margin:0 0 30px 0; 
width:250px; 
border:0px solid #000;
}

#technical dd span { 
position:absolute; 
left:210px; 
width:400px; 
color:#0097d1;
}

#technical .preview_table p {
color:#0097d1;
float:left;
position:relative;
display:block;
width:150px;
min-height:245px;				/* ie fix needed */
border:1px solid #0097d1;
margin:10px 0 10px 20px;
padding:5px 10px;
background: #ffffff url("../images/dwg_previews/dwg_bg.jpg") left top repeat-x;
}

#technical .preview_table span {
color:#ffffff;
}

#technical .preview_table img.border {
border:1px solid #cccccc;
clear:both;
margin:5px 0;
}

#technical .preview_text p {
color:#0097d1;
float:left;
position:relative;
display:block;
width:250px;
min-height:30px;				/* ie fix needed */
border:1px solid #e1e1e1;
margin:10px 0 10px 20px;
padding:5px 10px;
background: #ffffff;
}

dd a:link, dd a:visited, dd a:active { 
display:inline; 
vertical-align:top; 
color:#000000; 
text-transform:none; 
font-family:Arial, Helvetica, sans-serif; 
font-size:1em; 
}

#dvd_table td {
vertical-align:middle;
height:50px;
}

#uvalue_table td, #uvalue_table th {
vertical-align:middle;
height:25px;
border:1px solid #000000;
text-align:center;
}

#uvalue_table th {
border: 0px;
}

#u-value_key {
margin-left:0px;
}

#technical #uvalue_table {
margin: 10px 0 0 11px;
}

#technical ul {
list-style-type:none;
}

#technical li {
padding:30px 0 0 0px;
font-weight:bold;
text-indent:20px;
}

/*********************************** u-value **************/

.key {
position:relative;
float:left;
display:block;
width:20px;
height:20px;
border: 1px solid #000000;
font-size:0.5em;
margin:0 7px 30px 0;

}

.blue {
background-color:#c9ffff;
}

.green {
background-color:#c8ffbf;
}

.yellow {
background-color:#fdff82;
}

.tan {
background-color:#F7C085;
}

.pink {
background-color:#F482C1;
}




/************************************************ links page type layout **************/

#link_page { 
background:none;
}

#link_page a, #link_page a:visited, #contact-info a { 
font-family:Arial, Verdana, Helvetica, sans-serif; 
color:#0097d1; 
text-decoration:underline; 
text-transform:none;
}

#link_page a:hover, #link_page a:focus { 
color:#005d81;
}

#link_page dt { 
margin-bottom:2px;
}

#link_page dd { 
margin:0 0 20px 0;
}

/******************************** colour page tweaks ******************/
#colour p { 
margin:15px 0px 0 0; 
font-family: Arial, Verdana, Helvetica, sans-serif;
font-size: 0.8em;
font-weight: bold;
padding-right: 80px; /* stops the text on the colours page overhanging the right hand edge of the background */
}

/***************************************** contact page formatting *************/
#contact_left {
float:left; 
position:relative; 
width:250px; 
border:0px solid #000;
}

#contact_left .tel{
float:right;
}
#contact_left .fax{
float:right;
}

#contact_right {
float:right; 
position:relative; 
width:300px; 
border:0px solid #000;	/* for position checking */
}

#contact_left.right_slightly {
border:0px solid #ccc;
padding-left:30px;
}

#contact_right.left_slightly {
width:340px;
border:0px solid #ccc;
}

#terms { 
clear:both; 
position:relative; 
padding:20px 0 0 0; 
border:0px solid #000;
}

#contact_left .adr, #contact_right .bottom { 
padding:0 0 20px 0;
}



/***************************************** navigation formatting ******************/
#links { 
position:relative; 
float:left; 
background-color: transparent; 
border:0px solid #000;	/* for position checking only */
}

#sitelinks ul { 
list-style-type:none; 
margin-top:20px;
}

#sitelinks li { 
margin:0 0 4px 0px;
}

#sitelinks a:link, #sitelinks a:visited { 
font-size:0.8em; 
display:block; 
text-transform:uppercase; 
text-decoration:none; 
color:#999999; 
width:100px; 
padding:3px 1px 3px 10px; 
font-weight:bold; 
font-family: Arial, Helvetica, Verdana, sans-serif; 
}

#sitelinks a:hover, #sitelinks a:focus { 
background-color:#8c8c8c; 
color:#ffffff;
}

/********************************** footer formatting including project boxes ***************/

#footer, #footer2 { 
position:relative; 
clear:both; 
color: #333333; 
width:780px;
}
	
	/* clear = both to cause container background to fill down fully. DO NOT FOAT THIS DIV AS WELL*/

#footer2 {
padding-top:7px;
}

#subfooter { 
float:right; 
position:relative; 
width:541px; 
border:0px solid #ccc; 		/* for position checking */
background:url("../images/warm_wall_logo.jpg") left top #ffffff no-repeat; 
min-height:70px;		/* IE 6 fix needed*/
} 

#subfooter p { 
margin:53px 0 0 70px; 
font-size:0.6em; 
font-weight:bold;
}

/* this subfooter2 is for all pages with a project featured at the bottom of the page*/

#subfooter2 { 
background-color:#dddddd; 
min-height: 100px; /* IE 6 fix needed*/
border:6px solid #666; 
margin:0px 28px 0 28px;
}

/* PROJECT FOOTER
------------------------------------------------------------------------*/

#col_1 { float:left; position:relative; width:160px;}
#col_2 { float:left; width:175px; margin-top:20px;}
#col_3 { float:left; width:200px; margin-top:20px;}
#col_4 { float:left; width:175px; margin-top:20px;}


/* FOUR PHOTO FOOTER
------------------------------------------------------------------------*/

#col_1b {float:left; position:relative; width:131px; margin-right:63px;}
#col_2b {float:left; position:relative; width:131px;}
#col_4b {float:right; position:relative; width:131px;margin-right:63px;}
#col_3b {float:right; position:relative; width:131px;}


/* MARMORIT NEWS TYPE FOOTER
------------------------------------------------------------------------*/

#col_1c {float:left; position:relative; width:131px; margin-left:75px}
#col_2c {float:left; position:relative; width:500px; padding-top:20px;}
#col_2c h4 {padding-bottom:10px;}
#col_2c a:link, #col_2c a:visited, #col_2c a:active { color: #0097d1; text-decoration:underline; }
#col_2c a:hover, #col_2c a:focus { color: #005d81; text-decoration:underline; }



#subfooter2 h4, #subfooter2 p { 
font-size:0.8em;
}

#subfooter2 a { 
padding:0;margin:0;
}

#footer2 img {
border:none; 
padding:0; 
margin:3px 0 0px 3px;
}

#footer .org { 
position:relative; 
left:588px; 
width:180px; 
border:0px solid #ccc; 
text-transform:uppercase; 
text-align:right; 
font: 0.7em bold Arial, Helvetica, sans-serif; 
background: url("../images/knauf.jpg") right bottom #ffffff no-repeat; 
padding:20px 0 40px 0;
}

#footer2 .org { 
display:none;
}

#terms {margin-top: -7px;}
#terms p {margin-top: -6px; padding-left: 27px; font-size: 0.6em; float:left; border:1px solid #ffffff; }
#terms ul { list-style-type:none; margin-top: -11px; margin-right: 21px; float:right; }
#terms li { display:inline; font-size: 0.6em; padding: 0 7px; border-left: 1px solid #cccccc; }
#terms a { color:#999999; }

/********************************************** some generic classes ***********/
.hide_me {
display:none;
}

.cleaner { 
height:0px; 
clear:both;
}

.big_bottom { 			/*extra padding to dd on the Uvalue page*/
padding:20px 0 40px 0;
} 

.small_text {
font-size:smaller;
}

.paragrh_text {
font-weight:normal;
font:0.75em tahoma, arial, helvetica, verdana, sans-serif;
color:#000000;
padding:5px 0;
}



/*********************************** only features on the colour page **********/
#blue_brush { 			
position:absolute; 
float:left; 
left:610px; 
top:100px; 
width:155px; 
height:109px; 
background: url("../images/blue_brush.jpg") left top no-repeat; 
z-index:3000;
}

/******************************************** site search form controls ************/
#search_box { 
position:absolute; 
float:left; 
text-align:right; 
left:563px; 
top:100px; 
width:200px; 
height:30px; 
z-index:3000; 
border:0px solid #ccc; 		/* for position checking*/
font-size:0.8em;
}

#search_box #search input { 
font-size:0.9em;
}

.button {
font-size:100%; 
padding:0 0 1px 0; 
margin:0px 0 0 0px; 
background-color:#0097d1; 
border:1px solid #009dd9; 
color:#fff; 
cursor:pointer;
}

.width_small { width:88px; padding:0; margin:0;}

.form_display {
border: 1px solid #cccccc;
background: url("../images/input_box_shadow.gif") left top #ffffff no-repeat;
font: 100% normal arial, verdana, helvetica;
padding:2px 1px 2px 2px;
}

#search {
font: 0.9em arial, helvetica, sans-serif;
}

/********************************* Enquiry Forms *******************************/

#contentbox fieldset {
border:0px solid #000000; 		/* not just for position checking */
width:550px;
}

#contentbox input.field, #contentbox select {
padding:3px 3px 3px 3px; 
width:250px; 
margin:4px 0 4px 0; 
border:1px solid #cccccc; 
background:#ffffff url(../images/input_box_shadow.gif) no-repeat left top; 
color:#333333; 
font:0.9em Arial, Helvetica, sans-serif;
}

#contentbox select {		/* ie fixes likely*/
width:258px; 
}

#contentbox textarea {
padding:3px 3px 3px 3px; 
width:250px; 
height:60px; 
margin:4px 0 4px 0; 
border:1px solid #cccccc; 
background:#ffffff url(../images/input_box_shadow.gif) no-repeat left top; 
color:#333333; 
font: 0.9em Arial, Helvetica, Verdana, SansSerif;
}

#contentbox textarea.height {
height:100px;
}

#contentbox label {
padding:0px; 
float:left; 
width:201px; 
margin:7px 10px 0 0; 
display:block; 
text-align:right; 
color:#333333; 
border:0px solid #000;
}

#contentbox input.button {
margin:0px 0 0 0px; 
background-color:#5c5f64; 
border:1px solid #333333; 
color:#ffffff; 
cursor:pointer; 
font-size:1em; 
padding:2px;
}

.radio_button { 
margin:7px 2px 0px 10px;		/* IE fix needed, margin top 4px*/
border:0px solid #000;		/* position checking only */
}

.radio_text {}

.button_align {
margin: 10px 0 10px 211px;
background-color:#5c5f64; 
border:1px solid #333333; 
color:#ffffff; 
cursor:pointer; 
font-size:1em; 
padding:2px;float:left; 
}

.button_align2 {margin: 10px 0 10px 10px;}

/*********************************** Login form *********************************************/

#client_login {  }


/*********************************** uvalue calc **********************************************/

#uvalue_calc { margin-left: -115px; padding-top:30px; } /* moves the table to the left */
#contentbox #uvalue_calc input.field { height: 14px; }
#contentbox #uvalue_calc select { height: 22px!important; }
#uvalue_calc th, #uvalue_calc td { font-size:0.85em; }
#print_save_button {position: relative; top: 28px; left: 4px; } /* IE position correction needed */

form #calculator {margin-top:-28px;}



/* marmorit account page and account_config 
-----------------------------------------------------------------------*/

#my_marmorit h2, #my_marmorit h3, #my_marmorit h4, #my_marmorit p { padding: 5px 0 10px 0; }
#my_marmorit ul { margin-left: 20px; }
#my_marmorit li { padding-bottom: 7px; }

#my_marmorit a, #my_marmorit a:visited { 
font-family:Arial, Verdana, Helvetica, sans-serif; 
color:#0097d1; 
text-decoration:underline; 
text-transform:none;
}

#my_marmorit a:hover, #my_marmorit a:focus { 
color:#005d81;
}

#float_left { float:left; width:440px; border:0px solid #cccccc; text-align:left; }
#float_right { float:right; width:150px; border:1px solid #999999; text-align:left; margin-left: 0px; margin-right:0px;}
#float_right h4 { display: block; background-color:#999999; padding:5px 0 5px 7px; color:#FFFFFF;}
#float_right ul { padding:10px 0; list-style-type:none; margin-left:10px; font-size:0.9em;}

#my_marmorit a.delete { color:#333333; text-decoration:none;}
#my_marmorit a:hover.delete { color:#FF0000; text-decoration:underline;}

/* the registration form - mostly as per the other forms apart from policies section */

#account_terms { margin: 10px 0 0 0;}




/* U VALUE POPUP TABLE FOR U VALUE CALCULATOR
------------------------------------------------------------------------*/

#popup_container table {margin: 0 auto;}
#popup_container h3 {padding: 20px;}

#popup_container #u-value_key { text-align:left; margin-left:20px;}


/* SPECIFICATION WRITER
------------------------------------------------------------------------*/

p.specswriter { background:none; border:0px solid #000; margin-left:210px!important; margin-bottom:20px; font-size:1.0em!important; }

img.icon_help {
	margin-left:10px;
}