*{
margin:0;
padding:0;
box-sizing:border-box;
}

html,
body{
width:100%;
height:100%;
overflow:hidden;
background:#000;
}

.background{
position:fixed;
top:-5%;
left:-5%;
width:110%;
height:110%;
background-size:cover;
background-position:center;
will-change:transform;
opacity:0;
}

.desktop-bg{
background-image:url("desktop.jpg");
display:block;
}

.mobile-bg{
background-image:url("mobile.jpg");
display:none;
}

.desktop-content{
position:absolute;
left:100px;
top:43%;
z-index:10;
}

.logo-desktop{
width:260px;
height:auto;
opacity:0;
}

.email-desktop{
position:absolute;
right:80px;
bottom:60px;
width:140px;
height:auto;
z-index:10;
opacity:0;
}

.mobile-content{
display:none;
}

.email-mobile{
display:none;
}

@media (max-width:768px){

.desktop-bg{
display:none;
}

.mobile-bg{
display:block;
}

.desktop-content{
display:none;
}

.email-desktop{
display:none;
}

.mobile-content{
position:absolute;
left:50%;
top:50%;
transform:translate(-50%,-50%);
display:block;
z-index:10;
}

.logo-mobile{
width:200px;
max-width:70vw;
height:auto;
opacity:0;
}

.email-mobile{
display:block;
position:absolute;
left:50%;
bottom:50px;
transform:translateX(-50%);
width:110px;
height:auto;
z-index:10;
opacity:0;
}