@charset "UTF-8";
/* CSS Document */

* {
	margin: 0;
	padding: 0;
}

body {
	font-family: "Proxima Nova", "proxima-nova", sans-serif;
	font-size: 62.5%;
}
.clearfloat {
	clear: both;
}
img {
	width: 100%;
}

a:-webkit-any-link{
text-decoration:none !important;
}

#landing {
	padding-top:8%;
	height:100vh;
}

/* ----------------- NEW NAV ------------*/

#nav_logo {
	width:125px;
	height:auto;
	float:left;
	margin-top:20px;
	margin-left:20px;
}

/*--------------------------------------------AnchorTags---------*/

/*--------------------------------------------COPY CONTAINER---------*/

.copy {
	width:40%;
	height:auto;
	margin: auto;
	margin-bottom:3vh;
	margin-top:5vh;
}


/*-------------------------------------------- PROFILE SECTIONS ---------*/

.profile_pic {
	width:17%;
	height:auto;
	margin:0 auto;
	border:solid 6px #404041;
	float:left;
	margin-left:20%;
	margin-right:5%;
}

#spacer {
	height:auto;
	width:14%;
	float:left;
	padding-bottom:15px;
}

#portfolio_container{
	width:70%;
	height:auto;
	margin:0 auto;
	margin-left:15%;
}

#portfolio_container h2, .copy {
	text-align:left;
}

#portfolio_container .copy {
	width:60%;
}

#portfolio_container p {
	text-align:left;
}

#arrow {
	margin:0 auto;
	padding-top:20px;
	width:2%;
	height:auto;
}

/*--------------------------------------------SOCIAL---------*/

.social_btns {
	width:44px;
	height:auto;
	float:left;
}

#btn_1 {
	width:44px;
	padding-top:25px;
	padding-bottom:40px; 
	height:auto;
	-webkit-align-self: center; /* Safari 7.0+ */
    align-self: center;
}

#btn_2 {
	width:88px;
	padding-top:25px;
	padding-bottom:40px; 
	height:auto;
	-webkit-align-self: center; /* Safari 7.0+ */
    align-self: center;
}

#btn_3 {
	width:132px;
	padding-top:25px;
	padding-bottom:40px; 
	height:auto;
	-webkit-align-self: center; /* Safari 7.0+ */
    align-self: center;
}

#btn_4 {
	width:176px;
	padding-top:25px;
	padding-bottom:40px; 
	height:auto;
	-webkit-align-self: center; /* Safari 7.0+ */
    align-self: center;
}

#btn_5 {
	width:220px;
	padding-top:25px;
	padding-bottom:40px; 
	height:auto;
	-webkit-align-self: center; /* Safari 7.0+ */
    align-self: center;
}

#btn_6 {
	width:264px;
	padding-top:25px;
	padding-bottom:40px; 
	height:auto;
	-webkit-align-self: center; /* Safari 7.0+ */
    align-self: center;
}

#social {
	height:44px;
	padding-top:25px;
	padding-bottom:40px; 
}

.social_btns :hover {
	opacity:0.9;
}

/*--------------------------------------------PROFILES----------*/

#prof_container {
	width:100%;
	height:100vh;
	padding-bottom:5%;
}

.effects {
	float:left;
	width:16.66%;
}
.effects .img {
  position: relative;
  width: 100%;
  overflow: hidden;
  
}
.effects .img:nth-child(n) {  
}
.effects .img:first-child {  
}
.effects .img:last-child {
  margin-right: 0;
  
}
.effects .img img {
  display: block;
  margin: 0;
  padding: 0;
  max-width: 100%;
  height: auto;
}
.img img {
	width:100%;
}

.overlay {
  display: block;
  position: absolute;
  z-index: 20;
  background: rgba(0, 0, 0, 0.6);
  overflow: hidden;
  transition: all 0.2s;
}
a.close-overlay {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 3000;
  width: 45px;
  height: 45px;
  color: #fff;
  line-height: 45px;
  text-align: center;
  background-color: #000;
  cursor: pointer;
}
a.close-overlay.hidden {
  display: none;
}


/*---LINK TEXT STYLE---*/
a.expand {
  display: block;
  position:relative;
  top:40%;
  z-index: 3000;
  width: 90%;
  padding:5px 3%;
  height: auto;
  text-align:center;
  text-transform:uppercase;
  text-decoration:none;
  color: #fff;
  font-size:1.2vw;
  border:3px solid white;
}


#effect-1 .overlay {
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 0;
  
}
#effect-1 .overlay a.expand {
  left: 0;
  right: 0;
  bottom: 50%;
  margin: 0 auto -30px auto;
  
}
#effect-1 .img.hover .overlay {
  height: 100%;
  
}


/*--------------------------------------------------- PORTFOLIO WORK ------ */

.portfolio_piece {
	width:75%;
	height:auto;
	margin:0 auto;
	padding-bottom:25px;
}

.hairline {
	width:50%;
	margin:0 auto;
	border-bottom:1px solid #222222;
}

/*---------------------------------------------SPAN CLASSES---------*/
.black {
	color: #222;
}
.white {
	color: #fff;
}

.bold {
	font-weight: 700;
}
/*---------------------------------------------TYPE---------*/

p {
	text-align: center;
	line-height: 1.6em;
	color: #222222;
	font-size: 2em;
	font-weight: 100;
	display:block;
}

h1 {
	text-align:center;
	font-size:8em;
	color:#222222;
	padding-top:45px;
	text-transform:uppercase;
}

h2 {
	font-size: 3em;
	font-weight: 700;
	color: #222222;
	text-align: center;
	margin-top:25px;
	margin-bottom:25px;
	display:block;
}
h3 {
	font-size: 3em;
	color: #222222;
	font-weight: 700;
	text-align: center;
	margin:0 auto;
	margin-top: 50px;
	display:block;
}
h4 {
	color: #222;
	font-size: 1.4em;
}
h5 {
	text-align:center;
	font-weight:700;
	font-size:2em;
}

#web_link {
	width:380px;
	height:auto;
	margin:0 auto;
}

#web_link  a:link, #web_link  a:visited {
	color: #222222;
	font-weight:700;
	font-size:3em;
	display: block;
	text-decoration: none;
	padding: 9px 10px;
	text-align: center;
	border: 3px solid #fff;
}
#web_link  a:hover, #web_link  a:active {
	border: 3px solid #222;
}
/* ---------------------------------------------------- FOOTER ----- */

#sponsors {
	padding-top: 100px;
	background-color: #222222;
	text-align: center;
}
#sponsors img {
	margin: 20px;
	margin-top: 70px;
}
iframe {
	width: 100%;
}
.arrow-mobile {
	display: none;
}

#mobile-nav{
	display: none;
}
/*----------------------------------------------------THESIS ---------------------------------------------*/

.title {
	width:50%;
	height:auto;
	margin: auto;
	margin-bottom:3vh;
	padding-top:10vh;
}

#profile_pic_Thesis {
	width:20%;
	height:auto;
	margin:0 auto;
	margin-top:3%;
	margin-bottom:3%;
	border:6px solid #222222;
}

#next_space {
	height:45px;
	width:100%;
}

#next_link {
	width:300px;
	height:auto;
	margin:0 auto;
}

#next_link  a:link, #next_link  a:visited {
	color: #222222;
	font-weight:700;
	font-size:3em;
	display: block;
	text-decoration: none;
	padding: 9px 10px;
	text-align: center;
	border: 3px solid #fff;
}
#next_link  a:hover, #next_link  a:active {
	border: 3px solid #222;
}

.thesis_text {
	width:50%;
	margin:0 auto;
	padding-top:10%;
	padding-bottom:10%;
	color:#FFF;
	font-size:1.5em;
	font-weight:100;
}

.thesis_piece {
	width:100%;
	height:auto;
	margin:0 auto;
	margin-top:-5px;
}

/*--------------------------------------------------------------------------------------------START ADDING BG COLORS HERE !!!!!!!!!!!! :) :) :)--------------*/

.urso_text {
	height:auto;
	width:100%;
	margin:0 auto;
	margin-top:-5px;
	background-color:#fab142;
}

.urso_text {
	height:auto;
	width:100%;
	margin:0 auto;
	margin-top:-5px;
	background-color:#fab142;
}

.brittney_text {
	height:auto;
	width:100%;
	margin:0 auto;
	margin-top:-5px;
	background-color:#f37c67;
}

.jennica_text {
	height:auto;
	width:100%;
	margin:0 auto;
	margin-top:-5px;
	background-color:#d64d50;
}

.karina_text {
	height:auto;
	width:100%;
	margin:0 auto;
	margin-top:-5px;
	background-color:#92c7b7;
}

.ben_text {
	height:auto;
	width:100%;
	margin:0 auto;
	margin-top:-5px;
	background-color:#cc6e80;
}

.cody_text {
	height:auto;
	width:100%;
	margin:0 auto;
	margin-top:-5px;
	background-color:#525252;
}

.genna_text {
	height:auto;
	width:100%;
	margin:0 auto;
	margin-top:-5px;
	background-color:#ffbba8;
}

.jade_text {
	height:auto;
	width:100%;
	margin:0 auto;
	margin-top:-5px;
	background-color:#93d0ed;
}


.brady_text {
	height:auto;
	width:100%;
	margin:0 auto;
	margin-top:-5px;
	background-color:#ee4037;
}
.brady_text2 {
	height:auto;
	width:100%;
	margin:0 auto;
	margin-top:-5px;
	background-color:#818286;
}
.dalton_text {
	height:auto;
	width:100%;
	margin:0 auto;
	margin-top:-5px;
	background-color:#b92c25;
}
.jessica_text {
	height:auto;
	width:100%;
	margin:0 auto;
	margin-top:-5px;
	background-color:#f7913d;
}
.luc_text {
	height:auto;
	width:100%;
	margin:0 auto;
	margin-top:-5px;
	background-color:#40652f;
}
.tiff_text {
	height:auto;
	width:100%;
	margin:0 auto;
	margin-top:-5px;
	background-color:#6bbe78;
}
.brando_text {
	height:auto;
	width:100%;
	margin:0 auto;
	margin-top:-5px;
	background-color:#ed3e21;
}
.erik_text {
	height:auto;
	width:100%;
	margin:0 auto;
	margin-top:-5px;
	background-color:#5b205a;
}
.blayne_text {
	height:auto;
	width:100%;
	margin:0 auto;
	margin-top:-5px;
	background-color:#ec1d25;
}
.kayla_text {
	height:auto;
	width:100%;
	margin:0 auto;
	margin-top:-5px;
	background-color:#f1853d;
}
.pat_text {
	height:auto;
	width:100%;
	margin:0 auto;
	margin-top:-5px;
	background-color:#80c340;
}

/*-----------------------------------------------------QUERIES--------------*/
@media only screen and (min-width : 1501px) {

}

@media only screen and (max-width : 1500px) {
#social {
	/*width:30%;*/
}

#landing {
	padding-top:0;
	height:auto;
}
	
}

@media only screen and (max-width : 1024px) {
	 #mobile-nav {
		 display:none;
	 }
	 .copy {
		width:80%;
		height:auto;
		margin-bottom:3vh;
		margin-top:3vh;
	 }
	 .effects {
		width:33.3%
	 }
	 .profile_pic {
		width:25%;
	 }
	 #social {
		/*width:40%;*/
	}
	a.expand {
		width:90%;
		font-size:2.5vw;
	}
	.thesis_text {
		width:70%;
		margin:0 auto;
		padding-top:10%;
		padding-bottom:10%;
		color:#FFF;
		font-size:1.5em;
	}
	.title {
		width:80%;
		padding-top:7vh;
	}

 }
 @media only screen and (max-width : 768px) {
	 #main-nav {
		 display:none;
	 }
	 #mobile-nav{
		display: block;
		width: 100%;
	}
	.copy h2, p {
		width:90%;
		height:auto;
		margin-bottom:3vh;
		margin-top:3vh;
		text-align:left;
 	}
	.profile_pic {
		width:70%;
		margin:0 auto;
		float:none;
	}
	h1 {
		font-size:5em;
	}
	#portfolio_container h2, .copy {
		text-align:left;
	}

	#portfolio_container .copy {
		width:80%;
		height:auto;
		margin-bottom:3vh;
		margin-top:3vh;
	}
	#landing {
		padding-top:10%;
		height:auto;
	}
	#portfolio_container{
		width:100%;
		margin-left:0;
	}
	.hairline {
		width:80%;
	}
	.portfolio_piece {
		width:100%
	}
	a.expand {
		width:90%;
		font-size:4vw;
		padding:5px 0.5%;
	}
	#arrow {
		display:none;
	}
	.social_btns {
		width:50%;
	}
	#btn_1 .social_btns {
		width:100%;
	}
	#btn_1 {
		width:88px;
	}
	#btn_2 {
		width:176px;
	}
	#btn_3 {
		width:264px;
	}
	.thesis_text {
		width:80%;
		margin:0 auto;
		padding-top:10%;
		padding-bottom:10%;
		color:#FFF;
		font-size:1em;
	}
	#profile_pic_Thesis {
		width:70%;
	}

 }
 @media only screen and (max-width : 320px) {
	 #main-nav {
		 display:none;
	 }
	.effects {
		width:50%
	}
	.profile_pic {
		width:90%;
	}
	h1 {
		font-size:5em;
	}
	.copy h2, p {
		text-align:left;
		width:95%;
	}
	.hairline {
		width:80%;
	}
	.portfolio_piece {
		width:100%
	}
	#arrow {
		display:none;
	}
	.social_btns {
		width:50%;
	}
	#btn_1 .social_btns {
		width:100%;
	}
	#btn_1 {
		width:88px;
	}
	#web_link {
		width:auto;
		height:auto;
		margin:0 auto;
	}
 }