.spinner {
    -webkit-animation:spin 2s linear infinite;
    -moz-animation:spin 2s linear infinite;
    animation:spin 2s linear infinite;
}
@-moz-keyframes spin { 
    100% { -moz-transform: rotate(360deg); } 
}
@-webkit-keyframes spin { 
    100% { -webkit-transform: rotate(360deg); } 
}
@keyframes spin { 
    100% { 
        -webkit-transform: rotate(360deg); 
        transform:rotate(360deg); 
    } 
}

.fadein-1s {
    -webkit-animation: fadein 1s;
    -moz-animation: fadein 1s;
    -ms-animation: fadein 1s;
    -o-animation: fadein 1s;
    animation: fadein 1s;
}

.fadein-2s {
    -webkit-animation: fadein 2s;
    -moz-animation: fadein 2s;
    -ms-animation: fadein 2s;
    -o-animation: fadein 2s;
    animation: fadein 2s;
}

.fadein {
    -webkit-animation: fadein var(--duration);
    -moz-animation: fadein var(--duration);
    -ms-animation: fadein var(--duration);
    -o-animation: fadein var(--duration);
    animation: fadein var(--duration);
}

.fadeout-1s {
    -webkit-animation: fadeout 1s;
    -moz-animation: fadeout 1s;
    -ms-animation: fadeout 1s;
    -o-animation: fadeout 1s;
    animation: fadeout 1s;
}

.fadeout-2s {
    -webkit-animation: fadeout 2s;
    -moz-animation: fadeout 2s;
    -ms-animation: fadeout 2s;
    -o-animation: fadeout 2s;
    animation: fadeout 2s;
}

.fadeout {
    -webkit-animation: fadeout var(--duration);
    -moz-animation: fadeout var(--duration);
    -ms-animation: fadeout var(--duration);
    -o-animation: fadeout var(--duration);
    animation: fadeout var(--duration);
}

@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;
    }
}
@keyframes fadeout {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
        dislay: none !important;
    }
}
@-moz-keyframes fadeout {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
        dislay: none !important;
    }
}
@-webkit-keyframes fadeout {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
        dislay: none !important;
    }
}
@-ms-keyframes fadeout {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
        dislay: none !important;
    }
}
@-o-keyframes fadeout {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
        dislay: none !important;
    }
}
.blink {
    opacity: 0;
    animation: blink-animation 1s steps(10, start) infinite;
    -webkit-animation: blink-animation 1s steps(10, start) infinite;
}
@keyframes blink-animation {
    to {
        /*visibility:hidden; */
        opacity: 0.9;
    }
}
@-webkit-keyframes blink-animation {
    to {
        /*visibility:hidden; */
        opacity: 0.9;
    }
}

@keyframes slidein {
    0%   { 
    transform: translateX(200%); 		
    }
    100% { 
    transform: translateX(0%); 
    }
   }
 @keyframes slideout {
    0%   { 
    transform: translateX(0%);
    }
    100% { 
    transform: translateX(200%);
    visibility: hidden;
    padding: 0px !important;
    margin: 0px !important;
    }
}

@keyframes slideout-pss-powered {
    0%   { 
    overflow: hidden;
    /*transform: translateX(0%); */
    width: 146.15px;
    border: none;
    }
    100% { 
    overflow: hidden;
    /*transform: translateX(calc(100% - 46px));*/
    width: 0px;
    display: none;
    border: none;
    padding-left: 0px;
    }
}


.slidein {
    animation: slidein var(--duration) ease-out;
    -webkit-animation: flyin  var(--duration) ease-out;
    animation-fill-mode: forwards;
}

.slidein-2s {
    animation: slidein 2s ease-out;
    -webkit-animation: flyin 2s ease-out;
    animation-fill-mode: forwards;
}

.slidein-1s {
    animation: slidein 1s ease-out;
    -webkit-animation: flyin 1s ease-out;
    animation-fill-mode: forwards;
}

.slideout {
    animation: slideout var(--duration) ease-out;
    -webkit-animation: slideout  var(--duration) ease-out;
    animation-fill-mode: forwards;
}

.slideout-2s {
    animation: slideout 2s ease-out;
    -webkit-animation: slideout 2s ease-out;
    animation-fill-mode: forwards;
}

.slideout-1s {
    animation: slideout 1s ease-out;
    -webkit-animation: slideout 1s ease-out;
    animation-fill-mode: forwards;
}

.slideout-pss-powered {
    animation: slideout-pss-powered 2s ease-out;
    -webkit-animation: slideout-pss-powered 2s ease-out;
    animation-fill-mode: forwards;
    animation-delay: 4s;
}

.pss-powered:hover .slideout-pss-powered {
    -webkit-animation-play-state:unset;
}