﻿
.speakers-holder {
    display: flex;
    flex-wrap: wrap;
    row-gap: 60px;
    margin-top:15px;
}

.speakers-holder .item {
    position: relative;
    z-index: 2;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    column-gap: 90px;
    
}

.img-holder,
.empty-column-left{
    flex: 0 0 400px;
}

.text-box {
    flex: 1;
}

.speakers-holder .item.button-container {
    margin-top:-30px;
}


@media only screen and (min-width:768px) and (max-width:1024px) {
    .speakers-holder .item {
        column-gap: 50px;
    }
    .img-holder,
    .empty-column-left {
        flex: 0 0 300px;
    }
}

@media (max-width: 768px) {
    .speakers-holder {
        row-gap:40px;
    }
    .speakers-holder .item {
        flex-direction: column;
        row-gap: 30px;
    }

        .speakers-holder .item.button-container {
            row-gap:0;
        }

    .img-holder,
    .text-box,
    .empty-column-left {
        flex: 1;
    }
}
