html, html > * {
    display: inline-flex;
}

body {
    background-color: rgb(0,255,0);
}



@media all and (orientation: portrait) {
    #header {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        text-align: center;
        background-color: black;
        color: white;
        font-size: 1vw;

        width: 100%;
    }

    #header > p {
        font-size: 4vw;
        text-align: justify;
        margin-left: auto;
        margin-right: auto;
        width: 90%;
        font-style: italic;
    }
        
    #editorNote {
        position: absolute;
        top: 40vh;
    }
    #warning {
        position: absolute;
        top: 75vh;
        background-color: black;
        text-align: center;
        width: 100%;
    }
    #warningHeader {
        color: red;
        font-style:none ;
        font-weight: 1000;
        font-size: 15vw;
    }
    .warningBody {
        color: red;
        background-color: black;
        font-size: 5vw;
        padding: 1vw;
    }

    #main {
        margin-top: 15px;
        position: absolute;
        top: 300vh;
        width: 100%;
        
    }

    .card {
        width: 100%;
    }

    .card-img-top {
        width: 100%;
        
    }
    .card-body {
        background-color: black;
        color: white;
        width: 100%;
        font-size: 3vw;

    }
   

}