@charset "utf-8";
/* HOMEPAGE STYLING */
.row {--bs-gutter-x:0;}
.homepage-billboard .hidden {display:none;}
.homepage-billboard .vid-controls {position:absolute; color:#fff; z-index: 9; bottom:5%; right:5%;}
.homepage-billboard {position:relative; height:100vh; max-width:1920px; margin:0px auto; background-color:#0b2341;}
.homepage-billboard .filter {position:absolute; /* top:55%;*/ top:0; bottom:0; left:0; right:0; 
	background: linear-gradient(0deg, rgba(0,0,0,0.75) 10%, rgba(0,0,0,0) 60%, rgba(0,0,0,0) 65%, rgba(0,0,0,0.8) 100%); z-index: 2;}

.homepage-billboard .image {height:100%;}
.homepage-billboard .content {position:absolute; bottom:5%; left:5%; right:5; width:auto; z-index: 3;}	
.homepage-billboard .content h1.title {color:#fff; font-family:sweet-sans-pro; font-weight: 800; font-size:2rem; text-shadow:2px 2px 2px #000; text-transform: uppercase; letter-spacing:2px;}
.homepage-billboard .content .links ul {list-style: none; padding:0px;}
.homepage-billboard .content .links ul li {padding:2% 0px;}
.homepage-billboard .content .links ul a {color:#fff; font-size:1.4rem; font-weight:700;}
.homepage-billboard .carousel-indicators {left:5%;}
.homepage-billboard .carousel-indicators {z-index: 5; margin-bottom:1rem; margin-left:0; margin-right:0; right:auto;}
.homepage-billboard .carousel-indicators [data-bs-target] {height:10px; width:10px; border-radius:10px; border-top:0; border-bottom:0;}

.homepage-billboard .video-container .vid-controls {top:5%; bottom:auto;}
.homepage-billboard .vid-controls button {background:none; border:0px;}
.homepage-billboard .vid-controls svg {width:50px; color:#fff;}
.homepage-billboard .vid-controls i.bi {font-size: 2em;	color: #fff;}


.homepage-billboard .content {position:absolute; bottom:5%; left:5%; right:5; width:auto; z-index: 3;}	
.homepage-billboard .content .title a{color:#fff; font-family:sweet-sans-pro; font-weight: 600; font-size:3rem; text-shadow:2px 2px 2px #000; text-transform: uppercase; letter-spacing:2px;}
.homepage-billboard .content .title a {text-decoration: none; position:relative;}
.homepage-billboard .content .title a:after {content:""; position:absolute; width:0%; background-color:#cc4e0b; height:4px; bottom:0; left:50%; transition:all .25s;}
.homepage-billboard .content .title a:hover:after {left:0; width:100%;}
.homepage-billboard .content .title a:hover {border-bottom:none;}
.homepage-billboard .content .title a:hover.cta-text:after {margin-left:7%;}
.homepage-billboard .content .description {color:#fff;}
.homepage-billboard .content .links ul {list-style: none; padding:0px;}
.homepage-billboard .content .links ul li {padding:2% 0px;}
.homepage-billboard .content .links ul a {color:#fff; font-size:1.4rem; font-weight:700;}


.homepage-billboard a.cta-text:after {display:none;}

.triphoto_carousel.content_row {padding:4% 0; }
.triphoto_carousel .title {font-size:2rem; font-weight:800; font-family:sweet-sans-pro; text-transform: uppercase;}
.triphoto_carousel .left .info {margin:10% auto;}
.triphoto_carousel .left {padding:0 10%;}
.triphoto_carousel .right .text-container {padding:4% 10%;}
.triphoto_carousel .carousel .carousel-inner {}
.triphoto_carousel .carousel .carousel-inner .carousel-item {background-color:#0b2341;}
.triphoto_carousel .carousel .carousel-inner .carousel-item .text-container {background-color:#0b2341; color:#fff;}
.triphoto_carousel .carousel .carousel-inner .carousel-item .text-container .title {font-size:1.5rem;}
.triphoto_carousel .carousel .carousel-inner .carousel-item .text-container a.cta-text {color:#fff;}


.page-content .exploration.content_row {padding:0; }
.exploration .row-title .title {font-size:2rem; font-weight:800; font-family:sweet-sans-pro; text-transform: uppercase; padding:3% 10%; line-height: 1.25;}
.exploration {}
.exploration .carousel-inner .carousel-item {background-color:#0b2341;}
.exploration .carousel-inner .carousel-item .text-container {background-color:#0b2341; padding:5% 10%; color:#fff;}
.exploration .carousel-inner .carousel-item .text-container .title {font-size:1.5rem; font-weight:800; font-family:sweet-sans-pro; text-transform: uppercase; padding:3% 0%;}
.exploration .carousel-inner .carousel-item .text-container .info {margin:2% auto;}
.exploration .carousel-inner .carousel-item .text-container a {color:#fff;}
			

.mixmatch-container .intro {padding:0px 10%;}
.mixmatch {padding:0 10px;}
.mixmatch .column {position: relative;}
.mixmatch .column button {background:none; border:0;}
.mixmatch .column .content {text-align: center; padding:4%;}
.mixmatch .column .col-a, .mixmatch .column .col-b {text-align: center;} 
.mixmatch .column .item.media .content {text-align: left; padding-left:30px;}
.mixmatch .column .item {position: relative;}
.mixmatch .column .item .content {position:absolute; top:10px; bottom:10px; left:10px; right:10px; color:#fff;}
.mixmatch .column .item.static .content.orange {background-color:#cc4e0b; transition:all .25s;}
.mixmatch .column .item.static .content.blue {background-color:#0b2341; transition:all .25s;}
.mixmatch .column .item .content .icon {width:50%;}
.mixmatch .column .item .content .text {position:relative; /* z-index: 2; */}
.mixmatch .column .item .content .text1 {font-size: 3rem; font-weight: 800; font-family: sweet-sans-pro; line-height:1; margin-bottom:10px;}
.mixmatch .column .item .content .text2 {font-size: 1.65rem; font-weight: 400; line-height: 1.2; margin-bottom:10px;}
.mixmatch .column .item .content .text3 {font-size:1rem;}

.mixmatch .column .item .content .filter {position:absolute; top:0; bottom:0; left:0; right:0;
	background: linear-gradient(0deg, rgba(11,35,65,0.8) 10%, rgba(255,255,255,0) 30%); 
}

.mixmatch .column .item a .content .filter {position:absolute; transition:all .25s;top:0; bottom:0; left:0; right:0;
	background: linear-gradient(0deg, rgba(11,35,65,0.8) 10%, rgba(255,255,255,0) 30%); transition:all .25s;
}

.mixmatch .column .item a:hover .content .filter {position:absolute; top:0; bottom:0; left:0; right:0;
	background: linear-gradient(0deg, rgba(204,78,11,0.8) 10%, rgba(255,255,255,0) 30%);
}
.mixmatch .column .item button:hover .content .filter {position:absolute; top:0; bottom:0; left:0; right:0;
	background: linear-gradient(0deg, rgba(204,78,11,0.8) 10%, rgba(255,255,255,0) 30%);
}
.mixmatch .column .item.static a:hover .content.blue {background-color:#fff; color:#0b2341;}
.mixmatch .column .item.static a:hover .content.orange {background-color:#fff; color:#cc4e0b;}
.mixmatch .modal .modal-body {padding:0;}



@media (min-width:576px) {
	.homepage-billboard .content .links ul li {padding:1% 0px;}
}

@media (min-width:768px) {
	.homepage-billboard {height:95vh;}
	.homepage-billboard .hero-video-container {height:auto; max-height:100vh;}
	.homepage-billboard .carousel-indicators {margin-bottom:2rem; }
	.hero-video-container .vid-controls {bottom:5%; top:auto; left:auto; right:5%;}
	#herovideoPlayer {height:100%;}
	.homepage-billboard a.cta-text:after {display:inherit;}
	.triphoto_carousel .left .info {margin:5% auto;}
	.triphoto_carousel .carousel .carousel-nav {padding:2%;}
}

@media (min-width:992px) {
	.homepage-billboard .content {left:10%; bottom:7.5%;}
	.homepage-billboard .content h1.title {position:relative; font-size:3rem;}
	.homepage-billboard .content h1.title:before {display: inline-block;
	position: absolute; top: 10px; bottom: 0; right: 101%; width: 5%; content: ""; background: url(https://auburn.edu/template/2022/_assets/images/design-elements/3-lines.png) no-repeat 0 0; background-size: contain;}
	.homepage-billboard .content .links ul li  {display: inline-block; margin-right:10%;}
	.homepage-billboard .carousel-indicators {margin-bottom:2rem; margin-left:0; margin-right:0; }
	.triphoto_carousel .right .text-container {padding:3% 5%;}
}

@media (min-width:992px) and (orientation:landscape) {
.mixmatch .column .item .content .text1 {font-size: 2rem;}
.mixmatch .column .item .content .text2 {font-size: 1.25rem;}
}

@media (min-width:1200px) {
	
	.triphoto_carousel .right .text-container {padding:4% 6%;}
	.triphoto_carousel .carousel .carousel-inner .carousel-item .column1 {border-right:10px solid #fff;}
	.triphoto_carousel .carousel .carousel-inner .carousel-item .column2 {border-left:5px solid #fff; border-right:5px solid #fff;}
	.triphoto_carousel .carousel .carousel-inner .carousel-item .column3 {border-left:10px solid #fff;}
	.triphoto_carousel .carousel .carousel-inner .carousel-item .text-container {position:absolute; top:0; bottom:0; left:33.5%; width:auto; opacity:0; transition: all .25s;}
	.triphoto_carousel .carousel .carousel-inner .carousel-item .text-container.active {opacity:1;}
	.triphoto_carousel .carousel .carousel-inner .carousel-item .text-container a {display:none;}
	.triphoto_carousel .carousel .carousel-inner .carousel-item .text-container.active a {display:inline;}
	.triphoto_carousel .carousel .carousel-inner .column1 {position:relative;}
	.triphoto_carousel .carousel .carousel-inner .column1 .differentiator {position:absolute; bottom:0; left:0; right:0; background:rgb(11,35,65,1); color:#fff; padding:5%;}
	.triphoto_carousel .carousel .carousel-inner .column1 .differentiator button {color:#fff; font-size:2rem; background:none; border:0px;}
	.triphoto_carousel .carousel .carousel-inner .column1 .differentiator .text {font-size:1.25rem; font-family:sweet-sans-pro;}
	.mixmatch .column .item .content .text1 {font-size: 2.5rem;}
	.mixmatch .column .item .content .text2 {font-size: 1.65rem;}
}

@media (min-width:1300px) {
	.homepage-billboard {height:100vh;}
	.homepage-billboard .content {bottom:5%;}
	.homepage-billboard .content h1.title {font-size:3.5rem; font-weight: 700;}
}

@media (min-width:1400px) {
	.homepage-billboard .content h1.title {font-weight: 600;}
	.homepage-billboard .content h1.title:before {right: 100%;}
	/* .exploration .carousel-inner .carousel-item {height:75vh;} */
	/* .exploration .carousel-inner .carousel-item .text-container {padding:10%;} */
	.exploration .carousel-inner .carousel-item .large-image {position:absolute; top: 0; bottom: 0; left: 0;}
	.mixmatch {padding:0 10%;}
	.mixmatch .column .item .content .text2 {font-size: 1.65rem;}
    .homepage-billboard .carousel-indicators {bottom:10%;}
	.homepage-billboard .carousel-indicators {left:auto; right:10%;}
}