/* Additional CSS home page */
@media (max-width: 900px){
    .main{
        margin: 10px;
        width: calc(100% - 2 * 10px);

        padding: 10px;
        
        top: 55px;
    }

    .nextcloud,
    .theory,
    .hangar,
    .reports,
    .manuals,
    .simulators,
    .supplies,
    .referencemanuals{
        flex-direction: column;
    }
    
    .nextcloudleft,         .nextcloudright,
    .theoryleft,            .theoryright,
    .hangarleft,            .hangarright,
    .reportsleft,           .reportsright,
    .manualsleft,           .manualsright,
    .simulatorsleft,        .simulatorsright,
    .suppliesleft,          .suppliesright,
    .referencemanualsleft,  .referencemanualsright{
        flex:100%;
        padding-top: 0%;
    }

    .nextcloudright img{display: none;}


    /* Jellyfin Div Properties */
    img.jellyfinimg{
        float: none;
        text-align: center;
        padding: 5px;
    }
    iframe.library{
        display: none;
    }


    
    .qrcodes{
        flex-wrap: wrap;
    }

    .qrcodes1, 
    .qrcodes2, 
    .qrcodes3,
    .qrcodes4{
        flex: 50%;
    }

    .qrcodes2{
        border-style: none none none dashed;
    }
    .qrcodes3{
        border-style: dashed none none none;
    }
    .qrcodes4{
        border-style: dashed none none dashed;
    }

    img.qrcodesimg{
        width: 75%;
    }
}