
.wrapper {
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	background-color: #2C3E50;
}
.content-wrapper { background-color: #d4d8dc; padding-bottom: 20px; }
.content-header {
	width: 100%;
	height: 50vh;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: top center;
	position: relative;
}
@media (max-width: 767px) {
	.content-header { height: 40vh; }
}
.content-header-overlay {
	background: rgba(0,0,0,0.25);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.content-header-overlay h1 { font-size: 48px; }
.content-header-overlay span { font-size: 24px; }
@media (max-width: 767px) {
	.content-header-overlay h1 { font-size: 24px; }
	.content-header-overlay span { font-size: 14px; }
}
.main-content {
	width: 80vw;
	margin: -20vh auto 0 auto;
	position: relative;
	z-index: 999;
	background: #FFF;
	box-shadow: 0 0 2px rgba(0,0,0,.12), 0 2px 4px rgba(0,0,0,.24);
}
#show_result,
#close_result { position: absolute; top: -10px; right: -10px; z-index: 10001; }

/**
* VOTER PROFILE
*/
.voter-profile { margin-bottom: 5px; border-bottom: 1px solid #E4E4E4; }
.voter-profile .row { margin: 0 0 5px 0; padding: 0; }
.voter-profile [class*="col-"] { padding: 4px 8px; }

/**
* POSITION
*/
.position-wrapper { position: relative; }
#selected_num { position: absolute; top: 20px; right: 20px; }
.position-wrapper #message { min-height: 24px; }
.position-title { position: relative; }
.position-order { position: absolute; top: -2px; left: -2px; }

/**
* CANDIDATE
*/
.candidate-list {  }
.candidate-item { padding: 10px; transition: 250ms all ease-in-out; height: 240px !important; }
.candidate-item .candidate-wrap { border: 1px solid #E4E4E4; padding: 5px; cursor: pointer; transition: 250ms all ease-in-out; position: relative; }
.candidate-item .candidate-check { opacity: 0; transition: 250ms all ease-in-out; position: absolute; top: 0; right: 0; }
.candidate-item.selected { padding-top: 6px; padding-bottom: 14px; }
.candidate-item.selected .candidate-wrap { box-shadow: 0 10px 10px -10px rgba(0, 166, 90,.75); border: 2px solid #008d4c; }
.candidate-item.selected .candidate-check { opacity: 1; }
.candidate-image { height: 200px; text-align: center;  overflow: hidden; }
.candidate-image img { display: block; margin: 0 auto; }
.candidate-name {
	
}

/**
* VOTE RESULT
*/
.voted-list { list-style: none; padding-left: 10px; margin: 0; }
.voted-item { margin: 0 0 2px 0; padding: 0; display: block; overflow: hidden; border-bottom: 1px solid #E4E4E4; }
.voted-item .voted-img,
.voted-item .voted-name { float: left; }
.voted-item .voted-img { height: 50px; width: 50px; border: 1px solid #E4E4E4; }
.voted-item .voted-name { height: 50px; padding-left: 30px; font-weight: bold; font-size: 14px; line-height: 50px; }

/**
* FINAL RESULT
*/
.result-wrapper { position: relative; }

/**
* SIGN UP
*/
.signup-button { width: 100%; background-color: #d4d8dc; }
.signup-button .btn { background-color: #415161; border: none; padding: 16px 24px; font-size: 2em; transition: all 250ms; text-transform: uppercase; }
.signup-button .btn:hover { background-color: #2C3E50; }
@media (max-width: 767px) {
	.signup-button .btn { padding: 8px 12px; font-size: 1.25em; }
}

.section-title { width: 100%; background: #FFF; margin: 0; }
.section-title p { width: 100%; font-size: 1.5em; }
@media (max-width: 767px) {
	.section-title p { font-size: 1em; }
}

.message { display: none; color: #900; font-weight: bold; }
.message.success { color: #090; }
.message.success,
.message.fail { display: block; }

/**
* SOCIAL AND SEARCH
*/
.search { display: inline-block; }
.search i { color: #111; cursor: pointer; }
.search input {
  background: transparent;
  border: 0 none;
	border-bottom: 1px solid transparent;
  width: 0;
	padding: 4px 8px;
  color: #111;
  -webkit-transition: all 600ms;
  -moz-transition: all 600ms;
  -ms-transition: all 600ms;
  -o-transition: all 600ms;
  transition: all 600ms;
	outline: none;
}
.search input:focus { outline: none; }
.search input::-webkit-input-placeholder { color: transparent; }
.search input:focus,
.search input:active,
.search:hover input { width: 300px; padding: 10px; border-color: #d4d8dc; }
.search input:focus::-webkit-input-placeholder { color: #111; }
.search input:active::-webkit-input-placeholder { color: #111; }
.search:hover input::-webkit-input-placeholder { color: #111; }

/**
* HEADER
*/
.navbar { border-radius: 0; margin: 0; padding: 0; background: #2C3E50; }
.navbar >.container .navbar-brand{ margin-left: 0; }
.navbar-brand { padding: 0; margin:0; }
.navbar-inverse .navbar-brand { font-size: 36px; line-height: 50px; color: #fff; }
.navbar-nav{ margin: 0; height: 100%; }
.navbar-nav>li{ display: block; padding-bottom: 2px; height: 100%; }
.navbar-inverse .navbar-nav > li > a {
	padding: 0 12px;
  margin: 0;
  color: #FFF;
  line-height: 50px;
	height: 50px;
  display: inline-block;
	border-bottom: 3px solid transparent;
	transition: all 600ms;
}
.navbar-inverse .navbar-nav > li > a:hover{ border-color: #FFF; }
.navbar-inverse { border: none; }
.social-menu { text-align: right; }
.social-menu .search input,
.social-menu .search i,
.social-menu .search input:focus::-webkit-input-placeholder,
.social-menu .search input:active::-webkit-input-placeholder,
.social-menu .search:hover input::-webkit-input-placeholder { color: #FFF; }
.social-menu .network{ display: inline-block; list-style: none; padding: 0; margin: 0; }
.social-menu .network li { display: inline-block; }
.social-menu .network li a {
	display: inline-block;
	color: #fff;
	background: transparent;
	width: 25px;
	height: 25px;
	line-height: 25px;
	text-align: center;
	border-radius: 2px;
	padding: 0;
}
.social-menu .network li a:hover { background: #c52d2f; color: #fff; }
@media (max-width: 767px) {
	.social-menu { text-align: center; margin-top: 30px; }
	.social-menu .search,
	.social-menu .network { display: block; }
}


/**
* GO TO TOP
*/
#gototop {
	display: none;
	width: 50px;
	height: 50px;
	position: fixed;
	bottom: 0;
	right: 0;
	line-height: 65px;
	text-align: center;
	font-size: 65px;
	margin: 25px;
	color: #2C3E50;
	transition: all 250ms;
	border: 1px solid transparent;
}
#gototop:hover {
	color: #d33724;
}

/**
* FOOTER
*/
footer { background: #041422; color: #FFF; }
footer ul { list-style: none; margin: 0; padding: 0; }
footer ul li { margin: 0; padding: 0; text-align: right; font-size: 1.25em; padding: 0.25em; }
footer ul li a { color: #FFF !important; border-bottom: 1px solid transparent; text-decoration: none !important; }
footer ul li a:hover { background: none !important; border-bottom: 1px solid red; }

/**
* ERROR 404
*/
.error404 { background: #FFF; height: 100%; }
.error404 .jumbotron { background: #FFF; }































