@import url(//fonts.googleapis.com/css?family=Roboto:400,700);
/*
 * Base structure
 */

html { height: 100% }

body {
  font-family: "Roboto", sans-serif;
  font-size: 16px;
  padding: 50px 0 70px 0; 
}

.container { width: 100% }

a,
.navbar-inverse a.navbar-brand,
.btn-link { color: #00CCCC }

.dropdown-menu>.active>a, 
.dropdown-menu>.active>a:hover, 
.dropdown-menu>.active>a:focus { background: #00CCCC }

a:hover,
a:focus,
a:active,
.btn-link:hover,
.btn-link:focus,
.btn-link:active { color: #00CCCC }

/* HEADER ############################ */

.navbar-brand { 
  border-right: 1px solid rgba(255,255,255,0.1);
  font-weight: 700 }

.navbar-inverse .navbar-nav > li > a,
.navbar-inverse .navbar-nav > li.active > a {
  font-size: 87.5%;
  color: rgba(255,255,255,0.8);
}

.navbar-inverse .navbar-nav>.open>a, 
.navbar-inverse .navbar-nav>.open>a:hover, 
.navbar-inverse .navbar-nav>.open>a:focus {
  background-color: rgba(0,0,0,0.2);
}

li a.link-notifications {
  font-size: 120%;
  background: rgba(255,255,255,0.1);
}

li a.link-notifications .badge {
  position: relative;
  top: -5px;
  background: #00CCCC;
  padding: 1px 3px 5px 3px;
  border-radius: 3px;
  font-size: 70%;
  box-shadow: 1px 1px 2px rgba(0,0,0,0.8)
}

.popover-content {
  font-size: 80%;
}

.dd-notifications.scroll {
  overflow: auto;
  z-index: 0;
  padding: 0;
  width: 400px;
  max-height: 450px;
}

ul.notification-group li.notification-group-item,
.dd-notifications ul li.notification-group-item {
  position: relative;
  border-radius: 0 !important;
  border-left: 0;
  border-right: 0;
  padding: 0
}

ul.notification-group li.notification-group-item.notification-noread,
.dd-notifications ul li.notification-group-item.notification-noread {
  background: #F5EDED;
}

ul.notification-group li a,
.dd-notifications ul li a {
  display: block;
  color: #999;
  text-decoration: none;
  padding: 10px 64px 10px 44px;
}

ul.notification-group a .notification-description,
.dd-notifications a .notification-description {
  display: inline-block;
  font-size: 87.5%;
}

ul.notification-group a strong,
.dd-notifications a strong {
  color: #000;
}

ul.notification-group a img,
.dd-notifications a img {
  position: absolute;
  top: 10px;
  left: 10px;
}

ul.notification-group a .notification-date,
.dd-notifications a .notification-date {
  width: 55px;
  position: absolute;
  top: 10px;
  right: 10px;
  font-size: 65%;
  color: #CCC;
}

/* BODY ################################ */
.pageheader {
  border-bottom: 1px solid #DDD;
  margin: 0 0 20px 0;
  padding: 10px 0;
  min-width: auto;
  background-color: #F6F6F6;
}

/*.pageheader .btn-add { 
  z-index: 1000;
  width: 80px;
  height: 80px;
  font-size: 180%;
  border-radius: 100%;
  text-align: center;
  position: fixed;
  bottom: 50%; margin-bottom: -40px;
  right: 50px }*/

.pageheader .btn-success { margin-left: 10px }

.pageheader .form-control { 
  position: relative;
  font-size: 90% }

.breadcrumb { 
  font-size: 87.5%;
  margin: 7px 0 0 0;
  padding: 0 }



/* FILTER ################################ */

.bar-filter {
  margin-top: -20px;
  padding: 10px 0;
}

.bar-filter .btn-delete-selected {
  display: none
}

.bar-filter .btn-default {
  border-width: 0;
}

.bar-filter .btn-group-paging .btn-default {
  border-width: 1px;
}

.bar-filter .filter-selected {
  /*background: rgba(0,0,0,0.1);
  border-radius: 3px;
  padding: 0 5px;*/
  font-weight: 900;
  text-decoration: underline;
}


/* LOGIN ############################ */
body.login {
  background: #111 url(img/bglogin.png);
  height: 100%
}

body.login .brand {
  height: 50px;
  margin-bottom: 30px;
}

.form-login {
  max-width: 400px;
  padding: 50px 60px;
  border-radius: 40px;
  background: #EEE;
  margin: 0 auto }

.form-login h1 { 
  color: #00CCCC;
  margin: 0 0 10px;
  font-size: 150% }

.form-login p { 
  margin-bottom: 20px;
  color: #666 }

.form-login .form-control { 
  height: 50px;
  font-size: 130%;
  border: 3px solid #DDD;
  margin-bottom: 15px;
  box-shadow: inset 3px 3px 5px rgba(0,0,0,0.1);
  border-radius: 50px }

.form-login .form-control:focus,  
.form-login .form-control:active { 
  border-color: #00CCCC;
}

.form-group-password {
  position: relative;
}

.form-login .link-remember {
  font-size: 180%;
  position: absolute;
  top: 8px;
  right: 20px;
}

.form-login .btn-lg { 
  height: 50px;
  border-radius: 50px }

.form-login input.user-remember { margin-bottom: 10px }

body.login .dev {
  font-size: 11px;
  padding: 10px;
  color: rgba(255,255,255,0.8);
}









 /* TABLE GROUP/LIST 
 ##################################### */

.table>thead>tr>th {
  border-top: 1px solid #DDD !important;
  border-bottom: 3px solid #DDD;
  vertical-align: middle;
  font-size: 70%;
  text-transform: uppercase;
  color: #BBB }

.table>tbody>tr>td { 
  vertical-align: middle;
  white-space: nowrap }

.modal td { white-space: normal }

.home td { white-space: normal }

table tr td input[type=checkbox] { 
  visibility: hidden;
  cursor: pointer }

table tr:hover td input[type=checkbox] { 
  visibility: visible }

table tr td input[type=checkbox]:checked { 
  visibility: visible; }

.td-dropdown .dropdown > a { color: #333 !important }

.td-dropdown .dropdown-menu li a {
  padding: 3px 10px;
  font-size: 87.5%;
  color: #666 !important }

.group tr td { font-size: 80% }

.group .category { font-size: 75% }

.group .category .glyphicon { 
  font-size: 90%;
  margin-left: 2px;
  position: relative;
  top: 1px }

.group .td-name a { font-size: 110% }

.group tr.unread .td-name a { font-weight: 700 }

.group .td-endtime,
.group .td-date,
.group .category { color: #999 }

.group tr.finalizado td { 
  background: #F6F6F6;
  color: #AAA }

.group tr.finalizado td a { color: #999 }

.group .progress { 
  height: 15px;
  border-radius: 10px;
  margin: 2px 0 0 0 }

.group .progress .progress-bar { 
  min-width: 25px;
  line-height: 140%;
  font-size: 10px }

.group .td-user img {
  height: 24px;
  width: 24px;
  object-fit: cover }

.group .td-status strong {
  background: #CCC;
  display: inline-block;
  padding: 2px 10px;
  border-radius: 50px }

.group .td-status .text-danger {
  background: #FF0000;
  color: #FFF }

.group .td-status .text-success {
  background: #00CC00;
  color: #FFF }



 /* FORMS ############################ */

.form-group label {
  font-size: 80%;
  text-transform: uppercase;
  color: #666;
}

.form-group .link-add {
  position: relative;
  top: 3px;
  float: right;
  font-size: 80%
}




 /* MODAL ############################ */

.modal-header { 
  border-bottom: 2px solid #BBB;
  background-color: #CCC !important }

.modal-body { background-color: #EEE }

.modal-footer { 
  margin:0;
  background-color: #222 }





/* TAB-PANEL ############################ */

.tab-pane { 
  background: #FFF;
  border-left: 0;
  border-right: 0;
  border-bottom: 0;
  padding: 20px 0 0 0 }

/*.modal-body .tab-pane { margin: 0 -20px }*/
.modal-body .tab-pane .tab-pane { margin: 0 }

.tab-pane .list-group { margin-top: 15px }

.tab-pane .list-group .date { 
  font-size: 10px;
  color: #999 }




/* HEADLINES
##################################### */
h4 { font-weight: 800 }


/* TASK DETAIL 
##################################### */
.task-breadcrumb {
  font-size: 87.5%;
  margin-bottom: 5px;
  color: #999 }

.task-breadcrumb .glyphicon { 
  position: relative;
  font-size: 87.5%;
  color: #CCC;
  top: 2px }

h1.task-name { 
  font-size: 200%;
  letter-spacing: -1px;
  padding: 0;
  line-height: 120%;
  margin: 0 0 20px 0 }

h1.task-name .task-id { color: #999 }

.task-description { 
  line-height: 140%;
  padding: 10px 0 20px 0 }

.task-info-group {
  font-size: 87.5%;
  padding: 20px;
  margin: -20px -15px 0 0;
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f6f6f6+0,ffffff+100 */
  background: rgb(246,246,246); /* Old browsers */
  background: -moz-linear-gradient(top, rgba(246,246,246,1) 0%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top, rgba(246,246,246,1) 0%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, rgba(246,246,246,1) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f6f6', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */ }

.task-info-group .task-info-item {
  padding: 10px 0;
  width: 100%;
  display: table;
  border-top: 1px solid #EEE }

.task-info-group .task-info-label { 
  margin-bottom: 10px;
  font-weight: 700 }

.task-info-group .task-info-item .task-info-label {
  margin: 0;
  display: table-cell;
  width: 140px }

.task-info-group .task-info-item .task-info-data { display: table-cell }

.task-info-group .task-info-item .progress { 
  position: relative;
  margin: 0 }

.task-info-group .task-info-item .progress .progress-bar { float: none }

.task-info-group .btn,
.task-info-group .btn-group { margin-bottom: 20px }

.task-info-group .btn-group .btn { margin-bottom: 0 }


/* COMMENTS
##################################### */

.comment-editor { margin-top: 10px }

#commentsView .btn { margin-top: 10px }

#commentsView .log,
#commentsView .data { 
  font-size: 75%;
  color: #999 }

#commentsView .comment { 
  color: #999;
  background: rgba(0,0,0,0.05) }

#commentsView .comment .text {
  border-top: 1px solid #DDD; 
  padding: 10px 100px 0 0;
  margin: 10px 0 30px 50px }

#commentsView .comment .reply {
  color: #999;
  background: rgba(0,0,0,0.05);
  padding: 10px;
  border-radius: 7px;
  margin: 10px 0 0 50px }

#commentsView .reply-editor { margin: 10px 0 0 50px }
#commentsView .reply-editor .btn { margin-top: 5px }

.comment.comment-recent:first-child .reply.comment-recent,
.comment.comment-recent:first-child { 
  color: #000 !important;
  background: #FFF !important }

.text {
  position: relative }

.comment .btn-reply,
.comment .btn-remove,
.comment .btn-group {
  position: absolute;
  right: 0; top: -40px; 
  visibility: hidden;
}  

.comment:hover .btn-reply,
.comment:hover .btn-remove,
.comment:hover .btn-group {
  visibility: visible;
}

/* ########################### */

.list-group-item a.glyphicon-remove-circle { 
  text-decoration:none;
  color: #CC0000;
  display: none }

.list-group-item:hover a.glyphicon-remove-circle { display: inline-block }









/* FOOTER ########################### */

.navbar-fixed-bottom {
  background: #EEE;
  line-height: 40px;
  font-size: 80%
}


.btn-primary {
  border-color: #00CCCC;
  background-color: #00CCCC;
}

.btn-primary:hover {
  border-color: #A22620;
  background-color: #A22620;
}

.btn-primary:active,
.btn-primary:focus {
  border-color: #00CCCC;
  background-color: #00CCCC;
}


.btn-border {
  border: 2px solid #00CCCC;
  background: none;
  color: #00CCCC }

.btn-border:hover,
.btn-border:active,
.btn-border:focus {
  border: 2px solid #00CCCC;
  background: #00CCCC;
  color: #FFF }

/* AUTO COMPLETE*/
.ui-autocomplete {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 99999;
  float: left;
  display: none;
  min-width: 160px;
  _width: 160px;
  padding: 4px 0;
  margin: 2px 0 0 0;
  list-style: none;
  background-color: #ffffff;
  border-color: #ccc;
  border-color: rgba(0, 0, 0, 0.2);
  border-style: solid;
  border-width: 1px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  border-right-width: 2px;
  border-bottom-width: 2px;
}
.ui-helper-hidden-accessible{
    display:none;
}
.ui-menu {
    padding: 5px;
}
td.ui-state-highlight .ui-state-default{
  background: #ff3333 !important;
  box-shadow:none !important;
}

#loading {
    background:#cc3300;
    width: 100px;
    position: fixed;
    top: 0px;
    height: 20px;
    font-family: Arial;
    text-align: center;
    font-weight: bold;
    color: #fff;
    display: none;
    left: 45% }

input.error,
textarea.error,
select.error { background: #FFDFDF url(../img/ico-required.png) no-repeat right 13px }

.ui-datepicker {
    z-index: 9999 !important;
}

/*
 * FIX
 */

.btn-group > .tooltip + .btn,
.btn-group > .popover + .btn{
margin-left:-1px;
}

.btn-group > .btn:last-of-type {
    -webkit-border-top-right-radius: 4px !important;
    -moz-border-top-right-radius: 4px !important;
    border-top-right-radius: 4px !important;
    -webkit-border-bottom-right-radius: 4px !important;
    -moz-border-bottom-right-radius: 4px !important;
    border-bottom-right-radius: 4px !important;
}



/* SCROLL CUSTOM 
-------------------------------------------------- */

.scroll-track {
    width: 10px;
    position: absolute;
    background: rgba(0, 0, 0, 0);
    border-radius: 10px;
    -webkit-transition: background 250ms linear;
    transition: background 250ms linear }

.scroll-track:hover,
.scroll-track.dragging {
    background: #d9d9d9; /* Browsers without rgba support */
    background: rgba(0, 0, 0, 0.15) }

.scroll-handle {
    width: 7px;
    right: 0;
    background: #999;
    background: rgba(0, 0, 0, 0.4);
    border-radius: 7px;
    -webkit-transition: width 250ms;
    transition: width 250ms }

.scroll-track:hover .scroll-handle,
.scroll-track.dragging .scroll-handle { width: 10px }


.categories ul {
  border: 0;
  padding-left: 0 }


.categories ul:first-child { 
  background: #EEE;
  padding: 30px;
  border-radius: 5px  }


.categories ul:first-child > li { background: url(img/bg-item-cat1.png) no-repeat left -15px; }

.categories ul li {
  border: 0;
  overflow: none;
  line-height: 130%;
  padding: 10px 0 0 45px;
  background: url(img/bg-item-cat.png) no-repeat left -15px;
}

.categories ul li ul { margin-left: -25px }

.categories ul li a,
.categories ul li .item:hover .buttons { display: inline-block }

.categories ul li .item .buttons { 
  margin-left: 20px;
  position: absolute;
  display: none }




.catalogs ul {
  border: 0;
  padding-left: 0 }


.catalogs ul:first-child { 
  background: #EEE;
  padding: 30px;
  border-radius: 5px  }


.catalogs ul:first-child > li { background: url(img/bg-item-cat1.png) no-repeat left -15px; }

.catalogs ul li {
  border: 0;
  overflow: none;
  line-height: 130%;
  padding: 10px 0 0 45px;
  background: url(img/bg-item-cat.png) no-repeat left -15px;
}

.catalogs ul li ul { margin-left: -25px }

.catalogs ul li a,
.catalogs ul li .item:hover .buttons { display: inline-block }

.catalogs ul li .item .buttons { 
  margin-left: 20px;
  position: absolute;
  display: none }

/* GROUP ITEM 
//////////////////////////////////////////////////////////////////////////////////////////*/
.group-item { 
  padding: 15px 0;
  position: relative }

.group .group-item .item-img {
  position: absolute;
  left: 0; 
  top: 15px 
}

.group .group-item .item-title { 
  margin-bottom: 5px;
  font-weight: 900;
  font-size: 120%;
  line-height: 120%
}

.group .group-item .item-summary {
  line-height: 120%;
}

@media(min-width: 768px){

  .group .row > div { margin-bottom: 20px }

  .group .row > div:nth-last-child(1),
  .group .row > div:nth-last-child(2) { margin-bottom: 0 }

  .group-item { padding-left: 150px }

  .group .item-img img { 
    width: 135px; 
    height: 105px;
    object-fit: cover }

}

@media(max-width: 767px){

  .group .row > div { 
    min-height: 80px;
    margin-bottom: 30px }

  .group .row > div:last-child { margin-bottom: 0 }

  .group .group-item { padding-left: 95px }

  .group .group-item .item-img img { 
    width: 80px;
    height: 80px;
    object-fit: cover }

}

@media(max-width: 479px){

  .group .group-item .item-summary,
  .group .group-item a.link-more { display: none }

}


/* NEWS GROUP 
//////////////////////////////////////////////////////////////////////////////////////////*/

.news .wrapper { 
  margin: 0 -15px;
  padding: 50px 0 }

.news .container,
.news-group .container { width: 1000px }

.news-group .group-item { margin-bottom: 40px }

.news-group .item-title { 
  font-size: 160% !important;
  margin-bottom: 10px }

.news-group .item-date { 
  color: #999;
  font-size: 75% }

.news-group .item-summary { font-size: 80% }

.news-detail .detail-img,
.overlay .detail-img {
  background: #FFF;
  margin-bottom: 40px !important; 
  border: 1px solid #CCC;
  padding: 20px }

.news-detail .detail-img img,
.overlay .detail-img img { margin: 0 auto }

.news-detail .detail-text  img { max-width: 100% }

.inner .news-group { background: #EEE }



/* NEWS DETAIL 
//////////////////////////////////////////////////////////////////////////////////////////*/
.news-detail .news-date {
  color: #999;
  margin-bottom: 25px }

.news-detail ul.news-thumb-group { 
  font-size: 0;
  padding: 0  }

.news-detail ul.news-thumb-group li.news-thumb-item { 
  width: 25%;
  display: inline-block;
  padding: 0 }

.news-detail ul.news-thumb-group li.news-thumb-item img {
  width: 100%;
  height: 80px;
  object-fit: cover }

.news-detail .news-img-principal { margin-bottom: 15px }

@media(min-width: 768px){
  .news-detail .news-img { margin-bottom: 10px }
}

@media(max-width: 767px){
  .news-detail .news-img { margin: 0 -15px 25px -15px }
}

@media(min-width: 768px){
    .pesquisa-dialog .modal-dialog {
        width: 70%;
    }
}

@media(max-width: 767px){
  .pesquisa-dialog .modal-dialog {
        width: 98%;
    }
}

body.modal-open, .modal-open .navbar-fixed-top, .modal-open .navbar-fixed-bottom {
    margin-right: 0;
}

.modal {
    overflow-y: auto;
}

.truncate {
    width: 98%;
    /* Responsável pelo efeito de texto limitado */
    text-overflow:ellipsis;
    white-space:nowrap;
    overflow:hidden;
}