﻿.data_manteinance {
    display: grid;
    color: black;
    background-color: whitesmoke;
    text-align: center;
    border-radius: 3%;
    font-size: 2em;
    font-weight: 600;
    grid-template-columns: 20% 80%;
    grid-template-rows: 92% 8%;
    border-radius: 16px;
    /*    background-color: #17141d;*/
    /*    box-shadow: -1rem 0 3rem #000;*/
    flex-direction: column;
    z-index: 0;
    margin-right: 25%;
    height: 77rem;
    transition: 0.2s;
    border: grey solid;
}


    .data_manteinance:not(:first-child) {
        margin-left: -130px;
    }

.data_manteinance_hover:hover {
    transform: translateY(-1rem);
    z-index: 99;
}

.data_manteinance:hover ~ .card {
    transform: translateX(130px);
}

.data_manteinance_left {
    padding-bottom: 4rem;
    border-right: solid 0.1rem lightgrey;
    padding-top: 3rem;
    background: rgb(21,21,21,0.1);
    height: calc(100% - 3rem);

}


.data_manteinance_right {
    grid-column: 2;
    display: grid;
    grid-template-rows: 12% 88%
}

.data_manteinance_right_head {
    color: #2196F3;
}

.data_manteinance_right_body {
    margin-top: 3%;
}



.data_manteinance_right_body_scroll {
    display: grid;
    grid-auto-flow: row;
    grid-template-columns: auto;
    height: 100%;
    overflow-y: scroll;
}

/*

    .data_manteinance_right_body_scroll::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
        border-radius: 20px;
        background-color:transparent
    }

    .data_manteinance_right_body_scroll::-webkit-scrollbar {
        width: 4px;
        background-color: transparent;
    }

    .data_manteinance_right_body_scroll::-webkit-scrollbar-thumb {
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
        border-radius: 20px;
        background: linear-gradient(0deg,#ff8a00,#e52e71)
    }*/

.data_manteinance_bottom {
    grid-column-start: 1;
    /* width: 100%; */
    grid-column-end: 3;
}

.data_manteinance_grid_title {
    BACKGROUND: linear-gradient(0deg,#ff8a00,#e52e71);
    font-size: 4em;
    z-index: 999;
    width: 8em;
    position: fixed;
    /* margin-left: -29%; */
    left: -2em;
    top: 14%;
    color: whitesmoke;
    /* background-color: whitesmoke; */
    text-align: center;
    border-top-right-radius: 3%;
    border-bottom-right-radius: 3%;
    font-weight: 100;
    height: 80%;
}

.mtn_percentual {
    float: right;
    margin-right: 0%;
    color: #2196F3;
    font-weight: 200;
    margin-right: 19%;
}

.contain_load {
    color: #000 !important;
    background-color: #f1f1f1 !important;
    width: 64%;
    margin: 0 auto;
    height: 1rem;
    border-radius: 2em;
    margin-top: 1rem;
    box-shadow: 0px 0.3rem 1.1rem 0px rgba(0,0,0,0.75);
}

.load {
    color: #fff !important;
    background-color: #2196F3 !important;
    padding: -0.99em 83px;
    height: 1rem;
    border-radius: 2em;
}

.checked_parameter {
    background: rgba(32, 148, 243, 0.56);
}








.tooltip {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black;
}

    .tooltip .tooltiptext {
        visibility: hidden;
        width: 120px;
        background-color: #555;
        color: #fff;
        text-align: center;
        border-radius: 6px;
        padding: 5px 0;
        position: absolute;
        z-index: 1;
        bottom: 125%;
        left: 50%;
        margin-left: -60px;
        opacity: 0;
        transition: opacity 1s;
    }

        .tooltip .tooltiptext::after {
            content: "";
            position: absolute;
            top: 100%;
            left: 50%;
            margin-left: -5px;
            border-width: 5px;
            border-style: solid;
            border-color: #555 transparent transparent transparent;
        }

    .tooltip:hover .tooltiptext {
        visibility: visible;
        opacity: 1;
    }
