body, html{
  margin:0px;
  padding:0px;
}

.eventPopupSlidein{
    position:fixed;
    right:0px;
    width:0px;
    top:0px;
    transition:width 0.3s ease-in-out;
    height:100vh;
    background-color:rgba(0,0,0,0.4);
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter: blur(8px);
    z-index:999999999;
    overflow:hidden;




    .eventPopupContent{
      width:95vw;
      //border-top-left-radius:20px;
      //border-bottom-left-radius:20px;
      max-width:600px;
      background-color:#fff;
      box-shadow:-4px 0px 8px rgba(0,0,0,0.1);
      position:absolute;
      padding:0px;
      right:0;
      transform:translateX(600px);
      transition:transform 0.4s ease-in-out;
      top:0px;
      height:100%;
      //height:calc(100% - 44px);
      overflow:hidden;

      border-left:1px solid rgba(255,255,255,0.5);
/*
      @media screen and (max-width:768px){
        height:calc(100% - 64px);
        top:64px;
      }
*/
      iframe{
        width:100%;
        margin:0px;
        padding:0px;
        height:100%;
        height:calc(100% - 50px);
        border:0px;
      }

    }

    .eventPopupClose{
      cursor:pointer;
      display:block;
      font-size:16px;
      text-align:left;
      padding:10px;
      padding-left:20px;
      color:#666;
      border-bottom:1px solid #ececec;

      svg{
        color:#666;
        height:16px;
        margin-right:10px;
        vertical-align:middle;
        position:relative;
        top:-2px;
      }
    }

    &.show{
      width:100vw;
      opacity:1;

      .eventPopupContent{
        transform:translateX(0px);
      }
    }


}

.eventLoader{
  display:flex;
  justify-content: center;
  align-items: center;
  width:100%;
  height:100%;
  font-family:sans-serif;

  .eventLoaderHolder{
    display:inline-block;
    text-align:center;
    line-height:20px;
    font-size:12px;
  }
}