body {
    background: radial-gradient(circle at 99% 100%, rgb(0, 60, 150), rgb(0, 80, 200), rgb(204, 255, 255));
    margin: 0;
    user-select: none;
}

img {
    border-radius: 10px;
}

.hightlight {
    color: rgb(81, 255, 80);
}

.black-text-shadow {
    text-shadow: 0px 0px 1px black;
}

.white-text-shadow {
    text-shadow: 0px 0px 1px white;
}

.page,
.half-page {
    position: relative;
    width: 100%;
    display: flex;
}

.page {
    height: 100vh;
}

.half-page {
    height: 50vh;
}

.title {
    justify-content: space-between;
    align-items: center;
    background: transparent;
    width: 100%;
    position: relative;
}

.title-text,
.title-image {
    color: rgb(255, 0, 136);
    position: relative;
    text-align: left;
    display: inline-block;
}

.title-single-img-1 {
    position: relative;
    z-index: 1;
}

.title-single-img-2 {
    position: absolute;
    z-index: 2;
    right: -50px;
    bottom: -50px;
}

.title-text {
    font-size: clamp(calc(1vmin), 30px, 40px);
    margin-left: 80px;
}

.quote {
    font-size: clamp(calc(1vmin - 5px), 25px, 35px);
    text-align: right;
    padding-right: 30px;
}

.title-image {
    margin-right: 80px;
}

@media screen and (max-width:860px) {
    .title-single-img-2{
        display: none;
    }
}
@media screen and (max-width:1060px) {
    .title-single-img-1{
        display: none;
    }
    .title-single-img-2 {
        position: relative;
        right: 0px !important;
        bottom: 0px !important;
    }
}
@media screen and (max-width:460px){
    .title-text {
        font-size: 20px;
    }
}

@media screen and (max-height:750px) {
    .title-single-img-1{
        display: none;
    }
    .title-single-img-2 {
        position: relative;
        right: 0px !important;
        bottom: 0px !important;
    }
}
@media screen and (max-height:830px) and (min-height:750px) {
    .title-single-img-2{
        display: none;
    }
}