*, ::after, ::before {
    box-sizing: border-box;
}
body { overflow-y: scroll; }
body.scroll-auto { overflow-y: auto; }
body.secondary { display:flex; flex-direction: column; min-height: 100vh; } /* aligns footer always to bottom */
a { color: #006fe6; }
a.darker { color: #0063cc; }
.form-control { border-radius: 0; }
#titlespecs { margin:0; }
#embedcode { width: auto; }
#embedcode textarea { width: 100%; }

/*** MAIN NAV ***/
.alert-abovenav {
	background-color: var(--dark);
	border-radius: 0;
	border: 0;
	padding: 0.5rem 1.25rem;
	margin-bottom: 0;
	color: rgba(255,255,255,.6);
	font-size: .825rem;
	z-index: 100000;
}
.navbar { padding:0; z-index:100000; } /* on top of overlay */
.navbar-dark { background-color:#d12a2f; }
.navbar-light { background-color:#d9d9d9; }
.navbar .navbar-toggler { border-color: transparent; }
.navbar-nav .nav-link {
    padding-right: .5rem;
    padding-left: .5rem;
}
.navbar-dark .navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.8)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.navbar-dark .navbar-toggler-icon:focus,
.navbar-dark .navbar-toggler-icon:hover {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.navbar-dark .navbar-toggler .fas,
.navbar-dark .navbar-toggler .far,
.navbar-dark .navbar-toggler .fal,
.navbar-dark .navbar-toggler .fa,
.navbar-dark .navbar-nav .nav-link {
    color: rgba(255,255,255,.8);
}
.navbar-dark .navbar-toggler:focus .fas,
.navbar-dark .navbar-toggler:hover .fas,
.navbar-dark .navbar-toggler:focus .far,
.navbar-dark .navbar-toggler:hover .far,
.navbar-dark .navbar-toggler:focus .fal,
.navbar-dark .navbar-toggler:hover .fal,
.navbar-dark .navbar-toggler:focus .fa,
.navbar-dark .navbar-toggler:hover .fa,
.navbar-dark .navbar-nav .nav-link:focus,
.navbar-dark .navbar-nav .nav-link:hover {
    color: #fff;
}
#province_note {
	position: relative;
    line-height: 1;
    top: -2px;
	left: 5px;
    margin-bottom: -3px;
	color: rgba(255,255,255,.8);
}

/*** SEARCH BAR ***/
*[nowrap] { white-space: nowrap; }
#search { border-bottom: 1px solid rgba(0,0,0,0.12); }
#search-new, #search-more-new, #active-filters { height:auto; width:100%; display:flex; align-items:center; padding:8px 10px; }
#search-more-new .d-flex { display:flex; justify-content:space-between; flex-grow:1; }
#search-more-new .col:last-of-type { padding-right:15px!important; }
#b100-container { margin:0px 20px 0 30px; }
#b1,
#filterSearch { padding:5px 0 6px 12px; min-width: auto; }
#filterSearch:hover { border-color:#c4c4c4; }
#b1-container,
#filterSearch-container { flex-grow:1; max-width:unset; }
#b1-submit,
#filterSearch-submit {
	display: flex;
    align-items: center;
    width: 32px;
    height: 100%;
    padding: 3px;
    font-size: 18px;
    color: #666;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    cursor: pointer;
	-webkit-appearance: none;
    border: 0;
    background-color: transparent;
}
#b2-container, #b3-container, #b4-container,
#filterSubject-container, #filterGrade-container, #filterCourse-container { margin:0; width:auto; }
.selectric .label { line-height:32px!important; height:auto!important; }
.selectric .button { height:32px!important; line-height:32px!important; }
.pagination_results { width: 100%; }
.pagination_results>.container {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
}
#active-filters-outer { border-bottom: none; }
#active-filters { padding: 5px 10px; }
#active-filters a.clear {
    display: block;
    position: absolute;
    left: 140px;
    text-decoration: none;
    font-size: 13px;
    top: calc(50% - 11px);
}
#active-filters ul { margin:0px!important; padding-left:14px; padding-right:15px; }
#active-filters li span img { padding:.3em; cursor:pointer; }

/*** CONTAINERS & CAROUSEL ***/
#container-outer { margin:0; padding:1.5em 0; min-height:0; }
#container-outer.core-list { padding:0; }
#container-inner { padding-top: 0px; min-height:0; }
#banner .carousel-item { max-height: 300px; padding-top: 39.0625%; } /* maintain aspect ratio */
#banner .carousel-item .img-sprite {
	background-position: center top;
	background-repeat: no-repeat;
	background-size: auto 100%;
	height:100%;
	position: absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
}
@media (min-width: 768px) {
	#banner .carousel-item { height: 300px; padding-top: 0; } /* maintain aspect ratio */
}
@media (min-width: 1900px) {
	#banner .carousel-item { max-height: unset; height: calc(300 / 1900 * 100vw); padding-top: 15.7895%; } /* maintain aspect ratio */
}
.carousel-control-next,
.carousel-control-prev { width: 6%; opacity: .8; text-shadow:none; transition: opacity .15s ease-out; }
.carousel-control-next:hover,
.carousel-control-prev:hover { opacity: 1; }
.carousel-control-prev { left: 0; }
.carousel-control-next { right: 0; }
.carousel-indent, .results { margin-right:6%; margin-left:6%; }
.carousel-indent .carousel-control-next { right: -6%; }
.carousel-indent .carousel-control-prev { left: -6%; }
.carousel-indicators { bottom: 0; }

.table thead th { border-top: 0; border-bottom: 2px solid #000; }

.my-list-video-length {
    display: block;
    color: white;
    background: #000;
    font-weight: bold;
    width: 40px;
    text-align: center;
    font-size: 11px;
    position: absolute;
    bottom: 8px;
    right: 18px;
    z-index: 100;
}

#footer-outer { margin: auto 0 0; }
#footer-inner { width: auto; }

.cursor-pointer { cursor:pointer; }
.btn.btn-google-classroom { display:flex; align-items:center; font-size:.9rem; }
.google-classroom {
	background-color:#000;
	background-image:url('/images/logo_square_48.svg');
	background-position:50% 50%;
	background-repeat:no-repeat;
	background-size:contain;
	width:1.5rem;
	height:1.5rem;
	display:inline-block;
}

.fadeMe { display:flex; justify-content:center; align-items:center; }
/* Animation CSS for browsers that don't support animated SVGs */
@supports (-ms-ime-align: auto) {
    /* EDGE CSS styles go here */
	.loading-icon {
		-webkit-animation: loading 1s reverse infinite steps(12, end);
		-moz-animation: loading 1s reverse infinite steps(12, end);
	}

	@-webkit-keyframes loading {
		from {
			-webkit-transform: rotate(0deg);
			-moz-transform: rotate(0deg);
		}
		to {
			-webkit-transform: rotate(359deg);
			-moz-transform: rotate(359deg);
		}
	}
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    /* IE10+ CSS styles go here */
	.loading-icon {
		-webkit-animation: loading 1s reverse infinite steps(12, end);
		-moz-animation: loading 1s reverse infinite steps(12, end);
	}

	@-webkit-keyframes loading {
		from {
			-webkit-transform: rotate(0deg);
			-moz-transform: rotate(0deg);
		}
		to {
			-webkit-transform: rotate(359deg);
			-moz-transform: rotate(359deg);
		}
	}
}