body{
	margin:					0px;
	padding-top: 			130px;
	overflow-x:hidden;
}
header{
	width:					100%;
	background-color:		#ebefec;
}
header.home{
		width:					100%;
		background-color:		#ebefec;
    padding-bottom: 		10px;
    background-repeat: 		no-repeat;
}
h1{
	font-family: 			'Cabin', sans-serif;
	z-index:				100;
	font-size:				40px;
	color:					#93272c;
	text-align:				center;
}
h2{
	font-family: 			'Cabin', sans-serif;
	font-size:				30px;
	color:					#999999;
	text-align:				center;
	font-weight: 			400;
}
h3{
	font-family: 			'Cabin', sans-serif;
	font-size:				25px;
	color:					#93272c;
	text-align:				center;
	font-weight: 			500;
}
h3.h3-smaller{font-size:22px;}
.light-red{color:#cb333b;}
h4{
	font-family: 			'Cabin', sans-serif;
	font-size:				18px;
	color:					#93272c;/*#999999*/
	text-align:				center;
	font-weight: 			600;
	margin:					5px;
}
p{
	font-family: 			'Titillium Web', sans-serif;
	font-size:				18px;
	color:					#414141;
	text-align:				left;
	font-weight:			100;
	-ms-word-break: 		keep-all;
	word-break: 			keep-all;
}
p.fixed-phrase{
	position:				fixed;
	bottom:					10px;
	left:					20px;
	z-index:				1000;
	font-family: 			'Titillium Web', sans-serif;
	text-align:				left;
	color:					#616161;
}
.center{
	text-align:				center;
	margin:					auto;
}
.left{
	text-align:				left;
}
.right{
	text-align:				right;
}
.white{
	color:					#fff!important;
}
.black{
	color:					#000!important;
}
.blue-btn{
	background-color:		#27376e!important;
}
h1.img-title{
	color:					#ffffff;
}
h2.sub-title{
	margin-top: 			-25px;
	color:					#ffffff;
}
.container-img {
	position: 				relative;
	text-align: 			center;
	padding: 				0px!important;
}
.over-img{
	position:				absolute;
	bottom:					0;
	background-color:		rgba(29,161,160,0.85);
	text-align:				center;
	width:					100%;
  transition: 				.5s ease;
}
.absolute{position:absolute!important;}
.title-bg{
	background-color:		rgb(29,161,160);
	text-align:				center;
	padding:				15px;;
}
.grey{
	background-color:		#ebefec;
}
section{
	margin:					auto;
	display:				block;
	width:					80%;
	padding-top:			20px;
	padding-bottom:			20px;
}
section.intranet{width:95%;}
/*Navigation was here*/
button{
	font-family: 			'Cabin', sans-serif;
	font-size:				16px;
	font-weight:			600;
	padding:				15px;
	/*margin:					5px;*/
	border:					none;
	cursor:					pointer;
}
.btn{
	background-color:		#cb333b;
	margin-bottom:			25px;
	border:					none;
	color:					#fff;
	margin:					5px;
}
.btn:hover{
	background-color:		#93272c;
	transition:				all .5s ease;
}
button:focus{outline:none;}

.btn-footer{
	background-color:		#ffffff;
	margin:					auto;
	color:					#4f9fa6;
	font-size:				14px;
	margin:					5px;
}
.btn-footer:hover{
	background-color:		#3d8186;
	color:					#fff;
	transition:				all .5s ease;
}
.btn-white{
	background-color:		#ffffff;
	color:					#93272c;
	margin:					5px;
}
.btn-green{
	color:					#ffffff;
	background-color:		#4f9fa6;
	margin:					5px;
}
.btn-strong-red{
	background-color:		#93272c;
	color:					#ffffff;
	margin:					5px;
}
.btn-light-red{
	background-color:		#cb333b;
	color:					#ffffff;
	margin:					5px;
}
.pointer{cursor:pointer;}/* used once just on the homepage */
.general-img{
	width:					100%;
	text-align:				center;
}
.icons{
	width:					50%;
	max-width:				200px;
	margin:					auto;
}
/* Text Overlay on homepage banner images*/
.container-overlay{
	position: 				relative;
	background-color:		#4f9fa6;
	display: flex;
    align-items: center;
    justify-content: center;	
    box-shadow: 5px 5px 15px rgba(0,0,0,0.4);
}
.image {
	opacity: 				1;
	/*display: 				block;*/
  width: 					100%;
  height: 					auto;
  transition: 				.5s ease;
  backface-visibility: 		hidden;
}
.middle{
  transition: 				.5s ease;
  opacity: 					0;
  position: 				absolute;
  text-align:center;
  display: flex;
  flex-direction: column;
  padding: 10px;
}
.bottom{
  transition: 				.5s ease;
  opacity: 					0;
  position: 				absolute;
  bottom:					0;
  width:					100%;
  text-align: 				center;
  background-color:			rgba(79,159,166,0.7);
}
.container-overlay:hover .image {
  opacity: 					0.2;
}
.container-overlay:hover .middle{
  opacity: 					1;
}
.container-overlay:hover .bottom{
  opacity: 					1;
}
/* End text overlay */
.container-overlay:hover .over-img{display:none;}

.arrow-down {
	margin:					auto;
	margin-bottom:			20px;
    width: 					0;
    height: 				0;
    border-left: 			40px solid transparent;
    border-right: 			40px solid transparent;
    border-top: 			30px solid #fff;
    /*left: 					50%;
    transform: 				translateX(-50%);*/
    z-index: 				100;
}
.arrow-down-grey {
	margin:					auto;
	margin-bottom:			20px;
    width: 					0;
    height: 				0;
    border-left: 			40px solid transparent;
    border-right: 			40px solid transparent;
    border-top: 			30px solid #ebefec;
    /*left: 					50%;
    transform: 				translateX(-50%);*/
    z-index: 				100;
}
.school-box{
	margin:15px;
}
.story-box.extra-margin{
	margin-right:	15px!important;
	margin-left:	15px!important;
}
div.padding-left-grid{
	padding-left:	0px!important;
}
.padded-box{
	padding:				25px;
	border-radius:			20px;
}
#info-box h2{color:#fff!important;}
#info-box p{color:#fff!important;}
#info-decor{position:absolute;right:-1px;margin-top: -70px;width: 150px;}
.story-box{
	padding:				30px;
	color:					#ffffff;
	min-height: 			400px;
    position: 				relative;
	max-width:				380px;
	margin:					auto;
	border-radius:			25px;
}
.blue{background-color:#4f9fa6;}
.red{background-color:#cb333b;}
.dark-red{background-color:#93272c;}
.transparent{background-color: none;  display: flex!important;flex-wrap: wrap;align-content: center;}
.story-box::before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 35px 40px 0;
    border-color: transparent #ffffff transparent transparent;
    position: absolute;
    right: 40px;
    top: 0;
}
.radius{border-radius:25px;}
.sidebar{
	width:					auto;
	margin:					auto;
	padding:				20px;
	min-width:				280px;
	background-color:		#f5f5f5;
	border-radius:			25px;
	box-shadow: 0 5px 10px rgba(154,160,185,.05), 0 15px 40px rgba(166,173,201,.2);
}
.sidebar p{color:#444444;font-weight:400;}
/*flex intranet*/ 
.intranet-container{display:flex;flex-wrap:wrap;justify-content: flex-start;}
.grey-box{
	width:100%;
	max-width: 280px;
	min-width:					180px;
	padding:				10px;
	background-color:		#f5f5f5;
	text-align:				center;
	min-height:				190px;
	margin: 			20px;
	display: flex;
	flex-direction: column;
	align-items: center;
	border-radius:25px;
	box-shadow: 3px 3px 10px #ccc;
}
.grey-box p{text-align:center!important;font-size:16px;}
.grey-box2{
	width:100%;
	max-width: 280px;
	min-width:					180px;
	background-color:		#f5f5f5;
	min-height:				190px;
	display: flex;
	flex-direction: column;
	border-radius:25px;
	box-shadow: 3px 3px 10px #ccc;
	margin-top: 113px;
	margin-left: 20px;
}
.grey-box2 p{text-align:center!important;font-size:16px;}
a:link{text-decoration:none;}
.section-about{
	margin:					auto;
	width:					95%;
	text-align:				center;
}
/*Fun Facts*/
.fun-fact{font-family: 'Kaushan Script', cursive;color:	#4f9fa6;}
.number{font-family: 'Roboto Slab', serif;font-size:50px;color:#4f9fa6;font-weight:700;}
.number-blue{font-family: 'Roboto Slab', serif;font-size:30px;color:#27376e;font-weight:700;}
.red-section{
	background-color:		#93272c;
	padding: 				10px;
    text-align: 			center;
}
.arrow-down-red {
	margin:					auto;
	margin-bottom:			20px;
    width: 					0;
    height: 				0;
    border-left: 			40px solid transparent;
    border-right: 			40px solid transparent;
    border-top: 			30px solid #93272c;
    /*left: 					50%;
    transform: 				translateX(-50%);*/
    z-index: 				100;
}
.box-white{
	background-color: #fff;
	padding: 20px;
	border-radius: 25px;
	box-shadow: 0 5px 10px rgba(154,160,185,.05), 0 15px 40px rgba(166,173,201,.2);
	margin: 10px;
	min-height: 380px;
	display: flex;
	justify-content: space-between;
	flex-direction: column;
}

table {
    font-family: 'Roboto Condensed', sans-serif;
	font-size:20px;
    border-collapse: collapse;
    width: 100%;
	background-color:#ebefec;
}

td, th {
    border: 1px solid #e2e7e3;
    text-align: left;
    padding: 15px;
}
th{color:#d77737;font-size:25px;font-family: 'Roboto Condensed', sans-serif;text-align:center!important;}
tr:nth-child(even) {
    background-color: #e2e7e3;
}

/* Footer __________________*/
footer{
	background: 			linear-gradient(#4f9fa6,#337176);
	background-color:		#4f9fa6;
	padding:				20px;
	color:					#fff;
	font-family: 			'Roboto Condensed', sans-serif;
	font-size:				18px;
	text-align:				left;
	font-weight:			200;
}
footer a:link{
	color:					#fff;
	text-decoration:		none;
}
footer a:visited{
	color:					#aaa;
	text-decoration:		none;
}
footer a:hover{
	color:					#f2f2f2;
}
footer section{
	width:					90%;
}
footer p{font-size:14px;}
.logo-footer{
	max-width:				500px;
	padding:				10px;
}
/* Form _________________________________________________________*/
form{
	text-align:			center;
    margin: 			auto;
    width: 				90%;
}
.input{
	width: -webkit-fill-available;
	border-radius:10px;
	border:none;
	background-color:	#fff;
	padding:			5px;
	box-sizing: border-box;
}
.radio{
	text-align:			left;
	font-weight:		400;
	font-family: 		'Roboto Condensed', sans-serif;
}
.message{
	width: -webkit-fill-available;
	height:				80px;
	padding-top:		10px;
	border-radius:10px;
	border:none;
	background-color:	#fff;
	padding:			10px;
	font-family: 		'Roboto Condensed', sans-serif;
	font-size:			16px;
	box-sizing: border-box;
}
.send{
	font-family: 		'Fira Sans Condensed', sans-serif;
	color:				#fff;
	padding:			10px 20px;
	background-color:	#4f9fa6;
	font-size:			20px;
	border:				none;
	margin-top:			15px;
	margin-bottom:		15px;
	cursor:				pointer;
}
.send:hover{
	border-bottom:		none;
	background-color:	#398288;
}
/* The container */
.container {
    display: 			block;
    margin-top: 		12px;
    margin-bottom: 		12px;
    cursor: 			pointer!important;
    -webkit-user-select:none;
    -moz-user-select:	none;
    -ms-user-select: 	none;
    user-select: 		none;
	text-align:			left;
	font-family: 		'Roboto Condensed', sans-serif;
}
form.volunteer{
	text-align:left;
	padding:15px;
	background-color:#ebefec;
	border-radius:20px;
}
.form-item{
	font-family: 		'Roboto Condensed', sans-serif;
	margin:			15px 5px 0px 0px;
}
/* Checkmark*/
/* The container */
.container-check {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
	user-select: none;
	font-family: 		'Roboto Condensed', sans-serif;
}

/* Hide the browser's default checkbox */
.container-check input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 20px;
  width: 20px;
	background-color: #ccc;
	border-radius:5px;
}

/* On mouse-over, add a grey background color */
.container-check:hover input ~ .checkmark {
  background-color: #888;
}

/* When the checkbox is checked, add a blue background */
.container-check input:checked ~ .checkmark {
  background-color: #4f9fa6;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.container-check input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.container-check .checkmark:after {
  left: 6px;
  top: 3px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}
/* END FORM ______________________________________________________________________________________*/
/* ACCORDION */
.accordionbody {
	font-family: 		'Cabin', sans-serif;
	font-size: 			16px;
	font-weight: 		400;
	background-color: none;
		color: 				#fff;
		text-decoration:underline;
    cursor: 			pointer;
    padding: 			18px;
    width: 				100%;
    border: 			none;
    text-align: 		left;
    outline: 			none;
    transition: 		0.4s;
    margin:				3px;
}

/*.active, .accordionbody:hover {
    background-color: #cb333b;
	color:#fff;
}*/

.accordionbody:after {
    content: 'more';
    color: #fff;
    font-weight: bold;
    margin-left: 5px;
}

.activebody:after {
    content: "less";
}

.panelbody {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
}
.accordion-documents{
    box-shadow: 3px 3px 10px #ccc;
	border-radius: 10px;
}
#accdoc,.active,.accordion-documents:hover{background-color:#f1f1f1;}
h4.h4-accordion{color:#4f9fa6;margin:0px;text-align: left;display: inline-block;}
/* END Accordion*/

.googleCalendar{
  position: relative;
  height: 0;
  width: 100%;
  max-width:1000px;
  margin:auto;
  padding-bottom: 50%;
}

.googleCalendar iframe{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.over-right{margin-right: -70px;text-align:right;}
.over-left{margin-left: -70px;text-align:left;}
.empty-space{padding-top:150px;}
/* MODAL __________________*/	
		.modal {
		  display: none;
		  position: fixed;
		  z-index: 100000;
		  padding-top: 100px;
		  left: 0;
		  top: 0;
		  width: 100%;
		  height: 100%;
		  overflow: auto;
		  background-color: rgba(0, 0, 0, .6);;
		}
		/* Modal Content */
		.modal-content {
		  position: relative;
		  background-color: transparent;
		  margin: auto;
		  padding: 0;
		  min-width:	300px;
			max-width: 1000px;
			width:auto;
		}
		/* The Close Button */
		.close {
		  color: 			white;
		  position: 		absolute;
		  top: 				10px;
		  right: 			25px;
		  font-size: 		90px;
		  font-weight:		bold;
		  z-index:			1000;
		}
		.close:hover,
		.close:focus {
		  color: #999;
		  text-decoration: none;
		  cursor: pointer;
		}
		.Slides {
		  display: none;
		}
		.cursor {
		  cursor: pointer
		}
		/* Next & previous buttons */
		.prev,
		.next {
		  cursor: 				pointer;
		  position: 			absolute;
		  top: 					50%;
		  width: 				auto;
		  padding: 				16px;
		  margin-top: 			-50px;
		  color: 				white;
		  font-weight: 			bold;
		  font-size: 			20px;
		  transition: 			0.6s ease;		  
		  border-radius: 		0px 15px 15px 0px;
		  user-select: 			none;
		  -webkit-user-select: 	none;
		  background-color: 	rgba(29,161,160,0.5)
		}
		/* Position the "next button" to the right */
		.next {
		  right: 				0;		  
		  border-radius: 		15px 0px 0px 15px!important;
		}
		/* On hover, add a black background color with a little bit see-through */
		.prev:hover,
		.next:hover {
		  background-color: rgba(29,161,160,0.85);
		}

		img.hover-shadow {
		  transition: 0.3s
		}

		.hover-shadow:hover {
		  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
		  filter:		brightness(130%);
		}
		
.modal-events{
	padding:15px;
	background-color:#EBEFEC;
}
/* second modal */
.mySlides{text-align: center;}
.hover:hover{transform:scale(1.05);transition:all ease 0.8s;cursor:pointer;}
.column{flex: 24%; max-width: 24%; padding: 0 4px;}

@media (max-width: 1000px) {.column {flex: 32%; max-width: 32%;}}
@media (max-width: 800px) {.column {flex: 48%; max-width: 48%;}}
@media (max-width: 460px) {.column {flex: 100%; max-width: 100%;}}
/* 	END MODAL __________________*/


/*
	.flip-box {
	  background-color: #fff;
	  width: 100%;
	  min-height:300px;
	  border: none;
	  perspective: 1000px;
	}

	.flip-box-inner {
	  position: relative;
	  width: 100%;
	  height: 100%;
	  text-align: center;
	  transition: transform 0.8s;
	  transform-style: preserve-3d;
	}

	.flip-box:hover .flip-box-inner {
	  transform: rotateY(180deg);
	}

	.flip-box-front, .flip-box-back {
	  position: absolute;
	  width: 100%;
	  height: 100%;
	  backface-visibility: hidden;
	}

	.flip-box-front {
	  background-color: #fff;
	  color: black;
	}

	.flip-box-back {
	  background-color: #4f9fa6;
	  color: #fff;
	  transform: rotateY(180deg);
	}
*/
.flip-box {
  background-color: transparent;
  width: 100%;
  height: auto;
  min-height:370px;
  /*border: 1px solid #f1f1f1;*/
  perspective: 1000px;
  margin-top:10px;
  padding:5px;
}

.flip-box-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.8s;
  transform-style: preserve-3d;
}

.flip-box:hover .flip-box-inner {
  transform: rotateY(180deg);
}

.flip-box-front, .flip-box-back {
  position: absolute;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden
}

.flip-box-front {
  background-color: #bbb;
  color: black;
}

.flip-box-back {
  background-color: dodgerblue;
  color: white;
  transform: rotateY(180deg);
}
/**/

.bounce {
	animation: bounce 1.5s infinite;
	-webkit-animation: bounce 1.5s infinite;
	-moz-animation: bounce 1.5s infinite;
}
@-webkit-keyframes bounce {
	0% {-webkit-transform: translateY(0);}
	50% {-webkit-transform: translateY(-10px);}
  100% {-webkit-transform: translateY(0);}
}
@keyframes bounce {
	0% {transform: translateY(0);}
	50% {transform: translateY(-10px);}
  100% {transform: translateY(0);}
}
@-moz-keyframes bounce {
	0% {-moz-transform: translateY(0);}
	50% {-moz-transform: translateY(-10px);}
  100% {-moz-transform: translateY(0);}
}
.separator{height:120px;background-color:#ccc;width:1.6px;margin:auto;}
.calendar-iframe{
	border-width: 0;
    width: 80%;
	max-width:900px;
    height: 600px;
    position: relative;
}
/* MEDIA QUERIES */
@media screen and (max-width: 1110px) {
	body{padding-top: 120px;}
	#info-decor{position: absolute;right: 50px;margin-top: -70px; width: 100px;}
}
@media screen and (max-width: 1000px) {
	.padded-box{padding:10px;}
	.sidebar-display{display:none;}
	h2{font-size:22px;}
	.calendar-iframe{width:100%;height:500px;}
}

@media screen and (max-width: 915px) {
	.separator{display:none;}
	div.padding-left-grid{padding-left: 20px!important;}
}
@media screen and (max-width: 800px) {
	#info-decor{ right: 30px;    margin-top: -50px;    width: 70px;}
}
@media screen and (max-width: 700px) {
	h1{font-size:30px;}
	.calendar-iframe{height:400px;}
}
	
	
@media screen and (max-width: 650px) {
	.calendar-iframe{height:380px;}
	#info-decor{ right: 30px;}
}
@media screen and (max-width: 550px) {
	.top-logo{height:50px!important;margin:5px!important;}
	table{font-size:16px;}
	th, td {padding:10px;}
	h1{font-size:28px;}
	.calendar-iframe{height:350px;}
}


@media screen and (max-width: 480px) {
	h1{font-size: 25px;margin-bottom: 5px;}
	h2{font-size:20px;}
	h3{font-size:20px;}
	h3.h3-smaller{font-size:18px;}
	h2.sub-title{margin-top:0px;}
	p{font-size:16px;}
	footer{font-size:14px;}	
	.top-logo{height:40px!important;margin:3px!important;}
	section{width:90%;padding-top:10px;padding-bottom:10px;}
	table{font-size:13px;}
	th, td {padding:5px;}
	.over-img{position:relative;padding:15px 0px;overflow:hidden;}
	.calendar-iframe{height:300px;}
	#info-decor{ right: 1px;}
}
@media screen and (max-width: 350px) {
	.top-logo{height:40px;margin:5px!important;}
	table{font-size:12px;}
	th, td {padding:5px;}
	.calendar-iframe{height:250px;}
}

		.vp-title-header{display:none!important;}
		.w3-modal{z-index:3;display:none;padding-top:100px;position:fixed;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:rgb(0,0,0);background-color:rgba(0,0,0,0.4)}
		.w3-modal-content{margin:auto;background-color:#fff;position:relative;padding:0;outline:0;width:600px}
		@media (max-width:600px){.w3-modal-content{margin:0 10px;width:auto!important}.w3-modal{padding-top:30px}}
		@media (max-width:768px){.w3-modal-content{width:500px}.w3-modal{padding-top:50px}}
		@media (min-width:993px){.w3-modal-content{width:900px}}
		.w3-animate-zoom {animation:animatezoom 0.6s}@keyframes animatezoom{from{transform:scale(0)} to{transform:scale(1)}}