/*****************
    Texts
 ****************/
.text-green{
    color:#8AE580;
}
.text-blue{
    color:#3A5C87;
}
.text-red{
    color:#F99191;
}
.text-black{
    color:#000000;
}
.text-gold{
    background-image: -webkit-gradient(linear, left top, right bottom, color-stop(0, #AC874A), color-stop(1, #E3D192));
    background-image: gradient(linear, left top, right bottom, color-stop(0, #AC874A), color-stop(1, #E3D192));
    color: transparent;
    -webkit-background-clip: text;
    background-clip: text;
    *background:inherit;
    *color:#AC874A;
}

.rainbow-text {
    font-weight: 500;
    background-image: -webkit-gradient(linear, left top, right top, color-stop(0, #ffffff), color-stop(0.01, #CFACFB), color-stop(0.35, #DE623B), color-stop(0.65, #53A0FD), color-stop(0.9, #B4EC51));
    background-image: gradient(linear, left top, right top, color-stop(0, #ffffff), color-stop(0.01, #CFACFB), color-stop(0.35, #DE623B), color-stop(0.65, #53A0FD), color-stop(0.9, #B4EC51));
    color: transparent;
    -webkit-background-clip: text;
    background-clip: text;
}
*::-ms-backdrop,.rainbow-text{
    background:inherit !important;
    color:#ffffff !important;
    background-clip: inherit !important;
    background-image:inherit !important;
}
    /*****************
        Background
     ****************/
.bg-red {
    background: red;
}

.bg-blue {
    background: blue;
}

.bg-yellow {
    background: yellow;
}

.bg-green{
    background: green;
}
.bg-pink{
    background: pink;
}


/*****************
    Animation
 ****************/

.fast-anim{
    -webkit-animation-duration: 0.5s;
    -webkit-animation-delay: 0.15s;
    -moz-animation-duration: 0.5s;
    -moz-animation-delay: 0.15s;
    -o-animation-duration: 0.5s;
    -o-animation-delay: 0.15s;
    animation-duration: 0.5s;
    animation-delay: 0.15s;
}

.medium-anim{
    -webkit-animation-duration: 0.8s;
    -webkit-animation-delay: 0.3s;
    -moz-animation-duration: 0.8s;
    -moz-animation-delay: 0.3s;
    -o-animation-duration: 0.8s;
    -o-animation-delay: 0.3s;
    animation-duration: 0.8s;
    animation-delay: 0.3s;
}
.slow-anim{
    -webkit-animation-duration: 2s;
    -webkit-animation-delay: 0.8s;
    -moz-animation-duration: 2s;
    -moz-animation-delay: 0.8s;
    -o-animation-duration: 2s;
    -o-animation-delay: 0.8s;
    animation-duration: 2s;
    animation-delay: 0.8s;
}


@-webkit-keyframes zoom {
    from {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
    to {
        -webkit-transform: scale3d(1.15, 1.15, 1.15);
        transform: scale3d(1.15, 1.15, 1.15);
    }
}

@keyframes zoom {
    from {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
    to {
        -webkit-transform: scale3d(1.15, 1.15, 1.15);
        transform: scale3d(1.15, 1.15, 1.15);
    }
}

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





/*****************
    HR
 ****************/
.hr{
    box-sizing: border-box;
    width: 38px;
    border: none;
    /*transform: rotate(-19deg);*/
}
.hr-green {
    border-bottom: 2px solid #8AE580;
}
.hr-yellow {
    border-bottom: 2px solid #ECCB6C;
}
.hr-white {
    border-bottom: 2px solid #ffffff;
}
.hr-red{
    border-bottom: 2px solid #F99191;
}