/* 
	Design (C) 2010 by Camille Arana of http://krescentmoon.net
 	Comments: I don't really care if you copy the coding just as long as you 
	don't use the images from the design itself.  You may also use the coding
	as reference.

*/
body {
	background: url(bgtop.gif) top repeat-x;
	margin: 0;
	padding: 0;
	text-align: center;
}

#mainContent .box {
	background: url(arrow.gif) top; 
	width: 550px;
	height: 140px;
	color: #fff;
	font-size: 13px;
	text-align: center;
	margin-left: 150px;
}
#mainContent .box a {
	color: #fff;
	text-decoration: none;
}
#mainContent .box a:hover {
	color: #000;
	text-decoration: none;
}
#mainContent img.left { 
    float: left;
}

#mainContent img.floatLeft { 
    float: left; 
    margin: 5px 10px 0 30px;
}


.box2 {text-align:center;}
.box2 img {border: 1px #099 solid; background-color: #FFF;}
.box3 {text-align: center;}
.box3 img {border: none;}
.box4 {text-align: center;}
.box4 img {border: none;}
.box5 {padding-left: 2px;}
.box5 img {border: 2px #58d9f1 solid;}
.box5 img:hover {border: 2px #f35257 solid;}

big {font: 13px Arial, Helvetica, sans-serif; font-weight: bold;}

h1 {
	color: #F34850;
	font: 30px Century Gothic, sans-serif;
	background-image: url(h1.jpg);
	background-repeat: no-repeat;
	padding: 1px 0px 15px 55px;
	word-spacing: 8px;
	letter-spacing: 4px;
}

h2 {
	color: #84BFC4;
	font: 14px Arial, Helvetica, sans-serif;
	font-style: italic;
	font-weight: 600;
	margin-left: 175px;
	margin-top: -30px;
	margin-bottom: 35px;
	word-spacing: 2px;
	letter-spacing: 3px;
}

h3 {
	color: #000;
	background-image: url(h3.gif);
	background-repeat: no-repeat;
	font: 20px Verdana, Geneva, sans-serif;
	padding: 28px 0px 0px 25px;
	letter-spacing: 3px;
}

#navigation {
 	width: 851px;
 	height: 71px;
 	background: url(navigation.gif);
 	margin: 0 auto; padding: 0;
 	position: relative;
}
#navigation li {margin: 0; padding: 0; list-style: none; position: absolute; top: 0;}

#navigation li, #navigation a {height: 71px; display: block;}
#home{left: 0; width: 207px;}
#domain {left: 208px; width: 193px;}
#network {left: 402px; width: 220px;}
#exits {left: 623px; width: 228px;}

#home a:hover {background: transparent url(navigation.gif) 0 -71px no-repeat;}
#domain a:hover {background: transparent url(navigation.gif) -208px -71px no-repeat;}
#network a:hover {background: transparent url(navigation.gif) -402px -71px no-repeat;}
#exits a:hover {background: transparent url(navigation.gif) -623px -71px no-repeat;}

#container { 
	width: 851px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	background: #FFFFFF;
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	text-align: left; /* this overrides the text-align: center on the body element. */
} 
#header { 
	background: url(header.png) top left  no-repeat;
	width: 100%;
	height: 456px;
}
#mainContent { 
	padding: 0 20px;
	background: transparent;
	color: #838383;
	font: 12px "Palatino Linotype", "Book Antiqua", Palatino, serif;
	word-spacing: 1px;
	letter-spacing: 1px;
} 

#mainContent em {color: #FF5F45;}
#mainContent strong {color: #7179b3;}
#mainContent i {color: #000;}
#mainContent b {color: #83B8D9;}
#mainContent p{margin-left: 30px;}
#mainContent a {color: #fba2a7; text-decoration: none;}
#mainContent a:hover {color: #3CF; text-decoration: underline;}

ul.news {list-style-type:circle; margin-left: 120px; width: 500px;}
ul.upcoming {list-style-type: square; margin-left: 10px;}


#footer { 
	background: url(footerbg.gif) repeat-x;
	height: 145px;
	font: 12px Verdana, Geneva, sans-serif;
	color: #fff;
}
#footer strong {
	color: #F40B0D;
}
#footer em {
	color: #A8D2E7;
}
#footer i {
	color: #7179B3;
}
#footer a {
	color: #F99;
	text-decoration: none;
}
#footer a:hover {
	color: #C90;
	text-decoration: none;
}
.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* this class can be used to float an element left in your page */
	float: left;
	margin-right: 8px;
}
img.floatCenter {
	display: block;
    margin-left: auto;
    margin-right: auto;
}
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}