CSS

*
{
	padding: 0px;
	margin: 0px;
	width: 2560px;
	max-height: 100vh;

}

body
{
	overflow: hidden;
}

p
{

	color: white;
	font-family: Brush Script MT,cursive;
	font-size: 45px;
	font-weight: bold;

}

.ramen
{
	width: 95%;
	min-height: 95vh;
	border: 1px solid black;
	border-radius: 15px;
	margin: auto;
	margin-top: 2.5vh;
	background-color: #bf0000;



}

.rad_1
{
	margin-top: 113px;
	margin-left: 60px;
	display: flex;
	flex-wrap: wrap;


}

.rad_1 p
{
	padding-left: 250px;
}

.luck_1 /* ramen för luckan*/
{
	width: 250px;
	height: 250px;
	border: 2px solid black;
	perspective: 850px;
	display: inline-block;
	margin-right: 40px;

}

.lucka_1 /* siffran på framsidan*/
{
  position: absolute;
  transform: translate(-50%, -50%);
  color: white;
  padding-top: 63px;

}

.luck_pane_1,
.luck_content_1
{
  width: inherit;
  height: inherit;
}

.luck_pane_1 /* Framsidan*/
{
  position: relative;
  background: #bf0000;
  transform-style: preserve-3d;
  transform-origin: 0;
  perspective: 850px;
  text-align: center;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15);
  transition: all .2s ease-out;

}

.luck_1:hover .luck_pane_1
{
  cursor:pointer;
  transform: rotateY(-155deg);
  perspective-origin: 0;
  transition: all 0.25s ease-in;
}

.luck_content_1
{
  background: SlateBlue;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15), inset 0 0 30px 20px rgba(0, 0, 0, 0.15);
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
}

.luck_bauble_1  /*Stylar siffran inuti */
{

  font-size: 2.6666666667em;
  line-height: 2.6666666667em;
  color: white;
  margin-left: 65px;
  margin-top: 60px;
}


.luck_2 /* ramen för luckan*/
{
	width: 250px;
	height: 250px;
	border: 2px solid black;
	perspective: 850px;
	display: inline-block;
	margin-right: 40px;

}

.lucka_2 /* siffran på framsidan*/
{
  position: absolute;
  transform: translate(-50%, -50%);
  color: white;
  padding-top: 63px;


}

.luck_pane_2,
.luck_content_2
{
  width: inherit;
  height: inherit;
}

.luck_pane_2 /* Framsidan*/
{
  position: relative;
  background: #bf0000;
  transform-style: preserve-3d;
  transform-origin: 0;
  perspective: 850px;
  text-align: center;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15);
  transition: all .2s ease-out;

}

.luck_2:hover .luck_pane_2
{
  cursor:pointer;
  transform: rotateY(-155deg);
  perspective-origin: 0;
  transition: all 0.25s ease-in;
}

.luck_content_2
{
  background: SlateBlue;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15), inset 0 0 30px 20px rgba(0, 0, 0, 0.15);
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
}

.luck_bauble_2  /* Innehåll vid öppning */
{

  font-size: 2.6666666667em;
  line-height: 2.6666666667em;
  color: white;
  margin-left: 65px;
  margin-top: 60px;
}

.luck_3 /* ramen för luckan*/
{
	width: 250px;
	height: 250px;
	border: 2px solid black;
	perspective: 850px;
	display: inline-block;
	margin-right: 40px;

}

.lucka_3 /* siffran på framsidan*/
{
  position: absolute;
  transform: translate(-50%, -50%);
  color: white;
  padding-top: 63px;


}

.luck_pane_3,
.luck_content_3
{
  width: inherit;
  height: inherit;
}

.luck_pane_3 /* Framsidan*/
{
  position: relative;
  background: #bf0000;
  transform-style: preserve-3d;
  transform-origin: 0;
  perspective: 850px;
  text-align: center;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15);
  transition: all .2s ease-out;

}

.luck_3:hover .luck_pane_3
{
  cursor:pointer;
  transform: rotateY(-155deg);
  perspective-origin: 0;
  transition: all 0.25s ease-in;
}

.luck_content_3
{
  background: SlateBlue;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15), inset 0 0 30px 20px rgba(0, 0, 0, 0.15);
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
}

.luck_bauble_3  /* Innehåll vid öppning */
{

  font-size: 2.6666666667em;
  line-height: 2.6666666667em;
  color: white;
  margin-left: 65px;
  margin-top: 60px;
}

.luck_4 /* ramen för luckan*/
{
	width: 250px;
	height: 250px;
	border: 2px solid black;
	perspective: 850px;
	display: inline-block;
	margin-right: 40px;

}

.lucka_4 /* siffran på framsidan*/
{
  position: absolute;
  transform: translate(-50%, -50%);
  color: white;
  padding-top: 63px;


}

.luck_pane_4,
.luck_content_4
{
  width: inherit;
  height: inherit;
}

.luck_pane_4 /* Framsidan*/
{
  position: relative;
  background: #bf0000;
  transform-style: preserve-3d;
  transform-origin: 0;
  perspective: 850px;
  text-align: center;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15);
  transition: all .2s ease-out;

}

.luck_4:hover .luck_pane_4
{
  cursor:pointer;
  transform: rotateY(-155deg);
  perspective-origin: 0;
  transition: all 0.25s ease-in;
}

.luck_content_4
{
  background: SlateBlue;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15), inset 0 0 30px 20px rgba(0, 0, 0, 0.15);
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
}

.luck_bauble_4  /* Innehåll vid öppning */
{

  font-size: 2.6666666667em;
  line-height: 2.6666666667em;
  color: white;
  margin-left: 65px;
  margin-top: 60px;
}

.luck_5 /* ramen för luckan*/
{
	width: 250px;
	height: 250px;
	border: 2px solid black;
	perspective: 850px;
	display: inline-block;
	margin-right: 40px;

}

.lucka_5 /* siffran på framsidan*/
{
  position: absolute;
  transform: translate(-50%, -50%);
  color: white;
  padding-top: 63px;


}

.luck_pane_5,
.luck_content_5
{
  width: inherit;
  height: inherit;
}

.luck_pane_5 /* Framsidan*/
{
  position: relative;
  background: #bf0000;
  transform-style: preserve-3d;
  transform-origin: 0;
  perspective: 850px;
  text-align: center;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15);
  transition: all .2s ease-out;

}

.luck_5:hover .luck_pane_5
{
  cursor:pointer;
  transform: rotateY(-155deg);
  perspective-origin: 0;
  transition: all 0.25s ease-in;
}

.luck_content_5
{
  background: SlateBlue;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15), inset 0 0 30px 20px rgba(0, 0, 0, 0.15);
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
}

.luck_bauble_5  /* Innehåll vid öppning */
{

  font-size: 2.6666666667em;
  line-height: 2.6666666667em;
  color: white;
  margin-left: 65px;
  margin-top: 60px;
}

.luck_6 /* ramen för luckan*/
{
	width: 250px;
	height: 250px;
	border: 2px solid black;
	perspective: 850px;
	display: inline-block;
	margin-right: 40px;

}

.lucka_6 /* siffran på framsidan*/
{
  position: absolute;
  transform: translate(-50%, -50%);
  color: white;
  padding-top: 63px;


}

.luck_pane_6,
.luck_content_6
{
  width: inherit;
  height: inherit;
}

.luck_pane_6 /* Framsidan*/
{
  position: relative;
  background: #bf0000;
  transform-style: preserve-3d;
  transform-origin: 0;
  perspective: 850px;
  text-align: center;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15);
  transition: all .2s ease-out;

}

.luck_6:hover .luck_pane_6
{
  cursor:pointer;
  transform: rotateY(-155deg);
  perspective-origin: 0;
  transition: all 0.25s ease-in;
}

.luck_content_6
{
  background: SlateBlue;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15), inset 0 0 30px 20px rgba(0, 0, 0, 0.15);
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
}

.luck_bauble_6  /* Innehåll vid öppning */
{

  font-size: 2.6666666667em;
  line-height: 2.6666666667em;
  color: white;
  margin-left: 65px;
  margin-top: 60px;
}

.luck_7 /* ramen för luckan*/
{
	width: 250px;
	height: 250px;
	border: 2px solid black;
	perspective: 850px;
	display: inline-block;
	margin-right: 40px;

}

.lucka_7 /* siffran på framsidan*/
{
  position: absolute;
  transform: translate(-50%, -50%);
  color: white;
  padding-top: 63px;


}

.luck_pane_7,
.luck_content_7
{
  width: inherit;
  height: inherit;
}

.luck_pane_7 /* Framsidan*/
{
  position: relative;
  background: #bf0000;
  transform-style: preserve-3d;
  transform-origin: 0;
  perspective: 850px;
  text-align: center;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15);
  transition: all .2s ease-out;

}

.luck_7:hover .luck_pane_7
{
  cursor:pointer;
  transform: rotateY(-155deg);
  perspective-origin: 0;
  transition: all 0.25s ease-in;
}

.luck_content_7
{
  background: SlateBlue;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15), inset 0 0 30px 20px rgba(0, 0, 0, 0.15);
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
}

.luck_bauble_7  /* Innehåll vid öppning */
{

  font-size: 2.6666666667em;
  line-height: 2.6666666667em;
  color: white;
  margin-left: 65px;
  margin-top: 60px;
}

.luck_8 /* ramen för luckan*/
{
	width: 250px;
	height: 250px;
	border: 2px solid black;
	perspective: 850px;
	display: inline-block;
	margin-right: 40px;

}

.lucka_8 /* siffran på framsidan*/
{
  position: absolute;
  transform: translate(-50%, -50%);
  color: white;
  padding-top: 63px;


}

.luck_pane_8,
.luck_content_8
{
  width: inherit;
  height: inherit;
}

.luck_pane_8 /* Framsidan*/
{
  position: relative;
  background: #bf0000;
  transform-style: preserve-3d;
  transform-origin: 0;
  perspective: 850px;
  text-align: center;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15);
  transition: all .2s ease-out;

}

.luck_8:hover .luck_pane_8
{
  cursor:pointer;
  transform: rotateY(-155deg);
  perspective-origin: 0;
  transition: all 0.25s ease-in;
}

.luck_content_8
{
  background: SlateBlue;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15), inset 0 0 30px 20px rgba(0, 0, 0, 0.15);
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
}

.luck_bauble_8  /* Innehåll vid öppning */
{

  font-size: 2.6666666667em;
  line-height: 2.6666666667em;
  color: white;
  margin-left: 65px;
  margin-top: 60px;
}

.luck_1,
.luck_2,
.luck_3,
.luck_4,
.luck_5,
.luck_6,
.luck_7,
.luck_8
{
	margin-right: 40px;


}

.rad_2
{
	margin-top: 113px;
	margin-left: 60px;
	display: flex;
}

.rad_2 p
{
	padding-left: 95px;
}

.luck_9 /* ramen för luckan*/
{
	width: 250px;
	height: 250px;
	border: 2px solid black;
	perspective: 850px;
	display: inline-block;
	margin-right: 40px;

}

.lucka_9 /* siffran på framsidan*/
{
  position: absolute;
  transform: translate(-50%, -50%);
  color: white;
  padding-top: 63px;

}

.luck_pane_9,
.luck_content_9
{
  width: inherit;
  height: inherit;
}

.luck_pane_9 /* Framsidan*/
{
  position: relative;
  background: #bf0000;
  transform-style: preserve-3d;
  transform-origin: 0;
  perspective: 850px;
  text-align: center;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15);
  transition: all .2s ease-out;

}

.luck_9:hover .luck_pane_9
{
  cursor:pointer;
  transform: rotateY(-155deg);
  perspective-origin: 0;
  transition: all 0.25s ease-in;
}

.luck_content_9
{
  background: SlateBlue;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15), inset 0 0 30px 20px rgba(0, 0, 0, 0.15);
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
}

.luck_bauble_9  /*Stylar siffran inuti */
{

  font-size: 2.6666666667em;
  line-height: 2.6666666667em;
  color: white;
  margin-left: 65px;
  margin-top: 60px;
}

.luck_10 /* ramen för luckan*/
{
	width: 250px;
	height: 250px;
	border: 2px solid black;
	perspective: 850px;
	display: inline-block;
	margin-right: 40px;

}

.lucka_10 /* siffran på framsidan*/
{
  position: absolute;
  transform: translate(-50%, -50%);
  color: white;
  padding-top: 63px;

}

.luck_pane_10,
.luck_content_10
{
  width: inherit;
  height: inherit;
}

.luck_pane_10 /* Framsidan*/
{
  position: relative;
  background: #bf0000;
  transform-style: preserve-3d;
  transform-origin: 0;
  perspective: 850px;
  text-align: center;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15);
  transition: all .2s ease-out;

}

.luck_10:hover .luck_pane_10
{
  cursor:pointer;
  transform: rotateY(-155deg);
  perspective-origin: 0;
  transition: all 0.25s ease-in;
}

.luck_content_10
{
  background: SlateBlue;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15), inset 0 0 30px 20px rgba(0, 0, 0, 0.15);
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
}

.luck_bauble_10  /*Stylar siffran inuti */
{

  font-size: 2.6666666667em;
  line-height: 2.6666666667em;
  color: white;
  margin-left: 65px;
  margin-top: 60px;
}

.luck_11 /* ramen för luckan*/
{
	width: 250px;
	height: 250px;
	border: 2px solid black;
	perspective: 850px;
	display: inline-block;
	margin-right: 40px;

}

.lucka_11 /* siffran på framsidan*/
{
  position: absolute;
  transform: translate(-50%, -50%);
  color: white;
  padding-top: 63px;

}

.luck_pane_11,
.luck_content_11
{
  width: inherit;
  height: inherit;
}

.luck_pane_11 /* Framsidan*/
{
  position: relative;
  background: #bf0000;
  transform-style: preserve-3d;
  transform-origin: 0;
  perspective: 850px;
  text-align: center;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15);
  transition: all .2s ease-out;

}

.luck_11:hover .luck_pane_11
{
  cursor:pointer;
  transform: rotateY(-155deg);
  perspective-origin: 0;
  transition: all 0.25s ease-in;
}

.luck_content_11
{
  background: SlateBlue;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15), inset 0 0 30px 20px rgba(0, 0, 0, 0.15);
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
}

.luck_bauble_11  /*Stylar siffran inuti */
{

  font-size: 2.6666666667em;
  line-height: 2.6666666667em;
  color: white;
  margin-left: 65px;
  margin-top: 60px;
}
.luck_12 /* ramen för luckan*/
{
	width: 250px;
	height: 250px;
	border: 2px solid black;
	perspective: 850px;
	display: inline-block;
	margin-right: 40px;

}

.lucka_12 /* siffran på framsidan*/
{
  position: absolute;
  transform: translate(-50%, -50%);
  color: white;
  padding-top: 63px;

}

.luck_pane_12,
.luck_content_12
{
  width: inherit;
  height: inherit;
}

.luck_pane_12 /* Framsidan*/
{
  position: relative;
  background: #bf0000;
  transform-style: preserve-3d;
  transform-origin: 0;
  perspective: 850px;
  text-align: center;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15);
  transition: all .2s ease-out;

}

.luck_12:hover .luck_pane_12
{
  cursor:pointer;
  transform: rotateY(-155deg);
  perspective-origin: 0;
  transition: all 0.25s ease-in;
}

.luck_content_12
{
  background: SlateBlue;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15), inset 0 0 30px 20px rgba(0, 0, 0, 0.15);
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
}

.luck_bauble_12 /*Stylar siffran inuti */
{

  font-size: 2.6666666667em;
  line-height: 2.6666666667em;
  color: white;
  margin-left: 65px;
  margin-top: 60px;
}
.luck_13 /* ramen för luckan*/
{
	width: 250px;
	height: 250px;
	border: 2px solid black;
	perspective: 850px;
	display: inline-block;
	margin-right: 40px;

}

.lucka_13 /* siffran på framsidan*/
{
  position: absolute;
  transform: translate(-50%, -50%);
  color: white;
  padding-top: 63px;

}

.luck_pane_13,
.luck_content_13
{
  width: inherit;
  height: inherit;
}

.luck_pane_13 /* Framsidan*/
{
  position: relative;
  background: #bf0000;
  transform-style: preserve-3d;
  transform-origin: 0;
  perspective: 850px;
  text-align: center;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15);
  transition: all .2s ease-out;

}

.luck_13:hover .luck_pane_13
{
  cursor:pointer;
  transform: rotateY(-155deg);
  perspective-origin: 0;
  transition: all 0.25s ease-in;
}

.luck_content_13
{
  background: SlateBlue;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15), inset 0 0 30px 20px rgba(0, 0, 0, 0.15);
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
}

.luck_bauble_13  /*Stylar siffran inuti */
{

  font-size: 2.6666666667em;
  line-height: 2.6666666667em;
  color: white;
  margin-left: 65px;
  margin-top: 60px;
}
.luck_14 /* ramen för luckan*/
{
	width: 250px;
	height: 250px;
	border: 2px solid black;
	perspective: 850px;
	display: inline-block;
	margin-right: 40px;

}

.lucka_14 /* siffran på framsidan*/
{
  position: absolute;
  transform: translate(-50%, -50%);
  color: white;
  padding-top: 63px;

}

.luck_pane_14,
.luck_content_14
{
  width: inherit;
  height: inherit;
}

.luck_pane_14 /* Framsidan*/
{
  position: relative;
  background: #bf0000;
  transform-style: preserve-3d;
  transform-origin: 0;
  perspective: 850px;
  text-align: center;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15);
  transition: all .2s ease-out;

}

.luck_14:hover .luck_pane_14
{
  cursor:pointer;
  transform: rotateY(-155deg);
  perspective-origin: 0;
  transition: all 0.25s ease-in;
}

.luck_content_14
{
  background: SlateBlue;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15), inset 0 0 30px 20px rgba(0, 0, 0, 0.15);
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
}

.luck_bauble_14  /*Stylar siffran inuti */
{

  font-size: 2.6666666667em;
  line-height: 2.6666666667em;
  color: white;
  margin-left: 65px;
  margin-top: 60px;
}
.luck_15 /* ramen för luckan*/
{
	width: 250px;
	height: 250px;
	border: 2px solid black;
	perspective: 850px;
	display: inline-block;
	margin-right: 40px;

}

.lucka_15 /* siffran på framsidan*/
{
  position: absolute;
  transform: translate(-50%, -50%);
  color: white;
  padding-top: 63px;

}

.luck_pane_15,
.luck_content_15
{
  width: inherit;
  height: inherit;
}

.luck_pane_15 /* Framsidan*/
{
  position: relative;
  background: #bf0000;
  transform-style: preserve-3d;
  transform-origin: 0;
  perspective: 850px;
  text-align: center;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15);
  transition: all .2s ease-out;

}

.luck_15:hover .luck_pane_15
{
  cursor:pointer;
  transform: rotateY(-155deg);
  perspective-origin: 0;
  transition: all 0.25s ease-in;
}

.luck_content_15
{
  background: SlateBlue;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15), inset 0 0 30px 20px rgba(0, 0, 0, 0.15);
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
}

.luck_bauble_15  /*Stylar siffran inuti */
{

  font-size: 2.6666666667em;
  line-height: 2.6666666667em;
  color: white;
  margin-left: 65px;
  margin-top: 60px;
}

.luck_16 /* ramen för luckan*/
{
	width: 250px;
	height: 250px;
	border: 2px solid black;
	perspective: 850px;
	display: inline-block;
	margin-right: 40px;

}

.lucka_16 /* siffran på framsidan*/
{
  position: absolute;
  transform: translate(-50%, -50%);
  color: white;
  padding-top: 63px;

}

.luck_pane_16,
.luck_content_16
{
  width: inherit;
  height: inherit;
}

.luck_pane_16 /* Framsidan*/
{
  position: relative;
  background: #bf0000;
  transform-style: preserve-3d;
  transform-origin: 0;
  perspective: 850px;
  text-align: center;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15);
  transition: all .2s ease-out;

}

.luck_16:hover .luck_pane_16
{
  cursor:pointer;
  transform: rotateY(-155deg);
  perspective-origin: 0;
  transition: all 0.25s ease-in;
}

.luck_content_16
{
  background: SlateBlue;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15), inset 0 0 30px 20px rgba(0, 0, 0, 0.15);
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
}

.luck_bauble_16  /*Stylar siffran inuti */
{

  font-size: 2.6666666667em;
  line-height: 2.6666666667em;
  color: white;
  margin-left: 65px;
  margin-top: 60px;
}

.lucka_9,
.lucka_10,
.lucka_11,
.lucka_12,
.lucka_13,
.lucka_14,
.lucka_15,
.lucka_16
{
	margin-right: 40px;

}


.rad_3
{
	margin-top: 113px;
	margin-left: 60px;
	display: flex;
}

.rad_3 p
{
	padding-left: 95px;
}

.luck_17 /* ramen för luckan*/
{
	width: 250px;
	height: 250px;
	border: 2px solid black;
	perspective: 850px;
	display: inline-block;
	margin-right: 40px;

}

.lucka_17 /* siffran på framsidan*/
{
  position: absolute;
  transform: translate(-50%, -50%);
  color: white;
  padding-top: 63px;


}

.luck_pane_17,
.luck_content_17
{
  width: inherit;
  height: inherit;
}

.luck_pane_17 /* Framsidan*/
{
  position: relative;
  background: #bf0000;
  transform-style: preserve-3d;
  transform-origin: 0;
  perspective: 850px;
  text-align: center;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15);
  transition: all .2s ease-out;

}

.luck_17:hover .luck_pane_17
{
  cursor:pointer;
  transform: rotateY(-155deg);
  perspective-origin: 0;
  transition: all 0.25s ease-in;
}

.luck_content_17
{
  background: SlateBlue;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15), inset 0 0 30px 20px rgba(0, 0, 0, 0.15);
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
}

.luck_bauble_17  /* Innehåll vid öppning */
{

  font-size: 2.6666666667em;
  line-height: 2.6666666667em;
  color: white;
  margin-left: 65px;
  margin-top: 60px;
}
.luck_18 /* ramen för luckan*/
{
	width: 250px;
	height: 250px;
	border: 2px solid black;
	perspective: 850px;
	display: inline-block;
	margin-right: 40px;

}

.lucka_18 /* siffran på framsidan*/
{
  position: absolute;
  transform: translate(-50%, -50%);
  color: white;
  padding-top: 63px;


}

.luck_pane_18,
.luck_content_18
{
  width: inherit;
  height: inherit;
}

.luck_pane_18 /* Framsidan*/
{
  position: relative;
  background: #bf0000;
  transform-style: preserve-3d;
  transform-origin: 0;
  perspective: 850px;
  text-align: center;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15);
  transition: all .2s ease-out;

}

.luck_18:hover .luck_pane_18
{
  cursor:pointer;
  transform: rotateY(-155deg);
  perspective-origin: 0;
  transition: all 0.25s ease-in;
}

.luck_content_18
{
  background: SlateBlue;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15), inset 0 0 30px 20px rgba(0, 0, 0, 0.15);
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
}

.luck_bauble_18  /* Innehåll vid öppning */
{

  font-size: 2.6666666667em;
  line-height: 2.6666666667em;
  color: white;
  margin-left: 65px;
  margin-top: 60px;
}
.luck_19 /* ramen för luckan*/
{
	width: 250px;
	height: 250px;
	border: 2px solid black;
	perspective: 850px;
	display: inline-block;
	margin-right: 40px;

}

.lucka_19 /* siffran på framsidan*/
{
  position: absolute;
  transform: translate(-50%, -50%);
  color: white;
  padding-top: 63px;


}

.luck_pane_19,
.luck_content_19
{
  width: inherit;
  height: inherit;
}

.luck_pane_19 /* Framsidan*/
{
  position: relative;
  background: #bf0000;
  transform-style: preserve-3d;
  transform-origin: 0;
  perspective: 850px;
  text-align: center;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15);
  transition: all .2s ease-out;

}

.luck_19:hover .luck_pane_19
{
  cursor:pointer;
  transform: rotateY(-155deg);
  perspective-origin: 0;
  transition: all 0.25s ease-in;
}

.luck_content_19
{
  background: SlateBlue;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15), inset 0 0 30px 20px rgba(0, 0, 0, 0.15);
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
}

.luck_bauble_19  /* Innehåll vid öppning */
{

  font-size: 2.6666666667em;
  line-height: 2.6666666667em;
  color: white;
  margin-left: 65px;
  margin-top: 60px;
}
.luck_20 /* ramen för luckan*/
{
	width: 250px;
	height: 250px;
	border: 2px solid black;
	perspective: 850px;
	display: inline-block;
	margin-right: 40px;

}

.lucka_20 /* siffran på framsidan*/
{
  position: absolute;
  transform: translate(-50%, -50%);
  color: white;
  padding-top: 63px;


}

.luck_pane_20,
.luck_content_20
{
  width: inherit;
  height: inherit;
}

.luck_pane_20 /* Framsidan*/
{
  position: relative;
  background: #bf0000;
  transform-style: preserve-3d;
  transform-origin: 0;
  perspective: 850px;
  text-align: center;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15);
  transition: all .2s ease-out;

}

.luck_20:hover .luck_pane_20
{
  cursor:pointer;
  transform: rotateY(-155deg);
  perspective-origin: 0;
  transition: all 0.25s ease-in;
}

.luck_content_20
{
  background: SlateBlue;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15), inset 0 0 30px 20px rgba(0, 0, 0, 0.15);
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
}

.luck_bauble_20  /* Innehåll vid öppning */
{

  font-size: 2.6666666667em;
  line-height: 2.6666666667em;
  color: white;
  margin-left: 65px;
  margin-top: 60px;
}
.luck_21 /* ramen för luckan*/
{
	width: 250px;
	height: 250px;
	border: 2px solid black;
	perspective: 850px;
	display: inline-block;
	margin-right: 40px;

}

.lucka_21 /* siffran på framsidan*/
{
  position: absolute;
  transform: translate(-50%, -50%);
  color: white;
  padding-top: 63px;


}

.luck_pane_21,
.luck_content_21
{
  width: inherit;
  height: inherit;
}

.luck_pane_21 /* Framsidan*/
{
  position: relative;
  background: #bf0000;
  transform-style: preserve-3d;
  transform-origin: 0;
  perspective: 850px;
  text-align: center;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15);
  transition: all .2s ease-out;

}

.luck_21:hover .luck_pane_21
{
  cursor:pointer;
  transform: rotateY(-155deg);
  perspective-origin: 0;
  transition: all 0.25s ease-in;
}

.luck_content_21
{
  background: SlateBlue;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15), inset 0 0 30px 20px rgba(0, 0, 0, 0.15);
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
}

.luck_bauble_21  /* Innehåll vid öppning */
{

  font-size: 2.6666666667em;
  line-height: 2.6666666667em;
  color: white;
  margin-left: 65px;
  margin-top: 60px;
}
.luck_22 /* ramen för luckan*/
{
	width: 250px;
	height: 250px;
	border: 2px solid black;
	perspective: 850px;
	display: inline-block;
	margin-right: 40px;

}

.lucka_22 /* siffran på framsidan*/
{
  position: absolute;
  transform: translate(-50%, -50%);
  color: white;
  padding-top: 63px;


}

.luck_pane_22,
.luck_content_22
{
  width: inherit;
  height: inherit;
}

.luck_pane_22 /* Framsidan*/
{
  position: relative;
  background: #bf0000;
  transform-style: preserve-3d;
  transform-origin: 0;
  perspective: 850px;
  text-align: center;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15);
  transition: all .2s ease-out;

}

.luck_22:hover .luck_pane_22
{
  cursor:pointer;
  transform: rotateY(-155deg);
  perspective-origin: 0;
  transition: all 0.25s ease-in;
}

.luck_content_22
{
  background: SlateBlue;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15), inset 0 0 30px 20px rgba(0, 0, 0, 0.15);
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
}

.luck_bauble_22  /* Innehåll vid öppning */
{

  font-size: 2.6666666667em;
  line-height: 2.6666666667em;
  color: white;
  margin-left: 65px;
  margin-top: 60px;
}
.luck_23 /* ramen för luckan*/
{
	width: 250px;
	height: 250px;
	border: 2px solid black;
	perspective: 850px;
	display: inline-block;
	margin-right: 40px;

}

.lucka_23 /* siffran på framsidan*/
{
  position: absolute;
  transform: translate(-50%, -50%);
  color: white;
  padding-top: 63px;


}

.luck_pane_23,
.luck_content_23
{
  width: inherit;
  height: inherit;
}

.luck_pane_23 /* Framsidan*/
{
  position: relative;
  background: #bf0000;
  transform-style: preserve-3d;
  transform-origin: 0;
  perspective: 850px;
  text-align: center;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15);
  transition: all .2s ease-out;

}

.luck_23:hover .luck_pane_23
{
  cursor:pointer;
  transform: rotateY(-155deg);
  perspective-origin: 0;
  transition: all 0.25s ease-in;
}

.luck_content_23
{
  background: SlateBlue;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15), inset 0 0 30px 20px rgba(0, 0, 0, 0.15);
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
}

.luck_bauble_23  /* Innehåll vid öppning */
{

  font-size: 2.6666666667em;
  line-height: 2.6666666667em;
  color: white;
  margin-left: 65px;
  margin-top: 60px;
}
.luck_24 /* ramen för luckan*/
{
	width: 250px;
	height: 250px;
	border: 2px solid black;
	perspective: 850px;
	display: inline-block;
	margin-right: 40px;

}

.lucka_24 /* siffran på framsidan*/
{
  position: absolute;
  transform: translate(-50%, -50%);
  color: white;
  padding-top: 63px;


}

.luck_pane_24,
.luck_content_24
{
  width: inherit;
  height: inherit;
}

.luck_pane_24 /* Framsidan*/
{
  position: relative;
  background: #bf0000;
  transform-style: preserve-3d;
  transform-origin: 0;
  perspective: 850px;
  text-align: center;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15);
  transition: all .2s ease-out;

}

.luck_24:hover .luck_pane_24
{
  cursor:pointer;
  transform: rotateY(-155deg);
  perspective-origin: 0;
  transition: all 0.25s ease-in;
}

.luck_content_24
{
  background: SlateBlue;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15), inset 0 0 30px 20px rgba(0, 0, 0, 0.15);
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
}

.luck_bauble_24  /* Innehåll vid öppning */
{

  font-size: 2.6666666667em;
  line-height: 2.6666666667em;
  color: white;
  margin-left: 65px;
  margin-top: 60px;
}

.lucka_17,
.lucka_18,
.lucka_19,
.lucka_20,
.lucka_21,
.lucka_22,
.lucka_23,
.lucka_24
{
	margin-right: 40px;

}