@media only screen and (max-width: 768px) {


    body header {
        flex-flow: column;
    }
    body header div.left-container, body header div.right-container {
        display: flex;
        flex-flow: row;
        justify-content: space-evenly;
        align-items: center;
        flex: 1 1;
    }
    body header div.left-container {
        background-color: #1A2E4B;
        justify-content: space-around;
    }
    body header div.left-container div.logo {
        display: flex;
        justify-content: center;
        align-items: center;
        margin: 0;
        flex: 1 1;
    }
    body header div.left-container div.logo img {
        width: 60px;
    }
    body header div.left-container div.title {
        font-size: 0.7em;
        text-align: center;
    }
    body header div.left-container div#nav-open {
        display: flex;
        flex: 1 1;
        align-items: center;
        justify-content: center;
    }
    body header div.left-container div#nav-open img {
        width: 8vw;
    }

    div.list div.items, div.values div.items {
        display: block;
        word-break: break-word;
    }
    div.values div.items a:not(:first-of-type)  {
        margin-left: 0;
    }

    body main section.page-part {
        width: 100vw;
        padding: 0 0 0.5em;
    }
    body main section.page-part.disciplines, body main section.page-part.instructors {
        overflow-x: auto;
    }
    body main section.page-part.disciplines > div.content, body main section.page-part.instructors > div.content {
        flex-flow: column;
        align-items: center;
    }
    body main section.page-part.disciplines > div.content > div.card:not(:first-of-type),
    body main section.page-part.disciplines > div.content > a.card-link-parent:not(:first-of-type),
    body main section.page-part.instructors > div.content > div.card:not(:first-of-type),
    body main section.page-part.instructors > div.content > a.card-link-parent:not(:first-of-type),
    body main section.page-part.disciplines > div.content > div.labelled-card:not(:first-of-type){
        margin: 1em 0 0;
    }

    body main section.page-part div.wide-container {
        flex-flow: column;
        align-items: start;
    }
    body main section.page-part div.wide-container > div.subcontainer {
        align-items: center;
        max-width: 100%;
        width: 100%;
    }
    body main section.page-part div.wide-container > div.subcontainer:not(:first-of-type) {
        margin-top: 0.5em;
    }
    body main section.page-part div.wide-container > div.subcontainer:first-child {
        margin-right: 2em;
    }
    body main section.page-part div.wide-container > div.subcontainer > div {
        flex-flow: column;
        align-items: center;
    }
    body main section.page-part div.wide-container > div.subcontainer > div div.card:not(:first-of-type),
    body main section.page-part div.wide-container > div.subcontainer > div a.card-link-parent:not(:first-of-type){
        margin: 0.5em 0 0;
    }

    /* /discipline/[:id] */
    section.page-part.discipline div.content {
        padding: 0.2em;
    }
    section.page-part.discipline div.content > div.top-container {
        flex-flow: column;
    }

    section.page-part.discipline div.content > div.top-container > div.left-container {
        width: 95%;
        align-self: center;
    }
    section.page-part.discipline div.content > div.top-container > div.right-container {
        flex-basis: initial;
        width: 100%;
        align-self: center;
        text-align: justify;
    }
    section.page-part.discipline div.content > div.top-container > div.right-container > div:not(:first-child) {
        margin-top: 0.5em;
    }

    /* /source/[:id] */
    section.page-part.source div.content {
        flex-flow: column-reverse;
        padding: 0.2em;
    }
    section.page-part.source div.left-container {
        flex: 2 2;
        max-width: 100%;
    }
    section.page-part.source div.left-container p {
        text-align: justify;
    }
    section.page-part.source div.left-container div.wide-container > div.subcontainer {
        max-width: initial;
    }
    section.page-part.source div.right-container {
        flex-basis: 100%;
        max-width: 100%;
    }

    /* /weapon/[:id] */
    section.page-part.weapon div.content {
        flex-flow: column;
        padding: 0.2em;
    }
    section.page-part.weapon div.content div.left-container {
        flex-flow: column;
        position: relative;
        flex-basis: 100%;
        width: 100%;
    }
    section.page-part.weapon div.content div.right-container {
        flex-basis: 100%;
        width: 100%;
        text-align: justify;
    }
    section.page-part.weapon div.content div.right-container div.sources {
        flex-flow: column;
    }

    /* /instructor/[:id] */
    section.page-part.instructor div.content {
        flex-flow: column;
        padding: 0.2em;
    }
    section.page-part.instructor div.content div.left-container {
        flex-flow: column;
        position: relative;
        flex-basis: 100%;
        width: 100%;
    }
    section.page-part.instructor div.content div.right-container {
        flex-basis: 100%;
        width: 100%;
        text-align: justify;
    }
    section.page-part.instructor div.content div.right-container div.teaches > div.disciplines {
        flex-flow: column;
        align-items: center;
    }
    section.page-part.instructor div.content div.right-container div.teaches > div.disciplines > div:not(:first-of-type) {
        margin: 0.5em 0 0 0;
    }

    /* /instructor/[:id] */
    section.page-part.instructor div.content {
        flex-flow: column;
        padding: 0.2em;
    }
    section.page-part.instructor div.content div.left-container {
        flex-flow: column;
        position: relative;
        flex-basis: 100%;
        width: 100%;
    }
    section.page-part.instructor div.content div.right-container {
        flex-basis: 100%;
        width: 100%;
        text-align: justify;
    }
    section.page-part.instructor div.content div.right-container div.teaches > div.disciplines {
        flex-flow: column;
        align-items: center;
    }
    section.page-part.instructor div.content div.right-container div.teaches > div.disciplines > div:not(:first-of-type) {
        margin: 0.5em 0 0 0;
    }

    /* /author/[:id] */
    section.page-part.author div.content {
        flex-flow: column;
        padding: 0.2em;
    }
    section.page-part.author div.content div.left-container {
        flex-flow: column;
        position: relative;
        flex-basis: 100%;
        width: 100%;
    }
    section.page-part.author div.content div.right-container {
        flex-basis: 100%;
        width: 100%;
        text-align: justify;
    }
    section.page-part.author div.content div.right-container div.wrote > div.sources {
        flex-flow: column;
        align-items: center;
    }
    section.page-part.author div.content div.right-container div.wrote > div.sources > div:not(:first-of-type) {
        margin: 0.5em 0 0 0;
    }


}
