MediaWiki:Common.css

/* CSS placed here will be applied to all skins */

@import url(https://fonts.googleapis.com/css?family=Roboto:400,700);

* {
    font-family: 'Roboto', sans-serif;
}

h1 {
    font-family: 'Roboto', sans-serif !important;
}

#p-logo-text a {
    font-family: 'Roboto', sans-serif !important;
}

#p-banner{position:relative}
#p-banner:after{content:"";position:absolute;left:0;top:0;width:100%;height:100%;background: #fff url(/images/e/ec/OnsetDeveloperWiki.png) 50% 50% / contain;background-repeat: repeat;
background-repeat: no-repeat;}

.noprint {
    border-radius: 3px;
    border: 1px solid #ddd !important;
    background: #fbfbfb !important;
    padding: 10px 5px 0 !important;
}

/* Onset Cards */
.card {
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
    transition: 0.3s;
    width: 24%;
    float: left;
    margin-left: 10px;
    margin-top: 10px;
}

@media (max-width: 600px)
{
    .card {
        box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
        transition: 0.3s;
        width: 45%;
        float: left;
        margin: 10px 0px 0px 10px;
        font-size: .8em;
    }
}

@media (min-width: 601px) and (max-width: 1024px)
{
    .card {
        box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
        transition: 0.3s;
        width: 32%;
        float: left;
        margin: 10px 0px 0px 10px;
        font-size: .8em;
    }
}

.card:hover {
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
}

.cardcontainer {
    padding: 2px 16px;
}