/*-----------------------------------------------------------  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;

	--color_pd5: hsl(223, 66%, 5%);
	--color_pd4: hsl(223, 66%, 8%);
	--color_pd3: hsl(223, 66%, 14%);
	--color_pd2: hsl(223, 66%, 20%);
	--color_pd1: hsl(223, 66%, 28%);
	--color_p: hsl(223, 66%, 36%);
	--color_pl1: hsl(223, 66%, 46%);
	--color_pl2: hsl(223, 66%, 56%);
	--color_pl3: hsl(223, 66%, 66%);
	--color_pl4: hsl(223, 66%, 86%);
	--color_pl5: hsl(223, 66%, 95%);

	--color_ad5: hsl(43, 62%, 5%);
	--color_ad4: hsl(43, 62%, 10%);
	--color_ad3: hsl(43, 62%, 20%);
	--color_ad2: hsl(43, 62%, 30%);
	--color_ad1: hsl(43, 62%, 40%);
	--color_a: hsl(43, 62%, 50%);
	--color_al1: hsl(43, 62%, 60%);
	--color_al2: hsl(43, 62%, 75%);
	--color_al3: hsl(43, 62%, 82%);
	--color_al4: hsl(43, 62%, 90%);
	--color_al5: hsl(43, 62%, 95%);

	--color_cd5: hsl(0, 48%, 5%);
	--color_cd4: hsl(0, 48%, 18%);
	--color_cd3: hsl(0, 48%, 29%);
	--color_cd2: hsl(0, 48%, 42%);
	--color_cd1: hsl(0, 48%, 54%);
	--color_c: hsl(0, 48%, 68%);
	--color_cl1: hsl(0, 48%, 74%);
	--color_cl2: hsl(0, 48%, 81%);
	--color_cl3: hsl(0, 48%, 86%);
	--color_cl4: hsl(0, 48%, 91%);
	--color_cl5: hsl(0, 48%, 95%);

	--color1000: #1f305c;
	--color2000: #326f95;
	--color3000: #83bffd;
	--color4000: #583f62;
	--color5000: #9671a4;

}

/*-----------------------------------------------------------  HEADER --------------------------*/
header { 
	/* background-color: rgba(49,70,144,.8); */
	/* border-bottom: 3px solid var(--color_a); */
	/* color: var(--white); */
}

.logo-icc-top { background: white; }

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 transparent;
	background: white;
	color: var(--color_p);
	transition: all 0.2s linear;
}

#top_buttons a:hover {
	border: 1px solid var(--gray3);
	color: var(--color_pd2);
	transition: all 0.2s linear;
}

header .social a {
	color: var(--color_pd1);
}

header .social a:hover {
	color: var(--color_pl1);
}

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

body { color: black; background: white; }

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

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

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

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

h3 { color: black; }

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

ul li {  }

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

ol li::marker { color: var(--color_pl3); }

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

footer {
	background-color: var(--color3000);
	color: #3b3b3b;
}
footer a { color: #3b3b3b; }
footer a:hover { color: #3b3b3b; }
footer#ft_adom .content h1 { color: var(--color_pd2); }
footer h2 { color: var(--color1d); }
footer h3 { color: var(--color1d); }
footer#ft_adom .content h4 { color: var(--color_pd1); }

footer#ft_adom .content .ft_social p a {
	color: var(--color_pd2);
}

footer#ft_adom .content .ft_social p a:hover {
	color: var(--color_p);
}


/* .wrap_admin { background-color: var(--color_al2); } */
.wrap_admin p { color: var(--gray5); } 
.wrap_admin a { color: var(--gray4); }

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

/*-----------------------------------------------------------  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: var(--color4000) bottom center;
	background-size: cover;
	background-blend-mode: multiply;
	color: var(--white);
}
.bg2d a { color: var(--color_cl4); }
.bg2d a:hover { color: var(--color_cl5); }
.bg2d h1 { color: var(--color_al2); }
.bg2d h2 { color: var(--color_al2); }
.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); }

.asidequote.cl p {
	color: var(--color5000);
}

/*-----------------------------------------------------------  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_p); }

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

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_pd2);
}

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

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_pl1);
	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_pl3);
	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_pd2); }

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

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


/*-----------------------------------------------------------  HMENU01   ------------------------*/
@media (min-width: 1180px) {
	/* FIRST LEVEL    -----------------*/
	.hmenu01 ul#main-menu > li > a {
		background-color: transparent; 
		color: var(--color_pd2);
	}

	.hmenu01 ul#main-menu > li > a::before {
		background-color: var(--color_pd1);
	}   
		
	.hmenu01 ul#main-menu > li > a.selected,
	.hmenu01 ul#main-menu > li > a.highlighted,
	.hmenu01 ul#main-menu > li > a.current { 
		color: var(--color_pd1); 
	}

	.hmenu01 ul#main-menu > li > a:hover {  
		color: var(--color_pd1);
	}
	
	/* SECOND+ LEVEL    ---------------*/
	.hmenu01 ul#main-menu > li ul { box-shadow: 3px 3px rgba(80,80,80,0.2); }

	.hmenu01 ul#main-menu > li > ul li a { 
		background-color: var(--color1000);
		color: var(--white); 
		border-bottom: 1px solid var(--white);
	}

	.hmenu01 ul#main-menu > li ul li a:hover{ 
		background-color: #253c77; 
		/*color: var(--color_p);*/
	}        
}

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

	/* FIRST LEVEL    -----------------*/
	.hmenu01 ul#main-menu > li > a {
		color: #ffffff;
		border-bottom: 1px solid #ffffff;
	}
	
	.hmenu01 ul#main-menu > li > a.current,
	.hmenu01 ul#main-menu > li > a.highlighted { 
		border-bottom: none;
		background-color: #253c77;
	}    
	
	.hmenu01 ul#main-menu > li > ul li a:hover { 
		color: var(--color3000);
		border-bottom-color: var(--color3000);
		/* background: var(--color_al3); */
	}

	/* SECOND+ LEVEL    ---------------*/
	.hmenu01 ul#main-menu > li ul { margin: 0 10px 15px; }

	.hmenu01 ul#main-menu > li > ul li a { 
		color: white; 
		border-bottom: 1px dotted var(--white);
	}

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

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


/*-----------------------------------------------------------  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 var(--gray2);
}

.vmenu01 > ul > li:last-child a {
	border-bottom: 1px solid transparent;
}

.vmenu01 a:hover,
.vmenu01 a.selected{ 
	color: var(--color_pd1);
	background: var(--color_pl5);
}

.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_pd1); }

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

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

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

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

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

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