div.modal {
  display: block;
  border: 0;
}
.invisible {
    visibility: hidden;
}
/* removes scroll when modal is opened */
.no-scroll {
  overflow: hidden;
}
/* overlay covers everything */
.simple-modal-overlay,
.simple-animated-modal-overlay {
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  background: #c41230;
  opacity: .95;
  z-index: 666;
  cursor: pointer;
}
.simple-modal-overlay[data-background-click="disabled"],
.simple-animated-modal-overlay[data-background-click="disabled"] {
  cursor: auto;
}
.simple-animated-modal-overlay  {
  animation: fadewhite ease .5s 1 normal ;
}

@keyframes fadewhite {
  0% {
    opacity: 0;
  }
  100% {
    opacity: .8;
  }
}
/* modal */
.simple-modal,
.simple-animated-modal {
  position: fixed;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  width: 100%;
  /*max-height: 98vh;*/
  /*border: 2px solid #000;*/
  background: #fff;
  z-index: 667;
  padding-left: 2em;
  padding-right:2em;
  max-width:1400px;
  right: auto;
  overflow: auto;
}
.simple-modal-close,
.simple-animated-modal-close {
  float: right;
  background: #fff;
  /*border-radius: 1em;*/
  color: #fff;
  border: 0;
  font: inherit;
  padding: .75em 1em;
  cursor: pointer;
  outline:2px dotted transparent;
  outline-offset:-4px;
}
.simple-modal-close:focus,
.simple-modal-close:hover,
.simple-modal-close:active,
.simple-animated-modal-close:focus,
.simple-animated-modal-close:hover,
.simple-animated-modal-close:active {
  outline: 2px dotted #c41230;
}
.simple-modal-close:hover,
.simple-modal-close:active,
.simple-animated-modal-close:hover,
.simple-animated-modal-close:active {
  background: #ccc9b8;
}

.simple-animated-modal-close:focus {
    background:#fff;
}

.simple-animated-modal {
  animation: apparition ease .5s 1 normal ;
}


@keyframes apparition {
  0% {
    opacity: 0;
    max-height: 100%;
    width: 80%;
  }
  100% {
    opacity: 1;
    max-height: 100%;
    width: 80%;

  }
}


/* CUSTOM STYLES FOR PSA MODAL */

div[class$="-modal"] {
    background:transparent;
    border:none;
}


.simple-animated-modal__content > div {
    display:flex;
    background:url(https://miamioh.edu/_hannonhill/_files/gifs/functional/loading-transparent.gif), #000;
    background-position:center center;
    background-repeat:no-repeat;
    background-size:50px 50px;
}

.profilePopupInfo {
    flex-basis:40%;
    padding:1em;
}

.profilePopupInfo h3 {
    color:#c41230;
    font-family:'Freight Display Semibold', Times, Serif;
    font-size:2em;
}

.profilePopupInfo span {
    color:#c41230;
    font-family:'Proxima Bold', Helvetica, Sans-Serif;
    font-size:1.25em;
    text-transform:uppercase;
}

.profilePopupInfo p {
    color:#c41230;
    font-family:'Freight Text Book', Times, Serif;
    font-size:1.125em;
    line-height:140%;
}

.profilePopupVideo {
    width:100%;
    height:100%;
    /*flex-basis:60%;*/
    /*margin:1em;*/
    /*outline:2px solid #c41230;*/
    /*position:relative;*/
    /*box-shadow:4px 4px #fff, 6px 6px #c41230;*/
}
/*.profilePopupVideo:before,*/
/*.profilePopupVideo:after {*/
/*    content:"";*/
/*    position:absolute;*/
/*    background:#c41230;*/
/*}*/
/*.profilePopupVideo:before {*/
/*    top:100%;*/
/*    left:4px;*/
/*    height:6px;*/
/*    width:2px;*/
/*}*/
/*.profilePopupVideo:after {*/
/*    left:100%;*/
/*    top:4px;*/
/*    height:2px;*/
/*    width:6px;*/
/*}*/
.songPopup {
    width:100%;
    height:100%;
    flex-basis:100%;
    margin:1em;
    outline:2px solid #c41230;
    position:relative;
    box-shadow:4px 4px #fff, 6px 6px #c41230;
}
.songPopup:before,
.songPopup:after {
    content:"";
    position:absolute;
    background:#c41230;
}
.songPopup:before {
    top:100%;
    left:4px;
    height:6px;
    width:2px;
}
.songPopup:after {
    left:100%;
    top:4px;
    height:2px;
    width:6px;
}


/* it can be easily adapted in media-queries for tablets/mobile */

/* for this example: tablets */
@media (max-width: 55.625em) {
  .simple-modal,
  .simple-animated-modal {
    left: 5%;
    top: 10%;
    height: 90%;
    width: 90%;
    transform:translate(0%,0%);
  }
  .simple-animated-modal__content > div {
      display: block;
  }

}

/* MOBILE */
@media (max-width: 44.375em) {
  .simple-animated-modal__wrapper {
        position: relative;
    }
  .simple-modal,
  .simple-animated-modal {
    /*left: 1%;*/
    left:0;
    /*top: 20%;*/
    top:12%;
    /*width: 98%;*/
    /*height: 98%;*/
    width: 100%;
    height: 100%;
    transform: none;
    max-height: 100vh;
    padding-bottom: 50%;
    padding-left:1em;
    padding-right:1em;
  }
  .simple-modal-close,
    .simple-animated-modal-close {
      /*position: absolute;*/
      /*top: 0;*/
      /*right: 0; */
    }
  .simple-animated-modal__content {
        position: relative;
        /*top: 40px;*/
        left: 0;
        width: 90%;
    }
  .simple-animated-modal__content > div {
      display: block;
  }

}

.sessionContainer {
    position:relative;
}

.cards-text__card-copy .sessionContainer a {
    position:absolute;
    bottom:10px;
    right:10px;
}

.sessionContainer a img {
    width:60px;
    height:60px;
    background:#c41230;
    padding:.7em;
    border-radius:30px;
    outline:2px dotted transparent;
    transition:all .2s ease;
}

.sessionContainer a img:hover {
    background:transparent;
}

.sessionContainer a img:focus {
    background:#c41230;
    outline:2px dotted #fff;
}