/** Chronosat Web Application Styles 
*   Here we have only specific Chronosat Web Application Styles, all about the framework are in bfw.css
*/

.cwa-top-msg-box {color: #1a1a1a;
    background: #ea5724;
    /* width: 300px; */
    padding: 5px;
    border: 1px solid gray;
    /* font-size: .7em; */
    font-weight: bold;
    animation: CS-fadeInOut 1s;
    text-align: center;
    padding: 20px;
    border-radius: 10px;
    border: 5px solid goldenrod;
    z-index: 133;
    display: none;
}

.cwa-table thead tr {
    border-width: 0;
}

.cwa-table input {
    outline-width: 0;
    background: none;
    border-width: 0;
}

.cwa-table td {
    outline-width: 0;
}

.cwa-table .fa-plus-circle,
.cwa-table .fa-minus-circle,
.cwa-table .fa-undo {
    cursor: pointer;
    margin-left: 15px;
    font-size: 16px;
}


.ModDisabled {
    display: none !important;
}

.pointerCursor {
    cursor: pointer;
}

.CS-title-bar {
    display:flex;
    color: #aaa !important;
    background: linear-gradient(18deg, #333, #111) !important;
    max-height: 0;
    transition: max-height 0.5s ease;
    overflow: hidden;
}

.CS-title-bar-open {
    max-height: 100px;
}

.CS-form-div{
    /* background-color: #222; */
    /* background: url('../img/topo-kv.gif'); */
    color: goldenrod;
}

.CS-Details {
    background-color: lightyellow !important;
    display: none;
}

.CS-table-all {
    color: #ffc107 !important;
    zoom: .7;
    /* font-family: Arial, Helvetica, sans-serif; */
    font-family:'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif
}

.CS-table-all thead tr,
.CS-table-all .CS-SubHeader {
    border-bottom: none;
    background-color: #552d0a !important;
}

.CS-SubHeader td {
    vertical-align: middle !important;
    white-space: nowrap;
}

.CS-GLinkBtn {
    font-weight: bold;
    padding: 2px 8px;
    color: #1a1a1a;
    position: absolute;
    background-color: lightgray;
    border-radius: 4px;
}

.CS-GLinkBtn:hover {
    z-index: 20;
}

.CS-GLinkBtn >div{
    display: none;
    font-weight: bold;
    margin-top: 20px;
}

.CS-GLinkBtn >div >div{
    border-radius: 7px;
    margin: 5px;
    background-color: darkkhaki;
    padding: 3px 10px;
    font-size: 0.9em;
}

.CS-GLinkBtn >div >div:hover{
    background-color: yellow;
}

.CS-GLinkBtn:hover >div{
    display: block;
}

.CS-CatsBtns {
    margin-top: 15px;
}
.CS-CatsBtns >span {
    /* font-family: ui-serif; */
    font-weight: bold;
    cursor: pointer;
    display: inline-flex;
    margin: 2px;
    padding: 3px;
    background-color: orangered;
    color: white;
    border-radius: 7px;
}

.CS-CatsBtns >span:hover {
    background-color: orange;
}


.CS-table-all tr {
    user-select: none;
}

.CS-table-all tr:nth-child(odd) {
    background-color: #222;
}

.CS-table-all tr:nth-child(even) {
    background-color: #040404;
}

tr.RaceResVehicle {
    cursor: pointer;
}

tr.RaceResVehicle:hover {
    background-color: #444;

    border-bottom: #666 2px solid;
}

.RaceResVehicle td {
    /* position: relative; */
    /* font-weight: bold; */
    /* padding: 20px 8px 0 8px; USADO COM RACHORSE*/
    padding: 8px 8px 2px 8px;
}

.RaceResVehicle td >div {
    display: none;
    width: max-content;
    /* margin-top: 8px; */
    /* top: 5.3em; */
    z-index: 3;
    position: absolute;
    background-color: #444;
    padding: 10px;
    border: solid #666;
    border-width: 0 2px 2px 2px;
    /* left: 50px; */
    font-weight: bold;
}

.SsDetailSelect {    
    background-color: #000;
    display: inline-block;
    padding: 3px 9px 2px 9px;
    text-align: center;
    border-radius: 10px;
    margin: 2px;
    font-size: 17px !important;
}


.CS-RaceHorse {
    position: absolute;
    display: block !important;
    width: 95vw !important;
    height: 3px;
    background: gray;
    border: none !important;
    padding: 0 !important;
    margin: 5px 0 0 0;
}

.CS-RaceHorse >div {
    text-align: right;  
    background: #fb7435;
    padding: 0px;
    height: 100%;
    animation-duration: 1s;
    animation-timing-function: ease;
    width: 0%;
    transition: width 2s, height 2s, transform 2s;
}

.CS-RaceHorse >div >div {
    border-radius: 0 0 8px 8px;
    color: gold;
    display: inline-block;
    background: #fb74355C;
    padding: 3px 8px 0px 8px;
}


.SsDetailSelect:hover {
    background: #fc5000;
}

.CS-crew {
    color: #E0C762;
    font-size: 1.1em;
}

.CS-CarNr {
    display: inline-block;
    font-size: 1.7em;
    color: #E0C762;
}

.CS-nowrap {
    white-space: nowrap;
}
.CS-penalty {
    color: #F33;
}

.CS-bonus {
    color: deepskyblue;
}

.CS-total-time {
    color: white;
}


/* @media (min-width:993px) {} */


@media (max-width:601px) {
    .SsDetailSelect {
        font-size: .8em;
    }

    .bfw-page-title {
        font-size: 14px;
    }
}