body {
  cursor: url("cap-01.png"), auto; 
  font-family: Arial, Helvetica, sans-serif;
}


.flip-card {
  background-color: transparent;
  perspective: 1000px;
}

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

.flip-card:hover .flip-card-inner {
  transform: rotateY(180deg);
}

.flip-card-front, .flip-card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.flip-card-front {
  background-color: #bbb;
  color: black;
}

.flip-card-back {
  background-color: transparent;
  color: rgb(188, 39, 71);
  transform: rotateY(180deg);
  position: absolute;
}

.flip-card2 {
  background-color: transparent;
  perspective: 1000px;
}

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

.flip-card2:hover .flip-card-inner2 {
  transform: rotateY(180deg);
}

.flip-card-front2, .flip-card-back2 {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.flip-card-front2 {
  background-color: #bbb;
  color: black;
}

.flip-card-back2 {
  background-color: transparent;
  color: rgb(66, 46, 166);
  transform: rotateY(180deg);
  position: 1000px;
  top: 100px;
}

.flip-card3 {
  background-color: transparent;
  perspective: 1000px;
  margin-bottom: 100px;
}

.flip-card-inner3 {
  position: absolute;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.6s;
  transform-style: preserve-3d;
}

.flip-card3:hover .flip-card-inner3 {
  transform: rotateY(360deg);
}

.flip-card-front3, .flip-card-back3 {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.flip-card-front3 {
  background-color: #bbb;
  color: black;
}

.flip-card-back3 {
  background-color: transparent;
  color: rgb(188, 39, 71);
  transform: rotateY(180deg);
  position: absolute;
}

.keskele {
  margin-left: 10%;
}

@keyframes tipsy {
  0% {
    transform: translateX(-50%) translateY(-50%) rotate(0deg);
  }
  100% {
    transform: translateX(-50%) translateY(-50%) rotate(360deg);
  }
}

a {
  color: #fffbf1;
  font-size: 80px;
  font-weight: bold;
  text-decoration: none;
  letter-spacing: -3px;
  margin: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
}

a:before,
a:after {
  content: '';
  padding: .9em .4em;
  position: absolute;
  left: 50%;
  width: 100%;
  top: 50%;
  display: block;
  border: 15px solid red;
  transform: translateX(-50%) translateY(-50%) rotate(0deg);
  animation: 10s infinite alternate ease-in-out tipsy;
}



a {
  color: #060606;
  text-shadow: 0 20px 25px #000000, 0 40px 60px #000000;
  font-size: 80px;
  font-weight: bold;
  text-decoration: none;
  letter-spacing: -3px;
  margin: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
}

a:before,
a:after {
  content: '';
  padding: .9em .4em;
  position: absolute;
  left: 50%;
  width: 100%;
  top: 50%;
  display: block;
  border: 15px solid red;
  transform: translateX(-50%) translateY(-50%) rotate(0deg);
  animation: 8s infinite alternate ease-in-out tipsy;
}

a:before {
  border-color: rgb(188, 39, 71);
  z-index: -1;
}

a:after {
  border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) rgb(188, 39, 71);
}

.pealkiri {
font-family: Arial, Helvetica, sans-serif;
color: transparent;
text-emphasis-color: rgb(188, 39, 71);
stroke-width: 2px;
font-size: 20vw;
text-align: center;
}

.aboutus { 
  font-family: Arial, Helvetica, sans-serif;
  font-weight: bold ;
  font-size: 3vw;
  color: rgb(6, 5, 5);
  text-align: center;
  margin-top: 1000px;
}

.pastevents {
  font-family: Arial, Helvetica, sans-serif;
  font-weight: bold ;
  font-size: 3vw;
  color: rgb(6, 5, 5);
  text-align: center;
  margin-top: 1000px;
}

.upcomingevents {
  font-family: Arial, Helvetica, sans-serif;
  font-weight: bold ;
  font-size: 3vw;
  color: rgb(6, 5, 5);
  text-align: center;
  margin-top: 1000px;
}


@font-face {
  font-family: "coolvetica";
  src: url("coolvetica\ rg.otf");
}