* {
 margin: 0px;
 padding: 0px;
 list-style: none;
font-family: Verdana, Geneva, Tahoma, sans-serif;
}



header {
    background-color:  rgb(78, 135, 168); /*cor de fundo do cabecario da pagina*/
    padding: 70px;/*tamanho do cabecario*/
    display: flex;/*transfomando os itens em flex deixando lado a lado*/
    justify-content: end; /*jogando os itens para o fim do cabeçario*/

}
header nav ul  {
    display: flex; /*deixando os links lado a lado*/
    
}
header nav ul li {
    margin-left: 20px;/*separando os links*/
}

header nav ul li a {
    font-size: 12px;/*taamanho do texto da ancora*/
    color: white;/*cor para o texto na ancora*/
    text-decoration: none; /*tirando o jeito padrao de links*/
}

header li a:hover {
    color: rgb(63, 7, 80);/*tranzição mudança de cor do link*/
    transition: 0.8s;/*tempo que a tranzição sera realizada*/
}

.sessao1 {
    background: linear-gradient(180deg, #c0cdcf 8.33%, rgba(90, 168, 168) 100%);/*cor de fundo da sessao 1*/ 
    padding: 200px;/*tamanho da sessao1*/
    width: auto;/*deixando a largura mudar automaticamente */
}

.sessao1 h1 {
    font-size: 50px; /*tamanho da letra no h1*/
    color: rgba(0, 0, 0, 0.447);/*cor do texto h1*/
}

.sessao1 p {
    font-size: 30px;/*tamanho do texto do paragrafo*/
}

.sessao1 button {
    padding: 20px; /*tamanho do botao */
    border-radius: 50px; /*arredondamento da borda do botao*/
    width: 300px; /*largura do botao*/
    cursor: pointer;/*mouse mudará quando passa-ló em cima do botao*/
    border-color: rgb(19, 153, 108); /*cor da borda do botao*/
    margin: 30px; /*espaçamento do botao para todos os lados*/
    color: aqua;/*cor do texto dentro do botao*/
    
}
.sessao1 button:hover {
    color:white; /*mudança da cor do botao quando passar o mouse*/
    transition: 0.8s;/*tempo que a tranziçao sera feita*/
    background-color: rgb(2, 124, 73);/*mudança da cor de fundo*/
    border-color: white;/*cor da borda*/
}

.sessao2 {
    padding: 200px;/*preenchimento da sessao*/
    display: flex;/*torando a sessao flex*/
    background-color: rgb(226, 233, 233);/*cor de fundo da sessao2*/ 
    justify-content: space-around;/*alinhamento na horizontal*/
    align-items: center; /*alinhamento na vertical*/

}

.sessao2 div img {
    height: 380px; /*tamanho da imagem*/
    margin-top: -40px; /*espaçamento da imagem colocando ela mais para cima*/
    

}
.sessao2 div button {
    padding: 20px; /*tamanho do botao*/
    border-radius: 50px;/*arredondamento da borda do botao*/ 
    width: 300px; /*largura do botao*/
    cursor: pointer;/*mouse muda quando passar em cima do botao*/
    border-color: rgb(19, 153, 108);/*cor da borda do botao*/ 
    margin: 30px; /*espacamento para todos os lados */
    color: aqua;/*cor de texto do botao*/
   
    
}
.sessao2 button:hover {
    color: white;/*cor alterada quando mouse passar em cima*/
    transition: 0.8s;/*tempo que a tranzição sera realizada*/
    border-color: white;/*cor da borda  alterada */
    background-color: rgba(38, 193, 240, 0.705);/*cor de fundo alterada */
}

.sessao2 div p {
    font-size: 40px; /*tamanho da letra*/
   
   
}

.sessao3 {
    background-color: rgb(226, 233, 233);/*cor de fundo da sessao3*/
    padding: 270px;/*preenchimento da sessao3*/
    justify-content:center ;/* itens estaram alinhando ao centro */

}

.sessao3 h2 {
    font-size: 40px;  /*tamanho do texto*/
    color: rgb(34, 34, 74); /*cor do texto*/
    text-align: center;/*alinhar ao meio*/
    margin-top: -170px;/*em relasao a sessao de cima*/
}

.sessao3 p {
    font-size: 20px; /*tamanho da letra*/
    margin-top: 30px;/*margin superior*/
    color: rgba(0, 0, 0, 0.564); /*cor da letra*/
    text-align: justify; /*aqui justificamos o texto*/
}
.sessao3 button {
    padding: 20px; /*preenchimento do botão*/
    width: 200px;/*largura do botao*/
    margin-top: 30px;/*margin superior*/
    margin-bottom: 30px;/*margin inferior*/
    border-radius: 30px;/*arredondamento da borda do botao*/
    cursor: pointer;/*mouse muda-ra quando passar no botao*/
    border-color: rgb(96, 96, 255);/*cor da borda*/
}
.sessao3 button:hover {

    color: white;/*cor da letra do botao*/
    transition: 0.8s;/*tempo que realiza a tranziçao*/
    background-color: blue;/*cor de fundo do botao*/
    border-color: white;/*cor da borda  do botao*/
}
.line {
    width: 120px; /*largura da linha*/
    margin: 40px auto; /*espacamento de 40px top e bottom e esquerda e direita automaticas*/
}

.sessao3 img{
    width: 700px; /*largura da imagem*/
    margin: 30px; /*espacamento de todos os lados*/
    
    /*IREMOS ALTERAR A FORMAÇÃO DE ALINHAMENTO*/

}


.sessao4 {
    padding: 200px;
    background: linear-gradient(180deg,rgba(89, 89, 145, 0.705), 100%, rgb(27, 27, 131) 15%), 
    url(imagens/img\ cofre\ fundo.jpg);
    background-attachment: fixed;
    background-size: cover; 
    background-position: center; 

  display: flex;
  justify-content: space-evenly;  
  align-items: center;
}

.sessao4 img{
    width: 300px;
   

}

.sessao4 div h3 {
    color: rgb(255, 255, 255);
    font-size: 30px;
    margin: 10px;
    text-align: center;
    margin-left:50px ;
    margin-bottom: 30px;
    

}
.sessao4 div p {
    color: rgb(250, 250, 250);
    font-size: 25px;
    margin-left: 50px;
    
}

.sessao4 h3 span {
    color: yellow;
    font-weight: 600;

}

footer {
    padding: 140px;
    background-color:rgb(63, 55, 55) ;
    text-align: center;
   
   

}
.div-priv {
    display: flex;
    justify-content: space-between;

}
.div-priv p {
    text-align: center;
    color: aliceblue;
    font-size: 15px;

}

.div-priv a {
    text-decoration: none;
    color: aliceblue;
}
.div-priv a:hover {
    color: rgb(103, 4, 65);
    transition: 0.8s;
}

footer img {
    width: 250px;
    height:  auto;
    margin-top: 5px;
    margin-bottom: 20px;
}