/*
    Created on : April 01, 2016
	Last Update: February 06, 2021
    Author     : N3WP  Will Pope
	© Copyright W. C. Pope  2016 - 2023
*/

/******************  Header Area  ***************/
header
{
	background-image: 		url(../images/faith_hdr_sml.png);
}
header h1
{
	color:					black;
}
header h1 strong
{
	color:					rgb(252, 32, 32);
}

#faith_info_hdr
{
	height:					60px;
	width:					100%;
	background-color:		black;
}

#portal-box
{
	height:					400px;
}
#portal
{
	height: 				100%;
	width: 					100%;
	overflow:				auto;
	border:					4px hidden rgb(240, 213, 145);
	border-radius:          15px;
}

.aside_box
{
	background:				rgb(255, 255, 255);
	padding:				5px;
	border:					4px hidden rgb(240, 213, 145);
	border-radius:          15px;
    color:					rgb(45, 45, 45);
	margin-bottom:			5px;
}

html.inFaithFrame
{
	font-size:				75%; 
	height:					auto;
	background-size:	 	cover;
}
.faithBg1
{
	background:				url(../images/cross_on_hill_bg.png) fixed no-repeat right bottom;
}
.color1
{
	color:					whitesmoke;
}
.faithBg2
{
	background: 			url(../images/parchment_lt_bg2.png) fixed no-repeat left top;
}
.color2
{
	color:					red;
}
.faithBg3
{
	background:				url(../images/sheepskin4.png) fixed no-repeat left top;
}
.color3
{
	color:					rgb(231, 231, 190);
}
.faithBg4
{
	background:				url(../images/parchment_med_bg.png) fixed no-repeat left top;
}
.color4
{
	color:					#3366cc;
}
.faithBg5
{
	background:				url(../images/spirit_test.png) fixed no-repeat left top;
}
.faithBg6
{
	background:				url(../images/holy_trinity.png) fixed no-repeat left top;
}
/* 
.faithBg7
{
	background:				url(../images/spirit_test.png) fixed no-repeat left top;
} 
*/
.color5
{
	color:					navy;
}
.faithBg6
{
	background-color: 		#D8D1BC;
}
.color6
{
	color:					black;
}

.icon_style_1
{
    display:                inline-block;
    height:                 80px;
    width:                  auto;
    margin:                 0px 3px 0px 0px;
    padding:                0px;
    border-style:           solid;
	border-width:			2px;
	border-color:			#bbbbbb;
    border-collapse:		collapse;
}
.icon_style_last
{
    display:                inline-block;
    height:                 80px;
    width:                  auto;
    margin:                 0px;
    padding:                0px;
    border-style:           solid;
	border-width:			2px;
	border-color:			#bbbbbb;
    border-collapse:		collapse;
}

/* Faith table */
table.faith_table
{
	border-style:			solid;
	border-width:			1px;
	border-color:			#bbbbbb;
    border-collapse:		collapse;
	width:					96%;
	margin:					10px auto 10px 0px;
}
table.faith_table td
{
	border-style:			solid;
	border-width:			1px;
	border-color:			#bbbbbb;
	border-collapse:		collapse;
	padding:				4px;
	vertical-align:			middle;
	text-align:				left;
}
table.faith_table td.cntr
{
	text-align:				center;
}
table.faith_table tr.trspace td
{
	padding:				0;
	height:					1px;
	background-color:		#D8D1BC;
}

table.faith_quiz
{
    border-collapse:		separate;
}
table.faith_quiz
{
	border-style:			solid;
	border-width:			4px;
	border-color:			#E6C7BA #703D27 #703D27 #E6C7BA;
	width:					96%;
	margin:					10px auto 10px auto;
}
table.faith_quiz td
{
	border-style:			solid;
	border-width:			3px;
	border-color:			#703D27 #E6C7BA #E6C7BA #703D27 ;
	border-collapse:		separate;
	padding:				3px;
	vertical-align:			middle;
}
table.faith_quiz td.cntr
{
	text-align:				center;
}
table.faith_quiz tr.trspace td
{
	padding:				0;
	height:					2px;
	background-color:		#D8D1BC;
}
table.faith_quiz tr img
{
	display:				block;
	margin:					0px auto 0px auto;
	border-style:			solid;
	border-width:			3px;
	border-color:			#E6C7BA #703D27 #703D27 #E6C7BA;
	border-collapse:		separate;
}

/* pull downs */
table.pull_down
{
	display:				block;
	z-index:				500;
	border-style:			solid;
	border-width:			1px;
    border-collapse:		collapse;
	border-color:			#999999;
	background-color:		#cccccc;
	width:					100%;
	font-size:				x-large;
	margin:					0px;
}
table.pull_down td
{
	border-style:			none;
/*	border-width:			1px;
	border-color:			#bbbbbb;
	border-collapse:		collapse;*/
	padding:				4px;
	vertical-align:			middle;
	text-align:				center;
	width:					218px;
}
table.pull_down tr
{
	width: 100%;
}
table.pull_down.chapter
{
	display:				inline-block;
	width:					48px;
	height:					auto;
	vertical-align:			top;
}
table.pull_down.chapter td
{
	width:					48px;
}

#select_quiz
{
	display: block;
}

#quiz_page
{
	padding: 10px 0 5px 0;
	display: none;
}
#quiz_buttons_area
{
	display:	block;
	width:  230px;
	margin:	2px auto 2px auto;
	padding-left: 5px;
	height: 55px;
}
.quiz_btn
{
    position: 				relative;
	padding:				0;
	font-size:				18px;
	font-family:			"Lucida Sans Unicode", "Lucida Grande", Arial, sans-serif;
	font-weight:			normal;
	width:					70px;
	height:					50px;
	display:				inline-block;
	border-style:			none;
	border-width:			0px;
	color:					#ffffff;
	text-align: 			center;
	line-height:			50px;
	margin-right:			5px;
}
.btn_tan
{
	background-image:		url("../images/tan_btn_lnk.png");
}
.btn_tan:focus
{
	color:					white;
	background-image:		url("../images/tan_btn_lnk.png");
}
.btn_tan:hover
{
	color:					#CCCCCC;
	background-image:		url("../images/tan_btn_hov.png");
}
.btn_tan:active
{
   color:					#ff3300;
   background-image:		url("../images/tan_btn_hov.png");
}
.btn_gry
{
	display:				inline-block;
	background-image:		url("../images/gry_btn.png");
}
.btn_red
{
	display:				none;
	background-image:		url("../images/red_btn_lnk.png");
}
.btn_red:focus
{
	color:					white;
	background-image:		url("../images/red_btn_lnk.png");
}
.btn_red:hover
{
	color:					#CCCCCC;
	background-image:		url("../images/red_btn_hov.png");
}
.btn_red:active
{
   color:					#ff8080;
   background-image:		url("../images/red_btn_hov.png");
}
.btn_grn
{
	display:				none;
	color:					white;
	background-image:		url("../images/grn_btn_lnk.png");
}
#topCntnr, #botCntnr
{
	width: 220px;
	height: auto;
	display: none;
	margin: 0 auto 5px auto;
}
#midCntnr
{
	width: 220px;
	height: auto;
	display: block;
	margin: 0 auto 5px auto;
}
#typeCntnr
{
	width: 165px;
	height: auto;
	display: none;
	margin: 15px auto 5px auto;
}
#chapCntnr
{
	width: 175px;
	height: auto;
	display: none;
	margin: 5px auto 5px auto;
}
#top_box, #mid_box, #bot_box, #type_box
{
	width: 100%;
	height: 45px;
	font-size: x-large;
	line-height: 100%;
	text-align:	center;
	padding-top: 10px;
	background-color: whitesmoke;
	display: block;
}
#chap_box
{
    width: 100px;
    height: 45px;
	font-size: x-large;
	line-height: 100%;
	text-align:	center;
	padding-top: 10px;
	background-color: whitesmoke;
	display: block;
    margin: 5px auto 5px auto;
}
#topNameArea, #midNameArea, #botNameArea
{
	display: none;
	margin-top: -20px;
	margin-left:  0px;
	margin-bottom: 5px;
	width: 220px;
}
#typeNameArea
{
	display: none;
	margin-top: -20px;
	margin-left:  0px;
	margin-bottom: 5px;
	width: 200px;
}
#chapNameBlock
{
    display: none;
    width: 175px;
    height: 45px;
	font-size: x-large;
	line-height: 100%;
	text-align:	center;
	padding-top: 10px;
	background-color: whitesmoke;
    margin: 5px auto 5px auto;
}
#chapNameArea100, #chapNameArea10, #chapNameArea1
{
	display: inline-block;
	margin-top: 5px;
	margin-left:  0px;
	margin-bottom: 5px;
	width: 50px;
    vertical-align:	top;
}
#help_area
{
	display:				none;
	width:					100%;
	float:					left;
	padding:				0;
}
#help_box
{
	border-style:			solid;
	border-width:			2px;
	border-color:			#E6C7BA #703D27 #703D27 #E6C7BA;
	min-width:				230px;
	max-width:				400px;
	width:					100%;
	margin:					1px auto 1px auto;
	background-color:		navy;
	color:					whitesmoke;
	padding:				2px 3px 2px 9px;
	display:				block;
}
#help_box span.desc
{
	display:				block;
	font-weight:            bold;
	text-align:				center;
	text-decoration:		underline;
}
#help_box span.helpWord
{
	font-style:             italic;
	font-weight:            bold;
}
#help_box hr
{
    display:				block;
    margin-top:				5px;
    margin-bottom:			5px;
    margin-left:			auto;
    margin-right:			auto;
	height:					2px;
	background-color:		#888888;
}
#result_area
{
	display:				none;
	width:					100%;
	float:					left;
	padding:				0;
}
#result_box
{
	border-style:			solid;
	border-width:			1px;
	border-color:			black;
	min-width:				230px;
	max-width:				400px;
	width:					100%;
	margin:					2px auto 2px auto;
	background-color:		#b2f2ff;
	color:					black;
	padding:				5px;
	display:				block;
}
#result_item_box
{
    /* display:				inline-block; */
    height:					135px;
    float:					left;
    margin:					1px;
	text-align:				left;
	padding-top:			10px;
	width:					60%;
	font-weight:			bold;
	font-style:				italic;
}
#result_sep_box
{
    /* display:				inline-block; */
	height:					135px;
	float:					left;
	margin:					1px;
	padding-top:			10px;
	text-align:				center;
	width:					10%;
}
#result_score_box
{
    /* display:				inline-block; */
	height:					135px;
	float:					left;
	margin:					1px;
	padding-top:			10px;
	width:					25%;
	text-align:				left;
}

#result_box .res_title
{
	display:				block;
	font-weight:            bold;
	text-align:				center;
	text-decoration:		underline;
}
#result_box span.res_term
{
	font-style:             italic;
	font-weight:            bold;
	text-align:				left;
}
#result_score_right
{
	display:				inline;
	float:					right;
	width:					75%;
	text-align:				right;
	padding-right:			15px;
}
#result_box div.inline_holder
{
	display:				block;
	width:					100%;
	height:					150px;
}
#result_box hr
{
    display:				block;
    margin-top:				5px;
    margin-bottom:			5px;
    margin-left:			auto;
    margin-right:			auto;
	height:					2px;
	background-color:		#888888;
}
br.br_half
{
	line-height: .5;
}
#error_area
{
	display:				none;
	width:					100%;
	float:					left;
	padding:				0;
}
#error_box
{
	border-style:			solid;
	border-width:			1px;
	border-color:			black;
	min-width:				230px;
	max-width:				400px;
	width:					100%;
	margin:					2px auto 2px auto;
	background-color:		#ff8080;
	color:					black;
	padding:				5px;
	display:				block;
}
#err_type
{
	display:				block;
	font-weight:			bold;
	text-align:				center;
}
#error_bad_box
{
    /* display:				inline-block; */
    height:					auto;
    float:					left;
    margin:					1px;
	text-align:				center;
	width:					47%;
}
#error_good_box
{
    /* display:				inline-block; */
	height:					auto;
	float:					left;
	margin:					1px;
	width:					47%;
	text-align:				center;
}
#error_box .res_title
{
	display:				block;
	font-weight:            bold;
	text-align:				center;
	text-decoration:		underline;
}
#error_box div.inline_holder
{
	display:				block;
	width:					100%;
	height:					150px;
}
#error_box hr
{
    display:				block;
    margin-top:				5px;
    margin-bottom:			5px;
    margin-left:			auto;
    margin-right:			auto;
	height:					2px;
	background-color:		#888888;
}

img.faith_top_img
{
	display:				block;
	margin:					auto;
}

@media all and (min-width:400px)
{
    .icon_style_1
    {
        height:                 98px;
        width:                  auto;
        margin:                 0px 5px 0px 0px;
    }
    .icon_style_last
    {
        height:                 98px;
        width:                  auto;
    }
}

@media all and (min-width:500px)
{
	html.inFaithFrame
	{
		font-size:			100%;
	}
}
@media all and (min-width:531px)
{
	header
	{
		background-image: 	url(../images/faith_hdr.png);
	}
    .icon_style_1
    {
        height:                 124px;
        width:                  auto;
        margin:                 0px 5px 0px 0px;
    }
    .icon_style_last
    {
        height:                 124px;
        width:                  auto;
    }
}

@media all and (min-width:720px)
{
	html.inFaithFrame
	{
		font-size:			125%;
	}
}
@media all and (min-width:865px)
{
	html.inFaithFrame
	{
		font-size:			150%;
	}
}