html, body {
              font-family     : "Roboto";
              margin          : 0;
              padding         : 0;
              border          : 0;
              position        : absolute;
              height          : 100%;
              min-width       : 100%;
              font-size       : 13px;
              color           : #ffffff;
              direction       : ltr;
              font            : 14px/1.3 Arial,sans-serif;
              /*background      : url("../imagenes/fondo_tenista.jpg") no-repeat center center fixed;*/
      -webkit-background-size : cover;
         -moz-background-size : cover;
           -o-background-size : cover;
              background-size : cover;
            }
/*
 *{
   margin            : 0;
   padding           : 0;
  -webkit-box-sizing : border-box;
  -moz-box-sizing    : border-box;
   box-sizing        : border-box; 
   --azuloscuro      : #000000;
}

body {
  background         : var(--azuloscuro);
  font-family        : "Roboto";
  border-top         : 30px solid #303F9F; 
}
*/

BODY.inicial {
             background               : url("../imagenes/fondo_tenista.jpg") no-repeat center center fixed;
             font-family              : Verdana, Arial, Helvetica;
              font                    : 14px/1.3 Arial,sans-serif;
     -webkit-background-size          : cover;
        -moz-background-size          : cover;
          -o-background-size          : cover;
             background-size          : cover;
}


BODY.admin {
             background               : url("../imagenes/fondo_admin.jpg") no-repeat center center fixed;
             font-family              : Verdana, Arial, Helvetica;
              font                    : 14px/1.3 Arial,sans-serif;
     -webkit-background-size          : cover;
        -moz-background-size          : cover;
          -o-background-size          : cover;
             background-size          : cover;
}

.wrap {
  width              : 50%;
  max-width          : 500px;
  padding            : 30px;
  padding-top        : 15px;
  margin             : auto;
  background         : rgba(255,255,255, 0.6);
  
  border-top : 2px solid #044032;
  border-bottom : 2px solid #044032;
}

/*CONTENEDOR PADRE PARA FORMULARIO*/

.contenedor-formulario {
  width              : 560px;
  color              : #f2f2f2;
  padding            : 50px; 
}
  
  .contenedor-formulario .formulario {
    width            : 100%;
    margin           : auto; 
  }
  
    .contenedor-formulario .formulario .input-group {
      position       : relative;
      margin-bottom  : 32px; 
    }

       .contenedor-formulario .formulario .input-group input[type="text"],
       .contenedor-formulario .formulario .input-group input[type="email"],
       .contenedor-formulario .formulario .input-group input[type="password"] {
         font-family   : "Roboto";
         font-size     : 20px;
         color         : #274724;
         width         : 90%;
         outline       : none;
         padding       : 15px;
         background    : none;
         border        : none;
         border-bottom : 2px solid #274724; 

       }

       .contenedor-formulario .formulario .input-group input[type="text"]:focus, 
       .contenedor-formulario .formulario .input-group input[type="text"]:active,
       .contenedor-formulario .formulario .input-group input[type="email"]:focus,
       .contenedor-formulario .formulario .input-group input[type="email"]:active,
       .contenedor-formulario .formulario .input-group input[type="password"]:focus,
       .contenedor-formulario .formulario .input-group input[type="password"]:active {
         outline       : none ;               
         /*border-top : 2px solid #000000; */
         border-bottom : 2px solid #000000; 
       }

       .contenedor-formulario .formulario .input-group input[type="text"].error,
       .contenedor-formulario .formulario .input-group input[type="email"].error,
       .contenedor-formulario .formulario .input-group input[type="password"].error {
         border-bottom: 2px solid #D32F2F; 
       }

       .contenedor-formulario .formulario .input-group input[type="text"].error + label,
       .contenedor-formulario .formulario .input-group input[type="email"].error + label,
       .contenedor-formulario .formulario .input-group input[type="password"].error + label {
         color        : #D32F2F; 
       }

      .contenedor-formulario .formulario .input-group label {
        color         : #274724; 
      }

      .contenedor-formulario .formulario .input-group label.label {
        -webkit-transition : all 0.3s ease;
        -o-transition      : all 0.3s ease;
        transition         : all 0.3s ease;
        margin-left        : 15px;
        font-size          : 16px;
        line-height        : 16px;
        position           : absolute;
        top                : 16px;
        left               : 0; 
      }

        .contenedor-formulario .formulario .input-group label.label.active {
          top              : -12px;
          font-size        : 12px;
          line-height      : 12px;
          color            : #467F40;
        }


      .contenedor-formulario .formulario .input-group.checkbox label, 
      .contenedor-formulario .formulario .input-group.radio label {
        display            : inline-block;
        cursor             : pointer;
        color              : #303F9F;
        position           : relative;
        padding            : 5px 15px 5px 51px;
        font-size          : 1em;
        border-radius      : 3px;
        -webkit-transition : all 0.3s ease;
        -o-transition      : all 0.3s ease;
        transition         : all 0.3s ease; 
      }

        .contenedor-formulario .formulario .input-group.checkbox label:hover, 
        .contenedor-formulario .formulario .input-group.radio label:hover {
          background       : #bbdefb; 
        }

        .contenedor-formulario .formulario .input-group.checkbox label:before, 
        .contenedor-formulario .formulario .input-group.radio label:before {
          content          : "";
          display          : inline-block;
          width            : 17px;
          height           : 17px;
          position         : absolute;
          left             : 15px;
          border-radius    : 50%;
          background       : none;
          border           : 2px solid #303F9F; 
        }

      .contenedor-formulario .formulario .input-group.error label {
        color              : #D32F2F; 
      }

        .contenedor-formulario .formulario .input-group.error label:hover {
          background       : rgba(211, 47, 47, 0.2); 
        }

        .contenedor-formulario .formulario .input-group.error label:before {
          border           : 2px solid #D32F2F; 
        }

      .contenedor-formulario .formulario .input-group.radio input[type="radio"] {
        display            : none; 
      }

      .contenedor-formulario .formulario .input-group.radio input[type="radio"]:checked + label:before {
        display            : none; 
      }

      .contenedor-formulario .formulario .input-group.radio input[type="radio"]:checked + label {
        padding            : 5px 15px;
        background         : #303F9F;
        border-radius      : 2px;
        color              : #f2f2f2; 
      }

      .contenedor-formulario .formulario .input-group.checkbox label:before {
        border-radius      : 3px; 
      }

      .contenedor-formulario .formulario .input-group.checkbox input[type="checkbox"] {
        display            : none; 
      }

        .contenedor-formulario .formulario .input-group.checkbox input[type="checkbox"]:checked + label:before {
          display          : none; 
        }

        .contenedor-formulario .formulario .input-group.checkbox input[type="checkbox"]:checked + label {
          background       : #303F9F;
          color            : #f2f2f2;
          padding          : 5px 15px;
        }

    .contenedor-formulario .formulario input[type="submit"] {
      background           : #274724;
      border-radius        : 1px;
      border               : 2px solid #274724;
      color                : #fff;
      cursor               : pointer;
      display              : inline-block;
      font-family          : "Roboto";
      font-size            : 16px;
      padding              : 15px;
      width                : 100%;
      -webkit-transition   : all 0.3s ease;
      -o-transition        : all 0.3s ease;
      transition           : all 0.3s ease; 
    }

      .contenedor-formulario .formulario input[type="submit"]:hover {
        background         : #467F40; 
      }


.toper {
             background               : transparent;
             font-family              : 'cosmoslight', arial, sans-serif;
             font-size                : 16px;
             color                    : #fff;
             text-align               : left;
             display                  : block;
             z-index                  : 100;
             position                 : absolute;
             left                     : 0;
             top                      : 0;
             height                   : 23px;
             padding-top              : 3px;
             padding-left             : 10px;
             width                    : 100%;
}


footer {
             background               : transparent;
             color                    : #000000;
             display                  : block;
             z-index                  : 100;
             position                 : fixed;
             left                     : 0;
             bottom                   : 0;
             height                   : 40px;
             width                    : 100%;
}

A.olvido  {
  color: #000000;
} 

.font-effect-3d-float {
             color                   : rgb(255,255,255);
             font-family: 'Seymour One', serif;
             font-size: 35px;
             text-shadow: 0 3px rgba(0,0,0,0.3);
             float                    : center;
             margin                   : 0px 0px 0px 1%;
             padding                  : 5px 5px 5px 5px;
             position         : relative;
}

.font-effect-2da {
             color                   : rgb(255,255,0);
             font-family: 'Seymour One', serif;
             font-size: 30px;
             text-shadow: 0 3px rgba(0,0,0,0.4);
             float                    : center;
             margin                   : 0px 0px 0px 1%;
             padding                  : 5px 5px 5px 5px;
             position         : relative;
}


a,

  a:hover,

  a:visited {


  cursor: pointer;

  text-decoration: none;

  }

  a:hover {

  text-decoration: underline;

  }

.uso_nav_sup_der { 
                  vertical-align   : center;
                  color            : rgb(255,255,255);
                  width            : 345px;                
                  text-align       : right;
                  font-family      : Verdana, Arial, Helvetica, sans-serif;
                  border           : rgb(39,71,36) 0px solid;
                  font-size        : 11px;                          
                  padding          : 5px 15px 3px 3px;
                  top              : 2px;
                  right            : 0;
                  position         : fixed;
                  cursor           : pointer;
                }


.uso_nav_sup_izq { 
                  vertical-align   : center;
                  color            : rgb(255,255,255);
                  width            : 345px;              
                  text-align       : left;
                  font-family      : Verdana, Arial, Helvetica, sans-serif;
                  border           : rgb(39,71,36) 0px solid;
                  font-size        : 11px;                          
                  padding          : 5px 3px 3px 15px;
                  top              : 2px;
                  left            : 0;
                  position         : fixed;
                  cursor           : pointer;
                }