/* Container */
.container {
    position: relative;
    width: 100%;
    max-width: 400px;
  }
  
  /* Image */
  .image {
    display: block;
    width: 100%;
    height: auto;
  }
  
  /* Overlay */
  .overlay {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
    width: 100%;
    opacity: 0;
    transition: .3s ease;
  }
  
  /* Icon */
  .icon2 {
    color: #FB5849;
    font-size: 100px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    text-align: center;
  }
  
  /* User icon */
  .fafa-play-circle:hover {
    color:#FB5849;
  }
  
  /* Container2 */
  .container2 {
    position: relative;
    width: 50%;
  }
  
  /* Text */
  .text {
    color: white;
    font-size: 20px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    text-align: center;
  }
  
  /* Container5 */
  .container5 {
    margin-top: 5%;
    margin-left: 20%;
    text-align: center;
  }
  
  /* Intro section */
  #intro {
    background-image: url(images\reservation-bg.jpg);
    height: 80vh;
  }
  
  /* Media query for larger devices */
  @media (min-width: 992px) {
    #intro {
      margin-top: -58.59px;
    }
  }
  
  /* Navbar links */
  .navbar .nav-link {
    color: #fff !important;
    width: 80%;
    margin-top: 5%;
  }
  
  


















  .container10 {
    position: relative;
    width: 100%;
  text-align: center;
    margin-top: 5%;
    margin-left: 60%;
    opacity: 1;
  }
  
  .image {
    display: block;
    width: 100%;
    height: auto;
  }
  
  .overlay {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
    width: 100%;
    opacity: 0;
    transition: .3s ease;
  
  }
  
  .container10:hover .overlay {
    opacity: 1;
  }
  
  .icon {
    background-color: #FB5849;
    color: white;
    font-size: 30px;
    position: absolute;
    top: 40%;
    left: 50%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    text-align: center;
  }








  div.d4{

    position: relative;
    width: 100%;
    height: 920%;

    margin-top: 2%;


  }


  div.f1{

position: absolute;
width: 60%;
height: 20%;
margin-left: 8%;
margin-top: 1%;


  }

  table {
    border: 3px solid #ccc;
    border-collapse: collapse;
    width: 60%;
    height: 60%;
     margin-left: 5%;
     box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  }

  td {
    border: 3px solid #ccc;
    text-align: left;
    padding: 10px;
    
    color: black;
  }
  div.f2{

    position: absolute;
    width: 60%;
    height: 30%;
    margin-top: 1%;

    margin-left: 50%;
    
      }
      table.t2 {
    
        border-collapse: collapse;
        width: 60%;
        height: 60%;
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
      }
    
      td {
       
        text-align: left;
        padding: 10px;
        
        color: black;
      }

      div.f3{

        position: absolute;
        width: 60%;
        height: 30%;
        margin-left: 8%;
       
        margin-top: 12%;
      }

      table.t3 {
        border: 3px solid black;
        border-collapse: collapse;
        width: 60%;
        height: 60%;
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
      }
    
      td {
        border: 3px solid black;
        text-align: left;
        padding: 10px;
        
        color: black;
      }


      div.f4{

        position: absolute;
        width: 60%;
        height: 30%;
        margin-left: 2%;
     
        margin-left: 50%;
        margin-top: 12%;
          }


          table.t4 {
            border: 3px solid black;
            border-collapse: collapse;
            width: 60%;
            height: 60%;
            box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
          }
        
          td {
            border: 3px solid black;
            text-align: left;
            padding: 10px;
            
            color: black;
          }



          div.f5{

            position: absolute;
            width: 60%;
            height: 30%;
            margin-left: 8%;
           
            margin-top: 23%;
          }
    
          table.t5 {
            border: 3px solid black;
            border-collapse: collapse;
            width: 60%;
            height: 60%;
            box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
          }
        
          td {
            border: 3px solid black;
            text-align: left;
            padding: 10px;
            
            color: black;
          }
    
    
          div.f6{
    
            position: absolute;
            width: 60%;
            height: 20%;
            margin-left: 2%;
         
            margin-left: 50%;
            margin-top: 23%;
              }
    
    
              table.t6 {
                border: 3px solid black;
                border-collapse: collapse;
                width: 60%;
                height: 60%;
                box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
              }
            
              td {
                border: 3px solid black;
                text-align: left;
                padding: 10px;
                
                color: black;
              }


 .mb-4{
background-color:  rgba(251,88,73);






 }