/* Base styles */

/* Table of Content

	#Basic Styles
	#Site Styles
	#Typography
	#Links
	#Lists
	#Images
	#Buttons & Messages
	#Tabs
	#Tables
	#Forms
	#Misc */



/* Colors:
	
	#c20726		red			Tipline, buttons, etc.
	#69ade6		blue		H3, 
	#33a0c9		blue-green	h2, footer H3
	
	
*/

/* !Basic Styles ============================== */
	html {
		box-sizing: border-box;
		font-size: 1em;
		overflow-y: scroll;
	}
	*, *:before, *:after {
		box-sizing: inherit;
	}
	body {
		color: #fff;
		font: 300 15px/1.8 'Open Sans', sans-serif;
		background: #110d17;
		background: #090611;
		background-position: center top;
		background-repeat: no-repeat;
		background-size: cover;
	}



/* !Typography ============================== */
	h1, h2, h3, h4, h5, h6 {
		font-family: "Open Sans", sans-serif;
		font-weight: 300;
		text-transform: uppercase;
		letter-spacing: 0.05em;
		margin-top: 0;
	}
	h1 a, h2 a, h3 a,   h5 a, h6 a {
		font-weight: inherit;
		color: inherit;
	}
	h1, .h1 { font-size: 2.40em; line-height: 1.2;  margin-bottom: .5em; }
	h2, .h2 { font-size: 2.40em; line-height: 1.2;  margin-bottom: .5em; color: #33a0c9;}
	h3, .h3 { font-size: 1.20em; line-height: 1.25; margin-bottom: 0em;  color: #69ade6; }
	h4, .h4 { font-size: 1.40em; line-height: 1.3;  margin-bottom: .714em; text-transform: none; }
	h5, .h5 { font-size: 1.00em; line-height: 1.3; }
	h6, .h6 { font-size: 1.00em; line-height: 1.3; }
	
	h2 + h4 { font-size: .8em; text-transform: none; font-style: italic; margin: -1em 0 3.1em; }
	
	/* 	for headings with spans immitating subheadings */
	h2 > .h3 {
		font-size: 15px;
		display: block;
		margin-bottom: 0;
	}
	
	
	p { margin: 0 0 2em 0; }
	p img { margin: 0; }

	i, em { font-style: italic; }
	b, strong { font-weight: bold; }
	small { font-size: 80%; }
	
	time { font-style: italic; font-size: .8em; margin-bottom: 1em; }

/*	Blockquotes	*/
	blockquote { font-size: 35px; line-height: 1.5; font-style: italic; margin: 1.5em 0; padding: 0 1em; position: relative; }
	blockquote:before, blockquote:after { content: ''; display: block; margin: .5em auto; width: 50%; }
	blockquote:before { border-top: 1px solid #666;    padding-top: .5em;  }
	blockquote:after  { border-bottom: 1px solid #666; padding-bottom: .5em; }
	blockquote *:last-child { margin-bottom: 0; }
	
	blockquote cite { display: block; font-size: 12px; color: #666; }
	blockquote cite:before { content: "\2014 \0020"; }
	blockquote cite a, blockquote cite a:visited, blockquote cite a:visited { color: #666; }



/* !Links */
	a		{ color: #69ade6; outline: 0; text-decoration: none; }
	a:hover	{ color: #33a0c9; outline: 0;}
	a:focus	{ color: #000; outline: thin dotted; }
	a:active { outline: 0; }

	p a { line-height: inherit; }


/* !Lists */
	ul, ol { margin: 0 0 1em 1.5em; }
	ul ul, ul ol, ol ol, ol ul { margin-bottom: .5em; }
	ul { list-style: disc; }
	ol { list-style: decimal; }
	li { line-height: 1.25; margin-bottom: .25em; }
	ul.unstyled { list-style: none; margin-left: 0; }
	dl { margin-bottom: 1em; }
	dl dt, dl dd { line-height: 1.25; }
	dl dt { font-weight: bold; }
	dl dd { margin-left: 1.5em; }

	dd:after {
		/* http://lea.verou.me/2012/02/flexible-multiline-definition-lists-with-2-lines-of-css/ */
		content: '\D\A';
		white-space: pre;
	}


/* !Images */
	figure {
		margin: 0 0 1em 0;
	}
	figcaption {
		margin-top: .5em;
		text-align: right;
		font-size: .8em;
		font-style: italic;
	}
	img {
		display: block;
		border: 0;
		max-width: 100%;
		height: auto;
		-ms-interpolation-mode: bicubic;
	}
	.img_left {
		float: left;
		margin: 0 1em 0.5em 0;
	}
	.img_right {
		float: right;
		margin: 0 0 0.5em 1em;
	}
	
	.svg-icon {
		width: 100%;
		height: 100%;
	}
	i.icon {
		width: 1em;
		height: 1em;
		display: inline-block;
		vertical-align: middle;
	}
	
	
	.panel {
		padding: 2.6em;
		background: #ececec;
		color: #282828;
	}
	.panel > *:last-child {
		margin-bottom: 0;
	}
	.panel > blockquote {
		margin: 0;
	}
	
	

	code, pre {
		padding: 0 3px 2px;
		font-family: monospace;
		font-size: 12px;
		border-radius: 3px;
	}
	code {
		background-color: #eee;
		color: rgba(0, 0, 0, 0.75);
		padding: 1px 3px;
	}
	pre {
		background-color: #f5f5f5;
		display: block;
		padding: 8.5px;
		margin: 0 0 18px;
		line-height: 18px;
		font-size: 12px;
		border: 1px solid #ddd;
		border: 1px solid rgba(0, 0, 0, 0.15);
		border-radius: 3px;
		white-space: pre;
		white-space: pre-wrap;
		word-wrap: break-word;
	}

	hr {
		clear: both;
		height: 0;
		margin: 1em 0 .95em;
		border: 0;
		border-bottom: 1px solid #ddd;
	}

	address {
		display: block;
		margin-bottom: 1em;
	}

	.lower { text-transform: lowercase; }
	.upper { text-transform: uppercase; }

	.sup { vertical-align: super; }
	.sub { vertical-align: sub; }


	
		
/* !Columns ============================== */

	/* 	CSS Columns: */
	.columns-2 {
		-webkit-column-count: 2;
		   -moz-column-count: 2;
		        column-count: 2;
		-webkit-column-gap: 2em;
		   -moz-column-gap: 2em;
		        column-gap: 2em;
		-webkit-column-break-inside: avoid;
		          page-break-inside: avoid;
		               break-inside: avoid;
	}
	.columns-2 > * {
		display: table;	/* fix for FF break inside  */
	}
	
	/* 	Float Columns: */
	.col-2 {
		width: 50%;
		float: left;
		padding-right: 2em;
	}
	.col-2:last-of-type {
		padding-right: 0;
	}
	
/* !Buttons & Messages ============================== */
	.button.danger,
	.message.danger,
	.button.danger:hover,
	.message.danger:hover,
	.button.error,
	.message.error,
	.button.error:hover,
	.message.error:hover,
	.button.success,
	.message.success,
	.button.success:hover,
	.message.success:hover,
	.button.info,
	.message.info,
	.button.info:hover,
	.message.info:hover {
		color: #fff;
	}
	.button .close, .message .close, .remove {
		font-family: Arial, sans-serif;
		line-height: 1;
	}
	.button.danger,
	.message.danger,
	.button.error,
	.message.error {
		background-color: #c20726;
		background-image: linear-gradient(to bottom, #ee5f5b, #c43c35);
	}
	.button.success, .message.success {
		background-color: #57a957;
		background-image: linear-gradient(to bottom, #62c462, #57a957);
	}
	.button.info, .message.info {
		background-color: #339bb9;
		background-image: linear-gradient(to bottom, #5bc0de, #339bb9);
	}
	button,
	.button {
		display: inline-block;
		vertical-align: middle;
		margin: .25em 0;
		padding: .934em 1.5em .9em;
		min-width: 6em;

		color: #fff;
		background-color: #c20726;

		text-align: center;
		text-decoration: none;
		text-transform: uppercase;
		letter-spacing: 0.075em;
		
/* 		font: normal  12px/1 montserratregular, "Open Sans", sans-serif; */
		font: normal  12px/1 montserratlight, "Open Sans", sans-serif;
		
		border: 1px solid transparent;
		border-radius: 2px;

		cursor: pointer;
		transition: 0.15s linear all;
		-webkit-appearance: none;
		        appearance: none;
	}
	button.outline,
	.button.outline {
		border: 1px solid currentColor;
		background: #000;
	}
	button.inverse,
	.button.inverse {
		color: #c20726;
		background: #fff;
	}
	button:hover,
	.button:hover {
		color: #c20726;
		background: #fff;
		text-decoration: none;
	}
	button.inverse:hover,
	.button.inverse:hover {
		color: #fff;
		background: #c20726;
	}
	button:active,
	.button:active {
		border-color: #b3d4fc;
	}
	button:focus,
	.button:focus {
		outline: 1px dotted #69ade6;
		outline-offset: 3px;
/* 		color: #69ade6; */
	}
	button.disabled,
	.button.disabled {
		cursor: default;
		background-image: none;
		opacity: 0.65;
		box-shadow: none;
	}
	button[disabled],
	.button[disabled] {
		cursor: default;
		background-image: none;
		opacity: 0.65;
		box-shadow: none;
	}
	
	button + button,
	button + .button,
	.button + button,
	.button + .button {
		margin-left: 2em;
	}

	.message {
		position: relative;
		padding: .75em 1em .5em;
		margin-bottom: 1em;
		color: #444;
		background-color: #eedc94;
		background-repeat: repeat-x;
		background-image: linear-gradient(to bottom, #fceec1, #eedc94);

		border-radius: 3px;
		border: 1px solid rgba(0, 0, 0, .05);
	}
	.message .close {
		text-decoration: none;
		margin-top: 1px;
	}
	.message a {
		font-weight: bold;
		color: #404040;
	}
	.message.danger p a,
	.message.error p a,
	.message.success p a,
	.message.info p a {
		color: #fff;
	}
	.message *:last-child {
		margin-bottom: 0;
	}



/* !Forms ============================== */

	form {
		margin-bottom: 1em;
	}
	fieldset {
		margin-bottom: 1em;
	}
	input[type="text"],
	input[type="password"],
	input[type="email"],
	textarea,
	select {
		border: 1px solid #ccc;
		padding: 4px;
		outline: none;
		border-radius: 2px;
		font: 13px "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
		color: #777;
		margin: 0;
		width: 210px;
		max-width: 100%;
		display: block;
		margin-bottom: 20px;
		background: #fff;
	}
	select {
		padding: initial;
		width: 220px;
	}
	input[type="text"]:focus,
	input[type="password"]:focus,
	input[type="email"]:focus,
	textarea:focus {
		border: 1px solid #aaa;
 		color: #444;
		box-shadow:	0 0 3px rgba(0,0,0,.2); }
	textarea {
		min-height: 60px;
		min-width: 210px;
	}
	label,
	legend {
		display: block;
		font-weight: bold;
		font-size: 13px;
	}
	.input.checkbox label, .input.radio label {
		margin-left: 5px;
		display: inline-block;
	}


	input[type=checkbox], input[type=radio] {
		width: auto;
		height: auto;
		padding: 0;
		margin: 3px 0;
		*margin-top: 0;
		/* IE6-7 */

		line-height: normal;
		border: none;
		display: inline-block;
	}
	input[type=file] {
		background-color: #fff;
		padding: initial;
		border: initial;
		line-height: initial;
		box-shadow: none;
	}
	input[type=button], input[type=reset], input[type=submit] {
		width: auto;
		height: auto;
	}
	select, input[type=file] {
		height: 27px;
		*height: auto;
		line-height: 27px;
		*margin-top: 4px;
		/* For IE7, add top margin to align select with labels */

	}
	select[multiple] {
		height: inherit;
		background-color: #fff;
	}
	textarea {
		height: auto;
	}

	.poll label .description {
		font-weight: normal;
	}


	.input.file p {
		margin: 0;
	}
	input.form-error {
		margin-bottom: 0;
	}
	.error-message {
		color: #ee5f5b;
		margin-bottom: 10px;
	}






/* !Tables	============================== */
	table {
		width: 100%;
		margin-bottom: 1em;
		padding: 0;
		font-size: 1em;
		border-collapse: collapse;
	}
	table th, table td {
		padding: .75em .75em .65em;
		line-height: 1.125;
		text-align: left;
	}
	table th {
		padding-top: 9px;
		font-weight: bold;
		vertical-align: middle;
	}
	table td {
		vertical-align: top;
		border-top: 1px solid #ddd;
	}
	table tbody th {
		border-top: 1px solid #ddd;
		vertical-align: top;
	}
	
	/* 	table types: .condensed-table	and .bordered-table */
	.condensed th, .condensed td {
		padding: 5px 5px 4px;
	}
	.bordered {
		border: 1px solid #ddd;
		border-collapse: separate;
		border-radius: 4px;
	}
	.bordered th + th, .bordered-table td + td, .bordered th + td {
		border-left: 1px solid #ddd;
	}
	.bordered thead tr:first-child th:first-child, .bordered tbody tr:first-child td:first-child {
		border-radius: 4px 0 0 0;
	}
	.bordered thead tr:first-child th:last-child, .bordered tbody tr:first-child td:last-child {
		border-radius: 0 4px 0 0;
	}
	.bordered tbody tr:last-child td:first-child {
		border-radius: 0 0 0 4px;
	}
	.bordered tbody tr:last-child td:last-child {
		border-radius: 0 0 4px 0;
	}
	
	/* 	sortable and zebra-striped tables */
	.striped tbody tr:nth-child(odd) td, .striped tbody tr:nth-child(odd) th {
		background-color: #f9f9f9;
	}
	.striped tbody tr:hover td, .striped tbody tr:hover th {
		background-color: #f5f5f5;
	}
	table .header {
		cursor: pointer;
	}
	table .header:after {
		content: "";
		float: right;
		margin-top: 7px;
		border-width: 0 4px 4px;
		border-style: solid;
		border-color: #000 transparent;
		visibility: hidden;
	}
	table .headerSortUp, table .headerSortDown {
		background-color: #85c446;
		background-color: rgba(133,196,70,.3);
		text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
	}
	table .header:hover:after {
		visibility: visible;
	}



/* !Non-semantic helper classes ============================== */

	/* For image replacement */
	.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; }
	.ir br { display: none; }
	
	/* Hide from both screenreaders and browsers: h5bp.com/u */
	.hidden { display: none !important; visibility: hidden; }
	
	/* Hide only visually, but have it available for screenreaders: h5bp.com/v */
	.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
	
	/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */
	.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
	
	/* Hide visually and from screenreaders, but maintain layout */
	.invisible { visibility: hidden; }
	
	/* Contain floats: h5bp.com/q */
	.clearfix:before, .clearfix:after { content: ""; display: table; }
	.clearfix:after { clear: both; }
	.clearfix { zoom: 1; }
	
	.clear { clear: both; }
