/*
https://color.adobe.com/pt/Flat-design-colors-1-color-theme-3044245
*/

*{
	margin:0;
	padding:0;

}


#particles-js{
	width: 100%;
	height: 100%;
	background: #111111;
	border-top:5px solid #292C44;
	border-bottom:1px solid #e8e8e8;
	box-shadow: 0 0 5px #666;
	position: relative;

}

body{
	font-family:Helvetica,Arial,sans-serif;
	font-size:23px;
	line-height:1.5;
	font-weight:300;
	color:#292C44;
	background-color:#fdfdfd;
	-webkit-text-size-adjust:100%;
	scroll-behavior: smooth;
	height: 100%;
	width: 100%;
}

header{
	position: absolute;
	padding: 3%;
	margin-left: auto;
	margin-right: auto;
	left: 0;
	right: 0;
    color:#fdfdfd;
	pointer-events:none;
}

header p{
    font-size: 1.2em !important; 
	padding: 1% 0;
}

header .wrapper{
	text-align: center;
}

.foto{
	width:30%;
	vertical-align:top;
	margin-right:2.5%;
	border-radius:15px;
}

.blurb{
	width:60%;
	display:inline-block;
	text-align: justify;
}

.arrow{
	text-align: center;
	position:relative;
	bottom:0;
	padding: 12.5% 0 0 0;
}

.arrow a{
	text-decoration:none;
	color: #fdfdfd;
	pointer-events: auto;
}

.arrow a:hover{
	text-decoration:none;
}

.page-content{
	padding:30px 0;
	background-color: #F0F0F1
}


h1{
	font-weight:350;
	border-bottom:#292C44 solid 2px;
}

.sections{
	margin:20px auto;
	padding:15px;
	border-radius:15px;
}

.sections p{
	margin-bottom: 0;
	padding: 5px 20px;
}

.sections ul{
	margin-bottom: 0;
	padding: 5px 30px;
}


.sections a{
	text-decoration:none;
	color: #334D5C;
	text-shadow: 0 0 1px #666;
}

.sections a:hover{
	text-decoration:none;
}


.trabalhos{
	background-color:#DF5A49;
}

.projetos{
	background-color:#E27A3F;
}

.cursos{
	background-color:#EFC94C;
}

.contato {
	background-color:#45B29D;
}

.contato p{
	color: #F0F0F1;
	text-shadow: 0 0 1px #666;
}

footer{
	border-top:1px solid #e8e8e8;
	padding:50px 0;
	text-align: center;
	background:#111111;
	color:white;
	position:relative;
	bottom:0;
	width:100%;
	display: inline-block;
}

footer p{
	float:left;
	padding: 0 15%;
}

footer a{
	color: white;
	font-size: 1.3em !important;
}

footer li:hover{
	color: #111111;
	background-color: #F0F0F1; 
}

footer ul li{
	padding: 2% 2%;
	display: inline;
	border-radius: 25%;		
}


.wrapper{
	max-width:-webkit-calc(800px - (30px * 2));
	max-width:calc(800px - (30px * 2));
	margin-right:auto;
	margin-left:auto;
	padding-right:30px;
	padding-left:30px;
}

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

	.contato p{
		white-space: pre-wrap;      /* CSS3 */   
		white-space: -moz-pre-wrap; /* Firefox */    
		white-space: -pre-wrap;     /* Opera <7 */   
		white-space: -o-pre-wrap;   /* Opera 7 */    
		word-wrap: break-word;      /* IE */
	}
}

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

	footer {
		padding: 0;
		position: relative;
	}

	footer ul{
		padding: 0;
		margin-left: auto;
		margin-right: auto;
		left: 0;
		right: 0;
		width: 100%;
	}

	footer ul li{
		display: block;
		width: 50%;
		border-radius: 0%;
		padding: 2% 0;
		width: 100%;
	}

	footer a{
	    font-size: 3em !important; 
	}

	.footer {
		position: absolute;
		margin-left: auto;
		margin-right: auto;
		left: 0;
		right: 0;
		padding: 0;
		background-color: #111111;
	}
}

@media screen and (max-width: 800px) {
	.wrapper{
		max-width:-webkit-calc(800px - (30px));
		max-width:calc(800px - (30px));
		padding-right:15px;
		padding-left:15px;
		}

	header .wrapper{
		display:inline-block;
	}

	.foto{
		width:36.5%;
		vertical-align:top;
	}

	.blurb{
		width:80%;
		display:inline-block;
		text-align: justify;
	}

	.arrow i{
		width: 20%
	}

}

@media screen and (max-width: 400px) {
	.wrapper{
		max-width:-webkit-calc(800px - (30px));
		max-width:calc(800px - (30px));
		padding-right:15px;
		padding-left:15px;
		}

	header .wrapper{
		display:inline-block;
	}

	.foto{
		width:45%;
		vertical-align:top;
	}

	.blurb{
		width:100%;
		display:inline-block;
		text-align: justify;
	}

	.arrow i{
		width: 20%
	}

}

@media screen and (max-height: 528px) {
	.arrow {
		display: none;
	}

}