.line {
    width: 100px;
    position: relative;
    height: 2px;
    background-image: linear-gradient(to right, orange, yellow);
    left: 8%;
}

.line::before,
.line::after {
    content: "";
    height: 2px;
    background-image: inherit;
    position: absolute;
    width: 100%;
}

.line::before {
    top: -10%;
}

.line::after {
    top: 520%;
    left: -25%;
    width: 30%;
    transform: rotate(135deg);
}

.line-circle-top {
    width: 10px;
    height: 10px;
    position: absolute;
    top: -200%;
    left: calc(100% - 5px);
    border-radius: 50%;
    background-image: linear-gradient(to right, yellow, orange);
}

.line-circle-down {
    width: 10px;
    height: 10px;
    position: absolute;
    top: 953%;
    left: -29%;
    border-radius: 50%;
    background-image: linear-gradient(to right, orange, yellow);
}

.line-container {
    position: relative;
}

.patrocinadores-left {
    left: 9%;
    top: 0px;
    transform: rotate(180deg);
}

.patrocinadores-right {
    top: 0px;
    right: 84%;
    transform: rotate(180deg);
}

@media (max-width: 768px) {

    /* Media query para pantallas más pequeñas */
    .line-container {
        flex-direction: column;
    }

    .line-resp {
        left: 65% !important;
    }

    .patrocinadores-left {
        right: 5%;
        left: 0px;
        top: 0px;
        transform: rotate(180deg);
    }

    .patrocinadores-right {
        transform: rotate(180deg);
        left: -53%;
        top: 0px;
    }
}