I am having trouble making my site responsive. I need it to fit any and all screens. Can someone help please? Thanks : Here is the CSS and HTML that I am working with.

I already tried at @media only screen.

I will copy and paste my html and css down below.

Again I need a way to make the webpage fit all screens without shifting from their original positions and layout. 

Don't worry about this gibberish they weren't letting me post a question until i used more details.
"hbg j jgv j gj gn vjf bgnfgbngrnbijrnjivnmjinvijrnbijvnejgbnijefnienijvnebijneijbniejnvijeninbitenbienbinbingbnvrgbjrbnornbijnrbijnrbgijngivijrgbjrbniutrbniurtbnibninbnirnribnirnrijnrtinrtnitninitrnirtnbrtnribntjbnitnjngiuthnibrnibnintirnjirbnijnirtijbnirtbirnbirntijgnvirngibrn"


HTML-


       <h1><img src="listening_here.png" alt="ListeningHere"></h1>
    <div class="invisible">
            <div class="first">
                <h2>What is the season?</h2>
            <div class="box">
                <select name="season">
                <option value=""></option>
                <option value="Winter">Winter</option>
                <option value="Summer">Summer</option>
                <option value="Spring">Spring</option>
                <option value="Fall">Fall</option>
                </select>     
            </div>
            </div>
        
            <div class="first">
                <h2>What is the time of day?</h2>
            <div class="box">
                <select name="season">
                <option value=""></option>
                <option value="Morning">Morning</option>
                <option value="Afternoon">Afternoon</option>
                <option value="Evening">Evening</option>
                <option value="Night">Night</option>
                </select>      
            </div>
            </div>
        
            <div class="first">
                <h2>What is the weather like?</h2>
            <div class="box"> 
                <select name="season">
                <option value=""></option>
                <option value="Sunny">Sunny</option>
                <option value="Rainy">Rainy</option>
                <option value="Cloudy">Cloudy</option>
                <option value="Snowy">Snowy</option>
                </select>  
            </div>
            </div>
        
            <div class="fourth">
                <button>Submit</button>
            </div>
    </div>
   

CSS-

        body {
         top: 0;
         bottom: 0;
         left: 0;
         right: 0;
         margin: 0;
         height: 100%;
         width: 100%;
         font-family: Lato, sans-serif;
         font color: black;
         font-weight: 400;
         background-color: #C1E5E5;
           }

        h1 {
            padding-left: 50px; 
           }
            
        h3 {
            text-align: center;
            font-size: 500%;
            font-style: normal;
            font-weight: 400;
            }

       .invisible {
            margin:auto;
            border-radius: 15px;
            background-color: whitesmoke;
            padding: 30px; 
            width: 60%;
            height: 500px; 
           }

       .first {
           height: 150px;
           width: 90%;
           float: left;
           text-align: center; 
           background-color: whitesmoke;
           }

       .second {
           height: 150px;
           width:90%;
           float: left;
           text-align: center; 
           background-color: whitesmoke;
           }

       .third {
           height: 150px;
           width:90%;
           float: left;
           text-align: center; 
           background-color: whitesmoke;
          }

       .fourth {
           height: 50px;
           width: 90%;
           float: left;
           text-align: center; 
           background-color: whitesmoke;
          }

       .center {
          display: block;
          margin-left: auto;
          margin-right: auto;
          width: 40%;
          border-radius: 8px;
         }
       .box {
          position: absolute;
          padding-left: 265px;
          padding-right: 50px;
          text-align: center;
         }

       .box select {
           background: blue;
           color: white;
           padding: 10px;
           width: 250px;
           height: 50px;
           border: none;
           font-size: 20px;
           box-shadow: 0 5px 25px rgba(0,0,0,.5);
           -webkit appearance: button;
           outline: none;   
         }