.fadein {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -khtml-opacity: 0;
    opacity: 0;
}
.fadeinleft,
.fadeinright {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}
.fadeinstart {
    -webkit-animation: fadein 0.2s ease forwards;
    -moz-animation: fadein 0.2s ease forwards;
    -ms-animation: fadein 0.2s ease forwards;
    -o-animation: fadein 0.2s ease forwards;
    animation: fadein 0.2s ease forwards;
}
@keyframes fadein {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@-moz-keyframes fadein {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@-webkit-keyframes fadein {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@-ms-keyframes fadein {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@-o-keyframes fadein {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
.fadeinleft {
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -khtml-opacity: 0;
    opacity: 0;
}
.fadeinleftstart {
    -webkit-animation: fadeinleft 0.2s ease forwards;
    -moz-animation: fadeinleft 0.2s ease forwards;
    -ms-animation: fadeinleft 0.2s ease forwards;
    -o-animation: fadeinleft 0.2s ease forwards;
    animation: fadeinleft 0.2s ease forwards;
    position: relative;
}
@keyframes fadeinleft {
    from {
        left: -100px;
        opacity: 0;
    }
    to {
        left: 0;
        opacity: 1;
    }
}
@-moz-keyframes fadeinleft {
    from {
        left: -100px;
        opacity: 0;
    }
    to {
        left: 0;
        opacity: 1;
    }
}
@-webkit-keyframes fadeinleft {
    from {
        left: -100px;
        opacity: 0;
    }
    to {
        left: 0;
        opacity: 1;
    }
}
@-ms-keyframes fadeinleft {
    from {
        left: -100px;
        opacity: 0;
    }
    to {
        left: 0;
        opacity: 1;
    }
}
@-o-keyframes fadeinleft {
    from {
        left: -100px;
        opacity: 0;
    }
    to {
        left: 0;
        opacity: 1;
    }
}
.fadeinlefttop {
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -khtml-opacity: 0;
    opacity: 0;
}
.fadeinlefttopstart {
    -webkit-animation: fadeinlefttop 0.2s ease forwards;
    -moz-animation: fadeinlefttop 0.2s ease forwards;
    -ms-animation: fadeinlefttop 0.2s ease forwards;
    -o-animation: fadeinlefttop 0.2s ease forwards;
    animation: fadeinlefttop 0.2s ease forwards;
    position: relative;
}
@keyframes fadeinlefttop {
    from {
        left: -100px;
        top: -100px;
        opacity: 0;
    }
    to {
        left: 0;
        top: 0;
        opacity: 1;
    }
}
@-moz-keyframes fadeinlefttop {
    from {
        left: -100px;
        top: -100px;
        opacity: 0;
    }
    to {
        left: 0;
        top: 0;
        opacity: 1;
    }
}
@-webkit-keyframes fadeinlefttop {
    from {
        left: -100px;
        top: -100px;
        opacity: 0;
    }
    to {
        left: 0;
        top: 0;
        opacity: 1;
    }
}
@-ms-keyframes fadeinlefttop {
    from {
        left: -100px;
        top: -100px;
        opacity: 0;
    }
    to {
        left: 0;
        top: 0;
        opacity: 1;
    }
}
@-o-keyframes fadeinlefttop {
    from {
        left: -100px;
        top: -100px;
        opacity: 0;
    }
    to {
        left: 0;
        top: 0;
        opacity: 1;
    }
}
.fadeinrighttop {
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -khtml-opacity: 0;
    opacity: 0;
}
.fadeinrighttopstart {
    -webkit-animation: fadeinrighttop 0.2s ease forwards;
    -moz-animation: fadeinrighttop 0.2s ease forwards;
    -ms-animation: fadeinrighttop 0.2s ease forwards;
    -o-animation: fadeinrighttop 0.2s ease forwards;
    animation: fadeinrighttop 0.2s ease forwards;
    position: relative;
}
@keyframes fadeinrighttop {
    from {
        right: -100px;
        top: -100px;
        opacity: 0;
    }
    to {
        right: 0;
        top: 0;
        opacity: 1;
    }
}
@-moz-keyframes fadeinrighttop {
    from {
        right: -100px;
        top: -100px;
        opacity: 0;
    }
    to {
        right: 0;
        top: 0;
        opacity: 1;
    }
}
@-webkit-keyframes fadeinrighttop {
    from {
        right: -100px;
        top: -100px;
        opacity: 0;
    }
    to {
        right: 0;
        top: 0;
        opacity: 1;
    }
}
@-ms-keyframes fadeinrighttop {
    from {
        right: -100px;
        top: -100px;
        opacity: 0;
    }
    to {
        right: 0;
        top: 0;
        opacity: 1;
    }
}
@-o-keyframes fadeinrighttop {
    from {
        right: -100px;
        top: -100px;
        opacity: 0;
    }
    to {
        right: 0;
        top: 0;
        opacity: 1;
    }
}
.fadeinright {
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -khtml-opacity: 0;
    opacity: 0;
}
.fadeinleftbottom {
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -khtml-opacity: 0;
    opacity: 0;
}
.fadeinleftbottomstart {
    -webkit-animation: fadeinleftbottom 0.2s ease forwards;
    -moz-animation: fadeinleftbottom 0.2s ease forwards;
    -ms-animation: fadeinleftbottom 0.2s ease forwards;
    -o-animation: fadeinleftbottom 0.2s ease forwards;
    animation: fadeinleftbottom 0.2s ease forwards;
    position: relative;
}
@keyframes fadeinleftbottom {
    from {
        left: -100px;
        bottom: -100px;
        opacity: 0;
    }
    to {
        left: 0;
        bottom: 0;
        opacity: 1;
    }
}
@-moz-keyframes fadeinleftbottom {
    from {
        left: -100px;
        bottom: -100px;
        opacity: 0;
    }
    to {
        left: 0;
        bottom: 0;
        opacity: 1;
    }
}
@-webkit-keyframes fadeinleftbottom {
    from {
        left: -100px;
        bottom: -100px;
        opacity: 0;
    }
    to {
        left: 0;
        bottom: 0;
        opacity: 1;
    }
}
@-ms-keyframes fadeinleftbottom {
    from {
        left: -100px;
        bottom: -100px;
        opacity: 0;
    }
    to {
        left: 0;
        bottom: 0;
        opacity: 1;
    }
}
@-o-keyframes fadeinleftbottom {
    from {
        left: -100px;
        bottom: -100px;
        opacity: 0;
    }
    to {
        left: 0;
        bottom: 0;
        opacity: 1;
    }
}
.fadeinrightbottom {
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -khtml-opacity: 0;
    opacity: 0;
}
.fadeinrightbottomstart {
    -webkit-animation: fadeinrightbottom 0.2s ease forwards;
    -moz-animation: fadeinrightbottom 0.2s ease forwards;
    -ms-animation: fadeinrightbottom 0.2s ease forwards;
    -o-animation: fadeinrightbottom 0.2s ease forwards;
    animation: fadeinrightbottom 0.2s ease forwards;
    position: relative;
}
@keyframes fadeinrightbottom {
    from {
        right: -100px;
        bottom: -100px;
        opacity: 0;
    }
    to {
        right: 0;
        bottom: 0;
        opacity: 1;
    }
}
@-moz-keyframes fadeinrightbottom {
    from {
        right: -100px;
        bottom: -100px;
        opacity: 0;
    }
    to {
        right: 0;
        bottom: 0;
        opacity: 1;
    }
}
@-webkit-keyframes fadeinrightbottom {
    from {
        right: -100px;
        bottom: -100px;
        opacity: 0;
    }
    to {
        right: 0;
        bottom: 0;
        opacity: 1;
    }
}
@-ms-keyframes fadeinrightbottom {
    from {
        right: -100px;
        bottom: -100px;
        opacity: 0;
    }
    to {
        right: 0;
        bottom: 0;
        opacity: 1;
    }
}
@-o-keyframes fadeinrightbottom {
    from {
        right: -100px;
        bottom: -100px;
        opacity: 0;
    }
    to {
        right: 0;
        bottom: 0;
        opacity: 1;
    }
}
.fadeinright {
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -khtml-opacity: 0;
    opacity: 0;
}
.fadeinbottom,
.fadeintop {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}
.fadeinrightstart {
    -webkit-animation: fadeinright 0.2s ease forwards;
    -moz-animation: fadeinright 0.2s ease forwards;
    -ms-animation: fadeinright 0.2s ease forwards;
    -o-animation: fadeinright 0.2s ease forwards;
    animation: fadeinright 0.2s ease forwards;
    position: relative;
}
@keyframes fadeinright {
    from {
        right: -100px;
        opacity: 0;
    }
    to {
        right: 0;
        opacity: 1;
    }
}
@-moz-keyframes fadeinright {
    from {
        right: -100px;
        opacity: 0;
    }
    to {
        right: 0;
        opacity: 1;
    }
}
@-webkit-keyframes fadeinright {
    from {
        right: -100px;
        opacity: 0;
    }
    to {
        right: 0;
        opacity: 1;
    }
}
@-ms-keyframes fadeinright {
    from {
        right: -100px;
        opacity: 0;
    }
    to {
        right: 0;
        opacity: 1;
    }
}
@-o-keyframes fadeinright {
    from {
        right: -100px;
        opacity: 0;
    }
    to {
        right: 0;
        opacity: 1;
    }
}
.fadeinbottom {
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -khtml-opacity: 0;
    opacity: 0;
}
.fadeinbottomstart {
    -webkit-animation: fadeinbottom 0.2s ease forwards;
    -moz-animation: fadeinbottom 0.2s ease forwards;
    -ms-animation: fadeinbottom 0.2s ease forwards;
    -o-animation: fadeinbottom 0.2s ease forwards;
    animation: fadeinbottom 0.2s ease forwards;
    position: relative;
}
@keyframes fadeinbottom {
    from {
        bottom: -50px;
        opacity: 0;
    }
    to {
        bottom: 0;
        opacity: 1;
    }
}
@-moz-keyframes fadeinbottom {
    from {
        bottom: -50px;
        opacity: 0;
    }
    to {
        bottom: 0;
        opacity: 1;
    }
}
@-webkit-keyframes fadeinbottom {
    from {
        bottom: -50px;
        opacity: 0;
    }
    to {
        bottom: 0;
        opacity: 1;
    }
}
@-ms-keyframes fadeinbottom {
    from {
        bottom: -50px;
        opacity: 0;
    }
    to {
        bottom: 0;
        opacity: 1;
    }
}
@-o-keyframes fadeinbottom {
    from {
        bottom: -50px;
        opacity: 0;
    }
    to {
        bottom: 0;
        opacity: 1;
    }
}
.fadeintop {
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -khtml-opacity: 0;
    opacity: 0;
}
.fadeintopstart {
    -webkit-animation: fadeintop 0.2s ease forwards;
    -moz-animation: fadeintop 0.2s ease forwards;
    -ms-animation: fadeintop 0.2s ease forwards;
    -o-animation: fadeintop 0.2s ease forwards;
    animation: fadeintop 0.2s ease forwards;
    position: relative;
}
@keyframes fadeintop {
    from {
        top: -50px;
        opacity: 0;
    }
    to {
        top: 0;
        opacity: 1;
    }
}
@-moz-keyframes fadeintop {
    from {
        top: -50px;
        opacity: 0;
    }
    to {
        top: 0;
        opacity: 1;
    }
}
@-webkit-keyframes fadeintop {
    from {
        top: -50px;
        opacity: 0;
    }
    to {
        top: 0;
        opacity: 1;
    }
}
@-ms-keyframes fadeintop {
    from {
        top: -50px;
        opacity: 0;
    }
    to {
        top: 0;
        opacity: 1;
    }
}
@-o-keyframes fadeintop {
    from {
        top: -50px;
        opacity: 0;
    }
    to {
        top: 0;
        opacity: 1;
    }
}
.fadeinopacity {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -khtml-opacity: 0;
    opacity: 0;
}
.fadeinopacitystart {
    -webkit-animation: fadeinopacity 0.2s ease forwards;
    -moz-animation: fadeinopacity 0.2s ease forwards;
    -ms-animation: fadeinopacity 0.2s ease forwards;
    -o-animation: fadeinopacity 0.2s ease forwards;
    animation: fadeinopacity 0.2s ease forwards;
    position: relative;
}
@keyframes fadeinopacity {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@-moz-keyframes fadeinopacity {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@-webkit-keyframes fadeinopacity {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@-ms-keyframes fadeinopacity {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@-o-keyframes fadeinopacity {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
.shake {
    animation: shake 2s cubic-bezier(0.26, 0.07, 0.19, 0.97) infinite;
    animation-delay: 1s;
    transform: translate3d(0, 0, 0);
    backface-visibility: hidden;
    perspective: 1000px;
}
@keyframes shake {
    45%,
    5% {
        transform: translate3d(-1px, 0, 0);
    }
    10%,
    40% {
        transform: translate3d(2px, 0, 0);
    }
    15%,
    24%,
    30% {
        transform: translate3d(-4px, 0, 0);
    }
    20%,
    30% {
        transform: translate3d(4px, 0, 0);
    }
}
@-moz-keyframes shake {
    10%,
    90% {
        transform: translate3d(-1px, 0, 0);
    }
    20%,
    80% {
        transform: translate3d(2px, 0, 0);
    }
    30%,
    50%,
    70% {
        transform: translate3d(-4px, 0, 0);
    }
    40%,
    60% {
        transform: translate3d(4px, 0, 0);
    }
}
@-webkit-keyframes shake {
    10%,
    90% {
        transform: translate3d(-1px, 0, 0);
    }
    20%,
    80% {
        transform: translate3d(2px, 0, 0);
    }
    30%,
    50%,
    70% {
        transform: translate3d(-4px, 0, 0);
    }
    40%,
    60% {
        transform: translate3d(4px, 0, 0);
    }
}
@-ms-keyframes shake {
    10%,
    90% {
        transform: translate3d(-1px, 0, 0);
    }
    20%,
    80% {
        transform: translate3d(2px, 0, 0);
    }
    30%,
    50%,
    70% {
        transform: translate3d(-4px, 0, 0);
    }
    40%,
    60% {
        transform: translate3d(4px, 0, 0);
    }
}
@-o-keyframes shake {
    10%,
    90% {
        transform: translate3d(-1px, 0, 0);
    }
    20%,
    80% {
        transform: translate3d(2px, 0, 0);
    }
    30%,
    50%,
    70% {
        transform: translate3d(-4px, 0, 0);
    }
    40%,
    60% {
        transform: translate3d(4px, 0, 0);
    }
}
@-webkit-keyframes gelatine {
    from,
    to {
        -webkit-transform: scale(1, 1);
    }
    25% {
        -webkit-transform: scale(0.9, 1.1);
    }
    50% {
        -webkit-transform: scale(1.1, 0.9);
    }
    75% {
        -webkit-transform: scale(0.95, 1.05);
    }
}
@keyframes gelatine {
    from,
    to {
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
    }
    25% {
        -webkit-transform: scale(0.9, 1.1);
        transform: scale(0.9, 1.1);
    }
    50% {
        -webkit-transform: scale(1.1, 0.9);
        transform: scale(1.1, 0.9);
    }
    75% {
        -webkit-transform: scale(0.95, 1.05);
        transform: scale(0.95, 1.05);
    }
}


/* .drawLine {
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -khtml-opacity: 0;
    opacity: 0;
} */
.drawLinestart {
    -webkit-animation: drawLine 1s ease forwards;
    -moz-animation: drawLine 1s ease forwards;
    -ms-animation: drawLine 1s ease forwards;
    -o-animation: drawLine 1s ease forwards;
    animation: drawLine 1s ease forwards;
}
@keyframes drawLine {
    from {bottom: 240px;}
    to {bottom: 40px;}
}
@-moz-keyframes drawLine {
    from {bottom: 240px;}
    to {bottom: 40px;}
}
@-webkit-keyframes drawLine {
    from {bottom: 240px;}
    to {bottom: 40px;}
}
@-ms-keyframes drawLine {
    from {bottom: 240px;}
    to {bottom: 40px;}
}
@-o-keyframes drawLine {
    from {bottom: 240px;}
    to {bottom: 40px;}
}

.slideInstart:before {
    -webkit-animation: slideIn 1s ease forwards;
    -moz-animation: slideIn 1s ease forwards;
    -ms-animation: slideIn 1s ease forwards;
    -o-animation: slideIn 1s ease forwards;
    animation: slideIn 1s ease forwards;
}
@keyframes slideIn {
    from {
        border-color: white;
        left: -200px;
    }
    to {
        border-color: black;
        left: 0;
    }
}
@-moz-keyframes slideIn {
    from {
        border-color: white;
        left: -200px;
    }
    to {
        border-color: black;
        left: 0;
    }
}
@-webkit-keyframes slideIn {
    from {
        border-color: white;
        left: -200px;
    }
    to {
        border-color: black;
        left: 0;
    }
}
@-ms-keyframes slideIn {
    from {
        border-color: white;
        left: -200px;
    }
    to {
        border-color: black;
        left: 0;
    }
}
@-o-keyframes slideIn {
    from {
        border-color: white;
        left: -200px;
    }
    to {
        border-color: black;
        left: 0;
    }
}
