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

*{margin:0; padding:0;}

h1{margin:0; padding:0;}

a{text-decoration:none; color:#F60;}
a:hover{color:#E74C3C;}

#container{
	z-index:100;
}

.inside{
	margin:auto;
	max-width:1000px;
}

::-webkit-scrollbar{
	width:8px;
	background:#444;
}

::-webkit-scrollbar-thumb{
	background:#F60;
	border-left:solid 1px #333;
	border-radius:5px;
}

/*MENU*/
#menu{
	z-index:90;
	diplay:block;
	position:fixed;
	
	height:60px;
	width:100%;
	min-width:500px;
	
	background-color:#F60;
	border-bottom:solid 4px #D05B0D;
}

#menu ul{
	margin-top:10px;
	list-style:none;
	
	text-align:center;
}

#menu ul li{
	display:inline;
	font-family: 'Actor', sans-serif;
	font-size:20px;
	line-height:40px;
	color:#FFF;
	
	padding:0 20px 0 20px;
	cursor:pointer;
}

#menu ul li:hover{
	border-bottom:solid 5px #FFF;
	border-top:solid 5px #FFF;
	border-radius:10px;
	
	background-color:#FFF;
	color:#f60;
}


/*PROFIL*/
#profil{
	display:block;
	
	width:100%;

	height:500px;
	
	background:url(img/snow2.jpg) 0 no-repeat fixed;
	background-size:cover;
	padding-top:160px;
}

#pres{
	width:500px;
	background:rgba(255,255,255,0.8);
	margin:0 0 0 50px;
	padding:40px;
	
	font-family: 'Actor', sans-serif;
	text-align:justify;
	font-size:16px;
	
}

#name h1{
		font-family: 'Pacifico', cursive;
		font-size:60px;
		color:#2C3E50;
	}

.button{
		margin:auto;
		margin-top:40px;
		text-align:center;
		
		font-family: 'Pacifico', cursive;
		color:#ECF0F1;
		font-size:24px;
		
		width:300px;
		height:50px;
		background-color:#E74C3C;
		padding:9px 0 0 0;
		
		border-radius:10px;
		border-bottom:4px solid #B42616;
		
		cursor:pointer;
	}
	
.button a{
	color:#FFF;
}
	
.button:hover{
		background:#dd4637;
		margin-top:41px;
		border-bottom:3px solid #B42616;
	}
	
	
.button_small{
		margin:auto;
		margin-top:5px;
		text-align:center;
		
		font-family: 'Pacifico', cursive;
		color:#ECF0F1;
		font-size:16px;
		
		width:250px;
		height:35px;
		background-color:#f60;
		padding:9px 0 0 0;
		
		border-radius:10px;
		border-bottom:4px solid #B42616;
		
		cursor:pointer;
	}
	
.button_small a{
	color:#FFF;
}
	
.button_small:hover{
		background:#dd4637;
		margin-top:6px;
		border-bottom:3px solid #B42616;
	}
	
#linkedin{
	background-color:#09C;
	border-bottom:4px solid #06C;
}

#linkedin:hover{
		background:#1789CC;
		margin-top:41px;
		border-bottom:3px solid #06c;
	}

/*WORK*/
#work{
	display:block;
	
	width:100%;
	
	min-height:500px;
	
	background:url(img/pattern.jpg) center repeat;
	padding-top:100px;
	
	border-top:10px solid  #F60;
	
	padding:50px 0 70px 0;

}

.inside h2{
	font-family: 'Pacifico', cursive;
	font-size:40px;
	color:#E74C3C;
	text-decoration:underline;
	margin:0 0 15px 50px;
}

.album{width:900px; margin:auto;}

.item{	
position:relative;
background-color:#FFF;

margin-top:10px;

}

.work_desc{
	text-align:center;
	padding:10px;
	color:#F60;
	
}

.work_desc h3,h4{
	font-family: 'Actor', sans-serif;
	text-decoration:none;
}

.item a:hover{
	color:#FFF;
	background:#E74C3C;
}


/*ABOUTME*/
#about_me{
	display:block;
	
	width:100%;

	
	background:url(img/snow3.jpg) center 0 no-repeat fixed;
	background-size:cover;
	/*padding:40px 0 40px 0;*/
	
	border-top:10px solid  #F60;
}

#about_content{
	width:900px;
	background:rgba(255,255,255,0.8);
	margin:auto;
	padding:40px;
	
	font-family: 'Actor', sans-serif;
	text-align:justify;
	font-size:16px;
}

#about_content h2{
	margin:10px 0 15px 0;	
}

.bold a{
	text-decoration:underline;
}

.bold{
	font-weight:600;
	color:#F60;
}

#code_icons{
	text-align:center;
	padding:20px 0 20px 0;
}

#code_icons img{
	margin:0 5px 0 5px;
}


/*CONTACT*/
#contact{
	padding:40px 0 60px 0;
	border-top:10px solid  #F60;
	
	background:url(img/pattern.jpg) center repeat;
}

#form{
	width:610px;
	margin:auto;
	overflow:hidden;
	margin-top:50px;
}

label{
	width:100px;
	float:left;
	margin-top:10px;
	font-family: 'Actor', sans-serif;
}

textarea{
	width:600px;
	height:200px;
	padding:5px 0px 5px 5px;
	border-radius:5px;
	font-family: 'Actor', sans-serif;
	
	border:solid #F60 2px;
	resize:none;
}

input{
	width:600px;
	border-radius:5px;
	height:25px;
	padding:5px 0 5px 5px;
	font-family: 'Actor', sans-serif;
	
	margin-bottom:10px;	
	border:solid #F60 2px;
}

input[type=submit]{
   		margin:10px 0 0 150px;
		text-align:center;
		
		font-family: 'Pacifico', cursive;
		color:#ECF0F1;
		font-size:24px;
		line-height:24px;
		
		width:300px;
		height:50px;
		background-color:#E74C3C;
		padding:9px 0 11px 0;
		
		border-radius:10px;
		border:none;
		border-bottom:4px solid #B42616;
		
		cursor:pointer;
	}
	
input[type=submit]:hover{
		background:#dd4637;
		margin-top:11px;
		margin-bottom:-1px;
		border-bottom:3px solid #B42616;
	}
	
	
/*FOOTER*/
#footer{
	display:block;
	background-color:#E74C3C;
	width:100%;
	height:50px;
	line-height:50px;
	
	font-family: 'Pacifico', cursive;
	text-align:center;
	color:#FFF;
}

/*MEDIA QUERIES*/
@media screen and (min-width: 200px) and (max-width: 480px) {
	body{
		width:100%;}
	
#container{
	width:100%;
}
	
#menu{
	z-index:90;
	position:fixed;
	top:90%;
	left:0;
	
	height:10%;
	width:100%;
	
	background-color:#F60;
	border-top:solid 4px #D05B0D;
}

#menu ul{
	margin-top:10px;
	list-style:none;
	text-align:left;
	
	
}

#menu ul li{
	display:inline;
	font-family: 'Actor', sans-serif;
	font-size:14px;
	line-height:40px;
	color:#FFF;
	
	padding:0 10px 0 10px;
	cursor:pointer;
	
	
}	

  #about_content{
	  width:90%;
	  background:rgba(255,255,255,0.8);
	margin:auto;
	padding:5%;
	
	font-family: 'Actor', sans-serif;
	text-align:justify;
	font-size:16px;
}

#about_content p{
	width:90%;
	
}

#pres{
	width:90%;
	background:rgba(255,255,255,0.8);
	margin:40px 0 0 0;
	padding:5%;
	
	font-family: 'Actor', sans-serif;
	text-align:justify;
	font-size:16px;
	
}

#profil{

	padding-top:50px;
}

#pres p{
	width:90%;

}

#name h1{
		font-family: 'Pacifico', cursive;
		font-size:30px;
		color:#2C3E50;
	}

#dlcv{
		margin:auto;
		margin-top:60px;
		margin-left:60px;
		text-align:center;
		
		font-family: 'Pacifico', cursive;
		color:#ECF0F1;
		font-size:24px;
		
		width:250px;
		height:50px;
		background-color:#E74C3C;
		padding:9px 0 0 0;
		
		border-radius:10px;
		border-bottom:4px solid #B42616;
		
		cursor:pointer;
	}
	
#dlcv a{
	color:#FFF;
}
	
#dlcv:hover{
		background:#dd4637;
		margin-top:61px;
		border-bottom:3px solid #B42616;
	}
	
	.inside{width:100%;}
}