/*--------- 8. Register style ---------*/

.register-form {
    position: relative;
    z-index: 99;
    @media #{$large-mobile} {
        margin-top: 40px;
    }
    @media #{$tablet-device} {
        margin-left: 0px;
    }
    h4 {
        font-weight: bold;
        font-size: 24px;
        margin: 0 0 32px;
        color: #fff;
    }
    form .contact-form-style {
        input,
        textarea {
            background: #fff;
            border: none;
            height: 50px;
            box-shadow: none;
            padding: 2px 20px 2px 30px;
            color: #333;
            font-size: 14px;
        }
        textarea {
            height: 153px;
            padding: 20px 20px 20px 30px;
        }
        button {
            border: none;
            background-color: #fff;
            color: $theme-color;
            box-shadow: 0px 6px 12px 0.8px rgba(14, 14, 14, 0.26);
            padding: 23px 40px 21px;
            margin: 40px 0 0;
            &:hover {
                color: #fff;
                background-color: #333;
            }
            @media #{$large-mobile}{
                padding: 17px 27px 15px;
                margin: 20px 0 0;
                font-size: 14px;
            }
        }
    }
}

.winter-banner {
    img {
        box-shadow: 0px 0px 12px 0.8px rgba(85, 220, 149, 0.3);
        border-radius: 100%;
        z-index: 999;
    }
    .winter-content {
        text-align: center;
        position: absolute;
        top: 50%;
        transform: translateY(-50%)translateX(-50%);
        left: 50%;
        span {
            color: #f6f6f6;
            font-weight: bold;
            font-size: 18px;
            display: block;
            line-height: 1;
            letter-spacing: .5px;
        }
        h3 {
            font-size: 48px;
            font-weight: bold;
            color: #f6f6f6;
            letter-spacing: .5px;
            margin: 14px 0 20px;
        }
    }
}

.register-area {
    position: relative;
    overflow: hidden;
    #register-1 {
        background-image: url("../../assets/img/icon-img/register-shape-1.png");
        background-size: contain;
        height: 138px;
        transform: translateX(0px) translateY(566px);
        width: 261;
        z-index: 1
    }
    #register-2 {
        background-image: url("../../assets/img/icon-img/register-shape-2.png");
        background-size: contain;
        height: 110px;
        transform: translateX(0px) translateY(330px);
        width: 65px;
    }
}

.register-wrap {
    position: relative;
    z-index: 99;
    #register-3 {
        height: 222px;
        transform: translateX(930px) translateY(-147px);
        width: 222px;
        @media #{$laptop-device} {
            transform: translateX(724px) translateY(-135px);
        }
        @media #{$tablet-device} {
            transform: translateX(470px) translateY(12px);
        }
        @media #{$large-mobile} {
            transform: translateX(20px) translateY(0px);
            position: static;
        }
        @media #{$small-mobile} {
            transform: translateX(150px) translateY(0px);
        }
    }
}

.mouse-bg {
    background-repeat: no-repeat;
    background-size: auto auto;
    position: absolute;
    left: 0;
    top: 0;
}