.w-70 {
  width:70%;
}
.cover{
  background-size: cover;
}

.eqheight{
  flex:1;
}
.light{
  font-weight: 400;
  color: #999999;
  font-family:avenir;
}
.swipe-sub{
  margin-top:-5px;
}
.roze{
  background-color: #ffbdbd;
}
.big{
  font-size: 10em;
}


.gender{
  position: absolute;
  margin-top: 50px;
  margin-left: -80px;
}
.sub{
  margin-top: -50px;
}
.vertical{
   align-content: space-between;
}
.rota{transform: rotate(-10deg); }
.rota-2{transform: rotate(-2deg); }
.anim{}

  .move {
    animation-duration: 6s;
    animation-name: move;
    animation-timing-function: linear;
    overflow: hidden;
    animation-iteration-count: infinite;
    position: relative;
    margin-top: -80px;

  }
  @keyframes move {
    0% {
      left: 100%;

    }
    100% {
      left: -50%;
    }
  }
  .move {
    -webkit-animation-duration: 6s;
    animation-duration: 6s;
    -webkit-animation-name: move;
    animation-name: move;
    overflow: hidden;
    animation-iteration-count: infinite;
    position: relative;
    margin-top: -80px;
  }


  .grow {
    animation-duration: 1.5s;
    animation-name: grow;
    animation-timing-function: ease-in-out;
    overflow: hidden;
    animation-iteration-count: infinite;
  }
  @keyframes grow {
    0% {
      margin-top:0px;
      opacity: 0;
      transform: scale(0.1);
      background-color: #FF725C;

    }
    100% {
      margin-left:0px;
      opacity: 1;
      transform: scale(1);
      background-color: #FF725C;
    }
  }


  .grow {
    -webkit-animation-duration: 1.5s;
    animation-duration: 1.5s;
    -webkit-animation-name: grow;
    animation-name: grow;
    overflow: hidden;
    animation-iteration-count: infinite;
  }

  .grow-ad {
    animation-duration: 1s;
    animation-name: grow-ad;
    animation-timing-function: ease-in-out;
    overflow: hidden;
    animation-iteration-count: infinite;
  }
  @keyframes grow-ad {
    0% {
      margin-top:0px;
      opacity: 0;
      transform: scale(0.1);

    }
    100% {
      margin-left:0px;
      opacity: 1;
      transform: scale(2);


    }
  }
  .grow-ad {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-name: grow-ad;
    animation-name: grow-ad;
    overflow: hidden;
    animation-iteration-count: infinite;
  }


.show{
  animation-duration: 0.7s;
  animation-name: show;
  animation-timing-function: ease-in-out;
  overflow: hidden;
  animation-iteration-count: infinite;

}
@keyframes show {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.2);
  }
}
.show {
  -webkit-animation-duration: 0.7s;
  animation-duration: 0.7s;
  -webkit-animation-name: show;
  animation-name: show;
  overflow: hidden;
  animation-iteration-count: infinite;
}

.turn{
  animation-duration: 0.5s;
  animation-name: turn;
  animation-timing-function: linear;
  overflow: hidden;
  animation-iteration-count: infinite;
}
@keyframes turn {
  0% {
    transform: rotate(-20deg);

  }
  50% {
    transform: rotate(20deg);

  }
  100% {
    transform: rotate(-20deg);

  }
}
.turn{
  -webkit-animation-duration: 0.5s;
  animation-duration: 0.5s;
  -webkit-animation-name: turn;
  animation-name: turn;
  overflow: hidden;
  animation-iteration-count: infinite;
}

.color{
  animation-duration: 4s;
  animation-name: color;
  animation-timing-function: linear;
  overflow: hidden;
  animation-iteration-count: infinite;
}
@keyframes color {
  0% {
    background-color: #FFDE37;
  }
  50% {
    background-color: #FFDE37;
  }

  75% {
    background-color:black;
  }

  100% {
    background-color: #FFDE37;
  }
}
.color{
  -webkit-animation-duration: 4s;
  animation-duration: 4s;
  -webkit-animation-name: color;
  animation-name: color;
  overflow: hidden;
  animation-iteration-count: infinite;
}

.color-2{
  animation-duration: 2s;
  animation-name: color-2;
  animation-timing-function: linear;
  overflow: hidden;
  animation-iteration-count: infinite;
}
@keyframes color-2 {
  0% {
    color: white;
  }
  50% {
    color: black;
  }

  100% {
    color: white;
  }
}
.color{
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
  -webkit-animation-name: color-2;
  animation-name: color-2;
  overflow: hidden;
  animation-iteration-count: infinite;
}
#FFDE37




@media (--breakpoint-not-small) {
  .w1-ns {  width: 1rem; }
  .w2-ns {  width: 2rem; }
  .w3-ns {  width: 4rem; }
  .w4-ns {  width: 8rem; }
  .w5-ns {  width: 16rem; }
  .w-10-ns { width:  10%; }
  .w-20-ns { width:  20%; }
  .w-25-ns { width:  25%; }
  .w-30-ns { width:  30%; }
  .w-33-ns { width:  33%; }
  .w-34-ns { width:  34%; }
  .w-40-ns { width:  40%; }
  .w-50-ns { width:  50%; }
  .w-60-ns { width:  60%; }
  .w-70-ns { width:  70%; }
  .w-75-ns { width:  75%; }
  .w-80-ns { width:  80%; }
  .w-90-ns { width:  90%; }
  .w-100-ns { width: 100%; }
  .w-third-ns { width: calc(100% / 3); }
  .w-two-thirds-ns { width: calc(100% / 1.5); }
  .w-auto-ns { width: auto; }

}
.opac-zero{
  display:none;
  position:relative;
  z-index:-30;
}
.swipe-app{
 position:relative;
}
.findr-app{
  position: relative;
}

.buttons{
  position: relative;
  justify-content: space-around;
}
.ui-loader {
   display: none !important;
}
/** Findr **/
.findr-items {
  position: relative;
  padding-bottom:148.71%;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.findr-items .findr-item {
  position: absolute;
  display: none;
  left: 0;
  right: 0;
  top: 0;
  width: 100%;
}

.findr-items .findr-item img {
  display: block;
  width: 100%;
}

.findr-items .findr-item.active {
  display: block;
}

.findr-rotate-right {
    transform: rotate(-30deg) scale(0.8);
    transition: 0.5s;
    opacity: 0;
    margin-left: -400px;
    cursor: w-resize;
    z-index: 10;
}
.findr-rotate-right:after {
  content: "DISLIKE";
  position: absolute;
  height: 60px;
  font-size: 60px;
  color: red;
  top: 50%;
  margin-top: -30px;
  left: 0;
  right: 0;
  text-align:center;
}
.findr-rotate-left {
  transform: rotate(30deg) scale(0.8);
  transition: 0.5s;
  margin-left: 400px;
  cursor: e-resize;
  opacity: 0;
  z-index: 10;
}
.findr-rotate-left:after {
  content: "LIKE";
  position: absolute;
  height: 60px;
  font-size: 60px;
  color: green;
  top: 50%;
  margin-top: -30px;
  left: 0;
  right: 0;
  text-align:center;
}




.hearts {
  background: linear-gradient(135deg, white 1.2em, rgba(232, 58, 37, 0) 1.2em) 0 4em, linear-gradient(-135deg, white 1.2em, rgba(232, 58, 37, 0) 1.2em) 0 4em, radial-gradient(circle at 7.16em 7.4em, white 1.02em, rgba(232, 58, 37, 0) 1.044em) 0 -4em, radial-gradient(circle at 0.84em 7.4em, white 1.02em, rgba(232, 58, 37, 0) 1.044em) 0 -4em, linear-gradient(135deg, white 1.2em, rgba(152, 204, 150, 0) 1.2em) 4em 0, linear-gradient(-135deg, white 1.2em, rgba(152, 204, 150, 0) 1.2em) 4em 0, radial-gradient(circle at 7.16em 7.4em, white 1.02em, rgba(152, 204, 150, 0) 1.044em) 4em 0, radial-gradient(circle at 0.84em 7.4em, white 1.02em, rgba(152, 204, 150, 0) 1.044em) 4em 0;
  background-size: 8em 8em;
  background-color: #ffbdbd;
  background-repeat:repeat;
  background-position: center;
}