@import 'global.css';
/* estilo global para los colores de la página 
hay 4 colores para mantener el estilo global de la página. El modo de usarlos es:
var(--color-primario)
var(--color-secundario)
var(--color-terciario)
var(--color-cuaternario)

ejemplo:     <color: var(--color-primario);>
*/

main{
  min-height: calc(100vh - 430px);
}

  .contenedor__todo{
        width: 100%;
        max-width: 800px;
        margin: auto;
        position: relative;
    }
  
    
    .contenedor__registro{
      
      
      max-width: 390px;
      
    }
    
    
    .contenedor__registro form{
      
      margin-left: auto;
      margin-right: auto;
  
      padding: 20px 40px;
      background:  #e6ebedef;
      border-radius: 20px;
    }
    
    .contenedor__registro form input{
      width: 100%;
      margin-top: 20px;
      padding: 10px;
      border: none;
      font-size: 16px;
      outline: none;
    }
    
    .contenedor__registro form h2{
      font-size: 30px;
      text-align: center;
      margin-bottom: 20px;
      color:#00ADB5;
    }
    .contenedor__registro form button{
      padding: 10px 40px;
      margin: 40px 2px 0;
      border: none;
      font-size: 14px;  
      background: #00ADB5;;
      font-weight: 600;
      cursor: pointer;
      /* color: white; */
      outline: none;
      width: 146px;
      transition: .5s;
    }

    .contenedor__registro form button:hover{
      background: var(--color-cuaternario);;
   
    }

    footer{
      padding-top: 20px;
      text-align: center;
      font-family: 'Roboto', sans-serif;
      background-color:#00ADB5; 
  }