@charset "utf-8";
/* CSS Document */

.inter-normal {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: normal;
  font-style: normal;
}

.Montserrat-normal {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: normal;
  font-style: normal;
}

body {
  margin: 0 auto;
  padding: 0;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}

#container {
  width: 300px;
  height: 250px;
  overflow: hidden;
  top: 0;
  left: 0;
  position: absolute;
  background-color: #fff;
  display: none;
}

/* Global */
.adSize { position:absolute; top:0px; width:300px; height:250px; }
.defPos { position:absolute; top:0px; left:0px; }
.btn { cursor: pointer; }
.hideElm { display:none; }
.buttonConfig {background-color:#fff;cursor: pointer;opacity: 0;}
.anchorCenter { -webkit-transform-origin: center center; transform-origin: center center; }
.blendingMode { mix-blend-mode:hard-light; }


/* Border */
#border {
  box-sizing: border-box;
  border: 1px solid #808080;
  mix-blend-mode: multiply;
  opacity: 0.5;
}

/*-- BG --*/
#bg { background-color: #fff;}

#bgrect {
  position: absolute;
  background-color: #e01a22;
  width: 300px;
  height: 107px;
  top: 143px;
}

#logo { background: url(logo.svg) no-repeat; background-size: 100%; }

/* Masks */
#mask {
  position: absolute;
  width: 300px;
  height: 143px;
  overflow: hidden;
}

/* Images */
.image {
  position: absolute;
  left: -18px;
  top: -9px;
  width: 336px;
  height: 160px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  transform-origin: 50% 50%;
}

#image1 { background-image: url(image1.jpg); }
#image2 { background-image: url(image2.jpg); }
#image3 { background-image: url(image3.jpg); }

#callout1 { background: url(callout1.svg) no-repeat; background-size: 100%; }
#callout2 { background: url(callout2.svg) no-repeat; background-size: 100%; }

/* CTA */
#cta {position: absolute; left: 209px; top: 219px; width: 19px;height: 19px;background: #fff;border: 1px solid #fff;border-radius: 30px;transform-origin: 50% 50%;overflow: hidden;}
#btn_cta_label, #btn_cta_label_hover {position: absolute; width: auto; height: 21px; top:-1px; left:-1px;}
#btn_cta_label_hover { opacity: 0; }
#label_wrap {position: absolute;top: 0;left: 0;width: 131px;height: 33px;overflow: hidden;}
#btn_cta_redFill {position: relative;bottom: -36px;right: 0;width: 152px;height: 33px;background: #e01a22;}


/* ROUNDEL */
#roundelContainer  {
    position: absolute;
    left: 210px;
    top: 87px;
    width: 80px;
    height: 80px;
}
/* All roundel layers fill container */
#roundelOuterWhite,
#roundelInner,
#roundelCopy1 {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

#roundelOuterWhite { background: url(roundelOuterWhite.svg) no-repeat center; background-size: 100% 100%; }
#roundelInner { background: url(roundelInner.svg) no-repeat center; background-size: 100% 100%; }
#roundelCopy1 { background: url(roundCopy1.svg) no-repeat center; background-size: 100% 100%; }

#text1a { background: url(text1a.png) no-repeat; background-size: 100%; }
#text1b { background: url(text1b.png) no-repeat; background-size: 100%; }
#text2a { background: url(text2a.png) no-repeat; background-size: 100%; }

/*-- ELEMENTS --*/

