/*-----------------------------------------------------------  PAGE RESET ----------------------*/
:root {
    --bg_hd: rgba(49,70,144,.8);
    --tx_hd: #fff;
    --aa_hd: #000;
    --ah_hd: #000;
    --h1_hd: #000;
    --h2_hd: #000;
    --h3_hd: #000;
	--bg_gray: #ececec;;

	--color_pd5: hsl(215, 87%, 5%);
    --color_pd4: hsl(215, 87%, 7.6%);
    --color_pd3: hsl(215, 87%, 10.2%);
    --color_pd2: hsl(215, 87%, 12.8%);
    --color_pd1: #061023;
    --color_p: #0e1d3b;
    --color_pl0: #182f5e;
    --color_pl1: #3b5384;
    --color_pl2: hsl(215, 87%, 48.8%);
    --color_pl3: hsl(215, 87%, 64.2%);
    --color_pl4: hsl(215, 87%, 79.6%);
    --color_pl5: hsl(215, 87%, 95%);

    --color_ad5: hsl(34, 98%, 5%);
    --color_ad4: hsl(34, 98%, 11.8%);
    --color_ad3: hsl(34, 98%, 18.6%);
    --color_ad2: hsl(34, 98%, 25.4%);
    --color_ad1: hsl(34, 98%, 32.2%);
    --color_a: hsl(34, 98%, 45%);
    --color_al1: hsl(34, 98%, 50.2%);
    --color_al2: hsl(34, 98%, 61.4%);
    --color_al3: #eed281;
    --color_al4: hsl(34, 98%, 83.8%);
    --color_al5: hsl(34, 98%, 95%);

    --color_cd5: hsl(8, 66%, 5%);
    --color_cd4: hsl(8, 66%, 11.8%);
    --color_cd3: hsl(8, 66%, 18.6%);
    --color_cd2: hsl(8, 66%, 25.4%);
    --color_cd1: hsl(8, 66%, 32.2%);
    --color_c: #cc1417;
    --color_cl1: hsl(8, 66%, 50.2%);
    --color_cl2: hsl(8, 66%, 61.4%);
    --color_cl3: hsl(8, 66%, 72.6%);
    --color_cl4: hsl(8, 66%, 83.8%);
    --color_cl5: hsl(8, 66%, 95%);

}

/*-----------------------------------------------------------  HEADER --------------------------*/
header a { color: var(--color_pd3); }
header a:hover { color: var(--color_a); }
header h1 { color: var(--white); }
header h2 { color: var(--white); }
header h3 { color: var(--white); }

#top_buttons a { border: 1px solid var(--color_pd3); }
#top_buttons a:hover { border: 1px solid var(--color_a); }

/*-----------------------------------------------------------  BODY --------------------------*/

body { color: black; }

a { color: var(--color_a); }

a:hover { color: var(--color_al2); }

h1 { color: var(--color_p); }

h2 { color: var(--color_a); }

h3 { color: var(--color_p); }

h4 { color: var(--color_ad2); }

ul li {  }

ul li::before { /*! color: var(--color_a); */ }

blockquote {
    color: var(--color_pl1);
    border-color: var(--color_pl1);
    background-color: var(--gray1);
}
/*-----------------------------------------------------------  FOOTER --------------------------*/

footer {
    background-color: var(--color_p);
    color: white;
}
footer a { color: var(--gray1) }
footer a:hover { color: var(--color_a) }
footer h1 { color: var(--color1d); }
footer h2 { color: var(--color1d); }
footer h3 { color: var(--color1d); }


.wrap_admin { background-color: var(--color_pd1); }
.wrap_admin p, 
.wrap_admin a { color: var(--white); }

.wrap_admin a:hover { color: var(--color_c); }

/*-----------------------------------------------------------  BG1D --------------------------*/
.bg1d { 
    background-color: var(--color_pd3); 
    color: var(--white);
}
.bg1d a { color: var(--color_al1); }
.bg1d a:hover { color: var(--color_al2); }
.bg1d h1 { color: var(--color_pl3); }
.bg1d h2 { color: var(--color_al1); }
.bg1d h3 { color: var(--white); }

.bg1d .content ul li::before { color: var(--color_al1); }

/*-----------------------------------------------------------  BG2D --------------------------*/
.bg2d { 
    background-color: var(--color_a); 
    color: var(--white);
}
.bg2d a { color: var(--color_pl1); }
.bg2d a:hover { color: var(--color_pd2); }
.bg2d h1 { color: var(--color_pd2); }
.bg2d h2 { color: var(--color_ad3); }
.bg2d h3 { color: var(--white); }

.bg2d .content ul li::before { color: var(--color_pd2); }

/*-----------------------------------------------------------  BG3D --------------------------*/
.bg3d { 
    background-color: var(--color_c); 
    color: var(--white);
}
.bg3d a { color: var(--color_cl3); }
.bg3d a:hover { color: var(--color_cl3); }
.bg3d h1 { color: var(--color_cl5); }
.bg3d h2 { color: var(--color_cl4); }
.bg3d h3 { color: var(--white); }

.bg3d .content ul li::before { color: var(--color_cd5); }

/*-----------------------------------------------------------  BG1L --------------------------*/
.bg1l { 
    background-color: var(--color_pl5); 
    color: var(--black);
}
.bg1l a { color: var(--color_a); }
.bg1l a:hover { color: var(--color_al2); }
.bg1l h1 { color: var(--color_p); }
.bg1l h2 { color: var(--color_a); }
.bg1l h3 { color: var(--white); }

.bg1l .content ul li::before { color: var(--color_a); }


/*-----------------------------------------------------------  BG2L --------------------------*/
.bg2l { 
    background-color: var(--color_al5); 
    color: var(--black);
}
.bg2l a { color: var(--color_p); }
.bg2l a:hover { color: var(--color_pl2); }
.bg2l h1 { color: var(--color_p); }
.bg2l h2 { color: var(--color_a); }
.bg2l h3 { color: var(--white); }

.bg2l .content ul li::before { color: var(--color_p); }


/*-----------------------------------------------------------  BG3L --------------------------*/
.bg3l { 
    background-color: var(--color_cl4); 
    color: var(--white);
}
.bg3l a { color: var(--color_cd3); }
.bg3l a:hover { color: var(--color_cd3); }
.bg3l h1 { color: var(--color_cd5); }
.bg3l h2 { color: var(--color_cd4); }
.bg3l h3 { color: var(--white); }

.bg3l .content ul li::before { color: var(--color_cd5); }

/*-----------------------------------------------------------  ASIDE - PD --------------------------*/
.asidebox.pd { 
    background-color: var(--color_pd3); 
    color: var(--white);
}

.asidebox.pd a { color: var(--color_pl2); }

.asidebox.pd a:hover { color: var(--color_pl1); }

.asidebox.pd h1 { color: var(--color_pl3); }

.asidebox.pd ul li::before { color: var(--color_pl3); }

/*-----------------------------------------------------------  ASIDE - AD --------------------------*/
.asidebox.ad { 
    background-color: var(--color_a); 
    color: var(--white);
}

.asidebox.ad a { color: var(--color_ad3); }

.asidebox.ad a:hover { color: var(--color_ad2); }

.asidebox.ad h1 { color: var(--color_al4); }

.asidebox.ad ul li::before { color: var(--color_al3); }

/*-----------------------------------------------------------  ASIDE - CD --------------------------*/
.asidebox.cd { 
    background-color: var(--color_c); 
    color: var(--white);
}
.asidebox.cd a { color: var(--color_cl3); }

.asidebox.cd a:hover { color: var(--color_cl3); }

.asidebox.cd h1 { color: var(--color_cl3); }

.asidebox.cd ul li::before { color: var(--color_cd3); }

/*-----------------------------------------------------------  ASIDE - PL --------------------------*/
.asidebox.pl { 
    background-color: var(--color_pl5); 
    color: var(--black);
}

.asidebox.pl a { color: var(--color_pl2); }

.asidebox.pl a:hover { color: var(--color_pl1); }

.asidebox.pl h1 { color: var(--color_p); }

.asidebox.pl ul li::before { color: var(--color_p); }


/*-----------------------------------------------------------  ASIDE - AL --------------------------*/
.asidebox.al { 
    background-color: var(--color_al5); 
    color: var(--black);
}
.asidebox.al a { color: var(--color_al2); }

.asidebox.al a:hover { color: var(--color_al3); }

.asidebox.al h1 { color: var(--color_a); }

.asidebox.al ul li::before { color: var(--color_a); }


/*-----------------------------------------------------------  ASIDE - CL --------------------------*/
.asidebox.cl { 
    background-color: var(--color_cl4); 
    color: var(--black);
}
.asidebox.cl a { color: var(--color_cl1); }

.asidebox.cl a:hover { color: var(--color_cl2); }

.asidebox.cl h1 { color: var(--color_c); }

.asidebox.cl ul li::before { color: var(--color_c); }

/*-----------------------------------------------------------  TOP PAGE  -----------------------*/
#top_page .transparent {
	background-color: rgba(255,255,255,.4);
	border-top: 1px solid rgba(255,255,255,0.45);
}

#top_page h1 { color: white; }

/*-----------------------------------------------------------  DEFAULT TABLE   -----------------*/

/*TABLE COLOR P*/
table.default.color_p caption { color: var(--color_pd1); }

table.default.color_p td { border-bottom: 1px solid var(--gray2); }

table.default.color_p thead th {
    background: var(--color_pl5);
    border-top: 1px solid var(--color_pd1);
    border-bottom: 1px solid var(--color_pd1);
    color: var(--color_pd1);
}

table.default.color_p thead td { background: transparent; }

table.default.color_p tfoot th { background: transparent; }


/*TABLE COLOR A*/
table.default.color_a caption { color: var(--color_ad2); }

table.default.color_a td { border-bottom: 1px solid var(--gray2); }

table.default.color_a thead th {
    background: var(--color_al5);
    border-top: 1px solid var(--color_ad2);
    border-bottom: 1px solid var(--color_ad2);
    color: var(--color_ad2);
}

table.default.color_a thead td { background: transparent; }

table.default.color_a tfoot th { background: transparent; }

table.default.color_a tfoot {
    color: var(--white);
    background: var(--color_ad1);
}

/*TABLE COLOR C*/
table.default.color_c caption { color: var(--color_cd2); }

table.default.color_c td { border-bottom: 1px solid var(--gray2); }

table.default.color_c thead th {
    background: var(--color_cl5);
    border-top: 1px solid var(--color_cd2);
    border-bottom: 1px solid var(--color_cd2);
    color: var(--color_cd2);
}

table.default.color_c thead td { background: transparent; }

table.default.color_c tfoot th { background: transparent; }


/*-----------------------------------------------------------  DEFAULT FORM   ------------------*/
form.default legend { color: var(--color_ad1); }

form.default label { color: var(--color_pd2); }

form.default input,
form.default select,
form.default textarea { border-color: var(--gray2); }

form.default input[type="submit"], 
form.default input[type="button"],
.form_buttons a,
a.button {
    border-color: var(--color_a);
	color: var(--white);
    background-color: var(--color_a);
}

form.default input[type="submit"]:hover, 
form.default input[type="button"]:hover,
.form_buttons a:hover,
a.button:hover, 
a.button.selected {
	background-color: var(--color_pl2);
	border-color: var(--color_pl2);
}

a.button01 {
    border-color: var(--color_al1);
    color: var(--color_al1);
    background: var(--white)
}

a.button01:hover {
	border-color: var(--white);
	color: var(--white);
    background: var(--color_al1)
}

input.button {
    color: white;
    background-color: var(--color1000);
}

input.button:hover { background-color: var(--color4000); }

form.default .buttons_field_group #remove_fgroup {
    background-color: transparent;
    color: var(--color_c);
    border-color: var(--color_c);
}

form.default .buttons_field_group #add_fgroup {
    background-color: var(--color_pl1);
    color: white;
    border-color: var(--color_pl1);
}

form.default .buttons_field_group #remove_fgroup:hover,
form.default .buttons_field_group #add_fgroup:hover {
    border-color: transparent;
    background: var(--color_al1);
    color: white;
}

/*------------------------------------------------------------  CLEAN FORM  ---------------------*/
.clean input, .clean textarea { border-color: var(--gray4); }

.clean .submit { background: var(--color_c); }

/*------------------------------------------------------------  FLOATING FORM  ---------------------*/
.Floating input, .Floating textarea { border-color: var(--gray4); }

.Floating .submit { background: var(--color_c); }

.Floating .submit:hover { background: var(--color_cl2); }

/*-----------------------------------------------------------  SCROLL TO TOP   ------------------*/
#scrollToTop { color: var(--color_a); }


/*-----------------------------------------------------------  HMENU01   ------------------------*/
/* FIRST LEVEL    -----------------*/
.hmenu01 ul#main-menu > li > a {
	margin: 0 25px;
	color: var(--black);
	transition: 0.2s linear;
}    

.hmenu01 ul#main-menu > li > a.current { 
	border-color: var(--color_c);
	box-shadow: -20px 0px 0px 0px var(--color_p);
	color: var(--color_p);
	background-color: var(--bg_gray);
}

.hmenu01 ul#main-menu > li > a.selected,
.hmenu01 ul#main-menu > li > a:hover { 
	border-color: var(--color_c);
	box-shadow: -20px 0px 0px 0px var(--color_p);
	color: var(--color_p);
		
}


/* SECOND+ LEVEL    ---------------*/

.hmenu01 ul#main-menu > li > ul li a { 
	color: var(--black); 
}

.hmenu01 ul#main-menu > li > ul li a:hover { 
	border-color: var(--black); 
}

/* hamburger icon */
.main-menu-btn-icon,
.main-menu-btn-icon:before,
.main-menu-btn-icon:after {
    background-color: var(--color_a);
}

@media (max-width: 1179px) {
    .hmenu01 > ul#main-menu {
        background: white;
    }
}


/*-----------------------------------------------------------  VMENU01   -----------------------*/
.vmenu01 > h1 {
	background-color: rgba(49,70,144,.8);
	color: white;
	border-top: 1px solid rgb(119, 124, 145);
}

.mbar { background-color: rgba(0,0,0,0.03); }

.vmenu01 > ul > li > a {
    color: var(--gray4);
	border-bottom: 1px solid transparent;
}

.vmenu01 a:hover,
.vmenu01 a.selected{ 
    color: var(--color_ad1); 
    border-color: var(--color_ad1); 
}

.vmenu01 > ul > li ul li { border-bottom: dashed 1px var(--gray2); }

/*-----------------------------------------------------------  PAGE INDEX ----------------------*/
.content .box_index { border-color: var(--color_a); }

.content .box_index h1 {
    background-color: var(--color_pd2);
    color: var(--white);
}

.content .box_index .page_index {
    background: var(--gray1);
}

.content .box_index .page_index a {
    border-color: var(--color_a) !important;
}

.index_this h3 { color: var(--color_c); }

.index_back a { color: var(--color_cl2); }

.index_back a:hover { color: var(--color_cl3); }

/*---------------------------------------------  MASS INTENTIONS   ------------------------------*/
.mass_intentions dl dt h2 { color: var(--color_a); }

.mass_intentions dl dt p {
    background: var(--color_a);
    color: white;
}

.mass_intentions dl dd { border-left-color: var(--color_a); }

.mass_intentions dl dd h2 {color: var(--color_pd1); }

/*------------------------------------------------  READINGS   ----------------------------------*/
#readings h2, #readings_spanish .rsslayer h2 {
    background: var(--color_a);
}

#readings h2:hover, #readings_spanish .rsslayer h2:hover {
    background: var(--color_a1);
}

#readings h4, #readings_spanish h4 {
    color: var(--color_pl2);
}