@charset "utf-8";


    body {
    background-image: url(../assets/img/slider/3.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
}




/*ESTILO FOOTER */

body footer {
background-color:#33353F;
text-align:center;
color:#FFF;
font-weight:700;
padding-top: 10px;
padding-right: 40px;
padding-bottom: 10px;
padding-left: 40px;
}

.linkfooter {
    padding-top: 7px;
}


.navbar {
padding-top:0;
padding-right:0;
padding-left:0;
background-color:#40424B
}

.navbar-nav {
    width: 100%;
    margin-top: 0;
    padding: 15px 15px 10px;
    height: 68px;
}

#navbar .navbar-nav .row {
    width: 100%;
    height: 45px;
    margin-top: -10px;
}

.navbar-nav .row .col-xl-4 {
    padding: 5px;
    height: auto;
}

.logotipoimagen {
margin-left:15px
}

@keyframes spin {
100% {
transform:rotate(360deg)
}
}
.contenedor-login {
    padding-top: 50px;
    padding-right: 50px;
    padding-bottom: 50px;
    padding-left: 50px;
}
.col-xl-2   {
    color: #FFFFFF;
    margin-top: 15px;
    text-align: center;
}
.row .col-xl-2 a {
    color: #FFFFFF;
    text-decoration: none;
}
.row .col-xl-2 a:hover  {
    color: #FF9401;
    text-decoration: none;
}
#contenedor-preguntas {
    font-weight: bold;
    padding-top: 30px;
    padding-right: 30px;
    padding-bottom: 30px;
    padding-left: 30px;
    border-radius: 3px;
    background-color: #FFFFFF;
}
.contenedor-login h1  {
    color: #FFFFFF;
    text-align: center;
    text-transform: uppercase;
    font-size: 44px;
    font-weight: bold;
    margin-bottom: 50px;
    -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  }
  @-webkit-keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
  }
}

  @keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
  } 
}

.formalogin {}

.login {
    background-color: #FFFFFF;
    border-radius: 3px;
    padding-top: 20px;
    padding-right: 20px;
    padding-bottom: 20px;
    padding-left: 20px;
}
.punchline-login h1 {
    text-transform: none;
    font-size: 32px;
    font-weight: 500;
    text-align: left;
    position: relative;
    bottom: auto;
    top: 40%;
}
.login h1 {
    color: #000000;
    text-transform: none;
    font-weight: normal;
    font-size: 26px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 29px;
    margin-left: 0px;
}
form input {
    width: 100%;
    border-color: #c6c6c6;
    border-style: solid;
    border-width: 0 0 2px;
    height: 35px;
    padding-left: 35px;
    padding-right: 5px;
    color: #6C6C6C;
    margin-top: 5px;
    margin-bottom: 20px;
    display: inline;
}
.myButton {
    background-color: #f29123;
    display: inline-block;
    cursor: pointer;
    color: #fff;
    font-family: Arial;
    font-size: 17px;
    font-weight: 700;
    padding-top: 5px;
    padding-right: 29px;
    padding-left: 29px;
    padding-bottom: 5px;
    text-decoration: none;
    width: auto;
    margin-bottom: 20px;
}

.myButton:hover {
    background-color: #11a2db;
    margin-left: auto;
    margin-right: auto;
    text-decoration: none;
    color: #FFF;
}

.myButton:active {
position:relative;
top:1px;
margin-left:auto;
margin-right:auto
}

.contenedor-boton {
    text-align: center;
    margin-top: 15px;
    color: #FFFFFF;
}
.contenedor-boton h2 {
    font-size: 16px;
    color: #ABABAB;
}
.contenedor-boton h2 a {
    font-size: 16px;
    color: #ABABAB;
    text-decoration: none;
}
.contenedor-boton h2 a:hover  {
    font-size: 16px;
    color: #F29123;
    text-decoration: none;
}

.contenedor-boton h3 {
    font-size: 16px;
    color: #00C5ED;
}
.contenedor-boton h3 a {
    font-size: 16px;
    color: #00C5ED;
    text-decoration: none;
}
.contenedor-boton h3 a:hover  {
    font-size: 16px;
    color: #004B5A;
    text-decoration: none;
}
.input-icons i { 
            position: absolute; 
        } 
          
        .input-icons { 
            width: 100%; 
            margin-bottom: 10px; 
        } 

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  }


  @-webkit-keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
  }
  @keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
  } 

          
        .icon { 
            padding: 10px; 
            min-width: 40px; 
        } 

#error {
    background-color: rgba(255,0,3,0.16);
    color: rgba(255,0,4,1.00);
    text-transform: uppercase;
    font-weight: bold;
    text-align: center;
    font-size: 16px;
    padding-top: 5px;
    padding-right: 5px;
    padding-bottom: 5px;
    padding-left: 5px;
}
.textoerror {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  }
  @-webkit-keyframes fadeIn {
    0% {
        opacity: 0;
  }

    100% {
        opacity: 1;
    }
}

  @keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
  } 

div.dataTables_wrapper div.dataTables_filter {
    text-align: right;
    margin-top: -37px;
}

div.dataTables_wrapper div.dataTables_length label {
    font-weight: normal;
    text-align: left;
    white-space: nowrap;
    float: left;
}

.blank {
    height: 500px;
}
#equis-cerrar {
    background-color: #FFFFFF;
    color: #000000;
    width: 30px;
    height: 30px;
    font-size: 18px;
    font-weight: bold;
    border-radius: 32px;
    margin-left: auto;
    position: absolute;
    top: 10px;
    text-align: center;
    right: 10px;
    cursor: pointer
}

.buttonLogin {
    position: relative;
    padding: 10px 20px;
    font-size: 16px;
    color: #fff;
    background-color: #007bff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    overflow: hidden;
    display: inline-flex !important;
    align-items: center;
}

.buttonLogin:disabled {
    background-color: #6c757d;
    cursor: not-allowed;
}

.spinner {
    width: 16px;
    height: 16px;
    border: 2px solid #fff;
    border-top: 2px solid transparent;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
    margin-left: 10px;
}

@keyframes spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}