/* resert para combinar com todos navegadores*/

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-style: normal;
    
}

header nav li, h1,h2, h3{
    font-family:"Bungee", sans-serif;
    font-weight: normal;
}
body{
    font-family:"Roboto", sans-serif;
}
.container > img{
    
    border-radius: 8px;
}

/* defini a cor do header com altura do paddin e cor da letras*/

header >.container{
    padding: 16px;
    background-color: #182c61;
    color: #ecf0f1;
    border-radius: 8px;
}

/* aqui no meu menu coloquei o display inline pra os texto
ficar na mesma linha e coloquei a margin para da espaços entre os links*/

header nav li{
display: inline;
margin-left: 16px;
font-size: 18px;


}

/* so coloquei a cor dos texto pois não se coloca no header*/
header nav li a{
    color: #ecf0f1;
    text-decoration: none;
}

/* aqui define o tamanho da minha div container onde fica os conteudo*/

.container{
    max-width: 1200px;
    width: 100%;
    margin: 0 auto;
    
}

/* aqui o container fica flexivel a tela*/
header .container{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.brands-listin img{
    height: 24px;
    
}
.brands-listin li{
    display: inline;
    margin: 12px 0;
}
section.container{
    align-items: flex-start;
}
section{
    padding: 24px 0;
}
section h2, h3{
margin-bottom: 16px;
color: #182c61;
}
section p{
    margin-bottom: 8px;
}div > img{
    margin-right: 32px;
}
.social-links img{
    height: 24px;
}
.social-links li, a{
    display: inline;
    margin-left: 8px;
    text-decoration: none;
}

#contact .container{
    display: block;
}
.contact-method{
    display: flex;
    justify-content: space-between;
}
form input,form textarea,form button{
    display: block;
    width: 320px;
    font-family:"Roboto", sans-serif;
    margin-bottom: 8px;
    padding: 8px;
    
    border-radius: 8px;

}
form textarea{
    height: 180px;
    resize: none;
}
form button{
    background-color: #182c61;
    color: #ecf0f1;
    font-family:"Bungee", sans-serif;
    border:none ;
    cursor: pointer;
}
form button:hover{
    background-color: #567eeb;  
}
input :focus, textarea:focus{
    outline-color:  #182c61;
}
footer{
    background-color:#182c61;
    color: #ecf0f1;
    padding: 16px 0;
    font-family: "Roboto", sans-serif;
}