@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,300,600);
@import url('https://fonts.googleapis.com/css?family=Hind+Guntur:300,400,500,600,700, 800');

@font-face {
	font-family: 'TuliaBold';
	src: url('/fonts/Tulia_bold.otf');
}

body {
	font-family: 'Open Sans', arial,helvetica,sans-serif;
	font-size: 14px;
	line-height: 1.42;
	color: #333;
}

.clear { clear: both; }

a { color: #2970a6; }

h1, h2, h3, h4, h5 {
	font-family: 'Hind Guntur', arial, helvetica,sans-serif;
	font-weight: 300;
	color: #000;
}

h2 { font-size: 1.8rem;	}

p {
	font-family: 'Open Sans', arial, helvetica,sans-serif;
	font-weight: 400;
	color: rgba(0,0,0,0.87);
	font-size: 14px;
	line-height: 1.46;
}

.button {
	font-family: 'Open Sans', arial, helvetica,sans-serif;
	font-size: 15px;
	color: #00bff3;
	border: solid 1px #00bff3;
	background: none;
	padding: 10px 30px;
}

.button:hover, .button:focus, .navi .links a.button:hover, .navi .links a.button:focus {
	color: #fff;
	background: #00bff3;
}

header {
	background: url('images/background.jpg') no-repeat;
	background-position: top;
	background-size: cover;
	height: 455px;
}

/* Language Switcher */
.language-nav dd {
	margin-left: 0;
}

.overlay {
	background: rgba(0,0,0, 0.5);
	width: 100%;
	height: 100%;
}

.navi {
	background: rgba(255, 255, 255, 0.9);
	padding: 10px 0;
}

.navi .logo { display: inline-block; }

.navi .links {
	float: right;
	margin: 0;
}

.navi .links a {
	font-family: 'Open Sans', arial,helvetica,sans-serif;
	font-size: 15px;
	font-weight: 400;
	color: #000;
	padding-top: 10px;
}

.navi .links.fr a {
	font-family: 'Open Sans', arial,helvetica,sans-serif;
	font-size: 14px;
	font-weight: 400;
	color: #000;
	padding-top: 10px;
}

.navi .links a.button {
	font-size: 14px;
	color: #00bff3;
	border: solid 1px #00bff3;
	background: none;
	padding: 6px 10px;
	margin: -5px 0 0 0;
}

.intro { text-align: center; }

.intro h1 {
	font-weight: 700;
	margin: 50px 0 8px 0;
	color: #fff;
}

.intro p {
	font-size: 1.04rem;
    line-height: 1.64;
    color: #fff;
    font-weight: 400;
}

.intro .button {
	font-family: 'Open Sans', arial,helvetica,sans-serif;
	font-size: 15px;
	font-weight: 400;
	background: #00bff3;
	color: #fff;
	padding: 8px 30px 10px 30px;
}

.intro .button:hover, .contact form .button:hover { background: #27d1ff; border-color: #27d1ff; }

section { padding: 50px 0; }

#map {
    width: 100%;
    height: 400px;
}

#bigmap {
    width: 100%;
    height: 800px;
}

.media { background: #e8eff7; }

.news { margin: 25px 0 20px 0; }

.news div { margin-bottom: 5px; }

.image {
	margin-right: 15px;
	float: left;
	width: 104px;
}

.content {
	float: left;
	width: 480px;
}

.content h3 {
	font-size: 1.14rem;
	line-height: 1.2;
	margin: 0 0 0.25rem 0;
}

.content p { margin-bottom: 3px; font-size: 12px; }

.date {
	font-size: 13px;
	color: #797979;
}

.partners p {
	margin: 35px 0 0 0;
    text-transform: uppercase;
    font-size: 12px;
}

.partners p.main-p {
	margin: 0;
    display: inline-block;
	vertical-align: middle;
    margin-right: 10px;
}

.partners img:hover {
    opacity: 0.4;
    filter: alpha(opacity=40); /* For IE8 and earlier */
}

.partners ul li {
	padding: 0 0.625rem 0.625rem;
}

.contact {
	background: url('images/footer.jpg') repeat;
	padding-bottom: 20px;
}

.contact h5 { font-weight: 600; }

.partners h2, .contact h2 { margin-bottom: 20px; }

.contact form input {
	font-family: 'Open Sans', arial,helvetica,sans-serif;
	color: #333;
	height: 44px;
	border-radius: 3px;
	border: none;
	margin-bottom: 0.75rem;
	padding-left: 15px;
}

.contact form textarea {
	border: none;
	padding: 15px 0 0 15px;
}

.contact form .button {
	font-size: 15px;
	color: #fff;
	background: #00bff3;
}

.scroll {
	text-align: center;
	margin-top: 50px;
}

.archive {
	padding: 0 0 50px 0;
	background: #e8eff7;
}

.archive .navi { margin-bottom: 25px;}

.archive .news { margin-top: 15px; }

.archive h2 { margin-bottom: 15px; }

.archive .content, .model p { width: 90%; }

.archive .content h3 { font-size: 1.04rem; }

.archive .content a { font-weight: 400; }

.archive .content hr { margin: 10px 0; }

.program { padding: 0 0 50px 0; }

.overview {
	background: url('images/program_model_background.jpg') no-repeat;
	background-position: center center;
	background-size: cover;
	height: 460px;
}

.overview-content {
	background: rgba(255, 255, 255, 0.9);
	border-radius: 3px;
	padding: 30px 60px;
	margin-top: 55px;
	text-align: center;
}

.overview h1 { font-size: 2.3rem; }

.overview-future-pathways {
	background-color: #1C272E;
	background: url('images/future-pathways/home-splash-future-pathways-bg.jpg') no-repeat;
	background-position: center center;
	background-size: cover;
}

.overview-future-pathways-fs {
	background-color: #1C272E;
	/*background: url('images/future-pathways/home-splash-future-pathways-bg.jpg') no-repeat;*/
	background-position: center center;
	background-size: cover;
}

.overview-content-future-pathways {
	margin: 2em 0 3rem;
	text-align: center;
}

.future-pathways-bars {
	position: absolute;
	top: 0;
	left: 0px;
}

.future-pathways-logo {
	margin: 6em 0;
	max-width: 350px;
}

.future-pathways-fs-bars {
	position: absolute;
	top: 40px;
}

.future-pathways-fs-logo {
	max-height: 290px;
	padding-right: 7em;
	margin-bottom: 2em;
}

.future-pathways-tig-logo {
	width: 240px;
	margin-right: 4em;
}

.future-pathways-rbc-logo {
	width: 150px;
}

.center-middle {
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}
.future-pathways-p1 {font-size: 1.2em; line-height: 1.8em;}
.future-pathways-p2 {font-size: 1.2em; line-height: 1.8em; font-weight: 900; color: #00b4c3}
.role-models-title {text-transform: uppercase; font-weight: 900; font-style: normal;  color: #9fcc3b;}
.role-models-description {text-align: justify; line-height: 1.8em;}

.model hr { margin: 50px 0; }

.model h2 {
	display: inline-block;
	margin-bottom: 20px;
}

.model-icon { margin: -10px 10px 0 0;}

.program-model { margin-top: 20px; }

.program .overview .overview-content p {
	font-size: 1rem;
    line-height: 1.64;
    font-weight: 300;
    margin-bottom: 50px;
}

.tag {
	font-size: 12px;
	line-height: 14px;
	display: block;
	margin-top: 10px;
}

.experts { color: #a70267; }
.career { color: #f10c49; }
.culture { color: #fb6b41; }
.teachers { color: #faab3d; }
.network { color: #339194; }

@media only screen and (min-width: 40.063em) and (max-width: 64em) { .navi .links a, .navi .links a.button { font-size: 13px; } .content { width: 360px;} }

/******** Small Screen ********/
@media only screen and (max-width: 40em) {
	header { height: 500px; }
	.navi .logo-sm { text-align: center; margin-bottom: 10px;}
	.navi .links a { font-size: 13px; }
	.navi .links a.button { font-size: 13px; padding: 10 0 0 0; border: none; }
	.intro h1 { margin: 30px 0 5px 0; font-size: 1.5rem; }
	section { padding: 25px 0; }
	#map { height: 240px; }
	.image { width: 60px;}
	.partners p { margin-top: 0; }
	.content { width: 210px;}
	.content h3 { font-size: 1rem; }
	.intro p, .contact p, .archive .content p { font-size: 13px; }
	.intro .button {font-size: 14px; padding: 7px 30px 9px 30px; }
	.overview-content { margin-top: 30px; padding: 20px;}
	.overview { height: auto; }
	.overview-content h1 { font-size: 1.6rem; }
	.archive .content, .model p { width: 100%; }
	.archive h2 { font-size: 1.4rem; }
	.archive .content h3 { font-size: 1rem; }
	.model hr { margin: 30px 0 20px 0; }
	.model h2 { font-size: 1.4rem; }
	.model-icon { width: 30px;  margin: -5px 5px 0 0;}
	/* future pathways */
	.future-pathways-fs-logo {padding-right: 3em; margin-bottom: 0;}
	.future-pathways-bars {display: none;}
	.future-pathways-fs-bars {display: none;}
	.future-pathways-tig-logo {max-width: 235px; margin-right: 0;}
}

/******** Staff Page ********/
.staff-page {
	background: #e8eff7;
}

.staff-page h2 {
	font-size: 2.8em;
}

.staff-page hr {
	margin: 30px 0;
}

.flip {
	-webkit-perspective: 800;
	width: 100%;
	height: 260px;
	position: relative;
}

@media only screen and (max-width: 40em) {
	.flip {
		height: 400px;
	}
}

.flip .card.flipped {
	-webkit-transform: rotatex(-180deg);
}

.flip .card {
	width: 100%;
	height: 100%;
	-webkit-transform-style: preserve-3d;
	-webkit-transition: 0.5s;
}

.flip .card .face {
	width: 100%;
	height: 100%;
	position: absolute;
	-webkit-backface-visibility: hidden ;
	z-index: 2;
	text-align: center;
	line-height: auto;
}

.flip .card .front {
	position: absolute;
	z-index: 1;
	background-size: cover;
	color: white;
	cursor: pointer;
}

.flip .card .front .info {
	position: absolute;
    bottom: 0;
    width: 100%;
    padding: 15px;
    background: #27d1ff;
    height: auto;
    line-height: 20px;
    font-size: 12px;
    text-align: left;
}

.flip .card .front .info span {
	font-size: 16px;
	display: block;
}

.flip .card .back {
	-webkit-transform: rotatex(-180deg);
	background: #27d1ff;
	color: white;
	cursor: pointer;
	font-size: 14px;
	line-height: 18px;
	padding: 20px;
	text-align: left;
}

.flip .card .back h3 {
	font-size: 16px;
	color: #fff;
	line-height: 1;
}

.flip .card .back h4 {
	font-size: 14px;
	margin-bottom: 20px;
	color: #fff;
}

.staff-page .contact-info {
	margin-top: 10px;
	font-size: 14px;
	line-height: 1.2;
	font-weight: 300;
}

.staff-page .contact-info span {
	font-size: 15px;
	display: block;
	font-weight: 500;
}

.jen { background:url('images/staff/staff-jennifer.jpg'); }
.mike { background:url('images/staff/staff-mike.jpg'); }
.dallas { background:url('images/staff/staff-dallas.jpg'); }
.mali { background:url('images/staff/staff-mali.jpg'); }
.mitch { background:url('images/staff/staff-mitch.jpg'); }
.kimd { background:url('images/staff/staff-kimd.jpg'); }
.jason { background:url('images/staff/staff-jason.jpg'); }
.wauk { background:url('images/staff/staff-wauk.jpg'); }
.kimd { background:url('images/staff/staff-kimd.jpg'); }
.doronn { background:url('images/staff/staff-doronn.jpg'); }
.magdalena { background:url('images/staff/staff-magdalena.jpg'); }
.nyle { background:url('images/staff/staff-nyle.jpg'); }
.liam { background:url('images/staff/staff-liam.jpg'); }
.tinisha { background:url('images/staff/staff-tinisha.jpg'); }
.becky { background:url('images/staff/staff-becky.jpg'); }
.brandon { background:url('images/staff/staff-brandon.jpg'); }
.brenda { background:url('images/staff/staff-brenda.jpg'); }
.erica { background:url('images/staff/staff-erica.jpg'); }
.jayson { background:url('images/staff/staff-jayson.jpg'); }
.jesse { background:url('images/staff/staff-jesse.jpg'); }
.mikayla { background:url('images/staff/staff-mikayla.jpg'); }
.natasha { background:url('images/staff/staff-natasha.jpg'); }
.annemarie { background:url('images/staff/staff-annemarie.jpg'); }
.lauren { background:url('images/staff/staff-lauren.jpg'); }
.michaels { background:url('images/staff/staff-michaels.jpg'); }
.kayla { background:url('images/staff/staff-kayla.jpg'); }
.quetzala { background:url('images/staff/staff-quetzala.jpg'); }

/******** WellBeing Page ********/
.wellbeing-hero {
	padding: 70px 0 50px !important;
}

.wellbeing-hero h1 {
	color: #fff !important;
	font-weight: 700 !important;
	font-size: 42px;
}

.wellbeing-hero p,
.wellbeing-second h2 {
	color: #fff !important;
}

.wellbeing-hero p span {
	display: block;
	margin-top: 10px;
}

.wellbeing-hero.one { background-color: #77604e;}
.wellbeing-hero.two { background-color: #d991b0;}
.wellbeing-hero.three { background-color: #1db4c2;}
.wellbeing-hero.four { background-color: #9d8fb5;}
.wellbeing-hero.five { background-color: #1cb3c1;}
.wellbeing-hero.six { background-color: #30b09a;}
.wellbeing-hero.seven { background-color: #118082;}

.wellbeing {
	padding: 80px 0;
}

.wellbeing p {
 font-size: 16px;
 line-height: 1.46;
 color: #283949;
}

.wellbeing h2, .wellbeing h3 {
	font-weight: 700;
	color: #283949;
}

.wellbeing-intro .panel {
	padding: 30px 40px;
	background: #f7f7f7;
	text-align: center;
	margin-bottom: 40px;
}

.wellbeing-intro .panel.blue {
	border-top: solid 5px #1c3e61;
}

.wellbeing-intro .panel.blue h3 {
	color: #1c3e61;
	text-transform: uppercase;
	margin: 20px 0;
}

.wellbeing-intro .panel.red {
	border-top: solid 5px #bf5047;
}

.wellbeing-intro .panel.red h3 {
	color: #bf5047;
	text-transform: uppercase;
	margin: 20px 0;
}

.wellbeing-intro .panel ul li {
	text-align: left;
	color: #283949;
}

.wellbeing h2 {
	font-size: 32px;
	margin-bottom: 40px;
	text-align: center;
}

.wellbeing h3 {
	font-size: 18px;
}

.wellbeing-second {
	background: url('/images/wellbeing/comment-bg.jpg') no-repeat;
	background-size: cover;
}

.wellbeing-second .comment {
	position: relative;
	background: #ffffff;
	padding: 30px 40px;
	border-radius: 3px;
	font-size: 14px;
}

.wellbeing-second .comment:after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 0;
	height: 0;
	border: 15px solid transparent;
	border-top-color: #ffffff;
	border-bottom: 0;
	margin-left: -15px;
	margin-bottom: -15px;
}


.wellbeing-second .comment li {
	margin-bottom: 15px;
	font-size: 14px;
}

.wellbeing-third span {
	font-size: 30px;
	font-weight: 700;
	color: #00bff3;
	display: block;
	font-family: 'Hind Guntur', arial, helvetica,sans-serif;
	margin-bottom: -5px;
}

.wellbeing-cta {
	background: url('images/footer.jpg') repeat;
	text-align: center;
}

.wellbeing-cta.landing {
	background: #d5e2f0 !important;
	padding-bottom: 100px;
}

.wellbeing-cta img {
	display: block;
	margin: 0 auto;
	padding-bottom: 5px;
}

.wellbeing-cta a {
	font-size: 12px;
	line-height: 1.4;
	font-weight: 600;
	color: #283949;
	display: block;
}

.wellbeing-cta li {
	text-align: center;
}

.diagram {
	/* background: #d5e2f0; */
	padding-top: 80px;
	text-align: center;
}

.diagram h2 {
	font-size: 48px;
	font-weight: 800;
	color: #283949;
	line-height: 1.06;
}

.diagram h2 span {
	color: #00bff3;
}

.diagram p {
	font-size: 17px;
	margin-bottom: 40px;
}

.diagram area {
	outline: none;
}

/* Fireside Chats */
.video-title {
	margin-top: 1.5em;
	Font-family: 'TuliaBold';
	Color: #9FCC3B;
	font-size: 1.125em;
}

@media only screen and (max-width: 40em) {
	.wellbeing {
		padding: 40px 0;
	}

	.wellbeing h2 {
		font-size: 28px;
		margin-bottom: 20px;
	}

	.wellbeing h3 {
		font-size: 16px;
	}

	.wellbeing p, .wellbeing ul li {
	 font-size: 14px;
	 line-height: 1.46;
	}

	.wellbeing-hero {
		text-align: center;	
		padding: 40px 0 30px !important;
	}
	
	.wellbeing-hero img {
		width: 90px;
	}
	
	.wellbeing-hero  h1 {
		font-size: 24px;
		margin-top: 20px;
	}
	
	.wellbeing-third span {
		font-size: 24px;
	}

	.wellbeing-intro .panel, .wellbeing-second .comment {
		padding: 20px;
	}
	
	.diagram p {
		margin-bottom: 0;
	}
}
