/*body {
    background: rgb(26,82,138);
    background: linear-gradient(90deg, rgba(26,82,138,1) 25%, rgba(48,72,116,1) 59%);
}
*/

*{
    box-sizing:border-box;
}
body{
    background: rgb(255,255,255);
    background: linear-gradient(180deg, rgba(255,255,255,1) 60%, rgba(37,97,144,1) 85%, rgba(38,50,56,1) 100%);
    background-size:cover;
    height:auto;
}

#boxMain {
    padding-top: 2%;
    margin: 0 auto;
/*    width: 25%;*/
}

#boxLogin {
/*    background-color: #f5f5f5;*/
/*    box-shadow: 1px 20px 33px -14px rgba(0,0,0,0.91);
    -webkit-box-shadow: 1px 20px 33px -14px rgba(0,0,0,0.91);
    -moz-box-shadow: 1px 20px 33px -14px rgba(0,0,0,0.91);*/
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}

#boxLoginFields {
    /*    padding-top: 30px;
    background-color: #a9bdcc;
    border-radius: 10px;*/
    border-radius: 10px;
    /*    background: linear-gradient(270deg, #000000, #256190);*/
    background-size: 400% 400%;
    -webkit-animation: AnimationName 20s ease infinite;
    -moz-animation: AnimationName 20s ease infinite;
    animation: AnimationName 20s ease infinite;
    /*background: rgba(255, 255, 255, 0.8);*/
    /*    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.10);*/
    /*backdrop-filter: blur(30px);*/
    -webkit-backdrop-filter: blur(30px);
    border-radius: 10px;
    width: auto;
    margin: 0 auto;
    padding-left: 168px;
    /*padding: 84px 0px 84px 168px;*/
    /*padding: 84px;*/
    position: relative;
    height:100%;
    
    
}

.border-login {
    border-color:#5DA1D5 !important;
}

    .border-login:focus {
        box-shadow: 1px 1px 5px #256190 !important;
        /*box-shadow: 1px 1px 10px #256190 !important;*/
    }

#boxBgLogin {
    border-radius: 30px;
    padding: 20px;
    box-shadow: 10px 10px 20px #256190;

    /*box-shadow:10px 10px 49px #cfcfcf;*/
}

#boxLoginFields label {
    font-weight: bold;
}

#boxLoginImage {
    height: 600px;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-bottom-left-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-bottomleft: 10px;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    background-color: #ffffff;
}

.login-hello {
    font-weight: 400;
    text-align: center;
    color: #fff;
    font-size: 18px;
}

.login-logo {
    width: 50%;
    display: block;
    margin: 0px auto;
    padding-top: 20px;
}

.linear-wipe {
    text-align: center;
    background: linear-gradient(to left, #000 20%, #256190 40%, #256190 60%, #000 80%);
    /*background-size: 200% auto;*/
    background-size: cover;
    color: #000;
    background-clip: text;
    text-fill-color: transparent;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: shine 8s linear infinite;
    font-weight: 700;
}

@keyframes shine {
    to {
        background-position: 200% center;
    }
}


h5 {
    color: #fff;
}

#CodigoToken {
    text-align: center;
    margin-top: 25px;
    margin-bottom: 20px;
}

#CodigoTokenMobile {
    text-align: center;
    margin-top: 25px;
    margin-bottom: 20px;
}

.field-code {
    border: 1px solid !important;
    border-color: #5DA1D5 !important;
    /*width: 9% !important;*/
    width: 14% !important;
    height: 50px !important;
    font-weight: bold;
}

.field-code-mobile {
    border: 1px solid !important;
    width: 13% !important;
    font-weight: bold;
}

.mobile-text-login {
    color: #fff;
    padding: 15px;
}


/*extra small*/
@media (max-width: 576px) {
    .container {
        max-width: 900px;
    }


    #boxMain {
        display: none;
    }

    body {
        background: rgb(15,10,120) !important;
        background: linear-gradient(180deg, rgba(15,10,120,1) 10%, rgba(32,51,133,1) 52%, rgba(43,78,142,0.9864320728291317) 79%, rgba(0,0,0,1) 100%) !important;
        background-size: cover ;
    }
}

/*small*/
@media (min-width:577px) and (max-width: 768px) {

    body {
        background: rgb(15,10,120) !important;
        background: linear-gradient(180deg, rgba(15,10,120,1) 10%, rgba(32,51,133,1) 52%, rgba(43,78,142,0.9864320728291317) 79%, rgba(0,0,0,1) 100%) !important;
    }

    #boxMain {
        display: none;
    }
}

/*medium*/
@media (min-width:769px) and (max-width: 992px) {
    .container {
        max-width: 900px;
    }

/*    body {
        background: linear-gradient(90deg, #040d51 0%, #256190 100%);
    }*/

    #boxMobile {
        display: none;
    }
}
/*custom medium*/
@media (min-width:769px) and (max-width: 1320px) {
 /**/   #boxLoginFields {
        padding-left: 30px;
        /*padding: 84px 0 84px 30px;*/
    }
}

/*large*/
@media (min-width:993px) and (max-width: 1140px) {
    .container {
        max-width: 900px;
    }

    /*    body {
    background: linear-gradient(90deg, #040d51 0%, #256190 100%);
}*/

    #boxMobile {
        display: none;
    }
}

/*extra large*/
@media (min-width: 1141px) {
    .container {
        max-width: 900px;
    }

    #boxMobile {
        display: none;
    }
}



@-webkit-keyframes AnimationName {
    0% {
        background-position: 0% 50%
    }

    50% {
        background-position: 100% 50%
    }

    100% {
        background-position: 0% 50%
    }
}

@-moz-keyframes AnimationName {
    0% {
        background-position: 0% 50%
    }

    50% {
        background-position: 100% 50%
    }

    100% {
        background-position: 0% 50%
    }
}

@keyframes AnimationName {
    0% {
        background-position: 0% 50%
    }

    50% {
        background-position: 100% 50%
    }

    100% {
        background-position: 0% 50%
    }
}