/* font poppins */
@import url("https://use.typekit.net/soi0duh.css");


/* font*/
body {
	background: url(../img/fons_lh_nadal.jpg) no-repeat center 0;
    background-attachment: fixed;
	background-size:cover;
    background-color:#bd071a;	
    color: #000000;    
    font-family:  "poppins", "Roboto", sans-serif;
	}
	
/* titols */
h3.titolsNadal { font-size:0.9em; line-height:normal}
h4 {font-family: "poppins", "Roboto", sans-serif; font-size: 1.7em; text-transform:none; line-height:1.2;}
.titolsNadal {font-weight:700; font-size:1.3em; display:block; font-family: "poppins", "Roboto", sans-serif;}
.titolsNadal2 {
	position: relative;
    display: block;
    overflow: hidden;
    border-radius:5px;
    margin-bottom: 10px;
    background-color: #bd071a;
    padding: 5px 10px;
    font-size: 1em;
    font-weight: 700;
    font-family:  "poppins", "Roboto", sans-serif;
	text-transform:uppercase;
    color: #fff;
    line-height: normal;	
	}
.titolPrimer {display:inline-block; font-size:2em; font-family: "poppins", "Roboto", sans-serif;  margin-bottom:15px;}
.titolSegon {font-size:1.5em; display:inline-block; font-family: "poppins", "Roboto", sans-serif; margin-bottom:15px;}
.titolSegon:before {content:"|"; padding-left:10px; padding-right:10px}


/*fons*/
.fonsNadalContingut { background:#ffffff; display:block; overflow:hidden; padding:30px; width:auto; border-radius:15px; margin-bottom:10px; line-height: 1.5;}
.fonsNadalAgenda { background-color: rgba(234,154,38,.15);}


/*colors*/
.destacatNadal, .destacatNadal a, a.destacatNadal:hover, .blauTurquesa, .blauTurquesa a, a.blauTurquesa, a.blauTurquesa:hover, p a:hover, ul li a:hover, a:hover, p a, ul li a, a, .titolsNadal a, .titolPrimer, .titolSegon {color:#bd071a;}



.blauTurquesa2, .blauTurquesa2 a, a.blauTurques2a, a.blauTurquesa2:hover, h4, .titolsNadal {color:#ea9a26;}
.titolsNadal a:hover {color:#c6421f;}


/*botons */
input[type=text], select, input[type=submit], textarea {font-family: "poppins", "Roboto", sans-serif; font-size: 0.9em !important;}
.botonsCartes { display:block; text-align:center}
.botonsCartes a {background-color:#355734; color:#ffffff; border-radius:12px; padding:5px 10px; font-family: "poppins", "Roboto", sans-serif; text-decoration:none; text-align:center; margin-right:5px; font-size: 1.4em; font-weight:200;}
.fonsButtonNadal { display:block; text-align:center; margin-top:20px}
.fonsNadalContingut input[type=submit], .botoNadal a, .fonsButtonNadal a{
	background-color:#bd071a; 
	color:#ffffff; 
	border-radius:5px; 
	padding:5px 10px; 
	font-weight:600; 
	text-decoration:none; 
	text-align:center; 
	border:0
	}
.fonsButtonNadal a { margin-right:10px;}
.botoNadal a {margin-right:10px;}
.botoNadal a:hover { text-decoration:none; background-color:#000000;}
.botoNadal a:after { content:" >>";}




/* altres*/
.clip {
position: relative;
height: 130px;
width: 200px;
border:1px  solid #ccc;
}
.clip img {
position: absolute;
clip: rect(30px 165px 100px 30px);
}
.mapaArbres { vertical-align:top; display: inline-block}

/* felicitacio formulari */
.fonsFelicitacioNadal {width:100%; position:relative; display:block; margin:0; text-align:center; padding:0; }
.fonsFelicitacioNadal .contingut {display:inline-block; text-align:left; width:700px; padding:80px 40px 40px 40px; background-color:#355734; border-radius:15px; overflow:hidden; box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3);}
.fonsFelicitacioNadal label { font-weight:normal; color:#fff; font-family: "poppins", "Roboto", sans-serif; font-size:1.2em; font-weight: 300; margin-bottom:10px; display:block;}
.fonsInputNadal {background-color:#FFFFFF; padding:5px; border:0; color:#000; width:98%; margin-bottom:8px; display:block; border-radius:10px; padding:10px; max-width:none}


/* cap */
.capNadal {position:relative; display:block; width:100%; margin:0 0 10px 0; border-radius:10px; overflow:hidden; box-shadow: 2px 2px 4px rgba(0, 0, 0, .4);}
.capNadal .titolCapNadal {
	text-decoration: none;
    width: 100%;
    display: block;
    position: relative;
    text-align: center;    
	margin:0;
	box-shadow: 2px 2px 4px rgba(0, 0, 0, .4);
	}



.capNadal .botoCapNadal.dreta { position:absolute; right:20px; top:0;}
.capNadal .botoCapNadal.esquerra { position:absolute; left:20px; top:0;}
.capNadal .botoCapNadal {
	flex: 1 auto;
    align-items: center;
    justify-content: flex-start;
    flex-flow: column;
    display: flex;
    margin: 22px 0 0 0;
    padding: 0;
    text-align: center;
    font-family:  "poppins", "Roboto", sans-serif;
    font-size: 1.1rem;
    color: #383937;    
    text-decoration: none;
    vertical-align: top;
    line-height: 1.2;
    letter-spacing: 0.05em;
    max-width: 160px;
	z-index:2;
	font-weight:500;
	transition:.20s ease-in;
	}	
	
.capNadal .botoCapNadal span {
	height: 100px;
    width: 100px;
    margin-bottom: .6rem;
    background-size: cover;
    background-blend-mode: normal;
    background-repeat: no-repeat;
    overflow: hidden;
	border-radius:50%;
	transition:.20s ease-in;
	 }
.capNadal .botoCapNadal:hover { font-size:.9rem; color:#bd071a}	
.capNadal .botoCapNadal.dreta span {background-image:url(../img/dreta.png);}
.capNadal .botoCapNadal.esquerra span {background-image:url(../img/esquerra.png);}
.capNadal .botoCapNadal:hover span {background-blend-mode: screen; background-color: rgba(189, 7, 26, .8);  height: 110px;  width: 110px;}


/* menu principal */
.menuNadal {
	display: flex;
    padding: 0;
    margin: 0 0 10px 0;
    position: relative;
    z-index: 2;
    background-color: #355734;
    border-radius: 10px;
	box-shadow: 2px 2px 4px rgba(0, 0, 0, .4);
	line-height: 1.5;
	}	
.menuNadal nav {
	width:100%;
	margin:0;
	padding:0; 
	display:flex;
	}	
.menuNadal nav ul {
	width:100%;
	padding: 0;
	margin:0;
	list-style:none;
	display: flex;
    flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	}
.menuNadal li {	
    padding: 8px;
    margin: 0;
    background-image: none;
    flex: 1;
    align-items: center;
    justify-content: center;
    flex-flow: column;
    display: flex;
	position:relative;
}
.menuNadal .menuNadalPestanya:first-child {border-top-left-radius: 10px;  border-bottom-left-radius: 10px;}
.menuNadal .menuNadalPestanya:last-child {border-top-right-radius: 10px;}
.menuNadal a {	
	padding: 0;
    color: #ffffff;
    font-size: 1em;
    font-family: "poppins", "Roboto", sans-serif;
    text-decoration: none;
    position: relative;
    display: block;
	font-weight:500;
	text-transform:uppercase;
	}
.menuNadal .menuNadalEnllas a {padding:12px;}
.menuNadal .menuNadalPestanya a:hover { color:#ffffff;}
.menuNadal .menuNadalPestanya:hover, .menuNadal .menuNadalPestanya:hover .menuNadalDesplegable, .menuNadal .menuNadalPestanya:hover .menuNadalEnllas { display:flex; background-color:#2f3622;}



	


.menuNadal .menuNadalDesplegable {
	padding:0;
	margin:0;
	box-shadow: 3px 5px 5px rgba(0,0,0,.5);
	}
.menuNadal .menuNadalDesplegable ul { 
	display: block;
	padding:0;
	margin:0;
	list-style:none;
	position:relative;
	width:100%;
	}
.menuNadal .menuNadalDesplegable ul li {
	padding:0;
	align-items: flex-start;

	}
.menuNadal .menuNadalDesplegable ul li a {
	display:block;
	margin:0;
	padding:10px 15px;	
	line-height: 1.2em;
    font-size: 0.9em;
	text-transform: none;
	
	}	
.menuNadal .menuNadalDesplegable ul li:hover, .menuNadal .menuNadalEnllas a:hover {background-color:#bd071a; color:#fff;}
.menuNadal .menuNadalDesplegable ul li:hover a {color:#fff;}	

.menuNadal .menuNadalEnllas, .menuNadal .menuNadalDesplegable {
	display: none;
    position: absolute;
    z-index: 0;
    top: 40px;
    left: 0;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
	width:100%;
	overflow:hidden;
	}








/* submenu destacats */
.menuDestacats {
	display: flex;
    width: 100%;
    margin-bottom: 20px;
    padding-bottom: 20px;
    text-align: center;
    border-bottom: 3px dotted #000;
	}
.menuDestacats a {	
    flex: 1;
    align-items: center;
    justify-content: flex-end;
    flex-flow: column;
    display: flex;
    margin: 5px;
    padding: 70px 10px 10px 10px;
    text-align: center;
    font-family: "poppins", "Roboto", sans-serif;
    font-size: .9rem;
    text-transform: uppercase;
    font-weight: 700;
    color: #fff;
    text-decoration: none;
    vertical-align: top;
    line-height: 1.2;
    overflow: hidden;
    border-radius: 10px;
    text-shadow: 2px 2px 6px rgba(0, 0, 0, 1);
    box-shadow: 2px 2px 4px rgba(0, 0, 0, .4);
    background-size: cover;
    background-blend-mode: normal;
    background-repeat: no-repeat;
    overflow: hidden;
    transition: .20s ease-in;
	}

.menuDestacats a:nth-child(1) {background-image:url(../img/circ.png);}
.menuDestacats a:nth-child(2) {background-image:url(../img/campament.png);}
.menuDestacats a:nth-child(3) {background-image:url(../img/advent.png);}
.menuDestacats a:nth-child(4) {background-image:url(../img/joguines.png);}
.menuDestacats a:nth-child(5) {background-image:url(../img/sotaarbre.png);}
.menuDestacats a:nth-child(6) {background-image:url(../img/parenoel.png);}
.menuDestacats a:nth-child(7) {background-image:url(../img/);}
.menuDestacats a:nth-child(8) {background-image:url(../img/);}

.menuDestacats a:hover {background-color: rgba(189, 7, 26, .8); background-blend-mode: screen; }


/* submenu tematiques */
.llistaTematiques {
	padding:0;
	margin:0;
	width:100%;
	text-align:center;
	}	
.llistaTematiques ul {
	display: inline-flex;
    display: -webkit-inline-flex;
    flex-flow: row wrap;
    -webkit-flex-flow: row wrap;
	justify-content: space-between;
	width:100%;
	padding: 0;
	margin:0;
	list-style:none;
}
.llistaTematiques ul li {
    padding: 0;
    margin: 10px;
	background-color:#bd071a;
	border-radius:5px;
	height:200px;
	width:200px;
	flex-grow:1;
	display:flex;
	display: -webkit-flex;	
	flex-flow: row wrap;
    -webkit-flex-flow: row wrap;
	justify-content: space-between;
	text-align:center;
	vertical-align:middle;
	/*box-shadow: 1px 1px 5px rgba(0,0,0,.7);*/
	align-content:center;
	background-image:none;
}

.llistaTematiques ul li:hover { background-color:#ea9827; /*box-shadow: 1px 1px 5px rgba(0,0,0,.9);	*/	}
.llistaTematiques ul li a{
	color: #FFF;
    font-size: 1.5em;
    text-decoration: none;
    padding: 20px;
    margin: 0;
    line-height: 1.4;
    font-family: "poppins", "Roboto", sans-serif;
    display: block;
    width: 100%;
    /* text-shadow: 1px 2px 2px rgba(0, 0, 0, 1);*/
}
.llistaTematiques ul li:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
* html .llistaTematiques ul li {height: 1%;}



.llistaInteriorTematiques {
	padding:0;
	margin:0 0 20px 0;
	width:100%;
	text-align:center;
	}	
.llistaInteriorTematiques ul {
	display: inline-flex;
    display: -webkit-inline-flex;
    flex-flow: row wrap;
    -webkit-flex-flow: row wrap;
	justify-content: space-between;
	width:100%;
	padding: 0;
	margin:0;
	list-style:none;
}
.llistaInteriorTematiques ul li {
    padding: 0;
    margin: 5px;
	background-color:#bd071a;
	border-radius:5px;
	height:90px;
	width:90px;
	flex-grow:1;
	display:flex;
	display: -webkit-flex;	
	flex-flow: row wrap;
    -webkit-flex-flow: row wrap;
	justify-content: space-between;
	text-align:center;
	vertical-align:middle;
	/*box-shadow: 1px 1px 5px rgba(0,0,0,.7);*/
	background-image:none;
	align-content:center;
}
.llistaInteriorTematiques ul li:hover { background-color:#ea9827; /*box-shadow: 1px 1px 5px rgba(0,0,0,.9);*/}
.llistaInteriorTematiques ul li a{
color: #fff;
    font-size: 1em;
    text-decoration: none;
    padding: 10px;
    margin: 0;
    font-family: "poppins", "Roboto", sans-serif;
    font-weight: 500;
    text-transform: uppercase;
    display: inline-block;
    line-height: 1.3;
    width: 100%;
    /* text-shadow: 1px 2px 1px rgba(0, 0, 0, 1);*/
}
.llistaInteriorTematiques ul li:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
* html .llistaInteriorTematiques ul li {height: 1%;}



/* menu recomanacions */
.recomanacionsBiblioteques {text-align:right; display:block; font-size:0.8em; margin-top:20px;}
.llistaRecomanacions {
	display:block;
	padding:0;
	margin:0;
	width:100%;
	margin-bottom:5px;
	}
	
.llistaRecomanacions ul {
	display:block;
	padding: 0;
	margin:0;
	list-style:none;
	text-align:center;
}

.llistaRecomanacions ul li {
	background-image:none;
	padding: 0;
  	margin: 5px;
	display:inline-block;	
	min-width:100px;
}
.llistaRecomanacions ul li a{
	color:#fff;	
	font-size:1em;
	text-decoration: none;
	padding:8px;
	display:block;
	background-color:#f98509;
	border:1px solid #dc7c00;
	font-family: "poppins", "Roboto", sans-serif;
	text-transform:uppercase;
}
.llistaRecomanacions ul li:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
* html .llistaRecomanacions ul li {height: 1%;}




/*llistes generiques*/
ul{
	list-style:none;
	margin:0 0 0 10px;
	padding:0 0 10px 0;
}

ul li {
	padding:2px 0 2px 10px;
	margin:0;
	vertical-align:baseline;
	background:url(/img/lh12/common/punt_negre.png) no-repeat 0 9px;
	}

ul li a {
	text-decoration: underline;
	padding: 0;
	margin:0;
}
.llistatContinguts h4 { font-size:1.3em; font-family: "poppins", "Roboto", sans-serif;}




/* acordio*/
.panel-group { width:890px}
.panel-group .panel {position:relative; display:block; overflow:hidden; display:block; border-radius:5px; margin-bottom:5px; background-color:#355734; width:100%}
.panel-group .panel .panel-title {
	color:#fff;
	font-size: 1em;
    font-weight: 700;
    font-family:  "poppins", "Roboto", sans-serif;
	text-transform:uppercase;}
.panel-group .panel .panel-title a:hover {color:#fff;}
.panel-group .panel .panel-heading {padding:10px 20px; }
.panel-group .panel .panel-body {padding:10px 20px}


/* videos */
.hospis iframe { width:100%; height:760px;}


/*carta reis */
.cartaReis {display:block; overflow:hidden; clear:both; margin:0; padding:0; width:100%;}
.panelCartaReis {background-image:url(../img/fonsCartaReis.png); background-repeat:no-repeat; background-color:transparent; width:890px; height:709px; display:block;}
.panelCartaReisEs {background-image:url(../img/fonsCartaReis_es.png); background-repeat:no-repeat; background-color:transparent; width:890px; height:709px; display:block;}
.textecarta {
	border: 0;
    overflow: hidden;
    width: 410px;
    height: 250px;
    font-size: 0.9em;
    color: #355734;
    margin: 204px 55px 0 55px;
    background-color: transparent;
    font-family: "poppins", "Roboto", sans-serif;
    line-height: 1.5em;
    padding: 0;
	}
.formulariCarta {
	width: 410px;
    height: 165px;
    margin: 0px 55px 0 55px;
    display: block;
    clear: both;
	}	
	
.fonsCartaReis {width:391px; padding-top:20px; padding-bottom:20px; display:inline; text-align:left; clear:both;}

#PanelRecibido {display:block; border-radius:15px; width:auto; padding:50px 20px; font-family: Arial, Helvetica, sans-serif; color:#ffffff;  background-color:#355734;}

.taulaCartaNadal {border-collapse:collapse; border:1px solid #AEB9BF;}
.fonsCartaSobre { background-color:#a2d24e; width:391px; border-bottom:1px solid #0000; margin-bottom:20px;}
.fonsCartaSobre, .fonsCartaReis  {border-left:1px solid #000; border-right:1px solid #000; margin-left:49px;}

.nomCarta { padding-top:15px; display:block; width:100%;}
.nomCarta span { font-weight:bold; color:#bd071a;}
.nomCarta input { font-weight:normal; border-top:0; border-right:0; border-left:0; border-bottom:1px solid #355734; width:95%; background-color:#ffffff; color:#355734;}

.reiCarta { margin-top:10px; display:block; width:100%; margin-bottom:20px;}
.reiCarta span {font-weight:bold; color:#bd071a;}
.reiCarta select {
    padding: 2px 10px;
    background-color: #ffffff;
    border-radius: 10px;
    border: 0;
    color: #355734;
	}
#ctrlimgRei { 
	width: 40%;
    margin: 0 30% 0 30%;
    display: block;
	}
	
/* FORMULARIS */
.formulariNadal { padding:1em; background-color:#355734; border-radius:15px; overflow:hidden; box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3); color:#ffffff;}
.formulariNadal .text-muted { color:#9ef79c !important}