#backgroundimage>img{
    width: 100%;
    height: 540px;
  
    margin-left: 10px;
}
#backgroundimage2{
    width: 80%;
    display: flex;
    margin: auto;
    margin-top: 35px;
}
#backgroundimage2>div{
  
    margin-top: 25px;
    width: 495px;
    height: 290px;
    border-radius: 4px;
 
   
    background-color: white;
   margin: auto;
    display: flex;
    justify-content: center;
}
#reffer{
    width:  495px;
    display: flex;
    border: 1px solid #d8d8d8;
    gap: 20px;
    margin-left: 151px;
    margin-top: -60px;
  
}

#reffer2{
    width:  495px;
  
    border: 1px solid #d8d8d8;
   
    margin-left: 685px;
    margin-top: -70px;
    border-top: none;
   
  
}
#reffer2>h2{
    
    margin-left: 16px;
  
    font-weight: bold;
    color: #10a310;
  
}
#reffer>img{
   
    margin-left: 11px;
}
.card{
    display: flex;
}
#code{
    width: 240px;
    border: 3px dashed gray;
}
#code>h2{
  margin-left: 12px;
  font-size: 23px;
  color: gray;
}
.cardtext{
    width: 400px;
    height: 203px;
    border: 1px solid #d8d8d8;
    font-size: 14px;
    font-weight: bold;
    font-family: "IBM Plex Sans";
    cursor: pointer;
  padding: 14px;

}
.cardimg{
    width: 210px;
    height: 231px;
    border: 1px solid #d8d8d8;
  
}
.cardimg>img{
    width: 100%;
    height: 100%;
}

#backgroundimage3{
    width: 80%;
    display: flex;
    margin: auto;
    margin-top: 50px ;
}

#backgroundimage3>div{

    margin-top: 25px;
    width: 495px;
    height: 270px;
    border-radius: 4px;
    border: 1px solid #d8d8d8;
    margin-bottom: 32px;
    background-color: white;
  margin: auto;
   
}

.cardimg2{
    width: 520px;
    height: 231px;
    border: 1px solid red;
}
.cardimg2>img{
    width: 100%;
    height: 100%;
}
#backgroundimage4{
    width: 80%;
    height: 455px;
    border-radius: 4px;
    margin: auto;
    margin-top: 25px;
}
   #backgroundimage4>img{
    width: 97%;
    height: 100%;
    margin-left: 15px;
}

#About{
    width: 80%;
    height: 555px;
    border-radius: 4px;
    margin: auto;
    margin-top: 25px;
  
   }

   #About>div>h3{
    font-size: 14px;
    color: #1f1f1f;
    line-height: 1.5;
    font-weight: bolder;
    padding: 10px;
   }
   #About>div>p{
    font-size: 14px;
    color: #1f1f1f;
    line-height: 1.5;
    font-weight: bolder;
    padding: 10px;
   }
   #OFFERS{
    width: 80%;
    height: 300px;
 
   
    margin: auto;
   }
   #OFFERS>h3{
    margin: 16px;
    font-size: 14px;

   }
   #OFFERS2{
    display: flex;
    margin-top: 20px;
   }
   #OFFERS2>div{
    margin: 0 16px;
   width: 290px;
   height: 190px;

   }
   #OFFERS2>div>img{
    width: 100%;
    height: 100%;
   }

   form{
    margin-top:-150px ;
    margin-left: 30%;
   }
  
   #btn{
    width: 425px;
    height: 40px;
    background-color: #e0e0e0;
    color: #a8a8a8;
    border-color: #e0e0e0;
    box-shadow: 0px 8px 15px rgb(0 0 0 / 10%);
    margin-top: 5px;
   }


   #Trip{
    display: flex;
    margin-top: 90px;
    margin-left: 25%;
    gap: 22px;
   }
   input{
    width: 360px;
   }
   #btn2{
    width: 425px;
    height: 40px;
    background-color: #e0e0e0;
    color: #a8a8a8;
    border-color: #e0e0e0;
    box-shadow: 0px 8px 15px rgb(0 0 0 / 10%);
    margin-top: 5px;
    margin-left: 35%;

    margin-top: 90px;
   }
   #City{
   
    width: 411px;
    height: 40px;
    
    border: 1px solid #e0e0e0;
    color:black;
    background-color:white;
    position: relative;
   display: flex;
   justify-content: flex-start;
   align-items: center;
   padding-left: 10px;
   margin-top: 10px;
   
    
   }