/* bootstrap 3 started doing stupid colors */
.alert-warning {
    color: #8a6d3b;
    background-color: #ffd2d2;
    border-color: #faebcc;
}

.titleHelper  {
    color:lightslategray;
}

.rowTitle, .fyi{
    color:lightslategray;
    display: inline;
}

.jLabel{
    color:gray;
    display: inline;
}

.highlightRow {
    background-color: lightyellow !important;
}


/*see jcss.css
.table-jStriped tbody tr:nth-child(odd) td, .table-striped tbody tr:nth-child(odd) th {
    background-color: lightyellow ;
}
 .jActive td, .jActive tr {
    text-color: lightyellow !important;
}

.table-striped tbody tr:nth-child(odd) td, .table-striped tbody tr:nth-child(odd) th {*/
    /* background-color: #f9f9f9; */
/*}*/

/*
You nned to highlight certain rows even when bootstrap is already trying to color it
http://www.bootply.com/jjrohrer/BKGhKiTavL
*/

.table-jStriped > tbody > tr:nth-child(odd).jActive> td {
    background-color: lightgreen;
}
.table-jStriped tbody tr:nth-child(odd) td, .table-striped tbody tr:nth-child(odd) th {
    background-color: #f9f9f9; ;
}

.jActive{
    background-color: lightgreen ;
}



.jHighlight {
    background-color: yellow;
}

.jOK{
    background-color: rgba(144, 238, 144, 0.75);
}

.jCaution {
     background-color: rgba(255, 165, 0, 0.47);
 }

.jWarning {
    background-color: rgba(243, 147, 151, 0.64);
}

.jSubdued {
     color: lightslategray;
 }

.jFormatted {
    display: block;
    unicode-bidi: embed;
    white-space: pre;
}

.jSmaller {
    font-size-adjust: 80%;
}


.jHidden {
    display: none;
}

.jStrike {
    text-decoration: line-through;
    pointer-events: none;
    cursor: default;
}


.jCommentTimeStamp {
    font-style: italic;
    text-decoration: overline;
    color: lightslategray;
    white-space: normal;
    font-size: 80%;
}


/* This fixes a conflict apparently caused by importing bootstrap min.
I tried putting this in event_plugin.css, but it was ignore, but it works here.  ok.

#adminmenu .wp-submenu {
    margin-left: 0px;
}
*/


 /* Make detail reveals go smoother
     https://codepen.io/morewry/pen/gbJvy
     */
    details[open] .jDetails_body {
        animation-name: invisiblyGrowFontSize, fadeIn;
        animation-duration: 500ms, 200ms;
        animation-delay: 0ms, 300ms;
    }

    /* add wrapper, continue with font-size */
    @keyframes invisiblyGrowFontSize {
        0% {
            /*font-size: 0;*/
            max-height:0px;
            opacity: 0;
        }
        100% {
            /*font-size: 1em;*/
            max-height: 999px;
            opacity: 0;
        }
    }

    @keyframes fadeIn {
        0% {
            opacity: 0;
        }
        100% {
            opacity: 1;
        }
    }