body{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 18px;
    background-color: tan;
}
h1{
    text-align: center;
    background-color: tan;
    color: black;
    font-weight: bolder;
}

h3{
    float: left;
    margin-left: 10px;
}

select{
  font-size: 24px;
  background-color: aquamarine;
  text-align: center;
  font-weight: bolder;
  font-family: Arial, Helvetica, sans-serif;
}
button{
  font-size: 18px;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: bolder;
  background-color: lightblue;
  color: darkblue;
}
iframe{
  width: 440px;
  height: 400;
  margin-bottom: 10px;
}
.menu{
  font-size: 18px;
  
}
@media screen and (max-width: 440px)
{
  body{
    font-size: 20px;
    font-weight: bolder;
    background-color: tan;
  }
.DerbyDinner{
  padding: 10px;
  border: 3px solid maroon;
  display: flex;
  flex-flow: column;
}
.Hubers{
  display: flex;
  flex-flow: column;
  border: 2px solid blue;
  padding: 10px;
}

.SeniorBibleStudy{
  border:2px solid darkgoldenrod;
  padding: 10px;
}
.youthGallery{
    border: 2px solid lightseagreen;
      display: flex;
      flex-flow: column;
  }
  img{
    display: flex;
    flex-wrap: nowrap;
    width: 200px;
    height: 200px;
    left-margin: 10px; 
    
  }
  .wrapper{
    border: 2px solid darkblue;
    display: flex;
    flex-flow: column;
  }
#outline{
  width: 100%; /* Makes the textarea span the full width of its container */
  height: 150px; /* Sets a fixed height */
  border-radius: 4px; /* Rounds the corners */
  background-color: #f8f8f8; /* Sets background color */
  font-size: 12px; /* Sets the font size */
  resize: none; /* Disables the user-resizable handle */
}
}
    
   

@media screen and (min-width: 900px)
{
    body{
        background-color:tan;
        font-size: large;
        font-weight:bolder;
    }
  .musicVideos{
    width: 400px;
    display: flex;
    flex-wrap:nowrap;
    flex-flow: column;
    ;
    font-size: 24px;
  }
 .youthGallery{
    display: grid;
    grid-template-columns: auto auto auto;
    padding: 10px;
  }
  img{
    width: 200px;
    height: 200px;
  }
  .SeniorBibleStudy{
  border:2px solid darkgoldenrod;
  padding: 20px;
  display: flex;
  flex-flow: row;
}
.wrapper{
 width:100%;
 display: flex;
 flex-wrap:wrap;
}
.musicVideos{
  display: flex;
  flex-wrap: wrap ;
  width: 100%;

}

#outline {
  width: 100%; /* Makes the textarea span the full width of its container */
  height: 150px; /* Sets a fixed height */
  padding: 12px; /* Adds space between text and border */
  box-sizing: border-box; /* Ensures padding/border are included in the width calculation to prevent overflow */
  border: 2px solid #ccc; /* Adds a border */
  border-radius: 4px; /* Rounds the corners */
  background-color: #f8f8f8; /* Sets background color */
  font-size: 14px; /* Sets the font size */
  resize: none; /* Disables the user-resizable handle */
}
}