Forum - Update: Präsentationskalender - Darstellung interessanter Themen - 2

<style>
.calenderTitel {color:#383838 !important; text-shadow: 0 0 0.05em #aaaaaa, 0 0 0.1em #222222; border:1px solid #aaaaaa; display:inline-block !important; padding:5px 20px; border-radius: 5px;background:#eeeeee; margin-bottom:10px; font-size:25px; font-weight:bold; }
.calender {color:#383838; padding: 0px; border-radius: 5px; height:100%; display:flex; flex-direction: row; flex-wrap: wrap !important; justify-content: center;}
 
.myFensterModal {transition: height 0.5s; position:relative;float:left; background:#cccccc; min-width:200px; width:10vw; height:200px; padding:15px; margin:10px; overflow:hidden; overflow-clip-margin: content-box; overflow: clip; text-align:left; cursor:pointer; border-radius:5px; filter: drop-shadow(-0.1em -0.1em 0.1em rgba(255, 255, 255,1)) drop-shadow(0.1em 0.1em 0.1em rgba(0,0,0,1)) drop-shadow(0 0 0.5em rgba(100, 100, 100,.5)); display: inline-block;}
.mobileview .myFensterModal {width:250px;}
.myFensterModal img {transition: height 0.5s; object-fit: contain; object-position: center top; width:100%; margin:auto; display:flex; padding-top:10px; background:#ffffff; padding:10px;}
 
.myFensterModal:hover img {transition: all 1.4s 0.5s ease-in-out; width:85%; padding:10px;}
.myFensterModal:hover {transition: all 1.4s 0.5s ease-in-out; height: 370px; background:#aaaaaa;}
 
.myFensterModal h3 {background:#bbbbcc; font-size: 14px; border-radius: 5px; padding: 3px 16px !important; margin-bottom:10px; border: 1px solid #aaaaaa;}
.myFensterNr {position: absolute; background:#ffffff; border:5px double #aaaaaa; border-radius:10px; bottom:15px; right:38%; left:38%; text-align:center; opacity:0;}
.myFensterModal:hover .myFensterNr {transform: translateX(400%); transition: transform ease-out 2s 3s;  opacity:1;}
 
.closeFenster {position: absolute; top: 0px; right: 15px; color: #f1f1f1; font-size: 40px; font-weight: bold; padding:20px; cursor: pointer;}
.closeFenster:hover {color: #aaaaaa;}
 
#myKalenderModal  {display: none; position: fixed; z-index: 999999; padding-top: 10px; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgb(0,0,0); background-color: rgba(0,0,0,0.9); }
 
#FensterAll {background: #cccccc !important; color:#000000 !important; cursor:pointer; padding:20px; margin:50px 20px 20px 20px; border:5px solid #ffffff; border-radius:5px; box-sizing: border-box; display:inline-block; font-weight:normal; text-align:left; }
#FensterAll h3 {background:#bbbbbb; font-size: 14px; border-radius: 5px; padding: 3px 15px !important; margin-bottom:10px; border: 1px solid #aaaaaa; }
#FensterAll img {object-fit: contain; height:auto; max-height:40vh; width:auto; max-width:50vw; margin:auto; display:flex; background:#ffffff; padding:20px 50px;}
.myFensterText {display:none;box-sizing: border-box;}
 
.calender audio {max-width:280px;}
#breadcrumbs, .col-xl-4 {display:none !important;}
.col {flex: none; max-width: 100%;}
</style>