/*VOTE Minneapolis Website
 Author: Grant E. Johnson
*/
/*  LAYOUT STYLES
----------------------------------------------------------------------*/
body {width:100%; position:relative; margin:0;}
html {border-top: solid #004684 4px; margin:0; padding:0;}
#header {height:180px; padding: 0; position:relative; background: url('header-skyline.png') no-repeat center 3px; z-index:20;}
#top-logo {margin:0;padding-left: 10.833333333333333333333333333333%; /* 130px / 1200px  */}
#top-nav {position:absolute; top:0px; right: 13.33333333333333%; /* 160px / 1200px */  list-style:none; height:16px;}
#top-nav li {float:left; padding-left:20px;} 
#top-nav li:first-child {padding-left:0;} 
#top-nav li a {font-weight:bold; color:#868686; text-decoration:none;}
#top-nav li.current a {color:#225f94;}
#top-nav li a:hover {text-decoration:underline;}
.social-links {position:absolute; top:47px; right: 9.1666666666666666666666666666667%; /* 110px / 1200px  */ }
.social-links a {margin-left:2px;}
.facebook-icon {display:inline-block; width:34px; height: 34px; background: url('facebook_icon.png') no-repeat 0 0;}
.twitter-icon {display:inline-block; width:34px; height: 34px; background: url('twitter_icon.png') no-repeat 0 0;}
.youtube-icon {display:inline-block; width:34px; height: 34px; background: url('youtube_icon.png') no-repeat 0 0;}
.three11-icon {display:inline-block; width:34px; height: 34px; background: url('311_icon.png') no-repeat 0 0;}
/* Search icon by IcoMoon, made with http://icomoon.io/app/ */
.sb-search {
	position: absolute;
	top:0;
	right: 9.1666666666666666666666666666667%;
	width: 0%;
	min-width: 34px;
	height: 34px;
	float: right;
	margin-left:8px;
	overflow: hidden;
	-webkit-transition: width 0.3s;
	-moz-transition: width 0.3s;
	transition: width 0.3s;
	-webkit-backface-visibility: hidden;
}
input[type="text"].sb-search-input {
	position: absolute;
	top:0;
	right:0;
	border: none;
	outline: none;
	background: #ccc;
	width: 475px;
	height: 34px;
	margin: 0;
	padding: 0;
	text-indent:10px;	
	z-index: 10;
	font-family: inherit;
	font-size: 20px;
}
.sb-search-input::-webkit-input-placeholder {
	color: #2b2b2b;
}
.sb-search-input:-moz-placeholder {
	color: #2b2b2b;
}
.sb-search-input::-moz-placeholder {
	color: #2b2b2b;
}
.sb-search-input:-ms-input-placeholder {
	color: #2b2b2b;
}
.sb-icon-search {
	position: absolute;
	top:0;
	right:0;
	padding: 0;
	margin: 0;
	background: #fff url('search_icon_on.png') 0 0 no-repeat;
	z-index: -1;
	display:block;
	width: 34px;
	height: 34px;
	cursor: pointer;
	}
input[type="submit"].sb-search-submit {
	position: absolute;
	top:0;
	right:0;
	padding: 0;
	margin: 0;
	background: #fff url('search_icon_off.png') 0 0 no-repeat;
	z-index: 11;
	width: 34px;
	height: 34px;
	cursor: pointer;
	border:none;
}
/* Open state */
.sb-search.sb-search-open,.no-js .sb-search {width: 475px;}
.sb-search.sb-search-open .sb-icon-search, .no-js .sb-search .sb-icon-search {z-index: 91;}
.sb-search.sb-search-open .sb-search-submit, .no-js .sb-search .sb-search-submit {z-index: 90;}
#election-day {position: absolute; top:95px; right: 9.1666666666666666666666666666667%; /* 110px / 1200px */  
border-bottom: 9px solid #ce0d12;white-space:nowrap;}
.container{width: 1200px; margin: 0 auto; padding:0; position:relative;}
.banner-wrapper {width:100%; background: #ccc; text-align:center; margin:0;	padding:0; line-height: 0; z-index:5;}
.hidden {position: absolute; left: -999px; top:auto; width:1px; height:1px; overflow:hidden;}
.wrap3col { 
	float: left;
	width:58.333333333333333333333333333333%; /* 700px / 1200px */
	margin-left:10.833333333333333333333333333333%;/* 130px / 1200px */
}
#body-content {
	float:right;
	width:62.857142857142857142857142857143%; /* 440px / 700px */
	margin-left:5.7142857142857142857142857142857%; /* 40px / 700px */
	margin-top:1.6em;
	margin-bottom:2em;
}
#leftcol {
	float:left;
	width:31.428571428571428571428571428571%; /*220px / 700px */
	margin-bottom:2em;
}
#rightcol {
	float:right;
	width:18.333333333333333333333333333333%; /*220px / 1200px */
	margin-right: 8.3333333333333333333333333333%; /*110px  / 1200px */
	margin-top:20px;
	margin-bottom:2em;
}
.wrap2col { 
	float: left;
	width:80%; /* 960px / 1200px */
	margin-left:10.833333333333333333333333333333%;/* 130px / 1200px */
}
.wrap2col #body-content {
	width:72.916666666666666666666666666667%; /* 700px / 960px */
	margin-left:4.1666666666666666666666666666667%; /* 40px / 960px */
}
.wrap2col #leftcol {
	float:left;
	width:22.916666666666666666666666666667%; /*220px / 960px */
}
/* SUPERFISH Primary Nav Styles
----------------------------------------------------------------------*/
.topnav-wrapper {
	position:absolute;
	top:133px;
	width:100%;
	background-color:#2b2b2b;
	text-align:center;
}
.sf-menu, .sf-menu * {
	margin: 0;
	padding: 0;
	list-style: none;
}
ul.sf-menu { 
	width: 960px; /*re-size in mediaquery*/
	margin:0 auto;
	padding:0;
}
ul.sf-menu li { width: auto;}
.sf-menu li {
	position: relative;
	width:auto;
	text-align:left;
}
.sf-menu ul {
	position: absolute;
	display: none;
	top: 100%;
	left: 0;
	z-index: 5;
}
.sf-menu > li {float: left;}
.sf-menu li:hover > ul,
.sf-menu li.sfHover > ul {
	display: block;
}
.sf-menu a {
	display: block;
	position: relative;
	color:#fff;
}
.sf-menu > li > a {
	font-size:17px;
	font-size:1.13rem; 
	font-family:'Fjalla One', sans-serif;
}
.sf-menu ul ul {
	top: 0;
	left: 100%;
}
.sf-menu ul {
	box-shadow: 2px 2px 6px rgba(0,0,0,.2);
	min-width: 13em; /* allow long menu items to determine submenu width */
	*width: 13em; /* no auto sub width for IE7, see white-space comment below */
}
.sf-menu a {
	padding: .8em;
	text-decoration: none;
	zoom: 1; /* IE7 */
}
.sf-menu li {
	background: #2b2b2b;
	white-space: nowrap; /* no need for Supersubs plugin */
	*white-space: normal; /* ...unless you support IE7 (let it wrap) */
	-webkit-transition: background .2s;
	transition: background .2s;
}
.sf-menu > li > a:hover  {color:#fff;}
.sf-menu ul li {
	background: #4a4a4a;
	background-color:rgba(64,64,64,.9);
}
.sf-menu li:hover,
.sf-menu li.sfHover {
	background-color:#4a4a4a;
	/* only transition out, not in */
	-webkit-transition: none;
	transition: none;
}
.sf-menu li li:hover,
.sf-menu li li.sfHover {
	background-color:#c80c15;
}
.sf-menu li.current {background: #4a4a4a;}
.sf-menu li.current a {color:#fff;}
.sf-menu li.current li a  {
	color:#fff;
	font-size: 12px;
	font-size: 0.85714286rem;
	font-family: Arial, sans-serif;
}
/*Mobile Nav Styles*/
#mobile-nav-btn {
    display: none;
    background: url('mobile-nav.png') no-repeat center center;
    width:50px;
    height:47px;
    cursor: pointer;
}
/* Left Nav Styles
----------------------------------------------------------------------*/
.section-nav, .section-nav * {
	padding:0;
	margin:0;
	background:#f5f5f5;
	list-style: none;
}
.section-nav .section-title {
	display:block;
	background: url('side-blue-flag.png') no-repeat left center;
	padding-left:30px;
	padding-top:.5em;
	padding-bottom:.5em;
	font-weight:normal;
	font: 1.8em 'Fjalla One', sans-serif;	
	color: #004684;
	text-transform:uppercase;
}
.section-title a {text-decoration:none;}
.section-nav a, .secondary a {
	display: block;
	font: 1em Arial, sans-serif;
	padding:.6em 1em;
	text-decoration:none;
	font-weight:bold;	
}
.section-nav li {border-bottom: 1px solid #fff;}
.section-nav .current {background-color:#c80c15;}
.section-nav a.current {color:#fff;}
#footer {height: 125px; background: #2b2b2b; position:relative;}
#footer a {color:#fff;}
#footer a:hover {color:#fff;}
.footer-logo {position:absolute; top:10px; left:12.5%; /* 150px / 1200px  */}
.footer-links {position:absolute; top:30px; left:25%; /* 300px / 1200px  */color:#fff;font-size:11px; font-size:0.78571429rem;}
.wcm-region-marker {opacity: 1 !important; z-index:99999;}
.resultcol {width: 33%; float: left;}
.expandheading {background: #f5f5f5 url('expand-plus-red.png') no-repeat 10px 13px; padding:9px 2px 9px 34px; cursor:pointer;}
.expandheading:hover {background: #c80c15 url('expand-plus-white.png') no-repeat 10px 13px; color:#fff;}
.close {background: #f5f5f5 url('expand-minus-red.png') no-repeat 10px 13px;}
.close:hover {background: #c80c15 url('expand-minus-white.png') no-repeat 10px 13px; color:#fff;}
.expandcontent {margin-left:1em;}
.expandall {float:right; font:.8em Arial;}
/* CLEARFIX
----------------------------------------------------------------------*/
.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
.clearfix {
	display: inline-block;
	display:block;
}
html[xmlns] .clearfix {
	display: block;
}
* html .clearfix {
	height: 1%;
}
/* FLEXIBLE IMAGES, VIDEO
----------------------------------------------------------------------*/
img, object {
	height: auto;
    max-width: 100%;
    width: auto;	
	*-moz-box-sizing:none;
	*-webkit-box-sizing: none;
	*box-sizing: none;
	*behavior:none;	
}
.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px; 
    margin-bottom:1.5em;
    height: 0; overflow: hidden;
}
.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 81%;
    height: 100%;
}
/*------------------------------------------------------------------------------------------------------
	Under 1200px
--------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:1200px) {
	.container{width: 1000px; }
	.topnav-wrapper {min-width: 1000px;}
	ul.sf-menu {width: 800px;}
	.sf-menu > li > a {font-size:14px;	font-size:0.875rem;}
	.sf-menu a {padding: .95em 1.1em;}
	a.btn_large {width: auto;}	
	.footer-links {font-size:10px; font-size:0.71428571rem;}
	.guide h3 {	font-size:12px;	font-size:0.85714286rem;}
}

/*------------------------------------------------------------------------------------------------------
	Under 1000px
--------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:1000px) {
	.container{width: 100%; }
	#top-logo {margin:0;padding-left: 1%; /* 10px / 1000px*/}	
	#top-nav {right: 6%; /* 60px / 1000px */ }	
	.sb-search {right: 0;}
	.social-links {right: 1%; }
	#election-day {right: 1%;}	
	.footer-logo {left:2%; }
	.wrap3col {margin-left:1%;/* 10px / 1000px */width:72%;/* 720px / 1000px */}
	#leftcol {width:30.555555555555555555555555555556%;/* 220px / 720px */}
	#rightcol {width:22%; /* 220px / 1000px */	margin-right: 1%; /*10px  / 1000px */}
	#body-content {margin-left:1%; /* 40px / 720px */ margin-top:1.6em;	width: 66.666666666666666666666666666667%; /* 480px / 720px */}	
	.wrap2col {margin-left:1%;/* 10px / 1000px */ width:98%; /* 780px / 1000px */}
	.wrap2col #body-content {width:77%; /* 780px / 1000px */margin-left:1%; /* 40px / 960px */}
	.wrap2col #leftcol {width:22%; /*220px / 1000px */}
	.banner-wrapper {width:100%;}
	.topnav-wrapper {min-width:750px;}
	ul.sf-menu { width: 100%;}
	.sf-menu a {padding: .95em .9em;}
}
/*------------------------------------------------------------------------------------------------------
	Under 768px
--------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:768px) {
	 #mobile-nav-btn {display: block;}
    .topnav-wrapper {text-align:left;}
   #election-day {display:none;}
    .sf-menu {width: 100%!important; display: none; z-index:25;}
    .sf-menu.xactive {display: block!important;}
    .sf-menu li {float: none!important; display: block!important; width: 100%!important;}
    .sf-menu li a {float: none!important;}
    .sf-menu ul {position:static!important; display: none!important; }
    .xpopdrop ul {display: block!important;}
    .wrap3col {margin-left:1%;/* 10px / 768px */width:99%;/* 720px / 1000px */}
	#body-content {margin-left:1%; /* 40px / 720px */ margin-top:1.6em;	width: 66.66666666666%; /* 480px / 720px */}	
    #leftcol {width:30.5555555555%;/* 220px / 720px */}
	#rightcol {float:none;clear:both; width:68.4444444445%;/* 220px / 720px */	margin-left: 31.5555555555%;}
	.wrap2col {margin-left:1%;/* 10px / 1000px */ width:98%; /* 780px / 1000px */}
	.wrap2col #body-content {width: 66.66666666666%; /* 480px / 720px */ margin-left:1%; /* 40px / 960px */}
	.wrap2col #leftcol {width:30.5555555555%;/* 220px / 720px */}
	.topnav-wrapper {min-width:0;}
	.footer-links {left:140px;}
	ul.sf-menu { width: 100%;}
}
/*------------------------------------------------------------------------------------------------------
	Under 600px
--------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:600px) {
	#top-nav {right: 14%;}	
	#top-nav li {padding-left:12px;} 
	#top-nav li:first-child {display:none;}	
	.sb-search.sb-search-open, .no-js .sb-search, input[type='text'].sb-search-input {width:94%;/* 564px / 600px */}
	.blue-title {font-size: 1.3em;}
	.red-title {font-size: 1.3em;}
	.footer-links {top:8px;}
	.resultcol {float:none; width:100%;}
}
/*------------------------------------------------------------------------------------------------------
	Under 480px -- Superfish Mobile Nav http://jsfiddle.net/6vp3U/
--------------------------------------------------------------------------------------------------------*/
@media only screen and (max-width: 480px) {
	#header {height:160px;}
	.social-links {top:118px; right:4px; z-index:50; }	
	ul#top-nav > li.translate {display:none;}
	.topnav-wrapper {top: 108px; border-top: 5px solid #ce0d12;}
	.wrap3col, .wrap2col  {float:none;width:100%; margin:0;}
	#leftcol, #rightcol, #body-content,.wrap2col #body-content,.wrap2col #leftcol{float:none; width:99%; margin-left: 1%; margin-right: 1%;}
}
/*------------------------------------------------------------------------------------------------------
	Under 320px
--------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:320px) {
	#footer {height: 200px;}
}