I am currently in the process of developing a mobile application. The issue I am facing is that the text is not aligning properly and the images are not displaying fullscreen. Additionally, I want the images to adjust automatically based on whether you are viewing them on a smartphone or computer. However, I am unable to identify what mistake I might be making.

Despite all content being correctly organized within the same folder, I seem to be encountering these formatting issues.

<!DOCTYPE css> 

#top {
font-family: "Century Gothic", arial; 
font-size: 12pt;

margin: 0; 
padding: 0; 
overflow: auto;

background-color: black;
}

article {
opacity: 0.9;

border: 1px solid black;

background-image: url("slide.jpg"); 
background-repeat: no-repeat;
background-size: auto;

margin-top: 1em; 
margin-bottom: 1em;

padding-left: 0.5em; 
padding-right: 0.5em; 
padding-top: 7%; 
padding-bottom: 30em;
color: black; 


margin: auto; 
}

<article id = "Staande" class = "staande_houding">
              <!---  <img src = "hoi.jpg" id = "hoi" /> -->
        <h1> Staande houding </h1>
        <div class = "beschrijving" id = "Loodlijn"> <h3> Loodlijn </h3>

De patiënt staat .... voor of achter de optimale loodlijn. Er is een .... asymmetrie tussen de    twee zijden van het lichaam en er is een .... disbalans tussen de agonisten en antagonisten van de voor- en of achterzijde van het lichaam

<br/>
<br/>
Score:
<br/> 0-1   Erg duidelijk
<br/> 2-3   Duidelijk 
<br/> 4-5   Licht
<br/> 6-7   Optimale loodlijn, symmetrie van beide zijde van het lichaam, balans agonisten antagonisten van de voor en achterzijde van het lichaam. 
</div>
        <div class = "panel" id = "panel_loodlijn"> De patiënt staat in optimale loodlijn.  Bij het staan met goed opgebouwd lichaam nemen lichaamsdelen t.o.v. het mediane vlak een symmetrische positie in.Het lichaamsgewicht is gelijk over beide voeten verdeeld, de lengteassen van de voeten zijn een hoek van ongeveer honderdvijftig °.De benen zijn licht gestrekt op een afstand tussen beide 
        heupgewrichten. De knieën zijn nagenoeg gestrekt. Het bekken staat in de middenstand En de heupgewrichten zijn gestrekt. De normale fysiologische krommingen zijn behouden. De normale curves van de wervelkolom zijn een bocht convex naar voren cervicaal, convex naar achteren thoracaal en convex naar voren lumbaal.
        </div>

        <form>
          <input type = "radio" name = "staande_houding_globaal" value="0">
          0 </input>
          <input type = "radio" name = "staande_houding_globaal" value="1">
          1 </input>
          <input type = "radio" name = "staande_houding_globaal" value="2">
          2 </input>
          <input type = "radio" name = "staande_houding_globaal" value="3">
          3 </input>
          <input type = "radio" name = "staande_houding_globaal" value="4">
          4 </input>
          <input type = "radio" name = "staande_houding_globaal" value="5">
          5 </input>
          <input type = "radio" name = "staande_houding_globaal" value="6">
          6 </input>
          <input type = "radio" name = "staande_houding_globaal" value="7">
          7 </input>
          <input type="button" value="Volgende" onClick="history.forward()" class = "volgende" />
        </form>
        </article>

        <article id = "Staande1" class = "staande_houding">
        <h1> Staande houding </h1>
        <div class = "beschrijving" id = "Positie_van_de_enkel"> <h3>Positie van de enkel </h3>

De positie van de enkel staat .... in varus of valgusstand, of heeft een .... vergrote of verkleinde flexiehoek van 10 graden.
<br/>
<br/>
Score:
<br/> 0-1   Erg duidelijk
<br/> 2-3   Duidelijk
<br/> 4-5   Lichte, licht
<br/> 6-7   Optimaal zoals beschreven en geïllustreerd
        </div>
            <div class = "panel" id = "panel_enkelpositie"> De hielen staan ongeveer 7 à 8 cm van elkaar en de voorvoet is ongeveer 8-10° geabdiceerd t.o.v. de middellijn aan beide zijden, waardoor de totale obductie ongeveer 16-20° bedraagt. De referentielijn loopt bij de enkel iets voor de laterale malleolus en nog. Door de apex van de boog die lateraal aangegeven wordt door de art. calcanocuboidea. De dorsaalflexie van de enkel is normaal ongeveer 10° als de knie gestrekt is. </div>

        <form>
          <input type = "radio" name = "staande_houding_globaal_1" value="1">
          0 </input>
          <input type = "radio" name = "staande_houding_globaal_1" value="1">
          1 </input>
          <input type = "radio" name = "staande_houding_globaal_1" value="2">
          2 </input>
          <input type = "radio" name = "staande_houding_globaal_1" value="3">
          3 </input>
          <input type = "radio" name = "staande_houding_globaal_1" value="4">
          4 </input>
          <input type = "radio" name = "staande_houding_globaal_1" value="5">
          5 </input>
          <input type = "radio" name = "staande_houding_globaal_1" value="6">
          6 </input>
          <input type = "radio" name = "staande_houding_globaal_1" value="7">
          7</input>
          <input type="button" value="Volgende" onClick="history.forward()" class = "volgende" />
        </form>