button{
    background: #14161a;
    border: none;
    box-shadow: 0px 0px 4px 2px rgba(255, 255, 255, 0.089) !important;
    border-radius: 10px;
    color: white;
    display: inline-grid;
    transform: translateY(0);
    transition: all 0.4s;
}
button:hover,.exchangelink:hover{
    box-shadow: 0px 2px 4px 4px rgba(255, 255, 255, 0.089) !important;
    transform: translateY(-8px);
    transition: all 0.4s;
}
@media screen and (min-width:768px) {
    .exchangelink{
        margin: 20px auto 20px auto;
        max-width: 740px;
        padding: 20px;
    }
    .friend-links{
        display: grid;
        gap: 1rem;
        margin: 0 auto;
        padding: 0;
        grid-template-columns: 384px 384px;
        grid-template-rows: 20rem 20rem 20rem 20rem 20rem 20rem 20rem;
        max-width: 780px;
    }
    .content{
        display: grid;
        gap: 1rem;
        margin: 0 auto;
        padding: 0;
        grid-template-columns: 384px 384px;
        grid-template-rows: 20rem 20rem 20rem 20rem 20rem 20rem 20rem;
        max-width: 780px
    }
    button h2{
        max-height: 1.5rem;
        position: relative;
        bottom: -2rem;
        font-size: 2em;
        margin: 0 auto;
    }
    button p{
        margin: 0%;
        font-size: 2.2em;
        font-weight: 300;
    }
    button img{
        width: 140px;
        position: relative;
        top: 2em;
    }
}
@media screen and (max-width:769px) {
    .exchangelink{
        max-width: 260px;
        margin: 10px auto 20px auto;
        padding: 10px 20px;
    }
    .friend-links{
        display: grid;
        gap: 1rem;
        margin: 0 auto;
        padding: 0;
        grid-template-columns: 300px;
        grid-template-rows: 15rem 15rem 15rem 15rem 15rem 15rem 15rem 15rem 15rem 15rem 15rem 15rem 15rem;
        max-width: 305px
    }
    .content{
        display: grid;
        gap: 1rem;
        margin: 0 auto;
        padding: 0;
        grid-template-columns: 300px;
        grid-template-rows: 15rem 15rem 15rem 15rem 15rem 15rem 15rem 15rem 15rem 15rem 15rem 15rem 15rem;
        max-width: 305px
    }
    button h2{
        max-height: 1.5rem;
        position: relative;
        bottom: -0.5rem;
        font-size: 1.6rem;
        margin: 0 auto;
    }
    button p{
        font-size: 1.2rem;
        font-weight: 300;
        margin: 0;
    }
    button img{
        width: 100px;
        position: relative;
        top: 1.5em;
    }
    
}
button img{
    margin: 0 auto;
    border-radius: 50%;
}
button p{
    max-height: 3.2rem;
    font-size: 1rem;
    font-weight: 300;
    overflow: hidden;
    width: 17rem;
    margin: 0 auto;
}
.exchangelink{
    color: white;
    border-radius: 10px;
    transform: translateY(0);
    transition: all 0.4s;
    box-shadow: 0px 1px 4px 4px rgba(255, 255, 255, 0.089) !important;
}
.exchangelink h2{
    margin: 0;
}
.linkul li a{
    color: blue;
    text-decoration: none;
    display: inline-block; width: 100%; word-wrap: break-word; white-space: normal;
}
a{
    color: blue;
    text-decoration: none;
}