ul { list-style: none; }
.a_menu { text-decoration: none; color: white;}
.a_menu:hover {text-decoration: none; color: lightgray;}
#menu-wrapper {
	overflow: hidden;
	max-width: 100%;
	cursor: pointer;
}

#menu-wrapper #hamburger-menu {
	position: relative;
	width: 25px;
	height: 20px;
	margin: 15px;
}

#menu-wrapper #hamburger-menu span {
	opacity: 1;
	left: 0;
	display: block;
	width: 100%;
	height: 2px;
	border-radius: 10px;
	color: black;
	position: absolute;
	transform: rotate(0deg);
	transition: .4s ease-in-out;
}

#menu-wrapper #hamburger-menu span:nth-child(1) {top: 0;}
#menu-wrapper #hamburger-menu span:nth-child(2) {top: 9px;}
#menu-wrapper #hamburger-menu span:nth-child(3) {top: 18px;}
#menu-wrapper #hamburger-menu.open span:nth-child(1) {transform: translateY(9px) rotate(135deg);}
#menu-wrapper #hamburger-menu.open span:nth-child(2) {opacity: 0; transform: translateX(-60px);}
#menu-wrapper #hamburger-menu.open span:nth-child(3) {transform: translateY(-9px) rotate(-135deg);}
#menu-container .menu-list .menu-submenu {padding-top: 10px; padding-bottom: 10px;}
#menu-container .menu-list {
	padding-left: 0;
	display: block;
	position: absolute;
	width: 100%;
	max-width: 350px;
	background: #484848;
	box-shadow: rgba(100,100,100,0.2) 6px 2px 10px;
	z-index: 999;
	overflow-y: auto;
	overflow-x: hidden;
	left: -100%;}

#menu-container .menu-list li.accordion-toggle, #menu-container .menu-list .menu-login {
	font-size: 14px;
	padding: 5px;
	border-top: 1px solid #167F66;}

#menu-container .menu-list li:first-of-type {border-top: 0;}

.accordion-toggle, .accordion-content {
	cursor: pointer;
	font-size: 14px;
	position: relative;
	letter-spacing: 1px;}

.accordion-content {display: none;}

.accordion-toggle a:before, .accordion-toggle a:after {
	content: '';
	display: block;
	position: absolute;
	top: 50%;
	right: 30px;
	width: 15px;
	height: 2px;
	margin-top: -1px;
	background-color: #5a5858;
	transform-origin: 50% 50%;
	transition: all 0.3s ease-out;}

.accordion-toggle a:before {
		transform: rotate(-90deg);
		opacity: 1;
		z-index: 2;}

.accordion-toggle.active-tab {
	background: #167F66; transition: all 0.3s ease;}

.accordion-toggle a.active:before {
	transform: rotate(0deg); background: #fff !important;}

.accordion-toggle a.active:after {
	transform: rotate(180deg);
	background: #fff !important;
	opacity: 0;}


@media (min-width:768px) {
	#menu-container ul.menu-list {max-width: 360px;}
}
/* ######################   end pre design  ######################*/


:root {
	--verde:#167F66;
}

/* ######################   MENU INTRANET  ######################*/



#menu-container {background: #167F66;}

a {color: #167F66;}

#menu-container .menu-list {
	padding: 20px 10px;
	display: block;
	position: absolute;
	width: 80%;
	max-width: 600px;
	background: #167F66;
	box-shadow: rgb(100 100 100 / 20%) 6px 2px 10px;
	z-index: 999;
	overflow-y: auto;
	overflow-x: hidden;
	left: -100%;
	height: 100%;
}

#menu-container em {color: #fff;}


/* icon amburguesa */


#menu-wrapper #hamburger-menu span {
	background-color: #fff; left: auto; right: 0;}


.logo-intranet {max-width: 140px; z-index: 1; float: right; 
	top: 7px;position: absolute; margin-left: auto; 
	margin-right: auto; left: 0; right: 0;text-align: center;}

/*llistat menu */
.menu-list a {line-height: 1.5rem;}

/* icones xarxes */
.menu-list a {text-align:center;}

/* social icons menu */
.iconos_redes_sociales_href {width: auto;}
em.fab {font-size: 1.5em;}
.menu-list div {padding: 0.2em 0.5em;}

@media (min-width: 320px){
	.fontasewnoe {-webkit-text-stroke-width: 0px; -webkit-text-stroke-color: black;}
}

ul.accordion-content {}
.xarxes {margin-top: 40px;}

/* inicia sessio */
#menu-container .menu-list li.accordion-toggle, 
#menu-container .menu-list .menu-login {
	font-size: 1em; line-height: 2.5em; border-top: 1px solid #fff;}


/* icona + */
.accordion-toggle a:before, 
.accordion-toggle a:after {background-color: #fff;}


.btn-white {
	background: #fff;
	color: #167F66!important;
	box-shadow: none!important;
	width: 100%;
	font-weight: 700;
	font-size: 16px;
}


.btn-idioma {
	background: #fff;
	color: #167F66!important;
	box-shadow: none!important;
	width: 100%;
	font-size: 16px;
	border-radius: 6px!important;
	padding: 3px 5px;
	text-align: center!important;
}




/* ######################   BUTTONS  ######################*/

.btn {border-radius: 10px; box-shadow: 7px 7px 14px #cccccc, -7px -7px 14px #f4f4f4;}


.btn-primary {
	color: #fff; background-color: #167F66; 
	border-color: #167F66; border-radius: 10px; 
	box-shadow: 7px 7px 14px #cccccc, -7px -7px 14px #f4f4f4;}





.btn-primary:hover, .btn-primary:active,
.btn-primary:not(:disabled):not(.disabled).active, 
.btn-primary:not(:disabled):not(.disabled):active, 
.show>.btn-primary.dropdown-toggle,
.dropdown-item.active, .dropdown-item:active,
.page-item.active .page-link
 {background-color: #0e5947; border-color: #0e5947;}


.bs-placeholder {
	box-shadow: none; 
	padding: .375rem .75rem;
	font-size: 1rem;
	line-height: 1.5;
	color: #495057;
	background-color: #fff;
	background-clip: padding-box;
	border: 1px solid #ced4da;
	border-radius: .25rem;}

.btn-secondary {

}

/*  LINKS  */ 
.page-link {color: #0e5947;}


/* ######################   CONTENIDO  ######################*/
.titol-seccio, p.h2 {font-size: 1.5rem; line-height: 1.5rem; font-weight: 700; margin-top: 40px; padding-bottom: 16px; border-bottom: 1px solid grey;}



/* ######################   CONTENIDO  ######################*/
.login-intro {padding-top: 20vh;}
.img-intro {background: ; border-radius: 0%; 
	/* lo quito porque deforma las imagenes panorámicas width: 100px; */
	height: 100px; margin-bottom: 20px; padding: 15px 0px 0px 13px;}
.text-intro1 {}
.text-intro2 {}
.text-intro3 {}


/* ######################   TABLAS CALENDARIO  ######################*/
tbody {border:0px!important;}
tr, td {border-radius: 6px;}
td {min-height: 20px;}


@media (min-width: 320px){
	td.horas {border: 1px solid #e8edec; border-radius: 6px; border-style: dashed;}
	.table_calendario, .table_calendario_td_1, .table_calendario_td_2 {
		margin-bottom: 10px!important; border: 1px solid #e8edec; border-radius: 6px; border-style: dashed;}
	
	.horas {background: #fff;}
}


@media (max-width: 480px){
	/* Classes assignades per usuari actives */
	#mydatatable_wrapper table {font-size: 12px;}
	#mydatatable_wrapper {margin: auto -15px;}

	.custom-margins {padding-left:0px; padding-right:0px;}

}


/* paginas concretas */

.retroceder {font-size: 14px; padding-top: 44px; display: block;}

.table_calendario_select {border: 3px solid #167F66;}
.table_calendario_select tbody tr.table_calendario_td_1 td b {color: #fff;}



@media (max-width: 374px){
	#mydatatable_paginate {transform: scale(0.8);}

	#mydatatable_previous a {font-size:0;}
	#mydatatable_previous a:after { content: '<'; font-size:16px;}

	#mydatatable_next a {font-size:0;}
	#mydatatable_next a:after { content: '>'; font-size:16px;}

}

@media (min-width: 375px) and (max-width: 437px){
	#mydatatable_paginate {transform: scale(1.1);}

	#mydatatable_previous a {font-size:0;}
	#mydatatable_previous a:after { content: '<'; font-size:16px;}

	#mydatatable_next a {font-size:0;}
	#mydatatable_next a:after { content: '>'; font-size:16px;}
}

@media (max-width: 720px) {
	#mydatatable_wrapper .float-left, #mydatatable_wrapper .float-right {width: 100%;}
	#mydatatable_wrapper #mydatatable_length {margin-top: 20px;}
	#mydatatable_wrapper #mydatatable_paginate ul.pagination {justify-content: center; margin-top: 20px;}
}

/* ######################   FOOTER  ######################*/
footer.fixed-bottom {background-color: #167F66!important; padding-top: 6px; padding-bottom: 6px; font-size: 0.8rem;}

/* other */
.alert {margin-top:30px;}


/* popover */
/*
.popover div {background-color: #167F66!important; color: red;}

.popover p {background-color: #ccc!important; color: red;}
.popover span {background-color: #9c9!important; color: red;}
.popover a {background-color: #f5f5!important; color: red;}
*/

.popover {
	padding: 7px;
	color: #fff;
	background-color: #167F66;
	border: 1px solid rgba(0, 0, 0, 0.2);
	box-shadow: rgba(100,100,100,0.2) 6px 2px 10px;
}

.popover-header {
	color: #fff; 
	background-color: #167F66;
	border-bottom: 1px solid #ebebeb;
	border-top-left-radius: calc(0.3rem - 1px);
	border-top-right-radius: calc(0.3rem - 1px);
}

.popover-body {color: #fff;}

.bs-popover-top > .arrow::after, 
.bs-popover-auto[x-placement^="top"] > .arrow::after {
  border-top-color: #167F66;
}



em.fa-folder-plus {color: #167F66;}
em.fa-folder-plus:hover {color: #9c9; cursor: pointer;}