@font-face {
  font-family: 'Apercu';
  font-style: normal;
  src: local('Apercu Mono'), local('Apercu-Mono'), url(/fonts/apercu-mono.woff) format('woff');
}

html, body {
    width: 100%;
    height: 100%;
    margin: 0px;
    background-color: #1D1C24;
    font-family: 'Apercu';
}

.bg {
    background-image: url('../images/booklet_inside_lo.jpg');
    background-size: cover;
    position: fixed;
    z-index: 0;
    width: 100%;
    height: 100%;
}

.logo {
    background-image: url('../images/sm-logo-white.png');
    background-repeat: no-repeat;
    background-size: 800px 531px;
    position: fixed;
    z-index: 1;
    width: 100%;
    height: 100%;
    margin-top: 40px;
    margin-left: 40px;
}

.wrapper {
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 2;
    text-align: center;
}

iframe {
    width: 560px;
    height: 315px;
    padding: 0px;
    margin: 20px 0px;
    display: inline-block;
}
iframe.youtube {
    margin-top: -4px;
}
@media (max-width:641px)  {
    iframe {
        width: calc(100% - 40px);
        // height: calc(100% - 40px);
    }
    .logo {
        margin-top: 0px;
        margin-left: 0px;
    }
}
a {
    text-decoration: none;
    color: #FFF;
}
a:hover {
    color: orange;
}