:root {
	--color-black: 			#000000;
	--color-courage-main:	#7f1001;
	--color-gray: 			#cccccc;
	--color-dark-gray:		#444444;
	--color-light-gray: 	#f5f5f5;
	--color-red:			#ff0000;
	--color-white: 			#ffffff;

	--default-line-height:	1.5em;

	--width-one-half:		50%;
	--width-one-third:		33%;
}


body {
	margin: 0;
    padding: 0;
    height: 100% !important;
    font-family: Roboto, Helvetica, Arial, sans-serif;
    font-size: 18px;
	color: var(--color-dark-gray);
}

@media only screen and (max-width: 480px), only screen and (max-device-width: 480px) {
	body {
		font-size: 20px;
	}
 }
	
	
a,abbr,acronym,address,applet,blockquote,body,caption,cite,code,dd,div,dl,dt,fieldset,figure,form,h1,h2,h3,h4,h5,h6,html,iframe,img,label,legend,li,object,ol,p,pre,span,sub,sup,table,tbody,td,tfoot,th,thead,tr,ul{
	margin:0;
	padding:0;
	border:0;
	vertical-align:baseline;
}

a, a:visited {
	color: #c00000;
	font-weight: bold;
	border-bottom: 1px dotted var(--color-black);
	text-decoration: none;
}

a {
	text-decoration: none;
	color: #c00000;
}

a:hover {
	color: var(--color-courage-main);
	text-decoration: none;
	border-bottom: 1px dotted;
}

a:link, a:visited {
    text-decoration: none;
}


a.email  {
	padding: 0 0 0px 16px;
	display: inline;
	background-repeat: no-repeat;
	background-position: center left;
	background-image: url(../img/iconMail.gif);
}


a.external  {
	padding: 0 0 0 20px;
	background: url(../img/otherlink-red_16x16.png) center left no-repeat;
	background-size: 16px 16px;
}


a.more-after:after {
	font-family: FontAwesome;
	font-size: 1.0em;
	font-weight: normal;
	content: "\f0da";		/* right arrow */
	display: inline-block;
	padding: 0 4px;
}

a.more-before:before {
	font-family: FontAwesome;
	font-size: 1.0em;
	font-weight: normal;
	content: "\f0da";		/* right arrow */
	display: inline-block;
	padding: 0 4px;
}

a.more:after {
	font-family: FontAwesome;
	font-size: 1.0em;
	font-weight: normal;
	content: "\f0da";		/* right arrow */
	display: inline-block;
	padding-left: 2px;
}

a.pdf  {
	padding: 0 0 0px 20px;
	display: inline;
	background-repeat: no-repeat;
	background-position: center left;
	background: url(../img/icon-pdf-gray-outline-256x256.png) no-repeat 0 0.1em;
	background-size: 16px 16px;
}

.anchor {
	scroll-margin-top: 250px;	
}


.articles .float-list {
	margin: 1.0em 0;
	min-height: 4.0em;
}


b, strong {
    font-weight: bold;
}


.bold {
	font-weight: bold;
}

.center {
	margin: 0 auto;
	text-align: center;
}

.center-float {
	display: flex;
	justify-content: center;
}

.center h1,
.center .or-spacer {
	margin: 20px auto;
	text-align: center;
}

.clear {
	clear: both;
}

.disabled {
	display: none;
}


h1 {
    font-family: "Cinzel", Georgia, serif;
	font-size: 180%;
	color: var(--color-courage-main);
	font-weight: bold;
	text-align: left;
	padding-top: 3.0em;
	border-bottom: 1px solid var(--color-gray);
	line-height: 1.0em;
}

h1.noborder {
	border-bottom: 0px solid var(--color-gray);
}

h1:first-of-type {
	padding-top: 0.0em;
}

h1+h1 {
	padding-top: 0.5em;
}


h2 {
    font-family: "Cinzel", Georgia, serif;
	font-size: 140%;
	color: var(--color-dark-gray);
	font-weight: bold;
	text-align: left;
	padding-top: 1.5em;
	border-bottom: 1px solid var(--color-gray);
}

h3, h4 {
	text-align: left;
	font-size: 100%;
	font-weight: bold;
	padding-top: 2.0em;
	padding-bottom: 1.0em;
}



/* THE AREA THAT CONTAINS THE IMAGE AND THE WEBSITE TITLE */
.core {
	display: flex;
}

.core > div {
	margin: 0 20px;
}

.core p {
    font-family: Roboto, Helvetica, Arial, sans-serif;
    color: var(--color-dark-gray);
	font-weight: 200;
	line-height: var(--default-line-height);
	margin: 1.0em 0;
}

.core p.bold {
	font-weight: bold;
}

.core p.filler {
	line-height: 4.0em;
	clear: both;
}


.core .threecolumn-small > h2,
.core .twocolumn-equal > h2 {
	padding-top: 0.0em;
}


.core ul li {
	line-height: var(--default-line-height);
	padding: 0 1.0em 0.5em 1.0em;
}


.core ul > li {
	padding: 0 1.0em 0.5em 3.0em;
}


.core ul li.free ul li, 
.core ul li.paid ul li {
	padding: 0 1.0em 3.0em 3.0em;
}


.core ul.iconlist.resource > li.free {
	background: url(../img/payment-bills-inactive_32x32.png) no-repeat 0 -0.2em;
}


.core ul.iconlist.resource > li.paid {
	background: url(../img/payment-bills_32x32.png) no-repeat 0 -0.2em;
}


.core ul li.book-stack {
	padding: 0 1.0em 3.0em 3.0em;
}


#div-core {
	background-color: var(--color-white);
	min-height: 600px;

	background-image: url("../img/Crucifix-1.png");
/*	background-size: 200px 300px;
*/	background-position: left top;
	background-repeat: no-repeat;
}

#div-footer {
	background-color: var(--color-gray);
    border-top: 5px solid var(--color-dark-gray);
}

#div-header {
	background-color: var(--color-courage-main);
	border-bottom: 10px solid var(--color-black);
}


#div-top {
	position: sticky;
	position: -webkit-sticky;	/* needed for ios */
	top: 0;
	z-index: 1000;
}


#div-top.scrolled {
	opacity: 0.90;
}



#div-nav {
	background-color: var(--color-white);
	padding-bottom: 2em;
}

#div-notice {
	background-color: var(--color-gray);
}


.core,
#footer,
#header, #header-2,
#nav,
#notice {
	margin: 0 300px;
}

#content_tab1 > .core,
#content_tab2 > .core,
#content_tab3 > .core,
#content_tab4 > .core,
#content_tab5 > .core,
#content_tab6 > .core,
#content_tab7 > .core {
	margin: 0;
}

.core,
#footer {
	padding: 0.5em;
}


.float-list {
	float: left;
}

.float-one-half {
	width: var(--width-one-half);
}

.font-size-100 {
	font-size: 180%;
}

.font-size-150 {
	font-size: 150%;
}

.font-size-200 {
	font-size: 200%;
}

.font-size-300 {
	font-size: 300%;
}

.font-size-400 {
	font-size: 400%;
}

#footer a {
	text-decoration: none;
	color: var(--color-dark-gray);
	border-bottom: 0px dotted;
}

#footer a:hover {
	color: var(--color-light-gray);
}

#header {
	display: flex;
    font-family: "Cinzel", Georgia, serif;
	font-size: 28px;
	color: var(--color-black);
	background-color: var(--color-courage-main);
	text-align: left;
}

#header a {
	text-decoration: none;
	color: var(--color-dark-gray);
	border-bottom: 0px dotted;
}

#header a.lang {
    background-size: 31px 26px;
    background-repeat: no-repeat;
    background-position: center;
    background-clip: border-box;
    transition: background-size 0.2s;
    transition-timing-function: cubic-bezier(.07,1.41,.82,1.41);
    width: 31px;
    height: 26px;
    text-decoration: none;
    cursor: pointer;
    overflow: hidden;
    text-indent: 100%;
    white-space:nowrap;
}

#header a.lang.en.active:hover,
#header a.lang.en.inactive:hover {
    background-image: url('../img/language-icon-en-hover.png');
}

#header a.lang.es.active:hover,
#header a.lang.es.inactive:hover {
    background-image: url('../img/language-icon-es-hover.png');
}

#header a.lang.en.active {
    background-image: url('../img/language-icon-en-active.png');
}

#header a.lang.en.inactive {
    background-image: url('../img/language-icon-en-inactive.png');
}

#header a.lang.es.active {
    background-image: url('../img/language-icon-es-active.png');
}

#header a.lang.es.inactive {
    background-image: url('../img/language-icon-es-inactive.png');
}

#header a:link, #header a:visited {
    text-decoration: none;
}

#header h1 {
	display: none;
}

#header > div {
	color: var(--color-white);
	margin: 10px 0;
/*	background-color: #f1f1f1;
	padding: 20px;
	font-size: 30px;
*/
}

img {
	border: 0;
}

img.border{
	border: 1px solid #a0acc0;
}

img.left {
	padding-right: 10px;
	float: left;
	position: relative;
	z-index: 100;
}

img.right {
	padding: 0 0 10px 10px;
	float: right;
	clear: both;
	position: relative;
	z-index: 100;
}

img.right + img.right {
	padding-top: 0.5em;
}

.img_link {
	text-decoration: none;
	border-bottom: none;
}

.indent {
	padding-left: 1.0%;
}

.indent-2x {
	padding-left: 2.0%;
}

.indent-3x {
	padding-left: 3.0%;
}

.indent-4x {
	padding-left: 4.0%;
}

.italics {
	font-style: italic;
}

#notice {
	display: flex;
	display: none;
    font-family: Roboto, Helvetica, Arial, sans-serif;
	font-size: 20px;
	text-align: left;
}

#notice a {
	text-decoration: none;
	color: #c00000;
	border-bottom: 0px dotted;
}

#notice > div {
	color: var(--color-black);
	font-weight: bold;
	margin: 10px;
/*	background-color: #f1f1f1;
	padding: 20px;
	font-size: 30px;
*/
}

#page {
    position: relative !important;
    min-height: 100% !important;
    box-sizing: border-box !important;
    border-top: solid 0 transparent !important;
    border-bottom: solid 0 transparent;
    padding-top: 0px;
    background: none;
/*
    overflow: hidden;
	background-color: #ffffff;
	width: 1024px;
*/
}


.protected_fields {
    display: none;
	height: 0;
}


.red {
	color: var(--color-red);
}

.right {
	float: right;
}


.side-bar {
    float: right;
    margin: 0 0 2em 2em;
	padding: 0.5em;
}

.side-bar.border {
	border: 1px solid #9e9e9e;
}

.smaller-font {
	font-size: 80%;
}

.smallest-font {
	font-size: 60%;
}

.space-after {
	padding-bottom: 1em;
}

.space-before {
	padding-top: 1em;
}

#SubmitButton {
	background-color: var(--color-courage-main);
	color: var(--color-white);
	padding: 0.5em;
}

.submit-disabled {
	opacity: 0.4;
	cursor: not-allowed !important;
}

.submit-enabled {
	opacity: 1.0;
	cursor: default !important;
}

table.gridtable {
	font-size: 80%;
	margin-bottom: var(--default-line-height);
	border-collapse: collapse;
}


.textarea-height {
	height: 8.5em !important;
}


.text-center {
	text-align: center !important;
/*	margin: 0 auto 0 auto;
*/	margin-left: auto;
	margin-right: auto;
}

.text-left {
	text-align: left !important;
	width: 100%;
}

.text-right {
	text-align: right !important;
	width: 100%;
}

.onecolumn {
	width: 100%;
}

.threecolumn-equal {
	width: 33%
}

.threecolumn-large {
	width: 66%
}

.threecolumn-small {
	width: 34%
}

.threecolumn-smaller {
	width: 20%
}

.threecolumn-medium {
	width: 40%
}

.twocolumn-equal {
	width: var(--width-one-half);
}

ul {
    list-style: none;
    list-style-image: none;
    padding-left: 0;
	margin: 1.0em 0;
}

.video .float-list {
	min-height: 10.0em;
	margin: 1.0em 0 4.0em 0;
	line-height: var(--default-line-height);
}

.video-container {
	position: relative;
	padding-bottom: 2em;
/*
	padding-bottom: calc(56.25% * 0.8);
	height: 0
	margin: 1.0em 0 4.0em 0;
*/
}


.video-container object {
	aspect-ratio: 16 / 9;
	height: auto;
	width: 100%
}


.width-one-half {
	width: var(--width-one-half);
}

.width-one-third {
	width: var(--width-one-third);
}

.underline {
	text-decoration: underline;
}

@media only screen and (max-width: 1000px) {
	#page {
		min-width: 1025px;
	}
	
	#header {
		font-size: 22px;
	}

	.core,
	#footer,
	#header,
	#nav,
	#notice {
		margin: 0 150px;
	}

}


@media only screen and (max-width: 1280px) {
	body {
		font-size: 16px;
	}

	#header {
		font-size: 26px;
	}

}