html, body {
    font-family:"Open Sans",sans-serif;
    background-color: #f5f6fa;
    height: 100%; 
    width: 100%;
    padding: 0; 
    margin: 0;
}

.login_form {
    background: url(../../App_Themes/theme/bubble/bubble-pink.svg) no-repeat bottom;
    background-size: 60%;
    height: 100%;
}

.login_wrapper {
    margin: 0 auto;
    width: 350px;
    height: 250px;
}

.login_title {
    text-align: center;
    font-size: 18px;
    margin-bottom: 20px;
    display: none;
}

.login_title_2 {
    text-align: center;
    font-size: 35px;
    line-height: 1.17;
    color: #3d2a42;
    margin-bottom:36px;
}

.login_content {
    height: 250px;
    font-size: 18px;
    font-weight: 400;
    color: #a9a9a9;
}

.login_input {
    position: relative;
}

.login_wrapper input[type=text], .login_wrapper input[type=password] {
    width: 100%;
    font-size: 16px;
    line-height: 3;
    border: 0;
    margin-bottom: 10px;
    color: #000;
    background-color: transparent;
    border-bottom: 1px solid #ced4da;
    height: 20px;
    padding-top: 20px;
}

#pwd, #usernm_forgot, #newPwd2 {
    margin-bottom: 0;
}

.login_forgotlbl:hover {
    text-decoration: underline;
}

.login_forgotlbl {
    font-size: 12px;
    text-align: right;
    cursor: pointer;
    margin-top: 2px;
    display: block;
}

.login_forgotContent {
    display: none;
}

.login_message.ps {
    color: #a22f34;
    font-size: 12px;
    text-indent: 0;
}

.login_forgotDesc {
    color: #3d2b42;
    font-size: 12px;
    text-align: center;
    margin-top: 30px;
    font-weight: 600;
}

.login_message, .login_desc  {
    line-height: 2;
    color: #a22f34;
    font-size: 12px;
    font-style: italic;
}

.login_desc_2 {
    line-height: 1.42;
    text-align: center;
    color: #717171;
    font-size: 19px;
    font-weight: 300;
}

.login_desc_2 a {
    font-weight: bold;
    color: #717171;
}

.login_button, .login_button_2 {
    text-transform: uppercase;
    display: block;
    width:100%;
    text-decoration: none;
    text-align: center;
    cursor: pointer;
    padding: 10px 0;
    margin-top: 50px;
    color: #fff;
    font-weight: bold;
    border-radius: 50px;
    font-size: 16px;
	background-color: #a22f34;
	border: 1px solid #a22f34;
}

.login_button_2 {
    margin-top:45px;
}

.login_button:hover, .login_button_2:hover {
    box-shadow: none;
}

.login_info {
    margin: 10px auto;
}

.login_info a {
    color: #686868;
    font-size: 12px;
    text-decoration: none;
}

.login_info a:hover {
    text-decoration: underline;
}

.login_bottom {
    width: 100%;
    font-size: 10px;
    text-align: center;
    color: #686868;
    position: fixed;
    bottom: 20px;
}
.login_wrapper input[type=text]:focus, .login_wrapper input[type=password]:focus,
input:focus {
    border-color: #a22f34;
    outline: none;
}

.login_other {
    overflow: hidden;
}

.login_rmb {
    font-size: 12px;
    float: left;
}

.login_rmb > label, .login_rmb > input {
    vertical-align: middle;
}

.login_forgotlink {
    float: right;
}

.login_forgotlink_2 {
    text-decoration: none;
}

.login_inner_2 {
    margin-left: -50px;
    margin-right: -50px;
}

::-webkit-input-placeholder {
    color: #a9a9a9;
}

::-moz-placeholder {
    color: #a9a9a9;
}

:-ms-input-placeholder {
    color: #a9a9a9;
}

:-moz-placeholder {
    color: #a9a9a9;
}

/*.login_logo is default logo*/
/*add .login_logo.xxx based on <div class="login_logo xxx"> added at own company master page */
/*adjust background-position and background-size to fit in login page*/

.login_logo
{
    background: url(../../App_Themes/images/Login/ClaritasLogo_Login.png) no-repeat;
    height: 100px;
    padding-top: 100px;
    background-position: 50% 90%;
    background-size: 250px;
}

.login_logo.vistage
{
    background: url(../../App_Themes/images/Company/vistage/VistageLogoNew.png) no-repeat;
    background-position: 50% 70%;
    background-size: 250px;
}

.login_logo.mdec
{
    background: url(../../App_Themes/images/Company/mdec/mdeclogo.png) no-repeat;
    background-position: 50% 90%;
    background-size: 300px;
}

.login_logo.netster
{
    background: url(../../App_Themes/images/Login/ClaritasLogo_Login.png) no-repeat;
    background-position: 50% 90%;
    background-size: 300px;
}

.login_logo.zuellig
{
    background: url(../../App_Themes/images/Company/zuellig/zuellig_logo.png) no-repeat;
    background-position: 50% 90%;
    background-size: 250px;
}

.login_logo.nandos
{
    background: url(../../App_Themes/images/Company/nandos/nando2Chicken.png) no-repeat;
    background-position: 50% 90%;
}

.login_logo.osnet
{
    background: url(../../App_Themes/images/Company/osnet/osnetLogin.png) no-repeat;
    background-position: 50% 110%;
    background-size: 220px;
}

.login_logo.vy
{
    background: url(../../App_Themes/images/Login/VYLogo_Login.png) no-repeat;
    background-position: 50% 95%;
    background-size: 350px;
}

.login_logo.hla
{
    background: url(../../App_Themes/images/Company/HLA/TeleLogin.png) no-repeat;
    background-position: 50% 90%;
    background-size: 400px;
}

.login_logo.galaxy
{
    background: url(../../App_Themes/images/Company/galaxy/GTS-LOGO.png) no-repeat;
    background-position: 50% 90%;
    background-size: 250px;
}

.login_logo.fgv
{
    background: url(../../App_Themes/images/Company/FGV/FELDA_logo.png) no-repeat;
    background-position: 50% 100%;
}

.login_logo.dista
{
    background: url(../../App_Themes/images/Login/ClaritasLogo_Login.png) no-repeat;
    background-position: 50% 90%;
    background-size: 250px;
}

.login_logo.nd2
{
    background: url(../../App_Themes/images/Company/nd2/nando2Chicken.png) no-repeat;
    background-position: 50% 90%;
}

.login_logo.st
{
    background: url(../../App_Themes/images/Company/AIA/TeleLogin.png) no-repeat;
    background-position: 50% 90%;
    background-size: 400px;
}

.login_logo.cre
{
    background: url(../../App_Themes/images/Company/CRE/CrystalEdgeLogin.png) no-repeat;
    background-position: 50% 90%;
    background-size: 250px;
}

.login_logo.amseb
{
    background: url(../../App_Themes/images/Company/AMSEB/AmsebLogin.png) no-repeat;
    background-position: 50% 90%;
    background-size: 400px;
}

.login_logo.ace
{
    background: url(../../App_Themes/images/Company/ACE/TeleLogin.png) no-repeat;
    background-position: 50% 90%;
    background-size: 400px;
}

.login_logo.st2
{
    background: url(../../App_Themes/images/Company/AIA/TeleLogin.png) no-repeat;
    background-position: 50% 90%;
    background-size: 400px;
}

.login_logo.ow
{
    background: url(../../App_Themes/images/Company/OW/oneworks_login.png) no-repeat;
    background-position: 50% 90%;
}

.login_logo.sme
{
    background: url(../../App_Themes/images/Login/ClaritasLogo_Login.png) no-repeat;
    background-position: 50% 90%;
    background-size: 250px;
}

.login_logo.ct
{
    background: url(../../App_Themes/images/Login/ClaritasLogo_Login.png) no-repeat;
    background-position: 50% 90%;
    background-size: 250px;
}

.login_logo.clm
{
    background: url(../../App_Themes/images/Login/ClaritasLogo_Login.png) no-repeat;
    background-position: 50% 90%;
    background-size: 250px;
}

.login_logo.sig
{
    background: url(../../App_Themes/images/Login/ClaritasLogo_Login.png) no-repeat;
    background-position: 50% 90%;
    background-size: 250px;
}

.login_logo.stna
{
    background: url(../../App_Themes/images/Company/STNA/TeleLogin.png) no-repeat;
    background-position: 50% 90%;
    background-size: 400px;
}

.login_logo.oew
{
    background: url(../../App_Themes/images/Company/OEW/ORTUS-EXPERT-WHITE-LOGO.png) no-repeat;
    background-position: 50% 90%;
}

.login_logo.tch
{
    background: url(../../App_Themes/images/Company/TCH/TeleLogin.png) no-repeat;
    background-position: 50% 90%;
    background-size: 400px;
}

.login_logo.abnx
{
    background: url(../../App_Themes/images/Company/ABNX/TeleLogin.png) no-repeat;
    background-position: 50% 90%;
    background-size: 400px;
}

.login_logo.fmm
{
    background: url(../../App_Themes/images/Company/FMM/fomema.gif) no-repeat;
    background-position: 50% 100%;
    background-size: 300px;
}

.login_logo.vy2
{
    background: url(../../App_Themes/images/Company/VY2/vy2NewLogo.png) no-repeat;
    background-position: 50% 90%;
}

.login_logo.ism
{
    background: url(../../App_Themes/images/Company/ISM/ISM_login.png) no-repeat;
    background-position: 50% 90%;
}

.login_logo.xln
{
    background: url(../../App_Themes/images/Company/XLN/XKNLogo_Login.png) no-repeat;
    background-position: 50% 90%;
}

.login_logo.mj
{
    background: url(../../App_Themes/images/Company/mj/mj_login.png) no-repeat;
    background-position: 50% 90%;
}

.login_logo.enl
{
    background: url(../../App_Themes/images/Company/ENL/enlinea_logo.png) no-repeat;
    background-position: 50% 80%;
    background-size: 300px;
}

.login_logo.kwy2
{
    background: url(../../App_Themes/images/Company/kwy2/kwy2Login.png) no-repeat;
    background-position: 50% 90%;
    background-size: 500px;
}

.login_logo.AF
{
    background: url(../../App_Themes/images/Company/AF/Alfa_Login.png) no-repeat;
    background-position: 50% 80%;
    background-size: 200px;
}

.login_logo.ddmc
{
    background: url(../../App_Themes/images/Company/DDMC/dmcgo.png) no-repeat;
    background-position: 53% 90%;
    background-size: 300px;
}

.login_logo.sbm
{
    background: url(../../App_Themes/images/Company/AIA/TeleLogin.png) no-repeat;
    background-position: 50% 90%;
    background-size: 400px;
}

.login_logo.ogawa
{
    background: url(../../App_Themes/images/Company/OGAWA/ogawa_LoginLogo.png) no-repeat;
    background-position: 50% 90%;
}

.login_logo.ft
{
    background: url(../../App_Themes/images/Company/AIA/TeleLogin.png) no-repeat;
    background-position: 50% 90%;
    background-size: 400px;
}

.login_logo.agri
{
    background: url(../../App_Themes/images/Company/agri/FELDA_logo.png) no-repeat;
    background-position: 50% 100%;
}

.login_logo.dell
{
    background: url(../../App_Themes/images/Company/DELL/dell_Login.png) no-repeat;
    background-position: 50% 90%;
    background-size: 250px;
}

.login_logo.jhc
{
    background: url(../../App_Themes/images/Company/JHC/JHC_LoginLogo.png) no-repeat;
    background-position: 50% 90%;
    background-size: 220px;
}

.login_logo.ayms
{
    background: url(../../App_Themes/images/Company/AYMS/ayamas-logo.png) no-repeat;
    background-position: 50% 90%;
    background-size: 270px;
}

 .login_logo.mr
{
    background: url(../../App_Themes/images/Company/MR/MetrixResearch.png) no-repeat;
    background-position: 50% 90%;
    background-size: 220px;
}

.login_logo.jkt
{
    background: url(../../App_Themes/images/Company/JKT/Claritaslogo.png) no-repeat;
    background-position: 50% 90%;
    background-size: 220px;
}

.login_logo.luz
{
    background: url(../../App_Themes/images/Company/LUZ/luzzone_logo.png) no-repeat;
    background-position: 50% 90%;
    background-size: 350px;
}

.login_logo.mca
{
    background: url(../../App_Themes/images/Company/MCA/MIND_logo.png) no-repeat;
    background-position: 50% 60%;
    background-size: 350px;
}

.login_logo.tbf
{
    background: url(../../App_Themes/images/Company/TBF/the-beer-factory-logo.png) no-repeat;
    background-position: 50%;
    background-size: 230px;
}

.login_logo.city
{
    background: url(../../App_Themes/images/Company/CITY/citychain.png) no-repeat;
    background-position: 50% 80%;
    background-size: 350px;
}

.login_logo.ug
{
    background: url(../../App_Themes/images/Company/UG/UnitedGrainlogo.png) no-repeat;
    background-position: 50%;
    background-size: 300px;
}

.login_logo.crb
{
    background: url(../../App_Themes/images/Company/CRB/CerebosLogo.png) no-repeat;
    background-position: 50%;
    background-size: 300px;
}

.login_logo.sven
{
    background: url(../../App_Themes/images/Company/sven/sven.gif) no-repeat;
    background-position: 50%;
    background-size: 150px;
}

.login_logo.mvnt
{
    background: url(../../App_Themes/images/Company/mvnt/movent_logo.png) no-repeat;
    background-position: 50%;
    background-size: 150px;
}

.login_logo.spc
{
    background: url(../../App_Themes/images/Company/spc/Spanco_logo.png) no-repeat;
    background-position: 50% 80%;
    background-size: 25%;
}

.login_logo.sknt
{
    background: url(../../App_Themes/images/Company/sknt/Skynet_logo.png) no-repeat;
    background-position: 50%;
    background-size: 300px;
}

.login_logo.ba
{
    background: url(../../App_Themes/images/Company/ba/bumiarmada_logo.png) no-repeat;
    background-position: 50%;
    background-size: 500px;
}

.login_logo.demc
{
    background: url(../../App_Themes/images/Company/demc/DEMC_logo.png) no-repeat;
    background-position: 50% 50%;
    background-size: 250px;
}

.login_logo.bmmb
{
    background: url(../../App_Themes/images/Company/bmmb/bank_muamalat.jpg) no-repeat;
    background-position: 50% 90%;
    background-size: 400px;
}

.login_logo.hai
{
    background: url(../../App_Themes/images/Company/hai/hai_logo.jpg) no-repeat;
    background-position: 50%;
    background-size: 400px;
}

.login_logo.sc
{
    background: url(../../App_Themes/images/Company/sc/sc_logo.png) no-repeat;
    background-position: 50%;
    background-size: 250px;
}

.login_logo.mbsb
{
    background: url(../../App_Themes/images/Company/mbsb/mbsb_logo.png) no-repeat;
    background-position: 50% 80%;
}

.login_logo.phb
{
    background: url(../../App_Themes/images/Company/phb/phb_logo.png) no-repeat;
    background-position: 50%;
    background-size: 400px;
}

.login_logo.sag
{
    background: url(../../App_Themes/images/Company/sag/sag_logo.png) no-repeat;
    background-position: 50%;
    background-size: 250px;
}

.login_logo.bcmb
{
    background: url(../../App_Themes/images/Company/bcmb/logo-bank-of-china.png) no-repeat;
    background-position: 50% 90%;
    background-size: 400px;
}

.login_logo.sk
{
    background: url(../../App_Themes/images/Company/sk/SushiKing_Logo.png) no-repeat;
    background-position: 50%;
    background-size: 250px;
}

.login_logo.ggp
{
    background: url(../../App_Themes/images/Company/ggp/GGP_Logo.png) no-repeat;
    background-position: 50%;
    background-size: 250px;
}

.login_logo.coke
{
    background: url(../../App_Themes/images/Company/coke/Coke_Logo.png) no-repeat;
    background-position: 50%;
    background-size: 250px;
}

.login_logo.xox
{
    background: url(../../App_Themes/images/Company/xox/XOX_Logo.png) no-repeat;
    background-position: 50% 10%;
    background-size: 250px;
}

.login_logo.pw
{
    background: url(../../App_Themes/images/Company/PW/PW_Logo.png) no-repeat;
    background-position: 50%;
    background-size: 350px;
}

.login_logo.digi
{
    background: url(../../App_Themes/images/Company/Digi/Digi_Logo.png) no-repeat;
    background-position: 50%;
    background-size: 350px;
}

.login_logo.gas
{
    background: url(../../App_Themes/images/Company/GAS/gas_Logo.png) no-repeat;
    background-position: 50%;
    background-size: 350px;
}

.login_logo.perodua
{
    background: url(../../App_Themes/images/Company/PERODUA/Perodualogo.png) no-repeat;
    background-position: 50%;
    background-size: 200px;
}

.login_logo.tmh
{
    background: url(../../App_Themes/images/Company/tmh/TheMuliaHotel_logo.png) no-repeat;
    background-position: 50%;
    background-size: 200px;
}

.login_logo.sem
{
    background: url(../../App_Themes/images/Company/sem/ShinEtsu_Logo2.png) no-repeat;
    background-position: 50%;
    background-size: 350px;
}

.login_logo.coby {
    background: url(../../App_Themes/images/Company/COBY/CobyHaus_logo.png) no-repeat;
    background-position: 50% 90% ;
    background-size: 130px;
}

.login_logo.ggaf {
    background: url(../../App_Themes/images/Company/GGAF/GGAF_Logo2.png) no-repeat;
    background-position: 50% 90%;
    background-size: 250px;
}

.login_logo.sun {
    background: url(../../App_Themes/images/Company/SUN/Suntory_Logo.png) no-repeat;
    background-position: 50% 90%;
    background-size: 250px;
}

/*mobile view*/
@media (max-width: 767px) {
    .login_wrapper {
        width: 300px;
    }

    .login_form {
        background-size: 150% !important;
        background-position: 50% 95% !important;
    }

    .login_inner_2 {
        margin: 0;
    }

    .login_title_2 {
        font-size: 25px;
    }

    .login_desc_2 {
        font-size: 14px;
    }

    #LicenseKey {
        width: 22.5em;
    }

    /*logo*/   
    .login_logo {
        padding-top: 50px;
    }

    .login_logo.enl {
        background-position: 50% 60%;
    }
    
    .login_logo.spc {
        background-position: 50% 70%;
        background-size: 70%;
    } 

    .login_logo.vistage {
        background-position: 50% 60%;
        background-size: 200px;
    }
}

@media (max-height: 567px) {    
    .login_bottom {
        position: initial;
        margin-top: 20px;
    }
}