#popup {
  display: none; }
  #popup.visible {
    position: fixed;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center; }
    #popup.visible #popupContainer {
      max-width: 800px;
      width: calc(100% - 30px);
      background: white;
      display: flex;
      position: relative; }
      #popup.visible #popupContainer .left {
        padding: 30px;
        width: 50%; }
      #popup.visible #popupContainer .right {
        padding: 30px;
        background: #DEF9EE;
        width: 50%; }
      #popup.visible #popupContainer #popupClose {
        position: absolute;
        height: 34px;
        width: 34px;
        color: #fff;
        font-size: 2em;
        text-align: center;
        line-height: 34px;
        top: -40px;
        right: 0;
        cursor: pointer; }
        #popup.visible #popupContainer #popupClose::before, #popup.visible #popupContainer #popupClose::after {
          content: "";
          position: absolute;
          background: #fff;
          display: block;
          left: 50%;
          top: 50%;
          height: 65%;
          width: 2px;
          transition: all .2s;
          -ms-high-contrast-adjust: none; }
        #popup.visible #popupContainer #popupClose::before {
          transform: translate(-50%, -50%) rotate(45deg);
          -ms-transform: translate(-50%, -50%) rotate(45deg); }
        #popup.visible #popupContainer #popupClose::after {
          transform: translate(-50%, -50%) rotate(-45deg);
          -ms-transform: translate(-50%, -50%) rotate(-45deg); }

/*# sourceMappingURL=popup.css.map */