/*** CSS BY SCREEN SIZE ***/
/*** Styles for ads are in styles.php ***/
/* Small Devices */
@media only screen and (min-width : 320px) and (max-width : 479px) {
	body {
		width: 98%;
		font-size: 18px;
	}
	/*** HEADER STYLES ***/
	#masthead {
		position: relative;
		top: 0;
	}
	#masthead th {
		font-size: 1.5em;
		width: 90px;
	}
	#masthead th:first-child {padding-right: 5%;}
	#masthead th:last-child {padding-left: 5%;}
	#masthead img {
		width: 50px;
		height: auto;
	}
	#appbanner {width: 98% !important;}
	/*** FOOTER STYLES ***/
	#connect #contact #phone {display: none;}
	#connect #contact a img, #connect #social a img {height: 2.0em;}
	#connect #contact a {margin: 1em 0.5em auto 0;}
	#connect #social a {margin: 1em 0 auto 0.5em;}
	.footerad {
		width: auto;
		max-height:20% !important;
	}
	/*  FOOTER MENU  */
	#nav-btm {
		line-height: 2.0em;
		font-size: 1.0em;
	}
	/*** DOCUMENT STYLES ***/
	.customcolumnMain {
		margin: 0 auto;
		width: 98%;
		padding: 5%;
	}
	#thumbnailshare{max-width: 100% !important;}
	/*** QUIZ STYLES ***/
	.quizbtn, .quizmenu {
		height: 60px;
	}
	.quizbtnmain li {
		width: 45%;
		height: 200px;
		margin: 2%;
	}
	.quizbtnsub li {
		width: 96%;
		margin: 2% 1%;
		padding: 2% 1%;
	}
	
	.prevbtn {
		margin: 4px auto;
		clear: both !important;
	}
/* 	
	.biblebtn {
		visibility: hidden;
	}
	.biblebtn:after {
		content: "Click to read Bible";
		visibility: visible;
		color: #333;
		background-color: #dabf90 !important;
		border: 1px solid #3c3324;
		border-radius: 4px;
		padding: 6px 12px;
		margin: 15px 6px 0 6px;
		font-weight: 600;
		line-height: 2;
		-ms-touch-action: manipulation;
		touch-action: manipulation;
		cursor: pointer;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		font-size: 1.4em;
		text-decoration: none;
	}
	 */
	
	
	.radio-item label {
		min-width: 150px;
		max-width: 96%;
		padding: 20px 50px;
	}
	.homebox {
		width: 90% !important;
	}
	.homebox li {
		width: 96%;
		margin: 1%;
	}
}

/* Small Devices, Phones */
@media only screen and (min-width : 480px) and (max-width : 579px) {
	body {
		width: 94%;
		font-size: 18px;
	}
	/*** HEADER STYLES ***/
	#masthead {
		position: relative;
		top: 0;
	}
	#masthead th {
		font-size: 1.7em;
		width: 100px;
	}
	#masthead th:first-child {padding-right: 5%;}
	#masthead th:last-child {padding-left: 5%;}
	#masthead img {
		width: 50px;
		height: auto;
	}
	#appbanner {width: 98% !important;}
	/*** FOOTER STYLES ***/
	#connect #contact #phone {display: none;}
	#connect #contact a img, #connect #social a img {height: 2.2em;}
	#connect #contact a {margin: 1em 0.8em auto 0;}
	#connect #social a {margin: 1em 0 auto 0.8em;}
	.footerad {
		width: auto;
		max-height:20% !important;
	}
	/*  FOOTER MENU  */
	#nav-btm {
		line-height: 2.2em;
		font-size: 1.0em;
	}
	/*** DOCUMENT STYLES ***/
	.customcolumnMain {
		margin: 0 auto;
		width: 98%;
		padding: 5%;
	}
	#thumbnailshare{max-width: 80% !important;}
	/*** QUIZ STYLES ***/
	.quizbtn, .quizmenu {
		height: 60px;
	}
	.quizbtnmain li {
		width: 45%;
		height: 200px;
		margin: 2%;
	}
	.quizbtnsub li {
		width: 96%;
		margin: 2% 1%;
		padding: 2% 1%;
	}
	.radio-item label {
		min-width: 150px;
		padding: 20px 60px;
	}
	.homebox {
		width: 90% !important;
	}
	.homebox li {
		width: 96%;
		margin: 1%;
	}
}

/* Small Devices, Phones */
@media only screen and (min-width : 580px) and (max-width : 899px) {
	body {
		width: 94%;
		font-size: 18px;
	}
	/*** HEADER STYLES ***/
	#masthead {
		position: relative;
		top: 0;
	}
	#masthead th {
		font-size: 1.8em;
	}
	#masthead img {
		width: 60px;
		height: auto;
	}
	#appbanner {
		width: 98% !important;
	}
	/*** FOOTER STYLES ***/
	#connect #contact #phone {display: none;}
	#connect #contact a img, #connect #social a img {height: 2.2em;}
	#connect #contact a {margin: 1em 0.8em auto 0;}
	#connect #social a {margin: 1em 0 auto 0.8em;}
	.footerad {
		width: auto;
		max-height:20% !important;
	}
	/*  FOOTER MENU  */
	#nav-btm {
		line-height: 2.2em;
		font-size: 1.0em;
	}
	/*** DOCUMENT STYLES ***/
	.customcolumnMain {
		margin: 0 auto;
		width: 98%;
		padding: 2%;
	}
	#thumbnailshare{max-width: 80% !important;}
	/*** QUIZ STYLES ***/
	.quizbtn, .quizmenu {
		height: 60px;
	}
	.quizbtnmain li {
		width: 45%;
		height: 200px;
		margin: 2%;
	}
	.quizbtnsub li {
		width: 48%;
		height: 100px;
		margin: 1%;
		padding: 2%;
	}
	.radio-item label {
		min-width: 200px;
		padding: 20px 60px;
	}
	.homebox {
		width: 80% !important;
	}
	.homebox li {
		width: 48%;
		height: 150px;
		margin: 1%;
	}
}

/* Medium Devices, Tablets and Small Desktops */
@media only screen and (min-width : 900px) and (max-width : 1199px) {
	body {
		width: 90%;
		font-size: 18px;
	}
	/*** HEADER STYLES ***/
	#masthead th {font-size: 2.4em;}
	#masthead img {
		width: 70px;
		height: auto;
	}
	#appbanner {
		max-width: 70% !important;
	}
	/*** FOOTER STYLES ***/
	/* 
	##### USED ONLY WHEN PHONE NUMBER/ICON IS IN FOOTER
	#connect #contact a:last-child {
		pointer-events: none;
		cursor: default;
		color: #000000;
		text-decoration: none;
	}
	*/

	.customcolumnMain {
		width: 70%;
		padding: 2%;
	}
	#thumbnailshare{width: 70% !important;}
	/*** QUIZ STYLES ***/
	.quizbtn, .quizmenu {
		height: 50px;
	}
	.quizbtnmain li {
		width: 45%;
		height: 200px;
		margin: 2%;
	}
	.quizbtnsub li {
		width: 48%;
		height: 80px;
		margin: 1%;
	}
	.radio-item label {
		min-width: 250px;
	}
	.radio-item label {
		min-width: 170px;
		padding: 20px 50px !important;
	}
	.homebox {
		width: 70% !important;
	}
	.homebox li {
		width: 48%;
		height: 150px;
		margin: 1%;
	}
}

/* Large Desktops */
@media only screen and (min-width : 1200px) {
	body {
		width: 90%;
		font-size: 18px;
	}
	/*** HEADER STYLES ***/
	#masthead th {
		font-size: 2.5em;
	}
	#masthead img {
		width: 80px;
		height: 101px;
	}
	#appbanner {
		max-width: 60% !important;
	}

	/*** FOOTER STYLES ***/
	/* 
	##### USED ONLY WHEN PHONE NUMBER/ICON IS IN FOOTER
	#connect #contact a:last-child {
		pointer-events: none;
		cursor: default;
		color: #000000;
		text-decoration: none;
	}
	*/

	.customcolumnMain {
		width: 60%;
	}
	#thumbnailshare{width: 60% !important;}
	/*** QUIZ STYLES ***/
	.quizbtn, .quizmenu {
		height: 50px;
	}
	.quizbtnmain li {
		width: 45%;
		height: 200px;
		margin: 2%;
	}
	.quizbtnsub li {
		width: 31%;
		height: 80px;
		margin: 1%;
	}
	.radio-item label {
		min-width: 250px;
		padding: 20px 60px;
	}
	.homebox {
		width: 60% !important;
	}
	.homebox li {
		width: 31%;
		height: 150px;
		margin: 1% 1.167%;
	}
}
