.fönster {
  border-radius: 30px;
}

.topp {
  fill: #0d2c7b;
}

.låda1 {
  fill: #3573ff;
}

.låda2 {
  fill: #0d2c7b;
}

.låda3 {
  fill: #27ae62;
  fill: #38ada9;
}

.låda4 {
  fill: #ffcccd;
  fill: #f78fb3;
}

.låda1b {
  fill: #3573ff;
}

.linje1, .linje3 {
  fill: none;
  stroke-dasharray: 94 252;
  stroke-dashoffset: -159px;
  stroke-linecap: round;
  stroke-width: 10;
  stroke: #0d2c7b;
}

.linje2, .linje4 {
  fill: none;
  stroke-dasharray: 47 162;
  stroke-dashoffset: -112px;
  stroke-linecap: round;
  stroke-width: 10;
  stroke: #0d2c7b;
}

.linje3, .linje4 {
  transform: translateX(212px) translateY(106px);
}

.cirkel1 {
  fill: #fff;
  transform: scale(0);
  transform-origin: 27% 78%;
}

.cirkel2 {
  fill: #fff;
  transform: scale(0);
  transform-origin: 50% 78%;
}

.cirkel3 {
  fill: #fff;
  transform: scale(0);
  transform-origin: 73% 78%;
}

.streck1 {
  stroke: #fff;
  stroke-dasharray: 0 55;
  stroke-dashoffset: 1px;
  stroke-linecap: round;
  stroke-width: 8;
}

.streck2 {
  stroke: #fff;
  stroke-dasharray: 0 55;
  stroke-dashoffset: 1px;
  stroke-linecap: round;
  stroke-width: 8;
}

.streck3 {
  stroke: #fff;
  stroke-dasharray: 0 55;
  stroke-dashoffset: 1px;
  stroke-linecap: round;
  stroke-width: 8;
}

.spela {
  fill: #fff;
  clip-path: polygon( 63.87402% 88.293903%, 63.88292% 88.649108%, 63.86786% 89.09113%, 63.76602% 89.603761%, 63.51463% 90.170794%, 63.09949% 90.725045%, 62.6374% 91.178918%, 62.26208% 91.485585%, 62.10726% 91.598214%, 60.17412% 92.719277%, 58.24099% 93.84034%, 56.30786% 94.961403%, 54.37472% 96.082466%, 52.95361% 96.906044%, 51.5325% 97.729623%, 50.11139% 98.553201%, 48.69028% 99.376779%, 48.44328% 99.485366%, 47.84205% 99.724188%, 47.09629% 99.962836%, 46.41568% 100.0709%, 46.0314% 100.107%, 45.81054% 100.1338%, 45.41665% 100.02718%, 44.51328% 99.662994%, 43.46282% 99.021933%, 42.78029% 98.259962%, 42.41094% 97.537709%, 42.3% 97.01584%, 42.30425% 94.756254%, 42.3% 92.496669%, 42.30425% 90.237083%, 42.3% 87.977498%, 42.30425% 85.860744%, 42.3% 83.743991%, 42.30425% 81.627237%, 42.3% 79.510484%, 42.42374% 78.867588%, 42.73303% 78.284225%, 43.13499% 77.78101%, 43.5367% 77.378559%, 44.00008% 77.016141%, 44.60079% 76.667278%, 45.26659% 76.403964%, 45.9252% 76.298194%, 46.54254% 76.327194%, 47.13396% 76.420774%, 47.70136% 76.57978%, 48.24666% 76.805075%, 49.55503% 77.542014%, 51.7381% 78.826936%, 53.78746% 80.047176%, 54.69467% 80.590071%, 56.54114% 81.699688%, 58.38761% 82.809306%, 60.23408% 83.918923%, 62.08055% 85.02854%, 62.22375% 85.12548%, 62.57842% 85.405489%, 63.03219% 85.852323%, 63.4727% 86.44974%, 63.68781% 86.936997%, 63.80883% 87.446674%, 63.86211% 87.918924% );
  -webkit-clip-path: polygon( 63.87402% 88.293903%, 63.88292% 88.649108%, 63.86786% 89.09113%, 63.76602% 89.603761%, 63.51463% 90.170794%, 63.09949% 90.725045%, 62.6374% 91.178918%, 62.26208% 91.485585%, 62.10726% 91.598214%, 60.17412% 92.719277%, 58.24099% 93.84034%, 56.30786% 94.961403%, 54.37472% 96.082466%, 52.95361% 96.906044%, 51.5325% 97.729623%, 50.11139% 98.553201%, 48.69028% 99.376779%, 48.44328% 99.485366%, 47.84205% 99.724188%, 47.09629% 99.962836%, 46.41568% 100.0709%, 46.0314% 100.107%, 45.81054% 100.1338%, 45.41665% 100.02718%, 44.51328% 99.662994%, 43.46282% 99.021933%, 42.78029% 98.259962%, 42.41094% 97.537709%, 42.3% 97.01584%, 42.30425% 94.756254%, 42.3% 92.496669%, 42.30425% 90.237083%, 42.3% 87.977498%, 42.30425% 85.860744%, 42.3% 83.743991%, 42.30425% 81.627237%, 42.3% 79.510484%, 42.42374% 78.867588%, 42.73303% 78.284225%, 43.13499% 77.78101%, 43.5367% 77.378559%, 44.00008% 77.016141%, 44.60079% 76.667278%, 45.26659% 76.403964%, 45.9252% 76.298194%, 46.54254% 76.327194%, 47.13396% 76.420774%, 47.70136% 76.57978%, 48.24666% 76.805075%, 49.55503% 77.542014%, 51.7381% 78.826936%, 53.78746% 80.047176%, 54.69467% 80.590071%, 56.54114% 81.699688%, 58.38761% 82.809306%, 60.23408% 83.918923%, 62.08055% 85.02854%, 62.22375% 85.12548%, 62.57842% 85.405489%, 63.03219% 85.852323%, 63.4727% 86.44974%, 63.68781% 86.936997%, 63.80883% 87.446674%, 63.86211% 87.918924% );
  transform: translate(-104px, -158px) scale(1);
  transform-origin: 50% 78%;
}

.spela2 {
  fill: #ffcccd;
  clip-path: polygon( 63.87402% 88.293903%, 63.88292% 88.649108%, 63.86786% 89.09113%, 63.76602% 89.603761%, 63.51463% 90.170794%, 63.09949% 90.725045%, 62.6374% 91.178918%, 62.26208% 91.485585%, 62.10726% 91.598214%, 60.17412% 92.719277%, 58.24099% 93.84034%, 56.30786% 94.961403%, 54.37472% 96.082466%, 52.95361% 96.906044%, 51.5325% 97.729623%, 50.11139% 98.553201%, 48.69028% 99.376779%, 48.44328% 99.485366%, 47.84205% 99.724188%, 47.09629% 99.962836%, 46.41568% 100.0709%, 46.0314% 100.107%, 45.81054% 100.1338%, 45.41665% 100.02718%, 44.51328% 99.662994%, 43.46282% 99.021933%, 42.78029% 98.259962%, 42.41094% 97.537709%, 42.3% 97.01584%, 42.30425% 94.756254%, 42.3% 92.496669%, 42.30425% 90.237083%, 42.3% 87.977498%, 42.30425% 85.860744%, 42.3% 83.743991%, 42.30425% 81.627237%, 42.3% 79.510484%, 42.42374% 78.867588%, 42.73303% 78.284225%, 43.13499% 77.78101%, 43.5367% 77.378559%, 44.00008% 77.016141%, 44.60079% 76.667278%, 45.26659% 76.403964%, 45.9252% 76.298194%, 46.54254% 76.327194%, 47.13396% 76.420774%, 47.70136% 76.57978%, 48.24666% 76.805075%, 49.55503% 77.542014%, 51.7381% 78.826936%, 53.78746% 80.047176%, 54.69467% 80.590071%, 56.54114% 81.699688%, 58.38761% 82.809306%, 60.23408% 83.918923%, 62.08055% 85.02854%, 62.22375% 85.12548%, 62.57842% 85.405489%, 63.03219% 85.852323%, 63.4727% 86.44974%, 63.68781% 86.936997%, 63.80883% 87.446674%, 63.86211% 87.918924% );
  -webkit-clip-path: polygon( 63.87402% 88.293903%, 63.88292% 88.649108%, 63.86786% 89.09113%, 63.76602% 89.603761%, 63.51463% 90.170794%, 63.09949% 90.725045%, 62.6374% 91.178918%, 62.26208% 91.485585%, 62.10726% 91.598214%, 60.17412% 92.719277%, 58.24099% 93.84034%, 56.30786% 94.961403%, 54.37472% 96.082466%, 52.95361% 96.906044%, 51.5325% 97.729623%, 50.11139% 98.553201%, 48.69028% 99.376779%, 48.44328% 99.485366%, 47.84205% 99.724188%, 47.09629% 99.962836%, 46.41568% 100.0709%, 46.0314% 100.107%, 45.81054% 100.1338%, 45.41665% 100.02718%, 44.51328% 99.662994%, 43.46282% 99.021933%, 42.78029% 98.259962%, 42.41094% 97.537709%, 42.3% 97.01584%, 42.30425% 94.756254%, 42.3% 92.496669%, 42.30425% 90.237083%, 42.3% 87.977498%, 42.30425% 85.860744%, 42.3% 83.743991%, 42.30425% 81.627237%, 42.3% 79.510484%, 42.42374% 78.867588%, 42.73303% 78.284225%, 43.13499% 77.78101%, 43.5367% 77.378559%, 44.00008% 77.016141%, 44.60079% 76.667278%, 45.26659% 76.403964%, 45.9252% 76.298194%, 46.54254% 76.327194%, 47.13396% 76.420774%, 47.70136% 76.57978%, 48.24666% 76.805075%, 49.55503% 77.542014%, 51.7381% 78.826936%, 53.78746% 80.047176%, 54.69467% 80.590071%, 56.54114% 81.699688%, 58.38761% 82.809306%, 60.23408% 83.918923%, 62.08055% 85.02854%, 62.22375% 85.12548%, 62.57842% 85.405489%, 63.03219% 85.852323%, 63.4727% 86.44974%, 63.68781% 86.936997%, 63.80883% 87.446674%, 63.86211% 87.918924% );
  opacity: 0;
  transform: translate(4px, -8px) scale(2);
  transform-origin: 50% 78%;
}

.steg1 .linje1 {
  stroke-dasharray: 204 252;
  stroke-dashoffset: 0;
  transition: stroke-dasharray 520ms, stroke-dashoffset 520ms;
}

.steg1 .linje2 {
  stroke-dasharray: 109 162;
  stroke-dashoffset: 0;
  transition: stroke-dasharray 520ms, stroke-dashoffset 520ms;
}

.steg1 .låda3 {
  transform: translateX(-212px);
  transition: transform 520ms;
}

.steg1 .låda4 {
  transform: translateX(-212px);
  transition: transform 520ms;
}

.steg1 .cirkel1 {
  transform: scale(1);
  transition: transform 320ms 430ms cubic-bezier(0.04, 0.95, 0.36, 1.54);
}

.steg1 .cirkel2 {
  transform: scale(1);
  transition: transform 320ms 360ms cubic-bezier(0.04, 0.95, 0.36, 1.54);
}

.steg1 .cirkel3 {
  transform: scale(1);
  transition: transform 320ms 310ms cubic-bezier(0.04, 0.95, 0.36, 1.54);
}

.steg1 .spela {
  transform: translate(-316px, -158px) scale(1);
  transition: transform 520ms;
}

.steg2 .linje1 {
  stroke-dasharray: 204 252;
  stroke-dashoffset: 0;
}

.steg2 .linje2 {
  stroke-dasharray: 109 162;
  stroke-dashoffset: 0;
}

.steg2 .låda3 {
  transform: translateX(-212px);
}

.steg2 .låda4 {
  transform: translateX(-212px);
}

.steg2 .cirkel1 {
  transform: translateY(-12px);
  transition: transform 200ms 140ms cubic-bezier(0.04, 0.95, 0.36, 1.54);
}

.steg2 .cirkel2 {
  transform: translateY(-12px);
  transition: transform 200ms 60ms cubic-bezier(0.04, 0.95, 0.36, 1.54);
}

.steg2 .cirkel3 {
  transform: translateY(-12px);
  transition: transform 200ms cubic-bezier(0.04, 0.95, 0.36, 1.54);
}

.steg2 .streck1 {
  stroke-dasharray: 55 55;
  stroke-dashoffset: 0;
  transition: stroke-dasharray 200ms 140ms cubic-bezier(0.165, 0.84, 0.44, 1), stroke-dashoffset 200ms 140ms cubic-bezier(0.165, 0.84, 0.44, 1);
}

.steg2 .streck2 {
  stroke-dasharray: 55 55;
  stroke-dashoffset: 0;
  transition: stroke-dasharray 200ms 60ms cubic-bezier(0.165, 0.84, 0.44, 1), stroke-dashoffset 200ms 60ms cubic-bezier(0.165, 0.84, 0.44, 1);
}

.steg2 .streck3 {
  stroke-dasharray: 55 55;
  stroke-dashoffset: 0;
  transition: stroke-dasharray 200ms cubic-bezier(0.165, 0.84, 0.44, 1), stroke-dashoffset 200ms cubic-bezier(0.165, 0.84, 0.44, 1);
}

.steg2 .spela {
  transform: translate(4px, -8px) scale(0);
}

.steg3 .linje1 {
  stroke-dasharray: 204 252;
  stroke-dashoffset: 0;
}

.steg3 .linje2 {
  stroke-dasharray: 109 162;
  stroke-dashoffset: 0;
}

.steg3 .låda3 {
  transform: translateX(-212px);
}

.steg3 .låda4 {
  transform: translateX(-212px) translateY(-150px);
  transition: transform 480ms ease-in-out;
}

.steg3 .cirkel1 {
  transform: translateY(-162px);
  transition: transform 570ms ease-in-out;
}

.steg3 .cirkel2 {
  transform: translateY(-162px);
  transition: transform 570ms ease-in-out;
}

.steg3 .cirkel3 {
  transform: translateY(-162px);
  transition: transform 570ms ease-in-out;
}

.steg3 .streck1 {
  stroke-dasharray: 55 55;
  stroke-dashoffset: 0;
  transform: scale(1) translateY(-150px);
  transition: transform 570ms ease-in-out;
}

.steg3 .streck2 {
  stroke-dasharray: 55 55;
  stroke-dashoffset: 0;
  transform: scale(1) translateY(-150px);
  transition: transform 570ms ease-in-out;
}

.steg3 .streck3 {
  stroke-dasharray: 55 55;
  stroke-dashoffset: 0;
  transform: scale(1) translateY(-150px);
  transition: transform 570ms ease-in-out;
}

.steg3 .låda1b {
  transform: translateY(-150px);
  transition: transform 450ms 160ms ease-in-out;
}

.steg3 .spela {
  fill: #ffcccd;
  transform: translate(4px, -8px) scale(1);
  transition: transform 150ms 450ms;
}

.steg4 .låda4 {
  transform: translateX(-212px) translateY(-150px);
}

.steg4 .cirkel1 {
  transform: translateY(-162px);
}

.steg4 .cirkel2 {
  transform: translateY(-162px);
}

.steg4 .cirkel3 {
  transform: translateY(-162px);
}

.steg4 .streck1 {
  stroke-dasharray: 55 55;
  stroke-dashoffset: 0;
  transform: scale(1) translateY(-150px);
}

.steg4 .streck2 {
  stroke-dasharray: 55 55;
  stroke-dashoffset: 0;
  transform: scale(1) translateY(-150px);
}

.steg4 .streck3 {
  stroke-dasharray: 55 55;
  stroke-dashoffset: 0;
  transform: scale(1) translateY(-150px);
}

.steg4 .låda1b {
  transform: translateY(-300px);
  transition: transform 450ms ease-in-out;
}

.steg4 .spela {
  clip-path: polygon( 100% 50%, 99.74186% 55.11221%, 98.98418% 60.076744%, 97.7521% 64.868471%, 96.07075% 69.462256%, 93.96527% 73.832969%, 91.46079% 77.955475%, 88.58243% 81.804643%, 85.35534% 85.355339%, 81.80464% 88.582431%, 77.95548% 91.460785%, 73.83297% 93.96527%, 69.46226% 96.070752%, 64.86847% 97.752099%, 60.07674% 98.984178%, 55.11221% 99.741856%, 50% 100%, 44.88779% 99.741856%, 39.92326% 98.984178%, 35.13153% 97.752099%, 30.53774% 96.070752%, 26.16703% 93.96527%, 22.04453% 91.460785%, 18.19536% 88.582431%, 14.64466% 85.355339%, 11.41757% 81.804643%, 8.53922% 77.955475%, 6.03473% 73.832969%, 3.92925% 69.462256%, 2.2479% 64.868471%, 1.01582% 60.076744%, 0.25814% 55.11221%, 0% 50%, 0.25814% 44.88779%, 1.01582% 39.923256%, 2.2479% 35.131529%, 3.92925% 30.537744%, 6.03473% 26.167031%, 8.53922% 22.044525%, 11.41757% 18.195357%, 14.64466% 14.644661%, 18.19536% 11.417569%, 22.04453% 8.5392147%, 26.16703% 6.03473%, 30.53774% 3.9292479%, 35.13153% 2.247901%, 39.92326% 1.0158223%, 44.88779% 0.25814436%, 50% 0%, 55.11221% 0.25814436%, 60.07674% 1.0158223%, 64.86847% 2.247901%, 69.46226% 3.9292479%, 73.83297% 6.03473%, 77.95548% 8.5392147%, 81.80464% 11.417569%, 85.35534% 14.644661%, 88.58243% 18.195357%, 91.46079% 22.044525%, 93.96527% 26.167031%, 96.07075% 30.537744%, 97.7521% 35.131529%, 98.98418% 39.923256%, 99.74186% 44.88779% );
  -webkit-clip-path: polygon( 100% 50%, 99.74186% 55.11221%, 98.98418% 60.076744%, 97.7521% 64.868471%, 96.07075% 69.462256%, 93.96527% 73.832969%, 91.46079% 77.955475%, 88.58243% 81.804643%, 85.35534% 85.355339%, 81.80464% 88.582431%, 77.95548% 91.460785%, 73.83297% 93.96527%, 69.46226% 96.070752%, 64.86847% 97.752099%, 60.07674% 98.984178%, 55.11221% 99.741856%, 50% 100%, 44.88779% 99.741856%, 39.92326% 98.984178%, 35.13153% 97.752099%, 30.53774% 96.070752%, 26.16703% 93.96527%, 22.04453% 91.460785%, 18.19536% 88.582431%, 14.64466% 85.355339%, 11.41757% 81.804643%, 8.53922% 77.955475%, 6.03473% 73.832969%, 3.92925% 69.462256%, 2.2479% 64.868471%, 1.01582% 60.076744%, 0.25814% 55.11221%, 0% 50%, 0.25814% 44.88779%, 1.01582% 39.923256%, 2.2479% 35.131529%, 3.92925% 30.537744%, 6.03473% 26.167031%, 8.53922% 22.044525%, 11.41757% 18.195357%, 14.64466% 14.644661%, 18.19536% 11.417569%, 22.04453% 8.5392147%, 26.16703% 6.03473%, 30.53774% 3.9292479%, 35.13153% 2.247901%, 39.92326% 1.0158223%, 44.88779% 0.25814436%, 50% 0%, 55.11221% 0.25814436%, 60.07674% 1.0158223%, 64.86847% 2.247901%, 69.46226% 3.9292479%, 73.83297% 6.03473%, 77.95548% 8.5392147%, 81.80464% 11.417569%, 85.35534% 14.644661%, 88.58243% 18.195357%, 91.46079% 22.044525%, 93.96527% 26.167031%, 96.07075% 30.537744%, 97.7521% 35.131529%, 98.98418% 39.923256%, 99.74186% 44.88779% );
  fill: #fff;
  transform: translate(4px, -8px) scale(1);
  transition: clip-path 450ms ease-in-out, fill 450ms ease-in-out;
}

.steg4 .spela2 {
  opacity: 1;
  transform: translate(4px, -98px) scale(2);
  transition: opacity 250ms 200ms ease-in-out, transform 450ms ease-in-out;
}

.steg4 .låda3 {
  transform: translateX(212px);
}

.steg4 .linje1 {
  transform: translateX(212px) translateY(38px);
}

.steg4 .linje2 {
  transform: translateX(212px) translateY(38px);
}

.steg4 .cirkel1 {
  transform: translateY(-163px);
  transition: transform 450ms;
}

.steg5 .låda1b {
  transform: translate(-212px, -450px);
  transition: transform 450ms ease-in-out;
}

.steg5 .spela {
  clip-path: polygon( 63.87402% 88.293903%, 63.88292% 88.649108%, 63.86786% 89.09113%, 63.76602% 89.603761%, 63.51463% 90.170794%, 63.09949% 90.725045%, 62.6374% 91.178918%, 62.26208% 91.485585%, 62.10726% 91.598214%, 60.17412% 92.719277%, 58.24099% 93.84034%, 56.30786% 94.961403%, 54.37472% 96.082466%, 52.95361% 96.906044%, 51.5325% 97.729623%, 50.11139% 98.553201%, 48.69028% 99.376779%, 48.44328% 99.485366%, 47.84205% 99.724188%, 47.09629% 99.962836%, 46.41568% 100.0709%, 46.0314% 100.107%, 45.81054% 100.1338%, 45.41665% 100.02718%, 44.51328% 99.662994%, 43.46282% 99.021933%, 42.78029% 98.259962%, 42.41094% 97.537709%, 42.3% 97.01584%, 42.30425% 94.756254%, 42.3% 92.496669%, 42.30425% 90.237083%, 42.3% 87.977498%, 42.30425% 85.860744%, 42.3% 83.743991%, 42.30425% 81.627237%, 42.3% 79.510484%, 42.42374% 78.867588%, 42.73303% 78.284225%, 43.13499% 77.78101%, 43.5367% 77.378559%, 44.00008% 77.016141%, 44.60079% 76.667278%, 45.26659% 76.403964%, 45.9252% 76.298194%, 46.54254% 76.327194%, 47.13396% 76.420774%, 47.70136% 76.57978%, 48.24666% 76.805075%, 49.55503% 77.542014%, 51.7381% 78.826936%, 53.78746% 80.047176%, 54.69467% 80.590071%, 56.54114% 81.699688%, 58.38761% 82.809306%, 60.23408% 83.918923%, 62.08055% 85.02854%, 62.22375% 85.12548%, 62.57842% 85.405489%, 63.03219% 85.852323%, 63.4727% 86.44974%, 63.68781% 86.936997%, 63.80883% 87.446674%, 63.86211% 87.918924% );
  -webkit-clip-path: polygon( 63.87402% 88.293903%, 63.88292% 88.649108%, 63.86786% 89.09113%, 63.76602% 89.603761%, 63.51463% 90.170794%, 63.09949% 90.725045%, 62.6374% 91.178918%, 62.26208% 91.485585%, 62.10726% 91.598214%, 60.17412% 92.719277%, 58.24099% 93.84034%, 56.30786% 94.961403%, 54.37472% 96.082466%, 52.95361% 96.906044%, 51.5325% 97.729623%, 50.11139% 98.553201%, 48.69028% 99.376779%, 48.44328% 99.485366%, 47.84205% 99.724188%, 47.09629% 99.962836%, 46.41568% 100.0709%, 46.0314% 100.107%, 45.81054% 100.1338%, 45.41665% 100.02718%, 44.51328% 99.662994%, 43.46282% 99.021933%, 42.78029% 98.259962%, 42.41094% 97.537709%, 42.3% 97.01584%, 42.30425% 94.756254%, 42.3% 92.496669%, 42.30425% 90.237083%, 42.3% 87.977498%, 42.30425% 85.860744%, 42.3% 83.743991%, 42.30425% 81.627237%, 42.3% 79.510484%, 42.42374% 78.867588%, 42.73303% 78.284225%, 43.13499% 77.78101%, 43.5367% 77.378559%, 44.00008% 77.016141%, 44.60079% 76.667278%, 45.26659% 76.403964%, 45.9252% 76.298194%, 46.54254% 76.327194%, 47.13396% 76.420774%, 47.70136% 76.57978%, 48.24666% 76.805075%, 49.55503% 77.542014%, 51.7381% 78.826936%, 53.78746% 80.047176%, 54.69467% 80.590071%, 56.54114% 81.699688%, 58.38761% 82.809306%, 60.23408% 83.918923%, 62.08055% 85.02854%, 62.22375% 85.12548%, 62.57842% 85.405489%, 63.03219% 85.852323%, 63.4727% 86.44974%, 63.68781% 86.936997%, 63.80883% 87.446674%, 63.86211% 87.918924% );
  fill: #fff;
  transform: translate(-104px, -158px) scale(1);
  transition: clip-path 450ms ease-in-out, transform 450ms ease-in-out;
}

.steg5 .spela2 {
  opacity: 0;
  transform: translate(-110px, -168px) scale(1) rotate(20deg);
  transition: opacity 250ms ease-in-out, transform 450ms ease-in-out;
}

.steg5 .låda3 {
  transform: translateX(0);
  transition: transform 450ms ease-in-out;
}

.steg5 .låda4 {
  transform: translateY(150px);
}

.steg5 .linje1 {
  transform: translateX(0) translateY(38px);
  transition: transform 350ms 80ms ease-in-out;
}

.steg5 .linje2 {
  transform: translateX(0) translateY(38px);
  transition: transform 350ms 120ms ease-in-out;
}

.steg5 .linje3 {
  transform: translateX(0) translateY(106px);
  transition: transform 350ms 160ms ease-in-out;
}

.steg5 .linje4 {
  transform: translateX(0) translateY(106px);
  transition: transform 350ms 200ms ease-in-out;
}

.steg5 .cirkel1 {
  transform: translateY(-162px) scale(0);
  transition: transform 450ms;
}

.steg6 .låda4 {
  transform: translateY(0);
  transition: transform 450ms ease-in-out;
}

.steg6 .spela {
  fill: #fff;
  transform: translate(-104px, -158px) scale(1);
}

.steg6 .linje1 {
  transition: transform 450ms ease-in-out;
}

.steg6 .linje2 {
  transition: transform 450ms 50ms ease-in-out;
}

.steg6 .linje3 {
  transform: translateX(0) translateY(106px);
}

.steg6 .linje4 {
  transform: translateX(0) translateY(106px);
}

.steg6 .cirkel1 {
  transform: scale(0);
  transition: transform 450ms;
}

