/* ZILUKS added fonts */
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@300&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Playball&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@300&family=Stalinist+One&display=swap');


@font-face {
     font-family: Organo;
     src: local(Organo),
       url(/fonts/organo.woff2) format(woff2);
}


.flip-card {
  background-color: transparent;
  max-width: 100%;
  position: relative;
  margin: auto;
  width: 800px;
  height: 333px;
  /* border: 1px solid #E46307; */
  perspective: 1000px; /* Remove this if you don't want the 3D effect */
}

/* This container is needed to position the front and back side */
.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:hover .flip-card-inner {
  transform: rotateY(180deg);
}

/* 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 {
  background-color: #000;
  color: black;
}

/* Style the back side */
.flip-card-back {
  background-color: #fff;
  /* border: 1px solid #E46307; */
  color: #000;
  transform: rotateY(180deg);
}

.ziluksfont{
  color: #E46307;
  margin: 20px 0 0 0;
  font-size: 2.20rem;
  font-family: Organo;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: 0.8rem;
  text-transform: capitalize;
	}
	
.maillink { color: #ffffff; font-size: 20px; font-family: Raleway; font-weight: 600; line-height: 1.3; letter-spacing: 0.3rem; text-decoration: none; }