/*<style>
*/
/******************************************************************
* FONTS
******************************************************************/
@font-face {
  font-family : 'Open Sans';
  font-style  : normal;
  font-weight : 300;
  src         : local('Open Sans Light'), local('OpenSans-Light'), url(/Common/Fonts/OpenSans-Light.woff) format('woff');
}
@font-face {
  font-family : 'Open Sans';
  font-style  : normal;
  font-weight : 400;
  src         : local('Open Sans'), local('OpenSans'), url(/Common/Fonts/OpenSans-Regular.woff) format('woff');
}
@font-face {
  font-family : 'Open Sans';
  font-style  : normal;
  font-weight : 600;
  src         : local('Open Sans Semibold'), local('OpenSans-Semibold'), url(/Common/Fonts/OpenSans-Semibold.woff) format('woff');
}
@font-face {
  font-family : 'Open Sans';
  font-style  : normal;
  font-weight : 700;
  src         : local('Open Sans Bold'), local('OpenSans-Bold'), url(/Common/Fonts/OpenSans-Bold.woff) format('woff');
}
@font-face {
  font-family : 'Open Sans';
  font-style  : normal;
  font-weight : 800;
  src         : local('Open Sans Extrabold'), local('OpenSans-Extrabold'), url(/Common/Fonts/OpenSans-ExtraBold.woff) format('woff');
}

html {
    margin       : 0px;
    padding      : 0px;
    font-family  : arial, sans-serif;
}

body {
    margin           : 0px;
    padding          : 47px 0px 0px 0px;
    background-color : #f0f0f0;
}

a img{ border:0; }

video {
    background-color : #000;
}

body > i.page-top {
    position : fixed;
    bottom   :     20px;
    right    :    20px;
}

body.full-hd {
	transform: scale(2);
	transform-origin: left top;

   	-moz-transform: scale(2);
    -moz-transform-origin: left top;

    width: calc(100% / 2);
	height: calc(100% / 2);
}

/*body.full-hd div.widgets{
    width: calc( 100% - 60px);
    max-width: calc( 100% - 60px);
}*/
/*body.quiosque {
    zoom: 200%;
    transform: scale(2);
    -moz-transform: scale(2);
}

body.quiosque  div.widget-xbig{
    width: 100% !important;
}*/


@media screen and (min-width: 1500px) and (min-width: 20cm){

	/*body {
		 background-color : red;
	}*/
	/*body table.main tr{
	   	line-height 		 : 50px;
	}
	body table.main tr td{
	   	font-size 		 : 15pt !important;
	}
	body table.main tr td > *{
	   	font-size 		 : 15pt !important;
	}

	body table.body tr{
	   	line-height 		 : 50px;
	}
	body table.body tr td{
	   	font-size 		 : 15pt !important;
	}
	body table.body tr td > *{
	   	font-size 		 : 15pt !important;
	}

	body table.agenda tr{
	   	line-height 		 : 50px;
	}
	body table.agenda tr td{
	   	font-size 		 : 15pt !important;
	}
	body table.agenda tr td > *{
	   	font-size 		 : 15pt !important;
	}

	body table.agenda tr td.content > div{
	   	width 		 : 40px !important;
	   	height 		 : 40px !important;
	}

	body table.agenda tr td.lateral{
	   	width 		 : 300px !important;
	   	min-width 		 : 300px !important;
	}*/

	/*body div.widget.widget-xbig{
	   	width: 		 95% !important;
	   	max-width:  95% !important;
	}*/
}

.details {
	font-size :	8pt;
	color     : #696969;
}
.details_ultimo_valor {
	font-size :	7pt;
	color     : #696969;
}

div {
    font-size : 13px;
}
table tr.hidden {
    display: none;
}

form table.default tr.hidden {
    display: none !important;
}

table tr td {
    font-size : 13px;
}
table tr th {
    font-size : 13px;
}

table.main tr.header th.right  {
    text-align: right;
}

table tr.header th.right > span {
    float: right;
}

div.top_bar {
    position:         fixed;
    left:             0px;
    top:              0px;
    width:            100%;
    height:           46px;
    overflow:         hidden;
    background-color: white;
    opacity:          0.9;
    border-bottom:    1px solid #e9e9e9;
    z-index:          10000;
}
body.aguasdoporto div.top_bar {
    background-color: #0f2f7f;
    color: #fff;
}
body div.logo-bottom-right {
    display:none;
}
body.aguasdoporto {
    padding-bottom: 80px;
}
body.aguasdoporto div.logo-bottom-right {
    display:block;
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 120px;
    height: 60px;
    background-image: url(/Common/Images/navia_logo_horizontal_preto.png);
    background-size: contain;
    background-repeat: no-repeat;
    z-index: 10000;
}

div.top_bar div.logo{
	background-image: url('/Common/Images/menu_logo.png');
	background-size: contain;
	background-position: center center;
	background-repeat: no-repeat;
	height: 80%;
	margin-left:23px;
	margin-top:0px;
}
body.aguasdoporto div.top_bar div.logo{
	background-image: url('/Common/Images/Cliente/Logos/aguasdoporto.svg');
	background-fill: #fff;
	color: #fff;
}
div.right {
	float: right;
}

*.text-right {
	text-align: right;
}

table.top_bar {
    height:             46px;
    width:              100%;
}

div#dvInfoNotificacoes {
	border: 		       1px solid #cccccc;
	background-color:      white;
	position: 		       fixed;
	z-index:		       10001;
	webkit-box-shadow: 	   rgba(102,102,102,0.3) 0 1px 4px;
	-moz-box-shadow:   	   rgba(102,102,102,0.3) 0 1px 4px;
	box-shadow: 		   rgba(102,102,102,0.3) 0 1px 4px;
	-webkit-border-radius: 3px;
	-moz-border-radius:    3px;
	border-radius:         3px;
	overflow:			   hidden;
}

div#dvInfoNotificacoes > div.header {
	position:relative;
	overflow:none;
	background-color:#dddddd;
	padding:2px;
	text-align:center;
	font-weight :bold;
}
div#dvInfoNotificacoes > div.option {
	position:relative;
	text-align:center;
	height:25px;
	font-size:11px;
	padding-top:10px;
	overflow:none;
	border-bottom:1px solid #dddddd;
}
div#dvInfoNotificacoes > div.option:hover {
	background-color:#f5f5f5;
}

table.menu_navia_right{
    font-size:13px;
    color:#333;
}

table.menu_navia_right tr td.menu_navia_right{
    color:#444;
    padding-left: 5px;
    padding-right: 5px;
}

body.aguasdoporto table.menu_navia_right tr td.menu_navia_right {
    color: #ffffff;
    font-size: 12px;
}

table.menu_navia_right tr td.menu_navia_right:hover{
    color           : #30a9e7;
    cursor          : pointer;
}
table.menu_navia_right tr td.menu_navia_right > i{
    color:#444;
    font-size:19px;
}
body.aguasdoporto table.menu_navia_right tr td.menu_navia_right > i{
    color:#fff;
}

body table.menu_navia_right tr td.menu_navia_right:hover > i{
    color           : #30a9e7;
}

div.menu_navia_right{
    position:relative;
    height:30px;
}
div.menu_navia_right > i.menu_navia_right_icon_info{
    font-size:18px;
    margin-top:6px;
    color:#444
}
body.aguasdoporto div.menu_navia_right > i.menu_navia_right_icon_info{
    color:#fff;
}

div.menu_navia_right > div.menu_navia_right_info{
    position:absolute;
    top:1px;
    left:1px;
    background-color:red;
    color:white;
    font-weight :bold;
    padding:0px 3px;
    font-size:7pt;
    display:none;
}
body div.menu_navia_right:hover > i.menu_navia_right_icon_info{
    color           : #30a9e7;
    cursor          : pointer;
}


div.page_title {
    font-family :      "Open Sans";
    font-weight :      200;
    font-size:        16px;
    color:            #777;
    position:         relative;
    left:             0px;
    top:              4px;
    padding:          15px 70px;
}

div.table{
    display: table;
}

div > div.row{
    display: table-row;
    margin-top:         2px;
    margin-left:        2px;
    font-size:          11px;
    box-shadow:         0px 1px 0px 0px rgba(0, 0, 0, 0.04);
    border-left:        1px solid #efefef;
    border-right:       1px solid #efefef;
    border-bottom:      1px solid #e2e2e2;
    text-align:         left;
    box-flex: 1;
    width: auto;
    min-width: 300px;
}

div > div.row > div.cell{
    display: table-cell;
    margin-top:         2px;
    margin-left:        2px;
    background-color:   #fff;
    font-size:          11px;
    box-shadow:         0px 1px 0px 0px rgba(0, 0, 0, 0.04);
    border-left:        1px solid #efefef;
    border-right:       1px solid #efefef;
    border-bottom:      1px solid #e2e2e2;
    padding:            20px;
    text-align:         left;
    width: auto;
    min-width: 300px;
    vertical-align:top;
}

div > div.row > div.cell-trasparent{
    display: table-cell;
    margin-top:         2px;
    margin-left:        2px;
    font-size:          11px;
    text-align:         left;
    width: auto;
    vertical-align:top;
}

div > div.row > div.cell-trasparent > div.content{
    background-color:   #fff;
    font-size:          11px;
    box-shadow:         0px 1px 0px 0px rgba(0, 0, 0, 0.04);
    border-left:        1px solid #efefef;
    border-right:       1px solid #efefef;
    border-bottom:      1px solid #e2e2e2;
    padding:            20px;
    text-align:         left;
    width: auto;
    vertical-align:top;
}

div.box{
    display: inline-flex;    box-orient: vertical;
    box-pack: center;
    box-align: center;
    margin:        10px 30px  30px 30px;
}
@media screen and (max-width: 20cm){
	div.box{
	    display: block;
	    box-orient: vertical;
	    box-pack: center;
	    box-align: center;
	    margin:        10px 10px  10px 10px;
	    width: calc(100% - 40px);
	}
}

div.box > div.block_graphics{
    display: inline-block;
    margin-top:         2px;
    margin-left:        2px;
    background-color:   #fff;
    font-size:          11px;
    box-shadow:         0px 1px 0px 0px rgba(0, 0, 0, 0.04);
    border-left:        1px solid #efefef;
    border-right:       1px solid #efefef;
    border-bottom:      1px solid #e2e2e2;
    padding:            20px;
    text-align:         left;
    box-flex: 1;
    width: auto;
    min-width: 300px;
}

div.box > div.block{
        margin-top:         2px;
    margin-left:        2px;
    background-color:   #fff;
    font-size:          11px;
    box-shadow:         0px 1px 0px 0px rgba(0, 0, 0, 0.04);
    border-left:        1px solid #efefef;
    border-right:       1px solid #efefef;
    border-bottom:      1px solid #e2e2e2;
    padding:            20px;
    text-align:         left;
    box-flex: 1;
    width: auto;
    min-width: 300px;
}
@media screen and (max-width: 20cm){
	div.box > div.block{
	    display: block;
	    margin-top:         2px;
	    margin-left:        2px;
	    background-color:   #fff;
	    font-size:          11px;
	    box-shadow:         0px 1px 0px 0px rgba(0, 0, 0, 0.04);
	    border-left:        1px solid #efefef;
	    border-right:       1px solid #efefef;
	    border-bottom:      1px solid #e2e2e2;
	    padding:            20px;
	    text-align:         left;
	     width: calc(100% - 20px) !important;
	    min-width: 200px;
	    max-width: calc(100% - 20px) !important;
	}
}

div.below{
    display:			block;
    margin-top:         2px;
    margin-left:        2px;
    background-color:   #fff;
    font-size:          11px;
    box-shadow:         0px 1px 0px 0px rgba(0, 0, 0, 0.04);
    border-left:        1px solid #efefef;
    border-right:       1px solid #efefef;
    border-bottom:      1px solid #e2e2e2;
    padding:            20px;
    text-align:         left;
    box-flex: 1;
    width: auto;
    min-width: 300px;
}

div.box div.filter{
        margin-top:         2px;
    margin-left:        2px;
    background-color:   #fff;
    font-size:          11px;
    box-shadow:         0px 1px 0px 0px rgba(0, 0, 0, 0.04);
    border-left:        1px solid #efefef;
    border-right:       1px solid #efefef;
    border-bottom:      1px solid #e2e2e2;
    padding:            20px;
    text-align:         left;
    box-flex: 1;
    width: auto;
    min-width: 300px;
    max-width: 400px;
    -webkit-transition: 0.5s ;
    transition:  0.5s;
    overflow-x: hidden;
    }

@media screen and (max-width: 20cm){
	div.box div.filter{
	    display: block;
	    margin-top:         2px;
	    margin-left:        2px;
	    background-color:   #fff;
	    font-size:          11px;
	    box-shadow:         0px 1px 0px 0px rgba(0, 0, 0, 0.04);
	    border-left:        1px solid #efefef;
	    border-right:       1px solid #efefef;
	    border-bottom:      1px solid #e2e2e2;
	    padding:            20px;
	    text-align:         left;
	    width: calc(100% - 20px) !important;
	    min-width: 200px;
	    max-width: calc(100% - 20px) !important;
	    -webkit-transition: 0.5s ;
	    transition:  0.5s;
	    overflow-x: hidden;
	}
}

div.box div.filter select{
	max-width:390px;
}
div.box div.filter div.interval{;
	max-width:390px;
}
div.box div.filter input{
	max-width:390px;
}

div.box div.filter.min{
    max-width: 300px;
}

div.box div.filter.min select{
	max-width:290px;
}
div.box div.filter.min div.interval{;
	max-width:290px;
}
div.box div.filter.min input{
	max-width:290px;
}

div.box div.filter.collapsed{
    overflow-x: hidden;
    max-width: 25px;
    min-width: 25px;
    width: 25px;
}
div.box div.filter > div.content.collapsed{
    overflow-x: hidden;
    max-width: 25px;
    min-width: 25px;
    width: 25px;
}

@media screen and (max-width: 20cm){
	div.box div.filter.collapsed{
	    overflow-y: hidden;
    	max-height: 25px;
    	min-height: 25px;
    	height: 25px;
    	width: calc(100% - 20px) !important;
	    min-width: 200px;
	    max-width: calc(100% - 20px) !important;
	}
}

@media screen and (max-width: 20cm){
	div.box div.filter > i.fa-angle-right{
    	transform: rotate( 90deg );
	}
}
@media screen and (max-width: 20cm){
	div.box > div.filter > i.fa-angle-left{
    	transform: rotate( 90deg );
	}
}


div.box div.filter.vertical {
    display: block;
    margin-top:         2px;
    margin-left:        2px;
    background-color:   #fff;
    font-size:          11px;
    box-shadow:         0px 1px 0px 0px rgba(0, 0, 0, 0.04);
    border-left:        1px solid #efefef;
    border-right:       1px solid #efefef;
    border-bottom:      1px solid #e2e2e2;
    padding:            20px;
    text-align:         left;
    width: calc(100% - 20px) !important;
    min-width: 200px;
    max-width: calc(100% - 20px) !important;
    -webkit-transition: 0.5s ;
    transition:  0.5s;
    overflow-x: hidden;
}

div.box div.filter.vertical.collapsed{
    overflow-y: hidden;
    max-height: 25px;
    min-height: 25px;
    height: 25px;
    width: calc(100% - 20px) !important;
    min-width: 200px;
    max-width: calc(100% - 20px) !important;
}

div.box div.filter.vertical > i.fa-angle-right{
    transform: rotate( 90deg );
}

div.box > div.filter.vertical > i.fa-angle-left{
    transform: rotate( 90deg );
}



div.box div.filter.collapsed > *:not(i){
    visibility: hidden;
}
div.box div.filter > div.content.collapsed > *:not(i){
    visibility: hidden;
}

div.box > div.block ~ div.block{
    min-height: 200px;
}

div.block > div.filter{
	display: table-cell;
	border:0;
	border-right: 2px Solid #ccc;
	padding:0;
	padding-right:20px;
	transition:  0.5s;
	margin-right: 20px;
}
div.block > div.content{
	display: table-cell;
	padding-left:20px;
}
div.block > div.filter.collapsed{
    overflow-x: hidden;
    max-width: 25px;
    min-width: 25px;
    width: 25px;
}

div.block > div.filter select{
	max-width:390px;
}
div.block > div.filter div.interval{;
	max-width:390px;
}
div.block > div.filter input{
	max-width:390px;
}

div.block > div.filter.min{
    max-width: 300px;
}

div.block > div.filter.min select{
	max-width:290px;
}
div.block > div.filter.min div.interval{;
	max-width:290px;
}
div.block > div.filter.min input{
	max-width:290px;
}

div.block > div.filter.collapsed > *:not(i){
    visibility: hidden;
}


div.splitter{
    position: fixed;
    margin:        10px 30px 30px 30px;
    top:90px;
    bottom: 0px;
    left:0px;
    right:0px;
    display: inline-flex;
    box-orient: vertical;
    box-pack: center;
    box-align: center;

}
div.splitter > div.splitter-left {
    position    : absolute;
    top         : 0px;
    left        : 0px;
    bottom      : 0px;
    overflow    : auto;
    white-space : nowrap;
    padding     : 10px;

        margin-top:         2px;
    margin-left:        2px;
    background-color:   #fff;
    font-size:          11px;
    box-shadow:         0px 1px 0px 0px rgba(0, 0, 0, 0.04);
    border-left:        1px solid #efefef;
    border-right:       1px solid #efefef;
    border-bottom:      1px solid #e2e2e2;
    text-align:         left;
    width: 50%;}
div.splitter-right {
    padding:            10px;
}
div.splitter > div._splitter-right {
    position    : absolute;
    top         : 0px;
    bottom      : 0px;
    right       : 0px;
    margin      : 0px;
    padding     : 0px;
    overflow    : auto;
    border-left : 1px solid #e3e3e3;
    white-space : nowrap;


        margin-top:         2px;
    margin-left:        2px;
    background-color:   #fff;
    font-size:          11px;
    box-shadow:         0px 1px 0px 0px rgba(0, 0, 0, 0.04);
    border-left:        1px solid #efefef;
    border-right:       1px solid #efefef;
    border-bottom:      1px solid #e2e2e2;
    text-align:         left;
    width: 50%;}



div.widgets{
    display:            inline-block;
    margin:             10px 30px  30px 30px;
}
@media screen and (max-width: 20cm){
	div.widgets{
	    display: block;
	    box-orient: vertical;
	    box-pack: center;
	    box-align: center;
	    margin:  10px 10px  10px 10px;
	    width: calc(100% - 20px);
	    max-width: calc(100% - 20px);
	}
}

div.widget{
    float:              left;
    margin-top:         2px;
    margin-left:        2px;
    font-size:          11px;
    text-align:         left;
}

div.labelTitle {
	border-bottom-width : 1px;
	border-bottom-style : solid;
	border-bottom-color : #DADADA;
    color				: #555;
	font-size   		: 18px;
	font-weight 		: 200;
	font-family 		: "Open Sans";
	padding				: 0px 0px 10px 0px;
}
div.labelTitle.pop_over {
	border-bottom		: 1px dashed #DDD;
	padding				: 0px 0px 5px 0px;
	font-size   		: 12px;
	font-weight 		: 400;
	font-family 	 : "Open Sans";
}

div.subLabelTitle {
    color				: #555;
	font-size   		: 15px;
	font-weight 		: 200;
	font-family 		: "Open Sans";
	padding				: 0px 0px 10px 20px;
}

div.labelTitle.pop_over {
	margin-left			: 8pt ;
}

div.labelTitle2 {
	border-bottom-width : 1px;
	border-bottom-style : solid;
	border-bottom-color : #DADADA;
    color				: #555;
	font-size   		: 18px;
	font-weight 		: 200;
	font-family 		: "Open Sans";
	padding				: 0px 0px 10px 0px;

}

div.content div.labelTitle {
	border-bottom		: 1px dashed #DDD;
	padding				: 0px 0px 5px 0px;
	font-size   		: 12px;
	font-weight 		: 400;
	font-family 	 : "Open Sans";
}

div.labelMajorTitle {
  position		   : absolute;
  overflow		   : hidden;
  padding  		   : 25px 20px;
  border-bottom	   : 1px dashed #DDD;
  background-color : #f9f9f9;
  font-family	   : "Open Sans";
  font-size		   : 20px;
  font-weight	   : 300;
  text-align	   : center;
  color			   : #555;
}

div.block > div.labelMajorTitle {
  width	   : 100%;
  position : relative;
  top	   : -20px;
  left	   : -20px;
}

/******************************************************************
* TABLES
******************************************************************/
table tr td.table_loading{
    text-align      : center;
    color			: #ccc;
}
div.header_content {
	overflow        : hidden;
}
div.table_content{
	overflow-y        : auto;
	overflow-x        : hidden;
}

div.table_content.width{
	overflow-y        : auto;
	overflow-x        : auto;
}
div.header_content > table{
	margin-right	: 17px;
}

div.left_table{
	overflow        : hidden;
}
div.left_table > table.left_table{
	overflow        : hidden;
	margin-bottom	: 17px;
}

table.bodys{
	border-spacing: 0;
}

table.bodys tr td{
	vertical-align:top;
}

table.left_table tr td{
	overflow        : hidden;
}

table tr.header th {
	font-size       : 10px;
	padding         : 4px 5px 4px 8px;
	height          : 32px;
	border-bottom   : 1px solid #DADADA;
	overflow        : hidden;
    cursor          : auto;
    vertical-align  : middle;
    text-transform  : uppercase;
    position: relative;

/*
    padding-left    : 10px;
    height          : 25px;
    line-height     : 10px;
    color           : #4f4f4f;
    font-weight     : bold;
    white-space   : nowrap;
        text-align      : center;
*/
}

table tr.header th .unidade{
    text-transform  : initial;
}


table tr.noheader {
	display: none;
}
table tr.header th > div.header-buttons{
    position: absolute;
    display: inline-block;
    right: 0;
    top: 0;
    height: 100%;
}
table tr.header th > div.header-buttons > i{
    margin-top:10px;
}

table tr.header th > span{
    float           : left;
}
table tr.header th > i{
    float           : right;
}

table tr.header.pinned td {
    padding:    4px 5px;
    border-top: 1px solid #e5e5e5;
}
table tr.header.pinned th {
    padding:    4px 5px;
    border-top: 1px solid #e5e5e5;
    white-space:nowrap;
}

table tr.header th.criar{
    padding             : 0px 5px;
    cursor              : pointer;
    text-align          : center;
    background-color    : transparent;

}

table.main tr.header > th.disabled{
    color: #ccc !important;
    pointer-events: none;
}

table tr.header th > div.header-buttons i.criar{
    margin-top:0;
    padding			    : 13px;
    font-size			: 10px;
    cursor              : pointer;
    text-align          : center;
    background-color    : transparent;
    display: inline-block;
    float: right;

}
table tr.header th > div.header-buttons i.criar:hover{
     background-color: #cccccc;
}

table tr.header th.criar > span > i.fa{
    padding			: 10px;
}

table tr.header th.criar:hover{
    background-color: #cccccc;
}

table tr.header th.criar > span{
    float           : none;
}

table.main tr.header > th div.var-legend{
    height: 3px; 
    width:100%; 
    position: absolute; 
    bottom: 0;
}

table tr.header th.center{
    text-align          : center;
}
table tr.header th.center > span{
    float:none;
}

table tr#selected_row{
    background-color: #cccccc;
}

table tr#selected_row{
    background-color: #cccccc;
}

table.main tr td.sub_total{
    /*background-color: #cccccc; */
    font-weight      : bold;
    background-color : white;
    border-bottom    : 0px;
}

table tr td.total{
    background-color: #fffff;
    font-weight :		bold;
}

table tr td[rowspan]{
    vertical-align:top;
}


/**efeitos de selecao**/
table.selectable:not(.form-edit) tr:not(.no_selectable):hover td{
    background-color        : #e5f3fb;
    /*border-color : #70c0e7;*/
    border-top              : 1px solid #70c0e7;
    border-bottom           : 1px solid #70c0e7;
    cursor                  : pointer;
}
table.selectable:not(.form-edit) tr:not(.no_selectable):hover td:first-child{
    background-color        : #e5f3fb;
    /*border-left             : 1px solid #70c0e7;*/
}
table.selectable:not(.form-edit) tr:not(.no_selectable):hover td:last-child{
    background-color        : #e5f3fb;
    /*border-right            : 1px solid #70c0e7;*/
}

table.selectable:not(.form-edit) tr.selected:not(.no_selectable) td{
    background-color        : #e5f3fb;
}

table.selectable_td tr td.no_selectable{
    cursor                  : auto;
}
table.selectable_td tr td:not(.no_selectable):hover{
    background-color        : #e5f3fb !important;
    cursor                  : pointer;
}
table.selectable_td tr td:not(.no_selectable).selected{
    background-color        : #e5f3fb !important;
}

table.selectable_multi_td tr td:not(.no_selectable):hover{
    background-color        : #e5f3fb !important;
    cursor                  : pointer;
}
table.selectable_multi_td tr td:not(.no_selectable).selected{
    background-color        : #e5f3fb !important;
    vertical-align			: middle;
}
table.selectable_multi_td.icon tr td:not(.no_selectable).selected:after{
    content: url('/Common/Images/Tree/check.png');
    float: right;
}

table.cursor-pointer tr:not(.no_click):hover td:not(.no_click){
    cursor                  : pointer;
}

table.clickable tr:hover td:not(.no_click){
    background-color        : #e5f3fb;
    /*border-color : #70c0e7;*/
    border-top              : 1px solid #70c0e7;
    border-bottom           : 1px solid #70c0e7;
    cursor                  : pointer;
}

table tr.clickable:hover td:not(.no_click){
    background-color        : #e5f3fb;
    /*border-color : #70c0e7;*/
    border-top              : 1px solid #70c0e7;
    border-bottom           : 1px solid #70c0e7;
    cursor                  : pointer;
}

table.highlightable tr:hover td:not(.no_highlight){
    background-color        : #e5f3fb;
    /*border-color : #70c0e7;*/
    border-top              : 1px solid #70c0e7;
    border-bottom           : 1px solid #70c0e7;
    cursor                  : pointer;
}

table tr td.highlightable:hover{
    background-color        : #e5f3fb;
    border-top              : 1px solid #70c0e7;
    border-bottom           : 1px solid #70c0e7;
    cursor                  : pointer;
}
table tr td.numeric{
    white-space: nowrap;
    text-align: right;
}

table tr.unread{
    font-weight :      bold;
}

table tr.unread td.nobold{
    font-weight :      normal;
}

table tr td.clickable:hover{
    cursor                  : pointer;
}
form div.see-more{
	padding: 5px 120px;
}
form div.see-more.colapsed + div.labelTitle + table.form-section{
	display: none;
}
form div.see-more.colapsed + div.labelTitle {
	display: none;
}


table:not(.pop_over) tr td.labelTitle {
	border-bottom-width : 1px;
	border-bottom-style : solid;
	border-bottom-color : #dfdfdf;
    color				: #555;
	font-size   		: 18px;
	font-weight 		: 200;
	font-family 		: "Open Sans";
	padding				: 0px 0px 10px 0px;
}

table:not(.pop_over) tr td.see-more {
	border-bottom-width : 1px;
	border-bottom-style : solid;
	border-bottom-color : #dfdfdf;
    /*color				: #555;
	font-size   		: 18px;
	font-weight 		: 200;
	font-family 		: "Open Sans";*/
	padding				: 0px 0px 10px 0px;
}

table:not(.pop_over) tr td.labelMajorTitle {
    border      	 : 1px dashed #ddd;
  	background-color : #f9f9f9;
    color			 : #555;
	font-size   	 : 20px;
	font-weight 	 : 300;
	font-family 	 : "Open Sans";
	text-align	     : center;
	padding  		 : 25px 20px;
}

table.pop_over tr td.labelTitle {
	border-bottom		: 1px dashed #DDD;
	padding				: 0px 0px 5px 0px;
	font-size   		: 12px;
	font-weight 		: 400;
	font-family 	 : "Open Sans";
}

table.pop_over tr th.labelTitle {
	border-bottom		: 1px dashed #DDD;
	padding				: 0px 0px 5px 0px;
	font-size   		: 12px;
	font-weight 		: 400;
	font-family 	 : "Open Sans";
}

table.tblCalendarioAnual {
	padding-left:	0px;
	padding-right:	5px;
	padding-bottom:	5px;
	border-spacing: 5px;
}

table.tblCalendarioAnual tr > td {
	vertical-align: top;
}
table.tblCalendarioAnual tr > td div.feriado{
	padding: 5px;
}

table.tblCalendarioMensal {
	border-style:			solid;
	border-width:			1px;
	border-color:			#eaeaea;
	border-radius: 			5px;
	-moz-border-radius: 	5px;
	-webkit-border-radius: 	5px;
	-o-border-radius: 		5px;
	-moz-box-shadow: 		0px 0px 5px #000;
	-webkit-box-shadow: 	0px 0px 5px #000;
	box-shadow: 			0px 0px 5px #000;
	border-collapse:    	collapse;
}

table.tblCalendarioMensal .tblCalendarioMensalTop {
	background-color: #f4f5f6;
	padding-top:	  5px;
	padding-bottom:	  5px;
	text-align:		  center;
}

table.tblCalendarioMensal .tblCalendarioMensalDias {
	padding:	5px;
	text-align:	center;
}

table.tblCalendarioMensal tr > td {
	text-align:		center;
	border-style:	solid;
	border-width:	1px;
	border-color:	#eaeaea;
	width:			20px;
	height:			15px;
}

table.tblCalendarioMensal tr > td.tblCalendarioMensalContent[onclick] {
	cursor: pointer;
}
table.tblCalendarioMensal tr > td.tblCalendarioMensalContent[onclick]:hover {
	background-color: #3da0ea;
}

table.tblCalendarioHorizontal {
	border-collapse:  collapse;
}

table.tblCalendarioHorizontal tr.header {
	color: #002840;
}

table.tblCalendarioHorizontal tr.header td.header, table.tblCalendarioHorizontal tr.header th.header {
	border:				1px solid #d0d7e5;
	background-color:	#FEFEFE;
	text-align:			center;
}

table.tblCalendarioHorizontal tr.header td.header.fds, table.tblCalendarioHorizontal tr.header th.header.fds {
	background-color: #F8F8F8;
}

table.main.tblCalendarioHorizontal.left_table tr.header th.no_border {
	border:	1px solid transparent;
}

table.tblCalendarioHorizontal tr.content td.header, table.tblCalendarioHorizontal.left_table tr.content td {
	border:				1px solid #d0d7e5;
	background-color:	#F3F3F3;
	color: 				#002840;
}

table.tblCalendarioHorizontal tr.content td.content {
	border:				1px solid #d0d7e5;
	background-color:	#FEFEFE;
}

table.tblCalendarioHorizontal tr.content td.content.fds {
	background-color:	#F8F8F8;
}

i.icon_column {
    font-size       : 13px;
    opacity:0;    color           : #444;
    float           : right;
    margin-left     : 10px;
    cursor          : pointer;
}
i.icon_column:hover {
    opacity         :1;
}

table.navia-sortable tbody.ui-sortable tr td:first-child::before{
	content: "\f0dc";
	font-family: FontAwesome;
}
table.navia-sortable tbody.ui-sortable tr td:first-child{
	cursor: n-resize;
}

table tr.header th.sortable:hover i.icon_column {
    opacity         :1;
}
i.led {
	font-size: 7px;
	vertical-align: middle;
}

i.led.incompleta{
	color:#f6831e;
}
i.led.Vista{
	color:gray;
}
i.led.Validada{
	color:green;
}

i.icon_column_last_ordered {
    font-size       : 13px;
    font-weight     : bold;
    color           : #111;
    visibility      : visible;
    margin-left     : 10px;
    cursor          : pointer;
}
i.icon_column_filtered {
    font-size       : 13px;
    color           : red;
    visibility      : visible;
    margin-left     : 10px;
    cursor          : pointer;
}

table tr > th i.icon_column.active {
     visibility      : visible;
     opacity         : 1;
}
table tr > th i.icon_column.loading {
     visibility      : visible;
     opacity         : 1;
}

i.icon_clear_filtered {
    font-size       : 13px;
    color           : red;
    visibility      : visible;
    margin-left     : 10px;
    cursor          : pointer;
}
i.icon_clear_filter {
    font-size       : 13px;
    color           : red;
    visibility      : hidden;
    margin-left     : 10px;
    cursor          : pointer;
}

table tr th.criar > i.icon_clear_filter {
    display         : none;
}

.pinned {
    position        : fixed;
    z-index         : 100;
    top             : 50px;
    background-color: #fff;
}
table.loading{
    cursor: wait !important;
}
table.loading tr.header th{
    cursor: wait !important;
}
table.loading tr.header th *{
    cursor: wait !important;
}
table.main {
    border-collapse : collapse;
    line-height		: normal;
    /*display: table !important;*/
    /*line-height
    na página de parametrização de tarefas, a tabela tem uma célula
    em que quero por um conteudo principal e logo abaixo, com classe "details"
    quero outro texto. Apesar de estar a usar a table JS com class "main"
    as linhas estavam a ficar muito grandes, isto porque como a table está num form
    acaba por ficar dentro da "table" do form que é do tipo "default" e
    que tem um line-height de 24px que a tabela desta página herdava.
    Desta forma anula essa "herança"
    */
}
table.main.highlightable_td tr td[onclick]:hover{
    background-color        : #e5f3fb;
    cursor                  : pointer;
}
table.main.highlightable_td tr th[onclick]:hover{
    background-color        : #e5f3fb;
    cursor                  : pointer;
}
table.main tr > td.unwidth{
    width: none !important;
    max-width: none !important;
}

table.main.with_rownumber {
    counter-reset: line-number;
}
table.main.with_rownumber tr td:first-child:before {
    content:  counter(line-number)  ".";
    counter-increment: line-number;
    padding: 5px;
    color: '#ccc';
}

table tr.header th div.header-buttons i.fa.icon_clear_filtered{
    float:right;
}

table.main tr.header th {
    color          : black;
    font-weight    : 600;
    text-transform : uppercase;
    font-size      : 10px;
    border-bottom  : 1px solid #DADADA;
    height         : 32px;
    padding        : 0px 5px 2px 5px;
    text-align     : left
}

table.main tr.header th.criar {
    text-align: center;
}
table.main tr.header th.criar > span {
    float: none;
}

table.main tr.header td {
    padding       : 10px 5px 5px 8px;
    border-bottom : 1px solid #DADADA;
}

table.main tr.footer{
	position: absolute;
	height: 35px;
}
table.main tr.footer td{
	line-height: 28px;
}

table.main tr td {
    padding       : 4px 5px;
    border-bottom : 1px solid #E9E9E9;
    min-width     : 20px;
    text-overflow: ellipsis;
	overflow: hidden;
}

table.main tr {
    height : 35px;
    color  : black;
}

table.main tr.psa {
    background-color : #dddddd;
}

table.main.wraptext tr td {
    white-space: pre-line !important;
	vertical-align:top;
}

table.alternate-rows tr:nth-child(odd) {
    background-color : transparent;
}
table.alternate-rows tr:nth-child(even) {
    background-color : #F8F8F8;
}

table.main tr.odd {
    background-color : transparent;
}
table.main tr.even {
    background-color : #F8F8F8;
}

table.main tr.first_line_group {
    border-top : 2px Solid #000000;
}


table.grouping-rows tr.parent:not(.no-childs) > td:first-child:before {
    font-family: "FontAwesome";
    content: '\f0da';
    margin-right: 5px;
    color: #999;
    font-size: 20px;
}
table.grouping-rows tr.parent.no-childs > td:first-child:before {
    content: ' ';
    margin-right: 12px;
    color: #999;
    font-size: 20px;
}
table.grouping-rows tr.parent.no-childs > td:first-child:before {
    content: ' ';
    margin-right: 12px;
    color: #999;
    font-size: 20px;
}

table.grouping-rows.tree tr[data-tree_nivel="2"] > td:first-child:before {
    content: ' ';
    margin-right: 24px;
    color: #999;
    font-size: 20px;
}
table.grouping-rows.tree tr[data-tree_nivel="3"] > td:first-child:before {
    content: ' ';
    margin-right: 236px;
    color: #999;
    font-size: 20px;
}

table.grouping-rows tr.parent.expanded > td:first-child:before {
    content: '\f0d7';
}
table.grouping-rows tr.parent {
    background-color: #f3f3f3;
    cursor: pointer;
}
table.grouping-rows tr.child {
	display: none;
    margin-left:20px;
}
table.grouping-rows tr.child td:first-child {
    padding-left:20px;
}

table.mobile tr td > table{
    border:    1px Solid #ccc;
}
table.mobile tr td > table{
    border:    1px Solid #ccc;
}
table.mobile tr td > table tr td:first-child{
    text-align: right;
    font-weight: bold;
}
table.mobile tr td > table tr td{
    border:none;
}
table.mobile tr{
    height:    auto;
}

/*table.main tr td:hover{
	animation: right_to_left 4s linear infinite;
	-moz-animation: right_to_left 4s linear infinite;
	-webkit-animation: right_to_left 4s linear infinite;
	-ms-animation: right_to_left 4s linear infinite;
	-o-animation: right_to_left 4s linear infinite;
}

@keyframes right_to_left {
 	0% { text-indent:0px; }
 	100% { text-indent:-300px; }
}
@-moz-keyframes right_to_left {
 	0% { text-indent:0px; }
 	100% { text-indent:-300px; }
}
@-webkit-keyframes right_to_left {
 	0% { text-indent:0px; }
 	100% { text-indent:-300px; }
}
@-ms-keyframes right_to_left {
 	0% { text-indent:0px; }
 	100% { text-indent:-300px; }
}
 @-o-keyframes right_to_left {
 	0% { text-indent:0px; }
 	100% { text-indent:-300px; }
}*/


table.main tr td > i.fa.fa-bars {
    visibility       : hidden;
    font-size        : 11px;
	padding          : 3px 1px;
	border           : 1px solid rgb(196, 196, 196);
	color            : rgb(153, 153, 153);
	cursor           : pointer;
	margin-left      : 5px;
	background-color : rgb(255, 255, 255);
}

table.main tr:hover td > i.fa.fa-bars {
    visibility       : visible;
}

a {
    text-transform  : uppercase;
    color           : #136bcc;
    text-decoration : none;
    font-size       : 9px;
    cursor          : pointer;
}

a:visited {
    color           : #136bcc;
    text-decoration : none;
}

a:hover {
    color           : #136bcc;
    text-decoration : none;
}

button {
    font-family        : "Open Sans";
    font-size          : 9px;
    text-transform     : uppercase;
    padding            : 4px 12px;
    display            : inline-block;
    border             : 1px solid #c4c4c4;
    background-color   : #eee;
    color              : #777;
    cursor             : pointer;
    -webkit-appearance : button;
    margin-left        : 5px;
/*    max-height         : 20px;
    height             : 20px; */
}

button:disabled:not(.loading) {
    background-color : #bbbbbb !important;
    color            : #555 !important;
}
button:disabled {
    cursor           : auto;
}


button:active:enabled {
    background-color : #e5e5e5;
}
button.primary {
    border			 : 1px solid #3da0ea;
    background-color : #3da0ea;
    color			 : #ffffff;
}
body.aguasdoporto button.primary {
    border			 : 1px solid #0f2f7f;
    background-color : #0f2f7f !important;
    color			 : #ffffff;
}

button.primary:disabled:not(.loading) {
    border			 : 1px solid #85c1ed;
    background-color : #85c1ed;
    color			 : #fff;
    cursor           : auto;
    transition		 : 500ms;
}
button.primary:active:enabled {
    background-color : #368fd0;
}

input[type="text"].datepicker {
    width: 80px;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

input[type="button"] {
    font-family : 		   "Open Sans";
    font-size:             9px;
    text-transform: 	   uppercase;
    padding:               4px 12px;
    display:               inline-block;
    border:                1px solid #c4c4c4;
    background-color:      #eee;
    color:                 #777;
    cursor:                pointer;
    -webkit-appearance:    button;
    margin-left:           5px;
}
input[type="button"]:disabled {
    background-color:      #bbbbbb;
    color:                 #555;
}
input[type="button"]:active:enabled {
    background-color:      #e5e5e5;
}

input[type="button"].primary {
    border:                1px solid #3da0ea;
    background-color:      #3da0ea;
    color:                 #ffffff;
}
input[type="button"].primary:disabled {
	border:                1px solid #c4c4c4;
    background-color:      #bbbbbb;
    color:                 #555;
}
input[type="button"].primary:active:enabled {
    background-color:      #368fd0;
}
input[type="text"] {
    font-family : arial, sans-serif;
    font-size:   13px;
    border:      1px solid #CCC;
    height:      20px;
    padding:     3px;
}
input[type="search"], input[type="date"], input[type="time"]
	input[type="datetime-local"], input[type="number"], input[type="tel"], input[type="email"] {
    font-family : arial, sans-serif;
    font-size:   13px;
    border:      1px solid #CCC;
    height:      26px;
    line-height: 26px;
    padding:     3px;
}
input[type="text"]:disabled {
    border:      1px solid #efefef;
    color:       1px solid #efefef;
}

input[type="password"] {
    font-family : arial, sans-serif;
    font-size:   13px;
    border:      1px solid #CCC;
    height:      20px;
    padding:     3px;
}

input:invalid, select:invalid, textarea:invalid{
    border:      1px solid red;
    color:       red;
}

input.invalid, select.invalid, textarea.invalid{
    border:      1px solid red;
    color:      red;
}

textarea{
    font-family : arial, sans-serif;
    font-size:   13px;
    border:      1px solid #CCC;
    height:      20px;
    padding:     3px;
}

select {
    font-family :  arial, sans-serif;
    font-size:   13px;
    padding:     3px;
    border:      1px solid #ccc;
    height:      28px;
    background-color: white;
}


i.fa_circle {
	text-shadow        : 0 1px 0 rgba(0, 0, 0, 0.1);
	color              : #FFF;
	background         : #cccccc;
	padding            : 6px;
	text-align         : center;

	width              : 13px;
	height             : 13px;
	box-shadow         : 0 1px 1px rgba(0, 0, 0, 0.15);
	-webkit-box-shadow : 0 1px 1px rgba(0, 0, 0, 0.15);
	z-index            : 2;
	transition		   : 500ms;

	margin-left:10px;
	margin-bottom:10px;
	font-size:13px;
	color: #777;
	background:#fff;
}
i.fa_circle.selected {
	background         : #3da0ea !important;
    color         		: #fff !important;
}



div.block i.fa_circle {
	color              : #FFF;
	background         : #cccccc;
}
table.interface tr td.block i.fa_circle {
	color              : #FFF;
	background         : #cccccc;
}
table.interface tr td.filter i.fa_circle {
	color              : #FFF;
	background         : #cccccc;
}
div.filter i.fa_circle {
	color              : #FFF;
	background         : #cccccc;
}
div.content i.fa_circle {
	color              : #FFF;
	background         : #cccccc;
}

div.cell i.fa_circle {
	color              : #FFF;
	background         : #cccccc;
}


i.fa_circle:not(.no_clickable):hover {
    cursor             : pointer;
    background         : #3da0ea;
    color         		: #fff;
}
body.aguasdoporto i.fa_circle:not(.no_clickable):hover {
    background         : #0f2f7f;
    color         		: #fff;
}

i.fa_circle:not(.no_clickable):active {
    background         : #368fd0;
    transition         : 0ms;
    color         		: #fff;
}
i.fa_circle.selected {
    background         : #368fd0;
    transition         : 0ms;
    color         		: #fff;
}

i.fa.clickable:hover {
    cursor             : pointer;
    color         		: #3da0ea;
}

i.right{
    margin-left:8px;
    float: right;
}
i.left{
    float: left;
}

i.autohide{
	visibility: hidden;
}
i.autohide:hover{
	visibility: visible;
}
*:hover > i.autohide{
	visibility: visible;
}

i.fa_circle.primary {
    background 			: #3da0ea !important;
    color			 : white;
}
i.fa_circle.primary:active {
    color			 : #3da0ea;
}
i.button {
	font-size:15pt;
}
i.button.primary {
    color			 : #3da0ea;
}
i.fa.button {
	cursor: pointer;
}
i.fa.button:hover {
	color: #3da0ea;
}
span.fa_circle {
	text-shadow        : 0 1px 0 rgba(0, 0, 0, 0.1);
	color              : #FFF;
	background         : #cccccc;
	text-align         : center;
padding: 6px;
	width              : 13px;
	height             : 13px;
	max-width          : 13px;
	max-height         : 13px;
	box-shadow         : 0 1px 1px rgba(0, 0, 0, 0.15);
	-webkit-box-shadow : 0 1px 1px rgba(0, 0, 0, 0.15);
	z-index            : 2;
	transition		   : 500ms;

	margin-left:10px;
	margin-bottom:3px;
	font-size:13px;
	color: #777;
	background:#fff;
	overflow:hidden;
}
div.block span.fa_circle {
	color              : #FFF;
	background         : #cccccc;
}
div.filter span.fa_circle {
	color              : #FFF;
	background         : #cccccc;
}
div.cell span.fa_circle {
	color              : #FFF;
	background         : #cccccc;
}

span.fa_circle:not(.no_clickable):hover {
    cursor             : pointer;
    background         : #3da0ea;
}
span.fa_circle:not(.no_clickable):active {
    background         : #368fd0;
    transition         : 0ms;
}
span.fa_circle.selected {
    background         : #368fd0;
    transition         : 0ms;
}

a.right{
    margin-left:8px;
    float: right;
}
a[disabled]{
    pointer-events: none;
    color: #ccc;
}

*[disabled]:not(.loading){
    pointer-events: none;
    color: #888 !important;
    background-color: #dedede !important;
    cursor:default; 
}

a[disabled]:not(.loading){
    pointer-events: none;
    color: #ccc !important;
    background-color: transparent !important;
    cursor:default; 
}

button.right{
    margin-left:8px;
    float: right;
}

i.fa-stop.history {
	font-size: 	7pt;
	color:	 	#f6831e;
}

i.fa-stop.obs {
	font-size: 	7pt;
	color:	 	#008cd1;
}

i.fa-stop.validado {
	font-size: 	7pt;
	color:	 	#008000;
}

i.fa-stop.disabled {
	font-size: 	7pt;
	color:	 	#ff0000;
}

i.fa-stop.error {
	font-size: 	7pt;
	color:	 	#fa1301;
}

i.fa-stop.warning {
	font-size: 	7pt;
	color:	 	#fee23e;
}

i.fa-stop.vista {
	font-size: 	7pt;
	color:	 	#808080;
}

i.fa-asterisk.required {
	color:	 	#ea6153;
}


/************************************
*           	WIZARD				*
*************************************/


/*.wizard {
  box-shadow: none;
  border-width: 0px 0px 1px;
  border-style: none none solid;
  -moz-border-top-colors: none;
  -moz-border-right-colors: none;
  -moz-border-bottom-colors: none;
  -moz-border-left-colors: none;
  border-image: none;
  border-radius: 0px;
  border-color: -moz-use-text-color -moz-use-text-color #E2E2E2;
  background: none repeat scroll 0% 0% #FFF;

  position: relative;
  top:10px;
  overflow: hidden;
  width: 840px;
  margin-left:31px;
}*/

div.wizard {
  border-bottom: 1px Solid #ccc;
  /*position: absolute;*/
  overflow: hidden;
  padding: 0px 0px 0px 0px;
}

div.block > div.wizard {
  width: calc(100% + 40px);
  position: relative;
  top:-20px;
  left:-20px;
  background-color: #f0f0f0;
}

div.wizard ul {

    padding: 0px;
    margin: 0px;
    list-style: none outside none;

}

div.wizard:after {
    clear: both;
}

div.wizard:before, .fuelux .wizard:after {
    display: table;
    line-height: 0;
    content: "";
}

div.wizard ul li:first-child {
    border-radius: 0px;
}

div.wizard ul li.active {
    background: none repeat scroll 0% 0% #3DA0EA;
    color: #ffffff;
}

div.wizard ul li:first-child {
    padding-left: 20px;

}

div.wizard ul li {
    font-size: 12px;
}

div.wizard ul li[disabled] {
   color: #ddd;
    pointer-events: none;
}

div.wizard ul li {
    position: relative;
    float: left;
    height: 30px;
    padding: 0px 20px 0px 30px;
    margin: 0px;
    line-height: 30px;
    color: #999;
    cursor: default;
  	/*background: none repeat scroll 0% 0% #EDEDED; */
  	background: none repeat scroll 0% 0% #f9f9f9;
}

div.wizard ul li[onclick] {
    cursor: pointer;
}
div.wizard ul li.clickable {
    cursor: pointer;
}

div.wizard ul {
    list-style: none outside none;
}

div.wizard ul li.active .chevron:before {
    border-left: 14px solid #3DA0EA;
}

div.wizard ul .chevron {
  position: absolute;
  top: -8px;
  right: -14px;
  z-index: 1;
  display: block;
  border: 24px solid transparent;
  border-right: 0;
  border-left: 14px solid #d4d4d4;
}

div.wizard ul .chevron:before {
  position: absolute;
  top: -24px;
  right: 1px;
  display: block;
  border: 24px solid transparent;
  border-right: 0;
  border-left: 14px solid #f9f9f9;
  content: "";
}

div.wizard.without_sequence ul li {
    padding: 0px 20px 0px 20px;
	border-right: 1px Solid #ccc;
}

div.wizard.without_sequence ul .chevron {
  position: absolute;
  top: -24px;
  right: 1px;
  display: none;
  border: 24px solid transparent;
  border-right: 0;
  border-left: 14px solid #f9f9f9;
  content: "";
}




div.tabs {
  background-color: #f0f0f0;
  border-bottom: 1px Solid #ccc;
  position: absolute;
  overflow: hidden;
  padding: 0px 0px 0px 0px;
  z-index:1;
}

div.tabs-content {
 	display: none;
}
div.tabs-content.active {
 	display: inline-block;
}

div.tabs.second {
  margin-top:0px;
  background-color: #ffffff;
}

div.block > div.tabs {
  width: calc(100% + 40px);
  position: relative;
  top:-20px;
  left:-20px;
}

div.popover > div.popover_content  div.tabs-content {
  padding-top: 40px;
}

div.tabs ul {

    padding: 0px;
    margin: 0px;
    list-style: none outside none;

}
div.tabs ul li.active {
	border-bottom: 2px Solid #3DA0EA;
    background-color: #ffffff;
}
div.tabs ul li {
    padding-start: 0px;
    font-size: 12px;
    position: relative;
    float: left;
    height: 30px;
    padding: 0px 20px 0px 20px;
    margin: 0px;
    line-height: 30px;
    color: #999;
    cursor: default;
    border-right: 1px Solid #ccc;
}
div.tabs > ul li > div{
    float:left;
    margin: 0px 0px 3px 0px;
    background-color:#fff;
    width:100px;
    height:40px;
    text-align:center;
    vertical-align:middle;
    overflow: hidden;
    clear: both;
    padding-top:10px;
    cursor:pointer;
    box-shadow:         0px 1px 1px 1px rgba(0, 0, 0, 0.08);
    position: absolute;

}
div.tabs ul li[onclick] {
    cursor: pointer;
}
div.tabs ul li.clickable {
    cursor: pointer;
}
div.tabs ul {
    list-style: none outside none;
}

div.tabs {
  background-color: #f0f0f0;
  border-bottom: 1px Solid #ccc;
  position: absolute;
  overflow: hidden;
  padding: 0px 0px 0px 0px;
  z-index:1;
}

div.tabs.second {
  margin-top:0px;
  background-color: #ffffff;
}

div.block > div.tabs {
  width: calc(100% + 40px);
  position: relative;
  top:-20px;
  left:-20px;
}

div.tabs-dashboard ul {
    padding: 0px;
    margin: 0px;
    list-style: none outside none;

}
div.tabs-dashboard ul li.active {
    background-color: #3DA0EA;
    color:#fff;
}
div.tabs-dashboard ul li {
    padding-start    : 0px;
    font-size        : 11px;
    font-family      : Roboto Condensed;
    font-weight      : 600;
    position         : relative;
    float            : left;
    height           : 30px;
    padding          : 0px 20px 0px 20px;
    margin           : 5px 12px;
    line-height      : 30px;
    color            : #666;
    cursor           : default;
    background-color : #dedede;
    text-transform   : uppercase;
    border: 1px Solid #ccc;
}

div.tabs-dashboard > ul li > div{
    float:left;
    margin: 0px 0px 3px 0px;
    background-color:#fff;
    width:100px;
    height:40px;
    text-align:center;
    vertical-align:middle;
    overflow: hidden;
    clear: both;
    padding-top:10px;
    cursor:pointer;
    box-shadow:         0px 1px 1px 1px rgba(0, 0, 0, 0.08);
    position: absolute;

}

div.tabs-dashboard ul li[onclick] {
    cursor: pointer;
}
div.tabs-dashboard ul li.clickable {
    cursor: pointer;
}
div.tabs-dashboard ul {
    list-style: none outside none;
}

div.tab_buttons {
  position: absolute;
  overflow: hidden;
  padding: 0px 0px 0px 0px;
  z-index:1;
}

div.tab_buttons.second {
  margin-top:0px;
  background-color: #ffffff;
}

div.block > div.tab_buttons {
  width: calc(100% + 40px);
  position: relative;
  top:-20px;
  left:-20px;
}

div.tab_buttons ul {

    padding: 0px;
    margin: 0px;
    list-style: none outside none;

}

div.tab_buttons ul li.active {
	border			 : 1px solid #3da0ea;
    background-color : #3da0ea;
    color			 : #ffffff;
}

div.tab_buttons ul li {
 	font-family        : "Open Sans";
    font-size          : 9px;
    text-transform     : uppercase;
    padding            : 6px 12px;
    display            : inline-block;
    border             : 1px solid #c4c4c4;
    background-color   : #eee;
    color              : #777;
    cursor             : pointer;
    margin-left        : 5px;
}

div.tab_buttons > ul li > div{
    float:left;
    margin: 0px 0px 3px 0px;
    background-color:#fff;
    width:100px;
    height:40px;
    text-align:center;
    vertical-align:middle;
    overflow: hidden;
    clear: both;
    padding-top:10px;
    cursor:pointer;
    box-shadow:         0px 1px 1px 1px rgba(0, 0, 0, 0.08);
    position: absolute;

}

div.tab_buttons ul li[onclick] {
    cursor: pointer;
}

div.tab_buttons ul li.clickable {
    cursor: pointer;
}

div.tab_buttons ul {
    list-style: none outside none;
}

/************************************
*            Left Menu              *
*************************************/
table.left_menu {
    width:     100%;
    font-size: 10px;
    color:     #444
}

table.left_menu tr {
    height:         60px;
    vertical-align: middle;
}

table.left_menu td {
    padding:       4px;
    text-align:    center;
    font-size: 10px;
    border-bottom: 1px solid #e3e3e3;
}

table.left_menu td:hover {
    background-image:  url(/Common/Images/left_menu_hover.png);
    cursor:            pointer;
}

table.left_menu td.selected {
    padding:          4px;
    text-align:       center;
    border-bottom:    1px solid #e3e3e3;
    background-image: url(/Common/Images/left_menu_bg.jpg);
    color:            white;
}

table.left_menu td.selected:hover {
    cursor:            pointer;
}

table.left_menu tr.divider {
    height: 3px;
}

table.left_menu tr.divider td {
    padding:             0px;
    background-image:    url(/Common/Images/left_menu_divider.png);
    background-repeat:   no-repeat;
    background-position: center;
}

#left-panel-content {
    background-color: white;
    border-right:     1px solid #e3e3e3;
    height:           100%;
    top:              47px;
    left:             0;
    margin:           0;
    padding:          0;
    position:         fixed;
    width:            77px;
    z-index:          10000;
}
div.with-left-menu{
    margin-left: 107px;
}

/************************************
*                 Form              *
*************************************/
table.default {
    color:       #676767;
    line-height: 24px;
    font-size:   13px;
    width:       100%;
    border-spacing: 13px;
}
table.default tr td.form_label{
	vertical-align: top;
    width:          180px;
    text-align: 	right;
    color: 			#555;
    font-weight : 	600;
    vertical-align:	top;
}
table.default tr td.form_content {

}

table.pop_over {
    color:       #676767;
    line-height: 24px;
    font-size:   13px;
    width:       100%;
    width:       calc(100% - 10px);
    border-spacing: 13px;
    margin-left:0px;
}
table.pop_over tr td.form_label {
    width:          120px;
    text-align:     right;
    color: 			#555;
    font-weight : 	600;
    vertical-align:	top;
}
table.pop_over tr td.form_content {

}

table.noWidth {
    color:       #676767;
    line-height: 24px;
    font-size:   13px;
    width:       100%;
    border-spacing: 13px;
}
table.noWidth tr td.form_label {
    vertical-align: top;
    text-align: right;
}
table.noWidth tr td.form_content {

}


table.left_bar {
    color:       #676767;
    /*line-height: 24px;*/
    font-size:   13px;
    width:       100%;
    /*border-spacing: 13px;*/
}
table.left_bar tr td.form_label {
    color:#555;
    font-weight :600;
    height:30px;
    vertical-align: bottom;
    padding-bottom: 5px;
}
table.left_bar tr td.form_label:empty {
    display:none;
}

table.left_bar tr td.form_content {

}

table.form_nolabel tr td > input[type="text"] {
    width:100%;
}
table.form_nolabel tr td > select {
    width:100%;
}

div.div_form_buttons{
	min-width:800px;
}
@media screen and (max-width: 850px){
	div.div_form_buttons{
		min-width:0;
	}
}
textarea.registo_observacoes{
	width:300px;
	height:60px;
}
@media screen and (max-width: 20cm){

	table.default {
    	width:       100%;
	}
	table.default > tbody > tr > td{
		display: block;
	}
	table.default tr td.form_label {
	    width:          auto;
	    min-width:     	100px;
	    text-align: left;
	}

	table.pop_over {
    	width:       100%;
	}
	table.pop_over > tbody > tr > td{
		display: block;
	}
	table.pop_over tr td.form_label {
	    width:          auto;
	    min-width:     	100px;
	    text-align: left;
	}

	div.div_form_buttons{
		width:100%;
		margin-bottom:20px;
	}

	/*div.details_ultimo_valor{
		display: none;
	}*/

	textarea.registo_observacoes{
		width:150px !important;
		height:90px !important;
	}
	table.var_content > tbody > tr > td input[type="text"]{
		width:110px;
	}
	table.var_content > tbody > tr > td{
		display: block;
	}
	table.var_content > tbody > tr > td table.details{
		opacity: 0.2;
	}
	table.var_content > tbody > tr > td table.details:hover{
		opacity: 1;
	}
	table.var_content > tbody > tr > td table.details > tbody > tr > td > input.totalizador_parcial{
		width:40px;
	}

}


/**********************************************************************
                            DateTimePicker
***********************************************************************/

div.datetimepicker{
  display:inline-block;
  max-height:30px;
}
div.datetimepicker > input{
   float: right;
}
div.datetimepicker > div{
   float: right;
}
div.datetimepicker > div.timepicker{
    border-left:0;
}
div.datetimepicker > input.datepicker{
    border-right:0;
}

/**********************************************************************
                            TimeInterval
***********************************************************************/
div.timeinterval{
    position:relative;
    border: 1px Solid #ccc;
    min-height:20px;
    max-height:28px;
}
div.timeinterval > span{
    position:absolute;
    top:50%;
    margin-top:-10px;
    margin-left:10px;
    color:#aaa;
}
div.timeinterval > i{
    position:absolute;
    right:5px;
    top:50%;
    margin-top:-8px;
    color:#000;
}

div.timeinterval > input.hour{
    width:30px;
    border: none;
    max-height:25px;
    padding: 0px 3px;
}
div.timeinterval > input.invalid{
    color: red;
}
div.timeinterval > input.minute{
    width:30px;
    border: none;
    max-height:25px;
    padding: 0px 3px;
}
div.timeinterval > input.minute[maxlength="2"]{
    width:20px;
}
div.timeinterval > input.minute[maxlength="3"]{
    width:30px;
}
div.timeinterval > input.days{
    width:30px;
    border: none;
    max-height:25px;
    padding: 0px 3px;
}

div.timeinterval > input[type=number]::-webkit-inner-spin-button,
div.timeinterval > input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
div.loading{
	cursor: wait;
	/*overflow: hidden;*/
    pointer-events: none;
}
div.loading.map{
	opacity: 0.3 !important;
}
div.loader{
	position:absolute;
	top:50%;
	left:50%;
	opacity:0.8;
	z-index:999999;
}
div.loader > i.fa{
	font-size: 50px;
	color: #368fd0;
}
/*se o loader for adicionado numa div com position != relative*/
div.loader_center{
	width: 10%;
    margin: 0 auto
}
div.loader_center > i.fa{
	font-size: 50px;
	color: #368fd0;
}

div.widgetContent.loading{
	opacity:0.5;
}
div.widgetContent > div.loader_center{
	position: absolute;
	margin-top: -12%;
	margin-left: 40%;
}
i.loader.fa_circle{
	border-radius:50%;
}
i.fa-spin{
	/*color: #368fd0;*/
}

ul.vtabs li > div > i.fa-spin{
	position:absolute;
	margin-left:-50px;
	opacity:0.8;
}

button.primary.loading > i.fa {
    color: #fff;
    font-size: 12px;
    margin-right: 5px;
}
button.loading > i.fa {
    color: #368fd0;
    font-size: 12px;
    margin-right: 5px;
}

table tr td.loading > i.fa {
    color: #368fd0;
    font-size: 12px;
    margin-right: 5px;
}

div.widgetContent > div.widgetContentMapa{
	display: -webkit-flex; /* Safari */
    -webkit-flex-direction: row-reverse; /* Safari 6.1+ */
    display: flex;
    flex-direction: row-reverse;
    width:100%;
    height:100%;
    background-color:#CCCCCC;
}

div.fullscreen{
    position: fixed !important;
    left: 0px;
    top:50px;
    bottom: 0px;
    z-index:99999;
    width:100%;
    max-width:100%;
    min-width:100%;
    height: calc(100% - 50px) !important;
    background-color:white;
}
div.contentMap {
	height:100%;
	width: 100%;
}
div.contentMap > div.map{
	position:relative;
	height:100%;
	width: calc(100% - 25px);
    background-color:#CCCCCC;
    float:left;
}
div.contentMap > div.optionsMap{
	padding:5px;
	max-width:25px;
	width:15px;
	height:calc(100% - 10px);
	background-color:#fff;
	text-align: center;
	float:right;
}
div.contentMap > div.optionsMap > i.fa{
	margin-top: 10px;
    font-size: 15px;
    color: #444444;
    cursor: pointer;
}
div.contentMap > div.optionsMap > i.fa:hover{
    color: #30a9e7;
}

div.contentMap > div.optionsMap > div.vertical_separator{
    background-color: #ccc;
    width:100%;
    height:1px;
    margin: 20px 0px;
}


img.thumb{
	position: relative;
	max-width: 100px;
	max-height: 100px;
	width: auto;
	height: auto;
	cursor: pointer;
}

div.reg-gallery{
	max-width: 500px;
}

div.reg-gallery > div.reg-thumb{
	display:inline-block;
	margin:5px;
	height: 100%;
	vertical-align: middle;
}

.small {
  width       : 40px;
  margin-left : 0px;
}

i.icon_close {
    font-weight : 700;
    color       : #ccc;
    text-shadow : 0px 1px 0px #FFF;
}
i.icon_close:hover {
    color  : #ed5956;
    cursor : pointer;
}

#tooltip {
	position:   fixed;
    background: #ffffff;
    background: -moz-linear-gradient(top, #ffffff 0%, #f9f9f9 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#f9f9f9));
    background: -webkit-linear-gradient(top, #ffffff 0%,#f9f9f9 100%);
    background: -o-linear-gradient(top, #ffffff 0%,#f9f9f9 100%);
    background: -ms-linear-gradient(top, #ffffff 0%,#f9f9f9 100%);
    background: linear-gradient(to bottom, #ffffff 0%,#f9f9f9 100%);

    -webkit-border-radius: 3px;
    -moz-border-radius:    3px;
    border-radius: 		   3px;
	border: 			   1px solid #e1e1e1;
    padding: 			   5px 10px;
    font-family: 		   arial, sans-serif;;
    font-weight: 		   bold;
    font-size:   		   12px;
    color:		 		   #646464;
}

div.led {
	width:  	 7px;
	height: 	 7px;
	margin-top:  3px;
	margin-left: 3px;
	display:	 inline-block;
}







/*loading line*/
.slider{
  position:fixed;
  left:0px;
  top:47px;
  width:100%;
  height:2px;
  margin-top:-30px;
  visibility:hidden;
  transition: 0.5s;
  overflow: hidden;
}
.slider.loading{
  visibility:visible;

  transition: 2s;
}
.line{
  position:fixed;
  top:47px;
  left:0px;
  background:#30a9e7;
  width:100%;
  height:1px;
}

.break{
  position:fixed;
  top:47px;
  left:0px;
  background:#fff;
  width:10%;
  height:1px;

  background: -webkit-linear-gradient(left,rgba(255,255,255,0.5),rgba(255,255,255,1),rgba(255,255,255,0.5)); /*Safari 5.1-6*/
  background: -o-linear-gradient(right,rgba(255,255,255,0.5),rgba(255,255,255,1),rgba(255,255,255,0.5)); /*Opera 11.1-12*/
  background: -moz-linear-gradient(right,rgba(255,255,255,0.5),rgba(255,255,255,1),rgba(255,255,255,0.5)); /*Fx 3.6-15*/
  background: linear-gradient(to right, rgba(255,255,255,0.5),rgba(255,255,255,1),rgba(255,255,255,0.5)); /*Standard*/
}
.break1{
  position:fixed;
  top:47px;
  left:0px;
  background:red;
  width:10%;
  height:1px;
}
.break2{
  position:fixed;
  top:47px;
  left:0px;
  background:yellow;
  width:10%;
  height:1px;
}
.break3{
  position:fixed;
  top:47px;
  left:0px;
  background:green;
  width:10%;
  height:1px;
}
.dot{
-webkit-animation: loading 1s 0.5s linear infinite alternate;
-moz-animation: loading 1s 0.5s linear infinite alternate;
-ms-animation: loading 1s 0.5s linear infinite alternate;
-o-animation: loading 1s 0.5s linear infinite alternate;
animation: loading 1s 0.5s linear infinite alternate;
}

.dot1{
-webkit-animation: loading 4s linear infinite alternate;
-moz-animation: loading 4s linear infinite alternate;
-ms-animation: loading 4s linear infinite alternate;
-o-animation: loading 4s linear infinite alternate;
animation: loading 4s linear infinite alternate;
}
.dot2{
-webkit-animation: loading 4s 0.3s linear infinite alternate;
-moz-animation: loading 4s 0.3s linear infinite alternate;
-ms-animation: loading 4s 0.3s linear infinite alternate;
-o-animation: loading 4s 0.3s linear infinite alternate;
animation: loading 4s 0.3s linear infinite alternate;
}
.dot3{
-webkit-animation: loading 4s 0.5s linear infinite alternate;
-moz-animation: loading 4s 0.5s linear infinite alternate;
-ms-animation: loading 4s 0.5s linear infinite alternate;
-o-animation: loading 4s 0.5s linear infinite alternate;
animation: loading 4s 0.5s linear infinite alternate;
}

div.block > div.slider{
  position:absolute;
  top:0px;
  margin-top:0px;

}
div.block > div.slider > div.line{
  position:absolute;
  top:0px;
}

div.cell > div.slider{
  position:absolute;
  top:0px;
  margin-top:0px;
}
div.cell > div.slider > div.line{
  position:absolute;
  top:0px;
}
div.cell > div.slider > div.break{
  position:absolute;
  top:0px;
}
div.cell > div.slider > div.break1{
  position:absolute;
  top:0px;
}
div.cell > div.slider > div.break2{
  position:absolute;
  top:0px;
}
div.cell > div.slider > div.break3{
  position:absolute;
  top:0px;
}

@keyframes "loading" {
 from { left: 0%; }
 to { left: 90%; }
}
@-moz-keyframes loading {
 from { left: 0%; }
 to { left: 90%; }
}
@-webkit-keyframes "loading" {
 from { left: 0%; }
 to { left: 90%; }
}
@-ms-keyframes "loading" {
 from { left: 0%; }
 to { left: 90%; }
}
 @-o-keyframes "loading" {
 from { left: 0%; }
 to { left: 90%; }
}
/*.slider{
  position:fixed;
  left:0px;
  top:47px;
  width:100%;
  height:2px;
  margin-top:-30px;
  visibility:hidden;
  transition: 0.5s;
  overflow: hidden;
}
.slider.loading{
  visibility:visible;

  transition: 2s;
}
.line{
  position:fixed;
  top:47px;
  left:0px;
  background:#30a9e7;
  width:100%;
  height:1px;
  //visibility:hidden;

}

div.slider.loading > div.line{
	-webkit-animation: loading 1s 0s infinite alternate;
	-moz-animation: loading 1s 0s infinite alternate;
	-ms-animation: loading 1s 0s infinite alternate;
	-o-animation: loading 1s 0s infinite alternate;
	animation: loading 1s 0s infinite alternate;
}



div.block > div.slider{
  position:absolute;
  top:0px;
  margin-top:0px;

}
div.block > div.slider > div.line{
  position:absolute;
  top:0px;
  margin-left:50%;
}

div.cell > div.slider{
  position:absolute;
  top:0px;
  margin-top:0px;
}
div.cell > div.slider > div.line{
  position:absolute;
  top:0px;
  margin-left:50%;
}

 @keyframes "loading" {
 from { width: 100%; margin-left:0%;}
 to { width: 0%; margin-left:50%;}
}
@-moz-keyframes loading {
  from { width: 100%; margin-left:0%;}
 to { width: 0%; margin-left:50%;}
}
@-webkit-keyframes "loading" {
  from { width: 100%; margin-left:0%;}
 to { width: 0%; margin-left:50%;}
}
@-ms-keyframes "loading" {
	 from { width: 100%; margin-left:0%;}
 to { width: 0%; margin-left:50%;}
}
 @-o-keyframes "loading" {
	 from { width: 100%; margin-left:0%;}
 to { width: 0%; margin-left:50%;}
 }
 */
div.spin{
	width: 20px;
	height:20px;
	border: 2px dashed #000;
	border-radius: 50% 50% 50% 50%;
}

.spining{
-webkit-animation: spining 0.3s 0s linear infinite;
-moz-animation: spining 0.3s 0s linear infinite;
-ms-animation: spining 0.3s 0s linear infinite;
-o-animation: spining 0.3s 0s linear infinite;
animation: spining 0.3s 0s linear infinite;
}

@keyframes "spining" {
 from { transform: rotate(0deg); }
 to { transform: rotate(180deg); }
}
@-moz-keyframes spining {
 from { transform: rotate(0deg); }
 to { transform: rotate(180deg); }
}
@-webkit-keyframes "spining" {
 from { transform: rotate(0deg); }
 to { transform: rotate(180deg); }
}
@-ms-keyframes "spining" {
 from { transform: rotate(0deg); }
 to { transform: rotate(180deg); }
}
 @-o-keyframes "spining" {
 from { transform: rotate(0deg); }
 to { transform: rotate(180deg); }
 }



 /*Ducumentos*/
div.files_list{
	position: relative;
	height: calc( 100% - 40px);
}
div.files_list div.files{
	height: calc( 100% - 40px);
}
div.files_list > div.files:empty:before{
	content: 'Não existem resultados.';
}
div.files_list.loading{
	cursor: wait;
}
div.files_list.error{
	cursor: not-allowed;
}
div.files_list > div > div.files{
	overflow: auto;
	height: calc( 100% - 20px);
	/*margin-top: 0px;
	margin-bottom: 0px;*/
}

div.files_list > div.files > div.icon > i.option{
	position:absolute;
	top: 0px;
	margin: 5px;
	font-size: 12pt;
	color: black;
	z-index:1;
}

div.files_list > div.files > div.icon > i.state{
	position:absolute;
	top: 0px;
	right: 0px;
	margin: 5px;
	font-size: 8pt;
	color: #ccc;
	z-index:1;
	cursor: default;
}
div.files_list > div.files > div.icon > i.state + i.state{
	right: 20px;
}
div.files_list > div.files_header{
	width:100%;
	height:50px;
}

div.files_list > div.files_header > div.options{
	float:right;
	margin-right:10px;
	color: #696969;
}
div.files_list > div.files_header > div.folder_options{
	float:right;
}

i.fa.fa-folder{
	color: #30a9e7;
	font-size:15px;
}
i.fa.fa-folder-open{
	color: #30a9e7;
	font-size:15px;
}

i.fa.fa-folder.protected{
	color: #ccc;
}
i.fa.fa-folder-open.protected{
	color: #ccc;
}

td.prefix > i.fa.fa-share-alt{
	margin-left:-10px;
}

div.icon > div.img{
	width:100%;
	height:80%;
	display:block;
	margin-left: auto;
    margin-right: auto;
    cursor: pointer;
    /*background-size: 100% !important; NAV-1469:@pmonteiro*/
    /* background-size: contain !important; NAV-1469:@pmonteiro */
    background-position: center center !important;
    background-repeat: no-repeat !important;
}
div.pic > div.img{
	width:100%;
	height:100%;
	display:block;
	margin-left: auto;
    margin-right: auto;
    cursor: pointer;
    background-size: 100% !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
}
table.main tr > td.thumbs {
    padding: 1px 5px;
}
table.main tr > td.thumbs > div.icon{
	width:30px;
	height:30px;
	display:inline-block;
	margin-left: 2px;
    margin-bottom: -4px;

}
div.popover_viewimage > div.icon > div.img{
	-webkit-filter: grayscale(100%);
	filter: grayscale(100%);
}
div.popover_viewimage > div.icon > div.img:hover{
	-webkit-filter: none;
	filter: none;
	transition:0.5s;
}

div.files > div.icon.selected{
	border: 2px Solid #3da0ea;
	margin: 4px;
}
div.files > div.icon.cutted{
	opacity: 0.3;
}
div.files.ctrlKey div.icon.ui-draggable{
	cursor: copy !important;
}
div.files.ctrlKey div.icon.ui-draggable > div.img{
	cursor: copy !important;
}
div.files.ctrlKey div.icon.ui-draggable > i{
	cursor: copy !important;
}

div.files.ctrlKey div.icon.ui-draggable > i{
	cursor: copy !important;
}


div.large.icon{
	position: relative;
	overflow:hidden;
	max-width:200px;
	max-height:180px;
	width:200px;
	height:180px;
	text-align: center;
	box-shadow: 1px 1px 3px #888888;
	margin:5px;
	display:inline-block;
}
div.large.icon > div.title{
	height:30px;
	position: absolute;
	bottom: 0px;
	width:100%;
	overflow:hidden;
	z-index:1;
	background-color: white;
	opacity:0.7;
}
/*div.large.icon.selected{
	background-color: #e5f3fb;
}
div.large.icon.selected > div.title{
	background-color: #e5f3fb;
}*/

div.large.icon > i.fa.icon{
	display:block;
	font-size:70px;
	margin-top:20px;
	color: #696969;
}
div.large.icon > i.fa.fa-reorder{
	color:333;
	display:block;
	position:absolute;
	bottom:10px;
	right:10px;
	z-index:1;
}
div.large.icon > div.img > i.fa.fa-play-circle-o{
	position: absolute;
	display:block;
	top:20%;
	left:40%;
	color:white;
	font-size:40px;
	opacity:0.7;
	cursor: pointer;
}
div.large.icon > i.fa{
	display:block;
	margin-top:20%;
	font-size:40px;
	cursor: pointer;
}

div.mediun.icon{
	position: relative;
	overflow:hidden;
	max-width:150px;
	max-height:150px;
	width:150px;
	height:150px;
	text-align: center;
    border: 1px Solid transparent;
	/* box-shadow: 1px 1px 3px #888888; */
	margin:5px;
	display:inline-block;
}
div.mediun.pic {
	position: relative;
	overflow:hidden;
	max-width:150px;
	max-height:130px;
	width:150px;
	height:130px;
	text-align: center;
	margin:5px;
	display:inline-block;
}

/* <i class="fa fa-file-pdf-o" style="color: #3da0ea;position: absolute;top: 5px;left: 5px;margin-top: 0;margin-left: 0;background-color: rgba(255, 255, 255, 0.75);box-shadow: 0 0 2px 1px rgba(255, 255, 255, 0.75);">
</i> */

/* color: #3da0ea;
    position: absolute;
    top: 5px;
    left: 5px;
    margin-top: 0;
    margin-left: 0;
    background-color: rgba(255, 255, 255, 0.75);
    box-shadow: 0 0 2px 1px rgba(255, 255, 255, 0.75); */

div.mediun.icon > div.title{
	height:30px;
	position: absolute;
	bottom: 0px;
	width:85%;
	overflow:hidden;
	z-index:1;
	background-color: white;
    opacity:0.7;
    text-align: left;
}

/* div.mediun.icon.selected{
	background-color: #e5f3fb;
} */

/* div.mediun.icon.selected > div.title{
	background-color: #e5f3fb;
} */

div.mediun.icon > i.fa.icon{
	display:block;
	font-size:50px;
	margin-top:20px;
	color: #696969;
}
div.mediun.icon > i.fa.fa-reorder{
	color:333;
	display:block;
	position:absolute;
	bottom:10px;
	right:10px;
	z-index:1;
}
div.mediun.icon > div.img > i.fa.fa-play-circle-o{
	position: absolute;
	display:block;
	top:20%;
	left:40%;
	color:white;
	font-size:40px;
	opacity:0.7;
	cursor: pointer;
}
div.mediun.icon > i.fa{
	display:block;
	margin-top:20%;
	font-size:40px;
	cursor: pointer;
}

div.mediun.icon > i#exclude_from_pdf.fa.fa-file-pdf-o{
	color: #ccc;
    position: absolute;
    /* top: 0;
    left: 0; */
    right:0px;
    /* z-index:2; */
    /* bottom:0px; */
    /* margin-top: 5px; */
    /* margin-left: 5px; */
    width:15%;
    height: 30px;
    font-size: 18px;
    margin-top: 0px;
    background-color: rgba(255, 255, 255, 0.75);
    box-shadow: 0 0 2px 1px rgba(255, 255, 255, 0.75);
}

div.mediun.icon > i#exclude_from_pdf.fa.fa-file-pdf-o.selected{
    /* color: #3da0ea; */
    color: #008000;
}

div.mediun.icon > i#exclude_from_pdf.fa.fa-file-pdf-o:hover{
    font-size: 20px;
}

div.small.icon{
	position: relative;
	overflow:hidden;
	max-width:80px;
	max-height:80px;
	width:150px;
	height:130px;
	text-align: center;
	box-shadow: 1px 1px 3px #888888;
	margin:5px;
	display:inline-block;
}
div.small.icon > div.title{
	display:none;
	height:30px;
	position: absolute;
	bottom: 0px;
	width:100%;
	overflow:hidden;
	z-index:1;
	background-color: white;
	opacity:0.7;
}
div.small.icon.selected{
	background-color: #e5f3fb;
}
div.small.icon.selected > div.title{
	background-color: #e5f3fb;
}

div.small.icon > i.fa.icon{
	display:block;
	font-size:50px;
	margin-top:20px;
	color: #696969;
}
div.small.icon > i.fa.fa-reorder{
	color:333;
	display:block;
	position:absolute;
	bottom:10px;
	right:10px;
	z-index:1;
}
div.small.icon > div.img > i.fa.fa-play-circle-o{
	position: absolute;
	display:block;
	top:20%;
	left:40%;
	color:white;
	font-size:40px;
	opacity:0.7;
	cursor: pointer;
}
div.small.icon > i.fa{
	display:block;
	margin-top:20%;
	font-size:40px;
	cursor: pointer;
}


div.files_list.gallery > div.files_header{
	display:none;
}
div.files_list.gallery > div.files{
	display:inline-flex;
}
div.files_list.gallery > div.files{
	overflow-x:auto;
}
div.gallery.icon{
	position: relative;
	overflow:hidden;
	max-width:150px;
	max-height:150px;
	width:150px;
	height:130px;
	text-align: center;
	margin:5px;
	display:inline-block;


}


div.gallery.icon > div.title{
	display:none;
	height:30px;
	position: absolute;
	bottom: 0px;
	width:100%;
	overflow:hidden;
	z-index:1;
	background-color: white;
	opacity:0.7;
}
div.files > div.gallery.icon > div.img{
    background-size: 120% !important;
}
div.gallery.icon.selected{
	background-color: #e5f3fb;
}
div.gallery.icon.selected > div.title{
	background-color: #e5f3fb;
}

div.gallery.icon > i.fa.icon{
	display:block;
	font-size:50px;
	margin-top:20px;
	color: #696969;
}

div.gallery.icon > i.fa.fa-reorder{
	color:333;
	display:block;
	position:absolute;
	bottom:10px;
	right:10px;
	z-index:1;
}
div.gallery.icon > div.img > i.fa.fa-play-circle-o{
	position: absolute;
	display:block;
	top:20%;
	left:40%;
	color:white;
	font-size:40px;
	opacity:0.7;
	cursor: pointer;
}
div.gallery.icon > i.fa{
	display:block;
	margin-top:20%;
	font-size:40px;
	cursor: pointer;
}



.ui-droppable-active{
	background-color: #30a9e7;
}


div.title {
    text-overflow: ellipsis;
}

/*
PROGRESS
*/

.progress_main {
    position:       relative;
    width:          200px;
    border:         1px solid #ddd;
    padding:        1px;
    border-radius:  3px;
}

.progress_bar {
    background-color:   #008BCC;
    width:              0%;
    height:             10px;
    border-radius:      3px;
}

.progress_bar_red {
    background-color:   red;
    width:              0%;
    height:             10px;
    border-radius:      3px;
}

.progress_percent {
    position:   absolute;
    display:    inline-block;
    top:        0px;
    left:       48%;
}

body > div.icon_warning {
    position:static;
    left:    0px;
    top:     50px;
    margin-left:    0px;
    margin-top:     50px;
    color:   red;
}

div.block_graphics > div.graphic{
	cursor:pointer;
	background-color:white;
	display: inline-block;
    margin-top:         2px;
    margin-left:        2px;
    background-color:   #fff;
    font-size:          11px;
    box-shadow:         0px 1px 0px 0px rgba(0, 0, 0, 0.04);
    border-left:        1px solid #efefef;
    border-right:       1px solid #efefef;
    border-bottom:      1px solid #e2e2e2;
    padding:            20px;
    text-align:         left;
    box-flex: 1;
    width: auto;
    min-width: 300px;
}

div.graphic{
	/*border:1px solid #cdcdcd; */
	cursor:pointer;
	background-color:white;
}
table tr.highlight{
	background-color: #e5f3fb;
}
table tr td > i.state{
	font-size:  11px;
}

table tr td[onclick]{
	cursor:pointer;
}

table tr th[onclick]{
	cursor:pointer;
}
table tr td > i.state[onclick]{
	cursor:pointer;
}
table tr td > i[disabled] {
    pointer-events: none;
}

table tr.disabled td {
    /*
    color: #c00 !important;
    */

    color: #444 !important;
}
table tr td.disabled {
    pointer-events: none;
    color: #ccc;
}

table tr td > i.state.active{
	color:          lime;
}
table tr td > i.state.inactive{
	color:          red;
}

img.grayscale {
	filter: url("data:image/svg+xml;utf8,&lt;svg xmlns=\'http://www.w3.org/2000/svg\'&gt;&lt;filter id=\'grayscale\'&gt;&lt;feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/&gt;&lt;/filter&gt;&lt;/svg&gt;#grayscale"); /* Firefox 10+, Firefox on Android */
     filter: gray; /* IE6-9 */
     -webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */
 }


/******* Foto preview ********/

.galery_image_details{
position:relative;
color:white;
right:100px;
font:bold 12px;
}

.galery_image{
position:relative;
max-width: 100px;
max-height: 100px;
width: auto;
height: auto;
}


.galery_image_box{}

.galery_container{
height:100px;
width:100%;
color:#FFFFFF;
background:#333333;
opacity:0.9;
-moz-opacity:0.9;
-khtml-opacity: 0.9;
filter:alpha(opacity=90);
padding-left:40px;
padding-right:40px;
}

.galery_box{
clear:both;
max-width:inherit;
max-height:500px;
width: auto;
overflow:auto;
}

.galery_image_open{
color:#000000;
background:#FFFFFF;
position:relative;
font-weight:bold;
box-shadow: 0 0 1em hsla(0, 0%, 0%, 1.0);
-webkit-box-shadow: 0 0 1em hsla(0, 0%, 0%, 1.0);
-moz-box-shadow: 0 0 1em hsla(0, 0%, 0%, 1.0);
width:auto;
}

div.galery_background{
position:fixed;
top:0px;
left:0px;
height:100%;
width:100%;
color:#FFFFFF;
background:#333333;
opacity:0.8;
-moz-opacity:0.8;
-khtml-opacity: 0.8;
filter:alpha(opacity=80);
}
div.galery_show_container{
position:absolute;
top:0px;
left:0px;
height:100%;
width:100%;
color:#FFFFFF;
}

i.rotate{
	display:none;
	position: absolute;
	top:0px;
	right:0px;

	margin-top:10px;
	margin-right:10px;
	fint-size:15px;
	cursor:pointer;
}
i.minimize{
	/*display:none;*/
	position: absolute;
	top:0px;
	right:30px;
	margin-top:10px;
	margin-right:30px;
	fint-size:15px;
	cursor:pointer;
}


div.component_selected{
	margin-top:5px;
	margin-left:5px;
	border:1px solid #dfdfdf;
	background-color:#efefef;
	padding:3px;
	display:inline-block
}

div.component_selected > i.fa.fa-times{
	color:red;
	cursor:pointer;
}
/*****************************/

/** GESTAO OBRAS - FICHA DE ARTIGOS */
.tbl_artigos {
	border-spacing: 0;
    border-collapse: collapse;
}

.tbl_artigos td {
	padding		  : 3px 5px 3px 5px;
	border-bottom : 1px solid #dddddd;
	font-size	  : 12px;
}

.tbl_artigos th {
	padding		  : 3px 5px 3px 5px;
	font-weight	  : bold;
	text-align	  : left;
	border-bottom : 1px solid #cccccc;
	font-size	  : 12px;
}
table.details{
	font-size: 7pt;
	color:#676767;
	border-spacing: 10px 0;
}
table.details tr{
	text-align:center;
	line-height:9px;
}
table.details tr th{
	font-size: 7pt;
	color:#999;
}
table.details tr td{
	font-size: 8pt;
	color: #222222;
}
table.details tr td.negative{
	color: red;
}
table.details tr td > input.totalizador_parcial{
	font-size: 8pt;
	color:black;
	text-align:center;
	border:0px;
}


div.popover_viewimage > table.details{
	font-size: 7pt;
	color:#fff;
	border-spacing: 10px 0;
}
div.popover_viewimage > table.details tr{
	text-align:center;
	line-height:9px;
}
div.popover_viewimage > table.details tr th{
	font-size: 7pt;
	color:#fff;
}
div.popover_viewimage > table.details tr td{
	font-size: 8pt;
	color:#fff;
}




table.details tr td > input.totalizador_parcial.negative{
	color: red;
}

span.fa.errspan{
	float:right;
	margin-top:7px;
	position:relative;
	z-index:2;
	display:none;
}
span.fa.errspan.limite{
	color:red;
}
input.with_warning + span.fa.errspan{
	margin-right:10px;
	display:block;
}


div.datetimepicker + span.fa.errspan{
	right:30px;
	display:block;
}

div.datetimepicker > i.fa.clear{
	right:30px;
	display: none;
	float:right;
	font-size:12pt;
	margin: 5px;
}

div.datetimepicker.disabled{
	color: #ccc;
	pointer-events: none;
}

div.datetimepicker:hover > i.fa.clear{
	display:inline-block;
}
input.datepicker{
	float:left !important;
}
input.datepicker:invalid{
    border:      1px solid #ccc;
    color:       red;
}
input.datepicker + i.clear{
	position: absolute;
	background-color: transparent;
	font-size:12pt;
	margin: 5px;
	width: 0;
	max-width: 0;
	border: 0;
	display: none;
}
input.datepicker.cleanable + i.clear:after{
	content: 'x';
	position: absolute;
	right: 0px;
	display: block;
	font-size:15px;
	font-weight:800;
	width: 15px;
	height: 15px;
	color: #000;
	top: -4px;
	bottom:0;
	z-index:1;
	border-radius: 50%;
	cursor: pointer;
}
input.datepicker.cleanable + i.clear:hover:after{
	 color         		: #3da0ea;
}
input.datepicker.cleanable:invalid + i.clear{
	display: none;
}
input.datepicker.cleanable:valid:hover + i.clear{
	display: inline-block;
}
input.datepicker.cleanable:valid + i.clear:hover{
	 display: inline-block;
}

div.timeinterval.with_warning {
	padding-right:20px;
}
div.timeinterval.with_warning + span.fa.errspan{
	right:0px;
	margin-right:5px;
	margin-top:-20px;
	display:block;
}


select::-ms-expand{
	border:0;
	background-color:transparent;
	font-size:5pt;
	color:#333;
	width:10px;
}

select.with_warning{
	width: calc( 100% + 10px );
	margin-right:10px;

}
select.with_warning + span.fa.errspan{
 	position:absolute;
 	right:10px;
 	top: 3px;
	display:inline-block;
}


select.placeholder-active{
 	color: #888;
}
select.placeholder-active > option{
 	color: initial;
}



div.map > div.map_toast{
	position:absolute;
	z-index:9991;
	left:10%;
	right:10%;
	bottom:10%;
	background-color:#000000;
	opacity:0.5;
	color:#ffffff;
	padding:10px;
}

@media screen and (max-width: 20cm){
	table.main.mobile tr.header td {
		border: 0;
	}
	table.main.mobile tr.header.pinned  {
		position: relative;
	}
	table.main.mobile tr.header td > table tr th:not(.sortable):not(.criar) {
		display:none;
	}
	table.main.mobile tr.header td > table tr td:not(.sortable) {
		display:none;
	}
	table.main.mobile tr td {
		border: 0;
	}
	table.main.mobile tr td > table{
		 width: 100%;
	}

	table.mobile tr td > table tr td:first-child{
	    text-align: left;
	    font-weight: bold;
	    width: 25%;
	}

	/*table.mobile tr td > table tr td:second-child{
	    width: 90%;
	}*/

}

table tr.rotate45 td > div.rotate{
	transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
}
table tr.rotate45 td{
	width:40px;
}

table tr.rotate45 th > span{
	transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
}
table tr.rotate45 th{
	width:40px;
}

table.line_checked tr.header th i.fa.fa-bars{
	display: block;
	visibility: vilsible;
	color: red;
}

table.line_checked.title_after tr.header th i.fa.fa-bars:after{
	content: attr(title);
	position: absolute;
	margin-left: 10px;
	margin-top:-10px;
	padding: 10px;
	background-color: white;
	border: 1px Solid red;
	animation: hide5s 4s cubic-bezier(0.42,0,1,1) 1;
	-moz-animation: hide5s 4s cubic-bezier(0.42,0,1,1) 1;
	-webkit-animation: hide5s 4s cubic-bezier(0.42,0,1,1) 1;
	-ms-animation: hide5s 4s cubic-bezier(0.42,0,1,1) 1;
	-o-animation: hide5s 4s cubic-bezier(0.42,0,1,1) 1;
	opacity:0;
}
table.line_checked.title_after tr.header th i.fa.fa-bars:hover:after{
	opacity:1;
}


div#div_ie_details > div > div.labelTitleDetails {
    text-align:center;
	border-bottom-width : 1px;
	border-bottom-style : dotted;
	border-bottom-color : #DADADA;
    color				: #555;
	font-size   		: 14px;
	font-weight 		: 200;
	font-family 		: "Open Sans";
	padding				: 0px 0px 10px 0px;
}
div#div_ie_details > div > div.labelTitleDetails > i {
	font-size   		: 30px;
	padding				: 0px 0px 10px 0px;
}

div.filter div.clickable{
    cursor:pointer;
    color:#30a9e7;
}
div.filter div.clickable.colapsed + div.content{
    display:none !important;
}
div.filter.colapsed + div.content{
    display:none !important;
}

div.filter > div.clickable > i.fa{
    transition: 0.5s;
}
div.filter > div.clickable:not(.colapsed) > i.fa{
	transform: rotate(90deg);
}



@keyframes hide5s {
 	0% { opacity:1; }
 	100% { opacity:0; }
}

div.tutorial-overlay{
	position: fixed;
	top: 0;
	left: 0;
	background-color: #333;
	width: 100%;
	height: 100%;
	mix-blend-mode: hard-light;
	z-index:199991;
}

div.tutorial-overlay > div.hole{
	position: absolute;
	min-width: 20px;
	min-height: 20px;
	width: 20px;
	height: 20px;
	border-radius: 5px;
	background-color: gray;
	padding:5px;
	/*transition: 1s opacity;*/
}
div.tutorial-overlay > div.hole:after{
	position: absolute;
	top: 150%;
	content: attr(data-descricao);
	color: white;
}


div.tutorial-overlay > div.menu{
	top: 100px;
	right: 50px;
	background-color: transparent;
	font-size: 20pt;
	padding:50px;
}
div.tutorial-overlay > div.menu > a{
	display: block;
	padding:5px;
}

/*i.fa.fa-registered.recording{
	color:red;
}*/

/*table.main tr td:not([title]):hover{
	overflow-x: auto;
	text-overflow: clip;
	animation: scroll-left 5s linear infinite;
}

table.main tr td::-webkit-scrollbar{
	width: 2px;
	height: 0px;
}
table.main tr td::-webkit-scrollbar-track{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
}
table.main tr td::-webkit-scrollbar-thumb{
	background-color: darkgrey;
	outline: 1px solid slategrey;
}
@keyframes scroll-left {
 	0% { margin-left:0; }
 	50% { margin-left: -20%; }
 	100% { margin-left:0; }
}*/
/*table tr td:hover{
	text-overflow: hidden;
	overflow: visible;
	text-indent:100%;
}
table tr td:hover + td{
	color:transparent;
}*/

/*table.main tr td:not([title]):hover{
	animation: scroll-left 5s linear infinite;
}
@keyframes scroll-left {
 	0% { text-indent:0; }
 	50% { text-indent: calc(-20%); }
 	100% { text-indent:0; }
}*/


table.calendario_horizontal {
	border-collapse:  collapse;
}

table.calendario_horizontal tr.header {
	color: #002840;
}

table.calendario_horizontal tr.header td, table.calendario_horizontal tr.header th {
	border:				1px solid #d0d7e5;
	background-color:	#FEFEFE;
	vertical-align:		middle;
}

table.calendario_horizontal tr.header td.fds, table.calendario_horizontal tr.header th.fds {
	background-color: #F8F8F8;
}

table.main.calendario_horizontal.left_table tr.header th.no_border {
	border:	1px solid transparent;
}

table.calendario_horizontal tr td, table.calendario_horizontal.left_table tr td {
	border:				1px solid #d0d7e5;
	background-color:	#F3F3F3;
	color: 				#002840;
	vertical-align:		middle;

}

table.calendario_horizontal tr td {
	border:				1px solid #d0d7e5;
	background-color:	#FEFEFE;
}

table.calendario_horizontal tr td.fds {
	background-color:	#F8F8F8;
}

table.calendario_horizontal tr td > div.square {
	margin-left: 2px;
	width:15px;
	height:15px;
	padding:2px;
	text-align: center;
	color:white;
}

table.calendario_horizontal.highlightable_td tr td[onclick]:hover{
    background-color        : #e5f3fb;
    cursor                  : pointer;
}
table.calendario_horizontal.highlightable_td tr th[onclick]:hover{
    background-color        : #e5f3fb;
    cursor                  : pointer;
}
div.filter_selected{
	cursor: pointer;

}
div.filter_selected > i{
	color:red;
	margin-left: 10px;
}
div.filter_selected > a{
	margin-left: 10px;

}
div.filter_selected > span{
	margin-left: 10px;
}


div.progress_circle {
	width: 100px;
  	height: 100px;
  	position: relative; /* Enable clipping */
  	cursor: default;
}
div.progress_circle > div.wrapper {
  width: 100%; /* Set the size of the progress bar */
  height: 100%;
  position: absolute; /* Enable clipping */
  clip: rect(0px, 100px, 100px, 50px); /* Hide half of the progress bar */
}
/* Set the sizes of the elements that make up the progress bar */
div.progress_circle > div.wrapper > div.circle {
  width: 80%;
  height: 80%;
  border: 10px solid #3da0ea;
  border-radius: 50%;
  position: absolute;
  clip: rect(0px, 50px, 100px, 0px);
}
div.progress_circle > span{
	position: absolute;
	margin-left: calc(40%);
	margin-top: calc(40%);
	font-size:12pt;
	color: #666;
}

div.progress_circle.small {
	width: 50px;
  	height: 50px;
}
div.progress_circle.small > div.wrapper {
  clip: rect(0px, 50px, 50px, 25px); /* Hide half of the progress bar */
}
/* Set the sizes of the elements that make up the progress bar */
div.progress_circle.small > div.wrapper > div.circle {
  clip: rect(0px, 25px, 50px, 0px);
   border: 5px solid #3da0ea;
}
div.progress_circle.small > span{
	margin-left: calc(20% - 50%);
	margin-top: calc(30%);
	font-size:8pt;
}

div.progress_circle.large {
	width: 200px;
  	height: 200px;
}
div.progress_circle.large > div.wrapper {
  clip: rect(0px, 200px, 200px, 100px); /* Hide half of the progress bar */
}
/* Set the sizes of the elements that make up the progress bar */
div.progress_circle.large > div.wrapper > div.circle {
  clip: rect(0px, 100px, 200px, 0px);
   border: 20px solid #3da0ea;
}
div.progress_circle.large > span{
	margin: calc(50% - 5%);
	font-size:15pt;
}

div.progress_circle.table_size {
	width: 25px;
  	height: 25px;
}

div.progress_circle.table_size > div.wrapper {
  clip: rect(0px, 25px, 25px, 12px); /* Hide half of the progress bar */
}
/* Set the sizes of the elements that make up the progress bar */
div.progress_circle.table_size > div.wrapper > div.circle {
  clip: rect(0px, 12px, 25px, 0px);
   border: 2px solid #3da0ea;
}
div.progress_circle.table_size > span{
	margin: calc(50% - 20%) calc(50% - 40%);
	font-size:7pt;
}
div.progress_circle > div.wrapper > div.circle.left {
	-webkit-transition: all 1s ease;
	transition: all 1s ease;
}
/*div.progress_circle:hover > div.wrapper:not(.second) > div.circle {
-webkit-transition: 0s;
	transition: 0s;
	background-color: #3da0ea;
}

div.progress_circle:active > div.wrapper.second > div.circle {
-webkit-transition: 0s;
	transition: 0s;
	background-color: #3da0ea;
}*/

div.progress_circle > div.wrapper > div.circle.right {
	-webkit-transition: all 1s ease;
	transition: all 1s ease;
}

div.progress_circle div.circle.shadow {
  border-color:#eee;
  border-radius: 50%;
  border-style: Solid;
  position: absolute;
  border-width: 10px;
  width: 80px;
  height: 80px;
}
div.progress_circle.small > div.circle.shadow {
   border-width: 5px;
   width: 40px;
   height: 40px;
}
div.progress_circle.table_size > div.circle.shadow {
   border-width: 2px;
   width: 20px;
   height: 20px;
}
/*div.progress_circle > div.wrapper > div.circle.shadow.left {
  clip: auto;
}
div.progress_circle > div.wrapper > div.circle.shadow.right {
  clip: auto;
}*/
/* Using the data attributes for the animation selectors. */
/* Base settings for all animated elements */
/*div.progress_circle.large > div.wrapper > div[data-anim~=base] {
  -webkit-animation-iteration-count: 1;
  -webkit-animation-fill-mode: forwards;
  -webkit-animation-timing-function:linear;
  -webkit-animation-duration: 1s;
}

div.progress_circle.large > div.wrapper[data-anim~=wrapper] {
  -webkit-animation-duration: 0.01s;
  -webkit-animation-delay: 3s;
  -webkit-animation-name: close-wrapper;
}

div.progress_circle.large > div.wrapper > div.circle[data-anim~=left] {
  -webkit-animation-duration: 6s;
  -webkit-animation-name: left-spin;
}

div.progress_circle.large > div.wrapper > div.circle[data-anim~=right] {
  -webkit-animation-duration: 3s;
  -webkit-animation-name: right-spin;
}*/


/* Rotate the right side of the progress bar from 0 to 180 degrees */
/*@-webkit-keyframes right-spin {
  from {
    -webkit-transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(180deg);
  }
}*/
/* Rotate the left side of the progress bar from 0 to 360 degrees */
/*@-webkit-keyframes left-spin {
  from {
    -webkit-transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
  }
}*/
/* Set the wrapper clip to auto, effectively removing the clip */
/*@-webkit-keyframes close-wrapper {
  to {
    clip: rect(auto, auto, auto, auto);
  }
}*/

/*table.main tr > td[data-title]:before{
	content: attr(data-title);
    width: auto;
    background-color: black;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 5px;
    margin-left: 50px;


    position: absolute;
    z-index: 1;
    opacity: 0;
    transition: 1s opacity;
}
table.main tr > td[data-title]:hover:before{
	opacity: 1;
}*/

div.selection-rect{
	position:absolute;
	cursor: default;
	dispaly:none;
	border: 1px Solid blue;
	z-index: 99999;
	background-color: blue;
	opacity: 0.5;
}



/*Graficos*/

div.chart.xticks-labels-rotate45 div.xAxis div.tickLabel {
    transform			: rotate(-45deg);
    -ms-transform		: rotate(-45deg); /* IE 9 */
    -moz-transform		: rotate(-45deg); /* Firefox */
    -webkit-transform	: rotate(-45deg); /* Safari and Chrome */
    -o-transform		: rotate(-45deg); /* Opera */
    margin-top			: 10px;
}
div.chart.xticks-labels-rotate90 div.xAxis div.tickLabel {
    transform			: rotate(-90deg);
    -ms-transform		: rotate(-90deg); /* IE 9 */
    -moz-transform		: rotate(-90deg); /* Firefox */
    -webkit-transform	: rotate(-90deg); /* Safari and Chrome */
    -o-transform		: rotate(-90deg); /* Opera */
    margin-top			: 10px;
}

div.chart > div.view-mode{
	position: absolute;
	top: 0;
	right: 0;
	z-index:2;
}

div.chart div.data-point-label{
    color: #999;
    font-size: 8pt;
}

div.legenda {
    color: #858585;
}
div.chart > .legenda{
	position: absolute;
	top: 0;
	right: 0;
	z-index:1;
	margin-right: 3px;
    margin-top: 3px;
    margin-bottom: 3px;
    max-height: 100%;
    max-height: calc(100% - 6px);
    overflow-y: auto;
    background-color: #fff;
    opacity: 0.9;
}
div.chart.chart-area > .legenda{
	margin-right: 5px;
}

.legenda > table{
	width: 100%;
}
.legenda > table tr > td > input[type=checkbox]{
	display:none;

}
.legenda > table tr.row-legenda > td:nth-child(2){
    /*width: 100%;*/
}
.legenda > table tr.row-legenda.highlight > td:nth-child(2){
	background-color: #e5f3fb;

}
.legenda > table tr.disabled{
	color: #ccc;
}
/*.legenda > table tr.disabled .icon-legenda {
	background-color: #ccc !important;
}*/
.legenda > table tr > td > input[type=checkbox]:not(:checked) + label > div.icon-legenda{
	background-color: #ccc !important;

}
div.chart > div.view-mode > i.fa{
	display: none;
	padding: 5px;
	background-color: #fefefe;
}
div.chart > div.view-mode:hover > i.fa{
	display: block;
}
div.chart > div.view-mode > i.fa:hover{
	display: block;
	color: blue;
}
div.chart > div.view-mode:hover > i.fa.selected{
	color: blue;
	display: block;
}
div.chart > div.view-mode > i.fa.icon-ddl{
	display: block;
}
div.icon-legenda {
	width: 15px;
	height: 15px;
	display: inline-block;
	margin: 2px;
}
div.icon-legenda.circle {
	border-radius: 50%;
}

div.icon-legenda.diamond {
    transform: rotate(45deg);
}

div.chart > div.chart-table{
	position: absolute;
	top: 0;
	left: 0;
	background-color: #fff;
	width: 100%;
	height: 100%;
	overflow: auto;
	z-index:1;
}
div.chart div.yAxis.highlight > div.tickLabel{
	color: #3da0ea;
	font-weight: bold;
}
div.chart-tooltip {
	position:   fixed;
    background: #ffffff;
    background: -moz-linear-gradient(top, #ffffff 0%, #f9f9f9 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#f9f9f9));
    background: -webkit-linear-gradient(top, #ffffff 0%,#f9f9f9 100%);
    background: -o-linear-gradient(top, #ffffff 0%,#f9f9f9 100%);
    background: -ms-linear-gradient(top, #ffffff 0%,#f9f9f9 100%);
    background: linear-gradient(to bottom, #ffffff 0%,#f9f9f9 100%);

    -webkit-border-radius: 3px;
    -moz-border-radius:    3px;
    border-radius: 		   3px;
	border: 			   1px solid #e1e1e1;
    padding: 			   5px 10px;
    font-family: 		   arial, sans-serif;;
    /*font-weight: 		   bold;*/
    font-size:   		   12px;
    color:		 		   #646464;
    z-index: 999999;
}

div.chart > div.media-controls{
	position: absolute;
	top: 20px;
	left: 50%;
	background-color: #000;
	width: auto;
	height: auto;
	z-index:1;
	opacity: 0.5;
	transform: translateX(-50%);
	display:none;
	box-shadow: 0px 0px 10px #000;
}
div.chart:hover > div.media-controls{
	display:block;
}
div.chart > div.media-controls > i{
	font-size: 15pt;
	color: white;
	margin: 10px;
}
div.chart > div.media-controls > i:hover{
	color: #3da0ea;
}
div.chart > div.media-controls > i.fa.fa-pause{
	display:none;
}
div.chart > div.media-controls.playing > i.fa.fa-play{
	display:none;
}
div.chart > div.media-controls.playing > i.fa.fa-pause{
	display:inline-block;
}
div.chart > div.tickLabels > div.xAxis > div.tickLabel.clickable{
	cursor: pointer;
}


div.chart > div.progressbar{
	display: none;
	/* size */
	width: 100%;
	height: 3px;
	/* position and border */
	position: absolute;
	border: 1px solid #ccc;
	margin: 10px;
	background-color: #333333;
	opacity:0.8;
	/* shadow */
	box-shadow: 0 0 10px #ccc;
	top:-5px;
	z-index:2;
	cursor: pointer;
}
div.chart:hover > div.progressbar{
	display:block;
}
div.chart > div.progressbar > div.loading-progress{
	display: none;
	height: 20px;
	width: 0;
	background-color: #9acd00;

}
div.chart > div.progressbar > div.pos{
	position: absolute;
	left: 0;
	top: -10px;
	background-image: url(/Common/Images/navia.ico);
	background-size: contain;
	width: 25px; height: 25px;
}

div.chart.xaxis45deg > div.flot-text > div.flot-x-axis > div.flot-tick-label{
	transform: translateY(20pt) rotate(-45deg);
}
div.chart.xaxis90deg > div.flot-text > div.flot-x-axis > div.flot-tick-label{
	transform: translateX(-15pt)r otate(-90deg);
}


/*Selector de anos/meses*/
div.grid-selector > input.cell[type=checkbox]{
	display:none;
}
div.grid-selector > input.cell[type=checkbox] + label{
	padding: 5px;
	margin: 2px;
	float: left;
}
div.grid-selector > input.cell[type=checkbox]:checked + label{
	background-color:#3da0ea;
	color: white;
}

div.grid-selector > label{
	display:none;
}
div.grid-selector > input.cell[type=checkbox]:checked + label{
	display:inline-block;
}
div.grid-selector.selection > input.cell[type=checkbox] + label{
	display:inline-block;
}
div.grid-selector.selection > i#grid_open{
	display:none;
}
div.grid-selector > i#grid_open{
	padding: 5px;
}
div.grid-selector{
	width: 200px;
}
div.grid-selector.selection{
	max-height: 200px;
	overflow: auto;
}

div.grid-selector.months > label{
	display:none;
	width: 35px;
}




//GRID TABLE para indicadores
div.grid-options{
	width: 400px;
	height: 400px;
}

div.grid-options > div.group{
	display:inline-block;
}

div.grid-options > div.group > div.rows, div.grid-options > div.group > div.columns, div.grid-options > div.group > div.data{
	background-color: #efefef;
	width: 200px;
	height: 100px;
}

div.grid-options  div.field{
	padding: 10px;
	margin: 2px;
	background-color: #fff;
	border: 1px Solid #ccc;
	width: calc(100% - 26px);
}

table.grid tr > th{
	border-bottom: 1px Solid #efefef;
	border-right: 1px Solid #efefef;
	text-align: center;
	vertical-align: top;
	padding:10px;
}
table.grid tr > td{
	border-bottom: 1px Solid #efefef;
	border-right: 1px Solid #efefef;
	text-align: right;
	padding:10px;
}

table.grid tr > th.total{
	background-color: #efefef;
}

table.grid tr > th.colapsed{
	display: none !important;
}


table.grid tr > th:not(.colapsed) + th.total::after{
	content: ' total';
}
table.grid tr > th.colapsed + th.total{
	background-color: transparent;
}
table.grid tr > th.colapsed + th.total::after{
	content: "\f107";
	font-family: FontAwesome;
}
table.grid tr > th[colspan]::after{
	content: "\f106";
	font-family: FontAwesome;
	margin-left: 10px;
}

.sectionTitle {
	width			: 100%;

	vertical-align	: bottom;
	border-bottom	: 1px solid #444444;
	font-size 		: 16px;
	padding-bottom	: 5px;
}

.sectionTitle span {
	padding-left: 5px;
}

.rowSecion {
	background-color: #cccccc !important;
}

.bar {
	height			: 20px;
	width			: 100px;
	display			: inline-block;
	vertical-align	: middle;
	opacity			: 0.5;
}

.bar:hover{
    opacity	: 1;
    cursor	: pointer;
}

input[type=checkbox] + label > div{
	display: inline-block;
}

input.navia[type=checkbox]{
    -webkit-appearance: none;
    box-sizing: unset;
    border: none !important;

}
input.navia[type=checkbox]:focus{
	outline: none !important;
	border: none;
	box-shadow: none;
}
input.navia[type=checkbox]:before{
    font-family: FontAwesome;
    font-size:15pt;
    content: '\f096 ';
    witdh: 30px;
    height: 30px;
    color:#36A4EB;
}

input.navia[type=checkbox]:checked:before{
    content: '\f046 ';
}

input.navia[type=checkbox].incomplete:before{
    content: '\f00c';
}


body.mobile input[type=checkbox]{
    -webkit-appearance: none;
    box-sizing: unset;
    border: none !important;
}
body.mobile input[type=checkbox]:focus{
	outline: none !important;
	border: none;
	box-shadow: none;
}
body.mobile input[type=checkbox]:before{
    font-family: FontAwesome;
    font-size:15pt;
    content: '\f096 ';
    witdh: 30px;
    height: 30px;
    color:#36A4EB;
}
body.mobile input[type=checkbox]:checked:before{
    content: '\f046 ';
}

/****** draggable div *****/
div.can-drag{
    position: relative;
}
div.can-drag.dragged {
    position:absolute;
    background-color: #fff;
    z-index: 10;
    border: 1px Solid #ccc;
    -moz-box-shadow:    0px 5px 15px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.5);
    box-shadow:         0px 5px 15px rgba(0, 0, 0, 0.5);
    padding-left: 0 !important;
    padding-bottom: 0 !important;
    padding-right: 0 !important;
    transition: 0s all !important;
    margin: 0 !important;
    height: 500px;
    min-width: 220px;
}
div.can-drag > div.content {
    display:block;
    position: relative;
}
div.can-drag.dragged > div.content {
    display:block;
    position: relative;
    overflow-y: auto;
    overflow-x: hidden;
    height: 80%;
    width: 100%;
}
div.can-drag i.fa.icon-drag{
    position: absolute;
    right: 0;
    top: 0;
    font-size   : 19.5px;
    font-weight : 700;
    line-height : 1;
    color       : #ccc;
    text-shadow : 0px 1px 0px #FFF;
    float       : right;
    margin-left:20px;
}
div.can-drag i.fa.icon-drag:hover {
    color  : #ed5956;
    cursor : pointer;
}
div.can-drag.dragged i.fa.icon-drag{
    display: none;
}
div.can-drag div.div-header{
    display:none;
    position: relative;
    margin-left: 5px;
    margin-right: 5px;
    width: 100%;
    width: calc(100% - 50px);
}
div.can-drag.dragged div.div-header{
    display:block;
}
div.can-drag.dragged div.ui-draggable-handle{
    display:block;
    position: relative;
    top: 0;
    background-color: #fff;
    border-bottom: 2px Solid #ccc;
    padding:10px 20px;
    text-align: right;
    z-index: 10;
    font-size: 15pt;
}
div.can-drag.dragged div.ui-draggable-handle > i.fa{
    color       : #ccc;
}
div.can-drag.dragged div.ui-draggable-handle > i.fa:hover{
    color  : #ed5956;
    cursor : pointer;
}

div.can-drag.dragged > *{
    padding-top: 50px;
}

div.chart.pie.chart-animation > canvas {
  animation-name: open-circle;
  animation-duration: 1s;
}

/*div.chart.pie.chart-animation {
  animation-name: open-circle;
  animation-duration: 1s;
}*/

@-webkit-keyframes open-circle  {
0% {
clip-path: polygon(50% 50%, 50% 0%, 100% 0%, 100% 0%, 100% 0%, 100% 0%, 100% 0%, 100% 0%);
}
12% {
clip-path: polygon(50% 50%, 50% 0%, 100% 0%, 100% 0%, 100% 0%, 100% 0%, 100% 0%, 100% 0%, 100% 0%, 100% 0%);
}
25% {
clip-path: polygon(50% 50%, 50% 0%, 100% 0%, 100% 50%, 100% 50%, 100% 50%, 100% 50%, 100% 50%, 100% 50%, 100% 50%);
}
37% {
clip-path: polygon(50% 50%, 50% 0%, 100% 0%, 100% 50%, 100% 100%, 100% 100%, 100% 100%, 100% 100%, 100% 100%, 100% 100%);
}
50% {
clip-path: polygon(50% 50%, 50% 0%, 100% 0%, 100% 50%, 100% 100%, 50% 100%, 50% 100%, 50% 100%, 50% 100%, 50% 100%);
}
62% {
clip-path: polygon(50% 50%, 50% 0%, 100% 0%, 100% 50%, 100% 100%, 50% 100%, 0% 100%, 0% 100%, 0% 100%, 0% 100%);
}
75% {
clip-path: polygon(50% 50%, 50% 0%, 100% 0%, 100% 50%, 100% 100%, 50% 100%, 0% 100%, 0% 50%, 0% 50%, 0% 50%);
}
87% {
clip-path: polygon(50% 50%, 50% 0%, 100% 0%, 100% 50%, 100% 100%, 50% 100%, 0% 100%, 0% 50%, 0% 0%, 0% 0%);
}
100% {
clip-path: polygon(50% 50%, 50% 0%, 100% 0%, 100% 50%, 100% 100%, 50% 100%, 0% 100%, 0% 50%, 0% 0%, 50% 0%);
}
}


/*
.left-talk-bubble {
    background: #fafafa;
    position: relative;
    -moz-border-radius:    10px;
    -webkit-border-radius: 10px;
    border-radius:         10px;
    padding: 10px;
    min-width:100px;
    min-height:80px;
}
.left-talk-bubble:before {
    content:"";
    position: absolute;
    right: 100%;
    top: 26px;
    width: 0;
    height: 0;
    border-top: 13px solid transparent;
    border-right: 26px solid #fafafa;
    border-bottom: 13px solid transparent;
    z-index:		       10001;
}*/

.talk-bubble {
    background: #fff;
    position: relative;
    -moz-border-radius:    10px;
    -webkit-border-radius: 10px;
    border-radius:         10px;
    padding: 10px;
    min-width:100px;
    min-height:80px;
    border: 		       1px solid #30a9e7;
	z-index:		       10000;
	box-sizing: border-box;
}
.talk-bubble:before {
    box-sizing: border-box;
    background: #fefefe;
    content:"";
    position: absolute;
    width: 26px;
    height: 26px;
    z-index:		       10001;

}
.talk-bubble:after {
    box-sizing: border-box;
    background: #30a9e7;
    content:"";
    position: absolute;
    width: 26px;
    height: 27px;
    z-index:		       10000;
    border: 		       1px solid #30a9e7;
}

.talk-bubble.o-left:before {
    clip-path: polygon(0 50%, 100% 0%, 100% 100%);
    left: -25px;
    top: 26px;
}
.talk-bubble.o-left:after {
    clip-path: polygon(0 50%, 100% 0%, 100% 100%);
    top: 26px;
    left: -26px;
}

.talk-bubble.o-right:before {
    clip-path: polygon(0% 0%, 100% 50%, 0 100%);
    right: -25px;
    top: 26px;
}
.talk-bubble.o-right:after {
    clip-path: polygon(0% 0%, 100% 50%, 0 100%);
    top: 26px;
    right: -26px;
}

.talk-bubble.o-top:before {
    clip-path: polygon(0% 100%, 50% 0%, 100% 100%);
    left: 26px;
    top: -25px;
}
.talk-bubble.o-top:after {
    clip-path: polygon(0% 100%, 50% 0%, 100% 100%);
    top: -27px;
    left: 26px;
}

.talk-bubble.o-bottom:before {
    clip-path: polygon(0% 0%, 100% 0%, 50% 100%);
    left: 26px;
    bottom: -25px;
}
.talk-bubble.o-bottom:after {
    clip-path: polygon(0% 0%, 100% 0%, 50% 100%);
    bottom: -27px;
    left: 26px;
}




/* Flashlight Overlay */
.flashlight {
    position: relative;
  cursor: none;
  --cursorX: 50vw;
  --cursorY: 50vh;
}
.flashlight:before {
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  pointer-events: none;
  background: radial-gradient(
    circle 10vmax at var(--cursorX) var(--cursorY),
    rgba(0,0,0,0) 0%,
    rgba(0,0,0,.5) 80%,
    rgba(0,0,0,.95) 100%
  )
}

*.topbar-fixed{
    transition: 1s;
}
body.scrolled *.topbar-fixed{
    position: fixed;
    top: 47px;
    left: 0;
    width: 100%;
    background: white;
    padding: 10pt;
    font-size: 20pt;
    webkit-box-shadow: 	   rgba(102,102,102,0.3) 0 1px 4px;
	-moz-box-shadow:   	   rgba(102,102,102,0.3) 0 1px 4px;
	box-shadow: 		   rgba(102,102,102,0.3) 0 1px 4px;
	z-index: 5001;
}


div.list-header{
    margin: 1px;
    color: #FFFFFF;
    padding: 10px 10px;
    cursor: pointer;
    position: relative;
    background-color: #fff;
    color: #000;
    border-bottom: 1px Solid #ccc;
    font-size: 10pt;
    text-transform: uppercase;
}

div.list-header::after{
    content: '\f078';
    font-family: 'FontAwesome';
    float: right;
}
div.list-header.expanded::after{
    content: '\f077';
}

div.list-container{
    padding: 0px 10px;
    height: 0;
    max-height: 0;
    transition: 0.5s;
    overflow-y: hidden;
    width: 100%;
    width: calc(100% - 20px);

}

div.list-header.expanded + div.list-container{
    padding: 5px 10px;
    height: auto;
    max-height: 100%;
    width: calc(100% - 20px);
}


div[disabled] {
   color: #ddd;
   pointer-events: none;
   opacity: 0.5;
}
div.disabled {
   color: #ddd;
   pointer-events: none;
   opacity: 0.5;
}
ul.steps > li.disabled {
   pointer-events: none;
   opacity: 0.5;
}

/** WIDGET RELOGIO TZ*/
tr.clock {
    text-align: center;
    padding-right: 5px;
    vertical-align: middle;
}

.clock span {
    font-weight: normal;
}
.clock span:hover {
    cursor: pointer;
}
.divWidgetRelogioTZ {
	width			: 100%;
	height			: 100%;
	text-align		: right;
	font-size		: 11px;
	display			: inline-block;
/*	background-color: #3da0ea;*/
}
.clockinfo {
    text-transform: lowercase
}
.clockinfo.thin {
    font-weight: normal;
}
.clockinfo.thick {
    font-weight: bold;
}
.ui-sortable-placeholder { border: 1px dotted black; visibility: visible !important; height: 50px !important; }
.ui-sortable-placeholder * { visibility: hidden; }

div.relogioTZ {
    text-align  : center;
}
div.relogioTZ > * {
    display : table-cell;
}
/*
div.relogioTZ > div#dvWeather > * {
    width   : 100% !important;
    height  : auto !important;
}*/

table.main tr td.color-id{
    padding: 0px;
    background-color: #000000;
    width: 3px;
    white-space: nowrap;
    max-width: 3px;
    min-width: 3px;
}
*.hide{
    display:none;
}

div.input-var input, div.input-var select{
	margin-bottom:2px;
}