﻿/*------------------------------------*\
    RESET - updated 3/8/2014 - new image
\*------------------------------------*/
/*
A more considered reset; more of a restart...
*/
html,body,div,span,applet,object,iframe,
h1,h2,h3,h4,h5,h6,p,blockquote,pre,hr,
a,abbr,address,cite,code,
del,dfn,em,img,ins,kbd,q,s,samp,
small,strong,sub,sup,tt,var,
b,u,i,
dl,dt,dd,ol,ul,li,
fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td,
article,aside,canvas,details,figcaption,figure,
footer,header,hgroup,menu,nav,section,summary,
time,mark,audio,video{
	margin:0;
	padding:0;
}
article,aside,details,figcaption,figure,footer,
header,hgroup,menu,nav,section{
	display:block;
}
h1,h2,h3,h4,h5,h6{
	font-size:100%;
}
table{
	border-collapse:collapse;
	border-spacing:0;
}
strong,b,mark{
	font-weight:bold;
	font-style:inherit;
}
em,i,cite,q,address,dfn,var{
	font-style:italic;
	font-weight:inherit;
}
abbr[title],dfn[title]{
	cursor:help;
	border-bottom:1px dotted;
}
ins{
	border-bottom:1px solid;
}
a,u,ins{
	text-decoration:none;
}
del,s{
	text-decoration:line-through;
}
pre,code,samp,kbd{
	font-family:monospace;
}
small{
	font-size:0.75em;
}
img{
	border:none;
	font-style:italic;
}
input,
select,
textarea{
	font:inherit;
}

p {
	/*padding: .25% 0 .25% 0;*/ 
	font-family: 'Lato', sans-serif;
	padding: .5em 0 .5em 0; 
}
h1, h2, h3, h4, h5, h6 {
	padding-bottom: 0%;
	padding-left: 0;
	padding-right: 0;
	padding-top: 0%;
	font-family: 'Quicksand', sans-serif;
	color: white;
}


h1 {
		font-size: 3.0em;
		

}
h2 {
		font-size: 1.5em;
		padding-bottom: .5em;
		/* padding-bottom: .5em; */
}
h4 {
		font-size: 1.25em;
}

body {
	background-color: black;
}

a:visited {
	/*color: blue; */
}


#container {

	margin: 0 auto;
	padding: 0;
	text-align: left;
	overflow: auto;

}

#wideheader{
	/*background-color: #3300CC;*/
	background-color: black;
	color: white;
	text-align: left;
	margin: 0;
	padding: 0;
	display: none;
}
#header {
	background-color: white;
	padding: 0;
	float: left;
}
#widenavbar2 {

	padding: 0;

	
}
#navbar2 {
	height: 1.75em; 
	/* background-color: #3300CC; */
	background-color: black;
	color: white;
	margin-left: auto;
	margin-right: auto;
	padding: 0;
	float: right;
	width: 550px;


}

#basictable {
	border-collapse: collapse;
	border-spacing: 6px;
	border: 1px white solid;
	font-size: 1em;
	text-align: left;
	color: white;


}
#basictable td {
	padding: 1px 10px;
}
#basictable tr:first-child td {
	font-weight: bold;
	border-bottom: 1px white solid;
}
#basictable tr:hover {
	background-color: silver;
}
#basictable tr td {
	border-bottom: thin white solid;
}
#mainContent a {
	color: white;
	text-decoration: underline;
}


.searchtable {
	color: white;
}


.searchtable th {
	width: 125px;
}

.contentfloatleftwhite {
	float: left;
	padding: 5px;
	margin: 0 1% 1% 1%;
	color: black;
	background-color: white;
	width: 500px;

}

.contentfloatleft {
	float: left;
	padding: 0px 0px 0px 5px;
	margin: 0 5px 5px 5px;
	color: white;
}

/*.contentfloatleft {
	float: left;
	padding: 0px .5% 0px .5%; */
	/*margin: 0 .5% .5% .5%; *//*bottom was .5% */
	/*color: white;
}*/

.thinroundedborder {
	border: thin white solid;
	border-radius: 5px;
}

.specialmessage {
	float: left;
	padding: 0px 0px 0px .5%;
	margin: 0 .5% .5% .5%;
}

.logofloatleft {
	float: left;
	padding: .5% 1% 0px 1%;
	margin: 0 .5% .5% 0;
}
.logofloatright {
	float: right;
	width: 30%;
	padding: .5% 1% 0px 1%;
	margin: 0 .5% .5% 0;
}

.padding5 {
	padding: 5px;
}


.featuredbanknote {
	float: left;
	/*width: 500px;*/
	width:  300px;
	/*height: 500px;*/
	padding: 5px;
	margin: 0 0 1% 1%;
	border: thin white solid;
	color: white;
	border-radius: 5px;
	/* border-top: black solid;
	border-bottom: black solid; */
	/*background-color: white;/* #F8F8F8;*/
}

.featuredbanknoteright {
	float: right;
	width: 300px;
	padding: 1%;
	margin: 0 .5% .5% 0;
	border: thin gray solid;
		
}

.whitetext {
	color: white;
}

.width100 {
	width: 100%;
}

.width60 {
	width: 60%;
}

.width30 {
	width: 30%;
}

.blackbackground {
	background-color: black;
}

.banknotes, .banknoteset {
	float: left;
	font-family: 'Lato', sans-serif;
	width:  300px;
	height: 500px;
	padding: 5px;
	margin: 0 1% 1% 0;
	/* border-top: black solid;
	border-bottom: black solid; */
	overflow: hidden;
	/*background-color: white; *//* #F8F8F8; */
	color: white;
	border: thin white solid;
	border-radius: 5px;
}

.banknotesdetailed {
	float: left;
	width: 700px;
	padding: 1% 1% 1% 0px;
	margin: 0 0px 1% 0px;
	overflow: hidden;
	color: white;
	/*font-size: 1em;*/
}

.newarrivalslistbox {
	float: left;
	width: 100;
	padding: .5% 0 0 0;
	margin: 0 0 1% 1%;
	/*font-size: 1em;*/
}


/*.banknoteset {
	float: left;
	width: 300px;
	height: 500px;
	padding: 5px;
	margin: 0 1% 1% 0px;
	font-family: 'Lato', sans-serif;
	border-top: black solid;
	border-bottom: black solid;
	background-color: white; 
	overflow: hidden;
	color: black;
}*/

.buttonbox {
	width: 100%;
}

.editbuttonred, .editbuttongreen, .editbutton, .editbuttonblue {
	color: white;
	padding: 5px 20px;
	/* margin-right: .5%; */
	border-radius: 15px;
}


.editbuttonred:visited, .editbuttongreen:visited, .editbutton:visited, .editbuttonblue:visited {
	color: white;
}

.editbutton {
	background: gray;
	color: white;
}

.editbuttonred {
	background: red;
}

.editbuttongreen {
	background: green;
}

.editbuttonblue {
	background: blue;
}

.backgroundred {
	background: red;
}

.backgroundgreen {
	background: green;
}

.backgroundyellow {
	background: yellow;
}

.backgroundwhite {
	background: white;
}

.backgroundblue {
	background: blue;
}

#thisWeek {
	float: left;
	/* background-color: #3300CC; */
	background-color: black;
	color: white;
	padding: 10px 10px 10px 10px;
	font-size: 1.0em;
	width: 200px;
	/* border: thin gray solid; */
}
#thisWeek ul {
	list-style-type: none;
	text-decoration: none;
	padding: .5% .5% .5% 0;
}
#thisWeek a {
	color: white;	
	
}
#thisWeek a:hover {
	text-decoration: underline;	
}
#leftdiv {
	float: left;
	padding: 10px 20px 10px 0px;
	width: 150px;
	/* border: thin gray solid; */
}

.level1ul {
	margin-left: 1em;
}

#contentwrap {
	margin-left: auto;
	margin-right:auto;
	padding: 0;
	float: left;
	overflow:hidden;
}
#mainContent {
	background-color: white;
	background-image: url("starry20background.png");
	overflow: hidden;
}
#mainContent p {
	/*font-size: .9em; */
}
#mainContent li {
	/* padding: 0 0 .25em 0; */
	padding: 0 0 .075% 0;

}
#mainContent ul {
	list-style-type: disc;
	list-style-image: url(bullet.gif);
	list-style-position: inside;
	padding: .5em .5em .5em 1em;
	font-size: 1.0em;

}

#mainContent ol {
	list-style:decimal;
	list-style-position: inside;
	padding: .5em .5em .5em 1em;
	font-size: 1.0em;
}

.level1ul {
	margin-left: .5em;
}
#footer {

	margin-bottom: auto;
	margin-left: auto;
	margin-right:auto;
	padding: 1% 0;
	background-color: black;
	color: white;
	text-align: left;
	
}
#sermonChart {
	border-collapse: collapse;
	border-spacing: 6px;
	border: 1px gray solid;
	font-size: .8em;
	text-align: left;
}
#sermonChart td {
	padding: 1px 10px;
}
#sermonChart tr:first-child td {
	font-weight: bold;
	border-bottom: 1px gray solid;
}
#sermonChart tr:hover {
	background-color: silver;
}
#sermonChart tr td {
	border-bottom: thin gray solid;
}

/* MailChimp Form Embed Code - Slim - 08/17/2011 */

#mc_embed_signup {
	background:#fff; 
	/*clear:left; */
	font:14px Helvetica,Arial,sans-serif; 
	padding: 0 0 0 0;
	margin: 0 0 0 0;
}

#mc_embed_signup form {display:block; position:relative; text-align:left; padding:10px 0 10px 0}
#mc_embed_signup h2 {font-weight:bold; padding:0; margin:15px 0; font-size:1.4em;}
#mc_embed_signup input {border:1px solid #999; -webkit-appearance:none;}
#mc_embed_signup input[type=checkbox]{-webkit-appearance:checkbox;}
#mc_embed_signup input[type=radio]{-webkit-appearance:radio;}
#mc_embed_signup input:focus {border-color:#333;}
#mc_embed_signup .button {clear:both; background-color: #aaa; border: 0 none; border-radius:4px; color: #FFFFFF; cursor: pointer; display: inline-block; font-size:15px; font-weight: bold; height: 32px; line-height: 32px; margin: 0 5px 10px 0; padding:0; text-align: center; text-decoration: none; vertical-align: top; white-space: nowrap; width: auto;}
#mc_embed_signup .button:hover {background-color:#777;}
#mc_embed_signup .small-meta {font-size: 11px;}
#mc_embed_signup .nowrap {white-space:nowrap;}     
#mc_embed_signup .clear {clear:none; display:inline;}

#mc_embed_signup label {display:block; font-size:16px; padding-bottom:10px; font-weight:bold;}
#mc_embed_signup input.email {display:block; padding:8px 0; margin:0 4% 10px 0; text-indent:5px; width:58%; min-width:130px;}
#mc_embed_signup input.button {display:block; width:35%; margin:0 0 10px 0; min-width:90px;}

#mc_embed_signup div#mce-responses {float:left; top:-1.4em; padding:0em .5em 0em .5em; overflow:hidden; width:90%;margin: 0 5%; clear: both;}
#mc_embed_signup div.response {margin:1em 0; padding:1em .5em .5em 0; font-weight:bold; float:left; top:-1.5em; z-index:1; width:80%;}
#mc_embed_signup #mce-error-response {display:none;}
#mc_embed_signup #mce-success-response {color:#529214; display:none;}
#mc_embed_signup label.error {display:block; float:none; width:auto; margin-left:1.05em; text-align:left; padding:.5em 0;}

.sidebaritem {
	padding: .15em 0 ;
	border-bottom: thin white solid;
	
}

.pbordertop {
	border-top: thin solid black;
}

.videoleft {
	float: left;
	width: 300px;
}
.clearfloat {
	clear:both;
	height:0;
	font-size: 1px;
}
.clearfloatright {
	clear: right;
	height:0;
	font-size: 1px;
}
.clearfloatleft {
	clear: left;
	height:0;
	font-size: 1px;
}


.photo {
	width: 300px;
	font-size: .8em;
	font-style: italic ;
	/* line-height: 1em; */
	text-align:center;
}
.phototitle {
	height: 100px;
	width: 850px;
}
.photoright {
	width: 300px;
	font-size: .5em;
	/* line-height: 1em;*/
	text-align:center;
	float: right;
	margin-left: .8em;
}
.photorightlandscape {
	width: 200px;
	font-size: .5em;
	/* line-height: 1em;*/
	text-align:center;
	float: right;
	margin-left: .8em;
}
.photoleft {
	width: 300px;
	height: auto;
	font-size: .5em;
	/* line-height: 1em;*/
	text-align:center;
	float: left;
	/*margin-right: .8em;*/
	margin-bottom: .5em;
	margin-right: .5em;
}

.photoleftset {
	width: 150px;
	height: auto;
	font-size: .5em;
	/* line-height: 1em;*/
	text-align:center;
	float: left;
	margin-right: .8em;
	margin-bottom: .5em;	
}

.photoleftlarge {
	width: 450px;
	height: auto;
	font-size: 1.5em;
	/* line-height: 1em;*/
	text-align:center;
	float: left;
	margin-right: 10px;
	margin-bottom: .5em;
}

.photoleftlargest {
	width: 95%;
	height: auto;
	float: left;
	margin-right: 5%;
}

.photoleftlargeset {
	width: 225px;
	height: auto;
	font-size: .5em;
	/* line-height: 1em;*/
	text-align:center;
	float: left;
	margin-right: 10px;
	margin-bottom: .5em;
}

.photoicon {
	width: 30px;
	height: auto;
	font-size: .5em;
	/* line-height: 1em;*/
	text-align:center;
	float: left;
	margin-right: .8em;
}


.photoleftlandscape {
	width: 150px;
	font-size: .5em;
	/* line-height: 1em;*/
	text-align:center;
	float: left;
	margin-right: .8em;
}

.photoleftsmall {
	width: 240px;
	font-size: .5em;
	/* line-height: 1em; */
	text-align:center;
	float: left;
	margin-right: .8em;
}
.bold {
	font-weight:bold;
}
.center {
	text-align:center;
	}
.floatRight {
	float: right;
	margin-left: .8em;
}
.floatLeft {
	float: left;
	margin-right: .8em;
}

.width80 {
	width: 80%;
}

h5 a:hover {
	text-decoration:underline;
}

input[type=text]{
	/*width: 500px;*/
	}


label {
	display: block;
	float: left;
	margin: 2px 4px 6px 4px;
	font-family: 'Lato', sans-serif;
	
}
select {
	float: left;
}

.smalllabel {
	width: 150px;
	text-align: right;
}

.largelabel {
	width: 400px;
	text-align: left;
}

.inquiryform textarea, .inquiryform input[type="text"]{
	/* width: 250px;*/
	width: 80%;
}

.banknoteform label, .banknoteform input, .banknoteform textarea, .banknoteform span {
		float: left;
}

.banknoteform label {
	width: 100px;
	height: 2.00em;
	margin: 2px 4px 6px 4px; 
}

.banknoteform input[type="text"] {
	display: block;
	/* margin-bottom: 15px; */
	width: 500px;
	height: 2.00em;
	border: 2px solid steelblue;
}

.banknoteform input[type="password"] {
	display: block;
	/* margin-bottom: 15px; */
	width: 250px;
	height: 2.00em;
	border: 2px solid steelblue;
}

.banknoteformcolumn {
	float: left;
	width: 100%;
}

.banknoteform textarea {

	display: block;
	/* margin-bottom: 15px; */
	width: 50%;
	border: 2px solid steelblue;

}

.banknoteform p {
	color: white;
}

.banknoteformcolumn {
	float: left;
	width: 100%;
}


.messagebox {
	background-color: lightgray;
	padding: 10px;

}

.red {
	color: red;
}

.blue {
	color: blue;
}

.strikethrough {
	text-decoration: line-through;
}

.green {
	color: green;
}

.yellow {
	color: yellow;
}

.backgroundred {
	background: red;
}

.backgroundgreen {
	background: green;
}

.backgroundyellow {
	background: yellow;
}


.btn-small {
	float: left;
	margin: 2% 0;
	border: 0;
	padding: 10px 25px;
	color: #faf3bc;
	font-size: .75em;
	background-color: #b0240f;
	border-radius: 25px;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	text-transform: uppercase;
}



form span {
		/*border-radius: 20px; */
		margin:0;
		padding:0;
		/* padding: 8px 35px; */
		background: #faf3bc;
		color:#420600;
	}

form input[type=text] {
	width: 100px;
}

form input[type=text].smallinputbox {
	width: 100px;
}

form input.valid, textarea.valid {
	border-color: green;
}	

form input.error, textarea.error {
	border-color: red;
}

form span.valid {
		background-color :#c0ce51;
		color: #faf3bc; 
		
	}
form span.error {
		background-color:#b0240f;
		color: #faf3bc;
		border-color: red;
	}

form p {
	float: none;
	/*height: 3em;*/
}

.hidden {
	display: none;
}


/* BE SURE TO INCLUDE THE CSS RESET FOUND IN THE DEMO PAGE'S CSS */
/*------------------------------------*\
	NAV
\*------------------------------------*/
#nav{
	list-style:none;
	font-weight:bold;
	margin-bottom:10px;
	/* Clear floats */
	color:white;
	float:left;
	width:100%;
	font-family: 'Lato', sans-serif;
	font-size: .8em;

	
}
#nav li{
	float:left;
	margin-right:2%;
	position:relative;
	color: white;
}
#nav a{
	display:block;
	padding:.5%;
	/* color:#fff;
	background:#333; */
	color: white;
	text-decoration:none;
	font-weight: normal;
}
#nav a:hover{
	
	color: white;
}

/*--- DROPDOWN ---*/
#nav ul{
	list-style:none;
	position:absolute;
	left:-9999px; /* Hide off-screen when not needed (this is more accessible than display:none;) */
}
#nav ul li{
	padding-top:1px; /* Introducing a padding between the li and the a give the illusion spaced items */
	float:none;
}
#nav ul a{
	color: #000;
	white-space:nowrap; /* Stop text wrapping and creating multi-line dropdown items */
}
#nav li a {  /* added to correct a appearance */
	display: block; 
	padding: 4px 8px; 
	text-decoration: none; 
	color: white; 
}
#nav li:hover ul{ /* Display the dropdown on hover */
	left:0; /* Bring back on-screen when needed */
}
#nav li:hover a{ /* These create persistent hover states, meaning the top-most link stays 'hovered' even when your cursor has moved down the list. */
	/* background:#6b0c36; */
	/* background: #111654; */
	color: white;
	text-decoration:underline;
}
#nav li:hover ul a{ /* The persistent hover state does however create a global style for links even before they're hovered. Here we undo these effects. */
	text-decoration:none;
}
#nav li:hover ul li a:hover{ /* Here we define the most explicit hover states--what happens when you hover each individual link. */
	/* background:#333; */
	/*background: #111654; */
	color: black;
	text-decoration:underline;
}

/* print media query */
@media print {

	#thisWeek {
		display: none;
	}
	#topHeader {
		display: none;
	}
}

/* media queries for cell phone */
/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
/* Styles */

	h4 {
		width: 200%;
	}

	h2 {
		width: 250%;
	}

	.paybutton {
		width: 50%;
	}

	#thisWeek {
		font-size: 200%; // was 2.0em
		width: 100%;
	}

	#mainContent {
		width: 75%;
	}

	.sidebaritem {
		padding: .5em .5em .5em 0;
	}

	.featuredbanknote {
		font-size: 150%;
		width: 95%;

	}
	.banknotes {
		font-size: 150%;
		width: 95%;
		height: auto;
	}
	.banknoteset {
		font-size: 150%;
		width: 95%;
		height: auto;
	}
	.banknotedetailed {
		font-size: 150%;
		width: 100%;
	}
	.photoleft {
		width: 95%;
	}
	.photoleftlarge {
		width: 95%;
	}

	.width30, .width25, .width50 {
		width: 95%;
	}

	.width60 {
		width: 95%;
	}

	#footer {
		font-size: 150%;
	}
		



}