/*
    Created on : April 01, 2016
	Last Update: October 26, 2021
    Author     : N3WP  Will Pope
	© Copyright W. C. Pope  2016 - 2023
*/
/* ======================= reset browser styles ============================= */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr,
acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp,small, strike,
strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,
time, mark, audio, video, icon_links
{
	margin: 				0;
	padding: 				0;
	border:					0;
	font-size:				100%;
	vertical-align:			baseline;
}

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section
{
	display:				block;
}

body
{
	line-height:			1.2;
}

ol
{
	padding-left:			1.4em;
	list-style:				decimal;
}

ul
{
	padding-left:			1.4em;
	list-style:				square;
}

table
{
	border-collapse:		collapse;
	border-spacing:			0;
}

/* micro clear fix */
.uclear:after
{
	content: 				" ";
	display: 				table;
	clear: 					both;
}
.noShow
{
    display:                 none;
}

/* add universal change to include padding and borders in sizing calculations */
*,
*:before,
*:after
{
	-moz-box-sizing:		border-box;
	-webkit-box-sizing: 	border-box;
	box-sizing: 			border-box;
}
/* ====================== end reset browser styles ========================= */

/******************  General Area  ****************/
h1, h2, h3, h4, h5, h6
{
	color:					rgb(34, 34, 34);
	line-height:			1.4;
    font-family:			"Palatino Linotype", "Book Antiqua", Palatino, serif;
	font-style:				normal;
	font-weight:			normal;
    margin-top:				3px;
	margin-bottom:			8px;
}
h1 {
	font-size:				2.12rem;
}
h2 {
	font-size:				1.8rem;
}
h3 {
	font-size:				1.5rem;
}
h4 {
	font-size:				1.3rem;
}
h5 {
	font-size:				1rem;
}
h5.sect {
	font-style:				italic;
	font-weight:			bold;
}
h6 {
	font-size:				.75rem;
}
small
{
	line-height:			inherit;
	font-size:				60%;
}
.copysmall
{
	line-height:			inherit;
	font-size:				45%;
}
a
{
	color:					rgb(0, 140, 186);
	line-height:			inherit;
	text-decoration:		none;
}
a:hover
{
	color:					rgb(0, 120, 160);
}
a:focus
{
	color:					rgb(0, 120, 160);
}
a img
{
	border:					currentColor;
	border-image:			none;
}
p
{
	line-height:			1.6;
	font-family:			inherit;
	font-size:				1rem;
	font-weight:			normal;
	margin-bottom:			1.25rem;
	position:				relative;
}
hr
{
	border-width:			1px 0px 0px;
	border-style:			solid;
	border-color:			rgb(180, 180, 180);
	margin:					15px 0px 0px;
	border-image:			none;
	height:					0px;
	width:					100%;
}
.clearfix:before
{
	display:				table; content: " ";
}
.clearfix:after
{
	display:				table; content: " ";
}
.clearfix:after
{
	clear:					both;
}
sup
{
    vertical-align:			super;
    font-size:				smaller;
}
sub
{
    vertical-align:			sub;
    font-size:				smaller;
}

/* ===== This is a Mobile First Design ===== */
@font-face
{
	font-family:			'cantebriggia';
	src:					url(../../common/fonts/cantebriggia.ttf) format('truetype');
}
html.topic
{
	font-size:				100%;
	height:					auto;
	background:				url(../../common/images/old_brown_leather-seamless_texture.jpg) fixed repeat left top;
}
html.inFrame
{
	font-size:				100%;
	height:					auto;
	background-color:		white;
}
html.inLinksFrame
{
	font-size:				100%;
	height:					auto;
	background-color:		#fff3db;
}


.tbl_label
{
	text-align:            	center;
	font-size: 				large;
	font-weight: 			bold;
}

body
{
	max-width:				1440px;
	width:					100%;
	height:					auto;
	background:				url(../../common/images/lt_tan_text.jpg) repeat;
	margin:					0px auto;
	padding:				0px;
	color:					rgb(34, 34, 34);
	line-height:			1.5;
    font-family:			"Times New Roman", Times, serif;
/*	font-family:			Tahoma, Geneva, Arial, sans-serif; */
/*	font-family:			"Lucida Sans Unicode", "Lucida Grande", Arial, sans-serif; */
/*	font-family:			Verdana, Geneva, Arial, sans-serif; */
	font-style:				normal;
	font-weight:			normal;
	position:				relative;
	cursor:					auto;
}
/******************  Header Area  ***************/
#top-area
{
	height:					50px;
	width:					100%;
}
header
{
	height:					100%;
	position: 				relative;
	background-position: 	left top;
	background-size:	 	cover;
}
header h1
{
	color:					whitesmoke;
	font-size: 				.9em;
	font-style: 			italic;
	text-shadow:			2px 2px 2px rgba(0,0,0,.5);
	text-align: 			center;
	margin-left:			35px;
	font-weight:			bold;
}
header h1 strong
{
	color:					deepskyblue;
	font-size: 				2.5em;
	margin-right: 			-2.7em;
    line-height: 			1.4em;
}
#hdr_icon
{
	display: 				block;
	position:				absolute;
	top:					0;
	left:					0;
}
 /******************  Navigation buttons  ***************/
#upper-mid-area
{
	width:					100%;
	margin:					2px 0;
	height:					100px;
	display:				none;
}
#upper-mid-area nav
{
	width:					237px;
	margin:					0px auto;
	height:					100%;
}
#menu_buttons
{
	height:					100px;
	margin:					2px auto 2px auto;
}
.button
{
    position: 				relative;
	padding:				0;
	font-size:				18px;
	font-family:			"Lucida Sans Unicode", "Lucida Grande", Arial, sans-serif;
	font-weight:			normal;
	width:					116px;
	height:					50px;
	display:				inline-block;
	cursor:					pointer;
	border-style:			none;
	border-width:			0px;
	background-color:		rgb(0, 140, 186);
	background-image:		url("../../common/images/cyn_btn_lnk.png");
	color:					#ffffff;
	text-align: 			center;
	line-height:			50px;
}
.button:focus
{
	color:					white;
	background-image:		url("../../common/images/cyn_btn_lnk.png");
}
.button:hover
{
	color:					#CCCCCC;
	background-image:		url("../../common/images/cyn_btn_hov.png");
}
.button:active
{
   color:					#ff3300;
   background-image:		url("../../common/images/cyn_btn_hov.png");
}
.button_group
{
	padding-left:			0;
	list-style:				none;
	margin:					0px;
	left:					0px;
	display:				inline;
}
.button_group li
{
	float:					left;
}

/******************* Scripture Area  ****************/
#scripture-box
{
	margin:				2px 0 5px 0;
	display:			block;
    padding-bottom:     5px;
}
#scripture
{
	background:         rgb(255, 255, 255);
	padding:            10px 50px;
	border:             6px double rgb(212, 185, 116);
	border-radius:      15px;
}

.inscripture
{
    font-size:          100%;
}

/******************  Article Area and Sidebar  ***************/
#lower-mid-area
{
	width:					100%;
	height:					auto;
}
/******************  Article Area  ***************/
main
{
	width:					100%;
	height:					100%;
	padding:				5px;
	float:					left;
}

.narwView
{
	display: block;
}
.wideView
{
	display: none;
}
.narwQuery
{
	padding: 0;
	position: relative;
	display: block;
	font-size: x-large;
	margin: auto;
	text-align: center;
    /* vertical-align:  middle; */
	border: 1px solid black;
	background-color: #ECECEC;
	color:	#005497;
}
.narwQuery tr
{
	height:	33px;
}
.narwQuery td
{
	text-align: center;
    vertical-align:  middle;
}

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

article
{
	width:					100%;
	float:					left;
	padding:				5px 15px 0px;
}
article h3
{
	color:					rgb(0, 140, 186);
}
.two_column
{
	width:					100%;
	float:					left;
}
.img_width
{
	width:					100%;
}
.full_img_width
{
	width: 					100%;
}
.img_width_qrt
{
	width:					25%;
}
.img_width_half
{
	width:					50%;
}

.img_width_resp
{
	width:					50%;
}
.para_width
{
	width:					100%;
	float:					left;
	height:					100%;
}
.para_box_width
{
	width:					100%;
	float:					left;
	height:					100%;
}

.withBrdr
{
	border-style:			solid;
	border-width:			1px;
	border-color:			black;
	padding:				5px 5px 5px 25%;
	margin:					1px;
}

.lpass
{
	float: left;
}
.rpass
{
	float: right;
}
.cent
{
	width:					100%;
	margin:					0 auto;
}
img.story_img
{
	padding-right:			14px;
	padding-left:			14px;
	position:				relative;
	vertical-align:			middle;
	display:				inline-block;
	margin-bottom:			10px;
}
.minibtn
{
	background-color:		rgb(0, 140, 186);
	color:					white;
}
.lst
{
	font-weight:			normal;
	list-style:				none;
}
.lst_emp
{
	font-weight:			bold;
	list-style:				none;
}
.details
{
	display:				block;
	max-width:				800px;
	min-width:				220px;
	width:					80%;
	margin:					2px auto 2px auto;

}
.details figure img
{
	display:				block;
	width:					100%;
}
.details figure figcaption
{
	text-align:				center;
	margin:					2px 15px 1px 15px;
}
blockquote
{
    display:				block;
    margin-top:				.5em;
    margin-bottom:			.5em;
    margin-left:			40px;
    margin-right:			40px;
}
.innerquote
{
	padding-left:			7%;
	padding-right:			7%;
}

/******************  Sidebar Area  ***************/
aside
{
	width:					100%;
	height:					auto;
	float:					left;
	padding:				5px;
}
.aside_box
{
	background:				rgb(255, 255, 255);
	padding:				5px;
	border:					4px solid rgb(240, 213, 145);
	border-radius:          15px;
    color:					rgb(45, 45, 45);
	margin-bottom:			5px;
}
.aside_box h4
{
	color:					rgb(45, 45, 45);
	line-height:			1;
	margin-bottom:			10px;
	font-weight:			bold;
}
.aside_box h5
{
	color:					rgb(45, 45, 45);
	line-height:			1;
	margin-bottom:			10px;
}
/*******************  Top Aside Area  *****************/
.side_nav
{
	margin:					0px; /*	padding:				14px 0px; */
	font-family:			"Palatino Linotype", "Book Antiqua", Palatino, serif;
	display:				block;
	list-style-type:		disc;
	list-style-position:	outside;
}
#top-aside li
{
    margin: 15px 0;
}
/******************  Middle Aside Area and Articles ***************/
#mid-aside li
{
    margin: 15px 0;
}

/*********** Special first letter in Gothic style font ***********/ 
.firstLetter
{
    float:					left;
    font-size:				175%;
    font-family:			"cantebriggia", "French Script MT Regular", Palatino, serif;
    line-height:			80%;
	color:					#484848;
}
.firstLetter.thinner
{
	width:					.60em;
}
.firstLetter.thin
{
	width:					.75em;
}
.firstLetter.norm
{
	width:					.95em;
}
.firstLetter.wide
{
	width:					1.15em;
}
.redLetter
{
	color:					darkred;
}
.centered
{
	text-align:             center;
}
.citation
{
	font-family: 			Verdana, Helvetica, sans-serif;
	color:					black;
	font-style:				italic;
	font-size:				x-small;
	text-align:				right;
}
.citationLeft
{
	font-family: 			Verdana, Helvetica, sans-serif;
	color:					black;
	font-style:				italic;
	font-size:				x-small;
	text-align:				left;
}
/******************  Icon Link Area  ***************/
#icon_link-area
{
    width:                  auto;
	height:					124px;
	margin:					0px 15px;
    text-align:             center;
}
icon_links
{
    display:                inline-block; 
    height:                 124px;  
    width:                  auto;
    padding:                0px;
	border:					none;
}


/*********************  Footer Area  ******************/
#bottom-area
{
	width:					auto;
	height:					70px;
	margin:					0px 15px 5px;
}
footer
{
	width:					100%;
	padding:				10px 20px;
	border:					none;
	color:					rgb(45, 45, 45);
}
.copyright
{
	width:					auto;
	font-size:				x-small;
	text-align:				center;
	margin:					0 auto;
}
.changeDate
{
	font-size:				small;
}
.centered
{
	text-align:				center;
}

/**************** Start making things bigger **************/
@media all and (min-width:360px)
{
	header h1
	{
		margin-left:		10px;
	}
	header h1 strong
	{
		margin-right: 		-1.4em;
	}
	main
	{
		padding:			5px 15px;
	}
	.para_box_width
	{
		width:				49%;
	}
	.withBrdr
	{
		padding:			5px 5px 5px 10%;
	}
	aside
	{
		padding:			5px 15px;
	}
	.aside_box
	{
		padding:			10px 20px;
	}
}
@media all and (min-width:500px)
{
	html.inFrame
	{
		font-size:			100%;
	}
    .inscripture
    {
        font-size:          100%;
    }
}
@media all and (min-width:531px)
{
	#top-area
	{
		height:				80px;
	}
	header
	{
		background-position: 	left top;
		background-size:	cover;
	}
	header h1
	{
		font-size: 			1.25em;
		font-style: 		italic;
		text-shadow:		4px 4px 4px rgba(0,0,0,.5);
		text-align: 		center;
		margin-left: 		0;
		font-weight:		bold;
	}
	header h1 strong
	{
		line-height: 		100%;
		font-size: 			4em;
	    line-height: 		1em;
		margin-right: 		-1.30em;
	}
	#hdr_icon
	{
		display:            none;
	}
	#upper-mid-area
	{
		margin:				2px 0 5px 0;
		height:				55px;
		display:			block;
	}
	#upper-mid-area nav
	{
		width:				474px;
		margin:				0 auto;
	}
	main
	{
		padding:			5px 15px;
	}
	aside
	{
		padding:			5px 15px;
	}
	.aside_box
	{
		padding:			10px 20px;
	}
	.img_width_resp
	{
		width:					25%;
	}
}
@media all and (min-width:720px)
{
	html.inFrame
	{
		font-size:			125%;
	}
    .inscripture
    {
        font-size:          125%;
    }
	main
	{
		width:				75%;
		padding:			5px 5px 5px 10px;
		float:				left;
	}
	aside
	{
		width:				25%;
		float:				right;
		padding:			10px 10px 5px 5px;
	}
}
@media all and (min-width:865px)
{
	html.inFrame
	{
		font-size:			150%;
	}
    .inscripture
    {
        font-size:          150%;
    }
    main
	{
		padding:			10px 10px 10px 20px;
	}
	aside
	{
		padding:			10px 20px 10px 10px;
	}
	.para_width
	{
		width:				49.75%;
		float:				left;
		height:				100%;
	}
	.img_width
	{
		width:				50%;
	}
	.two_column .img_width
	{
		width:				100%;
	}
	.withBrdr
	{
		padding:			5px 5px 5px 13%;
	}
}
@media all and (min-width:1440px)
{
	body
	{
		padding:			5px;
		margin:				0 auto;
	}
}

/* ============= link pages style =========== */
table, th, td
{
    border-collapse:		separate;
}
table
{
	border-style:			solid;
	border-width:			4px;
	border-color:			#E6C7BA #703D27 #703D27 #E6C7BA;
	width:					96%;
	margin:					10px auto 10px auto;
}
th
{
	border-style:			solid;
	border-width:			3px;
	border-color:			#703D27 #E6C7BA #E6C7BA #703D27 ;
	border-collapse:		separate;
    font-size:				1.33em;
}
td
{
	border-style:			solid;
	border-width:			3px;
	border-color:			#703D27 #E6C7BA #E6C7BA #703D27 ;
	border-collapse:		separate;
	padding:				4px;
	vertical-align:			middle;
}
td .lnkId
{
	font-weight:			bold;
}
tr img
{
	display:				block;
	margin:					0 auto 0 auto;
	width:					50px;
	border-style:			solid;
	border-width:			3px;
	border-color:			#E6C7BA #703D27 #703D27 #E6C7BA;
	border-collapse:		separate;
}
tr.trspace td
{
	padding:				0;
	height:					1px;
	background-color:		#703D27 ;
}


 @media all and (min-width:480px)
{
	table
	{
		border-width:		5px;
		width:				80%;
	}
	tr img
	{
		width:				75px;
	}
	tr.trspace td
	{
		height:				2px;
	}
}
@media all and (min-width:800px)
{
	table
	{
		border-width:		5px;
		width:				66%;
	}
	tr img
	{
		width:				100px;
	}
	tr.trspace td
	{
		height:				3px;
	}
}