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

/*
Title:  Cores.Ltd - Master Screen Styles
Author:	lee@netinspire.co.uk
*/

@import url('undohtml.css');

html {
	
	background: #000;
}


body {
	text-align: center;
	font: 93% Helvetica, Arial, Verdana, Sans-Serif;
	color: #000;
	width: 100%;
	display: table;
	background: #000 /*url(../img/swirls.jpg) no-repeat center top*/;
}

#wrapper {
	position: relative;
	width: 950px;
	height: auto;
	margin: 0 auto;
	text-align: left;
}

#branding {
	position: relative;
	width: 950px;
	height: 108px;
	margin: 25px 0 0 0;
	background: url(../img/logo-header.gif) no-repeat 0 0;
}


	#branding h2 {
		text-indent: -9999px;
	}
	
	#branding h1 {
		position: relative;
		width: 304px;
		height: 65px;
		top: 23px;
		left: 17px;
		text-indent: -9999px;
		overflow: hidden;
	}
	
	#branding h1 a {
	  position: relative;
	  top: 0;
	  left: 0;
	  display: block;
	  width: 304px;
	  height: 65px;
	}


.tel {
	position: relative;
	top: 22px;
	font-size: 160%;
	color: #069;
	letter-spacing: 1px;
}

.tel span {
	color: #666;
	letter-spacing: normal;
}  

/* Hide logo from CSS enabled browsers */
.logo {
	display: none;
}



hr {
	display: none;
}

blockquote {
	position: relative;
	font-style: italic;
	margin: 8px 22px 0 21px;
}

.credit {
	position: relative;
	font-size: 90%;
	font-weight: bold;
	font-style: normal;
	text-align: right;
	margin: -.2em 28px;
}


/*----- Featured Projects -------------- */
#feature {
	position: relative;
	width: 950px;
	height: 309px;
	margin: 0 auto;
	text-align: center;
	overflow: hidden;
	background-color: #f5f5f5;
}

	#renewable-feature {
		position: relative;
		width: 915px;
		height: 300px;
		margin: 0 15px 0 15px;
		padding-top: 1px;
		text-align: left;
		background: url(../img/solar-panel-install.jpg) 0 0 no-repeat;
		border: 2px solid #fff;
	}
	
		#renewable-feature h2 {
			color: #390;
		}	
			
			
	#domestic-feature {
		position: relative;
		width: 915px;
		height: 300px;
		margin: 0 15px 0 15px;
		padding-top: 1px;
		text-align: left;
		background: url(../img/domestic-plug-socket.jpg) 0 0 no-repeat;
		border: 2px solid #fff;
	}
	
		#domestic-feature h2 {
			color: #000;
		}
	
	#industrial-feature {
		position: relative;
		width: 915px;
		height: 300px;
		margin: 0 15px 0 15px;
		padding-top: 1px;
		text-align: left;
		background: url(../img/industrial-electrical.jpg) 0 0 no-repeat;
		border: 2px solid #fff;
	}
	
		#industrial-feature h2 {
			color: #36f;
		}
		
	
	#commercial-feature {
		position: relative;
		width: 915px;
		height: 300px;
		margin: 0 15px 0 15px;
		padding-top: 1px;
		text-align: left;
		background: url(../img/commercial-electrical.jpg) 0 0 no-repeat;
		border: 2px solid #fff;
	}
	
		#commercial-feature h2 {
			color: #999;
		}
		
		
	#contact-feature {
		position: relative;
		width: 915px;
		height: 300px;
		margin: 0 15px 0 15px;
		padding-top: 1px;
		text-align: left;
		background: url(../img/contact-map.jpg) 0 0 no-repeat;
		border: 2px solid #fff;
	}
	
		#contact-feature h2 {
			color: #fc0;
		}	
			
		#feature h2 {
			position: relative;
			width: 360px;
			margin: 12px;
			padding: 12px;
			text-align: left;
			background: #fff;
		}
		
			h2 em {
				display: block;
				margin-top: .3em;
				font: 70% Georgia, 'Times New Roman', Serif;
				font-style: italic;
				color: #666;
			}
			
			h2 em span {
				font-style: normal;
				color: #333;
				margin-left: 1em;
			}
	
	
	/*#feature a {
		position: absolute;
		top: 0;
		left: 0;
		width: 950px;
		height: 290px;
	}*/

#container {
	position: relative;
	width: 950px;
	height: auto;
	margin: 0 auto;
	text-align: left;
	background: #f5f5f5 url(../img/footer-base.gif) bottom left no-repeat;
}

#leadins {
	position: relative;
	clear: both;
	width: 950px;
	height: auto;
	margin: 0;
	padding-bottom: 4px;
	background: url(../img/pb.gif) repeat-x bottom left;
}


#leadins h2 {
		margin: 5px 8px 5px 8px;
		font-size: 1.35em;
		line-height: 120%;
	}
	
	#container #leadins p {
		margin: 8px;
		font-size: 95%;
		line-height: 125%;
	}


#leadin1, #leadin2, #leadin3, #leadin4 {
	float: left;
	position: relative;
	display: inline;
	height: 215px;
	border: 2px solid #fff;
}

#leadin1 {
	width: 218px;
	margin: 10px 0 15px 15px;
	background: url(../img/domestic-electricians-leadin-bg.jpg) 0 0 no-repeat;
	padding-top: 102px;
}

	#leadin1 h2 {
		color: #000;
	}

#leadin2 {
	width: 219px;
	margin: 10px 0 15px 10px;
	background: url(../img/commercial-electricians-leadin-bg.jpg) 0 0 no-repeat;
	padding-top: 102px;
}

	#leadin2 h2 {
		color: #999;
	}

#leadin3 {
	width: 219px;
	margin: 10px 0 15px 10px;
	background: url(../img/industrial-electricians-leadin-bg.jpg) 0 0 no-repeat;
	padding-top: 102px;
}

	#leadin3 h2 {
		color: #36f;
	}

#leadin4 {
	width: 218px;
	margin: 10px 15px 15px 10px;
	background: url(../img/renewable-energy-leadin-bg.jpg) 0 0 no-repeat;
	padding-top: 102px;
}

	#leadin4 h2 {
		color: #390;
	}


.leadinlink {
	position: absolute;
	bottom: 0;
	right: 0;
}

.leadinlink a:link, .leadinlink a:visited {
	text-decoration: none;
	color: #36f;
}

.leadinlink a:hover, .leadinlink a:active {
	text-decoration: underline;
}



h2 {
   position: relative;
   font-size: 1.6em;
   color: #666;
   margin: 0 0 12px 0;
  }

	.port {
		padding: 1px 0;
		background: url(../img/portfolio-bg.png) 0 0 no-repeat;
	}
	
		.port h2 {
			text-align: center;
			margin: 17px;
		}
		
		a.prev, a:visited.prev {
			position: absolute;
			top: 10px;
			left: 10px;
			display: block;
			width: 134px;
			height: 41px;
			background: url(../img/prev-bttn.gif) 0 0 no-repeat;
			overflow: hidden;
		}
		
				a:hover.prev, a:active.prev {
					background-position: 0 -41px;
				}
				

		
		a.next, a:visited.next {
			position: absolute;
			top: 10px;
			left: 796px;
			display: block;
			width: 134px;
			height: 41px;
			background: url(../img/next-bttn.gif) 0 0 no-repeat;
			overflow: hidden;
		}
		
				a:hover.next, a:active.next {
					background-position: 0 -41px;
				}
								


#scrollable {
	width: 940px;
	height: 500px;
}


#main-nav {
	position: absolute;
	width: 612px;
	height: 41px;
	top: 34px;
	left: 338px;
	margin: 0;
	background: #f5f5f5;
	text-transform: uppercase;
	font-size: 80%;
	text-align: center;
	/*text-indent: -9999px;*/
	overflow: hidden;
}

	#main-nav li {
	 position: relative;
	 float: left;
	}
 
	 #main-nav a {
	 display: block;
	 height: 41px;
	 padding-top: 15px;
	 text-decoration: none;
	 /*color: #666;
	 background: url(../img/menu-bg.jpg) no-repeat 0 0;*/
	 }
 
	 /* Home Button */
 
	 #main-nav a:link.hp, #main-nav a:visited.hp {
		width: 90px;
		border-left: 2px dotted #630;
		color: #630;
	 }
 
	 #main-nav a:hover.hp, #main-nav a:active.hp {
		color: #fff;
		background: #630;
	 }
 
 
	 /* Industrial Button */
 
	 #main-nav a:link.ind, #main-nav a:visited.ind {
		width: 100px;
		border-left: 2px dotted #36f;
		color: #36f;
	 }
 
	 #main-nav a:hover.ind, #main-nav a:active.ind {
		color: #fff;
		background: #36f;
	 }
 
 
	 /* Domestic Button */
 
	 #main-nav a:link.dom, #main-nav a:visited.dom {
		width: 100px;
		border-left: 2px dotted #000;
		color: #000;
	 }
 
	 #main-nav a:hover.dom, #main-nav a:active.dom {
		color: #fff;
		background: #000;
	 }
 
 
	 /* Commercial Button */
 
	 #main-nav a:link.com, #main-nav a:visited.com {
		width: 110px;
		border-left: 2px dotted #999;
		color: #999;
	 }
 
	 #main-nav a:hover.com, #main-nav a:active.com {
		color: #fff;
		background: #999;
	 }


	 /* Renewable Energy */
 
	 #main-nav a:link.re, #main-nav a:visited.re {
		width: 100px;
		border-left: 2px dotted #390;
		color: #390;
	 }
 
	 #main-nav a:hover.re, #main-nav a:active.re {
		color: #fff;
		background: #390;
	 } 
 
	 
	 /* Contact Us Button */
 
	 #main-nav a:link.cu, #main-nav a:visited.cu {
		width: 100px;
		border-left: 2px dotted #fc0;
		color: #fc0;
	 }
 
	 #main-nav a:hover.cu, #main-nav a:active.cu {
		color: #fff;
		background: #fc0;
	 }



#hpcontent {
	position: relative;
	width: 915px;
	margin: 13px 15px 10px 15px;
	background-color: #f5f5f5;
	border: 2px solid #fff;
}

#hpcontent h2 {
	margin: 12px;
	color: #666;
	font-size: 200%;
}

#hpcontent p {
	margin: 12px;
}


#content {
	position: relative;
	float: left;
	display: inline; /* Needed for IE 6! */
	width: 600px;
	margin: 13px 5px 10px 15px;
	background-color: #f5f5f5;
}

#content h2 {
	margin: 12px;
	color: #666;
}

#content p {
	margin: 12px;
}

#compintro {
	position: relative;
	margin-bottom: 14px;
	border: 2px solid #fff;
}

	#compintro p {
		margin-right: 117px;
	}


.marketingpara {
	margin-right: 0;
	padding-right: 120px;
	background: url(../img/adwords.gif) no-repeat right top;
}	
	
	
.aboutcomp {
	position: relative;
	margin-bottom: 14px;
	background: #eee;
	border: 2px solid #fff;
}

	.aboutcomp h3 {
		margin: 1.5em 0 1em 12px;
}

.aboutcomp p {
	clear: both;
}
	

#css-web-design {
	position: relative;
	margin: 8px 0 10px 0;
	border: 2px solid #fff;
	background: #eee url(../img/css-edit.jpg) no-repeat bottom right;
}

#css-web-design h2 {
	margin: 16px 12px;
	color: #333;
}

#css-web-design p {
	font-size: 92%;
	margin: 12px;
}

#css-web-design .w3c {
	margin-right: 185px;
}




#web-design-services {
	position: relative;
	margin: 8px 0 10px 0;
	border: 2px solid #fff;
	background: #eee;
}


.columnlist {
	float: left;
	display: inline-block;
	width: 46%;
	margin: 12px;
	font-size: 95%;
	line-height: 120%;
}

	#web-design-services ul h2 {
		color: #069;
		margin: 8px 0 17px 0;
	}

	.columnlist li {
		margin: .5em 0;
		padding-right: 15px;
	}


strong {
	font-weight: normal;
}




.portfolio {
	position: relative;
	clear: both;
	width: 915px;
	margin: 12px 0;
	padding-bottom: 10px;
	background: #eee;
	border: 2px solid #fff;
}


.folioinfo {
	float: right;
	width: 410px;
	display: inline;
}

 .folioinfo p {
	margin: 2px 12px 5px 0!important;	
 }
 
 .folioinfo h3 {
	color: #069;
	margin: 16px 0;
 }
 
 .folioinfo h4 {
	margin: 1.2em 0 2px 0;
 }

	.portfolio img {
		float: left;
		margin: 12px;
		display: inline;
	}
	
	
.quote {
	padding: 12px 15px;
	margin: 12px 12px 12px 0;
	border: 2px solid #fff;
	background: #f5f5f5;
}	
	
	blockquote {
		font-family: Georgia, "Times New Roman", Times, serif;
		font-style: italic;
		font-size: 105%;
		line-height: 135%;
		margin: .7em 12px 0 0;
		/*background: #daeaf0;
		border-left: 6px solid #069;*/
	}
	
	.credit {
		text-align: right;
		margin: -3px 15px 1em 0;
	}

h1, h2, h3, h4, h5 {
   font-weight: normal;
   color: #333;
  }


#content h2 {
	margin: 12px;
	color: #000;
}


#compintro h2 {
   position: relative;
   font-size: 1.6em;
   color: #f60;
   margin: 12px;
  }

h3 {
	 position:  relative;
	 font-size: 1.4em;
	 margin: 1em 0 .3em 12px;
	 color: #666;
	}
 
h4 {
	 position:  relative;
	 font-size: 1.2em;
	 margin: .8em 0 .3em 12px;
	}
 
p {
	position: relative;
	margin: .3em 0 1.2em 0;
	line-height: 140%;
}


a:link.cta, a:visited.cta											{text-align: center; font-size: 1.3em; color: #36f; text-decoration: none; display: block; margin: 1.2em;}
a:hover.cta, a:active.cta											{text-decoration: underline;}


em {
	font-style: normal;
	font-weight: bold;
}


ul.ulist {
	margin: 1em;
	list-style-type: square;
}

ul.ulist li {
	margin: 1em;
}

.highlight {
	font-size: 100%;
	/*font-weight: bold;*/
	margin: -3px 0 .7em 0;
	padding: 5px 10px 5px 10px;
	/*background: #fff;
	border: 2px solid #fff;*/
	background: #f70;
	color: #fff;
}


/* Benefits List Styles -------------------------- */


.listintro {
	padding-bottom: 10px;
}

.benefits {
	/* float: left;  Fixed IE6 Bug */
	line-height: 135%;
	margin: 0 12px 1em 15px;
}

.benefits li {
	padding-left: 65px;
	margin-bottom: 1.2em;
}

.benefits li strong {
	font-weight: bold;
}

.web-designli {
	background: url(../img/web-designli.gif) 0 5px no-repeat;
}

.marketingli {
	background: url(../img/marketingli.gif) 0 5px no-repeat;
}

.experienceli {
	background: url(../img/experienceli.gif) 0 5px no-repeat;
}

.ppc {
	background: url(../img/ppcli.gif) 0 5px no-repeat;
}

.seo {
	background: url(../img/seoli.gif) 0 5px no-repeat;
}

.email-marketing {
	background: url(../img/emailmarketingli.gif) 0 5px no-repeat;
}

.price {
	font-size: 110%;
	font-weight: bold;
	text-align: center;
	padding: 5px 0 4px 0;
	border-top: 1px solid #ccc;
	border-bottom: 2px solid #ccc;
}

/* Services Definition List ------------------------- */

.solutions {
	font-size: 92%;
	float: left;
	display: inline-block;
}

.solutions dt {
	font-size: 108%;
}

.solutions dd {
	font-size: 90%;
	margin: 0 3px 1em 0;
}

.services1 {
	float: left;
	width: 202px;
	margin-left: 3px;
	padding-top: 10px;
	display: inline-block;
}

.services1 dt {
	font-weight: bold;
	margin: 2px 10px .5em 11px;
}


.services2 {
	float: left;
	width: 202px;
	margin: 0 0 1em 14px;
	padding-top: 10px;
	display: inline-block;
}

.services2 dt {
	font-weight: bold;
	margin: 2px 10px .5em 11px;
}


.services3 {
	float: left;
	width: 202px;
	margin: 0 0 1em 14px;
	padding-top: 10px;
	display: inline-block;
}

.services3 dt {
	font-weight: bold;
	margin: 2px 3px .5em 11px;
}


.process {
	margin: 0 17px 1.5em 32px;
	list-style: decimal;
	font-style: italic;
	font-size: 95%;
}

	.process li {
		line-height: 135%;
		margin-bottom: 1em;
	}


.tick {
	background: #fff url(../img/tick.gif) 0 0 no-repeat;
}



a:link.tl {
  color: #069;
  text-decoration: none;
  border-bottom: 1px dotted #069;
}

a:visited.tl {
  color: #069;
  text-decoration: none;
  border-bottom: 1px dotted #f60;
}

a:hover.tl {
  border-bottom: 1px solid #069;
}

a:active.tl {
  border-bottom: 1px solid #f60;
}


.pic {
	border: 2px solid #fff;
	margin-bottom: 8px;
}


#gmap {
	width: 651px;
	height: 199px;
	border: 2px solid #fff;
	margin-bottom: 8px;
}


.more {
	display: block;
	text-align: right;
	font-size: 90%;
	margin: -.3em 20px 12px 10px;
	text-decoration: none;
	color: #069;
}

.raquo {
	color: #f60;
}


.profile {
	position: relative;
	height: auto;
	margin: 0 0 12px 0;
	background-color: #daeaf0;
	border: 2px solid #fff;
}

.profile h3 {
	margin: 16px 12px 5px 12px;
	color: #069;
}	

.profile-pic {
	float: left;
	width: 100px;
	height: 100px;
	margin: 12px 12px 11px 14px;
	border-top: 1px solid #999;
	border-right: 1px solid #fff;
	border-bottom: 1px solid #fff;
	border-left: 1px solid #999;
	display: inline; /* Needed for IE 6! */
}

.profile-info {
	float: right;
	width: 510px;
	display: inline; /* Needed for IE 6! */
	font-size: 92%;
	margin: 10px 10px 10px 0;
}

.profile-info h5 {
	margin: .3em 0;
	font-size: 110%;
	font-weight: bold;
}

.profile-info p {
	margin: 0!important;
}

/* =Form Styling --------------------------------- */

#subcontent {
	float: right;
	position: relative;
	width: 305px;
	height: auto;
	margin: 13px 15px 10px 0;
	text-align: left;
	display: inline; /* Needed for IE 6! */
	overflow: hidden;
	font-size: 1.2em;
	background-color: #f5f5f5;
	border: 2px solid #fff;
}

	#subcontent address {
		padding-top: 70px;
		font-style: normal;
		background: url(../img/envelope.gif) 0 0 no-repeat;
	}

	#subcontent p {
		margin-left: 12px;
	}


.offer {
	width: 305px;
	height: 150px;
	position: relative;
	top: 0;
	left: 0;
	text-indent: -9999px;
	background: url(../img/offer.gif) 0 0 no-repeat;
}

 
/* =Featured Styling ----------------------------- */

#featured {
	position: relative;
	clear: both;
	width: 246px;
	height: auto;
	margin-top: 10px;
	padding: 0;
	text-align: left;
	background: #eee;
	border: 2px solid #fff;
}

	#featured h3 {
		color: #069;
		text-align: center;
		margin: 12px;
	}

	#featured h5 {
		 font-size: 80%;
		 font-weight: bold;
		 margin: .5em 16px 1em 18px;
	}

	#featured p {
		 font-size: 80%;
		 margin: -.5em 16px 1.5em 19px;
	}

	#feature1 {
		 width: 250px;
		 height: auto;
		 float: left;
	}
 
	#feature2 {
		 width: 250px;
		 height: auto;
		 float: left;
	}
 
	#feature3 {
		 width: 250px;
		 height: auto;
		 float: left;
	}
 

.img-feature {
	display: block;
	width: 223px;
	height: 118px;
	margin: 0 0 0 14px;
	/*background: url(../img/feature-img-bg.gif) 0 0 no-repeat;*/
}

	.img-feature img {
		margin: 4px;
		/*border: 1px solid #999;*/
	}

#featured h4 {
	font-size: 1.5em;
	color: #f60;
	margin: .5em 8px;
}

.clearfix {
	position: relative;
	width: 100%;
	height: 2px;
	clear: both;
}



#web-design-includes {
	position: relative;
	width: 245px;
	height: auto;
	margin: 13px 15px 10px 0;
	text-align: left;
	background: #eee;
	border: 2px solid #fff;
}

	#web-design-includes li {
		margin: .6em 10px .6em 10px;
		padding-left: 20px;
		line-height: 1.3em;
		background: url(../img/green-tick.gif) no-repeat 0 2px;
	}
	
	#web-design-includes h4 {
		margin: 12px;
		font-size: 120%;
		line-height: 120%;
	}


#footer {
	position: relative;
	clear: both;
	width: 950px;
	margin:  10px auto;
	padding: 0 0 5px 0;
	font-size: 90%;
	text-align: center;
	background: url(../img/pb.gif) repeat-x 0 0;
}


#trade-logos {
	position: relative;
	width: 950px;
	height: 84px;
	top: 0;
	left: 0;
	margin: 0;
	padding: 0;
	text-indent: -9999px;
	overflow: hidden;
	background: url(../img/logos-bg.gif) no-repeat 0 0;
}

	#trade-logos li {
		float: left;
		height: 84px;
	}
 
	 #trade-logos li a {
	 	display: block;
	 	height: 84px;
	 }
	 
	 #niceicac {
		width: 110px;
		position: absolute;
		left: 216px;
	}
	
	 #niceicdi {
		width: 70px;
		position: absolute;
		left: 360px;
	}
	
	 #napit {
		width: 63px;
		position: absolute;
		left: 456px;
	}
	
	 #consline {
		width: 51px;
		position: absolute;
		left: 545px;
	}
	
	 #trustmark {
		width: 103px;
		position: absolute;
		left: 632px;
	}


#foot-nav {
	position: relative;
	padding: 20px 220px;
	background: url(../img/pb.gif) repeat-x 0 0;
	text-align: center;
}

	#foot-nav li {
		float: left;
		padding: 2px 10px;
	}
 
	 #foot-nav a:link, #foot-nav a:visited {
		text-decoration: none;
	 	color: #666;
	 }
	 
	 #foot-nav a:hover, #foot-nav a:active {
	 	display: block;
		text-decoration: underline;
	 }
	 
	 
#vcard {
	float: left;
}

#footer .copyright {
	clear: both;
	font-size: 80%;
	color: #f5f5f5;
	margin-top: 50px;
}

	#footer .copyright a {
		color: #fff;
		text-decoration: none;
		border-bottom: 1px dotted #fff;
	}

address {
	font-style: normal;
	margin: 12px;
	line-height: 130%;
}

address span {
		font-weight: bold;
	}
	
	
	
/*
   ----------------------------------------------------------------
   GBCF-V3 GRAY STYLE SHEET - MIKE CHERIM HTTP://GREEN-BEAST.COM
   ----------------------------------------------------------------
   To use for testing, this stylesheet must be named default.css
*/

/* === form div and elements ======================================= */

#form-div { 
  font-family : Helvetica, Arial, Verdana, Sans-Serif;
  width : 90%;
  margin : auto;
  margin-left: 2px;
  color : #555;
  line-height : 1.7em;
}

#subcontent #form-div {
	width: 305px;
}


#form-div p.form-footer {
  margin : -35px 2px 20px 13px;
 }

#form-div p.form-footer a { 
  color : #444; 
}

#form-div p.form-footer a:hover, #form-div p.form-footer a:focus, #form-div p.form-footer a:active { 
  color : #000; 
  text-decoration : none; 
}

#form-div p.form-footer a:focus, #form-div p.form-footer a:active { 
  background-color : #eee; 
}


/* === form div link styles ======================================== */

#form-div a { 
  color : #444; 
}
  
#form-div a:hover, #form-div a:focus, #form-div a:active { 
  color : #000; 
  text-decoration : none; 
}

#form-div a:focus, #form-div a:active { 
  background-color : #eee; 
}


/* === success and error message/results box ======================= */

#form-div p.success, #form-div p.error, #form-div p.center { 
  color : #fff;
  /* color : #000; (lite colors option - uncomment to use) */
  padding : 1px 4px; 
  border : 1px solid #000; 
  background-color : #444;
  /* background-color : #bbb; (lite colors option - uncomment to use) */
  margin : 10px 3px;
  text-align : center;
}

#form-div p.error { 
  background-color : #bb0000; 
  /* background-color : #edbaba; (lite colors option - uncomment to use) */
}

#form-div p.error a, #form-div p.success a {
  color : #ffff7f;
}

#form-div p.center {
  text-align : left;
  background-color : #edbaba;
  color : #000;
  margin-top : -3px;
  padding : 0px 4px; 
}

#form-div p.error a:hover, #form-div p.error a:focus, #form-div p.error a:active, 
#form-div p.success a:hover, #form-div p.success a:focus, #form-div p.success a:active {
  color : #eee;
  background-color : #bb0000; 
}

#form-div p.success a:hover, #form-div p.success a:focus, #form-div p.success a:active {
  background-color : #444; 
}


/* === structural form elements ==================================== */

form#gbcf-form { }

fieldset.main-set,
fieldset.req-set,
fieldset.opt-set { 
  border : 1px solid #eee;
  padding : 5px;
}


/* === textural form elements ====================================== */

#form-div legend { 
  font-weight : bold;
}

#form-div legend span { }

legend.main-legend { 
  color : #777;
  font-size : 110%;
}

legend.req-legend,
legend.opt-legend { 
  color : #777;
}

legend.main-legend span { }
legend.main-legend { }

legend.req-legend span { }
legend.req-legend {
  margin-left : -2px;
}

legend.opt-legend span { }
legend.opt-legend { 
  margin-left : -2px;
}

label.req-label, label.opt-label {
  color : #444;
}

label.opt-label.check {
  float : right;
  padding : 0;
  margin : 1px 4px;
  cursor : pointer;
}

label.opt-label.main-label {
  margin : 0 2px;
  font-weight : bold;
}

label.opt-label.main-label span {
  font-weight : normal;
  color : #666;
}

label.opt-label.main-label span.req, label span.req  {
  font-weight : bold;
  color : #c70000;
}

label.req-label.explain {
  color : #666;
  font-size : .8em;
}

label.req-label.explain:hover {
  color : #000;
}

/* === control and interface form elements ========================= */
/*
  note: In this section you will see the hover/focus styles for the 
  inputs. For example: input:hover, input:focus. You will also see 
  these names applied as classes: input.hover, input,focus, for 
  example. This is not done by mistake. Those classes are needed for 
  the JavaScript focus script (files/focus.js) for IE 7 and older.
*/

input.text-long.address, input.text-long.address:hover, input.text-long.address:focus,
input.text-long.address.hover, input.text-long.address.focus {
  border-bottom : 0;
  margin-bottom : 0;
  padding-bottom : 2px;
  border-bottom : 1px dotted #bbb;
}

input.text-long.address2, input.text-long.address2:hover, input.text-long.address2:focus,
input.text-long.address2.hover, input.text-long.address2.focus {
  border-top : 0;
  margin-top : 0;
  padding-top : 2px;
  border-top : 1px dotted #bbb;
}

input.checkbox {
  border : 1px solid #999;
  width : .9em;
  height : .9em;
  padding : 0;
  margin : 0;
  cursor : pointer;
}

input.checkbox:hover, input.checkbox.hover,
input.checkbox:focus, input.checkbox.focus {
  border : 1px solid #666;
}

input.text-short, 
input.text-med, 
input.text-long,
select.select,
textarea.textarea {
  font : 1em Helvetica, Arial, Verdana, Sans-Serif;
  border : 1px solid #999;
  background-color : #fffffe;
  cursor : text;
  padding : 1px 2px;
}

select.select {
  padding : 1px 0;
}

input.text-short {
  width : 100px;
}

input.text-med, select.select {
  width : 250px;
}

input.text-long {
  width : 300px;
}

textarea.textarea {
  width : 440px;
  height : 200px;
}


#subcontent input.text-short {
  width : 150px;
}

#subcontent input.text-med, select.select {
  width : 250px;
}

#subcontent input.text-long {
  width : 250px;
}

#subcontent textarea.textarea {
  width : 270px;
  height : 200px;
}


select.select, select.select option {
  cursor : pointer;
}

input.text-short:focus, input.text-short.focus, 
input.text-med:focus, input.text-med.focus,
input.text-long:focus, input.text-long.focus,
select.select:focus, input.select.focus,
textarea.textarea:focus, textarea.textarea.focus {
  border : 1px solid #666;
  background-color : #ffe;
}

input.button { 
  font : 1.1em Helvetica, Arial, Verdana, Sans-Serif;
  font-weight : bold;
  margin-top : 8px;
  padding : 1px 10px;
  cursor : pointer;
  float : left;
  clear : both;
  color : #444;
}

input.button:hover, input.button.hover,
input.button:focus, input.button.focus {
  color : #333;
}

/* because IE6 sucks - if you have a conditionally served IE6 style sheet add this to it */
* html input.button {
  border : 1px solid #666;
}


/* EOF - Created by Mike Cherim @ http://green-beast.com =========== */