body { padding: 0px; margin: 0px; font-family: verdana, arial;  background-position: 0% 50%; background-size: cover; background-attachment: fixed; animation: animatedBackground 120s ease-in-out infinite; }
@keyframes animatedBackground {
    0% { background-position: 0 0; }
    50% { background-position: 100% 0; }
    100% { background-position: 0 0; }
}
h1, h2 ,h3 ,h4 { font-family: 'Montserrat', sans-serif; text-transform: uppercase; font-weight: normal;  text-align: center;}

h1 { color: #1F4C7C; }
h1:before { content: "- ";}
h1:after { content: " -";}

h2 { font-size: 21px; }

.header { text-align: center; background-color: rgba(247,250,252,0.9);}
.logo { background: url("/images/henton-logo.png") no-repeat; font-size: 0px; background-size: contain; background-position: 50% 50%; line-height: 0px; height: 130px;  width: 49.5%; display: inline-block; vertical-align:top;}
.promo {  width: 49.5%; display: inline-block; vertical-align:top;}
.promo_event { width: 25%; border: 2px solid #1F4C7C; padding: 5px; margin: 8px; display: none; height: 100px; background-color: #fff; float: left; position: absolute; border-radius: 3px; box-shadow: 0px 2px 5px rgba(0,0,0,0.5);}
.promo_event h2 { margin: 4px; }
.promo_event p { font-size: 13px; color: #444; margin: 5px; }
.promo .active { display: block; }
.stripe { background: #8ACFF0; color: #fff; text-transform: uppercase; text-align: center; padding: 1px; }

.main { position: relative; max-width: 980px; margin-left: auto; margin-right: auto; border-radius: 10px; background-color: rgba(255,255,255,0.95); margin-top: 20px; min-height: 300px; box-shadow: 0px 0px 5px #999; padding: 10px 20px;  }


.form_gen { margin-left: auto; margin-right: auto; box-shadow: 10px 10px 20px 1px #999; padding: 20px; font-family: ''; font-weight: lighter; color: #2e5770; }

input { border-radius: 2px; padding: 3px; border: 1px solid #cde1ec; font-size: 13px; margin-left: 10px; transition: .3s linear;}
input[type=text]:focus { box-shadow: 0px 0px 5px #3158db; border-color: #2e5770;}
textarea { border-radius: 3px; padding: 3px; border: 1px solid #cde1ec; font-size: 15px; margin-left: 10px;  }
textarea:focus { box-shadow: 0px 0px 5px #3158db; border-color: #2e5770; }
input[type=button] { background-color: #999; }
input[type=submit] { border: none; background: url(/images/logo-bg.png) no-repeat; font-family: 'Open Sans', sans-serif; font-weight: 300; background-size: 100% 100%; color: #fff; text-decoration: none; border-radius: 3px; display: inline-block; padding: 5px 15px;  margin: 10px; box-shadow: 0px 1px 4px #555;}
input[type=submit]:hover { box-shadow: 0px 1px 2px #222; background: url(/images/nav-bg.png) repeat-x top #a10b0a; }


	.navigation img { border: none; vertical-align: middle; margin-left: 5px;}
	.navigation { background-color: #1F4C7C; font-family: verdana, arial; text-align: center; }
	.navigation a { font-size: 17px; display: inline-block; text-decoration: none; font-weight: 400; color: #fff; padding: 8px 16px; border-bottom: 4px solid #1F4C7C; }

	.navigation ul { display: inline-block; margin: 0px; padding: 0px; }
	.navigation ul li { display: inline-block;  }

	.navigation .submenu { display: none; position: absolute; background-color: #1F4C7C; }
	.navigation .submenu a { width: 230px; font-size: 15px; border: none; }
	.navigation a:hover { border-bottom: 4px solid #8ACFF0; }
	.navigation li:hover .submenu { z-index: 2200; display: block;  background-color: ##1F4C7C; box-shadow: 0px 2px 5px #000;   }
	
	.navigation .submenu_arrow { transition: all 0.4s ease-in-out; }
	.navigation li:hover .submenu_arrow { transform: rotate(180deg);  }
	
	.submenusubmenu_arrow { transition: all 0.4s ease-in-out; transform: rotate(-90deg); }
	.submenu li:hover .submenusubmenu_arrow { transform: rotate(90deg); }
	

	.submenu li { display: block !important; }
	.submenu li:hover .submenusubmenu { z-index: 2200; display: block;}
	.navigation .submenusubmenu { display: none; position: absolute; margin-top: -27px; margin-left: 10px; margin-left: 125px; }

	.navigation .search { float: right; margin-top: 6px; margin-right: 6px;}
	.search input { background: url(/images/search.png) no-repeat 2px 50% #fff; border: 2px solid #cde1ec; border-radius: 2px; padding: 2px 3px 2px 22px; width: 160px; }
	.search input:focus { box-shadow: 0px 0px 5px 2px #cde1ec; }
	.search img { position: absolute; margin-right: -20px; margin-top: 5px; }

	.months_top { width: 80%; margin-left: auto; margin-right: auto; background-color: #8ACFF0; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; text-align: center; margin-top: -10px; padding-top: 10px; padding-bottom: 10px;  }
	
	.months_top a { padding-bottom: 10px;  color: #fff; font-family: 'Montserrat', sans-serif; text-transform: uppercase; font-weight: normal; text-decoration: none; margin-left: 10px; margin-right: 10px;}
	.months_top a:hover { background: url("/images/triangle-dark.png") no-repeat center bottom;}
	
	.triangle { background: url("/images/triangle.png") no-repeat center bottom; }

	.calendar { width: 100%; font-family: Georgia, serif; border-collapse:  collapse; margin-bottom: 80px; }
	.calendar thead th { font-style: italic; padding: 5px; color: #fff; background-color: #1F4C7C; border-right: 1px solid #fff; border-bottom: 3px solid #fff; font-size: 14px; font-weight: normal;}
	.calendar thead th:first-child { background-color: #8ACFF0; color: #8ACFF0; width: 15%;  }

	.calendar tbody tr { display: none; }
	.calendar tbody td { padding: 5px; color: #fff; background-color:  #6a6a59; border-right: 1px solid #fff; border-bottom: 1px solid #fff;}
	.calendar tbody td:first-child { background-color: #8ACFF0; text-align: center; width: 15%; }

	.month_prev_next { position: absolute;  position: absolute; bottom: 20; left: 0; width: 960px; padding: 20px;  }
	.month_prev_next a { font-family: Georgia, serif; font-style: italic; font-size: 24px; color: #8ACFF0; text-decoration: none;transition: all 0.3s ease-in-out; }
	.month_prev_next a:hover { font-size: 25px;  }
	.month_prev_next a:first-child { background: url(/images/arrow-left.png) no-repeat; padding-left: 30px;  }
	.month_prev_next a:last-child { float: right; background: url(/images/arrow-right.png) no-repeat right; padding-right: 30px; }

	.more_info_box { z-index: 99999; display: none; background-color: #fff; padding: 10px; border-radius: 10px; box-shadow: 0px 0px 10px #000; width: 60%; height: 60%; position: absolute; left: 20%; top: 20%; }
	.more_info_box img { float: right; margin: 5px; }


	.more_button { cursor: pointer; float: right; color: #6a6a59; border-radius: 4px; padding: 2px 5px; text-decoration: none;  background-color: #fff; margin-left: 5px; margin-right: 5px; white-space: nowrap; }
	.more_button:hover { background-color: #8ACFF0; box-shadow: 0px 0px 3px #444; color: #fff; }

	.dark_box { display: none; float: left; position: fixed; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.7); }

	.events_h1 { color: #847FA1;}
	.readings_h1 { color: #BD0633;}
	.events_blue { background-color: #847FA1; }
	.events_rouge { background-color: #BD0633; }
	.calendar_events_blue thead th:first-child { background-color: #847fa1; color: #847fa1; width: 15%;  }
	.calendar_events_blue tbody td:first-child { background-color: #847fa1; }

	.calendar_events_rouge thead th:first-child { background-color: #BD0633; color: #BD0633; width: 15%;  }
	.calendar_events_rouge tbody td:first-child { background-color: #BD0633; }


	.footer { box-shadow: 0px 0px 5px #999; margin-left: auto; margin-right: auto; padding: 4px 10px; background-color: rgba(255,255,255,0.8); margin-top: 20px; text-align: center; border-radius: 10px; max-width: 980px; color: #8ACFF0; }