.main-menu {
    border-bottom: 1px solid #eef4f9
}

.client-page {
    background: url('../images/pattern.png') repeat #f3f7fa
}

    .client-page .client-form {
        width: 680px;
        margin: 0 auto;
        /*padding: 70px 40px 140px;*/
        padding: 70px 40px 0px
    }

        .client-page .client-form > .inner {
            width: 100%;
            position: relative;
        }

            .client-page .client-form > .inner:before {
                width: 100%;
                height: 100%;
                position: absolute;
                background-color: #fff;
                z-index: 1;
                border-radius: 15px;
                -moz-border-radius: 15px;
                -webkit-border-radius: 15px;
                box-shadow: 0 0 15px #d7dee9;
                left: -5px;
                top: -10px;
                transform: rotate(-8deg);
                -moz-transform: rotate(-8deg);
                -webkit-transform: rotate(-8deg);
                content: ''
            }

            .client-page .client-form > .inner form {
                width: 100%;
                position: relative;
                background-color: #fff;
                border-radius: 15px;
                -moz-border-radius: 15px;
                -webkit-border-radius: 15px;
                box-shadow: 0 0 15px #d7dee9;
                -moz-box-shadow: 0 0 15px #d7dee9;
                -webkit-box-shadow: 0 0 15px #d7dee9;
                padding: 25px 35px 35px;
                z-index: 2;
                min-height: 400px
            }

                .client-page .client-form > .inner form > h1 {
                    display: block;
                    width: 100%;
                    text-align: center;
                    padding: 15px 0 10px;
                    font-size: 20px;
                    line-height: 35px;
                    color: #1e2f38
                }

                .client-page .client-form > .inner form > p {
                    display: block;
                    width: 100%;
                    text-align: center;
                    margin-bottom: 15px;
                    font-size: 14px;
                    line-height: 28px;
                    color: #686e71;
                    padding: 5px 0
                }

                .client-page .client-form > .inner form > img {
                    width: 304px;
                    display: block;
                    margin: 0 auto 40px
                }

                .client-page .client-form > .inner form .other-ways {
                    width: 100%;
                    position: relative;
                    margin: 30px 0 25px
                }

                    .client-page .client-form > .inner form .other-ways:before {
                        width: 100%;
                        height: 4px;
                        background-color: #edf1f4;
                        position: absolute;
                        content: '';
                        border-radius: 100%;
                        -moz-border-radius: 100%;
                        -webkit-border-radius: 100%;
                        right: 0;
                        top: 20px;
                        z-index: 1
                    }

                    .client-page .client-form > .inner form .other-ways .inside {
                        width: auto;
                        padding: 0 15px;
                        background-color: #fff;
                        z-index: 2;
                        display: table;
                        margin: 0 auto;
                        text-align: center;
                        position: relative;
                    }

                        .client-page .client-form > .inner form .other-ways .inside a {
                            padding: 0 10px;
                            font-size: 28px;
                            display: inline-table;
                            line-height: 30px;
                            position: relative;
                            top: 5px
                        }

                            .client-page .client-form > .inner form .other-ways .inside a.google-account {
                                color: #fb000d
                            }

                            .client-page .client-form > .inner form .other-ways .inside a.github-account {
                                color: #3e535e
                            }

                            .client-page .client-form > .inner form .other-ways .inside a:hover {
                                color: #00b3e9
                            }

                .client-page .client-form > .inner form .input-element {
                    width: 100%;
                    height: 45px;
                    position: relative;
                    margin-bottom: 18px
                }

                .client-page .client-form > .inner form .select-element {
                    width: 100%;
                    position: relative;
                    margin-bottom: 25px
                }

                    .client-page .client-form > .inner form .input-element input,
                    .client-page .client-form > .inner form .select-element select {
                        width: 100%;
                        line-height: 45px;
                        height: 45px;
                        padding: 0 45px 0 15px;
                        font-size: 13px;
                        color: #1e2f38;
                        border: 1px solid #edf1f4;
                        background-color: #fff;
                        border-radius: 7px;
                        -moz-border-radius: 7px;
                        -webkit-border-radius: 7px;
                    }

                    .client-page .client-form > .inner form .select-element label {
                        width: 100%;
                        display: block;
                        line-height: 25px;
                        padding-bottom: 8px;
                        margin-top: 5px
                    }

                .client-page .client-form > .inner form .input-element i {
                    position: absolute;
                    right: 17px;
                    top: 13px;
                    font-size: 19px;
                    color: #d4dee3
                }

                    .client-page .client-form > .inner form .input-element i.zmdi-account {
                        font-size: 21px
                    }

                .client-page .client-form > .inner form .checkbox-remember {
                    width: 100%;
                    margin: 12px 0 15px;
                    position: relative;
                }

                    .client-page .client-form > .inner form .checkbox-remember input {
                        position: absolute;
                        right: 0;
                        top: 0;
                        visibility: hidden;
                    }

                    .client-page .client-form > .inner form .checkbox-remember label {
                        display: block;
                        line-height: 35px;
                        width: 100%;
                        font-size: 13px;
                        padding-right: 28px;
                        position: relative;
                        color: #686e71;
                        -webkit-user-select: none; /* Chrome all / Safari all */
                        -moz-user-select: none; /* Firefox all */
                        -ms-user-select: none; /* IE 10+ */
                        user-select: none;
                    }

                        .client-page .client-form > .inner form .checkbox-remember label:before {
                            width: 19px;
                            height: 19px;
                            line-height: 17px;
                            text-align: center;
                            position: absolute;
                            right: 0;
                            top: 8px;
                            content: '';
                            font-family: 'material';
                            font-size: 17px;
                            color: #6fc341;
                            border: 1px solid #d8e1e8;
                            border-radius: 4px;
                            -moz-border-radius: 4px;
                            -webkit-border-radius: 4px;
                        }

                        .client-page .client-form > .inner form .checkbox-remember label:hover {
                            cursor: pointer;
                        }

                    .client-page .client-form > .inner form .checkbox-remember input:checked + label:before {
                        content: '\f26b';
                    }

                .client-page .client-form > .inner form .other-link {
                    width: 100%;
                    position: relative;
                    padding-bottom: 5px
                }

                    .client-page .client-form > .inner form .other-link.password-recovery {
                        margin-top: 25px
                    }

                    .client-page .client-form > .inner form .other-link a {
                        width: 100%;
                        display: block;
                        font-size: 13px;
                        line-height: 25px;
                        color: #00b3e9;
                        margin-bottom: 5px
                    }

                        .client-page .client-form > .inner form .other-link a i.zmdi-lock {
                            position: relative;
                            top: 2px;
                            right: 1px;
                            font-size: 16px;
                            width: 20px;
                            text-align: right;
                        }

                        .client-page .client-form > .inner form .other-link a i.zmdi-account,
                        .client-page .client-form > .inner form .other-link a i.zmdi-account-add {
                            position: relative;
                            top: 3px;
                            font-size: 17px;
                            width: 20px;
                            text-align: right;
                        }

                        .client-page .client-form > .inner form .other-link a:hover {
                            color: #1e2f38
                        }

                .client-page .client-form > .inner form button {
                    margin-top: 20px
                }

                .client-page .client-form > .inner form .captcha-layer {
                    padding-top: 23px
                }

        .client-page .client-form.password-recovery-form form button {
            margin-bottom: 25px
        }




@media screen and (max-width : 767px) {
    .client-page .client-form > .inner form .captcha-layer {
        padding-top: 0;
        margin-bottom: 20px
    }
}

@media screen and (max-width : 760px) {
    .client-page .client-form {
        padding: 35px 0 80px;
        width: 100%
    }

        .client-page .client-form .inner:before {
            display: none
        }
}

@media screen and (max-width : 600px) {
    .client-page .client-form form div.pull-left,
    .client-page .client-form form div.pull-right {
        float: none;
        width: 100%;
    }

    .client-page .client-form form div.pull-left {
        padding-top: 10px;
        padding-bottom: 5px
    }

    .client-page .client-form > .inner form button {
        width: 100%;
        margin: 5px 0 15px
    }

    .client-page .client-form > .inner form {
        padding: 15px 25px 25px
    }
}

@media screen and (max-width : 420px) {
    .client-page .client-form > .inner form {
        padding: 15px 15px 20px
    }
}

.custom-line-margin {
    margin-bottom: 50px !important;
}

.custom-margin-bottom-20 {
    margin-bottom: 20px;
}

.margin-line {
    margin: 25px 0 60px 0 !important;
}

.login-logo-custom {
    width: 185px !important;
    margin-top: 20px !important;
}

.login-card-custom {
    width: 460px !important;
}

@media only screen and (max-width: 500px) {
    .login-card-custom {
        width: 400px !important;
    }
}

@media only screen and (max-width: 436px) {
    .login-card-custom {
        width: 300px !important;
    }
}

.login-page-custom {
    min-height: 100vh !important;
    display: flex;
    align-items: center;
    padding-bottom: 20px;
}

.login-logo-link-custom {
    display: inline-block;
    width: 100%;
    text-align: center;
}

.login-text-link-custom {
    color: #00b3e9 !important;
    padding-top: 5px !important;
}

.recaptcha-login-custom {
    display: flex;
    justify-content: center;
}

.backButton-login-custom {
    font-size: 18px;
    color: #00d3ff;
    cursor: pointer;
}

.backButtonBox-login-custom {
    display: flex;
    justify-content: flex-end;
}

.height-auto {
    height: auto !important;
}
.display-block {
    display: block !important;

}
