/*****************************************/
/*              SKIN PORTAL LIGHT        */
/*****************************************/
/************************************************************/
/*Para personalizar o CSS do Webrun, recomendamos a criação */
/*de um arquivo chamado custom.css dentro desta pasta.      */
/*                                                          */
/* OBSERVAÇÃO: Adicionar !important ao final do atributo.   */
/* Exemplo: background: red!important;                      */
/************************************************************/
/*****************************************/
/*              Font Import              */
/*****************************************/
.WFRIframeForm {
  -webkit-box-shadow: 1px 1px 4px 1px rgba(25, 25, 25, 0.65)!important;
  -moz-box-shadow: 1px 1px 4px 1px rgba(25, 25, 25, 0.65)!important;
  -o-box-shadow: 1px 1px 4px 1px rgba(25, 25, 25, 0.65)!important;
  box-shadow: 1px 1px 4px 1px rgba(25, 25, 25, 0.65)!important;
}

.WFRIframeForm {
  width: auto !important;
  background-color: #D2D2D2!important;
  border: solid 1px #D2D2D2!important;
  border-top: none!important;
  border-radius: 4px !important;
}

.WFRIframeForm-Active {
  background-color: #f7f7f7!important;
  border: solid 1px #f1f1f1!important;
  border-top: none !important;
}

.WFRIframeForm .Title {
  color: #676767!important;
}

#minimizedFloatingDivs .WFRIframeForm .Title {
  left: 0;
} 

@font-face {
  font-family: 'Open Sans';
  src: url('fonts/OpenSans-Regular-webfont.eot');
  src: url('fonts/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
       url('fonts/OpenSans-Regular-webfont.woff') format('woff'),
       url('fonts/OpenSans-Regular-webfont.ttf') format('truetype'),
       url('fonts/OpenSans-Regular-webfont.svg#OpenSansRegular') format('svg');
  font-weight: normal;
  font-weight: 400;
  font-style: normal;
}

/* Italic */
@font-face {
  font-family: 'Open Sans';
  src: url('fonts/OpenSans-Italic-webfont.eot');
  src: url('fonts/OpenSans-Italic-webfont.eot?#iefix') format('embedded-opentype'),
       url('fonts/OpenSans-Italic-webfont.woff') format('woff'),
       url('fonts/OpenSans-Italic-webfont.ttf') format('truetype'),
       url('fonts/OpenSans-Italic-webfont.svg#OpenSansItalic') format('svg');
  font-weight: normal;
  font-weight: 400;
  font-style: italic;
}

/* Light */
@font-face {
  font-family: 'Open Sans';
  src: url('fonts/OpenSans-Light-webfont.eot');
  src: url('fonts/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'),
       url('fonts/OpenSans-Light-webfont.woff') format('woff'),
       url('fonts/OpenSans-Light-webfont.ttf') format('truetype'),
       url('fonts/OpenSans-Light-webfont.svg#OpenSansLight') format('svg');
  font-weight: 200;
  font-style: normal;
}

#box-icons {
position: relative;
top: 0 !important;                                      
width: 100% !important;
height: 260px !important;
margin-right: 165px;
overflow: auto;
}

/* Light Italic */
@font-face {
  font-family: 'Open Sans';
  src: url('fonts/OpenSans-LightItalic-webfont.eot');
  src: url('fonts/OpenSans-LightItalic-webfont.eot?#iefix') format('embedded-opentype'),
       url('fonts/OpenSans-LightItalic-webfont.woff') format('woff'),
       url('fonts/OpenSans-LightItalic-webfont.ttf') format('truetype'),
       url('fonts/OpenSans-LightItalic-webfont.svg#OpenSansLightItalic') format('svg');
  font-weight: 200;
  font-style: italic;
}

/* Semibold */
@font-face {
  font-family: 'Open Sans';
  src: url('fonts/OpenSans-Semibold-webfont.eot');
  src: url('fonts/OpenSans-Semibold-webfont.eot?#iefix') format('embedded-opentype'),
       url('fonts/OpenSans-Semibold-webfont.woff') format('woff'),
       url('fonts/OpenSans-Semibold-webfont.ttf') format('truetype'),
       url('fonts/OpenSans-Semibold-webfont.svg#OpenSansSemibold') format('svg');
  font-weight: 500;
  font-style: normal;
}

/* Semibold Italic */
@font-face {
  font-family: 'Open Sans';
  src: url('fonts/OpenSans-SemiboldItalic-webfont.eot');
  src: url('fonts/OpenSans-SemiboldItalic-webfont.eot?#iefix') format('embedded-opentype'),
       url('fonts/OpenSans-SemiboldItalic-webfont.woff') format('woff'),
       url('fonts/OpenSans-SemiboldItalic-webfont.ttf') format('truetype'),
       url('fonts/OpenSans-SemiboldItalic-webfont.svg#OpenSansSemiboldItalic') format('svg');
  font-weight: 500;
  font-style: italic;
}

/* Bold */
@font-face {
  font-family: 'Open Sans';
  src: url('fonts/OpenSans-Bold-webfont.eot');
  src: url('fonts/OpenSans-Bold-webfont.eot?#iefix') format('embedded-opentype'),
       url('fonts/OpenSans-Bold-webfont.woff') format('woff'),
       url('fonts/OpenSans-Bold-webfont.ttf') format('truetype'),
       url('fonts/OpenSans-Bold-webfont.svg#OpenSansBold') format('svg');
  font-weight: bold;
  font-weight: 700;
  font-style: normal;
}

/* Bold Italic */
@font-face {
  font-family: 'Open Sans';
  src: url('fonts/OpenSans-BoldItalic-webfont.eot');
  src: url('fonts/OpenSans-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
       url('fonts/OpenSans-BoldItalic-webfont.woff') format('woff'),
       url('fonts/OpenSans-BoldItalic-webfont.ttf') format('truetype'),
       url('fonts/OpenSans-BoldItalic-webfont.svg#OpenSansBoldItalic') format('svg');
  font-weight: bold;
  font-weight: 700;
  font-style: italic;
}

/* Extra Bold */
@font-face {
  font-family: 'Open Sans';
  src: url('fonts/OpenSans-ExtraBold-webfont.eot');
  src: url('fonts/OpenSans-ExtraBold-webfont.eot?#iefix') format('embedded-opentype'),
       url('fonts/OpenSans-ExtraBold-webfont.woff') format('woff'),
       url('fonts/OpenSans-ExtraBold-webfont.ttf') format('truetype'),
       url('fonts/OpenSans-ExtraBold-webfont.svg#OpenSansExtrabold') format('svg');
  font-weight: 900;
  font-style: normal;
}

/* Extra Bold Italic */
@font-face {
  font-family: 'Open Sans';
  src: url('fonts/OpenSans-ExtraBoldItalic-webfont.eot');
  src: url('fonts/OpenSans-ExtraBoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
       url('fonts/OpenSans-ExtraBoldItalic-webfont.woff') format('woff'),
       url('fonts/OpenSans-ExtraBoldItalic-webfont.ttf') format('truetype'),
       url('fonts/OpenSans-ExtraBoldItalic-webfont.svg#OpenSansExtraboldItalic') format('svg');
  font-weight: 900;
  font-style: italic;
}

/* -- Maker web font-icon */
@font-face {
font-family: 'webicons-maker';
src: url('fonts/webicons-maker.eot?24407687');
src: url('fonts/webicons-maker.eot?24407687#iefix') format('embedded-opentype'),
     url('fonts/webicons-maker.woff2?24407687') format('woff2'),
     url('fonts/webicons-maker.woff?24407687') format('woff'),
     url('fonts/webicons-maker.ttf?24407687') format('truetype'),
     url('fonts/webicons-maker.svg?24407687#webicons-maker') format('svg');
font-weight: normal;
font-style: normal;
}

.HTMLNavigationFormButton a:before {
font-family: "webicons-maker";
margin-top: 14px;
font-style: normal;
font-weight: 100;
font-size: 19px;
speak: none;
display: inline-block;
color: #89949E;
text-decoration: inherit;
width: 1em;
text-align: center;
font-variant: normal;
text-transform: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

.HTMLNavigationFormButton:hover a:before {
color: #6B7680;
}

* {
box-sizing: border-box;
}

body {
font-family: 'Open Sans', sans-serif, arial;
font-weight: 400;
font-style: normal;
font-size: 11px;
color: #6e6e6e;
background: #fefefc;
}

/*******************************************/
/*    AJUSTE DOS INPUTS DENTRO DA GRADE    */
/*******************************************/
.listGrid {
  box-sizing: content-box;
}

.listGrid input:not([type='checkbox']),  .listGrid select{
  height: 100%!important;
  border-radius: 0!important;
  width: 100% !important;
}
.listGrid .HTMLButton button {
    border-radius: 0!important;
    right: 0!important;
}
.listGrid .HTMLCheckBox {
  background-color: transparent;
}
.textItemLite,
.textItemLiteRTL,
.textItemLiteFocused,
.textItemLiteFocusedRTL,
.textItemLiteDisabled { 
  height: 100% !important;
  font-size: 0.8rem !important;   
}

.textItemLiteOver,
.textItemLiteFocused {
  -webkit-box-shadow: 0 0 5px 0 #47c256;
  box-shadow: 0 0 5px 0 #47c256;
  border-color: #47c256;
  height: 100% !important;
  font-size: 0.8rem !important;
}

.textItemLiteFocusedOver {
  -webkit-box-shadow: 0 0 5px 0 #47c256, inset 0 0 5px 0 #47c256;
  box-shadow: 0 0 5px 0 #47c256, inset 0 0 5px 0 #47c256;
  border-color: #47c256;
  height: 100% !important;
}

/* Deleta componente original da grade  na trasição*/
.grid .textItemLite,
.grid .textItemLiteRTL,
.grid .textItemLiteFocused,
.grid .textItemLiteFocusedRTL,
.grid .textItemLiteDisabled,
.grid .textItemLiteOver,
.grid .textItemLiteFocusedOver {
  width: 100% !important;
  height: 100% !important;
  visibility: visible !important;
  font-size: 0.8rem !important;  
}

.grid .selectItemLiteText, 
.grid .selectItemLiteTextRTL, 
.grid .selectItemLiteTextFocused, 
.grid .selectItemLiteTextFocusedRTL, 
.grid .selectItemLiteTextDisabled,
.grid .selectItemLiteTextDisabledRTL, 
.grid .selectItemLiteTextError, 
.grid .selectItemLiteTextErrorRTL, 
.grid .selectItemLiteTextPending, 
.grid .selectItemLiteTextPendingRTL, 
.grid .selectItemLiteTextPendingFocused, 
.grid .selectItemLiteTextPendingFocusedRTL, 
.grid .selectItemLiteTextPendingDisabled, 
.grid .selectItemLiteTextPendingDisabledRTL, 
.grid .selectItemLiteTextPendingError, 
.grid .selectItemLiteTextPendingErrorRTL, 
.grid .selectItemLiteTextHint, 
.grid .selectItemLiteTextHintRTL,  
.grid .selectItemLiteTextDisabledHint, 
.grid .selectItemLiteTextDisabledHintRTL {
   box-sizing: content-box;
   font-size: 0.8rem !important;
 }
 
 .gridFilterModal {
  background: rgba(0, 0, 0, 0.4117647058823529);
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  transition: 0.7s;
  position: absolute;
  top: 0;
  z-index: 9999;
}

.gridFilterModalContent {
  height: auto;
  background-color: white;
  overflow: auto;  
  min-height: 70px;
}

.gridFilterContainer {
  width: 90%;
  height: auto;
  min-height: 150px;  
}

.gridFilterStatusBar {
  height: 30px;
  color: white;
  background-color: #47c256;
}

.gridFilterSpan {
  font-family: roboto;
  font-size: 0.9rem;
  position: relative;
  top: 7px;
  padding: 3px;
}


.gridFilterClose {
  width: 30px;
  height: 30px;
  background-color: transparent;
  position: relative;
  float: right;
  text-align: center;
  cursor: pointer;
  border-left: 1px solid;
}

.gridFilterClose > span {
  width: inherit;
  height: inherit;
  position: relative;
  top: 8px;
}

.gridFilterClose:hover {
  opacity: 0.7;
}

.gridContentFilterActions {
  height: 35px;
  background-color: #ffffff;
  float: unset;
  border-top: 1px solid #d8d6d6;
}

.gridActionFilter {
  position: relative;
  float: right;
  margin-right: 2px; 
}

.gridActionsFilter {
  width: 70%;
  position: relative;
  float: left;
}


@media screen and (max-width: 422px){
body {
    overflow: hidden!important;
}
}

.component {
background: #e0dfe3;
}

.buttonComponent {
background: #e0dfe3;
}

.navigation {
background: #F2F2EE;
}

a {
text-decoration: none;
color: #62727B;
}
a:focus {
outline: none;
}
a:hover {
text-decoration: none;
color: #000000;
}
a.cont {
text-decoration: none;
color: #000000;
}
a.cont:hover {
text-decoration: none;
color: #000000;
}

img[src=""] {
border: 1px solid #EFEFEF;
}

td {
font-family: 'Open Sans', sans-serif, arial;
font-size: 11px;
color: #000000;
}
.b {
font-size: 11px;
font-weight: bold;
}
.u {
font-weight: bold;
text-decoration: underline;
}

.des {
color: #FE5400;
}

.label {
font-family: 'Open Sans', sans-serif, arial;
font-size: 11px;
}

::selection { background: #1f6a8f; color: #fff; } 
::-moz-selection { background: #1f6a8f; color: #fff; }

.edit {
font-family: 'Open Sans', sans-serif, arial;
font-size: 11px;
border-right: 1px solid #D3D1D1;
border-left: 1px solid #D3D1D1;
border-top: 1px solid #D3D1D1;
border-bottom: 1px solid #D3D1D1;
padding-left: 8px;
}

.editMark {
font-family: 'Open Sans', sans-serif, arial;
font-size: 11px;
border-right: 1px solid #ff0000;
border-left: 1px solid #ff0000;
border-top: 1px solid #ff0000;
border-bottom: 1px solid #ff0000;
background: #E6F2FF;
}

.button {
font-family: 'Open Sans', sans-serif, arial;
font-size: 11px;
border-right: 1px solid #D3D1D1;
border-left: 1px solid #D3D1D1;
border-top: 1px solid #D3D1D1;
border-bottom: 1px solid #D3D1D1;
outline: none;
}

.duallist {
font-family: 'Open Sans', sans-serif, arial;
font-size: 11px;
border-right: 1px solid #D3D1D1;
border-left: 1px solid #D3D1D1;
border-top: 1px solid #D3D1D1;
border-bottom: 1px solid #D3D1D1;
}

.duallistMark {
font-family: 'Open Sans', sans-serif, arial;
font-size: 11px;
border-right: 1px solid #ff0000;
border-left: 1px solid #ff0000;
border-top: 1px solid #ff0000;
border-bottom: 1px solid #ff0000;
background: #E6F2FF;
}

.lookup {
font-family: 'Open Sans', sans-serif, arial;
font-size: 11px;
border-right: 1px solid #D3D1D1;
border-left: 1px solid #D3D1D1;
border-top: 1px solid #D3D1D1;
border-bottom: 1px solid #D3D1D1;
padding-left: 8px;
}

.lookupMark {
font-family: 'Open Sans', sans-serif, arial;
font-size: 11px;
border-right: 1px solid #ff0000;
border-left: 1px solid #ff0000;
border-top: 1px solid #ff0000;
border-bottom: 1px solid #ff0000;
background: #E6F2FF;
}

.editLogon {
font-family: 'Open Sans', sans-serif, arial;
font-size: 11px;
font-weight: bold;
border-right: 1px solid #000000;
border-left: 1px solid #000000;
border-top: 1px solid #000000;
border-bottom: 1px solid #000000;
}

.calendar{
height: 100%;
}
.calendar>tbody>tr>td>table {
font-size: 12px;
background: #cccccc;
width: 101%;
color: #000000;
}

.calendarHeader {
color: #000000;
background: #f2f2f2;
}

.calendarLine1 {
color: #000000;
background: #ffffff;
}

.calendarLine2 {
color: #000000;
background: #ffffff;
}

.lookupSearch {
font-family: 'Open Sans', sans-serif, arial;
font-size: 11px;
border-right: 1px solid #D3D1D1;
border-left: 1px solid #D3D1D1;
border-top: 0px solid #FFFFFF;
border-bottom: 1px solid #D3D1D1;
}

.lookupSearchInput {
font-family: 'Open Sans', sans-serif, arial;
font-size: 11px;
border-right: 0px solid #D3D1D1;
border-left: 0px solid #D3D1D1;
border-top: 1px solid #D3D1D1;
border-bottom: 1px solid #D3D1D1;
background: #E5E5E5;
}

.tabButton {
background: #F6F6F4;
}

.tabBack {
background: #ffffff;
border-top: 1px solid #D3D1D1;
}

.clickText {
text-decoration: none;
color: #000000;
}
.clickText:hover {
text-decoration: none;
color: #000000;
}
.clickText.cont {
text-decoration: none;
color: #000000;
}
.clickText.cont:hover {
text-decoration: none;
color: #000000;
}

.cur {
cursor: pointer;
}

.grid {
margin: 1px;
}

.gridMark {
border: 1px solid #4ABA58;
margin: 0px;
border-radius: 4px;
}

.gridDiv {
border: 1px solid #C7C7C7;
border-radius: 2px;
}

.gridDiv:hover {
border: 1px solid #A0A0A0;
}
.exitProgressBar {
background: #FFFFFF;
width: 100%;
height: 100%;
border-top: 1px solid #666666;
border-left: 1px solid #666666;
border-right: 1px solid #666666;
border-bottom: 1px solid #D3D1D1;
display: none;
cursor: pointer;
}

.divProgressBar {
z-index: 99999999;
position: absolute;
width: 100%;
height: 100%;
display: block;
}

.searchInteger {text-align: right;}
.searchDouble {text-align: right;}
.searchTime {text-align: left;}
.searchDate {text-align: left;}
.searchBoolean {text-align: left;}
.searchString {text-align: left;}

input, textarea {
box-sizing: border-box;
-moz-box-sizing: border-box;
}

textarea {
overflow: auto;
}

/*****************************************/
/* HTMLButton: Componente Botão          */
/*****************************************/
.HTMLButton button {
border: none;
border-radius: 3px;
cursor: pointer;
color: #fff;
background: #47C156;
cursor: pointer;
padding: 0;
vertical-align: middle;
outline: none;
overflow: hidden;
}

.HTMLButton button:not([class*="HTMLNavigation"] button){
-webkit-transition: all 0.2s;
-moz-transition: all 0.2s;
-o-transition: all 0.2s;
-ms-transition: all 0.2s;
transition: all 0.2s;
}

.HTMLButton button:hover {
background: #4ED05E;
border: solid 1px #348C3F;
}

.HTMLButton button:focus {
border: 2px solid #318C3C;

}

.HTMLButton button:active {
background: #399E45;
}

.HTMLButton button:disabled {
cursor: default;
background: #EAEAEA;
color: #A1AAB3;
border: 1px solid #D9DDE0;
outline: none;
}

.HTMLButton button[readonly=readonly] {
cursor: default;
}

.HTMLButton button,.HTMLButton span {
font-family: 'Open Sans', sans-serif, arial;
font-weight: 500;
}

.HTMLButton span {vertical-align: middle;}
.HTMLButton img {vertical-align: middle;}

/*****************************************/
/* Div que bloqueia acesso ao formulário */
/*****************************************/
.formViewDiv {
background: #FFFFFF;
filter: alpha(opacity = 1);
opacity: 0;
position: absolute;
z-index: 99998;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
}

/*****************************************/
/* HTMLTabArea: Área do Form/Componentes */
/*****************************************/
.HTMLTabArea {
background: #fefefc;
height: 100%;
left: 0px;
z-index: 1;
display: none;
position: absolute;
width: 100%;
-moz-user-select: none;
-ms-user-select: none;
-webkit-user-select: none;
user-select: none;
}

/*****************************************/
/* HTMLTab: Botão das Abas (formulário)  */
/*****************************************/
.HTMLTab {
background: #F9F9F9;
color: #A2A9B9;
font-weight: 500;
cursor: pointer;
border-top-left-radius: 4px;
border-top-right-radius: 4px;
display: inline;
float: left;
height: 21px;
margin-right: 3px;
padding-left: 4px;
padding-right: 4px;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
box-shadow: 0px -1px 1px 1px rgba(61, 63, 68, 0.1);
z-index: 1;
}

.HTMLTab div {
float: left;
}

.HTMLTab span,.HTMLTab img {
vertical-align: middle;
}

.HTMLTab-Selected {
position: relative;
font-weight: 500;
color: #646C8C;
background: #fefefc;
float: left;
height: 21px;
border-top-left-radius: 4px;
border-top-right-radius: 4px;
margin-right: 3px;
display: inline;
line-height: 20px;
cursor: pointer;
padding-left: 4px;
padding-right: 4px;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-box-shadow: 0px -4px 4px 2px rgba(61, 63, 68, 0.24);
box-shadow: 3px -2px 7px -1px rgba(61, 63, 68, 0.32);
z-index: 9;
}

.HTMLTab-Selected div {
float: left;
}

/*****************************************/
/* HTMLTabController: Área das Abas      */
/*****************************************/
.HTMLTabController {
top: 0px;
left: 0px;
width: 100%;
/*height: initial !important;*/
z-index: 2;
position: absolute;
background-color: #E9ECEC;
}

/*****************************************/
/* HTMLTabContainer: Container da Aba    */
/*****************************************/
.HTMLTabContainer {
width: 100%;
position: absolute;
z-index: 1;
}

/*****************************************/
/* HTMLGroupBox: Componente Moldura      */
/*****************************************/
.HTMLGroupBox-Top {
border-top: 1px solid #BFB8BF;
border-left: 0px solid !important;
border-right: 0px solid !important;
border-bottom: 0px solid !important;
border-radius: 0px!important;
}

.HTMLGroupBox-Left {
border-left: 1px solid #BFB8BF;
border-top: 0px solid !important;
border-right: 0px solid !important;
border-bottom: 0px solid !important;
border-radius: 0px!important;
}

.HTMLGroupBox-Right {
border-right: 1px solid #BFB8BF;
border-top: 0px solid !important;
border-left: 0px solid !important;
border-bottom: 0px solid !important;
border-radius: 0px!important;
}

.HTMLGroupBox-Bottom {
border-bottom: 1px solid #BFB8BF;
border-top: 0px solid !important;
border-left: 0px solid !important;
border-right: 0px solid !important;
border-radius: 0px!important;
}

.HTMLGroupBox {
border: 1px solid #D3D1D1;
box-sizing: border-box;
border-radius: 2px;
width: 100%;
}

.HTMLGroupBox-Box-Inset {
border: 1px inset #BFB8BF;
border-radius: 4px;
}

.HTMLGroupBox-Box-Outset {
border: 1px outset #BFB8BF;
border-radius: 4px;
}

.HTMLGroupBox-None {
border-style: none;
}

/*****************************************/
/* HTMLRadioGroup: Componente Opções     */
/*****************************************/
.HTMLRadioGroup .HTMLLabel>div>div {
background: white;
}

.HTMLRadioGroup #HTMLRadioGroupOptions {
height: 100%;
display: table;
width: 100%;
}

.HTMLRadioGroup #HTMLRadioGroupOptionsRow {
display: table-row;
}
.HTMLRadioGroup #HTMLRadioGroupOption {
margin: 2px 2px;
display: table-cell;
vertical-align: middle;
}

.HTMLRadioGroup #HTMLRadioGroupOption input:enabled {
cursor: pointer;
}

.HTMLRadioGroup #HTMLRadioGroupOption input:disabled {
cursor: default;
}

.HTMLRadioGroup #HTMLRadioGroupOption label {
font-family: 'Open Sans', sans-serif, arial;
font-size: 11px;
cursor: pointer;
}

/*****************************************/
/* HTMLLabel: Componente Text            */
/*****************************************/
.HTMLLabel {
display: table !important;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}

.HTMLLabel>div {
display: table-cell;
}

.HTMLLabel>div>div {
cursor: default;
background: white;
}

/*****************************************/
/* HTMLEdit: Componente Edit             */
/*****************************************/
.HTMLEdit input:not([type='checkbox']){
font-family: 'Open Sans', sans-serif, arial;
font-size: 12px;
font-weight: 500;
color: #555B61;
background: #FFFFFF;
border-right: 1px solid #D3D1D1;
border-left: 1px solid #D3D1D1;
border-top: 1px solid #D3D1D1;
border-bottom: 1px solid #D3D1D1;
border-radius: 4px;
padding-left: 8px;
padding-right: 8px;
outline: none;
-webkit-box-shadow: inset 0 2px 4px 0 rgba(66, 66, 66, 0.1);
-moz-box-shadow: inset 0 2px 4px 0 rgba(66, 66, 66, 0.1);
-o-box-shadow: inset 0 2px 4px 0 rgba(66, 66, 66, 0.1);
-ms-box-shadow: inset 0 2px 4px 0 rgba(66, 66, 66, 0.1);
box-shadow: inset 0 2px 4px 0 rgba(66, 66, 66, 0.1);
height: 100%!important;
width: 100%!important;
}

.HTMLEdit input:hover {
border: 1px solid #C7C7C7;
}

.HTMLEdit input:focus {
border: 1px solid #4ABA58;
outline: none;
}

.HTMLEdit input:disabled {
background: #ebebe4;
border-color: #D3D1D1 !important;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-box-shadow: none;
-moz-box-shadow: none;
-o-box-shadow: none;
-ms-box-shadow: none;
box-shadow: none;
}

.HTMLEdit input[readonly=readonly] {
background: #ECFFE8 !important;
border-color: #B4CAB0 !important;
-webkit-box-shadow: none;
-moz-box-shadow: none;
-o-box-shadow: none;
-ms-box-shadow: none;
box-shadow: none;
}

.HTMLEdit input[readonly=readonly]:hover {
border-color: #9BBB95 !important;
}

.HTMLEdit font {
cursor: default;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
white-space: nowrap;
}

.HTMLEditCalendar {
position: absolute;
width: 240px;
height: 160px;
z-index: 999999;
box-shadow: 10px 10px 15px -2px #888888;
}

.HTMLEditCalendar > iframe {
border: 1px solid #cccccc;
width: 100%;
height: 100%;
}

.HTMLEditCalendarLock {
position: absolute;
width: 100%;
height: 100%;
z-index: 999998;
opacity: 0.1;
}

/*****************************************/
/* HTMLNavigationForm: Barra de Navegação*/
/*****************************************/

.HTMLNavigationFormButton, .HTMLNavigationButton {
width: 40px;
display: inline-block;
}

.HTMLNavigationForm {
width: 100%;
height: 60px;
padding-top: 0;
position: absolute;
top: 0px;
text-align: center;
-moz-user-select: none;
-ms-user-select: none;
-webkit-user-select: none;
user-select: none;
}

.HTMLNavigationForm img {
position: absolute;
left: 0;
top: 0;
width: auto;
height: 45px;
}

.HTMLNavigationForm a {
padding: 25px 8px;
}

.HTMLNavigationForm .HTMLNavigationFormButton, .HTMLNavigationButton {
display: inline-block;
position: relative;
cursor: pointer;
}

/*Barra de Fundo da Navegação*/
.HTMLNavigationFormBar {
width: 100%;
height: 50px;
background: #E9ECEC;
}

/*Botões da Barra de Navegação*/
[class*="-Des"],
[class*="-Des"] a {
cursor: default !important;
}

.HTMLNavigationFormButton-Include a:before { content: '\e82d'; }
.HTMLNavigationFormButton-Include-Over a:before { content: '\e82d'; }
.HTMLNavigationFormButton-Include-Des a:before { 
content: '\e82d';
opacity: 0.3 !important;  
}

.HTMLNavigationFormButton-Edit a:before { content: '\e820'; }
.HTMLNavigationFormButton-Edit-Over a:before { content: '\e820'; }
.HTMLNavigationFormButton-Edit-Des a:before { 
content: '\e820';
opacity: 0.3 !important;  
}

.HTMLNavigationFormButton-First a:before { content: '\e800'; }
.HTMLNavigationFormButton-First-Over a:before { content: '\e800'; }
.HTMLNavigationFormButton-First-Des a:before { 
content: '\e800';
opacity: 0.3 !important;  
}

.HTMLNavigationFormButton-Previous a:before {content: '\e800';width: 9px;overflow: hidden;margin-bottom: -3px;}
.HTMLNavigationFormButton-Previous-Over a:before { 
content: '\e800';
overflow: hidden;
width: 9px;
margin-bottom: -3px;
 }
.HTMLNavigationFormButton-Previous-Des a:before {
content: '\e800';
opacity: 0.3 !important;
overflow: hidden;
width: 9px;
margin-bottom: -3px;
}

.HTMLNavigationFormButton-Next a:before {
content: '\e801';
overflow: hidden;
width: 8px;
margin-bottom: -3px;
}

.HTMLNavigationFormButton-Next-Over a:before {content: '\e801';
margin-bottom: -3px;
overflow: hidden;
width: 8px;
}

.HTMLNavigationFormButton-Next-Des a:before {
content: '\e801';
opacity: 0.3 !important;
overflow: hidden;
width: 8px;
margin-bottom: -3px;
}

.HTMLNavigationFormButton-Last a:before { content: '\e801';  }
.HTMLNavigationFormButton-Last-Over a:before { content: '\e801';}
.HTMLNavigationFormButton-Last-Des a:before { 
content: '\e801';
opacity: 0.3 !important;  
}

.HTMLNavigationFormButton-Delete a:before { content: '\e81b'; }
.HTMLNavigationFormButton-Delete-Over a:before { content: '\e81b'; }
.HTMLNavigationFormButton-Delete-Des a:before { 
content: '\e81b';
opacity: 0.3 !important;   
}

.HTMLNavigationFormButton-Refresh a:before { content: '\e806'; }
.HTMLNavigationFormButton-Refresh-Over a:before { content: '\e806'; }
.HTMLNavigationFormButton-Refresh-Des a:before { 
content: '\e806'; 
opacity: 0.3 !important;  
}

.HTMLNavigationFormButton-Print a:before { content: '\e81f'; }
.HTMLNavigationFormButton-Print-Over a:before { content: '\e81f'; }
.HTMLNavigationFormButton-Print-Des a:before { 
content: '\e81f'; 
opacity: 0.3 !important;  
}

.HTMLNavigationFormButton-Log a:before { content: '\e80b'; }
.HTMLNavigationFormButton-Log-Over a:before { content: '\e80b'; }
.HTMLNavigationFormButton-Log-Des a:before { 
content: '\e80b'; 
opacity: 0.3 !important;  
}

.HTMLNavigationFormButton-DefaultValues a:before { content: '\e833'; }
.HTMLNavigationFormButton-DefaultValues-Over a:before { content: '\e833'; }
.HTMLNavigationFormButton-DefaultValues-Des a:before { 
content: '\e833'; 
opacity: 0.3 !important;  
}

.HTMLNavigationFormButton-Help a:before { content: '\e82b'; }
.HTMLNavigationFormButton-Help-Over a:before { content: '\e82b'; }
.HTMLNavigationFormButton-Help-Des a:before { 
content: '\e82b';
opacity: 0.3 !important;  
}

.HTMLNavigationFormButton-Exit a:before { content: '\e808'; }
.HTMLNavigationFormButton-Exit-Over a:before { content: '\e808'; }
.HTMLNavigationFormButton-Exit-Des a:before { 
content: '\e808'; 
opacity: 0.3 !important;  
}

[class*="HTMLNavigationFormButton-EditSave"],
[class*="HTMLNavigationFormButton-EditCancel"],
[class*="HTMLNavigationFormButton-IncludeSave"],
[class*="HTMLNavigationFormButton-IncludeCancel"]{
width: 100px;
}

@media (max-width: 420px){
[class*="HTMLNavigationFormButton-EditSave"],
[class*="HTMLNavigationFormButton-EditCancel"],
[class*="HTMLNavigationFormButton-IncludeSave"],
[class*="HTMLNavigationFormButton-IncludeCancel"],
[class*="HTMLNavigationFormButton-IncludeSaveMore"]{
width: 40px!important;
}
.HTMLNavigationFormButton-IncludeSaveMore a:before,
.HTMLNavigationFormButton-IncludeSaveMore-Over a:before {
content: '\e807'' \e82d';
width: 31px!important;
}

}

.HTMLNavigationFormButton-EditSave a:before,
.HTMLNavigationFormButton-EditSave-Over a:before{ content: '\e807'; }
.HTMLNavigationFormButton-EditSave-Des a:before {
content: '\e807';
}

.HTMLNavigationFormButton-EditSave-Des a:before {
content: '\e807';
opacity: 0.2 !important;

}


.HTMLNavigationFormButton-EditCancel a:before,
.HTMLNavigationFormButton-EditCancel-Over a:before {
content: '\e82f';

}

.HTMLNavigationFormButton-EditCancel-Des a:before {
content: '\e82f';
opacity: 0.2 !important;
 
}

.HTMLNavigationFormButton-IncludeSaveMore a:before,
.HTMLNavigationFormButton-IncludeSaveMore-Over a:before {
content: '\e807'' \e82d';
width: 80px;

}

.HTMLNavigationFormButton-IncludeSaveMore-Des a:before {
content: '\e807'' \e82d';
opacity: 0.2 !important;

}

.HTMLNavigationFormButton-IncludeSave a:before,
.HTMLNavigationFormButton-IncludeSave-Over a:before { content: '\e807'; }
.HTMLNavigationFormButton-IncludeSave-Des a:before {
content: '\e807';
opacity: 0.2 !important;

}

.HTMLNavigationFormButton-IncludeSave-Des a:before {
content: '\e807';

}

.HTMLNavigationFormButton-IncludeCancel a:before,
.HTMLNavigationFormButton-IncludeCancel-Over a:before {
content: '\e82f';

}

.HTMLNavigationFormButton-IncludeCancel-Des a:before {
content: '\e82f';
opacity: 0.2 !important;

}

/*****************************************/
/* HTMLNavigationGridButton: Botões Grade*/
/*****************************************/

.HTMLNavigationGridButton img {
background-repeat: no-repeat;
width: 16px;
height: 16px;
}

.HTMLNavigationGridButton-pt_BR img {
background: url('HTMLNavigationGrid/navGridIcons.gif');
}

.HTMLNavigationGridButton-en_US img {
background: url('HTMLNavigationGrid/en_US/navGridIcons.gif');
}

.HTMLNavigationGridButton-es_ES img {
background: url('HTMLNavigationGrid/es_ES/navGridIcons.gif');
}

.HTMLNavigationGridButton-fr_FR img {
background: url('HTMLNavigationGrid/fr_FR/navGridIcons.gif');
}

.HTMLNavigationGridButton-Include img {
background-position: 0px;
}

.HTMLNavigationGridButton-Include-Des img {
background-position: -16px;
}

.HTMLNavigationGridButton-Edit img {
background-position: -32px;
}

.HTMLNavigationGridButton-Edit-Des img {
background-position: -48px;
}

.HTMLNavigationGridButton-Delete img {
background-position: -64px;
}

.HTMLNavigationGridButton-Delete-Des img {
background-position: -80px;
}

.HTMLNavigationGridButton-Refresh img {
background-position: -96px;
}

.HTMLNavigationGridButton-Refresh-Des img {
background-position: -112px;
}

.HTMLNavigationGridButton-EditSave img, .HTMLNavigationGridButton-IncludeSave img {
background-position: -128px;
}

.HTMLNavigationGridButton-EditSave-Des img, .HTMLNavigationGridButton-IncludeSave-Des img {
background-position: -144px;
}

.HTMLNavigationGridButton-EditCancel img, .HTMLNavigationGridButton-IncludeCancel img {
background-position: -160px;
}

.HTMLNavigationGridButton-EditCancel-Des img, .HTMLNavigationGridButton-IncludeCancel-Des img {
background-position: -176px;
}

/*****************************************/
/* HTMLPaging: Paginação da Grade        */
/*****************************************/
.HTMLPagingButton img {
background: url('HTMLPaging/paging.gif');
background-repeat: no-repeat;
width: 8px;
height: 7px;
}

.HTMLPagingButton-First img {
background-position: 0px;
}

.HTMLPagingButton-First-Des img {
background-position: -8px;
}

.HTMLPagingButton-Previous img {
background-position: -16px;
width: 4px;
}

.HTMLPagingButton-Previous-Des img {
background-position: -20px;
width: 4px
}

.HTMLPagingButton-Next img {
background-position: -24px;
width: 4px;
}

.HTMLPagingButton-Next-Des img {
background-position: -28px;
width: 4px;
}

.HTMLPagingButton-Last img {
background-position: -32px;
}

.HTMLPagingButton-Last-Des img {
background-position: -40px;
}

/*****************************************/
/* HTMLMemo: Componente Texto Longo      */
/*****************************************/
.HTMLMemo textarea {
font-family: 'Open Sans', sans-serif, arial;
font-size: 12px;
font-weight: 500;
color: #555B61;
background: #FFFFFF;
border-right: 1px solid #D3D1D1;
border-left: 1px solid #D3D1D1;
border-top: 1px solid #D3D1D1;
border-bottom: 1px solid #D3D1D1;
border-radius: 2px;
padding-left: 8px;
padding-right: 8px;
outline: none;
-webkit-box-shadow: inset 0 2px 4px 0 rgba(66, 66, 66, 0.1);
-moz-box-shadow: inset 0 2px 4px 0 rgba(66, 66, 66, 0.1);
-o-box-shadow: inset 0 2px 4px 0 rgba(66, 66, 66, 0.1);
-ms-box-shadow: inset 0 2px 4px 0 rgba(66, 66, 66, 0.1);
box-shadow: inset 0 2px 4px 0 rgba(66, 66, 66, 0.1);
width: 100%!important;
height: 100%!important;
}

.HTMLMemo textarea[readonly=readonly] {
background: #ECFFE8;
}

.HTMLMemo textarea:hover {
border: 1px solid #A0A0A0;
}

.HTMLMemo textarea:focus {
border: 1px solid #4ABA58;
outline: none;
}


.HTMLMemo font {
cursor: default;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
white-space: nowrap;
}

.HTMLMemo textarea:disabled {
cursor: default;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
border-left: 1px solid #ebebe4;
border-right: 1px solid #ebebe4;
border-top: 1px solid #ebebe4;
border-bottom: 1px solid #ebebe4;
background: #ebebe4;
}

.HTMLMemo textarea:disabled:hover {
border: 1px solid #FF0000;
}

/*****************************************/
/* HTMLDualList: Componente Lista Dupla  */
/*****************************************/
.HTMLDualList {
font-family: 'Open Sans', sans-serif, arial;
font-size: 11px;
border-right: 1px solid #D3D1D1;
border-left: 1px solid #D3D1D1;
border-top: 1px solid #D3D1D1;
border-bottom: 1px solid #D3D1D1;
outline: none;
background: #ffffff;
}

.HTMLDualList select {
height: 100%;
width: 100%;
outline: none;
}

.HTMLDualList #dlTop {
height: 7%;
width: 100%;
}

.HTMLDualList #dlMiddle {
height: 86%;
width: 100%;
}

.HTMLDualList #dlBottom {
height: 7%;
width: 100%;
}

.HTMLDualList #dlLeftSeparator,#dlRightSeparator {
float: left;
height: 100%;
width: 5%;
}

.HTMLDualList #dlMiddleSeparator {
float: left;
height: 100%;
text-align: center;
width: 6%;
}

.HTMLDualList #dlMiddleSeparator div:first-child {
height: 34%;
}

.HTMLDualList #dlMiddleSeparator div[id*="bt"] {
padding-bottom: 3px;
}

.HTMLDualList div[id*="WFRComponentLEFT"] {
float: left;
height: 90%;
width: 42%;
}

.HTMLDualList div[id*="WFRComponentRIGHT"] {
float: left;
height: 90%;
width: 42%;
}

/*****************************************/
/* HTMLLookup: Componente Lista Dinâmica */
/*****************************************/
.HTMLLookup input:not([type='checkbox']){
font-family: 'Open Sans', sans-serif, arial;
font-size: 12px;
font-weight: 500;
color: #555B61;
text-indent: 5px;
border-right: 1px solid #D3D1D1;
border-left: 1px solid #D3D1D1;
border-top: 1px solid #D3D1D1;
border-bottom: 1px solid #D3D1D1;
border-radius: 4px;
padding-left: 3px;
padding-right: 3px;
outline: none;
width: 100%;
height: 100%;

-webkit-box-shadow: inset 0 2px 4px 0 rgba(66, 66, 66, 0.1);
-moz-box-shadow: inset 0 2px 4px 0 rgba(66, 66, 66, 0.1);
-o-box-shadow: inset 0 2px 4px 0 rgba(66, 66, 66, 0.1);
-ms-box-shadow: inset 0 2px 4px 0 rgba(66, 66, 66, 0.1);
box-shadow: inset 0 2px 4px 0 rgba(66, 66, 66, 0.1);
}

.HTMLLookup input:hover {
border-right: 1px solid #A0A0A0;
border-left: 1px solid #A0A0A0;
border-top: 1px solid #A0A0A0;
border-bottom: 1px solid #A0A0A0;
background: #FFFFFF;
}

.HTMLLookup input:focus {
font-family: 'Open Sans', sans-serif, arial;
border-right: 1px solid #4ABA58;
border-left: 1px solid #4ABA58;
border-top: 1px solid #4ABA58;
border-bottom: 1px solid #4ABA58;
background: #FFFFFF;
outline: none;
}

.HTMLLookup input:disabled:hover {
background: #ebebe4;
}

.HTMLLookup-ReadOnly input {
background: #ECFFE8;
}

.HTMLLookup-ReadOnly input:focus {
background: #ECFFE8;
}

.HTMLLookup-ReadOnly input:hover {
background: #ECFFE8;
}

.HTMLLookupDetails {
box-shadow: 3px 5px 10px #747171;
border-radius: 8px;
transition: width 2s, height 2s, background-color 2s, transform 2s;
background: white;
}

.HTMLLookupDetails #lookupHeader div {
float: left;
height: 18px;
}

.HTMLLookupDetails #lookupHeader img {
cursor: pointer;
margin: 0;
}

.HTMLLookupDetails #lookupSearchQuery {
font-family: 'Open Sans', sans-serif, arial;
font-size: 11px;
border-right: 0px solid #999999;
border-left: 0px solid #999999;
border-top: 1px solid #999999;
border-bottom: 1px solid #999999;
background: #fefefd;
height: 18px;
outline: none;
}

.HTMLLookupDetails #lookupQueryNavigation {
background: #fefefc;
height: 14px;
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
}

.HTMLLookupDetails #lookupQueryContent {
background: #CCCCCC;
}

.HTMLLookupDetails #lookupInput {
font-family: 'Open Sans', sans-serif, arial;
font-size: 11px;
border-right: 0px solid #D3D1D1;
border-left: 0px solid #D3D1D1;
border-top: 0px solid #FFFFFF;
border-bottom: 1px solid #D3D1D1;
background: #FEFEFC;
}

.HTMLLookupTypeSearch {
right: 9px;  
position: absolute; 
top: 0px;
background-repeat: no-repeat;
background-position: center;
height: 100%;
width: 12%!important;
visibility: hidden;
transition: visibility 0s, opacity 0.5s cubic-bezier(0, 0, 0.06, 1.22);
animation: ripple-animation 1.5s;
overflow: hidden;
border-radius: 45%;
z-index: 5;
}

@keyframes ripple-animation {
  from {
    transform: scale(0.5);
    opacity: 0.7;
  }
  to {
    transform: scale(1.2);
    opacity: 0;
    background-color: gray;
  }
}

div[id*="WFRLookupSubForm"] {
position: absolute;
display: block;
width: 20px;
height: 20px;
z-index: 99999;
}

.HTMLLookupMobile {
border: 1px solid #a6a7b0;
border-radius: 8px;
cursor: pointer;
color: #fefefc;
background: #fefefc;
padding: 0;
vertical-align: middle;
outline: none;
position: relative;
z-index: 100;
height: calc(100% - 16px);
width: 20px;
outline: none;
}

.grid .HTMLLookupMobile {
position: absolute;
float: right;
z-index: 1000000000;
height: 100%;
width: 20px;
}

.HTMLLookup button {
border: none !important;
border-left: solid 1px #D3D1D1 !important;
border-top-left-radius: 0;
border-top-right-radius: 4px;
border-bottom-left-radius: 0;
border-bottom-right-radius: 4px;
background: url('HTMLComboBox/drop-arrow-icon.png') no-repeat center center transparent !important;
background-size: 10px;
-webkit-box-shadow: inset 0 2px 4px 0 rgba(66, 66, 66, 0.1);
-moz-box-shadow: inset 0 2px 4px 0 rgba(66, 66, 66, 0.1);
-o-box-shadow: inset 0 2px 4px 0 rgba(66, 66, 66, 0.1);
-ms-box-shadow: inset 0 2px 4px 0 rgba(66, 66, 66, 0.1);
box-shadow: inset 0 2px 4px 0 rgba(66, 66, 66, 0.1);
height: 100%;
}

.HTMLLookup .HTMLButton img {
visibility: hidden;
}

/*****************************************/
/* HtmlComboBox: Componente Lista        */
/*****************************************/
.HTMLComboBox select {
font-family: 'Open Sans', sans-serif, arial;
font-size: 12px;
font-weight: 500;
color: #555B61;
text-indent: 5px;
border-right: 1px solid #D3D1D1;
border-left: 1px solid #D3D1D1;
border-top: 1px solid #D3D1D1;
border-bottom: 1px solid #D3D1D1;
border-radius: 4px;
padding-left: 3px;
padding-right: 3px;
outline: none;
width: 100%!important;
height: 100%!important;

-webkit-box-shadow: inset 0 2px 4px 0 rgba(66, 66, 66, 0.1);
-moz-box-shadow: inset 0 2px 4px 0 rgba(66, 66, 66, 0.1);
-o-box-shadow: inset 0 2px 4px 0 rgba(66, 66, 66, 0.1);
-ms-box-shadow: inset 0 2px 4px 0 rgba(66, 66, 66, 0.1);
box-shadow: inset 0 2px 4px 0 rgba(66, 66, 66, 0.1);
}

.HTMLComboBox select:hover {
border-right: 1px solid #A0A0A0;
border-left: 1px solid #A0A0A0;
border-top: 1px solid #A0A0A0;
border-bottom: 1px solid #A0A0A0;
background: #FFFFFF;
}

.HTMLComboBox select:focus {
font-family: 'Open Sans', sans-serif, arial;
border-right: 1px solid #4ABA58;
border-left: 1px solid #4ABA58;
border-top: 1px solid #4ABA58;
border-bottom: 1px solid #4ABA58;
background: #FFFFFF;
outline: none;
}

.HTMLComboBox select:disabled:hover {
background: #ebebe4;
}

.HTMLComboBox select:disabled {
background: #ebebe4;
}

.HTMLComboBox-ReadOnly select {
background: #ECFFE8;
}

.HTMLComboBox-ReadOnly select :focus {
background: #ECFFE8;
}

.HTMLComboBox-ReadOnly select:hover {
background: #ECFFE8;
}

.HTMLComboBox .HTMLComboBoxPlaceholder {
position: absolute;
pointer-events: none;
color: #757575;
padding-left: 7px;
padding-top: 2px;
width: calc(100% - 17px);
overflow: hidden;
font-size: 12px;
}

/*****************************************/
/* HTMLCheckBox: Componente Check        */
/*****************************************/
.HTMLCheckBox #chkLabel {
position: relative;
margin-left: 1px;
top: -6px;
cursor: pointer;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
outline: none;
}

.HTMLCheckBox #chkLabel-disabled {
cursor: default;
color: #D3D1D1;
position: relative;
margin-left: 1px;
top: -6px;
}

.HTMLCheckBox input:enabled {
cursor: pointer;
}

.HTMLCheckBox input:enabled:hover {
border-color: #6FD07B;
}

.HTMLCheckBox input:disabled {
cursor: default;
}

input[type='checkbox'] {
height: 15px;
padding: 3px 2px 2px 11px;
background:#FFF;
border: 1px solid #D3D1D1;
outline:none;
color:#96999D;
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
-webkit-appearance: none;
-webkit-font-smoothing: antialiased;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 2px;
-webkit-transition: all 0.1s;
-moz-transition: all 0.1s;
-ms-transition: all 0.1s;
-o-transition: all 0.1s;
transition: all 0.1s;
}

input[type='checkbox']:checked {
background: url('checked-box-icon.png') no-repeat center center rgb(71, 193, 86) !important;
border-color: #47C156;
}

/*****************************************/
/* HTMLImage: Componente Imagem          */
/*****************************************/
.HTMLImage #HTMLImageLock {
display: none;
height: 100%;
width: 100%;
position: absolute;
outline: none;
}

.HTMLImage #HTMLImageNoImage {
background: #FFFFFF;
display: table;
height: 100%;
width: 100%;
outline: none;
border: 2px dashed #D4D4D4;
cursor: pointer;
}

.HTMLImage #HTMLImageNoImageRow {
display: table-row;
text-align: center;
}

.HTMLImage img {
position: absolute;
left: 0px;
top: 0px;
}

.HTMLImage #HTMLImageNoImageCell {
display: table-cell;
vertical-align: middle;
}

.HTMLImage #HTMLImageWebCam {
  float: right;
  position: relative!important;
  left: -30px!important;
  cursor: pointer;
}

.HTMLImage #HTMLImageWebCam img {
height: 24px;
width: 25px;
}

.HTMLImage #HTMLImageZoom {
cursor: pointer;
float: right;
position: relative!important;
left: 23px!important;
}

.HTMLImage #HTMLImageZoom img {
height: 24px;
width: 25px;
}

.HTMLImage #HTMLImageSelf {
width: 100%;
height: 100%;
}

.HTMLImageZoom {
position: absolute;
z-index: 1000000;
background: #FFF;
border: 1px solid black;
overflow: hidden;
box-shadow: 0 0 30px 0 rgba(50, 50, 50, 0.75);
}


/*****************************************/
/* HTMLDetailPanel: Componente Sub-Form  */
/*****************************************/
.HTMLDetailPanel {
border: 1px solid #BFB8BF;
box-sizing: border-box;
}

/*****************************************/
/* HTMLInteraction: Mensagem de Interação*/
/*****************************************/
div[id*="HTMLInteraction"] { 
-webkit-box-shadow: 0px 0px 29px 2px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 0px 0px 29px 2px rgba(0, 0, 0, 0.2);
box-shadow: 0px 0px 29px 2px rgba(0, 0, 0, 0.2);
display: block;
background: #ffffff;
width: 382px;
position: absolute;
top: 0px;
left: 0px;
border: 1px solid #EAEAEA;
outline: none;
box-sizing: content-box;
}

div[id*="HTMLInteraction"] * {
box-sizing: content-box;
}

div[id*="HTMLInteraction"] #intTitle {
opacity: 1.0;
background: #ffffff;
height: 26px;
width: 100%; 
outline: none;
}

div[id*="HTMLInteraction"] #intTitleIcon {
height: 100%;
width: 30px;
float: left;
text-align: center;
}

div[id*="HTMLInteraction"] #intTitleIcon img {
vertical-align: middle;
}

div[id*="HTMLInteraction"] #intTitleMessage {
cursor: default;
display: table;
float: left;
height: 100%;
width: 332px;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;    
}

div[id*="HTMLInteraction"] #intTitleMessage span {
display: table-cell;
vertical-align: middle;
font-size: 12px;
color: #459C48;
font-weight: 500;
text-decoration: none;
padding-left: 10px;
font-family: 'Open Sans', sans-serif, arial;
}

div[id*="HTMLInteraction"] #intTitleClose {
cursor: pointer;
float: left;
position: absolute;
right: -7px;
width: auto;
height: auto;
text-align: center;
top: -7px;
}

div[id*="HTMLInteraction"] #intTitleClose button {
background: #fdfdfd;
border: solid 1px;
font-size: 11px;
color: #b5b5b5;
overflow: hidden;
border-radius: 50%;
height: 17px;
width: 7px;
}

.intOnlyMessage {
height: 40px !important;
}

div[id*="HTMLInteraction"] #intMessage {
cursor: default;
height: 80px;
width: 100%;
text-align: center;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
float: left;
}

div[id*="HTMLInteraction"] #intIcon {
float: left;
top: 31%;
width: 13%;
background-color: #F9F9F9;
}

div[id*="HTMLInteraction"] #intIconTable {
display: table;
height: 80px;
}

div[id*="HTMLInteraction"] #intIconCell {
display: table-cell;
vertical-align: middle;
}

.intOnlyText {
width: 100% !important;
height: 40px !important;
}

div[id*="HTMLInteraction"] #intText {
display: table;
height: 80px;
width: 332px;
word-break: break-word;
background-color: #F9F9F9;
}

div[id*="HTMLInteraction"] #intText #intTextCell {
display: table-cell;
vertical-align: middle;
width: 100%;
margin: 0 auto;
overflow-y: auto;
}

div[id*="HTMLInteraction"] #intText #intTextCenter {
padding: 0px 6px;
margin-left: 15px;
text-align: center;
width: 305px;
overflow-y: auto;
}

div[id*="HTMLInteraction"] #intText #intTextAux {
max-height: 80px;
word-break: break-word;
text-align: left;
}

div[id*="HTMLInteraction"] #intText span {
font-family: 'Open Sans', sans-serif, arial;
font-size: 12px;
color: #8A8E90;
}

div[id*="HTMLInteraction"] #intUserOptions {
background: rgb(239,235,231);
padding-left: 15px;
}

div[id*="HTMLInteraction"] #intUser {
background: rgb(239,235,231);
}

div[id*="HTMLInteraction"] #intUserRadio {
float: left;
width: 100%;
}

div[id*="HTMLInteraction"] #intUserRadio input {
float:left;
}

div[id*="HTMLInteraction"] #intUserRadio label {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #333333;
padding-left: 5px;
text-decoration: none;
}

div[id*="HTMLInteraction"] #intBtnCancel {
left: 0%;
bottom: 0%;
height: 28px;
width: 50%;
background-repeat:no-repeat;
background-position-y: bottom;
background-position:100% bottom;
float: left;
}

div[id*="HTMLInteraction"] #intBtnDetails {
left: 0%;
bottom: 0%;
height: 28px;
width: 50%;
background-repeat:no-repeat;
background-position-y: bottom;
background-position:100% bottom;
float: left;
}

div[id*="HTMLInteraction"] #intBtnOk {
right: 0%;
bottom: 0%;
height: 28px;
width: 50%;
background-repeat:no-repeat;
background-position-y: bottom;
float: right;
}

div[id*="HTMLInteraction"] #intBase {
left: 0%;
bottom: 0%;
height: 12px;
width: 50%;
position: absolute;
}

div[id*="HTMLInteraction"] #intBtnDetails button {
border: 1px solid #a6a7b0;
cursor: pointer;
color: #747474;
background: rgb(254,254,252);
bottom: 1%;
cursor: pointer;
position: absolute;
height: 26px;
min-width: 60px;
}

div[id*="HTMLInteraction"] #intBtnDetails button:hover {
border: 1px solid #a6d4d5;
cursor: pointer;
color: #747474;
background: rgb(254,254,252);
}

div[id*="HTMLInteraction"] #intBtnCancel button {
border: 1px solid #DFDFDF;
-moz-border-radius: 8px;
cursor: pointer;
color: #414141;
background: -moz-linear-gradient(top,#ffffff 0%,#F0F0F0);
background: -webkit-gradient(linear, left top, left bottom,from(#ffffff),to(#F0F0F0));
height: 25px;
min-width: 80px;
}

div[id*="HTMLInteraction"] #intBtnOk button {
border: 1px solid #DFDFDF;
-moz-border-radius: 8px;
cursor: pointer;
color: #414141;
background: -moz-linear-gradient(top,#ffffff 0%,#F0F0F0);
background: -webkit-gradient(linear, left top, left bottom,from(#ffffff),to(#F0F0F0));
cursor: pointer;
position: absolute;
bottom: 0%;
right: 0%;
height: 25px;
min-width: 80px;
}

div[id*="HTMLInteraction"] #intBtnOk button:hover,
div[id*="HTMLInteraction"] #intBtnCancel button:hover {
background:#ffffff;
border-color: rgb(234, 234, 234);
}

div[id*="HTMLInteraction"] #intBtnOk button:focus{
outline:none;
}


div[id*="HTMLInteraction"] #intBtnCancel img, #intBtnDetails img, #intBtnOk img {
vertical-align:middle;
}

div[id*="HTMLInteraction"] #intBtnCancel a, #intBtnDetails a, #intBtnOk a {
color: #333333;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
text-decoration: none;
}

div[id*="HTMLInteractionBack"] {
background-color: #FFFFFF;
filter: alpha(opacity = 30);
opacity: 0.4;
height: 100%;
width: 100%;
position: absolute;
border: 0;
}

/*****************************************/
/* HTMLProgressBar: Barra de Progresso   */
/*****************************************/
div[id*="HTMLProgressBar"] {
display: block;
height: 100%;
width: 100%;
position: absolute;
top: 0px;
left: 0px;
}

div[id*="HTMLProgressBarBack"] {
background: #FFFFFF;
filter: alpha(opacity = 30);
opacity: 0.3;
height: 100%;
width: 100%;
position: absolute;
border: 0;
}

/*****************************************/
/* HTMLTreeview: Componente Arvore        */
/*****************************************/
.HTMLTreeviewSelectedItem {
background: #ffffb4;
}

.HTMLTreeview {
color: #BFB8BF;
}

.HTMLTreeview > span {
color: #747474;
}

/*****************************************/
/* HTMLAlert: Indicadores do Modo do Form*/
/*****************************************/
.HTMLAlert {
width: 45px;
height: 53px;
top: 7px;
right: 7px;
text-align: center;
position: absolute;
font-size: 8px;
}

/**********************************************/
/* HTMLPage: Componente usado na aba localizar*/
/**********************************************/
.HTMLPage {
border: 0;
width: 100%;
top: 0px;
left: 0px;
display: block;
position: absolute;
}

/***********************************************/
/* WFRQueryForm: Aba Localizar: Básico/Avançado*/
/***********************************************/
.WFRQueryForm {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  background: #FFFFFF;
  font-family: calibri;
  font-size: 12px;
  overflow: hidden;
  overflow-y: auto;
}

iframe[name="WFRQueryResults"] {
width: 100%!important;
}

.WFRQueryForm #HeaderSearchParams {
width: 100%;
background-repeat: repeat-x;
float: left;
}

.WFRQueryForm #BodySearchFilterTitle {
width: 115px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

.WFRQueryForm #HeaderSearchParamsTitle {
text-align: center;
font-family: calibri;
font-size: 12px;
}

.WFRQueryForm #BodySearch {
float: left;
width: 98%;
background: #FFFFFF;
}

.WFRQueryForm #HeaderResults {
width: 100%;
background-repeat: repeat-x;
float: left;
}

.WFRQueryForm #HeaderResultsTitle {
text-align: center;
}

.WFRQueryForm #BodySearchFilter {
float: left;
padding-left: 2px;
}

.WFRQueryForm #BodySearchFilterCombo select {
background: transparent;
border: 0px;
width: 100%;
padding: 4px;
font-size: 11px;
line-height: 1;
height: 21px;
outline: none;
}

.WFRQueryForm #BodySearchFilterCombo {
position: relative;
overflow: hidden;
margin-bottom: 2px;
border-radius: 4px;
border-right: 1px solid #D3D1D1;
border-left: 1px solid #D3D1D1;
border-top: 1px solid #D3D1D1;
border-bottom: 1px solid #D3D1D1;
}

.WFRQueryForm #BodySearchOptions {
float: right;
}

#WFRQueryResults {
width: 100%;
}

/*Consulta Avançada*/
.WFRQueryForm #HeaderOptions {
margin-left: 4px;
border: 2px solid;
float: left;
width: 65px;
}

.WFRQueryForm #HeaderOptionsRow {
height: 30px;
}

.WFRQueryForm #HeaderOptionsRow div {
float: left;
margin: 5px;
}

.WFRQueryForm #HeaderOptionsRow {
cursor: pointer;
}

.WFRQueryForm #HeaderBasicQueryButton {
text-align: right;
}

#divQueryRow {
width: 100%;
float: left;
}

#divQueryRadio {
float: left;
}

#divQueryLabel {
float: left;
}

#divQuerySelect {
float: left;
}

#divQueryInput div {
float: left;
}

#divQueryInput input {
font-family: 'Open Sans', sans-serif, arial;
font-size: 11px;
border-right: 1px solid #D3D1D1;
border-left: 1px solid #D3D1D1;
border-top: 1px solid #D3D1D1;
border-bottom: 1px solid #D3D1D1;
}

/********************************************************************/
/* WFRReportMessageWait: Mensagem de espera da geração de relatórios*/
/********************************************************************/
#WFRReportMessageWait {
position: absolute;
display: table;
z-index: 1000000;
text-align: center;
background: #FFFFC7;
border: 1px solid #EFEFEF;
}

#WFRReportMessageWait div {
display: table-cell;
vertical-align: middle;
}

/********************************************/
/* WFRNavigation: Paginação da Aba Localizar*/
/********************************************/
#WFRNavigation {
height: 26px;
position: absolute;
right: 2px;
top: 0px;
z-index: 2;
}

#WFRNavigation > div {
float: left;
}

#WFRNavigation button {
border: 1px solid #a6a7b0;
border-radius: 8px;
cursor: pointer;
color: #747474;
background: #fefefc;
cursor: pointer;
vertical-align: middle;
outline: none;
padding: 0;
height: 15px;
width: 40px;
}

#WFRNavigation button:hover {
cursor: pointer;
border: 1px solid #ff0000;
color: #747474;
outline: none;
}

#WFRNavigation button:disabled {
cursor: default;
background: #fefefc;
color: #DFDFDF;
border: 1px solid #DFDFDF;
outline: none;
}

/*****************************************/
/* HTMLMenu: Componente Menu             */
/*****************************************/

/* Definindo o espaçamento da estrutura de lista (OPCIONAL, mas influencia no posicionamento dos elementos) */
.HTMLMenuContainer ul, li {
list-style: none;
margin: 0;
padding: 0;
}

/* Limitando a largura do menu Vertical */
.HTMLMenuVertical {
display: inline-block;
}

/* Horizontal: Definindo o estilo da lista, a borda cinza e a orientação de flutuação (OPCIONAL, mas influencia no posicionamento dos elementos) */
.HTMLMenuHorizontal .HTMLMenu {
list-style: none;
float: left;
/* Itens opcionais/customizáveis:*/
font-family: 'Open Sans', sans-serif, arial;
font-size: 11px;
background: #34383C;
width: 100%;
}

/* Vertical: Definindo o estilo da lista, a borda cinza e a orientação de flutuação (OPCIONAL, mas influencia no posicionamento dos elementos) */
.HTMLMenuVertical .HTMLMenu {
list-style: none;
/* Itens opcionais/customizáveis: */
border-radius: 3px;
font-family: 'Open Sans', sans-serif, arial;
font-size: 12px;
background: #FFFFFF;
padding: 5px 5px;
}

/* Horizontal: Definindo a borda interna e a posição superior do menu de level 1 */
.HTMLMenuHorizontal .HTMLMenu li {
position: relative;
float: left;
display: block;
min-width: 90px;
}

.LevelArrowDown > a {
color: #3E824D !important;
}

.HTMLVerticalFirstLevelArrow > a::after, 
.HTMLVerticalRemainingLevelsArrow > a::after,
.HTMLHorizontalArrowRight > a:after{
content: '';
position: absolute;
display: block;
top: 4px;
right: 5px;
width: 30px;
height: 30px;
background-image: url("arrow_item_msb.png");
background-repeat: no-repeat;
background-position: center center;
background-size: 17px;

-webkit-transition: 0.1s;
-moz-transition: 0.1s;
-o-transition: 0.1s;
transition: 0.1s;
}

.LevelArrowDown > a {border-bottom: solid 3px #89C396;}

.LevelArrowDown > a::after {
content: '';
-webkit-transform: rotate(90deg);
-moz-transform: rotate( 90deg);
-ms-transform: rotate( 90deg);
-o-transform: rotate( 90deg);
transform: rotate( 90deg);
}

.LevelArrowDown > ul {
border-bottom: solid 3px #89C396;
}

/* Vertical: Definindo a orientação do menu vertical */
.HTMLMenuVertical .HTMLMenu li {
position: relative;
display: block;
min-width: 90px;
background-color: #FFF;
}

/* Personalizando os links com o espaçamento top e right */
.HTMLMenu li a {
display: block;
text-decoration: none;
/* Itens opcionais/customizáveis: */
padding-left: 7px;
padding-right: 7px;
padding-top: 7px;
padding-bottom: 7px;
font-size: 12px;
}

.HTMLRemainingLevels span {
  white-space: pre-wrap;
}



/* Definindo o efeito do mouse over dos links (OPCIONAL) */
.HTMLMenu > li:not(.HTMLMenuFirstLevelDisabled) > a:hover {background-color: #EFEFEF;color: #6D7275;}

/*****************************************/
/* HTMLMenu: Item Horizontal             */
/*****************************************/

/* Exibição do primeiro item no menu vertical */
.HTMLMenuVertical .HTMLMenu > li:not(.HTMLMenuFirstLevelDisabled):hover > .HTMLItem {
}

/* Conserto da dupla borda entre os elementos (menu vertical) */
.HTMLMenuVertical .HTMLMenu > li > .HTMLItem li:not(:first-child) {
border-top: 0px;
}

/* Definindo o item horizontal */
.HTMLItem  {
top: 0px;
min-width: 200px;
overflow: hidden;
max-height: 0;
display: block !important;
-webkit-transition: max-height 0.3s ease-in-out, transform 0.2s ease-in-out;
-moz-transition: max-height 0.3s ease-in-out, transform 0.2s ease-in-out;
-ms-transition: max-height 0.3s ease-in-out, transform 0.2s ease-in-out;
-o-transition: max-height 0.3s ease-in-out, transform 0.2s ease-in-out;
transition: max-height 0.3s ease-in-out, transform 0.2s ease-in-out;
}

.item-show {
max-height: 4000px;
transition: max-height 2s;
}

/* Exibição do item horizontal */
.HTMLItem li:not(.HTMLMenuRemainingLevelsDisabled):hover > .HTMLItem {
display: block;
}

/* Configuração do item horizontal */
.HTMLItem li {
display: block;
white-space: nowrap;
}

/*****************************************/
/* HTMLMenu: Item Vertical               */
/*****************************************/

/* Definindo o estilo do item vertical */
.HTMLMenuHorizontal .HTMLMenu > li > .HTMLItem {
position: absolute;
left : 0px;
display: none;
/* Itens opcionais/customizáveis: */
top: 43px;
border-radius: 2px;
}

/* Exibição de item vertical */
.HTMLMenuHorizontal .HTMLMenu > li:not(.HTMLMenuFirstLevelDisabled):hover > .HTMLItem {
display: block;
}

/* Configuração do item vertical */
.HTMLMenuHorizontal .HTMLMenu > li > .HTMLItem li {
display: block;
width: 100%;
white-space: nowrap;
/* Itens opcionais/customizáveis: */
}

.HTMLMenuHorizontal .HTMLMenu > li > .HTMLItem li a {
background-color: #fff;
}

/* Conserto da dupla borda entre os elementos */
.HTMLMenuHorizontal .HTMLMenu > li > .HTMLItem li:not(:first-child) {
border-top: 0px;
}


.HTMLMenuHorizontal .HTMLFirstLevel > a {
text-align: center;
line-height: 36px;
color: #fff;
padding: 7px 13px 7px 13px;
font-size: 11px;
}

.HTMLMenuHorizontal .HTMLFirstLevel > a:hover {
background-color: #4E5154 !important;
color: #fff !important;
}

.HTMLMenuVertical .HTMLFirstLevel > a {
text-align: left;
line-height: 25px;
font-weight: 500;
color: #85898C;
font-size: 12px;
}

.HTMLRemainingLevels {
padding-left: 5px;
}

.HTMLRemainingLevels > a {
background-color: currentColor;
}
.HTMLRemainingLevels > a {
min-height: 15px;
color: #62727B;
font-weight: 500;
text-align: left;
line-height: 25px;
border-left: solid 1px #D9DCDA;
background-color: rgba(80, 80, 80, 0.05);
}

.HTMLRemainingLevels :not(.HTMLMenuRemainingLevelsDisabled):hover {
background: #EFEFEF;
}

/* CSS para links desabilitados */
.HTMLMenuFirstLevelDisabled {
background-color: #C0C0C0;
}

/* Desabilitando evento e ponteiro (Atenção o Focus via TABULAÇÃO ainda se mantém) */
.HTMLMenuHorizontal .HTMLMenuFirstLevelDisabled a {
cursor: default;
pointer-events: none;
text-align: center;
line-height: 30px;
}

.HTMLMenuVertical .HTMLMenuFirstLevelDisabled a {
cursor: default;
pointer-events: none;
line-height: 30px;
}


/* CSS para links desabilitados */
.HTMLMenuRemainingLevelsDisabled {
background-color: #C0C0C0;
}

/* Desabilitando evento e ponteiro (Atenção o Focus via TABULAÇÃO ainda se mantém) */
.HTMLMenuRemainingLevelsDisabled a {
cursor: default;
pointer-events: none;
}

/********************************************/
/* Slider: Componente Slider                */
/********************************************/

.HTMLSlider {
position: absolute;
z-index: 100000;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}

.HTMLSliderDisable {
position: absolute;
z-index: 100001;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
display: none;
}

.HTMLSliderSeletor {
position: absolute;
z-index: 4;
height: 14px;
width: 14px;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.HTMLSliderSeletor > span {
position: absolute;
bottom: -14px;
width: 134px;
left: -60px;
cursor: default;
text-align: center;
}
.HTMLSliderSeletor > img {
width: 14px;
height: 14px;
position: absolute;
z-index: 5;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}

.HTMLSliderSeletor>img:hover {
cursor: -webkit-grab;
cursor: -moz-grab;

}

.HTMLSliderSeletor >img:active {
cursor: -webkit-grabbing;
cursor: -moz-grabbing;
}

.HTMLSliderSeletor >img:focus {
cursor: -webkit-grabbing;
cursor: -moz-grabbing;
}
.HTMLSliderBar {
position: absolute;
z-index: 4;
background: #C0C0C0;
border-radius: 4px;
margin-top: 2px;
height: 9px;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}

.HTMLSliderBarSecundary {
position: absolute;
z-index: 4;
background: #C0C4CC;
border-bottom: #F00 2px solid;
border-radius: 4px;
margin-top: 2px;
height: 9px;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}

/***************************************************/
/* HTMLImageGallery: Componente Galeria de Imagens */
/***************************************************/
.HTMLImageGalleryMain {
border-left: 1px solid #D3D1D1;
border-right: 1px solid #D3D1D1;
border-top: 1px solid #D3D1D1;
border-bottom: 1px solid #D3D1D1;
border-top-left-radius: 8px;
border-top-right-radius: 8px;
border-bottom-left-radius: 8px;
border-bottom-right-radius: 8px;
}

.HTMLImageGalleryMain:hover {
border-left: 1px solid #4ABA58;
border-right: 1px solid #4ABA58;
border-top: 1px solid #4ABA58;
border-bottom: 1px solid #4ABA58;
}

.HTMLImageGalleryThumbnail {
border-left: 1px solid #D3D1D1;
border-right: 1px solid #D3D1D1;
border-top: 1px solid #D3D1D1;
border-bottom: 1px solid #D3D1D1;
border-top-left-radius: 8px;
border-top-right-radius: 8px;
border-bottom-left-radius: 8px;
border-bottom-right-radius: 8px;
transition: opacity .5s ease-out;
-moz-transition: opacity .5s ease-out;
-webkit-transition: opacity .5s ease-out;
-o-transition: opacity .5s ease-out;
}

.HTMLImageGalleryThumbnail:hover {
border: 1px solid #4ABA58;
opacity: 1;
box-shadow: 2px 2px 5px #ccc;
}

.HTMLImageGalleryThumbnail img {
width: 100%;
height: 100%;
border-top-left-radius: 8px;
border-top-right-radius: 8px;
border-bottom-left-radius: 8px;
border-bottom-right-radius: 8px;
}

.HTMLImageGalleryRemove {
background: transparent;
width: 16px;
height: 16px;
top: 2px;
right: 2px;
position: absolute;
background-image: url("HTMLImageGallery/remove_item_galery_disabled.png");
cursor: pointer;
}

.HTMLImageGalleryRemove:hover {
background-image: url("HTMLImageGallery/remove_item_galery.png");
}

.HTMLImageGalleryExpandedBackground {
width: 100%;
height: 100%;
z-index: 100100;
background: #000000;
opacity: 0.5;
position: absolute;
}

.HTMLImageGalleryExpandedImage {
z-index: 100110;
border-top-left-radius: 8px;
border-top-right-radius: 8px;
border-bottom-left-radius: 8px;
border-bottom-right-radius: 8px;
box-shadow: 0px 5px 35px #000000;
}

/***************************************************/
/* HTMLCalendar: Componente Calendário *************/
/***************************************************/
.HTMLCalendarMain {
min-width: 250px;
min-height: 180px;
-moz-user-select: none;
-ms-user-select: none;
-webkit-user-select: none;
user-select: none;
background-color: rgb(242, 242, 242);
color: #ffffff;
border: solid 1px rgb(199, 199, 199);
-webkit-box-shadow: 3px 3px 1px 0px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 3px 3px 1px 0px rgba(0, 0, 0, 0.2);
box-shadow: 1px 1px 6px 0px rgba(0, 0, 0, 0.12);
}

.HTMLCalendarHeader {
position: relative;
width: 100%;
height: 16%;
border-bottom: 1px solid #737b82;
text-align: center;
min-width: 250px;
max-height: 38px;
min-height: 30px;
background-color: rgb(131, 144, 156);
padding-top: 3px;
}

.HTMLCalendarPreviousYear {
position: relative;
display: inline-block;
background: url('HTMLCalendar/calendar_previous_year.png');
height: 28px;
width: 28px;
margin-top: 1%;
margin-right: 4px;
background-size: 75%;
background-repeat: no-repeat;
opacity: 0.6;
}

.HTMLCalendarSpan {
position: relative;
display: inline-block;
margin-right: 4px;
font-family: verdana;
top: 10px;
}

.HTMLCalendarPreviousYear:hover {
background: url('HTMLCalendar/calendar_previous_year_over.png');
background-repeat: no-repeat;
background-size: 75%;
opacity: 1.0;
}

.HTMLCalendarPrevious {
position: relative;
display: inline-block;
background: url('HTMLCalendar/calendar_previous.png');
height: 28px;
width: 15%;
max-width: 30px;
min-width: 30px;
margin-top: 1%;
margin-right: 4px;
background-size: 75%;
background-repeat: no-repeat;
opacity: 0.6;
}
.HTMLCalendarPrevious:hover {
background: url('HTMLCalendar/calendar_previous_over.png');
background-repeat: no-repeat;
background-size: 75%;
opacity: 1.0;
}

@font-face {
src: url(HTMLCalendar/4365_cent_g.ttf);
}

.HTMLCalendarInformation {
font-family: 'Open Sans', sans-serif, arial;
position: relative;
display: inline-block;
margin-right: 4px;
top: -12px;
width: 110px;
left: -4px;
font-size: 12px;
}

.HTMLCalendarNext {
position: relative;
display: inline-block;
background: url('HTMLCalendar/calendar_next.png');
height: 28px;
width: 15%;
max-width: 30px;
min-width: 30px;
margin-top: 1%;
margin-right: 4px;
background-size: 75%;
background-repeat: no-repeat;
opacity: 0.6;
}

.HTMLCalendarNext:hover {
background: url('HTMLCalendar/calendar_next_over.png');
background-repeat: no-repeat;
background-size: 75%;
opacity: 1.0;
}

.HTMLCalendarNextYear {
position: relative;
display: inline-block;
background: url('HTMLCalendar/calendar_next_year.png');
height: 28px;
width: 15%;
max-width: 30px;
min-width: 10px;
margin-top: 1%;
margin-right: -5px;
background-size: 75%;
background-repeat: no-repeat;
opacity: 0.6;
}

.HTMLCalendarNextYear:hover {
background: url('HTMLCalendar/calendar_next_year_over.png');
background-repeat: no-repeat;
background-size: 75%;
opacity: 1.0;
}

.HTMLCalendarDaysOfTheWeek {
position: relative;
width: 100%;
height: 11.4%;
text-align: center;
background: #737e88;
}

.HTMLCalendarCellDayOfTheWeek {
position: relative;
width: 13%;
height: 100%;
display: inline-block;
margin-left: 0.4%;
margin-right: 0.4%;
color: #ffffff;
top: 10%;
font-family: 'Open Sans', sans-serif, arial;
font-size: 100%;

}

.HTMLCalendarDaysOfTheMonth {
position: relative;
width: 100%;
height: 11.4%;
top: 3%;
text-align: center;
}

.HTMLCalendarCellDayOfTheMonth {
position: relative;
width: 13%;
height: 100%;
display: inline-block;
margin-left: 0.4%;
color: rgb(87, 87, 87);
margin-right: 0.4%;
font-family: verdana;
font-size: larger;
cursor: pointer;
padding-top: 6px;
}
.HTMLCalendarCellDayOfTheMonth:hover {
background: #D7D7D7;
}

.HTMLCalendarOfToday {
position: relative;
width: 13%;
height: 100% !important;
display: inline-block;
margin-left: 0.4%;
margin-right: 0.4%;
font-family: verdana;
font-size: larger;
cursor: pointer;
font-weight: bold;
background: rgb(171, 171, 171);
padding-top: 6px;
}
.HTMLCalendarCellHoliday {
position: relative;
width: 13%;
height: 100%;
display: inline-block;
margin-left: 0.4%;
margin-right: 0.4%;
font-family: 'Open Sans', sans-serif, arial;
color: rgb(244, 67, 54);
font-size: larger;
cursor: pointer;
padding-top: 6px;
}

.HTMLCalendarCellHoliday:hover {
background: #b8bfc5;
color: #fff;
}

.HTMLCalendarCellActivity {
position: relative;
width: 13%;
height: 100%;
display: inline-block;
margin-left: 0.4%;
margin-right: 0.4%;
font-family: verdana;
color: green;
font-size: larger;
border-top-left-radius: 8px;
border-top-right-radius: 8px;
border-bottom-left-radius: 8px;
border-bottom-right-radius: 8px;
cursor: pointer;
}

.HTMLCalendarCellActivity:hover {
background: #FFFAFA;
}

.navController {
position: relative;
z-index: 99999999999999999999999;
width: 26px;
top: 90px;
overflow: hidden;
background: #87CEFA;
opacity: 0.3;
float: right;
height: 560px;
transition: all 0.5s;
-webkit-border-top-left-radius: 15px;
-webkit-border-bottom-left-radius: 15px;
-moz-border-radius-topleft: 15px;
-moz-border-radius-bottomleft: 15px;
border-top-left-radius: 15px;
border-bottom-left-radius: 15px;
}

/*****************************/
/* HTMLChat: Componente Chat */
/*****************************/

.HTMLChat, .HTMLChatError {
position: absolute;
border: 1px solid rgb(226, 226, 226);
overflow: hidden;
background-color: white;
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
user-select: none;
}

.HTMLChatSlider {
transition: all 0.7s;
z-index: 999999;
}

.HTMLChatSlider:hover {
bottom: 0px !important;
}

.HTMLChatHeader {
height: 20px;
border-bottom: 1px solid rgb(226, 226, 226);
position: relative;
font-size: 14px;
padding-top: 3px;
padding-left: 15px;
}

.HTMLChatHeaderSlider {
height: 25px;
background: #404040;
color: white;
}

.HTMLChatSearch {
position: relative;
border-bottom: 1px solid rgb(241,241,241);
}

.HTMLChatSearch input {
border-radius: 0px !important;
position: relative;
height: 20px;
width: 100%;
background: #CBCBCB;
border: 1px solid #ABBFFF;
}

.HTMLChatSearch input:hover {
border: 0px solid;
}

.HTMLChatSearch input:focus {
border: 0px solid;
}

.HTMLChatSendAll {
position: relative;
height: 19px;
border-bottom: 1px solid rgb(241,241,241);
text-align: center;
font-weight: bold;
cursor: pointer;
}

.HTMLChatSendAll span {
position: relative;
vertical-align: middle;
}

.HTMLChatSendAll:hover {
background-color: #87CEFA;
}

.HTMLChatScroll {
width: 100%;
position: relative;
overflow-y: auto;
overflow-x: hidden;
}

.HTMLChatUsersList {
position: relative;
width: inherit;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
}

.HTMLChatUsersListRow {
width: inherit;
white-space: nowrap;
position: relative;
cursor: pointer;
}

.HTMLChatUsersListCellUser {
width: inherit;
border-bottom: 1px solid rgb(241, 241, 241);
display: inline-block;
left: -25px;
height: 19px;
}

.HTMLChatUsersListRow:hover {
background-color: #e4f7ff;
}

.HTMLChatUsersListCellStatus {
margin: 0px 5px;
float: left;
border-radius: 50%;
top: 2px;
height: 15px;
width: 15px;
}

.HTMLChatUsersListCellUser span {
position: relative;
text-overflow: ellipsis;
overflow: hidden;
float: left;
width: calc(100% - 25px);
padding-left: 25px;
top: 3px;
}

.HTMLChatUsersListCellStatus, .HTMLChatUsersListCellUser {
position: relative;
vertical-align: middle;
}

.HTMLChatUserOffline {
-webkit-box-ordinal-group: 2;
-moz-box-ordinal-group: 2;
-ms-flex-order: 2;
-webkit-order: 2;
order: 2;
}

.HTMLChatUserOnline {
-webkit-box-ordinal-group: 1;
-moz-box-ordinal-group: 1;
-ms-flex-order: 1;
-webkit-order: 1;
order: 1;
}

.HTMLChatUserOffline > .HTMLChatUsersListCellStatus {
background-color: #c3c3c3;
}

.HTMLChatUserOnline > .HTMLChatUsersListCellStatus {
background-color: lawngreen;
}

.HTMLChatTalk .HTMLMemo {
width: 100%!important;
border-radius: 0;
}

.HTMLChatTalk textarea {
resize: none;
height: 100%!important;
width: 100%!important;
}

.HTMLChatTalk textarea, .HTMLChatTalk textarea:hover, .HTMLChatTalk textarea:focus {
border: 0;
}

.HTMLChatTalk .HTMLMemo:nth-child(1) {
background-color: #E5E5E5;
}

.HTMLChatTalk .HTMLMemo:nth-child(1) textarea {
background-color: transparent!important;
border-radius: 0;
padding: 13px;
font-size: 16px;
}

.HTMLChatTalk .HTMLMemo:nth-child(2) textarea {
border-radius: 0;
padding: 4px;
overflow: hidden;
font-size: 18px;
border: 0px solid #fff;
border-bottom: 1px solid #404040;
}

/*************************************************/
/* HTMLPlayer: Reprodutor de Mídia               */
/*************************************************/

.HTMLPlayer {
z-index: 1;
background-color: rgba(0, 0, 0, 0.8);
}

.HTMLPlayerSliding {
-webkit-transition-duration: 0.7s;
-moz-transition-duration: 0.7s;
-ms-transition-duration: 0.7s;
-o-transition-duration: 0.7s;
transition-duration: 0.7s;
z-index: 2147483647;
padding-top: 30px;
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAOwQAADsEBuJFr7QAAABh0RVh0U29mdHdhcmUAcGFpbnQubmV0IDQuMC4zjOaXUAAAAhlJREFUWEftlzlLA1EUhRNc4hLFxEILkQj+BUs7/4CFYGOhtWBhoZaCYIKoWIqFhTYWdjZilcYqnQEJhEgwSEgCCVlnsvq9+CIjWWCcGRtz4PC2O/edefe+y4ytjz46oVgsOsrlsqvRaLjNpKqqrlwuN0Tf1mIbCoWCo1QqnVYABqaClyrjf59udwHYuK3YvAUhgqa7ACanodXoC9AngOwN1Wo1L11drFarJ/l8/pGwK4y10CcAXMhl3SDr58npW+mnBd0CzuVyE4FAwB4KhcYymcwka4NyuiM4OWe9Xvd9ufmGMQHRaHQiHo+vUi92KVrLrA/LpTaw5oQiJFoYE5BKpTwc7RUxfic/nuhv0i5g13YazI3AQ+FEA2MC0un0IhvecbQKVInxm6IoNwhZw3YG2qWp8GeHu1AL8wSIRdo6sVbI9ldq/VYymRyVpk1gsiPsNLBEgMopRBKJxHYkEhmXpk1gYp0ANq7AFOMHEnKDcPwIgQBjcwVwxB4KzDWbfXATnhHgI/5L2HVKwgG4J5xoYExAOByejMVi64g4yGazK6zPwo71gPkxeAS1MCbA7/fbg8Ggk5OYIgw9CxHPmlIHfl2KOaU5cuOSmlGSvgT0CeDhF970mK4u8oyXm3FPgmYYa6FPgAXoC+gu4A8+SlWa7gIoKA6y9swKEWJzfPf+LBfg6ogfE/EzIcJhGrkRbgT0/jH5Z7DZPgEGiNBQxJe7wQAAAABJRU5ErkJggg==);
background-repeat: no-repeat;
}

.HTMLPlayerSliding:hover {
bottom: -4px !important;
}

.HTMLVideoPlayer, .HTMLAudioPlayer {
background-color: #000;
z-index: 1;
}

.HTMLVideoPlayer {
margin-top: 3px;
margin-left: 3px;
margin-right: 3px;
}

.HTMLAudioPlayer {
height: 30px;
}

/*************************************************/
/*                 RSS: Leitor RSS               */
/************************************************/

.HTMLRSSBody {
position: absolute;
background: #FFF;
border: #E6E6E6 1px solid;
border-radius: 3px;
min-height: 100px;
z-index: 100000;
padding: 4px;
}

.HTMLRSSSlider {
position: relative;
width: 100%;
overflow: hidden;
z-index: 1;
}

.HTMLRSSTitle {
color: #000;
position: relative;
font-weight: bold;
width: 94%;
height: auto;
min-height: 30px;
overflow: hidden;
font-size: 16px;
text-overflow: ellipsis;
z-index: 1;
left: 3%;
padding-top: 2%;
TEXT-TRANSFORM: uppercase;
margin-bottom: 2px;
border-bottom: 1px #E6E6E6 solid;
}

.HTMLRSSItem {
position: relative;
white-space: pre-wrap;
overflow: hidden;
text-overflow: ellipsis;
z-index: 2;
width: 94%;
margin-top: 10px;
margin-left: 3%;
}

.HTMLRSSItemTitle {
position: relative;
width: 100%;
height: auto;
font-size: 14px;
margin-bottom: 8px;
font-weight: bold;
color: #000;
}
.HTMLRSSItemTitle span {
display: table;
margin-top: auto;
}

.HTMLRSSDescription {
position: relative;
width: 100%;
height: auto;
color: gray;
font-size: 16px;
float: left;
}

.HTMLRSSDescription > * {
float: left;
vertical-align: 30%
}
.HTMLRSSDescription img {
border-radius: 3px;
margin-right: 10px;
max-width: 75px;
}

.HTMLRSSDescription br {
display: none;
}

.HTMLRSSSeparator {
position: relative;
width: 100%;
height: 1px;
margin-top: 5px;
margin-bottom: 5px;
background-color: #E6E6E6;
float: left;
}

/***************************************************/
/* Tabela: Novo Componente Tabela (Feito em Maker) */
/***************************************************/

.HTMLTable {
border-bottom: 1px solid #C7C7C7;
border-top: 1px solid #C7C7C7;
border-left: 1px solid #C7C7C7;
border-right: 1px solid #C7C7C7;
background-color: white;
}

.HTMLTableAllModes {
z-index: 100000;
}

.HTMLTable * {
box-sizing: initial !important;
}

.HTMLTableDragDrop {
background: white;
border-bottom: 1px solid #D3D1D1;
box-sizing: border-box!important;
}

.HTMLTableNavButtons {margin-top: -2px !important;z-index: -1!important;}

.HTMLTable 
.HTMLEdit, 
.HTMLTableSearchEdge { 
height: 22px; 
}

.HTMLTable .HTMLEdit {
border-right: 2px solid #D3D1D1;
border-bottom: 1px solid #D3D1D1;
display: inline-block!important;
overflow: hidden;
text-overflow: ellipsis;
cursor: default;
background-color: white;
}

.HTMLTableSearchEdge {
overflow: hidden;
display: inline-block!important;
text-overflow: ellipsis;
cursor: default;
height: 100%;
width: 13px;
display: none!important;
}

.HTMLTable .HTMLEdit input {
width: 100% !important;
border-radius: 0;
height: 100%;
padding-left: 0;
padding-right: 0;
text-indent: 8px;
}

.HTMLTable .HTMLEdit input:focus {
border-color: #62cdf1;
border: 1px solid #4ABA58;
}

.HTMLTable .HTMLEdit input:hover {
border-color: #4ABA58;
}

.HTMLTableHeaderRow, .HTMLTableEdge {
height: 22px;
white-space: nowrap;
width: calc(100% + 0px);
padding: 0px 0px 0px 0px!important;
z-index: 1;
background: #fff;
}

.HTMLTableHeaderSearch {
white-space: nowrap;
border-bottom: 1px solid #c9b6b6;
width: calc(100% + 0px);
padding: 0px 0px 0px 0px!important;
z-index: 1;
height: 22px;
}

.HTMLTableEdge {
width: 13px;
border-bottom: 2px solid #e6e6e6;
}

.HTMLTableHeaderCell, .HTMLTableEdge {
background: #fff;
}

.HTMLTableHeaderCell {
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
cursor: default;
height: 100%;
}

.HTMLTableHeaderCell:last-child {
overflow: hidden;
float: none;
}

.HTMLTableHeaderCell:hover, .HTMLTableEdge:hover {
background: #fff;
}

.HTMLTableHeaderCell span {
cursor: default;
padding-left: 3px;
padding-right: 3px;
position: relative;
top: 7px;
}

.HTMLTableHeaderCell[draggable = true], .HTMLTableHeaderCell[draggable = true] > span {
cursor: -webkit-grab;
cursor: -moz-grab;
}

.HTMLTableHeaderCellSeparator {
display: inline-block;
text-overflow: ellipsis;
height: 100%;
cursor: e-resize;
background: #ccc;
}

.HTMLTableHeaderCellSeparator:hover, .HTMLTableHeaderCellSeparator:active {
background-color: red;
}

.HTMLTableBody {
width: 100%;
border-top: solid 2px #E6E6E6;
}

.HTMLTableBody2 {
outline: none;
overflow-y: hidden;
overflow-x: hidden!important;
position: relative;
overflow: hidden;
box-sizing: border-box;
position: absolute;
width: calc(100% + 0px);
padding: 0px 0px 0px 0px!important;
z-index: 1;
}

.HTMLTableBodyRow {
white-space: nowrap;
width: 100%;
}

.HTMLTableBodyRowAuto {
white-space: normal!important;  
}

.HTMLTableBodyRow{
background-color: #F7F7F7;
}

.HTMLTableBodyRowOdd{
background-color: #ffffff;
}

.HTMLTableBodyRow > div{
background-color: #F7F7F7;
}

.HTMLTableBodyRowOdd > div{
background-color: #ffffff;
}

.HTMLTableBodyRow:hover div{
background-color: rgb(236, 249, 226) !important;
}

.HTMLTableBodyRow:hover {
background-color: #E4E4E4!important;
}

.HTMLTableBodyRowSelected{
background-color: rgb(221, 247, 204) !important;
}

.HTMLTableBodyRowSelected > div{
background-color: rgb(221, 247, 204) !important;
}

.HTMLTableBodyCell {
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
margin-left: 1px;
cursor: default;
height: 100%;
border-right: 1px solid #ABABAB;
}

.HTMLTableBodyCell span {
padding-right: 2px;
}

.HTMLTableBodyCell img {
cursor: pointer;
width:100%;
height:100%;
}

.HTMLTableBodyCell .HTMLButton button img {
display:block!important;
}

.HTMLTableContainerPagination {
background: #F1F1F1;
width: 100%;
height: 20px;
position: absolute;
bottom: -21px;
}

.HTMLTablePrevious, .HTMLTableNext, .HTMLTableFirst,.HTMLTableLast {
position: absolute;
width: 32px;
height: 16px;
background-size: 256px 16px;
background-repeat: no-repeat;
top: 2px;
cursor: pointer;
-webkit-transition: 0.2s opacity ease-in;
-moz-transition: 0.2s opacity ease-in;
-ms-transition: 0.2s opacity ease-in;
-o-transition: 0.2s opacity ease-in;
transition: 0.2s opacity ease-in;
opacity: 0.6;
}

.HTMLTablePrevious:not(.HTMLTablePreviousDisabled):hover, .HTMLTableNext:not(.HTMLTableNextDisabled):hover, .HTMLTableFirst:not(.HTMLTableFirstDisabled):hover,.HTMLTableLast:not(.HTMLTableLastDisabled):hover {
opacity: 1;
}

.HTMLTablePreviousDisabled, .HTMLTableNextDisabled,.HTMLTableFirstDisabled,.HTMLTableLastDisabled {
cursor: default;
pointer-events: none;
}

.HTMLTablePrevious {
background-position: -64px;
right: 70px;
background-image: url("HTMLTable/nav_pagination.png");
}

.HTMLTablePreviousDisabled {
background-position: -96px;
background-image: url("HTMLTable/nav_pagination.png");
}

.HTMLTableNext {
background-position: -128px;
right: 35px;
background-image: url("HTMLTable/nav_pagination.png");
}

.HTMLTableNextDisabled {
background-position: -160px;
background-image: url("HTMLTable/nav_pagination.png");
}

.HTMLTableFirst {
background-position: 0px;
right: 105px;
background-image: url("HTMLTable/nav_pagination.png");
}

.HTMLTableFirstDisabled {
background-position: -32px;
background-image: url("HTMLTable/nav_pagination.png");
}
.HTMLTableLast {
background-position: -192px;
right: 0;
background-image: url("HTMLTable/nav_pagination.png");
}

.HTMLTableLastDisabled {
background-position: -224px;
background-image: url("HTMLTable/nav_pagination.png");
}

.HTMLTableInputPagination {
font-weight: bold;
height: 16px;
top: 2px;
position: relative;
float: left;
margin-left: 5px;
font-size: 11px;
}

.HTMLTableSpanPagination {
line-height: 20px;
position: relative;
float: left;
margin-left: 4px;
color: #808080;
}


.HTMLTableContextMenu {
position: absolute;
z-index: 2147483647;
background-color: #f5f5f5;
font-size: 1.2em;
white-space: nowrap;
line-height: 30px;
width: 200px;
text-indent: 10px;
box-shadow: 1px 1.732px 9px 0px rgba(64, 64, 64, 0.5);
border-radius: 4px;
}

.HTMLTableContextMenu > div {
cursor: pointer;
border-bottom: 1px solid #e7e7e7;
color: #434343;
-webkit-transition: 0.1s ease-in;
-moz-transition: 0.1s ease-in;
-ms-transition: 0.1s ease-in;
-o-transition: 0.1s ease-in;
transition: 0.1s ease-in;
border-top: 1px solid #e7e7e7;
}

.HTMLTableContextMenu > div:hover {
background-color: lightblue;
color: #171717;
border-bottom-color: lightblue;
border-top-color: lightblue;
}

.HTMLTableOrderArrow {
position: absolute;
width: 7px;
left: calc(50% - 3.5px);
top: 1px;
display: none;
}

.HTMLTableOrderArrowInverted {
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-ms-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg);
}

.HTMLTableOrderArrowSort {
display: block;
}

.HTMLTableOrderArrowSort {
display: block;
}


.HTMLTableRowGroups {
border-bottom: 1px solid #E0E0E0!important;
background: #F3F3F3;
}

.HTMLTableHeaderCellGroup {
float: left;
height: 100%;
outline: none;
border-right: 1px solid #ababab;
min-width: 100px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: 150px;
}

.HTMLTableHeaderCellGroup > span {
top: 3px;
position: relative;
margin-left: 5px;
margin-right: 5px;
}

.HTMLTableHeaderCellGroup > img {
top: 5px;
right: 2px;
width: 10px;
position: relative;
float: right;
cursor: pointer;
}

.HTMLTableSumaryGeneral {
background: #F3F3F3;
border: 1px solid #ccc;
}

.HTMLTableIntermediary {
overflow-y: hidden!important;
height: 100%;
}

/*************************************************/
/* HTMLScrollBar: Barra de Rolagem               */
/*************************************************/

.HTMLScrollBar {
width: 100%;
height: 100%;
position: relative;
cursor: default;
background-color: rgba(211,211,211,0.3);
-webkit-transition: 0.5s background-color ease;
-moz-transition: 0.5s background-color ease;
-ms-transition: 0.5s background-color ease;
-o-transition: 0.5s background-color ease;
transition: 0.5s background-color ease;
}

.HTMLScrollBar:hover , .HTMLScrollBar:active {
background-color: rgba(211,211,211,0.3);
}

.HTMLScrollThumbX, .HTMLScrollThumbY {
position: relative;
background-color: rgb(193, 193, 193);
}

.HTMLScrollThumbX {
height: 14px;
min-width: 20px;
display: none!important;
}

.HTMLScrollBarX {
display: none;
}

.HTMLScrollThumbY {
width: 14px;
min-height: 20px;
}

/*************************************************/
/*                COMPONENTE ABA                 */
/************************************************/

.HTMLTabComponent, .HTMLTabComponentClose, .HTMLTabComponentUndock {
background-color: #ECECEC;
color: #000000;
max-width: 10px;
min-width: 10px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

.HTMLTabComponent {
border-top-left-radius: 0px;
}

.HTMLTabComponentClose {
border-top-right-radius: 0px;
vertical-align: middle;
font-size: 12px;
text-align: center;
}

.fecharAba>span {
color: #C7C7C7!important;
}

.fecharAba>span>b {
}

.fecharAbaDesabilitada>span {
color: #AFAFAF!important;
}

.separarAba img {
width: 14px;
height: auto;
top: 3px;
margin-left: -3px;
position: absolute;
}

.HTMLTabComponentSelected {
border-bottom: 2px solid #99E2A2;
border-top-left-radius: 4px !important;
-webkit-box-shadow: 0px -4px 4px 2px rgba(61, 63, 68, 0.24);
box-shadow: 3px -2px 7px -1px rgba(61, 63, 68, 0.32);
}

.HTMLTabComponentUndockSelected {
border-top: 3px solid #FF0000;
}

.HTMLTabComponentUndock {
border-top: 1px solid #91A7B4;
}

.HTMLTabComponentCloseSelected {
border-bottom: 2px solid #99E2A2;
border-top-right-radius: 3px !important;
-webkit-box-shadow: 0px -4px 4px 2px rgba(61, 63, 68, 0.24);
box-shadow: 4px -2px 7px -1px rgba(61, 63, 68, 0.32);
}

.HTMLTabComponent {
border-bottom: 1px solid #ECECEC;
font-weight: 500;
cursor: pointer;
}

.HTMLTabComponentClose {
border-bottom: 1px solid #ECECEC;
}

.HTMLTabComponentSelected,.HTMLTabComponentCloseSelected,.HTMLTabComponentUndockSelected {
background-color: #FEFEFC;
color: #000000;
max-width: 10px;
min-width: 10px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

.HTMLTabComponent:hover a {
color: #46555F !important;
}

.HTMLTabComponentSelected>a {
color: #5B6F7B!important;
font-weight: 500;
}

.HTMLTabComponentSelected {
border-top-left-radius: 0px;
}

.HTMLTabComponentCloseSelected {
border-top-right-radius: 0px;
vertical-align: middle!important;
font-size: 12px;
text-align: center;
}

.HTMLTabComponentRow table {
border-bottom: 4px solid #3173AD;
width: 100%!important;
}

.HTMLTabComponentGroupBox {
top: 50px!important;
}

/********************************************/
/* WFRReport: Janela de Filtros do Relatório*/
/********************************************/
#WFRReport iframe {
height: 386px;
}

/* Style da cor de fundo da janela de filtro do Relatório*/
#WFRReportHeaderActions, #WFRReportHeaderOptions {
float: left;
width: 100%;
background: #FFF;
background: -moz-linear-gradient(top, #ffffff 0%, #f3f3f3 50%, #ededed 51%, #ffffff 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FFF), color-stop(50%,#F3F3F3), color-stop(51%,#EDEDED), color-stop(100%,#FFF));
background: -webkit-linear-gradient(top, #FFF 0%,#F3F3F3 50%,#EDEDED 51%,#FFF 100%);
background: -o-linear-gradient(top, #ffffff 0%,#f3f3f3 50%,#ededed 51%,#ffffff 100%);
background: -ms-linear-gradient(top, #ffffff 0%,#f3f3f3 50%,#ededed 51%,#ffffff 100%);
background: linear-gradient(to bottom, #FFF 0%,#F3F3F3 50%,#EDEDED 51%,#FFF 100%);
padding-bottom: 4px;
}

#WFRReportHeaderActions div, #WFRReportHeaderActions span {
cursor: pointer;
padding: 4px;
}

/* Style da cor de fundo da baorda da janela de filtro do Relatório*/
#WFRReportHeaderOptions {
border-bottom: 1px solid #F5F5F5;
}

#WFRReportHeaderActionsPreview, #WFRReportHeaderActionsDesign, #WFRReportHeaderActionsOrder,
#WFRReportHeaderActionsReload, #WFRReportHeaderOptionsPlugin, #WFRReportHeaderOptionsReportGenerator,
#WFRReportHeaderOptionsReportFormat {
float: left;
}

#WFRReportHeaderActions img, #WFRReportHeaderOptionsPlugin img {
vertical-align: middle;
}

#WFRReportHeaderOptionsPlugin {
padding-top: 2px;
padding-left: 6px;
}

/* Style referente a fonte para o texto de download do plugin do adobe*/
#WFRReportHeaderOptionsPlugin span {
font-family: 'Open Sans', sans-serif, arial;
font-size: 10px;
color: #747474;
}

/* Style referente as fontes dos textos da janela de filtro do Relatório*/
.WFRUserSelectReport {
font-family: 'Open Sans', sans-serif, arial;
font-size: 10px;
color: #747474;
}

#WFRReportHeaderOptionsReport {
float: right;
}

#WFRReportHeaderOptionsReport span {
font-family: 'Open Sans', sans-serif, arial;
font-size: 10px;
cursor: default;
}

/* Style referente a linha que envolve as Opções de gerador e formato*/
#WFRReportHeaderOptionsReportGenerator {
border-left: 1px solid #ffffff;
border-top: 1px solid #ffffff;
padding-left: 6px;
padding-top: 2px;
border-top-left-radius: 8px;
padding-left: 6px;
width: 130px;
}

/* Style referente a linha que envolve as Opções de gerador e formato*/
#WFRReportHeaderOptionsReportFormat {
border-top: 1px solid #ffffff;
}

#WFRReportHeaderOptionsReportGenerator div {
float: left;
}

/********************************************/
/* WFRReportOrder: Janela de Ordenação do Relatório*/
/********************************************/

/* Style da cor de fundo da janela de Ordenação do Relatório*/
#WFRReportBackgroundOrder {
float: left;
width: 100%;
background: #FFF;
background: -moz-linear-gradient(top, #ffffff 0%, #f3f3f3 50%, #ededed 51%, #ffffff 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FFF), color-stop(50%,#F3F3F3), color-stop(51%,#EDEDED), color-stop(100%,#FFF));
background: -webkit-linear-gradient(top, #FFF 0%,#F3F3F3 50%,#EDEDED 51%,#FFF 100%);
background: -o-linear-gradient(top, #ffffff 0%,#f3f3f3 50%,#ededed 51%,#ffffff 100%);
background: -ms-linear-gradient(top, #ffffff 0%,#f3f3f3 50%,#ededed 51%,#ffffff 100%);
background: linear-gradient(to bottom, #FFF 0%,#F3F3F3 50%,#EDEDED 51%,#FFF 100%);
}


/* Style dos textos da janela de Ordenação do Relatório*/
.WFRUserSelectReportOrder {
font-family: 'Open Sans', sans-serif, arial;
font-size: 10px;
color: #747474;
}

/*Estilo dos Botões*/
.WFRReportButtonOrderOk,.WFRReportButtonOrderClose {
width: 70px;
height: 20px;
border: 1px solid #A6A7B0;
border-radius: 8px;
cursor: pointer;
color: #747474;
background: #FEFEFC;
cursor: pointer;
padding: 0;
vertical-align: middle;
outline: none;
}

.WFRReportButtonOrderOk:hover,.WFRReportButtonOrderClose:hover {
background: #FFF;
border: 1px solid #F00;
color: #747474;
}

/********************************************/
/* AccessManager: Janela Modo Gerente*/
/********************************************/

#AccessManagerBackground {
background: #FFF;
background: -moz-linear-gradient(top, #ffffff 0%, #f3f3f3 50%, #ededed 51%, #ffffff 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FFF), color-stop(50%,#F3F3F3), color-stop(51%,#EDEDED), color-stop(100%,#FFF));
background: -webkit-linear-gradient(top, #FFF 0%,#F3F3F3 50%,#EDEDED 51%,#FFF 100%);
background: -o-linear-gradient(top, #ffffff 0%,#f3f3f3 50%,#ededed 51%,#ffffff 100%);
background: -ms-linear-gradient(top, #ffffff 0%,#f3f3f3 50%,#ededed 51%,#ffffff 100%);
background: linear-gradient(to bottom, #FFF 0%,#F3F3F3 50%,#EDEDED 51%,#FFF 100%);
}

#AccessManagerBackgroungTitleBar {
background: #727272;
}

#AccessManagerFontTitleAccessPermissions {
font-family: 'Open Sans', sans-serif, arial;
font-size: 12px;
color: #727272;
font-weight: bold;
}

#AccessManagerFontTitleOptionBar {
font-family: 'Open Sans', sans-serif, arial;
font-size: 10px;
color: #ffffff;
font-weight: bold;
}

#AccessManagerFontText {
font-family: 'Open Sans', sans-serif, arial;
font-size: 10px;
color: #727272;
}

#AccessManagerFontMenu {
font-family: 'Open Sans', sans-serif, arial;
font-size: 10px;
color: #ccc;
font-weight: bold;
}

#AccessManagerFontUpdateGroups {
font-family: 'Open Sans', sans-serif, arial;
font-size: 12px;
color: #89948C;
;
font-weight: bold;
}

#AccessManagerAccessPermissionsBackground {
background: #ffffff;
}

/********************************************/
/*                MENU: Atalhos             */
/********************************************/

.HTMLMenuShortCut {
width: 40px;
height: 40px;
position: absolute;
z-index: 1000;
}

.HTMLMenuShortCut > img {
position: absolute;
width: 40px;
height: 40px;
}

.HTMLMenuShortCut > span {
position: absolute;
top: 40px;
text-align: center;
width: 80px;
left: -50%;
overflow-wrap: break-word;
}

/********************************************/
/*              ORGANOGRAMA               */
/********************************************/

/*CLASSES API*/

.google-visualization-orgchart-lineleft {
border-left: 1px solid #b1b1b1;
}

.google-visualization-orgchart-linebottom {
border-bottom: 1px solid #b1b1b1;
}

.google-visualization-orgchart-lineright {
border-right: 1px solid #b1b1b1;
}

.GoogleChartOrg {
text-align: center;
vertical-align: middle;
font-family: arial,helvetica;
cursor: pointer;
border-radius: 1px;
background: #F3F3F3;
border: 1px solid #d0d0d0;
color: #7e8792;
min-width: 40px;
border-radius: 4px;
}

.GoogleChartOrg:hover {
background: #FBFBFB;
}

.GoogleChartOrgSelected {
border: 1px solid #43a24f;
background: #47C156;
color: #FFFFFF;
min-width: 40px;
overflow: hidden;
position: relative;
}

.GoogleChartOrgSelected:before {
content: '';
width: 100%;
height: 0;
left: 0;
top: 0;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
position: absolute;
display: block;
background-color: rgba(0, 0, 0, 0.2);

-webkit-animation: selectedorgan 0.3s ease-in-out;
-moz-animation: selectedorgan 0.3s ease-in-out;
-ms-animation: selectedorgan 0.3s ease-in-out;
-o-animation: selectedorgan 0.3s ease-in-out;
animation: selectedorgan 0.3s ease-in-out;

-webkit-animation-iteration-count: 1;
-moz-animation-iteration-count: 1;
-ms-animation-iteration-count: 1;
-o-animation-iteration-count: 1;
animation-iteration-count: 1;
}

.GoogleChartOrgSelected:hover {
background: #56d866;
}

/* -- Animação dos itens selecionados -- */
@-webkit-keyframes selectedorgan {
0% {
  height: 0;
  opacity: 1;
}
100% {
  height: 100%;
  opacity: 0;
}
}

@-moz-keyframes selectedorgan {
0% {
  height: 0;
  opacity: 1;
}
100% {
  height: 100%;
  opacity: 0;
}
}

@-o-keyframes selectedorgan {
0% {
  height: 0;
  opacity: 1;
}
100% {
  height: 100%;
  opacity: 0;
}
}

@keyframes selectedorgan {
0% {
  height: 0;
  opacity: 1;
}
100% {
  height: 100%;
  opacity: 0;
}
}


/*******************************************/
/*            PESQUISA DO MENU             */
/*******************************************/
.DocumentSearchItens{
top: 0;
left: 0;
width: 100%;
position: relative;
min-height: 40px;
}

.DocumentSearchItens > input{
position: relative;
top: 0;
width: 100%;
min-height: 40px;
color: rgb(138, 140, 142);
line-height: 16px;
text-align: left;
text-indent: 40px;
font-size: 13px;
font-family: 'Open Sans', sans-serif, arial;
border: solid 1px #dddddd;
outline: none;
margin-bottom: 10px;
border-radius: 2px;
background: url('search-menu-magnify.png') no-repeat left 10px center #fff;
background-repeat: no-repeat;
background-size: 18px;
transition: 0.2s;
}

.DocumentSearchItens > input:focus {
text-indent: 15px;
background-position: -28px;
border-color: #A9ACAF;
box-shadow: 2px 2px 3px 1px #D2D2D2;
}

.resultSearchList{ 
width: 100%;
}

.resultSearchList #result-item-selected {
background: url(arrow_item_msb.png) no-repeat center right 0px rgba(228, 230, 232, 0.8);
padding-right: 0px;
z-index: 10000;
}

.DocumentSearchItens > ul{
height: auto !important;
position: relative;
width: 100%;
left: 0;
font-size: 10pt;
padding: 5px 5px;
margin: 0;
background-color: #fff;
color: #B0B4B7;
border: solid 1px #dddddd;
}

.DocumentSearchItens > .HTMLImage {
left: 235px !important;
border: none;
top: 7px !important;
box-shadow: none;
}

.DocumentSearchItens > ul > li {padding: 0;}
.DocumentSearchItens > ul > li:hover { background-color: rgba(250, 250, 250, 0.1); }

.DocumentSearchItens > ul > li > a {
text-decoration: none;
font-weight: 500;
color: #42484C;
display: block;
padding-left: 7px;
padding-right: 7px;
padding-top: 7px;
padding-bottom: 7px;
text-decoration: none;
line-height: 25px;
font-size: 12px;
}

.DocumentSearchItens > ul > li:hover{
background-color: #EFEFEF;
}

.DocumentSearchItens .close-result {
font-size: 20px;
position: absolute;
top: 1px;
right: 1px;
background-color: #EAEAEA;
background: url("search-menu-close.png") no-repeat center center #fff;
background-size: 15px;
cursor: pointer;
padding: 4px 12px 9px 13px;
border: none;
height: 38px;
width: 35px;
outline: none;
opacity: 0.8;
}

.DocumentSearchItens .close-result:hover { opacity: 1;}
.DocumentSearchItens .close-result:active { background-color: #D4D4D4; }

.result-way {
display: none;
position: relative;
float: right;
margin-top: 2px;
padding: 7px 12px 5px 4px;
line-height: 1;
white-space: pre;
color: black;
cursor: default;
background-color: #ecf0f1;
border-radius: 2px;
font-size: 10px;
font-family: 'Open Sans', sans-serif, arial;
opacity: 0.9;
}

.result-way:before {
content: '';
position: absolute;
left: -6px;
top: 50%;
margin-top: -7.5px;
width: 0;
height: 0;
border-top: 7px solid transparent;
border-bottom: 7px solid transparent;
border-right: 7px solid #ECF0F1;
}

.resultSearchList li:hover .result-way,
.resultSearchList li#result-item-selected .result-way {
display: block;
}

.resultSearchList li span {color: #85898C;}
.resultSearchList li b {font-weight: 500;}

@media screen and (max-width: 479px) {
.DocumentSearchItens {
    width: 100% !important;
    height: 50px !important;
  }

  .DocumentSearchItens > input {
    width: 100%;
    margin-left: 0;
    min-height: 50px;
    font-size: 18px;
    line-height: 1.5;
  }

  .DocumentSearchItens > ul > li > a {
    font-size: 16px;
    line-height: 25px;
    text-indent: 0;
  }

  .DocumentSearchItens .close-result{
    height: 48px;
    width: 55px;
  }

  .DocumentSearchItens > ul {
    font-size: 15pt;
    line-height: 50px;
    text-indent: 15px;
  }
  /* Start Customer */
  .WFRQueryForm {
    font-family: 'segoeWp', arial, sans-serif;
  }
  .label-alert {
    position: relative!important;
    display: block!important;
    left: 2%!important;
    width: 98%!important;
  }
  .WFRQueryForm #BodySearchFilter {
    width: 100%!important;
    height: 110px!important;
    margin-top: 15px;
  }
  .WFRQueryForm #BodySearchFilter input {
    width: 100%!important;
    height: 37px!important;
    border-radius: 5px ;
    -webkit-border-radius: 5px ;
    -moz-border-radius: 5px ;
    -ms-border-radius: 5px ;
    -o-border-radius: 5px ;
  }
  #BodySearchFilterUserInput {
    margin-top: 10px;
  }
  .WFRQueryForm #BodySearchFilterCombo select {
    height: 37px!important;
    border-radius: 5px; 
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
  }
  .WFRQueryForm #BodySearchFilterCombo {
  height: 37px;
  }
  .WFRQueryForm #BodySearchFilterTitle {
    margin-bottom: 7px;
    font-size: 14px;
    width: 100%;
    text-transform: capitalize;
  }
  .WFRQueryForm #BodySearchOptions {
    float: left;
    display: flex;
    padding: 20px 5px;
  } 
  .HTMLNavigationFormButton-Help, .HTMLNavigationFormButton-Help-Over, .HTMLNavigationFormButton-Help-Des, .HTMLNavigationFormButton-Exit {
    position: relative !important;
    margin-top: 32px;
  }
  .HTMLContainer-Box {
    position: relative!important;
    top: unset!important;
    width: 100%!important;
    margin-bottom: 30px;
    left: 0!important;
  }

   .HTMLContainer-Box  .HTMLImage{
    height: 100px!important;
    display: block!important;
    padding-bottom: 0!important;
  }
  .HTMLEdit input:not([type='checkbox']){
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
  }

  /* Janela de Notificação */

  div[id*="HTMLInteraction"] {
    width: 90%!important;
    left: 10%!important;
  }
  div[id*="HTMLInteraction"] #intText {
    width: 65%!important;
  }
}

/********************************************/
/*              Localizar                   */
/********************************************/
.CustomTabSearch > div {
position: relative;
width: calc(100% - 72px);
height: 45px;
overflow-x: hidden;
overflow-y: auto;
}

#busca_acao {
width: 72px;
transition: 1s all;
}

#div_busca_rodape {
bottom: 7px!important;
width: 100%;
overflow: hidden;
}

.CustomTabSearch img {
float: right;
margin: 2px;
z-index: 3;
cursor: pointer;
}

.CustomTabSearch #calendarDiv img{
float: left;
margin: 0px;
}

.CustomTabSearch > div > span {
text-align: left;
float: right;
margin: 7px;
font-weight: bold;
}

#div_busca_avancada_container {
width: 100%;
}

.CustomTabSearch > tr {
text-align: center;
cursor: pointer;
}

#div_busca_avancada {
position: absolute;
height: calc(100% - 24px);
display: table;
z-index: 100;
background-color: rgba(0, 0, 0, 0.619608);
font-size: 15px;
width: 100%;
}

#div_busca_avancada {
position: absolute;
height: calc(100% - 24px);
display: table;
z-index: 100;
background-color: rgba(0, 0, 0, 0.619608);
font-size: 15px;
width: 100%;
}

#div_busca_avancada > div {
width: 200px;
background: #fff;
text-align: center;
position: relative;
margin: 0 auto;
vertical-align: middle;
max-width: 200px;
top: 75px;
cursor: pointer;
padding-top: 10px;
word-break: break-all;
max-height: 200px;
overflow: auto;
}

#div_busca_avancada > div > div:hover:not(:last-child) {
background: #78bff3;
color: #fff;
position: relative;

}

#div_busca_avancada > div > div:not(:last-child) {
border-bottom: 1px solid #ccc;
}

/********************************************/
/*              ESPECÍFICAS                 */
/********************************************/

.maker-container-fluid {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}

#sidebar #MenuPrincipal {
  width: 100% !important;
  padding-left: 15px;
  height: calc(100% - 0px) !important;
  padding-top: 10px;
  overflow: hidden;
  position: absolute !important;
}

#sidebar #MenuPrincipal .HTMLMenuVertical {
  width: 100%;
  border-radius: 3px;
  overflow: auto;
  height: calc(100% - 50px);
}

/* -- CSS Barra de rolagem -- */

#sidebar #MenuPrincipal .HTMLMenuVertical::-webkit-scrollbar {
width: 8px;
}
#sidebar #MenuPrincipal .HTMLMenuVertical::-webkit-scrollbar-button {
display: none;
}
#sidebar #MenuPrincipal .HTMLMenuVertical::-webkit-scrollbar-track-piece {
background-color: rgba(0, 0, 0, 0.06);
}
#sidebar #MenuPrincipal .HTMLMenuVertical::-webkit-scrollbar-thumb {
background-color: rgba(0, 0, 0, 0);
border-radius: 1px;
transition: 0.5s;
}
#sidebar #MenuPrincipal .HTMLMenuVertical:hover::-webkit-scrollbar-thumb {
background-color: rgba(110, 110, 110, 0.8);
}

#sidebar #MenuPrincipal .HTMLMenuVertical > ul {
overflow: auto;
border: solid 1px #dddddd;
}



/* CSS MAKER PARA A NOVA VERSÃO */
.sidebar-toggle {
width: 50px;
height: 50px;

-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}

.sidebar-toggle .HTMLImage {
  left: 0 !important;
  top: 0 !important;
  position: relative !important;
}

.options-action {
  display: inline-block;
  float: right;
  cursor: pointer;
}

.options-action:hover{
background-color: rgba(255,255,255,0.10);
}

#dropdown-options {
display: block;
padding: 7px 4px 7px 4px;
position: absolute;
float: right;
top: 46px;
right: 0px;
border-radius: 2px;;
min-width: 200px;
min-height: 33px;
background-color: #fafafa;

-webkit-box-shadow: 1px 1.732px 3px 0px rgba(5, 3, 5, 0.18);
-moz-box-shadow: 1px 1.732px 3px 0px rgba(5, 3, 5, 0.18);
-o-box-shadow: 1px 1.732px 3px 0px rgba(5, 3, 5, 0.18);
-ms-box-shadow: 1px 1.732px 3px 0px rgba(5, 3, 5, 0.18);
box-shadow: 1px 1.732px 3px 0px rgba(5, 3, 5, 0.18);
}

#maker-option-1 #dropdownMenu {
float: right;
top: 46px !important;
right: 0;
animation-name: dropdown;
animation-duration: 0.3s;
animation-iteration-count: 1;
-webkit-box-shadow: 0 2px 10px rgba(0,0,0,.2);
box-shadow: 0 2px 10px rgba(0,0,0,.2);
}

#maker-option-1 #dropdownMenu > div {
  width: 100%;
  float:right;
}

#maker-option-1 #dropdownMenu li:not(:last-child) { border-bottom: solid 1px #EAECED;}
  #maker-option-1 #dropdownMenu > div ul { border: solid 1px #EAECED;}

.dropdown > div:nth-child(2) {
  display: block !important;
  z-index: 9989 !important;
  position: relative;
}

#maker-profile > div {
  float: right;
  display: inline-block !important;
  position: relative !important;
}

#maker-profile .HTMLImage {
  border-radius: 50%;
  overflow: hidden;
}


/********************************************/
/*           SISTEMA DE DIVISOES            */
/********************************************/

[class*="mk-layout-"] {
float: left;
padding: 7.5px;
display: block;
height: 100%;
}

.mk-layout-1 {width: 8.33%;}
.mk-layout-2 {width: 16.66%;}
.mk-layout-3 {width: 25%;}
.mk-layout-4 {width: 33.33%;}
.mk-layout-5 {width: 41.66%;}
.mk-layout-6 {width: 50%;}
.mk-layout-7 {width: 58.33%;}
.mk-layout-8 {width: 66.66%;}
.mk-layout-9 {width: 75%;}
.mk-layout-10 {width: 83.33%;}
.mk-layout-11 {width: 91.66%;}
.mk-layout-12 {width: 100%;}

.mk-line:after {
content: "";
clear: both;
display: block;
}

.mk-box {
background-color: #fff;
min-height: 100px;
border: solid 1px #e9e9e9;
display: block;
width: 100%;
height: auto;
float: left;
position: relative;
}

.mk-box > div {
position: relative !important;
top: 0 !important;
left: 0 !important;
width: 100% !important;
}

@media (max-width: 767px){ 
[class*="mk-layout-"] {
  width: 100%;
  float: left;
}

#maker-profile {
  display: none !important;
}
}

/* CCS Boxer de ações */
#BoxerActions {
height: auto !important;
min-height: auto !important;
float: right;
right: 0;
background-color: white;
padding: 10px 10px;
border-radius: 4px;
animation-name: dropdown;
animation-duration: 0.3s;
animation-iteration-count: 1;
-webkit-box-shadow: 0 2px 10px rgba(0,0,0,.2);
box-shadow: 0 2px 10px rgba(0,0,0,.2);
}

#BoxerActions:after, #BoxerActions:before {
content: " ";
bottom: 100%;
right: 67.5px;
border: solid transparent;
height: 0;
width: 0;
position: absolute;
pointer-events: none;
}

#BoxerActions:after {
border-color: rgba(136, 183, 213, 0);
border-bottom-color: #fff;
border-width: 8px;
margin-left: -8px;
}
#BoxerActions:before {
border-color: rgba(194, 225, 245, 0);
border-bottom-color: #fff;
border-width: 8px;
}

#BoxerActions > div {
position: relative !important;
width: 80px !important;
height: 80px !important;
float: left;
left: 0;
top: 0;
margin-left: 2px;
margin-bottom: 2px;
border-radius: 2px;
border: solid 1px #ECECEC;
}

#BoxerActions > div:hover { background-color: #F0F0F1; }
#BoxerActions > div:active { background-color: #DDE1E2; }

#maker-profile{
padding-right: 10px;
height: 50px;
} 

#maker-profile:hover {background-color: #34383C ;}
#maker-profile > .HTMLImage {top: 5px;}
#maker-profile > .HTMLLabel { top: 14.5px; }
#maker-profile > .HTMLLabel > div { float: right; }
[class*=collapse] {margin-left: -250px !important;}
[class*=collapse] + [class*=content-dashboard] {left: 0 !important;margin-left: 0 !important;}

#maker-profile > .HTMLLabel > div > div {
font-size: 13px !important;
font-family: 'Open Sans', sans-serif, arial !important;
background-color: transparent !important;
}


/* Navegação da grid e da tabela */
.active-templates-row:nth-child(2n) .active-row-cell {
background-color: #F2F2F3;
}

.HTMLNavigationGrid {
width: 100%;
height: 25px !important;
margin-top: -2px;
}

.HTMLNavigationGrid .HTMLButton {
margin-right: 3px;
border-radius: 0;
height: 25px !important;
float: left;
}
.HTMLNavigationGrid .HTMLButton button {
height: 25px !important;
width: 100% !important;
cursor: pointer;
}

.HTMLTable button {
height: 25px !important;
cursor: pointer;
}

.HTMLNavigationGridButton-Include{
width: 61px !important;
}

.HTMLNavigationGridButton-Edit,
.HTMLNavigationGridButton-Refresh,
.HTMLNavigationGridButton-Delete {
margin-left: 21px !important;
}

.HTMLNavigationGrid .HTMLNavigationGridButton-Include > button, .HTMLTable [id*="div_botoes"] button[id*="_inclusao"] {
position: absolute;
float: left;
/*padding-right: 20px;*/
border-radius: 2px;
border: solid 1px #459C48 !important;
background: url("grid-incl.png") no-repeat top 5px left 7px #4CAF50 !important;
background-size: 12px !important;
}

.HTMLNavigationGrid .HTMLNavigationGridButton-Include > button:hover, .HTMLTable [id*="div_botoes"] button[id*="_inclusao"]:hover{
background-color: #57bb5b !important;
}

.HTMLNavigationGrid .HTMLButton button img,
.HTMLTable button img {
display: none;
}

.HTMLNavigationGrid .HTMLNavigationGridButton-Include > button span:before, .HTMLTable [id*="div_botoes"] button[id*="_inclusao"]:before {
content:'Add';
display: block;
position: absolute;
top: 4px;
left: 22px;
font-size: 12px;
float: left;
color: #fff;
padding-left: 6px;
border-left: solid 1px #459C48;
}

.HTMLNavigationGrid .HTMLNavigationGridButton-Edit > button, .HTMLTable [id*="div_botoes"] button[id*="_edicao"]  {
background: url("grid-alt.png") no-repeat center 5px #2595E4 !important;
background-size: 13px !important;
border: solid 1px #2187D0;
border-radius: 3px;
}

.HTMLNavigationGrid .HTMLNavigationGridButton-Edit > button:hover, .HTMLTable [id*="div_botoes"] button[id*="_edicao"]:hover  {
background-color: #3D97D8 !important;
}

.HTMLNavigationGrid .HTMLNavigationGridButton-Delete > button, .HTMLTable [id*="div_botoes"] button[id*="_exclusao"] { 
background: url("grid-del.png") no-repeat center 5px #F44336 !important;
background-size: 14px !important;
border: solid 1px #F44336;
border-radius: 3px;
}

.HTMLNavigationGrid .HTMLNavigationGridButton-Delete > button:hover, .HTMLTable [id*="div_botoes"] button[id*="_exclusao"]:hover {
background-color: #f95240 !important;
}

.HTMLNavigationGrid .HTMLNavigationGridButton-Refresh > button {
background: url("grid-reft.png") no-repeat center 3px #D8D9DA !important;
background-size: 17px !important;
border: solid 1px #B2B9BF;
}

.HTMLNavigationGrid [title*="Canc"] {
background: #D8D9DA !important;
color: #778592;
}

.HTMLNavigationGrid [title*="Cancelar"]:hover {
border-color: silver;
}

.grid button[title="Cancelar"],
.grid button[title="Cancel"],
.grid button[title="Annuler"] {
background-color: #DADADA !important;
color: #80808F;
border: solid 1px silver;
}

.HTMLTable button[id*="_salvar"] {
border: none;
border-radius: 3px;
color: #fff;
background: url("save-table-bt.png") no-repeat center #47C156 !important;
background-size: 12px !important;
cursor: pointer;
padding: 0;
vertical-align: middle;
outline: none;
-webkit-transition: all 0.2s;
-moz-transition: all 0.2s;
-o-transition: all 0.2s;
-ms-transition: all 0.2s;
transition: all 0.2s;
}

.HTMLTable button[id*="_salvar"]:hover {
background-color: #4ED05E !important;
}

.HTMLTable button:nth-child(4):focus { border: 2px solid #318C3C; }
.HTMLTable button:nth-child(4):active { background: #399E45; }

.HTMLTable button[id*="_cancelar"] {
border-radius: 3px;
background: url("cancel-table-bt.png") no-repeat center 5px #DADADA !important;
background-size: 14px !important;
border: solid 1px silver;
}

#maker-option-3 {
display: none;
}

.HTMLTableBodyCell .HTMLComboBox input{
border: 0px solid;
box-shadow: 0px 0px 0px #000;
font-size: 10px;
padding: 0px;
margin: 0px;
}

/********************************************/
/*       Responsividade especifica          */
/********************************************/

@media screen and (max-width: 1152px) {
#maker-profile > .HTMLLabel {
  display: none !important;
}

#maker-profile:hover .HTMLLabel {
  display: block !important;
  position: relative !important;
  float: right !important;
  background: #292929 !important;
  right: 0 !important;
  margin-right: -35px;
  width: auto !important;
  height: auto;
  top: calc(100% + 5px) !important;
  border-radius: 4px;
  height: auto !important;
}

#maker-profile:hover .HTMLLabel div div { margin: 4px 7px; }
.HTMLMenuHorizontal .HTMLFirstLevel > a { padding: 7px 0px 7px 0px; }
}

@media screen and (max-width: 1023px) {
.maker-container-fluid { padding: 0 !important; } 
 #header .brand-header { display: none !important; }

.navbar-default {
  margin-left: -100%;
  background-color: white;
}

[class*=collapse] {
  width: 280px !important;
  margin-left: 0 !important;
  -webkit-box-shadow: 0 2px 10px rgba(0,0,0,.2);
  box-shadow: 0 2px 10px rgba(0,0,0,.2);
}

sidebar.collapse {
  margin-left: 0;
  box-shadow: 0px 0px 3px 2px rgba(27, 27, 27, 0.18);
}

#sidebar #MenuPrincipal { padding: 0 !important; }
.content-dashboard { margin-left: 0 !important; }
.DocumentSearchItens { height: 50px !important; }

.DocumentSearchItens > input {
  width: 100%;
  margin-left: 0;
  min-height: 50px;
  font-size: 18px;
  line-height: 1.5;
  margin-bottom: 0;
}

[class*=collapse] + [class*=content-dashboard] {
  left: 125px !important;
}
}

@media screen and (max-width: 422px) {
#BoxerActions {
  position: fixed !important;
  vertical-align: middle;
  right: auto;
  top: auto !important;
  left: 0;
  width: 100% !important;
  overflow: auto;
  height: calc(100% - 50px) !important;
  background-color: rgb(244, 246, 247);
  padding-top: 10px;
}

#BoxerActions > div {
  width: calc(33.3% - 2px) !important;
  height: auto !important;
  border-radius: 0;
  margin: 2px 1px 0 0;
}

#BoxerActions > div > img{
  position: relative;
  display: table-cell;
  vertical-align: middle;
  width: 90px !important;
  height: 90px !important;
  margin: 0 auto;
}

.options-action:not(#maker-profile), 
.options-action > div,
.sidebar-toggle,
.sidebar-toggle .HTMLImage,
.sidebar-toggle .HTMLImage img{
  height: 60px !important;
  width: 60px !important;
}

.options-action > div >img {
  width: 60px !important;
  position: relative;
  top: 5px;
}
#maker-profile {
  height: 60px;
}

#maker-profile > div,
#maker-profile > div > img {
  top: 0 !important;
  width: 50px !important;
  height: 50px !important;
}

#maker-profile > .HTMLImage { top: 5px !important; }
#control-actions { padding: 0 !important; }
#page-wrapper { padding-top: 60px !important; }

#maker-option-1 #dropdownMenu {
  top: 58px !important;
  width: 220px !important;
  height: auto !important;
}

#dropdownMenu .HTMLMenuVertical .HTMLFirstLevel > a {
  line-height: 30px;
}

.HTMLMenu li a {
  font-size: 16px !important;
}

/* --------------------   Responsividade das janelas flutuantes */

.WFRIframeForm {
  position: fixed;
  width: 100% !important;
  height: 100% !important;
  left: 0 !important;
  top: 0 !important;
  border-radius: 0;
}

.WFRIframeForm .Options > div { margin-left: 3px !important; }
.FormIframe iframe { width: 100% !important; height: 100% !important;}
.WFRIframeForm .Title { width: calc(100% - 32%) !important;}
.WFRIframeForm .FormIframe { height: 100% }
.WFRIframeForm .Title,
.WFRIframeForm .Options {
  padding-top: 10px;
}



.HTMLTabController,
.HTMLNavigationFormBar {
  width: 100% !important;
  background: #F5F5F5 !important;
  top: 0 !important;
}

.WFRIframeForm .StatusBar {
  height: 50px;
  position: absolute;
  z-index: 9;
  margin-left: 55px;
  max-width: calc(100% - 55px);
}

/* --------------------   Responsividade dos formulários */
/*
*Removido devido a barra de rolagem não persistir no mobile.
#lay {
  overflow: hidden !important;  
}
*/
.HTMLTabController {
  position: relative !important;
  background: #FEFEFC !important;
  overflow: hidden;
  overflow-x: auto;
  height: auto !important;
}
.HTMLTabContainer {
  height: calc(100% - 50px);
  top: 50px !important;
}

.HTMLTabController td {
  padding: 0;
}

.HTMLTabArea{
/*  padding-left: 15px;
  padding-right: 15px;*/
  position: relative !important;
  border: none;
  top: 0 !important;
}

.HTMLEdit:not([id*="BodySearchFilterUserInput"]), 
.HTMLEdit div:last-child:not(.HTMLImage),
.HTMLComboBox,
.HTMLComboBox > div:last-child {

}

/*  .HTMLEdit div:first-child,
.HTMLComboBox div:first-child {
  position: relative !important;
  height: auto !important;
  margin-bottom: 8px;
}*/

.HTMLEdit>div>input,
.HTMLComboBox>div>input {
  width: 100% !important;
}

.HTMLComboBox> div> .HTMLButton { width: 45px !important; }
.HTMLComboBox> div> .HTMLButton button { background-size: 15px !important; }

.HTMLEdit font,
.HTMLComboBox font strong {
  font-weight: 500 !important;
}

.HTMLComboBoxDetails {
  width: calc(100% - 30px) !important;
  display: block;
  left: 17px !important;
  margin-top: 25px !important;
}

.formViewDiv {
  width: calc(100% - 17px) !important;
  top: 95px !important;
}

.grid { width: calc(100% - -12px)!important; }
.HTMLNavigationGrid { height: auto !important; }
.HTMLNavigationGrid .HTMLButton { height: auto !important;margin-left: 3px !important;margin-top: 10px; }

/*.HTMLNavigationGrid .HTMLButton button {
  height: 27px !important;
  min-height: 27px !important;
  margin-top: 15px;
}*/

.HTMLNavigationGrid .HTMLButton button {
  top: 0 !important;
  margin-top: 0 !important;
  min-width: 30px !important;
}

.HTMLNavigationForm {
    background-color: #f5f5f5!important;
    top: 50px !important;
    height: calc(100% - 50px)!important;
    
}

.HTMLNavigationMenu {
  background: url("menu.png") no-repeat center center !important;
  background-size: 34px !important;
  width: 35px;
  height: 35px;
  left: 0;
  top: 0;
  opacity: 0.5;
}

.HTMLNavigationMenu-active {
  background: url("close.png") no-repeat center center !important;
  background-size: 34px !important;
  left: 0;
  top: 0;
  opacity: 0.5;
}

.HTMLTab, .HTMLTab-Selected {
  height: 45px;
  display: inline;
  margin: 0;
  border-radius: 0;
  background: #fff;
  -webkit-box-shadow: none;
  box-shadow: none;
  padding-top: 4px;
  padding: 6px 10px 0 10px;
  font-size: xx-small;
}

.HTMLTab-Selected {
  padding-top: 12px;
  border-bottom: solid;
}

.HTMLNavigationForm {
  /*height: 100% !important;*/
  width: 60px !important;
}

.HTMLNavigationForm[style*="display: none"] + .HTMLTabContainer {
  top: 0 !important;
}

/*.HTMLNavigationGridButton-IncludeCancel,
.HTMLNavigationGridButton-IncludeCancel button,
.HTMLNavigationGridButton-IncludeSave,
.HTMLNavigationGridButton-IncludeSave button {
  overflow: visible;
  float: left !important;
  display: inline-block !important;
  float: right !important;
  clear: left;
  margin-top: -24px;
  min-height: 40px !important;
}*/

.HTMLNavigationForm .HTMLNavigationFormButton, .HTMLNavigationButton {
  min-height: 35px;
  padding-top: 0 !important;
}

#arealogin {
  top: 40% !important;
  margin: 0 !important;
  width: 100% !important;
  position: fixed !important;
  transform: translateY(-50%);
  padding-top: 50%;
}
}

.FormIframe iframe {
position: relative !important;
}

/* Form de Login */
#arealogin > div {
left: auto !important;
position: relative !important;
margin: 0 auto;
line-height: 1.5;
}

#arealogin #EdtLogin { top: 0 !important; }
#arealogin #EdtSenha { top: 100px !important; }
#arealogin #BttLogar { top: 200px !important; }
#arealogin #biometric { top: 150px !important; }

#arealogin #txwelcome {
font-family: 'Open Sans', sans-serif, arial;
top: 0 !important;
margin-top: -233px;
}

#arealogin #txdescricao {
font-family: 'Open Sans', sans-serif, arial;
top: 25px !important;
}

#arealogin #cpfooter { top: 300px !important; }
.WFRIframeForm .OptionMinimize { background-image: url('wmin.png'); }
.WFRIframeForm .OptionMinimize:hover { background-image: url('wmin_hover.png');}
.WFRIframeForm .OptionRefresh { background-image: url('wrec.png');}
.WFRIframeForm .OptionRefresh:hover { background-image: url('wrec_hover.png');}

.WFRIframeForm .OptionClose {
  width: 30px;
  background-image: url('wclose.png');
}

.WFRIframeForm .OptionClose:hover {
  width: 30px;
  background-image: url('wclose_hover.png');
}

.WFRIframeForm .OptionClose:active {
  width: 30px;
  background-image: url('wclose_active.png');
}

#minimizedFloatingDivs {
  bottom: 17px;
  height: 26px;
}

#minimizedFloatingDivs .WFRIframeForm .OptionMinimize { background-image: url('wmin-max.png'); }
#minimizedFloatingDivs .WFRIframeForm .OptionMinimize:hover { background-image: url('wmin-max_hover.png');}

/********************************************/
/*              Animations                 */
/********************************************/

@-webkit-keyframes dropdown {
  from { right: -20px; opacity: 0;}
  to   { right: 0; opacity: 1;}
}
@-moz-keyframes dropdown {
  from { right: -20px; opacity: 0;}
  to   { right: 0; opacity: 1;}
}
@-o-keyframes dropdown {
  from { right: -20px; opacity: 0;}
  to   { right: 0; opacity: 1;}
}
@keyframes dropdown {
  from { right: -20px; opacity: 0;}
  to   { right: 0; opacity: 1;}
}

/********************************************/
/*                 UPLOAD                   */
/********************************************/

.HTMLBodyUpload{
background: #fff;
}

.HTMLButtonUpload{
background: #FFFFFF!important;
width: 100px;
height: 35px;
border-radius: 14px;
border: 1px solid #D3D1D1;
}

.HTMLButtonUpload:hover{
border: 1px solid #f00;
}

.HTMLButtonUpload .botao{
color: #000!important;
font-size: 12px;
}

/*******************************************************/
/* HTMLGroupBoxCheck: Componente Moldura no CheckList  */
/*******************************************************/

.HTMLGroupBoxCheckDefault{
border-radius: 0px;
text-align: center;  
text-indent: -18%;
line-height: 41px;
font-size: 17px;
cursor: default;
}

.HTMLGroupBoxCheckTrue{
background-color: #C2E2C1;
text-decoration: line-through;
color: #047700;
}

.HTMLGroupBoxCheckFalse{
background-color: #FF9B97;
color: #864343;
border: none;
}

.HTMLGroupBoxCheckWarning{
background-color: #f0ad4e;
text-decoration: line-through;
color: #885000;
}

.HTMLSystemCheckLabelInfo > div >div{
font-size: 12px!important;
color: #fff!important;
}

.HTMLSystemCheckLabelInfo > div >div:hover{
font-size: 13px!important;
}

.HTMLSystemCheckLabelInfo a{
color: #fff!important;
}

.HTMLSystemCheckOk{
color: #047700;
}

.HTMLSystemCheckFail{
color: #f00;  
}

.charts-tooltip{
display: none !important;
}


@media screen and (max-width: 420px){

.HTMLLookup {
    width: 100%!important;
    position: relative!important;
    left: 2px!important;
    top: 25px!important;
}

.grid .HTMLNavigationGrid > .HTMLNavigationGridButton-Include {
    position: unset !important;
    width: 60px !important;
    top: 0px !important;
}

.active-box-normal {
    height: 27px!important;
}

.HTMLTabContainer .HTMLTabArea {
  height: calc(100% - 45px) !important;
  overflow: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

[class*=collapse] + [class*=content-dashboard] {
  left: 0 !important;
}

.gridDiv .HTMLLookupGrid > input:not([type='hidden']),
.gridMark .HTMLLookupGrid > input:not([type='hidden']) {
  width: 100%;
}

/*
** - Responsivdade do HTMLMessage   
*/

.HTMLMessage {
  width: calc(100% - 40px);
  left: 20px !important;
}

#HTMLInteraction2 {
  width: calc(100% - 30px);
  left: 15px !important;
}

div[id*="HTMLInteraction"] #intText #intTextCenter {
  width: 200px;
}

.HTMLGroupBox {
  padding-bottom: 20px;
}

.HTMLRadioGroup #HTMLRadioGroupOptions {
  top: none!important;
  transform: none!important;
  position: relative!important;
  -webkit-transform: none!important;
  -moz-transform: none!important;
  -ms-transform: none!important;
  -o-transform: none!important;
}
}

@media screen and (max-width: 422px){

.HTMLLookup .HTMLButton button:enabled {
  top: 0px;
}

/*.HTMLEdit div:first-child, .HTMLComboBox div:first-child {
  margin-bottom: 13px;
  top: -18px!important;
}*/

}

@media (max-height: 640px) { 
.HTMLNavigationForm {
  height: calc(100% - 60px) !important;
  overflow: hidden;
  overflow-y: auto;
}
}

/*********************************************/
/***               ACCORDION               ***/
/*********************************************/
.HTMLAccordion {
overflow: hidden; 
margin: -1px; 
color: #474747; 
padding: 0px;
background: #ececec;
width: 100%;
height: 100%;
}
/*Configurações Gerais*/

.HTMLAccordion section h2 a{
padding:8px 10px;
display:block; 
font-size:100%;  
font-weight:normal;
color: #525252;
text-decoration:none;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-family: 'Open Sans', sans-serif, arial;
}

/*Apresentação do Slide fechado*/
.HTMLAccordion section{
float: left; 
cursor: pointer; 
overflow: hidden;
background-color: rgba(80, 80, 80, 0.05);
margin:1.9px;
}

.HTMLAccordion section:hover {
background-color: rgba(93, 93, 93, 0.19);
}

.HTMLAccordion section p {
visibility:hidden;
}

.HTMLAccordion section div {
visibility:hidden;
}

.HTMLAccordion section:after{
position:relative;
font-size:24px;
color:#000;
font-weight:bold;
}

/*Configuração para o horizontal*/
.HTMLAccordionHorizontal section{ 
-moz-transition:width 0.2s ease-out; 
-webkit-transition:width 0.2s ease-out;
-o-transition:width 0.2s ease-out;
-ms-transition:width 0.2s ease-out;
transition:width 0.2s ease-out;
border-top: 2px solid #89C396;
}
/**/
.HTMLAccordionHorizontal section:after{
top:140px;
left:15px;
}
/**/
.HTMLAccordionHorizontal section h2 { 
-webkit-transform:rotate(90deg);
-moz-transform:rotate(90deg);
-o-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg);
width:240px; 
position:relative; 
left:-100px; 
top:85px;
} 

/*Configuração para o vertical*/
.HTMLAccordionVertical section{ 
width:99%; 
height:36px;
-webkit-transition:height 0.2s ease-out;
-moz-transition:height 0.2s ease-out;
-o-transition:height 0.2s ease-out;
-ms-transition:height 0.2s ease-out;
transition:height 0.2s ease-out;
border-left: 2px solid #89C396;
}
/**/
.HTMLAccordionVertical section h2 { 
position:relative; 
left: 0px; 
top: 0px;
margin: 0px;
}
/**/
.HTMLAccordionVertical section:after{ 
top:-60px;
left:810px;
}

/*Abrir Horizontalmente*/
.HTMLAccordionHorizontalOpen{
-moz-transition:width 0.2s ease-out; 
-webkit-transition:width 0.2s ease-out;
-o-transition:width 0.2s ease-out;
-ms-transition:width 0.2s ease-out;
transition:width 0.2s ease-out; 
background:#FFF!important; 
padding:0px!important; 
background: #FFF!important;
opacity: 1.0!important;
border-top: 2px solid #89C396!important;
border-bottom: solid 3px #89C396!important;
border-left: 0px solid #41A200!important;
}

.HTMLAccordionHorizontalOpen h2 {
width:100%!important;
top:0px!important;
left:0px!important;
-webkit-transform:rotate(0deg)!important;
-moz-transform:rotate(0deg)!important;
-o-transform: rotate(0deg)!important;
-ms-transform: rotate(0deg)!important;
transform: rotate(0deg)!important; 
margin: 0px;
}

.HTMLAccordionHorizontalOpen h2 a{
color: #3E824D !important;
font-family: 'Open Sans', sans-serif, arial;
font-size: 120%!important;
transition: font-size 0.2s;
}

.HTMLAccordionHorizontalOpen p {
visibility:visible!important;
}

.HTMLAccordionHorizontalOpen div {
visibility:visible!important; 
color:black!important;
}

/*Abrir Verticalmente*/
.HTMLAccordionVerticalOpen{ 
width:99%!important;
background: #FFF!important;
opacity: 1.0!important;
border-top: 2px solid #89C396!important;
border-bottom: solid 3px #89C396!important;
border-left: 0px solid #41A200!important;
}

.HTMLAccordionVerticalOpen:after{ 
left:-9999px!important;
}

.HTMLAccordionVerticalOpen p {
visibility:visible!important;
}
.HTMLAccordionVerticalOpen div {
visibility:visible!important; 
color:black!important;
}

.HTMLAccordionVerticalOpen h2 a{
color: #3E824D !important;
font-family: 'Open Sans', sans-serif, arial;
font-size: 120%!important;
transition: font-size 0.2s;
}



// Spinner Variables
//********************************************************//
$color:      #ffffff;
$size:       30px;
$speed:      0.75s;
$thickness:  8px; // Odd numbers created a "wobble" effect.


// Animation Keyframes
//********************************************************//

@-webkit-keyframes rotate-forever { @include rotate-forever; }
 @-moz-keyframes rotate-forever { @include rotate-forever; }
      @keyframes rotate-forever { @include rotate-forever; }


// The Loading Spinner?
//********************************************************//
.loading-spinner {
@include animation-duration($speed);
@include animation-iteration-count(infinite);
@include animation-name(rotate-forever);
@include animation-timing-function(linear);
@include size($size);
border: $thickness solid $color;
border-right-color: transparent;
border-radius: 50%;
display: inline-block;
}


/***********************************/
/****** Classe HTMLMessage  ********/ 
/**********************************/

.HTMLMessage {
left: calc(50% - 150px);
position: absolute;
cursor: default;
top: 30%;
border-radius: 4px;
margin: 9px;
z-index: 999998;
background: rgb(255, 255, 255);
padding: 15px 12px 0 12px !important;
width: 300px;
border: 1px solid #efefef;
transition: top 0.2s;
animation: showHTMLMessage 0.2s;
box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
}

@media screen and (max-height: 300px){
.HTMLMessage{
  top: 0px;
  transform: scale(.95);
}
}

/**
* Classe HTMLMessageOverlay (overlay)
**/
.HTMLMessageOverlay {
  background-color: rgba(0, 0, 0, 0.3);
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  display: none;
  z-index: 100;
  transition: display 0.2s;
}

/**
* Classe HTMLMessageTitle (título principal)
**/

.HTMLMessageTitle {padding-top: 0px;font-weight: 600;font-size: 1rem;margin: 0;}

/**
* Classe HTMLMessageMessage (mensagem)
**/

.HTMLMessageMessage {
  margin: 5px 0 0 0;
  font-size: .9rem;
  color: #b6b7b7;
}

.HTMLMessageContainerButtons {
position: relative;
display: block;
width: 100%;
padding-top: 3px;
padding-bottom: 16px;
min-height: 0;
color: white;
overflow: hidden;
text-align: right;
font-size: small;
font-family: sans-serif, arial;
}

.HTMLMessageConfirm {
position: relative;
width: 85px;
background-color: rgb(54, 204, 93);
border: none;
border-radius: 4px;
color: #fff;
font-weight: 600;
font-size: .8rem;
font-family: inherit;
margin: 0 auto;
padding: 8px 13px;
}

.HTMLMessageConfirm:hover {
cursor: pointer;
}

.HTMLMessageConfirmError {
position: relative;
height: 24px;
width: 85px;
background-color: rgb(19, 123, 212);
border: none;
color: #fff;
font-size: 11px;
font-family: inherit;
margin: 0 auto;
}

.HTMLMessageConfirmError:hover {
cursor: pointer;
}


.HTMLMessageCancel {
position: relative;
display: block;
width: 85px;
border-radius: 4px;
background-color: rgb(213, 216, 220);
border: none;
cursor: pointer;
border-radius: 4px;
color: #61666d;
font-size: .8rem;
margin: 0 6px;
font-weight: 600;
padding: 8px 13px;
}

.HTMLMessageCancel:hover {
cursor: pointer;
}

.HTMLMessageInputText {
width: 100%;
box-sizing: border-box;
border: 1px solid #969696;
height: 25px;
margin-top: 10px;
font-size: 13px;
box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.06);
-webkit-transition: all 0.3s;
transition: all 0.3s;
}

.HTMLMessageInputText:focus {
border-color: #137bd4;
}

.HTMLMessageWarning {
width: 28px;
height: 28px;
border: 4px solid gray;
border-radius: 50%;
border-color: #F8BB86;
margin-top: 5px;
margin-left: 10px;
margin-right: 20px;
position: relative;
box-sizing: content-box;
float: left;
}

.HTMLMessageWarningBody {
position: absolute;
height: 8px;
left: 50%;
top: 4px;
-webkit-border-radius: 2px;
border-radius: 2px;
margin-left: -2px;
border-color: #F8BB86;
border: 2px solid;
}

.HTMLMessageWarningDot {
position: absolute;
height: 1px;
-webkit-border-radius: 50%;
border-radius: 50%;
margin-left: -3px;
left: 52%;
bottom: 5px;
border-color: #F8BB86;
border: 2.5px solid;
}

.HTMLMessageAnimate{
-webkit-animation: HTMLMessageAnimate 0.75s infinite alternate;
animation: HTMLMessageAnimate 0.75s infinite alternate;
}

@-webkit-keyframes HTMLMessageAnimate {
0% {
  border-color: #F8D486; }
100% {
  border-color: #F8BB86; } 
}

@keyframes HTMLMessageAnimate {
0% {
  border-color: #F8D486; }
100% {
  border-color: #F8BB86; } 
}

.HTMLMessageError {
width: 28px;
height: 28px;
border: 4px solid gray;
-webkit-border-radius: 40px;
border-color: #F27474;
border-radius: 40px;
border-radius: 50%;
margin-top: 2px;
margin-left: 10px;
margin-right: 10px;
margin-bottom: 5px;
position: relative;
float: left;
box-sizing: content-box;
}

.HTMLMessageErrorMain {
position: relative;
display: block;
}

.HTMLMessageErrorRight {
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
right: 6px;  
}

.HTMLMessageErrorLeft {
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
left: 6px;
}

.HTMLMessageErrorLine {
position: absolute;
height: 4px;
width: 16px;
background-color: #F27474;
display: block;
top: 12px;
border-radius: 14px;
}

.HTMLMessageBoxDetails {
word-break: break-all;
position: static;
border: none;
max-height: 0;
max-height: 0px;
padding: 0;
overflow: hidden;
display: block;
width: 100%;
transition: max-height 0.4s;
-webkit-transition-delay: 0.1s; /* Safari */
transition-delay: 0.1s;
top: 80%;
}


.HTMLMessageDetails {
position: relative;
align-items: center;
float: right;
right: 9px;
margin-top: -1px;
width: 20px;
height: 20px;
border-radius: 50%;
cursor: pointer;
background: #dddede;
}

.HTMLMessageDetails *{
background-color: #9c9c9c;
}

.HTMLMessagePlusX {
cursor: pointer;
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
left: calc(50% - 6px);
top: 9px;
position: absolute;
height: 2px;
width: 12px;
display: block;
transition: transform 0.2s ease-in;
transition-delay: 0.1s;
}

.HTMLMessagePlusXClick {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
left: calc(50% - 6px);
position: absolute;
height: 2px;
width: 12px;
display: block;
top: 9px;
transition: transform 0.3s ease-in;
transition-delay: 0.1s;
}

.HTMLMessagePlusY {
cursor: pointer;
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
top: 9px;
height: 2px;
width: 12px;
left: calc(50% - 6px);
display: block;
position: absolute;
transition: transform 0.3s;
transition-delay: 0.1s;
}

.HTMLMessagePlusYClick {
cursor: pointer;
/*-webkit-transform: rotate(90deg);
transform: rotate(90deg);*/
height: 2px;
width: 12px;
top: 9px;
left: calc(50% - 6px);
display: block;
position: absolute;
transition: transform 0.4s ease-out;
transition-delay: 0.1s;
}

.HTMLMessageMessage > p {
  margin: 0 0 18px 0;
}


@keyframes showHTMLMessage{
0%{
transform: scale(0.7);
opacity: 0.5;
}
50%{
transform: scale(1.2);
opacity: 0.7;
}
70%{
transform: scale(1.1);
opacity: 0.9;
}
100%{
transform: scale(1);
opacity: 1;
}
}

.HTMLMessageTextDetails:not(:empty) {
padding: 10px;
background: #ebeeef;
}



.HTMLMessageLeftEscape {
position: relative;
animation-name: HTMLMessageEscapeToLeft;
animation-duration: 0.2s;
}

@-webkit-keyframes HTMLMessageEscapeToLeft{
0%{opacity: 1;}
25%{opacity: 0.7; left: -70px; transform: scale(.9)}
50%{opacity: 0.5; left: -140px; transform: scale(.7)}
75%{opacity: 0.3; left: -210px; transform: scale(.6)}
80%{opacity: 0.2; left: -280px;  transform: scale(.4)}
100%{opacity: 0.1; left: -360px; transform: scale(.2)}
}

@keyframes HTMLMessageEscapeToLeft{
0%{opacity: 1;}
25%{opacity: 0.7; left: -70px; transform: scale(.9)}
50%{opacity: 0.5; left: -140px; transform: scale(.7)}
75%{opacity: 0.3; left: -210px; transform: scale(.6)}
80%{opacity: 0.2; left: -280px;  transform: scale(.4)}
100%{opacity: 0.1; left: -360px; transform: scale(.2)}
}

.HTMLMessageRightEscape {
position: relative;
animation-name: HTMLMessageEscapeToRight;
animation-duration: 0.2s;
}

@-webkit-keyframes HTMLMessageEscapeToRight{
0%{opacity: 1;}
25%{opacity: 0.7; right: -70px; transform: scale(.9)}
50%{opacity: 0.5; right: -140px; transform: scale(.7)}
75%{opacity: 0.3; right: -210px; transform: scale(.6)}
80%{opacity: 0.2; right: -280px;  transform: scale(.4)}
100%{opacity: 0.1; right: -360px; transform: scale(.3)}
}

@keyframes HTMLMessageEscapeToRight{
0%{opacity: 1;}
25%{opacity: 0.7; right: -70px; transform: scale(.9)}
50%{opacity: 0.5; right: -140px; transform: scale(.7)}
75%{opacity: 0.3; right: -210px; transform: scale(.6)}
80%{opacity: 0.2; right: -280px;  transform: scale(.4)}
100%{opacity: 0.1; right: -360px; transform: scale(.3)}
}


/*******************************************************/
/* HTMLListagem: Componente Listagem                   */
/*******************************************************/
.HTMLListagem .HTMLImage{
cursor: pointer;
max-width: 30px;
}

.HTMLListagemFields {
 overflow: auto;
 height: calc(100% - 75px);
}

.HTMLListagemFields > div {
width: 100%;
height: 20px;
display: inline-flex;
position: relative;
background: #e9ecec;
overflow: hidden;
}

.HTMLListagemFields > div .HTMLCheckBox{
display: inline-flex!important;
position: relative!important;
overflow: hidden!important;
font-family: 'Open Sans', sans-serif, arial;
font-size: 12px;
font-weight: 500;
color: #555B61;
text-indent: 5px;
}

.HTMLListagemFields > div .HTMLCheckBox > input{
margin-left: calc(50% - 7.5px);
}

.HTMLListagemFields > div .HTMLLabel{
display: inline-flex!important;
position: relative!important;
overflow: hidden!important;
font-family: 'Open Sans', sans-serif, arial;
font-size: 10px;
font-weight: 500;
color: #555B61;
text-indent: 5px;
margin-top: 4px;
}

.HTMLListagemFields > div .HTMLLabel > div > div {
background: rgba(255, 255, 255, 0);
}

.HTMLListagemFields > div .HTMLComboBox{
display: inline-flex!important;
position: relative!important;
overflow: hidden!important;
font-family: 'Open Sans', sans-serif, arial;
font-size: 12px;
font-weight: 500;
color: #555B61;
text-indent: 5px;
}

.HTMLListagemFields > div .HTMLEdit{
display: inline-flex!important;
position: relative!important;
overflow: hidden!important;
font-family: 'Open Sans', sans-serif, arial;
font-size: 12px;
font-weight: 500;
color: #555B61;
text-indent: 5px;
}