* {

    margin: 0;
    padding: 0;
    box-sizing: border-box;

}

#container{

    width: 100vw;
    height: 100vh;
    background: url("./img/capa\ netflix.jpg");
}

.overlay {
    
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, .7)
    
}

header{

    width: 100vw;
    display: flex;
    align-items: center;
    gap: 10px;
    padding-left: 50px;
    padding-top: 5px;
  
}

#caixa-central{

    margin:11%;
}


#logo-netflix{

   height: 80px;
   width: 150px; 
   margin-left: 100px;
}
 
select{
    
    width: 140px;
    height: 30px;
    padding-left: 35px;
    margin-left: 49%;
    margin-top: 10px;
    background: #000;
    color: #fff;
    border-radius: 5px;
    border: solid #fff 0,5px;
    font-weight: 500;
    font-size: 15px;
}

select option{

 background:  #fff;
 color: #000;
 
}

#entrar{

   height: 30px;
   width: 69px;
   margin-left:20px;
   border:none;
   background-color:#e50914;
   color: #fff;
   border-radius: 5px;
   font-size: 15px;
   font-weight: 500;
   cursor: pointer;
   
}

#entrar:hover{

    opacity: 0.7;
   
}

h1{
  
  color: #fff;
  text-align: center;
  font-size: 55px;
  font-weight: 900;
  margin-right: auto;
  margin-left: auto
  
}
    
#paragrafo-principal{

    color: #fff;
    text-align: center;
    font-size: 25px;
    margin: 25px;

}

#paragrafo-secundario{

    color: #fff;
    text-align: center;
    font-size: 25px;
    margin-bottom: 20px;
    
}

.input-inicial{

    color: #fff;
    font-size: 15px;
    font-weight: 500;
    background-color: transparent;
    border:solid 1px;
    border-radius: 5px;
    width: 45%;
    height: 55px;
    padding-left: 15px;
    margin-left: 21%;
}
    
#button-email{

    background-color: #e50914;
    color: #fff;
    font-size: 19px;
    font-weight:700;
    border: none;
    border-radius: 5px;
    width: 150px;
    height: 55px;
    margin-left: 8px;
    cursor: pointer;
   
}
    
#button-email:hover{

    opacity: 0.7;
}   
  
#logo-pipoca{

    width: 100vw;
    height: 24vh;
}

#img-pipoca{
 
    width:100vw;
}

#logo-filme{

    width: 100vw;
   
}    

#primeira-caixa-divisao{
    
    width: 100vw;
    height:1.6vh;
    background-color: #242424;
    
}

#tv-filme{
    
    width: 100vw;
    margin-bottom:-6px;
}

#logo-video{

    width: 100vw;
}

#segunda-caixa-divisao{

    width: 100vw;
    height:1.6vh;
    background-color: #242424;
}

#img-pc-cel-tablet{
    
    width: 100vw;
    margin-bottom:-4px;
}

#caixa-infantil{

    width: 100vw;
}

#img-infantil{

    width: 100vw;
    margin-bottom: -4px;
}

#terceira-caixa-divisao{

    width: 100vw;
    height:1.6vh;
    background-color: #242424;
}

#caixa-offline{

    width: 100vw;
}

#img-offline{

    width: 100vw;
    margin-bottom: -4px;
}

#quarta-caixa{

    width: 100vw;
    height:1.6vh;
    background-color: #242424; 
}

#caixa-de-perguntas{

    width: 100vw;
   
    background-color: #000;
    color: #fff;
    
}
    
H2{

    text-align: center;
    padding-top: 50px;
    padding-bottom: 20px;
    font-size: 50px;
    font-weight: 800;
    font-family:sans-serif;
}

button{

    margin-top: 8px;
    margin-left: 8%;
    width: 80%;
    height: 80px;
    background-color: #242424;
    color: #fff;
    font-size:25px;
    text-align: left;
    padding-left: 15px;
    border: none;
    cursor: pointer;
    
}

button:hover{
    opacity: 0.8;
}
  
button:active{

    opacity: 0.5;
}
p{
    margin-top: 50px;
    text-align: center;
    font-size: 20px;
}

.input-final{

    color: #fff;
    font-size: 15px;
    font-weight: 500;
    background-color: transparent;
    border:solid 1px;
    border-radius: 5px;
    width: 30%;
    height: 55px;
    padding-left: 15px;
    margin-left: 29%;
    margin-top: 15px;
}

.button-final{

    background-color: #e50914;
    color: #fff;
    font-size: 19px;
    font-weight:700;
    border: none;
    border-radius: 5px;
    width: 150px;
    height: 55px;
    margin-left: 8px;
    margin-bottom: 25px;
    cursor: pointer;
}