.specialHeader { width: 100%; margin:0; }
.main { background-color: white; }

@media (max-width: 1050px)  { 
   .specialHeader { margin-top: 20px; }
}

.articles { margin-top: 50px; margin-bottom: 50px; }
.articles img { max-width: 390px; width: 100%; border-radius: 10px 10px 0 0;}
.articles .middle2 { float: left; width: calc(33.3% - 40px); min-width: 309px; }
.articles .middle2 h3 { font-size: 20px;  line-height: 30px; text-align: left; margin: 0 10px 0 10px; 
                        display: -webkit-box;
                        -webkit-box-orient: vertical;
                        -webkit-line-clamp: 2;       /* Maximálně 2 řádky */
                        overflow: hidden;
                        text-overflow: ellipsis; }
.articles .row .middle2 { text-align: center; }
.articles .row .middle2 p { text-align: justify; margin: 10px; font-weight: 400; font-size: 14px;}
.articles .row  a {
                   height: 450px;
                   box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;
                   border-radius: 10px;
                   padding: 0px;
                   margin: -20px 20px 60px 20px; }
.articles .row a:hover img { transform: scale(1.05);  }

.articles .row .image-wrapper {
                               display: inline-block;
                               overflow: hidden;
                               line-height: 0;
                               border-radius: 10px 10px 0 0; 
                              }

.articles .row .virtbox {
  height: 440px;
  overflow: hidden;
  mask-image: linear-gradient(to bottom, black 95%, transparent 100%);
  -webkit-mask-image: linear-gradient(to bottom, black 95%, transparent 100%);
}

@media (max-width: 1060px) {
    .articles .row { display: inline-grid; grid-template-columns: repeat(2, 1fr); width: 700px; margin: 0 auto; } 
    .articles { text-align: center; }

}

.tema-motto { font-size: 16px;
              font-weight: 600;
              margin: 0px auto;
              width: fit-content;}
.tema-button {
  display: inline-block;
  background-color: #ed3237;
  color: white;
  height: 30px;
  font-size: 16px;
  line-height: 28px;
  padding-left: 15%;
  padding-right: 15%;
  transition: all .2s;
  border-radius: 5px;
  margin: 20px 0 20px 0;
  font-weight: 600; }



@media (max-width: 768px) {
    .articles a { text-align: left; }
    .tema-banner-big { display: none; }
    .tema-banner-small { display: block; }
    .articles .row { display: inline-grid; grid-template-columns: repeat(1, 1fr); width: 350px; margin: 0 auto; }
}