html, body {
    width: 100%;
    height: 100%;
    margin: 0px;
    padding: 0px;
    overflow: hidden;
    font-size: 12px;
    font-family: Arial, Helvetica, sans-serif;

    text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;  
  
}

.no_user_select{
  user-select: none;
  -ms-user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
}

  .login {
    background: #F4F4F4;
    overflow: hidden;
    width: 300px;
    height: 500px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    position: absolute;
  }
.login_Titulo {
    color: #575757;
    width: 100%;
    width: 100%;
    text-align: center;
    margin-top: 15px;
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 30px;
    font-family: Helvetica;
    font-weight: normal;
  }

  .login_boton {
    border: 0;
    border: 0;
    background: #222222;
    color: white;
    cursor: pointer;
    height: 32px;
  }
  .login #progressLogin {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
  }
  .login_tamanoIcono {
    width: 50px;
    height: 50px;
  }

  .login_fieldlist {
    margin: 0 0 -2em;
    padding: 0;
  }
  
  .login_fieldlist li {
    white-space: normal;
    list-style: none;
    margin: 10px;
  }

  .login_label {
    display: block;
    color: #575757;
    font-size: 15px;
    margin-top: 10px;
    margin-bottom: 3px;
    padding: 0px;
  }
  
input[type="text"] 
{
  border: 1px solid #ccc;
  color: #3a3a3a;
  font-size: 12px;
  font-weight: normal;
  margin: 0px;
  padding: 0px;
  padding-left: 5px;
  outline: none;
}

.login input[type="text"], .login input[type="password"], .login input[type="email"] {
    border: 0;
    color: #3a3a3a;
    height: 32px;
    font-family: Helvetica;
    font-size: 12px;
    font-weight: normal;
  }
  .login .k-progressbar {
    border-radius: 0px;
  }
  
  .login span.k-widget.k-tooltip-validation {
    font-size: 12px;
    font-weight: normal;
    color: #c11d35;
    margin-top: 5px;
  }

  .login_input_text{
    height: 2.13em;
    text-indent: .33em;
    line-height: 1.6em;
    padding: 2px .3em;  
    outline: 0;
  }

  .NotificarValidacionesG,
        .NotificarValidaciones,
        .NotificarValidaciones_warning,
        .NotificarValidaciones_info,
        .NotificarValidaciones_required {
            color: white;
            position: absolute;
            opacity: 0;
            display: none;
            z-index: 2147483647;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            text-align: center;
            background: indianred;
            height: 30px;
            width: auto;
            min-width: 200px;
            border: 1px solid #ccc;
            -webkit-box-shadow: 3px 3px 5px -2px #666;
            -moz-box-shadow: 3px 3px 5px -2px #666;
            -ms-box-shadow: 3px 3px 5px -2px #666;
            -o-box-shadow: 3px 3px 5px -2px #666;
            box-shadow: 3px 3px 5px -2px #666;
            padding: 5px;
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            -ms-box-sizing: border-box;
            -o-box-sizing: border-box;
            box-sizing: border-box;
        }

        .NotificarValidaciones_warning {
            background: #c21c35;
        }

        .NotificarValidaciones_info {
            background: #47B350;
        }

        .NotificarValidaciones_required {
            color: black;
            background: #ffff00;
        }











        










#orbitsWrap {
  max-width: 300px;
  height: 100%;
  margin:  auto;
  position: relative;
}

.orbit { 
  margin: 0;
  padding: 0;
  list-style-type: none; 
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.orbit .center { 
  position: absolute;
  z-index: 9;
  top: 50%;
  left: 50%;
}
 

.orbit .planet, .orbit .center:before, .orbit .planet:before {
  position: absolute; 
}
     
.orbit .planet {
  top: 50%;  
  left: 15%;
  width: 35%;
}

/* .orbit .center:before {
  width: 32px;
  height: 32px;
  margin-top: -16px;
  margin-left: 16px;
}
 
.orbit .planet:before {
  top:-12px;
  left:-24px;
  width: 24px;
  height: 24px;
} */
 
.orbit .planet {
  animation-iteration-count:infinite;
  -webkit-animation-iteration-count:infinite;

  animation-timing-function:linear;
  -webkit-animation-timing-function:linear;

  transform-origin: center right;
  -webkit-transform-origin: center right;

  animation-duration:12s;
  -webkit-animation-duration:12s; 

  animation-name:orbit;
  -webkit-animation-name:orbit;
}

.orbit .planet:nth-child(2) { 
  animation-name:orbit2;
  -webkit-animation-name:orbit2;
}

.orbit .planet:nth-child(3) {
  animation-name:orbit3;
  -webkit-animation-name:orbit3;
} 
 

@keyframes orbit {
  from { transform:rotate(0deg); }
  to { transform:rotate(-360deg); }
}

@-webkit-keyframes orbit {
  from { -webkit-transform:rotate(0deg); }
  to { -webkit-transform:rotate(-360deg); }
}
  
@keyframes orbit2 {
  from { transform:rotate(120deg); }
  to { transform:rotate(-240deg); }
}

@-webkit-keyframes orbit2 {
  from { -webkit-transform:rotate(120deg); }
  to { -webkit-transform:rotate(-240deg); }
}
  
@keyframes orbit3 {
  from { -webkit-transform:rotate(240deg); }
  to { -webkit-transform:rotate(-120deg); }
}

@-webkit-keyframes orbit3 {
  from { -webkit-transform:rotate(240deg); }
  to { -webkit-transform:rotate(-120deg); }
}