/*
Theme Name: Digital Equity
Theme URI: http://www.digitalequityandlearning.org
Description: This custom theme was made exclusively for the Digital Equity project. It is a derivative of Super Hijinksified by Amber Weinberg.
Author: Tamara Olson
Author URI: http://www.tamaraolsondesigns.com
Version: 1.0

*/

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

/*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}

.clearfix:after {
     visibility: hidden;
     display: block;
     font-size: 0;
     content: " ";
     clear: both;
     height: 0;
     }
.clearfix { display: inline-block; }
/* start commented backslash hack \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* close commented backslash hack */

.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; }
.embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }


html { font-size: 100%; }
body { background: #FFF; color: #59493a; font: 16px 'Roboto', Arial, Helvetica, sans-serif; line-height: 25px; font-weight: 300; }
a {  text-decoration: none; transition: all .5s ease; color: #59493a; text-decoration: underline; }
a.button { font-size: 14px!important; letter-spacing: .04em; display: inline-block; font-weight: bold; text-decoration: none; padding: 8px 20px; border: 3px solid white; color: white; text-transform: uppercase; }
.centered-button { margin: 0 auto; width: 100%; text-align: center; }
a:hover { }
h1, h2 { -webkit-font-smoothing: antialiased; text-align: center; margin: 0 0 15px; font-size: 40px; line-height: 58px; font-family: 'Roboto Slab', serif; font-weight: normal; }
span.tagline, span.tagline p { text-align: center; display: block; font-size: 24px; line-height: 36px; max-width: 700px; width: 100%; margin: 0 auto 60px; }
.container { clear: both; margin: 0 auto; max-width: 960px; position: relative; padding: 0 30px; }
img { height: auto; max-width: 100%; }

.left-column-2 { float: left; width: 65.166%; margin-right: 4.5%; }
.right-column-third { float: left; width: 30.333%; }
.left-column-third { float: left; width: 30.33%; margin-right: 4.5%; }
.right-column-2 { float: left; width: 65.166%; }

nav.desktop-menu { z-index: 999; position: fixed; top: 0; left: 0; width: 100%; background-color: white; padding: 10px 0 0; text-transform: lowercase; text-align: center; font-size: 20px; font-family: 'Roboto Slab', serif; }
nav li { display: inline-block; margin: 0 20px; }
nav li a { padding: 0 0 15px 0; display: inline-block; border-bottom: 4px solid transparent; font-size: 16px; -webkit-font-smoothing: antialiased; font-weight: bold; }
nav li:first-of-type a { color: #009c82; }
nav li:nth-of-type(2) a { color: #f37022; }
nav li:nth-of-type(3) a { color: #533970;  }
nav li:nth-of-type(4) a { color: #009c82; }
nav li:nth-of-type(5) a { color: #0061ab; }
nav li:nth-of-type(6) a { color: #59493a; }
nav li:nth-of-type(7) a { color: #c72127; }
nav li:first-of-type a:hover { border-color: #009c82; }
nav li:nth-of-type(2) a:hover { border-color: #f37022; }
nav li:nth-of-type(3) a:hover { border-color: #533970;  }
nav li:nth-of-type(4) a:hover { border-color: #009c82; }
nav li:nth-of-type(5) a:hover { border-color: #0061ab; }
nav li:nth-of-type(6) a:hover { border-color: #59493a; }
nav li:nth-of-type(7) a:hover { border-color: #c72127; }

/* Mobile Menu */
.mean-container .mean-bar { font-family: 'Roboto Slab', serif; background-color: white; position: fixed; top: 0; left: 0; }
.mean-container .mean-nav { background-color: white; }
.mean-container .mean-nav ul li { margin: 0; }
.mean-container .mean-nav ul li a { border: 0; color: #59493a; text-transform: lowercase; }
.mean-container a.meanmenu-reveal { color: #59493a; }
.mean-container a.meanmenu-reveal span { background: #59493a; }

section { padding: 90px 0; }

/* Section 1 */
section#overview { background: #c72127 url('img/topareamap.png') no-repeat scroll 0 0; background-position: center; background-size: cover;  padding-top: 120px; background-color: #009c82; color: white; }
.overview-container { clear: both; padding: 80px 60px; text-align: center; background: #009c82 url('img/drawnborder.png') scroll no-repeat 0 0; background-size: 100%; width: 637px; height: 700px; margin: 0 auto; }
.overview-container p { font-size: 24px; line-height: 32px; }

/* The Research */
section#research { background-color: #f37022; color: white; padding-bottom: 0; }
.orangeline { position: absolute; margin-left: -50px; }
.reports { margin: 0; padding: 80px 0 0 0; width: 100%; background-color: white; margin-top: 120px; padding-bottom: 60px; overflow: hidden; }
.reports ul { margin: 0; padding: 0; }
.reports li { font-size: 16px; line-height: 21px; list-style: none; float: left; width: 25%; text-align: center; }
.reports li span.report-title { text-align: left; color: #f37022; font-weight: bold; display: block; padding: 15px 34px 0 10px; }
.reports li a { position: relative; width: 90%; display: block; border: 10px solid transparent; }
.reports li a span { display: none; }
.reports li a:hover span { width: 100%; text-align: center; margin-top: 80px; color: white; position: absolute; z-index: 999; font-family: 'Roboto Slab', serif; display: block; }
.reports li a:hover span i { color: white;  font-size: 50px; display: block; }

/* The Findings */
section#about-the-event { background-color: #533970; color: white; padding-bottom: 0; }
section#about-the-event span.tagline, section#about-the-event span.tagline p { max-width: 400px; margin-bottom: 30px; }
section#about-the-event .event-information { font-size: 16px; line-height: 26px; text-align: left; margin-bottom: 60px; max-width: 700px; margin-left: auto; margin-right: auto; width: 100%; }
section#about-the-event .event-information a { color: white; }
.findings-intro { padding-bottom: 60px; }
section#about-the-event .left-column-2 { font-size: 22px; line-height: 34px; }
section#about-the-event .right-column-third { font-size: 14px; line-height: 22px; }
.left-column-2 p { margin: 10px 0; }
.findings-container { background-color: white; color: #533970; padding: 60px 0; }
.findings { margin: 0; padding: 0; }
.findings li { margin: 0 0 20px 0; padding: 0; list-style: none; float: left; width: 30.33%; margin-right: 4.5%; font-size: 14px; line-height: 21px; }
.findings li img { float: left; margin-right: 20px; margin-bottom: 20px; }
.findings li:nth-child(3n) { margin-right: 0; }
.findings li:nth-child(4n) { clear: both; }
.findings li h3 { margin-top: 0; font-size: 16px; line-height: 22px; }
.purpleline { position: absolute; margin-top: 0px; margin-left: -250px;  }
section#about-the-event a.button { border-color: #533970; color: #533970; }
section#about-the-event a.button:hover { background-color: #533970; color: white; border-color: #533970; }

/* Forum */
section#the-forum { background-color: #009c82; color: white; }
section#the-forum a { color: white; }
section#the-forum .forum-info { max-width: 700px; margin: 0 auto; width: 100%; text-align: center; }
section#the-forum .forum-info iframe { margin-top: 30px; }
section#the-forum p { font-size: 18px; line-height: 26px; }
section#the-forum h2 { text-align: left; }
section#the-forum .button { margin-top: 20px; }
section#the-forum .button:hover { background-color: white; color: #009c82; }
.forum-videos { margin: 60px 0 0 0; padding: 0; }
.forum-videos li { margin: 0 0 30px 0; padding: 0; width: 48%; margin-right: 4%; float: left; list-style: none; }
section#the-forum .forum-videos p { font-size: 14px!important; line-height: 21px!important; }
.forum-videos li:nth-child(2n) { margin-right: 0; }

/* Conversation */
section#conversation { background-color: #0061ab; color: white; }
section#conversation span.tagline a { color: white; }
.blueline { position: absolute; right: 0; }
section#conversation .left-column-2 a { text-decoration: none; color: white; font-size: 22px; line-height: 28px; }
section#conversation .left-column-2 a:hover { text-decoration: underline; }
section#conversation .left-column-2 ul { margin-bottom: 20px; }
section#conversation .left-column-2 li { margin-bottom: 10px; }
h3.tweets-headline { text-align: center; font-size: 16px; margin-top: 10px; font-weight: 300; }
ul.tweets { padding: 0; margin: 0; width: 100%; overflow: hidden; list-style: none; }
ul.tweets li { list-style: none; }
ul.tweets ul { padding: 0; margin: 0; }
ul.tweets ul li { font-size: 13px; line-height: 21px; position: relative; padding: 20px 20px 20px 80px; margin-bottom: 30px; display: inline-block; color: #0061ab; list-style: none; background-color: white; width: 100%; }
ul.tweets ul li:before { left: 20px; top: 25px; font-size: 36px; content: "\f099"; font-family: 'FontAwesome'; position: absolute; }
ul.tweets ul li:nth-child(2n) { margin-right: 0; }
ul.tweets ul li a { color: #0061ab; font-weight: bold; }
section#conversation h3 { font-size: 24px; line-height: 32px; }
section#conversation hr { margin: 40px 0; }
section#conversation ul.conversation-list { margin: 0; padding: 0; }
section#conversation ul.conversation-list li { list-style: none; position: relative; padding-left: 60px; margin-bottom: 30px; }
section#conversation ul.conversation-list li:before { content: "\f046"; color: white; display: block; font-size: 32px; font-family: 'FontAwesome'; position: absolute; left: 0; margin-top: 4px; }
section#conversation ul.conversation-list span { background-color: white; color: #0061ab; padding: 0px 6px; font-weight: bold; display: inline-block; margin-top: 8px; }
section#conversation a.button { float: right; margin-left: 20px; }
section#conversation a.button i { font-size: 16px!important; }
section#conversation a.button:hover { text-decoration: none; color: #0061ab; background-color: white; }

/* Who We Are */
section#who-we-are .bios { margin: 0; padding: 0; }
section#who-we-are .bios img { width: 182px; border-radius: 200%; float: left; margin-right: 60px; }
section#who-we-are .bios { width: 100%; margin-top: 60px; }
section#who-we-are .bios li { width: 100%; list-style: none; overflow: hidden; margin-bottom: 60px; }
section#who-we-are .bios li:last-child { margin-bottom: 0; }
section#who-we-are .bios li h3 { font-family: 'Roboto Slab', serif; font-size: 28px; line-height: 36px; font-weight: normal; margin: 10px 0; }
section#who-we-are .bios li p { font-size: 16px; line-height: 25px; margin: 0; }
section#who-we-are .additional-peopla p { font-size: 16px; line-height: 21px; display: block; text-align: center; width: 100%; max-width: 700px; margin: 0 auto; }
section#who-we-are .additional-peopla p strong { font-weight: 700; font-size: 18px; line-height: 24px; margin-bottom: 0px; display: block;  }


/* Contact */
section#get-in-touch { background: #c72127 url('img/topareamap.png') no-repeat scroll 0 0; background-size: cover; color: white; }
.get-in-touch-header { background: #c72127; padding: 20px; border: 2px solid white; max-width: 400px; margin: 0 auto 60px;  }
.get-in-touch-header span, .get-in-touch-header p { margin-bottom: 0; }
div.wpcf7-response-output { border: 0!important; }
.wpcf7-validation-errors { color: #c72127; font-size: 14px; line-height: 20px; font-weight: bold!important; padding: 0!important; margin: 0!important; }


form { background-color: rgba(255,255,255,.8); border: 3px solid white; width: 50%; float: right; padding: 30px; }
form p { margin: 0; }
input, textarea { font-weight: 300; font-family: 'Roboto', Arial, Helvetica, sans-serif; border: 0; padding: 10px; margin-bottom: 10px; background-color: #c72127; color: white; width: 100%; }
input:focus, textarea:focus { outline: none; }
input[type="submit"] { background-color: #f47022; color: white; font-family: 'Roboto Slab', serif; margin-bottom: 0; }
footer { text-align: center; }
footer p { margin: 20px 40px; }

::-webkit-input-placeholder { color: white; }
:-moz-placeholder { color: white; }
::-moz-placeholder { color: white; }
:-ms-input-placeholder { color: white; }
::-ms-input-placeholder { color: white; }

@media only screen and (max-width: 768px) {
     
     body { font-size: 16px; line-height: 22px; }
     h1, h2 { font-size: 34px; line-height: 44px; }

     section#who-we-are h2 { text-align: center; }

     .orangeline { margin-left: -170px; }
     .purpleline { display: none; }
     .blueline { display: none; }
     
     section#who-we-are .bios img { width: 150px; position: absolute;  }
     section#who-we-are .bios h3 { padding-left: 190px; }
     section#who-we-are .bios p { padding-left: 190px; }

     .reports li { width: 48%; float: left; margin-right: 4%; margin-bottom: 30px; }
     .reports li:nth-child(2n) { margin-right: 0; }
     .reports li a { width: 100%; }

}

@media only screen and (max-width: 768px) {
     h1 { font-size: 30px; line-height: 40px; }
     /* Layout - Tablet */
     .overview-container { width: 500px; height: 549px; padding: 60px;  }
     .overview-container p { font-size: 18px; line-height: 26px; }
     form { float: none; width: 100%; }
     ul.tweets ul li { min-height: 0; float: none; width: 100%; margin: 0 0 30px 0;  }
}

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

     /* Layout */
     section { padding: 40px 0; }
     span.tagline { max-width: 300px!important; margin: 0 auto; }
     .overview-container { width: 320px; height: 354px; padding: 35px 20px;  }
     .overview-container p { margin: 0; font-size: 13px; line-height: 18px; }
     .reports { margin-top: 60px; }
     section#about-the-event .schedule { padding-bottom: 20px; }
     section#about-the-event .schedule.schedule2 { padding-top: 0; }
     section#who-we-are h2 { text-align: center; display: block; }
     section#who-we-are span.tagline { text-align: center; }
     section#who-we-are .bios img { position: static; float: right; width: 125px; margin-right: 0; margin-left: 20px; margin-bottom: 20px; }
     section#who-we-are .bios h3 { padding-left: 0; font-size: 20px; line-height: 26px; margin-top: 0; }
     section#who-we-are .bios p { padding-left: 0; }
     section#about-the-event .schedule { float: none; margin: 0 auto 30px; width: 100%; }
     section#about-the-event h2 { text-align: center; }
     section#about-the-event span.tagline { text-align: center; margin: 0 auto 30px auto; }
     section#about-the-event .schedule { width: 100%; margin: 0 30px 0 0; }
     .left-column, .right-column, .left-column-third, .right-column-2, .forum-videos li, .findings li, .left-column-2, .right-column-third { width: 100%; margin-bottom: 20px; float: none; }

     /* Conversation */
     section#conversation h3 { text-align: center; }
     section#conversation a.button { float: none; text-align: center; display: block; margin-bottom: 20px; }
     .findings li h3 { margin-bottom: 0; }
     .findings li p { margin-top: 2px; }
     .findings li img { margin-bottom: 10px; }
     section#who-we-are .bios li { margin-bottom: 30px; }
     section#who-we-are .bios li h3 { margin-top: 0; }
     .podcast-line { text-align: center; display: block; }

     /* Hidden Lines */
     .orangeline { display: none; }
     .purpleline { display: none; }

     /* Special Layouts */
     .findings-intro { padding-bottom: 30px; }
     section#the-forum h2 { text-align: center; }
     .reports { margin-top: 40px; }
     .findings-container { padding: 40px 0; }

     /* Typography */
     body { font-size: 14px; line-height: 20px; }
     h1 { font-size: 20px; line-height: 26px; margin-bottom: 10px; }
     h2 { font-size: 20px; line-height: 26px; margin-bottom: 10px; }
     section#conversation h3, section#who-we-are .bios li h3 { font-size: 18px; line-height: 24px; }
     section#who-we-are .additional-peopla p, section#who-we-are .bios li p, section#conversation .left-column-2 a, section#the-forum p, span.tagline, span.tagline p, section#about-the-event .left-column-2 { font-size: 14px; line-height: 22px; }
     .left-column-third, section#about-the-event .right-column-third, .left-column-2 p { text-align: center; }
}