.webinar-popup { z-index: 10000; position: fixed; left: 18px; bottom: 18px; right: auto; display: none; padding-right: 20px; background-color: #fff; box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.25); border-radius: 5px; transition: box-shadow 150ms ease-in, transform 600ms cubic-bezier(0.19, 1, 0.22, 1);  }
.webinar-popup:hover { box-shadow: 0px 5px 25px rgba(0, 0, 0, 0.3); transform: translateY(-3px); }
.webinar-popup__area { display: flex; align-items: center; padding: 10px; }
.webinar-popup__area:focus,
.webinar-popup__area:hover { text-decoration: none; }
.webinar-popup__content { display: flex; flex-direction: column; margin-left: 18px; }
.webinar-popup__text { font-style: normal; font-weight: 500; font-size: 15px; line-height: 20px; color: #263844; }
.webinar-popup__link {  font-weight: bold; font-size: 22px; line-height: 21px; }
.webinar-popup__link svg { transition: transform 600ms cubic-bezier(0.19, 1, 0.22, 1); }
.webinar-popup__close-btn { position: absolute; top: -9px; right: -9px; padding: 0; margin: 0; width: 24px; height: 24px; background-color: #939BA1; border-radius: 48px; border: none; transition: 100ms ease-out all; }
.webinar-popup__close-btn:hover,
.webinar-popup__close-btn:focus { cursor: pointer; background-color: #263844; }
.webinar-popup__close-btn svg { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.webinar-popup__area:hover .webinar-popup__link svg,
.webinar-popup__area:focus .webinar-popup__link svg { transform: translateX(10px); }
.webinar-popup {
  background-image : linear-gradient(290.71deg, rgb(70, 178, 72) -45.19%, rgb(31, 165, 220) 100%);
  border : 1px solid rgb(38, 56, 68);
}

.webinar-popup a, .webinar-popup span {
  color : white;
}

.webinar-popup:not(.webinar-popup--partner) img {
  display : block;
  box-sizing : border-box;
  background : url("https://cdn2.hubspot.net/hubfs/325051/webinarpopup-variant.svg") no-repeat no-repeat;
  width : 45px;
  height : 43px;
  padding-left : 45px;
}

.webinar-popup__close-btn {
  background-color : white;
  border : 1px solid rgb(38, 56, 68);
}

.webinar-popup__close-btn svg path {
  stroke : rgb(38, 56, 68);
}

.webinar-popup__link svg path {
  stroke : white;
}

a.webinar-popup__area {
  padding : 15px;
}
@media only screen and (min-width: 992px) {
  .webinar-popup--show { display: flex; transform: translateY(0);  animation: 600ms ease-out 0s 1 slideInFromBottom;}
}

@keyframes slideInFromBottom {
  0% {
    transform: translateY(100%);
  }
  100% {
    transform: translateY(0);
  }
}