/* Table of Content
==================================================
	#Reset & Basics
	#Basic Styles
	#Site Styles
	#Typography
	#Links
	#Media
	#Buttons
	#Forms
	#Clearing */


/* #Reset & Basics (Inspired by E. Meyers)
================================================== */
	html {
		padding: 0 !important;
		background:#fff;
		margin:0px !important;}
	html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
		margin: 0;
		padding: 0;
		border: 0;
		font-size: 100%;
		font: inherit;
		vertical-align: baseline;
		}
	article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
		display: block;}
	body {
		line-height: 1;}
	ol, ul {
		list-style: none;}
	blockquote, q {
		quotes: none;}
	blockquote:before, blockquote:after,
	q:before, q:after {
		content: '';
		content: none;}
	table {
		border-collapse: collapse;
		border-spacing: 0;}


/* #Basic Styles
================================================== */
	::selection {background:#DAD7D4; }
	::-moz-selection {background:#DAD7D4;}
	::-webkit-selection {background:#DAD7D4;}
	
	body {
		background: #fff;
		font: 14px "Open Sans", sans-serif;
		color: #34495e;
		font-weight: normal;
		-webkit-text-size-adjust: 100%;
		-webkit-font-smoothing:antialiased;
	}
	
	hr { border: none; height: 2px; background: #e6e6e6; margin: 12px 0 15px; clear: both;}
	
	.nb { margin: 60px 0 40px; }
	
	
/* #Typography
================================================== */
	h1, h2, h3, h4, h5, h6 {
		color: #1d1d1d;
		font-family: "Lato", sans-serif;
		font-weight: 700;}
	h1 {font-size: 15px;}
	h2 {font-size: 28px;}
	h3 {font-size: 15px;}
	h4 {font-size: 15px;}
	h5 {font-size: 13px;}
	h6 {font-size: 12px;}
	.subheader {color: #777;}

	.main-caption {text-align: center;}
	.main-caption h2 {font-size: 36px; letter-spacing: -2px; }
	.main-caption h3 {font-size: 20px; font-weight: 300; color: #898989; }
	
	p { line-height: 23px;}
	p img {margin: 0;}

	em {font-style: italic;}
	strong {font-weight: 700; font-family: "Lato", sans-serif;}
	small {font-size: 80%;}

	/*	Blockquotes  */
	blockquote, blockquote p {
		font-size: 14px; 
		font-style: italic; 
		line-height: 23px; 
		color: #343852; 
		background: #f5f5f5;
	}
	
	blockquote {
		padding: 15px 30px; 
		color: #6F7275; 
		margin: 10px 0px 10px 0;
	}
	
	blockquote cite {
		display: block; 
		font-size: 13px; 
		color: #343852; 
		font-style: normal;
	}	
	
	blockquote cite:before { 
		content: "\2014 \0020"; 
	}
	
	blockquote cite a, 
	blockquote cite a:visited,
	blockquote cite a:visited {
		color: #343852;
	}

/* #Links
================================================== */
	a, a:active, a:visited {
		text-decoration: none; 
		outline: 0; 
		-webkit-transition: all 150ms ease-in-out;
		-moz-transition: all 150ms ease-in-out;
		-o-transition: all 150ms ease-in-out;
		-ms-transition: all 150ms ease-in-out;
		transition: all 150ms ease-in-out;
	}
	p a, p a:visited {line-height: inherit;}


/* #Media
================================================== */

	img.scale-with-grid {
		max-width: 100%;
		height: auto;}
		
	img, object, embed {max-width: 100%; border: 0;}
	img {height:auto;display: block;}
	
	.video-container {
		position: relative;
		padding-bottom: 56.25%; /* 16:9 */
		padding-top: 25px;
		height: 0;
		margin-bottom: 30px;
	}
	.video-container iframe {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}

/* #Buttons
================================================== */

/*  Classic Button
================== */
button.btn,
a.btn {
	display:inline-block;
	font-size:14px;
	font-weight: 400;
	padding: 8px 16px 9px;
	text-decoration:none;
	-webkit-transition: all .15s ease-in-out; 
	-moz-transition: all .15s ease-in-out; 
	transition: all .15s ease-in-out; 
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border: none;
	cursor: pointer;
	font-family: "Open Sans";
}

button.btn i,
a.btn i{ 
	margin: 0px 6px 0 0; 
}

/* Default Button
================== */
button.btn,
a.btn { 
	color: #fff;
	
}

button.btn i,
a.btn i { 
	color: #fff;
}

button.btn:hover i,
a.btn:hover i{ 
	color:#fff; 
}

/* Grey Button 
================== */
button.btn.grey,
a.btn.grey { 
	background:#868686; 
	color:#fff; 
	
	box-shadow: 0 2px 0 0 #575757;
	-moz-box-shadow: 0 2px 0 0 #575757;
	-webkit-box-shadow: 0 2px 0 0 #575757;
	-o-box-shadow: 0 2px 0 0 #575757;
	-ms-box-shadow: 0 2px 0 0 #575757;
}

button.btn.grey:hover,
a.btn.grey:hover{ 
	background:#575757; 
	color:#fff;
}

button.btn.grey:hover i,
a.btn.grey:hover i{ 
	color:#fff; 
}

/* Dark Button 
================== */
button.btn.dark.
a.btn.dark { 
	background-color:#454545; 
	color:#fff; 
	
	box-shadow: 0 2px 0 0 #000;
	-moz-box-shadow: 0 2px 0 0 #000;
	-webkit-box-shadow: 0 2px 0 0 #000;
	-o-box-shadow: 0 2px 0 0 #000;
	-ms-box-shadow: 0 2px 0 0 #000;
}

button.btn.dark:hover,
a.btn.dark:hover{
	background:#000;
	color:#fff;
}

button.btn.dark:hover i
a.btn.dark:hover i{ 
	color:#fff; 
}

/* Green Button 
================== */
button.btn.green,
a.btn.green { 
	background:#9ECC3B; 
	color:#fff; 
	
	box-shadow: 0 2px 0 0 #77A516;
	-moz-box-shadow: 0 2px 0 0 #77A516;
	-webkit-box-shadow: 0 2px 0 0 #77A516;
	-o-box-shadow: 0 2px 0 0 #77A516;
	-ms-box-shadow: 0 2px 0 0 #77A516;
}

button.btn.green:hover,
a.btn.green:hover{ 
	background:#77A516; 
	color:#fff; 
}

button.btn.green:hover i,
a.btn.green:hover i{ 
	color:#fff; 
}

/* blue Button 
================== */
button.btn.blue,
a.btn.blue { 
	background: #5DD7E2;
	color: white;
	
	box-shadow: 0 2px 0 0 #4BA4AC;
	-moz-box-shadow: 0 2px 0 0 #4BA4AC;
	-webkit-box-shadow: 0 2px 0 0 #4BA4AC;
	-o-box-shadow: 0 2px 0 0 #4BA4AC;
	-ms-box-shadow: 0 2px 0 0 #4BA4AC;
}

button.btn.blue:hover,
a.btn.blue:hover{ 
	background:#4BA4AC; 
	color:#fff; 
}

button.btn.blue:hover i,
a.btn.blue:hover i{ 
	color:#fff; 
}

/* Red Button 
================== */
button.btn.red,
a.btn.red { 
	background: #FF5454;
	color: white;
	
	box-shadow: 0 2px 0 0 #be2e2e;
	-moz-box-shadow: 0 2px 0 0 #be2e2e;
	-webkit-box-shadow: 0 2px 0 0 #be2e2e;
	-o-box-shadow: 0 2px 0 0 #be2e2e;
	-ms-box-shadow: 0 2px 0 0 #be2e2e;
}

button.btn.red:hover,
a.btn.red:hover{ 
	background:#be2e2e; 
	color:#fff; 
}

button.btn.red:hover i,
a.btn.red:hover i{ 
	color:#fff; 
}

/* Yellow Button 
================== */
button.btn.yellow,
a.btn.yellow { 
	background: #FFEE2F;
	color: #857500;
	
	box-shadow: 0 2px 0 0 #E7C335;
	-moz-box-shadow: 0 2px 0 0 #E7C335;
	-webkit-box-shadow: 0 2px 0 0 #E7C335;
	-o-box-shadow: 0 2px 0 0 #E7C335;
	-ms-box-shadow: 0 2px 0 0 #E7C335;
}

button.btn.yellow i,
a.btn.yellow i{ 
	color:#857500; 
}

button.btn.yellow:hover,
a.btn.yellow:hover{ 
	background: #E7C335;
	color: #857500; 
}

button.btn.yellow:hover i,
a.btn.yellow:hover i{ 
	color:#857500; 
}

/* Orange Button 
================== */
button.btn.orange,
a.btn.orange { 
	background: #FD8A20;
	color: #fff;
	
	box-shadow: 0 2px 0 0 #C05F06;
	-moz-box-shadow: 0 2px 0 0 #C05F06;
	-webkit-box-shadow: 0 2px 0 0 #C05F06;
	-o-box-shadow: 0 2px 0 0 #C05F06;
	-ms-box-shadow: 0 2px 0 0 #C05F06;
}

button.btn.orange:hover,
a.btn.orange:hover{ 
	background:#C05F06; 
	color:#fff; 
}

button.btn.orange:hover i,
a.btn.orange:hover i{ 
	color:#fff; 
}

/* #Forms
================================================== */
	textarea, input[type="text"], 
	input[type="password"], 
	input[type="datetime"], 
	input[type="datetime-local"], 
	input[type="date"], 
	input[type="month"],
	input[type="time"],
	input[type="week"],
	input[type="number"], 
	input[type="email"], 
	input[type="url"], 
	input[type="search"], 
	input[type="tel"], 
	input[type="color"]{
		display: block;
		width: 100%;
		border: none;
		background: #f5f5f5;
		height: 40px;
		padding: 0;
		font: 13px "Open Sans", sans-serif;
		outline: none;
		
		transition: all 200ms;
		-moz-transition: all 200ms;
		-webkit-transition: all 200ms;
		
		border-radius: 4px;
		-moz-border-radius: 4px;
		-webkit-border-radius: 4px;
	}
	
	input:hover,
	input:focus {
		background: #ebf1f4;
	}
	
	input::-webkit-input-placeholder {
		color: #34495e;
	}

	input:-moz-placeholder { /* Firefox 18- */
	   color: #34495e;  
	}

	input::-moz-placeholder {  /* Firefox 19+ */
	   color: #34495e;  
	}

	input:-ms-input-placeholder {  
	   color: #34495e;  
	}
	
	
	
/* #Clearing
================================================== */

/* Self Clearing Goodness */
    .container:after {content: "\0020"; display: block; height: 0; clear: both; visibility: hidden;}

/* Use clearfix class on parent to clear nested columns,
    or wrap each row of columns in a <div class="row"> */
	.clearfix:before,
	.clearfix:after,
	.row:before,
	.row:after {
		content: '\0020';
		display: block;
		overflow: hidden;
		visibility: hidden;
		width: 0;
		height: 0;}
	.row:after,
	.clearfix:after {clear: both;}
	.row,
	.clearfix {zoom: 1;}

	/* You can also use a <br class="clear" /> to clear columns */
	.clear {
		clear: both;
		display: block;
		overflow: hidden;
		visibility: hidden;
		width: 0;
		height: 0;}
