/* Department CSS Document */
/*For mobile first adaptive design place styles for mobile and up in the mobile and up area.
Place styles for tablet and up inside the media query in the tablet and up area.
Place styles for desktop only inside the media query in the desktop only area.

For questions or media query training contact Web Development Services.
*/
/* ====================== Mobile and Up ========================== */

h1,
h2 {
  font-weight: 600;
}
.text-64 {
	font-size: 64px;
}
.underline-hover:hover {
	text-decoration: underline;
}
h3.deadlines {
	text-align: center;
}
#display-block {
	display: block
}
.mobileonly {
	display: none;
}
.gap-20 {
	gap: 20px;
}

/* ADD OVERLAY TO HERO IMAGES */
.fullbleed::before {
	background: linear-gradient(to bottom, #000000b3, #000000b3);
	content: '';
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0.5;
	z-index: 0;
}

/* HERO VIDEO CSS */
.home-header-style {
	text-align: center;
	letter-spacing: 30px;
	text-transform: uppercase;
	font-size: 70px;
	padding: 0px 30px;
	font-weight: 800;
}
.hero-video .video-background iframe {
	position: absolute;
	width: 100%;
	height: 100%;
	top: -24%;
	left: 0;
}
.jumbo {
	position: relative;
	padding: 63px 20px;
	margin-top: 0;
	color: #fff;
	font-size: 150%;
}

/* REMOVE SPACE AND BORDER ON HERO IMAGES ONLY WHEN FOLLOWED BY A BANNER FLUSH WITH THE HERO */
.fullbleed:has(+ [class*='bg-']) {
	margin-bottom: 0;
	border-bottom: none;
}

/* DEGREE MATCH BANNER */
.custom-text-align {
	align-self: center;
	padding-left: 5%;
}
.custom-flex {
	display: flex;
	justify-content: flex-start;
}

/* TESTIMONIAL CARDS & SLIDER */
.testimonial-card {
	margin: 0 15px;
}
.slick-slide.slick-active:not(.slick-current) {
	opacity: 1;
}
.slick-slide.slick-active:not(.slick-center):not(.slick-current):hover {
	opacity: 1;
}
ul.slick-dots {
	bottom: -40px;
}
.slick-slide div.text-center > img {
	display: inline-block;
}
.testimonial-card .img-radius {
	width: 110px;
	height: 110px;
	border-radius: 50%;
	object-fit: cover;
	border: 5px solid #fff;
	margin-top: -120px;
}
.testimonial-card.card-multicontent .card-content-container-2 {
	padding: 17px;
}
.slick-track > li.slick-slide {
	height: 440px;
}
.testimonial-card .card-content-container-1 {
	height: 53%;
}
.testimonial-card .card-content-container-2 {
	height: 47%;
}
.testimonial-card .card-content-title {
	font-size: 20px;
	margin-top: 10px;
	padding: 0;
}

/* HOME PAGE CARDS - FROM UVU.EDU */
.homepage-card .card-picture {
	padding-bottom: 20px;
}
.homepage-card .card-picture-title {
	background-color: #fff;
	color: #275d38;
}
.homepage-card h2.card-picture-title {
	font-size: 18px;
	font-weight: 800;
	text-transform: uppercase;
	padding-left: 30px;
	padding-right: 30px;
	margin: 0px;
	padding: 20px;
	width: 100%;
	background-color: #fff;
	text-align: center;
	color: #275d38;
	flex-grow: 1;
}
.homepage-card .card-picture-img {
	object-fit: cover;
	max-height: 194px;
	width: 100%;
}
.homepage-card .card-picture-content {
	display: none;
}
.homepage-card .card-picture-button {
	border-top: none;
	text-align: left;
	padding: 10px;
	display: block;
	border: 2px solid #275d38;
	border-radius: 8px;
	font-family: 'Rajdhani', sans-serif;
	font-weight: bold;
	margin: 0px auto;
	padding: 15px 35px 15px 15px;
	width: 80%;
	font-size: 15px;
	position: relative;
	color: #275d38;
}
.homepage-card .card-picture-button:after {
	content: '\f061';
	font-family: 'Font Awesome 5 Pro';
	position: absolute;
	right: 15px;
	font-size: 10px;
	display: flex;
	bottom: 18px;
}

/* CONTENT HUB BANNER */
.shapes-banner {
	margin-right: -15px;
	margin-left: -15px;
}
.shapes-banner .banner-content {
	padding: 40px 15px;
}
.shapes-banner .banner-img img {
	max-height: 300px;
	height: 100%;
	width: 100%;
	object-fit: cover;
}
.contained {
	max-width: 1200px;
	margin-right: auto;
	margin-left: auto;
}

/* DEPARTMENTS PAGE CARDS */
.card-picture-9 .card-picture-content ul {
	list-style: none;
}
.card-picture-9 .card-picture-content ul li {
	font-family: 'Rajdhani', Arial, sans-serif;
	font-weight: 700;
	text-transform: uppercase;
	line-height: 18px;
	letter-spacing: 0.32px;
	position: relative;
	margin: 0;
	padding-inline-start: 15px;
	margin-inline-start: 15px;
	margin-bottom: 20px;
}
.card-picture-9 .card-picture-content ul li:before {
	font-family: "Font Awesome 5 Pro";
	margin-inline-end: 15px;
}
.card-picture-9:nth-child(1) .card-picture-content ul li:before,
.auto .card-picture-title:after {
	content: '\f1b9';
}
.card-picture-9:nth-child(2) .card-picture-content ul li:before,
.aed .card-picture-title:after {
	content: '\f5ae';
}
.card-picture-9:nth-child(3) .card-picture-content ul li:before,
.aviation .card-picture-title:after {
	content: '\f072';
}
.card-picture-9:nth-child(4) .card-picture-content ul li:before,
.cs .card-picture-title:after {
	content: '\f108';
}
.card-picture-9:nth-child(5) .card-picture-content ul li:before,
.ct .card-picture-title:after {
	content: '\f807';
}
.card-picture-9:nth-child(6) .card-picture-content ul li:before,
.culinary .card-picture-title:after {
	content: '\f86b';
}
.card-picture-9:nth-child(7) .card-picture-content ul li:before,
.dgm .card-picture-title:after {
	content: '\f87c';
}
.card-picture-9:nth-child(8) .card-picture-content ul li:before,
.ece .card-picture-title:after {
	content: '\f8b1';
}
.card-picture-9:nth-child(9) .card-picture-content ul li:before,
.ist .card-picture-title:after {
	content: '\f233';
}
.card-picture-9:nth-child(10) .card-picture-content ul li:before,
.mce .card-picture-title:after {
	content: '\f013';
}
.card-picture-9:nth-child(11) .card-picture-content ul li:before,
.tmm .card-picture-title:after {
	content: '\f544';
}
.card-picture-9 + .card-picture-9 {
	margin-block-start: 30px;
}

/* INTERNSHIPS PAGE CARDS - START WITH CARD PICTURE 7 */
@media only screen and (max-width: 767px) {
	.card-picture-7 {
		display: grid;
		grid-template-columns: 100px 1fr;
		max-height: 100px;
	}
	.card-picture-7 .card-picture-img {
		height: 100px;
		width: 100px;
	}
	.card-picture-7 .card-picture-title {
		padding: 0 20px;
		text-align: left;
		white-space: normal;
		align-self: center;
	}
}

/* ABOUT PAGE */
.short-border {
	width: 96px;
	border: 2px solid #275d38;
	margin-inline-start: 0px;
}

/* START WITH OMNI COMPONENT EVENT-LIST-ITEM-1 */
.event-item[data-component-event-style='1'] .event-item-container {
	box-shadow: none;
	border: none;
}
.event-item[data-component-event-style='1'] .event-frame {
	border: none;
}
.event-item[data-component-event-style='1'] .poster {
	border: none;
}
.event-item[data-component-event-style='1'] .event-details {
	border-left: 5px solid #275d38;
	padding-top: 0;
	padding-bottom: 0;
}
.event-item[data-component-event-style='1'] .event-title {
	text-transform: none;
	margin-bottom: 5px;
}

/* STUDENT RESOURCE PAGE CARDS */
.card-btn-hover {
	transition: 0.6s;
}
.card-btn-hover:hover {
	color: #fff;
	text-decoration: none;
}
.card-btn-hover.card-btn-forest:hover {
	background-color: #275d38;
}
.card-btn-hover.card-btn-primary:hover {
	background-color: #00843d;
}

/* HALF GREEN HALF GRAY BANNER WITH SHAPES - MODIFIED FROM UVU ONLINE */
.mental-health-left::before {
	content: '';
	top: -20px;
	left: 0px;
	width: 87px;
	transform: rotateX(180deg);
	height: 87px;
	position: absolute;
	background: url(https://www.uvu.edu/cet/images/ladder.svg) no-repeat;
}
.mental-health-left {
	position: relative;
	padding: 50px 30px 60px;
	background-color: #275d38;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.mental-health-left h1 {
    text-align: center;
}
.mental-health-left::after {
	content: '';
	position: absolute;
	width: 80px;
	height: 80px;
	right: 0;
	z-index: 1;
	bottom: -35px;
	background-color: #86c6b9;
}
.mental-health-right {
    padding-top: 35px;
    background-color: #f9f9f9;
}

.gradInfo > .card-picture-8 > a.card-picture-button {
  display: none;
}

a.no-hover:hover {
	background-color: #275D38;
	color: white;
}

/*REMOVE LINK FROM CARD PICTURE */
.no-btn > .card-picture-8 > a.card-picture-button {
  display: none;
}



/*End mobile and up styles*/
/* ====================== Tablet and Up (Overrides Mobile Styles) ========================== */
@media only screen and (min-width: 768px) {
	.mobileonly {
		display: block;
	}
	.degree-section {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: center;
		flex-direction: row;
	}
	.degree-container {
		padding-left: 20px;
		padding-right: 20px;
		margin-bottom: 20px;
		margin-top: 20px;
		text-align: center;
		min-width: 250px;
	}
	.degree-container span {
		display: block;
		margin-top: -20px;
	}
	.homepage-card .card-picture-img {
		max-height: none;
	}
	.slick-track > li.slick-slide {
		height: 400px;
	}
	.testimonial-card .card-content-container-1 {
		height: 45%;
	}
	.testimonial-card .card-content-container-2 {
		height: 55%;
	}
	.card-picture-7 .card-picture-title {
		margin: auto 0;
	}
	.card-picture-7 .card-picture-img {
		height: 194px;
		width: 100%;
		object-fit: cover;
	}
	.mental-health {
        background: linear-gradient(90deg, #275D38 50%, #f9f9f9 20%);
    }
    .mental-health-left::before {
    	left: 50px;
    }
    .mental-health-left {
        margin-bottom: 0;
		display: flex;
		justify-content: center;
		align-items: end;
		background-color: inherit;
    }
    .mental-health-left h1 {
        text-align: right;
    }
    .mental-health-left::after {
        bottom: -40px;
		right: -10px;
    }
    .mental-health-right {
        background-color: inherit;
        padding-top: 15px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: start;
        padding-left: 30px;
    }
	
/* CET AWARDS PHOTO GRID */
.photo-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(4, 1fr);
  gap: 10px;
  margin: auto;
}
	
.photo-row {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, 1fr);
  gap: 10px;
  margin: auto;
}

}

/*end media query*/
/*End tablet and up styles*/
/* ====================== Landscape Tablet and Up (Overrides Mobile Styles) ========================== */
@media only screen and (min-width: 992px) {
	.degree-section {
		flex-wrap: nowrap;
	}
	.degree-container {
		min-width: 200px;
	}
	h3.deadlines {
		text-align: right;
		padding-right: 60px;
	}
	.border-left {
		border-left: 1px solid #78be20;
	}
	.slick-track > li.slick-slide {
		height: 435px;
	}
	.testimonial-card .card-content-container-1 {
		height: 50%;
	}
	.testimonial-card .card-content-container-2 {
		height: 50%;
	}
	.shapes-banner {
		display: grid;
		grid-template-columns: 1fr 1fr;
		max-height: 375px; /* Will need to Chrome inspect the page and see what the max-height should be */
	}
	.shapes-banner .banner-img {
		height: 100%;
	}
	.shapes-banner .banner-img img {
		max-height: 375px; /* Will need to Chrome inspect the page and see what the max-height should be */
	}
	.mental-health-left::before {
		left: 20px;
    }
	/* CET AWARDS PHOTO GRID */
.photo-grid {
  grid-template-columns: repeat(3, 1fr);
}

.photo-row {
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: 1fr;

}
}

/*end media query*/
/*End landscape tablet and up styles*/
/* ====================== Desktop Only (Overrides Mobile and Tablet Styles) ========================== */
@media only screen and (min-width: 1200px) {
	.bg-degree-match {
		position: relative;
	}
	.bg-degree-match::after {
		content: '';
		bottom: 0;
		right: 0px;
		width: 160px;
		height: 375px;
		position: absolute;
		background: url('https://www.uvu.edu/cet/images/degree_banner_shapes_right.svg') no-repeat;
	}
	.slick-track > li.slick-slide {
		height: 450px;
	}
	.testimonial-card .card-content-container-1 {
		height: 52%;
	}
	.testimonial-card .card-content-container-2 {
		height: 48%;
	}
	.shapes-banner {
		justify-content: end;
		max-height: 350px; /* Will need to Chrome inspect the page and see what the max-height should be */
		position: relative;
	}
	.shapes-banner::before {
		position: absolute;
		content: '';
		background: url('https://www.uvu.edu/cet/images/banner-shapes.svg');
		width: 125px;
		height: 111px;
		left: 0;
		top: -50px;
	}
	.shapes-banner .banner-content {
		max-width: 600px;
		justify-self: end;
	}
	.shapes-banner .banner-img img {
		max-height: 350px; /* Will need to Chrome inspect the page and see what the max-height should be */
	}
	.mental-health-left::before {
		left: 60px;
    }
    .mental-health-left::after {
        right: -20px;
    }
}

/*end media query*/
/*End desktop only styles*/
/* ====================== Wide Desktop Only (Overrides Mobile, Tablet, and Desktop Styles) ========================== */
@media only screen and (min-width: 1500px) {
	.bg-degree-match::before {
		content: '';
		top: 25px;
		left: 0px;
		width: 231px;
		height: 407px;
		position: absolute;
		background: url('https://www.uvu.edu/cet/images/degree_banner_shapes_left.svg') no-repeat;
	}
	.shapes-banner::before {
		top: -30px;
		left: 40px;
	}
}

/*end media query*/
/*End wide desktop only styles*/
/* ====================== Extra-Wide Desktop Only (Overrides Mobile and Tablet Styles) ========================== */
@media only screen and (min-width: 1700px) {
	.shapes-banner::before {
		top: -20px;
		left: 125px;
	}
}

/*end media query*/
/*End extra-wide desktop only styles*/
/*END OF DOCUMENT*/