/******************** TABLE OF CONTENTS ********************
- Base Styles
- Typography
- Links
- Header
- Top Nav
- Footer
- Right Sidebar
- Misc Styles
- Mobile menu
- Buttons
- Forms
- Lists
- Blockquotes
- Code
- Tables
- Spacing
- Utilities
- Donate Button
- Background Gradient
- Clearing
- Media Queries
*/


/******************** BASE STYLES ********************/
/* NOTE
html is set to 62.5% so that all the REM measurements throughout Skeleton are based on 10px sizing. So basically 1.5rem = 15px */

html {
font-size: 62.5%; }

body {
font-size: 1.5em; /* currently ems cause chrome bug misinterpreting rems on body element */
line-height: 1.6;
font-weight: 400;
font-family: 'Open Sans', 'PT Sans', sans-serif;
color: #1e1e1e; 
-webkit-font-smoothing: antialiased; 
-webkit-text-size-adjust: 100%;  
font-size:100%;
margin: 0;
}

/******************** Typography ********************/
h1, h2, h3, h4, h5, h6 {
margin-top: 0;
margin-bottom: 2rem;
font-family: 'Open Sans', sans-serif;
}
h1 { font-size: 4.0rem; line-height: 1.2;  letter-spacing: -.1rem; font-weight: 400; }

h2 { font-size: 2.8rem; line-height: 1.25; letter-spacing: .05rem; margin-bottom: 5px; color: #6fab40; border: 0; font-weight: 400; border-bottom: 1px solid #6fab40;}

h2.ourwork { font-size: 2.6rem; line-height: 1.25; letter-spacing: .05rem; margin-bottom: 10px; color: #eb8b10; text-transform: uppercase; border: 0; font-weight: 400; border-bottom: 1px solid #eb8b10;}

h2.centered {border: 0; text-align: center; margin-bottom: 12px; text-transform: none; }

h3 { font-size: 1.8rem; line-height: 1.3;  letter-spacing: -.08rem; font-weight: 600; margin: 2.4rem 0 .3rem 0;}

.flexslider h3 {margin: 0 0 .3rem 0;}

h3 a {color: #eb8b10; text-decoration: underline;}

h4 { font-size: 1.6rem; line-height: 1.35; letter-spacing: -.08rem; margin-bottom: 2px; font-weight: 600;}

h5 { font-size: 1.6rem; line-height: 1.5;  font-weight: 600; margin-bottom: 2px; letter-spacing: -.08rem;}

h6 { font-size: 1.5rem; line-height: 1.6;  letter-spacing: 0; }

/*h2:after { display: inline-block; position: absolute; margin: 3.3rem 0 0px 3px; height: 1px; content: " "; text-shadow: none; background-color: #6fab40; width: 48%; }

h2.ourwork:after { display: inline-block; position: absolute; margin: 3.3rem 0 0px 3px; height: 1px; content: " "; text-shadow: none; background-color: #eb8b10; width: 75%; }*/

/* Larger than phablet */
@media (min-width: 550px) {
h1 { font-size: 5.0rem; }
h2 { font-size: 3.2rem; }
h2.ourwork {font-size: 3.0rem; }
h3 { font-size: 2.0rem; }
h4 { font-size: 1.6rem; }
h5 { font-size: 1.9rem; }
h6 { font-size: 1.5rem; }
}

p {
margin: 0 0 1.4rem 0; 
font-size: 1.5rem;
font-family: 'Open Sans', sans-serif;
}

.entry p {
margin: 0;
}

p.condensed {
font-size: 1.4rem;
line-height: 1.5;
}

p.entry-footer {
font-size: 1.1rem;
text-align: right;
margin: 3px 5px 0 0;
line-height: 1.5rem;
vertical-align: middle;
}

p.entry-footer .date {
text-transform: uppercase;
}

p.entry-footer .social {
vertical-align: middle;
}

p.entry-footer input {
border: 0;
vertical-align: middle;
}

b, strong {font-weight: 600; font-size: 1.5rem;}


/******************** LINKS ********************/
a { color: #000033; }
a:hover { color: #0FA0CE; }

/******************** HEADER ********************/

#header {
padding: 20px 10px 0 20px;
}

@media screen and (max-width: 768px) {
#header { text-align: center; padding: 7px 0 0 0; }
}

#header img {
max-width: 100%;
text-align: left;
}
        
#header a {
text-decoration: none;
}
        
#support {
float: right;
margin: 20px 0 20px 0;
}

@media screen and (max-width: 768px) {
        #support { float: none; text-align: center; margin: 15px 0 15px 0; }
}

/******************** TOP NAV ********************/
#nav_wrapper {
background: #e1e1e1;
height: 38px;
margin: 10px 0 0 0;
}

.topnav {
margin: 0 5px 0 5px;
line-height: 1rem;
text-align: right;
font-size: 1.1rem;
}

.topnav ul  {
float: right;
vertical-align: middle;
}

.topnav img {
padding-bottom: 7px;
vertical-align: middle;
}

.topnav li {
float: left;
list-style: none;
padding: 13px 15px;
font-size: 1.6rem;
}

.topnav a {
text-decoration: none;
}

@media screen and (max-width: 768px) {
.topnav { font-size: .9rem; }
.topnav li {padding: 13px 10px;}
}

@media screen and (max-width: 768px) {
#nav_wrapper, .topnav, .hide {
display:none;
}

}

/******************** FOOTER ********************/
#footer, #mobile_footer {
background-color: #14285e;
padding: 5px;
font-size: 1rem;
}

#mobile_footer ul, #mobile_footer li {
font-size: 1rem;
margin:0;
line-height: 1.3rem;
font-weight: 400;
padding-left: 0;
}

#footer ul, #footer li {
color: #FFF;
list-style: none;
margin: 0;
font-size: 1.1rem;
line-height: 1.6rem;
font-weight: 600;
padding-left: 0;
}

#footer a.heading, #footer .heading {
color: #a4e61f;
margin-top: 15px;
}

#footer a, #mobile_footer a {
color: #FFF;
text-decoration: none;
}

#footer a:hover, #mobile_footer a:hover {
text-decoration: underline;
}

#mobile_footer p {
color: #FFF;
line-height: 1.6rem;
text-align: center;
padding: 3px;
}

#mobile_footer img {
margin-right: 5px;
}

#footer .contact {
padding: 40px;
line-height: 1.6rem;
border-right: 1px solid #a4e61f;
color: #FFF;
}

/******************** RIGHT SIDEBAR ********************/
.search {
text-align: center;
}

.box {
border: 1px solid #CCC;
background: #FFF;
margin: 0 5px 20px 12px;
border-radius: 6px;
}

.box p {
padding: 0 10px;
line-height: 1.3;
}

.box h3 {
margin: 0.2rem 0;
font-weight: 600;
position: relative;
padding: 0px 7px;
color: #eb8b10;
}

.box h3.green {
margin: 0.1rem 0 0.2rem 0;
font-weight: 600;
text-transform: uppercase;
position: relative;
padding: 0px 7px;
color: #6fab40;
font-size: 2.2rem;
}

.box ul {
padding: 0;
margin: 0;
}

.box ul li {
list-style-type: none;
padding: 0 3px 1px 5px;
}

.box img {
border: 1px solid #999;
display: block; 
margin: 0 auto;
}

.signup_box {
background-color: #e1e1e1;
border-radius: 10px;
}

.signup_box h3 {
margin: 0.4rem 0 0.2em 0;
color: #14285e;
}

.signup_box .button {
background-color: #14285e;
color: #FFF;
}

p.event-info {
font-size: 1.3rem;
margin: 2px 0 0 0;
}

p.video-embed {
text-align: center;
}

/******************** MISC STYLES ********************/
.right_align_link {
text-align: right; 
margin: 10px 0 3px 0;
}

p.sm {
font-size: 1.35rem;
}

.glow {
margin: auto;
width: 97%;
background-color: #fdfdfd;
-webkit-box-shadow: 0px 0px 7px 2.5px rgba(0,0,0,.2);
-moz-box-shadow: 0px 0px 7px 2.5px rgba(0,0,0,.2);
box-shadow: 0px 0px 7px 2.5px rgba(0,0,0,.2);
margin: 20px auto;
padding: 5px;
}

.glow img {
border: 1px solid #999;
display: block; 
margin: 0 auto;
}

.glow p {
margin: 0 0 1rem 0; 
font-size: 1.33rem;
line-height: 1.5rem;
}

small { font-size: 1.2rem; }

a.tags {
background-color: #CCC;
color: #333;
padding: 4px;
margin: 0 4px 10px 0;
font-weight: 600;
text-decoration: none;
font-size: 1.3rem;
}

a.tags:hover {
background-color: #000033;
color: #FFF;
}

hr {
margin-top: 0.5rem;
margin-bottom: 1rem;
border-width: 0;
border-top: 1px solid #aaa;
}

hr.dark { 
border: 1px solid #8091ba; 
border-width: 1px 0 0; 
clear: both; 
margin: 1.3rem; 
}

img,
embed,
object,
video {
max-width: 100%;
}

.event-date {
font-family: Cambria, Georgia, serif;
font-weight: bold;
margin-right: 6px;
float: left;
font-size: 1.2rem;
width: 90px;
line-height: 1.3rem;
}

.event-date .day {
font-size: 2.8rem;
margin-right: 6px;
float: left;
margin-top: 0;
line-height: 2.6rem;
}

p img.icon {
max-width: 15%; height: auto; border: 0; float: right; margin: 0 0 10px 10px;
}

/******************** TOGGLE TEXT ********************/
h3.inline, h4.inline, p.inline {
display: inline;
vertical-align: middle;
}
a.text-toggle h3 {
color: #eb8b10;
}
a.text-toggle, a.text-toggle h4, a.text-toggle h3, a.text-toggle p {
text-decoration: underline;
vertical-align: middle;

}
.toggle-container {
margin-top: 12px;
font-size: 1rem;
}
.toggle-icon {
background-color: #999;
background-position: center center;
background-repeat: no-repeat;
-webkit-border-radius: 1em;
border-radius: 1em;
width: 20px;
height: 20px;
content:"";
display: inline-block;
vertical-align: middle;
}
.toggle-container a {
text-decoration: none;
}
.toggle-container li a {
text-decoration: underline;
}
.toggle-icon.h3 {
background-color: #eb8b10; !important;
}
.toggle-icon.plus {
background-image: url("/i/plus-white.svg");
}
.toggle-icon.minus {
background-image: url("/i/minus-white.svg");
}
.toggle-container {
width: 100%;
clear: both;
}
.text-toggle {
position: relative;
}
.toggle-content {
display: none;
/*overflow: auto;*/
}
/* media query for mobile */
@media (max-width: 768px) {
        .toggle-content {
                padding: 10px 0;
                overflow: inherit;
        }
}

/******************** DROP DOWN MENUS ********************/
.clearfix:after {
    display:block;
    clear:both;
}
 
/*----- Menu Outline -----*/
.menu-wrap {
    width:100%;
    background:#e1e1e1;
    height: 38px;
}
 
.nav-menu {
    margin:0px 5px;
    float: right;

}

.nav-menu li {
    margin:0px;
    list-style:none;
}
 
.nav-menu a {
    transition:all linear 0.15s;
    text-decoration: none;
}
 
.nav-menu li:hover > a, .nav-menu .current-item > a {
    text-decoration:none;
}
 
.nav-menu .arrow {
    font-size:11px;
    line-height:0%;
}
 
/*----- Top Level -----*/
.nav-menu ul ul {
margin: 0;
}

.nav-menu > ul > li {
    float:left;
    display:inline-block;
    position:relative;
    font-size:1.6rem;
    line-height: 1.2rem;
margin: 0;
}
 
.nav-menu > ul > li > a {
    padding:13px 15px;
    display:inline-block;
}
 
.nav-menu > ul > li:hover > a, .nav-menu > ul > .current-item > a {
   /* background:#000033;*/
}
 
/*----- Bottom Level -----*/
.nav-menu li:hover .sub-menu {
    z-index:9999;
    opacity:1;
}
 
.sub-menu {
    width:180%;
    padding:5px 0px;
    margin: 0;
    position:absolute;
    top:100%;
    left:0px;
    z-index:-1;
    opacity:0;
    transition:opacity linear 0.15s;
    box-shadow:0px 2px 3px rgba(0,0,0,0.2);
    background:#f1f1f1;
}
 
.sub-menu li {
    display:block;
    font-size:1.3rem;
    line-height: 1.6rem;

}
 
.sub-menu li a {
    padding:7px 10px;
    display:block;   
}
 
.sub-menu li a:hover, .sub-menu .current-item a {
    /* background:#000033;*/
}

.flexslider {
z-index: 0 !important;
}


/******************** MOBILE MENU ********************/
.slicknav_menu { display:none; }

#mobile_menu { display: none; }

@media screen and (max-width: 768px) {
        .js #menu { display:none; }
        .menu-wrap { display:none; }
        
        .js .slicknav_menu { display:block; }
        
        #footer {display: none;}
}

@media screen and (min-width: 769px) {
        #mobile_footer {  display: none; }
}



/******************** BUTTONS ********************/
.button,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
display: inline-block;
height: 38px;
padding: 0 30px;
color: #555;
text-align: center;
font-size: 11px;
font-weight: 600;
line-height: 38px;
letter-spacing: .1rem;
text-transform: uppercase;
text-decoration: none;
white-space: nowrap;
background-color: transparent;
border-radius: 4px;
border: 1px solid #bbb;
cursor: pointer;
box-sizing: border-box; }
.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover,
.button:focus,
button:focus,
input[type="submit"]:focus,
input[type="reset"]:focus,
input[type="button"]:focus {
color: #333;
border-color: #888;
outline: 0; }
.button.button-primary,
button.button-primary,
input[type="submit"].button-primary,
input[type="reset"].button-primary,
input[type="button"].button-primary {
color: #FFF;
background-color: #33C3F0;
border-color: #33C3F0; }
.button.button-primary:hover,
button.button-primary:hover,
input[type="submit"].button-primary:hover,
input[type="reset"].button-primary:hover,
input[type="button"].button-primary:hover,
.button.button-primary:focus,
button.button-primary:focus,
input[type="submit"].button-primary:focus,
input[type="reset"].button-primary:focus,
input[type="button"].button-primary:focus {
color: #FFF;
background-color: #1EAEDB;
border-color: #1EAEDB; }


/******************** FORMS ********************/
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea,
select {
color: #333;
font-size: 1.5rem;
height: 38px;
padding: 6px 10px; /* The 6px vertically centers text on FF, ignored by Webkit */
background-color: #fff;
border: 1px solid #D1D1D1;
border-radius: 4px;
box-shadow: none;
box-sizing: border-box; }
/* Removes awkward default styles on some inputs for iOS */
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea {
-webkit-appearance: none;
 -moz-appearance: none;
          appearance: none; }
textarea {
min-height: 65px;
padding-top: 6px;
padding-bottom: 6px; }
input[type="email"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="text"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus {
border: 1px solid #33C3F0;
outline: 0; }
label,
legend {
font-size: 1.5rem;
margin-bottom: .5rem;
font-weight: 600; }
fieldset {
padding: 0;
border-width: 0; }
input[type="checkbox"],
input[type="radio"] {
display: inline; }
label > .label-body {
display: inline-block;
margin-left: .5rem;
font-weight: normal; }


/******************** LISTS ********************/
ul {
list-style: square outside; font-size: 1.5rem;}
ul ul {
list-style: circle outside;
margin: 1.2rem 0 1.2rem 3rem;
}
ol {
list-style: decimal outside; }
ol, ul {
padding-left: 2.3rem;
margin-top: 0; }
ul ul,
ul ol,
ol ol,
ol ul {
margin: 1.5rem 0 1.5rem 3rem;
}
li {
margin-bottom: 0.8rem;
font-size: 1.5rem;}

/******************** BLOCKQUOTES ********************/
blockquote, blockquote p { font-size: 1.4rem; color: #3a3a3a; font-style: italic; }
blockquote { margin: 0 0 20px 10px; padding: 9px 20px 0 19px; border-left: 1px solid #aaa; }
blockquote cite { display: block; font-size: 12px; color: #555; }
blockquote cite:before { content: "\2014 \0020"; }
blockquote cite a, blockquote cite a:visited, blockquote cite a:visited { color: #555; }

/******************** CODE ********************/
code {
padding: .2rem .5rem;
margin: 0 .2rem;
font-size: 90%;
white-space: nowrap;
background: #F1F1F1;
border: 1px solid #E1E1E1;
border-radius: 4px; }
pre > code {
display: block;
padding: 1rem 1.5rem;
white-space: pre; }


/******************** TABLES ********************/
th,
td {
font-size: 1.5rem;
padding: 12px 15px;
text-align: left;
border-bottom: 1px solid #E1E1E1; }
th:first-child,
td:first-child {
padding-left: 0; }
th:last-child,
td:last-child {
padding-right: 0; }


/******************** SPACING ********************/
button,
.button {
margin-bottom: 1rem; }
input,
textarea,
select,
fieldset {
margin-bottom: 1.5rem; }
pre,
blockquote,
dl,
figure,
table,
ul,
ol,
form {
margin-bottom: 2.5rem; }


/******************** UTILITIES ********************/
.u-full-width {
width: 100%;
box-sizing: border-box; }
.u-max-full-width {
max-width: 100%;
box-sizing: border-box; }
.u-pull-right {
float: right; }
.u-pull-left {
float: left; }

.hide-text {
display: none;
}

/******************** DONATE BUTTON ********************/
a.btn {
background: #a4e61f;
color: #FFF;
font-size: 17px;
padding: 10px;
text-decoration: none;
max-width: 100%;
min-width: 288px;
background-image: -webkit-linear-gradient(top, #a4e61f, #76a30c);
background-image: -moz-linear-gradient(top, #a4e61f, #76a30c);
background-image: -ms-linear-gradient(top, #a4e61f, #76a30c);
background-image: -o-linear-gradient(top, #a4e61f, #76a30c);
background-image: linear-gradient(to bottom, #a4e61f, #76a30c);
-webkit-border-radius: 28;
-moz-border-radius: 28;
border-radius: 28px;

}

a.btn:hover {
background: #002375;
color: #FFF;
background-image: -webkit-linear-gradient(top, #002375, #01174a);
background-image: -moz-linear-gradient(top, #002375, #01174a);
background-image: -ms-linear-gradient(top, #002375, #01174a);
background-image: -o-linear-gradient(top, #002375, #01174a);
background-image: linear-gradient(to bottom, #002375, #01174a);
text-decoration: none;
}

/******************** BACKGROUND GRADIENT ********************/
body {
/* IE10 Consumer Preview */ 
background-image: -ms-linear-gradient(top, #fff 0%, #eee 100%);

/* Mozilla Firefox */ 
background-image: -moz-linear-gradient(top, #fff 0%, #eee 100%);

/* Opera */ 
background-image: -o-linear-gradient(top, #fff 0%, #eee 100%);

/* Webkit (Safari/Chrome 10) */ 
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(1, #eee));

/* Webkit (Chrome 11+) */ 
background-image: -webkit-linear-gradient(top, #fff 0%, #eee 100%);

/* W3C Markup, IE10 Release Preview */ 
background-image: linear-gradient(to bottom, #fff 0%, #eee 100%);
}

/******************** Clearing ********************/

/**** Self Clearing Goodness ****/
.container:after,
.row:after,
.u-cf {
content: "";
display: table;
clear: both; }


/******************** Media Queries ********************/
/*
Note: The best way to structure the use of media queries is to create the queries
near the relevant code. For example, if you wanted to change the styles for buttons
on small devices, paste the mobile query code up in the buttons section and style it
there.
*/

/* Larger than mobile */
@media (min-width: 400px) {}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {}

/* Larger than tablet */
@media (min-width: 750px) {}

/* Larger than desktop */
@media (min-width: 1000px) {}

/* Larger than Desktop HD */
@media (min-width: 1200px) {}
