/* ******************************************** */
/** Landing
/* ******************************************** */

.c-about__line-top,
.c-about__line-bottom,
.c-about__line-right,
.c-about__line-bottom-right,
.c-about__line-bottom-left{
    display: none;
}


/* ********************** de Desktop a DESKTOP 2 ********************** */

@media (min-width: 1200px) {

    .c-about__line-top,
    .c-about__line-bottom,
    .c-about__line-right,
    .c-about__line-bottom-right,
    .c-about__line-bottom-left{
        display: block;
    }

    .c-about{
        position: relative;
    }

    .c-about:before{
        content: "";
        display: block;
        position: absolute;
        left: var(--space-x);
        top: 0;
        height: var(--section-y-xl);
        width: var(--section-y-xl);
        opacity: .17;
        border-radius: 0 0 0 100%;
        border: 1px solid var(--color-darkgreen);
        border-top-color: transparent;
        border-right-color: transparent;
    }

    .c-about:after{
        content: "";
        display: block;
        position: absolute;
        right: calc(var(--space-x)*2);
        top: calc(var(--section-y-xl) - 1px);
        height: var(--section-y-xl);
        width: var(--section-y-xl);
        opacity: .17;
        border-radius: 0 100% 0 0;
        border: 1px solid var(--color-darkgreen);
        border-bottom-color: transparent;
        border-left-color: transparent;
    }

    .c-about__line-top{
        display: block;
        position: relative;
        position: absolute;
        left: calc(var(--section-y-xl) + var(--space-x));
        right: calc(var(--section-y-xl) + var(--space-x)*2);
        top: calc(var(--section-y-xl) - 1px);
        height: 1px;
        background-color: var(--color-darkgreen);
        opacity: .17
    }


    .c-about__line-right{
        display: block;
        position: absolute;
        right: calc(var(--space-x) * 2);
        top: calc(var(--section-y-xl)*2 - 1px);
        height: calc(100% - var(--section-y-xl)*3 + 1px);
        width: 1px;
        background-color: var(--color-darkgreen);
        opacity: .17
    }

    .c-about__line-bottom-right{
        display: block;
        position: absolute;
        right: calc(var(--space-x)*2);
        bottom: 0;
        height: var(--section-y-xl);
        width: var(--section-y-xl);
        opacity: .17;
        border-radius: 0 0 100% 0;
        border: 1px solid var(--color-darkgreen);
        border-top-color: transparent;
        border-left-color: transparent;
    }

    .c-about__line-bottom{
        display: block;
        position: relative;
        position: absolute;
        left: calc(var(--section-y-xl) + var(--space-x));
        right: calc(var(--section-y-xl) + var(--space-x)*2);
        bottom: 0;
        height: 1px;
        background-color: var(--color-darkgreen);
        opacity: .17
    }

    .c-about__line-bottom-left{
        display: block;
        position: absolute;
        left: var(--space-x);
        bottom: calc(var(--section-y-xl)*-1);
        height: var(--section-y-xl);
        width: var(--section-y-xl);
        opacity: .17;
        border-radius: 100% 0 0 0;
        border: 1px solid var(--color-darkgreen);
        border-bottom-color: transparent;
        border-right-color: transparent;
    }


    .c-about__title{
        padding-left: calc(var(--space-x) * 1.5);
        padding-right: calc(var(--space-x) * 1.5);
    }
}


