html, body {
  position: relative;
  height: 100%;
}

body {
  background: #eee;
}

#header-swiper {
  background-color: var(--black);
}

#header-swiper .swiper {
  width: 100%;
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
}

#header-swiper .swiper .swiper-wrapper {
	font-size: 12px;
  align-items: center;
}

#header-swiper .swiper .swiper-slide {
  color: var(--white);
}

#header-swiper .swiper .swiper-slide {
  padding: 0 32px;
  text-align: center;
}

#header-swiper .swiper .swiper-button-next {
  right: 0;
}

#header-swiper .swiper .swiper-button-prev {
  left: 0;
}

#header-swiper .swiper .swiper-button-next, 
#header-swiper .swiper .swiper-button-prev {
  color: var(--white);
} 

#header-swiper .swiper .swiper-button-next:after, 
#header-swiper .swiper .swiper-button-prev:after {
  font-size: 16px;
}

#header-logo {
  padding: 8px 0;
  text-align: center;
}

#header-logo img {
  display: none;
}

#header-logo > div {
  gap: 16px;
  display: flex;
  justify-content: center;
}

#header-logo > div button {
  border: none;
  border-radius: 4px;
  padding: 6px 48px;
  color: var(--white);
  display: flex;
}

#header-logo > div > button:before {
  margin: auto 6px auto auto;
}

#header-logo > div > button:nth-child(-n+2) {
  background-color: rgb(174, 24, 24);
}

#header-logo > div > button:last-child {
  color: var(--black);
}

#header-logo > div > button:first-child:before {
  content: '';
  display: block;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1em' viewBox='0 0 512 512'%3E%3Cstyle%3Esvg%7Bfill:%23ffffff%7D%3C/style%3E%3Cpath d='M184 48H328c4.4 0 8 3.6 8 8V96H176V56c0-4.4 3.6-8 8-8zm-56 8V96H64C28.7 96 0 124.7 0 160v96H192 320 512V160c0-35.3-28.7-64-64-64H384V56c0-30.9-25.1-56-56-56H184c-30.9 0-56 25.1-56 56zM512 288H320v32c0 17.7-14.3 32-32 32H224c-17.7 0-32-14.3-32-32V288H0V416c0 35.3 28.7 64 64 64H448c35.3 0 64-28.7 64-64V288z'/%3E%3C/svg%3E");
  width: 16px;
  height: 16px;
}

#header-logo > div > button:nth-child(2):before {
  content: '';
  display: block;
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools --%3E%3Csvg width='16px' height='16px' viewBox='0 0 16 16' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' class='si-glyph si-glyph-contact-book'%3E%3Ctitle%3EContact-book%3C/title%3E%3Cdefs%3E%3C/defs%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg fill='%23FFFFFF'%3E%3Cpath d='M1.061,2.917 L2.083,2.917 L2.083,4.132 L1.061,4.132 L1.061,11.967 L2.049,11.967 L2.049,13.084 L1.061,13.084 L1.061,15.881 L12.958,15.881 L12.958,0 L1.061,0 L1.061,2.917 L1.061,2.917 Z M4.445,4.392 C4.475,4.368 4.716,4.188 4.802,4.123 L4.796,4.121 C4.804,4.118 4.808,4.117 4.813,4.114 C4.818,4.108 4.834,4.097 4.837,4.094 L4.841,4.099 C4.987,4.013 5.138,3.953 5.31,3.927 C5.772,3.859 6.109,4.339 6.328,4.614 C6.547,4.886 6.851,5.32 6.814,5.617 C6.792,5.796 6.587,5.961 6.393,6.123 L6.386,6.113 C6.333,6.17 6.099,6.409 6.079,6.441 C5.972,6.619 5.849,7.022 6.021,7.326 C6.184,7.621 6.506,8.099 6.811,8.498 C7.133,8.885 7.528,9.308 7.778,9.535 C8.04,9.772 8.471,9.755 8.673,9.697 C8.712,9.687 9.027,9.5 9.068,9.48 C9.277,9.336 9.488,9.184 9.675,9.207 C9.978,9.245 10.331,9.641 10.55,9.914 C10.769,10.188 11.163,10.626 10.983,11.046 C10.914,11.205 10.814,11.332 10.69,11.451 L10.694,11.455 L10.672,11.471 C10.668,11.475 10.666,11.479 10.666,11.479 L10.662,11.48 C10.58,11.542 10.338,11.727 10.308,11.749 C9.972,11.966 9.242,12.237 8.216,11.634 C7.455,11.185 6.62,10.423 5.823,9.471 L5.819,9.474 C5.782,9.427 5.747,9.38 5.712,9.333 C5.675,9.287 5.636,9.244 5.598,9.196 L5.602,9.193 C4.854,8.206 4.304,7.228 4.046,6.397 C3.699,5.277 4.148,4.656 4.445,4.392 L4.445,4.392 Z' class='si-glyph-fill'%3E%3C/path%3E%3Crect x='0' y='3' width='0.979' height='0.992' class='si-glyph-fill'%3E%3C/rect%3E%3Crect x='0' y='12' width='0.977' height='0.943' class='si-glyph-fill'%3E%3C/rect%3E%3Crect x='14' y='2' width='0.916' height='2.875' class='si-glyph-fill'%3E%3C/rect%3E%3Crect x='14' y='11' width='0.887' height='2.847' class='si-glyph-fill'%3E%3C/rect%3E%3Crect x='14' y='6' width='0.901' height='3.895' class='si-glyph-fill'%3E%3C/rect%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  width: 16px;
  height: 16px;
}

#header-logo > div > button:last-child:before {
  content: '';
  display: block;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' id='Layer_1' x='0px' y='0px' viewBox='0 0 512.001 512.001' style='enable-background:new 0 0 512.001 512.001;' xml:space='preserve'%3E%3Cpath style='fill:%23FF4B55;' d='M503.172,423.725H8.828c-4.875,0-8.828-3.953-8.828-8.828V97.104c0-4.875,3.953-8.828,8.828-8.828 h494.345c4.875,0,8.828,3.953,8.828,8.828v317.793C512,419.773,508.047,423.725,503.172,423.725z'/%3E%3Cg%3E%3Cpath style='fill:%23F5F5F5;' d='M253.474,225.753l13.837,18.101l21.606-7.232c1.208-0.404,2.236,0.962,1.512,2.01l-12.939,18.753 l13.555,18.314c0.758,1.024-0.224,2.423-1.444,2.059l-21.834-6.511l-13.228,18.55c-0.739,1.037-2.375,0.536-2.406-0.737 l-0.555-22.777l-21.73-6.849c-1.215-0.383-1.244-2.092-0.042-2.515l21.491-7.566l-0.202-22.783 C251.083,225.296,252.701,224.741,253.474,225.753z'/%3E%3Cpath style='fill:%23F5F5F5;' d='M176.956,326.662c-38.995,0-70.627-31.633-70.627-70.663c0-38.958,31.633-70.662,70.627-70.662 c14.508,0,27.887,4.462,39.037,12.014c1.707,1.156,3.656-1.087,2.227-2.573c-16.664-17.325-40.248-27.894-66.398-27.001 c-44.926,1.533-82.118,37.553-84.989,82.413c-3.287,51.383,37.399,94.086,88.055,94.086c24.953,0,47.379-10.432,63.393-27.112 c1.415-1.473-0.538-3.683-2.229-2.537C204.89,322.196,191.489,326.662,176.956,326.662z'/%3E%3C/g%3E%3Cg/%3E%3Cg/%3E%3Cg/%3E%3Cg/%3E%3Cg/%3E%3Cg/%3E%3Cg/%3E%3Cg/%3E%3Cg/%3E%3Cg/%3E%3Cg/%3E%3Cg/%3E%3Cg/%3E%3Cg/%3E%3Cg/%3E%3C/svg%3E");
  width: 16px;
  height: 16px;
}

#navbar {
  border-width: 1px 0;
  border-style: solid;
  border-color: #e8e8e8;
}

#navbar nav .navbar-brand img {
  width: 128px;
}

#navbar nav .navbar-toggler:focus {
  box-shadow: unset;
}

#navbar nav .offcanvas {
  width: 300px !important;
}

#navbar nav .nav-link {
  font-size: 18px;
  font-weight: 600;
  color: var(--black);
}

#main-swiper .swiper .swiper-wrapper img {
  max-height: 800px;
}

#main-swiper .swiper .swiper-pagination-bullet {
  opacity: 1;
}

#main-swiper .swiper .swiper-pagination-bullet-active {
  background: var(--dark-red);
}

#members .accordion-body {
  text-align: justify;
	display: flex;
}

#members .accordion-body img {
  border-radius: 16px;
  max-height: 200px;
  max-width: 150px;
  float: left;
  margin-right: 8px;
}

#members .accordion-body span {
  font-size: 16px;
}

footer iframe {
  height: 225px;
}

@media screen and (min-width: 992px) {
  #header-swiper .swiper .swiper-wrapper {
    font-size: 16px;
  }

  #header-swiper .swiper .swiper-button-next {
    right: 16px;
  }
  
  #header-swiper .swiper .swiper-button-prev {
    left: 16px;
  }

  #header-logo {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
  }  

  #header-logo img {
    display: block;
    max-width: 25%;
    margin-right: auto;
  }

  #navbar .navbar-brand img {
    display: none;
  }

  #main-swiper .swiper {
    height: 840px;
  }

  #main-swiper .swiper .swiper-pagination {
    bottom: 0;
  }

  #members .accordion-body img {
    max-width: 250px;
    margin-right: 24px;
  }
  
  #members .accordion-body span {
    font-size: 24px;
  }
}