.csagenda--wrapper{
  max-width:1200px;
  margin:0 auto;
}

.csagenda--filter button{
  padding:8px 16px;
  border-radius:30px;
  /*border:1px solid var(--background);
  color:var(--background);*/
  border:1px solid #1a1c1e;
  color:#1a1c1e;
  background:transparent;
  margin: 8px 8px 0 0;
  cursor:pointer;
}

.csagenda--filter button.active{
  color:color:#1a1c1e;
  border:1px solid #1a1c1e55;
  background:#1a1c1e11;
}

.csagenda--slot{
  border-bottom:1px solid #ddd;
  padding:30px 0;
  display:flex;
  flex-wrap:wrap
}

.csagenda--slot:nth-last-child(2){
  border-bottom:0
}

.csagenda--slot .csagenda--slot-time{
  width:80px;
  font-size:120%;
  padding:4px 0 0;
  font-family:"Lucida Sans",Courier,monospace;
}

.csagenda--slot .csagenda--slot-main-wrapper{
  flex:1 1 70%;
  display:flex;
  gap:20px;
  flex-wrap:wrap;
  align-items:auto;
}

.csagenda--slot .csagenda--slot-main-wrapper.active{
  align-items:flex-start;
}

.csagenda--slot .csagenda--slot-main{
  background:var(--background);
  color:var(--text);
  flex:1 1 0%;
  padding:20px 30px 30px;
  border-radius:10px;
  position:relative;
  min-width:200px;
  container-type:inline-size;
  container-name:item;
}

/*** Headings */

.csagenda--slot .csagenda--slot-main .csagenda--slot-main-headings{
  display:flex; 
  flex-wrap:wrap;
}

@container item (max-width:600px){
  .csagenda--slot .csagenda--slot-main .slot-content .slot-content-right{
    border-top: 1px solid #fff3;
    padding-top: 20px; 
  }
}

@container item (max-width:500px){
  .csagenda--slot .csagenda--slot-main .csagenda--slot-main-headings{
    display:flex;
  }
  
  .csagenda--slot .csagenda--slot-main .csagenda--slot-main-headings h3{
    order:2;
    width:100%;
  }
  
  .csagenda--slot .csagenda--slot-main .csagenda--slot-main-headings  .tags-wrapper{
    margin-left:0;
    width:100%;
    margin-bottom:24px;
  }
  /*.csagenda--slot .csagenda--slot-main .slot-content .slot-content-left-speaker div{
    display:none;
  }*/
}


.csagenda-popup h3,
.csagenda--slot .csagenda--slot-main h3{
  font-size:130%; 
  font-weight:700;
  padding:0;
  margin:0;
  line-height:120%;
  position:relative;
  color:var(--text);
}

/* Headings ***/

.csagenda--slot .csagenda--slot-main .tags-wrapper{
  margin-left:auto;
  display: flex;
  flex-wrap: wrap;
  row-gap: 8px;
  column-gap: 10px;
}

.csagenda-popup .tags-wrapper div,
.csagenda--slot .csagenda--slot-main .tags-wrapper div{
  font-size:90%;
  border:1px solid var(--text);
  border-radius:4px;
  padding:3px 8px;
  margin-left:6px;
}

.csagenda-popup .tags-wrapper div:first-child,
.csagenda--slot .csagenda--slot-main .tags-wrapper div:first-child{
  margin-left:0px;
}

.csagenda-popup .csagenda--slot-main-headings + p,
.csagenda--slot .csagenda--slot-main .csagenda--slot-main-headings + p{
  margin:6px 0 18px;
  position:relative;
  color:var(--text);
  max-width:80%;
}

.csagenda-popup .csagenda--slot-main-headings + p + div img,
.csagenda--slot .csagenda--slot-main .csagenda--slot-main-headings + p + div img{
  max-height:20px; 
  margin:0 8px 8px 0;
  position:relative;
}
.multi-item .csagenda--slot-main .headings-speakers,
.csagenda-popup-wrapper .headings-speakers{
  display:none;
}
.csagenda--slot-main .headings-speakers {
  display:flex;
  gap: 30px;
  margin-top: 40px;
  transition:all 300ms ease;
}

.csagenda--slot-main.active .headings-speakers {
 opacity:0
}


.csagenda--slot-main .headings-speakers .headings-speakers--wrapper{
  display:flex;
  gap:10px;
  max-width:250px;
}
.csagenda--slot-main .headings-speakers .headings-speakers--wrapper .headings-speakers--wrapper-left div{
  height:50px;
  width:50px;
  background-size:cover;
  border-radius:8px; 
}

.csagenda--slot-main .headings-speakers .headings-speakers--wrapper .headings-speakers--wrapper-right,
.csagenda--slot-main .headings-speakers .headings-speakers--wrapper .headings-speakers--wrapper-right span{
display:block;
}
.csagenda--slot-main .headings-speakers .headings-speakers--wrapper .headings-speakers--wrapper-right span{
margin-bottom:8px;
  font-size:80%;
}

@media (max-width:767px){
  .csagenda--slot-main .headings-speakers{
    display:block;
  }
}

/* Popup Specific */

.csagenda-popup{
  position:fixed;
  top:0px;
  right:0px;
  bottom:0px;
  width:600px;
  max-width:100%;
  background:#fff4;
  backdrop-filter:blur(10px);
  padding:40px;
  min-width:250px;
  transform:translateX(600px);
  transition:all 400ms ease;
  z-index:99;
}

@media (max-width:767px){
 .csagenda-popup {
    backdrop-filter: none;
    padding: 0;
} 
}

.csagenda-popup.active{
  transform:translateX(0);
}

.csagenda-popup-wrapper{
  background:var(--background);
  color:var(--text);
  padding:30px 30px;
  border-radius:10px;
  height:100%;
  position:relative;
  overflow-x:hidden;
  overflow-y:auto;
  transition:all 600ms ease;
  transform:translateX(600px);
}

.csagenda-popup.active .csagenda-popup-wrapper{
  transform:translateX(0px);
}

.csagenda-popup .csagenda--slot-main-headings{
  display:flex;
  flex-wrap:wrap;
}

.csagenda-popup .csagenda--slot-main-headings h3{
  order:2;
  width:100%;
  margin:0;
}
  
.csagenda-popup .csagenda--slot-main-headings .tags-wrapper{
  margin-left:0;
  width:100%;
  margin-bottom:16px;
  display: flex;
  flex-wrap: wrap;
  row-gap: 8px;
  column-gap: 10px;
}

.csagenda-popup .slot-action{
  display:none; 
}

.csagenda-popup .slot-content .slot-content-right{
  border-top: 1px solid #fff3;
  padding-top: 20px; 
  margin-top:20px;
}

.csagenda-popup .close-popup{
  position:absolute;
  top:0;
  right:0;
  padding:20px;
  border:0;
  background:transparent;
  cursor:pointer;
}

.csagenda-popup .close-popup:before{
  color:var(--text);
  content:'x'; 
  position:absolute;
  top:25px;
  right:24px;
  height:20px;
  width:20px;
  display:block;
}

.csagenda-popup .close-popup:after{
border: 1px solid var(--text);
    content: '';
    height: 26px;
    width: 26px;
    top: 20px;
    right: 20px;
    display: block;
    position: absolute;
  border-radius:50%;
}


/* Popup Specific */


.csagenda--slot .csagenda--slot-main .slot-action{
  position:absolute;
  bottom:0px;
  right:0px;
}

.csagenda--slot .csagenda--slot-main .slot-action button{
  border:0;
  cursor:pointer;
  padding:20px 50px 20px 20px;
  background:transparent;
  position:relative;
  color:var(--text);
}

.csagenda--slot .csagenda--slot-main .slot-action button:after{
  position:absolute;
  content:'';
  height:10px;
  width:10px;
  border:1px solid var(--text);
  right:30px;
  top:22px;
  border-radius:50%;
}


.csagenda--slot .csagenda--slot-main .slot-action button:before{
  position:absolute;
  content:'';
  height:3px;
  width:3px;
  border:1px solid var(--text);
  border-width:1px 1px 0 0;
  right:34px;
  top:25px;
  transform:rotate(135deg)
}

.csagenda--slot .csagenda--slot-main .slot-action.popup button:before{
  position:absolute;
  content:'+';
  height:3px;
  width:3px;
  border-width:0;
  right: 36.5px;
  top: 20px;
  font-size:11px;
  transform:rotate(0deg)
}

.csagenda--slot .csagenda--slot-main .slot-action button.seeless:before{
  top:27px;
  transform:rotate(-45deg)  
}

.csagenda--slot .csagenda--slot-main .slot-action button.seemore,
.csagenda--slot .csagenda--slot-main.active .slot-action button.seeless{
  display:block; 
}
.csagenda--slot .csagenda--slot-main .slot-action button.seeless,
.csagenda--slot .csagenda--slot-main.active .slot-action button.seemore{
  display:none;
}

.csagenda--slot .csagenda--slot-main .slot-content{
  flex-wrap:wrap;
  display:flex;
  max-height:0;
  overflow:hidden;
  gap:20px;
  position:relative;
  transition:all 200ms linear
}

.csagenda--slot .csagenda--slot-main.active .slot-content{
  max-height:60vh;
  padding:20px 0 40px;
}

@media (max-height:800px){
 
.csagenda--slot .csagenda--slot-main.active .slot-content{
  max-height:60vh;
  padding:20px 0 40px;
  overflow-x: hidden;
  overflow-y: auto;
} 
}

.csagenda--slot .csagenda--slot-main .slot-content > div{
  flex:1 1 calc(50% - 20px); 
  min-width:300px;
  max-width:800px;
}

.csagenda-popup  .slot-content .slot-content-left,
.csagenda--slot .csagenda--slot-main .slot-content .slot-content-left{
  display:flex; 
  flex-wrap:wrap;
  gap:20px;
}

.csagenda-popup  .slot-content .slot-content-left-speaker,
.csagenda--slot .csagenda--slot-main .slot-content .slot-content-left-speaker{
  flex:1 1 calc(50% - 20px); 
  min-width:150px;
}

.csagenda-popup .slot-content .slot-content-left-speaker div,
.csagenda--slot .csagenda--slot-main .slot-content .slot-content-left-speaker div{
  height:40px;
  width:40px;    
  background-size: cover;
  background-position: center;
  border-radius:8px;
}

.csagenda-popup .slot-content .slot-content-left-speaker span,
.csagenda--slot .csagenda--slot-main .slot-content .slot-content-left-speaker span{
  display:block; 
  margin:6px 0;
  font-size:110%;
}

.csagenda-popup .slot-content .slot-content-left-speaker span:nth-of-type(3),
.csagenda--slot .csagenda--slot-main .slot-content .slot-content-left-speaker span:nth-of-type(3){
color:var(--highlight)
}

.csagenda-popup .slot-content .slot-content-left-speaker span + span,
.csagenda--slot .csagenda--slot-main .slot-content .slot-content-left-speaker span + span{
  display:block; 
  font-size:100%;
  margin:2px 0;
}


/* BOX SHAPES */

.csagenda--slot .csagenda--slot-main .shape-bottomleft-big{
  position:absolute;
  height:20px;
  width:40px;
  background:#fff;
  left:0;
  bottom:0;
  border-radius:0 10px 0 0;
}

.csagenda--slot .csagenda--slot-main .shape-bottomleft-big .shape-bottomleft-small-top:before,
.csagenda--slot .csagenda--slot-main .shape-bottomleft-big .shape-bottomleft-small-right:before{
  content:'';
  position:absolute;
  height:32px;
  width:32px;
}

.csagenda--slot .csagenda--slot-main .shape-bottomleft-big .shape-bottomleft-small-top,
.csagenda--slot .csagenda--slot-main .shape-bottomleft-big .shape-bottomleft-small-right{
  position:absolute;
  height:24px;
  width:24px;
}

.csagenda--slot .csagenda--slot-main .shape-bottomleft-big .shape-bottomleft-small-top{
  left:0;
  top:-24px;
}

.csagenda--slot .csagenda--slot-main .shape-bottomleft-big .shape-bottomleft-small-top:before{
  left:0;
  bottom:0;
  border-radius:0 0 0 10px;
}

.csagenda--slot .csagenda--slot-main .shape-bottomleft-big .shape-bottomleft-small-right{
  right:-24px;
  bottom:0;
}

.csagenda--slot .csagenda--slot-main .shape-bottomleft-big .shape-bottomleft-small-right:before{
  left:0;
  bottom:0;
  border-radius:0 0 0 10px;
}