/* BODY {
    background: linear-gradient(135deg,#23272A,#202225 80%);
    color: rgba(224,232,255,.64);
} */

/* BODY {
    background-image: linear-gradient( rgba(35, 39, 42, 0.5), rgba(35, 39, 42, 0.5) ), url(https://shadow.gnetworx.cloud/shad0w-s3/EV0ipt.jpg);
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    transition: all 30s linear;
    background-position: 0px 0px;
    color: #dedede;
} */

body {
    background: linear-gradient(-45deg, #c04300, #fd5800, #23272A, #202225);
    background-size: 400% 400%;
    animation: gradient 30s ease infinite;
    color: #dedede;
}

@keyframes gradient {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}



#loginSection {
    bottom: 53%;
    height: 325px;
    left: 0;
    margin: 0 auto;
    margin-top: auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    max-width: 398px;
}

#loginSection .frame {
    border: 1px solid #DEDFDE;
    padding: 36px 48px 36px;
    background: linear-gradient(#23272A,#202225 99%);
    border-color: #23272A;
    box-shadow: 0 16px 32px 0 rgba(0,0,0,.08);
}

#loginSection .k-dropdown,
#loginSection .k-textbox {
    width: 100%;
}

#loginSection input[type="submit"],
#loginSection input[type="button"],
#loginSection button {
    width: 100%;
}

#loginSection input[type="checkbox"] {
    width: 16px;
}

#loginSection .logo 
{
    width: 100%;
    margin-bottom: 20px;
}

#loginSection .recover
{
    display:block;
    margin-top: 10px;
    transition: 0.3s;
}

#loginSection .field-validation-error {
    display: block;
}

#loginSection .validation-summary-errors ul {
    margin: 0;
    padding: 0;
}

#loginSection .validation-summary-errors li {
    display: inline;
    list-style: none;
    margin: 0;
}

.builtInCaptcha br:nth-of-type(2),
.builtInCaptcha br:first-of-type {
    display: none;
}

.k-textbox {
    background-color: rgba(224,232,255,.08);
    border-color: transparent;
    display: block;
    height: 42px;
    font-size: 14px;
    line-height: 24px;
    background-image: none;
    border-radius: 2px;
    -webkit-transition: border-color .24s ease,box-shadow .24s ease;
    -o-transition: border-color .24s ease,box-shadow .24s ease;
    transition: border-color .24s ease,box-shadow .24s ease;
}

.k-textbox:hover {
    background-color: rgba(224,232,255,.08);
    outline: 0;
    border-color: transparent;
}


.k-textbox:focus {
    background-color: rgba(224,232,255,.16)!important;
    transition: .24s;
    border-color: transparent;
}


.k-textbox:focus, .k-textbox.k-state-focus, .k-textbox.k-state-focused, .k-textarea:focus, .k-textarea.k-state-focus, .k-textarea.k-state-focused {
    border-color:  rgba(224,232,255,.09);
    color: #fff;
    background-color:  rgba(224,232,255,.09);
    box-shadow: 0 0 0 0.2rem rgba(0,0,0,.08) !important;
}

option, select, textarea, input[type=password], input[type=text] {
    background-color: transparent !important;
    border: solid 1px transparent !important;
    color: rgb(255, 255, 255) !important;
    border-radius: 4px;
}

ul {
    padding-inline-start: 0px !important;
}

.k-button.k-primary {
    color: #fff;
    background-color: #fd5800;
    border-color: #fd5800;
    margin-bottom: 10% !important;
}

.k-button {
    color: #fff;
    background-color: #fd5800;
    border-color: #fd5800;
}
.k-button:hover {
    color: #fff;
    background-color: #c04300;
    border-color: #c04300;
}

a:hover {
    color: rgb(253, 88, 0);
    text-decoration: underline;
}

.k-button.k-primary:hover, .k-button.k-primary.k-state-hover {
    color: #fff;
    background-color: #c04300;
    border-color: #c04300;
}

.k-checkbox {
    border-color: transparent;
    color: #fff;
    background-color: rgba(224,232,255,.08);
}

.k-checkbox:hover {
    border-color: rgba(224,232,255,.08);
    color: #fff;
    background-color: rgba(224,232,255,.08);
}

.remember-me {
    margin-top: 2%;
    margin-bottom: 5%;
}

.f-pass {
    text-align: center;
    font-size: 13px;
    font-family: inherit;
}

.text-light {
    color: rgba(224,232,255,.8);
    text-align: center;
    font-family: inherit;
    font-size: 14px;
}
.logincontainer-footer {
    background-color: transparent;
    margin-top: 20px;
    border-top: 0;
}

a:hover {
    transition: 0.3s; 
}

.divider .divider-title {
    background: #202225;
    font-size: 12px;
    letter-spacing: 1px;
    padding: 0 20px;
    text-transform: uppercase;
    color: #dcddde;
}

.divider {
    border-top: 1px solid #dcddde;
    display: block;
    line-height: 1px;
    margin: 15px 0;
    margin-top: 30px;
    margin-bottom: 30px;
    position: relative;
    text-align: center;
}

.btn-Discord {
    background-color: #7289DA;
    border-color: #7289DA;
    color: #dcddde !important;
    width: 85%;
}
.btn-Discord:hover {
    background-color: #5470d2;
    border-color: #4a67cf;
}

.btn-Google {
    background-color: #4285f4;
    border-color: #4285f4;
    margin-top: 5%;
    color: #dcddde !important;
    width: 85%;
}

.btn-Github {
    background-color: #dcddde;
    border-color: #000;
    color: #000 !important;
    margin-top: 5%;
    width: 85%;
}

.btn-Github:hover {
    background-color: #fff;
}

.btn-Facebook, .btn-Facebook:hover {
    background-color: #3b5998;
    border-color: #3b5998;
    margin-top: 5%;
    color: #dcddde !important;
    width: 85%;
}

.btn-Whmcs {
    background-color: #67ad27;
    border-color: #67ad27;
}

.btn-Facebook:hover {
    background-color: #2d88ff;
    border-color: #2d88ff;
}

.fa-discord:before {
    content: "\f392";
    font-size: 20px;
}

.fa-github:before {
    content: "\f09b";
    font-size: 20px;
}

.fa-google:before {
    content: "\f1a0";
    font-size: 20px;
}

.fa-facebook:before {
    content: "\f09a";
    font-size: 20px;
}

.btn-Whmcs img {
    width: 20px;
}

.k-i-unlock:before, .k-i-lock:before {
    color: #fff;
}

.k-i-unlock:before, .k-i-lock:before {
    color: #fff;
}