I try to modify My loginCSS in this way with ultimate branding but

I try to My loginCSS in this way with ultimate branding but I dont find the way in the forum.
I need these modification if you can help it will be good :
// 1 :
login width of the box : at this time there is the stand-art width "322px x 300px"
1. how can I get a "500px x 300px" ?
// 2 :
Box Is grey and line too
2. how can I do to have a different color than grey : white, with an alpha transparent of 50% ?
// 3 :
As visible on the screenshot , Button arent on the same line
3. how can I do to have it on the same line ?

Thank you very much

My CSS true ultimate branding at this time

body.login {
background: #000;
}
#login {
padding: 30px 0 0;
}
.login form {
margin-left:auto;
margin-right:auto;
padding: 30px;
border: 1px solid rgba(0,0,0,.2);
background-clip: padding-box;
background: rgba(255, 255, 255,.9);
box-shadow: 0 0 13px 3px rgba(0,0,0,.5);
overflow: hidden;
}
.login label {
color: #333;
line-height: 26px;
}
.login .button-primary {
width: 120px;
float:right;
}

  • Sajid

    Hi @Laurent_C

    Hope you are doing good today :slight_smile:

    // 1 :
    login width of the box : at this time there is the stand-art width "322px x 300px"
    1. how can I get a "500px x 300px" ?

    #login {
        width: 500px !important;
    }
    // 2 :
    Box Is grey and line too
    2. how can I do to have a different color than grey : white, with an alpha transparent of 50% ?

    Its not grey. Its already white and have some 10% transparency and due to the background color (black) its making it grey. If you want to increase the opacity to 50% then add below code, but this will make it more dark.

    .login form{
        background: rgba(255, 255, 255, 0.5);
    }

    // 3 :
    As visible on the screenshot , Button arent on the same line
    3. how can I do to have it on the same line ?

    .kleo-fb-wrapper.text-center {
        float: left;
    }

    Additionally add this code to make the remember me checkbox look good :slight_smile:

    p.forgetmenot {
        margin-top: 8px;
        margin-left: 5px;
    }

    Take care and have a nice day :slight_smile:

    Cheers, Sajid

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.