/*
Theme Name: HSPH MPH Site
Theme URI: http://hsph.harvard.edu
Description: Child theme for the HSPH theme that adds functionality for the mph site including a carousel
Author: dmarshal/hsphwebteam
Author URI: http://hsph.harvard.edu
Template: hsph
Version: 2.0
Tags: one-column, two-columns, right-sidebar, responsive-layout, custom-menu, editor-style, featured-images, full-width-template
Text Domain: hsph_mph
*/

/*=Header and navigation Styles 
=======================================================*/
.mph-homepage .site-content a {
	text-decoration: none;
	color: #008CC0;
}

#event-header {
	overflow: hidden;
	margin: 20px auto;
	clear: both;
}

.mph-homepage #breadcrumbs {
	margin-bottom: 5px;
}

#event-title-block {
	width: auto;
	display: block;
}

#event-title-block h1 {
	font-size: 28px;
	line-height: 34px;
	color: #000;
	margin: 0 0 7px;
	font-weight: normal;
	font-family: Georgia, 'Times New Roman', serif;
}

.event-title-smaller {
	font-size: 22px;
	line-height: 28px;
}

.event-header {
	text-align: center;
}

#event-home-body-columns article .entry-content {
	font: Helvetica, Arial, sans-serif;
	font-size: 18px;
	line-height: 32px;
	padding: 0px 10px 0 10px;
	margin-bottom: 0;
}

#event-home-body-columns .event-columns.entry-content p {
	line-height: 1.5;
	margin-bottom: 10px;
}

#event-home-body-columns .event-columns.entry-content li {
	line-height: 1.5;
	list-style-type: none;
	margin: 0;
	margin-bottom: 10px;
}


#event-home-body-columns .hentry {
	padding-bottom: 0;
}

.event-columns {
	font:14px Arial, Helvetica, sans-serif;
	list-style: none outside none;
	margin: 0;
	overflow: hidden;
	padding: 0;
	float: none;
	margin-top: 30px;
}

.event-columns .column {
	display: block;
	float: left;
	margin: 0px;
	padding: 0;
	line-height: 1.6em;
	word-wrap: break-word;
}

.event-columns .column .event-block {
	word-wrap: break-word;
	border-top: 3px solid #D1CDC6;
	margin: 0 0 28px;
	padding: 14px 0;
	overflow: hidden;
	clear: both;
}

.event-columns .column .event-block h2 {
	color: #010000;
	font-size: 20px;
	line-height: 22px;
	font: Helvetica, Arial, sans-serif;
	margin: 0 0 11px;
	width: 100%;
}

.event-home-body-columns .entry-content,
.wf-active .event-columns .column .event-block h2 {
	font-family: 'proxima-nova', Helvetica, Arial, sans-serif;
}

@media screen and (min-width: 600px) {
	.mph-homepage #main {
		padding: 0 20px;
	}
}

@media screen and (max-width: 729px) {
	/* =event and Multimedia navigation menus
	-------------------------------------------------------------- */
	.mph-homepage .menu-toggle {
		display: block;
	}
	
	#event-navigation-container {
		display: block;
	}
	
	#event-navigation-container .menu-toggle {
		background-color: transparent;
		border-bottom: 4px solid #947D8D;
	}
	
	#event-navigation div:last-child {
		display: none;
	}

	#event-navigation div.toggled-on {
		display: block;
		border-bottom: 4px solid #947D8D;
	}
	
	#event-navigation div.toggled-on:first-child {
		border-bottom: none;
	}

	.event-navigation li {
		font-size: 14px;
		font-size: 1rem;
		line-height: 19px;
		line-height: 1.35714285714286;
	}
	.event-navigation ul {
		margin: 0;
		text-indent: 0;
	}
	.event-navigation li a,
	.event-navigation li {
		display: block;
		text-decoration: none;
	}
	.event-navigation li a {
		font-size: 14px;
		font-size: 1rem;
		line-height: 19px;
		line-height: 1.35714285714286;
		font-family: Georgia, 'Times New Roman', Times, serif;
		padding: 10px 10px 8px 10px;
		text-decoration: none;
		display: block;
		border-bottom: 1px solid #C1C3B1;
	}
}

@media screen and (min-width: 730px) {	
	#event-title-block h1 {
		line-height: 44px;
	}
	
	#event-title-block {
		width: 58%;
		float: left;
		display: inline-block;
		vertical-align: top;
		overflow: hidden;
	}
	
	#event-navigation-container {
		width: 39%;
		display: inline-block;
		vertical-align: top;
		overflow: hidden;
		border-bottom: 5px solid #947D8D;
		float: right;
		padding-bottom: 21px;
		padding-bottom: 1.5rem;
	}

	#event-navigation ul {
	}

	#event-navigation ul li {
		float: left;
		width: 48%;
		display: block;
		margin: 0 5px 4px 0;
		font-family: Helvetica, Arial, sans-serif;
		font-size: 14px;
		line-height: 25px;
	}
	.event-columns .column .event-block {
		overflow: visible;
		clear: none;
	}
	
	.event-columns .column {
		width: 48%;
		margin-right: 3%;
	}
	.event-columns .column:nth-child(even) {
		margin-right: 0px;
	}
}

@media screen and (min-width: 750px) {
	#event-title-block h1 {
		font-size: 32px;
	}
}

@media screen and (min-width: 800px) {
	#event-title-block {
		width: 48%;
	}
	
	#event-navigation-container {
		width: 48%;
	}

	#event-navigation ul li {
		margin-bottom: 0;
	}
}

@media screen and (min-width: 830px) {
	#event-home-body-columns article .entry-content {
		font-size: 23px;
	}
}

@media screen and (min-width: 850px) {
	#event-navigation ul li {
		width: 32%;
	}
	#event-title-block h1 {
		font-size: 36px;
	}
	.event-columns .column {
		width: 23.5%;
		margin-right: 2%;
	}
	.event-columns .column:nth-child(even) {
		margin-right: 2%;
	}

	.event-columns .column:last-child {
		margin-right: 0px;
	}

}

@media screen and (min-width: 1024px) {
	.mph-homepage #main {
		padding: 0;
	}
	#event-title-block h1 {
		font-size: 38px;
	}
	
}


/* Carousel styles 
=============================================*/

.mph-homepage #carousel-main-container {
	position: relative;
}

.mph-homepage #carousel-main-container .carousel-slide .carousel-slide-text {
	position: absolute;
	right: 0;
	width: 50%;
	top: 10%;
	color: #FFF;
	line-height: 34px;
	background-color: rgba(0, 0, 0, 0.7);
	padding: 14px;
	margin: 0;
	font-weight: normal;
}

.mph-homepage #carousel-main-container .carousel-slide .carousel-slide-title {
	font-size: 21px;
	font-size: 1.5rem;
	font-weight: normal;
}

.mph-homepage #carousel-main-container .carousel-slide .carousel-slide-desc {
	font-size: 18px;
	font-size: 1.28571429rem;
	font-weight: normal;
	line-height: 28px;
	display: none;
}

.wf-active .mph-homepage #carousel-main-container .carousel-slide-text {
	font-family: 'proxima-nova', Helvetica, Arial, sans-serif;
}

.mph-homepage #carousel-main-container .carousel-slide-image img {
	height: auto;
	max-height: 350px;
	max-width: 1024px;
}

@media screen and (min-width: 500px) {	
	.mph-homepage #carousel-main-container .carousel-slide .carousel-slide-title {
		font-size: 24px;
		font-size: 1.71428571rem;
	}
	.mph-homepage #carousel-main-container .carousel-slide .carousel-slide-desc {
		display: block;
	}
}

@media screen and (min-width: 600px) {	
	.mph-homepage #carousel-main-container .carousel-slide .carousel-slide-text {
		width: 40%;
		top: 20%;
	}
}

@media screen and (min-width: 730px) {	
	.mph-homepage #carousel-main-container .carousel-slide .carousel-slide-text {
		top: 35%;
	}
}

@media screen and (min-width: 730px) {	
	.mph-homepage #carousel-main-container .carousel-slide .carousel-slide-text {
		width: 40%;
		top: 35%;
	}
	.mph-homepage #carousel-main-container .carousel-slide .carousel-slide-title {
		font-size: 28px;
		font-size: 2rem;
	}
}

/* Flexslider styles 
=============================================*/

.mph-homepage .slides,.flex-control-nav,.flex-direction-nav {
	margin:0;
	padding:0;
	list-style:none;
}

.mph-homepage .flex-control-nav {
	width:100%;
	position:absolute;
	bottom:-24px;
	text-align:center;
}

.mph-homepage .flex-control-nav li {
	margin:0 6px;
	display:inline-block;
	zoom:1;
	*display:inline;
}

.mph-homepage .flex-control-paging li a {
	width:11px;
	height:11px;
	display:block;
	background:#666;
	background:rgba(0,0,0,0.5);
	cursor:pointer;
	text-indent:-9999px;
	-webkit-border-radius:20px;
	-moz-border-radius:20px;
	-o-border-radius:20px;
	border-radius:20px;
	box-shadow:inset 0 0 3px rgba(0,0,0,0.3);
}

.mph-homepage .flex-control-paging li a:hover {
	background:#333;
	background:rgba(0,0,0,0.7);
}

.mph-homepage .flex-control-paging li a.flex-active {
	background:#000;
	background:rgba(0,0,0,0.9);
	cursor:default;
}

@media screen and (min-width: 840px) {	
	.mph-homepage .flex-control-nav {
		bottom: 10px;
		text-align: right;
		right: 10px;
	}
	
	.mph-homepage .flex-control-paging li a {
		background: #fff;
		background: rgba(255,255,255,0.9);
		box-shadow: 1px 1px 3px rgba(0,0,0,0.9);
	}
	
	.mph-homepage .flex-control-paging li a:hover {
		background: #fff;
	}
	
	.mph-homepage .flex-control-paging li a.flex-active { 
		background: #A4192F;
	}
	
	.mph-homepage .flex-control-paging li a {
		text-indent: 9999px;
	}
	
}

/* Landing Page
===========================================*/
.landing-page .site-content {
	float: none;
	width: auto;
}

.landing-page #event-title-block {
}

.landing-page #event-title-block h2 {
	font-size: 21px;
	font-weight: normal;
	font-style: italic;
	font-family: Georgia, 'Times New Roman', serif;
	line-height: 2;
}

.landing-page #landing-contact-top-container {
	font-size: 16px;
	padding-top: 10px;
}

.landing-page #landing-contact-top-container a {

}

.landing-page #landing-information-request {
	position: relative;
	margin-bottom: 21px;
}

.landing-page #main-page-image {
	display: none;
}

.landing-page #request-box {
	box-shadow: 4px 4px 11px -3px #333;
	width: 85%;
	margin-left: auto;
	margin-right: auto;
	background-color: #ecede5;
}

.landing-page .submit-box-title {
	background-color: #A51C30;
	color: #FFF;
	text-align: center;
	font-weight: normal;
	font-size: 21px;
	font-family: Arial, Helvetica, sans-serif;
	padding: 8px 10px;
}

.landing-page .sudmit-box-text {
	padding: 14px 14px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: normal;
}

.landing-page .content-heading {
	font-weight: normal;
	font-size: 25px;
	color: #A51C30;
	line-height: 1.3;
}

.landing-page .entry-content .landing-main-content-right h3 {
	font-family: Arial, Helvetica, sans-serif;
	color: #A51C30;
}

.landing-page .landing-main-content-left {
}

.landing-page .landing-main-content-right {
	font-family: Arial, Helvetica, sans-serif;
}

.landing-page .submit-box-title,
.wf-active .landing-page .landing-main-content-right,
.wf-active .landing-page .entry-content h3 {
	font-family: 'proxima-nova', Helvetica, Arial, sans-serif;
}

.landing-page #event-home-body-columns {
	clear: both;
}

@media screen and (min-width: 600px) and (max-width: 1024px) {	
	.landing-page #event-header,
	.landing-page .type-page,
	.landing-page #event-home-body-columns {
		padding: 0 20px;
	}
}

@media screen and (min-width: 630px) {	
	.landing-page #main-page-image {
		display: block;
		min-height: 300px;
	}

	.landing-page #request-box {
		position: absolute;
		z-index: 2;
		width: 325px;
		display: block;
		float: right;
		right: 6%;
		margin-top: -21px;
	}

	.landing-page #landing-contact-top-container {
		padding-bottom: 16px;
	}
}

@media screen and (min-width: 630px) and (max-width: 900px) {	
	.landing-page .content-heading {
		width: 50%;
		padding-top: 16px;
	}
}

@media screen and (min-width: 730px) {	
	.landing-page .landing-main-content-left {
		float: left;
		width: 49%;
	}

	.landing-page .landing-main-content-right {
		float: right;
		width: 45%;
	}
	
	.landing-page #event-title-block {
		width: auto;
		float: none;
		display: block;
	}
}

@media screen and (min-width: 800px) {		
	.landing-page #event-title-block {
		width: auto;
		float: none;
		display: block;
	}
}


@media screen and (min-width: 840px) {	
	.landing-page #event-title-block {
		width: 60%;
		float: left;
		display: inline-block;
	}
	
	.landing-page #landing-contact-top-container {
		float: right;
		display: inline-block;
		text-align: right;
		padding-top: 20px;
		padding-bottom: 0;
	}
}

@media screen and (min-width: 850px) and (max-width: 870px) {
	.landing-page #event-title-block h1 {
		font-size: 32px;
	}
}

/* Mailchimp Embed Form
==================================================== */
/* MailChimp Form Embed Code - Classic - 08/17/2011 */
#mc_embed_signup form {
	display:block; 
	position:relative; 
	text-align:left; 
	padding:10px 0 10px 3%;
}
#mc_embed_signup h2 {font-weight:bold; padding:0; margin:15px 0; font-size:1.4em;}
#mc_embed_signup input {border:1px solid #999; -webkit-appearance:none;}
#mc_embed_signup input[type=checkbox]{-webkit-appearance:checkbox;}
#mc_embed_signup input[type=radio]{-webkit-appearance:radio;}
#mc_embed_signup input:focus {border-color:#333;}
#mc_embed_signup .button {
	clear:both; 
	background: #628db0; 
	border: 0 none; 
	border-radius: 0; 
	color: #FFFFFF; 
	cursor: pointer; 
	display: inline-block; 
	font-size:15px; 
	font-weight: bold; 
	height: 32px; 
	line-height: 32px; 
	padding: 0 22px; 
	text-align: center; 
	text-decoration: none; 
	vertical-align: top; 
	white-space: nowrap; 
	width: auto;
	margin-left: auto;
	margin-right: auto;
	box-shadow: none;
}
#mc_embed_signup .button:hover {
	background-color: #628db0; 
}
#mc_embed_signup .small-meta {font-size: 11px;}
#mc_embed_signup .nowrap {white-space:nowrap;}

#mc_embed_signup .mc-field-group {clear:left; position:relative; width:96%; padding-bottom:3%; min-height:50px;}
#mc_embed_signup .size1of2 {clear:none; float:left; display:inline-block; width:46%; margin-right:4%;}
* html #mc_embed_signup .size1of2 {margin-right:2%; /* Fix for IE6 double margins. */}
#mc_embed_signup .mc-field-group label {display:block; margin-bottom:3px;}
#mc_embed_signup .mc-field-group input {display:block; width:100%; padding:8px 0; text-indent:2%;}
#mc_embed_signup .mc-field-group select {display:inline-block; width:99%; padding:5px 0; margin-bottom:2px;}

#mc_embed_signup .datefield, #mc_embed_signup .phonefield-us{padding:5px 0;}
#mc_embed_signup .datefield input, #mc_embed_signup .phonefield-us input{display:inline; width:60px; margin:0 2px; letter-spacing:1px; text-align:center; padding:5px 0 2px 0;}
#mc_embed_signup .phonefield-us .phonearea input, #mc_embed_signup .phonefield-us .phonedetail1 input{width:40px;}
#mc_embed_signup .datefield .monthfield input, #mc_embed_signup .datefield .dayfield input{width:30px;}
#mc_embed_signup .datefield label, #mc_embed_signup .phonefield-us label{display:none;}

#mc_embed_signup .indicates-required {text-align:right; font-size:11px; margin-right:4%;}
#mc_embed_signup .asterisk {color:#c60; font-size:200%;}
#mc_embed_signup .mc-field-group .asterisk {position:absolute; top:25px; right:10px;}        
#mc_embed_signup .clear {
	clear:both;
	text-align: center;
}

#mc_embed_signup .required {
	color: #000;
}

#mc_embed_signup .mc-field-group.input-group ul {margin:0; padding:5px 0; list-style:none;}
#mc_embed_signup .mc-field-group.input-group ul li {display:block; padding:3px 0; margin:0;}
#mc_embed_signup .mc-field-group.input-group label {display:inline;}
#mc_embed_signup .mc-field-group.input-group input {display:inline; width:auto; border:none;}

#mc_embed_signup div#mce-responses {
	margin: 10px 0;
	overflow:hidden; 
	clear: both;
	text-align: left;
}
#mc_embed_signup div.response {
	font-weight:bold; 
	text-align: left;
}
#mc_embed_signup #mce-error-response {
	display:none;
	text-align: left;
}
#mc_embed_signup #mce-success-response {color:#529214; display:none;}
#mc_embed_signup label.error {display:block; float:none; width:auto; margin-left:1.05em; text-align:left; padding:.5em 0;}

#mc-embedded-subscribe {clear:both; width:auto; display:block;}
#mc_embed_signup #num-subscribers {font-size:1.1em;}
#mc_embed_signup #num-subscribers span {padding:.5em; border:1px solid #ccc; margin-right:.5em; font-weight:bold;}
