@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,600,700');

.popupBarraCookie{
  /*display:none;*/
  position:fixed;
  top:0;
  left:0;
  rigth:0;
  bottom:0;
  background-color:rgba(0,0,0,.7);
  width:100%;
  height:100%;
}

.popupBarraCookie a:hover{
    text-decoration: underline;
}

.elemBarraCookie2{
    text-align: right;
    padding-top: 10px;
    padding-bottom: 10px;
}

.elemBarraCookie3{
    text-align: right;
}

.standardLletra{
    font-family: "Open Sans", Helvetica, Arial, sans-serif;
}



@media (min-width:992px).col-md-3 {
	width: 25%; display: none !important; 
}

body {/*estilos del cuerpo de la página*/
    background-image: url("../img/degradado_fondo.jpg");
    background-repeat: repeat-x;
    font-size: 14px;
    margin: 0;
    padding: 0;
    font-family: 'Source Sans Pro', sans-serif !important;
}

/*a{
    color: #FFF;
}*/

.capsaleraLogo{
    float:left;
    margin:10px;
}

.textRight{
    text-align:right;
}

#barraCookie{
/*    display:none;
    left:0px;
    right:0px;
    bottom:0px;
    width:100%;
    border-top:1px solid #6C6C6D;
    background: #3d3d41;
    color:#FFFFFF;
    z-index: 99999;
    padding: 20px 50px;
    text-align:center;
    font-size: 13px;
    margin-left: 0;
    position: fixed;*/
    
    background-color:#333;
    opacity:0.97;
    padding:20px 50px;
    position: fixed;
    top:10px;
    color:#fff;
    width:100%;
    text-align: justify;    
}

#barraCookie a{
    color: Aqua;
}

#barraCookie button, #buttonConfirmarCookie{
    margin-left: 20px;
    background-color: #A3D1D4 !important;
    border: 2px solid #a3d1d4 !important;
    border-radius: 5px !important;
    margin-top: 5px !important;
    padding:8px !important;
}

#barraCookie button:hover, #buttonConfirmarCookie:hover{
    color: #555555 !important;
}


#modal-window-cookies{
    text-align:justify;
}

#modal-window-cookies .modalbox{
    padding: 5px 20px 13px 20px;
}

#modal-window-cookies h1{
    font-size: 18px;
    font-family: "Montserrat", sans-serif;
    color: #424856;
    margin: 0;
}

#modal-window-cookies .titulo-pagina{
    text-align:center;
    margin-bottom:30px;
    margin-top: 5px;
}

/** línea que ponemos debajo de los títulos de página **/
#modal-window-cookies .linea-titulo{
  border: 1px solid;
  width: 55px;
  margin-top: 25px;
  margin-left: auto;
  margin-right: auto;
}

#modal-window-cookies .button_suggerencia-carito {
    margin-left: 10px !important;
    background-color: #A3D1D4 !important;
    height: 70px !important;
    border: none !important;
    width: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    border-radius: 0px !important;
    margin-top: 20px;
}

.descripAmic{
    font-style:italic;
}

.recuperarPassword{
    color:blue;
    text-decoration: underline;
    cursor:pointer;
}

.recuperarPassword:hover{
    text-decoration: none;
}

.recuperarPasswordInput, .recuperarPasswordCorrecto{
    padding:5px;
    margin:5px;
    border: 1px solid #999;
    background-color: #ccc;
    display:none;
}

.recuperarPasswordInput span{
    color:blue;
    text-decoration: underline;
    cursor:pointer;
}

.recuperarPasswordInput span:hover{
    text-decoration: none;
}

.recuperarPasswordKO{
    color:red;
}

#blocAmicDivBenef{
    margin: 0px;
    border: none;
    background-color: #fff;
}

#amicDivBenef, .amicDivBeneficiari{
    padding: 5px 20px 20px 20px;
    margin-top: 16px;
}

#amicDivBenef table input, #amicDivBenef table select, .amicDivBeneficiari table input, .amicDivBeneficiari table select,
#formDadesCamps table input, #formDadesCamps table select{
    width: 91% !important;
}

#amicDivBenef table, .amicDivBeneficiari table, #formDadesCamps table{
    width:100%;
}

.numBenef{
    font-weight: bold;
    color: #C74A4A;
    font-size: 16px;
    font-weight: 400;
    line-height: 20px;
    padding: 0;
    text-transform: none;
    margin: 0;
    margin-left: 6px;
}

.ui-accordion .ui-accordion-content {
    border-top: 0 none;
    overflow: auto;
    padding: 1em 1em;
}


.buttonMobileSelec{
    background-color: #3388cc;
    color: #fff;
}

.divButtonMobile{
    position: absolute;
    right: 50px;
    top: 50px;
}

.llistaEspera{/*Para cursos*/
    cursor:pointer;
}

.remarcarObservCursos{
    text-decoration:underline;
}

/*estilos botones tipo 'button'*/
/*input[type="button"]{
    margin-top:10px;
    background: #AD6666;
    background: linear-gradient(to bottom, #AD6666 0%, #AF2626 100%) repeat scroll 0 0 transparent;
    border: 1px solid #AF3131;
    border-radius: 4px 4px 4px 4px;    
    -webkit-border-radius: 4px;
    color: #FFFFFF;
    cursor:pointer;
    padding:5px 15px 6px;
    font-weight: bold;
    box-shadow: 0 0 1px 1px #E3B6B6 inset;
    text-shadow: none;
}

input[type="button"]:hover{
    background: #AF3131;
    background: -moz-linear-gradient(center top , #AD6666 10%, #AF2626 50%) repeat scroll 0 0 transparent;
}*/

#botoCalendari{
    padding-bottom:10px;
}

input.continuar{/*estilo concreto de botones*/
    clear:both;
    margin: 2px 2px 5px 0;
}

a img{
    border:none;
}

#columnRightAjuda {/*Div flotante (para VIVANCO). Activar por properties*/
    position: relative;
    float: right;
    width: 150px;
    height: 100%;
    display:none;
}

.contingutRight {
    border: 1px solid #a70461;
    border-radius: 10px;
    position: fixed;
    overflow: hidden;
    width: 150px;
    margin-top:200px;
}

#columnRightAjuda .divTitleAjuda{
    background-color: #a70461 !important;
    height:30px;
    color: #fff !important;
    font-size:16px;
    padding: 6px 8px;
}

#columnRightAjuda .divTextAjuda{
    background: url(../img/icono-telefono.png) no-repeat scroll right bottom 10px #fff;
    padding: 10px 0px;    
    color: #a70461;
    height:90px;
    text-align:center;
}

#columnRightAjuda .divTextAjuda0{
    font-size:12px;
}

#columnRightAjuda .divTextAjuda1{
    font-weight:bold;
    font-size:18px;
}

/*botón cerrar ayuda*/
#columnRightAjuda .divTitleAjuda1{
    float: right;
    cursor: pointer;
    visibility:hidden;
}


div.planaGeneral {/*div que contiene el contenido de la página*/
    margin: 0 auto;
}


div.plana {/*div que contiene el contenido de la página*/
    background-color: #f2f2f2;
    color: #595959;
    height: 720px;
    margin: 0 auto;
    width: 780px;
    position:relative;
    font-size:16px;
}

div.planaNumerada {/*div que contiene el contenido de la página*/
    background-color: white;
    color: #595959;
    height: 720px;
    margin: 0 auto;
    width: 800px;
    position:relative;
}

div.planaCI{/*div que contiene el iframe de la pasarela del corteingles*/
    padding:10px;
}

.avisErrorIdentif {/*estilo del div que muestra texto de error en identificacio.jsp (identificación CENTRO)*/
    background: #D65931 url(../img/alert.png) no-repeat left;
    background-position: 10px center;
    border: 1px solid;
    color: #FFF; 
    margin: 12px 0 0 0;
    padding: 12px 10px 12px 50px;
    position: relative;    
}

.avisError {/*estilo del div que muestra texto de error*/
    background: #D65931 url(../img/alert.png) no-repeat left;
    background-position: 10px center;
    border: 1px solid;
    color: #FFF; 
    margin: 12px 0 12px 0;
    padding: 5px 10px 15px 50px;
    position: relative;
    font-size: 14px;
}

.errorComprovant{
    bottom: 6px;
    position: absolute !important;
    height: 24px;
    right: 6px;
    z-index: 999;
}

#avisTarifesError {/*estilo del div que muestra texto de error de las tarifas*/
    height: 40px !important;
}

#divErrorSessio {/*Div que contine el error de la sessión en la página pasarela_virutal_OK*/
    background: #F7D9D9 url(../img/alert.png) no-repeat left;
    height: 32px;
    background-position: 10px center;
    border: 1px solid;
    color: #AF2626;
    margin: 12px 0 12px 0;
    padding: 15px 10px 15px 50px;
    position: relative;    
}

.avis {/*estilo del div que muestra texto informativo*/
    background-position: 10px center;
    border: 1px solid;
    color: #fff;
    padding: 10px 10px 10px 10px;
    position: relative;    
    height:auto;
    text-align: justify;
    margin-bottom: -4px;
    background-color: #1679bf;
    padding: 11px;
    font-size: 14px;
    text-align: left !important;
    clear:both;
}

.avis1 {/*estilo del div que muestra texto informativo*/
    background: rgb(243,243,243);
    height: 12px;
    background-position: 10px center;
    border: 1px solid;
    color: rgb(129,129,129);
    margin: 10px 0 10px 0;
    padding: 10px 10px 10px 10px;
    position: relative;    
    height:auto;
}

.avisTitle{/*título del texto informativo anterior*/
    font-weight:bold;
    padding-bottom:4px;
}

.remarcar{/*remarcar input al producirse un error (ejemplo falta introducir DNI)*/
    border-color:red !important;
    background-color:#FCBABA !important;
}

.textRemarcar{/*remarcar input al producirse un error (ejemplo falta introducir DNI)*/
    background-color:#CCCCCC !important;
    margin-bottom:5px;
    margin-top:5px;
    padding: 5px;
}


/*text link en los popups (block)de actividades.jsp y pasarela_virutal_inici.jsp*/
.elemLink{
    color: #7F7F7F;
    display: inline;
    font-size: 0.95em;
    padding: 0.1em;
    text-decoration: underline;
    cursor:pointer;
}

.elemLink:hover{
    text-decoration: none; 
}

/*estilo filtro para casales*/
div.t_filtre{ 
    color: #A3A3A3;
    background-color: #ECEAEB;
    font-size: 12px;
    font-weight: bold;
    text-align: center;
    padding-bottom: 0.3em;
    padding-top: 0.3em;
    width:250px;
    margin-right:2px;    
}

/*.s_tarifa{
    width:250px;
}*/

/*estilo de las tablas de carritoActivitats.jsp y pasarela_virtual_OK.jsp y div tarifas cabecera-columnas (activitats.jsp)*/
div.t_header{ 
    color: #A3A3A3;
    background-color: #ECEAEB;
    font-size: 12px;
    font-weight: bold;
    text-align: center;
    padding-bottom: 0.3em;
    padding-top: 0.3em;
    float:left;
    width:250px;
    margin-right:2px;    
}

.t_header{
    width:100%;
}

div.t_header1{ /*estilo div tarifas cabecera-columnas (activitats.jsp). Las pequeñas (personas,total)*/
    width:105px !important;  
}

#rebutsPendents, #quotaPendents{ 
    display:table;
    width:100%
}

/*estilo de las tablas de carritoActivitats.jsp y pasarela_virtual_OK.jsp y div tarifas cabecera-columnas (activitats.jsp)*/
#rebutsPendents div.t_headerDiv, #quotaPendents div.t_headerDiv{ 
    display: table-cell;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    padding: 12px 10px 10px 10px;
    margin-top: 5px;
    float:left;
    width:12%; /*restar al % lo utilizado para margin-right o left*/   
    background-color: #fff !important;
    border-bottom: 2px solid #417B5E;
    border-right: 1px solid #fff;
    border-left: 1px solid #fff;
}

#rebutsPendents  div.t_cosDiv, #quotaPendents  div.t_cosDiv{ /*estilo div tarifas cuerpo-columnas (activitats.jsp)*/
    display: table-cell;
    font-size: 16px;
    text-align: center;
    padding: 12px 10px 10px 10px;
    float:left;
    width:12%; /*restar al % lo utilizado para margin-right o left*/   
    border: 1px solid #dddddd;;

}

#rebutsPendents  td.t_totalDiv, #quotaPendents  td.t_totalDiv{ /*estilo div tarifas cuerpo-columnas (activitats.jsp)*/
    background-color:#868485 !important;
    color:#fff;
    font-weight: bold;
}

#rebutsPendents  td, #quotaPendents  td, #rebutsPendents  th, #quotaPendents  th{ 
    text-align: center !important;
}

div.t_headerAmics{ 
    display:table-row;
}

/*per els divs amb format taula*/
.percentatge10{ 
    width:10% !important;  
}

.percentatge20{ 
    width:20% !important;  
}

.percentatge30{ 
    width:30% !important;  
}

.percentatge40{ 
    width:40% !important;  
}

.percentatge50{ 
    width:49% !important;  
}

.percentatge60{ 
    width:60% !important;  
}

.percentatgeAuto{ 
    width:auto !important;  
}

div.t_cos{ /*estilo div tarifas cuerpo-columnas (activitats.jsp)*/
    background-color:#F8F8F8;
    font-size: 12px;
    font-weight: bold;
    text-align: center;
    padding-bottom: 0.3em;
    padding-top: 0.3em;
    float:left;
    width:250px;    
    margin-right:2px;
}

div.t_cos_blanc{ /*estilo div tarifas cuerpo-columnas (activitats.jsp)*/
    padding-bottom: 0.3em;
    padding-top: 0.3em;
    float:left;
    width:250px;    
    margin-right:2px;
	min-height:21px;
}

div.t_cos1{ /*estilo div tarifas cuerpo-columnas (activitats.jsp). Las pequeñas (personas,total)*/
    width:105px !important;  
}

div.t_cos input{/*estilo input tarifas cuerpo (activitats.jsp)*/
    text-align: right;
}

div.t_cos select{ /*estilo select tarifas cuerpo (activitats.jsp)*/
    width:100%;
}

table .tr_taula{/*estilo del tr de las tablas de carritoActivitats.jsp y pasarela_virtual_OK.jsp*/
    text-align: left;
    background-color: #f6f4f5;
    font-size: 14px;
    height: 30px;
	padding: 3px 15px 3px 7px;
}

#accordionCarrito table td, #accordionCarrito table th{
    padding: 2px 2px 0px 10px;
}

table .tr_taula_total{/*estilo del tr del total de las tablas de carritoActivitats.jsp y pasarela_virtual_OK.jsp*/
    background-color: #868485;
    font-size: 14px;
    font-weight: bold;
    color: #fff;
	padding: 3px 2px 3px 7px;
}

table .td_taula_oblig{/*estilo del td para reservas del % que ha de pagar y el total carritoActivitats.jsp y pasarela_virtual_OK.jsp*/
    text-align: right;
    background-color: #6B9B70;
    font-size: 14px;
    font-weight: bold;
    color: #FFF;
}


table td{/*estilo del tr del total de las tablas de carritoActivitats.jsp y pasarela_virtual_OK.jsp*/
	padding: 3px 2px 3px 7px;
}

div.t_headerTarifa{ /*header del div que simula una tabla de tarifas (activitats.jsp)*/
    clear:both;
}
div.t_headerTarifa a:hover{ 
    text-decoration: none;
}

.desactivarFila{/*Dentro horario (activitats.jsp) para desactivar la opción (misma actividad o mismo horario)*/
    color:#ccc;
}

#avisHorariPreuRedTemp{/*Dentro horario (Activitats.jsp) para mostrar si hay un precio concreto por temporada*/
    font-style:italic;
    font-weight:bold;
}

#selectTarifes{/*Estilo div que contine las tarifas (activitats.jsp)*/
    margin:10px 10px 42px 10px;
}

#divSales{/*Estilo div que contine las salas (activitats.jsp de numeradas)*/
    margin:10px 10px 10px 10px;
    width: 250px;
}

#divSales td{
    width:110px;
    border-bottom: 1px solid #ccc;
    height:25px;
    text-align:center;
}

#tarifesPromo{/*Estilo div que contine la promoción de las tarifas (activitats.jsp)*/
    margin-left:10px;
    font-style:italic;
}

.i_numPers{/*Estilo select/option que contine en número de personas de las tarifas (activitats.jsp)*/
    width:50px !important;
}

/*Estilo de los links de idiomas del header.jsp (top)*/
#divIdioma {
    color: #000000;
    margin: 0;
    padding: 0;
}

#divIdioma a {
    color: #7F7F7F;
    display: inline;
    text-decoration: underline;
    padding: 10px;
}

/*Estilo del copyright del footer.jsp (pie)*/
p.copyright {
    background-color: #f2f2f2;
    color: #4C4C4C;
    font-size: 9px;
    font-weight: bold;
    text-align: center;
}
/*
#accordion, #accordionCarrito, #accordionDades, #accordionLlistat, #accordionLlistatAntic, #accordionPago,#accordionRecuperarDades{
    margin:10px;
}*/

.avisIframe{
    background-color: #F26D6D;
    border: 2px solid #FF0000;
    color: #000000;
    font-weight: bold;
    padding: 5px;
    text-align: center; 
}

#iframeResultatCI{
    height: 500px;
    width: 100%;   
    border:0px;
}

#iframeSetQuest{
    padding: 10px;
    width: 100%;   
    border:0px;
    height: 200px;
}

#iframeCI{
    height: 465px;
    width: 100%;   
    border:0px;
}

#iframeSMP,#iframeResultatBanc{
    height: 765px;
    width: 100%;   
    border:0px;
}

.lblpaso {
    font-size: 24px;
    font-weight: bold;
    margin: 5px 0 5px 10px;
}

/*.lbltitpaso {
    font-size: 16px;
    margin: 0 0 0 12px;
}*/

h3 .tabInfo{/*Estilo accordeon, h3*/
    float:right;
    padding: 8px 4px 0px 0px;
    color: #999;    
}

h3 .tabInfoRemarcat{/*Estilo accordeon, h3, remarcar texto (dataVisita en carritoActivitats.jsp y pasarela_virtual_OK.jsp) */
    /*color: #FFF;
    float:right;
    padding: 4px 4px 0px 0px;*/
    position: absolute;
    right:5px;
}

#divTop{
    height: 16px;
    padding-left:20px;
}
/*Mostraremos el usuario en reservas (datos de usuario lado left-top de la página, debajo banner)*/
#dadesUser{
    float: left;
    position: relative;
    width: 300px;    
}

#dadesUser h3{
    padding:0px;
    margin:0px;
}

#dadesUser #changePass{
    cursor: pointer;
}

#dadesUser #nomCentre{
    position: relative;
    bottom: 3px;
}

#changePass{
    background: url(../img/changePass.png) no-repeat;
    height: 24px;
    width: 24px;
    display: inline-block;
}

#changePass:hover{
    background: url(../img/changePass_hover.png) no-repeat;
}

/*Mostraremos link's para visualizar reservas pasadas o futuras (pago). Pasadas-> permite descargar documentos*/
#dadesDescarga{
    display: block;
}

.textDescargSel{
    text-decoration:underline;
    color:#BC4A4A;
    font-weight:bold;
    cursor:pointer;
}

.textDescarg{
    text-decoration:none;
    font-weight:normal;
    cursor:pointer;
}

.textDescarg:hover{
    text-decoration:underline;
}

/*Mostramos el carrito para continuar comprando en la pagina activitats.jsp*/
#infoCarritoActiv{
    display:none;
    height:16px;
    position: relative;
    top:-15px;
}

.divInfoCarrito{
    float: right;
    position: relative;
    width: 420px;    
}

.divInfoCarrito{
    float: right;
    position: relative;
    width: 300px;    
}

.divInfoCarrito h3{
    top:-12px;
    position: absolute;
    right: 50px;
    color:#424856;
    cursor:pointer;
    font-size:20px;    
}

#divInfo{
    padding: 15px;
    text-align: center;
    color: #555; 
    border: 3px solid #ccc;
    background-color:#fff;
    cursor: wait;
    line-height: 30px;
    width: 300px;
}

#divDevolError{
    padding: 15px;
    text-align: center;
    color: #555; 
    border: 3px solid #ccc;
    background-color:#fff;
    cursor: wait;
    line-height: 30px;
    width: 300px;
}

.divInfoCarrito h3:hover{
    color:#1679BF;    
}

.infoCarrito{
    position: absolute;
    right: 14px;
    top: -15px;
}
/*Fin mostramos el carrito para continuar comprando en la página activitats.jsp*/

.completa{
    font-weight: bold;
    color:red;
}

.exhaurida{
    font-weight: bold;
    color: rgb(181,90,0);
}

/*datepicker*/
.turn-me-into-datepicker {
    margin: 10px 0;
}

/*Leyenda datepicker*/
.dLlegenda{
    float: left;
    margin-left: 35px;
}


/*inici modificació calendari*/
/*.ui-datepicker-calendar a.ui-state-default{
    background:none !important;
    background-color: #4EE461 !important;
}*/

/*dies tancat i dies sense lloc*/
/*.ui-datepicker-calendar .ui-state-disabled,.ui-datepicker-calendar .ui-widget-content .ui-state-disabled,.ui-datepicker-calendar .ui-widget-header .ui-state-disabled{
    background-image: none !important;
    opacity: 1 !important;
}*/

/*dies tancat*/
/*.ui-datepicker-calendar .ui-state-default,.ui-datepicker-calendar .ui-widget-content .ui-state-default,.ui-datepicker-calendar .ui-widget-header .ui-state-default{
    background-image: none !important;
    background-color: #cccccc !important;
}*/

/*dia escollit*/
.ui-datepicker-calendar .ui-state-active{/*}, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active{*/
    background:none !important;
    background-color: #006DC6  !important;
    color: #FFF !important;
}
/*dia sense lloc*/
td.specialDay, table.ui-datepicker-calendar tbody td.specialDay span { 
    background:none !important;
    background-color: #EA9191 !important;
    color: #E2414F !important;
}

/*td.ui-datepicker-current-day a.ui-state-default{*/
/*Remarcar hoy*/
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight{
    background:none !important;
    background-color: #F7EAEC !important;
    color: #000 !important;
    border: 1px solid #000 !important;    
}


/*.ui-datepicker-today{
    background:none !important;
    background-color: yellow !important;
    color: blue !important;
}*/

/*fi modificació calendari*/

/*TIBIDABO*/
/*Para reservas y versión tibidabo (leyenda del calendario que visualiza calendario temporadas)*/
.llegendaTibidabo{
    display:none;
}

.tibiParc{
    background-color: #AADF98;
    border: 1px solid #CCCCCC;
    color: #000;
    float: left;
    height: 14px;
    margin-left: 2px;
    height: 47px;
    margin-right: 2px;
    padding: 4px;
    width: 96px;
    font-weight: bold;
}

.tibiCamiCel{
    background-color: #A4D7FE;
    border: 1px solid #CCCCCC;
    color: #000;
    float: left;
    height: 14px;
    margin-left: 2px;
    margin-right: 2px;
    padding: 4px;
    height: 47px;
    width: 100px;
    font-weight: bold;
}

/*dia sense lloc*/
table.ui-datepicker-calendar tbody td.tibiObert span, .ui-datepicker td.tibiObert a { 
    background:none !important;
    background-color: #AADF98 !important;
    color: #000 !important;
}

/*dia sense lloc*/
table.ui-datepicker-calendar tbody td.tibiCel span, .ui-datepicker td.tibiCel a { 
    background:none !important;
    background-color: #A4D7FE !important;
    color: #000 !important;
}
/*FI TIBIDABO*/



/*Leyenda datepicker, disponible*/
.llegendaDisponible{
    background-color: #f6f6f6;
    border: 1px solid #CCCCCC;
    color: #565655;
    float: left;
    height: 14px;
    margin-left: 5px;
    margin-right: 2px;
    padding: 4px;
    font-weight: bold;
    width: 85px;    
    display:none; /*para tibidabo*/
}

/*Leyenda datepicker, no disponible*/
.llegendaNoDisponible{
    background-color: #EA9191;
    border: 1px solid #CCCCCC;
    color: #E2414F;
    float: left;
    height: 14px;
    margin-left: 2px;
    margin-right: 2px;
    padding: 4px;
    width: 85px;
    font-weight: bold;
    opacity: 0.5;    
}

/*Leyenda datepicker, museo cerrado*/
.llegendaTancat{
    background-color: #0a0a0a;
    border: 1px solid #CCCCCC;
    color: #fff;
    float: left;
    height: 14px;
    margin-left: 2px;
    margin-right: 2px;
    padding: 4px;
    width: 85px;
    font-weight: bold;
    opacity: 0.5;
}

.dDataVisita{/*Estilo div que muestra la fecha de la visita en activitats.jsp*/
    float: right;
    margin-right: 40px;
}

/*popup de más información (listado actividades)*/
.bubbleInfo {
    cursor:pointer;
    padding-left:5px;
    text-decoration:underline;
    color:#AF2626;
}

.bubbleInfo:hover {
    text-decoration:none;
}

/*popup de más información (listado artículos)*/
.bubbleInfoArtic {
    cursor:pointer;
    padding-left:5px;
    text-decoration:underline;
    color:#AF2626;
}

.bubbleInfoArtic:hover {
    text-decoration:none;
}

.infoPopup {
     display: none;
}

/*Carrito info simplificada*/
.titleCarritoInfo{
    background-color: #666666;
    color: #FFFFFF;
    font-weight: bold;
}

div.colCarritoInfo{
    color: #A3A3A3;
    background-color: #ECEAEB;
    font-weight: bold;
    text-align: center;
    padding-bottom: 0.3em;
    padding-top: 0.3em;
    float:left;
    width:90px;
    margin-right:2px;
    margin-top:2px;
}

/*formulario identificació reserves i numerades (identificacio.jsp)*/
.formIdentificacio, .formIdentAbono{
    display: block;    
    font-size: 14px;
}

.changePassForm{
    display: block;    
    font-size: 15px;
}

/*formulario identificació reserves i numerades input largo*/
.formIdentificacio input, .formIdentAbono input, .changePassForm input{
    width: 180px;
}

.formIdentificacio label, .formIdentAbono label, .changePassForm label{
    float: left;
    padding-top: 5px;
    position: relative;
    width: 120px;
}

.formIdentificacio #divLocalit {
    /*display: none;*/
}

#formDades .inputOblig, #formAlta .inputOblig, #formDadesCamps .inputOblig, #formDonacio .inputOblig{
    border-color: #BC4A4A;
    background-color: #E2E2E2;
}

/*formulario (carritoActivitas.jsp)*/
#formDades, #formAlta, #formCarrito, #formDonacio{
    display: block;    
    font-size: 15px;
    margin-top:10px;
    margin-left:10px;
}

#formDades input, #formAlta input, #formCarrito input, #formDonacio input{
    width: 150px;
}

#formDades select, #formAlta select, #formCarrito select, #formDonacio select{
    width: 150px;
}

#formDades .formCasal input,#formDades .formDadesCampsAbon input{
    width: auto !important;
}



#formDades .check, #formAlta .check, #formCarrito .check, #formDonacio .check{
    width: 10px;
    margin-top:10px;
    margin-bottom:10px;
}

#formDades label, #formAlta label, #formCarrito label, #formDonacio label{
    float: left;
    padding-top: 5px;
    position: relative;
    width: 175px;
    font-weight:400 !important;
}

/*formulario identificación (reservas), campo obligatorio*/
#formDadesCamps .oblig, #formDades .oblig{
    font-weight: bold !important;
}

/*formulario identificación (reservas), input largo*/
#formDadesCamps .iLlarg{
    width: 200px;
}

/*Enquestas para KUTXA en cursos y casales*/
#divEnquesta{
    border: 1px solid #666666;
    display: none;
    margin: 10px;
    padding: 10px;   
}

/*Div formulario de enviar regalo (carritoActivitas.jsp)*/
#divRegal,#divFactura{
    border: 1px solid #666666;
    display: none;
    margin: 10px;
    padding: 10px;   
}

/*Div formulario de enviar regalo, título*/
#divRegal #regalTitle, #divEnquesta .enquestaTitle,#divFactura #facturaTitle{
    background-color: #FFFFFF;
    color: #EB8F00;
    font-size: 12px;
    font-weight: bold;
    margin-bottom: 10px;
    padding: 4px;  
}

.enquestaCurs{
    border-bottom: 2px solid #44b1b6 !important;
    font-weight: bold;
    font-style: italic;
    color: #44b1b6;
    margin-bottom: 10px;
}

#divEnquesta .panel{
    margin-bottom: 0px !important;
}

#divEnquesta label{
    float: none !important;
    vertical-align: top;
}

/* iCheck plugin Square skin, red
----------------------------------- */
#divEnquesta .icheckbox_square-red,
#divEnquesta .iradio_square-red {
    display: inline-block;
    vertical-align: middle;
    margin: 0;
    padding: 0;
    width: 22px;
    height: 22px;
    background: url(images/red.png) no-repeat;
    border: none;
    cursor: pointer;
}

#planaQuestionari #tabDades{
   /* color: white !important;
    padding-left: 10px !important;*/
}

.skin-section span {
    padding-left: 10px;
    cursor: pointer;
}

.skin-section {
    line-height: 18px;
}

.skin-section label{
    padding-left: 10px;
    /*font-weight:bold;*/
    cursor:pointer;
}

.skin dd {
    color: #444;
}

#divEnquesta .panel-title{
   font-size:14px; 
}

#divEnquesta .icheckbox_square-red {
    background-position: 0 0;
}
#divEnquesta .icheckbox_square-red.hover {
    background-position: -24px 0;
}
#divEnquesta .icheckbox_square-red.checked {
    background-position: -48px 0;
}
#divEnquesta .icheckbox_square-red.disabled {
    background-position: -72px 0;
    cursor: default;
}
#divEnquesta .icheckbox_square-red.checked.disabled {
    background-position: -96px 0;
}

#divEnquesta .iradio_square-red {
    background-position: -120px 0;
}
#divEnquesta .iradio_square-red.hover {
    background-position: -144px 0;
}
#divEnquesta .iradio_square-red.checked {
    background-position: -168px 0;
}
#divEnquesta .iradio_square-red.disabled {
    background-position: -192px 0;
    cursor: default;
}
#divEnquesta .iradio_square-red.checked.disabled {
    background-position: -216px 0;
}

.cursorP{/*Cursor de algun div e imágenes*/
    cursor:pointer;
}

/*Comprobante pago*/
.spanPrincipalPagam{
    background-color: #F8F8F8;
    color: #A3A3A3;
    font-size: 14px;
    border:1px solid #ccc;
    float:left;
    padding:5px;
    width:100%;
    position:relative;
    margin-top:5px;
}


/*Comprobante pago*/
.spanPrincipalPagamSeparador{
    color: #A3A3A3;
    font-size: 14px;
    border-bottom:1px solid #ccc;
    float:left;
    padding:5px;
    width:99%;
    position:relative;
    margin-top:5px;
}

.spanEtiquetaPagam{
    width:150px;
    float:left;
}

.spanValPagam{
    /*width:250px;*/
    color:#A77C91;
    float:left;
}

.divComprCodis{
    top: 5px;
    position: absolute;
    right: 10px;
}

#divCorrecte{
    position:relative;
}

.textPdf{
    text-decoration: underline;
    cursor:pointer;
}

#inputPrint{
    color:red;
}

/*Comprobante código de barras*/
#codiBarres{
    text-align: center;
    padding-top:24px;
}

#qrcodeholder{
    text-align: center;
    display:table;
    margin: 0 auto;
    
}

/*Rserva anul.lada (pasarela_virtual_CI_dev_OK.jsp*/
#reservaAnulada{
    color: red;
    font-size: 20px;
    font-weight: bold;
    position: absolute;
    right: 30px;
    top: 50%;    
}

/*NO TOCAR*/
#submitHorariSS{
    display:none;
}

.uppydownerbutton {
    border: 1px solid #EB8F00;
    background-color: #EB8F00;
    color: Black;
    padding: 3px 12px;
    margin: -1px;
    font-weight: bold;
    position: relative;
    top: 0px;
    cursor: pointer;
}

.uppydowner {
    text-align: center;
}

/*BSM-GAUDIR*/

div.planaGaudir {/*div que contiene el contenido de la página*/
    background-color: white;
    color: #595959;
    margin: 0 auto;
    width: 780px;
}

#textIntroGaudir {/*estilo del div que muestra texto informativo*/
    height: 12px;
    background-position: 10px center;
    color: rgb(129,129,129);
    margin: 5px 0 0 0;
    padding: 10px 10px 10px 10px;
    position: relative;    
    height:auto;
}

#textIntroGaudir .avisTitle{
    font-weight:bold;
    padding-bottom:4px;    
}

#nouMembres h3{
    color: #BC4A4A;
}

.divBeneficiari{
    height:140px;
    border: 1px solid #ccc;
    padding: 10px 20px 10px 20px;
    margin-top:10px;
}

.divBeneficiari input{
    text-align: left !important;
}

#selectTarifes input ,#formDisponib input{
	padding: .375rem .75rem;
	line-height: 1.5;
	color: #495057;
	background-color: #fff;
	background-clip: padding-box;
	border: 1px solid #ced4da;
	border-radius: .25rem;
	transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;	
	height: 38px;	
}

#formDisponib .diaSetm{
	height: 100%;/*evitamos que tenga height del input (38px)*/
}

#infoEditar input{
	padding: .375rem .75rem;
	line-height: 1.5;
	color: #495057;
	background-color: #fff;
	background-clip: padding-box;
	border: 1px solid #ced4da;
	border-radius: .25rem;
	transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;	
	height: 28px;	
	margin-bottom: 4px !important;
}

#divEnquesta input {
    outline: 0 !important;
    width: 100% !important;
    margin: 0 0 5px !important;
    padding: 10px !important;
    box-sizing: border-box !important;
    font-size: 14px !important;
    width: auto !important;

}

.divBeneficiari div.t_cos {
    height:22px;
}

.i_numBenef{/*Estilo select/option que contine en número de personas de las tarifas (activitats.jsp)*/
    width:50px !important;
}

.i_codiMembre{/*no visible los codigos*/
    display:none;
}

.bAnular{
    padding-left:100px;
    float:left;
}

#spanRecPass{
    text-decoration:underline;
    font-size:10px;
    cursor:pointer;
    color:#BC4A4A;
}

#spanRecPass:hover{
    text-decoration:none;
}

.resumDades{
    width:110px;
    float:left;
}

.resumDades0{
    width:130px;
    float:left;
}

#accordion .resumDades0, #infoCarrito .resumDades0{
    font-style:italic;
}

#infoDadesAmic .cursResumDades0{
    font-style:italic;
}

.cursResumDades0{
    width:140px;
    float:left;
}

#infoDadesAmic .cursResumDades0{
    font-style:italic;
}

.resumDiv{
    line-height:20px;
}

.cursResumDades{
    width:215px;
    float:left;
}

.cursResumDiv{
    line-height:20px;
    clear:both;
}

.titleCursDades,.titleAmicsDades{
    margin-bottom: 10px;
    margin-top: 10px;
    padding: 4px;  
    border-bottom: 1px solid #CCCCCC;
    font-weight: 500;
    font-size: 14px;
    background: #f6f6f6;
    border-radius: 5px 5px 0 0 !important;
    border-bottom: 1px solid #DADADA;
    padding: 18px;
    position: relative;
    text-transform: uppercase;
}

.titleAbonamDades{
    margin-bottom: 10px;
    margin-top: 10px;
    border-bottom: 1px solid #CCCCCC;
    font-weight: 500;
    font-size: 14px;
    background: #f6f6f6;
    border-radius: 5px 5px 0 0 !important;
    border-bottom: 1px solid #DADADA;
    position: relative;
    text-transform: uppercase;
}

#planGaztedi{
    margin-left:5px;
    margin-top:5px;
}

/*DONACIONS AMICS*/
div.separadorDonacio {
    background-color: #fff;
    border-bottom: 1px solid #E18D8D;
    border-top: 1px solid #E18D8D;
    color: #BC4A4A;
    display: table;
    font-weight: bold;
    padding: 10px 15px 10px 0;
    position: relative;
    width: 100%;
    font-size: 20px;
    text-align:center;
}

#separadorDonacio .col1 {
    color: #bc4a4a;
    vertical-align: middle;
    padding-right:15px;
}
#separadorDonacio .col2 {
    vertical-align: middle;
}

#inputPagDonacio .ui-spinner::before {
    content: "€";
    padding-top: 3px;
    position: absolute;
    right: 0;
    top: 0;
    width: 50px;
}

#inputPagDonacio input{
    width:60px;
}


@media screen and (max-width: 600px) {
    div.plana {/*div que contiene el contenido de la página*/
        background-color: white;
        color: #595959;
        /*height: 240px;*/
        margin: 0 auto;
        width: 100%;
    } 
    .capsalera{/*imatges peu i capçalera*/
        width: 100%;
        height:auto !important;
        margin-right:auto;
        margin-left:auto;
    }

    .spanPrincipalPagam{
        width: 96% !important; 
    }
    
    #codiBarres {
        text-align: center;
    }    
    
    #gridActivitats, #gridArticles, #gridIdentif{
        width: 100% !important;
    }
    #gridDisponib{
        width: 100% !important;
    }    

    .tabInfo{ /*no mostrem info de nº d'activitats sel. (tab activitats) #infoActiv*/
        display:none;
    }
    
    .ui-accordion .ui-accordion-content {/*taula*/
        border-top: 0 none;
        overflow: auto;
        padding: 1px 1px;
    }

    #accordion, #accordionCarrito, #accordionDades, #accordionResultat, #accordionQuest {
        margin: 3px;
    }    
   
    #gridActivitats, #gridArticles, #gridIdentif {
        padding: 2px 2px 2px;
        text-align: center;
        margin-top:5px;
    }
    
    #gridDisponib {
        padding: 2px 2px 2px;
        text-align: center;
    }
 
    .dataTables_info {/*nº elements taula i paginació*/
        float: inherit;
        width: 100%;
    } 
    
    /*part tarifes*/
    div.t_header{ 
        color: #A3A3A3;
        background-color: #ECEAEB;
        font-size: 12px;
        font-weight: bold;
        text-align: center;
        padding-bottom: 0.3em;
        padding-top: 0.3em;
        float:left;
        width:150px;
        margin-right:2px;    
    }
    
    div.t_header1 {
        width: 110px !important;
    }
    
    div.t_cos {
        float: left;
        font-size: 12px;
        font-weight: bold;
        margin-right: 2px;
        padding-bottom: 0.3em;
        text-align: center;
        width: 150px;
    }
    
    div.t_cos1 {
        width: 110px !important;
    }
    
    .ui-accordion .ui-accordion-content {
        border-top: 0 none;
        overflow: auto;
        padding: 10px 5px !important;
    }
    #barraCookie{
        width:90%;
        font-size:9px;
    }    
}
@media screen and (max-width: 400px) {
    div.plana {/*div que contiene el contenido de la página*/
        background-color: white;
        color: #595959;
        /*height: 240px;*/
        margin: 0 auto;
        width: 100%;
    } 
    
    .capsalera{/*imatges peu i capçalera*/
        width: 100%;
        height:auto !important;
        margin-right:auto;
        margin-left:auto;
    }

    .spanPrincipalPagam{
        width: 96% !important; 
    }
    
    #codiBarres {
        text-align: center;
    }    
   
    .tabInfo{ /*no mostrem info de nº d'activitats sel. (tab activitats) #infoActiv*/
        display:none;
    }
    
    .ui-accordion .ui-accordion-content {/*taula*/
        border-top: 0 none;
        overflow: auto;
        padding: 1px 1px;
    }

    #accordion, #accordionCarrito, #accordionDades, #accordionResultat, #accordionQuest {
        margin: 3px;
    }

    .dataTables_info {/*nº elements taula i paginació*/
        float: inherit;
        width: 100%;
    } 
    
    /*part tarifes*/
    div.t_header{ 
        color: #A3A3A3;
        background-color: #ECEAEB;
        font-size: 12px;
        font-weight: bold;
        text-align: center;
        padding-bottom: 0.3em;
        padding-top: 0.3em;
        float:left;
        width:100px;
        margin-right:2px;    
    }
    
    div.t_header1 {
        width: 110px !important;
    }
    
    div.t_cos {
        background-color: #F8F8F8;
        float: left;
        font-size: 12px;
        font-weight: bold;
        margin-right: 2px;
        padding-bottom: 0.3em;
        text-align: center;
        width: 100px;
    }
    
    div.t_cos1 {
        width: 110px !important;
    }
    
    .ui-accordion .ui-accordion-content {
        border-top: 0 none;
        overflow: auto;
        padding: 10px 5px !important;
    }

    #barraCookie{
        width:90%;
        font-size:9px;
    }
   
}