.navigationbar {
    background-color: rgba(0, 0, 0, 0.267);
    width: 100%;
    height: fit-content;
    padding-top: 30px;
    margin: -10px;
    padding-left: 2%;
    position: sticky;
    top: 0;
    margin-bottom: 2%;
}

.navbutton {
    font-size: 18px;
    color:white;
    font-weight: 500;
    text-decoration: none;
    margin-left: 5%;
    display: inline;
    margin-top: 10;
    border-radius: 5px;
    border-color: greenyellow;
    border-width: 5px;
   

}
#title {
     color: #b2ff3e;
    display: inline;
    margin-right: 10%;
    margin-left: 10%;
    font-size: 60px;
}
.headings {
    
    color: #b2ff3e;
    align-content: center;
    text-align: center;
 
}
p {
    color: black;
    font-size: large;
    
}
.homecontent {
    background-color: rgba(21, 21, 21, 0.459);
    opacity: 1;
    padding-left: 5%;
    padding-right: 5%;
    border-radius: 5%;
    padding-bottom: 2%;
    padding-top: 2%;
    display: grid;
    column-count: 2;
    margin-top: 3%;
    width: 90%;
}
ul {
    color: #fff;
}
.courses {
    color:black;
    text-align: center;
    
}

.footerGrid {
  display: grid;
  grid-template-columns: 50% 50%;
  
}
.parent {
  display: grid;  
  gap: 20px; 
}
.columns {
    margin-left: 0%;
    background-color: #aaaaaabd;
    border-radius: 20px;
    margin-right: 20px;
   
    
}
.lscols {
    font-size: large;
    color: black;
    
}

.footer {
    background-color: rgb(0, 0, 0);
    padding-left: 0%;
    padding-right: 5%;
    padding-bottom: 2%;
   display: grid;
   column-count: 3;
   width: 100%;
   position: relative;
   bottom: 0;
   margin-left: -8px;
   margin-bottom: -8px;
   overflow-x: hidden; /* Ensure horizontal overflow is hidden */
   
}
.footlist {
    color: #fff;
}
#footimage {
    width: 5%;
    height: 5%;
}
body {
   background-size: cover; 
   background-image: url('PuttputtBackground.png');
   background-position: center;
   font-family: 'Tahoma' ;
   max-width: 100%;
  
  
}
.footbutton {
    color: white;
    text-decoration: nones;
}
#aboutus {
    display: grid;
    padding-left: 5%;
    padding-right: 5%;  
     text-align: center;
}
.footheading {
    color:rgb(255, 255, 255);
    display: inline-grid;
    margin-left: 40%;
    
}

#bookform {
    color: black;
    text-decoration: none;
    font-size: larger;
    background-color: rgba(0, 0, 0, 0.191);
    border-radius: 5px;
    padding: 0.7%;
}
.imgcont {
    height: 20%;
    
}

.row {
    display: flex;
    flex-wrap: wrap;
    padding: 0 4px;
  }
  
  /* Create four equal columns that sits next to each other */
  .pillar {
    flex: 25%;
    max-width: 50%;
    padding: 0 4px;
  }
  
  .pillar img {
    margin-top: 8px;
    vertical-align: middle;
    width: 100%;
  }

  .pricingimg{
    max-width: 50%;
    margin-left: 8%;
    border-color: black;
    border-style: solid;
    max-height: 50%;
   }
  
  /* Responsive layout - makes a two column-layout instead of four columns */
  @media screen and (max-width: 800px) {
    .pillar {
      flex: 50%;
      max-width: 50%;
    }
  }
  
  /* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
  @media screen and (max-width: 600px) {
    .pillar {
      flex: 100%;
      max-width: 100%;
    }
  }
  #location {
    color: #000000;
    text-decoration: underline;
  }
  #Whatsapp {
    color: #000000;
    text-decoration: none;
   margin-left: 2%;
  }
  .pricingimg{
   width: 80%;
   margin-left: 8%;
   border-color: black;
   border-style: solid;
   zoom: 300%;
  }
  .menus {
    width: 30%;
    margin-bottom: 2%;
    border: #000000 solid 2px;
  }
  #menuwrap {
    
        
        padding-left: 5%;
        padding-right: 5%;  
         text-align: center;
         padding-bottom: 0;
         
        
        
  }
  #menucol {
        margin-left: 0%;
        background-color: rgba(172, 255, 47, 0.259);
        border-radius: 20px;
        margin-right: 20px;
        height: 20%;
        
  }

  .galimg {
    border-style: solid;
    border-color: black;
  }
  @media screen and (max-width: 800px) {
  #mylinks {
    display: none;
  }
  #mylinks a{
    color: white;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
  display: block;
  }
  
  }
  .navigationbar a.icon {
   display: none;
  }
   iframe {
    width: 100%;
    height: 100%;
   }
  

  /* MOBILE CSS */
  @media screen and (max-width: 800px) {
    .navigationbar a.icon {
      display: block;
      position: absolute;
      right: 5%;
      top: 60%;
      color: white;
      overflow: hidden; 
      text-align: center;
    } 
    iframe {
      width: 100%;
      height: 90%;
    }

    .navigationbar {
      background-color: rgba(0, 0, 0, 0.267);
      width: 100%;
      height: fit-content;
      padding-top: 30px;
      margin: -10px;
      padding-left: 2%;
      position: sticky;
      top: 0;
      margin-bottom: 2%;
  }
  
  .navbutton {
      font-size: 18px;
      color:white;
      font-weight: 500;
      text-decoration: none;
      margin-left: 5%;
      display: inline;
      margin-top: 10;
      border-radius: 5px;
      border-color: greenyellow;
      border-width: 5px;
     
  
  }
  #title {
       color: #b2ff3e;
      display: inline;
      margin-right: 10%;
      margin-left: 10%;
      font-size: 60px;
  }
  .headings {
      
      color: #b2ff3e;
      align-content: center;
      text-align: center;
   
  }
  p {
      color: black;
      font-size: large;
      
  }
  .menuwraper {
    background-color: rgba(21, 21, 21, 0.459);
    opacity: 1;
    padding-left: 5%;
    padding-right: 5%;
    border-radius: 5%;
    padding-bottom: 2%;
    padding-top: 2%;
    display: grid;
    column-count: 2;
    margin-top: 3%;
    width: 88%;
}
  .homecontent {
      background-color: rgba(21, 21, 21, 0.459);
      opacity: 1;
      padding-left: 5%;
      padding-right: 5%;
      border-radius: 5%;
      padding-bottom: 2%;
      padding-top: 2%;
      display: table;
      column-count: 2;
      margin-top: 3%;
  }
  ul {
      color: #fff;
  }
  .courses {
      color:black;
      text-align: center;
      
  }
  
  .parent {
    display: grid;  
    gap: 20px; 
  }
  .columns {
      margin-left: 0%;
      background-color: #aaaaaabd;
      border-radius: 20px;
      margin-right: 20px;
      width: 100%;
      float: left;
     
      
  }
  .lscols {
      font-size: large;
      color: black;
      
  }

  .menus {
    width: 100%;
    margin-bottom: 2%;
    border: #000000 solid 2px;
  }
  
  .footer {
    background-color: rgb(0, 0, 0);
    padding-left: 0%;
    padding-bottom: 2%;
   display: grid;
   column-count: 3;
   width: 100%;
   position: relative;
   bottom: 0;
   margin-left: -8px;
   margin-bottom: -8px;
   overflow-x: hidden; /* Ensure horizontal overflow is hidden */
  }
  .footlist {
      color: #fff;
  }
  #footimage {
      width: 5%;
      height: 5%;
  }
  body {
     background-size: cover; 
     background-image: url('PuttputtBackground.png');
     background-position: center;
     font-family: 'Tahoma' ;
    
    
  }
  .footbutton {
      color: white;
      text-decoration: nones;
  }
  #aboutus {
      display: grid;
      padding-left: 5%;
      padding-right: 5%;  
       text-align: center;
  }
  .footheading {
      color:rgb(255, 255, 255);
      display: inline-grid;
      margin-left: 40%;
      
  }
  
  #bookform {
      color: black;
      text-decoration: none;
      font-size: larger;
      background-color: rgba(0, 0, 0, 0.191);
      border-radius: 5px;
      padding: 0.7%;
  }
  .imgcont {
      height: 20%;
      
  }
  
  .row {
      display: flex;
      flex-wrap: wrap;
      padding: 0 4px;
    }
    
    /* Create four equal columns that sits next to each other */
    .pillar {
      flex: 25%;
      max-width: 50%;
      padding: 0 4px;
    }
    
    .pillar img {
      margin-top: 8px;
      vertical-align: middle;
      width: 100%;
    }

    .pricingimg{
      width: 80%;
      margin-left: 8%;
      border-color: black;
      border-style: solid;
      zoom: 300%;
     }
   
  }