/*
Theme Name: Zellnor Myrie for New York State Senate
Theme URI: http://www.zellnormyrie.com
Description: Custom WordPress theme developed for Zellnor Myrie for New York State Senate. Design by Raphael Del Rio. Development by Studio Simpatico.
Author: Tamara Olson
Author URI: http://www.studiosimpati.co
Version: 1.1
*/

/***************************************************************************************************************************************************************************************/

/*HTML5 BOILERPLATE MINIFIED*/

/***************************************************************************************************************************************************************************************/

*{box-sizing:border-box;}article{display:block}aside{display:block}details{display:block}figcaption{display:block}figure{display:block;margin:0}footer{display:block}header{display:block}hgroup{display:block}nav{display:block}section{display:block}audio{display:inline;zoom:1}canvas{display:inline;zoom:1}video{display:inline;zoom:1}audio:not([controls]){display:none}[hidden]{display:none}html{font-size:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;font-family:sans-serif;color:#222}button{font-family:sans-serif;color:#222;font-size:100%;vertical-align:middle;line-height:normal;cursor:pointer;-webkit-appearance:button;overflow:visible;margin:0}input{font-family:sans-serif;color:#222;font-size:100%;vertical-align:middle;line-height:normal;margin:0}select{font-family:sans-serif;color:#222;font-size:100%;vertical-align:middle;margin:0}textarea{font-family:sans-serif;color:#222;font-size:100%;overflow:auto;vertical-align:top;resize:vertical;margin:0}body{font-size:1em;line-height:1.4;margin:0}::-moz-selection{background:#333;color:#fff;text-shadow:none}::selection{background:#333;color:#fff;text-shadow:none}a{color:#00e}a:hover{color:#06e;outline:0}a:active{outline:0}abbr[title]{border-bottom:1px dotted}b{font-weight:700}strong{font-weight:700}blockquote{margin:1em 40px}dfn{font-style:italic}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}ins{background:#ff9;color:#000;text-decoration:none}mark{background:#ff0;color:#000;font-style:italic;font-weight:700}pre{font-family:monospace, serif;_font-family:'courier new', monospace;font-size:1em;white-space:pre-wrap;word-wrap:break-word}code{font-family:monospace, serif;_font-family:'courier new', monospace;font-size:1em}kbd{font-family:monospace, serif;_font-family:'courier new', monospace;font-size:1em}samp{font-family:monospace, serif;_font-family:'courier new', monospace;font-size:1em}q{quotes:none}q:before{content:none}q:after{content:none}small{font-size:85%}sub{font-size:75%;line-height:0;position:relative;vertical-align:baseline;bottom:-.25em}sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;top:-.5em}ul{margin:1em 0;padding:0 0 0 40px}ol{margin:1em 0;padding:0 0 0 40px}dd{margin:0 0 0 40px}nav ul{list-style:none;list-style-image:none;margin:0;padding:0}nav ol{list-style:none;list-style-image:none;margin:0;padding:0}img{border:0;-ms-interpolation-mode:bicubic;vertical-align:middle}svg:not(:root){overflow:hidden}form{margin:0}fieldset{border:0;margin:0;padding:0}label{cursor:pointer}legend{border:0;margin-left:-7px;white-space:normal;padding:0}input[type="button"]{cursor:pointer;-webkit-appearance:button;overflow:visible}input[type="reset"]{cursor:pointer;-webkit-appearance:button;overflow:visible}input[type="submit"]{cursor:pointer;-webkit-appearance:button;overflow:visible}button[disabled]{cursor:default}input[disabled]{cursor:default}input[type="checkbox"]{box-sizing:border-box;width:13px;height:13px;padding:0}input[type="radio"]{box-sizing:border-box;width:13px;height:13px;padding:0}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}input[type="search"]::-webkit-search-cancel-button{-webkit-appearance:none}button::-moz-focus-inner{border:0;padding:0}input::-moz-focus-inner{border:0;padding:0}input:invalid{background-color:#f0dddd}textarea:invalid{background-color:#f0dddd}table{border-collapse:collapse;border-spacing:0}td{vertical-align:top}.chromeframe{background:#ccc;color:#000;margin:.2em 0;padding:.2em 0}

/* Layout */
html { font-size: 100%; }
body { background: #009CDE; color: #000; font: 1rem 'Martel', Helvetica, sans-serif; -webkit-font-smoothing: antialiased; }
.container { clear: both; margin: 0 auto; max-width: 1150px; padding: 0 20px; position: relative; }
.flex-container { display: flex; flex-wrap: wrap; justify-content: space-between; }
.accessibility { backface-visibility: hidden; left: -999999999px; position: absolute; }
img { height: auto; max-width: 100%; }
iframe { max-width: 100%; }
#site-wrapper { background-color: white; border: 30px solid #009CDE; border-bottom: 0; }

/* Links and Typography */
a { text-decoration: none; transition: all .25s ease; }
h1,h2,h3,h4,h5 { font-family: 'Montserrat'; margin: 0; }
h1.heading1, h2.heading1 { font-weight: 900; font-size: 4.5rem; }

/* Additional Typography */

/* Forms */
input, button { font-family: 'Montserrat'; }
button, input[type=submit] { background-color: #0D2763; color: white; font-size: .875rem; font-weight: 600; text-transform: uppercase; border: 0; border-radius: 3px; letter-spacing: 1px; }
input[type=text], input[type=email], input[type=tel] { border-radius: 2px; font-size: .75rem; padding: 10px 14px; border: 1px solid #009CDE; }
input[type=text]:focus, input[type=email]:focus, input[type=tel]:focus { outline: none; border-color: #0D2763; }


/* Page Hero */
.page-hero { position: relative; height: 100vh; width: 100%; max-height: 720px; background-size: cover; background-position: top center; }
section#homepage-hero .container, #platform-hero .container { height: 100vh; max-height: 720px; }


/* XXX WARNING - I COPY-PASTED THIS CSS TO THE CUSTOM CSS SPOT IN THE THEME MENU EDITOR, BECAUSE I WASN'T SURE HOW TO FORCE USER BROWSERS TO REFRESH WHEN I UPDATED THE CSS. THAT DUPLICATED CSS SHOULD EVENTUALLY BE DELETED ONCE IT'S BEEN LONG ENOUGH THAT ALL BROWSERS HAVE PICKED UP THE CHANGES */
@media only screen and (min-width: 700px) {
section.social-section { display:flex; padding-bottom: 80px; padding-top: 80px; }
div.social-column { width: 33%; }
div.social-wrapper { padding-left: 17px; padding-right: 17px; }
}
@media only screen and (max-width: 699px) {
section.social-section { padding-top:25px; }
div.social-wrapper { padding:25px; }
}

/***************************************************************************************************************************************************************************************/

/* Header */
header { position: absolute; width: 100%; top: 0; left: 0; z-index: 99; }
header a.logo { width: 196px; z-index: 999; position: absolute; display: inline-block; background-color: #F4F4F4; border-top: 10px solid #0D2763; padding: 21px 18px 16px 18px; }
header a.logo img { max-width: 160px; }
header a.logo::after { position: absolute; bottom: -20px; left: 0; content: ' '; width: 0; height: 0; border-left: 98px solid transparent; border-right: 98px solid transparent; border-top: 20px solid #F4F4F4; }
header .container { padding: 0 47px; max-width: 1204px; }
ul#menu-main { padding-top: 52px; text-align: right; width: 100%; }
ul#menu-main li { display: inline-block; margin-left: 32px; }
ul#menu-main li a { font-size: .875rem; font-weight: 600; font-family: 'Montserrat'; color: white; text-transform: uppercase; letter-spacing: 1px; }
ul#menu-main li a:hover { text-decoration: underline; }
ul#menu-main li.contribute a { background-color: #C42C37; color: white!important; padding: 10px 20px; }
ul#menu-main li.contribute a:hover { text-decoration: none; }
.archive ul#menu-main li a { color: #4F4F4F; }
header .mobile-menu { display: none; }

/* Footer */
footer { background-color: #009CDE; }
footer a { color: white; font-family: 'Montserrat'; font-size: .625rem; font-weight: 600; letter-spacing: 1px; text-transform: uppercase; }
footer a:hover { color: white; text-decoration: underline; }
/* Office */
div.office-footer { display: flex; justify-content: space-between; }
div.office-info { text-align: center; padding: 6px 0; width: 340px; margin: auto; color: white; font-family: 'Montserrat'; font-size: .625rem; font-weight: 600; display: inline-block; }
div.office-info a { color: white; font-family: 'Montserrat'; font-size: .625rem; font-weight: 600; }
/* Social */
ul.social-icons { text-align: center; background-color: #C42C37; padding: 6px 0; width: 160px; margin: auto; display: inline-block; margin-right: 10px }
ul.social-icons li { display: inline-block; }
ul.social-icons li a { color: white; font-size: 24px; display: inline-block; margin: 0 10px; padding: 6px 0; }
/* Menu */
ul#menu-footer { position: relative; width: 100%; max-width: 550px; margin: 37px auto 80px; text-align: center; border-top: 1px solid #19B2F2; border-bottom: 1px solid #19B2F2; padding: 15px 0; }
ul#menu-footer::before { border-left: 6px solid #009CDE; border-right: 6px solid #009CDE; background-repeat: no-repeat; top: -14px; left: 50%; margin-left: -40px; content: ' '; background-image:url('img/footer_logo.png'); width: 68px; height: 31px; background-size: 100%; position: absolute; }
ul#menu-footer li { display: inline-block; margin: 0 10px; }
/* Secondary */
ul#menu-footer-secondary { margin: 0 0 75px; padding: 0; text-align: center; }
ul#menu-footer-secondary li { list-style: none; }
ul#menu-footer-secondary li a { text-transform: none; }

/***************************************************************************************************************************************************************************************/

/* SHARED ELEMENTS */

/* Language Toggle */
ul.language-toggle { padding: 2px 12px; border: 1px solid #7F7F7F; border-radius: 2px; margin: 0 auto; display: inline-block; }
ul.language-toggle li { display: inline-block; }
ul.language-toggle li a { cursor: pointer; color: white; text-transform: uppercase; font-size: .625rem; letter-spacing: 1px; font-weight: 600; font-family: 'Montserrat'; margin: 0 10px; }

/***************************************************************************************************************************************************************************************/

/* PAGE - Homepage */
.page-template-page-home header::before { content: ' '; display: block; position: absolute; width: calc(100% - 60px); top: 30px; left: 30px; height: 100px; background: linear-gradient(rgba(0,0,0,.4), rgba(0,0,0,0)); }
/* Hero */
section#homepage-hero { background-image: url('img/zellnor_main_headshot.jpg'); }
#circle-callout { padding: 10px; text-align: center; position: relative; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); background-color: white; border-radius: 200%; width: 350px; height: 350px; float:right; }
#circle-callout > div { padding-top: 31px; border-radius: 200%; width: 330px; height: 330px; border: 10px solid #009CDE; text-align: center; }
#circle-callout p { font-size: .875rem; color: #C42C37; font-weight: 600; font-family: 'Montserrat'; }
#circle-callout input[type=text], #circle-callout input[type=email] { width: 200px; display: block; margin: -1px auto; }
#circle-callout button { padding: 10px 16px; margin-top: 20px; }
#circle-callout img { max-width: 145px; margin: 0 auto; }
#circle-callout input[type=text], #circle-callout input[type=email], #circle-callout input[type=tel] { border-radius: 0; }
#circle-callout input[type=submit] { padding: 7px 10px; margin-top: 10px; }
/* Donate */
#donate {  padding: 10px; position: absolute; top: 90%; right: 130px; }
#donate a { 
	background-color: #C42C37; 
	color: white!important; 
	padding: 10px 20px; 
	font-size: .875rem; 
	font-weight: 600; 
	font-family: 'Montserrat'; 
	text-transform: uppercase; 
	border-radius: 3px;
	letter-spacing: 1px; 
}
#donate a:hover { text-decoration: none; }
/* Callouts */
section#homepage-callouts { background-color: white; }
section#homepage-callouts ul { margin: 0; padding: 0; display: flex; flex-wrap: wrap; }
section#homepage-callouts ul li { width: 33.33%; text-align: center; list-style: none; border-left: 1px solid #E0E0E0; padding: 25px 0 22px; }
section#homepage-callouts ul li:last-of-type { border-right: 1px solid #E0E0E0; }
section#homepage-callouts ul li h2 { color: #009CDE; font-size: .9375rem; font-weight: bold; text-transform: uppercase; font-weight: 600; letter-spacing: 1px; }
section#homepage-callouts ul li p { max-width: 85%; margin: 10px auto; font-size: 0.6875rem; line-height: 1.25rem; color: #474747; }
section#homepage-callouts ul li a { font-family: 'Montserrat'; font-size: 0.6875rem; font-weight: 600; color: #C42C37; border-bottom: 3px solid #009CDE; padding-bottom: 3px; }
/* Video */
section#homepage-video div {
	position: relative;
	padding-top: 25px;
	padding-bottom: 37.45%; /* 16:9 56.25% */
/*	padding-bottom: 37.45%; /* 16:9 56.25% */
/*	height: 0; */
}
section#homepage-video div iframe {
	position: absolute;
	top: 10%;
	left: 10%;
	width: 80%;
	height: 80%;
}
/* Map */
section#homepage-map { position: relative; padding-top: 58px; padding-bottom: 85px; text-align: center; background-image:url('img/blue_map_bg.jpg'); background-size: cover; background-position: center; }
section#homepage-map::after { position: absolute; top: -1px; left: 50%; content: ' '; width: 0; height: 0; border-left: 13px solid transparent; margin-left: -13px; border-right: 13px solid transparent; border-top: 14px solid white; }
section#homepage-map h3 { margin-bottom: 10px; letter-spacing: 1px; font-size: .9375rem; text-transform: uppercase; color: white; }
section#homepage-map h2 { color: white;  }
section#homepage-map p { color: white; max-width: 460px; margin: 10px auto 0; font-size: .75rem; line-height: 1.5rem; }
section#homepage-map ul { margin: 0; padding: 0; -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; color: white; max-width: 350px; margin: 22px auto 45px; }
section#homepage-map ul li { margin-bottom: 22px; font-size: .75rem; font-family: 'Montserrat'; text-align: left; list-style: none; color: white; text-transform: uppercase; letter-spacing: 1px; }
section#homepage-map p.help-text { line-height: .875rem; font-size: .625rem; font-family: 'Montserrat'; }
section#homepage-map a.help-text { line-height: .875rem; color: white; font-family: 'Montserrat'; font-size: .625rem; border-bottom: 1px solid white; padding-bottom: 2px; }

/***************************************************************************************************************************************************************************************/

/* PAGE - About */
/* Hero */
#about-hero { text-align: center; }
#about-hero div { position: absolute; width: 100%; bottom: 60px; left: 0; color: white; }
#about-hero h1 { font-weight: 900; }
#about-hero p { font-size: .875rem; font-weight: 400; font-family: 'Montserrat'; margin-bottom: 0; }
/* Content */
#about-content { text-align: center; background-color: #2A2A2A; color: white; padding-top: 42px; position: relative; }
#about-content::after { position: absolute; top: 0; left: 50%; content: ' '; width: 0; height: 0; border-left: 13px solid transparent; margin-left: -13px; border-right: 13px solid transparent; border-top: 14px solid #F4F4F4; }

#about-content p { font-size: .75rem; line-height: 1.75rem; }
#about-content div p { margin: 30px 0; }
#about-content div.intro p { font-size: 18px; line-height: 2.125rem; }
.about-content-container { text-align: left; max-width: 730px; margin: 0 auto; display: none; padding-bottom: 114px; }
.about-content-container.active { display: block; }

/***************************************************************************************************************************************************************************************/

/* PAGE - Platform */
/* Hero */
#platform-hero { text-align: center; }
#platform-hero h1 { position: absolute; width: 65.7%; color: white; text-align: left; left: 8.81%; bottom: 60px; font-size: 1.5rem; line-height: 2.25rem; font-weight: 900; }
/* Content */
#platform-content ul.language-toggle { margin: 0 auto 40px; }
#platform-content ul.language-toggle li a { color: #000; }
#platform-content { text-align: center; background-image:url('img/zellnor_platform_map_bg.jpg'); padding: 52px 0 85px; }
#platform-content .container { max-width: 580px; margin: 0 auto; }
#platform-content h2 { text-align: left; font-weight: 600; font-size: .9375rem; text-transform: uppercase; letter-spacing: 1px; margin-top: 30px; }
#platform-content h2:first-of-type { margin-top: 0; }
#platform-content p { text-align: left; font-size: .75rem; line-height: 1.5rem; }
/* Newsletter */
#platform-newsletter { text-align: center; padding: 23px 0; }
#platform-newsletter p { display: inline-block; margin: 0 20px 0 0; font-size: .875rem; color: #C42C37; font-weight: 600; font-family: 'Montserrat'; }
#platform-newsletter form { display: inline-block; }
#platform-newsletter input[type=text], #platform-newsletter input[type=email], #platform-newsletter input[type=tel] { border-radius: 0; margin-left: -4px; }
#platform-newsletter form input[type=submit] { padding: 9px 22px 10px; }
#platform-newsletter div { display: inline; }
/***************************************************************************************************************************************************************************************/

/* PAGE - No IDC */
/* Hero */
#idc-hero { padding-top: 100px; text-align: center; }
#idc-hero::before { content: ' '; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-color: rgba(0,0,0,.8);}
#idc-hero .container { max-width: 584px; }
#idc-hero h1 { position: relative; padding-bottom: 20px; margin-bottom: 50px; font-size: 5.25rem; color: #C42C37; font-weight: 900; border-bottom: 10px solid white; }
#idc-hero h1::after  { position: absolute; bottom: -24px; left: 0; content: ' '; width: 0; height: 0; border-left: 14px solid transparent; border-right: 14px solid transparent; border-top: 14px solid white; left: 50%; margin-left: -7px; }
.new-york-wrapper { position: relative; margin-top: 20px; }
#new-york-line { margin: 0 auto; display: block; background-image:url('img/nystate_white.png'); width: 50px; background-size: 100%; height: 41px; }
#new-york-line::before { content: ' '; position: absolute; left: 0; top: 16px; height: 10px; width: calc(50% - 40px); display: block; background-color: white; }
#new-york-line::after { content: ' '; position: absolute; right: 0; top: 16px; height: 10px; width: calc(50% - 40px); display: block; background-color: white; }
#idc-hero span.top-tagline { font-size: .75rem; margin-bottom: 26px; display: block; color: white; text-transform: uppercase; font-family: 'Montserrat'; letter-spacing: 1px; font-weight: 600; }
#idc-hero p { color: white; text-align: left; font-size: .75rem; line-height: 1.5rem; }
/* Video */
#idc-video-wrapper { max-width: 600px; margin: 0 auto; background-color: #C42C37; padding: 10px; margin-top: -50px; position: relative; z-index: 9; }
#idc-video { width: 100%; display: block; border: 2px solid white; padding: 10px; }
/* Content */
#idc-content { padding-bottom: 57px; }
#idc-content .container { max-width: 580px; marign: 0 auto; }
#idc-content ul { margin: 0; padding: 0; }
#idc-content h2 { text-align: center; color: #C42C37; font-size: .9375rem; text-transform: uppercase; font-weight: 600; letter-spacing: 1px; margin-top: 45px; margin-bottom: 24px; }
#idc-content p { font-size: .75rem; line-height: 1.5rem; }
#idc-content p a { color: #009CDE; border-bottom: 1px solid #009CDE; }
#idc-members { display: flex; flex-wrap: wrap; }
#idc-members li { margin-bottom: 10px; margin-right: 30px; font-family: 'Montserrat'; text-transform: uppercase; font-size: .75rem; letter-spacing: 1px; list-style: none; width: calc((100% - 30px) / 2); background-color: #C42C37; color: white; font-weight: 600; }
#idc-members li:nth-of-type(2n) { margin-right: 0; }
#idc-members li img { width: 65px; height: 65px; margin-right: 18px; }
#idc-consequences li { list-style: none; position: relative; padding-left: 46px; }
#idc-consequences li::before { display: block; content: ' '; position: absolute; left: 0; width: 32px; height: 28px; background-size: 100%; background-image:url('img/warning_sign.svg'); }
#idc-links { margin-top: -20px; }
#idc-links li { list-style: none; width: 100%; text-align: center; }
#idc-links li a { color: #009CDE; font-weight: 600; font-size: .75rem; display: inline-block; text-decoration: underline; font-family: 'Montserrat'; }

/***************************************************************************************************************************************************************************************/

/* PAGE - Press */
#press { padding: 120px 0; }
.left-col { width: 56.8%; margin-right: 11.7%; }
#press-pieces { margin: 0; padding: 0; }
#press-pieces li { margin-bottom: 24px; list-style: none; }
#press ul.tabs { margin: 30px 0 0 0; padding: 0; display: flex; }
#press ul.tabs li { cursor: pointer; font-family: 'Montserrat'; list-style: none; font-size: .9375rem; color: #4F4F4F; letter-spacing: 1px; text-transform: uppercase; margin-right: 30px; padding-bottom: 6px; margin-bottom: 30px; border-bottom: 6px solid transparent; }
#press ul.tabs li.selected { color: #C42C37; border-bottom: 6px solid #C42C37; }
#press h2 a { font-family: 'Martel'; text-decoration: underline; font-size: 1.125rem; font-weight: normal; color: #009CDE; line-height: 2rem; }
#press span.outlet { font-family: 'Montserrat'; text-transform: uppercase; font-size: 0.6875rem; color: #474747; letter-spacing: 1px; }
.right-col { width: 31.5%; }

/***************************************************************************************************************************************************************************************/

/* PAGE - Volunteer */
#volunteer { background-size: cover; background-position: center; color: white; padding: 125px 0 68px; }
#volunteer .container { max-width: 580px; }
#volunteer h1 { text-align: center; margin-bottom: 40px; }
#volunteer p { font-size: .75rem; line-height: 1.5rem; margin-bottom: 4px; }
#volunteer p.opening-blurb { margin-bottom: 32px; }
/* Form */
#volunteer form { font-family: 'Montserrat'; font-size: 0.6875rem; }
#volunteer form br { display: none; }
#volunteer form div.not-sure { margin-top: 10px; margin-bottom: 30px; padding-left: 22px; position: relative; display: block; }
#volunteer form div.not-sure::before { left: 0; content: '\f059'; font-size: 18px; color: white; display: block; font-family: FontAwesome; position: absolute; }
#volunteer form div.not-sure a { display: block; text-decoration: underline; color: white; }
#volunteer form label { display: block; letter-spacing: 1px; margin-bottom: 2px; margin-top: 20px;  text-transform: uppercase; font-weight: 600; }
#volunteer form input[type=submit] { background-color: #009CDE; padding: 8px 22px; margin-top: 30px; }
#volunteer span.wpcf7-list-item, #volunteer span.wpcf7-list-item label { margin-right: 10px; margin-left: 0; text-transform: none; }
#volunteer span.wpcf7-list-item label { margin-top: 10px; letter-spacing: 0; }
/* #vol-donate {  padding: 10px; position: relative; float: left; top: 200px; left: 102px;} */
#vol-donate {  padding: 10px; position: relative; float: left; top: -48px; left: 320px;}
#vol-donate a { 
	background-color: #C42C37; 
	color: white!important; 
	padding: 8px 20px; 
	font-size: .875rem; 
	font-weight: 600; 
	font-family: 'Montserrat'; 
	text-transform: uppercase; 
	border-radius: 3px;
	letter-spacing: 1px; 
}
#vol-donate a:hover { text-decoration: none; }

span.required { color: #C42C37; }
.name-wrapper { overflow: hidden; }
.name-wrapper br { display: none; }
.name-wrapper input[type=text] { width: 45%; float: left; }
/* Checkboxes and Radio Buttons */
input[type=radio] { display: none; }
input[type=radio] + span:before { vertical-align: bottom; color: white; font-size: 22px; font-family: FontAwesome; display: inline-block; content: "\f111"; margin-right: 8px; }
input[type=radio]:checked + span:before { content: "\f058"; }
input[type=checkbox] { display: none; }
input[type=checkbox] + span:before { position: absolute; left: 0; vertical-align: bottom; color: white; font-size: 22px; font-family: FontAwesome; display: inline-block; content: "\f0c8"; margin-right: 8px; }
input[type=checkbox]:checked + span:before { content: "\f14a"; }
.wpcf7-checkbox label { padding-left: 30px; position: relative; }
/* Form Inputs */
div.wpcf7-response-output { border: 0!important; margin: 20px 0 0 0!important; padding: 0!important; }
span.wpcf7-not-valid-tip { display: none!important; }
.wpcf7-validates-as-required.wpcf7-not-valid { border-color: #C42C37!important; }

/* 404 */
.error404 article { max-height: 730px; height: 100vh; }
.error404 article div { text-align: center; position: relative; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }

@media only screen and (max-width: 1023px) {

	/* Page Hero */
	.page-hero { max-height: 650px; }
	section#homepage-hero .container, #platform-hero .container { height: 100vh; max-height: 650px; }


	/* Header */
	header a.logo { left: 50px; }

	/* Typography */
	h1.heading1, h2.heading1 { font-size: 4rem; }

	/* Mobile Menu */
	header .mobile-menu,  header.active .mobile-menu .fa-close, header.active nav { display: block; }
	header .mobile-menu { display: inline-block; position: absolute; top: 48px; right: 45px; border: 1px solid white; border-radius: 2px; color: white; font-family: 'Montserrat'; font-size: 10px; padding: 4px 12px; text-transform: uppercase; font-weight: 600; letter-spacing: 1px; background-color: rgba(0,0,0,.4);}
	.post-type-archive-press header .mobile-menu {border: 1px solid #4F4F4F; color: #4F4F4F;}
	header .mobile-menu .fa-close, header.active .mobile-menu .fa-bars, header nav { display: none; }
	header nav { background: #fff; display: none; left: 0; padding: 20px; margin: 30px; width: calc(100% - 60px); position: absolute; top: 100%; z-index: 99; }
	header .mobile-menu .close { display: none; }
	header.active .mobile-menu .menu { display: none; }
	header.active .mobile-menu .close { display: block; }
	header ul { flex-wrap: wrap; text-align: center; }
	header li { display: block; width: 100%; }
	header li a { border: none; height: auto; margin: 0; padding: 15px 20px; }
	ul#menu-main li { margin-left: 0; }
	ul#menu-main li a { color: #4F4F4F; text-align: right; display: block; padding: 6px 0;  }
	ul#menu-main li.contribute a { display: inline-block; margin-top: 8px; }
	header.active .mobile-menu { background: none; color: #4F4F4F; border-color: #4F4F4F; z-index: 9999; }

	/* Homepage */
	#circle-callout { position: absolute; top: auto; transform: none; -webkit-transform: none; -ms-transform: none; bottom: 83px; right: 20px; }
	#donate {  padding: 10px; top: 100px; position: absolute; right: 130px;}


	/* About */
	.about-content-container { max-width: 610px; }
	#about-hero div { bottom: 48px; }
	#about-content div.intro p { margin-top: 60px; }

	/* Platform */
	#platform-content .container { max-width: 490px; }

	/* No IDC */
	#idc-hero { max-height: 100%; height: auto; padding-bottom: 80px; }
	#idc-hero .container, #idc-content .container { max-width: 650px; }

	/* Volunteer */
	#volunteer .container { max-width: 650px; }
#vol-donate {  padding: 10px; position: relative; float: left; top: -48px; left: 320px;}
#vol-donate a { 
	background-color: #C42C37; 
	color: white!important; 
	padding: 8px 20px; 
	font-size: .875rem; 
	font-weight: 600; 
	font-family: 'Montserrat'; 
	text-transform: uppercase; 
	border-radius: 3px;
	letter-spacing: 1px; 
}


}

@media only screen and (max-width: 768px) {

	/* Page Layout */
	.page-hero { max-height: 560px; }
	section#homepage-hero .container, #platform-hero .container { height: 100vh; max-height: 560px; }

	/* Typography */
	h1.heading1, h2.heading1 { font-size: 3rem; }

	/***Header***/
	header a.logo { left: 40px; }

	/* Homepage */
	section#homepage-callouts ul li p { margin-bottom: 0; }
	section#homepage-callouts ul li { padding: 24px 0 31px; }
	#circle-callout { bottom: 33px; }
	section#homepage-map h2 { font-size: 4.5rem; }

	/* About */
	.about-content-container { max-width: 452px; padding-bottom: 20px; }

	/* Platform */
	#platform-content .container { max-width: 490px; }
	#platform-newsletter p { margin-bottom: 10px; }
	#platform-newsletter input[type=submit] { display: block; margin: 14px auto 0; font-size: .75rem; }

	/* No IDC */
	#idc-hero { max-height: 100%; height: auto; }
	#idc-hero .container, #idc-content .container { max-width: 490px; }
	#idc-hero h1 { font-size: 4rem; }
	#idc-members li { width: 100%; margin-right: 0; max-width: 255px; margin: 0 auto 10px; }
	#idc-members li:nth-of-type(2n) { margin-right: auto; }
	#idc-members li:last-of-type { margin-bottom: 0; }

	/* Press */
	#press .flex-container { display: block; }
	.left-col { width: 100%; max-width: 450px; margin: 0 auto; }
	.right-col { width: 100%; max-width: 450px; margin: 0 auto; }

	/* Volunteer */
	#volunteer .container { max-width: 490px; }
#vol-donate {  padding: 10px; position: relative; float: left; top: -48px; left: 320px;}
#vol-donate a { 
	background-color: #C42C37; 
	color: white!important; 
	padding: 8px 20px; 
	font-size: .875rem; 
	font-weight: 600; 
	font-family: 'Montserrat'; 
	text-transform: uppercase; 
	border-radius: 3px;
	letter-spacing: 1px; 
}
	
}

/* XXX WARNING - I COPY-PASTED A BUNCH OF THIS CSS TO THE CUSTOM CSS SPOT IN THE THEME MENU EDITOR, BECAUSE I WASN'T SURE HOW TO FORCE USER BROWSERS TO REFRESH WHEN I UPDATED THE CSS. THAT DUPLICATED CSS SHOULD EVENTUALLY BE DELETED ONCE IT'S BEEN LONG ENOUGH THAT ALL BROWSERS HAVE PICKED UP THE CHANGES */

@media only screen and (max-width: 700px) {

	/* Page Layout */
	.page-hero { max-height: 320px; }
	section#homepage-hero .container, #platform-hero .container { height: 100vh; max-height: 320px; }

	/* Typography */
	h1.heading1, h2.heading1 { font-size: 3rem; }

	/* Page Layout */
	#site-wrapper { border: 10px solid #009cde; border-bottom: 0; }
	.container { padding-left: 10px; padding-right: 10px; }
	.page-template-page-home header::before { top: 10px; left: 10px; width: calc(100% - 20px); }
	
	/* Footer */
	ul.social-icons { width: 130px; }
	ul.social-icons li a { font-size: 14px; }
	ul#menu-footer { padding-top: 25px; max-width: 283px; margin: 37px auto 60px; }
	ul#menu-footer li { display: block; line-height: .875rem; }


	/* Header */
	header nav { margin: 10px; width: calc(100% - 20px); }
	header a.logo { width: 102px; padding: 10px 12px 6px 12px; left: 20px; }
	header a.logo img { max-width: 80px; }
	header a.logo::after { border-left: 51px solid transparent; border-right: 51px solid transparent; border-top: 10px solid #f4f4f4; bottom: -10px; }
	header .mobile-menu { top: 28px; right: 25px; }
	ul#menu-main { padding-top: 36px; }

	/* Homepage */
	/* Hero */
	section#homepage-map h2 { font-size: 3rem; }
	#circle-callout { cursor: pointer; position: absolute; z-index: 2; border-radius: 0; width: calc(100% - 40px); height: auto; padding: 4px; top: auto; bottom: 22px; }
	#circle-callout.active { cursor: default; }
	#circle-callout input[type=text]:first-of-type { margin-top: 0; }
	#circle-callout > div { z-index: 1; padding-top: 0; border-radius: 0; width: 100%; height: auto; border: 1px solid #009cde;  }
	#circle-callout p { margin: 4px; }
	#circle-callout img { display: none; }
	#circle-callout form { z-index: 1; max-height: 0; overflow: hidden; }
	#circle-callout button { margin-top: 10px; }
	#circle-callout.active p { margin: 10px 0; }
	#circle-callout.active form { z-index: 1; max-height: 100%; padding-bottom: 20px; }
	#circle-callout p { font-size: .935rem; }
	#donate { position: absolute; z-index: 1; top: auto; bottom: 90px; text-align: right; right: 0px;}
	/* Callouts */
	section#homepage-callouts ul { display: block; }
	section#homepage-callouts .container { padding: 0; }
	section#homepage-callouts ul li { padding: 16px 12px; text-align: left; width: 100%; border-left: 0; border-right: 0!important; border-bottom: 1px solid #e0e0e0; }
	section#homepage-callouts ul li p { max-width: 100%; }
	section#homepage-callouts ul li h2 { font-size: .75rem; }

	/* Map */
	section#homepage-map { padding-top: 27px; padding-bottom: 35px; }
	section#homepage-map::after { content: none; }
	section#homepage-map h3 { font-size: .75rem; }
	section#homepage-map ul li { margin-bottom: 10px; font-size: .625rem; }
	section#homepage-map ul { max-width: 310px; margin-bottom: 25px; }
	section#homepage-map p { margin-top: 20px; }

	/* About */
	#about-hero div { bottom: 30px; }
	#about-hero h1 { font-size: 1.5rem; }
	#about-content div.intro p { font-size: .875rem; line-height: 1.625rem; margin-top: 28px; }
	.about-content-container { padding: 0 14px 20px; }

	/* Platform */
	#platform-hero h1 { width: 100%; font-size: 1rem; line-height: 1.625rem; left: 10px; bottom: 50px; }
	#platform-newsletter { display: none; }
	#platform-content { padding: 25px 0 71px; }

	/* No IDC */
	#idc-hero h1 { font-size: 3.125rem; }
	#idc-video-wrapper { margin: 0 12px; }

	/* Press */
	#press { padding: 72px 0 60px; }
	#press h2 a { font-size: .9375rem; line-height: 1.75rem; }

	/* Volunteer */
	#volunteer { padding-bottom: 47px; padding-top: 75px; }
	#volunteer h1 { text-align: center; margin-bottom: 22px; font-size: 2.25rem; }
	#volunteer input[type=text], #volunteer input[type=email], #volunteer input[type=tel] { width: 100%; }
	input[type=checkbox] + span:before { top: 3px; }
#vol-donate {  padding: 10px; position: relative; float: left; top: -48px; left: 320px;}
#vol-donate a { 
	background-color: #C42C37; 
	color: white!important; 
	padding: 8px 20px; 
	font-size: .875rem; 
	font-weight: 600; 
	font-family: 'Montserrat'; 
	text-transform: uppercase; 
	border-radius: 3px;
	letter-spacing: 1px; 
}
}