/* 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 ========================== */

	
/* ----------------------- */
/*       degrees           */
/* ----------------------- */
/* .testing-styles{
	color: pink; 	
} */
.degree-sec{
	padding-bottom: 40px;
	padding-top: 40px;
}
/* aqui */
.degree-direction{
	flex-direction: column;
}
#degrees-section {
	overflow: hidden;
}
a.degree-button {
	color: #275d38;
	text-decoration: none;
	text-align: center;
}
a.degree-button span {
	display: block;
	margin-top: -20px;
}
a.degree-button:hover {
	color: #78be20;
}
a.degree-button::after {
	content: '';
	display: block;
	width: 0;
	height: 2px;
	background: #78be20;
	transition: width .3s;
}
a.degree-button:hover::after {
	width: 100%;
	/*     transition: width .3s; */
}
.degree-container{
	padding-left: 20px;
	padding-right: 20px;
	margin-bottom: 20px;
}

/* ----------------------- */
/*      social bar         */
/* ----------------------- */
.icon-wrapper {
  margin:0;
  padding:0;
  background: #ebebeb;
}
.icon-list-wrapper {
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  margin:0;
  padding:0;
  display:flex;
}
.icon-list-wrapper li {
  list-style:none;
}
.icon-list-wrapper li a {
  display:block;
  position:relative;
  width:100px;
  height:100px;
  line-height:100px;
  font-size:40px;
  text-align:center;
  text-decoration:none;
  color:#404040;
  margin: 0 30px;
  transition:.5s;
}
.icon-list-wrapper li a span {
  position:absolute;
  transition: transform .5s;
}

/* top and bottom lines pre transform */
.icon-list-wrapper li a span:nth-child(1),
.icon-list-wrapper li a span:nth-child(3){
  width:100%;
  height:3px;
  background:#78be20;
}
.icon-list-wrapper li a span:nth-child(1) {
  top:0;
  left:0;
  transform-origin: right;
}
.icon-list-wrapper li a:hover span:nth-child(1) {
/*  this scale -> */
  transform: scaleX(0);
  transform-origin: left;
  transition:transform .5s;
}

.icon-list-wrapper li a span:nth-child(3) {
  bottom:0;
  left:0;
  transform-origin: left;
}
.icon-list-wrapper li a:hover span:nth-child(3) {
  transform: scaleX(0);
  transform-origin: right;
  transition:transform .5s;
}

.icon-list-wrapper li a span:nth-child(2),
.icon-list-wrapper li a span:nth-child(4)
{
  width:3px;
  height:100%;
  background:#78be20;
}
.icon-list-wrapper li a span:nth-child(2) {
  top:0;
  left:0;
  transform:scale(0);
  transform-origin: bottom;
}
.icon-list-wrapper li a:hover span:nth-child(2) {
  transform: scale(1);
  transform-origin: top;
  transition:transform .5s;
}
.icon-list-wrapper li a span:nth-child(4) {
  top:0;
  right:0;
  transform:scale(0);
  transform-origin: top;
}
.icon-list-wrapper li a:hover span:nth-child(4) {
  transform: scale(1);
  transform-origin: bottom;
  transition:transform .5s;
}
.socials-icons{
	color: #78be20;
}
.social-bar-line-left{
	height: 3px;
    background-color: #78be20;
    width: 35vw;
}
.social-bar-line-right{
	height: 3px;
    background-color: #78be20;
    width: 35vw;
    margin-left: 30vw;
}
.social-icons-bar-wrapper{
	display: flex;
    align-items: center;
}
/* ----------------------- */
/*  double line header     */
/* ----------------------- */
.double-line-header-style{
	text-align: center;
    letter-spacing: 15px;
    text-transform: uppercase;
    font-size: 70px;
    padding: 0px 60px;
    font-weight: 800;
}

.heading h1 {
	font-weight: 800;
}

/*End mobile and up styles*/
/* ====================== Mobile Only (Overrides Mobile and Tablet Styles) ========================== */
@media only screen and (min-width: 100px) and (max-width: 500px) {
	
/* ----------------------- */
/*      social bar         */
/* ----------------------- */	
.icon-list-wrapper li a {
    display: block;
    position: relative;
    width: 80px;
    height: 100px;
    line-height: 100px;
    font-size: 40px;
    text-align: center;
    text-decoration: none;
    color: #404040;
    margin: 0 10px;
    transition: .5s;
}
	.social-bar-line-left{
	display: none;
}
.social-bar-line-right{
	display: none;
}

/* ----------------------- */
/*       degrees           */
/* ----------------------- */
/* 	.degree-sec{
		padding-bottom: 40px;
		padding-top: 40px;
	}
	.degree-direction{
		flex-direction: row;
	}
	.degree-match { 
		padding-top: 90px; 
		padding-bottom: 100px;
	}
	.bg-image.academics {
		background-image: url(/_homepage/images/new/degree-arrow-backing.png);
		background-position: center right;
		position: relative;
		background-size: auto;
	}
	.degree-container {
		width: 20%;
		margin-bottom: 0px;
		padding-right: 10px;
		padding-left: 10px;
		
	}  */
	
/* ----------------------- */
/*  double line header     */
/* ----------------------- */	
.double-line-header-style {
    text-align: center;
    letter-spacing: 3px;
    text-transform: uppercase;
    font-size: 40px;
    padding: 0px 0px;
    font-weight: 800;
}	
.bottomlining-header .heading,  {
	display: block;
}

.moblie-render h1 {
    position: absolute;
    bottom: -100px;
    left: 0vw;
    font-size: 30vw;
    text-align: center;
    line-height: 0.85;
}
.jumbo header h1 {
	font-size: 15vw;
}
	
}
/* ====================== Tablet  (Overrides Mobile Styles) ========================== */
@media only screen and (min-width: 600px) and (max-width: 1050px){

.social-bar-line-left{
	display: none;
}
.social-bar-line-right{
	display: none;
}
/* degrees section */
.degree-container {
	padding-right: 20px;
	padding-left: 20px;
	margin-bottom: 20px;
}

}

/*end media query*/
/*End tablet and up styles*/
/* ====================== Landscape Tablet and Up (Overrides Mobile Styles) ========================== */
@media only screen and (min-width: 992px) {
/* degrees section */
	.degree-sec{
		padding-bottom: 40px;
		padding-top: 40px;
	}
	.degree-direction{
		flex-direction: row;
	}
	.degree-match { 
		padding-top: 90px; 
		padding-bottom: 100px;
	}
	.bg-image.academics {
		background-image: url(https://www.uvu.edu/_homepage/images/new/degree-arrow-backing.png);
		background-position: center right;
		position: relative;
		background-size: auto;
	}
	.degree-container {
		width: 20%;
		margin-bottom: 0px;
		padding-right: 10px;
		padding-left: 10px;
		
	}
	/* end degrees section */
.social-bar-line-right{
	height: 3px;
    background-color: #78be20;
    width: 30vw;
    margin-left: 50vw;
}

}

/*end media query*/
/*End landscape tablet and up styles*/
/* ====================== Desktop Only (Overrides Mobile and Tablet Styles) ========================== */
@media only screen and (min-width: 1200px) {
	
	
}

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