/* -------------------------------------- Fonts -------------------------------------- */

@import url("https://fonts.googleapis.com/css?family=Inconsolata:400,700&subset=latin,latin-ext");
@import url("font-awesome.min.css");

/* -------------------------------------- Structure -------------------------------------- */

body{
    font-family: 'Inconsolata', sans-serif;
	font-size: 16px;
	font-weight: 400;
	color: #dcdcdc;
	background: #ffffff;
	line-height: 1.3em;
	padding: 0;
	margin: 0;
	font-style: normal;
	}	
	
p{
	margin-top: 0;
	padding-top: 0;
	padding-left: 10px;
	}
	
.icon {
	position: relative;
	padding: 10px;
	}

.icon:before {
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	}

.icon > .label {
	display: none;
	}
	
/* -------------------------------------- Links -------------------------------------- */
	
a:link { 
	text-decoration: none; 
	color: #fe3509;
	outline:none;
	}
	
a:active {
	text-decoration: none; 
	color: #fe3509;
	}
	
a:visited {
	text-decoration: none; 
	color: #fe3509;
	}
	
a:hover {
	text-decoration: none; 
	color: #dcdcdc;
	-webkit-transition: color 0.3s ease-in; /*safari and chrome */
    -o-transition: color 0.3s ease-in; /* opera */
	}

a img { 
	border: none; 
	padding: 0;
	margin: 0;
	vertical-align: middle;
	}
	
::selection			{ 
	background:#dcdcdc; 
	color:#fff; /* Safari and Opera */ 
	}
	
::-moz-selection  { 
	background:#dcdcdc; 
	color:#fff; /* Firefox */ 
	}

.clearfix{
	clear: both;
	}

p:hover {
    color: #fe3509;
}

/* -------------------------------------- structure  -------------------------------------- */

article.content{
	padding: 0 80px 0 40px;
	max-width: 100%;
	margin: 0;
	position: relative;
	}

article.content section p{
	max-width: 395px;
	}

h1{
	font-size: 38px;
	line-height: 1.2em;
	color: #dcdcdc;
	font-weight: 100;
	margin: 60px 0 40px 0;
	padding: 0;
	}

/* -------------------------------------- animations  -------------------------------------- */

.move{
	-webkit-transform: translate( 300px, 0px);
	-ms-transform: translate( 300px, 0px);
	-moz-transform: translate( 300px, 0px);
	transform: translate( 300px, 0px);
	}

.fade{
	opacity: 0.1;
	}

/*------------------------------ Smartphones ------------------------------*/

@media all and (max-width: 375px) {

	aside{
		width: 375px;
		position: fixed;
		right: -375px;
		}

	article.content{
		padding: 0 40px 0 40px;
		}

}

@media all and (max-height: 414px) {

	section.work{
		display: none;
		}

}

@media all and (max-width: 320px) {

	article.content{
		padding: 0 40px 0 40px;
		}

}