/* 
  Main custom stylesheet for Sjöqvarns Båtklubb 
  Author: Andreas Andersson
  Year: 2025
*/

/* Custom fonts Font: Libre Baskerville - graphical text Font: CourierPrime Bold - main font for the logotype */
@import url(https://fonts.googleapis.com/css?family=Open+Sans);
:root {
  --blue-dark: #1b4475;
  --blue-mid: #567FB8;
  --blue-light: #A3CAFA;
  --yellow-light: #fef6ed;
  --text-font: 'Open Sans', sans-serif;
}
@font-face {
  font-family: 'Libre Baskerville';
  src: url('fonts/LibreBaskerville-Italic.ttf') format('truetype');
  font-style: italic;
  font-weight: normal;
}
@font-face {
  font-family: 'CourierPrime Bold';
  src: url('fonts/CourierPrime-Bold.ttf') format('truetype');
  font-style: bold;
}

section {
  scroll-margin-top: 20px;
}
img {

  -webkit-tap-highlight-color: transparent;
}


.font-CourierPrime {
  font-family: 'CourierPrime Bold', serif;
}
/* Grundstil för länkar */
.navbar .nav-link {
  padding: 18px;
  font-family: "Open Sans";
  text-transform: uppercase;
  color: rgba(0, 35, 122, 0.5);
  font-size: 18px;
  text-decoration: none;
  transition: all 0.2s ease;
}

/* Hover */
.navbar .nav-link:hover {
  background: rgba(255, 255, 255, 0.1);
  color: rgba(0, 35, 122, 0.7);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1), inset 0 0 1px rgba(255, 255, 255, 0.6);
}
.navbar .btn:focus,
.navbar .navbar-toggler:focus,
.navbar .nav-link:focus {
  box-shadow: none !important;
  outline: none !important;
}


.video-bg {
  position: fixed;
  bottom: 0;
  right: 0;
  overflow: hidden;
  min-width: 100%;
  min-height: 100%;
  object-fit: cover;
  z-index: -1;
}

.custom-box-shadow {
  box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
}

/* 
=============================================================
                  SECTIONS 
=============================================================
*/
/* OM */
#about {
  background: var(--blue-dark);
  background: linear-gradient(180deg, rgba(27, 68, 117, 0.9) 50%, #fef6ed 50%, rgb(254, 229, 198) 100%);
  position: relative;
}
#about .container {
  z-index: 3;
  position: relative;
}
#about .card {
  opacity: 0 !important;
  /* !important för att överstyra Bootstrap */
  transform: translateY(50px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
#about .card.visible {
  opacity: 1 !important;
  transform: translateY(0);
}
/* AKTUELLT */
#aktuellt {
  background-color: var(--yellow-light);
  background: linear-gradient(0deg, rgba(254, 246, 237, 1) 20%, rgb(254, 229, 198) 100%);
  position: relative;
  padding-bottom: 0px; margin-bottom: 0px;
}
#aktuellt .container {
  z-index: 5;
  position: relative;
}
#aktuellt .card-img-top {
  height: 200px;
  /* justera höjden efter behov */
  object-fit: cover;
}
/* STYRELSEN */
#styrelsen .card {
  transition: all 1s ease;
}
#styrelsen .card:hover {
  transform: translateY(-10px);
  box-shadow: 0 15px 25px rgba(0, 0, 0, 0.2);
  background: radial-gradient(circle, rgb(255, 255, 255) 67%, rgba(160, 196, 255, 1) 50%);
}
#styrelsen .card:hover img {
  transform: scale(1.1);
  filter: drop-shadow(0 5px 10px rgba(0, 0, 0, 0.2));
}
#links, #styrelsen {
  background-color: var(--blue-light);
  background: linear-gradient(180deg, rgba(163, 202, 250, 1) 50%, rgba(135, 144, 226, 1) 78%, rgba(128, 149, 220, 1) 78%, rgba(86, 127, 184, 1) 100%);
}
/* GALLERI */
#gallery {
  position: relative;
  background: var(--blue-dark);
  min-height: 550px;
  overflow-x: hidden;
}
#nanogallery {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box; /* viktigt om padding används */
  overflow-x: hidden;
}
/* LÄNKAR */
#linksCarouselContainer{
  background-color: rgba(255, 255, 255, 0.3);
  border-radius: 1rem;
}
.carousel-control-prev,
.carousel-control-next{
  width: 40px;
}

#carouselLogos img {
  max-height: 80px;
  width: auto;
  object-fit: contain;
  margin-top: 10px;
}
/* FOOTER */
.footer {
  position: relative;
  bottom: 0;
  width: 100%;
  overflow: hidden;
  height: 100vh;
}
.footer-logo img {
  max-width: 100%;
  max-height: 800px;
  object-fit: cover;
  max-height: none;
  position: absolute;
  bottom: 0;
  left: 0;
}

/* 
=============================================================
                  CLASSES 
=============================================================
*/
/* TEXT */
.text-darkBlue {
  color: var(--blue-mid);
}
.footer-text {
  position: absolute;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  color: white;
  font-size: 1rem;
  text-align: center;
  background: rgba(0, 0, 0, 0.5);
  padding: 6px 12px;
  border-radius: 6px;
}
/* BUTTONS */
.btn-group-lgblue{
  background-image: linear-gradient(144deg, #1B4475, #4265f3 50%, #A3CAFA);
  border: 0;
  border-radius: 8px;
  box-shadow: rgba(151, 65, 252, 0.2) 0 15px 30px -5px;
  padding: 3px;
}
.btn-group-lgblue button{
  background-color: #0d1f36; margin-right: 2px; color: #ffffff; border: none;
}
.btn-group-lgblue button:last-child{
  margin-right: 0;
}
.btn-lgblue {
  align-items: center;
  background-image: linear-gradient(144deg, #1B4475, #4265f3 50%, #A3CAFA);
  border: 0;
  border-radius: 8px;
  box-shadow: rgba(151, 65, 252, 0.2) 0 15px 30px -5px;
  box-sizing: border-box;
  color: #ffffff;
  display: flex;
  font-size: 15px;
  justify-content: center;
  line-height: .7em;
  max-width: 100%;
  min-width: 140px;
  padding: 3px;
  text-decoration: none;
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
  white-space: nowrap;
  cursor: pointer;
  transition: all 0.3s;
}
.btn-lgblue:active, .btn-lgblue:hover {
  outline: 0;
}
.btn-lgblue span {
  background-color: #0d1f36;
  padding: 16px 24px;
  border-radius: 6px;
  width: 100%;
  height: 100%;
  transition: 300ms;
}
.btn-lgblue:hover span {
  background: none;
}
.btn-lgblue:active {
  transform: scale(0.9);
}
.carousel-control-prev-icon,
.carousel-control-next-icon {
  background-color: rgba(0, 0, 0, 0.9); /* mörk bakgrund bakom pilar */
  border-radius: 50%;
  padding: 10px;
}


/* 
=============================================================
                  RESPONSIVE 
=============================================================
*/
/* Desktop-design */
@media (min-width: 992px) {
  nav.scrolled {
    position: sticky;
    top: -60px;
    z-index: 999;
  }
  .navbar {
    max-width: 960px;
    margin: 0 auto;
    padding: 60px 0;
    background: transparent !important;
    /* ta bort Bootstraps bg */
    position: relative;
  }
  .navbar .container-fluid {
    mask-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, #ffffff 25%, #ffffff 75%, rgba(255, 255, 255, 0) 100%);
  }
  .navbar-nav {
    width: 100%;
    justify-content: center;
background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%);    box-shadow: 0 0 25px rgba(0, 0, 0, 0.1), inset 0 0 1px rgba(255, 255, 255, 0.6);
  }
  .navbar .nav-link {
    display: inline-block;
    margin-left: 20px;
    color: var(--blue-dark) !important;
  }
}

@media (min-width: 769px) and (max-width: 991px) {
  .carousel-control-prev-icon{
    right: 30px;
  }
  .carousel-control-next-icon {
    left: 30px;
  }
}
/* Mobil-design */
@media (max-width: 768px) {
  #carouselLogos {
    height: 300px;
  }
  #carouselLogos img {
    margin-top: 0px;
  }
  .carousel-control-prev-icon{
    right: 10px;
  }
  .carousel-control-next-icon {
    left: 10px;
  }
  body, section {
    overflow-x: hidden;
  }
}

/* 
=============================================================
                  SHAPE DIVIDERS 
=============================================================
*/

.custom-shape-divider-bottom-1755249965 {
  z-index: 1;
  position: absolute;
  bottom: 50%;
  left: 0;
  width: 100%;
  overflow: hidden;
  line-height: 0;
  transform: rotate(180deg);
}

.custom-shape-divider-bottom-1755249965 svg {
  position: relative;
  display: block;
  width: calc(100% + 1.3px);
  height: 114px;
}
.custom-shape-divider-bottom-1755249965 .shape-fill {
  fill: #FEF6ED;
}
.divider {
  position: relative;
  width: 100%;
  height: 100px;
  overflow: hidden;
  left: 0;
  z-index: 3;
}
.divider::before {
  content: '';
  position: absolute;
  bottom: -1px;
  left: -1px;
  right: -1px;
  top: -1px;
  z-index: 3;
  background-size: 100% 36px;
  background-position: 50% 0%;
  width: 100%;
  pointer-events: none;
  background-repeat: no-repeat;
  background-size: cover;
}

/* HERO */
.shapedividers_com-1659{
  position:relative;
  opacity: 90%;
}
.shapedividers_com-1659::before{
  background-size: 100% 90px;
  background-position: 50% 100%;    
  background-image: url('data:image/svg+xml;charset=utf8, <svg preserveAspectRatio="xMidYMin slice" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2000.4 78.7"><g fill="%231b4475"><path d="M2000 20v59H0V18c12 0 23 6 33 12 10 7 19 15 29 21 28 15 65 14 91-4 10-7 19-15 29-21a80 80 0 0168-8 80 80 0 0168 8c10 6 18 14 28 21 27 18 63 19 91 4 11-6 20-14 30-21s21-12 33-12a33 33 0 014 0c12 0 23 6 33 12 10 7 19 15 29 21 28 15 65 14 92-4 9-7 18-15 28-21a80 80 0 0168-8 80 80 0 0168 8c10 6 18 14 28 21 27 18 63 19 91 4 11-6 20-14 30-21s21-12 33-12a33 33 0 015 0c11 0 22 6 32 12 10 7 19 15 30 21 28 15 64 14 91-4 10-7 18-15 28-21a80 80 0 0168-8 80 80 0 0168 8c10 6 19 14 29 21 26 18 63 19 91 4 10-6 19-14 29-21l6-3c8-5 18-9 28-9a33 33 0 014 0c12 0 23 6 32 12l30 21 3 1a87 87 0 0035 9 90 90 0 0043-8 81 81 0 0010-6l9-6c6-5 12-11 19-15a80 80 0 0168-8 80 80 0 0169 8l20 15 8 6a82 82 0 0011 6 90 90 0 0043 8 87 87 0 0035-9l2-1 30-21a79 79 0 0120-10z" opacity=".75"/><path d="M478 79H23a33 33 0 0117-20l1-1a33 33 0 0122-1 22 22 0 0117-15 15 15 0 015-6 22 22 0 0114-2 52 52 0 0113 4l11 5c12 6 24 12 36 16 14 6 31 8 45 4l5-2a157 157 0 0041-26 151 151 0 0046 28c15 4 31 2 46-4 12-4 24-10 35-16l11-5a52 52 0 0114-4 22 22 0 0113 2 15 15 0 016 6 22 22 0 0117 15 33 33 0 0122 1l1 1a33 33 0 0117 20z" opacity=".5"/><path d="M504 79H0V65c6-10 20-16 32-12a37 37 0 019 5c8 6 15 13 24 16 12 3 25-4 35-12 7-7 15-14 23-19a43 43 0 017-3c14-5 29-1 42 5 11 5 22 12 32 18l5 2c13 7 27 11 41 8 14 3 29-1 42-8l4-2c11-6 21-13 33-18 13-6 28-10 41-5a43 43 0 017 3c9 5 16 12 24 19 10 8 22 15 35 12 9-3 16-10 24-16a37 37 0 019-5c14-5 31 5 35 19v7z"/><circle cx="59.8" cy="29.3" r="8.5"/><circle cx="159.2" cy="32.6" r="5.2"/><circle cx="375.8" cy="32.6" r="5.2"/><circle cx="435.9" cy="36.6" r="7.3"/><circle cx="106.4" cy="5.8" r="5.8" opacity=".5"/><circle cx="321.2" cy="5.8" r="5.8" opacity=".5"/><circle cx="250.3" cy="5.8" r="2.8" opacity=".75"/><path d="M982 79H527a33 33 0 0117-20l1-1a33 33 0 0122-1 22 22 0 0117-15 15 15 0 016-6 22 22 0 0113-2 52 52 0 0113 4l12 5c11 6 23 12 35 16 15 6 31 8 46 4l4-2a157 157 0 0041-26 151 151 0 0046 28c15 4 31 2 46-4 12-4 24-10 36-16l11-5a52 52 0 0113-4 22 22 0 0114 2 15 15 0 015 6 22 22 0 0117 15 33 33 0 0122 1l1 1a33 33 0 0117 20z" opacity=".5"/><path d="M1009 79H504V65c7-10 20-16 32-12a37 37 0 019 5c8 6 15 13 24 16 12 3 25-4 35-12 8-7 15-14 24-19a43 43 0 017-3c13-5 28-1 41 5 12 5 22 12 33 18l4 2c13 7 28 11 42 8 13 3 28-1 41-8l5-2c10-6 21-13 32-18 13-6 28-10 42-5a43 43 0 017 3c8 5 16 12 23 19 10 8 23 15 35 12 9-3 16-10 24-16a37 37 0 019-5c14-4 31 5 35 19l1 7z"/><circle cx="564" cy="29.3" r="8.5"/><circle cx="663.5" cy="32.6" r="5.2"/><circle cx="880.1" cy="32.6" r="5.2"/><circle cx="940.2" cy="36.6" r="7.3"/><circle cx="610.6" cy="5.8" r="5.8" opacity=".5"/><circle cx="825.5" cy="5.8" r="5.8" opacity=".5"/><circle cx="754.6" cy="5.8" r="2.8" opacity=".75"/><path d="M1486 79h-454a33 33 0 0116-20l2-1a33 33 0 0122-1 22 22 0 0116-15 15 15 0 016-6 22 22 0 0113-2 52 52 0 0114 4l11 5c12 6 23 12 35 16 15 6 31 8 46 4l5-2a157 157 0 0041-27 151 151 0 0046 29c15 4 31 2 45-4 13-4 24-10 36-16l11-5a52 52 0 0113-4 22 22 0 0114 2 15 15 0 016 6 22 22 0 0116 15 33 33 0 0122 1l1 1a33 33 0 0117 20z" opacity=".5"/><path d="M1513 79h-504V65c6-10 20-16 31-12a37 37 0 0110 5c7 6 14 13 24 16 12 3 24-4 34-12 8-7 15-14 24-19a43 43 0 017-3c14-5 29-1 42 5 11 5 21 12 32 18l5 2c13 7 27 11 41 8 14 3 28-1 41-8l5-2c11-6 21-13 32-18 13-6 28-10 42-5a43 43 0 017 3c9 5 16 12 24 19 10 8 22 15 34 12 10-3 16-10 24-16a37 37 0 0110-5c14-4 31 5 34 19l1 7z"/><circle cx="1068.3" cy="29.3" r="8.5"/><circle cx="1167.8" cy="32.6" r="5.2"/><circle cx="1384.4" cy="32.6" r="5.2"/><circle cx="1444.5" cy="36.6" r="7.3"/><circle cx="1114.9" cy="5.8" r="5.8" opacity=".5"/><circle cx="1329.8" cy="5.8" r="5.8" opacity=".5"/><circle cx="1258.9" cy="5.8" r="2.8" opacity=".75"/><path d="M1990 79h-454a33 33 0 0117-20l1-1a33 33 0 0122-1 22 22 0 0117-15 15 15 0 015-6 22 22 0 0114-2 52 52 0 0113 4l11 5c12 6 23 12 36 16 14 6 31 8 45 4l5-2a157 157 0 0041-27 151 151 0 0046 29c15 4 31 2 46-4 12-4 23-10 35-16l11-5a52 52 0 0114-4 22 22 0 0113 2 15 15 0 016 6 22 22 0 0117 15 33 33 0 0122 1l1 1a33 33 0 0116 20z" opacity=".5"/><path d="M2000 54v25h-487V65c6-10 20-16 31-12a37 37 0 0110 5c8 6 15 13 24 16 12 3 25-4 34-12l1-1 23-18a43 43 0 017-3c10-3 21-2 32 1a84 84 0 0110 4c11 5 21 12 32 18l5 2c13 7 27 11 41 8 14 3 29-1 41-8l5-2c11-6 21-13 33-18a83 83 0 019-4c10-3 22-5 32-1a43 43 0 017 3c9 5 16 12 23 18l1 1c10 8 22 15 35 12 9-3 16-10 24-16a37 37 0 019-5 26 26 0 0118 1z"/><circle cx="1572.6" cy="29.3" r="8.5"/><circle cx="1672.1" cy="32.6" r="5.2"/><circle cx="1888.7" cy="32.6" r="5.2"/><circle cx="1948.8" cy="36.6" r="7.3"/><circle cx="1619.2" cy="5.8" r="5.8" opacity=".5"/><circle cx="1834.1" cy="5.8" r="5.8" opacity=".5"/><circle cx="1763.2" cy="5.8" r="2.8" opacity=".75"/></g></svg>'); 
}

@media (min-width:768px){
  .shapedividers_com-1659::before{
    background-size: 100% 90px;
    background-position: 50% 100%;   
  }  
}
 
@media (min-width:1025px){
  .shapedividers_com-1659::before{ 
    bottom: -0.1vw;
    left: -0.1vw;
    right: -0.1vw;
    top: -0.1vw; 
    background-size: 100% 86px;
    background-position: 50% 100%;  
  }
}
@media (min-width:2100px){
  .shapedividers_com-1659::before{
    background-size: 100% calc(2vw + 86px);
  }
}

/* AKTUELLT */
.shapedividers_com-5410{
  position: absolute;
  width: 100%;
  height: 100px;
  overflow: hidden;
  left: 0;
  z-index: 3;
  bottom: 0;
}
.shapedividers_com-5410::before{
  content: '';
  position: absolute;
  bottom: -1px;
  left: -1px;
  right: -1px;
  top: -1px;
  z-index: 3;
  background-size: 100% 36px;
  background-position: 50% 0%;
  width: 100%;
  pointer-events: none;
  background-repeat: no-repeat;
  background-size: cover;
  background-size: 100% 90px;
  background-position: 50% 100%;    
  background-image: url('data:image/svg+xml;charset=utf8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 35.28 2.17" preserveAspectRatio="none"><path d="M35.28 1.67c-3.07-.55-9.27.41-16.15 0-6.87-.4-13.74-.58-19.13.1v.4h35.28z" fill="%23a3cafa"/><path d="M35.28 1.16c-3.17-.8-7.3.4-10.04.56-2.76.17-9.25-1.47-12.68-1.3-3.42.16-4.64.84-7.04.86C3.12 1.31 0 .4 0 .4v1.77h35.28z" opacity=".5" fill="%23a3cafa"/><path d="M35.28.31c-2.57.84-7.68.3-11.8.43-4.1.12-6.85.61-9.57.28C11.18.69 8.3-.16 5.3.02 2.3.22.57.85 0 .87v1.2h35.28z" opacity=".5" fill="%23a3cafa"/></svg>'); 
}
@media (min-width:768px){
  .shapedividers_com-5410::before{
    background-size: 100% 90px;
    background-position: 50% 100%;   
  }  
}
@media (min-width:1025px){
  .shapedividers_com-5410::before{ 
    left: -0.1vw;
    right: -0.1vw;
    top: -0.1vw; 
    background-size: 100% 86px;
    background-position: 50% 100%;  
  }
}
@media (min-width:2100px){
  .shapedividers_com-5410::before{
    background-size: 100% calc(2vw + 86px);
  }
}

/* GALLERY */
.shapedividers_com-7895::before{
  background-size: 100% 58px;
  background-position: 50% 0%;    
  background-image: url('data:image/svg+xml;charset=utf8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 35.28 2.17" preserveAspectRatio="none"><path d="M0 .5c3.07.55 9.27-.42 16.14 0 6.88.4 13.75.57 19.14-.11V0H0z" fill="%23567fb8"/><path d="M0 1c3.17.8 7.29-.38 10.04-.55 2.75-.17 9.25 1.47 12.67 1.3 3.43-.17 4.65-.84 7.05-.87 2.4-.02 5.52.88 5.52.88V0H0z" opacity=".5" fill="%23567fb8"/><path d="M0 1.85c2.56-.83 7.68-.3 11.79-.42 4.1-.12 6.86-.61 9.58-.28 2.73.33 5.61 1.17 8.61 1 3-.19 4.73-.82 5.3-.84V.1H0z" opacity=".5" fill="%23567fb8"/></svg>'); 
}
@media (min-width:768px){
  .shapedividers_com-7895::before{
    background-size: 100% 90px;
    background-position: 50% 0%;   
  }  
}
@media (min-width:1025px){
  .shapedividers_com-7895::before{ 
    bottom: -0.1vw;
    left: -0.1vw;
    right: -0.1vw;
    top: -0.1vw; 
    background-size: 100% 90px;
    background-position: 50% 0%;  
  }
}
@media (min-width:2100px){
  .shapedividers_com-7895::before{
    background-size: 100% calc(2vw + 90px);
  }
}
 
/* LINKS */
.shapedividers_com-930::before{
  content:'';
  font-family:'shape divider from ShapeDividers.com';
  position: absolute;
  bottom: -1px;
  left: -1px;
  right: -1px;
  top: -1px;
  z-index: 3;
  pointer-events: none;
  background-repeat: no-repeat; 
  background-size: 100% 50px;
  background-position: 50% 0%;    
  background-image: url('data:image/svg+xml;charset=utf8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 35.28 2.17" preserveAspectRatio="none"><path d="M0 .5c3.07.55 9.27-.42 16.14 0 6.88.4 13.75.57 19.14-.11V0H0z" fill="%231b4475"/><path d="M0 1c3.17.8 7.29-.38 10.04-.55 2.75-.17 9.25 1.47 12.67 1.3 3.43-.17 4.65-.84 7.05-.87 2.4-.02 5.52.88 5.52.88V0H0z" opacity=".5" fill="%231b4475"/><path d="M0 1.85c2.56-.83 7.68-.3 11.79-.42 4.1-.12 6.86-.61 9.58-.28 2.73.33 5.61 1.17 8.61 1 3-.19 4.73-.82 5.3-.84V.1H0z" opacity=".5" fill="%231b4475"/></svg>'); 
}
@media (min-width:768px){
  .shapedividers_com-930::before{
    background-size: 100% 90px;
    background-position: 50% 0%;   
  }  
}
 
@media (min-width:1025px){
  .shapedividers_com-930::before{ 
    bottom: -0.1vw;
    left: -0.1vw;
    right: -0.1vw;
    top: -0.1vw; 
    background-size: 100% 90px;
    background-position: 50% 0%;  
  }
}
@media (min-width:2100px){
  .shapedividers_com-930::before{
    background-size: 100% calc(2vw + 90px);
  }
}

/* FOOTER */
.shapedividers_com-9145::before{
  background-size: 100% 36px;
  background-position: 50% 0%;    
  background-image: url('data:image/svg+xml;charset=utf8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0.1 35.28 2.17" preserveAspectRatio="none"><path d="M0 1.85c2.56-.83 7.68-.3 11.79-.42 4.1-.12 6.86-.61 9.58-.28 2.73.33 5.61 1.17 8.61 1 3-.19 4.73-.82 5.3-.84V.1H0z" fill="%23567fb8"/></svg>'); 
}
@media (min-width:768px){
  .shapedividers_com-9145::before{
    background-size: 100% 53px;
    background-position: 50% 0%;   
  }  
}
@media (min-width:1025px){
  .shapedividers_com-9145::before{ 
    bottom: -0.1vw;
    left: -0.1vw;
    right: -0.1vw;
    top: -0.1vw; 
    background-size: 100% 90px;
    background-position: 50% 0%;  
  }
}
@media (min-width:2100px){
  .shapedividers_com-9145::before{
    background-size: 100% calc(2vw + 90px);
  }
}