@font-face {
    font-family: 'GretaSansL';
    src: url('https://static-assets.vqtech.nl/INSIFR/fonts/GretaSansL-Regular.woff');
    font-weight: normal;
    font-style: normal;
  }

  body {
    font-family: 'GretaSansL', sans-serif;
  }

  .vld-overlay .vld-icon svg {
    fill: #FFF;
  }

  .vl-overlay .vl-icon svg {
    fill: #FFF
  }

  .mea-easy-launch-app {
    background: #30917E;
    border-radius: 12px;
    width: 100%;
    height: 100%;
    overflow: hidden;
    color: #FFF;
    font-family: 'GretaSansL', sans-serif;
  }

  .mea-easy-launch-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    gap: 24px;
    padding: 0px 0px 0px 16px;
  }

  .mea-expiry-result,
  .mea-pan-result,
  .mea-pin-result,
  .mea-cardholder-result,
  .mea-cvv-result {
    margin:0;
    padding:0;
    text-align: left;
    font-size:16px;
  }

  .mea-copy-btn {
    background-repeat: no-repeat no-repeat;
    background-position: center center;
    background-size: cover;
    height: 21px;
    width: 21px;
    display: inline-block;
    margin-left: 7px;
    margin-top: 3px;
    vertical-align: bottom;
    cursor: pointer;
    background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' standalone='no'?%3E%3C!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 20010904//EN' 'http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd'%3E%3Csvg version='1.0' xmlns='http://www.w3.org/2000/svg' width='24.000000pt' height='24.000000pt' viewBox='0 0 24.000000 24.000000' preserveAspectRatio='xMidYMid meet'%3E%3Cg transform='translate(0.000000,24.000000) scale(0.100000,-0.100000)' fill='%23000000' stroke='none'%3E%3Cpath d='M20 140 c0 -47 4 -80 10 -80 6 0 10 30 10 70 l0 70 70 0 c40 0 70 4 70 10 0 6 -33 10 -80 10 l-80 0 0 -80z'/%3E%3Cpath d='M60 100 l0 -80 80 0 80 0 0 80 0 80 -80 0 -80 0 0 -80z m140 0 l0 -60 -60 0 -60 0 0 60 0 60 60 0 60 0 0 -60z'/%3E%3C/g%3E%3C/svg%3E");
    transition: all 0.2s ease-in;
  }

  .mea-copy-btn:active {
    animation: pulse 1s infinite;
  }

  .mea-preloaded-data-overlay {
    position: absolute;
    width: 100%;
    height: 100%;
  }

  .mea-preloaded-data-overlay .mea-show-card-details {
    display: none;
  }

  .mea-show-card-details::before {
    content: " ";
    background-repeat: no-repeat no-repeat;
    background-position: center center;
    background-size: cover;
    height: 25px;
    width: 25px;
    display: inline-block;
    vertical-align: top;
    margin-right: 10px;
    background-image: url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 1000 1000' enable-background='new 0 0 1000 1000' xml:space='preserve'%3E%3Cmetadata%3E Svg Vector Icons : http://www.onlinewebfonts.com/icon %3C/metadata%3E%3Cg%3E%3Cpath fill='%236495ED' d='M920,500c-55.4-86-124.9-150.4-208.3-193C733.9,344.9,745,385.9,745,430c0,67.5-24,125.1-71.9,173.1C625.2,651,567.5,675,500,675c-67.4,0-125.1-23.9-173.1-71.9c-47.9-48-71.9-105.7-71.9-173.1c0-44.1,11.1-85.1,33.4-123.1c-83.5,42.7-152.9,107-208.3,193c48.5,74.7,109.3,134.2,182.4,178.6C335.5,722.9,414.7,745,500,745c85.3,0,164.5-22.2,237.6-66.4C810.7,634.3,871.5,574.8,920,500L920,500z M526.3,290c0-7.3-2.6-13.5-7.7-18.6s-11.3-7.6-18.6-7.7c-45.6,0-84.7,16.3-117.3,48.9c-32.6,32.6-49,71.7-48.9,117.3c0,7.3,2.6,13.5,7.7,18.6c5.1,5.1,11.3,7.6,18.6,7.7c7.3,0,13.5-2.5,18.6-7.7c5.1-5.1,7.7-11.3,7.7-18.6c0-31.4,11.1-58.2,33.4-80.4s49-33.4,80.4-33.4c7.3,0,13.5-2.6,18.6-7.7C523.7,303.5,526.3,297.3,526.3,290L526.3,290z M990,500c0,12.4-3.7,25-11,37.7c-51,83.9-119.7,151-205.9,201.5C686.9,789.7,595.9,815,500,815c-95.9,0-186.9-25.3-273.2-76C140.6,688.3,72,621.2,21,537.7C13.7,525,10,512.4,10,500c0-12.4,3.7-25,11-37.7C72,378.8,140.6,311.7,226.8,261c86.2-50.7,177.3-76,273.2-76c95.9,0,186.9,25.3,273.2,76C859.4,311.7,928,378.8,979,462.3C986.3,475,990,487.6,990,500L990,500z'/%3E%3C/g%3E%3C/svg%3E");
  }

  .mea-preloaded-data-overlay:hover .mea-show-card-details {
    display: block !important;
    margin: 25% auto 0;
    text-align: center;
    height: 100%;
    font-size: 20px;
    color: #6495ed;
  }

  .mea-preloaded-data-overlay:hover {
    opacity: 0.7;
    z-index: 1;
    background-color: white;
    cursor: pointer;
    border-radius: 15px;
  }

  .mea-field-value {
    position: relative;
    display: inline-block;
  }

  .mea-field-value .mea-tooltiptext {
    visibility: hidden;
    width: 120px;
    bottom: 110%;
    left: 50%;
    margin-left: -60px;
    background-color: black;
    color: #fff;
    text-align: center;
    padding: 5px 0;
    border-radius: 6px;
    position: absolute;
    z-index: 1;
    font-size: 12px;
  }

  .mea-field-value .mea-tooltiptext::after {
    content: " ";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: black transparent transparent transparent;
  }

  .mea-field-value.mea-tooltip-cvv .mea-tooltiptext {
    left: 93%;
    margin-left: 10px;
    bottom: inherit;
  }

  .mea-field-value.mea-tooltip-cvv .mea-tooltiptext::after {
    top: 30%;
    left: -4%;
    border-color: transparent black transparent transparent;
  }

  .mea-field-value:hover .mea-tooltiptext {
    visibility: visible;
  }

  .mea-field-value[class*="mea-tooltip-"] {
    cursor: pointer;
  }

  .mea-field-name {
    font-weight: bold;
    display: flex;
    flex-direction: column;
  }

  @keyframes pulse {
    0% {
      transform: scale(0.95);
    }
    100% {
      transform: scale(1);
    }
  }

  .mea-magnetic-stripe {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 16px;
    width: 36px;
    background-color: #313131;
  }