span#optiRealPersonContent, span#optiRealPersonContent div { z-index: 9999; }
span#optiRealPersonContent a { border: none; display: inherit !important }
span#optiRealPersonContent a img { border: none; }
span#optiRealPersonContent.rp-hide { display: none; }
div#realperson_text_status_button { margin-bottom: 5px; }
div#realperson_video_status_button { margin-bottom: 5px; }
div#InviteLayerRealPersonname.hide { display: none; } 
div.optiRealPersonStatusbutton { position: fixed; }
span.optiRealPersonStatusbutton.hide { display: none; }
div.optiRealPersonStatusbuttonHLeft { left: 0; }
div.optiRealPersonStatusbuttonHCenter { left: 50%; transform: translateX(-50%); }
div.optiRealPersonStatusbuttonHRight { right: 0; }
div.optiRealPersonStatusbuttonVTop { top: 0; }
div.optiRealPersonStatusbuttonVCenter { top: 50%; transform: translateY(-50%); }
div.optiRealPersonStatusbuttonVBottom { bottom: 0; }
div.optiRealPersonStatusbuttonHCenter.optiRealPersonStatusbuttonVCenter { transform: translate(-50%, -50%); }
div#optiRealPersonChatLayerClose.hide { display: none; }
div#optiRealPersonChatContentBorder.roundBottomCorner { border-bottom-left-radius: 7px; border-bottom-right-radius: 7px; }
div#optiRealPersonChatContentBorder { position: fixed; top: 100px; left: 100px; width: 332px; border: none; display: none; z-index: 9999999; overflow: hidden; background-color: #fff; border-top-left-radius: 7px; border-top-right-radius: 7px; }
div#optiRealPersonChatContentBorder.minimized { height: 35px; width: 203px; /* margin-top: 3px; */ }
div#optiRealPersonChatContentBorder div.realperson-layer-header { cursor:move; width:100%; height:35px; color:white; background: #272727; }
div#optiRealPersonChatContentBorder div.realperson-layer-header div.image { display: none; left: 10px; width: 33px; height: 30px; position: absolute; background: url(../images/layer/chat-icon.png) no-repeat; cursor: pointer; background-position: center center; }
div#optiRealPersonChatContentBorder.minimized div.realperson-layer-header div.image { display: block; }
div#optiRealPersonChatContentBorder div.realperson-layer-header div.realperson-chat-icon {
	left:10px;
	width:17px;
	height:18px;
	top:11px;
	position:absolute;
	background-repeat:no-repeat;
	cursor:pointer;
}
div#optiRealPersonChatContentBorder div.realperson-layer-header div.realperson-chat-title { display: block; font-family: Arial, Verdana, "Times New Roman", Times, serif; font-size: 14px; padding-left: 36px; position: absolute; color: white; font-weight: normal; line-height: 35px; margin-top: 1px; }
div#optiRealPersonChatContentBorder div.realperson-layer-header div.realperson-chat-buttons { float: right; max-height: 35px; }
div#optiRealPersonChatContentBorder div.realperson-layer-header div.realperson-chat-buttons ul { list-style: none; margin: 0; padding: 0; }
div#optiRealPersonChatContentBorder div.realperson-layer-header div.realperson-chat-buttons ul li { float: left; margin: 0; margin-top: 3px; padding: 0; }
div#optiRealPersonChatContentBorder div.realperson-layer-header div#optiRealPersonChatLayerMinimize { display: inline-block; width:30px; height:30px; background:url(../images/layer/minimize.png) center center no-repeat; cursor:pointer; }
div#optiRealPersonChatContentBorder.minimized div.realperson-layer-header div#optiRealPersonChatLayerMinimize { background:url(../images/layer/maximize.png) center center no-repeat; }
div#optiRealPersonChatContentBorder div.realperson-layer-header div#optiRealPersonChatLayerPopup { display: inline-block; width: 30px; height: 30px; background: url(../images/layer/popup.png) center center no-repeat; cursor: pointer; }
div#optiRealPersonChatContentBorder.minimized div.realperson-layer-header div#optiRealPersonChatLayerPopup { display: none; }
div#optiRealPersonChatContentBorder div.realperson-layer-header div#optiRealPersonChatLayerClose { display: inline-block; width:30px; height:30px; margin-right: 4px; background: url(../images/layer/close.png) center center no-repeat; cursor:pointer; }
div#optiRealPersonChatContentBorder.minimized div.realperson-layer-header div#optiRealPersonChatLayerClose { display: none; }
div#optiRealPersonChatContentBorder div.realperson-layer-header div#optiRealPersonChatLayerClose.hide { display: none; }

.realperson-animated {
  -webkit-animation-duration: 2s;
          animation-duration: 2s;
  -webkit-animation-fill-mode: forwards;
		  animation-fill-mode: forwards;
  -webkit-animation-direction: normal;
		  animation-direction: normal;
}

@-webkit-keyframes realperson-hinge {
  0% {
    -webkit-transform-origin: top left;
            transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
  }

  20%, 60% {
    -webkit-transform: rotate3d(0, 0, 1, 80deg);
            transform: rotate3d(0, 0, 1, 80deg);
    -webkit-transform-origin: top left;
            transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
  }

  40%, 80% {
    -webkit-transform: rotate3d(0, 0, 1, 60deg);
            transform: rotate3d(0, 0, 1, 60deg);
    -webkit-transform-origin: top left;
            transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
    opacity: 1;
  }

  100% {
    -webkit-transform: translate3d(0, 700px, 0);
            transform: translate3d(0, 700px, 0);
    opacity: 0;
    display:none;
  }
}

@keyframes realperson-hinge {
  0% {
    -webkit-transform-origin: top left;
            transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
  }

  20%, 60% {
    -webkit-transform: rotate3d(0, 0, 1, 80deg);
            transform: rotate3d(0, 0, 1, 80deg);
    -webkit-transform-origin: top left;
            transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
  }

  40%, 80% {
    -webkit-transform: rotate3d(0, 0, 1, 60deg);
            transform: rotate3d(0, 0, 1, 60deg);
    -webkit-transform-origin: top left;
            transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
    opacity: 1;
  }

  100% {
    -webkit-transform: translate3d(0, 700px, 0);
            transform: translate3d(0, 700px, 0);
    opacity: 0;
    display:none;
  }
} 

.realperson-hinge {
  -webkit-animation-name: realperson-hinge;
          animation-name: realperson-hinge;
}


@-webkit-keyframes realperson-zoomIn {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
            transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
}

@keyframes realperson-zoomIn {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
            transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
}

.realperson-zoomIn {
  -webkit-animation-name: realperson-zoomIn;
          animation-name: realperson-zoomIn;
}


@-webkit-keyframes realperson-zoomOut {
  0% {
    opacity: 1;
  }

  50% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
            transform: scale3d(.3, .3, .3);
  }

  100% {
    opacity: 0;
  }
}

@keyframes realperson-zoomOut {
  0% {
    opacity: 1;
  }

  50% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
            transform: scale3d(.3, .3, .3);
  }

  100% {
    opacity: 0;
  }
}

.realperson-zoomOut {
  -webkit-animation-name: realperson-zoomOut;
          animation-name: realperson-zoomOut;
}

@keyframes realperson-bounce {
  from, 20%, 53%, 80%, to { animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); transform: translate3d(0,0,0); }
  40%, 43% { animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); transform: translate3d(0, -30px, 0); }
  70% { animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); transform: translate3d(0, -15px, 0); }
  90% { transform: translate3d(0,-4px,0); }
}
.realperson-bounce { animation-name: realperson-bounce; transform-origin: center bottom; }

@keyframes realperson-bounce-h {
    from, 20%, 53%, 80%, to { transform: translate3d(-50%,0,0); }
    40%, 43% { transform: translate3d(-50%, -30px, 0); }
    70% { transform: translate3d(-50%, -15px, 0); }
    90% { transform: translate3d(-50%,-4px,0); }
}
div.optiRealPersonStatusbuttonHCenter.realperson-bounce { animation-name: realperson-bounce-h; transform-origin: center bottom; }

@keyframes realperson-bounce-v {
    from, 20%, 53%, 80%, to { transform: translate3d(0,-50%,0); }
    40%, 43% { transform: translate3d(0, calc(-50% - 30px), 0); }
    70% { transform: translate3d(0, calc(-50% - 15px), 0); }
    90% { transform: translate3d(0,calc(-50% - 4px),0); }
}
div.optiRealPersonStatusbuttonVCenter.realperson-bounce { animation-name: realperson-bounce-v; transform-origin: center bottom; }

@keyframes realperson-bounce-hv {
    from, 20%, 53%, 80%, to { transform: translate3d(-50%,-50%,0); }
    40%, 43% { transform: translate3d(-50%, calc(-50% - 30px), 0); }
    70% { transform: translate3d(-50%, calc(-50% - 15px), 0); }
    90% { transform: translate3d(-50%,calc(-50% - 4px),0); }
}
div.optiRealPersonStatusbuttonHCenter.optiRealPersonStatusbuttonVCenter.realperson-bounce { animation-name: realperson-bounce-hv; transform-origin: center bottom; }

@keyframes realperson-flash {
  from, 50%, to { opacity: 1; }
  25%, 75% { opacity: 0; }
}
.realperson-flash { animation-name: realperson-flash; }

@keyframes realperson-pulse {
  from { transform: scale3d(1, 1, 1); }
  50% { transform: scale3d(1.05, 1.05, 1.05); }
  to { transform: scale3d(1, 1, 1); }
}
.realperson-pulse { animation-name: realperson-pulse; }

@keyframes realperson-pulse-h {
    from { transform: scale3d(1, 1, 1) translateX(-50%); }
    50% { transform: scale3d(1.05, 1.05, 1.05) translateX(-50%); }
    to { transform: scale3d(1, 1, 1) translateX(-50%); }
}
div.optiRealPersonStatusbuttonHCenter.realperson-pulse { animation-name: realperson-pulse-h; }

@keyframes realperson-pulse-v {
    from { transform: scale3d(1, 1, 1) translateY(-50%); }
    50% { transform: scale3d(1.05, 1.05, 1.05) translateY(-50%); }
    to { transform: scale3d(1, 1, 1) translateY(-50%); }
}
div.optiRealPersonStatusbuttonVCenter.realperson-pulse { animation-name: realperson-pulse-v; }

@keyframes realperson-pulse-hv {
    from { transform: scale3d(1, 1, 1) translate(-50%, -50%); }
    50% { transform: scale3d(1.05, 1.05, 1.05) translate(-50%, -50%); }
    to { transform: scale3d(1, 1, 1) translate(-50%, -50%); }
}
div.optiRealPersonStatusbuttonHCenter.optiRealPersonStatusbuttonVCenter.realperson-pulse { animation-name: realperson-pulse-hv; }

@keyframes realperson-rubberBand {
  from { transform: scale3d(1, 1, 1); }
  30% { transform: scale3d(1.25, 0.75, 1); }
  40% { transform: scale3d(0.75, 1.25, 1); }
  50% { transform: scale3d(1.15, 0.85, 1); }
  65% { transform: scale3d(.95, 1.05, 1); }
  75% { transform: scale3d(1.05, .95, 1); }
  to { transform: scale3d(1, 1, 1); }
}
.realperson-rubberBand { animation-name: realperson-rubberBand; }

@keyframes realperson-rubberBand-h {
    from { transform: scale3d(1, 1, 1) translateX(-50%); }
    30% { transform: scale3d(1.25, 0.75, 1) translateX(-50%); }
    40% { transform: scale3d(0.75, 1.25, 1) translateX(-50%); }
    50% { transform: scale3d(1.15, 0.85, 1) translateX(-50%); }
    65% { transform: scale3d(.95, 1.05, 1) translateX(-50%); }
    75% { transform: scale3d(1.05, .95, 1) translateX(-50%); }
    to { transform: scale3d(1, 1, 1) translateX(-50%); }
}
div.optiRealPersonStatusbuttonHCenter.realperson-rubberBand { animation-name: realperson-rubberBand-h; }

@keyframes realperson-rubberBand-v {
    from { transform: scale3d(1, 1, 1) translateY(-50%); }
    30% { transform: scale3d(1.25, 0.75, 1) translateY(-50%); }
    40% { transform: scale3d(0.75, 1.25, 1) translateY(-50%); }
    50% { transform: scale3d(1.15, 0.85, 1) translateY(-50%); }
    65% { transform: scale3d(.95, 1.05, 1) translateY(-50%); }
    75% { transform: scale3d(1.05, .95, 1) translateY(-50%); }
    to { transform: scale3d(1, 1, 1) translateY(-50%); }
}
div.optiRealPersonStatusbuttonVCenter.realperson-rubberBand { animation-name: realperson-rubberBand-v; }

@keyframes realperson-rubberBand-hv {
    from { transform: scale3d(1, 1, 1) translate(-50%, -50%); }
    30% { transform: scale3d(1.25, 0.75, 1) translate(-50%, -50%); }
    40% { transform: scale3d(0.75, 1.25, 1) translate(-50%, -50%); }
    50% { transform: scale3d(1.15, 0.85, 1) translate(-50%, -50%); }
    65% { transform: scale3d(.95, 1.05, 1) translate(-50%, -50%); }
    75% { transform: scale3d(1.05, .95, 1) translate(-50%, -50%); }
    to { transform: scale3d(1, 1, 1) translate(-50%, -50%); }
}
div.optiRealPersonStatusbuttonHCenter.optiRealPersonStatusbuttonVCenter.realperson-rubberBand { animation-name: realperson-rubberBand-hv; }

@keyframes realperson-shake {
  from, to { transform: translate3d(0, 0, 0); }
  10%, 30%, 50%, 70%, 90% { transform: translate3d(-10px, 0, 0); }
  20%, 40%, 60%, 80% { transform: translate3d(10px, 0, 0); }
}
.realperson-shake { animation-name: realperson-shake; }

@keyframes realperson-shake-h {
    from, to { transform: translate3d(-50%, 0, 0); }
    10%, 30%, 50%, 70%, 90% { transform: translate3d(calc(-50% - 10px), 0, 0); }
    20%, 40%, 60%, 80% { transform: translate3d(calc(-50% + 10px), 0, 0); }
}
div.optiRealPersonStatusbuttonHCenter.optiRealPersonStatusbuttonVCenter.realperson-shake { animation-name: realperson-shake-h; }

@keyframes realperson-shake-v {
    from, to { transform: translate3d(0, -50%, 0); }
    10%, 30%, 50%, 70%, 90% { transform: translate3d(0, -50%, 0); }
    20%, 40%, 60%, 80% { transform: translate3d(0, -50%, 0); }
}
div.optiRealPersonStatusbuttonHCenter.optiRealPersonStatusbuttonVCenter.realperson-shake { animation-name: realperson-shake-v; }

@keyframes realperson-shake-hv {
  from, to { transform: translate3d(-50%, -50%, 0); }
  10%, 30%, 50%, 70%, 90% { transform: translate3d(calc(-50% - 10px), -50%, 0); }
  20%, 40%, 60%, 80% { transform: translate3d(calc(-50% + 10px), -50%, 0); }
}
div.optiRealPersonStatusbuttonHCenter.optiRealPersonStatusbuttonVCenter.realperson-shake { animation-name: realperson-shake-hv; }

@keyframes realperson-swing {
  20% { transform: rotate3d(0, 0, 1, 15deg); }
  40% { transform: rotate3d(0, 0, 1, -10deg); }
  60% { transform: rotate3d(0, 0, 1, 5deg); }
  80% { transform: rotate3d(0, 0, 1, -5deg); }
  to { transform: rotate3d(0, 0, 1, 0deg); }
}
.realperson-swing { transform-origin: top center; animation-name: realperson-swing; }

@keyframes realperson-swing-h {
    20% { transform: rotate3d(0, 0, 1, 15deg) translateX(-50%); }
    40% { transform: rotate3d(0, 0, 1, -10deg) translateX(-50%); }
    60% { transform: rotate3d(0, 0, 1, 5deg) translateX(-50%); }
    80% { transform: rotate3d(0, 0, 1, -5deg) translateX(-50%); }
    to { transform: rotate3d(0, 0, 1, 0deg) translateX(-50%); }
}
div.optiRealPersonStatusbuttonHCenter.realperson-swing { transform-origin: top center; animation-name: realperson-swing-h; }

@keyframes realperson-swing-v {
    20% { transform: rotate3d(0, 0, 1, 15deg) translateY(-50%); }
    40% { transform: rotate3d(0, 0, 1, -10deg) translateY(-50%); }
    60% { transform: rotate3d(0, 0, 1, 5deg) translateY(-50%); }
    80% { transform: rotate3d(0, 0, 1, -5deg) translateY(-50%); }
    to { transform: rotate3d(0, 0, 1, 0deg) translateY(-50%); }
}
div.optiRealPersonStatusbuttonVCenter.realperson-swing { transform-origin: top center; animation-name: realperson-swing-v; }

@keyframes realperson-swing-hv {
    20% { transform: rotate3d(0, 0, 1, 15deg) translate(-50%, -50%); }
    40% { transform: rotate3d(0, 0, 1, -10deg) translate(-50%, -50%); }
    60% { transform: rotate3d(0, 0, 1, 5deg) translate(-50%, -50%); }
    80% { transform: rotate3d(0, 0, 1, -5deg) translate(-50%, -50%); }
    to { transform: rotate3d(0, 0, 1, 0deg) translate(-50%, -50%); }
}
div.optiRealPersonStatusbuttonHCenter.optiRealPersonStatusbuttonVCenter.realperson-swing { transform-origin: top center; animation-name: realperson-swing-hv; }

@keyframes realperson-tada {
  from { transform: scale3d(1, 1, 1); }
  10%, 20% { transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); }
  30%, 50%, 70%, 90% { transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); }
  40%, 60%, 80% { transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); }
  to { transform: scale3d(1, 1, 1); }
}
.realperson-tada { animation-name: realperson-tada; }

@keyframes realperson-tada-h {
    from { transform: scale3d(1, 1, 1) translateX(-50%); }
    10%, 20% { transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg) translateX(-50%); }
    30%, 50%, 70%, 90% { transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg) translateX(-50%); }
    40%, 60%, 80% { transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg) translateX(-50%); }
    to { transform: scale3d(1, 1, 1) translateX(-50%); }
}
div.optiRealPersonStatusbuttonHCenter.realperson-tada { animation-name: realperson-tada-h; }

@keyframes realperson-tada-v {
    from { transform: scale3d(1, 1, 1) translateY(-50%); }
    10%, 20% { transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg) translateY(-50%); }
    30%, 50%, 70%, 90% { transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg) translateY(-50%); }
    40%, 60%, 80% { transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg) translateY(-50%); }
    to { transform: scale3d(1, 1, 1) translateY(-50%); }
}
div.optiRealPersonStatusbuttonVCenter.realperson-tada { animation-name: realperson-tada-v; }

@keyframes realperson-tada-hv {
    from { transform: scale3d(1, 1, 1) translate(-50%, -50%); }
    10%, 20% { transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg) translate(-50%, -50%); }
    30%, 50%, 70%, 90% { transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg) translate(-50%, -50%); }
    40%, 60%, 80% { transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg) translate(-50%, -50%); }
    to { transform: scale3d(1, 1, 1) translate(-50%, -50%); }
}
div.optiRealPersonStatusbuttonHCenter.optiRealPersonStatusbuttonVCenter.realperson-tada { animation-name: realperson-tada-hv; }

@keyframes realperson-wobble {
  from { transform: none; }
  15% { transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); }
  30% { transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); }
  45% { transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); }
  60% { transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); }
  75% { transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); }
  to { transform: none; }
}
.realperson-wobble { animation-name: realperson-wobble; }

@keyframes realperson-wobble-h {
    from { transform: translate3d(-50%, 0, 0); }
    15% { transform: translate3d(-75%, 0, 0) rotate3d(0, 0, 1, -5deg); }
    30% { transform: translate3d(-30%, 0, 0) rotate3d(0, 0, 1, 3deg); }
    45% { transform: translate3d(-65%, 0, 0) rotate3d(0, 0, 1, -3deg); }
    60% { transform: translate3d(-40%, 0, 0) rotate3d(0, 0, 1, 2deg); }
    75% { transform: translate3d(-45%, 0, 0) rotate3d(0, 0, 1, -1deg); }
    to { transform: translate3d(-50%, 0, 0); }
}
div.optiRealPersonStatusbuttonHCenter.realperson-wobble { animation-name: realperson-wobble-h; }

@keyframes realperson-wobble-v {
    from { transform: translate3d(0, -50%, 0); }
    15% { transform: translate3d(-25%, -50%, 0) rotate3d(0, 0, 1, -5deg); }
    30% { transform: translate3d(-20%, -50%, 0) rotate3d(0, 0, 1, 3deg); }
    45% { transform: translate3d(-15%, -50%, 0) rotate3d(0, 0, 1, -3deg); }
    60% { transform: translate3d(10%, -50%, 0) rotate3d(0, 0, 1, 2deg); }
    75% { transform: translate3d(-5%, -50%, 0) rotate3d(0, 0, 1, -1deg); }
    to { transform: translate3d(0, -50%, 0); }
}
div.optiRealPersonStatusbuttonVCenter.realperson-wobble { animation-name: realperson-wobble-v; }

@keyframes realperson-wobble-hv {
    from { transform: translate3d(-50%, -50%, 0); }
    15% { transform: translate3d(-75%, -50%, 0) rotate3d(0, 0, 1, -5deg); }
    30% { transform: translate3d(-30%, -50%, 0) rotate3d(0, 0, 1, 3deg); }
    45% { transform: translate3d(-65%, -50%, 0) rotate3d(0, 0, 1, -3deg); }
    60% { transform: translate3d(-40%, -50%, 0) rotate3d(0, 0, 1, 2deg); }
    75% { transform: translate3d(-55%, -50%, 0) rotate3d(0, 0, 1, -1deg); }
    to { transform: translate3d(-50%, -50%, 0); }
}
div.optiRealPersonStatusbuttonHCenter.optiRealPersonStatusbuttonVCenter.realperson-wobble { animation-name: realperson-wobble-hv; }

@keyframes realperson-jello {
  from, 11.1%, to { transform: none; }
  22.2% { transform: skewX(-12.5deg) skewY(-12.5deg); }
  33.3% { transform: skewX(6.25deg) skewY(6.25deg); }
  44.4% { transform: skewX(-3.125deg) skewY(-3.125deg); }
  55.5% { transform: skewX(1.5625deg) skewY(1.5625deg); }
  66.6% { transform: skewX(-0.78125deg) skewY(-0.78125deg); }
  77.7% { transform: skewX(0.390625deg) skewY(0.390625deg); }
  88.8% { transform: skewX(-0.1953125deg) skewY(-0.1953125deg); }
}
.realperson-jello { animation-name: realperson-jello; transform-origin: center; }

@keyframes realperson-jello-h {
    from, 11.1%, to { transform: translateX(-50%); }
    22.2% { transform: skewX(-12.5deg) skewY(-12.5deg) translateX(-50%); }
    33.3% { transform: skewX(6.25deg) skewY(6.25deg) translateX(-50%); }
    44.4% { transform: skewX(-3.125deg) skewY(-3.125deg) translateX(-50%); }
    55.5% { transform: skewX(1.5625deg) skewY(1.5625deg) translateX(-50%); }
    66.6% { transform: skewX(-0.78125deg) skewY(-0.78125deg) translateX(-50%); }
    77.7% { transform: skewX(0.390625deg) skewY(0.390625deg) translateX(-50%); }
    88.8% { transform: skewX(-0.1953125deg) skewY(-0.1953125deg) translateX(-50%); }
}
div.optiRealPersonStatusbuttonHCenter.realperson-jello { animation-name: realperson-jello-h; transform-origin: center; }

@keyframes realperson-jello-v {
    from, 11.1%, to { transform: translateY(-50%); }
    22.2% { transform: skewX(-12.5deg) skewY(-12.5deg) translateY(-50%); }
    33.3% { transform: skewX(6.25deg) skewY(6.25deg) translateY(-50%); }
    44.4% { transform: skewX(-3.125deg) skewY(-3.125deg) translateY(-50%); }
    55.5% { transform: skewX(1.5625deg) skewY(1.5625deg) translateY(-50%); }
    66.6% { transform: skewX(-0.78125deg) skewY(-0.78125deg) translateY(-50%); }
    77.7% { transform: skewX(0.390625deg) skewY(0.390625deg) translateY(-50%); }
    88.8% { transform: skewX(-0.1953125deg) skewY(-0.1953125deg) translateY(-50%); }
}
div.optiRealPersonStatusbuttonVCenter.realperson-jello { animation-name: realperson-jello-v; transform-origin: center; }

@keyframes realperson-jello-hv {
    from, 11.1%, to { transform: translate(-50%, -50%); }
    22.2% { transform: skewX(-12.5deg) skewY(-12.5deg) translate(-50%, -50%); }
    33.3% { transform: skewX(6.25deg) skewY(6.25deg) translate(-50%, -50%); }
    44.4% { transform: skewX(-3.125deg) skewY(-3.125deg) translate(-50%, -50%); }
    55.5% { transform: skewX(1.5625deg) skewY(1.5625deg) translate(-50%, -50%); }
    66.6% { transform: skewX(-0.78125deg) skewY(-0.78125deg) translate(-50%, -50%); }
    77.7% { transform: skewX(0.390625deg) skewY(0.390625deg) translate(-50%, -50%); }
    88.8% { transform: skewX(-0.1953125deg) skewY(-0.1953125deg) translate(-50%, -50%); }
}
div.optiRealPersonStatusbuttonHCenter.optiRealPersonStatusbuttonVCenter.realperson-jello { animation-name: realperson-jello-hv; transform-origin: center; }


/* intentionally deactivated due to breaking 3rd party cookies */
div#optiRealPersonChatContentBorder div.realperson-layer-header div#optiRealPersonChatLayerPopup {
	display: none;
}

.realperson_invitelayer {
    z-index:10000;
}

