/*
This file is a near-identical copy of /law/css/law-2020.css, which was re-used on many non-law pages after its creation.
Those pages now reference this file instead.
This was done to reduce the risk of pages being accidentally messed up by futures changes to the law folder,
and to make small style tweaks without modifying the original pages the styles were built for.

Ideally, this stylesheet could be removed altogether and the pages that reference it
could be rebuilt with the new snippets that do the same job (Big Link Button Row, Statistic Row),
but there are around 70 pages that would need that work done.
*/


/* Allow full-width elements in content container
--------------------------------------------------------*/

#content.container {
	width: 100%;
	max-width: 100%;
	padding-top: 0;
	padding-left: 0;
	padding-right: 0;
}
.container .row {
	padding: 0;
}


/* Custom classes
--------------------------------------------------------*/

@media (min-width: 550px) {
	.mobileOnly {
		display: none;
	}
}

.section {
	padding-top: 5rem;
}
.section__item {
	margin-bottom: 5rem;
}
.section__item > *:last-child {
	margin-bottom: 0;
}

@media only screen and (max-width: 767px) {
	.container.-containedWhenDesktop {
		width: 100%;
		padding: 0;
	}
}
@media only screen and (min-width: 767px) {
	.container.-containedWhenMobile {
		width: 100%;
	}
}

.boldHeading {
	font-weight: 900;
	letter-spacing: normal;
}

.topBanner {
	position: relative;
	width: 100%;
}

.topBanner__image {
	width: 100%;
	height: 500px !important; /* This !important is to override an inline style that gets added on load for some reason */
	background-image: url(/law/images/homepage/banner-law-december-3f.jpg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

@media only screen and (max-width: 767px) {
	.topBanner__image {
		height: 300px !important; /* This !important is to override an inline style that gets added on load for some reason */
	}
}

@media only screen and (max-width: 550px) {
	.topBanner__image {
		height: 200px !important; /* This !important is to override an inline style that gets added on load for some reason */
	}
}

.topBanner__text {
	position: absolute;
	bottom: 80px;
	background-color: rgba(0, 0, 0, 0.35);
	padding: 3rem 2vw;
}
@media only screen and (max-width: 767px) {
	.topBanner__text {
		position: static;
		background-color: #003E7E;
		padding: 3rem 0;
	}
}
.topBanner__text.-left {
	left: 12vw;
}
.topBanner__text.-center {
	left: 50%;
	transform: translateX(-50%);
}
@media only screen and (max-width: 767px) {
	.topBanner__text.-center {
		transform: none;
	}
}
.topBanner__text.-right {
	right: 12vw;
}

.topBanner__heading {
	margin-bottom: 10px;
}

.topBanner__toledoLaw {
	font-size: 3.2rem;
	font-weight: 300;
	color: white;
}

.topBanner__actionOutcome {
	font-size: 6.4rem;
	color: white;
	line-height: 1;
}
@media only screen and (max-width: 767px) {
	.topBanner__actionOutcome {
		font-size: 5.2rem;
	}
}

.topBanner__action {
}

.topBanner__outcome {
	font-weight: 300;
}

.topBanner__blurb {
	color: white;
	margin-bottom: 10px;
	max-width: 500px;
}

.whyLinks {
	background-color: transparent;
	padding: 1rem 0 0 0;
	transition: background-color .3s;
}
.whyLinks__link:hover {
	background-color: #FFE04D;
	text-decoration: none;
}

.whyLinks__linkLayout {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}
@media only screen and (max-width: 767px) {
	.whyLinks__linkLayout {
		display: block;
	}
}

.whyLinks__linkWrapper {
	-webkit-box-flex: 1;
	-ms-flex: 1;
	flex: 1;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	margin: 0 5px;
}
.whyLinks__linkWrapper:first-child {
	margin: 0 5px 0 0;
}
.whyLinks__linkWrapper:last-child {
	margin: 0 0 0 5px;
}

@media (max-width: 767px) {
	.whyLinks__linkWrapper {
		margin: 1rem 0;
	}
	.whyLinks__linkWrapper:first-child {
		margin: 1rem 0;
	}
	.whyLinks__linkWrapper:last-child {
		margin: 1rem 0 0 0;
	}
}

.whyLinks__link {
	text-align: center;
	padding: 2rem 1rem;
	font-size: 2.7rem;
	font-weight: 700;
	color: #003E7E !important;
	text-transform: uppercase;
	line-height: 1.2;
	width: 100%;
	background-color: #FFD200;
	transition: background-color .3s;
}

/* Responsiveness tweak for if there's five yellow buttons in a row  */
@media only screen and (max-width: 1200px) {
	.whyLinks.-earlyStack .whyLinks__linkLayout {
		display: block;
	}
}
@media (max-width: 1200px) {
	.whyLinks.-earlyStack .whyLinks__linkWrapper,
	.whyLinks.-earlyStack .whyLinks__linkWrapper:first-child {
		margin: 1rem 0;
	}
}


.quoteStripe {
	background-color: #003E7E;
}
.quoteStripe__icon {
	width: 9%;
	height: auto;
	float: left;
	margin-right: 2vw;
	margin-top: 5px;
}
.quoteStripe__text {
	margin-bottom: 0;
	color: white;
	font-size: 2.7rem;
}
.quoteStripe__quote {
	font-weight: 700;
}
.quoteStripe__credit {
	font-weight: 300;
}

.quoteStripe.-lightBlue {
	background-color: #AFD5E9;
}

.quoteStripe.-lightBlue	.quoteStripe__text {
	color: #003e7e;
}

.grayStripe {
	background-color: #ececec;
}

.statistic {
	text-align: center;
}
.statistic__number {
	color: #003e7e;
	font-family: jubilat, serif;
	font-size: 4rem;
	font-weight: 600;
}
.statistic__words em {
	line-height: 2.5;
}


.statisticsRow__container {
	padding-top: 2.5rem;
}

.statisticsRow__item {
}

.statisticsRow__item a:focus p span {
	text-decoration: underline;
}

@media (max-width: 767px) {
	.statisticsRow .three.columns {
		width: 48%;
		margin-left: 4%;
	}

	.statisticsRow .three.columns:nth-child(odd) {
		margin-left: 0;
		clear: left;
	}
}

@media (max-width: 350px) {
	.statistic__number {
		font-size: 3rem;
	}
}

.bottomBorder {
	border-bottom: 1px #ddd solid;
}

.rssImitation p {
	border-bottom: 1px solid #dddddd;
	margin-bottom: 0;
	padding: 1rem 0;
}
.rssImitation a {
	color: #003e7e !important;
	font-weight: 700;
}

/* Admissions page additions
------------------------------------------------ */

.topBanner.-short .topBanner__image {
	height: 20vw !important;
}

.topBanner.-short .topBanner__image2 {
	height: auto !important;
}

.topBanner.-short .topBanner__text {
	position: static;
	background-color: #FFD200;
	padding: 3rem 0;
}

.topBanner.-short .topBanner__heading {
	margin-bottom: 1rem;
}

.topBanner.-short .topBanner__toledoLaw {
	color:#003E7E;
	font-weight: 900;
}

.topBanner.-short .topBanner__blurb {
	max-width: 100%;
	color: black;
	margin-bottom: 0;
}

.stayConnected {
	background-color: #ECECEC;
	padding: 2rem 2rem 0 2rem;
}

.stayConnectedSibling {
	padding: 2rem 0;
}

.headshotRow {
	text-align: center;
}

@media (max-width: 767px) {
	.headshotRow .two.columns {
		width: 48%;
		margin-left: 4%;
	}
	.headshotRow .two.columns:nth-child(even) {
		margin-left: 0;
		clear: left;
	}
}

.headshotRow__image {
	margin-bottom: 1.5rem;
}

.headshotRow__name {
	margin-bottom: 0;
	font-weight: 600;
	color: #003E7E;
}

.headshotRow__year {
	font-weight: 300;
	color: black;
}
