body {
  font-family: 'Open Sans', sans-serif!important;
}

.font-padrao-serif {
  font-family: sans-serif!important;
}

.font-padrao-open  {
  font-family: 'Open Sans' !important;
}

.font-w-none {
  font-weight: unset !important;
}

.font
/* TEXTOS - ESTILOS PADRÃO */

    .hh0 {
      font-size: 50pt;
      font-weight: 700;
    }

    .hh1 { /* normalmente combinado com alturalinha6 - Tamanho de maior destaque, uso indicado para poucas palavras. Aplicado no nome do recurso na aba SOBRE, em Ficha do recurso. */
      font-size: 18pt;
      font-weight: 700;
    }

    .hh2 { /* normalmente combinado com alturalinha1 - Segundo maior tamanho, também pode ser usado para obter destaque. Aplicado no nome do recurso das abas em Ficha do recurso, com exceção da aba Sobre.*/
      font-size: 16pt;
      font-weight: 700;
    }

    .hh3 { /* normalmente combinado com alturalinha3 - Tamanho do texto nos rótulos "nome do recurso" e "tecnologia", além do nome "Ficha do Recurso". */
      font-size: 13pt;
      font-weight: 700;
    }

    .hh4 { /* normalmente combinado com alturalinha2 (nos texto dos botões e subtítulos em geral (Ficha do recurso, POP, por exemplo) e alturalinha5 para os textos dos modais */
      font-size: 12pt!important;
      font-weight: 600!important;
    }

    .hh5 {  /* normalmente combinado com alturalinha4 - Tamanho de texto padrão, usado nos campos de preenchimento da pop, caminho do recurso (cabeçalho), por exemplo. */
      font-size: 12pt;
      font-weight: 400;
    }


    .ti-g{
      font-size: 3vw;
    }

    .alturalinha1 {
      line-height: 15px!important;
    }

    .alturalinha2 {
      line-height: 16px!important;
    }

    .alturalinha3{
      line-height: 20px;
    }

    .alturalinha4{
      line-height: 24px;
    }

    .alturalinha5{
      line-height: 26px;
    }

    .alturalinha6{
      line-height: 35px !important;
    }

    .alturalinha7 {
      line-height: 40px;
    }

    .alturalinha8 { /* usado na tela de login */
      line-height: 70px;      
    }
    

/* BOTÕES PADRÃO */

  /* Bt padrão */
    .btn-padrao {
      color: #ffffff !important;
      background-color: #3C7087 !important;
      border-bottom: 5px solid #2F586A !important;
    }
    .btn-padrao:hover {
      color: #ffffff !important;
      background-color: #448FAC !important;
    }
    
    /* .btn-padrao:focus, .btn-padrao.focus {
      color: #ffffff;
      background-color: #51AACC;
      border-bottom: 5px solid #2F586A!important;
    } */
    .btn-padrao.disabled, .btn-padrao:disabled {
      color: #ffffff !important;
      background-color: #3C7087 !important;
    }


    .btn-vermelho {
      color: #ffffff !important;
      background-color: #e1105b !important;
      line-height: 0.8!important;
      border-bottom: 5px solid #c80e53 !important;
      height: 26px!important;
    }
    .btn-vermelho:hover {
      color: #ffffff !important;
      background-color: #e2296e !important;
    }
    /* .btn-padrao:focus, .btn-padrao.focus {
      color: #ffffff;
      background-color: #51AACC;
      border-bottom: 5px solid #2F586A!important;
    } */
    .btn-vermelho.disabled, .btn-vermelho:disabled {
      color: #ffffff !important;
      background-color: #e1105b !important;
      border-color: 1px solid white !important;
    }

    /*desabilita links*/
    .link-disabled {
    color: currentColor !important;
    cursor: not-allowed !important;
    opacity: 0.5 !important;
    text-decoration: none !important;
    pointer-events: none !important;
    }
    
    .edit{
      cursor: pointer !important;
    }


    /* .btn-padrao:not(:disabled):not(.disabled):active, .btn-padrao:not(:disabled):not(.disabled).active,
    .show > .btn-padrao.dropdown-toggle {
      color: #ffffff;
      background-color: #51AACC;
    } */
    /* .btn-padrao:not(:disabled):not(.disabled):active:focus, .btn-padrao:not(:disabled):not(.disabled).active:focus,
    .show > .btn-padrao.dropdown-toggle:focus {
      background-color: #3C7087;
      border-bottom: 5px solid #2F586A!important;
    } */

    /*.btn-padrao:active {
      margin-bottom: unset;
    }*/

  /* Glow dos botões que ficam ativos (em PLANEJAMENTO e RECURSOS) */
    .btglow:active {
      box-shadow: 0px 0px 2px /*tamanho*/ 3px /*força*/ #66FFFF!important;
    }

    /*planejamento botoes itens*/
    .item {
      flex: 1;
      margin: 2px;
      /* padding: 0 10px; */
  }

  .ct{
        min-width: 116px;
  }

  /* Bt fechar */
    .close {
      float: right;
      color: #ffffff!important;
      font-size: 0.9rem !important;
      opacity: 1!important;
      padding: 0px!important;
      margin: 0!important;
      height: 18px;
      width: 18px;
      border-radius: 5px;
      background-color: #E96272!important;
    }
    .close:hover {
      color: #ffffff!important;
      background-color: #E96272;
      text-decoration: none;
    }
    .close:not(:disabled):not(.disabled):hover, .close:not(:disabled):not(.disabled):focus {
      opacity: 1!important;
    }


/* TABELA */

    /*.table-sm {
      table-layout: auto;
      width: 100%;
      border-collapse: collapse;
      background-color: #3D738B;
      color: #ffffff;
    }
    thead th {
      vertical-align: bottom;
      border-left: 2px solid #EBEBEB;
      border-right: 2px solid #EBEBEB;
      border-bottom: 2px solid #EBEBEB;
      line-height: 22px;
      text-align: center;
      background-color: #36667B;
    }
    tbody td {
      text-align: center;
      line-height: 22px;          
      border-left: 2px solid #EBEBEB;
      border-right: 2px solid #EBEBEB;
    }*/


/* TABELA PADRÃO */

    .table-sm {
      table-layout: auto;
      width: 100%;
      border-collapse: collapse;
      border-top-left-radius: 5px!important;
      border-top-right-radius: 5px!important; 
      border-bottom-left-radius: 5px!important;
      border-bottom-right-radius: 5px!important;
      border-bottom: 0!important;
      border-top: 0!important;
    }
    thead th {
      box-sizing: content-box!important;
      line-height: 22px;
      text-align: left;
      color: #ffffff;
      cursor: pointer;
      border-bottom: 0!important;
      border-top: 0!important;
    }
    tbody td {
      text-align: left;
      line-height: 22px;
      border-bottom: 0!important;
      border-top: 0!important;
      color: #333333;
      border-left: 0!important;
      border-right: 0!important;
    }
    /* .table-bordered th, .table-bordered td {
      border-width: 1px !important;
      border-color: #ffffff!important;
    } */



  /* ÍCONE SETINHA "SORTING"*/

    table.dataTable thead th {
        position: relative;
        background-image: none !important;
    }
      
    table.dataTable thead th.sorting:after,
    table.dataTable thead th.sorting_asc:after,
    table.dataTable thead th.sorting_desc:after {
        position: absolute;
        top: 5px;
        right: 8px;
        display: block;
        font-family: FontAwesome;
    }
    table.dataTable thead th.sorting:after {
        content: "\f0dc";
        color: #ddd;
        /*font-size: 0.8em;*/
        /*padding-top: 0.12em;*/
    }
    table.dataTable thead th.sorting_asc:after {
        content: "\f0de";
    }
    table.dataTable thead th.sorting_desc:after {
        content: "\f0dd";
    }

    table.dataTable thead th.sorting:before {
       display: none;
    }
    table.dataTable thead th.sorting_asc:before {
        display: none;
    }
    table.dataTable thead th.sorting_desc:before {
        display: none;
    }


    /*alinhamente search e pagination*/

    #planosprojetos_wrapper input[type="search"], #rel_wrapper input[type="search"], .dt-buttons, #planosprojetos_wrapper label{
      width: 100%;
      display: none;
    }
   


    #planosprojetos_wrapper div:nth-child(1)[class="row"]{
      /*margin-top: -52px;*/
      margin-top: -12px;
    }

    #planosprojetos_wrapper div:nth-child(2)[class="row"]{
      /*margin-top: 10px;*/
    }

    #planosprojetos_wrapper div:nth-child(3)[class="row"]{
      /*position: absolute;*/
      position: relative;
      bottom: 10px;
      right: 15px;
    }

    #planosprojetos_wrapper th:nth-child(1)
    {
      border-radius: 5px 0px 0px 0px;
    }


    #planosprojetos_wrapper th:last-child 
    {
      border-radius: 0px 5px 0px 0px;
    }


/* ÍCONE SETINHA "SORTING" - anterior - em funcionamento*/

  /*    table.dataTable thead th {
        background-image: none !important;
    }

    table.dataTable thead th.sorting:after,
    table.dataTable thead th.sorting_asc:after,
    table.dataTable thead th.sorting_desc:after {
        position: absolute;
        top: 5px;
        right: 8px;
        display: block;
        font-family: FontAwesome;
    }
    table.dataTable thead th.sorting:after {
        content: "\f0dc";
        color: #ffffff;
    }

    table.dataTable thead th.sorting:before {
        display: none;
    }
    
    table.dataTable thead th.sorting_asc:before {
        display: none;
    }

    table.dataTable thead th.sorting_asc:after {
        content: "\f0de";
        color: #ffffff;
    }
    table.dataTable thead th.sorting_desc:after {
        content: "\f0dd";
        color: #ffffff;
    }
    table.dataTable thead th.sorting_desc:before {
        display: none;
        color: #ffffff;
    }*/




/* PAGINAÇÃO */

    .page-item {
      padding-right: 5px!important;
      padding-left: 5px!important;
    }
    .page-link {
       background-color: #ffffff!important;
       /*border-color: #3C7087!important;*/
       color: #3C7087!important;
       line-height: 15px!important;
       border-radius: 5px!important;
    }
    .page-link:focus {
       background-color: #3C7087!important;
       border-color: #3C7087!important;
    }
    .page-link:active {
       background-color: #3C7087!important;
       border-color: #3C7087!important;
       color: #ffffff!important;
    }
    .page-item.active .page-link {
      border-color: #3C7087!important;
      background-color: #3C7087!important;
      color: #ffffff!important;
    }
    a.page-link:focus {
      color: #ffffff!important;
    }





/* MODAL */
  /*modal content - onde estão todos os demais componentes: header, body e footer */              
    .modal-content {
      border-color: #3C7087!important;
      border-width: 5px!important;
      background-color: #3C7087;
    }
  
      .modal-header {
        padding: 0px!important;
        height: 30px;
        border-bottom: 0!important;
      }
      .modal-body {
        background-color: #EBEBEB;
        border-radius: 3px 3px 0 0;
        padding: 20px!important;
      }
      .modal-footer {
        background-color: #EBEBEB;
        border-radius: 0 0 3px 3px;
      }

  /* container flex e seus itens (usado no modal Criar novo, por exemplo) */
    .containerflex {
      display: flex;
      flex-wrap: wrap;
      justify-content: left;
      overflow: auto;
}
    }
    .item {
      flex: 1;
      margin: 2px;
      padding: 0 10px;
    }
    .item2 {
      margin: 2px;
      padding: 0 10px;
    }

    .item3 {
      margin-right: 4px;
      /*padding: 0 10px;*/
    }


/* CORES */

    /* Texto */
      .cor1 { /* cinza escuro - usado para texto comum, normalmente em conjunto com hh6 (antigo .textonormal) */
        color: #333333;
      }
      .cor2 { /* azul - usado para a cor dos títulos da pop, normalmente em conjunto com hh4 */
        color: #4785A0;
      }
      .cor3 { /* branco - usado para a cor dos textos das abas em Ficha do recurso */
        color: #ffffff;
      }
      .cor4 {
        color: #3C7087;
      }
      .cor6 {
        color: #EBEBEB;
      }

      /* FORMATO */
  
      .cxaimpressao {
        border:1px solid #cccccc!important;
        /*border:1px solid #999999!important;*/
        /*border: 1px solid #cccccc; border-radius: 5px;*/
        /*background-color: #ffffff;*/
      }
      
      /* Background */
      .corback1 {
        background-color: #194058 !important;
      }

      .corback2 { /* cor azul */
        background-color: #4785A0 !important;
      }
      .corback3 {  /* cor branco */
        background-color: #ffffff !important;
      }
      .corback4 {
        background-color: #3C7087!important;
      }
      .corback5 {  /* cor cinza claro */
        background-color: #D8D8D8;
      }
      .corback6 { /* cor cinza [quase branco]*/
        background-color: #EBEBEB !important;
      }
      .corback7 { /* cor amarelo claro */
        background-color: #FFDD91 !important;
      }
      .corback8 { /* aba fala professor - cor roxo */
        background-color: #D184B5 !important;
      }
      .corback9 { /* aba fala professor - cor vermelha */
        background-color: #E95058 !important;
      }
      .corback10 { /* aba fala professor - cor verde */
        background-color: #2CB98C !important;
      }
      .corback11 { /* aba fala professor - cor roxo escuro */
        background-color: #AD6D95 !important;
      }
      .corback12 { /* aba fala professor - cor vermelho escuro */
        background-color: #CB454C !important;
      }
      .corback13 { /* aba fala professor - cor verde escuro */
        background-color: #269E77 !important;
      }
      .corback14 { /* cor amarelo, status iniciado do roteiro de estudos */
        background-color: #F0A63C !important;
      }

    /* Background */
     /*.corback1 {
        background-color: #194058 !important;
      }
      .corback2 {
        background-color: #4785A0 !important;
      }
      .corback3 {
        background-color: #ffffff;
      }
      .corback4 {
        background-color: #3C7087!important;
      }
      .corback5 {
        background-color: #D8D8D8!important;
      }
      .corback6 {
        background-color: #EBEBEB !important;
      }
      .corback7 {
        background-color: #FFDD91 !important;
      }*/

      /*.corback8 {  /* cor status - vermelho 
        background-color: #ff6971 !important;
      }*/
      /*.corback9 { /* cor status 
        background-color: #e4a733 !important;
      }
      .corback10 { /* cor status 
        background-color: #73aa1d !important;
      }*/

      .border1{ /* cor status - vermelho */
        border-color: #bf454c !important;
      }

      .border2{ /* cor status - amarelo */
        border-color: #a97f31 !important;
      }
      .border3{ /* cor status - verde */
        border-color: #5e8423 !important;
      }
      .border4{ /* cor status - azul */
        border-color: #034f71 !important
      }

      .alt-125
      {
        height: 125px;
      }

      .alt-115
      {
        height: 115px;
      }
      
     /* #448FAC
      #51AACC
      #2f586a*/


/* CAMPO INPUT/FORMULÁRIO */

    .form-control { /* usado em Ficha do recurso, na aba Sobre, no campo de input Comentários */
      padding-bottom: 5px !important;
    }

    /*FEEDBACKS - cxinhas pretas*/

  /* cxafeedback */
  .cxafeedback {
    padding: 1em;
    position: absolute; 
    top: 180px; 
    left: 50%;
    margin-left: -137.5px;
    background-color: black;
    opacity: 70%;
    border-radius: 5px;
    z-index: 4;
  }
  .feedbacktxt {
    font-size: 13pt; font-weight: 600;
    color: #ffffff;   
    text-align: center;
  }


/* TAMANHOS */
    .tamanho1 { /* usado em Ficha do recurso, para definir o tamanho máximo das thumbs na aba Materiais relacionados */
      max-width: 220px;
    }
    .tamanho2 { /* usado em Ficha do recurso, para definir o tamanho máximo da thumb na aba Sobre */
      height: 100px;
    }
    .tamanho3 { /* usado em Ficha do recurso, para definir a altura do espaço do conteúdo para todas as abas. */ 
      height: 350px;
    }
    .tamanho4 {
      max-width: 100px!important;
    }
    
    .linhadivisoria {
      border-bottom: 1px solid #CACACA;
    }

    .hide {
      display: none;
    }


    /* MENUS */
  .dropdown-submenu {
    position: relative;
  }
  .dropdown-submenu>.dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -6px;
    margin-left: -1px;
    -webkit-border-radius: 0 6px 6px 6px;
    -moz-border-radius: 0 6px 6px;
    border-radius: 0 6px 6px 6px;
  }
  .dropdown-submenu:hover>.dropdown-menu {
    display: block;
  }
  .dropdown-submenu>a:after {
    display: block;
    content: " ";
    float: right;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    border-left-color: #ccc;
    margin-top: 5px;
    margin-right: -10px;
  }
  .dropdown-submenu:hover>a:after {
    border-left-color: #4785A0!important;
  }
  .dropdown-submenu.pull-left {
    float: none;
  }
  .dropdown-submenu.pull-left>.dropdown-menu {
    left: -100%;
    margin-left: 10px;
    -webkit-border-radius: 6px 0 6px 6px;
    -moz-border-radius: 6px 0 6px 6px;
    border-radius: 6px 0 6px 6px;
  }
  .dropdown-item a{
    text-decoration: none;
    color: #333333;
    width: 100%;
  }
  .dropdown-item a:hover{
    text-decoration: none;
    color: #333333;
  }
  .dropdown-item a:focus{
    color: #ffffff;
    width: 100%;
  }
  .dropdown-item {
    display: block;
    width: 100%;
    padding: 6 20 6 20!important; /*top right bottom left */
    clear: both;
    font-weight: 400;
    color: #333333;
    text-align: inherit;
    white-space: nowrap;
    background-color: transparent;
    border: 0;
    line-height: 20px!important;
  }
  .dropdown-item:focus {
    color: #16181b;
    text-decoration: none;
    background-color: #4785A0!important;
  }
  .dropdown-item:hover {
    background-color: #f8f9fa!important;  
  }
  .dropdown-item:active {
    background-color: #4785A0!important;
    color: #ffffff!important;
  }

  /*max width*/
.max-w220{
  max-width: 260px;
}

.max-w260{
  max-width: 260px;
}

.max-w30{
  height: 30px;
}

/****campos inputs sem borda do plano de aula****/
.semborda{
  background: transparent;
  border: none;
  outline: none;
}

textarea[class="semborda"]{
  height: 86px;
}


/****zera margens ficha do recurso e plano de aula****/
.margemzero {
  margin-right: 0px!important;
  margin-left: 0px!important;
  padding: 0px!important;
}

/* IMAGEM NO BACKGROUND (TELA DE LOGIN) */

  .imagembk {
    background-image: url('/img/tela-login.png'); 
    background-repeat: no-repeat; 
    background-size: cover; 
    background-position: center center;
    position: absolute;
    height: 100%;
    width: 100%;
  }


  /* thumbs recurso plano */
.pthumb{
  /*width: 180px;*/
  /* height: 40px; */
  min-width: 100px;
    max-width: 180px;
}
.thumbs-nomerec{
  /*top: 120px;*/
  height: 25px;
  text-align: center;
  width: 100%;
  /*min-width: 168px;*/
  color: white;
  background-color: #3c7087;
  border-radius: 0 0 4px 4px;
  white-space: nowrap;
  /*overflow: hidden;
  text-overflow: ellipsis; 
  font-size:1vw;*/
}

.aling-v-h{
  align-items: center;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
}

.imgdiversos{  
  border: 1px solid #ddd; /* Gray border */
  border-radius: 4px;  /* Rounded border */
  padding: 5px; /* Some padding */
  width: 150px; /* Set a small width */
}

.bordabranca{
  border: 2px solid #eae9e9; /* Gray border */
  border-radius: 4px;  /* Rounded border */
  padding: 5px; /* Some padding */
}

/*autocomplete*/
.auto {
  height: 250px;
  overflow-y: auto;
}

.overflow-auto{
  overflow: auto;
}

.aba_relatorio .ativo {
      background-color: #448fa3!important;
    }

.bootstrap-select .dropdown-menu{
  z-index: 2000;
}

.delete-btn {  
  background-color: #f44336 !important;
}

.salvar-btn {
  background-color: #4caf50 !important;
}

#planosprojetos thead {
  color: green;
  background-color: #3C7087 !important;
}

.even {
  background-color: unset !important;
}
table.dataTable thead  .sorting_asc, table.dataTable thead  .sorting_desc {
  background-image: unset !important;
}

#planosprojetos th {
  text-align: center;
}

.card-l {
  background-color: #F4931F;
  color: #ffffff;
}

.card-am {
  background-color: #FFD068;
  color: #ffffff;
}

.card-v {
  background-color: #6CEBA7;
  color: #ffffff;
}

.card-m {
  background-color: #E06E75;
  color: #ffffff;
}

.ativo-btn {
  background-color: #448fa3!important;
}