@charset "utf-8";

/*
    Bluelight Website CSS File
*/

/* ======= GLOBAL STYLES ======== */

.group:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.group { display: inline-block; clear: both; }
/* start commented backslash hack \*/ * html .group { height: 1%; } .group { display: block; } /* close commented backslash hack */

body {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	margin: 0;
	padding: 0;
	background-color: #fff;
}

img {
	border: 0;
}

p, h3, h4, h5, h6, li {
	margin: 1ex 1em;

}

#Container {
	position: relative;
	width: 1024px;
	margin: 0 100px;
	padding: 0;
	background-color: #1C75BC;
}

#content {
	width: 882px;
/*	margin: 0 auto;*/
	margin: 0 75px;
	padding: 0;
	display: block;
}
#leftContent {
	margin: 0px;
	padding: 4px 0px 0px 0px;
	float: left;
	width: 300px;
	font-size: 0.8em;
	color: #FFF;
}
#rightContent {
	margin: 0px;
	padding: 0px;
	float: left;
	width: 500px;
}
#logo {
	float: left;
	display: inline;
	width: 300px;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 20px;
	margin-left: 0;
}
#logo h1 {
	display: inline;
	visibility: hidden;
	position: relative;
	float: left;
	font-size: 1px;
}
#headerTag p{
	font-family: Verdana, Geneva, sans-serif;
	font-size: 1.5em;
	text-align:center;
	position: absolute;
	left: 450px;
	top: 0px;
/*	float: center;
	width: 10px;*/
	font-weight: bold;
	color: #FFF;
	letter-spacing: 0.5em;
	display: inline-block;
}
#contact_form {
	height: 300;	
	
}
#contactDetails {
	float: right;
	text-align: right;
	width: 300px;
	color: white;
	font-weight: bold;
	display: inline-block;
	margin: 0px;
	padding-top: 20px;
	padding-right: 5px;
	padding-bottom: 0px;
	padding-left: 0px;
}
.contactDetails1 {
	float: right;
	text-align: right;
	width: 250px;
	color: white;
	font-weight: normal;
	display: inline-block;
	margin-top: 0px;
	margin-right: 0px;
	padding-top: 0px;
	padding-right: 0px;
	letter-spacing: 0.08ex;
	line-height: 2.5ex;
	font-size: 20px;
}
.contactDetails2 {
	float: right;
	text-align: right;
	width: 250px;
	color: white;
	font-weight: normal;
	display: inline-block;
	margin-top: 0px;
	margin-right: 0px;
	padding-top: 0px;
	padding-right: 0px;
	font-size: 31px;
	line-height: 1.65ex;
}
.contactDetails3 {
	float: right;
	text-align: right;
	width: 250px;
	color: white;
	font-weight: normal;
	display: inline-block;
	margin-top: 0px;
	margin-right: 0px;
	padding-top: 0px;
	padding-right: 0px;
	letter-spacing: 0.03ex;
	line-height: 1ex;
	font-size: 18px;
}
.homeHeaderPic {
	position: relative;
	width: 879px;
	height: 400px;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
}
.homeHeader_Box {
	position: absolute;
	left: 30px;
	top: 30px;
}
.homeHeader_BoxText {
	position: absolute;
	left: -12px;
	top: 5px;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 1.6em;
	color: #FFF;
	width: 323px;
	text-align: center;
}
.pageHeaderPic {
	position: relative;
	background-image: url(../images/pageHeaderPic.png);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	height: 383px;
	width: 879px;
}
.ComputerRepairsHeaderPic {
	position: relative;
	background-image: url(../images/ComputerRepairsHeaderPic.png);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	height: 383px;
	width: 879px;
}
.OfficeSuppliesHeaderPic {
	position: relative;
	background-image: url(../images/OfficeSuppliesHeaderPic.png);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	height: 383px;
	width: 879px;
}
.pageHeader_Box {
	position: absolute;
	left: 22px;
	top: 23px;
	height: 138px;
	width: 320px;
}
.pageHeader_BoxText {
	margin: 0px;
	position: absolute;
	left: 3px;
	top: 3px;
	font-size: 24px;
	color: #FFF;
	padding-top: 5px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 20px;
}

#buttons {

}
.computerRepairs img {
	float: left;
	margin: 25px 0 0 0;
}
.officeSupplies img  {
	float: right;
	margin: 25px 0 0 0;
}
.pageContentBox1 {
	float: left;
	margin: 25px 0 0 0;
	position: relative;
}
.pageContentBox1 h2 {
	font-size: 20px;
	font-weight: lighter;
	color: #1C75BC;
	position: relative;
	left: 30px;
	top: -455px;
	width: 421px;
}
.pageContentBox1 p {
	font-size: 18px;
	font-weight: lighter;
	color: #000000;
	position: absolute;
	left: 25px;
	top: 80px;
	text-align: justify;
	margin: 0px;
	padding-top: 0px;
	padding-right: 20px;
	padding-bottom: 0px;
	padding-left: 10px;
}
.pageContentBox2 {
	float: right;
	margin-top: 25px;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 0;
	position: relative;
	width: 400px;
}
.pageContentBox2 h2 {
	position: relative;
	left: 25px;
	top: -465px;
	color: #FFF;
}
.pageContentBox2 ul {
	position: absolute;
	left: 5px;
	top: 75px;
	color: #FFF;
	list-style-type: none;
	margin: 0px;
	padding: 0px;
	font-size: 20px;
	line-height: 1.5ex;
}
.pageContentBox3 {
	float: left;
	margin: 25px 0 0 0;
	position: relative;
}
.pageContentBox3a {
	float: left;
	padding: 0px;
	margin: 0px;
}
.pageContentBox3b {
	float: left;
	margin: 0px;
	padding-left: 10px;
}
.pageContentBox4 {
	float: right;
	margin-top: 25px;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 0;
	padding: 0px;
}
.pageContentBox5 {
	float: left;
	margin: 25px 0 0 0;
	position: relative;
}
.pageContentBox5 h2 {
	font-size: 20px;
	font-weight: lighter;
	color: #1C75BC;
	position: relative;
	left: 30px;
	top: -225px;
	width: 800px;
}
.pageContentBox5 p {
	font-size: 18px;
	font-weight: lighter;
	color: #000000;
	position: absolute;
	left: 25px;
	top: 200px;
	text-align: justify;
	margin: 0px;
	padding-top: 0px;
	padding-right: 20px;
	padding-bottom: 0px;
	padding-left: 10px;
}
#footer  {
	position: relative;
	margin-top: 10px;
	padding-top: 10px;
}
.footerText {
	color: #FFF;
	position: absolute;
	left: 250px;
	top: 45px;
	font-size: 10pt;
}
.footerText_Line1 {
	font-size: 10px;
	color: #FFF;
}
.footerText_Line2 {
	font-size: 10px;
	color: #FFF;
}
.footerText_Line3 {
	font-size: 8px;
	color: #FFF;
}
.footerText_Line4 {
	font-size: 8px;
	color: #FFF;
}

#navigation a, #navigation a span {  
    display: block; 
    float: left;
}

/* Commented backslash hack hides rule from IE5-Mac \*/ 
#navigation a, #navigation a span  {  
    float: none;
    } 
    /* End IE5-Mac hack */ 
  
#navigation { 
	float: right;
    list-style: none;
    padding: 0;
    margin: 0;
    }
  
#navigation li { 
    float: left;
	color: #fff;
	background: #fff;
    display: block;
    margin: 0;
	height: 26px;
	line-height: 26px;
    padding: 0; 
    }  

 a {
    text-decoration: none;
}

#mainMenu {
	float: right;
	background: #fff;
	height: 26px;
	margin: 0;
	padding: 0;
}

#mainMenu a:link, #footerRight a:link, .pageContentBox2 a:link{
    color: #fff;
	text-decoration: none;
}

#mainMenu a:visited , #footerRight a:visited, .pageContentBox2 a:visited {
    color: #fff;
}

#mainMenu a:active, #footerRight a:active, .pageContentBox2 a:active {
    color: #fff;
}

#mainMenu a:hover, #footerRight a:hover, .pageContentBox2 a:hover {
    color: #fff;
}

#menuBar {
	position: relative;
	height: 114px;
	line-height: 114px;
	color: #fff;
	font-size: 26px;
	background: #aaa;
	margin: 0;
	padding: 0;
}

#mainContainer {
	position: relative;
	width: 941px;
	padding: 0;
	margin: 0 auto;
}

#aboutHeadPic {
	background: url("../images/aboutHeadPic") right top no-repeat;	
}

#formLeft {
	float: left;
}

#formRight {
	float: right;
}

/* Contact Form Styling */

#register  {
	position: absolute;
	background: url(../imgs/register.png) no-repeat;
	top: 56px;
	left: 402px;
	margin: 0;
	padding: 0;
}

form fieldset { 
	font-family:Verdana, Arial, Helvetica, sans-serif; 
	font-size:1.2em;
	margin:0px 0px 20px 0px; 
	width:578px; 
	position:relative;
	border:0;
	display:block; 
	padding: 0px 10px 8px; 
}

form fieldset legend	{ 
	border-width:0px; 
	border-style:solid; 
	border-color:#fff; 
	color:#3D7169;
	font-weight:bold; 
	font-variant:small-caps; 
	font-size:16px; 
	padding:4px 8px;
	margin:0px 0px 10px 0px; 
	position:relative; 
	top: -12px; 
}

label	 { 
	font-size: 14px; 
	display:block; 
	float:left; 
	width:10em; 
	text-align:left;
	font-weight: bold;
	margin:.2em .2em 0 0; 
	color:white; 
	padding:8px 0px; 
}

label.error {
	font-weight:normal;
	color:red;
	text-align:left;
	width:169px;
	padding-left:25px;
	background: transparent url(../images/cancel.png) no-repeat scroll left;
}

input { -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; width: 260px; height: 30px; font-size: 16px;}

textarea { -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; width: 260px; height: 190px; font-size: 16px;}

input.text-input { 
	margin: 4px;
	padding: 2px 0;
	color:#333; 
	background: #fff;
	/* background: url(../imgs/formInput.png) no-repeat; */
}

label#name_label      { position:absolute; top:0px; left:0px; }
input#name            { position:absolute; top:25px; left:0px; }
label#name_error      { position:absolute; top:50px; left:0px; color: red; font-size: 14px; }

label#company_label     { position:absolute; top:70px; left:0px; }
input#company           { position:absolute; top:95px; left:0px; }
label#company_error      { position:absolute; top:120px; left:0px; color: red; font-size: 14px; }

label#email_label     { position:absolute; top:140px; left:0px; }
input#email           { position:absolute; top:165px; left:0px; }
label#email_error      {position:absolute; top:190px; left:0px; color: red; font-size: 14px; }

label#phone_label     { position:absolute; top:210px; left:0px; }
input#phone           { position:absolute; top:235px; left:0px; }
label#phone_error      {position:absolute; top:260px; left:0px; color: red; font-size: 14px; }

label#interest_label     { position:absolute; top:55px; left:320px; }
label#interest_error      { position:absolute; top:160px; left:320px }

label#interest1_label     { position:absolute; top:80px; left:340px; }
input#interest1_0  { position:absolute; top:90px; left:310px; }

label#interest2_label     { position:absolute; top:100px; left:340px; }
input#interest1_1  { position:absolute; top:110px; left:310px; }

label#interest3_label     { position:absolute; top:120px; left:340px; }
input#interest1_2  { position:absolute; top:130px; left:310px; }

label#interest4_label     { position:absolute; top:140px; left:340px; }
input#interest1_3  { position:absolute; top:150px; left:310px; }

label#enquiry_label     { position:absolute; top:0px; left:300px; }
textarea#enquiry           { position:absolute; top:30px; left:300px; }
label#enquiry_error      {
	position:absolute;
	top:220px;
	left:400px;
	color: red;
	font-size: 14px;
}

input.button { 
	position:absolute; 
	top:238px; 
	left:300px; 
	padding: 0;
	width: 100px;
	height: 32px;
	margin:0; 
	color:#3D7169; 
	font-family:Verdana, Arial, Helvetica, sans-serif;
	background:#000; -moz-border-radius:10px; 
	/* background: url(../imgs/buttonSend.png) no-repeat; */
	color: #fff;
	border-width:0px; 
	border-style:solid; 
	border-color:000; 
}

input.button:hover { 
	background:#000 none repeat scroll 0% 0%; 
	/* background: url(../imgs/buttonSend.png) no-repeat; */
	
	color:white; 
}
	
#message							{ width:180px;margin:0 0 0 0; }
#message h2						{ font-size:22px;color:#000; margin: 30px 30px 0 50px;}
#message p						{ color:white;font-weight:bold;margin:5px 0px; 0 50px;}
#checkmark						{ position:absolute;top:5px;left:0px; }

/* END of contact form styling */

/* Rounded Corner Box */
.bl {background: url(../imgs/bl.png) 0 100% no-repeat}
.br {background: url(../imgs/br.png) 100% 100% no-repeat}
.tl {background: url(../imgs/tl.png) 0 0 no-repeat}
.tr {background: url(../imgs/tr.png) 100% 0 no-repeat; padding: 10px} 
.t {background: url(../imgs/dot.png) 0 0 repeat-x; }
.b {background: url(../imgs/dot.png) 0 100% repeat-x}
.l {background: url(../imgs/dot.png) 0 0 repeat-y}
.r {background: url(../imgs/dot.png) 100% 0 repeat-y} 

