/*
 * The overall theme
 */
body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	margin: 0px;
	padding: 0px;
	background-color: #303030;
	background-image: url(/common/circuit.jpg);
}

#container {
	margin: 5px auto;
	text-align: left;
	width: 800px;
}
#main {
	width: 800px;
}

.wide-left {
	float:left;
	width:560px;
	display:inline;
}

.narrow-left {
	float:left;
	width:140px;
	display:inline;
}

.wide-right {
	float:right;
	width:630px;
	display:inline;
}

.narrow-right {
	float:right;
	width:210px;
	display:inline;
}

h1,h2,h3,h4 {
	text-align: center;
	font-family: Author,cursive;
}

#contents {
	background: #fff;
	border: 1px solid #000;
	border-top: none;
	clear: both;
	margin-top: -11px;
	padding: 10px;
}

p.footer {
	color: yellow;
	font: 9px verdana, arial, sans-serif;
}


/*
 * TabNav from http://unraveled.com/projects/assets/css_tabs/
 */

ul#tabnav { /* general settings */
	text-align: left; /* set to left, right or center */
	margin: 1em 0 1em 0; /* set margins as desired */
	font: bold 11px verdana, arial, sans-serif; /* set font as desired */
	border-bottom: 1px solid #000; /* set border COLOR as desired */
	list-style-type: none;
	padding: 3px 10px 3px 10px; /* THIRD number must change with respect to padding-top (X) below */
}

ul#tabnav li { /* do not change */
	display: inline;
}

body#tab1 li.tab1, body#tab2 li.tab2, body#tab3 li.tab3, body#tab4 li.tab4, body#tab5 li.tab5, body#tab6 li.tab6, body#tab7 li.tab7
{ /* settings for selected tab */
	border-bottom: 1px solid #fff; /* set border color to page background color */
	background-color: #fff; /* set background color to match above border color */
}

body#tab1 li.tab1 a, body#tab2 li.tab2 a, body#tab3 li.tab3 a, body#tab4 li.tab4 a, body#tab5 li.tab5 a, body#tab6 li.tab6 a, body#tab7 li.tab7 a
{ /* settings for selected tab link */
	background-color: #fff; /* set selected tab background color as desired */
	color: #000; /* set selected tab link color as desired */
	position: relative;
	top: 1px;
	padding-top: 4px; /* must change with respect to padding (X) above and below */
}

ul#tabnav li a { /* settings for all tab links */
	padding: 3px 4px; /* set padding (tab size) as desired; FIRST number must change with respect to padding-top (X) above */
	border: 1px solid #000; /* set border COLOR as desired; usually matches border color specified in #tabnav */
	background-color: #aaa; /* set unselected tab background color as desired */
	color: #000; /* set unselected tab link color as desired */
	margin-right: 0px; /* set additional spacing between tabs as desired */
	text-decoration: none;
	border-bottom: none;
}

ul#tabnav a:hover { /* settings for hover effect */
	background: #fff; /* set desired hover color */
}

.alerts {
	text-align: center;
	font-family: Verdana;
	font-weight: normal;
	font-size: 11px;
	color: #404040;
	width: 200px;
	background-color: #fafafa;
	border: 1px #d79900 solid;
	border-collapse: collapse;
	border-spacing: 0px;
	margin-top: 5px;
}

.alerts a img {
	margin: 2px 2px 2px 2px;
	border: 2px solid; 
	width: 100px; 
	height: 100px;
}

.alertHd {
	background-color: #fff2ba;
	border-bottom: 1px solid #d79900;
	font-weight: bold;
	font-size: 11px;
	color: #404040;
}

.clear{
	clear:both;
}

hr.beveled {
	margin-top: 25px;
	margin-bottom: 25px;
	border: 3px inset #777;
	width: 80%;
	height: 6px;
	text-align: center;
}

.narrow-left a img {
	border: none;
}

.narrow-left img {
	width: 125px; height: 164px;
}

.javaRanch {
	color: #6f3c1b;
	font-family: Comic Sans MS;
	font-size: 50px;
}

.harmonSafe {
	color: #245882;
	font-family: Author, cursive;
	font-size: 50px;
}

.cddCapital {
	color: #080;
	font-family: Curlz MT;
	font-size: 50px;
}
.cddSmall {
	color: #0f0;
	font-family: Book Antiqua,Palatino Linotype;
	font-size: 50px;
}

.contactType {
	float: left; 
	width:120px; 
	text-align: right;
}

.contactIcon {
	float: left; 
	width:50px; 
	text-align: center;
}

.contactIconLeft {
	float: left; 
	width:24px; 
	text-align: right;
}

.contactIconRight {
	float: left; 
	width:24px; 
	text-align: left;
}

.contactDetailsLeft {
	float: left; 
	width:250px; 
	text-align: left;
}
