/* Olympic coin-flip animation */
.rlc-creative_v3 .rlc-flipcontainer,
.rlc-creative_v3 .rlc-flipcontainer .rlc-fliplogo .rlc-face {
  /* set desktop dimensions */
  width: 8.750em;
  height: 8.750em;
}

.rlc-creative_v3 .rlc-flipcontainer {
  display: block;
  position: relative;
  cursor: pointer;
  pointer-events: all;
}
.rlc-creative_v3 .rlc-flippause {
  width: 1.5em;
  height: 1.5em;
  background: url(_common/css/images/loop_pause_black.svg?$staticlink$) no-repeat 50% 50%;
  cursor: pointer;
} 
.rlc-creative_v3.rlc-flippaused .rlc-flippause {
  background-image: url(_common/css/images/loop_play_black.svg?$staticlink$);
}

@-webkit-keyframes coinflip {
  0% {
    -webkit-transform: rotate3d(0, 1, 0, 0deg);
  }

  40% {
    -webkit-transform: rotate3d(0, 1, 0, 0deg);
  }

  50% {
    -webkit-transform: rotate3d(0, 1, 0, 180deg);
  }

  90% {
    -webkit-transform: rotate3d(0, 1, 0, 180deg);
  }

  100% {
    -webkit-transform: rotate3d(0, 1, 0, 360deg);
  }
}

@keyframes coinflip {
  0% {
    transform: rotate3d(0, 1, 0, 0deg);
  }

  40% {
    transform: rotate3d(0, 1, 0, 0deg);
  }

  50% {
    transform: rotate3d(0, 1, 0, 180deg);
  }

  90% {
    transform: rotate3d(0, 1, 0, 180deg);
  }

  100% {
    transform: rotate3d(0, 1, 0, 360deg);
  }
}

.rlc-creative_v3 .rlc-flipcontainer .rlc-fliplogo {
  position: relative;
  top: 0px;
  left: 0px;
  text-align: center;

  -webkit-animation-name: coinflip;
  -webkit-animation-duration: 6s;
  -webkit-animation-timing-function: linear;
  -webkit-animation-delay: 1s;
  -webkit-animation-iteration-count: infinite;

  animation-name: coinflip;
  animation-duration: 6s;
  animation-timing-function: linear;
  animation-delay: 1s;
  animation-iteration-count: infinite;


  -webkit-transform: rotateY(0deg);
  transform: rotateY(0deg);
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;

  -ms-transform-origin: 50% 50%;
  -webkit-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
}

.rlc-creative_v3 .rlc-flipcontainer .rlc-fliplogo .rlc-face {
  position: absolute;
  top: 0;
  left: 0;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.rlc-creative_v3.rlc-flippaused .rlc-flipcontainer .rlc-fliplogo {
  -webkit-animation-play-state: paused;
  animation-play-state: paused;
}

.rlc-creative_v3 .rlc-flipcontainer .rlc-fliplogo .front {
  z-index: 2;
  -webkit-transform: rotateY(0deg);
  transform: rotateY(0deg);
}

.rlc-creative_v3 .rlc-flipcontainer .rlc-fliplogo .back {
  z-index: 1;
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg);
}
@media only screen and (min-width:768px) {
  .rlc-creative_v3 .rlc-flipcontainer::before,
  .rlc-creative_v3 .rlc-flipcontainer::after {
    position: absolute;
    top: 50%;
    left: 50%;
    content: 'official';
    font-family: "Founders Grotesk text Regular";
    font-size: 0.813em;
    color: currentColor;
    letter-spacing: 0.200em;
    line-height: 4.615em;
    text-transform: uppercase;
    transform: translate(-100%,-50%);
    padding-right: 6.615em;
  }
  .rlc-creative_v3 .rlc-flipcontainer::after {
    content: 'outfitter';
    transform: translate(0,-50%);
    padding: 0 0 0 6.615em;
  }
}
@media only screen and (max-width:767px) {

  .rlc-creative_v3 .rlc-flipcontainer,
  .rlc-creative_v3 .rlc-flipcontainer .rlc-fliplogo .rlc-face {
    /* set mobile dimensions */
    width: 6.938em;
    height: 9.875em;
  }
  .rlc-creative_v3 .rlc-flipcontainer::after {
    content: 'official outfitter';
    display: block;
    font-family: "Founders Grotesk text Regular";
    font-size: 0.813em;
    color: currentColor;
    letter-spacing: 0.200em;
    text-align: center;
    text-transform: uppercase;
    white-space: nowrap;
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%); transform: translateX(-50%);
    top: 9.5em;
  }
}

@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
  .rlc-creative_v3 .rlc-flipcontainer .rlc-fliplogo {
    /* disable animation on IE */
    transform: none;
    animation: none;
  }
}

.rlc-stopanimations .rlc-creative_v3 .rlc-flipcontainer .rlc-fliplogo {
  -webkit-animation: none; animation: none;
}