﻿body,
header,
section,
nav,
canvas,
video,
div,
span,
ul,
li,
a,
article,
h1,
p {
    border: none;
    outline: none;
    margin: 0;
    padding: 0;
}

@font-face {
    font-family: "proximaRegular";
    src: url("/fonts/ProximaNovaRegular.otf");
}

@font-face {
    font-family: "proximaSemiBold";
    src: url("/fonts/ProximaNovaSemiBold.otf");
}

@font-face {
    font-family: "proximaBold";
    src: url("/fonts/ProximaNovaExtraBold.otf");
}

@font-face {
    font-family: "proximaThin";
    src: url("/fonts/ProximaNovaThin.otf");
}

* {
    font-family: "proximaSemiBold";
}

body {
    font-size: 10px;
    background: #f4f4f4;
}

.btn-back {
    width: 160px;
    height: 36px;
    background: #81b54b;
    border-radius: 15px;
    box-shadow: 1px 1px 3px 0 rgba(0,0,0,0.5);
    transition: all 0.4s ease;
    cursor: pointer;
    text-align: center;
    vertical-align: middle;
    line-height: 36px;
}

.btn-back:hover{
    -webkit-transform:translateY(-3px);
    box-shadow: 2px 2px 7px 0 rgba(0,0,0,0.3);
}

    .btn-back img {
        position: relative;
        top: 4px;
        left: -5px;
        right: 0;
        margin: 0 auto;
        height: 15px;
    }

    .btn-back span {
        font-size: 1.4em;
        color: #FFF;
        position: relative;
        top: 2px;
    }

.span-finalizada, .span-andamento, .span-cancelada, .span-verificando, .span-pendente, .span-config, .span-config2, .span-buscar{
    position: absolute;
    display: block;
    width: 18px;
    height: 18px;
    background-size: 100% 100% !important;
    background: url("/img/icon-finalizada.png") no-repeat;
    left: 0;
    top: 0;
    margin: 11px 0 0 20px;
    z-index: 10;
}

.span-andamento {
    background: url("/img/icon-andamento.png");
}

.span-cancelada {
    background: url("/img/icon-cancelada.png");
}

.span-verificando {
    background: url("/img/icon-verificando.png");
}
.span-pendente {
    background: url("/img/green.png");
}

.span-config {
    background: url("/img/icon-config.png");
    margin-left: 175px !important;
}

.span-config2 {
    background: url("/img/icon-config.png");
}

.span-buscar{
    background: url("/img/icon-search-verde.png");
    margin-left: 175px !important;
}

.bg-cover {
    position: fixed;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.3);
    top: 0;
    left: 0;
    z-index: 8;
    display: none;
}

.confirm-window {
    position: fixed;
    width: 400px;
    height: 180px;
    background: #fff;
    top: 50%;
    left: 0;
    right: 0;
    margin: -90px auto;
    box-shadow: 0px 10px 25px 0px #222;
    z-index: 9999;
    display: none;
}

    .confirm-window img {
        position: absolute;
        top: 35px;
        left: 30px;
        width: 5px;
    }

    .confirm-window h1 {
        text-align: center;
        font-size: 17px;
        margin: 30px auto;
    }

#oksir {
    position: absolute;
    width: 130px;
    height: 30px;
    left: 0px;
    right: 0;
    margin: 15px auto;
    background: #fff;
    border: 2px solid #81b54b;
    color: #fff;
    cursor: pointer;
    background: #81b54b;
    padding: 8px 20px 8px 20px;
    line-height: 7px;
}

    #oksir:hover {
        border: 1px solid #111;
    }

.login-bg {
    position: absolute;
    left: 0;
    top: 0;
    background: url("/img/login-bg.png") no-repeat;
    background-size: 100%;
    width: 100%;
    height: 100%;
}

#login-radial-light {
    position: absolute;
    width: 900px;
    height: 800px;
    top: 0%;
    left: 0;
    right: 0;
    margin: 0 auto;
    background: -webkit-radial-gradient(#fff 20%, rgba(0,0,0,0) 50%);
    opacity: 0.8;
}

.login-holder {
    position: relative;
    width: 410px;
    height: auto;
    top: 40%;
    margin: -225px auto;
    background: #1d6894;
    border-radius: 15px;
    overflow: auto;
}


    .login-holder img {
        position: relative;
        display: block;
        margin: 35px auto;
    }

    .login-holder input[type="text"], .login-holder input[type="password"],
    .login-holder select, .login-holder input[type="submit"], textarea {
        position: relative;
        display: block;
        margin: 25px auto;
        width: 270px;
        height: 40px;
        border-radius: 20px;
        background: #2b7dad;
        color: #fff;
        border: none;
        padding-left: 10px;
        outline: none;
    }

    .login-holder select {
        width: 278px;
        height: 42px;
    }

#first-login {
    margin-top: 40px;
}

.login-holder input[type="submit"] {
    margin-top: 40px;
    height: 40px;
    background: #81b54b;
    cursor: pointer;
}

header {
    width: 100%;
    height: 140px;
    background: url("/img/header-bg.png") no-repeat;
    background-size: 100% 100%;
}

.header-container {
    position: relative;
    width: 1200px;
    height: 140px;
    margin: 0 auto;
}

    .header-container img {
        position: relative;
        display: block;
        float: left;
        margin: 25px 0 0 0;
    }

    .header-container ul {
        position: relative;
        display: block;
        float: left;
        margin: 40px 0 0 0;
    }

        .header-container ul li {
            position: relative;
            display: block;
            float: left;
            list-style: none;
            margin: 0 15px 0 15px;
            font-size: 1.4em;
        }

            .header-container ul li a {
                color: #fff;
                text-decoration: none;
                padding-bottom: 6px;
            }

                .header-container ul li a:hover {
                    border-bottom: 5px solid #81b54b;
                }

.active {
    /*border-bottom: 5px solid #81b54b;*/
}

.header-container ul li:first-child {
    margin-left: 60px;
}

.header-client-holder {
    position: relative;
    display: block;
    float: right;
    margin: 40px 10px 0 0;
}

    .header-client-holder span {
        color: #81b54b;
        font-size: 1.4em;
    }

    .header-client-holder div {
        font-size: 1.4em;
        color: #fff;
    }

    .header-client-holder img {
        float: left;
    }

#header-config {
    position: relative;
    display: block;
    float: right;
    margin: 36px 0 0 0;
    transition: all 0.8s ease;
    cursor: pointer;
}

    #header-config:hover {
        -webkit-transform: rotateZ(150deg);
        -moz-transform: rotateZ(150deg);
        -o-transform: rotateZ(150deg);
        transform: rotateZ(150deg);
    }

.container, .card {
    position: relative;
    width: 1200px;
    margin: 0px auto;
    background: #fff;
    border-radius: 25px;
}

.container {
    margin-top: 15px;
    box-shadow: 0 5px 25px 0 rgba(0,0,0,0.1);
}

#card-search {
    height: 150px;
}

.search-container {
    position: absolute;
    width: 758px;
    background: #f6f6f6;
    top: 76px;
    left: 102px;
    z-index: 9;
    box-shadow: 0 0 10px 0 #888;
    display: none;
}

.title-img-search {
    width: 32px;
    left: -180px !important;
    margin-top: 35px !important;
}

.btn-action-search {
    width: 165px !important;
}

.card-tables-search {
    width: 645px;
    padding-bottom: 10px !important;
}

.card-table-search {
    width: 610px !important;
}

    .card-table-search .table-td {
        width: 150px !important;
    }

.title-client-search {
    font-size: 1.6em !important;
    left: 25px !important;
    padding-bottom: 10px !important;
    padding-top: 43px !important;
}

.title-client-search2 {
    left: 15px !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    font-size: 1.6em !important;
}

.title-img-search2 {
    margin-top: 4px !important;
}

#btn-verMaisSearch {
    margin: 10px 0 0 333px !important;
}

#btn-novaOcorSearch {
    margin: -44px 0 0 135px !important;
}

#btn-verMaisSearch2 {
    margin: 10px 0 0 333px !important;
}

#btn-novaOcorSearch2 {
    margin: -44px 0 0 135px !important;
}

.nova-ocor-textarea {
    width: 730px;
    color: #000 !important;
    font-size: 18px;
    font-weight: bold;
}

.title {
    padding: 20px;
    text-align: center;
    font-family: "ProximaBold";
    font-size: 3em;
    color: #0a3955;
    background: #fff;
    border-radius: 20px 20px 0 0;
}

#search-holder {
    position: relative;
    width: 800px;
    margin: 0 auto;
    top: 40px;
    z-index: 10;
}

#main-search, #ticket-search {
    position: relative;
    display: block;
    width: 685px;
    height: 55px;
    float: left;
    font-size: 1.6em;
    padding: 0 50px 0 20px;
    border-radius: 30px;
    border: 4px solid #e1e1e1;
    outline: none;
    transition: all 0.5s ease;
}

    #main-search:hover, #ticket-search:hover {
        box-shadow: 1px 1px 1px 0 rgba(129,181,75,0.9);
    }

    #main-search:focus,, #ticket-search:focus {
        border-color: #81b54b;
    }

#arrow-down {
    position: absolute;
    margin: 25px 0 0 -50px;
    cursor: pointer;
    transition: all 0.5s ease;
}

.btn-action, #btn-search, #forms-search, #btn-novaOcorrencia {
    position: relative;
    width: 120px;
    height: 55px;
    float: left;
    background: #81b54b;
    border: 4px solid #e1e1e1;
    border-radius: 30px;
    margin-left: 20px;
}

    #btn-search img {
        position: relative;
        display: block;
        margin: 15px auto 0 auto;
    }

    .btn-action input[type="submit"], #btn-search input[type="submit"], #forms-search input[type="submit"], #btn-novaOcorrencia input[type="submit"] {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        cursor: pointer;
        opacity: 0;
    }

#card-options {
    background: #f6f6f6;
    border-radius: 0;
    padding-bottom: 30px;
}

.card-inner-holder {
    position: relative;
    width: 760px;
    margin: 0 auto;
}

.option-item {
    position: relative;
    width: 350px;
    height: 150px;
    float: left;
    margin: 20px 10px 0 10px;
    cursor: pointer;
    transition: all 0.6s ease;
    border-radius: 20px;
}

    .option-item:hover {
        background: #fff;
    }

        .option-item:hover > img {
            -webkit-transform: rotateY(30deg);
        }

    .option-item img {
        position: relative;
        display: block;
        float: left;
        margin: 35px 0 0 15px;
        transition: all 0.6s ease;
    }

.option-txt-holder {
    position: relative;
    display: block;
    width: 262px;
    height: 150px;
    float: left;
    text-align: center;
    color: #0a3955;
}

    .option-txt-holder h2 {
        font-size: 2em;
        margin: 50px 0 0 0;
    }

    .option-txt-holder span {
        font-size: 1.3em;
    }

#card-forms {
    background: #ececec;
    border-radius: 0;
    padding-bottom: 100px;
    float: left;
}

.card-inner-forms {
    margin-top: 40px;
}

#card-forms input[type="text"], #card-forms select, #card-forms input[type="datetime-local"] {
    position: relative;
    display: block;
    float: left;
    border-radius: 15px;
    border: 2px solid #d7d7d7;
    height: 24px;
    padding-left: 15px;
    margin: 20px 15px 0 0;
    outline: none;
}

#btn_ocor_agendar {
    position: relative;
    display: block;
    float: left;
    margin: 20px 20px 0 0;
}

#cb {
    width: 17px;
    height: 17px;
    outline: none;
}

#btn_ocor_agendar span {
    position: relative;
    top: -5px;
    font-size: 12px;
}

#txbNumero {
    width: 142px;
}

#txbComplemento {
    width: 305px;
}

#ddlTipo {
    width: 239px;
}

#card-forms #txt_data_ag, #card-forms #txt_horario_ag {
    display: none;
}

#txbOBS, #txbDescricao {
    clear: both;
}

.pesquisarpor {
    position: relative;
    margin: auto auto auto 5px;
    color: #0a3955;
    font-size: 1.4em;
}

    .pesquisarpor label {
        margin: 0 15px 0 15px;
    }


#txbHidro {
    width: 340px;
}

#input-rua {
    width: 170px;
}

#input-numero {
    width: 80px;
}

#input-complemento {
    width: 212px;
}

#input-cep {
    width: 150px;
}

#input-bairro {
    width: 224px;
}

#card-forms select {
    width: 230px;
    height: 30px;
}

#input-ocor {
    width: 200px;
}

#input-ligacao {
    width: 120px;
}

#input-ligacao2 {
    width: 353px;
}

#input-datahora {
    width: 140px;
}

.btn-action, #forms-search, #btn-novaOcorrencia {
    position: relative;
    display: block;
    clear: both;
    height: 36px;
    margin: 30px auto 0 270px;
    color: #fff;
    width: 180px;
    font-size: 1.4em;
    line-height: 36px;
    text-align: center;
}

    .btn-action span, #forms-search span, #btn-novaOcorrencia span {
        margin: 0 0 0 -20px;
    }

    .btn-action img, #forms-search img, #btn-novaOcorrencia img {
        position: absolute;
        right: 25px;
        top: 6px;
    }

.card select, .card select option:first-child, .card input[type="text"] {
    /*font-family:"ProximaThin";*/
    font-family: "ProximaRegular";
    color: #000;
}

#input-nomeCliente, #input-atendimento, #input-nomeSolicitante {
    width: 714px;
}

textarea {
    width: 720px;
    height: 90px;
    background: #fff;
    resize: none;
    left: 0;
    border: 2px solid #d7d7d7;
    margin: 15px 0 0 0;
    font-family: "proximaThin";
    color: #000;
    top: 15px;
}

#txtarea-solicitacao {
    top: 15px;
    height: 100px;
}

#txtarea-obs {
    margin-top: 30px;
    height: 100px;
}

#btn-novaOcorrencia, #btn-novaOcorrenciaCancelar {
    position: relative;
    margin: 0;
    display: block;
    float: left;
}

#btn-novaOcorrencia {
    margin: 30px 0 0 165px;
}

#btn-novaOcorrenciaCancelar {
    float: right;
    margin: -44px 195px 0 0;
}

    #btn-novaOcorrencia span, #btn-novaOcorrenciaCancelar span {
        margin: 0;
    }

footer {
    position: relative;
    width: 100%;
    height: 50px;
    margin: 50px 0 0 0;
    background: #81b54b;
    text-align: center;
    line-height: 50px;
}

    footer span {
        color: #fff;
        font-size: 1.2em;
    }

/* clientes */

.title-client {
    position: relative;
    background: none;
    color: #0a3955;
    font-size: 2em;
    padding: 50px;
    left: 40px;
}

.title-img, .title-img2 {
    position: absolute;
    left: -250px;
    right: 0;
    margin: 20px auto;
}

.title-img2 {
    left: -420px;
}

.card-tables {
    background: #f6f6f6;
    height: auto;
    border-radius: 0;
    float: left;
    padding-bottom: 25px;
}

.card-table {
    position: relative;
    width: 800px;
    margin: 0px auto;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.table-th {
    position: relative;
    width: 100%;
    height: 40px;
    background: #0a3955;
    border-radius: 25px;
    margin: 0px 0 0 0;
    color: #fff;
    font-family: "proximaBold";
    font-size: 1.4em;
    line-height: 40px;
}

.table-td {
    position: relative;
    float: left;
    width: 158px;
    height: 40px;
    text-align: center;
    color: #000;
    font-size: 1.2em;
    /*font-family:"proximaThin";*/
    font-family: "ProximaRegular";
}

.table-td-font {
    position: relative;
    float: left;
    width: 158px;
    height: 40px;
    text-align: center;
    color: #000;
    font-size: 1.2em;
    /*font-family:"proximaThin";*/
    font-family: "ProximaRegular";
}

.table-td .span-center {
    position: absolute;
    display: table;
    height: 40px;
    text-align: center;
    width: 100%;
}

    .table-td .span-center div {
        display: table-cell;
        vertical-align: middle;
        text-align: center;
        /*font-family:"proximaThin";*/
        font-family: "ProximaRegular";
    }

.table-th-divisor {
    position: relative;
    display: block;
    float: left;
    width: 1px;
    height: 30px;
    margin: 5px 0 0 0;
    background: #2c556d;
}

.table-th .table-td span {
    position: relative;
    display: block;
    float: left;
    font-size: 0.6em;
    color: #fff;
}

.table-th .table-td span {
    position: absolute;
    display: block;
    left: 0;
    right: 0;
    margin: 0 auto;
}

.btn-th {
    display: none;
    position: absolute;
    width: 14px;
    height: 10px;
    background: url("/img/icon-arrowdown2.png") no-repeat;
    background-size: 100% 100%;
    right: 10px;
    margin: 15px 0 0 0;
}

    .btn-th input[type="submit"] {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        opacity: 0;
        cursor: pointer;
    }

.table-inputs {
    width: 100%;
    height: 40px;
}

.table-tr {
    width: 100%;
    height: 40px;
    border-radius: 25px;
    margin-bottom: 2px;
    cursor: pointer;
}

.table-inputs input[type="text"] {
    display: block;
    padding: 0 5px 0 5px;
    text-align: center;
    margin: 10px auto 0 auto;
    border: 1px solid #CCC;
    border-radius: 15px;
    outline: none;
    height: 24px;
}

.table-inputs select {
    margin: 10px 0 0 0;
    height: 26px;
    border: 1px solid #CCC;
    border-radius: 20px;
    outline: none;
}

.pagination-holder {
    position: relative;
    width: 600px;
    height: 50px;
    margin: 30px auto;
    color: #000;
    line-height: 25px;
    font-size: 1.4em;
    /*font-family:"proximaThin";*/
    font-family: "ProximaRegular";
    left: -60px;
}

.pagination-txt {
    position: relative;
    display: block;
    float: left;
    /*font-family:"proximaThin";*/
    font-family: "ProximaRegular";
}

.pagination-prev, .pagination-next {
    position: relative;
    width: 100px;
    height: 25px;
    border-radius: 20px;
    float: left;
    background: #b6b6b6;
    color: #fff;
    line-height: 25px;
    text-align: center;
    /*font-family:"proximaThin";*/
    font-family: "ProximaRegular";
    margin: 0 0 0 10px;
    cursor: pointer;
    outline: none;
    border: none;
}

.pagination-next {
    margin: 0;
}

.pagination-dot {
    position: relative;
    width: 50px;
    height: 27px;
    border-radius: 100%;
    float: left;
    margin: 0 7px 0 7px;
    background: #b6b6b6;
    color: #fff;
    line-height: 25px;
    text-align: center;
    cursor: pointer;
}

.operacoes-select {
    position: relative;
    display: block;
    width: 250px;
    height: 32px;
    border-radius: 5px;
    margin: 0 0 0 50px;
}

.select-material {
    position: absolute;
    width: 114px !important;
    top: 0;
    right: 0;
    padding-left: 5px !important;
    cursor: text !important;
}

.search-material {
    position: absolute;
    top: 11px;
    right: -28px;
    width: 22px;
    cursor: pointer;
}

.pagination-next.enviar-os, .pagination-next.imprimir-os, .pagination-next.alterar-equipe {
    position: relative;
    display: block;
    width: 250px;
    height: 32px;
    margin: 15px 0 25px 50px;
    background: #81b54b;
}

.alterar-equipe-lbl {
    position: absolute;
    display: block;
    margin: 51px 0 0 53px;
    color: #0a395f;
    font-style: italic;
    font-size: 1.2em;
}

.pagination-next.imprimir-os {
    float: right;
    margin: 15px 50px 25px 0;
}

#btn-novaOcor, #btn-imprimir, #btn-novaOcorSearch, #btn-verMaisSearch, #btn-novaOcorSearch2, #btn-verMaisSearch2 {
    margin-top: -15px;
    float: left;
}

#btn-imprimir {
    margin: -44px 300px 0 0;
    float: right;
}

    #btn-novaOcor span, #btn-imprimir span, #btn-imprimir2 span,
    #btn-novaOcorSearch span, #btn-verMaisSearch span,
    #btn-novaOcorSearch2 span, #btn-verMaisSearch2 span {
        font-size: 0.8em;
        margin-left: 25px;
    }

    #btn-novaOcor img, #btn-imprimir img, #btn-imprimir2 img,
    #btn-novaOcorSearch img, #btn-verMaisSearch img,
    #btn-novaOcorSearch2 img, #btn-verMaisSearch2 img {
        width: 20px;
        margin-top: 2px;
        left: 20px;
    }

    #btn-imprimir img {
        left: 42px;
    }

#client-holder2 {
    position: relative;
    background: #efefef;
    border-radius: 0;
    padding-bottom: 30px;
}

#btn-imprimir2 {
    left: 140px;
}

.sair {
    position: absolute;
    width: 122px;
    height: 30px;
    text-align: center;
    background: #81B54B;
    color: #fff;
    line-height: 30px;
    right: 3px;
    top: 80px;
    font-size: 1.4em;
    border-radius: 14px;
    cursor: pointer;
    display: none;
    z-index: 9999;
}

#helperteste {
    position: absolute;
    width: 270px;
    height: 40px;
    background-color: #81B54B;
    border-radius: 36px;
    bottom: 63px;
    left: 0;
    right: 0;
    margin: 0 auto;
    cursor: pointer;
    text-align: center;
    line-height: 40px;
    color: #fff;
    font-size: 1.3em;
}

/* detalhes */

.detalhes-col {
    position: relative;
    width: 48%;
    float: left;
}

.detalhe-info {
    position: relative;
    display: block;
    margin: 15px 0 0 50px;
    height: 15px;
}

    .detalhe-info span {
        position: relative;
        display: block;
        color: #0a3955;
        float: left;
        font-size: 1.3em;
        width: 160px;
        font-family: "arial";
    }

    .detalhe-info p {
        position: relative;
        margin: 0 0 0 10px;
        padding: 0;
        display: block;
        font-size: 1.4em;
        font-family: "arial";
        color: #000;
    }

.detalhe-txt-holder {
    margin-top: 30px;
}

.detalhes-txt {
    clear: both;
    margin: 0 0 0 0 !important;
    top: 5px;
    line-height: 20px;
    padding: 0 80px 0 39px !important;
    text-align: justify;
}

.detalhe-txt-holder span {
    margin: 0 0 0 39px;
}

.img-btn {
    position: relative;
    width: 175px;
    height: 34px;
    border: 1px solid #bbb;
    color: #bbb;
    border-radius: 15px;
    float: right;
    text-align: center;
    line-height: 34px;
    margin: 10px 12px 0 10px;
    cursor: pointer;
}

    .img-btn-active, .img-btn:hover {
        border-color: #0a3955;
        color: #0a3955;
    }

#img-canvas {
    position: relative;
    display: block;
    margin: 30px auto;
    max-width: 850px;
    max-height: 500px;
}

.btn-action2 {
    float: left;
    clear: none;
    margin: 15px 10px 30px 10px;
}

    .btn-action2 span {
        margin: 0 !important;
    }

.modulo {
    margin-top: 15px !important;
    font-size: 1.2em;
}

.btn-action.fix {
    clear: both;
    margin: 10px;
    text-align: center;
    /*background-color: #195F91;*/
    background-color: #063550;
}

    .btn-action.fix span {
        margin-left: 0;
    }

.separador {
    clear: both;
}

.span-config-usuario {
    background: url("/img/icon-config.png");
    margin-left: 180px !important;
    position: absolute;
    display: block;
    width: 18px;
    height: 18px;
    background-size: 100% 100% !important;
    left: 0;
    top: 0;
    margin: 11px 0 0 20px;
    z-index: 10;
}
.span-config-servico-executado {
    background: url("/img/icon-config.png");
    margin-left: 180px !important;
    position: absolute;
    display: block;
    width: 18px;
    height: 18px;
    background-size: 100% 100% !important;
    left: 0;
    top: 0;
    margin: 11px 0 0 20px;
    z-index: 10;
}

.span-config-funcionario {
    background: url("/img/icon-config.png");
    margin-left: 180px !important;
    position: absolute;
    display: block;
    width: 18px;
    height: 18px;
    background-size: 100% 100% !important;
    left: 0;
    top: 0;
    margin: 11px 0 0 20px;
    z-index: 10;
}

.span-config-cargo {
    background: url("/img/icon-config.png");
    margin-left: 180px !important;
    position: absolute;
    display: block;
    width: 18px;
    height: 18px;
    background-size: 100% 100% !important;
    left: 0;
    top: 0;
    margin: 11px 0 0 20px;
    z-index: 10;
}

.span-config-material {
    background: url("/img/icon-config.png");
    margin-left: 180px !important;
    position: absolute;
    display: block;
    width: 18px;
    height: 18px;
    background-size: 100% 100% !important;
    left: 0;
    top: 0;
    margin: 11px 0 0 20px;
    z-index: 10;
}

.span-config-veiculo {
    background: url("/img/icon-config.png");
    margin-left: 180px !important;
    position: absolute;
    display: block;
    width: 18px;
    height: 18px;
    background-size: 100% 100% !important;
    left: 0;
    top: 0;
    margin: 11px 0 0 20px;
    z-index: 10;
}

.span-config-lista-ocorrencia {
    background: url("/img/icon-config.png");
    margin-left: 180px !important;
    position: absolute;
    display: block;
    width: 18px;
    height: 18px;
    background-size: 100% 100% !important;
    left: 0;
    top: 0;
    margin: 11px 0 0 20px;
    z-index: 10;
}

.tr-lista {
    cursor: auto !important;
    border: 1px solid #FFF;
}

    .tr-lista:hover {
        border: 1px solid #000;
    }



/*Modal*/
.modal {
    position: fixed;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    background-color: rgba(0,0,0,.6);
    /*opacity: 0.8;*/
    z-index: 99999;
}

@keyframes lds-spinner {

    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@-webkit-keyframes lds-spinner {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.lds-spinner {
    position: relative;
}

    .lds-spinner div {
        left: 94px;
        top: 48px;
        position: absolute;
        -webkit-animation: lds-spinner linear 1s infinite;
        animation: lds-spinner linear 1s infinite;
        background: #00fe31;
        width: 12px;
        height: 24px;
        border-radius: 40%;
        -webkit-transform-origin: 6px 52px;
        transform-origin: 6px 52px;
    }

        .lds-spinner div:nth-child(1) {
            -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
            -webkit-animation-delay: -0.916666666666667s;
            animation-delay: -0.916666666666667s;
        }

        .lds-spinner div:nth-child(2) {
            -webkit-transform: rotate(30deg);
            transform: rotate(30deg);
            -webkit-animation-delay: -0.833333333333333s;
            animation-delay: -0.833333333333333s;
        }

        .lds-spinner div:nth-child(3) {
            -webkit-transform: rotate(60deg);
            transform: rotate(60deg);
            -webkit-animation-delay: -0.75s;
            animation-delay: -0.75s;
        }

        .lds-spinner div:nth-child(4) {
            -webkit-transform: rotate(90deg);
            transform: rotate(90deg);
            -webkit-animation-delay: -0.666666666666667s;
            animation-delay: -0.666666666666667s;
        }

        .lds-spinner div:nth-child(5) {
            -webkit-transform: rotate(120deg);
            transform: rotate(120deg);
            -webkit-animation-delay: -0.583333333333333s;
            animation-delay: -0.583333333333333s;
        }

        .lds-spinner div:nth-child(6) {
            -webkit-transform: rotate(150deg);
            transform: rotate(150deg);
            -webkit-animation-delay: -0.5s;
            animation-delay: -0.5s;
        }

        .lds-spinner div:nth-child(7) {
            -webkit-transform: rotate(180deg);
            transform: rotate(180deg);
            -webkit-animation-delay: -0.416666666666667s;
            animation-delay: -0.416666666666667s;
        }

        .lds-spinner div:nth-child(8) {
            -webkit-transform: rotate(210deg);
            transform: rotate(210deg);
            -webkit-animation-delay: -0.333333333333333s;
            animation-delay: -0.333333333333333s;
        }

        .lds-spinner div:nth-child(9) {
            -webkit-transform: rotate(240deg);
            transform: rotate(240deg);
            -webkit-animation-delay: -0.25s;
            animation-delay: -0.25s;
        }

        .lds-spinner div:nth-child(10) {
            -webkit-transform: rotate(270deg);
            transform: rotate(270deg);
            -webkit-animation-delay: -0.166666666666667s;
            animation-delay: -0.166666666666667s;
        }

        .lds-spinner div:nth-child(11) {
            -webkit-transform: rotate(300deg);
            transform: rotate(300deg);
            -webkit-animation-delay: -0.083333333333333s;
            animation-delay: -0.083333333333333s;
        }

        .lds-spinner div:nth-child(12) {
            -webkit-transform: rotate(330deg);
            transform: rotate(330deg);
            -webkit-animation-delay: 0s;
            animation-delay: 0s;
        }

.lds-spinner {
    width: 200px !important;
    height: 200px !important;
    -webkit-transform: translate(-100px, -100px) scale(1) translate(100px, 100px);
    transform: translate(-100px, -100px) scale(1) translate(100px, 100px);
    margin: auto;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}
/*Modal*/
.operacoes-submenu {
    position: absolute !important;
    width: 200px;
    height: auto;
    background: #f5f5f5;
    box-shadow: 0 0 8px 0 #555;
    margin: 15px -55px !important;
    z-index: 99;
    border-radius: 15px 15px 15px 15px;
}

    .operacoes-submenu:after {
        top: -16%;
        left: 50%;
        border: solid transparent;
        content: " ";
        position: absolute;
        pointer-events: none;
        border-top-color: rgba(245, 245, 245, 1);
        border-width: 10px;
        margin-left: -10px;
        transform: rotate(180deg);
        -webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -o-transform: rotate(180deg);
    }

    .operacoes-submenu li {
        display: list-item !important;
        float: none !important;
        margin: 0 !important;
        text-align: center !important;
        height: 30px !important;
        line-height: 30px;
    }

        .operacoes-submenu li a:hover {
            border: none !important;
        }

        .operacoes-submenu li a {
            color: #0A3955 !important;
            font-size: 0.8em;
            width: 100%;
            height: 100%;
            line-height: 40px;
            display: block;
            transition: all 0.5s ease;
        }

            .operacoes-submenu li a:hover {
                background: #fff;
            }

        .operacoes-submenu li:first-child a {
            border-radius: 15px 15px 0 0;
        }

        .operacoes-submenu li:last-child a {
            border-radius: 0 0 15px 15px;
        }

.operacao-iniciar-container {
    position: fixed;
    width: 700px;
    left: 0;
    right: 0;
    top: 50%;
    margin: -170px auto;
    background: #f5f5f5;
    box-shadow: 0 0 10px 0 #888;
    border-radius: 15px;
    z-index: 12;
    display: none;
}

    .operacao-iniciar-container.roll {
        margin: 0;
        top: 0;
        overflow-x: hidden !important;
    }

    .operacao-iniciar-container h1 {
        text-align: center;
        padding: 20px;
        background: #81B54B;
        color: #fff;
        border-radius: 15px 15px 0 0;
    }

.operacao-iniciar-linha {
    position: relative;
    display: block;
    width: 90%;
    height: 10px;
    margin: 15px 2% 0 0px;
    clear: both;
}

    .operacao-iniciar-linha span {
        position: relative;
        display: block;
        float: left;
        margin: 0 0 0 0px;
    }

        .operacao-iniciar-linha span:first-child {
            width: 105px;
            text-align: left;
            margin: 0 0 0 50px;
        }

        .operacao-iniciar-linha span:last-child {
            margin: 0 0 0 30px;
            color: #1D6894;
        }

.pop-divisor {
    position: relative;
    width: 580px;
    height: 1px;
    background: #81B54B;
    margin: 25px 0 0 50px;
}

.operacao-iniciar-container select {
    width: 150px;
    height: 22px;
    margin: 20px 0 0 48px;
    border-radius: 15px;
    float: left;
    outline: none;
}

.operacao-iniciar-container label {
    position: relative;
    width: 100px;
    height: 20px;
    display: block;
    margin: 20px 0 0 50px;
    float: left;
}

.operacao-iniciar-container input[type='checkbox'] {
    width: 17px;
    height: 17px;
    margin-left: 5px;
    outline: none;
}

.operacao-iniciar-container label span {
    position: relative;
    top: -4px;
    font-size: 1.1em;
}

.operacao-iniciar-container input[type='text'] {
    width: 119px;
    height: 22px;
    margin: 10px 0 0 16px;
    padding: 0 0 0 3px;
    outline: none;
    display: none;
    border: 1px solid #999;
    border-radius: 15px;
    cursor: pointer;
    display: inline-block;
}
.close-modal {
    position: absolute;
    width: 30px;
    height: 30px;
    border-radius: 100%;
    color: #fff;
    border: 1px solid #fff;
    text-align: center;
    line-height: 30px;
    right: 23px;
    top: 16px;
    font-size: 1.2em;
    cursor: pointer;
}