/* ================================================================ **
** style.css
** ---------------------------------------------------------------- **
** Updated: 27-02-08 (dd-mm-yy)
** Author: JS
** ================================================================ */

/* ---------------------------------------------------------------- **
** Generic
** ---------------------------------------------------------------- */
body {
	font-family: "Trebuchet MS", Verdana, Helvetica, Arial, sans-serif;
	font-size: 76%;
	color: #000;
	text-align: center;
	margin: 0 !important;
	padding: 0;
	background-color: #455761;
	}
	
/* headers */
h2, h3, h4, h5, h6 { 
	color: #4D636E; 
	margin: 0; 
	font-weight: normal;
	}
h2 { font-size: 2.5em; padding: 40px 0 10px; }
h3 { font-size: 2.3em; padding: 35px 0 10px; }
h4 { font-size: 1.7em; padding: 35px 0 10px; }
h5 { font-size: 1.4em; padding: 25px 0 5px; }	
h6 { font-size: 1.2em; padding: 20px 0 0; }

/* text */
p, li, dt, dd, th, td, code { font-size: 1.15em; line-height: 1.8em; }
p { margin: 10px 0 20px; }
acronym { cursor: help; }

/* links */
a { text-decoration: underline; color: #D90040; }
a:hover { text-decoration: none; }

/* images */
img { border: 8px solid #ced6da; padding: 1px; }	
a img { border-color: #ced6da; }
a:hover img { border-color: #D90040; }
img.right { margin: 15px 0 20px 30px; clear: both; }
img.left { margin: 15px 30px 20px 0; clear: both; }

/* lists */
ul {
	margin: 20px 0;
	padding: 0 0 0 15px;
	list-style-type: square;
	}
ul li { color: #D90040; }
ul li span { color: #000; }	

/* set centre content area 
width & properties */	
#header div,
#banner div div,
#body div,
#footer div { 
	width: 780px; 
	margin: 0 auto; 
	text-align: left;
	position: relative;
	}
#header div div,
#banner div div div,
#body div div,
#footer div div { 
	min-height: 1%;
	margin: 0; 
	padding: 0;
	}	
	
/* clearing floats on all divs 
that have an id (IE ignores this) */
div:after {
	content: ".";
	clear: both;
	display: block;
	height: 0;
	visibility: hidden;
	}	
	
/* classes */
.left { float: left; }
.right {float: right; }	
.hide { display: none; }
.col1, .col2, .col3 { float: left; }
.row { clear: both; }

/* list of links */
ul.links {
	margin: 10px 0 20px;
	padding: 0;
	list-style-type: none;
	}
ul.links li { padding: 0.2em 0; }

/* list of thumbs */
ul.thumbs {
	margin: 10px 0 20px;
	padding: 0;
	list-style-type: none;
	}
ul.thumbs li { color: #000; float: left; width: 148px; margin-bottom: 1.5em; position: relative; }
ul.thumbs li p { margin: 0; font-size: 0.9em; }
ul.thumbs li p a { position: absolute; right: 0; bottom: 0; }

/* button */
ul.btn { 
	clear: both; 
	float: left; 
	padding: 0; 
	margin: 10px 0 20px; 
	list-style-type: none; 
	}	
ul.btn:after {
	content: ".";
	clear: both;
	display: block;
	height: 0;
	visibility: hidden;
	}
ul.btn li { }
ul.btn li a { 
	white-space: nowrap; 
	background-color: #D90040; 
	padding: 0 15px 2px; 
	color: #fff; 
	text-decoration: none; 
	text-transform: lowercase; 
	display: block;
	}
	
/* breadcrumb */	
p.breadcrumb {
	font-size: 1em;
	position: relative;
	margin: 0 0 -20px;
	z-index: 900;
	}
p.breadcrumb strong { color: #657881; font-weight: normal; }
	
/* ---------------------------------------------------------------- **
** Header
** ---------------------------------------------------------------- */
#header { background: #fff url(/images/body_.png) repeat-x; }
#header div { padding: 4em 0 3em; }

/* logo */
#header h1 {
	background: url(/images/vialtus_solutions_large_logo.gif) no-repeat;
	margin: 0;
	width: 183px;
	height: 124px;
	}
#header h1 a {
	text-indent: -9999px;
	outline: none;
	display: block;
	height: 100%; 
	}	
	
/* navigation */
#header ul {
	list-style-type: none;
	margin: 0 0 0 163px;
	padding: 0;
	position: absolute;
	right: 0;
	bottom: 2.5em;
	}	
#header ul li { display: inline; margin: 0 0 0 2em; white-space: nowrap; }	
#header ul li a { color: #526a76; font-size: 1.3em; text-decoration: none; }	
#header ul li a strong,
#header ul li a:hover { color: #D90040; text-decoration: underline; font-weight: normal; }	

/* subnav */
/*#header ul#subnav { top: 3.67em; bottom: auto; }
#header ul#subnav li { font-size: 0.8em; }*/

/* ---------------------------------------------------------------- **
** Banner
** ---------------------------------------------------------------- */
#banner { 
	background: #3b4952 url(/images/banner_.jpg) repeat-x;
	border-bottom: 15px solid #c03; 
	} 
#banner div { background: url(/images/banner_glow.png) no-repeat 50% 0; }	
#banner div div { background-image: none; color: #8ab1c5; font-size: 1.3em; padding-bottom: 30px; }

#home #banner div div { min-height: 270px; padding-right: 350px; padding-bottom: 0; width: 430px; }
* html #home #banner div div { height: 270px; }
#home #banner span {
	background: url(../img/banner_photo.png) no-repeat;
	width: 448px;
	height: 412px;
	position: absolute;
	right: -100px;
	bottom: -115px;
	z-index: 600;
	}

#banner h2 { 
	color: #fff; 
	font-weight: bold; 
	font-size: 2em; 
	line-height: 1.1em; 
	padding-top: 40px; 
}
#banner p { line-height: 1.3em; }
#banner ul.btn { margin-left: 130px; }
* html #banner ul.btn { margin-left: 70px; }

/* ---------------------------------------------------------------- **
** Body
** ---------------------------------------------------------------- */
#body { background: #fff url(/images/body_.png) repeat-x; padding: 30px 0; }
#body div { padding: 0 0 2em; }

/* two columns */
#body.cols-two .col1 { width: 60% !important; margin-right: 7% !important; }
#body.cols-two .col2 { width: 33% !important; }
#body.cols-two .col3 { width: 100% !important; clear: both; }	
* html #body.cols-two .col1 { margin-right: 4.4% !important; }

/* three columns */
#body.cols-three .col1, 
#body.cols-three .col2 { width: 40% !important; margin-right: 7% !important; }	
#body.cols-three .col2 { width: 26.6% !important; }
#body.cols-three .col3 { width: 19.3% !important; }
* html #body.cols-three .col1,
* html #body.cols-three .col2 { margin-right: 4.4% !important; }

#body.cols-three .col3 ul.btn { width: 100%; text-align: center; font-size: 1.3em; }

/* ---------------------------------------------------------------- **
** Footer
** ---------------------------------------------------------------- */
#footer { background: url(/images/footer_.png) repeat-x; margin-top: 15px; color: #fff; }
#footer div { min-height: 25px; padding-bottom: 4em; }
* html #footer div { height: 25px; }
* html #footer div div { height: 1%; }

/* three columns */
#footer.cols-three .col1, 
#footer.cols-three .col2, 
#footer.cols-three .col3 { width: 28.6% !important; margin-right: 7% !important; }	
#footer.cols-three .col3 { margin-right: 0 !important; }
* html #footer.cols-three .col1,
* html #footer.cols-three .col2 { margin-right: 4.4% !important; }

#footer h2, 
#footer h3, 
#footer h4, 
#footer h5, 
#footer h6 { color: #fff; }

#footer a, 
#footer ul.links li a { color: #fff; }

#footer #copy { position: absolute; clear: both; bottom: 1em; font-size: 0.9em; color: #bbb; }
#footer #copy a { color: #bbb; }
#footer #copy p { float: left; margin: 0; padding: 0; }
#footer #copy ul { margin: 0; padding: 0; float: right; list-style-type: none; }
#footer #copy ul li { display: inline; margin-left: 15px; }

table#peer-cont {
	width: 100%;
	font-size: 80%;
}

table#peer-cont-role {
	width: 100%;
	font-size: 90%;
}

table#peer-cont-rpsl {
	width: 100%;
	font-size: 90%;
}

table#peer-cont-ixp {
	width: 100%;
	font-size: 90%;
}

table#public-peering-guidelines {
	width: 100%;
	font-size: 90%;
}

table#private-peering-guidelines {
	width: 100%;
	font-size: 90%;
}

.toprow {
	text-align: center;
	background-color:#ea0030;
}

.leftcol {
	text-align: left;
	background-color:#ea0030;
}