body {
	margin: 30px 0; 
	font: 12px/1.5em Arial, Helvetica, sans-serif;
	color:#363636;
}

/* Typography and Links
----------------------------------------------------------------------------------------------------*/
h1, h2, h3, h4, h5, h6 {font-weight: bold;}
h1 {font-size: 218%; font-family:Cambria, serif;}
h1 em {font-style: italic; font-size: 164%;}
h2 {font-size: 164%; margin-bottom:20px; color: #28487c;}
h3 {font-size: 140%; color: #28487c;}

.fancy{
	padding:8px 17px; 
	display:block;
	margin-bottom: 25px;
	background: #eaeaeb url(../media/images/heading_bg.gif) top left repeat-x;
	
}

h4 {font-size: 118%; color: #28487c;}
h5 {font-size: 118%; font-weight:normal; color: #636363; margin-bottom:20px}
h6 {font-size: 118%;}

p {margin-bottom: 10px;}

sup {vertical-align:text-top; font-size:65%;}

small {font-size: 11px; color: #666;}

a:link, a:visited {	color: #28487c; text-decoration: none; font-weight: bold;}
a:hover {color: #28487c; text-decoration: underline;}

/* Lists
----------------------------------------------------------------------------------------------------*/
ul {margin:0 0 20px 20px; list-style: disc;}
ul.arrows {
	margin:0 0 20px 10px; 
	font-weight: normal;
	list-style-image:url(../media/images/blue_arrow.gif);
	list-style-type:square;
	list-style-position:inside;
}

ul.arrows li {margin: 10px 0;}

ol {
	list-style: decimal;
	margin: 0 0 20px 20px;
	}

/* Global Classes
----------------------------------------------------------------------------------------------------*/
.rounded {background-color: #dedede; padding:1px; }
.rounded_footer {}
.rounded_top {}

.icon {vertical-align:middle; padding-right:5px}
img {margin:0 5px 5px 0;}

.content-space {background-color:#fff;padding:3px}
.container {background:#fff;}

/* Header
----------------------------------------------------------------------------------------------------*/
#header {margin-bottom: 10px;}
#header h1, #header h1 a {width: 258px; height: 78px;
	text-indent: -9999px;
	background: url(../media/images/OCDM_Logo.gif) top left no-repeat;
}


/* Top Links
----------------------------------------------------------------------------------------------------*/
#top_links ul {text-align: right;}
#top_links li {display: inline;	list-style-type: none; padding-left: 15px;}
#top_links li a {color:#666; text-decoration:none;}
#top_links li a:hover {	text-decoration:underline;	}
#top_links .selected {	color: #862141; }

/* Navigation
----------------------------------------------------------------------------------------------------*/

#nav {margin-top: 20px;}
#nav ul {margin: 0; padding:0;list-style-type:none;}
#nav li {display: block; float:right; list-style-type: none; padding: 0; margin:0 0 0 10px; }
#nav li a {	display:block;text-decoration:none;padding: 0px 10px; line-height:27px; height:27px; overflow:hidden;	}
#nav li a.rnd:hover, #nav li a.expand:hover,  #nav li a.active {	background-color:#ebebeb;}
#nav .selected {color: #862141; }
#nav a.expand { background: url(../media/images/nav_arrow.gif) 65px 9px no-repeat;	padding-right: 20px;}
#nav #li-services a.selected { background-image: url(../media/images/nav_arrow_red.png); background-position: 65px 9px no-repeat;}

#subnav {display:none;font-weight:normal;font-size:11px;margin:0px;}
#subnav .prefix_5 {margin-right:40px;}
#subnav .prefix_5 a {	color:#555;	}
#subnav .prefix_5 a:hover, #subnav .prefix_5 a.selected {color:#862141;text-decoration:none;	}
#subnav .prefix_5 ul{	text-align:right;margin:0;	}
#subnav .prefix_5 li {float:right;background-color:#ebebeb;list-style-type:none;display:block;height:26px;line-height:26px;padding:0 10px;margin:0;overflow:hidden;}
#subnav li.first {background: #ebebeb url(../media/images/subnav_left.png) top left no-repeat; }
#subnav li.last {background: #ebebeb url(../media/images/subnav_right.png) top right no-repeat; }

#nav-hidden {margin-right:23px;}
#nav-hidden ul {text-align: right;	margin: 0; padding:0;}
#nav-hidden li { color:#fff; font-size:12px; height:5px; overflow:hidden; line-height:5px; font-weight: bold;display: block;float:right;list-style-type: none; padding: 0px 10px; margin:0 0 0 10px;}
#nav-hidden .services {color: #ebebeb; background-color:#ebebeb;padding-right:20px;}
	


/* News Column
----------------------------------------------------------------------------------------------------*/
#news {height:350px;  background: #fff url(../media/images/news.gif) 15px 50% no-repeat;}
#news h3 {
	padding:8px 20px; 
	display:block;
	margin-bottom: 20px;
	background: #eaeaeb url(../media/images/heading_bg.gif) top left repeat-x;
	color: #28487c;
}
#news p, #news h4, #news small{
	padding-right:20px; padding-left:220px;
}
#news h4 {font-size:13px}
a.continue, a.continue:hover {font-weight:normal;}
#more-news {position:absolute; right:20px; bottom:20px;}
#more-news a, #more-news a:hover {color:#666}


/* Resources Column
----------------------------------------------------------------------------------------------------*/
#resources {height:350px; }
#resources h3 {
	color: #862141;
	display:block;
	padding:8px 20px; 
	background: #eaeaeb url(../media/images/heading_bg.gif) top left repeat-x
}
#resources ul  {background-color: #ebebeb; border-top:5px solid #fff; list-style-image:none; list-style-type:none; margin:0; list-style-position:outside;}
#resources ul li {font-size: 13px; color: #28487c; font-weight:bold; margin:0; padding:0}

#resources ul li em {
	color: #363636; 
	font-weight:normal; 
	display:block; 
	padding:0 10px 10px 0; 
	font-size:95%; 
	margin:0; 
	border-bottom: 1px solid #c0c0c0; 
	font-style:normal;
}

#resources ul li a {display: block; text-decoration: none; padding:0; margin:0;}
#resources .resource_link {
	padding:10px 30px 0 20px; 
	background: url(../media/images/right_sidebar_arrow.gif) 320px center no-repeat
}

#resources ul li a:hover {background-color:#f5f5f5;}

#sample_kit {padding:20px 10px 0 20px;background: #ebebeb;}
#sample_kit a:hover {text-decoration:none;}


/* Contact
----------------------------------------------------------------------------------------------------*/
#contact_info, #contact_form {}

form {padding: 0 15px; margin:0;}
input, textarea { font-family: Arial, Sans-Serif; font-size: 13px; margin-bottom: 5px; padding: 4px 0; border: solid 1px #c9c9c9; background-color: #f2f2f2;} 
input.checkbox {margin:0;padding:0;border:0;background-color: #fff;}
input:focus, textarea:focus {    background-image: none; background-color: #ffffff; border: solid 1px #c9c9c9;}
input.reset {float: left; color:#555; font-weight:bold; margin:0 display:block; width:100px; padding: 4px 0;}
input.submit {float:right; color:#862241; font-weight:bold; width:100px; padding: 4px 0;}
textarea {height:100px}

label span {width: 75px; display:inline-block;padding:8px 0;line-height:1em;}
label strong {font-weight:bold;}

.xlarge {width: 315px;}
.large {width: 235px;}
select.large {width: 235px;}
.medium {width: 115px}
.small {width:40px}
.xsmall {width:30px}

form small {display:inline-block;color: #7c7c7c;}
form small.label {display:inline-block; width: 35px; padding-left:80px; color: #7c7c7c;}

fieldset {margin-bottom: 10px}


/* Contact & Quote overlay */

#responsebox {display:none;	width:400px;}
#responsebox div {	padding:20px; border:1px solid #dedede;	background-color:#fff;}




/* Case Study
----------------------------------------------------------------------------------------------------*/
.case h2 {font-family:serif; margin-bottom:5px; font-size: 190%; color:#2f4b7b;font-weight:normal;margin-top:20px}
.case h4 {font-family:serif; margin-bottom:10px; font-size:140%; color:#333; letter-spacing:1px; font-weight: normal; }
.case .grid_11 img {padding:12px; background: url(../media/images/img_bg.gif) top left no-repeat; width:262px; height:182px; margin-top:15px}
.case img.title {margin:20px 0 0 0;display:block;}

.enlarge a{display:block; text-align:right; padding-right:18px; font-weight:normal; font-size: 90%}
.more {	background: url(../media/images/blue_arrow.gif) right center no-repeat; display:block; text-align:right; padding-right: 10px}

#case_nav { background: url(../media/images/case_nav_bg.gif) top left no-repeat; margin-top:15px}
#case_nav p {width:145px; margin: 15px 10px 50px 15px ; padding:0; color:#28487c; line-height:200%;}


.case .panel1, .case .panel2, .case .panel3, .case .panel4, .case .panel5 {display: none;}

.case .btn-slide1, .case .btn-slide2, .case .btn-slide3, .case .btn-slide4, .case .btn-slide5 {
	background: url(images/white-arrow.gif) no-repeat right -50px;
	text-align: right;
	padding: 0;
	margin: 0 auto;
	text-decoration: none;
}
.case .active {	background-position: right 12px;}
.case .more .wless {display:none;}


/* Footer
----------------------------------------------------------------------------------------------------*/
#footer {
	background-color:#dedede;
	text-align:center;
	padding: 20px 0 10px 0;
	margin-top: 22px;
	color: #666;
	font-size: 11px;
	line-height: 2em;
}
#footer ul {margin:0;}

#footer li {
	display: inline;
	list-style-type: none; 
	border-left: 1px solid #666;
	padding: 0 15px;
}

#footer li#first {
	border: none;
}


/* Overlay 
----------------------------------------------------------------------------------------------------*/
/* the overlayed element */
.apple_overlay {
	
	/* initially overlay is hidden */
	display:none;
	
	/* growing background image */
	background-image:url(../media/images/white.png);
	
	/* 
		width after the growing animation finishes
		height is automatically calculated
	*/
	width:640px;		
	
	/* some padding to layout nested elements nicely  */
	padding:35px;

	/* a little styling */	
	font-size:11px;
}

/* default close button positioned on upper right corner */
.apple_overlay div.close {
	background-image:url(../media/images/close.png);
	position:absolute; right:5px; top:5px;
	cursor:pointer;
	height:35px;
	width:35px;
}

.apple_overlay img {
	border:1px solid #949494;
	}
.apple_overlay .details p {
	line-height:140%;
	}

/* Rotator 
----------------------------------------------------------------------------------------------------*/
#slideshow {width:1016px; margin: 0 auto;position:relative;}

/* container for slides */
.images {
	background: url(../media/images/home_rotator_bg.png) top center no-repeat;
	position:relative;	
	height:360px;
	width:1016px;
	float:left;	
	cursor:pointer;
}

/* single slide */
.images div {
	display:none;
	position:absolute;
	top:3px;
	left:10px;		
}

/* header */
.images h3 {
	font-size:22px;
	font-weight:normal;
	margin:0 0 20px 0;
	color:#456;
}

/* tabs (those little circles below slides) */
.tabs {
	clear:both;
	position:absolute;
	left:50%;
	top: 290px;
	margin-left: -80px;
	z-index:100;
}

/* single tab */
.tabs a {
	width:19px;
	height:19px;
	line-height:19px;
	float:left;
	margin:3px;
	background:url(/media/images/slideshow_btn.png) 0 0 no-repeat;
	display:block;
	font-size:12px;	
	color:#636363;
	text-decoration:none;
	text-align:center;
}

/* mouseover state */
.tabs a:hover {
	background-position:0 -19px;      
}

/* active state (current page state) */
.tabs a.current {
	background-position:0 -19px;     
} 	


#controls {
	position:absolute;
	left:50%;
	top:290px;
	margin-top:3px;
	margin-left:-102px;
	z-index:101;
	width:19px;
	height:19px;
	
	}

/* disabled navigational button. is not needed when tabs are configured with rotate: true */
.disabled {
	visibility:hidden !important;		
}


