/*   
Theme Name:hfs1
Theme URI:http://heartlandfarmsanctuary.org
Description:WordPress theme with two columns, four widget areas and loads of jQuery functions (dropdown navigation, font resizing and more). The theme options include a movable sidebar, custom colours, excerpts on index pages, category or page navigation, different font and colour schemes. 
Author: Bob Cravens
Author URI:http://bobcravens.com/
Version:1.0
Tags:two-columns, fixed-width, theme-options, custom-colors, blue
.
Released under the <a href="http://www.opensource.org/licenses/gpl-license.php">GPL</a>.
.
*/

/* CSS Reset   
----------------------------------------------------------*/
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, font, 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 {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	vertical-align: baseline;
	background: transparent;
}

/* BODY
----------------------------------------------------------*/
body {
    font-size: 10px; /*.75em;*/
    font-family: Verdana, Helvetica, Sans-Serif;
    color: #696969;
    background-color: #e2e2e2;
}

/* LINKS   
----------------------------------------------------------*/
a 			{ outline: none; }
a:link 		{ color: #193c74; text-decoration: underline; }
a:visited 	{ color: #215c97; }
a:hover 	{ color: #ccc; text-decoration: none; }
a:active 	{ color: #000; }

/* HEADINGS   
----------------------------------------------------------*/
h1.page_headline {
	margin: 10px 0;
	padding: 3px 10px;
	color: #000;
}
h1, h2, h3, h4, h5, h6 {
	color: #000;
}
h1 			{ font-size: 2em; }
h2 			{ font-size: 1.5em; }
h3 			{ font-size: 1.2em; }
h4 			{ font-size: 1.1em; }
h5, h6 		{ font-size: 1em; }

/* MISC  
----------------------------------------------------------*/
.clear 		{ clear: both; }

/* PRIMARY LAYOUT ELEMENTS   
----------------------------------------------------------*/
#construction {
    margin: 0 0 10px 0;
    padding: 10px;
    background-color: #ffffdd;
    font-size: 2.0em;
    text-align: center;
}

#page-wrap {
    width: 988px;
    margin: 10px auto;
    background-color: #fff;
}

.border { padding: 20px; }

.text { color: #8dc3e9; }

.area {
	background-color: #193c74;
	color: #fff;
	margin: 10px 0 10px 0;
	padding: 10px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.area h1, .area h2, .area h3, .area h4, .area h5, .area h6 {
	color: #fff;
}

.area h4 {
	color: #8dc3e9;
	margin: 0 0 10px 0;
}

.warn {
	color: #880000;
	font-weight: bold;
	font-size: 1.2em;
	margin: 10px;
	padding: 10px;
	background-color: #8dc3e9;
}

.commands {
	margin: 20px 10px 10px 30px;
}

.javascript-required {
	display: none;
}

.align-right {
	text-align: right;
}

.align-center {
	text-align: center;
}

.bold {
	font-weight: bold;
}

.info {
	background-color: #ffffdd;
	border: solid 1px #aaa;
	margin: 10px;
	padding: 5px;
}

.info p {
	margin: 0 0 5px 0;
}

.content-area {
	background-color: #ddd;
	margin: 0 0 10px 0;
	padding: 10px;
	font-size: 1.5em;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.content-area form input,
.content-area form textarea {
	font-size: 1.2em;
	border: solid 1px #888;
	color: #555;
}

.content-area form textarea {
	font-family: Verdana, Helvetica, Sans-Serif;
	width: 100%;
}

.content-area form input:focus,
.content-area form textarea:focus {
	border: dotted 1px #fea31a;
	color: #000;
}

.content-area form input[type="submit"],
.glow {
	border: solid 2px #aaa;
	border-radius: 3x;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	background-color: #fcc36f;
	color: #643F05;
	text-decoration: none;
	font-weight: bold;
	padding: 3px;
	display: inline-block;
}

.content-area form p {
	margin: 3px;
}

.content-area form label {
	float: left;
	width: 150px;
	text-align: right;
	margin: 3px 3px 0 0;
}

.content-area a {
	color: #215c97;
}

.content-area a:hover {
	color: #ccc;
	text-decoration: underline;
}

.content-wrap {
	width: 560px; 
	margin: 0 auto;
}

.round {
}

.field-validation-error {
	font-size: 0.8em;
	color: #dd0000;
}

.validation-summary-errors {
	margin: 10px;
	padding: 5px;
	font-size: 1.0em;
	color: #dd0000;
}

ul.validation-summary-errors {
	padding: 5px 5px 5px 25px;
}


.header {
	background-color: #1e4d86;
	color: #fff;
	font-size: 14px;
	padding: 8px 25px;
	text-transform: uppercase;
}

/* Header
----------------------------------------------------------*/
#header {
	position: relative;
	height: 190px;
	border-bottom: 1px solid rgba(0, 0, 0, .25);
}

#header .logo {
	display: block;
	float: left;
	margin: 14px 0 0 3px;
}

#header-img {
	height: 160px;
	padding-left: 25px!important;
}

#header-areas {
	float: right;
}

# header-areas > div {
	display: inline;
}



#title {
	background-color: Transparent;
	color: #333F48;
	position: relative;
	top: 70px;
	left: 75px;
	z-index: 1000;
	font-family: 'Lato', sans-serif;
	font-size: 32px;
	font-weight: 700;
	text-transform: uppercase;
}

#title span.cap {
	font-size: 50px;
}

#slogan {
	background-color: Transparent;
	color: #7e7e7e;
	position: relative;
	left: 77px;
	top: 75px;
	z-index: 1000;
	font-family: 'Roboto', sans-serif;
	font-size: 18px;
	font-weight: 400;
	text-transform: capitalize;
}

#social {
	display: inline-block;
    font-size: 1.1em;
    padding: 3px 10px 6px 10px;
	position: absolute;
	left: 447px;
	top: 2px;
}

#social span {
	float: left;
	margin: 5px 5px 0 0;
	text-transform: uppercase;
	font-weight: bold;
}

#social a {
	display: block;
	float: left;
	height: 32px;
	width: 32px;
	margin: 0 3px 0 0;
	text-indent: -9999px;
}

#social a.facebook {
	background: transparent url(img/icon_facebook.png) no-repeat scroll 0 0;
}

#social a.twitter {
	background: transparent url(img/icon_twitter.png) no-repeat scroll 0 0;
}

#social a.youtube {
	background: transparent url(img/icon_youtube.png) no-repeat scroll 0 0;
}

#links-search {
	float: right;
    font-size: 1.1em;
    text-align: right;
	padding: 3px 10px 8px 10px;
    color: #4c88be;
    background-color: #1e4d86;
}

#links {
	display: none;
}

#links-search a {
	outline: none;
}

#links-search a:link {
    color: #fea31a;
    text-decoration: underline;
}

#links-search a:visited {
    color: #FBD397;
}

#links-search a:hover {
    color: #FBD397;
    text-decoration: none;
}

#links-search a:active {
    color: #12eb87;
}

input#search {
	border: 1px solid rgb(126, 157, 185); 
	padding: 2px; 
	background: #fff url(img/search_watermark.gif) no-repeat scroll left center; 
}

input#search.not-empty {
	background: #fff;
}

a#searchlink {
	border: solid 1px transparent;
	display: inline-block;
}

a#searchlink:hover {
	border: solid 1px #FBD397;
}

#searcharea {
	position: relative;
}
#searcharea > img {
	position: relative;
	top: 3px;
}
#searcharea a {
	position: relative;
	top: 3px;
}

/* Navigation  
----------------------------------------------------------*/
.menu-main-menu-container {
	overflow: visible;
	/*background-color: #1e4d86;*/
    margin: 0 10px;
	height: 33px;
	padding-top: 10px;
}


#menu-main-menu {
	display: inline;
	margin: 0;
	padding: 0;
}

#menu-main-menu li {
	list-style: none;
	float: left; /* arrange top level items horizontally */
	position: relative;
	/*border-right: solid 1px #888;*/
	z-index: 1000;
}

#menu-main-menu a {
	display: block;
	padding: 8px 25px;
	text-decoration: none;
	color: #333F48;
	font-weight: normal;
	font-size: 14px;
}

#menu-main-menu li a:hover {
	background-color: #FFF;
	color: #9A3324;
}

#menu-main-menu li.action {
	/*background: transparent url(img/nav_action_bg.png) repeat-x scroll 0 0;*/
	background-color: #FFF;/* #fea31b;*/
	float: right;
	width: 146px;
	text-align: center;
}

#menu-main-menu li.action.last {
	border-right: none;
}

#menu-main-menu li.action a {
	color: #333F48;
}

#menu-main-menu li.action a:hover {
	/*background-color: #fcb853;
	color: #000;*/
	color: #9A3324;
}

#menu-main-menu li ul {
	margin: 0;
	padding: 0;
	display: none;
	position: absolute;
}

#menu-main-menu li.action ul {
	right: 0;
}

#menu-main-menu li ul li {
	float: none; /* arrange submenus vertically */
	border-top: solid 1px #bfbfbf;/*#8dc3e9;*/
	width: 250px;
}

#menu-main-menu li ul li a {
	background: #FFF;/*#193c74;*/
	font-weight: normal;
}

#menu-main-menu li ul li a:hover {
	background-color: #FFF/* #4c88be;*/
	color: #9A3324;/*#000;*/
}

#menu-main-menu li.action ul li a {
	background-color: #fea31a;
}

#menu-main-menu li.action ul li a:hover {
	background-color: #FBD397;
	color: #000;
}

/* FOOTER  
----------------------------------------------------------*/
#footer {
	background-color: #000;
	color: #e7e7e7;
	border-top: solid 1px #4c88be;
	padding: 10px;
}

#footer a {
	color: #e7e7e7;
	text-decoration: none;
}
#footer a:hover {
	text-decoration: underline;
}
#footer .left {
	float: left;
	width: 25%;
}

#footer .highlight {
	color: Red;
}

#footer .center {
	float: left;
	width: 50%;
	text-align: center;
}

#footer .right {
	float: left;
	width: 25%;
	text-align: right;
}

#footer .copyright {
	clear: both;
	text-align: center;
}


/* MAIN AREA POSITIONS  
----------------------------------------------------------*/
#wrapper {
	margin: 10px;
}

.main {
	clear: both;
	float: left;
	width: 725px;
}
.sidebar {
	float: right;
	width: 230px;
}

/* SIDE BAR  
----------------------------------------------------------*/
.sidebar > div {
	margin: 0 0 15px 0;
}

.sidebar div.active a {
	width: 227px;
	height: 114px;
	display: block;
	text-indent: -100000px;
}
#sidebar-donate {
	background: url('img/sidebar/donate-btn.png') 0 0 no-repeat;
}
#sidebar-volunteer {
	background: url('img/sidebar/volunteer-btn.png') 0 0 no-repeat;
}
#sidebar-join {
	background: url('img/sidebar/join-btn.png') 0 0 no-repeat;
}
#sidebar-donate:hover, #sidebar-volunteer:hover, #sidebar-join:hover {
	background-position: 0 -114px;
}
.sidebar .header {
	font-size: 12px;
	padding: 4px 8px;
}

/* POST CONTENT  
----------------------------------------------------------*/
div.post
{
	font-size: 120%; 
	line-height: 2.0; 
	font-family: Helvetica;
	border: 1px solid #f1f1f1;
	background-color: #fdfdfd;
	padding: 10px;
}

div.post div.post-wrap
{
	width: 560px; 
	margin: 0 auto;
	background-color: #ddd;
	color: #333;
}

div.post h1, div.post h2, div.post h3, div.post h4, div.post h5, div.post h6
{
	margin: 10px 0;
}

div.post div.content
{
	font-size: 120%; 
}

div.post p
{
	margin: 0 0 20px;
}

div.post a
{
	color: #215c97;
}

div.post a:hover
{
	color: #ccc;
	text-decoration: underline;
}

div.post a.glow
{
	border: solid 2px #aaa;
	background-color: #fcc36f;
	color: #643F05;
	text-decoration: none;
	font-weight: bold;
	padding: 3px;
	display: inline-block;
}

div.post ul, ol 
{
	margin: 0 0 20px 20px;
}

div.post blockquote
{
	background-color: #ddd;
	border: 1px solid #888;
	margin: 10px;
	padding: 10px;
}

div.post img.alignleft
{
	float: left;
}

div.main div.widget {
	margin: 25px 0 0 0;
}

/* GOOD EGGS  
----------------------------------------------------------*/
#news
{
	background-color: #eee;
	margin: 12px 0;
	display: block;
}

.slider
{
	overflow: auto;
	padding: 5px 10px 10px 10px;
	border: 1px solid #eee;
}

.slider ul
{
	list-style: none;
	/*width: 2040px;*/
}

.slider ul li
{
	float: left;
	width: 212px;
	padding: 5px;
}

.slider ul li a,
.slider ul li a:visited
{
	background-color: #fff;
	border: solid 1px #fff;
	text-decoration: none;
	display: block;
	padding: 3px;
	min-height: 300px;
}

.slider ul li a:hover
{
	background-color: #eee;
	border: solid 1px #888;
}

.slider ul li a span.img-container
{
	display: block;
	text-align: center;
}

.slider ul li a span.img-container img
{
	max-height: 117px;
	max-width: 203px;
}

span.title,
div.title
{
	color: #193c74;
	font-size: 1.5em;
	font-weight: bold;
	display: block;
}

span.summary,
div.summary
{
	color: #333;
	font-size: 12px;
	margin: 5px 0 0 0;
	display: block;
}

/* FEATURED AREA  
----------------------------------------------------------*/
#featured div.left
{
	float: left;
	width: 49%;
	background-color: #eee;
}

#featured div.right
{
	float: right;
	width: 49%;
	background-color: #eee;
}

#featured div.left > div,
#featured div.right > div
{
	margin: 1px;
	padding: 13px;
	background-color: #fff;
	overflow: auto;
}

#featured div.summary p
{
	margin-bottom: 5px;
}

#featured div.summary img
{
	float: left;
	height: 75px;
	margin: 3px;
}

/* DONATE
----------------------------------------------------------*/
div#donate form
{
	display: inline-block;
}

div#donate input
{
	width: 105px;
}

a#paytrace
{
	display: block;
}
a#paytrace img
{
	 height:50px; 
	 border: none;
}


/* Blog
----------------------------------------------------------*/
#blog-page {
	padding: 20px 20px 0 40px;
}
#blog-page div.post {
	background-color: #fff;
	border: 5px solid #f2f2f2;
	margin: 0 0 20px -10px;
}
#blog-page div.date {
	position: absolute; 
	width: 60px; 
	height: 60px; 
	padding: 10px 0; 
	margin: 0 0 0 -70px; 
	background: #fff; 
	font: normal 14px Georgia;
	text-align: center;
	color: #666;
	background-color: #f2f2f2;
}
#blog-page p.date-month {
	margin: 2px 0 15px 0;
	color: #999;
	font: normal 32px Georgia;
}
#blog-page div.headline h1 {
	margin: 10px 0 0 0;
}
#blog-page div.headline h1 a {
	text-decoration: none;
}
#blog-page p {
	margin: 0 0 20px 0;
}
#blog-page div.excerpt, #blog-page div.content {
	font-size: 16px; 
}
#blog-page p.tag_info, #blog-page p.post_info {
	margin: 0 0 10px 0;
	font: italic 14px Georgia, sans-serif;
}
#blog-page p.tag_info a, #blog-page p.post_info a {
	text-decoration: none;
}
#blog-page p.tag_info a:hover,  #blog-page p.post_info a:hover {
	text-decoration: underline;
}

p.previous-posts {margin:50px 0 0 0; float:left; font:normal 130% Verdana;}
p.next-posts {margin:50px 0 0 0; float:right; font:normal 130% Verdana;}
div.bookmarks {text-align:right; float:right;}
.category-link {background:url(img/page.png) no-repeat;}
.comment-link {background:url(img/comments.png) no-repeat;}
.tag-link {background:url(img/tag-blue.png) no-repeat;}
.user-name {background:url(img/user-green.png) no-repeat;}
.user-mail {background:url(img/email.png) no-repeat;}
.user-url {background:url(img/world-edit.png) no-repeat;}
.user-comment {background:url(img/comment-add.png) no-repeat;}
.info-icon {padding:3px 0 3px 20px; margin:0; background-position:0px 4px;}
code {font:normal 120% Courier, serif;}

/* Comments
----------------------------------------------------------*/
div.comment {margin:10px 0 30px 0; padding:10px 0; border-bottom:1px dotted #ccc;}
p.comment-details {font:normal 130% Georgia, serif;}
.avatar {float:left; margin:0 20px 0 0; border:5px solid #eee;-moz-border-radius:5px;-webkit-border-radius: 5px;}
div.comment-text {margin:50px 0 0 0;}
div.author-comment {background: #f9fbc1;-moz-border-radius:5px;-webkit-border-radius:5px; padding: 10px !important; border:1px solid #f1f1f1;}

h2#comment-header {margin:40px 0 10px 0 !important; border-bottom:1px dotted #ccc; padding:0 0 5px 0;}
h2#respond {margin:40px 0 10px 0 !important;}
h3#no-comments {font:italic bold 110% Georgia, serif !important; color:#666 !important;}


/* Forms
----------------------------------------------------------*/
label {display:block; margin:0 0 5px 0;}
textarea {width:450px; height:150px; margin:0; padding:5px; background:url(img/bg-form-text.gif) repeat-x left top #fff; border:1px solid #ccc; -moz-border-radius:5px;}
.submit {width:auto; padding:5px 20px; margin:5px 0; color:#fff; background:#333; border:1px solid #333; -moz-border-radius:5px;-webkit-border-radius: 5px;}
input[type=text] {
	padding: 5px 3px;
}


/* Search forms
----------------------------------------------------------*/
input#search {width:150px; padding:5px; background:url(img/bg-form-text.gif) repeat-x left top; border:1px solid #ccc;}
#search-submit {padding:5px; color:#fff; background:#333; border:none;}
div#left div#searchform {padding: 0 0 0 20px;}
p.not-found {padding: 0 0 0 20px; margin:0;}



/* Wordpress CSS
----------------------------------------------------------*/
img.alignright {float:right; margin:0 0 30px 30px;}
img.alignleft {float:left; margin:0 50px 30px 0;}
img.aligncenter {display:block; margin-left:auto; margin-right:auto;}
a img.alignright {float:right; margin:0 0 30px 30px;}
a img.alignleft {float:left; margin:0 50px 30px 0;}
a img.aligncenter {display:block; margin-left:auto; margin-right:auto;}

.aligncenter, div.aligncenter {display:block; margin-left:auto; margin-right:auto;}
.alignleft {float:left;}
.alignright {float:right;}

.wp-caption {border:1px solid #ddd; text-align:center; background-color:#f3f3f3; padding-top:4px; margin:10px;}
.wp-caption img {margin:0;padding:0;border:0 none;}
.wp-caption p.wp-caption-text {font-size:110%; line-height:17px; padding:0 4px 5px; margin:0;}


/* Sidebar Widgets
----------------------------------------------------------*/
.sidebar div.widget {
	margin-bottom: 35px;
	font-size: 12px;
}
.sidebar div.widget h4 {
	margin: 5px 0 3px 0;
	color: #215c97;
	font-weight: bold;
}
.sidebar div.widget ul {
	padding: 0 0 10px 10px;
}
.sidebar div.widget ul li {
	margin: 5px 0 0 10px;
}

.sidebar .hfs_button:first-child {
	margin-top: 5px;
}
.sidebar .hfs_button {
	text-align: center;
	display: block;
	text-decoration: none;
	font-weight: 400;
	font-size: 19px;
	margin-bottom: 10px;
	padding: 36px 0;
	background-color: #e6e6e6;
	color: #fff;
}
.sidebar .hfs_button.btn1 {
	background-color: #005cff;
}
.sidebar .hfs_button.btn1:hover {
	background-color: #2e78fc;
}
.sidebar .hfs_button.btn2 {
	background-color: #fea31b;
}
.sidebar .hfs_button.btn2:hover {
	background-color: #fcb853;
}
.sidebar .hfs_button.btn3 {
	background-color: #017530;
}
.sidebar .hfs_button.btn3:hover {
	background-color: #00aa45;
}


/* Admin Dashboard
----------------------------------------------------------*/
#admin-dashboard{
	background-color: #000;
	color: #fff;
	padding: 10px;
	z-index: 99999999;
	overflow: auto;
}
#admin-dashboard h3 {
	color: #888;
	margin: 0 0 10px 0;
	text-decoration: underline;
}
#admin-dashboard a {
	display: block;
	background-color: #333;
	margin: 3px;
	padding: 5px;
	color: #fff;
	text-decoration: none;
}
#admin-dashboard a:hover {
	background-color: #ccc;
	color: #000;
}
#admin-dashboard ul {
	list-style: none;
}

#admin-dashboard li {
	margin: 0 0 10px 0;
	float: left;
}

#site-banner {
	position: fixed;
	display: flex;
	top: 0;
	left: 0;
	right: 0;
	text-align: center;
}

#site-banner-title {
	color: #333F48;
	font-family: 'Arial';
	font-size: 18px;
}

#site-banner-description {
	color: #475866;
	font-family: 'Arial';
	font-size: 14px;
}