header, nav, main, footer { display: block; } 

#mobile		   			{ display: none; }
#desktop	   			{ display: inline; }

#wrapper       			{ background-color: #000000;
						  color: #c4ff0e;
						  margin-left: auto;
						  margin-right: auto;
						  width: 80%;
						  min-width: 900px;
						  max-width: 1280px;
						  box-shadow: 0px 0px 0px #000000; }
#questionmark      		{ background-image: url("images/questionmark.png");
						  background-size: 100% 100%;
						  height: 193px; }
#Christalone   		 	{ background-image: url("images/Christ_alone.png");
						  background-size: 100% 100%;
						  height: 250px; }
#contactus				{ background-image: url("images/contactus.png");
						  background-size: 100% 100%;
						  height: 250px; }

.floatleft     		 	{ float: left;
						  padding-right: 2em;
						  padding-bottom: 2em; }
.item					{ background-color: #c4ff0e; 
						  margin-top: 2em; 
						  margin-bottom: 2em; 
						  margin-right: 3em;
						  margin-left: 3em; 
						  width: 80%;
						  padding: 1em;
						  overflow: auto; }
.tab					{ margin-left: 5%; }
.tab2					{ margin-left: 8%; }
.tab3					{ text-indent: 20px; 
						color: #ffffff; }
.white					{ color: #ffffff; }
						  
*    		   		 	{ box-sizing: border-box; }
form					{ padding: 2em; }
label					{ float: left; display: block;  text-align: right; width: 8em; padding-right: 1em; }
input, textarea			{ display: block; margin-bottom: 1em; }
body          		 	{ background-color: #000000;
						  color: #c4ff0e;
						  font-family: Verdana, Arial, sans-serif; }

#preface        		 { color: #ffffff;
						  font-family: Verdana, Arial, sans-serif; }
						  
header         		 	{ background-color: #000000; 
						  background-image: url(images/Bible.png);
						  background-position: left;
						  background-repeat: no-repeat;
						  height: 150px; }
table		   		 	{ margin: auto;
						  width: 90%; 
						  border-spacing: 0; }
td, th		   		 	{ padding: 10px; }
tr:nth-of-type(odd) 	{ background-color: #000000; }
h1 	           		 	{ color: #ffffff;
						  margin: 0px;
						  font-size: 3em;
						  padding-top: 45px;
						  padding-left: 220px; }
h2 	           		 	{ color: #ffca18;
						  margin: 0px;
						  font-size: 2em;
						  padding-top: 45px; }
						  
h4		      		 	{ text-transform: uppercase; 
					  	  background-color:  #000000;
						  font-size: 1.2em; 
						  padding-left: .5em;
						  border-bottom: 2px solid #000000;
						  padding-bottom: 0em; 
						  overflow: auto; }
main	       		 	{ background-color: #000000;
						  padding-left: 0em;
						  padding-right: 0em;
						  padding-bottom: 2em; 
						  padding-top: 0em;
						  margin-left: 200px; 
						  overflow: auto; }
main p		  		 	{ padding-left: 3em;
						  padding-right: 2em; }
main div	   		 	{ padding-left: 3em;
						  padding-right: 2em; }
main ul		  		 	{ padding-left: 3em;
						  padding-right: 2em; }
main dl		  		 	{ padding-left: 3em;
						  padding-right: 2em; }
main h2			     	{ padding-left: 3em;
						  padding-right: 2em; }
main h3		  		 	{ padding-left: 3em;
						  padding-right: 2em; }
main h4		   		 	{ padding-left: 3em;
						  padding-right: 2em; }
nav           		 	{ float: left;
						  width: 235px;
						  font-weight: bold; 
						  text-align: center; 
						  font-size: 1.5em;
						  padding-top: 10px;}
nav a         		 	{ text-decoration: none; }
nav a:link     		 	{ color: #FFFFFF; }
nav a:visited  		 	{ color: #FFFFFF; }
nav a:hover   		 	{ color: #00f6ff; }
nav ul		   		 	{ list-style-type: none;
						  padding-left: 0px; }
footer         		 	{ background-color: #000000; 
						  font-size: .60em;
						  text-align: center; 
						  padding-bottom: 4px; }
						  
 /* Style the buttons that are used to open and close the accordion panel */
.accordion {
  background-color: #000000;
  color: #FFFFFF;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  text-align: left;
  border: none;
  outline: none;
  transition: 0.4s;
}

/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.active, .accordion:hover {
  background-color: #545454;
}

/* Style the accordion panel. Note: hidden by default */
.panel {
  padding: 0 18px;
  background-color: #000000;
  display: none;
  overflow: hidden;
} 

.accordion:after {
  content: '\02795'; /* Unicode character for "plus" sign (+) */
  font-size: 13px;
  color: #FFFFFF;
  float: right;
  margin-left: 5px;
}

.active:after {
  content: "\2796"; /* Unicode character for "minus" sign (-) */
}
						  
@media only screen and (max-width: 1024px) {
            body 	 		{ margin: 0; background-image: none; } 
            #wrapper 		{ width: auto; min-width: 0; margin: 0; padding: 0; box-shadow: none; }
		    header 	 		{ border-bottom: 5px solid #FEF6C2; }
			h1 		 		{ margin-top: 0; margin-bottom: 1em; padding-top: 1em; padding-bottom: 1em; font-size: 2.5em; }
			main 	 		{ margin: 0; font-size: 90%; }
			nav 	 		{ float: none; width: auto; padding-top: 0; margin: 10px; font-size: 1.3em; }
			nav ul 	 		{ padding: 0; margin: 0; }
			nav li 			{ display: inline-block; }
			nav a 	 		{ padding: 1em; width: 8em; font-weight: bold; border-style: none; } 
			#questionmark 	{ margin: 0; padding: 0; }
			#Christalone 	{ margin: 0; padding: 0; }
			#contactus   	{ margin: 0; padding: 0; } }
			
@media only screen and (max-width: 768px) {
			header 			{ background-image: none; }
			h1 				{ font-size: 2em; text-align: center; padding-left: 0; }
			h2 				{ padding-top: 0.5em; padding-right: 0; padding-bottom: 0; padding-left: 0.5em; margin-right: 0.5em; }
			nav 			{ margin: 0; }
			nav li 			{ display: block; }
			nav a 			{ display: block; padding: 0.2em; width: auto; border-bottom: 1px solid #FEF6C2; }
			main 			{ padding-top: 1px; }
			#questionmark 	{ background-image: none; height: auto; }
			#Christalone    { background-image: none; height: auto; }
			#contactus   	{ background-image: none; height: auto; }

			#floatleft 		{ padding-left: 0.5em; padding-right: 0.5em; }
			#mobile 		{ display: inline; }
			#desktop 		{ display: none; } }