/* picnic */

:root { /* duplicate these vars from _styles_picnic.css; */
  --picnic-ctrl-bg-default: #eeeeee;
  --picnic-ctrl-brdr: #FFFFFF;
  --picnic-ctrl-txt: #222222;
  --picnic-ctrl-txt-dayname: #444444; /* days of the week */;
  --picnic-ctrl-navarrows:#222222;
  --picnic-ctrl-navarrows-hover:black;
  --picnic-ctrl-selected: yellow;
  --picnic-ctrl-selected-bg: #008539; /* ends */
  --picnic-ctrl-inrange: #222222;
  --picnic-ctrl-inrange-bg:#edededs; /* middle */
}

.bg-picnic { width:100%; }
.picnic-hold { width:100%;  }

/* responsive layout */

#picnic-basket { display:block; width:100%; }
.picnic-controls { display:block; width:100%; }
.picnic-results { display:block; width:100%; }
@media all and (min-width: 992px) {
  #picnic-basket { display:flex; width:100%; }
  .picnic-controls { flex-shrink: 0; width: 344px; padding-right:24px; }
  .picnic-results { flex-grow: 1; min-height: 100vh;  }
}  
  
/* mobile drawers */
  
.picnic-drawer { margin-bottom:1.5rem; border:1px solid #666; } 
a.picnic-drawer-toggle { display:table; width:100%; text-decoration:none; color:#666; }
a.picnic-drawer-toggle:hover { text-decoration:none; color:#666; }
@media all and (min-width: 992px) {
  .picnic-drawer { border:0; }
  a.picnic-drawer-toggle { display:none; }
}

.picnic-drawer-toggle-label { display:table-cell; width:auto; text-align:left; padding:0 1rem; font-size:1rem; line-height:3rem; font-weight:700; }
.picnic-drawer-toggle-icon { display:table-cell; width:24px; text-align:right; padding:0 1rem; }
a.picnic-drawer-toggle.is-open .picnic-drawer-toggle-icon { transform: rotate(180deg); }

.picnic-drawer-closed { max-height:0px; overflow:hidden; }
.picnic-drawer-open { max-height:900px; transition: all 250ms ease-in; overflow:hidden; }


/* controls */

.picnic-calendar-hold { width:100%; padding:0 1rem; margin:1rem 0; }
.picnic-categories-hold { width:100%; padding:0 1rem; margin:1rem 0; }
@media all and (min-width: 992px) {
  .picnic-calendar-hold { padding:0; margin-top:0px; }
  .picnic-categories-hold { padding:0; margin-top:0px; }
}

.picnic-shortcuts { font-size:0.75rem; margin-top:0.66rem; text-align:center; }
.picnic-shortcuts a { color:inherit; }
.picnic-shortcuts a:hover { color:inherit; }

ul#picnic-tagpicker { margin:0; padding:0; list-style:none; }
ul#picnic-tagpicker li { margin:0; padding:0 6px 8px 0; display:inline-block; font-size:14px; line-height:1.5; }
ul#picnic-tagpicker li a { display:inline-block; padding:6px 16px; border-radius:22px; text-decoration:none; 
  font-weight: 500;
  letter-spacing: 0.005rem;
}
ul#picnic-tagpicker li a.picnic-tag { background-color: white; border:1px solid #008539; color:#008539; }
ul#picnic-tagpicker li a.picnic-tag:hover { background-color:#057A39; border-color:#057A39; color:white; }
ul#picnic-tagpicker li a.picnic-tag-selected { background-color:#008539; border-color:#008539; color:white; }
/*
band green #008539
mel: Lighter green: #49B076;
Darker green: #057A39;
*/





#picnic-blanket { width:100%; }

.picnic-results-headline { 
  font-weight: 400;
  font-size: 1.25rem;
  line-height:1.05;
  margin-top: 0px;
  margin-bottom: 1rem;
  color:inherit;
}




/* events cards */

a.evcard { display:block; width:100%; height:100%; background-color:#ededed; color:inherit; text-decoration:none; position:relative;
border-radius:4px;
overflow:hidden;
}

.evcard-image { position:relative; width:100%; }
.evcard-image-image { width:100%; padding-bottom:100%; background-position:center center; background-size:cover; }
.evcard-image-cover { position:absolute; top:0px; width:100%; height:100%; background-color:rgba(0,0,0,0); transition: all 250ms ease-out; }

.evcard-content { padding:1.5rem;}
.evcard-content-subhead { font-weight:400; font-size:0.8rem; margin-bottom:0.5rem; text-transform:uppercase; }
.evcard-content-headline { 
  font-family: 'FaktSlabSemiCondensed';
  font-weight: 600;
  font-size: 22px;
  line-height: 1.2;
  color: #057A39;
  margin-bottom: 6px;
 }
.evcard-content-time { font-weight:400; font-size:0.8rem; margin-bottom:0.5rem; }
.evcard-content-venue { font-weight:400; font-size:0.8rem; margin-bottom:0.5rem; }
.evcard-content-text { 
  font-family: 'Fakt', sans-serif;
  font-weight: 400;
  font-size: 15px;
  line-height: 1.4;
  color: #000;
 }

.evcard-content-time span, .evcard-content-venue span { display:inline-block; text-align:center; width:20px; color:black; }
.evcard-content-text span { opacity:0.5; }

.evcard-date-box { position:absolute; top:4px; left:4px; background-color:#008539; color:white;  
  display: flex;
  width:80px; height:80px; 
  flex-direction: column;  /* Stack the text vertically */
  justify-content: center;  /* Center the content vertically */
  align-items: center;  /* Center the content horizontally */
  text-align: center;  /* align the text inside each child div */
  border-radius:4px;
}

.evcard-date-dow { font-size:12px; line-height:14px; font-weight:500; }
.evcard-date-day { font-size:22px; line-height:28px; font-weight:600; letter-spacing:0.050rem; }
.evcard-date-month { font-size:12px; line-height:14px; font-weight:500; text-transform:uppercase; letter-spacing:0.050rem; }

.evcard-date-range { font-size:12px; line-height:16px; font-weight:500; text-transform:uppercase; letter-spacing:0.050rem; }
.evcard-date-range span { font-size:16px; line-height:18px; font-weight:700; }
.evcard-date-through { font-size:10px; line-height:16px; font-weight:700; text-transform:uppercase; letter-spacing:0.050rem; }

a.evcard:hover { color:inherit; text-decoration:none; }
a.evcard:hover .evcard-content-headline { color:#008539; }
a.evcard:hover .evcard-image-cover { background-color:rgba(0,0,0,0.15); }