/*======================================================================
Leverett Electrical CSS

author: brynmor harries, michelle palmer and tom harries
url:    www.stylecymru.co.uk

Last update: 09 December 2010
======================================================================*/

/*======================================================================
CSS reset
======================================================================*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin:0;padding:0;border:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;}
body {line-height:1;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: '';content: none;}
:focus {outline: 0;}/* remember to define focus styles! */
ins {text-decoration: none;}/* remember to highlight inserts somehow! */
del {text-decoration: line-through;}
table {border-collapse:separate;border-spacing:0;}/* tables still need 'cellspacing="0"' in the markup */
caption, th, td {text-align:left;font-weight:normal;}

/*Added bits */
table, td, th {vertical-align:top;}
a {outline:none;}

/*======================================================================
Global settings - http://www.alistapart.com/articles/howtosizetextincss/
======================================================================*/
body {
	font-size:100%;
	line-height:1.5;
	color: #222;
	background: #000140;
	font-family: Verdana, "Helvetica Neue", Arial, Helvetica, sans-serif;
}
/*======================================================================
Text settings
======================================================================*/
h1, h2, h3, h4, h5, h6 {font-weight:normal; color:#111;}
    h2, h3, h4, h5, h6 {margin-bottom:0.5em; line-height:1.5;}
            h4, h5, h6 {font-weight:bold;}

h1 {font-size:3.0em;}
h2 {font-size:2.0em;}
h3 {font-size:1.4em; line-height:1;}
h4 {font-size:1.2em;}
h5 {font-size:1.0em;}
h6 {font-size:0.8em;}

p  {
  font-size:1em;
	margin-bottom:1.5em;
}

blockquote {
	color:#333;
	font-style:italic;
	background: #efefef;
	margin-bottom:1em;
}

blockquote p, blockquote ul {padding:1.5em;}

strong {font-weight:bold;}
em, dfn {font-style:italic;}
dfn {font-weight:bold;}
sup, sub {line-height:0;}
abbr, acronym {border-bottom:1px dotted #666;}
address {margin:0 0 1.5em;font-style:italic;}
del {color:#666;}
pre {margin:1.5em 0; white-space: pre;}
pre, code, tt {font:1em 'andale mono', 'lucida console', monospace; line-height:1.5;}

/*======================================================================
List Styling
======================================================================*/
ul, ol {margin:0 1.5em 1.5em 1em;}
ul {list-style-type:disc;}
li {margin: 0 0 0.5em;}
li ul, li ol {margin:0 1.5em;}
ol {list-style-type:decimal;}
ol li {margin:0 0 0.5em 0.5em;}
dl {margin:0 0 1.5em 0;}
dl dt {font-weight:bold;}
dd {margin-left:1.5em;}

/*======================================================================
Table Styling
======================================================================*/
/*table {
  margin-bottom:1.5em;
	width:100%;
	border:1px solid #999;
}*/  /* removed re Top_Up plugin */

th {font-weight:bold;}
thead th {background:#ddd;}
th, td, caption {padding:4px 10px 4px 5px;}
tr.odd td {background:#eee;}
tfoot {font-style:italic;background:#bbb;}
caption {background:#eee;}

/*======================================================================
Form Styling
======================================================================*/
	
/* Contact Form */

p.error								{margin-left:140px; margin-top:10px;}
#contact_form ul					{float:left;}
#contact_form ul li					{margin:10px 0; list-style:none; position:relative; clear:both;}
#contact_form label					{line-height:35px; width:100px; text-align:right; float:left; margin-right:10px;}
#contact_form input#name,
#contact_form input#email,
#contact_form input#subject,
#contact_form textarea				{float:left; padding:8px; border:1px solid #CCCCCC; margin-left:10px; background:#fcfcfc; -moz-border-radius:5px; -webkit-border-radius:5px;}
#contact_form input#name,
#contact_form input#email,
#contact_form input#subject			{width:400px;}
#contact_form textarea				{width:400px;height:150px; resize: none;}
#contact_form input.button			{float:right;}
.error,
.success							{display:none;}

/*======================================================================
Main Link styling
======================================================================*/
a {text-decoration: none;}
a:link { color: #00f; text-decoration: underline;}
a:visited { color: #00f; text-decoration: none;}
a:focus, a:hover { color: #000180; text-decoration: underline;}
a:active{ color: #f00;}

/*======================================================================
Image default settings and styling
======================================================================*/
a img {border:none; outline:none;}
h1 img, h2 img, h3 img, h4 img, h5 img, h6 img {margin:0;}

img.left {float:left;margin:0 1.5em 1.5em 0;padding:0;}
img.right {float:right;margin:0 0 1.5em 1.5em;}

/* Additional styles*/
img.picframe {
	padding: 4px;
	background: #fff;
	border: 1px solid #999;
}
a img.picframe {border: 1px solid #0080d7;}
a:hover img.picframe, a:focus img.picframe {border: 1px solid #000;background:#0080d7;}

img.frame {
	border: 1px solid #999;
}
a img.frame {border: 1px solid #0080d7;}
a:hover img.frame, a:focus img.frame {border: 1px solid #000;}

/*======================================================================
Utilities
======================================================================*/
.clearfix:after {content:"\0020";display:block;height:0;clear:both;visibility:hidden;overflow:hidden;}
.clearfix {display:block;}
.clear {clear:both;}

.textright {text-align: right;}
.textleft {text-align:left;}
.textmiddle {text-align:center;}

.middle{margin:0 auto 1em; text-align:center;}
.fleft {float:left;}
.fright {float:right;}

.editable {} /* external content editor class */
.gap { padding-top: 20px; }

/*======================================================================
Grid layout
======================================================================*/
.size1 { width:60px; }
.size2 { width:140px; }
.size3 { width:220px; }
.size4 { width:300px; }
.size5 { width:380px; }
.size6 { width:460px; }
.size7 { width:540px; }
.size8 { width:620px; }
.size9 { width:700px; }
.size10 { width:780px; }
.size11 { width:860px; }
.size12 { width:940px; }
.block { margin: 0 10px;	overflow: hidden;	float: left; display: inline; }

.size6frame { width:440px; border:1px solid #ccc; padding: 9px;}

.box { width: 960px; margin: 0 auto; overflow: hidden; text-align: left;}
.box .box { margin: 0 -10px; width: auto;}

/*======================================================================
Header styling
======================================================================*/
#top_panel {
	border-top: 4px solid #000140;
	background: url(../images/general/top_panel_bg.jpg) repeat-x;
	height: 100px;
	overflow: hidden;
}

#header {
  background: url(../images/general/header_bg.jpg) 0 0 no-repeat;
	height: 100px;
	overflow: hidden;
	position: relative;
}

#header h1 { margin: 10px 0 0 100px; }

#header p {
  position: absolute;
	top: 30px;
	right: 10px;
	text-align: right;
}

/*======================================================================
Main content styling
======================================================================*/
#maincontent {
	border-top: 4px solid #000;
	padding: 30px 0;
	background: #fffef5;
	color: #000;	
}

/*======================================================================
Small Button styling
======================================================================*/
.smallbutton a {
  float: left;
	width: 140px;
	height: 140px;
	display: block;
	overflow: hidden;
}

.smallbutton a img {
  border: none;
	margin: 0;
	padding: 0;
}

.smallbutton a:hover img {
	margin-top: -140px;
}

/*======================================================================
Pop-up styling
======================================================================*/
.popup_block{
	display: none;
	background: #fff;
	padding: 20px; 	
	border: 20px solid #eee;
	float: left;
	position: fixed;
	top: 50%; left: 50%;
	z-index: 99999;
	-webkit-box-shadow: 0px 0px 20px #000;
	-moz-box-shadow: 0px 0px 20px #000;
	box-shadow: 0px 0px 20px #000;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
}

/*--Making IE6 Understand Fixed Positioning--*/
*html .popup_block {
	position: absolute;
}

.popup p {
	padding: 5px 10px;
	margin: 5px 0;
}

img.btn_close {
	float: right; 
	margin: -55px -55px 0 0;
}

/*--Blacking out the screen--*/
#fade {
	display: none;
	background: #000; 
	position: fixed; left: 0; top: 0; 
	z-index: 10;
	width: 100%; height: 100%;
	opacity: .80;
	z-index: 9999;
}

/*--Making IE6 Understand Fixed Positioning--*/
*html #fade {
	position: absolute;
}

.poplight {}

/*======================================================================
Footer styling
======================================================================*/
#footer_panel {
	border-top: 4px solid #000;
	background: #000140;
}

#footer {
  background: #000140 url(../images/general/footer.jpg) 0 0 no-repeat;
  width: 960px;
	margin: 0 auto;
	height: 230px;
	overflow: hidden;
	position: relative;
}

#footer p {
  position: absolute;
	bottom: 5px;
	right: 10px;
	margin: 0;
}