@charset "utf-8";
/* CSS Document */

@import "reset.css";
@import "DDSlider.css";


/*  Font Styles
/*=====================================================*/

.bold { font-weight: bold; }
.italic { font-style: italic; }
.blue { color: #0097a0; }
.gray {color: #777; }


/*  HTML / Body
/*=====================================================*/

html { height: 100%; margin: 0; padding: 0; }
body { height: 100%; margin: 0; padding: 0; }

/* ----- NAVIGATION ---------*/
/*////////////////////////////////////////////////////////////////////*/

#container {
	margin, padding: 0;
	width: 100%;
	height: auto;
	text-align: center;
	min-width: 1016px;
	/*background: #000 url(../images/tile-background-black.bmp) repeat;*/
	background: #000 url(../images/tile-background-white.png) repeat;
	border-top: 15px solid #0097a0;
	}
	
	#fade-left {
		background: url(../images/fade-left.png) left repeat-y;
		height:auto;
		width: 100%;
		}
		
	#fade-right {
		background: url(../images/fade-right.png) right repeat-y;
		height: auto;
		width: 100%;
	}
	
	#slideshow-back-2 {
		background-color: #fff;
		width: 100%;
		height: 316px;
		background: url(../images/slideshow-background-tile-x.gif) repeat-x;
		/*background: url(../images/slideshow-background-white-tile-x.gif) repeat-x;*/
		/*background: url(../images/slideshow-background-blue-tile-x.gif) repeat-x;*/
		border-bottom: 1px solid #00dcea;
		}
		
		#slideshow-back-1 {
			width: 1000px;
			height: 300px;
			padding: 7px;
			margin: 0 auto;
			border: 1px solid #000;	
			background-color: #000;
			}
			
			/*slider.css child of#slideshow-back-1 */

#header {
	width:100%;
	height: 116px;
	background-color: #000;
	border-top: 1px solid #555; 
	background: #fff url(../images/header/header-tile-x.gif) repeat-x;
	text-align: center;
	}
	
	ul.logo {
		width: 90%;
		padding: 0;
		min-width: 1016px;
		height: 116px;
		margin: 0 auto;
		background: url(../images/header/rad-header-icon.png) right no-repeat;
		}
		
		ul.logo li.icon {
			width: 100%;
			height: 116px;
			margin: 0 auto;
			background: url(../images/header/rad-header-logo.png) left no-repeat;
		}


#navigation {
	width:100%;
	min-width: 1016px;
	height:51px;
	background: #d6eaf8 url(../images/nav/dropdown-bg.gif) repeat-x left bottom;
	background-color: #3b3630;
	/*background-color: #3a3a3a;*/
	text-align: left;
}




#nav-main{
	/*width: 1000px;*/
	width: 100%;
	height: 51px;
	margin: auto;
}

.textbox {
	background-color: #3b3630;
	color: #cda869;
	border: 1px solid #8d7b66;
	padding: 15px 0 0 15px;
	margin: 0 0 0 500px;
	font: 12px Arial, Helvetica, sans-serif;
	width: 150px;
	height: 10px;
}

ul.nav-main,
ul.nav-main li {
	list-style: none;
	margin: 0;
	padding: 0;
}

/*PERCENTAGE BASED NAV*/
ul.nav-main li {
	width: 18%;
}


ul.nav-main {
	position: relative;
	z-index: 597;
}

ul.nav-main li:hover > ul {
	visibility: visible;
}


ul.nav-main li.hover,
ul.nav-main li:hover {
	position: relative;
	z-index: 599;
	cursor: pointer;
}



ul.nav-main li {
	float:left;
	display:block;
	height: 51px;
	color: #999;
	font: 14px Arial, Helvetica, sans-serif;
	background: url(../images/nav/separator.gif) no-repeat right center;
}

ul.nav-main li a {
	display:block;
	padding: 16px 100px 0 20px;
	height: 35px;
	color: #0097a0;
	text-decoration:none;
	/*font: 15px Arial, Helvetica, sans-serif;*/
	font: 15px Abel;
	text-transform: uppercase;
}

ul.nav-sub li a {
	color: #777;
}


ul.nav-main li a:hover {
	color: #0097a0;
	text-decoration: underline;
}



ul.nav-main *.list {
	padding-right: 22px;
	background: url(../images/nav/navigation-arrow.gif) no-repeat right top;
}



ul.nav-sub {
	visibility: hidden;
	position: absolute;
	padding:10px;
	top: 48px;
	left: 0;
	/*z-index: 598;*/
	background: #353535 url(../images/nav/dropdown-list-bg.gif) repeat left top;
	border-right: 1px solid #fff;
	border-bottom: 1px solid #777;
	border-left: 1px solid #fff;
}


ul.nav-sub li {
	list-style:none;
	display:block;
	padding: 0;
	height: 27px;
	float: none;
	width:145px;
	border-bottom: 1px solid #cccccc;
	background: none;
}

ul.nav-sub li a {
	list-style:none;
	display:block;
	padding: 6px 5px 6px 5px;
	height: 15px;
	float: none;
	width:145px;
	background: none;
	font: 12px Arial, Helvetica, sans-serif;
	/*font: 15px Rokkitt;*/
	text-transform: lowercase;
}

ul.nav-main li *.fb { cursor: pointer; background: url(../images/icons/facebook.png) left no-repeat; padding: 20px 0 8px 50px; }
ul.nav-main li *.tw { cursor: pointer; background: url(../images/icons/twitter.png) left no-repeat; padding: 20px 0 8px 50px; }
ul.nav-main li *.in { cursor: pointer; background: url(../images/icons/linkedin.png) left no-repeat; padding: 20px 0 8px 50px; }


/* ----- CONTENT ---------*/
/*////////////////////////////////////////////////////////////////////*/

	ul.main-content {
		width: 1016px;
		height: 950px;
		margin: 0 auto 75px;
		background: #fff url(../images/main-content/main-tile-top.png) repeat-x 0 80px;
		-moz-box-shadow: 0 0 10px #888;
		-webkit-box-shadow: 0 0 10px #888;
		box-shadow: 0 0 30px #888;
		-moz-border-radius: 0 0 2em 2em;
		border-radius: 0 0 2em 2em;
		}
		
		.h-divide {
			background: url(../images/main-content/h-divider.png) top right no-repeat;	
		}
		
		ul.main-content li.portfolio {
			width: 254px;
			height: 450px;
			text-align: center;
			display: inline;
			float: left;
			/*margin: 50px 0 0 0;*/
			}
			
			ul.main-content img {
				display: block;
				margin: 40px auto 0;	
			}
			
			a.no-underline, a:hover.no-underline, a:visited.no-underline, a:active.no-underline, a:link.no-underline {
				text-decoration: none;	
			}
			
			#portfolio-button {
				background: url(../images/main-content/portfolio_button.png) no-repeat;
				width: 161px;
				height: 39px;
				margin: 30px auto 0;	
				padding: 5px 0 0 0;
				border: none;
				font: 15px Abel;
				text-shadow: 0 0 5px #0cf;
				color: #fff;
				text-decoration: none;
				}
			
		ul.main-content li.social {
			background: #222 url(../images/main-content/social-tile.png) top repeat-x;
			width: 244px;
			height: 500px;
			text-align: center;
			display: inline;
			float: left;
			padding: 50px 0 0 0;
			margin-top: 0;
			-moz-border-radius: 0 0 2em 2em;
			border-radius: 0 0 0 5em;
			border-left: 10px solid #0cf;
			}
			
			li.social img.icon {
				display: inline;
				margin: -30px 0 0 -25px;
			}
			
			li.social img.arrow {
				float: left;
				padding-top: 50px;
				height: 35px;
				margin: 0;	
			}
			
			ul.main-content li.social h1 {
				color: #0cf;
				display: inline;
				vertical-align: top;
				padding-left: 10px;
				text-decoration: underline;
				font: 18px Abel;
				text-transform: uppercase;
			}
			
			/*ul.homepage-service li.heading {
				font: 23px Abel;
				text-transform: uppercase;
				color: #0097a0;
			}*/
			
			ul.homepage-service li.heading {
				font: 16px Holtwood One SC;
				text-transform: uppercase;
				color: #fff;
				padding: 20px 0;
				background: #0097a0 url(../images/main-content/h-divider.png) top right no-repeat;
				border-top: 10px solid #00dcea;
				border-bottom: 2px solid #00dcea;
				/*background: #95aa49 url(../images/main-content/h-divider.png) top right no-repeat; GREEN*/
			}
			
			ul.homepage-service li.service-description {
				text-align: left;
				width: 194px;
				height: 120px;
				margin: 25px auto;
				padding: 20px 30px 0;
				font: 12px/20px Arial, Helvetica, sans-serif;
				text-shadow: 1px 1px 0 #fff;
				color: #777;
				background: #f0f0f0 url(../images/main-content/h-divider.png) no-repeat right -300px;
				border-top: 1px dotted #d0cfd0;
				border-bottom: 1px dotted #d0cfd0;
			}
			
			/*ul.homepage-service li.service-description {
				text-align: left;
				width: 160px;
				height: 80px;
				margin: 10px auto;
				padding: 25px 20px;
				font: 12px/17px Arial, Helvetica, sans-serif;
				color: #fff;
				background: #48cef1 url(../images/main-content/description-background.gif) top no-repeat;
			}*/
			
			ul.main-content li.illustration {
				background: #f0f0f0 url(../images/main-content/main-tile-bottom.gif) top repeat-x;	
				width: 1016px;
				height: 300px;
				border-bottom: 8px solid #dfddde;
				display: block;
				float: left;
				margin: 60px 0 50px;
				
				}
				
				ul.main-content li.illustration img {
					margin-top: 90px;
					border: 10px solid #ccc;
				}
	
	
/* ----- FOOTER ---------*/
/*////////////////////////////////////////////////////////////////////*/

#footer { width: 100%; height: 250px; padding-top: 30px; border-bottom: 1px solid #00f0ff; background: url(../images/footer/footer-tile.png) top repeat-x; }
	#footer-background { width: 100%; height: 250px; background: #fff url(../images/footer/footer-fade.png) repeat-x bottom; }

/*--#footer contains {padding-top: 30px;} for
these elements becuase of IE display issue --*/

.footer-nav-title {	margin: 0 20px; font: 15px Abel; text-decoration: underline; text-transform:uppercase; color: #0097a0; font-weight: bold; }

ul.footer-nav { list-style: none; margin: 20px 20px;}
	ul.footer-nav img { margin: 0 5px 0 0; display: inline; }
	ul.footer-nav li { line-height: 130%; }
	
	ul.footer-nav h1, h2, p { font-family: Arial, Helvetica, sans-serif; font-weight:normal; text-align: left; }

	ul.footer-nav h2{ font-size:12px; color: #fff; display: inline;} /*footer submenu*/
	
	ul.footer-nav a:link, a:visited { color: #777; text-decoration:none; }
	ul.footer-nav a:hover, a:focus { color: #0097a0; text-decoration: underline; }

#container5 { clear:left; float:left; width:100%; overflow:hidden; text-align: center; padding-top: 15px; min-width: 1016px;}
#container4 { clear:left; float:left; width:100%; position:relative; right:20%;	background: url(../images/footer/footer_divider.png) right 50% no-repeat; text-align: center; }
#container3 { clear:left; float:left; width:100%; position:relative; right:20%; background: url(../images/footer/footer_divider.png) right 50% no-repeat; center; }
#container2 { clear:left; float:left; width:100%; position:relative; right:20%; background: url(../images/footer/footer_divider.png) right 50% no-repeat; center; }
#container1 { float:left; width:100%; position:relative; right:20%; background:url(../images/footer/footer_divider.png) right 50% no-repeat; text-align: center; }

#col1 {	float:left;	width:20%; position:relative; left:82%; overflow:hidden; text-align: left; }
#col2 {	float:left;	width:16%; position:relative; left:82%; overflow:hidden; text-align: left; }
#col3 {	float:left; width:16%; position:relative; left:86%;	overflow:hidden; text-align: left; }
#col4 {	float:left; width:16%; position:relative; left:90%; overflow:hidden; text-align: left; }
#col5 {	float:left;	width:16%; position:relative; left:94%; overflow:hidden; text-align: left; }


/* Copyright Footer
/*=====================================================*/

#footer-slimline { width: 100%;	height: 75px; border-top: 1px solid #555; border-bottom: 15px solid #0097a0; background: #000 url(../images/footer/slimline-crosshatch-tile.gif) repeat; text-align: center; }
ul.copyright{	text-align: center;	margin-top: 30px; }
	ul.copyright li{ font:10px Arial, Helvetica, sans-serif; color: #cccccc; display: inline; clear: both; margin: 0; vertical-align: top;}
	ul.copyright li img { padding: 0 10px 0 20px; margin-top: -16px;}
	
	ul.copyright li.link { padding: 0 25px 0; }
		ul.copyright li.link a { color: #0097a0; text-decoration: underline; }
		ul.copyright li.link a:hover { color: #fff; }
