@media screen and (max-width: 1399px) {
  footer .footer-middle > .row {
    margin-inline: -12px; }
    footer .footer-middle > .row > * {
      padding-inline: 12px; } }
@media screen and (max-width: 1199px) {
  header .navbar .logo-item {
    margin-inline: auto;
    height: 55px; }
    header .navbar .logo-item .nav-link {
      width: 240px; }
  header .dropdown-menu .dropdown-item {
    font-size: 14px;
    white-space: normal; }
  header .dropdown-menu .inner-dropdown > .dropdown-item {
    padding-right: 40px; }
  header .dropdown-menu .inner-dropdown .dropdown-item i {
    display: none; }
  header .inner-dropdown .inner-dropdown-arrow {
    display: inline-flex; }

  .banner-card {
    min-height: 650px; }
    .banner-card .banner-data {
      top: 10%;
      left: 0%; }

  .comn-title .img-to-svg {
    max-width: 32vw; }

  .comn-data .comn-data-title {
    font-size: clamp(22px, 2.4vw, 28px); }

  .community-row .recent-card > img {
    height: 480px; }

  footer .footer-middle > .row {
    margin-inline: -12px; }
    footer .footer-middle > .row > * {
      padding-inline: 12px; }
  footer .footer-middle .subscribe-form .subscribe-box > button {
    padding-inline: 20px; }
  footer .footer-middle .social-list li a {
    width: 40px;
    height: 40px;
    font-size: 16px; } }
@media screen and (max-width: 991px) {
  .comn-padding {
    padding-block: 60px; }

  .comn-title {
    margin-bottom: 40px; }
    .comn-title .img-to-svg {
      max-width: 42vw; }

  .comn-data > p {
    font-size: 14px; }

  header .navbar {
    padding-block: 15px; }
    header .navbar .navbar-nav {
      align-items: flex-start; }
      header .navbar .navbar-nav .nav-item {
        width: 100%; }
    header .navbar .navbar-brand {
      display: block;
      max-width: 300px; }
    header .navbar .logo-item {
      display: none; }
    header .navbar .donate-btn {
      margin-left: auto; }
  header .navbar-collapse,
  header .navbar-toggler {
    order: 1; }
  header .navbar-toggler {
    border-color: var(--white-color); }
    header .navbar-toggler span {
      background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgb(255 255 255)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); }
  header .inner-dropdown .dropdown-menu {
    margin: 15px; }

  .inner-banner .banner-card {
    min-height: 200px;
    padding-bottom: 0; }

  .banner-card {
    min-height: 600px; }
    .banner-card .banner-data {
      top: 0%; }

  .community-row .recent-card > img {
    height: 360px; }
  .community-row .recent-card .recent-data {
    bottom: -125px;
    padding-inline: 15px; }
    .community-row .recent-card .recent-data > aside {
      font-size: 18px; }

  footer .footer-middle {
    padding-block: 30px; }
    footer .footer-middle > .row {
      gap: 30px 0; }
  footer .footer-bottom {
    flex-direction: column; }
    footer .footer-bottom > * {
      text-align: center; }

  .video-card {
    height: 350px; } }
@media screen and (max-width: 767px) {
  .comn-padding {
    padding-block: 40px; }

  header {
    background-color: var(--tertiary-color); }
    header .navbar .navbar-brand {
      max-width: 160px; }
    header .navbar .donate-btn {
      font-size: 10px;
      padding: 5px 11px; }
    header .navbar-toggler {
      padding: 0px 6px; }
    header .navbar-toggler-icon {
      width: 20px;
      height: 20px; }

  .banner-section::before {
    top: 0;
    height: 100%; }

  .banner-splide .splide__pagination .splide__pagination__page {
    width: 20px;
    height: 4px; }
    .banner-splide .splide__pagination .splide__pagination__page.is-active {
      width: 40px; }
  .banner-splide .splide__arrows {
    gap: 30px;
    bottom: 10px; }
    .banner-splide .splide__arrows .splide__arrow {
      width: 30px;
      height: 20px; }

  .banner-card {
    min-height: auto;
    padding-bottom: 100px; }
    .banner-card .banner-data {
      position: initial;
      padding: 20px;
      gap: 5px;
      margin-bottom: 10px; }
    .banner-card .banner-data-2 {
      position: initial; }

  .recent-row > * {
    width: 100%; }

  .community-row {
    gap: 30px; }

  .says-video {
    margin-top: 30px;
    height: auto; }
    .says-video iframe {
      height: 300px;
      vertical-align: middle; }

  header .navbar .navbar-nav {
    gap: 0; }
  header .navbar .nav-item {
    width: 100%; }
    header .navbar .nav-item .nav-link {
      font-size: 14px;
      line-height: 130%; }

  .video-card {
    height: 300px; } }
@media screen and (max-width: 575px) {
  .comn-title .img-to-svg {
    max-width: 80vw; }

  .inner-banner .banner-card {
    min-height: 100px; }

  .activities-row {
    padding: 0; }
    .activities-row::before {
      left: 0%; }
    .activities-row .activities-card {
      gap: 30px;
      padding-left: 30px; }
      .activities-row .activities-card > * {
        width: 100%; }
      .activities-row .activities-card:nth-child(even) .comn-data {
        text-align: left; }
      .activities-row .activities-card .activities-image::before {
        width: 30px;
        left: auto;
        right: 100%; }
      .activities-row .activities-card:nth-child(even) .activities-image::after,
      .activities-row .activities-card .activities-image::after {
        left: auto;
        right: calc(100% + 24px); }

  .moral-image {
    padding: 0 30px 30px;
    height: 350px; }

  .moral-image::before {
    bottom: -10%; }
  .moral-image img {
    outline: 8px solid #ecf0fe; }

  .moral-row .moral-data {
    padding: 20px 0 0 0; }

  footer {
    padding-top: 30px; }
    footer .footer-top {
      margin-bottom: 20px; }
      footer .footer-top img {
        max-width: 200px; }
    footer .footer-middle > .row {
      gap: 30px 0; }
      footer .footer-middle > .row .row {
        gap: 30px 0; }

  .video-card {
    height: 220px; } }
