body { margin:0; background-color: #fff; }

#banner {}
#logo { float:left; padding:0; margin: 5px 0; line-height: 1.2;}
#logo img { width:320px; margin-top:0; margin-bottom: 0px;  }

#container {position: relative; width: 100%; font-size: 14px; margin:0; padding:0 2%; z-index: 1;}

.top {font-size: 16px}
.small { line-height: 1.1; }

/* Responsive boxes */
#column-full section#candidates .pinstyle {
width: 48%; margin-right: 1%;}


/* Merch page added 2024 */
section.block.merch {
height: 180px; width: 100%; margin-bottom: 10px;padding: 0 10px 10px 10px;overflow: hidden
}

/* ::: Pink Virginia. 
Daily Events.Boxes for each day main column */

.pinkVA div.event-daily {
position: relative; float: left;
width: 48%; margin-right: 1%; margin-bottom: 10px;
height: 380px; 
background-color: white;
border:solid 4px white; 
border-radius: 20px;
text-align:center;
font-size: 14px;
overflow:hidden;
    }

.pinkVA div.event-daily img {width: 100%}

#pinkVA .block3 {width: 45%; margin-right: 5%; float:none;}

/* :::::::::::::::: BUTTONS ::::::::::::::  */

a.button-r {margin-top: 20px;}


/* ::::::::::::::::::::::: HIDERS ::::::::::::::::::::::: */

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



/* :::::: ELECTIONS :::: */
.block-COTW {
clear:both;
float: none; 
width: 100%; height: auto;
margin-right: .5%; margin-left: .5%;
padding: 0; 
text-align: center; 
vertical-align: top; 
border: none 2px black;
display:block;   
overflow: auto; resize: vertical; 
}

.block-COTW  {
float: none;
width: 100%;
}

.block-COTW img.candidate { width: 100%; }

/* ::::::::::::::: NAVIGATION ::::::::::::: */
#container-nav {
position:relative; left: 0; top: 0px;
display: block;
padding:0;
margin: 0; margin-top: -10px;
}

/* ::::::::::::::::::::::: Pan area   :::::::::::: */

#pan {
position: relative; top:0;
overflow:visible;
z-index:1;
}

#pan img { 
width:100%;  height: auto; opacity: 1; position: relative; top:0; left:0;z-index:1;

}

#pan-text {
position: absolute; top: 0px; left:0; 
width:100%; height: auto; 
padding: 10px 20px;
text-align: center; 
line-height: 1.2;
z-index:2;
}

#pan-text h1 {
font:normal 30px 'Zilla Slab', helvetica; 
color: #fff;
line-height: 1;
 
}

#pan-text h2 {
display:block;
font:normal 24px 'Zilla Slab', helvetica; 
color: #fff; 
line-height: 1;

}



/* :::::::::::: NAVIGATION 
Currently screen nav not on the phone version 
See Nav2 below
::::::::::::: */


#phonenav.shownav {
position: absolute; right: 0px; top:0px;
text-align: left; 
width:100%; height:auto;
clear:both;
display: block;
	background-color: transparent; 
	margin: 0 0 0 10% ; padding:0 20px;
	border: none 2px black;
z-index: 200;
}


#phonenav .hamburger {
position: relative; right: 0px; top: 0px;
font-size: 30px; 
float: right; 
margin-top: 0px; margin-right: 5px;
z-index: 100;
}


#phonenav .detailn {
display: none;
position: absolute; right:0px; top: 0px;
padding: 0 0 50px 50px;
background-color:#5495e5;
width: 80%; height: auto; 
z-index: 200;
}


#phonenav .shownav  h3 {
text-transform: uppercase;
font-size: 12px; 
font-weight: normal; 
color: black; 
letter-spacing: .15em;
}


#phonenav .dropdownmenu2 {
position: relative; top: 0px; 
text-align:left;
width: auto;
	background-color: transparent; 
	padding: 0 ;
	text-transform: none; 
	text-align: left;
	line-height: 1.8; 
	font-size: 16px; 
	color: #fff;
z-index: 6;
}


/* ::::::::::::::: BLOCKS  :::::::::::: */


/* :::::: BLOCKS :::::: */

.block2, block4 {
width: 100%;
margin-left:0; margin-right:0; margin-bottom: 0;
height: auto; 
}


#blocks {
position: relative; top: 20px;
height: auto; width:100%;
}

/* ::::: 2-block setup ::::::: */
#block-main, #column-main,
#block-main.volunteer, 
#block-main.events-calendar 
 {width: 100%; height: auto }


#block-sidebar, #column-sidebar,
#block-sidebar.volunteer, 
#block-sidebar.events-calendar {width: 100%; height: auto }


/* ::::::::::::::: VOLUNTEER :::::::::::: */
#block-main.volunteer { width: 100%; padding: 0 20px; margin:0}
#block-sidebar.volunteer { width: 100%; padding: 20px; text-align: center; margin:0; }


/* :::: ORGANIZATION LIST ::::*/
#container.organizations #block-main {float: left; width: 75%; min-width: 50%;}

#container.organizations #block-sidebar {
float:left; width: 20%; text-align: right; margin-left: 1%
}



/* ::::::::::::::: Homepage w bands   :::::::::::: */

#container.homepage .pan-volunteer {
position: relative; top:20px;
width: 100%; text-align: left; padding:0; 
border: solid 20px #6ca7da; border-width: 20px 0;
}


#container.homepage .pan-volunteer h1 {font-size: 65px }


#container.homepage .band {width: 100%; padding: 20px 0;}
#container.homepage .band h1 {font-size: 40px; color: #fff;  }


/* :::::::: EVENT BLOCKS:GENERAL   :::::::::::: */
.container-blocks { 
margin: 10px; padding: 10px; 
width: 100%; height: auto; }


.block2 {
float: none; 
width: 100%; 
padding: 0 20px;
text-align: left }

/* :::::::: EVENT BLOCKS: HOMEPAGE   :::::::::::: */
#container.homepage .container-blocks { 
margin-top: 10px; padding: 10px 0; 
width: 100%; height: auto; }

#container.homepage .block2 {
float: none; 
width: 100%; 
padding: 0 5%;
text-align: left }

/* meta header */
#container.homepage .block2 h4 {
text-transform: uppercase; letter-spacing: .1em; text-align: left;
}

#container.homepage .block2 h2 { }
/* time and date */
#container.homepage .block2 h3 { font-weight: normal }

#container.homepage .block2 a.moreinfo:link,
#container.homepage .block2 a.moreinfo:visited 
{ font-size: 14px; color: #ee7744;text-transform: uppercase }

#container.homepage .block2 a.moreinfo:hover
 { color: blue }
 
#container.homepage .block2 img {width: 60%}


/* :::::::: EVENT BLOCKS: EVENTS   :::::::::::: */

/* ::::::::::::: Event type: Calls to Action :::::::::::::; */

#column-full.cta .container-blocks {
width: 100%; 
float: none;
padding: 5px;
min-height: 170px;
height:auto;
margin-left: 1%;
text-align: center;
}

#column-full.cta .button { 
display: block; width: 100%; 
font-size:14px; 
border-radius: 14px; padding: 3px 0; 
color: #fff;
margin-top: -5px; margin-bottom: 5px;
}

#column-full.cta  .container-blocks  h1 { 
font:bold 16px 'Roboto Condensed', sans-serif;
}

/* extra text on CALL TO ACTION */
#column-full.cta  .opensesame {position: relative}
#column-full.cta  .detail {
position: absolute; bottom:0;
width: 170px; 
background-color: white; padding:20px; 
text-align: center;
z-index: 800
}


#container.CTApage .container-block { 
width: 45%;
}

/* ::::: POSTCARDS FOR VA :::: */

.pinstyle-p4va {
float: left;
width: 180px;  margin:0;  margin-right: 1%;   margin-bottom: 10px;
height: 270px;
border:solid 2px black; 
 }





/* :::: POWER PACKS :::: */

#column-main-PP {float: none; width: 100%; border:solid 3px #ddd; border-radius: 12px; }
#column-sidebar-PP {float: none; width: 100%; padding-left: 10px; }
#column-sidebar-PP h3 {font-size: 14px; }


.pinstyle-PP {
position: relative;
float: left;
width: 30%; height: 300px; min-width: 150px;  }

/* :::: Election Banner :::: */


#banner-election { 
	position: relative;
	background-color: #203080;  color: #fff;
	height: 250px; 
	text-align: left; 
	padding: 10px 30px 20px 10px;  
	position: relative; top: 0px;
	 }


#banner-election {height: auto; margin-top:0; padding-left: 12px; width: 100%}
.banner-election-title { float:none; width: 100%; }
#banner-election h1 { font-size: 33px; display: inline;  }
#banner-election  h2 { font-size: 20px; margin-left:0;  display: inline; }
#banner-election  h4 { font-size: 20px; margin-left:0;  }


/* :::: Election Banner :::: */



.banner-election-menu {
float: none;  clear: both;  width: 100%; 
position: relative; top: 10px;
font-size: 14px;
margin-left: 24px; 
vertical-align: top; 
border: none;  line-height: 1.4;
}

.banner-election-menu a.r { color: black }





/* ::::::: Candidate GALLERY::::::::  */

 #container.election .pinstyle img {
width: 60%
}

 
section#candidates .pinstyle {
position: relative;
float: left;
width: 30%; max-width: none; height: 260px;  
margin-right: 1%; margin-bottom: 18px;
padding: 10px 0px  5px  0px; 
border-radius: 10px; 
border: solid 4px #fff;
text-align: center;
line-height: 1.3;  
color: #fff; 
z-index: 1;
}

.pinstyle .small { line-height: 1.1; }


#container.fundraising .pinstyle {
width: 30%; max-width: 250px; height: 325px;  
}


/* ::::::: Candidate PROFILES::::::::  */

#col1.profile,  #col2.profile  { 
width: 100%; 
float: none; border: none;  
margin-top: 0; margin-right: 0; margin-left: 0; 
padding: 0 10px 0 10px; 
 }
 
#col1.profile fieldset {border: solid 12px #88bbee }
#col1.profile fieldset legend {font-size: 14px }
#col1.profile img.headshot  { display: block; float: left; margin-bottom: 20px; }
 
#col2.profile  { margin-top: 40px; }
#col2.profile .statistics {font-size: 16px }

#col2.profile iframe {margin-right: 20px; }

/* :::::::::::::::: Articles ::::::::::::::  */

#block-main.article {
width: 100%; 
font-size: 14px; line-height: 1.4;
 }
 
#block-main.article h2 {color: #ee7744; margin: 20px 5px 0px 0; font-size: 24px }
#block-main.article h6 { font-size: 16px }
#block-main.article img { margin-right: 10px }


#block-sidebar.article { width: 100% }

/* :::::::::::::::: Contact us ::::::::::::::  */
#blocks.contactus {background-color:#fff; height:auto }


#block-main.contactus, #block-sidebar.contactus {
float:left; 
height:auto; 
border-radius: 0px; -webkit-border-radius: 0px;
margin-top:0px; margin-left:0px;
background-color:#fff;
padding: 0 5%;
z-index:100;
}


#block-sidebar.contactus {
text-align:left; 
margin:0;padding:0; 
height:auto; min-height: 0px;
border:none}

.phoneno {font-size:30px; color:#000}


.photo-big { display: none }




/* :::::::::::::::: LISTS ::::::::::::::  */

#container.list {width: 100%; padding: 0; margin:0;}


/* :::::::::::::::: COLUMNS ::::::::::::::  */

/* :::::::::::::::: Columns / blocks ::::::::::::::  */
#column-main, #column-sidebar, 
#column-sidebar.hp, #column-main.hp, 
#column-main.advocacy, #column-sidebar.advocacy, 
#column-main.issue, #column-sidebar.issue, 
#column-main.coalition-about, #column-sidebar.coalition-about,
#column-main-PP,  #column-sidebar-PP { 
float: none; 
width: 100%;
position: relative; top: 0; 
border:none 1px gray;
padding: 0 10px;
z-index: 50;
}


#column-center {text-align: center; width: 100%; margin-left:0; padding: 10px; }



#column-sidebar.hp { 
border: none 2px #ee7744;
}

#container.list .container-blocks {
background-color: #fff;
width:100%;
clear:both; 
border-top: dotted 6px  #ee7744; 
padding:6px 0;
z-index: 200;
}

.block2-small {
float: left; 
vertical-align: top;
padding-left: 10px; }

.block2-small img.headshot {
width: 90px; float:right; margin-right: 0px; }

.block2-small .dateblock {
width: 40%; 
color:#000;
font-size: 12px;
line-height: 1.2; 
text-align: right; 
float:left;
margin-right: 12px;
border:none 1px black }

.block2-small .dateblock h3 { 
font-size: 18px; 
text-transform: uppercase;
}

.block2-small .dateblock .button-medium {font-size: 16px; padding:3px; border-radius: 2px; margin-top:0}

.block2-small.textblock {
width: 50%;
font-size: 14px;
text-align: left;  
line-height: 1.4;
margin-top:0; padding-top: 0;
}

.block2-small.textblock img {
float: right;
}

.block2-small.textblock h3 {
font-size: 24px;
color: #000;
text-align: left; 
padding-bottom:0; margin-bottom:0; 
}

/*
#container.homepage .block3 {
float:left; 
width: 48%;
margin-right: 1%;
padding: 20px;
border-radius: 20px;
margin-bottom: 20px;

}
*/



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

a.button {font-size: 11px ; padding: 2px}


a.button-medium:link, a.button-medium:visited, a.button-medium:active { 
font-size: 16px; 
color: #fff; padding: 3px 10px; 
background-color: #1e68b6; 
border: none 2px #fff; border-radius: 8px;
}



/* ::::: Buttons  4 up :::: */
a.button-4up:link, a.button-4up:visited, a.button-4up:active {
float: left; 
width: 23%; height: 60px; 
margin:0; margin-left: 1%;
vertical-align: middle;
padding: 5px 0 5px 0; 
border: solid 3px #fff; border-radius: 12px;
font-size: 11px; color: #fff;
line-height: 1.4;
}
a.button-4up:hover { opacity: .8;}

a.button-4up:link h2 {font-size: 14px; font-weight: bold; color: white }



a.button-3up:link h2 {font-size: 14px}



/* :::::::::::::::: Footers ::::::::::::::  */


/* PINSTYLE Women's Summit 2020 */

.pinstyle.WS {
position: relative;
float:left; 
width: 31%; 
min-height: 250px; height: auto;
margin-right: 1%;
border: solid 1px #ccc;
color:#888;
}
.pinstyle.WS img {width: 95%;}
.pinstyle.WS {padding: 5px; text-align: center; font-size: 12px}
.pinstyle.WS h3 {font: bold 14px 'Robato Condensed', helvetica, arial; color:black;}
.pinstyle.WS b {font: bold 12px helvetica, arial; color:#555;}


/* :::::::: EVENT BLOCKS:GENERAL
2021 08 changes to .container-block   :::::::::::: */

.container-block { 
width: 46%; height: 170px; float:left;}

.poster img { 
vertical-align: middle;
width: 100%;  height: auto}

div.container-image {
background-color:white;
position:relative;
width: 100%;
height: 120px;
overflow:hidden;
}

.block2 {
float: none; 
width: 100%; 
padding: 0 5%;
text-align: left }


/* :::::::::: LINKS :::::::::::::::::::::: */

A:link { text-decoration: none; color:#2b52af}
A:active { text-decoration: none; color:#2b52af  }
A:visited { text-decoration: none; color:#2b52af  } 
A:hover{ text-decoration: none; color:#6ca7da }

A.r:link { text-decoration: none; color:#ffffff}
A.r:active { text-decoration: none; color:#ffffff  }
A.r:visited { text-decoration: none; color:#ffffff  } 
A.r:hover{ text-decoration: none; color:#ffeebb; }

A.red:link { text-decoration: none; color:#c62a33}
A.red:active { text-decoration: none; color:#c62a33  }
A.red:visited { text-decoration: none; color:#c62a33  } 
A.red:hover{ text-decoration: none; color:#ee7744; }



/* :::::::::::::::: VOTE ::::::::::::::  */
/* side by side boxes change to 100% on phone */
.voteoption { }

.voteoption h2 {
font: 400 20px helvetica, arial, sans-serif 
}