:root {
  --color-principal: #009999;
  --color-principal-fosc: rgb(1, 134, 134);
  --color-principal-clar: rgba(4, 122, 124, 0.65);
  --sauquia-gradient: linear-gradient(45deg, rgba(0,0,0,1) 0%, hsl(181deg 94% 20%) 0%, rgba(0,153,153,1) 100%);
  --transicio: 200ms;
}

/* custom scrollbar */
/* width */
::-webkit-scrollbar {
  width: 5px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #7fc5c5; 
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background: #036163; 
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #555; 
}

/* RESPONSIVE THINGS  */
/* ELEMENTOS DEL MENU */

/* Oculta por defecto icono de menu (lo controlamos con media*/
.toggle-icon {
  display: none;
}

#navbar_new {
  padding: 5px 0px;
  margin-bottom: 5px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-radius: 0px 0px 10px 10px;
  user-select: none;
}

.menu_usuari_escritorio {
  display: contents;
}

/* Popup modal para mobil, al hacer click en el avatar o nombre del user logueado */
/* Fondo del modal */
.modalPopup {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 999;
  font-family: "Roboto";
  
}

/* Contenido */
.modalPopup_content {
  background: white;
  width: 90%;
  max-width: 320px;
  border-radius: 10px 0px 10px 10px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.2);
  overflow: hidden;
  animation: fadeIn 0.3s ease;
}

/* Cabecera */
.modalPopup_header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: var(--sauquia-gradient);
  padding: 12px 16px;
  border-bottom: 1px solid #ddd;
  cursor: default;
}

.modalPopup_header h2 {
  margin: 0;
  font-weight: 200;
  font-size: 24px;
  margin-left: 10px;
  color: #efefef;
}

.color_icona {

  color: var(--color-principal)
}
/* Cierre */
.close_btn {
  font-size: 20px;
  cursor: pointer;
  color: #efefef;
  transition: color 0.2s;
}

/* Cuerpo */
.modalPopup_body {
  display: flex;
  flex-direction: column;
  padding: 16px;
  gap: 12px;
}

.modalPopup_body a {
  display: flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  color: #333;
  font-size: 15px;
  padding: 10px;
  border-radius: 8px;
  transition: background 0.2s;
}

.modalPopup_body a:hover {
  background: #f0f0f0;
}

/* Oculto */
.modalPopup.oculto {
  display: none;
}

/* Animación */
@keyframes fadeIn {
  from { opacity: 0; transform: scale(0.95); }
  to { opacity: 1; transform: scale(1); }
}

/* Version mobil */

@media (max-width: 767px) {
  /* Ocultamos todo lo que tenga clase escritorio */
  .escritorio {
    display: none !important;
  }
  #mainMenu_login {
    margin: 30px auto !important;
  }
  #avatar_nav {
    display: none !important;
  }
  #layout_new {
    width: 100% !important;
    margin-left: 0px !important;
	
  }
  #navbar_new {
    border-radius: 0px 0px 0px 0px !important;  
    margin-bottom: 0px !important;
  }
  #menu {
    height: auto !important;
  }
  #menu_fons {
    display: none;
  }

  #menu_fons.menu_visible {
    display: block;
  }
  #menu_entorn {
    padding-left: 0px !important;
  }
  #menu_usuari {
    margin-right: 0px !important;
  }

  #menu_elements {
    padding: 15px 10px 25px 15px !important;
  }
  #agrupador_menu_wraper{
    height: calc(100% - 38px) !important;
  }
  #wraper {
    border-radius: 0px 0px 0px 0px !important;
    padding: 0px 0px 20px 0px !important;
  }
  #content {
    padding: 5px 0px 0px 0px !important;
  }

  #contingutHeader{
    flex-direction: column !important;
    align-items: normal !important;
  }
  #menu_fons {
    border-radius: 0px 0px 0px 0px !important;
    width: 100% !important;
    transition: width 0.3s ease, opacity 0.3s ease;
  }
  #titolHeader {
    line-height: 20px !important;
    margin-left: 5px !important;
  }
  a.textTitol {
    font-size: 23px !important;
  }
  #butActions {
    justify-content: flex-end !important;
    padding-top: 10px !important;
    line-height: 40px !important;
  }
  #textEpisodi {
    font-size: 23px !important;
    font-weight: 400;
  }
}

/* Versión escritorio */
@media (min-width: 768px) {
  /* Ocultamos todo lo que tenga clase mobile */
  .movil  {
    display: none !important;
  }
  #menu {
    height: auto !important;
  }
  #user_modal {
    display: none !important;
  }
}
/*
COLOURPICKER
*/
#jquery-colour-picker{
	width: 360px;
}
.SumoUnder{
  height: 76%;
}
#colourpickerimg{
	margin-bottom: 12px;
	margin-left: 5px;	
}
#np{
   margin-left: 13px;
    width: auto;
    height: auto;
    margin-top: -7px;
    
}
.icon_helper{
    margin-left: 3px;
    width: auto;
    height: auto;
}
.column_flex{
  display: flex;
}
.ocultar {
  display: none !important;
}
textarea:focus, input[type="text"]:focus, input[type="password"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="time"]:focus, input[type="week"]:focus, input[type="number"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="color"]:focus, .uneditable-input:focus {
    border-radius: 5px;
}
select:focus {
    border-color: var(--color-principal-fosc);
    outline: 0;
    outline: thin dotted \9;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px var(--color-principal-fosc);
    -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px var(--color-principal-fosc);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px var(--color-principal-fosc);
    border-radius: 5px;
}

button:active {
outline: none;
border: none;
}
#alert_hr{
  border-color: #828282;
    margin-top: -6px;
}
#layout_new {
    height: 100%;
    width: calc(100% - 10px);
        margin-left: 5px;
position: fixed;

}

.layout_sidepanel {
    margin: revert !important;
    width: 100% !important;
    overflow: auto;
}
.layout_popup {
    margin: revert !important;
    width: 100% !important;
    overflow: auto;
}
#alert_title{
      font-weight: 500;
    font-size: large;
}
#alert_img{
  position: absolute;
  display: none;
  height: 64px;
  width: 64px;
    margin-left: -62px;
    margin-top: -66px;
        -webkit-box-shadow: 0px 0px 44px 3px rgb(255, 255, 255);
    -moz-box-shadow: 0px 0px 44px 3px rgb(255, 255, 255);
    box-shadow: 0px 0px 44px 3px rgb(255, 255, 255);
    border-radius: 100px;
}

.hide{
  display: none;
}

/* AQUI CONTROLEM EL MENU */

.full_page{
  height: 100%;
}
/*colapsed*/

.full_page_menu_c .sidebar {
  width: 48px !important;
  transition: var(--transicio);
} 
.full_page_menu_c .icona_menu_e_c:before {
  content: "\f105";
}

.full_page_menu_c .icona_menu_e_c {
  margin-top: 1px;
  margin-left: 1px;
}

.full_page_menu_c .fa-submenu {
  padding-right: 0px
}

.full_page_menu_c #alert_num {
    position: relative;
    top: -30px;
    left: 12px;
}

.full_page_menu_c .nom_item {
  display: none;
} 

.full_page_menu_c b.caret {
  display: none;
} 
.full_page_menu_c .usr_show {
  display: none;
} 
.full_page_menu_c .dropdown-menu {
  min-width: fit-content;
  margin-left: -4px;
} 
.full_page_menu_c #avatar_nav_small {
  display: initial;
} 

.full_page_menu_c .noline {
  display: none;
} 

.full_page_menu_c .entorn {
  display: none;
} 

.full_page_menu_c .colapse-expand-menu {
  left: 12px;
  transition: var(--transicio);
} 

.full_page_menu_c #wraper {
  left: 40px;
  transition: var(--transicio);
} 

.full_page_menu_c .usr_show {
  display: none;
} 

/* expanded*/

.full_page_menu_e #avatar_nav_small {
  display: none;
} 

.full_page_menu_e .fa-submenu {
  padding-right: 4px
}
.full_page_menu_e .sidebar {
  transition: var(--transicio);
} 

.full_page_menu_e .icona_menu_e_c {
  margin-top: 1px;
  margin-left: -1px;
}

.full_page_menu_e .colapse-expand-menu {
  left: 183px;
}

.full_page_menu_e .icona_menu_e_c:before {
  content: "\f104";
  transition: var(--transicio);
}
.full_page_menu_e .sidebar {
  width: 215px;
  transition: var(--transicio);
}
.full_page_menu_e #wraper {
  left: 215px;
  transition: var(--transicio);
} 

/* expanded hover */

.full_page_menu_eh .fa-submenu {
  padding-right: 4px
}
.full_page_menu_eh #avatar_nav_small {
  display: none;
  transition: var(--transicio);
} 

.full_page_menu_eh .icona_menu_e_c:before {
  content: "\f105";
  transition: var(--transicio);
}

.full_page_menu_eh .icona_menu_e_c {
  margin-top: 1px;
  margin-left: 1px;
}

.full_page_menu_eh .colapse-expand-menu {
  left: 12px;
  transition: var(--transicio);
}
.full_page_menu_eh .sidebar {
  width: 215px;
  transition: var(--transicio);
}
.full_page_menu_eh #wraper {
  left: 215px;
  transition: var(--transicio);
} 
/* fi control menu */

.c-e-menu {
  position: absolute;
    top: 8px;
    background: var(--menu-high);
    text-align: center;
    width: 23px;
    height: 23px;
    border-radius: 35px;
}

#v_d {
    background-color: #01969642;
text-align: center;
    border-radius: 45px;
    padding: 10px 10px;
    display: inline-table;
    width: 40px;
    height: 40px;
    margin-right: 10px;
}
#v_u {
    background-color: #cf464642;
text-align: center;
    border-radius: 45px;
    padding: 10px 10px;
    display: inline-table;
    width: 40px;
    height: 40px;
    margin-right: 10px;
}
#v_t {
    background-color: #0f4ed542;
text-align: center;
    border-radius: 45px;
    padding: 10px 10px;
    display: inline-table;
    width: 40px;
    height: 40px;
    margin-right: 10px;
}

#text_v{
  font-size: 1.1rem;
    margin-right: 22px;
}

#imatge_usuari{
  width: 50px;
border-radius: 150px;
}
#id_e_c {
  color: white;
}

.color_blanc{
  color: white;
}

.color_black{
  color: #717171;
}

button:focus {outline:0;}
.tab-content {
    overflow: inherit;
}
.btn:active {
outline: none;
border: none;
}
.btn:focus {outline:0;}

/* EASY PIE CHART */

#missatgeErrorFiltre{
      margin-top: 12px;
    margin-bottom: -6px;
    text-align: center;
}

.btn_filtre {
      border-color: transparent;
    cursor: pointer;
    margin-top: -10px;
    background: white;
}

#nodata{
    text-align: center;
    font-size: x-large;
    font-weight: 300;
/*    margin-top: 43px;*/
    padding: 30px 0px 40px 0px;
    background: #f3f3f3;
    border-radius: 9px;
}

.filter_title_dates {
    color: gray;
    font-size: smaller;
}

.chart {
  position: relative;
  display: inline-block;
  width: 150px;
  height: 150px;
  margin-top: 50px;
  margin-bottom: 50px;
  text-align: center;
  margin-right:22px;
  font-weight:bold;
}
.chart canvas {
  position: absolute;
  top: 0;
  left: 0;
}
.percent {
  display: inline-block;
  line-height: 160px;
  z-index: 2;
}
.percent:after {
  content: '%';
  margin-left: 0.1em;
  font-size: .8em;
}

/* FREEOW TEXTS */

#free_blau{
	font-weight: 400;
  	color: rgb(87, 148, 218);
  	font-size: 17px;
  line-height: 16px;
}
#blau{
    font-weight: 400;
    color: rgb(87, 148, 218);
    font-size: 17px;
    line-height: 16px;
}
#error{
    font-weight: 400;
    color: #F44336;
    font-size: 17px;
    line-height: 16px;
}
#bullet{
    margin-left: 51px;
}
.error_mr{
  background-color: #fbdbdb !important; 
}
#timesheet_img{
  width: 100%;
  
}
#timesheet_p{
  border-radius: 0px 0px 0px 0px;
  width: 39px;
  text-align: right;
  padding-right: 10px;
  font-weight: normal;
  font-size: 18px;
  position: absolute;
  top: 9px;
}
#timesheet_p_m{
  border-radius: 0px 0px 0px 0px;
  width: 39px;
  text-align: right;
  padding-right: 10px;
  font-weight: normal;
  font-size: 18px;
  position: absolute;
  top: 9px;
}

#text_dia_o{
	position: absolute;
  top: 32px;
  padding: 20px 7px 13px 10px;
  width: 400px;
  -webkit-filter: blur(60px);
  filter: blur(60px);
}

#text_dia{
	position: absolute;
  top: 32px;
  padding: 20px 7px 13px 10px;
  width: 544px;
  background-color: rgba(255, 255, 255, 0.55);
}
#text_dia_dialog{
  position: absolute;
  top: 32px;
  padding: 20px 7px 13px 10px;
  width: 400px;
  max-height: 82px;
  background-color: rgba(255, 255, 255, 0.55);
}
#timesheet_p_d{
	
  line-height: 28px;
  padding-right: 10px;
  padding-left: 10px;
  color: rgb(66, 60, 60);
  font-weight: 300;
  font-size: 24px;
  top: 29px;
  text-align: left;
}
#timesheet_p_d_titol{
	
padding-left: 10px;
  color: rgb(53, 51, 51);
  font-weight: 300;
  font-size: 20px;
  width: 520px;
  margin-top: 21px;
  text-align: left;
  line-height: 30px;
}
#free_strong{
	font-weight: 400;
	font-size: 16px;
  line-height: 16px;
}

/* BARRA NAVEGACIO */

#avatar_nav{
width: 120px;
margin-top: -7px;
    margin-bottom: 7px;
    border-radius: 100px;
    box-shadow: 0px 0px 8px rgb(0 0 0 / 53%);

}

#avatar_nav_small{
  width: 40px;
      margin-top: 40px;
    margin-left: -9px;
    border-radius: 50px;
    margin-bottom: 10px;
    box-shadow: 0px 0px 8px rgb(0 0 0 / 53%);
}

#idioma{
	border-radius: 20px;
margin-top: -2px;
  margin-right: 2px;
}

.entorn{
  display: block;
    text-decoration: none;
    text-align: center;
    padding: 10px 20px 10px;
    font-size: 20px;
    font-weight: 400;
    color: #ffffff;
    text-shadow: 0 0px 0 rgb(255 255 255 / 0%);
    cursor: default;
}

/* FONTS */

/*@font-face {
    font-family: 'Roboto';
    src: url('fonts/roboto/Roboto-Regular-webfont.eot');
    src: url('fonts/roboto/Roboto-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/roboto/Roboto-Regular-webfont.woff') format('woff'),
         url('fonts/roboto/Roboto-Regular-webfont.ttf') format('truetype'),
         url('fonts/roboto/Roboto-Regular-webfont.svg#RobotoRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('fonts/roboto/Roboto-Italic-webfont.eot');
    src: url('fonts/roboto/Roboto-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/roboto/Roboto-Italic-webfont.woff') format('woff'),
         url('fonts/roboto/Roboto-Italic-webfont.ttf') format('truetype'),
         url('fonts/roboto/Roboto-Italic-webfont.svg#RobotoItalic') format('svg');
    font-weight: normal;
    font-style: italic;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('fonts/roboto/Roboto-Bold-webfont.eot');
    src: url('fonts/roboto/Roboto-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/roboto/Roboto-Bold-webfont.woff') format('woff'),
         url('fonts/roboto/Roboto-Bold-webfont.ttf') format('truetype'),
         url('fonts/roboto/Roboto-Bold-webfont.svg#RobotoBold') format('svg');
    font-weight: bold;
    font-style: normal;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('fonts/roboto/Roboto-BoldItalic-webfont.eot');
    src: url('fonts/roboto/Roboto-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/roboto/Roboto-BoldItalic-webfont.woff') format('woff'),
         url('fonts/roboto/Roboto-BoldItalic-webfont.ttf') format('truetype'),
         url('fonts/roboto/Roboto-BoldItalic-webfont.svg#RobotoBoldItalic') format('svg');
    font-weight: bold;
    font-style: italic;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('fonts/roboto/Roboto-Thin-webfont.eot');
    src: url('fonts/roboto/Roboto-Thin-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/roboto/Roboto-Thin-webfont.woff') format('woff'),
         url('fonts/roboto/Roboto-Thin-webfont.ttf') format('truetype'),
         url('fonts/roboto/Roboto-Thin-webfont.svg#RobotoThin') format('svg');
    font-weight: 200;
    font-style: normal;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('fonts/roboto/Roboto-ThinItalic-webfont.eot');
    src: url('fonts/roboto/Roboto-ThinItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/roboto/Roboto-ThinItalic-webfont.woff') format('woff'),
         url('fonts/roboto/Roboto-ThinItalic-webfont.ttf') format('truetype'),
         url('fonts/roboto/Roboto-ThinItalic-webfont.svg#RobotoThinItalic') format('svg'); (under the Apache Software License). 
    font-weight: 200;
    font-style: italic;
}
 
@font-face {
    font-family: 'Roboto Light';
    src: url('fonts/roboto/Roboto-Light-webfont.eot');
    src: url('fonts/roboto/Roboto-Light-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/roboto/Roboto-Light-webfont.woff') format('woff'),
         url('fonts/roboto/Roboto-Light-webfont.ttf') format('truetype'),
         url('fonts/roboto/Roboto-Light-webfont.svg#RobotoLight') format('svg');
    font-weight: 100;
    font-style: normal;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('fonts/roboto/Roboto-LightItalic-webfont.eot');
    src: url('fonts/roboto/Roboto-LightItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/roboto/Roboto-LightItalic-webfont.woff') format('woff'),
         url('fonts/roboto/Roboto-LightItalic-webfont.ttf') format('truetype'),
         url('fonts/roboto/Roboto-LightItalic-webfont.svg#RobotoLightItalic') format('svg');
    font-weight: 100;
    font-style: italic;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('fonts/roboto/Roboto-Medium-webfont.eot');
    src: url('fonts/roboto/Roboto-Medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/roboto/Roboto-Medium-webfont.woff') format('woff'),
         url('fonts/roboto/Roboto-Medium-webfont.ttf') format('truetype'),
         url('fonts/roboto/Roboto-Medium-webfont.svg#RobotoMedium') format('svg');
    font-weight: 300;
    font-style: normal;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('fonts/roboto/Roboto-MediumItalic-webfont.eot');
    src: url('fonts/roboto/Roboto-MediumItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/roboto/Roboto-MediumItalic-webfont.woff') format('woff'),
         url('fonts/roboto/Roboto-MediumItalic-webfont.ttf') format('truetype'),
         url('fonts/roboto/Roboto-MediumItalic-webfont.svg#RobotoMediumItalic') format('svg');
    font-weight: 300;
    font-style: italic;
}*/

/***************
     Informe
***************/
#imatge_informe{
float: left;
    height: 62px;
    width: 62px;
    margin-top: -2px;
}
#filtre_informe{
float: right;
  height: 64px;
  margin-right: 14px;
  margin-top: -8px;
  border-radius: 100px;
}
#titol_informe{
  color: #000000;
  font-size: 35px;
  font-weight: initial;
  margin-top: 19px;
}
#subtitol_informe{
  color: #475D8C;
  font-size: 21px;
  font-weight: 300;
  font-style: italic;
  float: left;
}
#titol_contingut{
  color: #494848;
  font-size: 22px;
  font-weight: 400;
  float: left;
  margin-right: 19px;
}

.extra_filtre{
  font-size: 14px;
    font-style: italic;
}

.round_100{
  border-radius: 100px;
}

#label_content{
	margin-top: 28px;
}
label{
    width: max-content;
    /* display: flex; */ /* ANGEL - es treu degut a que dona problemes en els popups i checkboxes */
}
#contenidor{
  padding-left: 47px;
}
#contenidor_separador{
    margin-top: -3px;
  margin-left: 31px;
  clear: both;
}
#info_label_contingut{
  height: 24px;
  float: left;
  margin-right: 6px;
  margin-top: -3px;
}
#filtres_grafic{
height: 24px;
  float: right;
    margin-top: -30px;
}
/***************
     Switch
***************/

#input_div_checkbox{
    margin-left: 21px;
    margin-top: 6px;
    margin-bottom: 6px;
  min-width: 110px;
}
#label_switch{
	color: rgb(76, 76, 76);
}

.switch, .switch * {
  -webkit-user-select: none;
  -moz-user-select: none;
  -khtml-user-select: none;
  -ms-user-select: none; }

.switch label {
  cursor: pointer; }

.switch label input[type=checkbox] {
  opacity: 0;
  display: none;
  width: 0;
  height: 0; }





.switch label .lever {
  content: "";
  display: inline-block;
  position: relative;
  width: 40px;
  height: 15px;
  background-color: #818181;
  border-radius: 15px;
  margin-right: 10px;
  transition: background 0.3s ease;
  vertical-align: middle;
  margin: 0 16px; }

.switch label .lever:after {
  content: "";
  position: absolute;
  display: inline-block;
  width: 21px;
  height: 21px;
  background-color: #F1F1F1;
  border-radius: 21px;
  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4);
  left: -5px;
  top: -3px;
  transition: left 0.3s ease, background 0.3s ease, box-shadow 0.1s ease; }

input[type=checkbox]:checked:not(:disabled) ~ .lever:active:after {
  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(38, 166, 154, 0.1); }

input[type=checkbox]:not(:disabled) ~ .lever:active:after {
  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(0, 0, 0, 0.08); }

.switch label input[type=checkbox]:checked + .lever:after {
  left: 24px; }

.switch input[type=checkbox][disabled] + .lever {
  cursor: default; }

.switch label input[type=checkbox][disabled] + .lever:after, .switch label input[type=checkbox][disabled]:checked + .lever:after {
  background-color: #BDBDBD; }
form {
    margin: 0 0 50px !important;
}
/*
BOTONS DEL HEADER
*/

.fileupload-buttonbar{
	width: 200px;
}
.fileinput-button{
      clear: both;
    margin-top: 1px;
        margin-right: -8px;
}
.centrat{
	vertical-align: -webkit-baseline-middle;
}
#excel{
	margin-right: 4px;
}

#T{
	padding: 4px 15px 4px 15px;
}
#T:hover{
  padding: 4px 15px 4px 15px;
  background-color: #009688;
}
#T:hover > abbr > .noLink2 {
  color: white !important;
}
#T:hover > abbr > a > button .noLink2 {
  color: white !important;
}
#T:hover > abbr > a > button > i {
  color: white !important;
}
.override_width{
  width: auto !important;
}
.agr_icon{
      width: 43px;
}
.text_boto{
      height: 100%;
    display: inline-block;
    vertical-align: middle;
    margin-top: -6px;
}
.text_boto_a{
    margin-left: 3px;
}
.text_boto_gd{
    margin-left: 0px !important;
}
.text_boto_disabled {
  color: #e2e2e4;
}
#accions{
	text-align: left;
}
#noLink2{
	color: rgb(7, 50, 105);;
	text-decoration: none;
}
.link_error{
  background-color: #f3a9a8;
    color: #750402 !important;
    padding: 7px 20px;
    border-radius: 30px;
    margin: 67px;
}
#botoFileUpload{
    border: 0px;
    margin-right: 5px;
    
    cursor: pointer;
  }
#my-tab-content{
	margin-top: -30px;
}

#wraper{
	
	/* padding: 0px 30px 20px 30px; */
  border-radius: 0px 10px 10px 0px;
	margin: 0 auto;
  padding: 0px 10px 20px 10px;
/*	right: 0;
	left: 0;
  top: 0;*/
	background-color: #ffffff;
  /*    position: absolute;
    left: 200px;*/
	/*position: fixed;
	z-index:1;*/
}

#menu{
	margin:0 auto;
	height: 100% !important;
	background-image: linear-gradient(to bottom, #1B2A50, #000000);
	background-repeat: repeat-x;
	border-color: #02003C;
}
#menu_container{
  height: 100% !important;
}
.menu-items{
  height: calc(100% - 13.7rem);
  overflow-y: auto;
  overflow-x: hidden;
  position: relative;
  left: 0px;
  float: left;
      width: inherit;
}
#salt{
	clear: both;
}
#legend{
	width: initial;
	margin-bottom: -3px;
	font-size: 13px;
	border-radius: 5px;
	border: 0;
	padding-right: 10px;
	padding-left: 8px;
}
#O{
		display: none;
}
.agrupador{
	padding: 5px 10px 5px 10px;
	border:solid 1px #CED4E2;
	background-color: rgba(206, 212, 226, 0.21);
	-moz-border-radius: 11px;
	-webkit-border-radius: 11px;
	border-radius: 11px;
	float: left;
	margin: 5px;
}

.titol_agr{
    font-size: 12px;
    color: tomato;
    font-weight: 300;
}

#agrupadorDUMMY{
	padding: 5px 10px 5px 10px;
	border: solid 1px #CED4E2;
	background-color: rgba(206, 212, 226, 0.21);
	-moz-border-radius: 11px;
	-webkit-border-radius: 11px;
	border-radius: 11px;
	margin: 25px 5px 5px 5px;
}

#field{
	border:solid 1px rgba(0, 69, 104, 0);
	background-color: rgba(0, 69, 104, 0);
	float: left;
	margin: 0px 5px 0px 5px;
}

#F11, #F12, #F13, #F14, #F21, #F22, #F23, #F24, #F31, #F32, #F33, #F34, #F41, #F42, #F43, #F44{
	padding: 5px 10px 5px 10px;
	border:solid 1px #CED4E2;
	background-color: rgba(206, 212, 226, 0.21);
	-moz-border-radius: 11px;
	-webkit-border-radius: 11px;
	border-radius: 11px;
	float: left;
	margin: 5px;
}
#infoIcon{
	margin-left: 7px;
    color: #5b656773;
}

.label_en_linea_camp {
    float: left;
    width: 200px;
    margin-top: 5px;
/*    margin-left: 15px;*/
}

.label_ocult_camp {
    display: none;
}

#icona{
      margin-left: -10px;
    margin-top: 3px;
    margin-right: 4px;
}

#label{
	margin-top: 5px;
	width: 150px;
	float: left;
}
#labelAmpliat{
	margin-top: 5px;
}

#labelE{
	margin-top: 5px;
	width: 90px;
	float: left;
}

#datepi{
	text-align: center;
}

#formDeleteDialog{
	margin-top: 20px;
	width: 800px;
}

#layout_delete{
  display: inline-flex;
      padding: 30px;
    margin-left: 15px;
    width: 600px;
} 

#text_delete{
	margin-left: 17px;
	font-size: 22px;
  	font-weight: 300;
    float: left;
    line-height: 32px;
}

.alertes {
    position: fixed;
    left: 90px;
    bottom: 73px;
    cursor: pointer;
    z-index: 9999;
}
.alerta_level_low {
    width: 14px;
    height: 14px;
    background: #1a9223;
    border-radius: 20px;
    position: relative;
    display: inline-table;
    top: 2px;
    left: -10px;
}
.alerta_level_medium {
    background: #ffa500;
    width: 14px;
    height: 14px;
    border-radius: 20px;
    position: relative;
    top: 2px;
    display: inline-table;
    left: -10px;
}
.alerta_level_high {
    background: #ff0018;
    width: 14px;
    height: 14px;
    border-radius: 20px;
    position: relative;
    top: 2px;
    display: inline-table;
    left: -10px;
}
.alerta_separador {
  margin: 10px 0px;
    width: 300px;
    margin-left: -25px;
}
.no_pointer {
  cursor: default;
}
.link_id{
  cursor: pointer;
}
#alert_popup{
background-color: white;
z-index: 999999;
    border-radius: 5px;
    position: fixed;
    width: 300px;
    margin-top: 16px;
    padding-bottom: 10px;
    -webkit-box-shadow: 3px 3px 15px -2px rgb(143 143 143);
    -moz-box-shadow: 3px 3px 15px -2px rgba(143,143,143,1);
    box-shadow: 3px 3px 15px -2px rgb(2 2 2);
}
#alert_list{
list-style: none;
    margin-top: 10px;
    color: #00000099;
    font-size: 14px;
}
#alerta_img{
color: white;
}
#alert_num{
    background: #dc0505;
    position: relative;
    width: 19px;
    height: 16px;
    border-radius: 34px;
    font-size: 12px;
    color: white;
    top: -7px;
    left: -11px;
    text-align: center;
    padding-top: 2px;
    line-height: normal;
}
#iniepi{
	width: 90px;
	float: left;
	margin-right: 12px;
}

#iniepiDiv{
	float: left;
}

#ordact{
	width: 19px;
}

#ordmat{
	width: 19px;
}

#obsact{
	width: 291px;
	height: 85px;
	resize: none;
}

#finepi{
	width: 90px;
}

#finepiDiv{
	float: right;
}

#eventContent{
	overflow: hidden;
  display: flex;
    flex-direction: row;
}

#calendarButton, #calendarButtonAdmisio{
	width: 122px;
	text-align: left;
	margin: 5px;
}

#tooltip {
  width: inherit;
  margin-top: 6px;
    margin-bottom: 7px;
}

.calendar_text_header{
    color: #525252;
    text-align: left;
    margin-left: 5px;
}
.calendar_text_info{
    color: white;
    text-align: left;
    margin-left: 5px;
}

#img_day_mode {
	height: 16px;
    margin-bottom: 3px;
    margin-right: 6px;
}

#calendar{
	box-shadow: none;
	padding-top: 10px;
}

#eventInfo{
    font-size: 15px;
    margin-top: 15px;
    padding-right: 76px;
    border-right: 4px dotted var(--color-principal);
    background-color: var(--color-principal);
    margin: -39px 30px -7px -13px;
    padding: 51px;
    height: 213px;
    color: white;
    border-radius: 0px 0px 0px 5px;
}

#eventLinks{
	    display: flex;
    flex-wrap: nowrap;
    flex-direction: column;
}

.cal_link{
  text-decoration: none !important;
}
.cal_link:focus{
  text-decoration: none; 
  outline: 0px;
}

#dadesRegistre{
	width: 100%;
	margin-top: 20px;
}
#dadesPacient1{
	width: 390px;
	padding: 5px;
	float: left;
}
#dadesPacient2{
	width: 370px;
	padding: 5px 5px 5px 25px;
}
#dadesEpisodi1{
	width: 330px;
	padding: 5px;
	float: left;
}
#dadesEpisodi2{
	width: 310px;
	height: 143px;
	padding: 5px 5px 5px 25px;
}
#dadesInterv1{
	float: left;
	margin-right: 30px;
}
#dadesMesMat1, #dadesMesAct1{
	float: left;
}
#dadesActuacio{
	width: 275px;
	padding: 5px;
	float: left;
}
#dadesActuacio11{
	float: left;
	margin-right: 13px;
}

#dadesMaterial1{
	margin-right: 15px;
	float: left;
}
#dadesMaterial2{
	float: left;
	margin-left: 55px;
}

#dadesActuacio2{
	margin-left: 51px;
}

#dadesObservacions{
	width: 310px;
	height: 143px;
	padding: 5px 5px 5px 25px;
}
#textPacient1{
	width: 390px;
	padding: 5px;
	float: left;
}
#textPacient2{
	width: 370px;
	padding: 5px 5px 5px 25px;
}
#textPacient3{
	width: 375px;
	padding-left: 25px;
	float: left;
}
#fons{
	height: 100% !important;
	/*width: 1230px;*/
	background-color: #ffffff;
/*	margin: 0 auto;*/
  margin: 0px !important;
    z-index: 9 !important;
	-moz-box-shadow: 1px 1px 172px #dbdbdb;
	-webkit-box-shadow: 1px 1px 172px #dbdbdb;
	box-shadow: none !important;
}
#mainMenu{
  width: 215px;
	z-index: 100;
  box-shadow: 0px 0px 17px 3px rgba(51, 51, 51, 0.73);
  background: var(--sauquia-gradient);
  
}
#mainMenu_login{

  width: max-content;
    padding: 20px 36px;
    margin: 20px;
    border-radius: 71px;
    height: 62px;
    z-index: 100;
    background: var(--sauquia-gradient);
    background-image: linear-gradient(to bottom, #1B2A50, #000000);
    background-repeat: repeat-x;
    border-color: #02003C;
}
#content{
	/*padding-top: 10px;	Separació del Menu i el Contingut*/
      width: 100%;
      min-width: 30%;
/*      overflow-x: scroll;*/
}

#iniInforme{
	background-color: rgba(78, 114, 148, 0.18);
}

#finInforme{
	background-color: rgba(78, 114, 148, 0.37);
}

body{
	height: 100% !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
	font-family: 'Roboto';
  overflow: hidden;
}

html{
	height: 100%;
  width: 100%;
  margin: 0;
  padding: 0;
}

#footer{
    text-align: center;
    background: black;
    box-shadow: 0px 0px 17px 3px rgba(51, 51, 51, 0.73);
    position: fixed;
    color: #bbbbbb;
}
#footer_text{
margin-top: 10px;
}

#radiobutton{
	padding-left: 10px;
	padding-bottom: 12px;
}

#stockmat, #stockmatFind, #deftip, #actppal{
	text-align: center;
	vertical-align: text-top;
	margin-top: 3px;
	width: 79px;
	float: right;
}
#actppalc{
	margin-top: 3px;
	width: 250px;
}
#colact{
	width: 45px;
	margin-left: 155px;
}
#stock, #stockCompra, #stockmin, #stockBuy, #stockRecompte, #stockNew, #stockFind, #stockminFind{
	text-align: center;
	vertical-align: text-top;
	margin-top: 3px;
	width: 65px;
	float: right;
}

#noData{
	text-align: center;
}

.petit{
  width: 26px;
}
#botonera{
	width: 189px;
	float: right;
	height: 55px;
	padding-top: 19px;
}

#botonerafitxers{
	width: 189px;
	float: right;
	height: 55px;
	padding-top: 19px;
}

#loginError{
	margin-right: 20px;
	margin-top: 20px;
	    width: 100%;
    margin-bottom: 10px;
}


.errorMSG{
  text-align: center;
  margin-bottom: 0px;
}
.descripcio_fact {
  width: 42%;
}

#missatgeErrorExtra{
	text-align: center;
}

#missatgeErrorDel{
	text-align: center;
}

#msgErrorFieldset{
	clear: both;
}
#msgErrorFieldsetExtra{
	clear: both;

}

#btnLogin{
margin-top: 25px;
}

.field_changed {
  animation: color-change 2s;
}

@keyframes color-change {
  0% { background-color: #ff000000; }
  50% { background-color: #ff000047; }
  60% { background-color: #ff000000; }
  70% { background-color: #ff000047; }
  100% { background-color: #ff000000; }
}


#formLogin{
    max-width: 320px;
    width: 90%;
    padding: 40px 30px;
    background: rgb(255 255 255);
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 22px;
    margin: 40px auto !important;
    -webkit-box-shadow: 7px 11px 39px -18px rgb(0 0 0);
    -moz-box-shadow: 7px 11px 39px -18px rgb(0 0 0);
    box-shadow: 7px 11px 39px -18px rgb(0 0 0);
}
.ui-widget-content {
    overflow: visible !important;
}
#detall{
      margin-left: 20px;
          font-weight: 300;
}
#detall2{
    margin-left: 20px;
    color: chartreuse;
        font-weight: 300;
}

#detall_ko{
    margin-left: 20px;
    color: #ff00c6;
    font-weight: 400;
}
#detall_ko_nomargin{
    color: #ff3232;
    font-weight: 400;
}
#detall_ok{
    margin-left: 20px;
    color: chartreuse;
    font-weight: 300;
}
#detall_ok_nomargin{
    color: chartreuse;
    font-weight: 300;
}

#titol{
	float: left;
	height: 110px;
}

#resetFiltre{
    position: relative;
    left: -20px;
    top: -10px;
    cursor: pointer;
}

.resetFiltre_no_results{
      position: unset !important;
    background-color: #ff20465c;
    color: white;
    width: 236px;
    margin: auto;
    margin-top: 22px;
    border-radius: 50px;
    padding-top: 8px;
    padding-bottom: 8px;
}

#resetOrdenar{
    position: relative;
    left: -20px;
    top: -10px;
    cursor: pointer;  
}
.easy_ordenar{
    cursor: pointer;   
}
#div_f{
  border-bottom: 0;
    width: 41px;
    display: flex;
    align-items: center;
}

#progressbar{
	margin-top: 13px;
	margin-left: -484%;
}

#antpac{
	width: 356px;
	height: 90px;
	resize: none;
}

#actuacio{
	text-align: center;
	width: 290px;
}

#alepac{
	width: 356px;
	height: 20px;
	resize: none;
}

#observ{
	width: 356px;
	height: 80px;
	resize: none;
}
#obsint{
	width: 270px;
	height: 90px;
	resize: none;
}
#codmat, #codmatCompra, #codmatRecompte, #codmatFind, #codtip{
	width: 70%;
	text-align: center;
}
#nommat, #nommatCompra, #nommatRecompte, #nommatFind, #nomtip{
	width: 360px;
}
#matText{
	float: left;
	margin-top: 7px;
}

#compac{
	width: 356px;
	height: 80px;
	resize: none;
}

#textprogressbar{
	margin-left: -275%;
	margin-top: -40px;
}

#noResults{
	text-align: center;
}

#centrat{
	text-align: center;
}

.centrat{
  text-align: center;
}

#datepickerdummy{
	visibility: hidden;
}

/*
	DEFINIM ELS ESTILS DELS ESTATS DELS EPISODIS, pe.
*/

#color{
	text-align: center;
    border-radius: 30px;
    height: 30px;
    width: 30px;
    box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.43);
}

#P{

	text-align: center;
	border: solid 1px rgba(172, 192, 218, 1);
	color: rgba(41, 92, 158, 1);
	-moz-border-radius: 11px;
	-webkit-border-radius: 11px;
	border-radius: 11px;
	background-color: rgba(146, 175, 206, 0.15);
}

#C{
	text-align: center;
	border: solid 1px rgba(238, 211, 71, 1);
	color: rgba(121, 116, 13, 1);
	-moz-border-radius: 11px;
	-webkit-border-radius: 11px;
	border-radius: 11px;
	background-color: rgba(255, 226, 16, 0.2);
}

#R{
	text-align: center;
	border: solid 1px rgba(182, 206, 168, 1);
	color: rgba(46, 116, 7, 1);
	-moz-border-radius: 11px;
	-webkit-border-radius: 11px;
	border-radius: 11px;
	background-color: rgba(100, 151, 34, 0.15);
}

#A{
	text-align: center;
	border: solid 1px rgba(223, 175, 175, 1);
	color: rgba(168, 64, 64, 1);
	-moz-border-radius: 11px;
	-webkit-border-radius: 11px;
	border-radius: 11px;
	background-color: rgba(219, 105, 105, 0.15);
}

.color_estat {
  height: 10px;
  width: 10px;
  position: relative;
  top: 17px;
}
.color_estat_d {
  height: 10px;
  width: 10px;
  float: left;
  margin: 5px 10px 0px 0px;
}

.estat_titol {
  position: relative;
  top: 2px;
    left: 20px;
}
.estat_titol_d {
  float: left;
}

.icon_prioritat {
    height: 17px;
    width: 17px;
    border-radius: 20px;
    border: 1px solid white;
    vertical-align: middle;
}
.observacions_pat {
    font-size: 18px;
    font-weight: 300;
    color: #cdd1d1;
    font-style: italic;
    position: absolute;
}
.image_obs {
  width: 17px;
    height: 17px;
    border: 1px solid white;
    vertical-align: middle;
    border-radius: 20px;
}
.zoom-in-zoom-out {
  animation: zoom-in-zoom-out 2s ease-out ;
  overflow: visible;
}

@keyframes zoom-in-zoom-out {
   0% { transform: translateX(0) }
 25% { transform: translateX(5px) }
 50% { transform: translateX(-5px) }
 75% { transform: translateX(5px) }
 100% { transform: translateX(0) }
}

.ui-dialog .ui-dialog-title {
line-height: initial;
}
#PW{
	background-color: #FFD100;
}

#OW{
    background-color: #69696b;
}

#CW{
	background-color: #5240FB;
}

#RW{
	background-color: #56AD56;
}

#AW,#NW{
	background-color: #B71010;
}

#PWT{
	text-align: center;
	border: solid 1px rgba(22, 107, 218, 1);
	color: rgba(255, 255, 255, 1);
	border-radius: 11px;
	background-color: rgba(79, 131, 209, 1);
	width: 115px;
	margin-right: -3px;
	border-top-left-radius: 190px;
	border-top-right-radius: 0px;
	border-bottom-right-radius: 67px;
	border-bottom-left-radius: 44px;
	box-shadow: 0px 0px 16px #000000;
}

#CWT{
	text-align: center;
	border: solid 1px rgba(212, 179, 8, 1);
	color: rgba(65, 65, 65, 1);
	border-radius: 11px;
	background-color: rgba(250, 223, 28, 1);
	width: 115px;
	margin-right: -3px;
	border-top-left-radius: 190px;
	border-top-right-radius: 0px;
	border-bottom-right-radius: 67px;
	border-bottom-left-radius: 44px;
	box-shadow: 0px 0px 16px #000000;
}

#RWT{
	text-align: center;
	border: solid 1px rgba(70, 111, 46, 1);
	color: rgba(255, 255, 255, 1);
	border-radius: 11px;
	background-color: rgba(100, 151, 34, 1);
	width: 115px;
	margin-right: -3px;
	border-top-left-radius: 190px;
	border-top-right-radius: 0px;
	border-bottom-right-radius: 67px;
	border-bottom-left-radius: 44px;
	box-shadow: 0px 0px 16px #000000;
}

#AWT{
	text-align: center;
	border: solid 1px rgba(202, 24, 24, 1);
	color: rgba(255, 255, 255, 1);
	border-radius: 11px;
	background-color: rgba(219, 105, 105, 1);
	width: 115px;
	margin-right: -3px;
	border-top-left-radius: 190px;
	border-top-right-radius: 0px;
	border-bottom-right-radius: 67px;
	border-bottom-left-radius: 44px;
	box-shadow: 0px 0px 16px #000000;
}

#PWTS{
	margin-left: -1px;
	background-color: rgba(79, 131, 209, 1);
	width: 7px;
	height: 1003px;
}

#CWTS{
	margin-left: -1px;
	background-color: rgba(250, 223, 28, 1);
	width: 7px;
	height: 1003px;
}

#RWTS{
	margin-left: -1px;
	background-color: rgba(100, 151, 34, 1);
	width: 7px;
	height: 1003px;
}

#AWTS{
	margin-left: -1px;
	background-color: rgba(219, 105, 105, 1);
	width: 7px;
	height: 1003px;
}

#Pendent{
	text-align: center;
	border: solid 1px rgba(172, 192, 218, 1);
	color: rgba(41, 92, 158, 1);
	-moz-border-radius: 11px;
	-webkit-border-radius: 11px;
	border-radius: 11px;
	background-color: rgba(146, 175, 206, 0.15);
}

#Realitzada{
	text-align: center;
	border: solid 1px rgba(182, 206, 168, 1);
	color: rgba(46, 116, 7, 1);
	-moz-border-radius: 11px;
	-webkit-border-radius: 11px;
	border-radius: 11px;
	background-color: rgba(100, 151, 34, 0.15);
}

#Anulada{
	text-align: center;
	border: solid 1px rgba(223, 175, 175, 1);
	color: rgba(168, 64, 64, 1);
	-moz-border-radius: 11px;
	-webkit-border-radius: 11px;
	border-radius: 11px;
	background-color: rgba(219, 105, 105, 0.15);
}

.table th, .table td {
  vertical-align: middle;
}

#agrupador_menu_wraper{
  height: calc(100% - 50px);
}

// GTI Time

#paleta_table{
  width: 100%;
  height: 900px;
  background-color: rgba(176, 169, 255, 0.16);
  border-left: rgb(90, 90, 158);
  border-left-width: 6px;
  border-left-style: solid;
}

#TE_td1{
    color: rgb(71, 69, 98);
    font-weight: initial;
    font-size: 16px;
}

#TEM_td1{
	color: rgb(71, 69, 98);
  font-weight: initial;
  font-size: 16px;
  height: 17px;
  word-wrap: break-word;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  margin-left: 5px;
}

#TE_td2{
	background: white;
	color: black;
	text-align: center;
}

#TE_p_td2{
  position: absolute;
  top: 64px;
  left: 61px;
}

#td1{
	width: 140px;
	color: black;
	text-align: center;
}

#td2{
	width: 290px;
	color: black;
}

#td1w{
	width: 13px;
	color: black;
}

#td2w{
	width: 200px;
	color: black;
}

#td3{
	width: 210px;
	color: black;
}

#td4{
	width: 290px;
	color: black;
}
#td5{
}

#marge{
	position: absolute;
}
#marge2{
	margin-left: 83px;
  display: inline-block;
}
#linia{
	float: left;
	border-right: 1px ridge rgba(157, 148, 255, 0.15);
	height: 159px;
	width: 0;
	margin-right: 34px;
	-moz-box-shadow: 2px 3px 16px #000000;
	-webkit-box-shadow: 0px 1px -4px #000000;
	box-shadow: 1px 3px 2px rgba(0, 106, 221, 0.13);
}
/*
	AQUI DEFINIM ELS ESTILS DE LES COLUMNES
*/
#HC{
	text-align: center;
	width: 15%;
}

#ordre{
	text-align: center;
	width: 8%;
}

#confirmat{
	text-align: center;
	width: 40px;
}

.ordmat{
	text-align: center;
	width: 25px;
}

#estat_small{
	text-align: center;
	width: 12%;
}

#doctor{
	width: 20%;
}

#matcss{
	vertical-align: middle;
}

#chckbox{
	padding-top: 15px;
}

#cita{
	text-align: center;
	width: 180px;
}	

#estat{
	width: 100px;
	text-align: center;
	padding-right: 75px;
}

#accio1{
	text-align: center;

}
#col{
	width: 1px;
}

#accio2{
	text-align: center;
	width: 10%;
}

#accio2Doc{
	text-align: right;
	width: 112px;
	padding-left: 25px;	
}

#accio3{
	text-align: center;
	width: 12%;
}

#accio4{
	text-align: center;
	width: 18%;
}



#idabbr{
	border-bottom: 0;
}

#gestioRegistres{
  z-index: 1;
  /*border: 10px solid rgba(0,0,0,0.20);
  background: red;*/
}
#icona_boto{
	margin-top: 7px;
}

.icon_white{
  color: #009688 !important;
    margin-right: 8px;
    float: right;
}

.table-hover tbody tr:hover td,
.table-hover tbody tr:hover th {
  background-color: #00968826 !important;
}

#llistat{
  z-index: 2;  
}

#llistat .centerBTN{
  text-align: center;
  min-width: 120px;
  max-width: 355px;
  width: auto;
}

#llistat .centrat_200{
  text-align: center;
    display: block;
    width: 200px;
}
#llistat .centrat{
  text-align: center;
  min-width: 120px;
  max-width: 200px;
  width: 15%;
}
#llistat .ample_25p{

  width: 25%;
}

#llistat .centrat_min{
  text-align: center;
  min-width: 85px;
}
.centrat_magic{
      display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
  justify-content: center;
}
#llistat .centrat_50{
  text-align: center;
  width: 50px;
}
#llistat .centrat_100{
  text-align: center;
  width: 100px;
}
#llistat .maxwidth_200{
  max-width: 200px;
}
#llistat .centrat_150{
  text-align: center;
  width: 150px;
}
#llistat .right_100{
  text-align: right;
  width: 100px;
}
#llistat .right_150{
  text-align: right;
  width: 150px;
}
#llistat .w250{
  width: 250px;
}
#llistat .grid{
  min-width: 30px;
  text-align: center;
}

#llistat .right{
  text-align: right;
}

#llistatTable{
  /*width: 960px;*/
}

/* Suggestions */
        #suggestions {
            display: none;
            position: absolute;
            border: 1px solid #d4d4d4;
            border-bottom: none;
            width: max-content;
            z-index: 99;
            top: 100%;
            left: 0;
            right: 0;
        }

        #suggestions div {
            padding: 3px 10px 3px 10px;
            cursor: pointer;
            background-color: #fff;
            border-bottom: 1px solid #d4d4d4;
        }

        #suggestions div:hover {
            background-color: #e9e9e9;
        }

#loading{
  
  position: fixed;
    width: -webkit-fill-available;
/*  width: 960px;*/
	z-index: 5;
  /*border: 1px solid rgba(0,0,0,0.20);*/
	background-color: rgba(255, 255, 255, 100);
  
  display: table;

}

#loaderGlobal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgb(40 170 157); /* Fondo blanco semi-transparente */
    z-index: 9999;
    color: #8b8b8b;
    font-size: 24px;
    text-align: center;
    transition: opacity 0.5s ease;
}
#loaderContent {
    display: inline-block; /* Para asegurar que la imagen ocupe todo el ancho */
    max-width: 80%; 
    max-height: 80%;
    transform: translateY(25%);

}

#loader{
position: absolute;
    background: #ffffff;
    top: 0px;
    left: -216px;
    width: -webkit-fill-available;
    height: 100%;
    overflow: hidden;
    padding-top: 84px;
    text-align: center;
    z-index: 9999999;
}

#loader_img{
  width: auto;
  margin-left: -236px;
}
#loader_popup{
    width: -webkit-fill-available;
    height: -webkit-fill-available;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hide_loader_popup {
     display: none !important;
}
#loaderIMG{
	background-image: url("../images/loaders/rotellina.gif");
	background-repeat: no-repeat;
  background-size: cover;
  width: 24px;
  height: 24px;
}

#loadingText{
	color: #808080;
}

#loadingImg{
	  /*s'ha de treure la part html de hispac.js i posar-la al id loading*/
	display: table-cell;
	vertical-align: middle;
	text-align: center;	

    position: relative;
}

#noLink{
	color: #000000;
	text-decoration: none;
	font-weight: bold;
}
.textBlau{
	color: rgb(7, 50, 105);
	font-weight: bold;

}

#textEpisodi{
	font-size: 59%;
	color: rgb(3, 115, 143);
	font-family: 'Roboto';
	  font-size: 30px;
	  font-weight: 400;
}

#textNumReg{
	font-size: 47%;
	font-style: italic;
	color: rgb(153, 153, 153);

	font-family: 'Roboto';
  font-size: initial !important;
  font-weight: 300;
}

/* SIDEPANEL IFRAME TEST */

#miPanel {
    width: 0;
    transition: 0.5s; /* Animación */
    z-index: 99;
    display: none;
    margin: 0px 0px 0px 5px;
    background-color: white;
    border-radius: 10px;
}

#miPanel iframe {
    width: 100%;
    height: calc(100% - 26px);
    background: white;
    border-radius: 0px 0px 10px 10px;
}

#miPanel.panel-open {
/*    width: 300px; /* O el ancho que prefieras */
  display: inline-flex;
}

.icones_sidepanel{
  font-size: 12px;
}

.resize-handle {
    width: 5px;
    height: 100%;
    position: absolute;
    cursor: col-resize;
    z-index: 2;
    margin-left: -5px;
}

#sidepanel_bar{
  width: -webkit-fill-available;
    height: 20px;
/*    background: var(--sauquia-gradient);*/
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-direction: row;
}


/* POPUP IFRAME TEST */
#miPopup {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0,0.4);
    padding-top: 60px;
    z-index: 9000;
}

#contenidoPopup {
    background-color: #fefefe;
    margin: 1% auto;
    padding: 0px;
    width: 80%;
    height: 78%;
    border-radius: 15px;
    box-shadow: 0px 0px 36px #4D4D4D;
}

#popup_bar{
  width: -webkit-fill-available;
    height: 50px;
    background: var(--sauquia-gradient);
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-direction: row;
}

#contingutHeader{
    width: 100%;
    background: white;
    z-index: 95;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 0px 0px 5px 0px;
    align-items: center;
}

#gestioContingut{
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-items: flex-start;
    height: 1023px;
    align-content: flex-start;
    width: -webkit-fill-available;
}

.barra_separadora_header{
  border-bottom: 1px solid #01959661;
      margin-bottom: 5px;
}

.linea_bottom_header{
  position: absolute;
    border-bottom: 2px solid var(--color-principal);
    /* top: 65px; */
    height: 0px;
    width: -webkit-fill-available;
}

#llistatHead{
    position: sticky;
    z-index: 9; /* Just below the contingutHeader */
    background-color: white; /* Optional: for better visibility */
    top: 0px;
/*    border-bottom: 1px solid var(--color-principal);*/
    
/*    box-shadow: 0px 22px 27px -15px rgba(51, 51, 51, 0.73);*/
}

/* CONTROLEM ELS REGISTRES */
#contingutRegistres{
  overflow: auto; /* Setegem per js l'alçada del contenidor i l'scroll el volem en aquest contenidor. */
  padding-right: 10px;
  height: 100%;
      position: relative;
}

.tr_header{
    width: 100%;
    height: 19px;
    display: flex;
    position: sticky;
    top: 110px;
    z-index: 9;
    background: var(--color-principal);
}

#titolHeader{
  line-height: 40px;
}

#butActions{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    height: min-content;
}

#wrapPaginacio{
	padding-top: 1px;
      margin-bottom: -20px;
}

#selectorNumRegistres{
	float: left;
	padding: 20px 10px 0px 0px;
}

#paginacio{
	text-align: center;
}
.pagination {
  margin: 10px 0px 5px 0px !important;
}

#numregistreslabel{
	float: left;
}

#numregistres{
	float: left;
}

#findRegistre{
	margin-left: 4px;
}

#ajaxLoaderSmall{
	
}

#ajaxLoader{
	
	/*margin-top:10px;
	width:94%;
	height:auto;
	border: 1px solid rgba(0,0,0,0.20);
	border-radius: 4px;*/
	
	/*padding: 4px;
	outline: none;
	background: #FFF;*/
	text-align: center;
	clear: both;
  font-size: 16px;
	
}

.ajaxLoaderG {
    display: flex;
    justify-content: center;
    padding: 5px 0px 0px 0px;
}

#ajaxLoader img {
	vertical-align: middle;
}

#loaderText {
    text-align: left;
    margin-left: 15px !important;
    margin-top: 3px;
    clear: initial;
}

#missatgeError {
    text-align: center;
    padding: 5px 0px 5px 0px;
    margin: -30px 0px 40px 0px !important;
    font-size: 16px;
    font-weight: 500;
}

/* CLASSES GENERALS BOTONS*/
.updateMultiRegistres {
    margin-bottom: 0px !important;
    position: fixed;
    right: 47px;
    bottom: 17px;
}
.icona_ajuda_old {
  position: absolute;
    margin-top: 7px;
    margin-left: -21px;
    color: #d5d5d5;
}

/*.icona_ajuda {
    position: relative;
    top: -5px;
    right: 26px;
    color: #d5d5d5;
    background-color: #f7f7f7;
    padding: 5px 5px 7px 4px;
    border-radius: 0px 5px 5px 0px;
}*/

.icona_ajuda {
    position: absolute;
    margin-top: 1px;
    margin-left: -22px;
    color: #d5d5d5;
    background-color: #f7f7f7;
    padding: 5px 5px 6px 4px;
    border-radius: 0px 5px 5px 0px;
  }
  .icona_ajuda_multi {
    position: absolute;
    margin-top: 1px;
    margin-left: -21px;
    color: #d5d5d5;
    background-color: #f7f7f7;
    padding: 5px 5px 8px 4px;
    border-radius: 0px 5px 5px 0px;
  }
.icona_ajuda_buscar {
    position: relative;
    top: -4px;
    right: 26px;
    color: #d5d5d5;
    background-color: #f7f7f7;
    padding: 5px 5px 6px 4px;
    border-radius: 0px 5px 5px 0px;
}
.input_ajuda {
      padding-right: 26px !important;
/*      border-radius: 0px 5px 5px 0px !important;*/
}
.input_ajuda_buscar {
  padding-right: 26px !important;
    padding-left: 10px !important;
    width: 86px !important;
}
/*button.updateRegistre{
	width: 32px;
	height: 32px;
	box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.43);
}
button.deleteRegistre{
	width: 32px;
	height: 32px;
	box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.43);
}*/
hr{border-top: 1px solid #01959661;}

.pagination ul > li > a, .pagination ul > li > span {

     border: none !important; 
}

.pagination ul > li > a:hover, .pagination ul > .active > a, .pagination ul > .active > span, .pagination ul > li > a:hover > i {
    background-color: #009688 !important;
    border-radius: 40px !important;
    color: white !important;
}
.pagination ul {
  -webkit-box-shadow: none;
     -moz-box-shadow: none;
          box-shadow: none;
  border: none !important;
}

.btn_items{
    background-color: #f44336;
    position: relative;
    font-size: 11px;
    border-radius: 60px;
    padding: 3px 6px 2px 6px;
    width: auto;
    height: 12px;
    color: white;
    font-family: 'Roboto';
    font-weight: 300;
    text-align: center;
    left: -8px;
    top: -13px;
}

.preFiltreOn{
    color: white !important;
    background-color: #009688 !important;
    border: 1px #009688 solid !important;
}
.preFiltre{
    height: 24px;
    width: auto;
    text-align: left;
    color: #009688;
    border-radius: 20px;
    border: none;
    background-color: #ffffff;
    border: 1px #009688 solid;
/*    margin-bottom: 7px;*/
    margin-left: 7px;
    padding-left: 10px;
    padding-right: 10px;
}
.accioSidepanel{

    text-align: center;
    color: #ffffff;
    border-radius: 20px;
    border: none;
    background-color: #009688;
    border: 1px #009688 solid;
    /* margin-bottom: 7px; */
    /* margin-left: 7px; */
    /* padding-left: 3px; */
    /* padding-right: 13px; */
    padding-top: 5px;
    padding-bottom: 3px;
}
.side-panel-actions{
/*background-color: #00989826;*/
    border-radius: 0px 0px 8px 8px;
    padding-top: 10px;
    padding-bottom: 5px;
  }
.centrar{
  text-align: center;
}
.btnSauquia{
    height: 24px;
    width: 38px;
    text-align: left;
    background: #ffffff00;
    border-radius: 5px;
    border: none;
    color: #009688;
}
.btnSauquia_mini{
    width: 38px;
    height: 20px;
    text-align: left;
    background: #ffffff00;
    border-radius: 5px;
    border: none;
    color: #009688;
}
.btnFiltreInformeP{
margin-top: -3px;
}

.btnSauquiaLong{
    height: auto !important;
    text-align: center;
    background: #009688;
    border-radius: 5px !important;
    color: #ffffff !important;
    border: #009688 2px solid !important;
}

.btnSauquiaLong:hover {
    background-color: #008577;
    color: white;
}
.btnSauquiaLong:active {
    background-color: #036b6c;
    border: #009688 2px solid;
    color: white;
}

.btnSauquiaLong_e{
    height: auto !important;
    text-align: center;
    background: #8f5151;
    border-radius: 5px !important;
    color: #ffffff !important;
    border: #8f5151 2px solid !important;
}

.btnSauquiaLong_e:hover {
    background-color: #6c0303;
    color: white;
}
.btnSauquiaLong_e:active {
    background-color: #6c0303;
    border: #8f5151 2px solid;
    color: white;
}
.btn-ml{
/*  margin-left: 25px;*/
}

.error{
	font-size:0.8em;
}

a.noLinkw{
	color: rgb(255, 255, 255);
	text-decoration: none;
/*	font-weight: bold;*/
}

a.noLink2{
	color: rgb(7, 50, 105);
	text-decoration: none;
}
a.noLink100{
  color: rgb(7, 50, 105);
  text-decoration: none;
  width: 100px;
}


a.textTitol{
	font-size: 83%;
	
	text-decoration: none;
	  
  font-size: 35px;
  font-weight: initial;
}
.classeExtra{
	margin-left: 150px;
}
.textArea{
	/*width: 200px;*/
}
.mostra{
	  display: table;
}

.flattern_class {
  margin-top: 6px;
}
#icona_AE {
  float: left;
    margin-right: 10px;
        width: 64px;
    height: 64px;
}

/* Checkboxes
   ========================================================================== */
.checkbox_c{
    display: flex;
    justify-content: center;
        margin-top: 4px;
}

.checkbox_dreta{
  display: flex;
      height: 39px;
}
#check_dreta{
  margin-top: 2px;
}
/* Remove default checkbox */
[type="checkbox"]:not(:checked),
[type="checkbox"]:checked {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

[type="checkbox"] {
  /* checkbox aspect */
}

[type="checkbox"] + span:not(.lever) {
  position: relative;
  padding-left: 35px;
  cursor: pointer;
  display: inline-block;
  height: 16px; /* before 25*/
  line-height: 25px;
  font-size: 1rem;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

[type="checkbox"] + span:not(.lever):before,
[type="checkbox"]:not(.filled-in) + span:not(.lever):after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 18px;
  height: 18px;
  z-index: 0;
  border: 2px solid #5a5a5a;
  border-radius: 1px;
  margin-top: 3px;
  -webkit-transition: .2s;
  transition: .2s;
}

[type="checkbox"]:not(.filled-in) + span:not(.lever):after {
  border: 0;
  -webkit-transform: scale(0);
          transform: scale(0);
}

[type="checkbox"]:not(:checked):disabled + span:not(.lever):before {
  border: none;
  background-color: rgba(0, 0, 0, 0.42);
}

[type="checkbox"].tabbed:focus + span:not(.lever):after {
  -webkit-transform: scale(1);
          transform: scale(1);
  border: 0;
  border-radius: 50%;
  -webkit-box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.1);
          box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.1);
  background-color: rgba(0, 0, 0, 0.1);
}

[type="checkbox"]:checked + span:not(.lever):before {
  top: -4px;
  left: -5px;
  width: 12px;
  height: 22px;
  border-top: 2px solid transparent;
  border-left: 2px solid transparent;
  border-right: 2px solid #26a69a;
  border-bottom: 2px solid #26a69a;
  -webkit-transform: rotate(40deg);
          transform: rotate(40deg);
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  -webkit-transform-origin: 100% 100%;
          transform-origin: 100% 100%;
}

[type="checkbox"]:checked:disabled + span:before {
  border-right: 2px solid rgba(0, 0, 0, 0.42);
  border-bottom: 2px solid rgba(0, 0, 0, 0.42);
}

/* Indeterminate checkbox */
[type="checkbox"]:indeterminate + span:not(.lever):before {
  top: -11px;
  left: -12px;
  width: 10px;
  height: 22px;
  border-top: none;
  border-left: none;
  border-right: 2px solid #26a69a;
  border-bottom: none;
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg);
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  -webkit-transform-origin: 100% 100%;
          transform-origin: 100% 100%;
}

[type="checkbox"]:indeterminate:disabled + span:not(.lever):before {
  border-right: 2px solid rgba(0, 0, 0, 0.42);
  background-color: transparent;
}

[type="checkbox"].filled-in + span:not(.lever):after {
  border-radius: 2px;
}

[type="checkbox"].filled-in + span:not(.lever):before,
[type="checkbox"].filled-in + span:not(.lever):after {
  content: '';
  left: 0;
  position: absolute;
  /* .1s delay is for check animation */
  -webkit-transition: border .25s, background-color .25s, width .20s .1s, height .20s .1s, top .20s .1s, left .20s .1s;
  transition: border .25s, background-color .25s, width .20s .1s, height .20s .1s, top .20s .1s, left .20s .1s;
  z-index: 1;
}

[type="checkbox"].filled-in:not(:checked) + span:not(.lever):before {
  width: 0;
  height: 0;
  border: 3px solid transparent;
  left: 6px;
  top: 10px;
  -webkit-transform: rotateZ(37deg);
          transform: rotateZ(37deg);
  -webkit-transform-origin: 100% 100%;
          transform-origin: 100% 100%;
}

[type="checkbox"].filled-in:not(:checked) + span:not(.lever):after {
  height: 20px;
  width: 20px;
  background-color: transparent;
  border: 2px solid #5a5a5a;
  top: 0px;
  z-index: 0;
}

[type="checkbox"].filled-in:checked + span:not(.lever):before {
  top: 0;
  left: 1px;
  width: 6px;
  height: 12px;
  border-top: 2px solid transparent;
  border-left: 2px solid transparent;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  -webkit-transform: rotateZ(37deg);
          transform: rotateZ(37deg);
  -webkit-transform-origin: 100% 100%;
          transform-origin: 100% 100%;
}

[type="checkbox"].filled-in:checked + span:not(.lever):after {
  top: 0;
  width: 20px;
  height: 20px;
  border: 2px solid #26a69a;
  background-color: #26a69a;
  z-index: 0;
}

[type="checkbox"].filled-in.tabbed:focus + span:not(.lever):after {
  border-radius: 2px;
  border-color: #5a5a5a;
  background-color: rgba(0, 0, 0, 0.1);
}

[type="checkbox"].filled-in.tabbed:checked:focus + span:not(.lever):after {
  border-radius: 2px;
  background-color: #26a69a;
  border-color: #26a69a;
}

[type="checkbox"].filled-in:disabled:not(:checked) + span:not(.lever):before {
  background-color: transparent;
  border: 2px solid transparent;
}

[type="checkbox"].filled-in:disabled:not(:checked) + span:not(.lever):after {
  border-color: transparent;
  background-color: #949494;
}

[type="checkbox"].filled-in:disabled:checked + span:not(.lever):before {
  background-color: transparent;
}

[type="checkbox"].filled-in:disabled:checked + span:not(.lever):after {
  background-color: #949494;
  border-color: #949494;
}

.d-none{
  display: none !important;
}

.asterisc_oblig{
  color: #e92626;
    margin-left: 2px;
}

/* ESTILS ADDICIONALS per als camps_objectes */
.ia_ample_hores{
  text-align: center;
  margin-right: -4px;
  width: 200px;
}
.ia_ample_medicacio{
  width: 230px;
  /*float: unset;*/
  margin-top: -1px;
  margin-left: 20px;
    
}
.ia_ample_medicacio_text{
  width: 218px;
  /*float: unset;*/
  margin-top: -1px;
  margin-left: 20px;
    
}
.ia_ample_serum_text{
  width: 218px;
  /*float: unset;*/
  margin-top: -1px;
  margin-left: 20px;
  margin-right: 83px;
    
}
.ia_ample_minuts{
  width: 35px;
  text-align: center;
  margin-right: -4px;
}
.ia_ample_dosis{
  width: 54px;
    text-align: center;
    margin-right: 5px;
}
.ia_marge_top{
  margin-top: 25px;
}
.ia_marge_left{
  margin-left: 7px;
}
.ia_marge_left_end{
  margin-left: 5px;
}
.ia_marge_left_hh_mm{
  margin-left: 352px;
}
.ia_marge_top_min_hores{
  margin-top: -9px;
}
.ia_color_columna{
  background-color: #0099990f !important;
}
.ia_margin_right_data{
      margin-right: 140px;
}

/* new side menu */
.noline {
  border: none !important;
  width: 100% !important
}
ul.navbar-nav{
  margin: 0px !important;
}
.center_user{
  text-align: center;
  background: linear-gradient(
19deg
, var(--menu-high) 58%, rgb(255 255 255 / 0%) 59%);
}
.navbar-scroll {
    
}
.navbar .nav{
  width: 100%;
}
.navbar .nav > li > .dropdown-menu:after {
    display: none !important;
}

.navbar .nav > li > .dropdown-menu:before {
    display: none !important;
}

#usuari_nav{
  text-align: center;
    width: 210px;
}
    body,html{
    height: 100%;
  }

  /* remove outer padding */
  .main .row{
    padding: 0px;
    margin: 0px;
  }

  /*Remove rounded coners*/

  nav.sidebar.navbar {
    border-radius: 0px;
  }

  nav.sidebar, .main{
    -webkit-transition: margin 200ms ease-out;
      -moz-transition: margin 200ms ease-out;
      -o-transition: margin 200ms ease-out;
      transition: margin 200ms ease-out;
/*      position: fixed;*/
    left: 0;
  }

  /* Add gap to nav and right windows.*/
  .main{
    padding: 5px 5px 0 5px;
  }

  /* .....NavBar: Icon only with coloring/layout.....*/
  ul.usuari_nav{
    /*height: 143px;*/
  }
  b.caret_user {
    margin-top: 28px;
  }
  button .caret {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 6px;
    vertical-align: middle;
    border-top: 4px solid #ffffff;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
    content: "";
}
  nav.sidebar{
      margin-left: 0px;
      float: none;
      height: 100%;
    }
  /*adds border top to first nav box */
  nav.sidebar .navbar-nav > li:first-child{
    border-top: 1px #e5e5e5 solid;
  }

  /*adds border to bottom nav boxes*/
  nav.sidebar .navbar-nav > li{
    border-bottom: 1px #e5e5e5 solid;
  }
  /*Center Brand*/
  nav.sidebar.navbar.sidebar>.container .navbar-brand, .navbar>.container-fluid .navbar-brand {
    margin-left: 0px;
  }
  /*Center Brand*/
  nav.sidebar .navbar-brand, nav.sidebar .navbar-header{
    text-align: center;
    width: 100%;
    margin-left: 0px;
  }

  /*Center Icons*/
  nav.sidebar a{
    padding-right: 13px;
  }
/* Colors/style dropdown box*/
  nav.sidebar .navbar-nav .open .dropdown-menu {
    position: static;
    float: none;
    width: auto;
    margin-top: 0;
    background-color: rgb(0 0 0 / 32%) !important;
    border-radius: unset;
    border: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
  }  

.dropdown-menu {
    display: block;
    transition: max-height 500ms;
    max-height: 0px;
    visibility: hidden;
}

.open > .dropdown-menu {
    display: block;
    max-height: 700px;
    visibility: visible;
    overflow: hidden;
}

/*allows nav box to use 100% width*/
nav.sidebar .navbar-collapse, nav.sidebar .container-fluid{
  padding: 0 0px 0 0px;
}

/*colors dropdown box text */
.navbar-inverse .navbar-nav .open .dropdown-menu>li>a {
  color: #ffffff;
}

/*gives sidebar width/height*/


/*give sidebar 100% width;*/
nav.sidebar li {
  width: 100%;
}

  nav.sidebar .navbar-nav .open .dropdown-menu>li>a:hover, nav.sidebar .navbar-nav .open .dropdown-menu>li>a:focus {
    color: #CCC;
    background-color: transparent;
  }

  nav:hover .forAnimate{
    opacity: 1;
  }
  section{
    padding-left: 15px;
  }

/* CSS DASHBOARDS */
.fa-petit{
  font-size: 13px;
}

.botons_accio_dashboard{
  width: max-content;
  isplay: flex;
    align-items: center;
}

#dashboardContainer {
    position: fixed;
    width: -webkit-fill-available;
    height: -webkit-fill-available;
    margin-top: 64px;
    margin-right: 15px;
    background: #e5efee7d;
    overflow: auto;
}

#titolDashboard:hover #modifyDashboard {
    display: inline !important;
}
.dashboard {
    position: relative;
    background-color: #fff; /* Fondo por defecto */
    border-radius: 5px;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
}

.moveButton {
    position: absolute;
    top: 5px;
    right: 5px;
    z-index: 10;
}

#headerDashboard{
    width: 100%;
    float: left;
    position: sticky;
    top: 0px;
    background: white;
    z-index: 95;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.container_d {
    box-sizing: border-box; /* Asegura que el padding y el borde se incluyan en el ancho/altura total */
    position: absolute;
/*    border: 1px solid gray;*/
    border-radius: 5px;
    background-color: white;
    box-shadow: 0px 0px 8px rgb(0 0 0 / 29%);
    margin: 15px;
}

.containerTitle {
    /* Estilos para el título aquí */
    background-color: #009999;
    color: white;
    padding-left: 19px;
    border-radius: 13px 0px 0px 50px;
        display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
}

/* CLASSES MISSATGES DE TEXT */
.error_text {
  color: #b50404;
      font-weight: 600;
}

/*
 ==== Layouting ====
*/
 
  .layout {
    display: flex;
  }
 
  .layout.vertical {
    flex-direction: column;
  }
 
  .layout.horizontal {
    flex-direction: row;
  }
 
  .layout.with-gap {
    gap: var(--separador-main);
  }
 
  .layout.with-big-gap {
    gap: 24px;
  }
 
  .layout.gap {
    gap: var(--separador-main);
  }
 
  .layout.big-gap {
    gap: 24px;
  }
 
  .layout.horizontal.reverse {
    flex-direction: row-reverse;
  }
 
  .layout.vertical.reverse {
    flex-direction: column-reverse;
  }
 
  .layout>.main {
    flex: 1;
  }
 
  .layout.horizontal>.main {
    min-width: 0;
  }
 
  .layout.vertical>.main {
    min-height: 0;
  }
 
  .layout>.master {
    flex: 0.25;
  }
 
  .layout>.detail {
    flex: 0.75;
  }
 
  .layout>.c-small {
    flex: 0.20;
  }
 
  .layout>.c-middle {
    flex: 0.40;
  }
 
  .layout.horizontal.left {
    justify-content: flex-start;
  }
 
  .layout.horizontal.center {
    justify-content: center;
  }
 
  .layout.horizontal.right {
    justify-content: flex-end;
  }
 
  .layout.horizontal.top {
    align-items: flex-start;
  }
 
  .layout.horizontal.middle {
    align-items: center;
  }
 
  .layout.horizontal.bottom {
    align-items: flex-end;
  }
 
  .layout.vertical.left {
    align-items: flex-start;
  }
 
  .layout.vertical.center {
    align-items: center;
  }
 
  .layout.vertical.right {
    align-items: flex-end;
  }
 
  .layout.vertical.top {
    justify-content: flex-start;
  }
 
  .layout.vertical.middle {
    justify-content: center;
  }
 
  .layout.vertical.bottom {
    justify-content: flex-end;
  }
 
  .scroll {
    overflow-y: auto;
  }

  /* ESTIL PER DESHABILITAR CAMPS EN L'EDICIÓ */
  .deshabilitar_camp {
    pointer-events: none;
    opacity: 0.6;
    border-color: #b3b3b3 !important;
    background-color: #eeeeee !important;
  }