/* Created by John Henry Muller : johnhenrymuller.com */


/*********** TABLE OF CONTENTS START ***********\

1. Interface Styles
2. Shared Content Styles
3. Unique Content Styles

\*********** TABLE OF CONTENTS END *************/

/* ////////// 1. Interface Start ////////// */

/* Set to Zero */
* {
	vertical-align: top;
	margin: 0px;
	padding: 0px;
	border: 0px;
	}
/* No Dotted Lines */
a {
	outline: none;
	}
:focus {
	-moz-outline-style: none;
	}
/* Background */
body {
	background-color:#FFFFFF;
	background-image: url(../../images/interface/background.jpg);
	background-repeat: repeat-x;
	background-position: left top;
	}
/* Global Text */
body, p {
	font-family:Arial, Helvetica, sans-serif;
	color:#666666;
	font-size: 12px;
	}
/* Global Links */
a, a:link,a:active, a:visited {
		color: #87B3CB;
		text-decoration: underline;
		}
		a:hover, a:visited:hover {
			color: #B677A6;
			text-decoration: underline;
			}

#container {
	width: 940px;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	}
#header {
	background-image: url(../../images/interface/header.jpg);
	background-repeat: no-repeat;
	background-position: left top;
	}

/* Logo */
#logo {
	width: 200px;
	height: 129px;
	float: left;
	}
	#logo h1 a, #logo h1 a:link, #logo h1 a:active, #logo h1 a:visited {
		display: block;
		text-indent: -9999px;
		overflow: hidden;
		width: 200px;
		height: 129px;
		}
/* Slogan */
#slogan {
	width: 500px;
	height: 129px;
	display: block;
	float: right;
	}
	#slogan a, #slogan a:link, #slogan a:active, #slogan a:visited {
		display: block;
		text-indent: -9999px;
		overflow: hidden;
		width: 500px;
		height: 129px;
		}

/* Layout */
#content {
	width: 590px;
	float: left;
	}

#footer {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	line-height: 110%;
	color: #999999;
	padding-bottom: 20px;
	clear: both;
	text-align: center;
	margin-right: 350px;
	padding-top: 20px;
	}
	#footer a, #footer a:link, #footer a:active, #footer a:visited {
			color: #999999;
			text-decoration: none;
			}
			#footer a:hover, #footer a:visited:hover {
				color: #724881;
				text-decoration: none;
				}

/* NAV */
#nav {
	width: 820px;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	height: 60px;
	}
	#nav li {
		list-style-type: none;
		display: block;
		float: left;
		}
	#nav a {
		height: 59px;
		display: block;
		background-position: left top;
		text-indent: -9999px;
		overflow: hidden;
		}
		#nav a:hover {
		background-position: left center;
			}
		
		/* FOR GRAPHIC NAV */
			#nav #nav_home a { background-image:url(../../images/interface/navigation-new/home.jpg); width: 92px;}
			#nav #nav_about a { background-image:url(../../images/interface/navigation-new/about.jpg); width: 91px;}
			#nav #nav_metrowifi a { background-image:url(../../images/interface/navigation-new/metrowifi.jpg); width: 117px;}
			#nav #nav_hotzones a { background-image:url(../../images/interface/navigation-new/hotzones.jpg); width: 112px;}
			#nav #nav_ruralwifi a { background-image:url(../../images/interface/navigation-new/ruralwifi.jpg); width: 102px;}
			#nav #nav_bandwidth a { background-image:url(../../images/interface/navigation-new/bandwidth.jpg); width: 119px;}
			#nav #nav_blog a { background-image:url(../../images/interface/navigation-new/blog.jpg); width: 78px;}
			#nav #nav_contact a { background-image:url(../../images/interface/navigation-new/contact.jpg); width: 109px;}
		
		/* ON STATE */
			#home #nav_home a, #home #nav_home a:hover { background-position: left bottom; }
			#about #nav_about a, #about #nav_about a:hover { background-position: left bottom; }
			#metrowifi #nav_metrowifi a, #metrowifi #nav_metrowifi a:hover { background-position: left bottom; }
			#hotzones #nav_hotzones a, #hotzones #nav_hotzones a:hover { background-position: left bottom; }
			#ruralwifi #nav_ruralwifi a, #ruralwifi #nav_ruralwifi a:hover { background-position: left bottom; }
			#bandwidth #nav_bandwidth a, #bandwidth #nav_bandwidth a:hover { background-position: left bottom; }
			#blog #nav_blog a, #blog #nav_blog a:hover { background-position: left bottom; }
			#contact #nav_contact a, #contact #nav_contact a:hover { background-position: left bottom; }

/* \\\\\\\\\\\ 1. Interface End \\\\\\\\\\\ */







/* ////////// 2. Shared Conent Styles Start ////////// */

/* Global Links */

/* Lists */
#content ul, #content ol {
	margin-left: 90px;
	margin-bottom: 20px;
	}
#content li {
	margin-bottom: 5px;
	}

/* Title */
h2 {
	margin-left: 55px;
	height: 82px;
	width: 530px;
	text-indent: -9999px;
	}
	/* Graphic Titles */
	#about h2 { background-image: url(../../images/interface/titles/about.gif); }
	#metrowifi h2 { background-image: url(../../images/interface/titles/metrowifi.gif); }
	#hotzones h2 { background-image: url(../../images/interface/titles/hotzones.gif); }
	#support h2 { background-image: url(../../images/interface/titles/support.gif); }
	#blog h2 { background-image: url(../../images/interface/titles/blog.gif); }
	#contact h2 { background-image: url(../../images/interface/titles/contact.gif); }
	
	#ruralwifi h2 { background-image: url(../../images/interface/titles/ruralwifi.gif); }
	#bandwidth h2 { background-image: url(../../images/interface/titles/bandwidth.gif); }

/* Header */
h3 {
	font-size: 18px;
	font-weight: bold;
	color: #7C94BA;
	margin-left: 60px;
	}
	h3 a:link, h3 a:active, h3 a:visited {
		color: #FFFF00;
		text-decoration: underline;
		}
		h3 a:hover, h3 a:visited:hover {
			color: #FF00FF;
			text-decoration: underline;
			}

/* Sub-Header */
h4 {
	font-size: 13px;
	font-weight: bold;
	color: #FF00FF;
	}
	h4 a:link, h4 a:active, h4 a:visited {
		color: #817C61;
		text-decoration: underline;
		}
		h4 a:hover, h4 a:visited:hover {
			color: #9F402C;
			text-decoration: underline;
			}

/* Paragraph Text */
p {
	line-height: 160%;
	color: #666666;
	padding-bottom: 20px;
	margin-left: 60px;
	}

/* Form Styles */

#form {
	width: 400px;
	margin-right: auto;
	margin-left: auto;
	margin-top: 0px;
	margin-bottom: 0px;
	}
	input, select, textarea {
	clear: none;
	background-color: #F3F3F3;
	padding: 5px;
	border: 1px solid #CCCCCC;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #333333;
	width: 310px;
	float: left;
	display: block;
	line-height: normal;
	font-weight: bold;
		}
	input:focus, textarea:focus, select:focus {
	background-color:#FFFFFF;	
	}
	#form div {
		clear: both;
		margin-bottom:10px;
		height: 40px;
		}
	#form label {
		width: 70px;
		display: block;
		float: left;
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 12px;
		color: #666666;
		}
	
	/* Form - City, State, Zip*/
		div#form-city {
			float: left;
			}
		#form-city input {
			width: 80px;
			}
		#form-state input {
			width: 30px;
			}
		
		div#form-state {
			clear: none;
			float: left;
			}
		#form-state label {
			width: 50px;
			padding-left: 15px;
			}
		div#form-state select {
			width: 100px;
			}
		
		div#form-zip {
			clear: none;
			float: right;
			width: 100px;
			}
		#form-zip label {
			width: 30px;
			}
		#form-zip input {
			width: 50px;
			}
		
		/* Form - message*/
		div#form-message {
			height: auto;
			}
		#form-message textarea {
			height: 78px;
			}
		
		/* Form - submit*/
		div#form-submit {
			margin-right: auto;
			margin-left: auto;
			width: 150px;
			}
		#form-submit input {
			width: 80px;
			float: right;
			}

/* Content Classes */
.floatleft { float: left; }
.floatright { float: right; }
.gap { padding-bottom: 20px; }
.nogap { padding-bottom: 0px; }
.textsmall { font-size: 9px; }
.textwhite { color: #FFFFFF; }
.brclear { clear: both; height: 1px;}


/* \\\\\\\\\\\ 2. Shared Content Styles End \\\\\\\\\\\ */








/* ////////// 3. Unique Content Styles Start ////////// */

/* Page Name */

/* \\\\\\\\\\\ 3. Unique Content Styles End \\\\\\\\\\\ */
#content_wrap {
	clear: both;
	}
#logoslogan {
	clear: both;
	height: 159px;
	}
#sidecontent {
	float: left;
	width: 350px;
	background-image: url(../../images/interface/sidecontent.jpg);
	background-repeat: no-repeat;
	background-position: 0px 30px;
	min-height: 400px;
	}
#sidecontent h3 {
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: normal;
	color: #FFFFFF;
	display: block;
	margin-top: 100px;
	font-size: 18px;
	margin-bottom: 15px;
	margin-left: 0px;
	line-height: 18px;
	}
blockquote {
	margin-left: 60px;
	margin-bottom: 20px;
	background-color: #F0F0F8;
	padding: 15px;
	}
#footer li {
	list-style-type: none;
	display: inline;
	padding-right: 5px;
	padding-left: 5px;
	}
#sidecontent p {
	margin-left: 75px;
	margin-right: 70px;
	font-size: 12px;
	color: #4E407F;
	line-height: 150%;
	}
#footer ul {
	margin-top: 5px;
	}
#home #header {
	background-image: url(../../images/interface/home_header.jpg);
	height: 340px;
	}
#home h2 {
	text-indent: 0px;
	color: #452B64;
	background-image: none;
	height: auto;
	margin-left: 25px;
	width: auto;
	}
#home #content {
	width: 380px;
	}
#hpsidecontent {
	width: 560px;
	background-image: url(/images/interface/vertbar.jpg);
	background-position: 18px top;
	float: right;
	background-repeat: no-repeat;
	}
#hpsidecontent h3 {
	text-align: left;
	margin-top: 5px;
	color: #82ABC6;
	margin-left: 60px;
	}
#hpsidecontent p {
	margin-right: 20px;
	}
#home #footer {
	margin: 0px;
	}
#home #logo a {
	width: 300px;
	height: 250px;
	}
#home #slogan a {
	height: 250px;
	}
#sidecontent a {
	color: #461731;
	}
#sidecontent ul {
	color: #76487E;
	margin-left: 100px;
	}
#home #content p {
	margin-left: 25px;
	}
#home #content h2 {
	}
h3.graphic {
	height: 144px;
	margin-bottom: 15px;
	text-indent: -9999px;
	background-repeat: no-repeat;
	}
#about h3.graphic { background-image: url(/images/content/banners/about.jpg); }
#hotzones h3.graphic { background-image: url(/images/content/banners/hotzones.jpg); }
#metrowifi h3.graphic { background-image: url(/images/content/banners/metrowifi.jpg); }
#ruralwifi h3.graphic { background-image: url(/images/content/banners/ruralwifi.jpg); }
#wifibox {
	margin-left: 45px;
}

