@font-face {
    font-family: 'W95';
    src: url('font/W95FA.otf');
}


body {
    background-color: #008584;
    font-family: 'W95';
}

.container {
    width: 90%;
    max-width: 600px;
    margin: 0 auto;
    text-align: center;
    padding: 20px;
}

body h1 {
    color:white;
    font-size: 1.6em;
    font-weight: 100;
}

.icons {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 20px;
}

.icons a {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-decoration: none;
    color: white;
    margin: 10px;
}

.break {
    flex-basis: 100%;
    height: 0;
}

.icons a img {
    width: 72px;
    height: 72px;
}

.links {
    margin-top: 20px;
}

.links a {
    display: block;
    background-color: #c0c0c0;
    color:black;
    padding: 10px;
    margin: 10px 0;
    border-radius: 5px;
    text-decoration: none;
    transition: background-color 0.2s ease;
}

.links a:hover {
    background-color: #009688;
}

.link .content {
    overflow: hidden;
    transition: height 0.5s ease;
    background-color: white;
    height: auto; /* Or specify a fixed height */
}


.content {
    overflow: hidden;
    background-color: white;
    max-height: 0;
    text-align: left;
    
    transition: max-height 0.2s ease-out;
}