
    /* Style the form */
        #regForm {
          -webkit-box-shadow: 0px 5px 15px 0px rgba(56,56,56,0.5);
          -moz-box-shadow: 0px 5px 15px 0px rgba(56,56,56,0.5);
          box-shadow: 0px 5px 15px 0px rgba(56,56,56,0.5);
          background-color:rgba(255,255,255,0.8);
          margin: 100px auto;
          padding: 20px;
          width: 80%;
          min-width: 300px;
          border-radius:15px;
          overflow: hidden;
        }
        
        
        /* Style the input fields */
        input {
          padding: 10px;
          width: 90%;
          font-size: 17px;
          font-family: Comfortaa;
          border: 1px solid #04b4bc;
          border-radius:20px;
        }
        
        select {
            padding: 10px;
            font-size: 17px;
            width: 80%;
            font-family: Comfortaa;
            border: 1px solid #04b4bc;
            border-radius:20px;
        }
        
        
        /* Mark input boxes that gets an error on validation: */
        input.invalid {
          background-color: #ffdddd;
        }
        
        /* Hide all steps by default: */
        .tab {
          display: none;
        }
        
        /* Make circles that indicate the steps of the form: */
        .step {
          height: 15px;
          width: 15px;
          margin: 0 2px;
          background-color: #FF9700;
          border: none;
          border-radius: 50%;
          display: inline-block;
          opacity: 0.5;
        }
        
        /* Mark the active step: */
        .step.active {
          opacity: 1;
        }
        
        /* Mark the steps that are finished and valid: */
        .step.finish {
          background-color: #04AA6D;
        }
        
        .boton{
            margin:0 auto;
            width: 100%;
            background-color: #FF9700;
            color:white;
            text-decoration: none;
            border-radius: 30px;
            padding: 0.5rem 0.5rem;
            text-transform: uppercase;/*cambia a mayusculas*/
            font-weight: bold;/*cambia a negritas el texto*/
            font-size: 1.5rem;
            text-align: center;
            border:none;
        }
            
        .boton:hover{
            background-color: rgba(103, 193, 230);
            color:black;
        }
        
        .boton1{
            margin-left:-2rem;
            width: 100%;
            background-color: #04b4bc;
            color:white;
            text-decoration: none;
            border-radius: 30px;
            padding: 0.5rem 0.5rem;
            text-transform: uppercase;/*cambia a mayusculas*/
            font-weight: bold;/*cambia a negritas el texto*/
            font-size: 1.5rem;
            text-align: center;
            border:none;
        }
            
        .boton1:hover{
            background-color: rgba(103, 193, 230);
            color:black;
        }
        
        @media (min-width: 768px){
            #regForm {
              -webkit-box-shadow: 0px 5px 15px 0px rgba(56,56,56,0.5);
              -moz-box-shadow: 0px 5px 15px 0px rgba(56,56,56,0.5);
              box-shadow: 0px 5px 15px 0px rgba(56,56,56,0.5);
              background-color:rgba(255,255,255,0.8);
              margin: 100px auto;
              padding: 40px;
              width: 50%;
              min-width: 300px;
              border-radius:15px;
            }
            .boton{
                margin:0 auto;
                width: 100%;
                background-color: #04b4bc;
                color:white;
                text-decoration: none;
                border-radius: 30px;
                padding: 0.5rem 0.5rem;
                text-transform: uppercase;/*cambia a mayusculas*/
                font-weight: bold;/*cambia a negritas el texto*/
                font-size: 12px;
                text-align: center;
                border:none;
            }
                
            .boton:hover{
                background-color: rgba(103, 193, 230);
                color:black;
            }
            
            .boton1{
                margin-left:-1rem;
                width: 100%;
                background-color: #04b4bc;
                color:white;
                text-decoration: none;
                border-radius: 30px;
                padding: 0.5rem 0.5rem;
                text-transform: uppercase;/*cambia a mayusculas*/
                font-weight: bold;/*cambia a negritas el texto*/
                font-size: 12px;
                text-align: center;
                border:none;
            }
                
            .boton1:hover{
                background-color: rgba(103, 193, 230);
                color:black;
            }
        }