/*
	NAME: LyteSpeed Computers
	DATE: Feb. 09, 2010
	DESCRIPTION: LyteSpeed Computers' Website
	URL: http://www.lytespeedcomputers.com
	VERSION: 1.0
	DESIGNER: Ryan Bradley (NorthStar Media Group Inc.)
	CODER / PROGRAMMER: Andrew Champ (NorthStar Media Group Inc.)
*/


/*---------- GLOBAL RESETS ----------*/
*{
	padding:0;
	margin:0;
	outline:0;
	border:0;
}

/*---------- GLOBAL DEFAULTS ----------*/
html{
	min-height:100%;
	height:auto;
	overflow-y:scroll;
}

body{
	background:#FFF;
	font-family: Arial, Verdana, sans-serif;
	font-size:12px;
	letter-spacing:1px;
	color:#000;
}

a{color:#999; text-decoration:none;}
a:hover{color:#666666;}

::selection{background:#6FB1FF; color:#000;}
::-moz-selection{background:#6FB1FF; color:#000;}


/*---------- BEGIN DIV/CLASSES ----------*/
#container{
	width:830px;
	margin:0 auto;
	padding:51px 0 0 0;
}


#logo{
	background:url(../images/header-logo_bg.jpg) no-repeat top center;
	display:inline-block;
	width:272px;
	height:95px;
	text-indent:-9999px;
	padding:0 0 4px 0;
	float:left;
}


#nav{
      background:url(../images/nav-bg.png) no-repeat;
      width:515px;
      height:42px;
      position:relative;
	  margin:0;
	  text-indent:-9999px;
	  float:right;
	  top:57px;
}

#nav li{
	list-style-type:none;
	float:left;
	width:103px;
}
	#nav a{height:42px; display:block;}

	#nav #home:hover{background:url(../images/nav-bg.png) 0px -42px no-repeat;}
	#nav #services:hover{background:url(../images/nav-bg.png) -103px -42px no-repeat;}
	#nav #products:hover{background:url(../images/nav-bg.png) -206px -42px no-repeat;}
	#nav #contact:hover{background:url(../images/nav-bg.png) -309px -42px no-repeat;}
	#nav #about:hover{background:url(../images/nav-bg.png) -412px -42px no-repeat;}
	
	#nav #home .active{background:url(../images/nav-bg.png) 0px -84px no-repeat;}
	#nav #services .active{background:url(../images/nav-bg.png) -103px -84px no-repeat;}
	#nav #products .active{background:url(../images/nav-bg.png) -206px -84px no-repeat;}
	#nav #contact .active{background:url(../images/nav-bg.png) -309px -84px no-repeat;}
	#nav #about .active{background:url(../images/nav-bg.png) -412px -84px no-repeat;}

	
#footer{
	background:url(../images/footer-bg.jpg) repeat-x top center;
	height:144px;
	clear:both;
	color:#767676;
	font-size:12px;
	text-shadow:1px 1px 0px #FFFFFF;
	-moz-text-shadow:1px 1px 0px #FFFFFF;
}
	#footer #inside{
		width:830px;
		margin:0 auto;
		text-align:center;
	}
	ul#sub-nav{
		width:100%;
		padding:20px 0 20px 0;
	}
		ul#sub-nav li{
			list-style-type:none;
			display:inline;
			padding:0 30px 0 30px;
		}
			ul#sub-nav li .last{padding-right:0;}
		ul#sub-nav a{
			color:#767676;
			font-size:14px;
		}
		ul#sub-nav a:hover{color:#1859AD;}
	#footer #divider{
		background:url(../images/footer-divider.png) no-repeat;
		width:824px;
		height:3px;
		margin:0 auto;
		display:block;
	}
	#footer p{padding:20px 0 0 0;}
		#footer p span{padding-left:30px;}
	#footer a{color:#767676;}
	#footer a:hover{color:#1859AD;}
	
	
	
/*---------- Big Banner Pages ----------*/
#big{background:#FFF url(../images/header-big_bg.jpg) repeat-x top center;}

	#big #banner{
		background:url(../images/banner-big_bg.jpg) no-repeat top center;
		width:100%;
		height:300px;
		display:block;
		clear:both;
	}
	
#big #banner .left{
	float:left;
	width:450px;
	padding:26px 0 0 0;
}
	#big #banner .left #title{
		background:url(../images/banner-left_title.png) no-repeat top center;
		width:421px;
		height:103px;
		text-indent:-9999px;
	}
	#big #banner p{
		line-height:1.8;
		letter-spacing:0.5px;
		color:#FFF;
		padding:20px 0 0 0;
		font-weight:bold;
	}
	
#big #banner .right{
	float:right;
	width:360px;
	padding:26px 0 0 0;
}

#big #info{
	display:block;
	clear:both;
	padding:60px 0 40px 0;
	letter-spacing: -1em; 
	width:100%;
}

#big .column{
	background:url(../images/column_bg.jpg) repeat-x top center;
	width:266px;
	height:250px;
	display:inline-block;
	margin:0 2px 0 5px;
	overflow:hidden;
	line-height:1.5;
}
	#big .column .bars{
		display:block;
		width:100%;
	}
	#big .column #repair, #big .column #removal, #big .column #install{
		position:absolute;
		background:#031932;
		border-radius:0 0 10px 10px;
		-moz-border-radius:0 0 10px 10px;
		width:266px;
		height:180px;
		color:#FFF;
		display:none;
	}
	#big .column p{
		padding:10px;
		color:#848484;
	}
	#big .column h1{
		font-size:12px;
		color:#03172F;
		font-weight:normal;
		padding:10px 0 5px 0;
		margin:0 20px 0 10px;
		border-bottom:1px dotted #03172F;
	}
	#big ul.col-sub{
		list-style-type:none;
	}
		#big ul.col-sub li{
			display:block; 
			line-height:1.5;
			background:url(../images/bullet.gif) no-repeat;
			background-position:0 12px;
			padding:5px 5px 0 10px;
			margin:10px 0 5px 10px;
		}


/*---------- Small Banner Pages ----------*/
#small{background:url(../images/header-small_bg.jpg) repeat-x top center;}

	#small #banner{
		background:url(../images/banner-small_bg.png) no-repeat top center;
		width:100%;
		height:113px;
		display:block;
		clear:both;
	}

#twotone{background:url(../images/bg-twotone.jpg) repeat-y top center;}

#twotone #wakeman{
	width:830px;
	margin:0 auto;
	overflow:hidden;
	display:block;
}

#wakeman #sidebar{
	float:left;
	width:260px;
	padding:20px;
	display:inline-block;
}
	#wakeman #sidebar a:hover{
		color:#2A85F5;
	}

#wakeman #sidebar h1{
	color:#2A85F5;
	font-size:16px;
	border-bottom:1px dotted #2A85F5;
	padding:0 0 5px 0;
	margin:0 0 20px 0;
	font-weight:bold;
}

#wakeman #sidebar #details{ /* Title for Contact sidebar*/
	background:url(../images/contact-sidebar_details.png) no-repeat;
	width:247px;
	height:25px;
	display:block;
	text-indent:-9999px;
	padding:0 0 16px 0;
}
	
#wakeman #sidebar #map{
	padding:1px;
	background:#CCC;
	border:4px solid #FFF;
	box-shadow:0px 0px 10px #888;
	-moz-box-shadow:0px 0px 10px #888;
}

#wakeman #sidebar .sidelist{padding:0 0 20px 0;}
	#wakeman #sidebar .sidelist li{list-style-type:none; padding:0 0 3px 0; margin:0;}
		#wakeman #sidebar .sidelist li a{display:block;}
		

#wakeman #main{
	float:right;
	width:510px;
	padding:20px 0 20px 0;
	display:inline-block;
}

	
	
	
/*---------- SERVICES PAGES ---------- */

/* Sidebar */
#service-nav{
	background:url(../images/services-nav.jpg) no-repeat;
	width:250px;
	height:350px;
	text-indent:-9999px;
	background-position:0 0;
}
	#service-nav li{list-style-type:none; width:250px; height:50px;}
	#service-nav li a{display:block; width:250px; height:50px;}
	
	#service-nav #backups .active{background:url(../images/services-nav.jpg) -250px 0px;}
	#service-nav #networking .active{background:url(../images/services-nav.jpg) -250px -50px;}
	#service-nav #virus .active{background:url(../images/services-nav.jpg) -250px -100px;}
	#service-nav #custom .active{background:url(../images/services-nav.jpg) -250px -150px;}
	#service-nav #support .active{background:url(../images/services-nav.jpg) -250px -200px;}
	#service-nav #repair .active{background:url(../images/services-nav.jpg) -250px -250px;}
	#service-nav #installation .active{background:url(../images/services-nav.jpg) -250px -300px;}


/* Titles */
#main .services-title{
	background:url(../images/services-titles.png) no-repeat;
	width:327px;
	height:71px;
	display:block;
	margin:10px 0 20px 0;
}
	#main .backups{background-position:0px 0px;}
	#main .networking{background-position:0px -71px;}
	#main .virus{background-position:0px -142px;}
	#main .custom{background-position:0px -213px;}
	#main .support{background-position:0px -284px;}
	#main .repair{background-position:0px -355px;}
	#main .installation{background-position:0px -426px;}


/* Main */
#twotone h1{
	font-size:16px;
	color:#2A85F5;
	font-weight:bold;
	padding:0 0 0 0;
}

#twotone h2{
	font-size:14px;
	text-transform:uppercase;
	color:#000;
	font-weight:bold;
	padding:26px 0 10px 0;
}
	#twotone .space-up{padding:30px 0 0 0;}
	#twotone .space-down{padding:0 0 20px 0;}
	
#twotone p{
	color:#767676;
	letter-spacing:0.5px;
	padding:0 0 10px 0;
}

#twotone .items li{
	list-style-type:none;
	background:url(../images/bullet.gif) no-repeat 0px 6px;
	padding:0 0 5px 14px;
	color:#767676;
}



/*---------- QUOTE PAGE ----------*/
p#quote{
	background:url(../images/quote-bg.png) no-repeat top left;
	font-style:italic;
	font-size:16px;
	line-height:1.5;
	color:#333;
	padding:20px 0 20px 0;
}
	p#quote span{
		float:right;
		color:#666;
		font-size:18px;
		display:block;
		padding:20px 0 0 0;
	}
	
	
	
	
/*==========================================================*/

/*Contact Form*/
#sendme p, label, legend { font-size: 12px; }
#sendme h1 { margin: 10px 0 10px; font-size: 16px; color: #000; }
#sendme hr { color: inherit; height: 0; margin: 6px 0 6px 0; padding: 0; border: 1px solid #d9d9d9; border-style: none none solid; }
#sendme { display: block; width: 520px; margin: 0 auto; padding: 0;}

/* Form style */
#sendme label { display: inline-block; float: left; height: 26px; line-height: 26px; width: 105px; font-size: 14px;}
#sendme input, select { width: 350px; margin: 0; padding: 5px; color: #000; background-color: #DFEEFF; border: 1px solid #C3D0DF; margin: 5px 0; font:14px "Lucida Grande", "Lucida Sans Unicode", Arial, sans-serif; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px;}
#sendme textarea{ width: 280px; margin: 0; padding: 5px; color: #000; background-color: #DFEEFF; border: 1px solid #C3D0DF; margin: 5px 0; font:14px "Lucida Grande", "Lucida Sans Unicode", Arial, sans-serif; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px;}
#sendme input:focus, #sendme textarea:focus, #sendme select:focus { border: 1px solid #C3D0DF; background-color: #EFF6FF; color:#333; }
#sendme input.submit { width: 85px; cursor: pointer; border: 1px solid #222; background:#333; color:#FFF; }
#sendme input.submit:hover { background:#444; }
#sendme input[type="submit"][disabled] { background:#888; }
#sendme fieldset { padding:20px;}
#sendme legend { padding:7px 10px; font-weight:bold; color:#000; margin-bottom:0 !important; margin-bottom:20px; }
#sendme span{ font-size: 13px; color: #ff0000;} /* Select the colour of the * if the field is required. */
#message { margin: 10px 0; padding: 0; }
.error_message { display: block; height: 22px; line-height: 22px; background: #FBE3E4 url('../images/error.gif') no-repeat 10px center; padding: 3px 10px 3px 35px; color:#8a1f11;border: 1px solid #FBC2C4;}
.loader { padding: 0 10px; }
#sendme #success_page h1 { background: url('../images/success.gif') left no-repeat; padding-left:22px; }
acronym { border-bottom:1px dotted #ccc; }

/*==========================================================*/