.adCont{
	height: 100%;
	width: 100%;
	position: absolute;
  z-index: 0;
  pointer-events: none;
}

.adCont img{
	height: 100%;
	width: 100%;
}

body{
  width: 100%;
  height: 100%;
  background-color: #620b2e;
  position: fixed;
  left: 0;
  top: 0;
  margin: 0;
}

.banner {
	width: 300px;
	height: 600px;
  pointer-events: none;
}

.banner{
	transform-origin: 50% 50%;
	position: absolute;
	top: 0;
  bottom: 0;
	left: 0;
  right: 0;
	cursor: pointer;
/*	background-color: black;*/
  margin: auto;
}

svg{
  z-index: 999;
}

.hidden{
	display: none;
}

.fullBg{
  transform-origin: 50% 39%;
  width: 750px;
  height: 750px;
  left: -225px;
  top: -75px;
}

.bg{
  display: none;
/*  opacity: 0.7;*/
}

.alternativeScale{
  transform-origin: 0% 50% !important;
}

.alternativeScale2{
  transform-origin: 0% 0% !important;
}
.alternativeScale3{
  transform-origin: 0% 100% !important;
}
#interactionLayer{
	top: 0;
	left: 0;
	position: absolute;
	width: 100%;
	height: 100%;
	pointer-events: all;
  cursor: pointer;
}

.rosin{
  position: absolute;
  margin-top: 25px;
  top: 600px;
  height: 640px;
/*  opacity: 0;*/
}
.gradBot{
  width: 500%;
  left: -200%;
  height: 30%;
  position: absolute;
  bottom: 0px;
  background: -moz-linear-gradient(top, rgba(23,27,47,0) 0%, rgba(23,27,47,0.02) 1%, rgba(23,27,47,1) 60%, rgba(23,27,47,1) 100%);
  background: -webkit-linear-gradient(top, rgba(23,27,47,0) 0%,rgba(23,27,47,0.02) 1%,rgba(23,27,47,1) 60%,rgba(23,27,47,1) 100%);
  background: linear-gradient(to bottom, rgba(23,27,47,0) 0%,rgba(23,27,47,0.02) 1%,rgba(23,27,47,1) 60%,rgba(23,27,47,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00171b2f', endColorstr='#171b2f',GradientType=0 );
}

.gradBlende{
  display: none;
  top: -200px;
  height: 200px;
}
.responsiveContainer{
  width: 300px;
  height: 100%;
  left: 0;
  right: 0;
  margin: auto;
}
.ball{
  position: absolute;
  width: 49px;
  height: 49px;
  bottom: 17px;
  right: 13px;
}

.ball img{
  width: 100%;
  height: 100%;
}
.ballContainer{
/*  display: none;*/
  width: 300px;
  height: 600px;
  transform-origin: 50% 0%;
  top: 0;
}
.logo img{
  position: absolute;
  right: 0;
  bottom: -140px;
  width: 178px;
  height: auto;
}
.ballContainer{
  top: auto;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  transform-origin: 50% 100%;
}

.blende{
  background-color: #ff3901;
  position: absolute;
  width: 100%;
  height: 100%;
}
.blendeBall{
/*  background-image: url(./FuFr_ball_300x600_str_F2_v1.png);*/
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  display: flex;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 20%;
  height: 20%;
  max-width: 150px;
  -webkit-transform: rotate(-25deg);
  transform: rotate(-25deg);
}
.blendeBall img{
  margin: auto;
  width: 100%;
  height: 100%;
}
/*-------------------------------------------------------------ANIMATIONS-------------------------------------------------------------*/

.blende.animated{
  -webkit-animation: glowFadeIn1 0.8s ease-in forwards 1;
  animation: glowFadeIn1 0.8s ease-in forwards 1;
}
@-webkit-keyframes glowFadeIn1 {
  0%{opacity: 1;}
  100%{opacity: 0;}
}
@keyframes glowFadeIn1 {
  0%{opacity: 1;}
  100%{opacity: 0;}
}

.fadeOut{
  -webkit-animation: fadeOut 0.2s ease-in-out forwards 1;
  animation: fadeOut 0.2s ease-in-out forwards 1;
}
@-webkit-keyframes fadeOut {
  0%{opacity: 1; -webkit-transform: scale(1);}
  100%{opacity: 0; -webkit-transform: scale(0.2);}
}
@keyframes fadeOut {
  0%{opacity: 1; transform: scale(1);}
  100%{opacity: 0; transform: scale(0.2);}
}


.animated.rosin{
  -webkit-animation: rosinAnim 1s ease-in-out forwards 1;
  animation: rosinAnim 1s ease-in-out forwards 1;
}
@-webkit-keyframes rosinAnim {
  0%{ top: 600px;}
  60%{ top: -10px;}
  80%{ top: 5px;}
  90%{ top: -2px;}
  100%{ top: 0px;}
}
@keyframes rosinAnim {
  0%{ top: 600px;}
  60%{ top: -10px;}
  80%{ top: 5px;}
  90%{ top: -2px;}
  100%{ top: 0px;}
}

.fullBg.animated {
 -webkit-animation: bgAnim 2s ease-in-out forwards 1;
  animation: bgAnim 2s ease-in-out forwards 1;
}
@-webkit-keyframes bgAnim {
  0%{ -webkit-transform: scale(1.4); }
  100%{ -webkit-transform: scale(1); }
}
@keyframes bgAnim {
  0%{ transform: scale(1.4); }
  100%{ transform: scale(1); }
}

.animated .flare{
 -webkit-animation: flareAnim 2s ease-in forwards 1;
  animation: flareAnim 2s ease-in forwards 1;
}
@-webkit-keyframes flareAnim {
  0%{ -webkit-transform: scale(2); opacity: 0.7; }
  100%{ -webkit-transform: scale(0.5); opacity: 0;}
}
@keyframes flareAnim {
  0%{ transform: scale(2); opacity: 0.7; }
  100%{ transform: scale(0.5); opacity: 0;}
}


.title,.textTop,.textTop2,.title2,.date{
  opacity: 0;
}
.animated .textTop{
 -webkit-animation: slindeInLeft 0.5s ease-in-out forwards 1;
  animation: slindeInLeft 0.5s ease-in-out forwards 1;
}


.animated .textTop2{
  -webkit-animation: slindeInRight 0.5s ease-in-out 0.2s forwards 1;
  animation: slindeInRight 0.5s ease-in-out 0.2s forwards 1;
}


@-webkit-keyframes slindeInLeft {
  0%{ left: -100px; opacity: 0;}
  60%{ left: 10px; opacity: 1;}
  100%{ left: 0px; opacity: 1;}
}
@keyframes slindeInLeft {
  0%{ left: -100px; opacity: 0;}
  60%{ left: 10px; opacity: 1;}
  100%{ left: 0px; opacity: 1;}
}

@-webkit-keyframes slindeInRight {
  0%{ left: 100px; opacity: 0;}
  60%{ left: -10px; opacity: 1;}
  100%{ left: 0px; opacity: 1;}
}
@keyframes slindeInRight {
  0%{ left: 100px; opacity: 0;}
  60%{ left: -10px; opacity: 1;}
  100%{ left: 0px; opacity: 1;}
}


@-webkit-keyframes fadeOut {
  0%{ opacity: 1;}
  100%{ opacity: 0;}
}
@keyframes fadeOut {
  0%{ opacity: 1;}
  100%{ opacity: 0;}
}
.animated .title{
/*  display: none;*/
 -webkit-animation: textAnim 0.5s ease-in-out forwards 1;
  animation: textAnim 0.5s ease-in-out forwards 1;
}
.animated .title2{
 -webkit-animation: textAnim2 0.5s ease-out 0.6s forwards 1;
  animation: textAnim2 0.5s ease-out 0.6s forwards 1;
}
.animated .date{
 -webkit-animation: textAnim2 0.5s ease-out 0.8s forwards 1;
  animation: textAnim2 0.5s ease-out 0.8s forwards 1;
}

@-webkit-keyframes textAnim {
  0%{ top: 200px; opacity: 0;}
  40%{ opacity: 0;}
  70%{ top: -5px; opacity: 1;}
  100%{ top: 0px; opacity: 1;}
}
@keyframes textAnim {
  0%{ top: 200px; opacity: 0;}
  40%{ opacity: 0;}
  80%{ top: -5px; opacity: 1;}
  100%{ top: 0px; opacity: 1;}
}

@-webkit-keyframes textAnim2 {
  0%{ left: 50px; opacity: 0;}
  60%{ left: -2px; opacity: 1;}
  100%{ left: 0px; opacity: 1;}
}
@keyframes textAnim2 {
  0%{ left: 50px; opacity: 0;}
  60%{ left: -2px; opacity: 1;}
  100%{ left: 0px; opacity: 1;}
}
.ctaBtn{
  opacity: 0;
  transform-origin: 70% 49%;
}
.cta{
  top: 256px;
  width: 900px;
  left: -300px;
  height: 74px;
  transform-origin: 47% 50%;
  -webkit-transform: rotate(-6deg);
  transform: rotate(-6deg);

}

.ctaContainer{
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-transform: scaleY(0.1);
  transform: scaleY(0.1);
  opacity: 0;
}

.ctaText{
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
}


.ctaText{
  left: -500px;
  opacity: 0;
}

.ctaAnim .ctaContainer{
  -webkit-animation: ctaAnimIn 0.4s ease-in-out forwards 1;
    animation: ctaAnimIn 0.4s ease-in-out forwards 1;
}

@-webkit-keyframes ctaAnimIn {
  0%{ -webkit-transform: scaleY(0.1); opacity: 0;}
  40%{ opacity: 1;}
  70%{ -webkit-transform: scaleY(1.1);}
  100%{ -webkit-transform: scaleY(1); opacity: 1;}
}
@keyframes ctaAnimIn {
  0%{ transform: scaleY(0.1); opacity: 0;}
  40%{ opacity: 1;}
  70%{ transform: scaleY(1.1);}
  100%{ transform: scaleY(1); opacity: 1;}
}

.ctaAnim .ctaText{
  -webkit-animation: ctaSlideAnim 0.5s ease-in-out forwards 1;
    animation: ctaSlideAnim 0.5s ease-in-out forwards 1;
}

@-webkit-keyframes ctaSlideAnim {
  0%{ left: -500px; opacity: 0;}
  60%{ left: 20px; opacity: 1;}
  100%{ left: 0px; opacity: 1;}
}
@keyframes ctaSlideAnim {
  0%{ left: -500px; opacity: 0;}
  60%{ left: 20px; opacity: 1;}
  100%{ left: 0px; opacity: 1;}
}

.ctaButtonOrange{
  -webkit-backface-visibility: hidden;
    -webkit-transform: translateZ(0) scale(0.9, 0.9);
  transform: translateZ(0) scale(.9, 0.9);
  width: 154px;
  height: 33px;
  background-color: #ff3900;
  position: absolute;
  bottom: 13px;
  left: 120px;
/*  left: 0px;*/
  right: 0;
  margin: auto;
  border-radius: 15px;
  z-index: 0;
  box-shadow: 0px 5px 6px rgba(0, 0, 0, 0.2);
}

.ctaBounce{
  	-webkit-animation: ctaBounce 2s ease-in-out forwards 1;
    animation: ctaBounce 2s ease-in-out forwards 1;
}
@-webkit-keyframes ctaBounce {
  0%{opacity: 1; -webkit-transform: scale(1) translateZ(0);}
  12%{opacity: 1; -webkit-transform: scale(1.1) translateZ(0);}
  25%{opacity: 1; -webkit-transform: scale(1) translateZ(0);}
  75%{opacity: 1; -webkit-transform: scale(1) translateZ(0);}
  87%{opacity: 1; -webkit-transform: scale(1.1) translateZ(0);}
  100%{opacity: 1; -webkit-transform: scale(1) translateZ(0);}
}
@keyframes ctaBounce {
  0%{opacity: 1; transform: scale(1) translateZ(0);}
  12%{opacity: 1; transform: scale(1.1) translateZ(0);}
  25%{opacity: 1; transform: scale(1) translateZ(0);}
  75%{opacity: 1; transform: scale(1) translateZ(0);}
  87%{opacity: 1; transform: scale(1.1) translateZ(0);}
  100%{opacity: 1; transform: scale(1) translateZ(0);}
}

.ctaIn{
  	-webkit-animation: ctaIn 0.5s ease-in-out 0.3s forwards 1;
    animation: ctaIn 0.5s ease-in-out forwards 0.3s 1;
}
@-webkit-keyframes ctaIn {
  0%{opacity: 0; -webkit-transform: scale(0.5);}
  50%{opacity: 1; -webkit-transform: scale(1.1);}
  100%{opacity: 1; -webkit-transform: scale(1);}
}
@keyframes ctaIn {
  0%{opacity: 0; transform: scale(0.5);}
  50%{opacity: 1; transform: scale(1.1);}
  100%{opacity: 1; transform: scale(1);}
}

.ctaBody{
  
  position: absolute;
  width: 100%;
  height: 100%;
background: rgb(98,11,46);
background: -moz-linear-gradient(left, rgba(98,11,46,1) 15%, rgba(21,101,151,1) 40%, rgba(21,101,151,1) 60%, rgba(98,11,46,1) 85%);
background: -webkit-linear-gradient(left, rgba(98,11,46,1) 15%,rgba(21,101,151,1) 40%,rgba(21,101,151,1) 60%,rgba(98,11,46,1) 85%);
background: linear-gradient(to right, rgba(98,11,46,1) 15%,rgba(21,101,151,1) 40%,rgba(21,101,151,1) 60%,rgba(98,11,46,1) 85%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#620b2e', endColorstr='#620b2e',GradientType=1 );
  
}


.ctaShadow{
  top: 0;
  left: 20%;;
  position: absolute;
  width: 60%;
  height: 100%;
  margin: auto;
  box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.2);
}

.ctaInteractive:hover .ctaShadow{
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

.ctaInteractive:hover{
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

.ctaBtnShadow{
  position: absolute;
  opacity: 1;
  box-shadow: 2px -2px 10px rgba(0, 0, 0, 0.37);
  border-radius: 50%;
  background-color: #156597;
  
}



.blendeAnimOut{
    -webkit-animation: blendeAnimOut 1s ease-in-out forwards 1;
    animation: blendeAnimOut 1s ease-in-out forwards 1;
}

@-webkit-keyframes blendeAnimOut {
  0%{top: 0%}
  100%{top: calc(100% + 200px);}
}
@keyframes blendeAnimOut {
  0%{top: 0%}
  100%{top: calc(100% + 200px);}
}

.blendeAnimIn{
    -webkit-animation: blendeAnimIn 1s ease-in-out forwards 1;
    animation: blendeAnimIn 1s ease-in-out forwards 1;
}

@-webkit-keyframes blendeAnimIn {
  100%{top: 0%}
  0%{top: calc(100% + 200px);}
}
@keyframes blendeAnimIn {
  100%{top: 0%}
  0%{top: calc(100% + 200px);}
}


.shutterBallInit{
  -webkit-transform: rotate(-25deg);
  transform: rotate(-25deg);
  animation: shutterBallInit 0.5s ease-in 1 forwards;
  -webkit-animation: shutterBallInit 0.5s ease-in 1 forwards;
}
@-webkit-keyframes shutterBallInit {
  0%{opacity:0; -webkit-transform: rotate(-50deg);}
  100%{opacity: 1; -webkit-transform: rotate(-25deg);}
}

@keyframes shutterBallInit  {
  0%{opacity:0; transform: rotate(-50deg);}
  100%{opacity: 1; transform: rotate(-25deg);}
}

.shutterBallOut {
    animation: shutterBallOut 1s linear 1s forwards;
    -webkit-animation: shutterBallOut 1s linear 1 forwards;
}
@-webkit-keyframes shutterBallOut {
  0%{-webkit-transform: rotate(-25deg);opacity:1;top: 0;}
  30%{top: 0;}
  60%{-webkit-transform: rotate(0deg);opacity:1;}
  100%{opacity: 0;top: -90%;}
}
@keyframes shutterBallOut {
  0%{transform: rotate(-25deg);opacity:1;top: 0;}
  30%{top: 0;}
  60%{transform: rotate(0deg);opacity:1;}
  100%{opacity: 0; top: -90%;}
}

.shutterBallIn {
  -webkit-animation: shutterBallIn 1s linear 1 forwards;
    animation: shutterBallIn 1s linear 1 forwards;
    
}
@-webkit-keyframes shutterBallIn {
  0%{-webkit-transform: rotate(-100deg);opacity: 0;}
  50%{opacity: 1;}
  100%{-webkit-transform: rotate(-25deg);opacity:1}
}

@keyframes shutterBallIn {
  0%{transform: rotate(-100deg);opacity: 0;}
  50%{opacity: 1;}
  100%{transform: rotate(-25deg);opacity:1;}
}

.logo.animated{
  	-webkit-animation: LogoAnim 0.5s ease-in-out forwards 1;
    animation: LogoAnim 0.5s ease-in-out forwards 1;
}

@-webkit-keyframes LogoAnim {
  0%{opacity: 0; top: 200px; left: 200px;}
  50%{opacity: 1;}
  100%{opacity: 1; top: 0; left: 0;}
}

@keyframes LogoAnim {
  0%{opacity: 0; top: 200px; left: 200px;}
  50%{opacity: 1;}
  100%{opacity: 1; top: 0; left: 0;}
}

/*________________________________VIDEO_______________________*/

.videoContainer{
  position: absolute;
  bottom: 0px;
/*    display: none;*/
    pointer-events: none;
    height: 405px;
    width: 100%;
    transform-origin: 50% 40%;
  
-webkit-transition: all 800ms cubic-bezier(0.675, 0.005, 0.235, 1); /* older webkit */
-webkit-transition: all 800ms cubic-bezier(0.675, 0.005, 0.235, 1.310); 
   -moz-transition: all 800ms cubic-bezier(0.675, 0.005, 0.235, 1.310); 
     -o-transition: all 800ms cubic-bezier(0.675, 0.005, 0.235, 1.310); 
        transition: all 800ms cubic-bezier(0.675, 0.005, 0.235, 1.310); /* custom */
  
  
/*
    -webkit-transition-duration: 0.3s; 
    transition-duration: 0.3s; 
  
  -webkit-transition-timing-function: ease-in-out;
  transition-timing-function: ease-in-out;
*/
  
}

.videoContainer.videoHidden{
  -webkit-transform: scaleY(0.01) scaleX(0.5);
  transform: scaleY(0.01) scaleX(0.5);
  opacity: 0;
}
.videoContainer.videoVisible{
  -webkit-transform: scaleY(1) scaleX(1);
  transform: scaleY(1) scaleX(1);
  opacity: 1;
}

#videoElem{
  position: absolute;
  pointer-events: all;
  transform-origin: 50% 50%;
  bottom: 215px;
  width: 300px;
  height: 170px;
  left: 0;
  right: 0;
  margin: auto;
  margin-top: 0px;
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition-duration: 0.5s; 
  transition-duration: 0.5s; 
}
/*
 #videoElem.videoHidden{
  top: -50px;
  opacity: 0;
}
#videoElem.videoVisible{
  top: 0px;
  opacity: 1;
}
*/

adform-video-seek-bar-border,
.adform-video-seek-bar-border,
.adform-video-seek-bar-background,
.adform-video-seek-bar-loaded,
.adform-video-seek-bar-played,
.adform-video-full-screen, .adform-video-big-play{
    display: none;
}

.adform-video-play-pause, .adform-video-stop, .adform-video-rewind, .adform-video-full-screen, .adform-video-sound {
    width: 15px;
    height: 15px;
}
.adform-video-play-pause {
    left: 5px;
    bottom: 8px;
}

.adform-video-sound {
    right:5px;
    bottom: 8px;
}

.video-container video{
    width: 300px;
    height: auto;
}