@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.8.2/font/bootstrap-icons.css");
*{
    margin: 0%;
    padding: 0%;
}
/* ====================================Header Section================================ */
.nav{
    font-weight: 500;
}
.NavColor{
    background-color:#afca20;
    
}
#textColor{
        color:#afca20;
}
.nav-item a{
    color: black;
    font-weight: bold;
}
.nav-item a:hover{
    color:rgb(109, 189, 5);
}

.ImgLogo{
    width: 200px;
    position:absolute;
    top: 0%;
    left:38%;
    z-index: 4;
}
.ImgLogo img{
    width: 200px;
    height: 155px;
}
#NavBtn{
    border: 2px solid gray;
}
#NavBtn:hover{
    background-color:#afca20;
    border: none;
    cursor: pointer;
}
.viewBtn{
    margin:20px;
}
#Decs{
    font-size: 12px;
    padding-left:180px ;
}
/* =======================================================Hero Section================================= */

.HBtn{
    cursor: pointer;
    position: relative;
    left: 80%;
    width: 200px;
    height: 35px;
    margin: 8px;
    padding: 10px;
    color: #fff;
    outline: none;
    border: none;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
}
/* ==========================================card============================== */

.col-md-3 img{
    width: 100%;
    height: 210px;
}

.MainCard{
    display: flex;
}
.card{
    width: 25%;
    margin: 10px;
    border: none;
}
.card h5{
    padding: 10px;
    font-weight: 700;
}
.card img{
    width: 100%;
    height: 210px;
}
.information{
    display: flex;
}
.info{
    padding-left: 90px;
}
.info h5{
    font-weight: 800;
}
.info li{
    font-size: 13px;

}
.hearingClr{
    padding: 20px;
    background-color:#bfdbeb;
}
.headingClr h3{
    font-weight: 900;
}
#Testimonials{
    height: 25vh;
    padding-top: 30px;
    background-image: url("../img/3.JPG");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
.starTestmonials{
    color: #fff;
}

.nav-pills{
    height: 20vh;
}
.col-md-8 img{
    width: 100%;
    height: 68vh;
}
.img-item:hover{
    cursor: pointer;
    background-color: darkgreen;
    color: #fff;

}
/* ==================================footer=========================================== */
.footer{
    width:100%;
    background-color: black;
}
.footer img{
    width: 25%;
    height: 15vh;
    margin-top: 20px;
    margin-left: 20px;
}
#fnav{
    margin-top:-100px;
}
.fabout{
    margin-top:-100px;
}
.footerNav li{
    font-size: 13px; 
    list-style: none;
    padding: 0%;  
    margin: 0%;
}
.footerNav li a{
    color:whitesmoke;
}
.footerNav li a:hover{
    color:#afca20;
}
.icon img{
    width: 25px;
    height: 25px;
    position: relative;
    
    right: 0;
}
/* =======================================================resturent section================================= */
.sectionhead{
    background-image: url("../img/2.JPG");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    height: 27vh;
}
/* ===============================room section============================================= */

#room-info{
    position:relative;
    top: 0%;
    background-color: lightcoral;
}
#roomCard img{
    height: 150px;

}
/* ====================================Contact Us==================================== */

/* Captach */
input[type=text] {
    padding: 12px 20px;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
}
button{
  background-color: #4CAF50;
    border: none;
    color: white;
    padding: 12px 30px;
    text-decoration: none;
    margin: 4px 2px;
    cursor: pointer;
}
canvas{
  /*prevent interaction with the canvas*/
  pointer-events:none;
}

/* =============================================BookinPageStyle======================== */
.box{
    width: 200%;
    height: 10vh;
    font-weight: 600;
}
.box:hover{
    cursor: pointer;
    width: 100px;
}