@import (css) "tooltip.css";

/**
   LOADING SPINNER
 */
a.ks_link{
    //color            : green;
    //background-color : red;
}

.spinner{
    width    : 40px;
    height   : 40px;
    position : relative;
    margin   : 10px;
}

.double-bounce1, .double-bounce2{
    width             : 100%;
    height            : 100%;
    border-radius     : 50%;
    background-color  : #333333;
    opacity           : 0.6;
    position          : absolute;
    top               : 0;
    left              : 0;

    -webkit-animation : sk-bounce 2.0s infinite ease-in-out;
    animation         : sk-bounce 2.0s infinite ease-in-out;
}

.double-bounce2{
    -webkit-animation-delay : -1.0s;
    animation-delay         : -1.0s;
}

@-webkit-keyframes sk-bounce{
    0%, 100%{
        -webkit-transform : scale(0.0)
    }
    50%{
        -webkit-transform : scale(1.0)
    }
}

@keyframes sk-bounce{
    0%, 100%{
        transform         : scale(0.0);
        -webkit-transform : scale(0.0);
    }
    50%{
        transform         : scale(1.0);
        -webkit-transform : scale(1.0);
    }
}

/**
   LOADING SPINNER
 */

#ks_tip{
    position         : absolute;
    z-index          : 9999;
    background-color : #FFFFFF;

}

.ba_ks__tooltip{
    background : #FFFFFF;
    box-shadow : 2px 2px 1px 0px rgba(128, 128, 128, .2);
    max-width  : 400px;
    padding    : 10px;
    border     : 1px solid rgba(128, 128, 128, .2);
    border-radius:7px;
    position   : absolute;
    z-index    : 999;
    .tooltipContent{
        display   : flex;
        flex-wrap : wrap;

        .imageHolder{
            max-width    : 100px;
            margin-right : 10px;
        }

        .contentHolder{
            flex : 1;
            p{
                &.title{
                    font-size     : 13px;
                    margin-bottom : 4px;
                }
                &.postContent{
                    font-size     : 11px;
                    margin-bottom : 0px;
                }
            }
        }
    }

    &:after{
        box-shadow : 1px 1px 1px rgba(128, 128, 128, .2);
    }
    p{
        color       : #000000;
        text-shadow : none;
    }
}