@font-face {
font-family: pou;
src: url('font/Pou ascii.ttf');
}

body {
margin:0 0 0 0;
font-family:pou;
font-size:16px;
background-image:url(img/bg.svg);
background-size: 24px 46px;
}

a {
color: black;
text-decoration:none;
}

a img {
border:0;
}

#games {
text-align:center;
}

#games .game:nth-child(2) { 
margin-top:50;
}

#games .game .name {
padding:40 0 30 0;
font-size:40px;
}

#games .game .logo {
width: 100%;
max-width:414px;
object-fit: contain;
}

.icons {
text-align:center;
}

.icons .set .title {
padding:30 0 15 0; 
font-size:22px;
}

.icons .set .row {
margin-top:0px;
}

.attention {
animation: attention 1.3s infinite;
}

@keyframes attention {
  0% { transform: scale(1,1); }
  50% { transform: scale(1.1,1.1); }
}

.footer {
text-align:center;
padding:40 0 20 0;
}

  
/* Small devices (landscape phones, 576px and up) */

@media (min-width: 576px) {
    
    body {
    margin:20 0 0 0;
    font-size:20px;
    }

    #games .game {
    display: inline-block; 
    }
    
    #games .game:nth-child(2) { 
    margin-top:0;
    }

    #games .game .name {
    padding:60 0 60 0;
    font-size:60px;
    }

    .icons .set {
    display: inline-block;  
    padding:40 80 40 80;
    }

    .icons .set .title {
    padding:0; 
    font-size:30px; 
    }

    .icons .set .row {
    margin-top:40px;
    }

    .icons .set .row .icon {
    padding:0 12 0 12;
    }

    .footer {
    padding:60 0 40 0;
    }
    
}