.register {
    padding: 80px 0 50px;
    background: $lightgreen;

    &::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        right: 0;
        height: 340px;
        z-index: 1;
        /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#26bd68+0,066759+100&0.9+0,0.9+100 */
        background: -moz-linear-gradient(top,  rgba(38,189,104,0.9) 0%, rgba(6,103,89,0.9) 100%); /* FF3.6-15 */
        background: -webkit-linear-gradient(top,  rgba(38,189,104,0.9) 0%,rgba(6,103,89,0.9) 100%); /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to bottom,  rgba(38,189,104,0.9) 0%,rgba(6,103,89,0.9) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e626bd68', endColorstr='#e6066759',GradientType=0 ); /* IE6-9 */
    }

    &::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        top: -50px;
        // height: 300px;
        // background-image: url(../images/light-bg.svg);
        // background-size: contain;
        // background-position: top center;
        // background-repeat: no-repeat;
        width: 0;
        height: 0;
        border-bottom: 390px solid $lightgreen;
        border-left: 1920px solid transparent;
        z-index: 2;
    }

    .content {
        z-index: 3;

        h1, p {
            color: $lightgreen;
        }

        h1 {
            margin: 0 0 10px;
        }

        p {

        }
        
    }
}

.form-wrap {
    padding: 35px 20px;
    border-radius: 20px;
    margin:  40px 0 0;

    &.image-upload {
        margin: 25px 0 0;

        p {
            color: $textcolor;
        }
    }

    .form-icon {
        left: 50%;
        top: -32px;
        margin-left: -55px;
    }

    .button-col {
        
        .button {
            width: 120px;
        }
    }
}