body{
	width:100%;
	margin: 0;
	padding: 0;
}

.unsupported{
	display: none;
}

#fullpage{
	margin-top: 0 auto;
}

.section{
}

.slide{
}

#nav-icon3 {
  width: 60px;
  height: 45px;
  position: absolute;
  top: 40px;
  right: 40px;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
  z-index: 200;
}

#nav-icon3 span {
  display: block;
  position: absolute;
  height: 1px;
  width: 100%;
  background: #fff;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}

#nav-icon3 span:nth-child(1) {
  top: 0px;
}

#nav-icon3 span:nth-child(2),#nav-icon3 span:nth-child(3) {
  top: 12px;
}

#nav-icon3 span:nth-child(4) {
  top: 24px;
}

#nav-icon3.open span:nth-child(1) {
  top: 18px;
  width: 0%;
  left: 50%;
}

#nav-icon3.open span:nth-child(2) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}

#nav-icon3.open span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

#nav-icon3.open span:nth-child(4) {
  top: 18px;
  width: 0%;
  left: 50%;
}

.menuoverlay, .overlay{
	background: rgba(0,0,0,.5);
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	vertical-align: middle;
}

#landing{
	background: url(img/photograph.jpg) no-repeat center center fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	text-align: center;
	vertical-align: middle;
}

#portfolio{
	text-align: center;
}

#port8{
	background: url(img/gogolf.jpg) no-repeat center center;
}

#port1{
	background: url(img/escape.jpg) no-repeat center center;
}

#port2{
	background: url(img/fordshopping.jpg) no-repeat center center;
}

#port3{
	background: url(img/lincolncpo.jpg) no-repeat center center;
}

#port4{
	background: url(img/ola.jpg) no-repeat center center;
}

#port5{
	background: url(img/fordcpo.jpg) no-repeat center center;
}

#port6{
	background: url(img/dribbble.jpg) no-repeat center center;
}

#port7{
	background: url(img/) no-repeat center center;
}

#port1, #port2, #port3, #port4, #port5, #port6, #port7, #port8{
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

.learn, .cta{
	display: inline-block;
	font-family:'Quicksand', sans-serif;
	font-weight:300;
	font-size:1.5em;
	text-decoration: none;
	color: #fff;
	margin: 0;
	letter-spacing: -.4;
	padding:16px 20px;
	border: 1px #fff solid;
	transition: all 1s ease;
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	cursor: pointer;
}


.cta{}

.title{
	position: relative;
	display: block;
	font-family:'Quicksand', sans-serif;
	font-weight:300;
	font-size:3em;
	color: #fff;
	margin: 0;
}

.about{
	margin: 0 auto;
	background: url(img/pattern.jpg) no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	opacity: .85;
	z-index: 100;
	position: relative;
}

.close{
	width: 60px;
	height: 45px;
	position: absolute;
	top: 40px;
	right: 31px;
	z-index: 200;
	cursor: pointer;
	-webkit-transition: .5s ease-in-out;
	-moz-transition: .5s ease-in-out;
	-o-transition: .5s ease-in-out;
	transition: .5s ease-in-out;
}

.close span{
	display: block;
	position: absolute;
	height: 1px;
	width: 100%;
	background: #7d7d7d;
	opacity: 1;
	left: 0;
	top: 21px;
}

.close span:nth-child(1) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}

.close span:nth-child(2) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.content{
	text-align: left;
	padding: 12% 10% 4%;
}

.content h1{
	color: #7d7d7d;
	margin: 0 0 8px 0;
	padding: 0;
	font-family: 'Arvo', serif;
	font-size: 2em;
	letter-spacing: .5;
}

.content p{
	color: #7d7d7d;
	margin: 0;
	padding: 0;
	font-family:'Quicksand', sans-serif;
	font-weight:400;
	font-size: 1.125em;
	line-height:1.75em;
}

.linkedin, .email{
	font-family:'Quicksand', sans-serif;
	font-weight:400;
	font-size: 1.25em;
	color: #7d7d7d;
	padding:16px 20px;
	border: 1px #7d7d7d solid;
	display: inline-block;
	text-decoration: none;
	margin: 17px 24px 0 0;
	transition: all 1s ease;
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
}

.logo{
	background: url("img/logo.svg") center no-repeat;
	height:1.25em;
	display: block;
	margin: 8% auto 0;
}

.break{
	display: none;
}

	.connect{
		position: relative;
		width:60%;
	}

	.connect h1{
		color: #fff;
		margin: 0 0 10px 0;
		padding: 0;
		font-family:'Quicksand', sans-serif;
		font-weight:400;
		font-size: 1.25em;
	}

	.icons a{
		text-decoration: none;
	}

	.icons i{
		color: #fff;
		font-size: 34px;
		cursor: pointer;
		margin: 10px 10px;
		transition: all .5s ease;
		-webkit-transition: all .5s ease;
		-moz-transition: all .5s ease;
	}

/*Desktop Non-Retina*/
@media screen and (min-device-width: 1000px) and (-webkit-min-device-pixel-ratio: 1){

	.learn:hover, .cta:hover{
		letter-spacing: 2;
		opacity: .4;
		-webkit-transform: scale(.95);
		-moz-transform: scale(.95);
		transform: scale(.95);
	}

	.linkedin:hover, .email:hover, .close:hover, #nav-icon3:hover, .connect i:hover{
		opacity: .4;
		-webkit-transform: scale(.95);
		-moz-transform: scale(.95);
		transform: scale(.95);
	}

		.fp-controlArrow.fp-next:hover, .fp-controlArrow.fp-prev:hover{
		opacity: .4;
		-webkit-transform: scale(.95);
		-moz-transform: scale(.95);
		transform: scale(.95);
		transform:rotate(45deg);
    	-ms-transform:rotate(45deg);
    	-webkit-transform:rotate(45deg);
	}

	.about{
		width:65%;
	}

	.title{
		bottom:21%;
	}

	.block{
		position: relative;
		top:23%;
	}

	.connect{
		margin: 24% auto;
	}

}

/*Desktop Retina*/
@media screen and (min-device-width: 1000px) and (-webkit-min-device-pixel-ratio: 2) and (min-resolution: 192dpi) { 

	.learn:hover, .cta:hover{
		letter-spacing: 2;
		opacity: .4;
		-webkit-transform: scale(.95);
		-moz-transform: scale(.95);
		transform: scale(.95);
	}

	.linkedin:hover, .email:hover, .close:hover, #nav-icon3:hover, .connect i:hover{
		opacity: .4;
		-webkit-transform: scale(.95);
		-moz-transform: scale(.95);
		transform: scale(.95);
	}

		.fp-controlArrow.fp-next:hover, .fp-controlArrow.fp-prev:hover{
		opacity: .4;
		-webkit-transform: scale(.95);
		-moz-transform: scale(.95);
		transform: scale(.95);
		transform:rotate(45deg);
    	-ms-transform:rotate(45deg);
    	-webkit-transform:rotate(45deg);
	}

	.about{
		width:65%;
	}

	.title{
		bottom:21%;
	}

	.block{
		position: relative;
		top:23%;
	}

	.connect{
		margin: 24% auto;
	}

}

/*Mobile*/

/*iPhone 6*/
@media only screen and (max-device-width: 800px) and (-webkit-device-pixel-ratio: 2){
	#landing{
		background: url(img/m_photograph.jpg) no-repeat center center fixed;
		-webkit-background-size: cover;
	  	-moz-background-size: cover;
	  	-o-background-size: cover;
	  	background-size: cover;
		}

	.learn, .cta{
		font-size: 1.25em;
		font-weight:400;
		padding:8px 10px;
		}

	 #nav-icon3 {
		  top: 20px;
		  right: 10px;
		}

		#fp-nav.left {
    		left: 10px;
		}

		.fp-controlArrow.fp-next{
			right:6%;
		}

		.fp-controlArrow.fp-prev{
			left:6%;
		}


		.about{
			margin: 20px;
		}

		.close{
			width: 40px;
			height: 45px;
			top: 13px;
			right: 14px;
		}

		.content{
			padding: 30px 30px;
			position: relative;
		}

		.break{
			display: block;
		}

		.content p{
			font-size: 1em;
			margin-bottom: -6px;
			line-height:1.5em;
		}

		.content h1{
			font-size: 1.8em;
			line-height:1.2em;
			margin:16px 0px 8px 0px;
		}

		.linkedin, .email{
			padding:12px 16px;
		}

		.logo{
			height: .75em;
			margin: 12% auto 0;
		}

		.title{
			bottom:22%;
			font-size:2em;
			font-weight:400;
		}

		.block{
			position: relative;
			top:23.5%;
		}

		.connect{
		margin: 50% auto;
	}

		#port1{
		background: url(img/m_escape.jpg) no-repeat center center;
	}

		#port4{
		background: url(img/m_ola.jpg) no-repeat center center;
	}

		#port6{
		background: url(img/m_dribbble.jpg) no-repeat center center;
	}

		#port1, #port2, #port3, #port4, #port5, #port6, #port7{
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
	}

}

/*Samsung Galaxy S5*/
@media only screen and (max-device-width: 800px) and (-webkit-device-pixel-ratio: 3){
	#landing{
		background: url(img/m_photograph.jpg) no-repeat center center fixed;
		-webkit-background-size: cover;
	  	-moz-background-size: cover;
	  	-o-background-size: cover;
	  	background-size: cover;
		}

	.learn, .cta{
		font-size: 1.25em;
		font-weight:400;
		padding:8px 10px;
		}

	 #nav-icon3 {
		  top: 20px;
		  right: 10px;
		}

		#fp-nav.left {
    		left: 10px;
		}

		.fp-controlArrow.fp-next{
			right:6%;
		}

		.fp-controlArrow.fp-prev{
			left:6%;
		}


		.about{
			margin: 20px;
		}

		.close{
			width: 40px;
			height: 45px;
			top: 13px;
			right: 14px;
		}

		.content{
			padding: 30px 30px;
			position: relative;
		}

		.break{
			display: block;
		}

		.content p{
			font-size: 1em;
			margin-bottom: -6px;
			line-height:1.5em;
		}

		.content h1{
			font-size: 1.8em;
			line-height:1.2em;
			margin:16px 0px 8px 0px;
		}

		.linkedin, .email{
			padding:12px 16px;
		}

		.logo{
			height: .75em;
			margin: 12% auto 0;
		}

		.title{
			bottom:22%;
			font-size:2em;
			font-weight:400;
		}

		.block{
			position: relative;
			top:23.5%;
		}

		.connect{
		margin: 50% auto;
	}

		#port1{
		background: url(img/m_escape.jpg) no-repeat center center;
	}

		#port4{
		background: url(img/m_ola.jpg) no-repeat center center;
	}

		#port6{
		background: url(img/m_dribbble.jpg) no-repeat center center;
	}

		#port1, #port2, #port3, #port4, #port5, #port6, #port7{
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
	}

}

/*Other Devices at 1.5*/
@media only screen and (-webkit-device-pixel-ratio: 1.5){
	#landing{
		background: url(img/m_photograph.jpg) no-repeat center center fixed;
		-webkit-background-size: cover;
	  	-moz-background-size: cover;
	  	-o-background-size: cover;
	  	background-size: cover;
		}

	.learn, .cta{
		font-size: 1em;
		font-weight:400;
		padding:8px 10px;
		}

	 #nav-icon3 {
		  top: 20px;
		  right: 10px;
		}

		#fp-nav.left {
    		left: 10px;
		}

		.fp-controlArrow.fp-next{
			right:6%;
		}

		.fp-controlArrow.fp-prev{
			left:6%;
		}


		.about{
			margin: 20px;
			width: 91%;
		}

		.close{
			width: 40px;
			height: 45px;
			top: 13px;
			right: 14px;
		}

		.content{
			padding: 30px 30px;
			position: relative;
		}

		.break{
			display: block;
		}

		.content p{
			font-size: .75em;
			margin-bottom: -6px;
			line-height:1.5em;
		}

		.content h1{
			font-size: 1.5em;
			line-height:1em;
			margin:16px 0px 8px 0px;
		}

		.linkedin, .email{
			padding:12px 16px;
		}

		.logo{
			height: .75em;
			margin: 12% auto 0;
		}

		.title{
			bottom:22%;
			font-size:2em;
			font-weight:400;
		}

		.block{
			position: relative;
			top:23.5%;
		}

		.connect{
		margin: 50% auto;
	}

		#port1{
		background: url(img/m_escape.jpg) no-repeat center center;
	}

		#port4{
		background: url(img/m_ola.jpg) no-repeat center center;
	}

		#port6{
		background: url(img/m_dribbble.jpg) no-repeat center center;
	}

		#port1, #port2, #port3, #port4, #port5, #port6, #port7{
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
	}

}


/*FireFox Unsupported*/
@-moz-document url-prefix() {

	#fullpage{
		display: none;
	}

	#fp-nav{
		display: none;
	}

	body{
		background: url(img/photograph.jpg) no-repeat center center fixed;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
		text-align: center;
		height: 100%;
		width: 100%;
	}

	.unsupported{
		display: block;
		margin: 10% auto;
		background: url(img/pattern.jpg) no-repeat;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
		opacity: .85;
		z-index: 100;
		position: relative;
		width: 50%;
	}

	.content{
		padding: 8% 10% 4%;
	}

	.browsers{
		text-align: center;
		margin: 40px 0 0;
	}

	.browsers a{
		color: #7d7d7d;
		font-size: 3.25em;
		margin: 0 32px;
	}

	.browsers i{
		transition: all .5s ease;
		-webkit-transition: all .5s ease;
		-moz-transition: all .5s ease;
	}

	i span{
		display: block;
		color: #7d7d7d;
		margin: 0;
		padding: 0;
		font-family:'Quicksand', sans-serif;
		font-weight:400;
		font-size: .25em;
		line-height:1.75em;
	}

	.logo{
		margin: 6% auto 0px;
	}

	.connect{
		margin: 40px auto 0;
		position: relative;
		width:80%;
		text-align: center;
	}

	.connect h1{
		color: #7d7d7d;
		margin: 0 0 0 0;
		padding: 0;
		font-family:'Quicksand', sans-serif;
		font-weight:400;
		font-size: 1em;
	}

	.icons a{
		text-decoration: none;
	}

	.icons i{
		color: #7d7d7d;
		font-size: 24px;
		cursor: pointer;
		margin: 10px 10px;
		transition: all .5s ease;
		-webkit-transition: all .5s ease;
		-moz-transition: all .5s ease;
	}

	.browsers i:hover, .icons i:hover{
		opacity: .4;
		-webkit-transform: scale(.95);
		-moz-transform: scale(.95);
		transform: scale(.95);
	}

}
