/* 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.
*/
/* 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;
}
/* ====================== Mobile and Up ========================== */

:root {
	--aviation: #36504b;
	--auto: #2a2723;
	--aed: #845b55;
	--ca: #4ba23f;
	--cs: #004c48;
	--ct: #d45d00;
	--dgm: #9e3922;
	--eng: #595478;
	--et: #664800;
	--ist: #823b34;
	--tm: #757677;
}

.contained {
	max-width: 1200px;
	margin-right: auto;
	margin-left: auto;
}
.auto .card-picture-title:after {
	content: '\f1b9';
}
.aed .card-picture-title:after {
	content: '\f5ae';
}
.aviation .card-picture-title:after {
	content: '\f072';
}
.cs .card-picture-title:after {
	content: '\f108';
}
.ct .card-picture-title:after {
	content: '\f807';
}
.culinary .card-picture-title:after {
	content: '\f86b';
}
.dgm .card-picture-title:after {
	content: '\f87c';
}
.ece .card-picture-title:after {
	content: '\f8b1';
}
.ist .card-picture-title:after {
	content: '\f233';
}
.mce .card-picture-title:after {
	content: '\f013';
}
.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;
	}
}

.handshake-button {
	border-left: 10px solid #ffce00;
}

.handshake-button:hover {
	background: #ffce00;
	color: #000;
}

.academic-credit-button {
	border: 2px solid #275d38;
	color: #275d38;
	padding: 15px 0;
	box-shadow: 0px 2px 3px #777;
	transition: all .2s ease-in-out;
	text-transform: uppercase;
}

.academic-credit-button:hover {
	background: #275d38;
	color: #fff;
	transform: translateY(-2px);
	box-shadow: 0px 6px 5px #777;
	text-decoration: none;
}

/* NEW DEPARTMENT CARDS */

.cardAuto {
	background-image: url(https://www.uvu.edu/cet/images/auto_tech_card_home.jpg);
	filter: brightness(70%);
}

.cardCA {
	background-image: url(https://www.uvu.edu/cet/images/culinary_card_home.jpg);
}

.cardCS {
	background-image: url(https://www.uvu.edu/cet/images/info_tech_card_home.jpg);
}

.cardCT {
	background-image: url(https://www.uvu.edu/cet/images/const_tech_card_home.jpg);
}

.cardDGM {
	background-image: url(https://www.uvu.edu/cet/images/homepage/digital-media2.jpg);
}

.cardEGDT {
	background-image: url(https://www.uvu.edu/cet/images/eng_design_card_home.jpg);
}

.cardET {
	background-image: url(https://www.uvu.edu/cet/images/eng_tech_card_home.jpg);
}

.cardIST {
	background-image: url(https://www.uvu.edu/cet/images/homepage/it.jpg);
}

.cardTM {
	background-image: url(https://www.uvu.edu/cet/images/tech_manage_card_home.jpg);
}

.cardEng {
	background-image: url(https://www.uvu.edu/engineering/images/eng_banner.jpg)
}

/* AED */
.accent-aed .card-picture.card-picture-4 .card-picture-title {
	background-color: var(--aed);
}
.accent-aed .card-picture.card-picture-4 .card-picture-button {
	background-color: var(--aed);
	color: #ffffff;
	border: 2px solid var(--aed);
}
.accent-aed .card-picture.card-picture-4 .card-picture-button:after {
	color: var(--aed);
}
.accent-aed .card-picture.card-picture-4 .card-picture-button:hover:after {
	background-color: var(--aed);
	color: #fff;
}
.accent-aed .card-picture.card-picture-4 .card-picture-button:hover {
	background-color: #fff;
	color: var(--aed);
	border-color: var(--aed);
}

/* Aviation */
.accent-aviation .card-picture.card-picture-4 .card-picture-title {
	background-color: var(--aviation);
}
.accent-aviation .card-picture.card-picture-4 .card-picture-button {
	background-color: var(--aviation);
	color: #ffffff;
	border: 2px solid var(--aviation);
}
.accent-aviation .card-picture.card-picture-4 .card-picture-button:after {
	color: var(--aviation);
}
.accent-aviation .card-picture.card-picture-4 .card-picture-button:hover:after {
	background-color: var(--aviation);
	color: #fff;
}
.accent-aviation .card-picture.card-picture-4 .card-picture-button:hover {
	background-color: #fff;
	color: var(--aviation);
	border-color: var(--aviation);
}
.card-padding .card-picture-title {
	padding-bottom: 2.6rem;
}
.image-height .card-picture-img {
	min-height: 280px;
}

/* CS */
.border-cs1 {
	border: 3px solid #275d38;
}

.bg-cs1 {
	background-color: #275d38;
}

.accent-cs .card-picture.card-picture-4 .card-picture-title {
	background-color: var(--cs);
}
.accent-cs .card-picture.card-picture-4 .card-picture-button {
	background-color: var(--cs);
	color: #ffffff;
	border: 2px solid var(--cs);
}
.accent-cs .card-picture.card-picture-4 .card-picture-button:after {
	color: var(--cs);
}
.accent-cs .card-picture.card-picture-4 .card-picture-button:hover:after {
	background-color: var(--cs);
	color: #fff;
}
.accent-cs .card-picture.card-picture-4 .card-picture-button:hover {
	background-color: #fff;
	color: var(--cs);
	border-color: var(--cs);
}

/* CT */
.accent-ct .card-picture.card-picture-4 .card-picture-title {
	background-color: var(--ct);
}
.accent-ct .card-picture.card-picture-4 .card-picture-button {
	background-color: var(--ct);
	color: #ffffff;
	border: 2px solid var(--ct);
}
.accent-ct .card-picture.card-picture-4 .card-picture-button:after {
	color: var(--ct);
}
.accent-ct .card-picture.card-picture-4 .card-picture-button:hover:after {
	background-color: var(--ct);
	color: #fff;
}
.accent-ct .card-picture.card-picture-4 .card-picture-button:hover {
	background-color: #fff;
	color: var(--ct);
	border-color: var(--ct);
}

/* DGM */
.accent-dgm .card-picture.card-picture-4 .card-picture-title {
	background-color: var(--dgm);
}
.accent-dgm .card-picture.card-picture-4 .card-picture-button {
	background-color: var(--dgm);
	color: #ffffff;
	border: 2px solid var(--dgm);
}
.accent-dgm .card-picture.card-picture-4 .card-picture-button:after {
	color: var(--dgm);
}
.accent-dgm .card-picture.card-picture-4 .card-picture-button:hover:after {
	background-color: var(--dgm);
	color: #fff;
}
.accent-dgm .card-picture.card-picture-4 .card-picture-button:hover {
	background-color: #fff;
	color: var(--dgm);
	border-color: var(--dgm);
}

/* Engineering */

.accent-engineering .card-picture.card-picture-4 .card-picture-title {
	background-color: var(--eng);
}
.accent-engineering .card-picture.card-picture-4 .card-picture-button {
	background-color: var(--eng);
	color: #ffffff;
	border: 2px solid var(--eng);
}
.accent-engineering .card-picture.card-picture-4 .card-picture-button:after {
	color: var(--eng);
}
.accent-engineering .card-picture.card-picture-4 .card-picture-button:hover:after {
	background-color: var(--eng);
	color: #fff;
}
.accent-engineering .card-picture.card-picture-4 .card-picture-button:hover {
	background-color: #fff;
	color: var(--eng);
	border-color: var(--eng);
}

/* ET */
.accent-et .card-picture.card-picture-4 .card-picture-title {
	background-color: var(--et);
}
.accent-et .card-picture.card-picture-4 .card-picture-button {
	background-color: var(--et);
	color: #ffffff;
	border: 2px solid var(--et);
}
.accent-et .card-picture.card-picture-4 .card-picture-button:after {
	color: var(--et);
}
.accent-et .card-picture.card-picture-4 .card-picture-button:hover:after {
	background-color: var(--et);
	color: #fff;
}
.accent-et .card-picture.card-picture-4 .card-picture-button:hover {
	background-color: #fff;
	color: var(--et);
	border-color: var(--et);
}

/* IST */

.accent-ist .card-picture.card-picture-4 .card-picture-title {
	background-color:var(--ist);
}
.accent-ist .card-picture.card-picture-4 .card-picture-button {
	background-color:var(--ist);
	color: #ffffff;
	border: 2px solidvar(--ist);
}
.accent-ist .card-picture.card-picture-4 .card-picture-button:after {
	color:var(--ist);
}
.accent-ist .card-picture.card-picture-4 .card-picture-button:hover:after {
	background-color:var(--ist);
	color: #fff;
}
.accent-ist .card-picture.card-picture-4 .card-picture-button:hover {
	background-color: #fff;
	color:var(--ist);
	border-color:var(--ist);
}

/* TM */
.accent-tm .card-picture.card-picture-4 .card-picture-title {
	background-color: var(--tm);
}
.accent-tm .card-picture.card-picture-4 .card-picture-button {
	background-color: var(--tm);
	color: #ffffff;
	border: 2px solid var(--tm);
}
.accent-tm .card-picture.card-picture-4 .card-picture-button:after {
	color: var(--tm);
}
.accent-tm .card-picture.card-picture-4 .card-picture-button:hover:after {
	background-color: var(--tm);
	color: #fff;
}
.accent-tm .card-picture.card-picture-4 .card-picture-button:hover {
	background-color: #fff;
	color: var(--tm);
	border-color: var(--tm);
}

/* CA */
.accent-culinary .card-picture.card-picture-4 .card-picture-title {
	background-color: var(--ca);
}
.accent-culinary .card-picture.card-picture-4 .card-picture-button {
	background-color: var(--ca);
	color: #ffffff;
	border: 2px solid var(--ca);
}
.accent-culinary .card-picture.card-picture-4 .card-picture-button:after {
	color: var(--ca);
}
.accent-culinary .card-picture.card-picture-4 .card-picture-button:hover:after {
	background-color: var(--ca);
	color: #fff;
}
.accent-culinary .card-picture.card-picture-4 .card-picture-button:hover {
	background-color: #fff;
	color: var(--ca);
	border-color: var(--ca);
}

/* Transportation Technologies (auto) */
.accent-auto .card-picture.card-picture-4 .card-picture-title {
	background-color: var(--auto);
}
.accent-auto .card-picture.card-picture-4 .card-picture-button {
	background-color: var(--auto);
	color: #ffffff;
	border: 2px solid var(--auto);
}
.accent-auto .card-picture.card-picture-4 .card-picture-button:after {
	color: var(--auto);
}
.accent-auto .card-picture.card-picture-4 .card-picture-button:hover:after {
	background-color: var(--auto);
	color: #fff;
}
.accent-auto .card-picture.card-picture-4 .card-picture-button:hover {
	background-color: #fff;
	color: var(--auto);
	border-color: var(--auto);
}


/*End mobile and up styles*/
/* ====================== Tablet and Up (Overrides Mobile Styles) ========================== */
@media only screen and (min-width: 768px) {
	.card-picture-7 .card-picture-title {
		margin: auto 0;
	}
	.card-picture-7 .card-picture-img {
		height: 194px !important;
		width: 100%;
		object-fit: cover;
	}
	.width-50 {
		width: 50%;
	}
	
/* 	.card-advisor-2-img {
		display: block !important;
		position: absolute !important;
		top: -50px !important;
		left: 0 !important;
	}
	.card-advisor-2-content {
		padding: 110px 20px 20px 20px !important;
	} */


}/*end media query*/
/*End tablet and up styles*/
/* ====================== Landscape Tablet and Up (Overrides Mobile Styles) ========================== */
@media only screen and (min-width: 992px) {

/* .card-advisor-2-img img {
		width: 185px !important;
		height: 185px !important;
		left: 15px;
	}
	.card-advisor-2-img-container {
		width: 200px !important;
		height: 200px !important;
	}
	.card-advisor-2-img-container:before {
		width: 185px;
		height: 185px;
	}
	.card-advisor-2-content {
		padding: 175px 20px 20px 20px !important;
	} */

}/*end media query*/
/*End landscape tablet and up styles*/
/* ====================== Desktop Only (Overrides Mobile and Tablet Styles) ========================== */
@media only screen and (min-width: 1200px) {
	
/* 	.card-advisor-2 {
		margin-left: auto;
		margin-right: 20px;
		margin-top: 0 !important;
		margin-bottom: 50px;
		flex-direction: row;
		width: 80%;
	}
	.card-advisor-2-img {
		left: -70px !important;
		top: 0 !important;
		width: 215px;
		height: 215px;
	}
	.card-advisor-2-img img {
		width: 200px !important;
		height: 200px !important;
	}
	.card-advisor-2-img-container {
		width: 215px !important;
		height: 215px !important;
	}
	.card-advisor-2-img-container:before {
		width: 200px;
		height: 200px;
	}
	.card-advisor-2-content {
		padding: 30px 20px 30px 170px !important;
	}
	.card-advisor-2:after {
		bottom: -60px;
		right: -20px;
		width: 350px;
		height: 200px;
		background-size: 350px;
	} */



}/*end media query*/
/*End desktop only styles*/
/*END OF DOCUMENT*/