/*

Owner: VPLS Inc
Information: 
Version: 1.0
Author: jjones@vpls.net

Table of Contents:
			General
			Typography
			Single Styles
			Page Structure
			  --- Header
			  --- Navigation
			  --- Content
			  --- Footer
			Page Components
			Overrides

*/

/* General
----------------------------------------------- */

@import url('/vpls/css/reset.css');	/* Reset Browser Deaults */

body {
	background: #122537 url('http://speedtest.vpls.net/vpls/images/bg.jpg') top center no-repeat;
	color: #4c4c4c;
	font: 14px Arial, Helvetica, sans-serif;
	}

/* Typography
----------------------------------------------- */

h1 {
	color: #fff;
	font-size: 32px;
	position: absolute;
	top: 130px;
	left: 140px;
	}
h2 {
	color: #3b3b3b;
	font-size: 22px;
	}
h3 {}
h4 {
	color: #fff;
	font-family: Tahoma, Geneva, sans-serif;
	font-size: 24px;
	font-weight: normal;
	position: absolute;
	top: 12px;
	left: 215px;
	white-space: nowrap;
	}
h5 { font-size: 14px; font-weight: normal; }

p { margin: 10px 0 10px 0; }

#content-region li {
	background: url('http://speedtest.vpls.net/vpls/images/grey-li-bg.gif') 0 15px no-repeat;
	margin-left: 15px;
	padding: 10px 0 10px 15px;
	}

a, a:visited { color: #4c4c4c; text-decoration: none; }
a:hover, a:focus, a:active { color: #999; }

a.aqua-button, a.button { color: #fff; display: block; font-size: 12px; font-weight: bold; text-align: center; }
a.aqua-button, a.aqua-button:hover { color: #fff !important; background: url('http://speedtest.vpls.net/vpls/images/aqua-btn.jpg') 0 0 no-repeat;}
a.button, a.button:hover { color: #fff !important; background: url('http://speedtest.vpls.net/vpls/images/button-btn.jpg') 0 0 no-repeat; }
a.aqua-button {
	float: right;
	height: 44px;
	line-height: 44px;
	width: 143px;
	}
a.aqua-button:hover { background-position: 0 -44px; }
a.button {
	height: 37px;
	line-height: 37px;
	width: 103px;
	}
a.button:hover { background-position: 0 -37px; }

/* Single Styles
----------------------------------------------- */

.source {display: none;}
.clear { clear: both; height: 1px; }
.right {float: right;}
.left {float: left;}

.open {
	background: url('http://speedtest.vpls.net/vpls/images/open-bg.jpg') top center no-repeat;
	clear: both;
	position: relative;
	min-height: 70px;
	}

.tabs-inactive #tabs-region {display: none;}
.tabs-active #content-region {background: #fff url('http://speedtest.vpls.net/vpls/images/content-bg-tabs.jpg') top left no-repeat !important;}

.page-front #logo a {border: none !important;}
.page-front #logo h4 {display: none;}
.page-front #content-region {padding: 70px 0 0 0 !important;}

/* Page Structure
----------------------------------------------- */

#wrapper {
	margin: auto;
	width: 960px;
	}
	
#header-region {
	height: 120px;
	position: relative;
	}
	
#nav-region { font: 12px Tahoma, Geneva, sans-serif !important; }
#nav-region:after {
	clear: both;
	content: "";
	display: block;
	height: 0;
	visibility: hidden;
	}

#banner-region {
	background: url('http://speedtest.vpls.net/vpls/images/banners/front.jpg') top center no-repeat;
	clear: both;
	height: 275px;
	margin: 4px 0 5px 0;
	width: 100%;
	position: relative;
	}
	
#tabs-region {
	background: url('http://speedtest.vpls.net/vpls/images/tabs-bg.jpg') bottom left no-repeat;
	height: 35px;
	}

#content-region {
	background: #fff url('http://speedtest.vpls.net/vpls/images/content-bg.jpg') top left no-repeat;
	padding: 40px 0 0 0;
	min-height: 400px;
	position: relative;
	}
	
#content-region:after {
	background: url('http://speedtest.vpls.net/vpls/images/content-after.jpg') top center no-repeat;
	clear: both;
	content: "";
	display: block;
	height: 10px;
	width: 960px;
	bottom: -10px;
	}

#footer-region {
	background: url('http://speedtest.vpls.net/vpls/images/footer-bg.jpg') top center no-repeat;
	color: #29537a;
	clear: both;
	padding: 50px 0 10px 30px;
	}
	
/* Banners
----------------------------------------------------------- */

.page-about #banner-region {background: url('http://speedtest.vpls.net/vpls/images/banners/about.jpg');}
.page-storage #banner-region {background: url('http://speedtest.vpls.net/vpls/images/banners/storage.jpg');}
.page-voice-solutions #banner-region {background: url('http://speedtest.vpls.net/vpls/images/banners/voice-solutions.jpg');}
.page-colocation #banner-region {background: url('http://speedtest.vpls.net/vpls/images/banners/colocation.jpg');}
.page-ip-transit #banner-region {background: url('http://speedtest.vpls.net/vpls/images/banners/ip-transit.jpg');}
.page-managed-solutions #banner-region {background: url('http://speedtest.vpls.net/vpls/images/banners/managed-solutions.jpg');}
.page-speedtest #banner-region {background: url('http://speedtest.vpls.net/vpls/images/banners/speedtest.jpg');}

/*  Content Framework
	By default, all divs have 80px padding on sides.
	Adding the class "inline" removes the padding.
	Adding either border class, shaves off 1px for the
	margin.
----------------------------------------------------------- */

.grid1, .grid2, .grid3, .grid4 { float: left; display: inline; padding: 0 40px 0 40px; margin: 10px; }

.grid1 { width: 220px; } /* 220 + padding = 300 */
.grid2 { width: 380px; } /* 380 + padding = 460 */
.grid3 { width: 540px; } /* 540 + padding = 620 */
.grid4 { width: 860px; } /* 860 + padding = 940 */

.inline { padding: 0; }
.grid1.inline { width: 300px; }
.grid2.inline { width: 460px; }
.grid3.inline { width: 620px; }
.grid4.inline { width: 940px; }

.inline-right { padding-right: 0; }
.grid1.inline-right { width: 260px; }
.grid2.inline-right { width:  420px; }
.grid3.inline-right { width: 580px; }
.grid4.inline-right { width: 900px; }

.inline-left { padding-left: 0; }
.grid1.inline-left { width: 260px; }
.grid2.inline-left { width:  420px; }
.grid3.inline-left { width: 580px; }
.grid4.inline-left { width: 900px; }

.border-left { border-left: 1px dotted #888; margin-left: 9px; }
.border-right { border-right: 1px dotted #888; margin-right: 9px; }


/* Page Components
----------------------------------------------- */

#logo {
	bottom: 10px;
	left: 10px;
	position: absolute;
	}
	
#logo a {border-right: 1px solid #fff; display: block; text-decoration: none;}

#phone-number {
	background: url('http://speedtest.vpls.net/vpls/images/number-bg.jpg') top left no-repeat;
	color: #788795;
	font-size: 14px;
	font-weight: bold;
	height: 30px;
	padding: 8px 0 0 13px;
	position: absolute;
	bottom: 20px;
	right: 0;
	width: 245px;
	}
#phone-number strong {color: #4d657c;}

#nav-region li {
	background: url('http://speedtest.vpls.net/vpls/images/nav-bg.jpg') no-repeat; 
	float: left; 
	position: relative; 
	height: 44px;
	line-height: 44px;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	width: 160px;
	z-index: 9999;
	}
#nav-region li a { color: #fff; display: block; }

#nav-region li.about-us { background-position: 0px 0px; width: 159px; }
#nav-region li.about-us:hover { background-position: 0px -44px; }
#nav-region li.data { background-position: -159px 0px; }
#nav-region li.data:hover { background-position: -159px -44px; }
#nav-region li.voice { background-position: -319px 0px; }
#nav-region li.voice:hover { background-position: -319px -44px; }
#nav-region li.network { background-position: -479px 0px; }
#nav-region li.network:hover { background-position: -479px -44px; }
#nav-region li.managed { background-position: -639px 0px; }
#nav-region li.managed:hover { background-position: -639px -44px; }
#nav-region li.contact { background-position: -799px 0px; width: 161px; }
#nav-region li.contact:hover { background-position: -799px -44px; }

#nav-region li ul {
	display: none;
	position: absolute;
	top: 44px;
	left: 0;
	}
#nav-region li:hover ul { display: block; }

#nav-region li li {
	background: url(http://speedtest.vpls.net/vpls/images/sub-nav-bg.png) 0 0 no-repeat;
	height: 35px;
	text-align: left;
	text-transform: none;
	width: 209px;
	}
#nav-region li li.last { background-position: 0px -35px;}
#nav-region li li a { display: block; height: 35px !important; padding-left: 15px; line-height: 35px !important; }
#nav-region li li a:hover { color: #999; }

#tabs-region li {display: inline;}
#tabs-region li a {
	color: #cecece;
	display: block;
	font-size: 16px;
	font-weight: bold;
	float: left;
	height: 35px;
	line-height: 35px;
	text-align: center;
	text-decoration: none;
	width: 190px;
	}
#tabs-region li a:hover {color: #fff;}
#tabs-region li.active a, #tabs-region li.active a:hover {color: #454545;}

hr.open, hr.close { 
	background: #fff url('http://speedtest.vpls.net/vpls/images/hr-bgs.jpg') top center no-repeat; 
	border: 0;
	clear: both; 
	width: 960px;
	}
hr.open { height: 70px; margin-bottom: -20px; }
hr.close { background-position: 0px -80px; height: 50px; }

#footer-region ul {
	float: left;
	margin: 0 10px 0 10px;
	width: 160px;
	}
#footer-region li.title {
	background: none;
	color: #4885be;
	font-size: 14px;
	font-weight: bold;
	padding-left: 0 !important;
	}
#footer-region li {
	background: url('http://speedtest.vpls.net/vpls/images/footer-li-bg.png') 0px 8px no-repeat;
	padding: 3px 0 2px 15px;
	}

#footer-region a {color: #29537a; text-decoration: none;}
#footer-region a:hover {color: #4885be;}
#footer-region p.copyright {clear: left; margin: 10px 0 10px 0; text-align: center;}

/* Overrides
----------------------------------------------- */