/*
* NashvilleVotes
* Copyright 2015, Compound
* www.nashvillevotes.com
* 04.01.2015
* 
* The robbed who smiles has stolen something from the thief
*/


/* Table of contents
––––––––––––––––––––––––––––––––––––––––––––––––––
- Universal
- Header
- Register
- Countdown
- Pledge
- Candidates
- Candidate Colors
- The Issues
- Footer
- Utility Classes
*/



/* Universal
–––––––––––––––––––––––––––––––––––––––––––––––––– */

/* apply a natural box layout model to all elements */
/**, *:before, *:after {
	  -webkit-box-sizing: border-box;
	     -moz-box-sizing: border-box;
	     	  box-sizing: border-box;
}*/

html {
	font-family: 'Montserrat', sans-serif;
	text-rendering: optimizeLegibility;
}

body {
	font-family: 'Montserrat', sans-serif;	
	font-weight: 400;
	color: #4077F2;
	/*zoom: 0;*/
}

a {
	text-decoration: none;
	color: #4077F2;
	padding-bottom: 3px;
	border-bottom: 3px solid #4077F2;
}

a:hover {
	/*color: #c0392b;*/
	color: #ED7878;
	/*border-bottom: 3px solid #c0392b;*/
	border-bottom: 3px solid #ED7878;
}

.white-font {
	color: white;
}

.white-font a {
	color: white;
	border-bottom: 3px solid white;
}

.white-font a:hover {
	color: #ED7878;
	border-bottom: 3px solid #ED7878;
}



h1 {
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
	c
}

h2 {
	font-weight: 700;
}

.clearfix {
	clear: both;
}

/* Header
–––––––––––––––––––––––––––––––––––––––––––––––––– */

header {
	height: 90vh;
	/*padding-top: 1px;*/
	/*display: block;*/
	/*position: relative;*/
	/*top: 0;*/
	overflow: hidden;
}

.container {
	position: relative;
}

.logo {
	float: left;
	width: 125px;
	display: inline-block;
}

.logo-mobile {
	text-align: left;
	/*position: absolute;*/
	/*top: 0;*/
	width: 100px;
	display: none;
	/*margin-bottom: 100px;*/
}

.header-nav-bar {
	/*display: block;*/
}

nav {
	color: ;
	float: right;
}

nav li {
	display: inline;
	
	padding: 10px;
}

.nav-pledge-button {
	border: 3px solid #4077F2;
	padding: 3px 20px;
}

.nav-pledge-button:hover {
	border: 3px solid #ED7878;
}

.nav-pledge-button-2 {
	color: #ED7878;
	border-bottom: 3px solid #ED7878;
}

.nav-pledge-button-2:hover {
	color: #D56C6C;
	border-bottom: 3px solid #D56C6C;
}

.nav-pledge-button-3 {
	border: none;
	padding: 8px 20px;
	color: white;
	background-color: #4077F2;
}

.nav-pledge-button-3:hover {
	border: none;
	color: #4077F2;
	background-color: white;
}

.nav-pledge-button-4 {
	border: none;
	padding: 5px 18px;
	color: #ED7878;
	/*background-color: #ED7878;*/
	border: 3px solid #ED7878;
	/*border-radius: 20px;*/
	vertical-align: baseline;
}

.nav-pledge-button-4:hover {
	border: none;
	padding: 5px 18px;
	background-color: #BE6060;
	background-color: #ED7878;
	border: 3px solid #ED7878;
	color: white;

}

.header-intro {
	padding-bottom: 40px;
	position: absolute;
	bottom: 0;
	/*color: white;*/

}

.header-intro p {
	margin-bottom: 0;
}

/* Smaller than phablet */
@media (max-width: 750px) {
	.header-nav-bar {
		/*display: none;*/
	}

	.logo-mobile {
		display: block;
	}
}


/* Register instruction & Map
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.register-wrapper {
	background-color: #4077F2;
	/*color: white;*/
}

#register {

}

#register ol {
	list-style-position: outside;
	padding-left: 27px;
}

.nested-list {
	list-style-type: none;
	line-height: 1.2em;
	font-weight: 400;
	margin-top: 5px;
	margin-left: 0px;
	font-size: 80%;
}

.nested-list li {

}

.map-wrapper {
	height: 350px;
	padding: 0;
	display: block;
}

.map-wrapper iframe {
	border: 0;
	box-shadow: 10px 10px 0px #3A6BDA;
}

.no-scroll, .no-scroll iframe {
	pointer-events: none;
}


/* Countdown
–––––––––––––––––––––––––––––––––––––––––––––––––– */


#countdown p {
display: inline-block;
padding: 5px;
background: none;
margin: 0 0 20px;
}



/* Pledge
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.pledge-wrapper {
	background-color: #ED7878;
	/*color: white;*/
	border-top: 5px solid white;
	border-bottom: 5px solid #D56C6C;
	border-bottom: 5px solid #BE6060;

}

#pledge {

}

.email-button {

}

/* Smaller than phablet (also point when grid becomes active) */
@media (max-width: 550px) {
	.email-button {
		margin-top: 20px;
	}
}


.pledge-privacy {
	font-size: 80%;
	color: #D56C6C;
	color: #BE6060;
	padding-top: 20px;
}

/* Candidates
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.candidates-wrapper {
	/*background-color: #34495e;*/
	/*background-color: #bdc3c7;*/
	background-color: #ecf0f1;
}

.candidates-wrapper h2 {
	/*color: #4077F2;*/
}

.candidate-headshot {
	/*max-width: 150px; */
	width: 90%;
	display: block;
	margin: 15px auto;
	/*padding: 8%;*/
}

/* candidate name */
h6 {
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-size: 16px;
	margin-bottom: 10px;
	text-align: center;
}

.candidates-wrapper p, .candidates-wrapper ul, .candidates-wrapper li {
	font-size: 60%;
	margin-bottom: 10px;
}

.candidates-wrapper li {
	margin-bottom: 5px;
}

.candidate-title {
	/*color: #2c3e50;*/
	/*font-size: 50%;*/
	/*margin-bottom: 10px;*/
}

/* social icons */

.social-icon-wrapper {
	text-align: center;
}

.social-icon-wrapper a, .social-icon-wrapper a:hover {
	text-decoration: none;
	border: none;
}

.social-icon-wrapper img {
	width: 25px;
	margin: 0 5px;
}

.social-icon-wrapper a img:hover {
	-webkit-filter: opacity(60%);
	   -moz-filter: opacity(60%);
			filter: opacity(60%);

}


/* Candidate colors
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.barry h6 {color: #E74C3C;}
.barry-background {background-color: #E74C3C;}

.bone h6 {color: #D35400;}
.bone-background {background-color: #D35400;}

.fox h6 {color: #E2BB1F;}
.fox-background {background-color: #E2BB1F;}

.freeman h6 {color: #2ECC71;}
.freeman-background {background-color: #2ECC71;}

.gentry h6 {color: #2A8DC4;}
.gentry-background {background-color: #2A8DC4;}

.kane h6 {color: #2C3E50;}
.kane-background {background-color: #2C3E50;}

.rebrovick h6 {color: #9B59B6;}
.rebrovick-background {background-color: #9B59B6;}


/* The Issues
–––––––––––––––––––––––––––––––––––––––––––––––––– */


/* Footer
–––––––––––––––––––––––––––––––––––––––––––––––––– */
footer {
	text-align: center;
	padding: 20px;
	background-color: #2c3e50;
}

footer p {
	margin: 0;
	font-size: 80%;
}

/* Utility
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.u-max-width {
	max-width: 960px;
	margin: 0 auto;
}

.u-v-centered {
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	   -moz-transform: translateY(-50%);
	   	    transform: translateY(-50%);
}

.u-padding-top {
	padding-top: 40px;
	padding-bottom: 40px;
}

.u-full-height {
	height: 100%;
}

.u-absolute-top {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
}

.u-absolute-bottom {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
}

.u-margin-bottom {
	margin-bottom: 40px;
}

.u-align-center {
	text-align: center !important;
}

/* Smaller than tablet */
@media (max-width: 750px) {
	.u-mobile-hide {
		display: none;
	}
}

/* Smaller than phablet (also point when grid becomes active) */
@media (max-width: 550px) {
	.u-align-center {
		text-align: left;
	}
}



/* Media Queries
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/*
Note: The best way to structure the use of media queries is to create the queries
near the relevant code. For example, if you wanted to change the styles for buttons
on small devices, paste the mobile query code up in the buttons section and style it
there.
*/



/* Smaller than Desktop HD */
@media (max-width: 1200px) {}

/* Smaller than desktop */
@media (max-width: 1000px) {}

/* Smaller than tablet */
@media (max-width: 750px) {}

/* Smaller than phablet (also point when grid becomes active) */
@media (max-width: 550px) {}

/* Smaller than mobile */
@media (max-width: 400px) {}