@media only screen and (max-width: 1175px ) {
    #article {width:100%;}
    #article-header {width:100%;}
    #article-contents {width:100%;}
    #article-title {font-size:2.0em !important;}
}

@media only screen and (min-width: 1176px ) {
    #article {width:80%;}
    #article-header {width:80%;}
    #article-contents {width:80%;}
}


#article {
    margin-left:auto;
    margin-right:auto;
}

#article-header {
    margin-left:auto;
    margin-right:auto;
    padding:16px;
}

#article-title {
    margin-left:auto;
    margin-right:auto;
    font-size:3.5em;
    font-weight: 600;
}

#article-image {
    margin-left:auto;
    margin-right:auto;
    width:100%;
    aspect-ratio: 21 / 10;
    object-fit: cover;
}

#article-writer {
    font-weight: 900;
}

#article-contents {
    margin-left:auto;
    margin-right:auto;
    font-size:1.2em;
    padding:16px;
}

#article-contents img {
    width:100%;
    border:0px solid red;
}

#article-contents p {
    margin-bottom:20px !important;
    margin-top:20px !important;
    word-wrap: break-word;
}

.article-media-title {
    color:#aaaaaa;
    text-align: center;
    line-height:80%;
    font-size:80%;
}

.article-image-container {
    width:90%;
    border:0px solid black;
    padding:0;
    padding-left:0%;
    padding-right:0%;
    margin-bottom:10px;
    margin-top:20px;
    margin-left:auto;
    margin-right:auto;
    display:flex;
    flex-direction:column;
    justify-content:center;
}

.iframe-container {
    position: relative;
    overflow: hidden;
    width: 100%;
    padding-top: 56.25%;
}

iframe {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

/* -------------------------------------------------------------- bottom-articles */

#bottom-articles {
    background-color:black;
    color:white;
    width:100%;
    padding: 10px 20px 20px 20px;
    box-sizing: border-box;
}

#bottom-articles > .title {
    font-size:2em;
    font-weight:900;
    margin-top:0;
}

#bottom-articles > .grid {
    background-color:black;
    color:white;
    margin:0;
    display:flex; 
    flex-direction:row;
    flex-wrap:wrap;
    overflow:hidden;
}

#bottom-articles > .grid > .article-card {
    width:25%;
    padding-right:10px;
    padding-left:10px;
}

#bottom-articles > .grid > .article-card > .article-card-cover {
    width:100%;
    aspect-ratio: 16 / 9;    
}

#bottom-articles > .grid > .article-card > .article-card-cover > .article-card-image {
    width:100%;
    height:100%;
    object-fit: cover;
}

#bottom-articles > .grid > .article-card > .article-card-cover > .article-card-image-title {
    display:none;
}

#bottom-articles > .grid > .article-card > .article-card-text > .article-card-title {
    font-size:1.2em;
    overflow:hidden;
}

#bottom-articles > .grid > .article-card > .article-card-text > .article-card-teaser {
    display:none;
}

#bottom-articles > .grid > .article-card > .divider {
    display:none;
}

/* ------------------------ Media queries ------------------------ */
@media only screen and (max-width: 745px ) {
#bottom-articles > .grid > .article-card {width:100% !important;}
}