/* Global */

* {
	margin: 0;
	padding:0;
	font-size: 100%;
	font-family: 'Open Sans', sans-serif;
	font-weight: normal;
	box-sizing: border-box;
	border:none;
	outline:none;
    background-color: var(--primary-bg-color); 
}

img {
	max-width: 100%;
}

ul {
	list-style: none;
}

a {
	text-decoration: none;
}

p {
	font-size: 15px;
	color: var(--primary-font-color);
	text-align: justify;
}


/* Cabecalho */

.cabecalho {
	width: 100%;
	display: flex;
    justify-content: flex-end;
    align-items: center;
	padding: 21px 21px;
}

.cabecalho a {
    color: var(--primary-font-color);
	float: right;
    margin-right: 30px;
}

.cabecalho a:hover{
	font-weight: bolder;
}

.cabecalho li {
	float: right;
}


/* Propriedades gerais de container */

.container{
	display: flex;
	justify-content: space-between;
	margin: 200px 120px 0;
}

.content{
	width: 50%;
	height: 500px;
}

.content h1{
	font-size: 30px;
	color: var(--primary-font-color);
}


/* Propriedades container página inicial */

.container .content summary{
    font-size: 20px;
    color: var(--primary-font-color);
}

.container .content p{
	font-size: 15px;
    color: var(--primary-font-color);
	margin-left: 30px;
}

.container .content details{
	font-size: 15px;
    color: var(--primary-font-color);
}

.container .perfil {
	float: right;
	margin-right: 185px;
}

.container .perfil .fotoperfil{
	border-radius: 50%;
}


/* Página de contato */

.content i{
	font-size: 60px;
	color: var(--primary-font-color);
	display: flex;
	justify-content: center;
	align-items: center;
}

.content .icones {
	display: flex;
	gap: 16px;
	margin-top: 16px;
	margin-left: 66px;
}

.icones a{
	cursor: pointer;
}

.icones a:hover{
	opacity: 40%;
}

.contentForm{
	width: 50%;
	height: 500px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	
}

.contentForm h1{
	font-size: 30px;
	color: var(--primary-font-color);
}

.contentForm .box {
	width: 100%;
	height: 100%;
	border-radius: 8px;
	padding: 20px;
}

.contentForm .box form {
	width: 100%;
	display: flex;
	justify-content: center;
	gap: 15px;
}

.contentForm .box form input {
	width: 80%;
	height: 54px;
	border: 1px solid var(--primary-font-color);
	border-radius: 8px;
	padding: 0 20px;
	color: var(--primary-font-color);
}


.contentForm  input::placeholder {
	color: var(--primary-font-color);
}

.contentForm .box form button {
	width: 20%;
	height: 54px;
	background-color: var(--primary-font-color);
	color: var(--primary-bg-color);
	border-radius: 8px;
	cursor: pointer;
	display: flex;
	justify-content: center;
	align-items: center;
}


/* Extra */

.extras {
    width: 500px;
    margin-left: 120px;
    margin-top: 200px;
}

.extras h1 {
    font-size: 50px;
    color: var(--primary-font-color);   
}

.extras summary{
    font-size: 20px;
    color: var(--primary-font-color);
}

.extras p{
	font-size: 15px;
    color: var(--primary-font-color);
}

.extras details{
	font-size: 15px;
    color: var(--primary-font-color);
}

.extras iframe{
	height: 450px;
	width: 450px;
}

.extras details p{
	font-size: 15px;
    color: var(--primary-font-color);
	margin-left: 30px;
}

.extras details a{
	font-size: 15px;
    color: var(--primary-font-color);
	margin-left: 30px;
}