@media only screen and (max-width: 750px ) {
    .main-grid {flex-direction:column !important;}
    .main-grid > .article-card-cover {width: 100% !important;}
    .main-grid > .article-card-text {width: 100% !important;}
    .main-grid {height:auto !important;}
    .first-element > .article-card-cover > .article-card-image-title {display:none !important;}
    .first-element > .article-card-text > .article-card-title {display:initial !important;}
    .first-element > .article-card-cover > .article-card-title {font-size:1.2em !important;}
}

@media only screen and (max-width: 1100px ) {
    #events-page {grid-template-columns: 100%;}
    #article-grid {padding-right:0;}
    .first-element > .article-card-cover > .article-card-image-title {font-size:2em !important;}
}

@media only screen and (min-width: 1101px ) {
    #events-page {grid-template-columns: 75% 25%;}
    #article-grid {padding-right:16px;}
}

#events-page {
    display:grid;
    margin-left:auto;
    margin-right:auto;
    --grid-margin:32px;
}

.article-card:hover {
    cursor:pointer;
}

/* ------------------------------------------------------------ First element */
.first-element {
    margin-top:var(--grid-margin);
    margin-bottom: var(--grid-margin);
}

.first-element > .article-card-cover > .article-card-image {
    width:100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

.first-element > .article-card-cover > .article-card-image-title {
    display:initial;
    color: white;
    font-size:3.0em;
    text-shadow: 1px 1px 2px black, 0 0 1em black, 0 0 0.2em black;
}

.first-element > .article-card-text > .article-card-title {
    font-size:1.5em;
    display:none;
}

.first-element > .article-card-text > .article-card-teaser {
    font-size:1.2em;
}

/* -------------------------------------------------------------- Main grid */
.main-grid {
    display:flex;
    height:200px;
    margin-top:var(--grid-margin);
    margin-bottom:var(--grid-margin);
}

.main-grid > .article-card-cover {
    width: 35%;
}

.main-grid > .article-card-cover > .article-card-image {
    width:100%;
    height:100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

.main-grid > .article-card-cover > .article-card-image-title {
    display:none;
}

.main-grid > .article-card-text {
    width: 65%;
    overflow:hidden;
}

.main-grid > .article-card-text > .article-card-title {
    font-size:1.5em;
}

.main-grid > .article-card-text > .article-card-teaser {
    font-size:1.2em;
}

/* -------------------------------------------------------------- Sidebar */
#sidebar {
    margin-top:var(--grid-margin);
    background-color:black;
    color:white;
    padding:16px;
    margin-top:var(--grid-margin);
    margin-bottom: var(--grid-margin);
}

.sidebar {
    display:flex; 
    flex-direction:column;
}

.sidebar > .article-card-cover > .article-card-image {
    width:100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

.sidebar > .article-card-cover > .article-card-image-title {
    display:none;
}

.sidebar > .article-card-text > .article-card-title {
    font-size:1.2em;
}

.sidebar > .article-card-text > .article-card-teaser {
    display:none;
}

.sidebar > .divider {
    display:none;
}