:root {
    --maskTop: 108px;
    --width: 300px;
    --height: 250px;
}

.banner {
    width:var(--width);
    height:var(--height);
    border:1px solid #333;
    background:#fff;
    overflow:hidden;
    box-sizing:border-box;
    font-family:Arial,Helvetica,sans-serif;
}

#loader-container {
    display:none;
}

#btn-exit{
    width:100%;
    height:100%;   
    cursor:pointer;
    opacity:0;
}

.size{
    top:-1px;
    left:-1px;
    width:var(--width);
    height:250px;
}

#frame{
    box-sizing: border-box;
    width:var(--width);
    height:var(--height);
    border:5px solid #fff;
}

#BG1{
    background:url(../img/BG1.jpg);
    background-size:contain;

}

#BG2{
    background:url(../img/BG2.jpg);
    background-size:contain;


}

#logos{
    background:url(../img/logos.png);
    background-size:contain;
}

#copy1{
    background:url(../img/copy1.png);
    background-size:contain;
    opacity:0;
}

#copy1_2{
    background:url(../img/copy1_2.png);
    background-size:contain;
    opacity:0;
    top: 1px;
}

#copyMask{
    width: var(--width);
    height: 35px;
    top: var(--maskTop);
    left: 0px;
    overflow: hidden;
}

#copyColor1{
    background:url(../img/copyColor1.png);
    background-size:contain;
    width: var(--width);
    height: var(--height);
    top: calc(var(--maskTop) * -1);
}

#copyColor2{
    background:url(../img/copyColor2.png);
    background-size:contain;
    width: var(--width);
    height: var(--height);
    top: calc(var(--maskTop) * -1);
}

#copyColor3{
    background:url(../img/copyColor3.png);
    background-size:contain;
    width: var(--width);
    height: var(--height);
    top: calc(var(--maskTop) * -1);
}


#copy2{
    background:url(../img/copy2.png);
    background-size:contain;
    opacity: 0;
}

#copy3{
    background:url(../img/copy3.png);
    background-size:contain;
    transform: scale(0.6);
    opacity: 0;
    transform-origin: 50% 30%
}

#copy3_2{
    background:url(../img/copy3_2.png);
    background-size:contain;
    opacity: 0;
}

#copy3_3{
    background:url(../img/copy3_3.png);
    background-size:contain;
    opacity: 0;
    transform-origin: 52% 40%
}



#cta{
    background:url(../img/cta.png);
    background-size:contain;
    opacity: 0;
    transform: scale(0.6);
    width: var(--width);
    height: 600px;
}



#legend{
    bottom:12px;
    left:20px;
    height:20px;
}

#legend p{
    color:#d1d1d1;
    font-size:16px;
}

.black{
    color:#000;
}