/*
Theme Name: Save Our Reserves
Author: Shaun Lee
*/

/* off white e5eee5 highlight 6fe14c mute light 7db17b mute 5b815a dark 27501b text 222920*/

/* =====================
Normalise
=======================*/
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{font-size:100%;font:inherit;padding:0;border:0;margin:0;vertical-align:baseline}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}.clear{clear:both}
.sticky{}.bypostauthor{}.wp-caption{}.wp-caption-text{}.gallery-caption{}.alignright{}.alignleft{}.aligncenter{}.screen-reader-text{clip:rect(1px, 1px, 1px, 1px);position:absolute !important}

* { margin: 0; }

/* =====================
Generic
=======================*/

html, body {
    font-family: "Open Sans", "Helvetica Neue", helvetica, arial, sans-serif;
    color: #27501b;
    height: 100%;
}

#wrapper {
    min-height: 100%;
    /* equal to footer height */
    margin-bottom: -160px;
}

#wrapper:after {
    content: "";
    display: block;
}

a:link, a:visited {
    text-decoration: none;
    color: #7db17b;
}

a:hover, a:active {
    text-decoration: underline;
    color: #6fe14c;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Bree Serif', serif;
}

/* =====================
Header
=======================*/

header #site-title {
    background-repeat: no-repeat;
    background-size: 460%;
    background-position: center;
    height: 360px;
}

#branding a:link, #branding a:visited, #branding a:hover, #branding a:active {
    text-indent: -9999px;
    background: url('img/sor-white.svg') no-repeat;
    width: 280px;
    height: 280px;
    margin: 0 auto;
    display: block;
}

header .site-description {
    color: #fff;
    font-style: italic;
    width: 280px;
    margin: 0 auto;
    text-align: center;
}

@media only screen and (min-device-width: 1023px) {
    header #site-title {
        height: 260px;
        background-size: cover;
    }
    
    #branding a:link, #branding a:visited, #branding a:hover, #branding a:active {
        width: 180px;
        height: 180px;
        margin: 0 20px;
        display: inline-block;
        vertical-align: top;
    }
    
    header .site-description {
        display: inline-block;
        text-align: left;
        padding: 90px 70px;
        vertical-align: top;
        width: 640px;
        font-size: 3.2rem;
    }
}

.menu li a:link, .menu li a:visited {
    display: block;
    width: 92.5%;
    padding: 8px 3.75%;
    border-bottom: solid 1px #fff;
    text-align: center;
    text-decoration: none;
    color: #27501b;
    background-color: #6fe14c;
}

.menu li a:hover, .menu li a:active {
    display: block;
    width: 92.5%;
    padding: 8px 3.75%;
    border-bottom: solid 1px #fff;
    text-align: center;
    text-decoration: none;
    color: #fff;
    background-color: #27501b;
}

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

    .menu {
        position: absolute;
        top: 20px;
        right: 10px;
        display: table;
        width: 40rem;
    }

    .menu ul {
        display: table-row;
        margin: 0;
        padding: 0;
    }

    .menu ul li {
        list-style: none;
        display: table-cell;
        text-align: center;
    }

    .menu li a:link, .menu li a:visited, .menu li a:hover, .menu li a:active {
        padding: 8px 8px;
        width: auto;
        border-bottom: none;
        background-color: transparent;
        color: #fff;
        background-color: rgba(34,41,32,.3);
        border-radius: 2px;
        margin: 0 1px;
    }
    
    .menu li a:hover, .menu li a:active {
        background-color: rgba(34,41,32,.5);
    }

}

/* =====================
Page
=======================*/
@media only screen and (min-device-width: 1023px) {
    .type-page {
        width: 60%;
        margin: 0 auto;
    }
}

h1 {
    font-size: 2rem;
    text-align: center;
}

h2 {
    font-size: 1.5rem;
}

h3 {
    font-size: 1.2rem;
}

h4 {
    font-size: 1.2rem;
    font-style: italic;
    margin: 2rem 0;
}

.entry-content {
    padding: 20px;
    line-height: 1.2rem;
}

.entry-content strong {
    font-weight: 700;
}

.entry-content p {
    line-height: 1.4rem;
    margin: 1rem 0;
}

@media only screen and (min-device-width: 1023px) {
    h1 {
        font-size: 4rem;
        text-align: left;
        margin: 0 0 0 20px;
        margin-top: -5rem;
        color: #fff;
    }
}

.entry-content ol{
    padding: 20px; 
    list-style-type:decimal;

}
.entry-content ol li {
    margin: 10px 10px;
    padding: 10px 10px;
}

.entry-content li {
    padding: 20px;
}

hr {
    clear: both;
    margin-top 6rem;
}

/* =====================
Home
=======================*/

.petition:link, .petition:visited, .petition:hover, .petition:active {
    display: block;
    margin: 20px auto;
    padding: 20px 40px;
    font-size: 2rem;
    font-family: 'Bree Serif', serif;
    color: #fff;
    background-color: #e5eee5;
    border: solid 4px #27501b;
    width: 200px;
    text-align: center;
    text-transform: uppercase;
    line-height: 2rem;
    border-radius: 12px;
    text-decoration: none;
    background-color: #e5eee5;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url('img/grad-swatch.png');
}

.petition:hover, .petition:active {
    background-color: #5b0000;
}

.teaser:link, .teaser:visited, .teaser:hover, .teaser:active {
    padding: 5%;
    display: inline-block;
    width: 35%;
    min-height: 80px;
    color: #fff !important;
    font-family: 'Bree Serif', serif;
    font-size: 2rem;
    vertical-align: top;
    background-color: #6fe14c;
    background-repeat: no-repeat;
    background-size: cover;
    text-decoration: none;
}

.teaser:hover, .teaser:active {
    background-color: #5b0000;
}

.safe {
    background-image: url('img/river-talks.png');
    margin: 5% 1% 5% 3%;
}

.action {
    background-image: url('img/digger.png');
    margin: 5% 3% 5% 0;
}

@media only screen and (min-device-width: 1023px) {
    .teaser {
        font-size: 2rem;
    }
}

/* =====================
Extras
=======================*/

blockquote, .letter {
    clear: both;
    font-style: italic;
    padding: 20px;
    margin: 20px;
    border: 1px solid #27501b;
}

/*.qa {
    font-family: 'Bree Serif', serif;
    font-size: 2rem;
    background-color: #7db17b;
    display: inline-block;
    width: 2rem;
    height: 2rem;
    border-radius: 2rem;
    text-align: center;
    vertical-align: middle;
    padding: .5rem;
    color: #fff;
    text-indent: 6rem;
}
*/

.page-id-16 .entry-content p { /* FAQs */
    margin: 2rem 0;
}


/* =====================
Footer
=======================*/

#wrapper:after {
    height: 160px;
}

footer {
    font-size: .8rem;
    background: #222920;
    height: 160px;
    color: #5b815a;
    text-align: center;
}

#facebook {
    background-color: #3b5998;
    color: #fff;
    padding: 20px;
}

#facebook a:link, #facebook a:visited, #facebook a:hover, #facebook a:active {
    background: url('img/facebook.png') no-repeat;
    background-size: cover;
    width: 260px;
    height: 77px;
    text-indent: -9999px;
    display: block;
    margin: 0 auto;
}

#mc_embed_signup {
    background: #e5eee5;
    padding: 20px;
}

#mc_embed_signup form {
    text-align: center !important;
}

#mc_embed_signup label {
    width: auto;
    margin: 0;
    display:inline-block !important;
}

footer .ends {
    background: #222920;
    padding: 20px;
}

footer p {
    padding: 8px 0;
}

footer .copyright {
    font-style: italic;
}

/* ==
Form
== */

.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 textarea
{
    padding: 20px;
    margin: 0 20px;
    width: 80%;
}

.wpcf7 {
    background-color: #eee;
    text-align: center;
}

.wpcf7-submit {
	border : solid 1px #638a00;
	border-radius : 3px;
	moz-border-radius : 3px;
	-webkit-box-shadow : 0px 2px 2px rgba(0,0,0,0.4);
	-moz-box-shadow : 0px 2px 2px rgba(0,0,0,0.4);
	box-shadow : 0px 2px 2px rgba(0,0,0,0.4);
	font-size : 20px;
	color : #ffffff;
	padding : 7px 20px;
	background : #96c300;
	background : -webkit-gradient(linear, left top, left bottom, color-stop(0%,#96c300), color-stop(100%,#648c00));
	background : -moz-linear-gradient(top, #96c300 0%, #648c00 100%);
	background : -webkit-linear-gradient(top, #96c300 0%, #648c00 100%);
	background : -o-linear-gradient(top, #96c300 0%, #648c00 100%);
	background : -ms-linear-gradient(top, #96c300 0%, #648c00 100%);
	background : linear-gradient(top, #96c300 0%, #648c00 100%);
	filter : progid:DXImageTransform.Microsoft.gradient( startColorstr='#96c300', endColorstr='#648c00',GradientType=0 );
}