.animated {
    -webkit-animation-duration:1s;
    animation-duration:1s;
    -webkit-animation-fill-mode:both;
    animation-fill-mode:both
}
.animated.infinite {
    -webkit-animation-iteration-count:infinite;
    animation-iteration-count:infinite
}

@-webkit-keyframes bounceIn {
    20%,40%,60%,80%,from,to {
        -webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);
        animation-timing-function:cubic-bezier(.215,.61,.355,1)
    }
    0%  { opacity:0; -webkit-transform:scale3d(.3,.3,.3); transform:scale3d(.3,.3,.3) }
    20% { -webkit-transform:scale3d(1.1,1.1,1.1); transform:scale3d(1.1,1.1,1.1) }
    40% { -webkit-transform:scale3d(.9,.9,.9); transform:scale3d(.9,.9,.9) }
    60% { opacity:1; -webkit-transform:scale3d(1.03,1.03,1.03); transform:scale3d(1.03,1.03,1.03) }
    80% { -webkit-transform:scale3d(.97,.97,.97); transform:scale3d(.97,.97,.97) }
    to  { opacity:1; -webkit-transform:scale3d(1,1,1); transform:scale3d(1,1,1) }
}

@keyframes bounceIn {
    20%,40%,60%,80%,from,to {
        -webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);
        animation-timing-function:cubic-bezier(.215,.61,.355,1)
    }
    0%  { opacity:0;-webkit-transform:scale3d(.3,.3,.3); transform:scale3d(.3,.3,.3) }
    20% { -webkit-transform:scale3d(1.1,1.1,1.1); transform:scale3d(1.1,1.1,1.1) }
    40% { -webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9) }
    60% { opacity:1;-webkit-transform:scale3d(1.03,1.03,1.03); transform:scale3d(1.03,1.03,1.03) }
    80% { -webkit-transform:scale3d(.97,.97,.97);transform:scale3d(.97,.97,.97) }
    to  { opacity:1;-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1) }
}

.bounceIn{ 
    -webkit-animation-duration:.75s; 
    animation-duration:.75s; 
    -webkit-animation-name:bounceIn; 
    animation-name:bounceIn; 
}

@-webkit-keyframes slideInUp {
    from {
        -webkit-transform:translate3d(0,100%,0);
        transform:translate3d(0,100%,0);
        visibility:visible
    } to {
        -webkit-transform:translate3d(0,0,0);
        transform:translate3d(0,0,0)
    }
}

@keyframes slideInUp { 
    from{
        -webkit-transform:translate3d(0,100%,0);
        transform:translate3d(0,100%,0);
        visibility:visible
    }to{
        -webkit-transform:translate3d(0,0,0);
        transform:translate3d(0,0,0)
    }
}

.slideInUp{
    -webkit-animation-name:slideInUp;
    animation-name:slideInUp
}

@-webkit-keyframes pulse{
    from{
        -webkit-transform:scale3d(1,1,1);
        transform:scale3d(1,1,1)
    }50%{
        -webkit-transform:scale3d(1.05,1.05,1.05);
        transform:scale3d(1.05,1.05,1.05)
    }to{
        -webkit-transform:scale3d(1,1,1);
        transform:scale3d(1,1,1)
    }
}

@keyframes pulse{
    from{
        -webkit-transform:scale3d(1,1,1);
        transform:scale3d(1,1,1)
    }50%{
        -webkit-transform:scale3d(1.05,1.05,1.05);
        transform:scale3d(1.05,1.05,1.05)
    }to{
        -webkit-transform:scale3d(1,1,1);
        transform:scale3d(1,1,1)
    }
}

.pulse{
    -webkit-animation-name:pulse;
    animation-name:pulse
}

.promo-popup{
    display:none;
    opacity:0;
    position:fixed;
    right:24px;
    bottom:0;
    background:#fff;
    box-shadow:0 0 10px rgba(24,29,39,.1),0 15px 30px rgba(24,29,39,.1),0 5px 10px rgba(24,29,39,.05);
    z-index:2000;
    overflow:hidden;
    max-width:430px;
    border-radius:7px;
    -webkit-transform:translate(-100%,-100%);
    transform:translate(-100%,-100%);
    transition:bottom 280ms ease-in-out,-webkit-transform 280ms ease-in-out;
    transition:transform 280ms ease-in-out,bottom 280ms ease-in-out;
    transition:transform 280ms ease-in-out,bottom 280ms ease-in-out,
    -webkit-transform 280ms ease-in-out;
}

.promo-popup .up         { display:none}
.promo-popup .slideInUp  { bottom:30px; -webkit-transform:translate(0,0); transform:translate(0,0); display:block;opacity:1 }
.promo-popup .bounceIn   { bottom:30px; display:block }
.promo-popup .hidden     { bottom:-156px; right:24px; opacity:1 }
.promo-popup .hidden img { -webkit-transform:translateX(-100%); transform:translateX(-100%) }
.promo-popup.hidden .pp-intro-bar { padding-left:20px }
.promo-popup.hidden .pp-intro-bar h2:hover,.promo-popup.hidden .pp-intro-bar:hover { cursor:pointer } 
.promo-popup.hidden .up    { display:block }
.promo-popup.hidden .close { display:none }
.promo-popup.visible     { -webkit-transform:translateX(0); transform:translateX(0) }
.promo-popup img {
    position:absolute;
    left:0;
    bottom:0;
    height:100%;
    top:10px;
    box-shadow:0 0 15px rgba(0,0,0,.2);
    z-index:1;
    transition:-webkit-transform 280ms ease-in-out;
    transition:transform 280ms ease-in-out;
    transition:transform 280ms ease-in-out,-webkit-transform 280ms ease-in-out
}
.promo-popup .pp-intro-bar{
    background:#2d53fe;
    color:#fff;
    text-transform:uppercase;
    font-weight:500;
    font-size:11px;
    letter-spacing:3px;
    padding:10px 0;
    padding-left:172px;
    position:relative;
    transition:padding 280ms ease-in-out;
    line-height:1.5
}
.promo-popup .pp-intro-bar .close,.promo-popup .pp-intro-bar .up{
    position:absolute;
    bottom:0;
    right:0;
    top:0;
    line-height:36px;
    width:32px;
    text-align:center;
    transition:all 250ms ease-in-out;
    color:#fff
}
.promo-popup .pp-intro-bar .close i,.promo-popup .pp-intro-bar .up i{
    opacity:.7;
    font-size:17px;
    transition:all 250ms ease-in-out
}
.promo-popup .pp-intro-bar .close:hover,.promo-popup .pp-intro-bar .up:hover {     cursor:pointer; background:#143efe; }
.promo-popup .pp-intro-bar .close:hover i,.promo-popup .pp-intro-bar .up:hover i { opacity:1 }
.promo-popup .pp-intro-bar .up      { line-height:26px }
.promo-popup .pp-intro-bar .up i    { top:11px }
.promo-popup .pp-intro-bar .close i { top:0}
.promo-popup .pp-inner-content      { padding:22px; padding-left:172px!important; }
.promo-popup .pp-inner-content h2   { margin-bottom:7px; font-size:24px; line-height:1}
.promo-popup .pp-inner-content p    { font-size:12px; margin-bottom:17px; line-height:1.4;color:#5d6f82 }
.promo-popup .pp-inner-content a    { 
    font-size:12px; 
    font-weight:400; 
    color:#fff; 
    background:#2d53fe;
    padding:7px 15px;
    border-radius:50px;
    display:inline-block
}
.promo-popup .pp-inner-content a:hover{text-decoration:none}
.color-switcher{
    position:fixed;
    left:0;
    bottom:30px;
    z-index:2001;
    background:#181a23;
    padding:20px 20px;
    padding-top:25px;
    border-radius:5px;
    -webkit-transform:translateX(-110%);
    transform:translateX(-110%);
    transition:left .3s ease-in-out,-webkit-transform .3s ease-in-out;
    transition:transform .3s ease-in-out,left .3s ease-in-out;
    transition:transform .3s ease-in-out,left .3s ease-in-out,-webkit-transform .3s ease-in-out;
    box-shadow: 0 .46875rem 2.1875rem rgba(90,97,105,.1),
                0 .9375rem 1.40625rem rgba(90,97,105,.1),
                0 .25rem .53125rem rgba(90,97,105,.12),
                0 .125rem .1875rem rgba(90,97,105,.1);
}
.color-switcher.visible{
    -webkit-transform:translateX(0);
    transform:translateX(0);
    left:24px
}
.color-switcher h5{
    font-size:11px;
    font-weight:500;
    margin-bottom:0;
    line-height:1;
    letter-spacing:2px;
    color:#84899e;
    text-align:center;
    text-transform:uppercase
}
.color-switcher .accent-colors{
    display:-ms-flexbox;
    display:flex;
    padding:5px;
    margin:15px auto 20px auto;
    -ms-flex-pack:center;
    justify-content:center
}
.color-switcher .accent-colors li{
    display:inline-block;
    width:14px;
    height:14px;
    border-radius:50%;
    transition:-webkit-transform 180ms ease-in-out;
    transition:transform 180ms ease-in-out;
    transition:transform 180ms ease-in-out,-webkit-transform 180ms ease-in-out;
    text-align:center;margin:0 4px
}
.color-switcher .accent-colors li:hover:not(.active){
    cursor:pointer;
    -webkit-transform:scale(1.3);
    transform:scale(1.3)
}
.color-switcher .accent-colors li i{
    transition:opacity 180ms ease-in-out;
    line-height:1;color:#fff;
    font-size:10px;
    position:absolute;
    left:50%;
    top:50%;
    opacity:0;
    -webkit-transform:translate(-50%,-50%);
    transform:translate(-50%,-50%)
}
.color-switcher .accent-colors li.active{
    -webkit-transform:scale(1.5);
    transform:scale(1.5)
}
.color-switcher .accent-colors li.active i{
    opacity:1
}
.color-switcher .accent-colors li.accent-primary{
    background-color:#007bff
}
.color-switcher .accent-colors li.accent-secondary{
    background-color:#5a6169
}.color-switcher .accent-colors li.accent-success{
    background-color:#17c671
}
.color-switcher .accent-colors li.accent-info{
    background-color:#00b8d8
}
.color-switcher .accent-colors li.accent-warning{
    background-color:#ffb400
}
.color-switcher .accent-colors li.accent-danger{
    background-color:#c4183c
}
.color-switcher .actions{
    margin:15px 0
}
.color-switcher .social-actions{
    padding:10px 0;
    border-top:1px solid #2c2f44
}
.color-switcher .social-actions .inner-wrapper{
    display:table;margin:0 auto
}
.color-switcher .social-actions iframe{
    margin:5px 0 0 10px
}
.color-switcher #social-share{
    display:table;margin:0 auto
}
.color-switcher .sharrre .box{
    float:left
}
.color-switcher .sharrre .count{
    color:#444;
    display:block;
    font-size:17px;
    line-height:34px;
    height:34px;
    padding:4px 0;
    position:relative;
    text-align:center;
    text-decoration:none;
    width:50px;
    background-color:#eee;
    border-radius:4px
}
.color-switcher .sharrre .share{
    color:#fff;
    display:block;
    font-size:11px;
    height:16px;
    line-height:16px;
    margin-top:3px;
    padding:0;
    text-align:center;
    text-decoration:none;
    width:50px;
    background-color:#9cce39;
    border-radius:4px
}
.color-switcher .sharrre .buttons{
    display:block
}
.color-switcher .sharrre .button{
    float:left;margin-left:10px
}
.color-switcher .sharrre .button.facebook{
    margin-left:0
}
.color-switcher .close{
    position:absolute;
    right:10px;
    top:10px;
    font-size:15px;
    background:#2d3044;
    width:25px;
    height:25px;
    overflow:hidden;
    text-align:center;
    border-radius:50%;
    line-height:25px
}
.color-switcher-toggle{
    position:fixed;
    left:26px;
    bottom:33px;
    z-index:2000;
    width:45px;
    height:45px;
    background:#2d53fe;
    color:#fff;
    text-align:center;
    line-height:45px;
    font-size:23px;
    border-radius:50%;
    transition:color .2s ease-in-out;
    -webkit-animation-duration:1.5s;
    animation-duration:1.5s;
    box-shadow: 0 .46875rem 2.1875rem rgba(90,97,105,.1),
                0 .9375rem 1.40625rem rgba(90,97,105,.1),
                0 .25rem .53125rem rgba(90,97,105,.12),
                0 .125rem .1875rem rgba(90,97,105,.1)
}
.color-switcher-toggle:hover{
    cursor:pointer;color:#fff
}
.color-switcher-toggle i{
    top:3px
}
.social-wrapper{
    position:relative
}
.social-wrapper .loading-overlay{
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background:#181a23
}
.social-wrapper .spinner{
    position:absolute;
    top:50%;
    left:50%;
    margin-left:-10px;
    margin-top:-10px
}
.spinner{
    height:20px;
    width:20px;
    -webkit-animation:rotate .8s infinite linear;
    animation:rotate .8s infinite linear;
    border:2px solid #84899e;
    border-right-color:transparent;
    border-radius:50%
}

@-webkit-keyframes rotate{
    0%{
        -webkit-transform:rotate(0);
        transform:rotate(0)
    }
    100%{
        -webkit-transform:rotate(360deg);
        transform:rotate(360deg)
    }
}

@keyframes rotate{
    0%{
        -webkit-transform:rotate(0);
        transform:rotate(0)
    }
    100%{
        -webkit-transform:rotate(360deg);
        transform:rotate(360deg)
    }
}

@media (max-width:860px){
    .color-switcher,.color-switcher-toggle{
        display:none!important
    }
}

@media (max-width:500px){
    .promo-popup{
        left:10px;
        right:10px;
        bottom:10px!important
    }
    .promo-popup h2{
        font-size:22px!important;
        font-weight:500;
        letter-spacing:0
    }
    .promo-popup.hidden{
        bottom:-158px!important;
        left:10px!important;
        right:10px!important
    }
    .promo-popup.hidden .pp-intro-bar{
        padding-left:20px!important
    }
    .promo-popup img{
        left:-80px
    }
    .promo-popup .pp-inner-content,.promo-popup .pp-intro-bar{
        padding-left:85px!important
    }
}