/* COLORS 

Blue lt: #4aa3dd
Blue : #1e68b6
Red: c12422;  bf2025 9b1e22
Red lt: f16d73 ef6e75
*/

.bg-blue {background-color: #1e68b6 }
.bg-blue-lt {background-color: #4aa3dd }
.bg-red-lt {background-color: #f16d73 }
.bg-red {background-color: #c12422 }
.blue {color: #1e68b6 }
.blue-lt {color: #4aa3dd }
.red {color: #9b1e22 } 
.red-lt {color: #ee9999 }
.white {color: #fff }
.black  {color: #000}
.gray  {color: #888}  
.gray-lt  {color: #ccc} 


/* ::::::::::::::::::::::: Site-wide ::::::::::::::::::::::: */

* { box-sizing: border-box; }

.hide-screen {display: none }
.hide-phone {display: inline }
.hide-phone-pad {display: inline }

body {
background-color:#fff; 
/* margin: 20px 5%; */
margin: 20px 0 10px 0; 
	text-align:center;
	font: 200 16px 'Zilla Slab', arial, sans-serif; 
	line-height: 1.5;
	color: #555;

}

#container { 
position: relative; top: 0; 
background-color:#fff; 
width: 100%; min-height: 600px; height: auto;
border: none 1px black } 

h1 {
 margin:0;padding:0; font-size: 34px; line-height: 1.1; font-family: 'Zilla Slab', sans-serif;
}


h2 {color: #fff; margin:0;padding:0; font-size: 30px; font-weight: 100; line-height: 1.2; }

.box-sidebar h2 {font-size: 18px }


h3  
{color: #fff; margin:0; padding: 8px 0 0 0 ; font-size: 20px; font-weight: 600; line-height: 1.2; font-family: 'Zilla Slab', serif;}

h4 
{color: #fff; margin:0;padding-top: 20px; font-size: 18px; font-weight: 600;} 

h5 /* bolded */
{color: #008866; margin:0;padding:0; font-size: 16px; font-weight: 600; display:inline; } 

h6 /* tagline */
{color: #fff; margin: 20px 0 0 0; padding: 20px 0; font-size: 20px; font-weight: 200; font-style: italic; margin-top: -15px} 


p { text-align: left; font-size: 20px; line-height: 1.6 }

img {border:none; margin: 0 5px 5px 0;  }
em {font-style: normal; font-weight: bold }
sup {color: #888}
.small {font-size: 12px }
.attribution { font: normal 12px helvetica, arial, sans-serif }
.more {font: normal 16px helvetica, arial, sans-serif }
li {list-style: square; }
.instruction {font: normal 15px helvetica,arial, sans-serif; text-transform: uppercase; line-height: 1.3; letter-spacing: .05em }
.text-basic {font: normal 20px helvetica, arial, sans-serif;  }
.intro-date {font: normal 14px helvetica, arial, sans-serif; color: #777 }

/* ::: Social media. This is a absolute block   ::: */
#container-sm {
width: 50px;
display: block;
position: absolute; top: 90px; right: 60px;
z-index: 110; 
}

#container-sm img {border: solid 2px #fff }



/* ::: BANNER   ::: */

#banner { 
position: relative; 
background-color: #4aa3dd; 
width: 100%; height: 180px; 
text-align: left;
border: none 2px #000;
padding: 2% 7%;
z-index: 20
}





/* #nav {width: 100%; height: 30px;
text-align: center; 
color: #fff;
letter-spacing: .04em; 
}

#nav a:link, #nav a:visited, #nav a:active { color:#fff; text-decoration: none; font: normal 14px  arial, sans-serif } 
#nav a:hover { color:#ffffff; border-bottom: solid 1px #ffffff; }
*/


/* ::::: Nav with dark type  ::::: */
 
#nav2 {
position: relative; 
width: 100%; height: 30px;
text-align: center; 
color: #fff;
letter-spacing: .04em; 
z-index: 120;
}

#nav2 a:link, #nav2 a:visited, #nav2 a:active {  text-decoration: none; font: normal 14px  arial, sans-serif } 
#nav2 a:hover {  border-bottom: solid 1px #1e68b6; }



#logo {background-color:#4aa3dd; text-align: left; margin-left: 0}
#logo img {width: 450px }
#logo.hp img {width: 80% }
#logo.vote img { width: 180px; } 
#logo.vote { height: 70px; padding: 0 }

/* ::::::::::::::::::::::: Buttons ::::::::::::::::::::::: */



a.button:link, a.button:visited, a.button:active { 
width: auto; 
font-size: 18px; 
padding: 15px; 
background-color: #1e68b6;
color: #fff;
text-decoration: none;
text-align: center;
border: none 2px #fff; 
border-radius: 30px;
margin-top: 20px;
}

a.button:hover { 
 background-color: #4aa3dd;
 color: white; 
 padding-left: 20px; padding-right: 20px; 
}

a.button-r:link, a.button-r:visited, a.button-r:active { 
width: auto; 
font-size: 18px; 
padding: 15px; 
background-color: #fff;
color: #1e68b6;
text-decoration: none;
text-align: center;
border: none 2px #fff; 
border-radius: 30px;
margin-top: 20px;
}

a.button-r:hover { 
 background-color: #4aa3dd;
 color: white; 
 padding-left: 20px; padding-right: 20px; 
}


a.button-small:link, a.button-small:visited, a.button-small:active { 
padding: 3px 8px; 
color: #ffffff; 
background-color: #1e68b6; 
border: none 2px #fff; 
border-radius: 10px; }
a.button-small:hover { background-color: #1e68b6; color: #fff;}




a.button-medium:link, a.button-medium:visited, a.button-medium:active { 
font-size: 30px; 
color: #fff; padding: 10px; 
background-color: #1e68b6; 
border: solid 2px #fff; border-radius: 20px;
}
a.button-medium:hover { background-color: #1e68b6;}


a.button-donate2:link, a.button-donate2:visited, a.button-donate2:active { 
display: block;
width: 100%;
	text-align: center;
	font-size: 24px; 
	color: #fff; padding: 10px; 
	background-color: #1e68b6; 
border: none 2px #fff; border-radius: 10px;
}
a.button-donate2:hover { background-color: #1e68b6; }



/* ::::::::::::::::::::::: Columns ::::::::::::::::::::::: */

/* :: Container for columns: 
Toolkit   :: */

#blocks {position: relative; top:0; width: 100%; padding: 0 30px; }

/* ::::::: Single Columns :
Index 
Presentations
Candidate matrix 
Action page 
Issues 
Vote ::::::  */

#column-full {width: 100%; padding: 0 50px; }


.bar { position: relative; top: 0; width: 100%; padding: 30px; } 
.bar h1 {font-size: 40px }


/* :::::::: Homepage Columns ::::::::: */
#column1.hp { float: left; text-align: left; width: 60%; padding: 0 30px; margin-right: 0; } 
#column1.hp ul { text-align: left }
#column1.hp, #column1.hp ul li, #column1.hp p { font-size: 16px; }
#column1.hp b { font-size: 18px; }

#column2.hp  { float: left; text-align: left; width: 35%; margin-left: 3%; padding: 0; font: normal 14px helvetica, arial, sans-serif; }


/* :: add image to list on hp :::
#column1.hp li { list-style-image: url('images/arrow-right3.png'); } */


/* ::::::: Sign up Columns ::::::  */
#column1 { float: left; width: 49%; margin-right: 3%; font-size: 18px; background-color: #fff; color: #555; padding-left: 30px;}

#column1 h1 { color: #1e68b6; }

#column2.signup { float: left; width: 48%; background-color: #fff;  margin-top: -100px }


/* ::::::: volunteer  Columns ::::::  */
 #column1.volunteer { float: left; width: 47%;}
 #column2.volunteer { float: left; width: 44%; padding-left: 2%}



/* ::::::::::::::::::::::: Video display  ::::::::::::::::::::::: */
.video-embed { width: 100%; height: 260px; border:solid 8px #1e68b6; }
.graphic-hp { width: 100%;  border:solid 8px #fff; }

#column2.hp iframe {margin-top: 10px; }



/* ::::::: Candidate profiles::::::::  */

#col1 { background-color:#fff; width: 55%; 
float: left; border: none;  
margin-top: 0; margin-right: 0;
font-size: 16px; line-height: 24px; 
padding: 0 30px; 
 }
 
#col1 p {font-size: 18px; }

#col1 .location {
padding-top: 10px;
font: normal 14px helvetica, arial, sans-serif; 
color: #4aa3dd;
line-height: 1.8; 
}

#col2.sidebar {
position: relative; right: 0; top: 0px;
background-color:#ffffff; 
width: 45%; float: left;  border: none;
font: normal 14px helvetica, arial, sans-serif; line-height: 1.6;  color: white; 
padding: 10px 30px; }

.box-sidebar {
background-color:#4aa3dd; 
padding: 10px 20px;
font-size: 12px; 
color: #fff;
margin-bottom: 0px;
border: solid 1px white; 
}


.box-sidebar h2 { font-size: 16px }


.box-sidebar h3 {font-size: 24px }

.box-sidebar-standsfor {
background-color:#fff; 
padding: 10px 20px;
font-size: 118px; 
color: #1e68b6;
margin-bottom: 0px;
border: solid 10px #1e68b6; 
border-radius: 10px;
margin-bottom: 20px; 
}

.box-sidebar-standsfor h2 { font-weight: 800; font-size: 30px; }

.box-sidebar-standsfor i {  font-size: 16px; }







#col1 .special {font-size: 20px; font-weight: normal; color: #1e68b6; }

#nav-candidates { 
position: absolute; top: 10px; right: 0px;
line-height: 5px; 
width: 230px; height: auto;
padding: 0px; 
background-color: transparent;
z-index: 120; }

#nav-candidates img { width: 35px; height: 35px; margin-right: 1px; border:solid 1px #fff; font-size: 10px; line-height: 1}

#col2.sidebar h3.votes { text-transform: none; color: #1e68b6; line-height: 18px; }

/* ::::::::::::::::::::::: Boxes ::::::::::::::::::::::: */


/* :::::::: CANDIDATES :::::: */
.box-candidate {
position: relative; 
width: auto; height: auto; 
float:left; 
	text-align: center;   
border: solid 1px #fff;
margin-right: 2%; margin-bottom: 1%;
background-color: #1e68b6;
line-height: 15px;
padding: 0 0;
color: #fff;
overflow: hidden;
}

.box-candidate img { margin: 0 }

.box-candidate .name {font-size: 16px; color: #fff; letter-spacing: -.01em }
.box-candidate .dist {
font: normal 13px arial, sans-serif; color: #abf; text-transform: uppercase}

/* ::::::::::::::::::::::: Presentations ::::::::::::::::::::::: */


.box-video { 
float: left; 
width: 40%;
height: 320px; 
margin-right: 20px; margin-bottom: 20px; 
font: normal 14px helvetica, arial, sans-serif;
overflow: hidden;
padding: 0; margin: 0
}


.box-video img  {border: solid 2px black; margin-top: 10px;}

.box-video iframe {margin-top: 10px;}

/* ::::::::::::::::::::::: issues ::::::::::::::::::::::: */
.learnmore,  .learnmore p { font: normal 12px verdana; line-height: 1.4 ; color: #888; padding: 8px}

 learnmore hr { border: dotted 1px #4aa3dd; margin-top: 20px }
.learnmore h3 { font-size: 26px }





/* :::::::: ISSUES :::::: */

.box-issue {
position: relative; 
width: 19%; height: 300px; 
text-align: center;
float:left; 
border: solid 4px #1e68b6; 
  /*  border: solid 4px #50a5db;*/
margin-right: 1%; margin-bottom: 1%;
	background-color: #fff;
	border-radius: 5px;
padding: 10px;
overflow: hidden;
}


.box-issue .label { 
clear:both;
position: absolute; top: 0px; left: 0;
vertical-align: center; 
text-align: center;
width: 100%; height: 58px; 
/* font: bold 17px helvetica, arial, sans-serif; letter-spacing: 0;*/
 font: normal 17px 'Zilla Slab', georgia, serif; letter-spacing: 0; 
letter-spacing: 0;
text-transform: uppercase; 
color: #ffffff; 
background-color: #1e68b6;
padding: 5px; margin: 0; 
 }
 
/*.box-issue h1.label { font-size: 17px; normal 17px 'Zilla Slab', georgia, serif; letter-spacing: 0; }*/


.box-issue p {
margin-top: 60px; 
text-align: center;
font: 400 16px helvetica, arial, sans-serif; 
line-height: 1.3;
color: #555555;
}

.box-issue .arrow { color: #1e68b6; font-size: 24px }



/* ::::::::::::::::::::::: Actions ::::::::::::::::::::::: */

.box-action {
position: relative; 
width: 80%; height: auto; 
text-align: center;   
/* border: solid 12px #1e68b6; */
margin-bottom: 20px;
	 background-color: #1e68b6;
	/*font: 800 24px helvetica, arial, sans-serif; 
	line-height: 1.2;
	*/
	padding: 20px 30px;
color: #fff;
overflow: visible;
-moz-border-radius: 40px;
	border-radius: 40px;
}

.box-action h1 {
font-size: 40px; 
text-transform: uppercase;
margin-bottom: 0; padding-bottom: 0;
}

.box-action h2 {
font: 100 26px helvetica, arial, sans-serif; 
text-transform: none;
margin-bottom: 0; padding-bottom: 0;
}

.box-action h4 {
font: normal 18px helvetica, arial, sans-serif; 
text-transform: none;
margin-top: 0; padding-top: 0;
}

.box-action .link {
font: normal 14px helvetica, arial, sans-serif; 
text-transform: uppercase;
color: #fff; 
}

.box-action p { text-align: center }
.box-action #nav-candidates-h { width: 100%; height: auto; }
.box-action #nav-candidates-h img { width: 60px; border: solid 2px #fff;}



.circle { 
width: 60px;
border:none 4px #1e68b6;
background-color:#1e68b6;
-moz-border-radius: 40px;
	border-radius: 40px;
padding: 8px 20px;
	color: #fff; 
	font-weight: bold; 
	font-size: 32px;
	display: inline;
margin-right: 10px;
	}
	

/* ::::::::::::::::::::::: Voter code table ::::::::::::::::::::::: */

#codes { 
width: 70%; 
background-color: #fff; 
border: solid 4px black; 
padding: 20px 0; 
text-align: center; 
margin-left:  15%; 
margin-right:  15%
 }



table.voter-info { 
text-align: center; 
width: 100%; 
background-color: transparent;
margin-left:auto; 
    margin-right:auto;
}

#codes h2 { font-size: 28px }

table.voter-info th  {font: normal 12px helvetica, arial, sans-serif; color: #000; 
text-align: left; padding: 5px;  border-bottom: solid 2px #1e68b6; border-top: solid 2px #1e68b6;}

table.voter-info td {font: normal 12px helvetica, arial, sans-serif; color: #333; text-align: left; padding: 5px;  border-bottom: solid 1px #1e68b6;}

table.voter-info td:first-child {font-weight: bold; font-size: 16px; color: #1e68b6; padding-left: 10px;}


 

table.voter-info tr {  }

/* ::::::::::::::::::::::: Links ::::::::::::::::::::::: */

.nav a:link, .nav a:visited, .nav a:active {text-decoration: none; color: #fff; letter-spacing: .1em }
.nav a:hover {text-decoration: none; color:#feb }


a:link, a:visited, a:active { text-decoration: none; color: #1e68b6 }
a:hover { text-decoration: none; color: #000 }

a.r:link, a:visited, a.r:active { text-decoration: none; color: #ffffff }
a.r:hover { text-decoration: none; color: #ffffff }
 
a.d:link, a.d:visited, a.d:active { text-decoration: none; color: #1e68b6 }
a.d:hover { text-decoration: none; color: #000 }

/* ::::::::::::::::::::::: Footer ::::::::::::::::::::::: */

#footer {
position: relative; top: 15px;
text-align: left;
background-color: transparent;
height: auto; width: 100%; 
	color: #555; 
	font: normal 12px helvetica, arial, sans-serif;
	line-height: 1.4; 
margin-top: 0px;
padding: 5px 30px;

}

#footer.home  {width: 100%; height: auto;}
#footer img  {width: 200px; color: white;}
#footer.home  img {width: 220px}