div#samtalekort_wrapper
{
	text-align:center;
}   


.deck_samtalekort {
    height: 350px;
    width: 500px;
    margin: auto;
}

body[data-elementor-device-mode="tablet"] .deck_samtalekort 
{
  width: 60vw;
}

body[data-elementor-device-mode="mobile"] .deck_samtalekort
{
  width: 80vw;
}


.deck-wrapper {
    position: relative;
}

.flip-card{
  position: absolute;
  top: 0;
  left: 0;
  height: 350px;
  border-radius: 20px;
  width: 500px;
  perspective: 1000px;
  background-color: transparent;
  transition: all .5s ease-out;
}

body[data-elementor-device-mode="tablet"] .deck_samtalekort .flip-card
{
  width: 60vw;
}

body[data-elementor-device-mode="mobile"] .deck_samtalekort .flip-card
{
  width: 80vw;
}




.flip-card:nth-child(1n) {
   
        transform: translate3d(10px, 0px, 0px) rotateZ(9deg) scale(1);
        
    }

    .flip-card:nth-child(2n) {
        transform: translate3d(5px, 0px, 0px) rotateZ(6deg) scale(1);
     
    }

    .flip-card:nth-child(3n) {

    transform: translate3d(0px, 0px, 0px) rotateZ(0deg) scale(1);
 
    }

.deck-wrapper.move .flip-card:nth-child(1n)
{
  transform: translate3d(5px, 0px, 0px) rotateZ(6deg) scale(1);
}



.flip-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.8s;
  transform-style: preserve-3d;
}

/* Do an horizontal flip when you move the mouse over the flip box container */
.flip-card.flipcard .flip-card-inner {
  transform: rotateY(180deg);
	background-image:none;
}

/* Position the front and back side */
.flip-card-front, .flip-card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden; /* Safari */
  backface-visibility: hidden;
}

/* Style the front side (fallback if image is missing) */
.flip-card-front {
 padding: 20px;
 border-radius: 20px;
 color: #ffffff;
 box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
    font-family: "Roboto", Sans-serif;
    font-size: 16px;
    font-weight: normal;
	
    background-image: url(/wp-content/plugins/sj_samtalekort/gfx/DGT_website_CMYK_Negativ_ny.png), url(/wp-content/plugins/sj_samtalekort/gfx/bottom-right.png);
    background-position: 50% calc(100% - 20px), 135% bottom;
    background-repeat: no-repeat, no-repeat;
    background-size: 20%, 50%;
}



.flip-card-front.topright {
    background-image: url(/wp-content/plugins/sj_samtalekort/gfx/DGT_website_CMYK_Negativ_ny.png), url(/wp-content/plugins/sj_samtalekort/gfx/top-right.png);
    background-position: 50% calc(100% - 20px), 317px -28px;
    background-repeat: no-repeat, no-repeat;
    background-size: 20%, 60% 60%;
}


body[data-elementor-device-mode="tablet"] .flip-card-front.topright
{
background-position: 50% calc(100% - 20px), 310px -40px;
}

body[data-elementor-device-mode="mobile"] .flip-card-front.topright
{
    background-position: 50% calc(100% - 20px), 200px 0;
    background-size: 20%, 60%;
}



.flip-card-front.topleft {
    background-image: url(/wp-content/plugins/sj_samtalekort/gfx/DGT_website_CMYK_Negativ_ny.png), url(/wp-content/plugins/sj_samtalekort/gfx/top-left.png);
    background-position: 50% calc(100% - 20px), -82px -40px;
    background-repeat: no-repeat, no-repeat;
    background-size: 20%, 60%;
}

body[data-elementor-device-mode="tablet"] .flip-card-front.topleft
{
    background-position: 50% calc(100% - 20px), -90px -40px;
}

body[data-elementor-device-mode="mobile"] .flip-card-front.topleft
{
    background-position: 50% calc(100% - 20px), -60px -18px;
    background-size: 20%, 60%;

}



.flip-card-front.bottomright {
    background-image: url(/wp-content/plugins/sj_samtalekort/gfx/DGT_website_CMYK_Negativ_ny.png), url(/wp-content/plugins/sj_samtalekort/gfx/bottom-right.png);
    background-position: 50% calc(100% - 20px), 330px 200px;
    background-repeat: no-repeat, no-repeat;
    background-size: 20%, 60%;
}

body[data-elementor-device-mode="mobile"] .flip-card-front.bottomright
{
     background-position: 50% calc(100% - 20px), 200px 266px;
    background-size: 20%, 60%;

}

.flip-card-front.bottomleft {
    background-image: url(/wp-content/plugins/sj_samtalekort/gfx/DGT_website_CMYK_Negativ_ny.png), url(/wp-content/plugins/sj_samtalekort/gfx/bottom-left.png);
    background-position: 50% calc(100% - 20px), -120px 200px;
    background-repeat: no-repeat, no-repeat;
    background-size: 20%, 60%;
}
	
body[data-elementor-device-mode="mobile"] .flip-card-front.bottomleft
{
    background-position: 50% calc(100% - 20px), -80px 266px;
    background-size: 20%, 60%;

}


.flip-card-front .spheadline
{
	font-weight: 600;
	padding: 30px 0;
}

.flip-card-front .plaintxtsp
{
	 font-size: 30px;
    font-weight: 300;
	line-height:35px;
}

body[data-elementor-device-mode="mobile"] .flip-card-front .plaintxtsp
{
	 font-size: 27px;
	line-height:32px;
}

/* Style the back side */
.flip-card-back {
  transform: rotateY(180deg);
   padding: 20px;
  border-radius: 20px;
  overflow-y: auto;
  font-family: "Roboto", Sans-serif;
  font-size: 16px;
  font-weight: normal;	
}

.flip-card-inner .flip-card-back .svarheadline
{
	font-weight: 600;
	padding: 30px 0;
}

.flip-card-inner .flip-card-back .plaintxt
{
 font-family: "Roboto", Sans-serif;
  font-size: 18px;
  font-weight: normal;
	
}


.flip-card.move {
   animation-duration: 0.5s;
  animation-name: moveaway;
    
}


.flip-card.moveback {
   animation-duration: 0.5s;
  animation-name: moveback;
    
}


@keyframes moveaway {
  from {
    transform: translate3d(0px, 0px, 0px) rotateZ(0deg) scale(1);
  
  }

  50% {
   transform: translate3d(0px, 0px, 0px) rotateZ(-10deg) scale(.8);
   left: -177px;
    
  }

  to {
    transform: translate3d(0px, 0px, 0px) rotateZ(0deg) scale(1);
     
  }
}


@keyframes moveback {
  from {
    transform: translate3d(0px, 0px, 0px) rotateZ(0deg) scale(1);
  
  }

  50% {
   transform: translate3d(0px, 0px, 0px) rotateZ(-10deg) scale(.8);
   left: 177px;
    
  }

  to {
    transform: translate3d(0px, 0px, 0px) rotateZ(0deg) scale(1);
     
  }
}


.slider-nav-block {
    display: flex;
   width: fit-content;
    margin: auto;
    padding-top: 30px;
    column-gap: 20px;
}


body[data-elementor-device-mode="tablet"] .slider-nav-block
{
  width: 60vw;
}

body[data-elementor-device-mode="mobile"] .slider-nav-block
{
  width: 80vw;
}



.slider-nav-block-item {
    margin: auto;
}

button#vend_kort_btn {
    display: block;
    text-align: center;
    margin: auto;
    margin-top: 36px;
    background: rgb(123, 182, 151);
    border: none;
    color: #fff;
    padding: 10px 50px 10px 50px;
    font-size: 20px;

  }

a#random_picker_link {
    display: block;
        margin-top: 12px;
        color: #000;
        font-size: 14px;
}

a#random_picker_link:hover
{
  color:#4b65c2;
}


.swiper-button-prev-custom {
    width: 24px;
    height: 24px;
    border: none;
    border-radius: 0%;
    position: relative;
	cursor:pointer;
    /*transform: scale(1.5);*/
}

.swiper-button-next-custom {
    width: 24px;
    height: 24px;
    border: none;
    border-radius: 0%;
	cursor:pointer;
	/*transform: scale(1.5);*/
   
}

.swiper-button-next-custom img{

    cursor:pointer;
    /*transform: scale(1.5);*/
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}

/*
body[data-elementor-device-mode="tablet"] .swiper-button-next-custom, body[data-elementor-device-mode="mobile"] .swiper-button-next-custom, body[data-elementor-device-mode="tablet"] .swiper-button-prev-custom, body[data-elementor-device-mode="mobile"] .swiper-button-prev-custom
{
	transform: scale(1.5);
}

.swiper-button-prev-custom i
{
position: absolute;
    top: 5px;
    left: 4px;
}

.swiper-button-next-custom i
{
position: absolute;
top:5px;
left: 6px;
}
*/







