@import url('https://fonts.googleapis.com/css2?family=Kalam:wght@300;400;700&family=Roboto:ital,wght@0,400;1,400;1,500;1,700&display=swap');
/*
font-family: 'Kalam', cursive;
font-family: 'Roboto', sans-serif;
*/
.bg-body-tertiary {
    background-color: #0a0908 !important;
}
p{
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    text-align: justify;
    word-spacing: 0px;
    letter-spacing: 0px;
}
*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
h1,h2,h3,p,h4,h5,h6,span,li,a{
    color: #EAE0D5 !important;
    background: unset;
}
.nav-link {
    background-color: #22333b !important;
    color: #eae0d5 !important;
    border-radius: 10px 10px 10px 10px !important;
    transition: 0.8s !important;
    width: 131px !important;
    text-align: center !important;
    margin-right: 15px !important;
}
ul.dropdown-menu {
    background: #22333b;
}
.dropdown-item:hover{
    background: red;
    color: #05192b;
}
.nav-link:hover{
    background: none !important;
}

body{
    background:#22333B !important;
    padding: 20px;
}
header{
    background-color: #5E503F;
    color: #fff;
    padding: 5px 0;
}
header a{
    color: #fff;
    text-decoration: none;
    transition: 0.8s;
    font-weight: bold;
}
.img-thumbnail{
    background: none !important;
}
header a:hover{
    color: rgb(192, 192, 64);
}
header .contact-header{
    height: 30px;
    padding-top: 3px;
} 
header .social-media-header{
    text-align: right;
}
.fa-brands{
    background-color: transparent;
    width: 30px;
    height: 30px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
}
.fa-brands.fa-facebook-f{
    background-color: rgb(51, 51, 199);
    color: #fff;
    transition: 0.8s;
}
.fa-brands.fa-facebook-f:hover{
    background-color: #fff;
    color: rgb(35, 33, 182);
}
.fa-brands.fa-x-twitter{
    background-color: rgb(0, 0, 0);
    color: #fff;
    transition: 0.8s;
}
.fa-brands.fa-x-twitter:hover{
    background-color: #fff;
    color: rgb(0, 0, 0);
}
.fa-brands.fa-linkedin-in{
    background-color: #186dad;
    color: #fff;
    transition: 0.8s;
}
.fa-brands.fa-linkedin-in:hover{
    background-color: #fff;
    color: #186dad;
}
.fa-brands.fa-youtube{
    background-color: red;
    color: #fff;
    transition: 0.8s;
}
.fa-brands.fa-youtube:hover{
    background-color: #fff;
    color: red;
}
.fa-brands.fa-whatsapp{
    background: #46c756;
    color: #fff;
    font-weight: bold;
    font-size: larger;
    transition: 0.8s;
}
.fa-brands.fa-whatsapp:hover{
    background: #fff;
    color: #46c756;
    font-weight: bold;
    font-size: larger;
}
.nav-link{
    font-weight: bold;
}
.navbar .navbar-brand img{
    height: 70px;
    border: none;
}
.navbar .nav-link:hover{
    background-color: #fff;
    color: blue;
    transition: 0.8s;
}
.navbar .nav-link{
    background-color: transparent;
    color: #000000;
    transition: 0.8s;
}
.navbar-toggler:active,
.navbar-toggler:focus,
.navbar-toggler-icon:active,
.navbar-toggler-icon:focus,
.navbar-toggler{
    border: 0 !important;
    outline: none !important;
    box-shadow: none;
}
.navbar-nav .dropdown-menu{
    position: static;
    border: none;
    outline: none;
    box-shadow: none;
}
.dropdown-item:hover{
    color: blue;
}
.slidebar{
    margin: 0;
    padding: 0;
}
.slidebar img{
width: 100%;
height: 100%;
object-fit: cover;
}
section.slidebar h2{
    font-size: 30px;
    color: #fff;
    font-weight: 600;
}
section.slidebar p{
    color: #fff;
    font-size: 16px;
}
section.search-section{
    background-color: transparent;
    position: relative;
    z-index: 2;
    margin-top: -40px;
}
section.search-section .search-bar{
    background-color: #f8f8f8;
    padding: 20px;
    border-radius: 10px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
section.search-section .search-bar .search-destination,
section.search-section .search-bar .search-button,
section.search-section .search-bar .search-date{
    display: flex;
    min-width: 260px;
    color: #035faf;
}
section.search-section h3{
    font-size: 1.3rem;
    margin-right: 10px;
    font-weight: 400;
    align-self: center;
}
section.search-section .search-bar input.form-control,
section.search-section .search-bar .form-select{
    color: #035faf;
}
section.search-section .search-bar .search-button input.form-control{
    border-radius: 5px 0 0 5px;
}
section.search-section .search-bar .search-button button.btn.btn-warning{
    border-radius: 0 5px 5px 0;
    color: #035faf;
}
section.search-bar button{
    border-radius: 0 20px 20px 0;
    background-color:  #053e70;
    border: none;
    height: 45px;
    margin-top: -74px;
    margin-left: 900px;
    width: 60%;
}
section.search-bar button:hover{   
    background-color: #07569b;
}
section.search-bar{
    background:transparent;
    color: #2962ff;
    height: 100px;
    margin-top: -50px;
    z-index: 2;
    position: relative;
 }
 section.search-bar .search-slide{
    background-color: rgb(235, 180, 135);
    text-align: center;
    height: 100px;
    padding: 20px;
    color: #fff;
    font-weight: bold;
 }
section.spot-light{
    padding: 50px 0;
    background-color: #fff;
}
section.spot-light img{
    margin-bottom: 10px;
    width: 100%;
}
section.spot-light .img-fluid{
    border-radius: 5px;
}
section.top-destinations{
    background-color: #f1f1f1;
    margin: 0;
    padding: 50px 0;
}
section.top-destinations h1{
    font-weight: 600;
    font-size: 3rem;
    color: #0867c6;
}
section.top-destinations .destination{
    border-radius: 10px 10px 0 0;
    margin-bottom: 50px;
    position: relative;
}
section.top-destinations .destination img{
    border-radius: 10px 10px 0 0;
    width: 100%;
}
section.top-destinations .destination .caption h2{
    font-weight: 600;
    text-decoration: none;
    color: #fff;
    align-items: center;
} 
section.top-destinations .destination a{
    text-decoration: none;
    color:#ffffff;
    transition: .5s;
} 
section.top-destinations .destination a:hover{
    opacity: .7;
}
section.top-destinations .destination .caption span{
    font-weight: bold;
}
section.top-destinations .destination .thumbnail-zoom{
    width: 100%;
    height: auto;
    overflow: hidden;
}
section.top-destinations .destination .thumbnail-zoom img{
    width: 100%;
    height: auto;
    transition: .8s;
    border-radius: 10px 10px 0 0;
}
section.top-destinations .destination .thumbnail-zoom img:hover{
    scale: 1.2;
}
section.top-destinations .destination .caption{
    background-color: rgba(0, 0, 0, 0.2);
    text-align: center;
    padding: 10px;
    color: #fff;
    margin-top: -90px;
    position: absolute;
    width: 100%;
    bottom: 0;
    left: 0;
}
/*settings for Trending-Services*/
section.related-tours{
    padding: 50px 0;
}    
section h1,section.related-tours h1{
    font-weight: 600;
    font-size: 3rem;
    color: #0867c6;
}
section .trending img, section.related-tours .related-tour img{
    width: 100%;
}
section .trending, section.related-tours .related-tour{
    margin-bottom: 20px;
    transition: .5s;
}
section .trending .caption, section.related-tours .related-tour .caption{
    padding: 10px;
}
section.trending-tour .trending .caption h2, section.related-tours .related-tour .caption h2{
    font-size: 1rem;
    font-weight: 600;
    color: #053e70;
    text-align: left;
}
section.trending-tour .trending .caption a, section.related-tours .related-tour .caption a{
    text-decoration: none;
    color:#053e70 ;
    transition: .5s;
}
section.trending-tour .trending .caption a:hover, section.related-tours .related-tour .caption a:hover{
    color: #0a6bc0;
}
section.trending-tour .trending .caption .fa-star, section.related-tours .related-tour .caption .fa-star{
    color: orange;
    font-size: 14px;
}
section.trending-tour .trending .caption p, section.related-tours .related-tour .caption p{
    margin: 0;
    font-size: 13px;
    padding: 2px;
    text-align: left;
}
section.trending-tour .trending .caption .time-cost, section.related-tours .related-tour .caption .time-cost{
    padding: 10px 0;
       position: relative;
}
section.trending-tour .trending .caption .time-cost p, section.related-tours .related-tour .caption .time-cost p{
    font-size: 14px;
    margin: 3px 0;
}
section.trending-tour .trending .caption .time-cost button, 
section.related-tours .related-tour .caption .time-cost button{
    background-color: #053e70;
    font-size: 14px;
    right: 0;
    bottom: 15px;
    border: 0;
}
section.trending-tour .trending .caption .time-cost button:hover,
section.related-tours .related-tour .caption .time-cost button:hover{
    background-color: #07569b;
}
section.trending-tour .owl-theme .owl-nav,
section.related-tours  .owl-theme .owl-nav{
    margin-top: 10px;
    position: absolute;
    top: -60px;
    right: 10px;
}
.owl-carousel .owl-nav button.owl-next,
.owl-carousel .owl-nav button.owl-prev{
    background-color: #07569b;
    width: 30px;
    height: 30px;
    color: #fff;
    font-size: 26px;
    border-radius: 50%;
    display: inline-flex;
    justify-content: center;
    align-items: self-end;
}
.own-theme .owl-dots .owl-dot.active span,
.own-theme .owl-dots .owl-dot:hover span{
    background-color: #053e70;
}
/*settings for Blogs*/
section.blogs{
    margin-top: 100px;
    margin-bottom: 100px;
    padding: 50px 0;
}    
section.blogs h1{
    font-weight: 600;
    font-size: 3rem;
    color: #0867c6;
}
section.blogs .blog .photo img{
    width: 100%;
}
section.blogs .blog{
    transition: .5s;
}
.atom:hover{
    transform: scale(1.02);
    background: rgb(34 51 59);
    border-radius: 25px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
    border: 1px solid #000;
    backdrop-filter: blur(10px);
    transition: transform 0.3s, box-shadow 0.3s;
    overflow: hidden;
}
section.blogs .blog .caption {
    padding: 26px;
}
section.blogs .blog .caption h2, .caption h3{
    font-size: 1rem;
    font-weight: 600;
}
section.blogs .blog .caption h2{
    text-align: left;
    font-size: 20px;
}
section.blogs .blog .caption h2 a{
    text-decoration: none;
    transition: .5s;
}
section.blogs .blog .caption h2 a:hover{
    color: rgb(192, 192, 64);
}
section.blogs .blog .caption h3{
    font-size: 12px;
    text-align: left;
    color: #707070;
}
section.blogs .blog .caption p{
    margin: 0;
    font-size: 13px;
    padding: 2px;
    text-align: left;
}
section.blogs .blog .caption .post-date{
    position: relative;
}
section.blogs .blog .caption .post-date .author p{
    position: absolute;
    right: 45px;
    bottom: -10px;
}
section.blogs .blog .caption .post-date .author img{
    width: 30px;
    height: 30px;
    border-radius: 50%;
    position: absolute;
    right: 5px;
    bottom: -12px;
}
section.blogs .blog .caption .post-date button{
    background-color: #053e70;
    font-size: 14px;
    position: absolute;
    right: 0;
    bottom: 15px;
    border: 0;
}
section.blogs .blog .caption .post-date button:hover{
    background-color: #07569b;
}
section.blogs .owl-theme .owl-nav{
    margin-top: 10px;
    position: absolute;
    top: -60px;
    right: 10px;
    display: block;
}
.Photo{
    text-align: center;
}
.Photo img{
    height:50%;
    width: 50%;
    border-radius: 5%;
    margin-top: 100px;
}
/*section.blogs h1{
    font-weight: 600;
    font-size: 3rem;
    color: #0867c6;
}
section.blogs .blog img{
    width: 100%;
    max-height: 200px;
    min-height: 200px;
}
section.blogs .blog .caption h2{
    font-size: 1rem;
    font-weight: 600;
    color: #053e70;
    text-align: left;
}
section.blogs .blog .caption p{
    text-align: left;
    margin: 0;
    font-size: 14px;
    padding: 6px;
}
section.blogs .blog .caption .date-photo img{
    width: 36px;
  max-height: 25px;
  min-height: 25px;
  border-radius: 50px;
  display: inline-flex;
  margin-bottom: -16px;
  top: 265px;
  position: absolute;
  right: 3px;
}*/


section.blogs .owl-carousel .owl-nav button.owl-next, section.blogs .owl-carousel .owl-nav button.owl-prev {
    background-color: #0a0908;
    width: 30px;
    height: 30px;
    color: #07569b;
    font-size: 26px;
    border-radius: 50%;
    display: inline-flex
;
    justify-content: center;
    align-items: self-end;
}
section.blogs .owl-carousel .owl-dots.disabled{
    display: block;
}
section.blogs .own-theme .owl-dots .owl-dot.active span,
section.blogs .own-theme .owl-dots .owl-dot:hover span{
    background-color: #053e70;
}
section.blogs button{
    border: none;
    background-color: #053e70;
    transition: .5s;
    font-weight: 600;
    font-size: 13px;
    border-radius: 40px;
}
section.blogs button:hover{
    background-color: #07569b;
}

/*setting for testimonials*/
section.testimonials{
    color: #fff;
    background: #5E503F;
}
.bg-overlay{
    background-color: rgba(0, 0, 0, .3);
    padding: 100px 0;
}
section.testimonials .owl-carousel .owl-stage-outer {
    height: auto;
    padding-top: 50px;
    padding-bottom:40px;
}
.testimonial{
    background: #22333B !important;
}
section.testimonials h1{
    font-weight: 700;
}
section.testimonials .text-area{
    padding: 50px;
    margin-bottom: 20px;
    height: 400px;
    position: relative;
}
section.testimonials .text-area .title{
    font-family: 'Kalam', cursive;
    position: absolute;
    bottom: 30px;
    right: 30px;
}
section.testimonials .text-area h2,h3{
    color: #035faf;
    text-align: right;
}
section.testimonials .text-area h3{
    font-family: 'Roboto', sans-serif;
}
section.testimonials .figure{
    width: 100%;
    padding: 50px;
    height: 400px;
    overflow: hidden;
    background-color: #fff;
}
section.testimonials.figure img{
    /*max-width: 350px;*/
    height: auto;
}
/*Settings for scroll section*/
section.scroller{
    padding: 50px 10px;
    margin: 50px 10px
}
section.scroller h1{
    font-weight: 600;
    font-size: 2rem;
    color: #ffffff;
}
section.scroller .fa-solid{
    font-size: 2rem;
    color: #ffffff;
}
section.scroller span{
    font-size: 45px;
    font-weight: bold;
    color: #ffffff;
}
section.scroller{
    background-image: url('../images/last.jpg');
    background-size: cover;
    background-position: center center;
    background-attachment: fixed;
    filter: opacity(0.7);
    border-radius: 10px;
}
section.offers img{
    margin: 25px 0 25px 0;;
    border-radius: 35px;
    height: 300px;
}
section.offers h2{
    color: #053e70;
    margin: 45px 0 0 45px;
    font-weight: bold;
    text-align: left;
}
section.offers p{
    font-size: 13px;
    text-align: left;
    margin: 0 0 0 45px;
}
section.offers input {
    font-size: 17px;
    line-height: 36px;
    border-radius: 20px 0 0 20px;
    width: 100%;
    padding-left: 61px;
}
section.offers form{
    display: inline-flex;
    margin-top: 40px;
    margin-bottom: 30px;
}
section.offers button{
    background-color:  #053e70;
    border-radius: 0 20px 20px 0;
    border: 0;
    margin-left: -2px;
    font-size: 17px;
    line-height: 26px;
}
section.offers button:hover{
    background-color: #07569b;
}
section.associated h1{
    font-weight: 600;
    margin-bottom: 40px;
}
section.associated img{
    width: 100%;
    height: 130px;
}
section.associated{
    background-color: #f1f1f1;
    margin: 0;
    padding: 50px 0;
}
section.hot-lines h1{
    font-weight: 600;
    margin:8px;
}
section.last{
    background-color: #5E503F;
    padding: 10px;
    border-radius: 20px;
}
section.last h3{
    color: #053e70;
    font-weight: bold;
    margin: 8px;
    text-align: left;
    font-size: 23px;
}
section.last img{
    width: 150px;
    height: auto;
    padding: 0;
    border: none;
    background: none;
}
section.last p{
    margin: 0;
    font-size: 12px;
    text-align: left;
}
section.last a {
    color: #232323 !important;
    font-size: 16px;
    text-decoration: none;
    letter-spacing: 1px;
    font-weight: 700;
}
section.last a:hover{
    color: #000000;
}
section.footer p{
    text-align: center;
    font-weight: bold;
    padding: 0;
    margin-bottom: 0;
    color: #fff;
}
section.footer a{
    transition: .8s;
    color: #fff;
    text-decoration: none;
}
section.footer a:hover{
    color: rgb(192, 192, 64);
}
/*Settings for Page Contant*/
section.page-contant{
    padding: 50px 0;
}
section.page-contant::before,
section.page-sidebat::after{
    contain: "";
    display: table;
    clear: both;
}
.page-main-contant,
.page-sidebar{
    background: rgb(34 51 59);
    border-radius: 25px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
    border: none;
    backdrop-filter: blur(10px);
    transition: transform 0.3s, box-shadow 0.3s;
    padding: 17px;
}
section.page-contant .page-main-contant{
    background-color: #f7f7f7;
}
section.page-contant .page-main-contant h1{
    color: #0867c6;
    font-weight: 600;
    font-size: 3rem;
    padding: 20px 0;
}
section.page-contant h1,
section.contact-page h1{
    font-weight: 600;
    font-size: 2rem;
    color: #0867c6;
}

/*section.page-contant .page-main-contant a{
    background-color: #8d71f0;
    color: #fff;
    text-decoration: none;
    font-weight: 600;
    padding: 10px 0;
    transition: .5s;
}
section.page-contant .page-main-contant a:hover{
    background-color: #fff;
    color: #000000;
}*/

section.page-contant a{
    background-color: #0867c6;
    text-decoration: none;
    color: #fff;
    font-weight: 600;
    padding: 20px;
    margin: -3px
}
section.page-contant a.active{
    background-color: #3a99f9;
    color: #fff;
    font-weight: 600;;
}
section.page-contant .page-main-contant .tour-navbar{
    margin: 10px 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
section.page-contant .page-main-contant .sticky-top{
    top: 65px;
}
.custom-card ul li{
    list-style-type: none;
}
.custom-card li::before, .page-sidebar li::before{
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    content: "\f058";
    color: #07569b;
    margin-right: 10px;
}
.custom-card ul li{
    list-style-type: none;
}
.page-sidebar ul{
    list-style-type: none;
}
.custom-card li::before{
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    content: "\f057";
    color: #07569b;
    margin-right: 10px;
}
section.page-contant .page-main-contant img{
    margin: 20px 0;
}
section.page-contant .page-main-contant {
    background: rgb(34 51 59);
    border-radius: 25px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
    border: none;
    backdrop-filter: blur(10px);
    transition: transform 0.3s, box-shadow 0.3s;
    padding: 25px;
}
section.page-contant .page-sidebar h3{
    text-align: left;
    color: #000000;
    padding-left: 5px;
    font-size: 20px;
    padding-left: 10px;
}
section.page-contant .page-sidebar .adv h2,
section.contact-page .adv h2{
    text-align: center;
}
section.page-contant .custom-card .mission h2{
    text-align: center;
    color: #fff;
}
section.page-contant .custom-card .vision h2{
    text-align: center;
    color: #fff;
}
section.page-contant .custom-card .mission {
    background-color: #035faf;
    color: #fff;
    padding: 10px;
    transition: 0.5s;
    border-radius: 16px;
    margin: 6px;
    padding: 28px;
}
section.page-contant .custom-card .vision{
    background-color: #035faf;
    color: #fff;
    padding: 10px;
    transition: 0.5s;
    border-radius: 16px;
    margin: 6px;
    padding: 28px;
}
section.page-contant .custom-card .vision  p{
    text-align: justify;
    color: #fff;
}
section.page-contant .page-sidebar button,
section.contact-page .page-sidebar button,
section.blogs .page-sidebar button{
    border: none;
    width: 100%;
    border-radius: 5px;
}
section.page-contant .page-sidebar button:hover,
section.contact-page .page-sidebar button:hover{
    background: rgb(34 51 59);
}
section.page-contant h2,
section.contact-page h2{
    text-transform: uppercase;
    color: #053e70;
    padding: 5px;
    font-weight: 600 ;
    font-size: 1.5rem;
    margin: 0;
}
.page-sidebar ul{
    padding-left: 10px;
}
section.page-contant .page-sidebar .booking,
section.page-contant .page-sidebar .enquiry,
section.page-contant .page-sidebar .adv{
background: rgb(34 51 59);
    margin-bottom: 20px;
    padding: 10px 5px 10px 5px
}
section.page-contant  ul{
    font-weight: 600;
    color: #05192b;
    font-size: 14px;
}
section.form .enquiry button{
    margin-left: 196px;
    border: none;
    background: #053e70;
    font-weight: 600;
    margin-bottom: 12px;
}
section.form .enquiry button:hover{
    background-color: #035faf;
}
section.form .enquiry h2,
section.blogs .blog-post h2,
section.blogs .enquiry h2,
section.blogs .adv h2{
    font-weight: 600;
    text-transform: uppercase;
    color: #053e70;
    font-size: 25px;
    margin: 10px;
}
.modalfade h1{
    color: #053e70;
    text-align: center;
    font-weight: 600;
}
section.contact-page a{
    color: #053e70;
    transition: .5s;
}
section.contact-page a:hover{
    color: #07569b;
}
section.contact-page .contact a{
    text-decoration: none;
}
/*setting for blog*/
section.blogs .blog-post{
    padding: 10px;
}
section.blogs .blog-post .blog{
    padding: 5px;
}
section.blogs .page-sidebar{
    background: rgb(34 51 59);
}
section.blogs .blog-post img{
    width: 100%;
    padding: 20px 5px;
}
section.blogs .blog-post p{
    text-align: justify;
    font-size: 15px;
    padding: 5px;;
}
section.blogs .blog-post a{
    text-decoration: none;
    transition: .5s;
}
section.blogs .blog-post h1{
    font-weight: 600;
    font-size: 28px;
    color: #0867c6;
}
section.blogs .blog-post h1:hover{
    color: #07569b;
}
section.blogs .blog-post .author{
    color: #707070;
    padding: 0 40px;
}
/*settings for login page*/
.user-login{
    background-color: #fff;
    border: 1px solid #f1f1f1;
    border-radius: 20px;
    padding: 20px;
    margin: 25px;
}
.user-login img{
   width: 200px;
   height: 200px;
}
.user-login h1{
    color: #0867c6;
    font-size: 3rem;
    margin: 0 0 20px 0;
    font-weight: 600;
}
.user-login a{
    text-decoration: none;
    color: #085097;
    transition: .5s;
}
.user-login p{
    font-weight: 600;
}
.user-login a:hover{
    color: #1671c1;
}
.user-login button{
    width: 60%;
    border: 0;
    font-weight: 600;
    background: #0867c6;
    margin-bottom: 15px;
}
.user-login button:hover{
    background-color: #0e7ddd;
}
.fa-eye-slash::before {
    content: "\f070";
    position: absolute;
    right: 10px;
    top: 10px;
    z-index: 100;
}
/*settings for gallery section*/
section.gallery{
    background-color: #fff;
    padding: 10px;
}
section.gallery img{
    width: 369px;
    padding: 10px;
    height: 275px;
}

/*setting for nav bar*/
.dropdown:hover .dropdown-menu{
    display: block;
}

.wrap{
    display: flex;
}
.wrap>span{
    font-size: larger;
    margin-left: 10px;
}
button.button.mt-4 {
    border: 3px solid #ffffff;
    background: #00ff6d;
    color: #fff;
    border-radius: 10px;
    padding: 10px 30px 10px 30px;
    font-size: 21px;
    font-weight: bold;
    font-family: cursive;
    box-shadow: 0px 0px 3px 0px #000000;
}
button.button:hover {
    border: 3px solid #12ff00;
    background: #ffff;
    color: #12ff00;
    border-radius: 10px;
    padding: 10px 31px 10px 31px;
    font-size: 21px;
    font-weight: bold;
    font-family: cursive;
    box-shadow: 0px 0px 8px 0px #988e8e;
    transition: 1s;

}
.aboutme,.skills{
    margin-top: 150px;
    margin-bottom: 200px;
}
.progress{
        --bs-progress-bg: #dae3ed;
}
.Project{
    margin-bottom: 100px;
}
.view{
    border: none;
    background-color: #053e70;
    transition: .5s;
    font-weight: 600;
    font-size: 13px;
    border-radius: 10px;
    text-decoration: none;
    color: #fff;
    padding: 10px 25px 10px 25px;
}
.h-100:hover {
    box-shadow: 0px 0px 5px 1px #cacaca;
    scale: 1.03;
    transition: 1s;
}
.card-body {
    margin-top: -136px;
        background: #22333ba8;
    color: #ffffff;
}
.card-footer {
    padding: 38px;
    background: #22333b;
}
.Scroll-Option {
    margin-top: 10px;
    text-align: center;
}
.owl-carousel .owl-stage-outer{
    height: auto;
    padding-top: 100px;
    padding-bottom: 100px;
}
/* something */
.containerone {
  flex-wrap: wrap;
  width: 100%;
  padding: 100px;
}

.containerone .glass {
  position: relative;
  display: flex;
  transition: 0.5s;
  transform: rotate(calc(var(--r) * 1deg));
}

.containerone:hover .glass {
  transform: rotate(0deg);
}

.containerone .glass::before {
  position: absolute;
  bottom: 0;
  display: flex;
  width: 100%;
  height: 100%;
}
.card{
  width: 90%;
  overflow: hidden;
}
.aone{
  --r:-15;
}
.bone{
  --r:5;
}
.cone{
  --r:25;
}
.navbar-toggler{
    background: #22333b;
}
.navbar-toggler-icon {
    background-image: url(../images/menu.png);
}
.accordion-body {
  padding: var(--bs-accordion-body-padding-y) var(--bs-accordion-body-padding-x);
  background: #22333b;
  color: #e4dbd0;
}
.checkout{
    background: rgb(34 51 59);
    border-radius: 25px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
    border: none;
    backdrop-filter: blur(10px);
    transition: transform 0.3s, box-shadow 0.3s;
    padding: 25px;
}
.Contact,.Download{
    
    margin-top: 50px;
}
.notice i{
color: #ff1818;
border-radius: 50%;
background: #fff;
padding: 25px;
font-size: 20px;
border: 2px solid #ff1818;
}
.owl-carousel .owl-item img {
    width: auto;
    display: block;
    height: 100%;
}