:root{
  --primary-color: #1b6661;
  --accent-color: #c49a34;
  --third-color: #967643;
  --white-color: #ffffff;
  --black-color: #000000;
  --text-color: #3f3f3f;
  --grey-color: #6e6e6e;
  --border-color: #6d8583dc;
  --border-grey-color: #dee2e6;
  --lightprimary-color: #f0fbfc;
  --headding-font: 'Urbanist', sans-serif; 
  --accent-font: "Nunito", sans-serif;
  --text-font: 'Roboto', sans-serif;
  --secondary-color: #22c5ad;
}


@media (max-width: 1200px) {
  #card-pricing .card-body{
    padding: 2rem 1.5rem;
  }
  .plans-items .plan-item{
    font-size: 15px;
  }
}
@media (max-width: 991px) {
 /* #website-logo{
    position: static;
    top: auto;
    left: auto;
    background: transparent !important;
    border-radius: 0;
 } */
 .page-title .content-page-title h6{
  font-size: calc(0.5rem + 1vw);
}
 #nav{
    padding: 1.5rem;
}
 #website-logo{
    position: absolute;
    top: -25px;
    right: 0;
    left: auto;
    background: var(--white-color);
    border-radius: 0 0 10px 10px;
    margin: 0;
}
 #navbarSupportedContent:not(.show){
    display: flex !important;
    flex-direction: column;
    position: fixed;
    transform: translateX(-100%);
    top: 0;
    background: var(--white-color);
    height: 100vh;
    overflow: auto;
 }
  #navbarSupportedContent{
    /* display: block !important; */
    flex-direction: column;
    position: fixed;
    top: 0;
    width: 320px;
    transition: transform 0.4s, visibility 0.4s;
    will-change: transform, visibility;
    background: var(--white-color);
    height: 100vh;
    overflow: auto;
    overflow-x: hidden !important;
    left: 0;
    transform: translateX(0);
    padding: 0 1rem 1rem;
    z-index: 1;
    -webkit-box-shadow: 0.5px -0.5px 8px 4px rgba(56, 56, 56, 0.05);
    -moz-box-shadow: 0.5px -0.5px 8px 4px rgba(56, 56, 56, 0.05);
    box-shadow: 0.5px -0.5px 8px 4px rgba(56, 56, 56, 0.05);
  }
  #navbarSupportedContent::before{
    content: "";
    position: absolute;
    top: -80px;
    right: -80px;
    width: 170px;
    height: 170px;
    background: var(--primary-color);
    border-radius: 250px;
    z-index: -1;
}
  #navbarSupportedContent #website-logo{
    position: static;
    top: auto;
    left: auto;
    width: 80px;
    box-shadow: none;
  }
  #all-department{
    color: var(--white-color);
    font-size: 16px;
    font-weight: 400;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 0.8rem;
    border-radius: 8px 8px 0 0;
    background: linear-gradient(145deg, #FFD700, #DAA520, #B8860B, #FFD700);
    font-family: var(--accent-font);
    margin: 0.3rem;
    letter-spacing: 1px;
  }
  #nav-item ,#nav-item-language{
    height: 46px;
    line-height: inherit;
    padding: 0.6rem;
    border-bottom: 1px solid var(--border-grey-color);
  }
  #navbarSupportedContent #Btnnav-toggler{
    margin-top: 25px;
    margin-right: 10px;
  }
  #dropdown-menu{
    border-radius: 8px;
    -webkit-box-shadow: 0.5px -0.5px 8px 4px rgba(56, 56, 56, 0.05);
    -moz-box-shadow: 0.5px -0.5px 8px 4px rgba(56, 56, 56, 0.05);
    box-shadow: 0.5px -0.5px 8px 4px rgba(56, 56, 56, 0.05);
    margin-top: 0.6rem;
    padding: 0.3rem;
  }
  #home{
    padding: 0px 0;
        min-height: 88vh;
  }
  .content-home{
    padding: 1rem 0.2rem;
  }
}

@media (max-width: 768px) {
  .content-home p{
    font-size: 16px;
  }
  .title-section ,.howToStart .title-section{
    font-size: 28px !important;
  }
  .card-price .card-body{
    padding: 1.25rem 0.5rem;
  }
  .btnUpTop{
    animation-play-state: paused !important;
  }
  #whatsapp-icon{
    bottom: 10px;
    right: 10px;
    width: 50px;
    height: 50px;
  }
  #whatsapp-icon img{
    width: 40px;
  }
  .btnUpTop.Show{
    bottom: 10px !important;
    left: 10px;
  }
  .content-home .slogan{
    font-size: 30px;
  }
}
@media (max-width: 767px) {
  #aboutus{
    padding: 100px 0 50px;
  }
  .item{
    flex-wrap: wrap;
  }
  /* #howToStart #img-steps1{
    display: none;
} */
/* #howToStart #card-steps img{
    z-index: 2;
    position: absolute;
    max-width: 100px;
    left: 5px;
    top: 10px;
    display: block;
} */
#footer .copyright-footer ul{
  justify-content: center;
  margin-top: 0.8rem;
}
.plans-items .plan-item{
  font-size: 17px;
}

}
@media (max-width: 650px) {
  .event-details-list .list-wrap li{
    width: 100%;
}
.comment-area li{
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.comment-area li .blog-thumb-info{
    width: auto;
    padding: 15px 0 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.comment-area li .blog-content{
    width: auto;
    padding: 0;
}
.single-blog .right .post-header blockquote{
    font-size: 15px;
    padding: 15px;
}
.single-blog .right .post-header .m-title{
    font-size: 20px;
}

}
@media (max-width: 550px) {
  /* #howToStart #card-steps img{
      max-width: 70px;
  } */
  .plans-items .plan-item{
    font-size: 15px;
  }
  #howToStart .container{
    padding: 0.75rem;
  }
  .event-details-list .list-wrap li{
    width: 100%;
  }
  .single-blog .content{
    flex-direction: column;
}
.single-blog .content .left{
    width: auto;
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 1.5rem;
}
.single-blog .content .left .meta-list{
    display: flex;
    align-items: start;
    justify-content: start;
    gap: 1rem;
}
.single-blog .content .right{
    width: auto;
}
.blog-author{
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 30px 12px;
}
.blog-author .author-content {
    width: auto;
    padding: 0;
}
.blog-author .author-content p{
    font-size: 15px;
}
.comment-area li .blog-content p{
    font-size: 15px;
}
.fixed-video video{
  width: 200px !important;
  height: 200px !important;
}

}
@media (max-width: 425px) {
  .content-home p{
    font-size: 15px;
    font-weight: 400;
  }
  #btn-home{
    font-size: 15px;
    padding: 0.5rem 1.5rem;
    letter-spacing: 0;
    /* padding: ; */
  }
  .title-section {
    font-size: 22px !important;
  }
  .howToStart .title-section{
    font-size: 19px !important;
  }
  .title-form{
    font-size: 18px;
  }
  .about-imgs #website-logo img{
    width: 60px;
  }
  #card-steps{
    padding: 0.2rem;
  }
  .single-blog .content .left {
    margin-right: 30px;
}
.single-blog .content {
    padding: 30px 20px 19px;
}
}