@media screen and (orientation: landscape) and (max-width: 1000px) { .bsod { width: 90%; } }

@media screen and (orientation: landscape) and (max-width: 800px) { .bsod { width: 100%; } }

@media screen and (orientation: landscape) and (max-height: 600px) { .bsod { transform: scale(.75); } }

@media screen and (orientation: landscape) and (max-height: 440px) { .bsod { transform: scale(.7); } }

@media screen and (orientation: landscape) and (max-height: 400px) { .bsod { transform: scale(.6); } }

@media screen and (orientation: landscape) and (max-height: 360px) { .bsod { transform: scale(.55); } }

@media screen and (orientation: portrait) and (max-width: 767px) {
    .bsod { width: 85%; }

    h1 { font-size: 5em; }

    h2, .complete { font-size: 1.5em; }

    .QRCode { height: 6em; }

    .more_info { flex-wrap: wrap; }

    .more_info_area {
        margin: 1em 0 0 0;
        font-size: .8em;
    }

    .info_2 { margin: unset; }
}