.corner {
    position: absolute;
    z-index: 1; 
}

.top-left {
    top: 3%;
    left: 3%;
}

.bottom-right {
    bottom: 3%;
    right: 3%;
}

.horizontal-line, .vertical-line {
    background-color: #52796F;
    position: absolute;
}

.horizontal-line {
    width: 4cm;
    height: 0.2cm;
}

.vertical-line {
    width: 0.2cm;
    height: 4cm;
}

.top-left .horizontal-line {
    top: 0;
    left: 0;
}

.top-left .vertical-line {
    top: 0;
    left: 0;
}

.bottom-right .horizontal-line {
    bottom: 0;
    right: 0;
}

.bottom-right .vertical-line {
    bottom: 0;
    right: 0;
}


@media screen and (max-width: 768px) {
    .top-left, .bottom-right {
        top: 1em;
        left: 1em;
        bottom: 1em;
        right: 1em;
    }
    .horizontal-line, .vertical-line {
        width: 2em;
        height: 2em;
    }
}