/*
* CSS for the 'Career Guidance and Academic Advising' page
*/
.page_career-guidance .grid:has(.interested){
	grid-gap: 3rem;
	margin-bottom: 1rem;
}

.page_career-guidance .grid h2.interested {
	width: 100%;
	padding: 11% 9%;
	background-color: #307f6c;
	color: #FFFFFF;
	transform: scale(1.08) translateX(4%);
	text-align: center;
	line-height: 1.65rem;
	display: grid;
	align-items: center;
	align-content: center;
}

.page_career-guidance .grid h2.interested > a {
	font-size: 1.3rem;
	font-weight: bold;
	text-decoration: none;
}

.page_career-guidance .grid h2.interested:nth-of-type(2) {
	background-color: #B5BD00;
}

.page_career-guidance .grid h2.interested:nth-of-type(3) {
	background-color: #009B77;
}

.page_career-guidance .grid h2.interested:hover{
	background-color: #8A1538;
}
/*
* END
*/

.page_buddy .info_list > div {
    border-bottom: 1px solid #d7d6d6;
    padding-bottom: 3rem;
}

.program_main h2 {
	margin: 0;
	/* border: 0; */
	padding: 0;
	transform: translateY(-50%);
	font-size: 2.125rem;
	color: #58595b;
}

.program_main h2, h2.interested {border: 0;}

.program_main img,
.program_main .side_text,
.program_main .cta,
h2.interested,
.program_main .text_near_slider,
.program_main .slider, .program_main iframe {
	box-sizing: border-box;
	display: inline-block;
	vertical-align: middle;
}

.program_main .side_text {
	width: 45%;
	margin: 5rem 0;
	padding: 0 8% 3% 3%;
	background-color: #f2f2f2;
	font-size: 1em;
}
.program_main .side_text {
    margin: 5rem 0 0 0 !important;
}
.program_main img + .side_text {
	padding: 0 3% 3% 8%;
	/*padding: 0 3% 3% 4%;*/
}

.program_main .wide_text {
	margin: 5rem 0 0 0;
	padding: 4%;
	background-color: #f2f2f2;
}

.program_main .wide_text h2 {
	margin-top: -4%;
}

.program_main > img, .program_main .collapsible > img, .program_main > iframe {
	width: 54%;
	transform: scale(1.08) translateX(4%);
	outline: 10px solid rgba(255,255,255,0.8);
	margin-top: 5rem;
    display: inline-block;
}
.program_main.apply_home > img, .program_main.apply_home .collapsible > img {
	margin-top: 5rem;
    display: inline-block;
}
.program_main .quote {
	max-width: 820px;
	margin: 0 auto;
	font-size: 1.11em;
}

.program_main .quote:after {
	content: "";
	visibility: hidden;
	display: block;
	height: 0;
	clear: both;
}

.program_main .quote p:last-of-type {
	font-size: 0.81em;
}

.program_main .quote img {
	float: left;
	margin: 0 6% 2em 0;
	border-right: 1px solid #555555;
	padding-right: 6%;
}

.program_main .side_text + img, .program_main .side_text + iframe {
	transform: scale(1.08) translateX(-4%);
}

.wide_text img:first-of-type:last-of-type {
	float: right;
	margin: 2% 4%;
}

.program_main .text_near_slider {
	width: 36%;
	margin: 0;
	padding: /*0 6% 3% 0*/0 4% 3% 5%;
	font-size: 1.10526em;
	/*background-color: #f2f2f2;*/
}

.program_main .slider {
	width: 60%;
	margin: 3rem 0;
}

.program_main .arrow_prev,
.program_main .arrow_next {
	filter: brightness(0.5) invert(1) contrast(1.3);
	width: 3.5rem;
	height: 4.5rem;
}
.program_main .arrow_prev:hover,
.program_main .arrow_next:hover {
	filter: none;
}

.program_main .slider figcaption {
	position: absolute;
	bottom: 1.5em;
	left: 0;
	padding: 0.5em 1em;
	background-color: rgba(0,0,0,0.5);
	color: #FFFFFF;
	font-style: normal;
}

.program_hero {
	position: relative;
	margin-top: 1rem;
	margin-bottom: 5rem;
}

.program_hero .info {
	position: absolute;
	top: /*32%*//*60%*/55%;
	left: 0;
	width: /*50%*/53%;
	padding: 0 3% 1% 6%;
	background-color: rgba(0,0,0,0.22);
    font-size: 1.2em;
}

.program_hero .breadcrumbs {
	position: absolute;
	top: 0;
	left: 1em;
	font-size: 0.895em;
}

.program_hero h1,
.program_hero .info,
.program_hero .breadcrumbs,
.program_hero .breadcrumbs a:link,
.program_hero .breadcrumbs a:visited {
	color: #FFFFFF;
}

.program_hero img {
	z-index: -1;
	width: 100%;
}

.program_hero h1 {
	margin-top: -0.6em;
	margin-bottom: 0;
	font-size: 2.5625rem;
	font-weight: normal;
	line-height: 1.2;
}

.program_hero h1 strong {
	font-size: 3.125rem;
	display: block;
}

.program_hero .larger {font-size: 1.6em;}

h2.interested {
	width: 38%;
	padding: 4% 3%;
	background-color: #307f6c;
	color: #FFFFFF;
	transform: scale(1.08) translateX(4%); /*transform: translateX(-7px);*/
	outline: 10px solid rgba(255,255,255,0.8);
}

h2.interested.purple {background-color: #873e85;}

h2.interested > a {color: #fff!important;}
h2.interested > a:hover {color: #f2f2f2!important;}


.cta {
	width: 61%;
	margin: 3rem 0;
	padding: 4% 4% 4% 8%;
	background-color: #f2f2f2;
	font-size: 1.1em;
}
.apply_home .back_gray_1 p {text-align: left;}
.apply_home .back_gray_1 ul{padding-left: 1.5em;}
.apply_home.program_main .cta, h2.interested {
    box-sizing: border-box;
    display: inline-block;
    vertical-align: middle;
}
.apply_home .cta {
    width: 60%;
    margin: 3rem 0;
    padding: 4% 15% 4% 8%;
    background-color: #f2f2f2;
    font-size: 1.1em;
}
.apply_home h2.interested {
    font-size: 1.3rem;
    width: 38%;
    padding: 4% 3%;
    background-color: #307f6c;
    color: #FFFFFF;
    transform: scale(1.08) translateX(4%);
    transform: translateX(-7px);
    outline: 10px solid rgba(255,255,255,0.8);
    min-width: auto;
    
}
.apply_home h2.interested > a {   color: #fff !important; }

.spacer {margin: 4rem 0;}

.schools_grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	grid-gap: 8px;
	margin-bottom: 4rem;
}

.schools_grid.three_cols {
	grid-template-columns: repeat(3, 1fr);
}

.schools_grid img {
	display: block;
	width: 100%;
}

.schools_grid a {
	display: inline-block;
	vertical-align: top;
	width: 16rem;
	margin: 0 8px 8px 0;
}

.schools_grid a:link,
.schools_grid a:visited {
	display: inline-flex;
	position: relative;
	justify-content: center;
	align-items: center;
	overflow: hidden;
	color: #58595b;
}

.schools_grid a:last-of-type {
	color: #FFFFFF;
}

.schools_grid span {
	position: absolute;
	top: 30%;
	left: 0;
	width: 100%;
	padding: 10%;
	box-sizing: border-box;
	text-align: center;
	z-index: 5;
	font-size: 1.625rem;
	font-weight: bold;
	line-height: 1.3;
}
.schools_grid span:nth-of-type(2) {
	top: 15%;
	opacity: 0;
	background-color: transparent;
}

.ie .schools_grid span:nth-of-type(2) {
	top: 8%;
	font-size: 1.5rem;
}

.schools_grid span:after {
	position: absolute;
	top: -140%;
	left: -80%;
	width: 250%;
	height: 380%;
	content: "";
	background-color: rgba(255,255,255,0.4);
	z-index: -1;
	-webkit-transition: all 200ms ease-out;
	-moz-transition: all 200ms ease-out;
	-o-transition: all 200ms ease-out;
	transition: all 200ms ease-out;}

.schools_grid a:last-of-type span:first-of-type:after {
	background-color: rgba(99,4,96,0.7);
}

.page_undergraduate main h3.toggle_h3 {
	padding-top: 0;
}

.page_undergraduate .stop_collapse {
	margin-top: 3.5rem;
}

.page_program .grid.three_cols h3 {min-height: 4rem; margin-top:0;}
.apply_home .pad_1 h3:first-of-type {
    margin-top: 0;
}
.page_program .grid.three_cols p:last-child {margin-top: 1em;}
.page_program.apply_home .full_width .grid.three_cols { margin-top: 3rem;  }
.spacer {margin: 4rem 0;}

.applicant_type_grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 20px;
    padding: 0;
    list-style-type: none;
}

.applicant_type_grid li {

    display: inline-block;
    vertical-align: top;
    width: auto;
    margin: 0;
}

.applicant_type_grid p {
    display: flex;
    position: relative;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    height: 12rem;
    background-color: #EAEAEA;
    text-decoration: none;
}

.applicant_type_grid p:hover {
    background-color: #74a498;
    color: #fff;
}

.applicant_type_grid span {
    padding: 10%;
    box-sizing: border-box;
    text-align: center;
    z-index: 5;
    font-size: 1.375rem;
    line-height: 1.3;
    color: #555555;
    height: 75%;
    vertical-align: top;

}

body main .applicant_type_grid p strong {font-size: 1.6em;}

#facts {background: none; margin-top: 3rem; padding: 2%;}

.program_main #note {margin-top: 3rem;}

/* CSS GRID */



@supports (display: grid) {
	
	.schools_grid a { width: auto; margin: 0; }
	
	/*.schools_grid span,
	.schools_grid span:nth-of-type(2) { top: auto; }*/
	
}



@media only screen and (max-width: 1200px) and (min-width: 781px) {
	
	/*.program_main, footer {padding: 0 4%;}*/
	.program_hero .info { width: 55%; top: 30%; }
	.program_hero .info { font-size: 1.1em; }
	.program_main .side_text { font-size: 1em; }
	.program_hero h1 { font-size: 2.5rem; }
	
}

@media only screen and (min-width: 981px) {
	
	body .schools_grid a:hover { color: #FFFFFF; }
	.schools_grid a:hover span:first-of-type:not(:last-of-type) { display: none; }
	.schools_grid a:hover span:nth-of-type(2) { opacity: 1; }
	.schools_grid a:hover span:nth-of-type(2):after { background-color: rgba(48,127,108,0.8); }
	.schools_grid a:last-of-type:hover span:first-of-type:after { background-color: rgba(99,4,96,0.6); transition: all 200ms ease-out;}
	
}

@media only screen and (max-width: 980px) {
	
	.program_hero .info { width: 60%; top: /*25*/50%; padding-left: 3%; font-size: 0.95em; line-height: 1.3; }
	.program_hero h1 { font-size: 2rem; }
	.program_hero h1 strong { font-size: 2.5rem; }
	.schools_grid, .schools_grid.three_cols { grid-template-columns: repeat(2, 1fr); }
	
	.program_main .arrow_prev,
	.program_main .arrow_next { top: 50%; }
	.grid.three_cols {grid-template-columns: repeat(2, 1fr);}
}


@media only screen and (max-width: 780px) {

	/* CSS for 'Career Guidance and Academic Advising' page */
	.page_career-guidance .grid h2.interested{
		margin-top: 0rem;
	}

	.page_career-guidance .grid:has(.interested) {
		grid-gap: 2rem;
	}
	/* END */


	.program_hero h1 { font-size: 1.8rem; }
	.program_hero h1 strong { font-size: 2.2rem; }
	.program_main > img,.program_main > iframe { display: block; width: 70%; margin: 0 auto; transform: scale(1.1) translate(0, 5%); }
	.program_main .side_text + img, .program_main .side_text + iframe { transform: scale(1.1) translate(0, -5%); margin-bottom: 5rem; }
	.program_main .side_text { display: block; width: 100% !important; /*margin: 0;*/ padding-bottom: 10%; }
	.program_main .side_text + .side_text { margin-top: 5rem; }
	.program_main img + .side_text h2 { padding-top: 2.2em; transform: none; }
	.program_hero .info { font-size: 0.9em; }
	.program_main h2 { font-size: 1.5em; }
	.apply_home h2.interested, h2.interested { display: inline-block; width: auto; min-width: 50%; margin-top: 5rem; }
	.apply_home .cta, .cta { display: block; width: 100%; margin-top: 0; }
	.apply_home .cta, .cta {margin-bottom: 0; }
	.apply_home h2.interested {     margin: 0 10%; width: 80%; }
	.program_main .quote { font-size: 0.95em; }
	.program_main .quote img { width: 30%; margin-bottom: 2em; padding-top: 1em; padding-bottom: 1em; }
	.program_main .text_near_slider { display: block; width: 100%; margin-top: 5rem; padding-right: 0; }
	.program_main .slider { display: block; width: 100%; margin: 0 0 5rem; }
	
	.cta,
	.program_main .text_near_slider,
	.program_main .side_text { font-size: 1em; }

	.cta,
	h2.interested,
	.program_main .side_text,
	.program_main img + .side_text { padding-left: 3%; padding-right: 3%; }

}

@media only screen and (max-width: 779px) and (min-width: 741px) {
    .program_hero .info { top: 50%;}
}


@media only screen and (max-width: 740px) {
	
	.program_hero .info,
	.program_hero h1,
	.program_hero .breadcrumbs,
	.program_hero .breadcrumbs a:link,
	.program_hero .breadcrumbs a:visited { color: #555555; }
	
	.program_hero .info { position: relative; width: 100%; padding: 0; background-color: transparent; }
	.program_hero .breadcrumbs { position: relative; left: 0; margin: 0; }
	.program_hero h1 { margin-top: 0.5em; font-size: 2.5rem; }
    .applicant_type_grid {grid-template-columns: repeat(2, 1fr);}
	
}

@media only screen and (max-width: 640px) {
    .program_hero .info { top: 50%;}
    .schools_grid span { font-size: 1.375rem; }

}

@media only screen and (max-width: 480px) {
	/*CSS for 'Career Guidance and Academic Advising' page */
	.page_career-guidance .grid h2.interested {
		max-width: 92%;
	}
	/*END*/
	
	.program_main .quote { font-size: 0.85em; margin: 2.5rem 0; }
	.program_main .quote img { border-right: 0 none; padding-right: 1%; }
	.wide_text img:first-of-type:last-of-type { margin: 0 0 5% 5%; }
	.program_main > img { width: 80%; outline-width: 2vw; }
	.program_main img + .side_text h2 { padding-top: 1.6em; }
	.apply_home h2.interested, h2.interested { max-width: 88%; font-size: 1.3em; }
	.schools_grid { grid-gap: 0.2em; }
	.schools_grid span { font-size: 1.175rem; }

	
	.program_main .arrow_prev,
	.program_main .arrow_next { top: 20vw; width: 2.5em; height: 3.5em; }
	.applicant_type_grid {grid-template-columns: repeat(1, 1fr);}

}

@media only screen and (max-width: 350px) {
	
	
}
