#wrapper {
    background-color:rgb(255, 255, 255);
    font-family: "Poppins", serif; 
    font-size: 25px;
    font-style:normal;
    color: rgb(0, 0, 0);
    width: 80%;
    padding: 25px;
    margin: auto;
}
.navbar
{
  background-color: green
}
body {
  background-image: linear-gradient(#086310,#9ff3a4,white);
}
.responsive {
  width: 100%;
  height: auto;
}

.grid-container {
  display: grid;
  grid-template-columns: auto auto;
  
  padding: 10px;
}
.grid-item {
  
  
  padding: 20px;
  font-size: 30px;
  text-align: center;
}

h2 {
  text-align:center;
  color: rgb(0, 0, 0);
  font-size:60px;
  font-style:normal;
  padding: 15px;
  border-radius: 20px;
  
}


h1 {
    text-align:center;
    font-family: "Tsukimi Rounded", serif;
    font-weight: 400;
    font-size: 200px;
    color: rgb(5, 181, 61);
}


    @media only screen and (max-width: 600px) {   
       
      #wrapper {
        background-color:rgb(255, 255, 255);
        font-family: "Poppins", serif; 
        font-size: 15px;
        font-style:normal;
        color: rgb(0, 0, 0);
        width: 80%;
        padding: 25px;
        margin: auto;
    }
    .navbar
    {
      background-color: green;
      width: 100%;
      height: auto;
    }
    body {
      background-image: linear-gradient(#086310,#9ff3a4,white);
    }
    .responsive {
      width: 100%;
      height: auto;
    }
    
    .grid-container {
      display: grid;
      grid-template-columns: auto auto;
      width:100%;
      height: auto;
      
      padding: 10px;
    }
    .grid-item {
      
      
      padding: 20px;
      font-size: 30px;
      text-align: center;
    }
    
    h2 {
      text-align:center;
      color: rgb(0, 0, 0);
      font-size:30px;
      font-style:normal;
      padding: 15px;
      border-radius: 20px;
      
    }
    
    
    h1 {
        text-align:center;
        font-family: "Tsukimi Rounded", serif;
        font-weight: 400;
        font-size: 10px;
        color: rgb(5, 181, 61);
    }
    
    
    }