/* ---------------------------------------------------------------------
Original Author: Anthony Ticknor
Contributors: 

Target Browsers: All
Media Type: Screen

CSS Coding Standards Documentation: http://wiki.bravo/index.php/CSS_Coding_Standards 
------------------------------------------------------------------------ */

body {
	background:#2c3138;
}

#wrapper {
	width:959px;
	margin:0 auto;
}

a {
	cursor:pointer;
}

/* ---------------------------------------------------------------------
Header
------------------------------------------------------------------------ */
#header {
	width:100%;
	height:70px;
	padding:8px 0 3px 0;
	font:16px/16px Arial, Helvetica, sans-serif;
	color:#e1e1e1;
}

#header h1 {
	float:left;
	width:259px;
}

#header h1 a {
	width:230px;
	height:70px;
	display:block;
	background:url(../images/design/logo_clearfield.png) no-repeat;
	text-indent:-9999px;
}

#header h2 {
	width:698px;
	padding:30px 2px 0 0;
	float:right;
	text-align:right;
	text-transform:uppercase;
	font-weight:normal;
}

/* ---------------------------------------------------------------------
Navigation
------------------------------------------------------------------------ */
#nav {
	width:100%;
	height:19px;
	font:10px/19px Arial, Helvetica, sans-serif;
}

#nav ul {
	background:url(../images/design/bg_nav.gif) no-repeat;
	height:19px;
}

#nav ul li {
	float:left;
	background:url(../images/design/bg_nav_divider.gif) no-repeat top left;
	padding:0 0 0 3px;
}

#nav ul li.blog {
	background:none;
	padding:0;
}

#nav ul li a {
	height:19px;
	float:left;
	display:block;
	color:#fff;
	text-decoration:none;
	text-transform:uppercase;
	text-align:center;
}

#nav ul li.blog a { width:142px; } 
#nav ul li.white_papers a { width:165px; } 
#nav ul li.product_highlights a { width:166px; } 
#nav ul li.connect a { width:165px; } 
#nav ul li.customer_testimonials a { width:165px; } 
#nav ul li.about a { width:141px; } 

/* ---------------------------------------------------------------------
Content
------------------------------------------------------------------------ */
#content {
	font:12px/14px Arial, Helvetica, sans-serif;
}

#content #columns {
	background:url(../images/design/bg_two_column.gif) no-repeat #f8f8f8;
}

#content .main_col {
	width:816px;
	float:right;
	/* background:#f8f8f8; */
	background-color:#FFF;
	color:#000;
}

#content .sub_col {
	width:107px;
	float:right;
	padding:42px 18px 2px 18px;
	color:#fff;
	font-size:10px;
}

#content .sub_col h2 {
	font-size:18px;
	text-transform:uppercase;
	margin:0 0 40px 0;
	color:#acacac;
}

#content .sub_col h2.has_links {
	margin:0 0 8px 0;
}

#content .sub_col h2 span {
	display:block;
}

#content ul.external_links {
	list-style:none;
	margin:0 0 28px 0;
}

#content ul.external_links li {
	float:left;
	width:32px;
	margin:0;
}

#content .sub_col h5 {
	text-transform:uppercase;
}

#content p, #content ul, #content h2,
#content h3, #content h4, #content h5,
#content h6 {
	margin:0 0 1em 0;
}

#content ul {
	list-style:disc;
}

#content ul li {
	margin:0 0 0 20px;
}

#content .interior_pad {
	padding:40px 90px;
	position:relative;
}

/* ---------------------------------------------------------------------
Footer
------------------------------------------------------------------------ */
#footer {
	clear:both;
	width:959px;
	padding:0 0 8px 0;
	font:11px/14px Arial, Helvetica, sans-serif;
	color:#fff;
}

#footer a {
	color:#eee;
	text-decoration:underline;
}

#footer h5 {
	float:right;
	text-indent:-9999px;
	width:85px;
	height:83px;
	background:url(../images/design/logo_stacked.png) no-repeat;
}

#footer ul {
	float:right;
	list-style:none;
	padding:20px 10px 0 0;
}

#footer ul li {
	text-align:right;
	margin:0 0 6px 0;
}

/* ---------------------------------------------------------------------
Home
------------------------------------------------------------------------ */
#home {
	color:#eee;
}

#home a {
	color:#eee;
	text-decoration:underline;
}

/* ---------------------------------------------------------------------
Home - Subheader
------------------------------------------------------------------------ */
#home #subheader {
	background:#1b1e23;
	font-size:11px;
}

/*#home #subheader .dummy_controls {
	display: none;
}*/

#home #subheader_bar .video_thumb_container {
	height: 46px;
	float: left;
}

#home #subheader_bar .video_thumb_container h5 {
	float: left;
	font-size:10px;
    line-height:46px;
    font-weight: normal;
    text-transform:uppercase;
    background:url(../images/design/arrow_home.png) no-repeat right center;
    text-align: right;
	padding:0 16px 0 0;
	margin: 0;
}

#home #subheader_bar .video_thumb_links {
	float: left;
	display: inline;
	margin-left: 10px;
}

#home #subheader_bar .video_thumb_links a {
	float: left;
    display: inline;
    position: relative;
}

#home #subheader_bar .video_thumb_links a span {
	position: absolute;
	z-index: -1;
	background:url(../images/design/overlay.png) no-repeat right center;
}

#home #subheader_bar .video_thumb_links a.active span {
	z-index: 5;
}

#home #subheader_bar .dummy_video_thumb_links {
	display: none;
}

#home #subheader_bar .video_thumb_links a span,
#home #subheader_bar .video_thumb_links img {
	width: 93px;
	height: 47px;
}

#home #subheader .images {
	float:left;
	width:670px;
}

#home #subheader .welcome {
	float:left;
	width:289px;
	line-height:1.4em;
}

#home #subheader .welcome p.watch {
	margin:0;
	text-align:left;
}

#home #subheader .welcome p.watch a {
	display:block;
	text-transform:uppercase;
	text-decoration:none;
	padding:0 0 0 16px;
	font-size:10px;
	line-height:1em;
	background:url(../images/design/arrow_home.png) no-repeat left center;
}

#home #subheader .welcome #base h2 {
	font-size:20px;
	margin:10px 0 6px 0;
}

#home #subheader .welcome #base p.more {
	margin:0;
	text-align:right;
}

#home #subheader .welcome #base p.more a {
	display:block;
	text-transform:uppercase;
	text-decoration:none;
	padding:0 16px 0 0;
	font-size:10px;
	line-height:1em;
	background:url(../images/design/arrow_home.png) no-repeat right center;
}

#home #subheader .welcome .preview {
	display:none;
	height:318px;
	background:url(../images/design/bg_preview.jpg) no-repeat #0f3058;
}

#home #subheader .welcome #base.preview {
	padding:18px;
	height:282px;
	background:none;
}

#home #subheader .welcome .preview blockquote {
	padding:18px;
	margin:0;
	font-size:14px;
	line-height:18px;
}

#home #subheader .welcome .preview blockquote h5 {
	padding:10px 0 0 0;
	font-weight:bold;
	font-size:12px;
	line-height:1.2em;
}

#home #subheader .welcome .selected {
	display:block;
}

#home #subheader_bar {
	height:47px;
	background:url(../images/design/bg_subheader_bar.jpg) repeat-x;
}

#home #subheader_bar .links {
	float:left;
	width:638px;
	padding:0 16px;
	position: relative;
}

#home #subheader_bar .links a {
	display:block;
	text-decoration:none;
	text-transform:uppercase;
	font-size:10px;
	line-height:46px;
}

#home #subheader_bar .links a.contact {
	float:left;
	background:url(../images/design/arrow_home.png) no-repeat left center;
	padding:0 0 0 16px;
}

#home #subheader_bar .links a.stories {
	background:url(../images/design/arrow_home.png) no-repeat right center;
	padding:0 16px 0 0;
	float:right;
	text-align:right;
}

#home #subheader_bar .our_stories {
	float:left;
	width:289px;
	height:47px;
}

#home #subheader_bar .our_stories ul {
	list-style:none;
	margin:0;
}

#home #subheader_bar .our_stories ul li {
	margin:0;
	float:left;
}

#home #subheader_bar .our_stories ul li img {
	height:47px;
}

/* ---------------------------------------------------------------------
Home - Column Guts
------------------------------------------------------------------------ */
#home #home_columns {
	clear:both;
	padding:7px 0 0 0;
}

#home #home_columns .blog {
	float:left;
	width:368px;
	min-height:300px;
	background:url(../images/design/bg_blog_preview.png) repeat-x;
	position:relative;
}

#home #home_columns .blog h2 {
	height:13px;
	font-size:12px;
	line-height:1em;
	padding:8px 19px;
	color:#fff;
	text-transform:uppercase;
	background:url(../images/design/bg_h2_home_subcol.jpg) repeat-x;
}


#home #home_columns .blog h3 {
	padding:23px 19px 15px 19px;
	line-height:1em;
	margin:0;
	text-transform:uppercase;
	font-size:20px;
	border-bottom:1px solid #01b5e0;
}

#home #home_columns .blog h3 a {
	text-decoration:none;
}

#home #home_columns .blog ul.external_links {
	position:absolute;
	top:63px;
	right:3px;
}

#home #home_columns .blog .blog_preview {
	padding:19px;
	font-size:11px;
}

#home #home_columns .blog .blog_preview h4,
#home #home_columns .blog .blog_preview h4 a {
	color:#b7b7b7;
	font-size:14px;
	font-weight:normal;
	text-decoration:none;
}

#home #home_columns .blog .blog_preview p.blog_post_details {
	color:#898989;
	font-size:10px;
	margin:0;
}

#home #home_columns .blog .blog_preview a.more {
	text-transform:lowercase;
	text-decoration:underline;
}

#home #home_columns .info {
	float:left;
	padding:0px 19px 19px 19px;
	width:264px;
	font-size:12px;
	color:#ccc;
}

#home #home_columns .info h2 {
	height:13px;
	font-size:12px;
	line-height:1em;
	padding:8px 10px;
	color:#fff;
	text-transform:uppercase;
	background:url(../images/design/bg_h2_home_subcol.jpg) repeat-x;
}

#home #home_columns .info_preview {
	padding:20px 0 0 0;
	border-top:1px solid #595c60;
}

#home #home_columns .info_preview.first {
	padding:0 0 8px 0;
	border:none;
}

#home #home_columns .info h4,
#home #home_columns .info h4 a {
	text-transform:uppercase;
	color:#e1e1e1;
	text-decoration:none;
}

#home #home_columns .info a.more {
	text-transform:lowercase;
	text-decoration:underline;
}

#home #home_columns .info p.download {
	margin:0 0 16px 0;
}

#home #home_columns .info p.download a {
	color:#e1e1e1;
	font-size:10px;
	text-transform:uppercase;
	text-decoration:none;
	display:block;
	height:25px;
	padding:8px 0 4px 54px;
	background:url(../images/design/icon_download_dark.gif) no-repeat;
}

#home #home_columns .friend_connect {
	float:left;
	width:289px;
	background-color: #070D14;
	height: 260px;
}

#home #home_columns .friend_connect h3 {
	background:url(../images/design/bg_connect.jpg) no-repeat;
	height:63px;
	width:289px;
	margin:0;
	padding:0;
}

#home #home_columns .friend_connect h3 a {
	display:block;
	height:40px;
	padding:23px 0 0 76px;
	margin:0;
	font-size:20px;
	line-height:1em;
	text-decoration:none;
}

#home #home_columns .friend_connect h4 {
	height:20px;
	font-size:12px;
	line-height:1em;
	text-transform:uppercase;
	padding:10px 0 0 18px;
	margin:0;
	background:url(../images/design/bg_connect_tagline.jpg) repeat-x;
}

#home #home_columns .friend_connect #widget {
	background:#070d14;
	color:#fff;
	padding:18px;
	min-height:244px;
}

/* ---------------------------------------------------------------------
Products
------------------------------------------------------------------------ */
#content .sub_col a.products {
	display: block;
	margin-bottom: 1em;
	color: #fff;
	text-decoration: none;
}

#content .sub_col a.products:hover {
	text-decoration: underline;
}

.products_details a {
	color:#34b6e4;
	text-decoration:none;
	font-weight:bold;
}

.product_details h3 {
	font-size:18px;
	color:#0079c1;
}

.product_details h4 {
	font-weight:bold;
	font-size:18px;
	color:#b7b7b7;
}

.product_details p.learn_more {
	margin:0;
	position:absolute;
	top:54px;
	right:90px;
}

.product_details p.learn_more a {
	display:block;
	text-transform:uppercase;
	text-decoration:none;
	color:#0079c1;
	font-size:10px;
	padding:0 20px 0 0;
	background:url(../images/design/arrow_learn_more.gif) no-repeat right center;
}

/* ---------------------------------------------------------------------
About
------------------------------------------------------------------------ */
.about_details a {
	color:#34b6e4;
	text-decoration:none;
	font-weight:bold;
}

.about_details h3 {
	font-size:30px;
	color:#0079c1;
}

.about_details h4 {
	font-weight:bold;
	font-size:18px;
	color:#b7b7b7;
}

/* ---------------------------------------------------------------------
Our Stories
------------------------------------------------------------------------ */
#testimonial-container {
	position:relative;
	background-color:#000;
}

.testimonial_wrapper {
	color:#fff;
	font-size:14px;
	float: left;
	width: 33%;
	height:130px;
	/* background:url(../images/design/bg_testimonial.jpg) no-repeat; */
	overflow:auto;
}

.video {
	clear: both;
	width: 100%;
	height:319px;
	background:#000;
}
.video_container {
	margin-left: auto;
	margin-right: auto;
	width: 567px;
}
.testimonial_wrapper .testimonial_details {
	padding:10px;
	color:#000;
	/*
	float:left;
	padding:20px;
	position:relative;
	*/
}

.testimonial_details .photo {
	float:left;
	width:72px;
}

.testimonial_details .company {
	float:right;
	margin-left: 10px;
	/*
	position:absolute;
	left:106px;
	top:60px;
	
	clear:both;
	*/
}

.testimonial_details .company h3 {
	font-weight:normal;
	margin:0 0 4px 0 !important;
}

.testimonial_details .company h4 {
	font-weight:normal;
	font-size:12px;
	margin:0 !important;
	width: 130px;
}

.testimonial_details blockquote {
	clear:both;
	line-height:1.3em;
	padding:40px 0 0 0;
	margin:0;
	float:left;
	width:352px;
}


/* ---------------------------------------------------------------------
Blog
------------------------------------------------------------------------ */
.blog_post {
	position:relative;
	padding:20px 0 0 0;
	margin:24px 0 0 0;
	border-top:1px solid #34b6e4;
}

.blog_post.first {
	padding:0;
	margin:0;
	border:none;
}

.blog_post a,
#blog_comments a {
	color:#34b6e4;
	text-decoration:none;
	font-weight:bold;
}

.blog_post h3.blog_post_title,
.blog_post h3.blog_post_title a {
	font-size:18px;
	color:#0079c1;
}

.blog_post p.share {
	position:absolute;
	top:20px;
	right:0px;
}

.blog_post.first p.share {
	top:0px;
}

.blog_post p.blog_post_details {
	margin:0px;
	color:#959595;
	font-size:10px;
	font-weight:bold;
}

#blog_comments {
	padding:20px 0 0 0;
	margin:24px 0 0 0;
	
}

#blog_comments h4 {
	font-size:18px;
	color:#0079c1;
}

#blog_comments .comment_wrapper {
	border-top:1px solid #b7b7b7;
	padding:12px 0 0 0;
	margin:0 0 12px 0;
}

#blog_comments p.comment_details,
#blog_comments p.comment_details a {
	color:#959595;
	font-size:10px;
	font-weight:bold;
}

#blog_comment_form {
	padding:20px 0 0 0;
	margin:24px 0 0 0;
}

#blog_comment_form h4 {
	font-size:18px;
	color:#0079c1;
	margin:0;
}

#blog_comment_form label {
	display:block;
	padding:12px 0 4px 0;
}

#blog_comment_form input,
#blog_comment_form textarea {
	width:98%;
	padding:2px;
	margin:0;
	font:11px/14px Arial, Helvetica, sans-serif;
}

#blog_comment_form input#submit {
	width:100px;
	margin:12px 0 0 0;
}

/* ---------------------------------------------------------------------
White Papers
------------------------------------------------------------------------ */
.white_paper {
	position:relative;
	padding:20px 0 0 0;
	margin:24px 0 0 0;
	border-top:1px solid #34b6e4;
}

.white_paper.first {
	padding:0;
	margin:0;
	border:none;
}

.white_paper a {
	color:#34b6e4;
	text-decoration:none;
	font-weight:bold;
}

.white_paper h3.white_paper_title,
.white_paper h3.white_paper_title a {
	font-size:18px;
	color:#0079c1;
}

.white_paper p.white_paper_details {
	margin:0 0 6px 0;
	color:#959595;
	font-size:10px;
	font-weight:bold;
}

.white_paper span.label {
	text-transform:uppercase;
	font-weight:bold;
}

.white_paper p.download {
	color:#b7b7b7;
	font-size:10px;
}

.white_paper p.download a {
	display:-moz-inline-stack;
	display:inline-block;
	height:25px;
	padding:12px 0 0 54px;
	background:url(../images/design/icon_download_light.gif) no-repeat;
	font-weight:bold;
	text-transform:uppercase;
}

/* ---------------------------------------------------------------------
User Submission Thank You
------------------------------------------------------------------------ */
.thanks a {
	color:#34b6e4;
	text-decoration:none;
	font-weight:bold;
}

/* ---------------------------------------------------------------------
Common Classes
------------------------------------------------------------------------ */
.clearfix:after {content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;}
.clearfix {display: inline-block;}

.horiz_shadow {
	height:29px;
	margin:0 0 2px 0;
	clear:both;
	background:url(../images/design/shadow_horizontal.png) no-repeat;
}

.horiz_rule {
	clear:both;
	height:2px;
	line-height:1px;
	font-size:1px;
	background:url(../images/design/rule_horizontal.gif) repeat-x;
}

/* ---------------------------------------------------------------------
Friend Connect
------------------------------------------------------------------------ */
.fc-container {
	width:636px;
	margin:12px auto;
}

.canvas-gadget {
	width:636px;
	margin:12px;
}

#clearfield-logos {
	margin-top: 8px;
}

#clearfield-logos img {
	border: none;
}
#clearfield-logos a {
	margin-left: 7px;
}
#clearfield-logos p {
	margin-left: 7px;
	margin-right: 25px;
	margin-top: 10px;
	margin-bottom: 10px;
}
#connect-left-column {
	width: 360px;
	float:left;
	padding-left: 20px;
	padding-top: 20px;
	padding-bottom: 100px;
	padding-right: 30px;
	/*
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #333;
	*/
}
#connect-left-column img {
	margin-bottom: 20px;
}
#connect-right-column {
	width: 360px;
	float: right;
	padding-right: 20px;
	padding-top: 20px;
}
#connect-right-column img {
	margin-bottom: 20px;
}
#connect-left-column a, #connect-right-column a{
	color:#000;
	font-size: 14px;
	text-decoration:none;
}