/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* ARTICLE - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

/* you will find code for article pages below */

.article { 
	background: #EAF7FB;
	width: 100%;
	margin-bottom: 21px;
	}

.article p, .article-body ul, .article-body ol { 
	color: #231F20;
	font-size: .875em;
	}  
	.article p a, .article-body ul a, .article-body ol a { text-decoration: underline; }	
	.article ul ul, .article ol ol { font-size: 1em; }
	

.article blockquote {
	background: #FFF;
	background: rgba(255,255,255,.8);
	margin: 2em 0;
	padding: 1em 40px;
	}
	.article blockquote p {
		font-size: 1em;
		font-style: italic;
	}	

.article a { color: #231F20; }
.article a:hover { text-decoration: underline; }

.article h1 { 
	font-size: 1.75em;
	line-height: 115%;
	margin: 10px 0 20px;
	} 
	.article h1 a { color: #2BADD8; }  
	.article h1 a:hover { text-decoration: underline; }

.article h2 { 
	font-size: 1.75em;
	line-height: 115%;
	margin: 10px 0 20px;
	} 

	.article h2 a { color: #2BADD8; }  
	.article h2 a:hover { text-decoration: underline; }

.article-body {
	width: 86.0215054%; /* 640/744 */
	padding: 15px 50px 20px 20px;

	}

.article .entry-date { font-size: 12px; font-style: italic; margin-bottom: 21px; }

.article .author { font-size: .875em; }
.article .author a { font-weight: bold; -webkit-font-smoothing: antialiased; }  /* article author */

.article #searchform { font-size: .875em; }

.wp-caption { 
	display: block;
	margin: 15px 0;
	padding:0;
	max-width: 100%;
	height: auto; 
	font-style: italic;
	font-size: 0.75em;
	}
	p.wp-caption-text { margin: 0; padding: 0; }
	.wp-caption p.wp-caption-text em { font-size: 1.25em; }
	dd.wp-caption-dd {
		margin: 0 0 0 0px;
	}

	
.wp-caption.alignleft { margin-right: 2%; }
.wp-caption.alignright { margin-left: 2%; }
 
	.article img { max-width: 100%; height: auto; }
	

/* Best In Show Custom Post Type 
   ---------------------------------------------------------- */
  .single-best-in-show .article-body {
		width: 90%;
		padding: 15px 20px 20px 20px;
		}
.title-box { position: relative; min-height: 240px; overflow: hidden; }
	.employee-img {	
		position: absolute;
		width: 28%;
		height: 100%;
		overflow: hidden;
		}
		.employee-img img { 
			width: auto;
			max-width: none;
			height: 100%;
			}
	.title-box p {
		float: left;
		width: 54%;
		margin: 4% 0 4% 32%;
		color: #FFF;
		font-size: 1.5em;
		font-weight: bold;
		line-height: 1.25em;
		-webkit-font-smoothing: antialiased;
		}
	.title-box .badge {
		position: absolute;
		right: 30px; top: 30px;
		font-weight: bold; font-size: .7em;
		width: 37px; height: 50px;
		background: url('../images/badge.png') left top no-repeat;
		text-align: center;
		padding-top: 12px;
		text-transform: uppercase;
		}
	
   
.emp-info { margin: 3em 0; }
	.emp-info .profile {
		float: left;
		width: 44%;
		margin-right: 5%;
		padding: 3%;
		background: #FFF;
		box-shadow: inset 0 0 10px #BEBEBE;
		text-align: center;
		font-size: 1.25em;
		}
		.emp-info .profile h3 { text-transform: uppercase; margin: .5em 0; }
	.emp-info .links { float: left; width: 45%; }
		.emp-info .links p { margin: 0 0 1em 0; }

.single-best-in-show .related_post_title,
.single-best-in-show .related_post { display: none; }

/* Best In Show Page
   ---------------------------------------------------------- */
.page-template-page-best-in-show-php .article {
	width: 49%;
	margin: 0 2% 2% 0;
	float: left;
	}
	.page-template-page-best-in-show-php .article.beta { margin-right: 0; }

		.page-template-page-best-in-show-php .article .article-body { width: 100%; padding: 0; }
	
	.page-template-page-best-in-show-php .title-box { min-height: 197px; }
	
		.page-template-page-best-in-show-php .employee-img { width: 40%; }
		
		.page-template-page-best-in-show-php .title-box p {
			position: absolute;
			margin: 0;
			left: 42%;
			width: 38%;
			}
			.page-template-page-best-in-show-php .title-box p a {
				display: block;
				color: #FFF;
				text-decoration: none;
				}
				.page-template-page-best-in-show-php .title-box .name { top: 67px; }
				.page-template-page-best-in-show-php .title-box .name a:hover { text-decoration: underline; }
				.page-template-page-best-in-show-php .title-box .brand { 
					bottom: 5px; 
					width: 70px;
					right: 5px; left: auto;
					}
					.page-template-page-best-in-show-php .title-box .brand a {
						text-indent: -99999px;
						background-position: -316px 0;
						width: 70px; height: 50px;
						}
						.page-template-page-best-in-show-php .title-box .brand a:hover { background-position: -316px -50px; }
				
		.page-template-page-best-in-show-php .title-box .badge { top: 16px; right: 24px; }
			.page-template-page-best-in-show-php .title-box .badge .year {
				display: block;
				margin-top: 35px;
				color: #FFF;
				}
/* ---------------------------------------------------------- */

.article .article-footer {
	height: 60px; 
	background: #2BADD8;
	color: white;
	font-size: .75em;
	overflow: hidden;
	}
.article .article-footer a { color: white; }
.article .article-footer ul { margin-top: 20px; padding: 0; }	
.article .article-footer ul li { display: inline; }	
.article .article-footer .brand {
	float: left; 
	margin: 5px 0 0 5px;
	}
	.article .article-footer .brand a {
		display: block;
		width: 75px;
		height: 50px;
		background-image: url('../images/logo-sprite-viacom.png');
		padding-left: 10px;
		background-position: -385px 0;
		text-indent: -99999px;
		}
		.article .article-footer .brand a:hover { background-position: -385px -50px; }
.article .article-footer .business li,
.article .article-footer .categories li {
	margin-left: 10px;
	}
.article .article-footer .business a,
.article .article-footer .categories a {
	color: inherit;
	background: white;
	text-transform: uppercase;
	font-weight: bold;
	padding: 2px 5px;
	-webkit-font-smoothing: antialiased;
	}
	.article .article-footer .business a:hover,
	.article .article-footer .categories a:hover {
		opacity: 0.8;
		text-decoration: none;
		}
.article .article-footer .business {
	float: right;
	}
	.article .article-footer .business a { }
	html.borderradius .article .article-footer .business a, .article .article-footer .business a {
	-moz-border-radius: 10px 10px;  /* FF+ */
	-webkit-border-radius: 10px 10px;  /* Saf3-4 */
	border-radius: 10px 10px;  /* Opera 10.5, IE 9, Saf5, Chrome */
}
.article .article-footer .categories {
	float: right;
	margin-right: 20px;
	}
	.article .article-footer .categories a { }

.article .tags { margin-bottom: 15px; font-size: .875em; }	
	.article .tags a { font-style: italic; }

.article .social { font-size: .875em; clear: both; }

.related-posts {
	width: 116.25%;
	left: -20px;
	position: relative;
	background: #EDEDED;
	margin-top: 20px;
	padding: 10px 0;
	box-shadow: inset 0 0 2px #cccccc;
	font-size: 1.0em; /*14/14*/
	}
	.related-posts h3 { font-size: 1.25em; /*20/14*/ padding-left: 20px; font-weight: normal; }
	.related-posts p { padding-left: 20px; }
	.related-posts ul { list-style-type: none; padding-left: 20px; }
	.related-posts ul li { margin-bottom: 15px; }

.article-body #comments ol { font-size: 1.0em; }

.article #comments label { display: none; }

.article #comments h3 { 
	font-size: 1.25em;
	font-weight: normal;
	}
.article #comments #reply-title { 
	font-size: 1.25em;
	font-weight: normal;
	}
	
	.article #comments ol { 
		list-style-type: none;
		padding-left: 0;
	}
	
	.comment-image { float: left; margin-right: 15px; }
	.comment-meta { float: left; margin-bottom: 15px; font-size: .875em; }
	.comment-meta em { font-size: .75em; }
		.article-body .comment-meta a { text-decoration: none; }
	
	.comment-body { clear: both; margin-top: 15px; margin-bottom: 45px; width: 77.5862069%; }


.article #comments input[type="text"], .article #comments textarea {
	border: 0;
	padding: 10px;
	width: 77.5862069%;
	font-weight: bold;
	-webkit-font-smoothing: antialiased;
	}
.article #comments input[type="submit"] {
	padding: 10px 15px;
	background: #666;
	color: white;
	border: none;
	}
	html.borderradius .article #comments input[type="submit"]	{
		-moz-border-radius: 6px 6px;  /* FF+ */
		-webkit-border-radius: 6px 6px;  /* Saf3-4 */
		border-radius: 6px 6px;  /* Opera 10.5, IE 9, Saf5, Chrome */ 
		}

.feeds .article h3, .contact .article h3 { 
	font-weight: 300;
	-webkit-font-smoothing: subpixel-antialiased;
	font-style: italic;
	}
.article ul.listing {	
	padding-left: 0;
	color: #929292;
	font-size: .75em;
	}
		
.article ul.listing li {
	border-bottom: 2px solid #2BADD8;
	padding: 5px 0;
	list-style-type: none;
}		
.article ul.listing li a {
	text-transform: uppercase;
	text-decoration: none;
	color: #929292;
}
.article ul.listing li span a {
	display: block;
	float: right;
	text-transform: lowercase;
}

/*.article .lens-proto .slide-content { display: none !important; }*/

.article .lens-tool-kit .slidedeck dd {
    background-size: contain !important;
    background-repeat: no-repeat !important;
}

.brands .article {
	width: 24%;
	float: left;
	background: white;
	margin-right: 1.3333333333%;
	}
.brands .article.omega { margin-right: 0; }

.brands .article h2 { margin: 0; }

.brands .article h2 a {
	display: block;
	width: 240px;
	height: 180px;
	background: url('../images/logo-sprite-ex.png') 0 0 no-repeat;
	text-indent: -99999px;
	}
	.brands .article h2 a:hover { opacity: 0.8; }

.brands .article .brand-details {
	width: 100%;
	background: #4D4D4D;
	height: 120px;
	padding-top: 5px;
	position: relative;
	}
	.brand-details p {
		padding: 0 15px;
		color: white;
		font-size: .875em;
		line-height: 1.125em;
		}
	.brand-details .rss { 
		position: absolute;
		left: 15px;
		bottom: 5px;
		}
	.brand-details .url { 
		position: absolute;
		right: 15px;
		bottom: 0;
		}
	.brand-details .url p { 
		font-size: .75em;
		font-style: italic;
		margin: 0; padding: 4px 0 10px 0; }
		
		.brand-details .url p a { text-decoration: none; color: white; }
		.brand-details .url p a:hover { text-decoration: underline; }	

.article a { color: #231F20; }

/**
 * Fixes the spacing after slider gallery strip under the image.
 * Note that some articles will have the opposite effect - you'll see
 * extra spacing after the slider. This is due to editors "fixing" the
 * issue by adding several empty paragraph tags, e.g.
 *
 * <p>&nbsp;</p>
 * <p>&nbsp;</p>
 * <p>&nbsp;</p>
 *
 * If you see this, just fix the content. Don't fix this style.
 */
.slidedeck-frame.slidedeck_frame {
	margin-bottom: 100px;
}