

.calendar #vsel .vsel-content {
}

.calendar .vsel-content {
    display: grid;
    position: relative;
    border-bottom: 2px dashed lightgrey;
    line-height: 120%;
}


.calendar .vsel-content h3 {
    grid-area: title;

/*    text-decoration: underline solid var(--ael-theme-color) 0.2em;
    text-underline-offset: 0.3em;        */
/*    line-height: 200%; */
/*    font-size: 180%; */
    font-weight: bold;
    margin-bottom: 1em;
    font-size: 1em;    
}

.calendar .vsel-content h3 a {
    text-decoration: none;
}



.calendar .vsel-meta {
    grid-area: meta;

    width: auto !important;
    display: block;
    float: none;   

    margin: 0;
    padding: 0;   
    
    line-height: 120%;
}


.calendar .vsel-info-block {
    grid-area: content;

    width: auto !important;
    display: block;
    float: none;
    
    padding: 0;
    margin: 0;
}



.calendar .vsel-content .vsel-meta-date {
    font-weight: bold;
    margin: 0px; 
}

.calendar .vsel-content .vsel-meta-time {
    font-weight: bold;
    margin: 0;
}

.calendar .vsel-content .vsel-meta-location {
    margin: 1.2em 0;
}


.calendar .vsel-content p {
    margin: 0;
    margin-top: 0;
    margin-block-start: 0 !important;
}


.calendar .vsel-info a.vsel-read-more {   
   display: block;
   padding: 1em 0px;    
}


.calendar .vsel-acf-accessibility {
    display: none;
}

.calendar .vsel-acf-anmeldung {
    display: none;
}

.vsel-acf-address {
    display: none;
}


/** calendar.main: calendar on startpage/program **/

main {
/*    border-left: 1px solid lightgrey; 
    border-right: 1px solid lightgrey; */
/*    padding-left: 2em !important;
    padding-right: 2em !important;
    box-shadow: -15px 0px 17px -17px rgba(0,0,0,0.5);     */
}

.sidebar {
/*    box-shadow: 15px 0px 17px -17px rgba(0,0,0,0.5);    
    padding-right: 1em; */
}

.calendar.main .vsel-content {
    display: grid;
    grid-template-columns: 250px auto;
    grid-template-rows: auto auto;
    grid-template-areas:
        "title title"
        "meta content"; 

/*    grid-template-columns: auto;
    grid-template-rows: auto auto auto;
        
    grid-template-areas:
        "title"
        "meta"
        "content";  */
        
    column-gap: 2em;
    row-gap: 0;
}


.calendar.main .vsel-meta {
    text-align: right; 
    font-size: 1.2em;
}

.calendar.main .vsel-info-block {
}


/* startpage only */

.calendar.front {
}

.calendar.front > h1.wp-block-heading {
    padding-top: 50px;
    margin-bottom: 50px;
/*    padding-left: 285px; */
/*    text-align: center; */
}

.calendar.front h3 {
    font-size: 1.2em;
}


/* small screen */


@media screen and (max-width: 1600px) {

    .calendar.main .vsel-content {
        grid-template-columns: 250px auto;
    }

}


/* mobile */
@media screen and (max-width: 1023px) {

    .calendar.main .vsel-content {

        display: grid;
        grid-template-columns: auto;
        grid-template-rows: auto auto auto;
        grid-template-areas:
            "title"
            "meta"
            "content";
        
        column-gap: 0;
        row-gap: 0;        
    }
    
    
    .calendar.main #vsel .vsel-content {
        padding-left: 1em;
        padding-right: 1em;
    }

    .calendar.main .vsel-meta {
        text-align: left;
    }


    .calendar.main .vsel-content .vsel-meta-date {
        display: inline;
    }

    .calendar.main .vsel-content .vsel-meta-date::after {
      content: ", ";
    }

    .calendar.main .vsel-content .vsel-meta-time {
        display: inline;
        margin: 0px;
    }

    .calendar.main .vsel-content .vsel-meta-location {
        margin-top: 0;
    }

}


/* program page only */

.calendar.program .vsel-content .vsel-info .vsel-read-more {
    font-size: 120%;
}


.calendar.program .vsel-content h3 {
    font-size: 120%;
}


.calendar.program .vsel-content .vsel-meta {
    font-size: 120%;
}


/** sidebar calender on event template **/ 

.calendar.sidebar {
    font-size: 120%; 
}


.calendar.sidebar h1 {
   font-size: 1.5em;
   text-align: left; 
}


.calendar.sidebar #vsel .vsel-content {

    display: grid;
    grid-template-columns: auto;
    grid-template-rows: auto auto auto;
    grid-template-areas:
        "title"
        "meta"
        "content";
        
    column-gap: 0;
    row-gap: 0;
 
    padding-bottom: .5em;
    margin-bottom: .5em;
}


.calendar.sidebar .vsel-content .vsel-meta-date {
    display: inline;
}

.calendar.sidebar .vsel-content .vsel-meta-date::after {
  content: ", ";
}

.calendar.sidebar .vsel-content .vsel-meta-time {
    display: inline;
    margin: 0px;
}

.calendar.sidebar .vsel-content .vsel-meta-location {
    margin-top: 0;
}



.calendar.sidebar .vsel-content .vsel-info p {
    display: none;
}


.calendar.sidebar .vsel-info a.vsel-read-more {
    margin: 0px;
    padding: 0px;	
}


@media screen and (max-width: 1024px) {

    .calendar.sidebar {
        font-size: 120%;
    }
    

    .calendar.sidebar .vsel-content .vsel-info p {
        display: block;
    }
    
}



/* single event page */

body.single-event main .vsel-content {
    display: flex;
    flex-direction: row;    
    gap: 2em;
}


body.single-event main .vsel-meta {
   width: 25% !important;
   display: block;
   float: none;   
   margin: 1em 0em;
   padding: 0px;
   
   font-size: 120%;
   line-height: 120%;
   text-align: right;
}


body.single-event main .vsel-info-block {
    width: 75% !important;
    display: block;
    padding: 0px;
    margin: 0px;
    float: none; 
}


@media screen and (max-width: 767px) {

    body.single-event main .vsel-content {
        flex-direction: column;
        margin-left: 1em;
        margin-right: 1em;
        gap: 0;
    }
    
    
    body.single-event main .vsel-meta {
        width: 100% !important;
        text-align: left;
        margin: 0;
    }
    
    body.single-event main .vsel-info-block {
        width: 100% !important;
    }

}



/*body.single-event .vsel-meta div {
   margin: 0px;
}*/


body.single-event main h1.wp-block-post-title {
   text-decoration: none;
}

body.single-event main h2 {
   margin-top: 1em;
   margin-bottom: 1em;
   line-height: 120%;
}


body.single-event .vsel-info-block pre {
   font-size: 120%; 
   margin-top: 1em;
}


body.single-event .vsel-content .vsel-meta-date {
    font-weight: bold;
}


body.single-event .vsel-content .vsel-meta-time {
    font-weight: bold;
}


body.single-event .vsel-content .vsel-meta-location {
    margin-top: 1em;
}

body.single-event .vsel-content .vsel-meta-link {
    margin-top: 1em;
}


body.single-event .vsel-content .vsel-meta-link::before {
    content: "Veranstaltet von: ";
}

body.single-event .vsel-acf-accessibility {
    margin-top: 1em;
    display: none;
}


body.single-event .vsel-acf-anmeldung {
    margin-top: 1em;
}

body.single-event .vsel-acf-address {
}





/** openstreet maps */

body.single-event .event-map {
}

body.single-event .event-map .leaflet-container {    
    border: 1px solid black;
    paadding: 10px;    
    height: 1024px;
}

calendar.main .vsel-content {
        grid-template-columns: 250px auto;
    }
