.register {
    display: flex;
    flex-direction: column;

    background-image: url("../img/mainspace.png");
    background-size: 100%;
    height: 400px;
    overflow: hidden;
    margin-top: -81px;
}

.register h2 {
    align-self: center;

    margin-top: 130px;

    font-size: 4vw;
    text-shadow: 0 0 5px #70cce9;
    color: #70cce9;
    font-weight: normal;
}

.register a,
.register > span  {
    align-self: center;

    margin-top: 65px;
    padding:  20px 0;

    text-decoration: none;

    border: 1px solid white;
    box-shadow: 0 0 15px 3px #a350af;
    border-radius: 8px;
}

.register a span,
.register >span span {
    padding:  20px 60px;
    font-weight: normal;

    font-size: 20px;
    text-shadow: 0 0 10px #a350af;
    box-shadow: 0 0 15px 3px #a350af inset;
    border-radius: 8px;
}

@media only screen and (max-width: 600px) {
    .register {
        height: 200px;
    }
    .register h2 {    
        margin-top: 56px;
    }

    .register a {
        margin-top: 25px;
        padding:  12px 0;
    }

    .register a span {
        font-size: 14px;
        padding: 13px 30px;
    }
}

@media only screen and (min-width: 600px) and (max-width: 768px) {

    .register h2 {
        margin-top: 80px;
    }

}

@media only screen and (min-width: 768px) and (max-width: 992px) {
    .register h2 {    
        margin-top: 120px;
    }
}

@media only screen and (min-width: 992px) {
    .register {
        background-position-y: -10vw;
    }
    
    .register h2 {    
        margin-top: 120px;
    }

    .register a span {
        font-size: 30px;
    }
}