.vertical-tabs {
    padding: 0!important;
}
.vertical-tabs .principal-button {
    bottom: 5%;
    width: auto;
    white-space: nowrap;
}   

/* svg lines mobile */
.vertical-tabs .svg-line-mobile {
    width: 1.75rem;
    left: 1.75rem;
    top: 2rem;
    bottom: 2.75rem;
    padding-bottom: 4.75rem;
}

/* svg lines desktop */
@media (min-width: 60rem) {
    .vertical-tabs .svg-line-tab-title.active {
        display: block;
    }
}
.vertical-tabs .svg-line-tab-text-wrapper,
.svg-line-tab-image {
    padding-top: 3rem;
}

.vertical-tabs .tab-text-wrapper p {
    margin-left: calc(5% - 10px);
}

.vertical-tabs .tab-title{
    border-top-right-radius: 1rem;
}
.vertical-tabs .tab-title a:last-of-type{
    margin-bottom: 0;
}

.vertical-tabs .tab-title a.active{
    color:var(--color-blue);
}

.vertical-tabs .tab-text-wrapper .tab-text p strong{
    font-weight: normal;
    font-size: 22.62px;
}
.vertical-tabs .tab-text-wrapper .tab-text p,
.vertical-tabs .tab-title .mobile-text p{
    position: relative;
    padding-left: 2rem;
}
.vertical-tabs .tab-text-wrapper .tab-text p:before,
.vertical-tabs .tab-title .mobile-text p:before{
    content:"";
    height: 24px;
    width: 24px;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24px' height='24px' viewBox='0 0 24 24'><circle fill='%23d9d0fb' cx='12' cy='12' r='8'></circle><circle fill='%233812cf' cx='12' cy='12' r='4'></circle></svg>");
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    margin: auto;
    bottom: 0;        
}
.vertical-tabs .tab-text-wrapper .tab-text.active{
    display: block;
}

/* No Full Width */
@media (min-width:60rem) {
    .tab-title:after{
        content:"";
        height: 100%;
        border-top: 1px solid black;
        display: block;
        width: 200%;
        right: auto;
        top: -1px;
        left: -200%;
        position: absolute;
        
    }
}

@media (max-width:60rem) {

    .vertical-tabs .tab-title a:before{
        content:">";
        position: absolute;
        right: 0px;
        top: 0;
        margin: auto;
        bottom: 0; 
        transition: transform 0.4s ease;
    }
    .vertical-tabs .tab-title a.active:before{
        color: var(--color-blue);
        transform:rotate(90deg);   
        transition:transform 0.4s ease;
    }
    .vertical-tabs .tab-title a.active + .mobile-text {
        display: block;
    }
    .vertical-tabs .tab-title .mobile-text p{
        padding-left: 2.5rem;
    }
    .vertical-tabs .tab-image {
        padding-left: 3.5rem;
    }
}

.wp-block.wp-block-acf-vertical-tabs {
    max-width: 1100px;
}
.wp-block.wp-block-acf-vertical-tabs .wp-block-button {
    width: 100%;
    margin-bottom: -30%;
}
