:root {
    /* ########## L O G I N ########## */
    /*Color principal*/
    --main-color: #0a9dd9 !important;
    /*Color de fondo de la web*/
    --main-bg-color: #FFFFFF !important;
	--main-login-bg-color: #FFFFFF !important;
    /*Color secundario*/
    --secondary-color: #097dad !important;
    /*Color de los inputs del login*/
    --input-text-color: #F1F6F9 !important;
    /*Color de fondo del boton*/
    --button-bg-color: #0a9dd9 !important;
    /*Color del texto del boton*/
    --button-color: #097dad !important;
    /*Color boton on hover*/
    --button-bg-color-hover: rgb(88, 163, 111) !important;
    /*Color text boton on hover*/
    --button-color-hover: #FFFFFF !important;
    /*Color page table buttons*/
    --button-table-color: #66C4E8 !important;
	/*Button login*/
    --login-button: #097dad !important;
    /*Color bar*/
    --menu-bar: #097dad !important;
    /*Color bar letters*/
    --menu-bar-letters: #FFFFFF !important;
	--menu-bar-sub-letters: #5b6165 !important; 
    --menu-bar-letters-small-screen: #778D9B !important;
    --menu-bar-letters-hover: #778D9B !important;
    --menu-bar-letters-small-screen-hover: #FFFFFF !important;
    /*Subtitle color*/
    --subtitle-color: #D0525D !important;
    /*Subtitle color subtitle*/
    --subtitle-color-subtitle: #778D9B !important;
    /*Buttons of Consulta and Gestio*/
    --group-of-buttons-one: #66C4E8 !important;
    /*Buttons of Consulta and Gestio hover*/
    --group-of-buttons-one-hover: #ccc !important;
    /*Buttons of Superviso*/
    --group-of-buttons-two: #D0525D !important;
    /*Buttons of Superviso hover*/
    --group-of-buttons-two-hover: #ccc !important;
    /*icon color small scren*/
    --icon-color-small-screen: #778D9B !important;
    /*Table pagination*/
    --table-pagination: #778D9B !important;
    /*Icon of title buttons Consulta, Gestion, Supervision*/
    --icon-group-of-buttons-one: #D0525D !important;
    /*Header background menu Hover*/
    --header-menu-background-hover: #F6FAFC !important;
	/*Border table*/
	--border-table: #dee2e6 !important;
	/*Tabs*/
	--tab-none-active: #0A9DD9 !important;
	--tab-active: #FFFFFF !important;	
	
	--gray-icon: #778D9B !important;
    /* ################################ */
}


/*##############################################################################################################################*/


/*##############################################################################################################################*/


/*##############################################################################################################################*/

i.red {
    color: black;
}


/*yellow*/

i.gray {
    color: var(--gray-icon) !important;
}

i.icon-cards.Fs40.red.Fleft.MarRight10, 
i.fa.fa-bar-chart-o.Fs40.red.Fleft.MarRight10 {
    color: var(--icon-group-of-buttons-one) !important;
}

h2.red {
    color: var(--subtitle-color);
}


/*titles*/


/*gray*/

h2.gray {
    color: var(--subtitle-color-subtitle);
}


/*titles*/

span.gray {
    color: var(--subtitle-color-subtitle);
}


/*titles*/

div.blue {
    color: var(--group-of-buttons-one);
}


/*titles*/

a.bg-red {
    background-color: var(--group-of-buttons-two) !important;
}

a.bg-red:hover {
    background-color: var(--group-of-buttons-two-hover) !important;
}


/*buttons*/

a.bg-blue {
    background-color: var(--group-of-buttons-one) !important;
}

a.bg-blue:hover {
    background-color: var(--group-of-buttons-one-hover) !important;
}

/*buttons*/

a.gray {
    background-color: var(--group-of-buttons-one) !important;
}

a.gray:hover {
    background-color: var(--group-of-buttons-one-hover) !important;
}


/*buttons*/


/*menu*/

i.icon-cards,
i.fa.fa-home,
i.fa.fa-bar-chart-o,
i.icon-supervisor {
    color: var(--icon-color) !important;
}

@media (max-width: 1024px) {
    a.Animated05 {
        color: var(--subtitle-color-subtitle) !important;
    }
    a.Animated05:hover {
        color: var(--subtitle-color) !important;
    }
    i.icon-cards,
    i.fa.fa-home,
    i.fa.fa-bar-chart-o,
    i.icon-supervisor {
        color: var(--icon-color-small-screen) !important;
    }
    form ul li a.Animated05 {
        color: var(--subtitle-color-subtitle) !important;
    }
}


/*color header menu*/

.layout-topbar-menu {
    color: var(--subtitle-color-subtitle) !important;
}

.layout-topbar-menu:hover {
    color: var(--menu-bar-letters-hover) !important;
}

.layout-topbar-menu:hover {
    color: var(--menu-bar) !important;
}

body .ui-menu .ui-menu-list .ui-menuitem .ui-menuitem-link.ui-state-hover, 
body .ui-menu .ui-menu-list .ui-menuitem.ui-menuitem-active > .ui-menuitem-link {
	background: var(--menu-bar) !important;
}

/*menu*/

#layout-menu>li a {
    color: var(--menu-bar-letters) !important;
}

.ui-menu li span {
	color: var(--menu-bar-letters) !important;
}

.ui-menu li li span {
	color: var(--menu-bar-sub-letters) !important;
}


#layout-menu>li a:hover {
    color: var(--subtitle-color-subtitle) !important;
}

@media (min-width: 1024px) {
	.ui-menu li li:hover > a > span {
		color: var(--menu-bar-letters) !important;
	}
}

@media (max-width: 1024px) {
    #layout-menu>li a {
        color: var(--menu-bar-letters-small-screen) !important;
    }
    #layout-menu>li a:hover {
        color: var(--menu-bar-letters-small-screen-hover) !important;
    }
}


/*submenu*/

#layout-menu li ul li a {
    color: var(--subtitle-color-subtitle) !important;
}

#layout-menu li ul li a:hover {
    color: var(--menu-bar-letters) !important;
}


/*bottons on hover*/

span.ui-button-text.ui-c:hover {
    /*color: #54585A !important;*/
    background-color: var(--secondary-color) !important;
}

button.LoginPage span{
    background-color:  var(--login-button);
}

/*paginacio taula*/

.ui-datatable .ui-paginator.ui-paginator-bottom .ui-paginator-first.ui-state-disabled,
.ui-datatable .ui-paginator.ui-paginator-bottom .ui-paginator-prev.ui-state-disabled,
.ui-datatable .ui-paginator.ui-paginator-bottom .ui-paginator-next.ui-state-disabled,
.ui-datatable .ui-paginator.ui-paginator-bottom .ui-paginator-last.ui-state-disabled {
    background-color: var(--table-pagination) !important;
}


/*Loading*/

.ui-datatable .ui-paginator.ui-paginator-bottom .ui-paginator-last.ui-state-disabled {
    background-color: var(--table-paginatio) !important;
}


/*Creueta targetes*/

i.fa.fa-times.red {
    color: #D0525D;
}


/*##############################################################################################################################*/


/*##############################################################################################################################*/


/*##############################################################################################################################*/

#layout-menu li ul a.ui-spark-focus {
    background-color: inherit;
}

.bgImage {
    background-color: var(--main-bg-color)
}

input.LoginPage {
    background-color: var(--input-text-color);
    -webkit-box-shadow: 1px 5px 5px -1px rgba(143, 143, 143, 1);
    -moz-box-shadow: 1px 5px 5px -1px rgba(143, 143, 143, 1);
    box-shadow: 1px 5px 5px -1px rgba(143, 143, 143, 1);
}

/*Para eliminar el color de los inputs al autocompletar el usuario y contraseña*/

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 30px var(--input-text-color) inset !important;
}

#mobile-menu-button {
    background-color: var(--menu-bar) !important;
}

.header_nav, .ui-menu {
    background-color: var(--menu-bar) !important;
}

@media (min-width: 1024px){

	.header_nav #layout-menu, .ui-menu #layout-menu {
		background-color: var(--menu-bar) !important;
	}

	.header_nav #layout-menu>li>.openSubMenu , .ui-menu #layout-menu>li>.openSubMenu {
		border-bottom: 5px solid var(--menu-bar);
		border-radius: 0!important;
	}

	.header_nav #layout-menu>li:hover>a, .ui-menu #layout-menu>li:hover>a{
		color: var(--secondary-color);
	}

	#layout-topbar-menu,
	#layout-menu {
		border-bottom-color: var(--menu-bar);
		border-top-color: var(--menu-bar);
	}

	#layout-menu li:hover>a {
		color: var(--menu-bar-letters-hover) !important;
		background-color: var(--menu-bar) !important;
	}

	.header_nav #layout-menu .menu-separator {
		color: var(--secondary-color);
	}

	#layout-topbar-menu li:hover,
	#layout-topbar-menu li:hover>a {
		background-color: var(--header-menu-background-hover) !important;
	}

	#layout-topbar-menu li ul {
		border-radius: 0;
		border-color: var(--menu-bar);
	}

	#layout-topbar-menu li ul li a:hover {
		background-color: var(--menu-bar) !important;
	}

	#layout-topbar-menu li ul li a.ui-spark-focus {
		background-color: var(--main-color);
	}
}

@media (max-width: 1024px){
	
	.header_nav #layout-menu, .ui-menu #layout-menu {
		background-color: var(--menu-bar) !important;
	}

	.header_nav #layout-menu>li>.openSubMenu , .ui-menu #layout-menu>li>.openSubMenu {
		border-bottom: 5px solid var(--menu-bar);
		border-radius: 0!important;
	}

	.header_nav #layout-menu>li:hover>a, .ui-menu #layout-menu>li:hover>a{
		color: var(--secondary-color);
	}

	#layout-topbar-menu,
	#layout-menu {
		border-bottom-color: var(--menu-bar);
		border-top-color: var(--menu-bar);
	}

	#layout-menu li:hover>a {
		background-color: var(--header-menu-background-hover) !important;
		color: var(--subtitle-color) !important;
	}

	.header_nav #layout-menu .menu-separator {
		color: var(--secondary-color);
	}

	#layout-topbar-menu li:hover,
	#layout-topbar-menu li:hover>a {
		background-color: var(--header-menu-background-hover) !important;
	}

	#layout-topbar-menu li ul {
		border-radius: 0;
		border-color: var(--menu-bar);
	}

	#layout-topbar-menu li ul li a:hover {
		background-color: var(--menu-bar) !important;
	}

	#layout-topbar-menu li ul li a.ui-spark-focus {
		background-color: var(--main-color);
	}
	
	#layout-menu li > a  {
	    background-color: var(--input-text-color) !important;
	}
	
	.ui-menu li span {
		color: var(--menu-bar-letters-small-screen) !important;
	}
	
	
	/*.outerDivTopBarMenuSmallScreen .ui-menu li span {
    	color: var(--subtitle-color-subtitle) !important;
	}
	
	.outerDivTopBarMenuSmallScreen #layout-menu li:hover > a {
	    text-decoration-color: initial !important;
	    color: white !important;
	    background-color: var(--header-menu-background-hover) !important;
	}
	.outerDivTopBarMenuSmallScreen .ui-menu li a:hover > span,
	.outerDivTopBarMenuSmallScreen .ui-menu li a:active > span {
		color: var(--button-color-hover) !important;
	}*/
}

.ui-fluid .ui-inputfield {
    background-color: #e8f3f5;
}

.ui-fluid .ui-inputfield:not(.ui-selectonemenu-label) {
    background-color: #e8f3f5;
}

.ui-fluid .ui-calendar:hover label.item-label--calendar,
.ui-fluid .ui-calendar:focus label.item-label--calendar {
    background-color: --secondary-color;
}

.ui-fluid .ui-calendar label.item-label--calendar {
    background-color: var(--main-color);
}

.ui-fluid .ui-calendar input:focus,
.ui-fluid .ui-calendar input:hover {
    border-color: var(--main-color);
    color: var(--main-color) !important;
}

.ui-datepicker .ui-datepicker-header {
    background-color: var(--main-color);
}

.ui-datepicker .ui-datepicker-calendar tbody tr .ui-datepicker-current-day a {
    color: #fff!important;
}

.ui-selectonemenu-panel .ui-selectonemenu-item {
    background-color: #e8f3f5;
}

.ui-selectonemenu-panel .ui-selectonemenu-item.ui-state-highlight {
    color: var(--main-color) !important;
}

.ui-widget .ui-widget .fc-toolbar {
    background-color: var(--main-color);
}

.ui-dialog .ui-dialog-titlebar {
    background-color: var(--main-color);
}

.ui-datatable .ui-datatable-summaryrow {
    background-color: var(--secondary-color);
}

.ui-datatable .ui-datatable-header {
    background-color: var(--secondary-color);
}

.ui-datatable .ui-paginator .ui-paginator-pages .ui-state-active {
    border: solid 1px var(--secondary-color);
    background-color: var(--secondary-color);
}

.ui-datatable .ui-paginator .ui-paginator-pages .ui-state-hover {
    border: solid 1px var(--secondary-color);
    background-color: var(--secondary-color);
}

.ui-datatable .ui-paginator.ui-paginator-bottom .ui-paginator-pages .ui-paginator-page {
    background-color: var(--table-pagination);
}

.ui-datatable .ui-paginator.ui-paginator-bottom .ui-paginator-pages .ui-paginator-page:hover {
    background-color: var(--menu-bar);
}

.ui-datatable .ui-paginator.ui-paginator-bottom .ui-paginator-pages .ui-paginator-page.ui-state-active,
.ui-datatable .ui-paginator.ui-paginator-bottom .ui-paginator-pages .ui-paginator-page.ui-state-focus {
    background-color: var(--menu-bar);
}

.ui-datatable .ui-paginator.ui-paginator-bottom .ui-paginator-next,
.ui-datatable .ui-paginator.ui-paginator-bottom .ui-paginator-prev,
.ui-datatable .ui-paginator.ui-paginator-bottom .ui-paginator-last,
.ui-datatable .ui-paginator.ui-paginator-bottom .ui-paginator-prev,
.ui-datatable .ui-paginator.ui-paginator-bottom .ui-paginator-first,
.ui-datatable .ui-paginator.ui-paginator-bottom .ui-paginator-rpp-options {
    background-color: var(--table-pagination) !important;
}

.ui-datatable .ui-paginator.ui-paginator-bottom .ui-paginator-next:hover,
.ui-datatable .ui-paginator.ui-paginator-bottom .ui-paginator-prev:hover,
.ui-datatable .ui-paginator.ui-paginator-bottom .ui-paginator-last:hover,
.ui-datatable .ui-paginator.ui-paginator-bottom .ui-paginator-prev:hover,
.ui-datatable .ui-paginator.ui-paginator-bottom .ui-paginator-first:hover,
.ui-datatable .ui-paginator.ui-paginator-bottom .ui-paginator-rpp-options:hover,
.ui-datatable .ui-paginator.ui-paginator-bottom .ui-paginator-next:focus,
.ui-datatable .ui-paginator.ui-paginator-bottom .ui-paginator-prev:focus,
.ui-datatable .ui-paginator.ui-paginator-bottom .ui-paginator-last:focus,
.ui-datatable .ui-paginator.ui-paginator-bottom .ui-paginator-prev:focus,
.ui-datatable .ui-paginator.ui-paginator-bottom .ui-paginator-first:focus,
.ui-datatable .ui-paginator.ui-paginator-bottom .ui-paginator-rpp-options:focus {
    background-color: var(--menu-bar) !important;
}

.ui-datatable table thead tr th {
    background-color: #e8f3f5;
}

.ui-datatable table tbody .ui-state-hover>td {
    color: var(--secondary-color);
}

body .ui-datatable thead th, 
body .ui-datatable .ui-datatable-data > tr > td {
    border: 1px solid var(--border-table) !important;#dee2e6;
}

.ui-datatable table tbody tr.ui-state-hover td,
.ui-datatable table tbody tr.ui-state-highlight td {
    color: var(--secondary-color) !important;
}

.ui-paginator-first.ui-state-focus {
    border: solid 1px var(--main-color) !important;
    background-color: var(--main-color) !important;
}

.ui-paginator-rpp-options.ui-state-focus {
    border: solid 1px var(--main-color) !important;
    background-color: var(--main-color) !important;
}

.ui-datalist .ui-datalist-header {
    background-color: var(--main-color);
}

.ui-datalist .ui-paginator .ui-paginator-pages .ui-state-active {
    border: solid 1px var(--main-color);
    background-color: var(--main-color);
}

.ui-datalist .ui-paginator .ui-paginator-pages .ui-state-hover {
    border: solid 1px var(--main-color);
    background-color: var(--main-color);
}

.ui-orderlist .ui-orderlist-list .ui-state-hover {
    color: var(--main-color);
}

.ui-orderlist .ui-orderlist-list .ui-state-highlight {
    color: var(--main-color);
}

.ui-carousel .ui-carousel-header {
    background-color: var(--main-color);
}

.ui-carousel .ui-carousel-header .ui-carousel-prev-button:hover {
    background-color: var(--secondary-color);
}

.fc-header tbody tr td .fc-button {
    border: solid 0px var(--main-color);
    background-color: var(--main-color);
}

.fc-header tbody tr td .ui-state-hover {
    background-color: var(--secondary-color);
}

.fc-header tbody tr td .ui-state-active {
    background-color: var(--secondary-color);
}

.fc-content .fc-view-month table tbody tr td:hover {
    border-color: var(--main-color);
}

.fc-content .ui-state-highlight {
    border-color: var(--main-color);
}

.fc-toolbar button {
    border: solid 1px var(--main-color);
    background-color: var(--main-color);
}

.fc-toolbar .ui-state-active {
    background-color: var(--secondary-color);
    border-color: var(--secondary-color);
}

.fc-toolbar .ui-state-hover {
    background-color: var(--secondary-color);
    border-color: var(--secondary-color);
}

.fc-view-container .fc-month-view table tbody tr .fc-day:hover {
    border-color: var(--main-color) !important;
    color: var(--main-color);
}

.fc-view-container .fc-month-view .fc-bg table tbody tr .fc-today {
    border-color: var(--main-color) !important;
    color: var(--main-color);
}

.ui-tree .ui-treenode .ui-state-highlight {
    color: var(--main-color);
}

.ui-treetable .ui-treetable-header {
    background-color: var(--main-color);
}

.ui-treetable table tbody .ui-state-highlight td {
    color: var(--main-color) !important;
}

.ui-tree-horizontal .ui-treenode .ui-state-highlight {
    color: var(--main-color);
    border: solid 1px var(--main-color) !important;
}

.ui-accordion-header {
    background-color: var(--main-color);
}

.ui-accordion .ui-state-hover {
    background-color: var(--secondary-color);
    color: #e8f3f5;
}

.ui-accordion .ui-state-active {
    background-color: var(--secondary-color);
    color: #e8f3f5;
}

.ui-accordion .ui-tabs-outline {
    background-color: var(--secondary-color);
}

.ui-steps .ui-steps-item .ui-steps-number {
    background-color: var(--main-color) !important;
}

.ui-tagcloud li a.ui-state-hover {
    background-color: var(--main-color);
}

.ui-layout-unit .ui-layout-unit-header {
    background-color: var(--main-color);
}

.ui-wizard .ui-wizard-step-titles li {
    background-color: var(--secondary-color);
}

.ui-wizard .ui-wizard-step-titles li.ui-state-highlight {
    background-color: var(--main-color);
}

.ui-slider-handle.ui-state-focus {
    background-color: var(--secondary-color);
}

.ui-datascroller .ui-datascroller-header {
    background-color: var(--main-color);
}

.ui-tabs-top .ui-tabs-navscroller .ui-tabs-navscroller-btn {
    background-color: var(--main-color);
}

.ui-tabs-top .ui-tabs-nav li.ui-state-hover a {
    color: var(--main-color) !important;
}

.ui-tabs-left .ui-tabs-nav li.ui-state-hover a {
    color: var(--main-color) !important;
}

.ui-tabs-right .ui-tabs-nav li.ui-state-hover a {
    color: var(--main-color) !important;
}

.ui-tabs-bottom .ui-tabs-navscroller .ui-tabs-navscroller-btn {
    background-color: var(--main-color);
}

.ui-tabs-bottom .ui-tabs-nav li.ui-state-hover a {
    color: var(--main-color) !important;
}

.ui-fieldset-legend {
    background-color: var(--menu-bar) !important;
	color: var(--input-text-color) !important;
}

.ui-fieldset-legend.ui-state-hover {
    background-color: var(--secondary-color);
}

.ui-inputfield.ui-state-hover {
    border: solid 1px var(--main-color);
    color: var(--main-color) !important;
}

.ui-inputfield.ui-state-focus {
    border: solid 1px var(--main-color);
    color: var(--menu-bar) !important;
}

.ui-button-text {
    background-color: var(--button-bg-color);
    color: var(--input-text-color);
    text-transform: uppercase;
    font-weight: 600;
    -webkit-box-shadow: 1px 5px 5px -1px rgba(143, 143, 143, 1);
    -moz-box-shadow: 1px 5px 5px -1px rgba(143, 143, 143, 1);
    box-shadow: 1px 5px 5px -1px rgba(143, 143, 143, 1);
}

.ui-button.ui-state-active .ui-button-text {
    background-color: var(--button-bg-color-hover);
    color: var(--button-color-hover);
}

.ui-button.ui-state-focus .ui-button-text {
    background-color: var(--button-bg-color-hover);
    color: var(--button-color-hover);
}

.ui-button.ui-state-hover .ui-button-text {
    background-color: var(--button-bg-color-hover);
    color: var(--button-color-hover);
}

.ui-buttonset .ui-state-active .ui-button-text {
    background-color: var(--button-bg-color-hover);
    color: var(--button-color-hover);
}

.ui-buttonset .ui-state-hover .ui-button-text {
    background-color: var(--button-bg-color-hover);
    color: var(--button-color-hover);
}

.ui-panelmenu .ui-panelmenu-panel .ui-panelmenu-header {
    background-color: var(--main-color);
}

.ui-panelmenu .ui-panelmenu-panel h3.ui-state-hover {
    background-color: var(--secondary-color);
}

.ui-tabmenu .ui-tabmenu-nav .ui-state-hover {
    background-color: var(--main-color);
}

.ui-tabmenu .ui-tabmenu-nav .ui-state-active {
    background-color: var(--main-color);
}

.ui-panel .ui-panel-titlebar {
    background-color: var(--main-color);
}

.alvic-restriction {
    background-color: var(--main-color) !important;
    border: 1px solid var(--main-color) !important;
}

.ui-selectonemenu.ui-state-focus {
    border: 1px solid var(--main-color) !important;
}

.ui-selectonemenu .ui-selectonemenu-trigger {
    background-color: var(--menu-bar);
}

.ui-selectonemenu .ui-selectonemenu-trigger.ui-state-hover {
    background-color: var(--menu-bar);
}

.ui-selectonemenu .ui-selectonemenu-trigger.ui-state-focus {
    background-color: var(--menu-bar);
}

.ui-selectonemenu-panel {
    border-top: solid 5px var(--main-color);
    border-bottom: solid 5px var(--main-color);
}

.ui-selectonemenu-panel .ui-state-highlight {
    color: var(--main-color) !important;
}

.ui-selectcheckboxmenu.ui-state-focus {
    border: solid 1px var(--main-color) !important;
}

.ui-selectcheckboxmenu .ui-selectcheckboxmenu-trigger {
    background-color: var(--main-color);
}

.ui-selectcheckboxmenu-panel {
    border-top: solid 5px var(--main-color);
    border-bottom: solid 5px var(--main-color);
}

.ui-selectcheckboxmenu-panel .ui-state-highlight {
    color: var(--main-color) !important;
}

.ui-log-header {
    background-color: var(--main-color);
}

.ui-chkbox .ui-state-hover {
    border-color: var(--secondary-color);
}

.ui-chkbox .ui-state-active {
    border-color: var(--secondary-color);
}

.ui-chkbox .ui-state-focus {
    outline: dotted 1px var(--main-color);
}

.ui-chkbox-box .ui-icon-check {
    background-color: var(--main-color);
}

.ui-fluid .ui-chkbox .ui-chkbox-box {
    border: solid 1px #C6D6DF;
}

.ui-radiobutton .ui-state-hover {
    border: solid 1px var(--secondary-color);
}

.ui-radiobutton .ui-state-active {
    border: solid 1px var(--secondary-color);
}

.ui-radiobutton .ui-state-active .ui-icon-bullet {
    background-color: var(--main-color);
}

.ui-radiobutton .ui-state-focus {
    outline: dotted 1px var(--main-color);
}

#keypad-div {
    border-top: solid 5px var(--main-color);
    border-bottom: solid 5px var(--main-color);
}

#keypad-div .keypad-row button {
    border: solid 1px var(--main-color);
}

#keypad-div .keypad-row button.ui-state-hover {
    background-color: var(--main-color);
}

.ui-password-panel {
    border-top: solid 5px var(--main-color);
    border-bottom: solid 5px var(--main-color);
}

.ui-inputswitch:hover {
    border: solid 1px var(--main-color);
}

.ui-inputswitch:focus {
    border: solid 1px var(--main-color);
}

.ui-inputswitch .ui-inputswitch-on span {
    color: var(--main-color);
}

.ui-inputswitch-handle {
    border: solid 3px var(--main-color) !important;
    background-color: var(--main-color);
}

.ui-selectmanymenu .ui-selectlistbox-item.ui-state-hover td {
    color: var(--main-color);
}

.ui-selectmanymenu .ui-state-hover {
    color: var(--main-color);
}

.ui-selectmanymenu .ui-state-highlight {
    color: var(--main-color);
}

.ui-datepicker-calendar tbody tr td:hover {
    background-color: var(--main-color);
    border: solid 1px var(--main-color);
}

.ui-datepicker-calendar tbody tr .ui-datepicker-today {
    border: solid 1px var(--main-color);
}

.ui-datepicker-calendar tbody tr .ui-datepicker-today a {
    color: var(--main-color) !important;
}

.ui-datepicker-calendar tbody tr .ui-datepicker-current-day {
    background-color: var(--main-color);
    border: solid 1px var(--main-color);
}

.ui-progressbar-label {
    color: var(--main-color);
}

.ui-autocomplete-panel {
    border-top: solid 5px var(--main-color);
    border-bottom: solid 5px var(--main-color);
}

.ui-slider-handle {
    border: solid 1px var(--main-color) !important;
    background-color: var(--main-color);
}

.ui-datagrid .ui-datagrid-header {
    background-color: var(--main-color);
}

.ui-datagrid .ui-paginator .ui-paginator-pages .ui-state-hover {
    border: solid 1px var(--main-color);
    background-color: var(--main-color);
}

.ui-tabs {
    border-bottom: 3px solid var(--main-color);
}

.ui-tabs .ui-tabs-navscroller {
    background-color: var(--main-color);
}

.ui-tabs .ui-tabs-navscroller .ui-tabs-nav .ui-tabs-selected a,
.ui-tabs .ui-tabs-navscroller .ui-tabs-nav .ui-state-hover a {
    color: var(--main-color) !important;
}

.ui-picklist.ui-picklist-responsive .ui-picklist-caption {
    background-color: var(--main-color);
}

.ui-picklist.ui-picklist-responsive .ui-picklist-list .ui-picklist-item.ui-state-hover,
.ui-picklist.ui-picklist-responsive .ui-picklist-list .ui-picklist-item.ui-state-highlight {
    background-color: var(--main-color) !important;
}

.ui-picklist.ui-picklist-responsive .ui-picklist-buttons button {
    background-color: var(--main-color);
}

.ui-picklist.ui-picklist-responsive .ui-picklist-buttons button.ui-state-hover {
    background-color: var(--secondary-color);
}

.BigTopic {
    background-color: var(--menu-bar);
}

.BigTopic2 {
    background-color: var(--secondary-color);
}

.item-design2>*:last-child span {
    background-color: var(--button-table-color) !important;
}

.ui-fluid:hover label.item-label--calendar,
.ui-fluid:focus label.item-label--calendar {
    background-color: var(--main-color);
}

.ui-fluid .ui-outputpanel label.item-label--calendar {
    background-color: var(--main-color);
}

.ui-fluid .ui-calendar input:focus,
.ui-fluid .ui-calendar input:hover {
    border-color: var(--main-color);
    color: var(--main-color) !important;
}

.ui-datepicker .ui-datepicker-header {
    background-color: var(--main-color);
}

.ui-selectonemenu-panel .ui-selectonemenu-item.ui-state-highlight {
    color: var(--secondary-color) !important;
}

.ui-widget .ui-widget .fc-toolbar {
    background-color: var(--main-color);
}

.ui-dialog .ui-dialog-titlebar {
    background-color: var(--main-color);
}

.ui-panelgrid-content .ui-grid-row:last-child .ui-selectmanycheckbox {
    margin-top: 15px;
}

.ui-datatable .ui-datatable-header {
    background-color: var(--secondary-color);
}

.ui-datatable table tbody tr.ui-state-hover td,
.ui-datatable table tbody tr.ui-state-highlight td {
    color: var(--secondary-color);
}

.ui-tabs {
    border-bottom: 3px solid var(--main-color);
}

.ui-tabs .ui-tabs-navscroller {
    background-color: var(--main-color);
}

.ui-tabs .ui-tabs-navscroller .ui-tabs-nav .ui-tabs-selected a,
.ui-tabs .ui-tabs-navscroller .ui-tabs-nav .ui-state-hover a {
    color: var(--main-color);
}

.ui-picklist.ui-picklist-responsive .ui-picklist-caption {
    background-color: var(--main-color);
}

.ui-picklist.ui-picklist-responsive .ui-picklist-list .ui-picklist-item.ui-state-hover,
.ui-picklist.ui-picklist-responsive .ui-picklist-list .ui-picklist-item.ui-state-highlight {
    background-color: var(--main-color) !important;
}

.backgroundbuttonAccept {
    background-color: var(--main-color) !important;
}

.backgrounbuttonCancel {
    background-color: var(--button-table-color) !important;
}

a.ui-paginator-first.ui-state-default.ui-corner-all.ui-state-disabled,
a.ui-paginator-first.ui-state-default.ui-corner-all,
a.ui-paginator-prev.ui-state-default.ui-corner-all.ui-state-disabled,
a.ui-paginator-prev.ui-state-default.ui-corner-all,
a.ui-paginator-next.ui-state-default.ui-corner-all.ui-state-disabled,
a.ui-paginator-next.ui-state-default.ui-corner-all,
a.ui-paginator-last.ui-state-default.ui-corner-all.ui-state-disabled,
a.ui-paginator-last.ui-state-default.ui-corner-all,
a.ui-paginator-page.ui-state-default.ui-state-active.ui-corner-all,
a.ui-paginator-page.ui-state-default.ui-corner-all,
.ui-paginator-rpp-options.ui-widget.ui-state-default.ui-corner-left,
.ui-paginator-rpp-options.ui-widget.ui-state-default.ui-corner-left {
	color: var(--menu-bar-letters) !important;
}

.errorText {
	color: red !important;
}

/************************************************/
					/*TABS*/
/************************************************/

body .ui-tabs .ui-tabs-nav li.ui-tabs-header {
	background-color: var(--tab-none-active) !important;
	color: var(--menu-bar-letters) !important;
}

body .ui-tabs .ui-tabs-nav li.ui-tabs-header a{
	color: var(--menu-bar-letters) !important;
}

body .ui-tabs .ui-tabs-nav li.ui-tabs-header.ui-state-active {
	background-color: var(--tab-active) !important;
}

/************************************************/
					/*HORARIA*/
/************************************************/

.AutorizeAll, .UnautorizeAll {
	background-color: var(--secondary-color) !important;
}



