.AKCE-BG
{
     overflow: hidden;
     padding: 2vw;
}

@media (min-width: 1300px) {

     .AKCE-BG,
     .AKCE-BG .AKCE,
     .AKCE-BG .AKCE-PLAKAT,
     .AKCE-BG .AKCE-INFO
     {
          height: 25vw;
     }

}

@media (min-width: 1000px) and (max-width: 1300px) {

     .AKCE-BG,
     .AKCE-BG .AKCE,
     .AKCE-BG .AKCE-PLAKAT,
     .AKCE-BG .AKCE-INFO
     {
          height: 33.3vw;
     }

}

@media (min-width: 700px) and (max-width: 1000px) {

     .AKCE-BG,
     .AKCE-BG .AKCE,
     .AKCE-BG .AKCE-PLAKAT,
     .AKCE-BG .AKCE-INFO
     {
          height: 48vw;
     }

}

@media (max-width: 700px) {

     .AKCE-BG,
     .AKCE-BG .AKCE,
     .AKCE-BG .AKCE-PLAKAT,
     .AKCE-BG .AKCE-INFO
     {
          height: 96vw;
     }

}

.AKCE-BG:hover .AKCE-INFO
{
     width: 100%;
}

.AKCE-BG .AKCE-PLAKAT
{
     z-index: 1000;
     transition: .3s;
     width: 100%;
     left: 0;
     top: 0;
     position: absolute;
}

.AKCE-BG .AKCE-PLAKAT IMG
{
     width: 100%;
     height: 100%;
}

.AKCE-BG .AKCE-INFO,
.AKCE-BG .AKCE
{
     position: absolute;
     transition: .3s;
     z-index: 2000;
}

.AKCE-BG .AKCE
{
     padding: 25px;
     left: 0;
     top: 0;
     width: 100%;
}

.AKCE-BG .AKCE-INFO
{
     left: 50%;
     top: 0;
     width: 0;
     overflow: hidden;
     padding: 25px 0;
     filter: alpha(opacity=90);
     opacity: 0.9;
}

.AKCE-BG .A-VEREJNA
{
     background-color: var(--diff1-bg);
}

.AKCE-BG .A-NEVEREJNA
{
     background-color: var(--diff2-bg);
}

.AKCE-BG .A-ZRUSENA
{
     background-color: var(--basic-bg-hover);
}

.AKCE-BG:hover .AKCE-INFO
{
     left: 0;
     padding: 25px;
     overflow: auto;
}

.AKCE-BG:hover .AKCE H2
{
     box-shadow: inset 0 -5px 0 var(--basic-fg);
}

.AKCE > I,
.AKCE-INFO > I
{
     position: absolute;
     right: 10px;
     bottom: 10px;
     z-index: 2001;
     font-size: 200%;
     border-radius: 10px;
}


.AKCE-INFO P,
.AKCE P
{
     line-height: 120%;
     padding: 25px 0 5px 0;
}