html, body {
	background: #f2f2f2;
		-webkit-transition: all 2s;
		transition: all 2s;
	--red: #bb0e10;
	--black: #000000;
	--blue: #2c1acd;
	--violet: #EE82EE;
	--amazon: #0c5b18;
	--green: #1ead34;
	--orange: #f79533;
	--tangerine: #f17d35;
	--teal: #c6ecde;
	--aero: #85d6b8;
	--auburn: #922724;
}

body {
	font-family: 'Roboto Slab', -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
	overflow-x: hidden;
	margin: 0; padding: 0;
}

a, a:hover {
	color: #bb0e10;
}

h4 {
	font-weight: 100;
}

h2 {
	padding-left: 50px;
}

h2:before {
	position: absolute;
	content: ' ';
	display: block;
	width: 40px; height: 1px;
	margin: 20px 0 0 -50px;
	background: var(--red);
}

.btn-link,
button h4,
a h4,
button:hover h4,
a:hover h4 {
	color: #bb0e10;
	text-decoration: none;
}

#ADIMN_toolobar {top: auto !important; bottom:0;}

.hr {
	border: 0;
	height: 1px;
	background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.15), rgba(0,0,0,0));
	background-image:    -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.15), rgba(0,0,0,0));
	background-image:     -ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.15), rgba(0,0,0,0));
	background-image:      -o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.15), rgba(0,0,0,0));
	margin: 25px;
}



img { max-width: 100%; height: auto !important; }


.container-fluid {
	max-width: 1840px;
	margin: 0 auto; 
	padding: 0;
}


	.navigation {
		position: fixed;
		top: 0; left: 0;
		margin: 40px; padding: 0;
		transition: background-color 0.2s;
		pointer-events: auto;
		backdrop-filter: blur(20px);
		background-color: rgba(237, 237, 237, 0.9);
		box-shadow: 0 2px 4px solid rgba(200,200,200,0.2);
		z-index: 100;
	}

	body.maintenance-mode .navigation {
		top: 99px;
	}

	.navigation-right {
		left: auto; right: 0;
		z-index: 110;
	}


	.navigation:hover {
		background-color: rgba(255, 255, 255, 0.3);
		box-shadow: 0 2px 4px solid rgba(60,60,60,0.2);
	}

		.navigation .form-control {
			color: rgba(22,22,40,.8);
			background-color: transparent;
			border-color: transparent;
			display: none;
		}

		.navigation .form-control:focus {
		    color: rgba(22,22,40,1);
		    outline: 0;
		    box-shadow: 0 0 0 10px rgba(255,255,255,.25);
		}
		.navigation .form-control::-moz-placeholder {
			color: rgba(22,22,40,.5);
			opacity: 1;
		}

		.navigation .form-control:-ms-input-placeholder {
			color: rgba(22,22,40,.5);
			opacity: 1;
		}

		.navigation .form-control::-ms-input-placeholder {
			color: rgba(22,22,40,.5);
			opacity: 1;
		}

		.navigation .form-control::placeholder {
			color: rgba(22,22,40,.5);
			opacity: 1;
		}

			.navigation .form-inline .btn {
				color: rgba(22,22,40,0.7);
			}
			.navigation .form-inline .btn.open {
				margin-left: -50px;
			}
			.navigation .form-control:focus + .btn,
			.navigation .form-inline .btn:hover {
				color: rgba(22,22,40,1);
			}

		.navigation img {
			width: 300px;
			margin: -10px 10px;
		}

		.navigation ul {
			float: left;
			margin: 0; padding: 0;
		}

			.navigation ul li {
				float: left;
				list-style: none;
				margin: 0; padding: 0;
			}

			.navigation ul li a {
				display: block;
				padding: 10px 15px;
				color: rgba(22,22,40,0.7);
			}

			.navigation ul li a:hover {
				color: rgba(22,22,40,1);
				text-decoration: none;
			}

	.fixed-navigation {
		position: fixed;
		display: none;
		top: 0; /*bottom: 0;*/ right: -200px;
		margin: 0; padding: 35px 290px 100px 20px;
		height: 100%; width: 0; max-width: 0px;
		background: rgba(255,255,255,0.86);

		text-align: right;

		-webkit-transition: all 2s;
		transition: all 2s;

		overflow-y: auto;

		z-index: 100;
	}

	body.menu-open { overflow: hidden; }
	body.menu-open .fixed-navigation {
		-webkit-transition: all 2s;
		transition: all 2s;

		display: block;
		right: 0;
		width: 100%; max-width: 600px;
	}

	@media (min-width: 600px) {
		body.menu-open .navigation-right {
			box-shadow: 0 0 0 10px rgba(0,0,0,.25);
		}
	}




		.tree_navigation {

		}

		body.lockdown-position-top .tree_navigation {
			margin-top: 200px;
		}

			.tree_navigation ul {
				margin: 0; padding: 0;
				text-align: right;
			}

				.tree_navigation ul {
					list-style: none;
					/*display: none;*/
				}

				.tree_navigation ul > li > ul {
					margin-bottom: 15px;
					padding-right: 8px;
					display: none;
				}
				.tree_navigation ul > li > ul > li > ul {
					margin-bottom: 15px;
					padding-right: 18px;
					display: none;
				}


				.tree_navigation a {
					display: block;
					padding: 3px;
				}







img.ibdn-site-tag {
  margin-top: 2em;
  height: 2em;
 filter: grayscale(100%) opacity(60%);
 transition: .5s;
}


img.ibdn-site-tag:hover {
 filter: grayscale(0%) opacity(100%);
}






.header {
	position: relative;
	top: 0; left: 0; right: 0;
	min-height: 172px;
	background-color: #464646;
	background-repeat: no-repeat;
	background-position: center top;
	background-size: cover;
 }

 .homepage-header {
	min-height: 1000px;
	/*background-image: url(https://sacredheartcollege.ibcdn.nz/media/2019_06_13_font-gate.jpg);*/
	bottom: 0;
 }


 .header.interior-header {
 }


 		.header-blocks {
 			margin-top: 0;
 			display: block;
 		}

 			.header-block {
 				display: block;
 			}

 		.homepage-header .header-blocks {

 			/*height: 500px;*/
 		}

 			.homepage-header a.header-block.page-block {
 				display: block;
				height: 450px; height: 50vh;
 				margin-top: -15px; margin-bottom: 0;
 			}

			.header-carousel,
			.header-carousel .carousel-inner,
			.header-carousel .carousel-item,
			.header-carousel .carousel-item a {
				/*display: block;*/
				margin-top: -5px;
				height: 450px; height: 50vh;
			}

 			.homepage-header .header-block figcaption {
 				bottom: 15px;
 			}

			.header-carousel .page-block figcaption {
				 /*bottom: 30px;*/
				 bottom: 15px;
			 }

 			.homepage-header .header-block .page-block h4 {
 				color: #ffffff;
 				font-size: 25px;
 				height: 27px !important; line-height: 22px;
 			}






























.main-container {
	min-height: 300px;

}

	.main-content {
		padding-bottom: 50px;
	}

	.section {
		padding: 15px;
	}



.embed-responsive-wrapper {
	text-align: center;
	margin: 20px 0; background: #111111;
	padding: 0 100px;
}

	.embed-responsive-wrapper iframe {
		margin: 0 auto;
	}


/* page blocks */

.intro-image {
	margin-bottom: 1em;
}

	a.page-block {
		position: relative;
		height: 400px; margin-bottom: 15px;
		color: #ffffff;
		transition: all 1s;
		background: rgba(0,0,0,0.3) no-repeat center;
		background-size: cover;
	}

	a.page-block:hover {
		color: #ffffff;
		text-decoration: none;
		box-shadow: 0 0 104px rgba(22,22,40,1);
	}

		.page-block img {
			max-width: 100%; max-height: 400px;
		}

		html.js .page-block img { display: none; }

		.page-block figure { opacity: 0; transition: opacity 1s;}
		html.js .page-block figure { opacity: 1; }


			.page-block figcaption {
				position: absolute;
				display: block;
				transition: all 1s;
				left: 15px; right: 15px; bottom: -15px; padding: 10px 18px;
				background: rgba(22,22,40,1);
				box-shadow: 0 0 14px rgba(22,22,40,1);
			}

				.page-block h4 {
					color: #ffffff;
					font-size: 19px;
					height: 27px; line-height: 22px;
					text-overflow: ellipsis;
					overflow: hidden;
				}

					.page-block time {
						display: block;
						font-size: 14px;
						opacity: 0.7;
					}

				.page-block figcaption p {
					height: 0;
					opacity: 0.5;
					transition: height 0.31s;
					overflow: hidden;
				}


				a.page-block:hover figcaption p {
					height: 30px;
				}


				.header-carousel a.page-block:hover figcaption p {
					height: 60px;
				}


				.page-block span {
					color: #ffffff;
				}
				.page-block:hover span {
					color: #ffffff;
				}

				.page-block span b {
					display: inline-block;
					transition: all 0.31s;
				}
				.page-block:hover span b {
					padding-left: 20px;
				}
























				/* Events*/

				.event-blocks-hero {
					height: 200px;
					overflow: hidden;
					box-shadow: 0 .125rem .25rem rgba(0,0,0,.075) ;
				}

				.event-blocks .card {
					color: #212529;
					float: left;
					width: 305px;
					margin: 0 15px 15px 0;
					flex: none;
					box-shadow: 0 .125rem .25rem rgba(0,0,0,.075) ;
				}

				.event-block-small {
					width: 120px;
				}


				.event-blocks .card:hover {
					box-shadow: 0 1.25rem 1.25rem rgba(0,0,0,.075) ;
				}

					.event-blocks .card big {
						float: left;
						width: 80px;
						font-size: 50px;
						line-height: 58px;
						text-align:center;
					}

						.event-blocks .card big sup {
							font-size: 11px;
							display:block;
						}

						.event-blocks .card span:not(.line) {
							float: right;
							width: 170px;
						}


				.line {
					display: block;
					width: 60px; height: 4px;
					background: var(--red);
					-webkit-transition: all 0.5s;
					transition: all 0.5s;
				}
				.line-black  { background: var(--black); }
				.line-blue   { background: var(--blue); }
				.line-red    { background: var(--red); }
				.line-violet { background: var(--violet); }
				.line-amazon { background: var(--amazon); }
				.line-green  { background: var(--green); }
				.line-orange { background: var(--orange); }
				.line-teal   { background: var(--teal); }


				.event-blocks .card:hover .line { width: 100%; }










blockquote {
	margin: 20px 0 20px -30px;
	padding: 15px 145px 5px 70px;
	border-left: 10px solid var(--red);
	font-size: 130%;
	color: rgba(60,60,60,0.6);
	background: rgb(255,255,255);
	background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 70%, rgba(255,255,255,0) 100%);
}


.breadcrumb {
	background: #ffffff;
}
















.kamar-calendar {
	background: #ffffff;
}

	.calendar-day {
		padding: 0 !important;
	}

	.td-cell {
		position: relative;
		display: block;
		padding: 0;
	}

	.calendar-today {
		background: #fbf6bc;
	}

		.calendar-date,
		.calendar-date:hover,
		.calendar-date:active {
			position: absolute;
			top: 0; left: 0;
			display: block;
			width: 20px; height: 20px;
			margin: -3px 3px 3px -1px; padding: 0;
			text-align: center;
			font-size: 11px; line-height: 20px;
			background: #bb0e10;
			color: #ffffff;
			border-radius: 50%;
		}

			.td-events {
				display: block;
				min-height: 140px;
				padding: 15px 0 0 0;
			}


				.calendar-event {
					font-size: 12px;
					cursor: pointer;
					margin: 0 0 2px 0; padding: 2px 8px;
				}

				#calendar-filter {
					margin:  -40px 0 15px 0; padding: 15px;
					background: #f1f1f1;
				}

					#calendar-filter .checkbox-inline {
						font-size: 12px;
						margin-right: 15px; padding: 2px 10px;
						border-radius: 0;
					}

					#calendar-filter .checkbox-inline:hover {
						border-radius: 5px;
					}

					#calendar-filter h4 {
						font-size: 11px;
					}



				.checkbox-inline.cal-label-black { color: var(--black); border-bottom: 2px solid var(--black); }
				.calendar-event.cal-info.cal-black { color: var(--black); border-bottom: 2px solid var(--black); }
				.cal-tag-black, .checkbox-inline.cal-label-black:hover, .calendar-event.cal-info.cal-black.active, .calendar-event.cal-info.cal-black:hover { color: #ffffff; background: var(--black); }



				.checkbox-inline.cal-label-blue { color: var(--blue); border-bottom: 2px solid var(--blue); }
				.calendar-event.cal-info.cal-blue { color: var(--blue); border-bottom: 2px solid var(--blue); }
				.cal-tag-blue, .checkbox-inline.cal-label-blue:hover, .calendar-event.cal-info.cal-blue.active, .calendar-event.cal-info.cal-blue:hover { color: #ffffff; background: var(--blue); }



				.checkbox-inline.cal-label-red { color: var(--red); border-bottom: 2px solid var(--red); }
				.calendar-event.cal-info.cal-red { color: var(--red); border-bottom: 2px solid var(--red); }
				.cal-tag-red, .checkbox-inline.cal-label-red:hover, .calendar-event.cal-info.cal-red.active, .calendar-event.cal-info.cal-red:hover { color: #ffffff; background: var(--red); }



				.checkbox-inline.cal-label-green { color: var(--green); border-bottom: 2px solid var(--green); }
				.calendar-event.cal-info.cal-green { color: var(--green); border-bottom: 2px solid var(--green); }
				.cal-tag-green, .checkbox-inline.cal-label-green:hover, .calendar-event.cal-info.cal-green.active, .calendar-event.cal-info.cal-green:hover { color: #ffffff; background: var(--green); }



				.checkbox-inline.cal-label-orange { color: var(--orange); border-bottom: 2px solid var(--orange); }
				.calendar-event.cal-info.cal-orange { color: var(--orange); border-bottom: 2px solid var(--orange); }
				.cal-tag-orange, .checkbox-inline.cal-label-orange:hover, .calendar-event.cal-info.cal-orange.active, .calendar-event.cal-info.cal-orange:hover { color: #ffffff; background: var(--orange); }



				.checkbox-inline.cal-label-purple { color: var(--purple); border-bottom: 2px solid var(--purple); }
				.calendar-event.cal-info.cal-purple { color: var(--purple); border-bottom: 2px solid var(--purple); }
				.cal-tag-purple, .checkbox-inline.cal-label-purple:hover, .calendar-event.cal-info.cal-purple.active, .calendar-event.cal-info.cal-purple:hover { color: #ffffff; background: var(--purple); }



				.checkbox-inline.cal-label-aero { color: var(--aero); border-bottom: 2px solid var(--aero); }
				.calendar-event.cal-info.cal-aero { color: var(--aero); border-bottom: 2px solid var(--aero); }
				.cal-tag-aero, .checkbox-inline.cal-label-aero:hover, .calendar-event.cal-info.cal-aero.active, .calendar-event.cal-info.cal-aero:hover { color: #ffffff; background: var(--aero); }



				.checkbox-inline.cal-label-amazon { color: var(--amazon); border-bottom: 2px solid var(--amazon); }
				.calendar-event.cal-info.cal-amazon { color: var(--amazon); border-bottom: 2px solid var(--amazon); }
				.cal-tag-amazon, .checkbox-inline.cal-label-amazon:hover, .calendar-event.cal-info.cal-amazon.active, .calendar-event.cal-info.cal-amazon:hover { color: #ffffff; background: var(--amazon); }



				.checkbox-inline.cal-label-auburn { color: var(--auburn); border-bottom: 2px solid var(--auburn); }
				.calendar-event.cal-info.cal-auburn { color: var(--auburn); border-bottom: 2px solid var(--auburn); }
				.cal-tag-auburn, .checkbox-inline.cal-label-auburn:hover, .calendar-event.cal-info.cal-auburn.active, .calendar-event.cal-info.cal-auburn:hover { color: #ffffff; background: var(--auburn); }



				.checkbox-inline.cal-label-tangerine { color: var(--tangerine); border-bottom: 2px solid var(--tangerine); }
				.calendar-event.cal-info.cal-tangerine { color: var(--tangerine); border-bottom: 2px solid var(--tangerine); }
				.cal-tag-tangerine, .checkbox-inline.cal-label-tangerine:hover, .calendar-event.cal-info.cal-tangerine.active, .calendar-event.cal-info.cal-tangerine:hover { color: #ffffff; background: var(--tangerine); }



				.checkbox-inline.cal-label-teal { color: var(--teal); border-bottom: 2px solid var(--teal); }
				.calendar-event.cal-info.cal-teal { color: var(--teal); border-bottom: 2px solid var(--teal); }
				.cal-tag-teal, .checkbox-inline.cal-label-teal:hover, .calendar-event.cal-info.cal-teal.active, .calendar-event.cal-info.cal-teal:hover { color: #ffffff; background: var(--teal); }



				.checkbox-inline.cal-label-violet { color: var(--violet); border-bottom: 2px solid var(--violet); }
				.calendar-event.cal-info.cal-violet { color: var(--violet); border-bottom: 2px solid var(--violet); }
				.cal-tag-violet, .checkbox-inline.cal-label-violet:hover, .calendar-event.cal-info.cal-violet.active, .calendar-event.cal-info.cal-violet:hover { color: #ffffff; background: var(--violet); }










footer.footer {
	background-color: #404040;
	color: #989898;
	padding: 10px 0 10px 0;
}

	.ibdn-site-tag {
		max-width: 160px;
	}

	footer a { color: #dddddd; }
	footer a:hover { color: #ffffff; }

	footer ul {
		padding-left: 0;
	}
	footer li {
		list-style: none;
	}
	footer ul.footer-navigation li {
		float: left;
		width: 48%;
	}

		footer a.nav-link {
			padding: 0.2rem 1rem;
		}

	img.footer-logo {
		margin: 0 auto 20px auto;
		width: 80% !important; max-width: 170px !important;
	}



.global-news-image {
	object-fit: cover;
}



.mobile-only { display: none; }
@media (max-width: 600px) {
	.hidden-mobile { display: none;  }
	.mobile-only { display: block;  }
	.navigation, .navigation-right { left: 0; right: 0; margin: 10px; }
	.navigation-right { top: 50px; }
	.navigation ul { float: none; width: 100%; text-align: center;}
	.navigation ul li { display: inline; float: none; }
	.navigation ul li a { display: inline-block; padding: 8px 15px; }
	.fixed-navigation { text-align: center; padding: 150px 35px; }


	 .homepage-header { min-height: 400px; }
	 .event-blocks-hero { height: 160px; }
	 .event-blocks .card { width:100%; }
	 .event-block-small { width: 100%; padding: 0; text-align: center; }


	 .header-carousel,
	 .header-carousel .carousel-inner,
	 .header-carousel .carousel-item,
	 .header-carousel .carousel-item a,
	 .header a.header-block.page-block {
	 	height: 130px; margin-bottom: -15px;
	 }

	 .header { padding-top: 110px; }
	 .page-block figcaption { left: 7px; right: 7px; bottom: 7px; padding: 7px; }
	 .page-block figcaption time { font-size: 11px; opacity: 0.6; }
	 .page-block figcaption .btn-link { font-size: 12px; opacity: 0.6; padding: 4px 0; }


	 .page-block h4 { font-size: 16px; height: auto; line-height: 18px; }

	 .calendar-header { font-size: 17px;  }
	 .td-cell { width: 200px !important; }

	blockquote {
		margin: 20px 0;
		padding: 15px 0 5px 10px;
		border-left: 10px solid var(--red);
		color: rgba(60,60,60,0.6);
		text-align: justify;
	}
}



.intro-image {
	width:100%;height:100%;object-fit:cover;
}

.staff-email-text {display: none !important}


/* new calendar */
.full-calendar-wrapper .fc-prev-button, .full-calendar-wrapper .fc-next-button {
	background-color: #bb0e10 !important;
	border-color: #bb0e10 !important;
}


.full-calendar-wrapper .selectorContainer .selector-title {
	font-size: 18px;
	padding-top: 1rem;
  	padding-bottom: 0.5rem;
}

.full-calendar-wrapper .selectorContainer .selector-list {
  padding-bottom: 0.5rem;
}

 .full-calendar-wrapper .selectorContainer .selector-list .color-label .input-checkbox {
  width: 16px;
  height: 16px;
}

.full-calendar-wrapper .selectorContainer .selector-list .color-label .label-content {
  text-decoration: none;
  cursor: pointer;
  padding: 4px;
  margin-right: 8px;
}

#school-calendar {
  padding-bottom: 2rem;
}

#school-calendar .fc-header-toolbar .fc-toolbar-title {
  position: relative;
}

#school-calendar .fc-view-harness {
  overflow-x: auto;
}

#school-calendar .fc-view-harness table {
  min-width: 700px;
}

#school-calendar .fc-view-harness table thead {
}

#school-calendar .fc-view-harness table tbody .fc-daygrid-body table tbody tr td.fc-daygrid-day {
  padding: 0.2rem;
  min-width: 150px;
}

#school-calendar .fc-view-harness table tbody .fc-daygrid-body table tbody tr td.fc-daygrid-day .fc-daygrid-event-harness a.fc-daygrid-event {
  margin-top: 0.1rem;
  margin-bottom: 0.1rem;
  cursor: pointer;
}

#school-calendar .fc-view-harness table tbody .fc-daygrid-body table tbody tr td.fc-daygrid-day .fc-daygrid-event-harness a.fc-daygrid-event .fc-event-time {
}

#school-calendar .fc-view-harness table tbody .fc-daygrid-body table tbody tr td.fc-daygrid-day .fc-daygrid-event-harness a.fc-daygrid-event .fc-event-title-container {
  margin: 0.3rem;
}

#school-calendar-list {
  padding-top: 2rem;
  padding-bottom: 2rem;
}

#google_translate_element .goog-te-combo{
	border-radius: 0.25rem;
	border: 1px solid #404040;
	padding: 4px 8px;
}

/* .goog-te-gadget > span{
	display: none;
} */


@media only screen and (max-width: 768px) {
	.full-calendar-wrapper .selectorContainer .selector-list .color-label .label-content {
	}
	
	#school-calendar .fc-header-toolbar .fc-toolbar-title {
	  padding-left: 3.5rem;
	}
	
	#school-calendar .fc-header-toolbar .fc-toolbar-title::before {
	  display: inline-block;
	}
	
	#school-calendar .fc-view-harness table thead {
	}
	
	#school-calendar .fc-view-harness table tbody .fc-daygrid-body table tbody tr td.fc-daygrid-day .fc-daygrid-event-harness a.fc-daygrid-event .fc-event-title-container {
	}
	
	#school-calendar-list {
	  padding-top: 2rem;
	  padding-bottom: 2rem;
	}

	#school-calendar .fc-header-toolbar .fc-toolbar-title {
	  padding-left: 3.5rem;
	}
	
	#school-calendar .fc-header-toolbar .fc-toolbar-title::before {
	  display: inline-block;
	}
	
	#school-calendar .fc-view-harness table thead {
	}
	
	#school-calendar .fc-view-harness table tbody .fc-daygrid-body table tbody tr td.fc-daygrid-day .fc-daygrid-event-harness a.fc-daygrid-event .fc-event-title-container {
	}
	
	#school-calendar-list {
	  padding-top: 2rem;
	  padding-bottom: 2rem;
	}
}



/*******************************************************************************************/
/*******************************************************************************************/
/*******************************************************************************************/
/*BREAKPOINTS*/
/*******************************************************************************************/

/* Small devices (landscape phones, 576px and up) */
@media (min-width:576px) {


   .footer {
   	padding: 1em;
   }
}

/*******************************************************************************************/

/* Medium devices (tablets, 768px and up) The navbar toggle appears at this breakpoint */
@media (min-width:768px) {

}

/*******************************************************************************************/

/* Large devices (desktops, 992px and up) */
@media (min-width:992px) {

}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width:2500px) {

}