@charset "utf-8";
/* CSS Document */
/*Fonts*/

@import url("//fast.fonts.net/lt/1.css?apiType=css&c=aba1a989-2f0a-4c1c-90ad-6e6036892ff1&fontids=1463660");
@font-face{
font-family:"Trade Gothic LT W04 Bd_1463660";
src:url("../fonts/1463660/b435f232-793c-46e0-a59b-17cc94c45d36.eot?#iefix");
src:url("../fonts/1463660/b435f232-793c-46e0-a59b-17cc94c45d36.eot?#iefix") format("eot"),url("../fonts/1463660/a577e9b9-e095-472c-a1b1-11b207e5e9fc.woff2") format("woff2"),url("../fonts/1463660/9043fcee-4909-4a14-877e-9fdca9788e08.woff") format("woff"),url("../fonts/1463660/6f9ae21c-4b61-4107-b9bb-f463027dbec3.ttf") format("truetype");
}


.trade-gothic{
	font-family:"Trade Gothic LT W04 Bd_1463660";
}
.avenir{
	font-family:"Avenir LT W01_35 Light1475496", Arial, sans-serif;
}

/*Hero*/
.lconv-hero{
	background-image:url('https://www.coloradomesa.edu/_files/images/landing-conversion/hero-background.jpg');
	background-size:cover;
	background-position:top;
	padding:65px 0;
	overflow:hidden;
	width:100%;
	background-color:#860037;
}
.white-logo{float:left; position:relative;}
.white-logo:before{
	content:'';
	position:absolute;
	width: 999999px;
	height: 1px;
	border-bottom:1px solid #fec603;
	left:-1000029px;
	top:40px;
}
.give-look{
    float: right;
    color: #fec603;
    padding: 12px 29px;
    border-left: 1px solid #fec603;
    border-right: 1px solid #fec603;
    text-transform: uppercase;
    font-size: 1.4em;
    line-height: 16px;
    margin-top: 20px;
    position: relative;
}
.give-look:after{
	content:'';
	position:absolute;
	width: 999999px;
	height: 1px;
	border-bottom:1px solid #fec603;
	right:-999999px;
	top:20px;
}
.give-look:before{
	content:'';
	position:absolute;
	width: 650px;
	height: 1px;
	border-bottom:1px solid #fec603;
	left:-650px;
	top:20px;
}
.lgl-wrapper{padding:12px 0; background-color:rgba(0,0,0,.25); overflow:hidden;}

.hero-text-video{
	padding:70px 0;
}
.hero-header{
	color: #fff;
    font-size: 3.8em;
    line-height: 60px;
	margin-top:18px;
}
.hero-desc{
	    color: #dddddd;
    font-size: 1.4em;
    margin-top: 18px;
}
.lconv-hero .cta-button{
	background-color: #fec603;
    padding: 23px 50px;
    line-height: 19px;
    text-transform: uppercase;
    font-size: 1.4em;
    text-decoration: none;
    margin-top: 40px;
    display: inline-block;
	color:#860037;
}
.lconv-hero .cta-button:hover{
	color:#860037;
}
.hvr-ripple-out{
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px transparent;
    position: relative;
	    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}



/* Ripple Out */
@-webkit-keyframes hvr-ripple-out {
  100% {
    top: -12px;
    right: -12px;
    bottom: -12px;
    left: -12px;
    opacity: 0;
  }
}
@keyframes hvr-ripple-out {
  100% {
    top: -12px;
    right: -12px;
    bottom: -12px;
    left: -12px;
    opacity: 0;
  }
}
.hvr-ripple-out {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  position: relative;
}
.hvr-ripple-out:before {
  content: '';
  position: absolute;
  border: #fec603 solid 6px;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
}
.hvr-ripple-out:hover:before, .hvr-ripple-out:focus:before, .hvr-ripple-out:active:before {
  -webkit-animation-name: hvr-ripple-out;
  animation-name: hvr-ripple-out;
}





/*Content*/
.lconv-content{background-color:#f6f6f6; padding:10px 0;}
.benefits{height:320px; overflow:hidden;}
.bf-third{background-color:#fff; float:left; width:calc(20% - 5px); margin-right:5px; height:100%; padding:20px; text-align:center;}
.bf-twothird{height:100%; width:40%; float:left;}
.small-class-image{background-image:url(https://www.coloradomesa.edu/_files/images/landing-conversion/small-classes.jpg); background-size:cover; background-position:center;}
.bf-title{
	text-transform: uppercase;
    color: #860037;
    font-size: 1.15em;
    margin-top: 10px;
}
.bf-desc{
	    color: #656565;
    /* font-size: .9em; */
    margin-top: 10px;
    line-height: 16px;

}
.benefits .icon{margin-top:57px;}
.benefits .icon img{max-height:67px; width:auto;}

.find-yourself{margin-top:5px; height:450px; overflow:hidden;}
.fy-image{float:left; width:calc(60% - 5px); margin-right:5px; background-image:url(https://www.coloradomesa.edu/_files/images/landing-conversion/students.jpg); background-size:cover; background-position:center; height:100%;}
.fy-content{background-color:#fff; width:40%; float:left; height:100%; position:relative; padding:20px;}
.fyc-wrapper{position:absolute; top:50%; -moz-transform:translateY(-50%); -webkit-transform:translateY(-50%); -ms-transform:translateY(-50%); transform:translateY(-50%); left:0; right:0; max-width:340px; padding:20px 45px; border-left:1px solid #860037; margin:0 auto;}
.fyc-wrapper:before{
	content:'';
	width: 0; 
  height: 0; 
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 9px solid #860037;
	position:absolute;
	top:50%;
	-moz-transform:translateY(-50%);
	-webkit-transform:translateY(-50%);
	-ms-transform:translateY(-50%);
	transform:translateY(-50%);
	
	left:0;
}
.fyc-title{
	color:#860037;
	text-transform:uppercase;
	font-size:1.5em;
}
.fyc-desc{color:#656565;}
.fyc-visit a{
	    display: inline-block;
    text-transform: uppercase;
    line-height: 18px;
    padding: 10px 15px;
    border: 1px solid #860037;
    margin-top: 10px;
	text-decoration:none;
	background-color:#fff;
	transition:background-color .3s ease-in-out, color .3s ease-in-out;
}
.fyc-visit a:hover{
	color:#fff;
	background-color:#860037;
	text-decoration:none;
}

.lconv-cta-bar{
    background-color: #860037;
    padding: 50px 0;
    color: #fff;
    overflow: hidden;
    margin-bottom: -20px;
}

.left-text{float:left; width:65%; margin-right:3%; text-transform: uppercase; font-size: 1.54em; line-height: 65px;}
.right-button{float:left; width:32%; text-align:center;}
.right-button a, .right-button button{
		background-color: #fec603;
    padding: 23px 50px;
    line-height: 19px;
    text-transform: uppercase;
    font-size: 1.4em;
    text-decoration: none;
    display: block;
	color:#860037;
}
.right-button a:hover{color:#860037;}

/*Media Queries*/
@media (min-width: 768px) {
  .container {
    width: 750px;
  }
}
@media (min-width: 992px) {
  .container {
    width: 970px;
  }
}
@media (min-width: 1200px) {
  .container {
    width: 1170px;
  }
}


@media (max-width:1199px) {
	.hero-header{font-size:3.3em; line-height:53px; margin-top:0px;}
	.give-look:before{width:450px; left:-450px;}
	.lconv-cta-bar{font-size:.83em;}
	.bf-third{font-size:.9em;}
	.bf-title{line-height:16px;}
}
@media (max-width:991px) {
	.hero-header{text-align:center; font-size:2.8em;}
	.hero-desc{text-align:center; font-size:1.2em; margin-top:10px;}
	.hero-button{text-align:center; margin-top: 20px; margin-bottom:20px;}
	.give-look:before{width:230px; left:-230px;}
	.benefits{height:423px;}
	.bf-third{width: calc(50% - 5px); margin-bottom: 5px; height: 50%;}
	.bf-third:nth-child(2){margin-right:0px; width:50%;}
	.bf-twothird{height: 50%; width: 50%;}
	.benefits .icon img{max-height:55px;}
	.benefits .icon{margin-top:25px;}
	.fy-image{width:calc(50% - 5px);}
	.fy-content{width:50%; font-size:.9em;}
	.find-yourself{height:320px;}
	.lconv-hero .cta-button{margin-top:0px;}
	.left-text{float:none; width:100%; margin-right:0px; text-align:center; margin-bottom:15px; line-height:28px;}
	.right-button{float:none; width:100%;}
}
@media (max-width:767px){
	.lconv-hero{padding:25px 0;}
	.white-logo{    
		float: none;
    	width: 100%;
    	text-align: center;
	}
	.hero-text-video{padding:40px 0;}
	.hero-header{font-size:2.2em; line-height:35px;}
	.hero-desc{font-size:1em;}
	.give-look{display:none;}
	.fy-image{
		float: none;
		width: 100%;
		height: 200px;
	}
	.fyc-wrapper{position:relative; top:0px; transform:none; padding:20px 25px;}
	.find-yourself{height:auto;}
	.fy-content{
		    float: none;
    width: 100%;
    height: auto;
    overflow: hidden;
	}
	.benefits .icon{margin-top:0px;}
	.bf-third{margin-right:0px; width:100%; float:none; height:auto;}
	.benefits{height:auto;}
	.bf-twothird{display:none;}
	.bf-third:nth-child(2){width:100%;}
}

