/* Home */
*{
    margin: 0px;
    padding: 0px;
}
#Home-Page{
    font-family: sans-serif;
}


/* Top Nav Bar */

#topNav1{
    background: linear-gradient(90deg, rgba(181,255,0,1) 0%, rgba(48,255,0,1) 50%, rgba(0,255,102,1) 100%);
}

.topA:hover{
    color: rgb(21, 255, 0);
}


/* img Slider */
#imgSlid{
    width: 100%;
    height: 100vh;
    overflow: hidden;
    position: relative;
    align-items: center;
    justify-content: center;
    display: flex;
}
.banner1, .banner2, .banner3, .banner4, .banner5{
    height:100vh;
    width:100%;
    position:absolute;
    left:0;
    top:0;
}
.img{
    width:120%;
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    animation:zoom-out 10s linear infinite;
    filter: brightness(50%);  
}
@keyframes zoom-out{
    100%{
        width:100%;
    }
}
.head{
    width: 1100px;
    position:absolute;
    top:200px;
    left: 14%;
    color:white;
}
.text-box{
    width: 1100px;
    position:absolute;
    top:200px;
    left: 14%;
    color:white;
    animation: textup 10s linear infinite;
    transform: translateY(100px);
}
@keyframes textup{
    10%{
        transform: translateY(0px);
    }
    100%{
        transform: translateY(0px);
    }
}
.head .imgSlidH1{
    margin-bottom: 40px;
    font-family: 'Lobster', 'cursive';
	font-size:100px;
    font-weight: 400;
    color: #ffffff;
    text-align: center;
    
}
.text-box p{
    font-size:24px;
    margin-top: 250px;
    text-align: center;
}
.banner1{
    animation:slide1 50s linear infinite;
}
.banner2{
    animation:slide2 50s linear infinite;
}
.banner3{
    animation:slide3 50s linear infinite;
}
.banner4{
    animation:slide4 50s linear infinite;
}
.banner5{
    animation:slide5 50s linear infinite;
}
@keyframes slide1{
    0%{
        visibility: visible;
    }
    20%{
        visibility: hidden;
    }
    40%{
        visibility: hidden;
    }
    60%{
        visibility: hidden;
    }
    80%{
        visibility: hidden;
    }
    100%{
        visibility: visible;
    }
}
@keyframes slide2{
    0%{
        visibility: hidden;
    }
    20%{
        visibility: hidden;
    }
    40%{
        visibility: visible;
    }
    60%{
        visibility: hidden;
    }
    80%{
        visibility: hidden;
    }
    100%{
        visibility: hidden;
    }
}
@keyframes slide3{
    0%{
        visibility: hidden;
    }
    20%{
        visibility: hidden;
    }
    40%{
        visibility: hidden;
    }
    60%{
        visibility: visible;
    }
    80%{
        visibility: hidden;
    }
    100%{
        visibility: hidden;
    }
}
@keyframes slide4{
    0%{
        visibility: hidden;
    }
    20%{
        visibility: hidden;
    }
    40%{
        visibility: hidden;
    }
    60%{
        visibility: hidden;
    }
    80%{
        visibility: visible;
    }
    100%{
        visibility: hidden;
    }
}
@keyframes slide5{
    0%{
        visibility: hidden;
    }
    20%{
        visibility: hidden;
    }
    40%{
        visibility: hidden;
    }
    60%{
        visibility: hidden;
    }
    80%{
        visibility: hidden;
    }
    100%{
        visibility: visible;
    }
}


/* About Us */
.about-us{
    float: left;
    height: 300px;
}
.about-top{
    text-align: center;
    padding-top: 40px;
    font-family: 'Russo One', sans-serif;
    font-weight: 400;
    font-size: 30px;
    color: rgb(111, 202, 19);
}
.about-dit{
    margin-top: 20px;
    text-align: center;
}
.about-p{
    padding-left: 50px;
    padding-right: 50px;
    font-family: sans-serif;
    font-size: 20px;
    font-weight: 500;
    letter-spacing: 0.3px;
    word-spacing: 3px;
    color: black;
}


/* Coments */
.coments{
    margin-top: 300px;
    width: 100%;
    height: 300px;
    
}
.com-reed-more{
    width: 230px;
    height: 50px;
    float: left;
    margin-top: 120px;
    margin-left: 30px;
    border-radius: 30px;
    background: linear-gradient(90deg, rgba(181,255,0,1) 0%, rgba(48,255,0,1) 50%, rgba(0,255,102,1) 100%);
    border: solid 2px;
    color: rgb(0, 0, 0);
    text-align: center;
}
.com-reed-more h1{
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 30px;
    padding-top: 2%;
}
.com-reed-more h1 a{
    text-decoration: none;
    color: black;
}
.com-ul{
    text-align: right;
    list-style: none;
}
.com-li{
    display: inline-block;
    line-height: 40px;
    margin: 20px 30px;
    background: rgb(227, 248, 196);
    border-radius: 30px;
}
.coms{
    border: 2px solid;
    color: rgb(0, 0, 0);
    border-radius: 30px;
    width: 280px;
    height: 250px;
}
.coms img{
    width: 50px;
    height: 50px;
    border: solid;
    color: black;
    border-radius: 50px;
    float: left;
    margin-left: 10px;
    margin-top: 20px;
}
.coms h1{
    float: left;
    padding-left: 30px;
    padding-top: 20px;
    font-size: 30px;
    font-weight: 600;
    font-family: 'Courier New', Courier, monospace;

}
.coms p{
    float: left;
    text-align: center;
    padding: 10px;
}
@media(max-width:1320px){
    #com3{
        display: none;
    }
}
@media(max-width:944px){
    #com2{
        display: none;
    }
}
@media(max-width:630px){
    #com1{
        display: none;
    }
    .com-reed-more{
        display: none;
    }
}


/* Stories */
#stories{
    width: 95%;
    height: 300px;
    margin-left: 30px;
    border-radius: 30px;
    border: solid;
    color: black;
    background-image: url(../images/home/dalada\ mali.jpg);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    
}
#stories h1{
    padding-left: 150px;
    font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    padding-top: 120px;
    color: #ffffff;
    font-size: 40px;
}
#stories h3{
    text-align: left;
    padding-left: 150px;
    padding-top: 20px;
    padding-right: 550px;
    color: chartreuse;
}
#stories h2{
    text-align: right;
    padding-right: 20px;
    padding-left: 10px;
    padding-top: 10px;
    margin-top: -100px;
    border: 2px solid;
    color: #000000;
    width: 200px;
    height: 40px;
    margin-left: 70%;
    border-radius: 30px;
    background: linear-gradient(90deg, rgba(181,255,0,1) 0%, rgba(48,255,0,1) 50%, rgba(0,255,102,1) 100%);
}
#stories a{
    text-decoration: none;
    color: #000000;
}
@media(max-width:1100px){
    #stories h3{
        display: none;
    }   
}
@media(max-width:900px){
    #stories h2{
        text-align: center;
        margin-left: 20%;
        margin-top: 3%;
    }   
}


/* Best Pakeg */
.dealsDiv1{
    align-items: center;
    justify-content: center;
    display: flex;
}
.pakgBody1{
    align-items: center;
    text-align: center;
    justify-content: center;
}
#pakgH2{
    text-align: center;
    padding-top: 40px;
    font-family: 'Russo One', sans-serif;
    font-weight: 400;
    font-size: 70px;
    color: rgb(111, 202, 19);

}
a{
    text-decoration: none;
}
#proBarUl{
    list-style: none;
    margin-left: 2%;
    margin-right: 2%;
}
.proBarLi{
    display: inline-block;
    margin: 5px 20px;
}
.item{
    width: 270px;
    box-shadow: 20px 20px 15px rgb(184, 184, 184);
    border-radius: 10px;
    margin: 5%;
    overflow: hidden;  
}
.slide-img{
    width: 270px;
    height: 400px;
    position: relative;
}
.slide-img img{
    width: 270px;
    height: 500px;
    object-fit: cover;
    box-sizing: border-box;
}
.detail-box{
    position: relative;
    background-color: #FFFFFF;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 5px 10px;
    box-sizing: border-box;
    font-family: sans-serif;
}
.type{
    display: flex;
    flex-direction: column;
}
.type a{
    color: #222222;
    margin: 5px 0px;
    font-weight: 700;
    letter-spacing: 0.5px;
    padding-right: 5px;
}
.text span{
    color: rgba(26, 26, 26, 0.5);
}
.price{
    color: #1e156d;
    font-weight: 600;
    font-size: 1.1rem;
    font-family: poppins; /* add font family*/
    letter-spacing: 0.5px;
}
.overlay{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
}
.buy-btn{
    width: 160px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #FFFFFF;
    color: #252525;
    font-weight: 700;
    letter-spacing: 1px;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    border-radius: 20px;
    box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.5);
}
.buy-btn:hover{
    color: #000000;
    background-color: #00ff0d;
    transition: all ease 0.3s;
}
.overlay{
    visibility: hidden;
}
.slide-img:hover .overlay{
    visibility: visible;
    animation: fade 0.5s;
}
@keyframes fade{
    0%{
        opacity: 0;
    }
    100%{
        opacity: 1;
    }
}
@media(max-width:1325px){
    #it4{
        display: none;
    }
}
@media(max-width:995px){
    #it3{
        display: none;
    }
}
@media(max-width:670px){
    #it2{
        display: none;
    }
    #it1{
        margin-left: 30%;
    }
}


/*footer*/
.down_link a{
    color: #00ff0d;
}