/*
Theme Name: FEP Theme
Author: John Eckman
Template: responsive
*/

@import url("../responsive/style.css");

body {
	background: #ffffff;
	color: #000000;
}

p, 
hr, 
dl, 
pre,
form,
table,
address, 
blockquote {
	margin: 1.0em 0;
	line-height: 1.4;
}


select,
input[type="text"], 
input[type="password"],
input[type="email"] {
	-moz-box-sizing: border-box;
	-moz-border-radius: 2px;
	-webkit-box-sizing: border-box;
	-webkit-border-radius: 2px;
	-webkit-box-shadow: 0 1px 0 #fff, inset 0 1px 1px rgba(0, 0, 0, 0.2);
	-moz-box-shadow: 0 1px 0 #fff, inset 0 1px 1px rgba(0, 0, 0, 0.2);
	box-shadow: 0 1px 0 #fff, inset 0 1px 1px rgba(0, 0, 0, 0.2);
	background-color: #fff;
	box-sizing: border-box;
	border: 1px solid #aaa;
	border-bottom-color: #ccc;
	border-radius: 2px;
	margin: 0;
	outline: none;
	padding: 6px 8px;
	vertical-align: middle;
	width: auto;
	display: inline;
}

.widget-wrapper select,
.widget-wrapper input[type="text"], 
.widget-wrapper input[type="password"],
.widget-wrapper  input[type="email"] {
	width: 70%;
}


label {
	display: inline;
	font-weight: 700;
	padding: 2px 0;
}

a {
	color: #06c;
	font-weight: normal;
	text-decoration: none;
}


#wrapper {
	border: 0;
	border-radius: 0;
	padding: 0;
	margin: 0;	
}


/* constrain min-width */ 
#container {
    max-width: 900px;
}

#widgets {
	margin-top: 10px;
}

#top-widget .widget-title, #top-widget form {
	display: inline;
}

#top-widget {
	padding: 5px 0px 0px 5px;
}
#content, #content-archive {
	margin-top: 0px;
	
}

#widgets ul li a {
		display: block;
		text-decoration: none;
		width: 100%;
}
	
.widget-wrapper {
	background-color: #ffffff;
	border: none;
	padding: 0px;
	margin: 0px;
}

.col-620 {
width: 75%;
}

.col-300 {
width: 22.5%;
/* max-width: 300px; */ 
}

th, td, table {
	border: none;
	vertical-align: top;
}

/* these are from the old FEP Css */
.header1, h1.post-title {
	font-family: "Times New Roman", Times, serif;
	font-size: 30px;
	font-weight: bolder;
	color: #669933;
	padding-top: 10px;
	padding-bottom: 0px;
	padding-left: 0px;
	line-height: 1.4;
}

.header2 {
	font-family: "Arial", Times, serif;
	font-size: 20px;
	font-weight: bold;
	font-variant: normal;
	color: #993300;
	padding-top: 10px;
	padding-bottom: 0px;
	padding-left: 10px;
	line-height: 1.4;
	font-style: italic;

}

.body {
	font-family: "Arial", Times, serif;
	font-size: 14px; 
	color: #000000;
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 10px;
	line-height: 1.4;
}

#widgets ul {
	padding: 0;
	margin: 0;
	margin-right: 10px;
}

#widgets.grid-right {
	float: left;
}

#widgets div.widget_search, #top-widget div.widget_search {
	padding-bottom: 10px;
	padding-top: 10px;
}

/* this is the green menu either left or top 
   it shouldn't show below 480 				*/ 
@media screen and (min-width: 480px) {
	.widget_nav_menu ul {
		list-style-type: none;
		background-color: #D4E432;
		padding: 0px;
		padding-right: 10px;
	}

	.widget_nav_menu li {
		display: block;
		max-height: 30px;  
		padding: 30px 9px 30px 9px;
		background-color: #D4E432;
		line-height: 1.5em; 
		width: 100%;
		vertical-align: baseline; 
	}
	
	.widget_nav_menu li li {
		max-height: 48px; 
	}
	
	.widget_nav_menu li.menu-item-2317 {
		max-height: 60px; 
	}
	
	.widget_nav_menu li li {
		line-height: 16px;
		padding: 7px 9px 7px 9px; 
	}

	/* know the issues */
	.widget_nav_menu li.menu-item-2317 li:hover {
		max-height: 16px; 
	}
	
	.widget_nav_menu li.menu-item-2317 li li:hover {
		max-height: 48px; 
	}
	
	/* About F.E.P. */ 
	.widget_nav_menu li.menu-item-2312 li:hover {
		max-height: 32px; 
	}
	
	.widget_nav_menu li.menu-item-2312 li li:hover {
		height: auto;
		max-height:32px; 
	}
	

	.widget_nav_menu li.direct {
		background-color: #78A22F;
		color: #FFF;
	}
	
	.widget_nav_menu li.direct:hover, .widget_nav_menu li.direct a:hover {
		background-color: #3E2516;
	}
	

	.widget_nav_menu ul {
		text-align: center;
		z-index: 9999;
	}

	.widget_nav_menu .sub a { 
		background-image: url(images/arrow.gif);
		background-repeat: no-repeat; 
		background-position: 180px 0px; }
	
	.widget_nav_menu .sub ul a { background-image: none;}

	.menu-widget a {
		padding: 2px;
		display: block;
		color: #4A3416;
		/* vertical-align: middle;
		   color: #78A225 */
	}

	.menu-widget > li:hover a {
		color: #fff;
	}

	.menu-widget ul.sub-menu li a {
		color: #000;
	}

	.menu-widget li.direct a {
		color: #FFF;
	}

	.menu-widget li {
		font-family: 'Times New Roman',Times,serif;
		border-bottom: 5px solid #ffffff;
		font-size: 20px;
		font-weight: 900;
		text-transform: uppercase;	
	}

	.menu-widget li li {
		font-family: Verdana, Arial, sans-serif;
		border-bottom: none;
		text-transform: none;
		font-size: 14px;
		font-weight: normal;
		color: #000000;
	}

	.menu-widget li li a {
   		color: #000000;
	}
	
	.menu-widget li li a:hover, .menu-widget li li:hover {
		color: #ffffff;
	}
	
	.menu-widget li li:hover a {
		color: #ffffff;
	}
	
	.menu-widget li li:hover li a {
		color: #000000;
	}
	
	.menu-widget li li:hover li:hover a {
		color: #ffffff;
	}

	.menu-widget li:hover, .menu-widget a:hover {
		background-color: #78A22F;
		color: #ffffff;
	}

	/* sub-menu links */ 
	.menu-widget ul {
		width: 100%;
		padding: 0;
		display: block;
		padding-right: 10px;
	}

	/* hide submenus until hover */
	.menu-widget ul {
		position: absolute;
		top: -9999999px;
		left: 0;
		opacity: 0;
		background: #D4E432;
		text-align: left;
		border-left: 1px solid #ffffff;
		display: block;
	}

	.menu-widget li:hover > ul {
		position: relative;
		top: -60px;
		left: 202px;
		opacity: 1;
	}
	
	.menu-widget li.menu-item-19:hover > ul {
		position: relative;
		top: -90px;
		left: 202px;
		opacity: 1; 
	}
	
	.menu-widget li li:hover > ul {
		position: relative;
		top: -22px;
		left: 202px;
		opacity: 1;
	}
	
} /* end of green menu */

/* custom text widgets for left rail */
#widgets #text-2, #widgets #text-3 {
	background: #3E2516;
	color: #fff;
	width: 100%;
	padding-right: 10px;
	font-family: 'Times New Roman', Times, serif;
	border-bottom: 5px solid #ffffff;
	font-size: 20px;
	font-weight: 400;
	text-transform: uppercase;
	text-align: center;
	padding-top: 10px;
	padding-bottom: 10px;
}

#widgets #text-3 {
	padding-top: 25px;
	padding-bottom: 25px;
}

#footer {
	background: #669933;
	max-width: 800px;
	font-family: "Arial", Times, serif;
	padding-bottom: 5px;
}

#footer ul.footer-menu {
	float: center;
	color: #fff;
	padding-top: 2px;
	padding-bottom: 5px;
	margin: 0px;
}

#footer a, #footer div.copyright {
	color: #ffffff;
	text-decoration: none;
	font-size: 13px;
	padding-bottom: 0px;
	text-align: center;
	margin: 0;
	font-weight: bold;
	line-height: 18px;
}

#footer-wrapper div.col-940 {
	
}

#footer a {
	font-weight: bold;
}

#social {
	float: right;
	width: 75%; 
	max-height: 151px;
}

#social .social-icons {
	float: right;
	list-style: none;
	line-height: normal;
	padding: 0;
	margin: 0;
	padding-right: 20px;
	padding-bottom: 10px;
	margin-top: -55px;
	font-family: 'Times New Roman', Times, serif;
	font-size: 14px;
	font-weight: bold;
}

#social ul.social-icons li {
	display: inline;
	padding-left: 10px;
}

#social ul li.donate {
	text-transform: uppercase; 
	background-color: #9E2A30; 
	padding: 6px; 
	margin: 6px 10px 4px 10px; 
	vertical-align: middle;
	border: 1px solid #ffffff;
}

#social ul li.language {
	text-transform: uppercase;
	background-color: #582A18;
	padding: 6px; 
	margin: 6px 10px 4px 10px; 
	vertical-align: middle;
	border: 1px solid #827544;
}

#social ul li.donate a, #social ul li.language a {
	color: #ffffff;
}

#header_wrapper {
    max-width: 900px;
}

#logo {
	width: 29.667%;
	max-width: 267px;
	max-height: 151px;
}

#header_right {
	width: 70.334%;
	max-width: 633px;
	max-height: 151px; 
}

/* responsive header */
#logo {
	padding-top: 16.77%;
	background-size: cover;
	background-image: url('images/cropped-FEP-Header1a.gif');
	-moz-background-size: cover;  /* Firefox 3.6 */
    background-position: center;  /* ie 7 and 8 */
}

#header_right {
   padding-top: 16.77%;
   float: right; 
   background-size: cover;
   background-image: url('images/cropped-FEP-Header1b.gif');
   -moz-background-size: cover;  /* Firefox 3.6 */
    background-position: center;  /* ie 7 and 8 */
}

/* this hides the top-nav above 980 */
@media screen and (min-width: 980px) {
	.menu {
		display:none;
	} 
	/* hide the top search widget for wide */ 
	#top-widget {
		display: none;
	}
}

@media screen and (max-width: 980px) and (min-width: 480px) {
/* hide left-nav menu below 980 */ 
	
	#widgets .widget_nav_menu {
		display: none;
	}
	
	#widgets.col-300 {
		width: 80%;
		margin-left: 10%;
		margin-right: 10%;
	}
	
	#widgets #search-3 {
		display: none;
	}
	
	#widgets ul li a {
		display: block;
		text-decoration: none;
		width: 200px;
	}
	
	/* Show the main nav horizontal */ 
	.menu {
	    display: block;
		background: #D4E432;
		width: 100%;
		color: #78A22F;
		border-top: 1px solid #ffffff;
	} 
	
	.menu ul, .menu li {
		background: #D4E432;
	}
	
	.menu ul li.menu-item:hover a {
		background: #D4E432;
	}
	
	.menu a {
		color: #4A3416;
		text-shadow: none;
		border-left: 1px solid #ffffff;
		display: block;
	}
	
	ul.menu > li:hover a {
		color: #fff;
		background: #D4E432;
	}
	
	ul.menu ul.sub-menu li a {
		color: #000;
	}
	ul.submenu li a, ul.submenu li a:hover {
		color: #000000;
		background: #78A22F;
	}
	
	.menu li:hover, .menu a:hover {
		background: #78A22F;
	}
	
	.menu li li {
		background: #D4E432;
		color: #000000;
	}
	
	.menu li li a {
		color: #000000;
	}
	
	
	.menu .current_page_item a,
	.menu .current-menu-item a {
		background-color: #78A22F;
	}
	
	.menu li li a:hover {
		background: #78A22F !important;
		background-image: none;
		border: none;
		color: #000;
		filter: none;
	}

	.menu li li:hover {
		background: #78A22F !important;
		filter: none;
	}	
}

/* need to do something below 480 for menu */ 
@media screen and (max-width: 480px) {	
	
	#widgets .widget_nav_menu {
		display: none;
	}
	
	#widgets.col-300 {
		width: 80%;
		margin-left: 10%;
		margin-right: 10%;
	}
	.menu ul,
	.menu li,
	.top-menu,
	.footer-menu li,
	.sub-header-menu li {
		float: none;
	    text-align: center;
	    text-rendering: optimizeSpeed;
	}
}

#meteor-slideshow {
	margin-left: auto;
	margin-right: auto;
}

/* hide title on empty post used as home page */
body.home h1.post-title {
	display: none;
}

img.wp-post-image,
img.attachment-full,
img.attachment-large, 
img.attachment-medium, 
img.attachment-thumbnail {
	display: block;
	margin: 15px auto;
	width: auto;
	margin-top: 0px;
}


.qtrans_flag {
	display: inline;
}

/* on really small screens, don't use as much margin */ 
@media screen and (max-width: 650px) {
	#container {
		padding: 0px;
	}
	#wrapper {
		padding: 0px 15px;
	}
	
	
	#logo {
	float: left; 
	max-width: 267px;
	max-height: 151px;
	margin-right: 0px; 
	}

	#header_right {
	float: right; 
	max-width: 633px;
	max-height: 151px;
	}
	
	#social {
		width: 100%;
		float: right;
	}
}

@media screen and (max-width: 420px) {
	#social ul li.facebook-icon, #social ul li.twitter-icon, #social ul li.instagram-icon {
		display: none; 
	}
}

@media screen and (max-width: 780px) {
	#social ul li.donate {
		display: none;
	}
}