styles.scss

@import './styles/index.scss';

.main_index {
    display: flex;
    flex-flow: column nowrap;
    justify-content: space-evenly;
    align-items: center;
    padding-top: 5rem;

    .main_index__anchor {
        display: flex;
        flex-flow: column nowrap;
        align-items: center;
        padding-bottom: 10px;
        
        &:last-child {
            padding-bottom: 0px;
        }

        img {
            margin: 0 auto;
            height: 300px;
        }

    }
}

// Medium devices (tablets, 576px until 768px)
@media (min-width: $sm-width) and (max-width: $md-width) {
    .main_index {
        flex-flow: row wrap;

        .main_index__anchor {
            flex: 0 1 40%;
        }
    }
}

// Large devices (desktop, 768px and up)
@media (min-width: $md-width) {
    .main_index {
        flex-flow: row wrap;

        .main_index__anchor {
            flex: 0 1 auto;
        }
    }
}