﻿body {
    background-color: #1b2024;
}


#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 #0f1114;
    padding: 36px 48px 36px;
    background-color: #0f1114;
    color: #fff;
}

#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;
    color: red;
}

#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: #1b2024;
    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: #1b2024;
    outline: 0;
    border-color: transparent;
}


.k-textbox:focus {
    background-color: #1b2024 !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:  #1b2024;
    color: #fff;
    background-color:  #1b2024;
}

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: #51ae59;
    border-color: #51ae59;
    margin-bottom: 10% !important;
}

.k-button {
    color: #fff;
    background-color: #51ae59;
    border-color: #51ae59;
}

a:hover {
    color: #51ae59;
    text-decoration: underline;
}

.k-checkbox {
    border-color: transparent;
    color: #fff;
    background-color: #1b2024;
}

.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;
}





