@font-face {
    font-family: 'Oswald';
    font-style: normal;
    font-weight: 300;
    src: local('Oswald Regular'), local('Oswald-Regular'), url(../Font/fontegoogle.woff) format('woff');
}

@font-face {
    font-family: 'SEGOEUIL';
    font-weight: 300;
    src: url('../Font/SEGOEUIL.eot');
    src: local('SEGOEUIL'), url('../Font/SEGOEUIL.woff') format('woff'), url('../Font/SEGOEUIL.ttf') format('truetype');
}

body {
    background-image: url("../Image/Portal/fundo.png");
    background-repeat: repeat;
    font-family: "Segoe Ui Light", "Segoe Ui";
    color: #fff;
}

h2 {
    color: #666666;
    font-size: 16px;
}

#supCabecalho {
    width: 100%;
    background: #87cefa;
}

#cabecalho {

    width: 100%;
    clear: both;
    top: 0;
   
}

    #cabecalho img {
        float: left;
        margin-left: 20px;

    }

#suporte {
    margin-top: 30px;
}

.style1 {
    width: 100px;
    height: 100px;
}

.style2 {
    width: 225px;
    height: 49px;
    padding-bottom: 20px;
}

.painel {
    width: 200px;
    max-width: 270px;
    padding: 5px;
    margin-left: 55px;
}

    .painel p {
        font-size: 1.0em;
        color: #ffffff;
        padding: 2px;
        font-family: Helvetica;
        line-height: 0.5;
    }

.span6 img {
    padding-bottom: 20px;
    margin-right: 20px;
}

.span6 {
    max-width: 500px;
}

.fundo {
    background: #fff;
    padding: 10px;
    box-shadow: 0 0 15px #666;
}

.tables {
    width: 100%;
    color: #666;
}

    .tables tr th {
        border-bottom: 1px solid #87cefa;
        text-align: left;
        padding-bottom: 5px;
        margin-bottom: 10px;
        font-size: 12px;
    }

    .tables tr td {
        font-size: 11px;
        line-height: 1.5em;
    }

#newOrders {
    margin: 30px 0;
}

#createOrders {
    padding: 10px;
}

#filter {
    padding: 10px 0;
    margin-top: -20px;
    float: left;
    color: #666;
    font-family: Segoe UI Light;
}

#filial {
    font-size: 11px;
    color: #ffffff;
    text-decoration: none;
    position: absolute;
    right: 0;
    margin: -8px 50px 0 0;
}

#menu {
    float: left;
    margin-top: -10px;
}

    #menu img, #menu2 img, #menu3 img {
        float: right;
        margin-left: 10px;
    }

#menu2 {
    float: left;
    margin-top: 20px;
}

#menu3 {
    float: left;
    margin-top: 20px;
}

#menu4 {
    float: right;
    margin-top: 20px;
}

    #menu a, #menu2 a, #menu3 a {
        float: right;
        height: auto;
    }

#fundoTabela[name=testandodiv] {
    background: #fff;
    box-shadow: 0 0 15px #666;
    width: 100%;
}

#tableOrders {
    width: 100%;
    text-align: left;
    color: #666;
    margin: 10px;
}

    #tableOrders tr {
        font-weight: normal;
        margin: 10px;
    }

        #tableOrders tr th {
            border-bottom: 2px solid #87cefa;
            border-left: #666;
        }

.editItem tr td {
    padding: 3px 10px;
}

.economy {
    font-size: 18px;
    line-height: 1em;
    margin-top: -70px;
    width: 60%;
    color: #666;
}

.orderDetails {
    margin-top: -20px;
}

.config {
    border: 1px solid #87cefa;
    padding: 10px;
}

    .config legend {
        width: auto;
        color: #666;
        font-size: 14px;
        margin-bottom: 5px;
    }

#form {
    margin: -40px 0 0 20px;
    width: 50%;
}

#atencao {
    position: absolute;
    width: 250px;
    margin-top: -1px;
}

#integration {
    float: left;
}

#integrationMultiple {
    margin: 0;
}

#testaQueryMultiple {
    float: left;
}

.containerFields {
    width: 66%;
    padding: 5px;
    position: relative;
    left: 15px;
    background: white;
    float: left;
    display: block;
    margin: 5px 0 5px 25px;
    border: 1px solid #87cefa;
}

.fields {
    list-style: none;
    float: left;
    width: 23%;
}

    .fields li {
        padding: 5px;
        font-size: 12px;
    }

#QueryIntegration {
    width: 98%;
    float: left;
}

#QueryIntegrationMultipleOrders {
    width: 98%;
}

#formOrders table tr td p {
    padding: 10px 25px 10px 0;
    color: #666;
    font-family: Segoe UI Light;
    margin-left: 10px;
}

#operadora {
    margin-top: 40px;
}

.botao {
    width: 70px;
    padding: 3px 7px;
    background: #87cefa;
    color: #fff;
    border: 1px solid #87cefa;
    margin-top: -10px;
}

.itensEconomy {
    float: left;
    margin-right: 70px;
    margin-top: -40px;
}

    .itensEconomy tr td {
        font-size: 12px;
    }

.detailsOrder, .tableEconomy {
    margin-left: -20px;
}

#operatorSelected {
    margin-top: 80px;
}

.selectmesano {
    width: 110px;
    color: #666;
    font-family: Segoe UI Light;
}

#filtrar {
    padding: 3px 7px;
    margin-top: 1px;
    margin-left: 70px;
}

#search {
    padding: 3px 7px;
    margin-top: 1px;
    margin-left: 0px;
}



#filtrardesativados {
    padding: 3px 7px;
    margin-top: 1px;
    margin-left: 70px;
}

#filtrargroup {
    padding: 3px 7px;
    margin-top: 1px;
    margin-left: 70px;
}

#erro {
    font-size: 11px;
    display: inline;
    width: 100%;
    z-index: 9999;
}

#trackLicense {
    padding: 10px;
    color: #666;
    width: auto;
}

    #trackLicense legend {
        width: auto;
        margin-bottom: 0;
    }

#tiposLicencas {
    margin-left: 26px;
    background: #fff;
}

#infoContract {
    margin-top: 20px;
    background: #fff;
    padding: 10px;
}

#aceito {
    margin-top: -3px;
}

input.contract {
    margin-right: 30px;
}

#tiposLicencas table {
    padding: 5px 0;
}

    #tiposLicencas table tr th {
        padding: 3px 10px;
    }

.licens {
    padding: 3px 10px;
}

    .licens td {
        padding: 3px 10px;
    }

#createUserPermission {
    padding: 10px;
}

.pp {
    line-height: 0.8em;
}

#createUserPermission tr th {
    float: left;
    margin-top: 3px;
    padding: 0 5px;
    font-weight: normal;
}

iframe {
    width: 100%;
    height: 100%;
    overflow-y: hidden;
    border: none;
    margin-top: -10px;
}

.dashboard {
    padding: 10px;
    margin-top: 10px;
}

.informations {
    font-size: 12px;
    width: 100%;
    padding: 5px 10px;
}

    .informations tr th {
        text-align: left;
        padding: 10px 0;
    }

    .informations tr td {
        border-bottom: 1px solid #c8c8c8;
    }

.operad {
    width: 48%;
}

.message {
    width: 45%;
}

.legenda {
    width: 100%;
    border-bottom: 1px solid #87cefa;
    font-size: 12px;
    padding-bottom: 2px;
}

    .legenda img {
        margin-left: 60px;
    }

#downloadApp {
    float: left;
    display: inline;
}

    #downloadApp h2 {
        float: left;
    }

    #downloadApp a {
        float: left;
        margin-left: 10px;
    }

        #downloadApp a span {
            position: relative;
            top: 22px;
            left: 7px;
            width: auto;
        }

    #downloadApp img {
        float: left;
        margin-left: 5px;
        margin-top: 10px;
    }

.help {
    position: relative;
    top: 13px;
    left: 4px;
    width: 17px;
    margin: 0;
}

#integrationPartial p {
    width: 40%;
}

.filInte {
    float: left;
    margin-right: 15px;
}

    .filInte label {
        float: left;
        margin-right: 5px;
    }

    .filInte input {
        float: left;
    }

#filtrarOrders {
    margin: -5px 0 0 15px;
}

#tableIntegrationCompost {
    margin-top: 10px;
    padding: 5px;
    color: #666;
}

    #tableIntegrationCompost tr {
        padding: 5px;
    }

        #tableIntegrationCompost tr th {
            padding: 5px;
        }

        #tableIntegrationCompost tr td {
            padding: 5px;
        }

#generateIntegration {
    float: right;
}

.icon {
    margin-top: 30px;
}

a {
    color: #0088cc;
    text-decoration: none;
}
/*--------Menu Deslizante para relatorios------------*/
#jsddm {
    margin-top: -8px;
    padding: 0;
    float: right;
    color: #fff;
}

    #jsddm li {
        float: left;
        list-style: none;
        padding: 10px 0 10px 10px;
        color: #fff;
    }

        #jsddm li a {
            display: block;
            text-decoration: none;
            white-space: nowrap;
            max-height: 80px;
        }

            #jsddm li a img {
                max-width: 80px;
                max-height: 80px;
            }

        #jsddm li ul.subMenu {
            margin: 0;
            position: absolute;
            visibility: hidden;
            font-size: 12px;
            max-width: 120px;
        }

.subMenu {
    background: #87cefa !important;
}


#jsddm li ul.subMenu li {
    float: none;
    display: inline;
    padding: 0 8px;
}

    #jsddm li ul.subMenu li a {
        max-width: 120px;
        color: #ffffff;
        padding: 8px 8px 0 8px;
        height: 18px;
        font-weight: bold;
    }

#jsddm li ul li a:hover {
    text-decoration: #ffffff;
    background-color: #ffffff;
    color: #87CEFA;
}

/*Portal*/
#jsddm2 {
    margin-top: 20px;
    padding: 0;
    float: right;
    color: #fff;
}

    #jsddm2 li {
        float: left;
        list-style: none;
        padding: 10px 0 10px 0;
    }

        #jsddm2 li a {
            display: block;
            text-decoration: none;
            white-space: nowrap;
            max-height: 80px;
        }

            #jsddm2 li a img {
                max-width: 80px;
                max-height: 80px;
            }

        #jsddm2 li ul.subMenu2 {
            margin: 0;
            position: absolute;
            visibility: hidden;
            font-size: 10px;
        }

ul#rotaUl.subMenu2 {
    background: #87cefa !important;
    position: relative;
    z-index: 999999999;
}


#jsddm2 li ul.subMenu2 li {
    float: none;
    display: inline;
    padding: 0 5px;
}

    #jsddm2 li ul.subMenu2 li a {
        width: 74px;
        color: #ffffff;
        margin-bottom: -4px;
        padding: 0 3px;
    }

#jsddm2 li ul li a:hover {
    text-decoration: #ffffff;
}




/*-------------Mascara negra--------------*/
#mask {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 9000;
    background-color: #000;
    display: none;
}

#boxes .window {
    position: fixed;
    left: 20%;
    top: 50px;
    display: none;
    z-index: 9999;
    padding: 20px;
}

#boxes #dialog {
    width: 60%;
    padding: 10px;
    background-color: #ffffff;
}

#dialog a {
    font-size: 16px;
}

#dialog img {
    width: 100%;
}

@media print {
    #menu2 {
        visibility: hidden;
    }

    #cabecalho img {
        width: 77%;
    }

    #cabecalho span {
        position: absolute;
        float: right;
        z-index: 9999;
        margin-left: 25px;
    }

        #cabecalho span a {
            display: none;
        }

    #filial {
        position: absolute;
        right: 95px;
    }

    #titulo {
        width: 100%;
    }

    #todoContrato {
        margin-top: -110px;
    }
}

.radio {
    float: left;
    display: block;
    width: auto;
}

    .radio a {
        float: right;
        margin: 0 5px 0 10px;
        text-decoration: none;
    }

        .radio a img {
            width: 15px;
        }

.ajuda a {
    float: right;
    margin: 12px 5px 0 10px;
    text-decoration: none;
}

    .ajuda a img {
        width: 15px;
    }

.colorTableHover:hover {
    background: #87cefa;
}

.ReadOnly {
    background: #87cefa;
    color: #FFF;
}

.roxo {
    background: #D45CD4;
    color: #fff;
}

.h2 {
    font-size: 22px;
    margin-top: 45px;
}

.layout {
    font-family: 'SEGOEUIL' !important;
    color: #666;
}

/*Grafico*/
.chart {
    font-family: "Oswald", sans-serif;
    margin: 0 auto;
    width: 200px;
    height: 200px;
    position: relative;
    margin-top: 20px;
}

.doughnutSummary {
    position: absolute;
    top: 50%;
    left: 50%;
    color: #666;
    text-align: center;
    text-shadow: 0 -1px 0 #ddd;
    cursor: default;
}

.doughnutSummaryTitle {
    position: absolute;
    top: 50%;
    width: 100%;
    margin-top: -38%;
    font-size: 12px;
    letter-spacing: .01em;
}

.doughnutSummaryTitleValue {
    margin: 10px 0 0 -25px;
    width: 200%;
    font-size: 16px;
}

.doughnutSummaryNumber {
    position: absolute;
    top: 20%;
    width: 100%;
    margin-left: -6px;
    margin-top: 85%;
    font-size: 30px;
    text-align: center;
}

.chart path:hover {
    opacity: .65;
}

/*Colorir linhas tabela*/
.tables tr:hover {
    background: #daf0fa;
    cursor: pointer;
}

#OperadoraOrders, #CreatedOn, #BranchPeriodId {
    width: 320px;
}

#alert_placeholder {
    position: absolute;
    margin: 0;
}

/* --------------->Notificações<----------------*/
#notify {
    float: right;
    display: block;
    cursor: pointer;
    position: fixed;
    right: 25px;
    width: 50px;
    height: 56px;
    margin-top: -18px;
    background: url("../Image/Portal/Notify.png") no-repeat;
    z-index: 99999;
}


#configusuario {
    float: right;
    display: block;
    cursor: pointer;
    position: fixed;
    right: -12px;
    width: 50px;
    height: 50px;
    margin-top: -20px;
    background: url("../Image/Portal/security.png") no-repeat;
    z-index: 99999;
  
 
}

.notif p {
    margin: 5px 0 0 5px;
    padding-bottom: 5px;
    cursor: default;
}




#circulo {
    width: 13px;
    height: 13px;
    background: #ff941a;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    position: relative;
    float: right;
    left: -25px;
    font-size: 12px;
    color: #fff;
}


#circulo2 {
    width: 13px;
    height: 13px;
    background: #ff941a;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    position: relative;
    float: right;
    left: -23px;
    font-size: 12px;
    color: #fff;
}





    #circulo p {
        margin-top: -3px;
        margin-left: 3px;
    }


        #circulo2 p {
        margin-top: -3px;
        margin-left: 3px;
    }

#notificacoes {
    width: 300px;
    position: absolute;
    top: 28px;
    right: 30px;
    background: #ffffff;
}




#listusuario {
    width: 172px;
    position: absolute;
    top: 28px;
    right: 30px;
    background: #ffffff;
    
}

    #notificacoes ul {
        width: 100%;
        margin: 0;
        padding: 0;
        overflow-y: scroll;
        max-height: 200px;
        border: 2px solid #87cefa;
       
    }


        #listusuario ul {
        width: 100%;
        margin: 0;
        padding: 0;
     
        max-height: 200px;
        border: 2px solid #87cefa;
       
         
    }

    #notificacoes li {
        width: 100%;
        list-style: none;
        border-bottom: 2px solid #87cefa;
        font-size: 11px;
        color: #666;
        margin-top: 7px;
        
    }


        #listusuario li {
        width: 100%;
        list-style: none;
        border-bottom: 2px solid #87cefa;
        font-size: 11px;
        color: #666;
        margin-top: 7px;
        height: 30px;

    }


        #listusuario p {
           margin: 1px 5px;
        }


        #notificacoes li img {
            margin: 15px 5px;
        }

#listusuario li img {
    margin: 9px 5px;
}

    #notificacoes ul li a {
        position: relative;
        padding: 12px 0;
        text-decoration: none;
        font-size: 11px;
        color: #666;
        z-index: 9;
        display: block;
        margin-top: -6px;
    }


        #listusuario ul li a {
        position: relative;
        padding: 10px 0;
     
        font-size: 11px;
        color: #666;
        z-index: 9;
        display: block;
        margin-top: -6px;
    }

        #notificacoes ul li a:link {
            width: 100%;
        }

             #listusuario ul li a:link {
            width: 100%;
        }


    #notificacoes span {
        white-space: nowrap;
       
    }

        #listusuario span {
        white-space: nowrap;
    }

.naoLido {
    background: #a6ff00;
}

#btExcluirSelecionados, #btExcluirOrderItemsSelecionados {
    font-size: 10px;
    height: 20px;
    padding: 0;
    margin: 0;
    text-align: center;
    background: #87cefa;
    color: #fff;
    border: 1px solid #87cefa;
}

.check {
    width: 100px;
}

    .check input[type=checkbox] {
        width: 100px;
    }


.title {
    font-size: 18px;
    line-height: 1em;
    color: #666;
    font-weight: 500;
}

#OperatorId {
    width: auto;
}

#loginSenha {
    float: right;
    margin-top: -5px;
}

#LoginOperator, #PasswordOperator {
    min-height: 25px;
    margin-top: 5px;
}

#cadastrarOperadora {
    min-height: 20px;
    padding: 0 5px;
    margin-top: -6px;
}

.btRoute {
    width: auto;
    background: #87cefa;
    border: none;
    color: #fff;
    padding: 4px 10px;
    margin-top: 21px;
}

.verRota {
    width: 35%;
}

#Identifier {
    width: 220px;
}

#Name, #HomeAddress, #BranchAddressId, #Address {
    width: 35%;
}

.newOrder {
    margin: 0;
}

.newOrder tr th {
    position: relative;
    top: 5px;
}