@media screen and (max-width: 996px) {
    .tl-img {
        display: none;
    }
}

@media screen and (max-width: 996px) and (min-width: 768px) {
    [data-section="other"] .timeline {
        padding: 20px;
    }
    .society-logo {
        position: inherit;
    }
    .timeline>div {
        padding: 0 !important;
    }
    .timeline>div>h2 {
        margin-top: 0.5em;
    }
}

@media screen and (max-width: 768px) {
    .nav-toggle {
        opacity: 1;
        visibility: visible;
    }
    aside {
        width: 300px;
        -moz-transform: translateX(-300px);
        -webkit-transform: translateX(-300px);
        -ms-transform: translateX(-300px);
        -o-transform: translateX(-300px);
        transform: translateX(-300px);
        padding-top: 4em;
    }
    main {
        width: 100%;
        padding: 0 1em;
    }
    main>section {
        padding: 2em 0 2em;
    }
    .tl-img {
        display: block;
    }
}

@media screen and (max-width: 540px) {
    .tl-img {
        display: none;
    }
    [data-section="other"] .timeline {
        padding: 20px;
    }
    .society-logo {
        position: inherit;
    }
    .timeline>div {
        padding: 0 !important;
    }
    .timeline>div>h2 {
        margin-top: 0.5em;
    }
}