/*
 *  custombox - Modal dialog effects with transitions CSS3
 *  version: 4.0.3
 *  http://dixso.github.io/custombox/
 *  (c) 2017 Julio de la Calle - @dixso9
 *
 *  Under MIT License - http://opensource.org/licenses/MIT
     */ .custombox-content,
 .custombox-overlay {
     position: fixed;
     overflow: hidden;
     top: 0;
     width: 100%;
     height: 100%
 }

 .custombox-overlay {
     z-index: 9997;
     opacity: 0;
     transition-delay: 0s;
     transition-timing-function: linear;
     transition-property: opacity;
     background-color: #666666 !important;
 }

 .custombox-content {
     z-index: 9999;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: row;
     flex-direction: row;
     -ms-flex-wrap: nowrap;
     flex-wrap: nowrap;
     -ms-flex-align: center;
     align-items: center;
     -ms-flex-line-pack: stretch;
     align-content: stretch
 }

 .custombox-lock {
     overflow: hidden
 }

 .custombox-reference {
     display: none
 }

 .custombox-content {
     overflow-y: auto
 }

 .custombox-content>* {
     max-width: 100%;
     max-height: 95%
 }

 .custombox-fullscreen.custombox-content {
     -ms-flex-pack: start;
     justify-content: flex-start;
     -ms-flex-align: stretch;
     align-items: stretch
 }

 .custombox-fullscreen.custombox-content>* {
     width: 100%;
     max-height: 100%
 }

 .custombox-y-top {
     -ms-flex-align: baseline;
     align-items: baseline
 }

 .custombox-x-left {
     -ms-flex-align: start;
     align-items: flex-start
 }

 .custombox-y-center {
     -ms-flex-align: center;
     align-items: center
 }

 .custombox-y-bottom {
     -ms-flex-align: end;
     align-items: flex-end
 }

 .custombox-x-center {
     -ms-flex-pack: center;
     justify-content: center
 }

 .custombox-x-right {
     -ms-flex-pack: end;
     justify-content: flex-end
 }

 .custombox-perspective,
 .custombox-perspective body {
     perspective: 600px;
     height: 100%;
     overflow: hidden
 }

 .custombox-perspective .custombox-container {
     overflow: hidden;
     height: 100%
 }

 @keyframes fadeIn {
     from {
         transform: scale(.7);
         transition-property: all
     }
     to {
         transform: scale(1);
         opacity: 1
     }
 }

 @keyframes fadeOut {
     from {
         transform: scale(1);
         opacity: 1
     }
     to {
         transform: scale(.7);
         transition-property: all
     }
 }

 .custombox-fadein.custombox-content {
     opacity: 0
 }

 .custombox-fadein.custombox-content.custombox-open {
     animation-name: fadeIn;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-fadein.custombox-content.custombox-close {
     animation-name: fadeOut;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 @keyframes slideInTop {
     from {
         transform: translateY(-100%)
     }
     to {
         transform: translateY(0)
     }
 }

 @keyframes slideOutTop {
     from {
         transform: translateY(0)
     }
     to {
         transform: translateY(-100%)
     }
 }

 @keyframes slideInBottom {
     from {
         transform: translateY(100%)
     }
     to {
         transform: translateY(0)
     }
 }

 @keyframes slideOutBottom {
     from {
         transform: translateY(0)
     }
     to {
         transform: translateY(100%)
     }
 }

 @keyframes slideInLeft {
     from {
         transform: translateX(-100%)
     }
     to {
         transform: translateX(0)
     }
 }

 @keyframes slideOutLeft {
     from {
         transform: translateX(0)
     }
     to {
         transform: translateX(-100%)
     }
 }

 @keyframes slideInRight {
     from {
         transform: translateX(100%)
     }
     to {
         transform: translateX(0)
     }
 }

 @keyframes slideOutRight {
     from {
         transform: translateX(0)
     }
     to {
         transform: translateX(100%)
     }
 }

 .custombox-contentscale.custombox-content,
 .custombox-letmein.custombox-content,
 .custombox-makeway.custombox-content,
 .custombox-push.custombox-content,
 .custombox-slide.custombox-content,
 .custombox-slip.custombox-content {
     -ms-transform: translateX(-100%);
     transform: translateX(-100%)
 }

 .custombox-contentscale.custombox-content.custombox-open.custombox-top,
 .custombox-letmein.custombox-content.custombox-open.custombox-top,
 .custombox-makeway.custombox-content.custombox-open.custombox-top,
 .custombox-push.custombox-content.custombox-open.custombox-top,
 .custombox-slide.custombox-content.custombox-open.custombox-top,
 .custombox-slip.custombox-content.custombox-open.custombox-top {
     animation-name: slideInTop;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-contentscale.custombox-content.custombox-open.custombox-bottom,
 .custombox-letmein.custombox-content.custombox-open.custombox-bottom,
 .custombox-makeway.custombox-content.custombox-open.custombox-bottom,
 .custombox-push.custombox-content.custombox-open.custombox-bottom,
 .custombox-slide.custombox-content.custombox-open.custombox-bottom,
 .custombox-slip.custombox-content.custombox-open.custombox-bottom {
     animation-name: slideInBottom;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-contentscale.custombox-content.custombox-open.custombox-left,
 .custombox-letmein.custombox-content.custombox-open.custombox-left,
 .custombox-makeway.custombox-content.custombox-open.custombox-left,
 .custombox-push.custombox-content.custombox-open.custombox-left,
 .custombox-slide.custombox-content.custombox-open.custombox-left,
 .custombox-slip.custombox-content.custombox-open.custombox-left {
     animation-name: slideInLeft;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-contentscale.custombox-content.custombox-open.custombox-right,
 .custombox-letmein.custombox-content.custombox-open.custombox-right,
 .custombox-makeway.custombox-content.custombox-open.custombox-right,
 .custombox-push.custombox-content.custombox-open.custombox-right,
 .custombox-slide.custombox-content.custombox-open.custombox-right,
 .custombox-slip.custombox-content.custombox-open.custombox-right {
     animation-name: slideInRight;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-contentscale.custombox-content.custombox-close.custombox-top,
 .custombox-letmein.custombox-content.custombox-close.custombox-top,
 .custombox-makeway.custombox-content.custombox-close.custombox-top,
 .custombox-push.custombox-content.custombox-close.custombox-top,
 .custombox-slide.custombox-content.custombox-close.custombox-top,
 .custombox-slip.custombox-content.custombox-close.custombox-top {
     animation-name: slideOutTop;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-contentscale.custombox-content.custombox-close.custombox-bottom,
 .custombox-letmein.custombox-content.custombox-close.custombox-bottom,
 .custombox-makeway.custombox-content.custombox-close.custombox-bottom,
 .custombox-push.custombox-content.custombox-close.custombox-bottom,
 .custombox-slide.custombox-content.custombox-close.custombox-bottom,
 .custombox-slip.custombox-content.custombox-close.custombox-bottom {
     animation-name: slideOutBottom;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-contentscale.custombox-content.custombox-close.custombox-left,
 .custombox-letmein.custombox-content.custombox-close.custombox-left,
 .custombox-makeway.custombox-content.custombox-close.custombox-left,
 .custombox-push.custombox-content.custombox-close.custombox-left,
 .custombox-slide.custombox-content.custombox-close.custombox-left,
 .custombox-slip.custombox-content.custombox-close.custombox-left {
     animation-name: slideOutLeft;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-contentscale.custombox-content.custombox-close.custombox-right,
 .custombox-letmein.custombox-content.custombox-close.custombox-right,
 .custombox-makeway.custombox-content.custombox-close.custombox-right,
 .custombox-push.custombox-content.custombox-close.custombox-right,
 .custombox-slide.custombox-content.custombox-close.custombox-right,
 .custombox-slip.custombox-content.custombox-close.custombox-right {
     animation-name: slideOutRight;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 @keyframes newspaperIn {
     from {
         transform: scale(0) rotate(720deg);
         opacity: 0
     }
     to {
         transform: scale(1) rotate(0);
         opacity: 1
     }
 }

 @keyframes newspaperOut {
     from {
         transform: scale(1) rotate(0);
         opacity: 1
     }
     to {
         transform: scale(0) rotate(720deg);
         opacity: 0
     }
 }

 .custombox-newspaper.custombox-content {
     opacity: 0
 }

 .custombox-newspaper.custombox-content.custombox-open {
     animation-name: newspaperIn;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-newspaper.custombox-content.custombox-close {
     animation-name: newspaperOut;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 @keyframes fallIn {
     from {
         transform-style: preserve-3d;
         transform: translateZ(600px) rotateX(20deg);
         opacity: 0
     }
     to {
         transition-timing-function: ease-in;
         transition-property: all;
         transform: translateZ(0) rotateX(0);
         opacity: 1
     }
 }

 @keyframes fallOut {
     from {
         transition-timing-function: ease-in;
         transition-property: all;
         transform: translateZ(0) rotateX(0);
         opacity: 1
     }
     to {
         transform-style: preserve-3d;
         transform: translateZ(600px) rotateX(20deg);
         opacity: 0
     }
 }

 .custombox-fall.custombox-content {
     opacity: 0
 }

 .custombox-fall.custombox-content.custombox-open {
     animation-name: fallIn;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-fall.custombox-content.custombox-close {
     animation-name: fallOut;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 @keyframes sidefallIn {
     from {
         transform-style: preserve-3d;
         transform: translate(30%) translateZ(600px) rotate(10deg);
         opacity: 0
     }
     to {
         transition-timing-function: ease-in;
         transition-property: all;
         transform: translate(0) translateZ(0) rotate(0);
         opacity: 1
     }
 }

 @keyframes sidefallOut {
     from {
         transition-timing-function: ease-in;
         transition-property: all;
         transform: translate(0) translateZ(0) rotate(0);
         opacity: 1
     }
     to {
         transform-style: preserve-3d;
         transform: translate(30%) translateZ(600px) rotate(10deg);
         opacity: 0
     }
 }

 .custombox-sidefall.custombox-content {
     opacity: 0
 }

 .custombox-sidefall.custombox-content.custombox-open {
     animation-name: sidefallIn;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-sidefall.custombox-content.custombox-close {
     animation-name: sidefallOut;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 @keyframes blurInTop {
     from {
         transform: translateY(-5%);
         opacity: 0
     }
     to {
         transform: translateY(0);
         opacity: 1
     }
 }

 @keyframes blurOutTop {
     from {
         transform: translateY(0);
         opacity: 1
     }
     to {
         transform: translateY(-5%);
         opacity: 0
     }
 }

 @keyframes blurInBottom {
     from {
         transform: translateY(5%);
         opacity: 0
     }
     to {
         transform: translateY(0);
         opacity: 1
     }
 }

 @keyframes blurOutBottom {
     from {
         transform: translateY(0);
         opacity: 1
     }
     to {
         transform: translateY(5%);
         opacity: 0
     }
 }

 @keyframes blurInRight {
     from {
         transform: translateX(5%);
         opacity: 0
     }
     to {
         transform: translateY(0);
         opacity: 1
     }
 }

 @keyframes blurOutRight {
     from {
         transform: translateY(0);
         opacity: 1
     }
     to {
         transform: translateX(5%);
         opacity: 0
     }
 }

 @keyframes blurInLeft {
     from {
         transform: translateX(-5%);
         opacity: 0
     }
     to {
         transform: translateY(0);
         opacity: 1
     }
 }

 @keyframes blurOutLeft {
     from {
         transform: translateY(0);
         opacity: 1
     }
     to {
         transform: translateX(-5%);
         opacity: 0
     }
 }

 @keyframes blurInContainer {
     from {
         filter: blur(0)
     }
     to {
         filter: blur(3px)
     }
 }

 @keyframes blurOutContainer {
     from {
         filter: blur(3px)
     }
     to {
         filter: blur(0)
     }
 }

 .custombox-blur.custombox-content {
     opacity: 0
 }

 .custombox-blur.custombox-content.custombox-open.custombox-top {
     animation-name: blurInTop;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-blur.custombox-content.custombox-open.custombox-bottom {
     animation-name: blurInBottom;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-blur.custombox-content.custombox-open.custombox-left {
     animation-name: blurInLeft;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-blur.custombox-content.custombox-open.custombox-right {
     animation-name: blurInRight;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-blur.custombox-content.custombox-close.custombox-top {
     animation-name: blurOutTop;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-blur.custombox-content.custombox-close.custombox-bottom {
     animation-name: blurOutBottom;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-blur.custombox-content.custombox-close.custombox-right {
     animation-name: blurOutRight;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-blur.custombox-content.custombox-close.custombox-left {
     animation-name: blurOutLeft;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-blur.custombox-container {
     animation-name: blurOutContainer;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-blur.custombox-container.custombox-open {
     animation-name: blurInContainer;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 @keyframes flipInTop {
     from {
         transform-style: preserve-3d;
         transform: rotateX(-70deg)
     }
     to {
         transform: rotateY(0);
         opacity: 1
     }
 }

 @keyframes flipOutTop {
     from {
         transform: rotateY(0);
         opacity: 1
     }
     to {
         transform-style: preserve-3d;
         transform: rotateX(-70deg)
     }
 }

 @keyframes flipInBottom {
     from {
         transform-style: preserve-3d;
         transform: rotateX(70deg)
     }
     to {
         transform: rotateY(0);
         opacity: 1
     }
 }

 @keyframes flipOutBottom {
     from {
         transform: rotateY(0);
         opacity: 1
     }
     to {
         transform-style: preserve-3d;
         transform: rotateX(70deg)
     }
 }

 @keyframes flipInRight {
     from {
         transform-style: preserve-3d;
         transform: rotateY(70deg)
     }
     to {
         transform: rotateY(0);
         opacity: 1
     }
 }

 @keyframes flipOutRight {
     from {
         transform: rotateY(0);
         opacity: 1
     }
     to {
         transform-style: preserve-3d;
         transform: rotateY(70deg)
     }
 }

 @keyframes flipInLeft {
     from {
         transform-style: preserve-3d;
         transform: rotateY(-70deg)
     }
     to {
         transform: rotateY(0);
         opacity: 1
     }
 }

 @keyframes flipOutLeft {
     from {
         transform: rotateY(0);
         opacity: 1
     }
     to {
         transform-style: preserve-3d;
         transform: rotateY(-70deg)
     }
 }

 .custombox-flip.custombox-content {
     opacity: 0
 }

 .custombox-flip.custombox-content.custombox-open.custombox-top {
     animation-name: flipInTop;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-flip.custombox-content.custombox-open.custombox-bottom {
     animation-name: flipInBottom;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-flip.custombox-content.custombox-open.custombox-right {
     animation-name: flipInRight;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-flip.custombox-content.custombox-open.custombox-left {
     animation-name: flipInLeft;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-flip.custombox-content.custombox-close.custombox-top {
     animation-name: flipOutTop;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-flip.custombox-content.custombox-close.custombox-bottom {
     animation-name: flipOutBottom;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-flip.custombox-content.custombox-close.custombox-right {
     animation-name: flipOutRight;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-flip.custombox-content.custombox-close.custombox-left {
     animation-name: flipOutLeft;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 @keyframes signIn {
     from {
         transform-style: preserve-3d;
         transform: rotateX(-60deg);
         transform-origin: 50% 0;
         transition-property: all
     }
     to {
         transform: rotateX(0);
         opacity: 1
     }
 }

 @keyframes signOut {
     from {
         transform: rotateX(0);
         opacity: 1
     }
     to {
         transform-style: preserve-3d;
         transform: rotateX(-60deg);
         transform-origin: 50% 0;
         transition-property: all
     }
 }

 .custombox-sign {
     perspective: 1300px
 }

 .custombox-sign.custombox-content {
     opacity: 0
 }

 .custombox-sign.custombox-content.custombox-open {
     animation-name: signIn;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-sign.custombox-content.custombox-close {
     animation-name: signOut;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 @keyframes superscaledIn {
     from {
         transform: scale(2)
     }
     to {
         transform: scale(1);
         opacity: 1
     }
 }

 @keyframes superscaledOut {
     from {
         transform: scale(1);
         opacity: 1
     }
     to {
         transform: scale(2)
     }
 }

 .custombox-superscaled.custombox-content {
     opacity: 0
 }

 .custombox-superscaled.custombox-content.custombox-open {
     animation-name: superscaledIn;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-superscaled.custombox-content.custombox-close {
     animation-name: superscaledOut;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 @keyframes slitIn {
     0% {
         transform: translateZ(-3000px) rotateY(90deg)
     }
     50% {
         transform: translateZ(-250px) rotateY(89deg);
         opacity: 1;
         animation-timing-function: ease-out
     }
     100% {
         transform: translateZ(0) rotateY(0);
         opacity: 1
     }
 }

 @keyframes slitOut {
     0% {
         transform: translateZ(0) rotateY(0);
         opacity: 1
     }
     50% {
         transform: translateZ(-250px) rotateY(89deg);
         opacity: 1;
         animation-timing-function: ease-out
     }
     100% {
         transform: translateZ(-3000px) rotateY(90deg)
     }
 }

 .custombox-slit.custombox-content {
     opacity: 0;
     transform-style: preserve-3d
 }

 .custombox-slit.custombox-content.custombox-open {
     animation-name: slitIn;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-slit.custombox-content.custombox-close {
     animation-name: slitOut;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 @keyframes rotateIn {
     from {
         transform-style: preserve-3d;
         transform: translateY(0) rotateX(90deg);
         transform-origin: 0 100%;
         opacity: 0;
         transition-timing-function: ease-out;
         transition-property: all
     }
     to {
         transform: translateY(0) rotateX(0);
         opacity: 1
     }
 }

 @keyframes rotateOut {
     from {
         transform: translateY(0) rotateX(0);
         opacity: 1
     }
     to {
         transform-style: preserve-3d;
         transform: translateY(0) rotateX(90deg);
         transform-origin: 0 100%;
         opacity: 0;
         transition-timing-function: ease-out;
         transition-property: all
     }
 }

 .custombox-rotate {
     perspective: 2300px
 }

 .custombox-rotate.custombox-content {
     -ms-transform: translateY(-100%);
     transform: translateY(-100%)
 }

 .custombox-rotate.custombox-content.custombox-open {
     animation-name: rotateIn;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-rotate.custombox-content.custombox-close {
     animation-name: rotateOut;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 @keyframes letmeinBottomOverlay {
     to {
         transform: rotateX(-2deg);
         transform-origin: 50% 0;
         transform-style: preserve-3d
     }
 }

 @keyframes letmeinOutBottomOverlay {
     from {
         transform: rotateX(-2deg);
         transform-origin: 50% 0;
         transform-style: preserve-3d
     }
     to {
         opacity: 0
     }
 }

 @keyframes letmeinLeftOverlay {
     to {
         transform: rotateY(-2deg);
         transform-origin: 50% 0;
         transform-style: preserve-3d
     }
 }

 @keyframes letmeinOutLeftOverlay {
     from {
         transform: rotateY(-2deg);
         transform-origin: 50% 0;
         transform-style: preserve-3d
     }
     to {
         opacity: 0
     }
 }

 @keyframes letmeinRightOverlay {
     to {
         transform: rotateY(2deg);
         transform-origin: 50% 0;
         transform-style: preserve-3d
     }
 }

 @keyframes letmeinOutRightOverlay {
     from {
         transform: rotateY(2deg);
         transform-origin: 50% 0;
         transform-style: preserve-3d
     }
     to {
         opacity: 0
     }
 }

 @keyframes letmeinTopOverlay {
     to {
         transform: rotateX(2deg);
         transform-origin: 0 50%;
         transform-style: preserve-3d
     }
 }

 @keyframes letmeinOutTopOverlay {
     from {
         transform: rotateX(2deg);
         transform-origin: 50% 0;
         transform-style: preserve-3d
     }
     to {
         opacity: 0
     }
 }

 .custombox-letmein.custombox-overlay.custombox-open.custombox-top {
     animation-name: letmeinTopOverlay;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-letmein.custombox-overlay.custombox-open.custombox-bottom {
     animation-name: letmeinBottomOverlay;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-letmein.custombox-overlay.custombox-open.custombox-left {
     animation-name: letmeinLeftOverlay;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-letmein.custombox-overlay.custombox-open.custombox-right {
     animation-name: letmeinRightOverlay;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-letmein.custombox-overlay.custombox-close.custombox-top {
     animation-name: letmeinOutTopOverlay;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-letmein.custombox-overlay.custombox-close.custombox-bottom {
     animation-name: letmeinOutBottomOverlay;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-letmein.custombox-overlay.custombox-close.custombox-left {
     animation-name: letmeinOutLeftOverlay;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-letmein.custombox-overlay.custombox-close.custombox-right {
     animation-name: letmeinOutRightOverlay;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 @keyframes makewayInContainer {
     50% {
         transform: translateZ(-50px) rotateY(5deg);
         animation-timing-function: ease-out
     }
     100% {
         transform: translateZ(-200px)
     }
 }

 @keyframes makewayOutContainer {
     0% {
         transform: translateZ(-200px)
     }
     50% {
         transform: translateZ(-50px) rotateY(5deg);
         animation-timing-function: ease-out
     }
     100% {
         opacity: 0
     }
 }

 @keyframes makewayInTop {
     from {
         transform: translateY(-100%)
     }
     to {
         transform: translateY(0)
     }
 }

 @keyframes makewayOutTop {
     from {
         transform: translateY(0)
     }
     to {
         transform: translateY(-100%)
     }
 }

 @keyframes makewayInBottom {
     from {
         transform: translateY(100%)
     }
     to {
         transform: translateY(0)
     }
 }

 @keyframes makewayOutBottom {
     from {
         transform: translateY(0)
     }
     to {
         transform: translateY(100%)
     }
 }

 @keyframes makewayInLeft {
     from {
         transform: translateX(-100%)
     }
     to {
         transform: translateX(0)
     }
 }

 @keyframes makewayOutLeft {
     from {
         transform: translateX(0)
     }
     to {
         transform: translateX(-100%)
     }
 }

 @keyframes makewayInRight {
     from {
         transform: translateX(100%)
     }
     to {
         transform: translateX(0)
     }
 }

 @keyframes makewayOutRight {
     from {
         transform: translateX(0)
     }
     to {
         transform: translateX(100%)
     }
 }

 .custombox-makeway.custombox-overlay {
     transform-style: preserve-3d;
     -ms-transform-origin: 0 50%;
     transform-origin: 0 50%
 }

 .custombox-makeway.custombox-overlay.custombox-open {
     animation-name: makewayInContainer;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-makeway.custombox-overlay.custombox-close {
     animation-name: makewayOutContainer;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-makeway.custombox-container {
     transform-style: preserve-3d;
     -ms-transform-origin: 0 50%;
     transform-origin: 0 50%
 }

 .custombox-makeway.custombox-container.custombox-open {
     animation-name: makewayInContainer;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-makeway.custombox-container.custombox-close {
     animation-name: makewayOutContainer;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 @keyframes slipTopOverlay {
     50% {
         transform: rotateX(10deg);
         transform-origin: 50% 100%;
         transform-style: preserve-3d
     }
 }

 @keyframes slipOutTopOverlay {
     50% {
         transform: rotateX(10deg);
         transform-origin: 50% 100%;
         transform-style: preserve-3d
     }
 }

 @keyframes slipRightOverlay {
     50% {
         transform: rotateY(10deg);
         transform-origin: 50% 100%;
         transform-style: preserve-3d
     }
 }

 @keyframes slipOutRightOverlay {
     50% {
         transform: rotateY(10deg);
         transform-origin: 50% 100%;
         transform-style: preserve-3d
     }
 }

 @keyframes slipBottomOverlay {
     50% {
         transform: rotateX(-10deg);
         transform-origin: 50% 100%;
         transform-style: preserve-3d
     }
 }

 @keyframes slipOutBottomOverlay {
     50% {
         transform: rotateX(-10deg);
         transform-origin: 50% 100%;
         transform-style: preserve-3d
     }
 }

 @keyframes slipLeftOverlay {
     50% {
         transform: rotateY(-10deg);
         transform-origin: 50% 100%;
         transform-style: preserve-3d
     }
 }

 @keyframes slipOutLeftOverlay {
     50% {
         transform: rotateY(-10deg);
         transform-origin: 50% 100%;
         transform-style: preserve-3d
     }
 }

 .custombox-slip.custombox-overlay.custombox-open.custombox-top {
     animation-name: slipTopOverlay;
     animation-timing-function: ease-in-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-slip.custombox-overlay.custombox-open.custombox-bottom {
     animation-name: slipBottomOverlay;
     animation-timing-function: ease-in-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-slip.custombox-overlay.custombox-open.custombox-left {
     animation-name: slipLeftOverlay;
     animation-timing-function: ease-in-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-slip.custombox-overlay.custombox-open.custombox-right {
     animation-name: slipRightOverlay;
     animation-timing-function: ease-in-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-slip.custombox-overlay.custombox-close.custombox-top {
     animation-name: slipOutTopOverlay;
     animation-timing-function: ease-in-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-slip.custombox-overlay.custombox-close.custombox-bottom {
     animation-name: slipOutBottomOverlay;
     animation-timing-function: ease-in-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-slip.custombox-overlay.custombox-close.custombox-left {
     animation-name: slipOutLeftOverlay;
     animation-timing-function: ease-in-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-slip.custombox-overlay.custombox-close.custombox-right {
     animation-name: slipOutRightOverlay;
     animation-timing-function: ease-in-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-slip.custombox-container.custombox-open.custombox-top {
     animation-name: slipTopOverlay;
     animation-timing-function: ease-in-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-slip.custombox-container.custombox-open.custombox-bottom {
     animation-name: slipBottomOverlay;
     animation-timing-function: ease-in-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-slip.custombox-container.custombox-open.custombox-left {
     animation-name: slipLeftOverlay;
     animation-timing-function: ease-in-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-slip.custombox-container.custombox-open.custombox-right {
     animation-name: slipRightOverlay;
     animation-timing-function: ease-in-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-slip.custombox-container.custombox-close.custombox-top {
     animation-name: slipOutTopOverlay;
     animation-timing-function: ease-in-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-slip.custombox-container.custombox-close.custombox-bottom {
     animation-name: slipOutBottomOverlay;
     animation-timing-function: ease-in-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-slip.custombox-container.custombox-close.custombox-left {
     animation-name: slipOutLeftOverlay;
     animation-timing-function: ease-in-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-slip.custombox-container.custombox-close.custombox-right {
     animation-name: slipOutRightOverlay;
     animation-timing-function: ease-in-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 @keyframes cornerInOverlay {
     from {
         transform: translateY(150px) translateX(150px);
         transition-property: opacity, transform, visibility
     }
     to {
         transform: translateY(0);
         transition-property: opacity, transform
     }
 }

 @keyframes cornerOutOverlay {
     from {
         transform: translateY(0);
         transition-property: opacity, transform
     }
     to {
         transform: translateY(150px) translateX(150px);
         transition-property: opacity, transform, visibility;
         opacity: 0
     }
 }

 @keyframes cornerInContent {
     from {
         transform: translateY(150px) translateX(150px);
         transition-property: opacity, transform, visibility
     }
     to {
         transform: translateY(0);
         transition-property: opacity, transform;
         opacity: 1
     }
 }

 @keyframes cornerOutContent {
     from {
         transform: translateY(0);
         transition-property: opacity, transform;
         opacity: 1
     }
     to {
         transform: translateY(150px) translateX(150px);
         transition-property: opacity, transform, visibility;
         opacity: 0
     }
 }

 .custombox-corner.custombox-overlay.custombox-open {
     animation-name: cornerInOverlay;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-corner.custombox-overlay.custombox-close {
     animation-name: cornerOutOverlay;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-corner.custombox-content.custombox-open {
     animation-name: cornerInContent;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-corner.custombox-content.custombox-close {
     animation-name: cornerOutContent;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-slidetogether.custombox-content,
 .custombox-slidetogether.custombox-overlay {
     -ms-transform: translateX(-100%);
     transform: translateX(-100%)
 }

 .custombox-slidetogether.custombox-content.custombox-open.custombox-top,
 .custombox-slidetogether.custombox-overlay.custombox-open.custombox-top {
     animation-name: slideInTop;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-slidetogether.custombox-content.custombox-open.custombox-bottom,
 .custombox-slidetogether.custombox-overlay.custombox-open.custombox-bottom {
     animation-name: slideInBottom;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-slidetogether.custombox-content.custombox-open.custombox-left,
 .custombox-slidetogether.custombox-overlay.custombox-open.custombox-left {
     animation-name: slideInLeft;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-slidetogether.custombox-content.custombox-open.custombox-right,
 .custombox-slidetogether.custombox-overlay.custombox-open.custombox-right {
     animation-name: slideInRight;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-slidetogether.custombox-content.custombox-close.custombox-top,
 .custombox-slidetogether.custombox-overlay.custombox-close.custombox-top {
     animation-name: slideOutTop;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-slidetogether.custombox-content.custombox-close.custombox-bottom,
 .custombox-slidetogether.custombox-overlay.custombox-close.custombox-bottom {
     animation-name: slideOutBottom;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-slidetogether.custombox-content.custombox-close.custombox-left,
 .custombox-slidetogether.custombox-overlay.custombox-close.custombox-left {
     animation-name: slideOutLeft;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-slidetogether.custombox-content.custombox-close.custombox-right,
 .custombox-slidetogether.custombox-overlay.custombox-close.custombox-right {
     animation-name: slideOutRight;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 @keyframes scaleInOverlay {
     from {
         transform: scale(.9);
         transition: transform;
         opacity: 0
     }
     to {
         transform: scale(1);
         transition: transform
     }
 }

 @keyframes scaleOutOverlay {
     from {
         transform: scale(1);
         transition: transform
     }
     to {
         transform: scale(.9);
         transition: transform;
         opacity: 0;
         opacity: 0
     }
 }

 .custombox-scale.custombox-overlay.custombox-open {
     animation-name: scaleInOverlay;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-scale.custombox-overlay.custombox-close {
     animation-name: scaleOutOverlay;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-scale.custombox-content.custombox-open {
     animation-name: scaleInOverlay;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-scale.custombox-content.custombox-close {
     animation-name: scaleOutOverlay;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 @keyframes doorInOverlay {
     from {
         position: fixed;
         bottom: 0;
         left: 50%;
         right: 50%;
         width: 0
     }
     to {
         width: 100%;
         left: 0;
         right: 0;
         transition-property: width
     }
 }

 @keyframes doorOutOverlay {
     from {
         width: 100%;
         left: 0;
         right: 0;
         transition-property: width
     }
     to {
         position: fixed;
         bottom: 0;
         left: 50%;
         right: 50%;
         width: 0
     }
 }

 .custombox-door.custombox-overlay.custombox-open {
     animation-name: doorInOverlay;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-door.custombox-overlay.custombox-close {
     animation-name: doorOutOverlay;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-door.custombox-content.custombox-open {
     animation-name: doorInOverlay;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-door.custombox-content.custombox-close {
     animation-name: doorOutOverlay;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 @keyframes pushInLeftOverlay {
     from {
         transform: translateX(-100%)
     }
     to {
         transform: translateX(0) translateY(0)
     }
 }

 @keyframes pushOutLeftOverlay {
     from {
         transform: translateX(0) translateY(0)
     }
     to {
         transform: translateX(-100%)
     }
 }

 @keyframes pushInRightOverlay {
     from {
         transform: translateX(100%)
     }
     to {
         transform: translateX(0) translateY(0)
     }
 }

 @keyframes pushOutRightOverlay {
     from {
         transform: translateX(0) translateY(0)
     }
     to {
         transform: translateX(100%)
     }
 }

 @keyframes pushInTopOverlay {
     from {
         transform: translateY(-100%)
     }
     to {
         transform: translateX(0) translateY(0)
     }
 }

 @keyframes pushOutTopOverlay {
     from {
         transform: translateX(0) translateY(0)
     }
     to {
         transform: translateY(-100%)
     }
 }

 @keyframes pushInBottomOverlay {
     from {
         transform: translateY(100%)
     }
     to {
         transform: translateX(0) translateY(0)
     }
 }

 @keyframes pushOutBottomOverlay {
     from {
         transform: translateX(0) translateY(0)
     }
     to {
         transform: translateY(100%)
     }
 }

 @keyframes pushOutTopOverlay {
     from {
         transform: translateX(0) translateY(0)
     }
     to {
         transform: translateY(-100%)
     }
 }

 @keyframes pushInLeftContainer {
     from {
         overflow-x: hidden;
         transition-property: transform
     }
     to {
         transform: translateX(100%)
     }
 }

 @keyframes pushOutLeftContainer {
     from {
         transform: translateX(100%)
     }
     to {
         overflow-x: hidden;
         transition-property: transform
     }
 }

 @keyframes pushInRightContainer {
     from {
         overflow-x: hidden;
         transition-property: transform
     }
     to {
         transform: translateX(-100%)
     }
 }

 @keyframes pushOutRightContainer {
     from {
         transform: translateX(-100%)
     }
     to {
         overflow-x: hidden;
         transition-property: transform
     }
 }

 @keyframes pushInTopContainer {
     from {
         overflow-x: hidden;
         transition-property: transform
     }
     to {
         transform: translateY(100%)
     }
 }

 @keyframes pushOutTopContainer {
     from {
         transform: translateY(100%)
     }
     to {
         overflow-x: hidden;
         transition-property: transform
     }
 }

 @keyframes pushInBottomContainer {
     from {
         overflow-x: hidden;
         transition-property: transform
     }
     to {
         transform: translateY(-100%)
     }
 }

 @keyframes pushOutBottomContainer {
     from {
         transform: translateY(-100%)
     }
     to {
         overflow-x: hidden;
         transition-property: transform
     }
 }

 .custombox-push.custombox-overlay {
     transition-property: transform
 }

 .custombox-push.custombox-overlay.custombox-open.custombox-top {
     animation-name: pushInTopOverlay;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-push.custombox-overlay.custombox-open.custombox-bottom {
     animation-name: pushInBottomOverlay;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-push.custombox-overlay.custombox-open.custombox-left {
     animation-name: pushInLeftOverlay;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-push.custombox-overlay.custombox-open.custombox-right {
     animation-name: pushInRightOverlay;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-push.custombox-overlay.custombox-close.custombox-top {
     animation-name: pushOutTopOverlay;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-push.custombox-overlay.custombox-close.custombox-bottom {
     animation-name: pushOutBottomOverlay;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-push.custombox-overlay.custombox-close.custombox-left {
     animation-name: pushOutLeftOverlay;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-push.custombox-overlay.custombox-close.custombox-right {
     animation-name: pushOutRightOverlay;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-push.custombox-container.custombox-open.custombox-top {
     animation-name: pushInTopContainer;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-push.custombox-container.custombox-open.custombox-bottom {
     animation-name: pushInBottomContainer;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-push.custombox-container.custombox-open.custombox-left {
     animation-name: pushInLeftContainer;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-push.custombox-container.custombox-open.custombox-right {
     animation-name: pushInRightContainer;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-push.custombox-container.custombox-close.custombox-top {
     animation-name: pushOutTopContainer;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-push.custombox-container.custombox-close.custombox-bottom {
     animation-name: pushOutBottomContainer;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-push.custombox-container.custombox-close.custombox-left {
     animation-name: pushOutLeftContainer;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-push.custombox-container.custombox-close.custombox-right {
     animation-name: pushOutRightContainer;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 @keyframes contentscaleInContainer {
     from {
         transition: transform
     }
     to {
         transform: scale(.8)
     }
 }

 @keyframes contentscaleOutContainer {
     from {
         transform: scale(.8)
     }
     to {
         transition: transform
     }
 }

 .custombox-contentscale.custombox-overlay {
     -ms-transform: translateX(-100%);
     transform: translateX(-100%)
 }

 .custombox-contentscale.custombox-overlay.custombox-open.custombox-top {
     animation-name: slideInTop;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-contentscale.custombox-overlay.custombox-open.custombox-bottom {
     animation-name: slideInBottom;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-contentscale.custombox-overlay.custombox-open.custombox-left {
     animation-name: slideInLeft;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-contentscale.custombox-overlay.custombox-open.custombox-right {
     animation-name: slideInRight;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-contentscale.custombox-overlay.custombox-close.custombox-top {
     animation-name: slideOutTop;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-contentscale.custombox-overlay.custombox-close.custombox-bottom {
     animation-name: slideOutBottom;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-contentscale.custombox-overlay.custombox-close.custombox-left {
     animation-name: slideOutLeft;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-contentscale.custombox-overlay.custombox-close.custombox-right {
     animation-name: slideOutRight;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-contentscale.custombox-container.custombox-open {
     animation-name: contentscaleInContainer;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-contentscale.custombox-container.custombox-close {
     animation-name: contentscaleOutContainer;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 @keyframes swellOpen {
     0% {
         opacity: 0;
         transform: translate3d(calc(-100vw - 50%), 0, 0)
     }
     50% {
         opacity: 1;
         transform: translate3d(100px, 0, 0)
     }
     100% {
         opacity: 1;
         transform: translate3d(0, 0, 0)
     }
 }

 @keyframes swellClose {
     0% {
         opacity: 1;
         transform: translate3d(0, 0, 0)
     }
     50% {
         opacity: 1;
         transform: translate3d(-100px, 0, 0) scale3d(1.1, 1.1, 1)
     }
     100% {
         opacity: 0;
         transform: translate3d(calc(100vw + 50%), 0, 0)
     }
 }

 .custombox-swell.custombox-content {
     opacity: 0
 }

 .custombox-swell.custombox-content.custombox-open {
     animation-name: swellOpen;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-swell.custombox-content.custombox-close {
     animation-name: swellClose;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 @keyframes rotatedownOpen {
     0% {
         opacity: 0;
         transform: rotate3d(0, 0, 1, -45deg)
     }
     100% {
         opacity: 1;
         transform: rotate3d(0, 0, 1, 0deg)
     }
 }

 @keyframes rotatedownClose {
     0% {
         opacity: 1
     }
     100% {
         opacity: 0;
         transform: rotate3d(0, 0, 1, 45deg)
     }
 }

 @keyframes rotatedownElem {
     0% {
         opacity: 0;
         transform: translate3d(0, -150px, 0) rotate3d(0, 0, 1, -20deg)
     }
     100% {
         opacity: 1;
         transform: translate3d(0, 0, 0) rotate3d(0, 0, 1, 0deg)
     }
 }

 .custombox-rotatedown.custombox-content {
     opacity: 0;
     animation-timing-function: cubic-bezier(.7, 0, .3, 1);
     -ms-transform-origin: -150% 50%;
     transform-origin: -150% 50%
 }

 .custombox-rotatedown.custombox-content.custombox-open {
     animation-name: rotatedownOpen;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-rotatedown.custombox-content.custombox-close {
     animation-name: rotatedownClose;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 @keyframes flashOpen {
     0% {
         opacity: 0;
         transform: translate3d(-400px, 0, 0) scale3d(1.4, 0, 1)
     }
     100% {
         opacity: 1;
         transform: translate3d(0, 0, 0) scale3d(1, 1, 1)
     }
 }

 @keyframes flashClose {
     0% {
         opacity: 1;
         transform: translate3d(0, 0, 0) scale3d(1, 1, 1)
     }
     20% {
         opacity: 1;
         transform: translate3d(0, 0, 0) scale3d(1, 1, 1)
     }
     100% {
         opacity: 0;
         transform: translate3d(-400px, 0, 0) scale3d(1.4, 0, 1)
     }
 }

 .custombox-flash.custombox-content {
     opacity: 0;
     animation-timing-function: cubic-bezier(.7, 0, .3, 1)
 }

 .custombox-flash.custombox-content.custombox-open {
     animation-name: flashOpen;
     animation-timing-function: ease-in;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 .custombox-flash.custombox-content.custombox-close {
     animation-name: flashClose;
     animation-timing-function: ease-out;
     animation-fill-mode: forwards;
     backface-visibility: hidden
 }

 @keyframes spin {
     0% {
         transform: rotate(0)
     }
     100% {
         transform: rotate(360deg)
     }
 }

 .custombox-loader {
     display: none;
     border-style: solid;
     border-width: 5px;
     border-radius: 50%;
     width: 40px;
     height: 40px;
     animation-name: spin;
     animation-timing-function:linear;animation-iteration-count:infinite;position:fixed;top:50%;left:50%;margin:-25px 0 0 -25px;z-index:9998}