/* Box */

.rtext--box {
  margin-bottom: 24px;
  padding: 24px;
  border-radius: 24px;
}

.rtext--box-border {
  border: 2px solid;
}

.rtext--box-border.txt--light {
  border-color: #ffffff;
}

.rtext--box-border.txt--dark {
  border-color: rgba(255, 255, 255, .2);
}

.rtext--box-accent {
  background: linear-gradient(111.02deg, #F00F40 0%, #f00f40 100%);
  box-shadow: 0px 16px 32px rgba(61, 74, 82, 0.2), 0px 8px 16px rgba(61, 74, 82, 0.2);
}

.rtext--box-dark {
  background: #3d4a52;
  box-shadow: 0px 16px 32px rgba(61, 74, 82, 0.05), 0px 8px 16px rgba(61, 74, 82, 0.05);
}

.rtext--box-light {
  background: #ebeced;
}

.rtext--box-white {
  background: #fff;
  box-shadow: 0px 16px 32px rgba(61, 74, 82, 0.05), 0px 8px 16px rgba(61, 74, 82, 0.05);
}

.rtext--box-ghost {
  background: rgba(255, 255, 255, .1);
}

.animation-rechts .rtext--box-accent {
    background: linear-gradient(111.02deg, #F00F40 0%, #f00f40 100%);
    padding: 3rem;
    color: #fff;
    border-radius: 12px;
    transform: perspective(1500px) rotateY(-15deg);
    border-radius: 1rem;
    /* box-shadow: rgba(0, 0, 0, 0.25) 0px 25px 50px -12px, rgba(255, 255, 255, 1) -6px 0 0 4px, var(--secondary) -20px 0 0 8px, rgba(255, 255, 255, .1) 10px 10px 20px 0 inset, rgba(0, 0, 0, .1) -10px -10px 20px 0 inset; */
    box-shadow: rgba(0, 0, 0, 0.25) 0px 25px 50px -12px, rgba(255, 255, 255, 1) 6px 0 0 4px, #3d4a52 20px 0 0 8px;
    position: relative;
    z-index: 1;
   }

.animation-rechts .rtext--box-accent:hover {
    transform: perspective(3000px) rotateY(-5deg);
    box-shadow: rgba(0, 0, 0, 0.25) 0px 25px 50px -12px;
    transition: transform 1s ease 0s;
    transition-property: transform, box-shadow;
}

.animation-links .rtext--box-accent {
    background: linear-gradient(111.02deg, #F00F40 0%, #f00f40 100%);
    padding: 3rem;
    color: #fff;
    border-radius: 12px;
    transform: perspective(1500px) rotateY(15deg);
    border-radius: 1rem;
    /* box-shadow: rgba(0, 0, 0, 0.25) 0px 25px 50px -12px, rgba(255, 255, 255, 1) -6px 0 0 4px, var(--secondary) -20px 0 0 8px, rgba(255, 255, 255, .1) 10px 10px 20px 0 inset, rgba(0, 0, 0, .1) -10px -10px 20px 0 inset; */
    box-shadow: rgba(0, 0, 0, 0.25) 0px 25px 50px -12px, rgba(255, 255, 255, 1) -6px 0 0 4px, #3d4a52 -20px 0 0 8px;
    position: relative;
    z-index: 1;
   }

.animation-links .rtext--box-accent:hover {
    transform: perspective(3000px) rotateY(5deg);
    box-shadow: rgba(0, 0, 0, 0.25) 0px 25px 50px -12px;
    transition: transform 1s ease 0s;
    transition-property: transform, box-shadow;
}

.animation-ghost-links .rtext--box-ghost {
    background: ;
    padding: 3rem;
    color: #fff;
    border-radius: 12px;
    transform: perspective(1500px) rotateY(15deg);
    border-radius: 1rem;
    /* box-shadow: rgba(0, 0, 0, 0.25) 0px 25px 50px -12px, rgba(255, 255, 255, 1) -6px 0 0 4px, var(--secondary) -20px 0 0 8px, rgba(255, 255, 255, .1) 10px 10px 20px 0 inset, rgba(0, 0, 0, .1) -10px -10px 20px 0 inset; */
    box-shadow: rgba(0, 0, 0, 0.25) 0px 25px 50px -12px, rgba(255, 255, 255, 1) -6px 0 0 4px, #ebeced -20px 0 0 8px;
    position: relative;
    z-index: 1;
   }

.animation-ghost-links .rtext--box-ghost:hover {
    transform: perspective(3000px) rotateY(5deg);
    box-shadow: rgba(0, 0, 0, 0.25) 0px 25px 50px -12px;
    transition: transform 1s ease 0s;
    transition-property: transform, box-shadow;
}

.rtext iframe {
  width: 100%;
}

@media all and (max-width: 767px) {
  .banner-type-textx {
    font-size: 30px!important;
   }