* {
	box-sizing: border-box;
}

html {
	height: 100%;
}

body {
	margin: 0;
	background: #FAFAFA;
}

a {
	text-decoration: none;
	cursor: pointer;
}

::selection {
	background: #6D17B3;
	color: #FFFFFF;
}

mobile {
	display: none;
}

/* -------------------- HEADER -------------------- */

header {
	display: block;
	height: 50vw;
	width: 100%;
/* */
	background: url(../img/wide.jpg) center center no-repeat #000000;
	background-size: cover;
}

aside {
	display: block;
	margin-left: 55%;
	height: 100%;
	width: 45%;
}

logo {
	display: block;
	position: absolute;
	height: 10vw;
	width: 10vw;
	top: 10vw;
/* */
	background: url(../img/logo.png) center center no-repeat #000000;
	background-size: contain;
}

aside span {
	position: absolute;
	width: 35vw;
	top: 25vw;
/* */
	font-family: 'GoogleSansFlex', monospace;
	font-weight: 200;
	font-size: 2.5vw;
	line-height: 1.5;
	color: #FFFFFF;
}

#signature {
	display: block;
	margin-top: 2vw;
	height: 4vw;
	width: 20vw;
/* */
	background: url(../img/signature.svg) center center no-repeat;
	background-size: contain;
}

/* -------------------- VALUES -------------------- */

section {
	width: 100%;
/* */
	display: flex;
	flex-wrap: nowrap;
	flex-direction: row;
	justify-content: space-evenly;
	align-items: stretch;
	align-content: stretch;
}

#lefty {
	width: 70%;
	padding: 8vw;
/* */
	background: linear-gradient(135deg,rgba(109, 23, 179, 1) 0%, rgba(98, 26, 117, 1) 100%);
}

#lefty .title {
	margin: 0;
/* */
	font-family: 'GoogleSansFlex', monospace;
	font-weight: 400;
	font-size: 2vw;
	line-height: 1.5;
	color: #FFFFFF;
}

#lefty .subtitle {
	margin: 0;
/* */
	font-family: 'GoogleSansFlex', monospace;
	font-weight: 200;
	font-size: 1.5vw;
	line-height: 1.5;
	color: #FFFFFF;
}

#lefty .break {
	display: block;
	height: 2vw;
}

#righty {
	width: 30%;
/* */
	background: url(../img/photo.jpg) center center no-repeat;
	background-size: cover;
}

/* -------------------- SERVICES -------------------- */

main {
	width: 100%;
	padding: 2vw;
/* */
	display: flex;
	flex-wrap: nowrap;
	flex-direction: row;
	justify-content: space-evenly;
	align-items: stretch;
	align-content: stretch;
/* */
	background: #FAFAFA;
}

#one {
	width: 25%;
	padding: 12vw 2vw 2vw 2vw;
/* */
	background: url(../img/ico-search.svg) no-repeat;
	background-position: center 20%;
	background-size: 20%;
}

#two {
	width: 25%;
	padding: 12vw 2vw 2vw 2vw;
/* */
	background: url(../img/ico-growth.svg) no-repeat;
	background-position: center 20%;
	background-size: 20%;
}

#three {
	width: 25%;
	padding: 12vw 2vw 2vw 2vw;
/* */
	background: url(../img/ico-mega.svg) no-repeat;
	background-position: center 20%;
	background-size: 20%;
}

#four {
	width: 25%;
	padding: 12vw 2vw 2vw 2vw;
/* */
	background: url(../img/ico-cpu.svg) no-repeat;
	background-position: center 20%;
	background-size: 20%;
}

main .title {
	margin: 0;
/* */
	font-family: 'GoogleSansFlex', monospace;
	font-weight: 400;
	font-size: 1.5vw;
	line-height: 1.5;
	color: #777777;
}

main .subtitle {
	margin: 0;
/* */
	font-family: 'GoogleSansFlex', monospace;
	font-weight: 200;
	font-size: 1vw;
	line-height: 1.5;
	color: #777777;
}

/* -------------------- FOOTER -------------------- */

footer {
	width: 100%;
	padding: 5vw;
/* */
	display: flex;
	flex-wrap: nowrap;
	flex-direction: row;
	justify-content: space-evenly;
	align-items: stretch;
	align-content: stretch;
/* */
	background: linear-gradient(135deg,rgba(109, 23, 179, 1) 0%, rgba(98, 26, 117, 1) 100%);
}

#details {
	width: 30%;
}

.serve {
	margin: 0 0 1vw 0;
/* */
	font-family: 'GoogleSansFlex', monospace;
	font-weight: 400;
	font-size: 2vw;
	line-height: 1.5;
	color: #FFFFFF;
}

.phone {
	margin: 0;
/* */
	font-family: 'GoogleSansFlex', monospace;
	font-weight: 200;
	font-size: 2.5vw;
	line-height: 1.5;
	color: #FFFFFF;
}

.phone a {
	color: #FFFFFF;
}

.phone a:hover {
	text-decoration: underline;
}

.print {
	font-family: 'GoogleSansFlex', monospace;
	font-weight: 200;
	font-size: 1vw;
	line-height: 1.5;
	color: #FFFFFF;
}

.print a {
	color: #FFFFFF;
}

.print a:hover {
	text-decoration: underline;
}

#contact {
	width: 70%;
	padding-left: 10vw;
}

.touch {
	margin: 0 0 2vw 0;
/* */
	font-family: 'GoogleSansFlex', monospace;
	font-weight: 400;
	font-size: 4vw;
	line-height: 1;
	color: #FFFFFF;
}

/* -------------------- MEDIA -------------------- */

@media only screen and (max-width: 1032px) {



}

@media only screen and (max-width: 744px) and (orientation: portrait) {

	desktop {
		display: none;
	}
	
	mobile {
		display: block;
	}
	
	#jessica {
		display: block;
		height: 100vh;
		width: 100%;
	/* */
		background: url(../img/tall.jpg) center center no-repeat #000000;
		background-size: cover;
	}
	
	#headline {
		position: absolute;
		width: 70%;
		left: 15%;
		top: 15vw;
	/* */
		font-family: 'GoogleSansFlex', monospace;
		font-weight: 200;
		font-size: 5vw;
		line-height: 1;
		color: #FFFFFF;
	}
	
	#sig {
		position: absolute;
		display: block;
		height: 7vw;
		width: 40vw;
		bottom: 10vw;
		right: 10vw;
	/* */
		background: url(../img/signature.svg) center center no-repeat;
		background-size: contain;
	}
	
	#reachme {
		display: flex;
		flex-wrap: nowrap;
		flex-direction: row;
		justify-content: space-evenly;
		align-items: stretch;
		align-content: stretch;
	/* */
		background: #6D17B3;
	}
	
	#byphone {
		padding: 30vw 10vw 10vw 10vw;
		width: 50%;
	/* */
		text-align: center;
		text-transform: uppercase;
		font-family: 'GoogleSansFlex', monospace;
		font-weight: 700;
		font-size: 3vw;
		line-height: 1;
		color: #FFFFFF;
	/* */
		border-right: 1px solid #000000;
		background: url(../img/ico-phone.svg) no-repeat;
		background-position: center 32%;
		background-size: 30%;
	}
	
	#byemail {
		padding: 30vw 10vw 10vw 10vw;
		width: 50%;
	/* */
		text-align: center;
		text-transform: uppercase;
		font-family: 'GoogleSansFlex', monospace;
		font-weight: 700;
		font-size: 3vw;
		line-height: 1;
		color: #FFFFFF;
	/* */
		border-left: 1px solid #000000;
		background: url(../img/ico-email.svg) no-repeat;
		background-position: center 30%;
		background-size: 38%;
	}
	
	#services {
		display: block;
		padding: 10vw;
		width: 100%;
	/* */
		background: #111111;
	}
	
	#services .title {
		margin: 0;
	/* */
		font-family: 'GoogleSansFlex', monospace;
		font-weight: 400;
		font-size: 5vw;
		line-height: 1.5;
		color: #CCCCCC;
	}
	
	#services .subtitle {
		margin: 0;
	/* */
		font-family: 'GoogleSansFlex', monospace;
		font-weight: 200;
		font-size: 3vw;
		line-height: 1.5;
		color: #999999;
	}
	
	#services .break {
		display: block;
		height: 2vw;
	}

}

/* -------------------- PRINT -------------------- */

@media print {

	* {
		display: none;
	}

}
