@import './slider.scss';

.karta-wrapper {
  @extend .slider;

  display: flex;
  flex-direction: column;

  width: 100%;
  height: 100%;
  overflow: hidden;
}

.svg-element {
}

.svg-container {
  height: 100%;
  width: 100%;
}

.karta {
  width: 100%;
  height: 100%;

  display: flex;
  flex-direction: row;
  justify-content: flex-start;

  // &.sweden {
  //   background-image: url('./maps/sweden.png');
  // }

  // &.germany {
  //   background-image: url('./maps/germany.png');
  // }

  // &.france {
  //   background-image: url('./maps/france.png');
  // }

  // &.spain {
  //   background-image: url('./maps/spain.png');
  // }

  // &.norway {
  //   background-image: url('./maps/norway.png');
  // }
}

.score-wrapper {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
}

@import './slider.scss';

.karta-wrapper {
  @extend .slider;

  display: flex;
  flex-direction: column;
  height: 100%;
  margin: 0 auto;
  max-width: 320px;
  overflow: hidden;
  width: 100%;
}

.svg-element {
}

.svg-container {
  height: 100%;
  width: 100%;
}

.karta {
  width: 100%;
  height: 100%;

  display: flex;
  flex-direction: row;
  justify-content: flex-start;

  // &.sweden {
  //   background-image: url('./maps/sweden.png');
  // }

  // &.germany {
  //   background-image: url('./maps/germany.png');
  // }

  // &.france {
  //   background-image: url('./maps/france.png');
  // }

  // &.spain {
  //   background-image: url('./maps/spain.png');
  // }

  // &.norway {
  //   background-image: url('./maps/norway.png');
  // }
}

.score-wrapper {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
}

Add max-width to compensate for viewbox
Add max-width to compensate for viewbox
