@import url("https://fonts.googleapis.com/css?family=Montserrat:400,700");
@import url("https://fonts.googleapis.com/css?family=Open+Sans:400,600,700,800");
/*
 * CSS EURO MUS WEB VENTAS
 *
*/
/* Andorra */
/* amagar primer cechk de LOPD nomérs per el THYSSEN

#checkSLOPD1{
	display:none;
}*/

/*Para modificar la imagen del listado MACBA
@media (min-width: 1200px) {
    #lista_actividades .imagen,#modalCombiCicles .imagen{
        width: 30% !important;
    }
    #lista_actividades .info,#lista_actividades .noinfo,#modalCombiCicles .info,#modalCombiCicles .noinfo{
        width: 11.66% !important;
    }    
}
*/

/*borrar compartir de las actividades (primera parte) y deja sólo info
.fa-share-alt{
    display:none !important;
}*/

/*Pesca
#includeHeader img {
  max-width: none;
  width:100%;
}*/

/*TIBI no vol mostrar horari als resums*/ 
/*.desglose-acti .hora ,.compra-acti .hora{
	visibility: hidden;
}*/


/*Desactivar botó continuar comprant comprovant final Park Güell*/
#inputPrint{
	display:none;
}

/*SECCIO COOKIES*/
.popupBarraCookie{
    position:fixed;
    top:0;
    left:0;
    rigth:0;
    bottom:0;
    background-color:rgba(0,0,0,.7);
    width:100%;
    height:100%;
    z-index:9999;
}

.popupBarraCookie a {
    color: #9fc5dd !important;
}

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

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

.popupBarraCookie .elemBarraCookie3{
    text-align: right;
}

.popupBarraCookie button {
    margin-left: 20px;
    background-color: #1679bf;
    border: 2px solid #1679bf;
    border-radius: 5px;
    margin-top: 5px;
    padding: 8px;
}
/*FI SECCIO COOKIES*/



.checkbox input[type=checkbox], .checkbox-inline input[type=checkbox], .radio input[type=radio], .radio-inline input[type=radio]{
    width: 18px;
    height: 18px;
    border-radius: 100px;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    -ms-transition: all .5s ease;
    transition: all .5s ease;
    cursor: pointer;
    position: absolute;
    top: 0px;
    z-index: 1;
}

/*SECCIO LOPD*/
#divLopd{
    border:1px solid #ccc;
}

#dadesAvisInfoLOPD1 {
	right: 25% !important;
    top: 0px !important;
    z-index: 1000;
}

#dadesAvisInfoLOPD2 {
	right: 24% !important;
    top: 30px !important;
    z-index: 1000;
}

#dadesAvisInfoLOPD3 {
	right: 4% !important;
    top: 70px !important;
    z-index: 1000;
}
    
#dadesAvisInfoLOPD4 {
	right: 30% !important;
    top: 150px !important;
    z-index: 1000;
}

#checkLOPD1Div,#checkLOPD2Div,#checkLOPD3Div,#checkLOPD4Div{
        margin-left:10px;
        margin-top:10px;
}    

/*FI SECCIO LOPD*/

.name_ok {
    display: inline-block;
    margin-top: 5px;
    margin-bottom: 0px;
    font-size: 16px;
}

.divSala{
  padding:0 5px 0 5px;
  text-overflow:ellipsis;
  white-space:nowrap; 
  overflow:hidden; 
}
    
html {
  height: 100%;
  font-size: 100%;
}
body {
  color: #333;
  background: #FFF;
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  font-size: 100%;
  padding: 0px;
  margin: 0px;
  min-height: 100%;
  position: relative;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

.modalbox a:link,
.modalbox a:visited {
    text-decoration: none;
    outline: none;
    color: #3183b6;
}

.icon-graphics_cross{
    cursor:pointer;    
}

.modalbox a:hover{
    color:#77a1a3;
}

a:link,
a:visited {
  text-decoration: none;
  outline: none;
  color: #2e2e32;
}
a:hover,
a:active {
  outline: none;
  text-decoration: none;
  color: #999999;
}
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  font-family: "Open Sans", Helvetica, Arial, sans-serif !important;
  color: #424856;
  margin: 0;
}
h1{
	font-size:18px;
}
h3{
	font-size:16px;
	font-weight:bold;
}
p {
  font-size: 0.875em;
}
hr {
  margin-top: 10px;
  margin-bottom: 10px;
}

img {
  max-width: 100%;
  width:100%;
}

::selection {
  background: #fff7dd;
}
::-moz-selection {
  background: #fff7dd;
}

header {
  z-index: 200;
  width: 100%;
  margin-right: 0;
  margin-bottom: 30px;
}


.redesSocialesPieImg{
    text-align:right;
}

.redesSocialesPieImg img{
    width: auto !important;
    padding-bottom:4px;
}

.redesSocialesPie{
    padding-top:25px;
    padding-left:20px;
    text-align:center;
}

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

.button_next,.button_next_disabled, .button_recup,.button_general{
    margin-left:20px !important;
    background-color:#1679bf !important;
    color:#fff;
    height:75px !important;
    float:right !important;
    width:30%;
    max-width:100% !important;
    max-height:100% !important;
    cursor:pointer;
    border:none !important;    
    border-radius:0px;
    margin-bottom:10px;
    margin-top:10px;
}

.button_next:hover, .button_recup:hover{
    opacity:0.6 !important;
}

.button_next span,.button_next_disabled span, .button_recup span{
    padding:0px !important;
}

.button_bescanvi{
    background-color:#1679bf !important;
    max-width:100% !important;
    max-height:100% !important;
    border-radius:25px !important;
    padding:4px 20px !important;
    color:#fff;
    cursor:pointer;
    border:none !important;
}

.button_general_sug{
    margin-left:20px !important;
    background-color:#1679bf !important;
    height:75px !important;
    border:none !important;
    max-width:100% !important;
    max-height:100% !important;
    border-radius:0px;
    cursor:pointer;
    margin-top:10px;
	color:#fff;
    width:90% !important;
}

.button_general:hover,.button_general_sug:hover,.button_bescanvi:hover{
    opacity:0.6 !important;
}

.divSuggeriment{
    padding-top:5px;
    padding-bottom:5px;
}

#modal-window-cookies{
    font-size: 0.875em;
    text-align:justify;
}

#modal-window-cookies .a{
    color: #9fc5dd !important;
}

#modal-window-cookies:hover {
	text-decoration: underline;
}

#modal-window-sugerencia h1{
    border-bottom: 1px solid #999;
}

.button_suggerencia-carito,#buttonConfirmarCookie{
    margin-left:10px !important;
    background-color:#1679bf !important;
    height:70px !important;
    width:100% !important;
    max-width:100% !important;
    max-height:100% !important;
    cursor:pointer;
    border:none !important;
    border-radius:0px;
    margin-top:20px;
    color:#fff;
}

.button_general span, .button_general_sug span,.button_suggerencia-carito span,.button_bescanvi span{
    padding:0px !important;
}

.button_general:hover, .button_general_sug:hover,.button_suggerencia-carito:hover{
    opacity: 0.6 !important
}

.button_preview{
    margin-left:10px !important;
    background-color:#1679bf !important;
    padding: 15px;
    border: 1px solid #ccc !important;
    margin-bottom: 40px !important;
    font-size:18px !important;
    text-align:center;
    color:#fff;
    cursor: pointer;
}

.button_preview:hover,.imprimir:hover,.button_promocion:hover{
    opacity:0.6 !important;
}

#buttonConfirmCombiCicle[readonly]{
    background-color: #ccc !important;
    color: #fff !important;
    opacity: 0.6;
}

.inputRO[readonly]{
    background-color: #ccc !important;
    color: #fff !important;
    opacity: 0.6;
}

.imprimir{
    /*background-color:#1679bf;
    color:#fff;*/
    display:none;/*no visible boton*/
}

/*FI SECCIO BUTTONS*/




.iSugerencia{
    width:320px;
}

/*Ciclo sin plaza en la sección actividades*/
.sinPlaza{
    color:#ccc;
    cursor: default;
}

/*Ciclo con plaza en la seccion combinadas de ciclos*/
.conPlaza{
    cursor: pointer;
}

/** Puntos suspensivos. Situando esto en un div muestra los puntos suspensivos en caso
de haber desbordamiento del texto**/
.p_suspensivos{
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.main-content-wrapper{
  width: 80%;
  margin-right:auto;
  margin-left:auto;
}

.divInputLlistaNegre{
    color: red;
    display:none;
    
    margin-right: -15px;
    background-color:#f4f4f4;
    padding:10px;
    border:1px solid #DDD;
    font-size:12px;    
}

#divInputPlanGaz{
    margin-bottom: 40px;
    margin-right: 5%;
    margin-left: 5%;
}

.navbar-header button{
    display:none;
}

 
/************ COOKIE *****************/
#barraCookie{
    background-color:#333;
    opacity:0.97;
    padding:20px 50px;
    position: fixed;
    top:10px;
    color:#fff;
    width:100%;
    text-align: justify;
}

/*********** LOADING ***********/
 .modalscreen{/*fons carrega (gris)*/
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0.8;
    background-color: #333;
    height: 100%;
    width: 100%;
    z-index: 1000;
}

.loading {
    display:block;/*inicialmente cargado para que se visualice correctamente*/
    position:fixed;
    z-index: 100000;
    top: 35%;
    left: 47%;
    height: 110px;
    width: 110px;
    background: rgba(255, 255, 255, 1)
    url('../images/loading.gif') 50% 50% no-repeat;
    box-shadow: 1px 1px 6px 2px #ccc;
    border-radius:50%;
}

.loadingComprov {
    display:    none;
    position:   fixed;
    z-index:    100000;
    top: 35%;
    left: 26%;
    width: 50%;
    padding:10px 10px 65px 10px;
    box-shadow: 1px 1px 6px 2px #ccc;
    background: #777;
    text-align: center;
}

.loadingComprov div{
    position: relative;
    right: 30px;
}

.loadingComprov span{
	font-size: 15px;
    color: #fff;
}

.loadingComprovImg {
    position:   fixed;
    z-index:    100000;
    height: 55px;
    width: 55px;
    background: #777
    url('../images/loadingOK.gif') 
    50% 50% 
    no-repeat;
    box-shadow: 1px 1px 6px 2px #ccc;
    border-radius:50%;
}

.loaderBarra {
    display:    none;
    position:   relative;
    z-index:    100000;
    height: 16px;
    width: 100%;
    background: rgba(255,255,255,1)
    url('../images/ajax-loader.gif') 
    50% 50% 
    no-repeat;
    margin-top: 20px;
}

.loading span{
	position: absolute;
	top: 15%;
	font-size: 40px;
	left: 36%;
	color: #666;
}

.loadingTBAI span{
	position: absolute;
	top: 15%;
	font-size: 40px;
	left: 0%;
	color: #666;
}


/*********** CALENDARIO ****************
la mayoria de los css están en clndr.css
 *****************************************/
#diaDatapicker{
    padding-left: 5px;
    font-size: 18px !important;
    font-weight: 600;
}

.divDiaDatepicker{
    border: 1px solid #ccc;
    height: 40px;
    margin-left: auto;
    margin-right: auto;
    font-size: 22px;
    padding:2px 10px;
}


.divDiaDatepicker .icon2{/*icono papelera para el día elegido en actividades*/
    padding-left:5px;
    padding-right:5px;
    float:right;
    cursor:pointer;
    color:#1679bf;
    padding-top: 5px;
    font-size:20px;
    cursor:pointer;
}
.divDiaDatepicker .icon2:hover{
    opacity:0.6 !important;
}

.divDiaDatepicker div{
    margin-left: auto;
    margin-right: auto;
    margin-top: 5px;
    width: 100%;
}

.cal_act{
    margin-bottom:0px;
}

.cal_act .fecha_ppal{
    display:none;
}
#calendarSessions{
    width:40%;
    margin:auto;
}

.leyend_calSession{
    display:none;
}
@media (max-width: 980px) {
    .cal_act .fecha_ppal{
        display:block;
    }
    #calendarSessions{
        width:80%;
        margin:auto;
    }
}


/*********** BREADSCRUMB ****************
*****************************************/
.breadscrubm{
    height:50px;
    background-color:#f4f4f4;
    border-radius:25px;
    margin:auto;
    margin-bottom:30px;
}

.breadscrubm div{
    display:inline-flex;
    padding:0px;
}

.breadscrubm .position{
    background-color: #eee;
    width: 50px;
    border-radius: 50%;
    height: 50px;
    margin-right:10px;
    min-width:50px;
    cursor:auto !important;
}
.breadscrubm .check{
    background-color: #1679bf !important;
}
	
.breadscrubm .num{
	font-weight: bold;
	position: relative;
	top: 12px;
	padding-left: 20px;
	color:#fff;
}

.breadscrubm p{
	position: relative;
	top: 14px;
	font-size: 16px;
	margin-right:25px;
	color:#ccc;
}
.breadscrubm .texto span{
    margin-right: 10px;
    font-size:22px;
    margin-left:10px;
    padding-top: 10px;
}

.breadscrubm .texto{
    margin:auto;
    margin-left:0px;
    color:#ccc;
}

.breadscrubm .textPaso{
    width:250px;
    padding-top:4px !important;
}

.breadscrubm .active:hover{
    color:#1679bf !important;
    cursor:pointer;
}

.breadscrubm .activoTexto{
    color:#1679bf !important;
}

.breadscrubm .desactivoTexto{
    color:#ccc !important;
}


@media (max-width: 992px) { 
    .breadscrubm{
        display:none;
    }
}


/*********** CARRITO COMPRA ****************
*****************************************/
.car-shopping{
  width: 225px;
  height: 70px;
  float: right;
  margin-right: 10%;
  position: relative;
  top: -70px;
  cursor:pointer;
}
.fixedCar{
  position:fixed !important;
  top:0 !important;
  z-index:1000 !important;
  right:0 !important;
  opacity:0.85;
}

.fixedCar:hover{
    opacity:1;
}

.precio-car{
    font-size:30px;
    float:left;
    width:80%;
    height:100%;
    background-color:#EFEFEF;
    border-bottom: 1px solid #ddd;
}

.precio-car:hover, .precio-car span:hover{
  color:#1679bf !important;
}

.precio-car .car{
    font-size: 36px;
    position: absolute;
    top: 27px;
    left: 10px;
}

.precio-car .totalCar{
    font-size: 28px;
    position: absolute;
    top: 34px;
    left: 60px;
}
.precio-car .total-titulo{
    font-size: 16px;
    position: absolute;
    top: 22px;
    left: 60px;
}
.despliegue-car-shopping{
    padding: 25px 10px;
    float:right;
    background-color:#9fc5dd;
    width:20%;
    height:100%;
}
.despliegue-car-shopping:hover{
    color:#fff !important;
}

.desglose-car{
    float: right;
    position: absolute;
    cursor: pointer;
    background-color: #EFEFEF;
    width: 500px;
    right: 0px;
    top: 65px;
    display:none;
    z-index: 10;
    box-shadow: 1px 1px 2px 1px #ccc;
}
.desglose-car .linea{
    width:100%;
    min-height:60px;
    border-bottom:2px solid #ddd;
    display: flex;
}

.desglose-car .linea-hora{
    width:100%;
    min-height:30px;
    border-bottom:2px solid #ddd;
}

.desglose-car .linea-mult{
	width:100%;
	min-height:60px;
	border-bottom:1px dashed #ddd;
}
.desglose-car span.icon{
    float: right;
    min-height: 58px;
    padding: 20px 12px;
    font-size: 20px;
}

.desglose-car span.title{
    font-size: 18px;
    font-weight:600;
}

.desglose-car span.descrip{
    background-color: #f5f5f5 !important;
    font-size: 14px;
}

.volverCarrito{
    font-size: 12px;
    top: 2px;
    position: absolute;
    left: 35px;
    color: #fff;
}

@media (max-width: 750px) {
    .desglose-car{
        width:300px !important;
    }
}
 
@media (min-width: 751px) and (max-width: 992px) { 
    .desglose-car{
        width:400px !important;
    }
}
 
 /*identificación de cliente en la sección del fomulario  de datos*/
#formDadesClient, #formDadesFactura{
     border: 1px solid #ccc;
     padding: 5px;
     margin:25px;
     display:none;
}
 
/*si al formulari volem afegir la posibilitat d'afegir nom i dni de tots els asistents*/
/*divInfoAmicBenef: per tibi*/
#divAsistents, #divInfoAmicBenef{
     background-color: #f4f4f4;
     padding: 5px;
     margin:25px;
}

#divAsistents .textDivAsistents{
    padding-left: 22px;
}

#divInfoAmicBenef .divAmicBenef{
    padding:10px;
}

#infoImportFactura{
    background: #fff7dd;
    padding: 5px;
    font-style: italic;
    display:none;
    visibility:hidden;
}

/*********** Botón recuperar datos de facebook en el formulario ****************/
.fb-login-button{
    margin-bottom:30px !important;
    background-color: #4C69BA;
    background-image: linear-gradient(#4C69BA, #3B55A0);
    font-family: "Open Sans", Helvetica, Arial, sans-serif !important;
    text-shadow: 0 -1px 0 #354C8C;
    box-sizing: border-box;
    position: relative !important;
    margin: 0.2em;
    padding: 0 15px 0 46px !important;
    border: none !important;
    text-align: left !important;
    line-height: 34px !important;
    white-space: nowrap;
    border-radius: 0.2em;
    font-size: 16px !important;
    color: #FFF !important;
}

.fb-login-button:before {
    content: "";
    box-sizing: border-box;
    position: absolute;
    top: 0;
    left: 0;
    width: 34px;
    height: 100%;
    border-right: #364e92 1px solid;
    background: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/14082/icon_facebook.png') 6px 6px no-repeat;
}

.fb-login-button:hover,.fb-login-button:focus {
    outline: none;
    background-color: #5B7BD5;
    background-image: linear-gradient(#5B7BD5, #4864B1);
    box-shadow: inset 0 0 0 32px rgba(0,0,0,0.1);
}

/*********** TITULO PRINCIPAL ************/
.titulo-pagina{
    text-align:center;
    margin-bottom:30px;
    margin-top: 5px;
}

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


/*********** TEXTOS CENTRADOS ****************
*****************************************/

.info-centrada{
    text-align:center;
    margin-bottom:10px;
}

.avis-pagina{
    text-align: center;
    margin-bottom: 30px;
    margin-top: 5px;
    color: #5F88E9;;
    border-radius: 15px;
    background: #F4F4F4;
    display:none;
    padding: 10px 0px;
}

/************* ERRORES ******************
*****************************************/

.error-pagina, .error-bescanvi{
    text-align: center;
    margin: 0px 15px 10px 15px;
    color: #E95F5F;
    border-radius: 15px;
    background: #F4F4F4;
    display:none;
    padding: 10px 0px;
}

.iconError{
    display: none;
    position: relative;
    margin: 10px;
    left: 0px;
    top: 5px;
}


/*********** CONTROLES DE ACTIVIDADES ****************
*****************************************/
/** Controles de la página **/
#controls{
    height:50px;
    margin-bottom:20px;
}
#controls .controls-left{
    float: left;
    /* padding-top: 15px; */
    font-size: 36px;
    padding-left: 15px;
    cursor:pointer;
    margin-bottom: 18px;
}

#controls .controls-left span:hover{
    color:#828282;
}

#controls .controls-right-llistat, #controls .controls-right-tabla{
    float: right;
    /* padding-top: 15px; */
    font-size: 36px;
    padding-right: 15px;
}
#controls .controls-left .active{
    color:#1679bf;
}
#controls span{
	padding-right:30px;
}
#controls .left{
    cursor:pointer;
    margin-left:30px;
    background-color:#1679bf;
    border-radius:50%;
    font-size: 24px;
    padding: 10px 20px 10px 15px;
    color:white;
}
#controls .right{
    cursor:pointer;
    margin-left:30px;
    background-color:#1679bf;
    border-radius:50%;
    font-size: 24px;
    padding: 10px 15px 10px 20px;
    color:white;
}
#controls .right:hover{
    opacity:0.6;
}
#controls .left:hover{
    opacity:0.6;
}
.num_activ{
    font-size:14px;
}

@media (max-width: 750px) {
    #controls .right{
        display:none;
    }
    #controls .left{
        display:none;
    }
}

/*********** ACTIVIDADES ****************
*****************************************/
.actividades{
    margin:0px;
    margin-bottom:40px;
}

.actividadesCicle{
    margin:0px;
    margin-bottom:40px;
}

.titleActiv{
    font-size:16px;
    font-weight:600;
}

.titleActivCicle{
    font-size:16px;
    font-weight:600;
    font-style:italic;
}

.edadActiv{
    font-size:12px;
}

/**Leyenda debajo de las actividades*/
.leyenda-actividad, .leyenda-grup{
    height:90px;
    background:#EFEFEF;
    width:80%;
    float:left;
    margin-bottom:40px;
    padding: 5px;
    cursor:pointer;
}

/* styles for '...' */
.leyenda-actividad .titleActiv, .leyenda-grup .titleActiv{
  overflow: hidden;
  position: relative;
  line-height: 1.2em;
  max-height: 2.4em;
  text-align: right;/*si quitamos puntos suspensivos comentar*/
  text-align:center;
}
/* create the ... */
/*si quitamos puntos suspensivos comentar*/
.leyenda-actividad .titleActiv:before, .leyenda-grup .titleActiv:before {
  content: '...';
  position: absolute;
  right: 0;
  bottom: 0;
}
/* hide ... if we have text, which is less than or equal to max lines */
.leyenda-actividad .titleActiv:after, .leyenda-grup .titleActiv:after{
  content: '';
  position: absolute;
  right: 0;
  width: 1em;
  height: 1em;
  margin-top: 0.2em;
  background: #EFEFEF;
}

.leyenda-actividad:hover, .leyenda-grup:hover{
    color:#1679bf !important;
}

/** +Info */
.leyenda-info{
    height:90px;
    background:#F5F5F5;
    width:20%;
    float:right;
    color:#1679bf;
}

.leyenda-info a{
    position:relative;
    top:6px;
    font-size:12px;
    color:#1679bf;
}

.leyenda-info a:hover{
    color:#bbb !important;
}

.leyenda-info .fa-info-circle{
    font-size:2em;
}

.leyenda-noinfo .fa-info-circle{
    font-size:1.5em;
}

.leyenda-noinfo .fa-share-alt{
    font-size:1.5em;
}

.leyenda-info .share{
    font-size: 22px;
    padding-top:10px;
}


.leyenda-noinfo{
    height:90px;
    background:#F5F5F5;
    width:20%;
    float:right;
    cursor:default;
    color:#ccc;
}

.leyenda-noinfo span{
    position:relative;
    top:6px;
    color:#ddd;
    font-size:12px;
    cursor:default;
}
.hora-sesion-lista .leyenda-noinfo span{
    position:relative;
    top:5px;
}
.act_selected{
    font-size: 14px;
    top: 46%;
    left: -35px;
    position: relative;
}

#tabla_actividades .check, #tabla_grups .check{
    float: right;
    display: none;
    position: absolute;
    top: 0;
    color: #FFFFFF;
    width: 100%;
    height: 100%;
    background-color: #333;
    opacity: 0.9;
}

#tabla_actividades .check i{
    position: relative;
    top: 35%;
    font-size: 48px;
    left: 20%;
}

#tabla_grups .check i{
    position: relative;
    top: 35%;
    font-size: 48px;
    left: 15%;
}

#lista_actividades .check,#lista_actividadesCicle .check,#lista_grups .check,#modalCombiCicles .check {
    display: none;
    position: absolute;
    top: 0;
    color: #FEFFFF;
    background-color: #333 !important;
    width: 85%;
    opacity: 0.7;
    height: 100%;
    margin-left: 0px;
}

#lista_grups .check {
    width: 62%;
}

#lista_actividades .check i,#lista_actividadesCicle .check i,#lista_grups .check i,#modalCombiCicles .check i{
    position: relative;
    top: 25%;
    font-size: 36px;
}

.actividades .checkout{
    display:none;
}

.actividadesCicle .checkout{
    display:none;
}


#lista_actividades, #lista_actividadesCicle, #lista_grups{
    display:none;
    margin:0px;
}

#lista_actividades .imagen, #lista_actividadesCicle .imagen, #lista_grups .imagen,#modalCombiCicles .imagen{
    padding:0px;
}


#lista_actividades .titleActiv, #lista_actividadesCicle .titleActiv, #lista_actividadesCicle .titleActivCicle, #lista_grups .titleActiv,#modalCombiCicles .titleActiv{
    clear:both;
    font-weight:bold;
    font-size:13px;
    position:relative;
    top:10px;
}

#lista_actividades .edadActiv, #lista_actividadesCicle .textCicle, #lista_grups .edadActiv,#modalCombiCicles .edadActiv{
    clear:both;
    font-size:12px;
    position:relative;
    top:10px;
}

@media (min-width: 990px) {
    /*llistat activitats, cicle, última posició, columna parell (per mostrar el botó si té desplegable)*/
    .lst_acti_ucll{
        margin-bottom: 180px !important;
    }
}
.lst_acti{
    height:80px;
    background-color:#f4f4f4;
    margin:10px 0px;
    padding:0px;
}

.lst_acti img{
    height:80px !important;/*forzamos altura para que se vea mejor movil (aunq algo deformado pero al ser movil no se nota apenas)*/
    max-width:120px;
    padding:0px;
    float: left;
}

.lst_acti .info {
    padding-top:5px;
    height:80px;
    background:#f9f9f9;
    text-align:center;
    float:right;
}

#info-cicloCombi .info {
    padding-top:0px;
    height:80px;
    background:none;
    text-align:center;
}

.infoCombiCicle{
    float:left !important;
    width: 10% !important;
    top: 18% !important;
}

.lst_acti .info .fa-info-circle{
    font-size:2em;
}

.lst_acti .info .share{
    top: 8px !important;
    font-size: 22px;
    position: relative;
}

.lst_acti a{
    display:block;
    color:#1679bf;
    font-size:12px;
}

.lst_acti a:hover{
    color:#bbb !important;
}

.lst_acti .noinfo{
    padding-top:5px;
    height:80px;
    text-align:center;

    cursor:default;
    color:#ccc;
}

.lst_acti .noinfo span{
    display:block;
    color:#ccc;
    font-size:12px;
}
.lst_acti .noinfo .fa-info-circle{
    font-size:1.5em;
}

.lst_acti .noinfo .fa-share-alt{
    font-size:1.5em;
}

/*per la vista només cicles*/
.lst_cicle{
    height:80px;
    background-color:#f4f4f4;
    margin:10px 0px;
    padding:0px;
}
.lst_cicle img{
    height:80px !important;/*forzamos altura para que se vea mejor movil (aunq algo deformado pero al ser movil no se nota apenas)*/
    max-width:120px;
    padding:0px;
}

.lst_cicle .info {
    padding-top:5px;
    height:80px;
    background:#f9f9f9;
    text-align:center;
}

.lst_cicle .info .fa-info-circle{
    font-size:2em;
}

.lst_cicle .info .share{
    top: 8px !important;
    font-size: 22px;
    position: relative;
}

.lst_cicle a{
    display:block;
    color:#1679bf;
    font-size:12px;
}

.lst_cicle a:hover{
    color:#bbb !important;
}

.lst_cicle .noinfo{
    padding-top:5px;
    height:80px;
    text-align:center;

    cursor:default;
    color:#ccc;
}

.lst_cicle .noinfo span{
    display:block;
    color:#ccc;
    font-size:12px;
}
.lst_cicle .noinfo .fa-info-circle{
    font-size:1.5em;
}

.lst_cicle .noinfo .fa-share-alt{
    font-size:1.5em;
}

/*fi per la vista nomes cicles*/

.modal-social i{
    color: #fff;
    background-color: #1679bf;
    border-radius: 50%;
    width: 2em;
    height: 2em;
    position: relative;
    padding-top: 17px;
    cursor:pointer;
}

.modal-social i:hover{
    opacity:0.6 !important;
}

.show-ciclo-list:hover{
    color:#1679bf !important;
}

.info-ciclo-list{
    z-index: 1000;
    position: absolute;
    width: 100%;
    right: 0px;
    top: 101%;
    padding: 3px;
    background-color: #9FC5DD !important;
    overflow-y:auto;
    max-height:220px;
}

/* Estilos para motores Webkit y blink (Chrome, Safari, Opera... )*/

.info-ciclo-list::-webkit-scrollbar {
    -webkit-appearance: none;
}

.info-ciclo-list::-webkit-scrollbar:vertical {
    width:10px;
}

.info-ciclo-list::-webkit-scrollbar-button:increment,.info-ciclo-list::-webkit-scrollbar-button {
    display: none;
} 

.info-ciclo-list::-webkit-scrollbar:horizontal {
    height: 10px;
}

.info-ciclo-list::-webkit-scrollbar-thumb {
    background-color: #797979;
    border-radius: 20px;
    border: 2px solid #f1f2f3;
}

.info-ciclo-list::-webkit-scrollbar-track {
    border-radius: 10px;  
}








.info-ciclo-list .carrito{
    display: inline-block;
    font-size: 28px;
    float: right;
    height: 100%;
    background-color: #f4f4f4;
    width: 20%;
    padding-top:10px;
}

.info-ciclo-list .carrito span:hover{
    cursor:pointer;
}

.info-ciclo-list .titulo-sesion{
    font-weight:bold;
    font-size:12px;
}

.info-ciclo-list .fecha-sesion{
    font-size:12px;
}

.info-ciclo-list .info{
    width:15%;
    height:100%;
    padding-top: 7px;
}

.info-ciclo-list .leyenda-noinfo{
    width:15%;
    height:100%;
    padding-top: 0px;
    background:#F5F5F5;
    cursor:default;
}

.info-ciclo-list .ciclo{
    width:70%;
    padding-top: 4px;
    display:inline-block;
}

.hora-sesion-lista {
  height: 55px;
  width: 100%;
  background-color: #FCFCFC;
  border-bottom: 1px solid #DDD;
  display: inline-flex;
}

/** Efecto capa oscura **/
.grid figure {
	height:100%;
	width:100% !important;
}
.grid figure figcaption, .grid figure figcaption > a{
	height:100% !important;
}
.grid figure img{
	display:inline !important;
	height:100%;
	width:100%;
}
.grid figure p{
	display:block;
	font-size:56px !important;
}

/** efecto capa oscura en modo-lista **/
.modo-list{
     margin-bottom: 40px !important;
}
.modo-list figure img{
	display:inline !important;
	height:100%;
	width:100%;
}
.modo-list figure p{
	display:block;
	font-size:30px !important;
}
 
figure.effect-oscar figcaption {
	padding: 15% 0 !important;
	transition: background-color 0.35s;
}

figure .text_figure{
    font-size:14px;
    font-family:"Open Sans", Helvetica, Arial, sans-serif !important
}

figcaption{
    text-align:center;
}

figcaption .checkin, .checkout{
    position: relative;
    top: 20%;
}

/** Controlamos el efecto hover en smartphones **/
@media (max-width: 480px) { 
    .actividades .checkout{
        opacity:0 !important;
    }
    .actividadesCicle .checkout{
        opacity:0 !important;
    }    
    figure.effect-oscar:hover figcaption {
        background-color:rgba(0,0,0,0) !important;
    }    
    .checkin{
        display:none !important;
    }
    figure.effect-oscar:hover img {
        opacity:1 !important;
    }
    .modal-social i{
        font-size:20px !important;
        padding-top:10px !important;
    }
}

@media (min-width: 751px) and (max-width: 1281px) { 
	.titleActiv, .titleActivCicle{
		font-size:14px;
	}
}
 
/*********** CAROUSEL OWL (ACTIVITATS) ****************
******************************************************/
#tabla_actividades .owl-item > div img, #tabla_grups .owl-item > div img {
    display: block;
    width: 100%;
    height: auto;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    margin-bottom:4px;
}

#tabla_actividades .owl-item > div, #tabla_grups .owl-item > div {
    padding: 0px 2px;
    margin-right:4px;
}

.lazyOwlCompleta{
    cursor: auto !important;
    background-color: #333;
}

#tabla_actividades .lazyOwlCompleta p, #tabla_grups .lazyOwlCompleta p{
    position: absolute;
    top: 35%;
    color: #D34F4F;
    width: 100%;
}

#lista_actividades .lazyOwlCompleta p, #lista_actividadesCicle .lazyOwlCompleta p, #lista_grups .lazyOwlCompleta p{
    position: absolute;
    top: 20%;
    color: #D34F4F;
    width: 100%;
    max-width:120px;
}

#modalCombiCicles .lazyOwlCompleta p {
    position: absolute;
    top: 20%;
    color: #D34F4F;
    left: 5%;
    max-width:120px;
}

/*si hay muchos ciclos para que haya scroll*/
#combiCiclesModalDescription{
    overflow-y: scroll;
    height: 300px;
}

#lista_actividadesCicle .lazyOwlCompleta p {
    max-width:none;
}

#lista_actividades .lazyOwlCompleta .titleActiv, #lista_actividades .lazyOwlCompleta .edadActiv, #lista_actividadesCicle .lazyOwlCompleta .titleActiv, #lista_actividadesCicle .lazyOwlCompleta .edadActiv, #lista_grups .lazyOwlCompleta .titleActiv, #lista_grups .lazyOwlCompleta .edadActiv,#modalCombiCicles .lazyOwlCompleta .titleActiv{
    color:#ccc;
}

.lazyOwlCompleta .lazyOwl{
    opacity: 0.1;
    filter: alpha(opacity=40); /* For IE8 and earlier */
}
 
 
 
 /************************************
 ************** CICLOS ***************
 ************************************/
#seccionCiclos{
    margin-bottom:40px;
    padding-left: 15px;
}
#seccionCiclos .sesion{
    min-height:50px;
    margin-top:10px;
    padding-left:15px;
    padding:0px !important;
}

.sesion{
    display:flex;
}


.sesion .descrip{
	background-color:#EFEFEF;
	min-height:65px;
}
.sesion .precio{
    background-color:#9fc5dd;
    min-height:65px;
    padding:0px;
    text-align:center;
}
.sesion .despliegue{
    background-color:#EFEFEF;
    min-height:65px;
    padding:0px;
    text-align:center;
}

.despliegue span{
    cursor:pointer;
    position: absolute;
    top: 25px;
    font-size: 12px;
}
.info-sesion{
    display:none;
    background-color:#fff;
    margin-right: 1px;
    border:1px solid #EEE;
}
#seccionCiclos .horas{
    padding:0px;
}
.hora-sesion{
    height:65px;
    width:100%;
    background-color:#FCFCFC;
    border-bottom:1px solid #DDD;
    display:inline-flex;
}
.foto-sesion{
    padding:15px;
}

@media (max-width: 770px) {
    .foto-sesion{
        padding:15px;
        margin-top: 15px;
    }
}


#seccionCiclos .mas-info{
    float: left;
    text-align:center;
    background-color: #F5F5F5;
    height: 100%;
    padding-left: 2%;
    padding-top: 2%;
    font-size: 18px;
    cursor:pointer;
}

#seccionCiclos .sense-mas-info{
    float: left;
    text-align:center;
    background-color: #F5F5F5;
    height: 100%;
    padding-left: 2%;
    padding-top: 2%;
    font-size: 18px;
    color:#ccc;
}

#seccionCiclos .carrito{
    float:right;
    text-align:center;
    background-color: #F5F5F5;
    height: 100%;
    padding-left: 2%;
    padding-top: 3%;
    font-size: 24px;
    cursor:pointer;
}

#seccionCiclos .carrito:hover{
    color:#A4B7CF;
}

.sesion .info{
    background-color: #F5F5F5;
    min-height: 50px;
    padding: 0;
    padding-top: 10px !important;
    padding-left: 2% !important;
    padding:0px;
    text-align:center;
}
.sesion .sense-info{
    background-color: #F5F5F5;
    min-height: 50px;
    padding: 0;
    padding-top: 10px !important;
    padding-left: 2% !important;
    padding:0px;
    text-align:center;
    color:#ccc;
    cursor:default;
}

.info-hora{
    display: none;
    width: 100%;
    background-color: #fff;
    border-right: 1px solid #ccc;
    border-left: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    padding:10px;
}
.textoCicle{
    margin:2px;
}

.dataCicle{
    margin:2px;
}

#titleCicle{
    border-bottom:1px solid;
    font-weight:bold;
    color:#424856;
    margin-bottom:20px;
}

.info-ciclo{
    z-index: 1000;
    position: absolute;
    width: 97%;
    top: 0;
    display: none;
    max-height: 97%;
    height: 95%;
    overflow-y: auto;
    margin: 5px;
    opacity: 0.95;
}

.info-ciclo .carrito{
    display: inline-block;
    font-size: 28px;
    float: right;
    height: 100%;
    background-color: #f4f4f4;
    width: 16%;
    padding-top: 15px;
}

#info-cicloCombi .carrito{
    width: 8% !important;
    @media (max-width: 700px) {
        width: auto !important;
    }
}

#modalCombiCicles .imagen{
    @media (max-width: 510px) {
        display:none;/*no visible imatge en aquesta mida*/
    }
}

.p_suspensivos{
    padding: 5px !important;
}

.info-ciclo .titulo-sesion{
    font-weight:bold;
    font-size:14px;
}

.info-ciclo .fecha-sesion{
    font-size:12px;
}

.info-ciclo .info{
    width:15%;
    display:inline;
    position:relative;
    top:18%;
}
.info-ciclo .info a{
    color:#1679bf !important;
}

.info-ciclo .info a span{
    font-size:12px;
}

.info-ciclo .info .fa-info-circle{
    font-size:2em;
}
/** Si cambiamos el color de este hover puede que deje de funcionar correctamente la funcion que cierra las diferentes
sesiones de los ciclos "moreCicloInfo()" del fichero mainFunctions.js**/
.info-ciclo .info a:hover{
    color:#ccc !important;
}
.info-ciclo .leyenda-noinfo{
    width:15% !important;
    height:100% !important;
}

#info-cicloCombi .leyenda-noinfo {
    padding-top:0px!important;
    width:40px !important;
    background:none!important;
    text-align:center!important;
}

.info-ciclo .leyenda-noinfo span{
    top:18% !important;
}

.info-ciclo .ciclo{
    width:70%;
    display:inline-block;
    position:relative;
    top:10%;
}

#info-cicloCombi .ciclo{
    width:60%;
    display:inline-block;
    position:relative;
    top:10%;
}

/*numeradas*/
.circleNumSelec{
    color: #fff !important;
    background-color: #434343 !important;

}
.circleNumNoSelec{ 
    color: #ccc;
}

.rowDivSales .divSalesColor{
    margin: 5px;
    height:50%;
}

.rowDivSales {
    background-color: #f7f9f8;
    height: 42.73px;
    margin-bottom: 0px;
    border: 0.3px solid #cecece;
    color: #434343;
    padding-right:6px;
}

.rowDivSales:hover {
    color: #fff;
    background-color: #434343;
}

.rowDivSales div{
    padding-top:5px;
}

#rowDivSales {
    display: table;
}

#divSales {
    border: 1px solid #cecece;
    /* height: 180px; */
    width: 60%;
    border-radius: 5px;
    padding: 15px !important;

    margin: 0 auto;
    padding: 10px !important;
}
 
#divSales1 {
    left: 0;
    top: 15px;
    display: inline-block;
    width: 55%;
}

#divSales2 {
    left: 55.5%;
    position: absolute;
    top: 10px;
    font-size:10px;
    float: right;
} 
 
.recintoSala{
     cursor:pointer;
}

.recenteEscenario{
    border: 1px #999;
    box-shadow: 1px 1px 4px 2px #999;
    border-radius: 10px;
}

.recintoSalaMarcada{
/*  opacity:.35;*/
    border:1px solid;
    -webkit-box-shadow:0 1px 1px 0 #000;
    -moz-box-shadow:0 1px 1px 0 #000;
    box-shadow:0 1px 1px 0 #000;
}
 
.recintoSala:hover{
    opacity:.35;
    -webkit-box-shadow:0 1px 1px 0 #000;
    -moz-box-shadow:0 1px 1px 0 #000;
    box-shadow:0 1px 1px 0 #000;
}


/*********** NOTA IMPORTANTE ****************
*****************************************/
.nota-importante{
    padding:30px 20px;
    border:1px solid #ccc;
    margin-bottom:40px;
}

.nota-importante span{
    font-size:13px;
}

.nota-importante-pie{
    padding:30px 20px;
    border:1px solid #ccc;
    display:none;
    margin-top:10px;
    margin-bottom:20px;
}
/** Elementos de descuento **/
.nota-descuento{
    border-radius: 50%;
    background-color: #1679bf;
    color:#fff;
    width: 28px;
    height: 28px;
    position: relative;
    top: 0px;
    padding-top: 8px;
    display: inline-flex;
    margin-right:20px;
}

#leyendaDescuento span{
    position: relative;
    top: -3px;
}

.nota-descuento span{
    margin-left: 8px;
    position: relative;
    top: -3px;
    font-weight: 900;
}

.img-graphic{
    width: 20px;
    margin: 5px 20px 5px 5px;
}

.img-graphic-social{
    width: 32px;
    margin: 5px 20px 5px 5px;
}

.leyenda_horarios{
    margin-bottom:40px;
    font-size:12px;
    margin-left:0px;
    background-color: #f4f4f4;
    text-align: center;
    padding: 5px;
}

@media (max-width:992px){
    .nota-importante{
        display:none;
    }
    /*
    .nota-importante-pie{ //cuando queríamos que saliera debajo la nota importante del botón
        display:block;
    }*/
    
    
    .leyenda_horarios{
        background-color: #fff;
        text-align: left;
    }
    #leyendaDolar i{
        padding-left:7px;
    }
}

/*********** ESTADO DE LA COMPRA ****************
*****************************************/

#estados{
    width:100%;
    height:155px;
    background-color:#1679bf;
    margin-top:75px;
}
#estados .circulo{
    background-color: #fff;
    width: 50px;
    border-radius: 50%;
    height: 50px;
    margin: 10px 40px;
}

#estados .active{
    background-color: #424242;
    color:#fff;
}

.circulo span{
    font-weight:bold;
    position: relative;
    top: 12px;
}

#estados .bloque{
    display: inline-block;
}

@media (max-width: 750px) {
    #estados .texto{
        font-size:12px;
    }
    #estados .circulo{
        margin: 10px 20px;
    }
}


/*SECCIO FOOTER*/
footer{
    width:100%;
    min-height:60px;
    background-color:#F5F5F5;
    position: relative;
}

footer .row{
	margin-left:0px !important;
	width:100%;
}

#copyright{
	padding-top:20px;
	color:#424242;
	font-size:12px;
	font-weight:bold;
	float: right;
	margin-left:20%;
}
#logo-footer{
	margin-top:5px;
	background-image: url('../images/logo_transparent.png');
	float: left;
	width: 20%;
	min-height: 60px;
	background-size: 100%;
	background-repeat: no-repeat;
}

#footerAdreca{
    text-align: center;
    padding: 10px;
    font-size: 11px;
}

@media (max-width: 750px) {
    #logo-footer{
        width: 90%;
    }
}

@media (min-width: 751px) and (max-width: 992px) {
    #logo-footer{
        width: 60%;
    }
}
 
/*FI SECCIO FOOTER*/

/*********** PÁGINA TARIFAS ****************
*****************************************/

.degradatAct{
    max-height: 30px;
    background: -webkit-linear-gradient(#777, #fff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

.degradatNoAct{
    max-height: 100%;
}

.fDegradat{
    color:#5f96bd;
    font-weight:bold;
    cursor:pointer;
    text-align:center;
}

.backActivButton{
    color:#1679bf;
    cursor:pointer;
}

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

.divResum{
    /*background-color: #F4F4F4;*/
    margin: 5px 0px;
    text-align: justify;
}

.divResum .info{
    padding:12px;
}

.divResum .foto{
    float:right;
    padding:12px;
}

.divResum .title{
    font-size: 20px;
    padding-bottom: 5px;  
    border-bottom: 1px solid #1679bf;
    margin-bottom: 10px;    
}

.divResum .title span{
    float:right;
    color: #1679bf;
    padding-top: 5px;
    font-size:25px;
    cursor:pointer;
}

.divResum .title span:hover, .tarifa .descrip span:hover{
    opacity:0.6;
}

.divResum .text{
    font-size: 16px;
}

.divResumBackButton{
    padding: 5px 26px 5px 0px;
    text-align:right;
}

.tarifas{
    margin-bottom:40px;
    margin-right: 5%;
    margin-left: 5%;
}

.tarifas .tarifa{
    margin-top:10px;
    padding-left:15px;
}

.col-tarifa{
    float:left;
    padding-left:10px;
    font-size:11px;
    color:#999;
}

.col-cantidad{
    float:right;
    padding-right:10px;
    font-size:11px;
    color:#999;	
}

/** lista actividades en tarifas */
#list-select-act{
    border: 1px dashed #1679bf;
    padding: 5px;
    width: 100%;
    margin-bottom:20px;
    position:relative;
    float:left;
    clear:both;
}
#list-select-act .fa-cubes{
    color: #1679bf;
    margin-right: 5px;
}

#list-select-act input{
    cursor:pointer;
    border: none;
    margin-right: 5px;
    color: #aaa;
    max-width: 160px;
    white-space: nowrap;
    text-overflow: ellipsis;
    height: 48px;
    font-size: 14px;
    padding-left: 20px;
    background-image: url('../images/ticket.png');
    background-repeat: no-repeat;
    padding-right: 35px;
    text-align: center;
    opacity:0.9;
}

/*.tarifa div{
    padding-top:8px;
}*/

.tarifa .descrip{
    height:65px;
    border: 1px solid #ddd;
    border-right-width: 0px;
}

.tarifa .descrip .fa{
    font-size: 28px;
    padding-right:10px;
    cursor:pointer;
    color: #1679bf;
}

.tarifa .descrip div{
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    float:left;
}

.tarifa select{
    width: 100%;
    height: 100%;
    border: none;
    padding-left: 10%;
    border-left:1px solid #ddd;
}

.tarifa .precio{
    height: 65px;
    border-bottom: 1px solid #ddd;
    border-top: 1px solid #ddd;
    padding-top:20px;
}
.tarifa .unidades{
    height:65px;
    border-bottom: 1px solid #ddd;
    border-top: 1px solid #ddd;
    border-right: 1px solid #ddd;
    padding:0px !important;
}

.tarifa .noinfo{
    font-size:24px !important;
}

.suggerenciaCarrito select{
    width: 100%;
    height: 100%;
    border: none;
    padding-left: 5%;
}

.suggerenciaCarrito .descrip{
    padding-right:5px;
    height:40px;
    border: 1px solid #ddd;
    padding:0px !important;
}

.suggerenciaCarrito .unidades{
    height:40px;
    border-bottom: 1px solid #ddd;
    border-top: 1px solid #ddd;
    border-right: 1px solid #ddd;
    padding:0px !important;
}

.suggerenciaCarrito img{
    cursor: pointer;
    height: 20px;
    margin-top: 10px;
    width: 20px;
}

.info-tarifa{
    display:none;/*comentar si volem el més info de les tarifes visible inicialment*/
    background-color:#f4f4f4;
    margin-right:-15px;
    padding:10px;
    border:1px solid #DDD;
    font-size:12px;
}

#tarifas .horas{
    padding:0px;
}
.hora-tarifa{
    height:75px;
    width:100%;
    background-color:#FCFCFC;
    border-bottom:1px solid #DDD;
}
#tarifas .mas-info{
    float: left;
    width: 7%;
    background-color: #F5F5F5;
    height: 100%;
    padding-left: 2%;
    padding-top: 2%;
    font-size: 18px;
}
.datos-tarifas{
    margin-right:1.5%;
    margin-left:2.5%;
    margin-bottom:40px;
}

#total-tarifas{
    min-height:60px;
    background-color: #F5F5F5;
    padding-top: 2%;
    text-align:right;
    padding-right:20px;
}

#total-tarifas .part1Total{
    width:40% !important;
    margin-left:10%;
}

#total-tarifas .part2Total{
    font-size:22px;
    font-weight:bold;
    margin-left:10%;
}
#dadesAmic, #dadesAbonament, #dadesDonKult, #dadesCarnetJove, #dadesBescanviActiv{
    text-align:left;
    margin:20px 0;
}

.recover_pass{
    color:#1679bf !important;
    cursor:pointer;
}

.recover_pass:hover{
    color:#71AFB3 !important;
}

.recuperarPasswordInput{
    display:none;
    text-align:right;
    padding-top:4px;
}

#dadesAmic .campos-tarifas-password, #dadesDonKult .campos-tarifas-password, #dadesCarnetJove .campos-tarifas-password{
    display:none;
}

#dadesAmic .campos-tarifas-password label, #dadesDonKult .campos-tarifas-password label, #dadesCarnetJove .campos-tarifas-password label{
    display:block;
    font-weight:normal !important;
    font-size:12px;
    color:#ccc;
}

#dadesAmic .campos-tarifas-password input, #dadesDonKult .campos-tarifas-password input, #dadesCarnetJove .campos-tarifas-password input{
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
}


#dadesAmic .campos-tarifas, #dadesAbonament .campos-tarifas, #dadesDonKult .campos-tarifas, #dadesCarnetJove .campos-tarifas, #dadesBescanviActiv .campos-tarifas{
    display:flex;
}
#dadesAmic .campos-tarifas label,#dadesAbonament .campos-tarifas label, #dadesDonKult .campos-tarifas label, #dadesCarnetJove .campos-tarifas label, #dadesBescanviActiv .campos-tarifas label{
    display:block;
    font-weight:normal !important;
    font-size:12px;
    color:#ccc;
}

#dadesAmic .campos-tarifas input, #dadesAbonament .campos-tarifas input, #dadesDonKult .campos-tarifas input, #dadesCarnetJove .campos-tarifas input, #dadesBescanviActiv .campos-tarifas input{
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
}
@media (max-width: 480px) {
    .backActivButton{
        font-size:11px;
    }
    #total-tarifas .part1Total{
        margin-left:2%;
    }
    
    #total-tarifas .part2Total{
        font-size:18px;
        margin-left:2%;
    }
}
@media (max-width: 750px) {
    #dadesAmic .campos-tarifas,#dadesAbonament .campos-tarifas, #dadesDonKult .campos-tarifas, #dadesCarnetJove .campos-tarifas, #dadesBescanviActiv .campos-tarifas{
        display:inline !important;
    }
    #list-select-act{
        margin-bottom:20px;
    }
}

@media (max-width: 980px) {
    .tarifas{
        margin-bottom:0px;
    }
}
/*********** PÁGINA HORARIOS ****************
*****************************************/

.fecha_ppal{
    padding:15px;
    text-align:center;
    border:1px solid #ccc;
    color:#666;
    cursor:pointer;
    margin-bottom:40px !important;
    width:40%;
    margin:auto;
}

.fecha_ppal:hover{
    background-color:#f4f4f4;
    color:#1679bf ;
}

.fecha_ppal div{
    display:inline;
}

.fecha_ppal span{
    font-size:20px;
}

#fecha_seleccionada{
    margin-left:10px;
    font-size:18px;
    font-weight:bold;
}

.horarios-actividad{
    margin-bottom:20px;
}
.cabecera-acti{
    width:100%;
    height:80px;
    border: 1px solid #ccc;
}
.cabecera-acti .foto{
    padding-left:0px;
}
.cabecera-acti img{
    max-height: 78px;
    width: 117px;
}
.cabecera-acti div{
    display:inline-block;
}
.cabecera-acti .nombre-activ{
    padding-left:5px;
    top: 15px;
    position: relative;
    font-weight:bold;
}
.cabecera-acti .fecha{
    color:#999;
    top: 15px;
    position: relative;
    text-align:center;
}
.cabecera-acti .fecha span{
    display:block;
}

.cabecera-acti .personas{
    color:#999;
    top: 15px;
    position: relative;
    text-align:center;
}
.cabecera-acti .personas span{
    display:block;
}
.cabecera-acti .seleccione {
    text-align:center;
    padding-top:15px;
}
.cabecera-acti .date, .pers{
    padding-top:10px;
    text-align:center;
}

.horarios{
    margin-top:10px;
    margin-bottom:15px;
    font-family: "Open Sans", Helvetica, Arial, sans-serif !important
}
.horarios .ticket{
    cursor:pointer;
    /*min-width:171px;*/ /*provoca overflow i per tant scroll horit*/
    min-width:150px;
    margin: 5px 0px;
    font-size: 42px;
    color: #bbb;
    height: 50px;
    max-width:172px;
    border: 1px solid #777;
    float:left;
}

.horarios .noTicket{
    min-width:150px;
    margin: 5px 0px;
    font-size: 42px;
    color: #bbb;
    height: 50px;
    max-width:172px;
    border: 1px solid #777;
    float:left;
    background-color: #c1c1c1;
}

.horarios .ticket:hover{
    color:#72a7cc;
    font-size:41px !important;
    background-color: #9fc5dd;
}

.horarios .ticketSeleccionado{
    font-size:41px !important;
    color: #ddd;
    background-color:#9fc5dd;
}

.horarios .ticketNoSeleccionado{
}

.horarioIdentInt{
    border-radius: 50%;
    background-color: #1679bf;
    width: 28px;
    height: 28px;
    position: relative;
    top: 6px;
    padding-top: 8px;
    left: 2px;
}

.horarioIdentInt span{
    font-size:11px !important;
    color:#fff !important;
}

.horarios .ticket div,.horarios .noTicket div{
    display:inline-block;
}

/*tamaño pequeño si mostramos hI y hF (por property)*/
.horarios .ticketHora{
    /*font-size:10px;*/
}

.horarios .ticket .ticket-left,.horarios .noTicket .ticket-left{
	/*width:155px; sant pau vol horaFinal a les session i no mostra res a la part dreta tiquet.*/
	/*width:108px;*/ /*a les session i no mostra res a la part dreta tiquet park güell vol text idioma gran*/
    width:45px;/*estandar*/
    /*border-right: 1px dotted #ccc; 0px !important; sant pau vol horaFinal a les session i no mostra res a la part dreta tiquet*/
    /*height: 38px;*//*a les session i no mostra res a la part dreta tiquet park güell vol text idioma gran*/
    height: 36px;
    position: relative;
    /*top: -47px;*/
}
.horarios .ticket .ticket-left span,.horarios .noTicket .ticket-left span{
    font-size: 15px;
    color: #000;
    position: relative;
	/*top: 12px;*/ /*sant pau vol horaFinal a les session i no mostra res a la part dreta tiquet*/
    top: 14px;/*estandar*/
    right: 10px;
}
.horarios .ticket .ticket-right,.horarios .noTicket .ticket-right{
    /*display:none; sant pau vol horaFinal a les session i no mostra res a la part dreta tiquet*/
	/*width:25px;*//*a les session i no mostra res a la part dreta tiquet park güell vol text idioma gran*/
    width:76px;/*estandar*/
    padding-left: 10px;
    font-size: 22px;
    display: inline-block;
    position: relative;
    top: 8px;
    color: #333;
}

.opcioSessio1{
    /*display:none;*/ /*a les session i no mostra res a la part dreta tiquet park güell vol text idioma gran park güell*/
}

.horarios .ticket .ticket-right span,.horarios .noTicket .ticket-right span{
    color: #999;
    font-size: 20px;
    top: -2px;
    position: relative;
}

.horarios .noTicket .ticket-right span{
    color: red !important;
}

.horarios .ticket-right i{
    width: 24px;
    position: relative;
    left: 0px;
    top: 10px;
    color: #fff;
    background-color: #FFA407;
    border-radius: 50%;
    height: 24px;
    font-size: 16px;
    padding-top: 4px;
}

#leyendaDolar i{
    width: 24px;
    position: relative;
    left: 0px;
    color: #fff;
    background-color: #FFA407;
    border-radius: 50%;
    height: 24px;
    font-size: 16px;
    padding-top: 4px;
}

.horarios .ticket-right img{
    width:20px;
    position:relative;
    /*left: 0px;*//*a les session i no mostra res a la part dreta tiquet park güell vol text idioma gran*/
    left: 6px;/*estandar*/
    top: 10px;
}

.horarios .row{
    width:100%;
    display: flex;
    justify-content: center;        
}

.filtros .row{
    width:100%;
    display: flex;
    justify-content: center;
}

.filtrosOblig .row {
    width:100%;
    display: flex;
    justify-content: center;    
}

.filtros{
    /*text-align:center;*/
    padding-top:15px;
    font-size:12px;
}
.filtros div{
    min-height:45px;
}

/*si filtro obligatorio de idioma en sesiones*/
.filtrosOblig{
    padding:15px 15px 15px 0px;
    font-size:12px;
    /*border-bottom: 1px solid #ccc;*/
    margin-bottom:10px;
    padding-bottom: 35px !important;
    
}
.filtrosOblig div{
    min-height:39px;
    padding-left: 0px !important;
    padding-right: 0px !important;
}

.idiomasObligDiv{
    position: relative;
    float: left;
    width: auto;
}

/*Boton para filtrar horarios en sesiones (horario)*/
.horariosFiltre{
    padding: 10px;
    border:1px solid #eee;
    background-color:#f4f4f4;
    cursor:pointer;
    color:#000;
}

.horariosFiltre:hover{
    color:#1679bf;
}

/*Boton para filtrar horarios en sesiones (horario). Si clicado*/
.horariosFiltreSeleccionat{
    padding: 10px;
    border:1px solid #eee;
    background-color:#9fc5dd;
    cursor:pointer;
    color:#000;
}

.horariosFiltreSeleccionat:hover{
    color:#1679bf;
    background-color:#9fc5dd;
}
.ticket-left .idioma_ticket{
    /*font-size: 9px !important;*//*a les session i no mostra res a la part dreta tiquet park güell vol text idioma gran*/
    font-size: 12px !important;
    padding-left: 4px !important;
    color: #1679bf !important;
}

.horarios .ticketSeleccionado .idioma_ticket{
    color:#fff !important;
}

.ticket-right .num_ocup{
    position: relative !important;
    top: 8px !important;
    font-size: 16px !important;
    padding-left: 8px;
}

#message_info{
    font-size: 18px;
    color: #1679bf;
    text-align: center;
    margin-top: 20px;    
}
.borrarFiltros{
    cursor: pointer;
    font-size: 14px;
    background: #1679bf;
    padding: 5px;
    display:none;
    color:#fff;
}
.mini{
    font-size:16px !important;
    padding: 2px;
}
.borrarFiltros:hover{
    opacity:0.6 !important;
}

@media (max-width: 750px) { 
    .fecha_ppal{
        width:80%;
    }
    #simb_ticket{
        display:none;
    }

    .horarios .ticket, .horarios .noTicket {
        font-size:38px;
    }

    .horarios .ticketSeleccionado{
        font-size:37px !important;
    }
    .horarios .ticket:hover{
        color:#CCE9EA;
        font-size:37px !important;
        background-color: #9fc5dd;
    }
    .ticket-right .num_ocup{
        font-size:12px;
    }
}

/*********** PAGINA CARRO COMPRA ****************
*****************************************/

.lineas{
    margin-bottom:40px;
}

#preview h1{
    display:inline-block;
    margin-left:10%;
}
#inputAfegirGrup{
    font-size: 18px;
    margin-left: 10%;
}

.compra-acti{
    display:flex;
    width:100%;
    min-height:80px;
}
.compra-acti img{
    max-height: 78px;
    object-fit: contain;
    width: 117px;
}
.compra-acti div{
    display:inline-block;
}
.compra-acti p{
    color:#333;
}
.compra-acti .titulo{
    height:80px;
    border:1px solid #ddd;
    padding:0px;
}

.compra-acti .datos{
    height:80px;
    border:1px solid #ddd;
    padding:0px;
    z-index:1001;
}

.compra-acti .nombre-activ{
    padding-left:5px;
    top: 15px;
    position: relative;
    font-weight:bold;
}
.compra-acti .fecha{
    color:#999;
    top: 15px;
    position: relative;
    text-align:center;
}
.compra-acti .fecha span{
    display:block;
}
.compra-acti .personas{
    color:#999;
    top: 15px;
    position: relative;
    text-align:center;
}
.compra-acti .personas span{
    display:block;
}
.compra-acti .seleccione {
    text-align:right;
}

.compra-acti .hora{
    color:#999;
    top: 15px;
    position: relative;
    text-align:center;
}
.compra-acti .hora span, .compra-acti .lang span{
    display:block;
}

.compra-acti .lang {
    color: #999;
    top: 15px;
    position: relative;
    text-align: center;
}
.compra-acti .foto{
    padding-left:0px;
}
.compra-acti .remove{
    cursor: pointer;
    font-size: 20px;
    height: 100%;
    padding-right: 0;
}
.compra-acti .remove div{
    height: 100%;
    width: 100%;
    background-color: #f4f4f4;
    padding-top: 25px;
    text-align: center;
}

#codi-promocion{
    height:60px;
    border:1px solid #ddd;
}

#codi-promocion .valido{
    float: right;
    position: absolute;
    top: 10px;
    right: 10px;
}

#codi-promocion input{
    height:100%;
    width:100%;
    padding:10px;
    border: none;
    color:#ccc;
}

#divBescanviActiv{
   height:35px; 
   margin-bottom:15px;
}

#divTextBescanviActiv,#divInfoBescanvi{
    float: right;
    color: #1679BF;
}

#divInfoBescanviTarif{
    float: left;
    color: #1679bf;
    font-size: 20px;
}

#divInfoBescanviTarif div{
    margin-left:5%;
}

#divTextBescanviActiv span,#divInfoBescanvi span, #divInfoBescanviTarif span{
    vertical-align: middle;
    border: 1px solid #ccc !important;
    padding:4px;
    margin-right:5px;
    width:90%;
	padding-bottom:5px;
}

#divInfoBescanvi .row,#divInfoBescanviTarif .row{
    height: 40px;
    text-align: center;
}

#divTextBescanviActiv input, #divBescanviable 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;
    height:10px;
    border:0px !important ;
}

#divTextBescanviActiv input:focus,#divBescanviable input:focus{
    border: 0px;
    outline: none;
}

#divTextBescanvi,#divTextBescanviKxK{
    float: right;
    position: relative;
    right: 0px;
    top: -50px;  
    color: #1679bf;
}

#divTextBescanvi span,#divTextBescanviKxK span{
    text-decoration:underline;
    cursor: pointer;    
}

#apli_promo .fa-trash-o{
    cursor:pointer;
}

.b_passbook{
    margin-top: 20px;
}

.b_passbook a{
    border: 2px solid #999;
    padding: 14px 2px;
    margin-top: 20px;
    border-radius: 14px;
    background: #f4f4f4;
    font-size: 16px;
}

.b_passbook img{
    width: 50px;
    top: -2px;
    position: relative;
    padding-right: 4px;
}

.activar-codi{
    min-height: 60px;
    background-color: #F5F5F5;
    text-align: center;
}

.button_promocion{
    margin-left:30px !important;
    height:40px !important;
    width:100% !important;
    max-width:100% !important;
    max-height:100% !important;
    cursor:pointer;
    border:none !important;    
    border-radius:0px;
    margin-top:5px;
    background-color:#1679bf !important;
    color:#fff;
}

#accordionDades{
    margin-top:55px;
}

#accordionArticulos{
    margin-left: -11% !important;
    width: 122%;
}
#seccion-articulos{
    margin-top:40px;
    background-color:#EFEFEF;
    min-height:400px;
}

#seccion-articulos .familia{
    text-align:center;
}

.familia select{
    width: 150px;
    height: 35px;
    border: 1px;
    border-radius: 5px;
    color: #1679bf;
}
.articulos{
    width:80%;
    margin:auto;
}
.articulo{
    margin-top:40px;
    margin-bottom:40px;
    box-shadow: 2px 2px 4px 2px #999;
}

.articulo .image{
    width:100%;
}

.articulo .titulo-sesion {
    width:75%;
    padding:10px;
    font-size:14px;
}

.articulo .info{
    width:100%;
    height:80px;
    background-color:#fff;
    border-bottom:1px solid #eee;
    display: inline-flex;
    border-top: 1px solid #eee;
}
.articulo .info .mas-info{
    width: 30%;
    background-color: #f4f4f4;
    height: 100%;
    float: right;
    text-align: center;
    padding: 15px;
}

.articulo .precio{
    width:100%;
    height:60px;
    background-color:#fff;
    border-bottom:1px solid #eee;
}

.articulo .precio div{
    height:100%;
    display:inline-block;
    width:50%;
    text-align:center;
    font-size:16px;
}
.articulo .num_art{
    border-left:1px solid #eee
}

.articulo .num_art select{
    width: 100%;
    border-color: #FFF;
    height: 100%;
}

.articulo .precio input {
  width: 50%;
  margin-top: 10px;
  font-size: 20px;
}

.articulo .precio span {
    border:0;
    width:100% !important;
}

.articulo .carrito{
    width: 100%;
    height: 50px;
    background-color: #fff;
    border-bottom: 1px solid #eee;
    text-align: center;
    font-size: 22px;
    color: #9fc5dd;
    padding-top: 10px;
}

.articulo .leyenda-info{
    height:80px !important;
    width: 25%;
    text-align: center;
}

.articulo .leyenda-noinfo{
    height:80px !important;
    width: 25%;
    text-align: center;
}

#numArticles{
    padding-top: 5px;
    cursor: pointer;
    color: #fff;
    font-size: 18px;
    background-color: #1679bf;
    margin-left: 25%;
    height: 38px;
}

#numArticles:hover{
    opacity:0.6 !important;
}

.resumen-acti{
    height:40px;
    border:1px solid #ccc;
    margin-bottom:30px;
    display:flex;
}
.resumen-acti div{
    height:100%;
    padding:0px;
    display:inline-block;
}
.resumen-acti .despliegue{
    float:left;
    height: 100%;
    width: 50px;
    text-align: center;
    padding-top: 10px;
    background-color: #f4f4f4;
    cursor:pointer;
}
.resumen-acti .entradas{
    padding-top: 10px;
    float:right;
    padding-right:15px;
}
.resumen-acti .total{
    padding:10px;
    background-color:#f4f4f4;
}

.desglose-acti{
    padding-top: 8px;
    height: 60px;
    border: 1px solid #ddd;
    font-size: 14px;
    background-color: #fff;
    display:flex;
}
.desglose-acti div{
    text-align:center;
}
.desglose-acti .nombre-activ{
    font-size:14px !important;
}

#codi-promocional{
    display: flex;
    justify-content: right;
    padding-right: 25px;    
}

.confirm-eliminar{
    padding:20px;
    padding-top:30px;
    text-align:center;
    height: 200px;
    width: 350px;
    background-color: #f4f4f4;
    position: absolute;
    right: 15px;
    top: 60px;
    z-index: 1000000;
    border: 1px solid #ccc;
    display:none;
}

.confirm-eliminar button{
    height:60px;
    width:100px;
    margin:20px;
}


.dialogCenter{
    padding:20px !important;
    padding-top:30px !important;
    text-align:center;
    height: 200px !important;
    width: 350px !important;
    background-color: #f4f4f4;
    position: absolute;
    left: 40%;
    top: 20%;
    z-index: 9999;
    border: 1px solid #ccc;
    display:none;
    opacity:1 !important;
}

.dialogCenter button{
    height:60px;
    width:130px;
    margin:20px;
}

.total-final{
    padding:10px;
    height: 40px;
    background-color: #9fc5dd;
    margin-top: 10px;
    margin-bottom:40px;
    padding-left:2% !important;
}

#iva-final{
    padding:5px;
    border-top:1px solid black;
    border-bottom:1px solid black;
    float:right;
}

#iva-final #desglose{
    float:right;
    padding: 5px;    
}

#iva-final #resum{
    float:right;
    padding: 5px;  
    margin-left:25px;
    text-align:right;
}

#iva-final #desglose div{
    text-align:right;
}

#iva-final #desglose span{
    width:80px;
    display:inline-table;
}

@media (max-width: 480px) {
    .total-final{
        display:inline-table !important;
        width:100%;
    }
    #apli_promo{
        text-align:center;
        width:100% !important;
        padding-bottom:10px !important;
    }
    .desglose-acti{
        height:100%;
        width:100%;
        font-size: 14px;
        background-color: #fff;
        display:inline-block;
    }
    .desglose-acti .col-xs-12{
        border-bottom: 1px solid #e4e4e4;
        padding:3px;
        font-size: 12px;
    }
    
    .desglose-acti .nombre-activ{
        font-weight:bold;
    }
}

@media (max-width: 750px) { 
    .compra-acti{
        display:block;
    }
    .articulos{
        width:90%;
    }
    .desglose-acti{
        font-size:12px !important;
        height: 100%;
        width: 100%;
        display: inline-block;
    }
    
   .desglose-acti .col-xs-12{
        border-bottom: 1px solid #e4e4e4 !important;
        padding:3px !important;
        font-size: 12px !important;
    }
    
    .desglose-acti .nombre-activ{
        font-weight:bold;
    }
}

@media (min-width: 751px) and (max-width: 992px) {
    .navbar-header{
        width:40%;
    }
}

/*********** PAGINA DE DATOS ****************
*****************************************/
#private_access{
    cursor:pointer;
}
#private_access:hover{
    color:#999;
}
.fila{
    width: 100%;
    height: 60px;
    display: block;
}

.filaNota{
    width: 100%;
    height: 60px;
}

.fila input{
  border: none;
  width: 100%;
  padding: 5px;
  /*margin: 10px 0px;*/
  font-size:16px;
  color:#666;
  border:1px solid #ccc;
}
/** Campos Obligatorios**/
.fila .obligatorio, #sle_observ .obligatorio{
    border: 1px solid #9fc5dd !important;
    background: #FFF7F0;/*no important per si ho hem de pintar de un altre color si no Espanya (cp, pobl, prov)*/
}
.fila span{
    width: 150px;
    position: relative;
    color: #333;
}

#divAsistents .fila span,#divInfoAmicBenef .fila span{
    position: relative;
    color: #333;
}

.fila select{
    font-size:16px;
    border: 1px solid #ccc;
    top: 19px;
    /* position: relative; */
    left: 10px;
    height: 40px;
    width: 100%;
    font-size: 16px;
    border: 1px solid #ccc;
    /* margin-left: 5px;
    margin-top: 10px; */
}
.datos2{
    margin-bottom:30px;
}

#sle_observ{
    border:1px solid #ccc !important;
    margin-top: 20px;
    margin-bottom: 20px;
}

.datos2 textarea{
    width:100%;
    font-size: 16px;
    padding: 5px;
    /*margin-left: 10px;*/
    border: 1px solid #ccc;
}

.regalo-fact{
    margin:20px;
}
.oblig{
    font-size:12px;
    color:#9fc5dd;
    text-align: left;
    padding-left: 5px; 
    width: 160px;
    padding: 4px;
    background-color: #FFF7F0;
    border-radius: 5px;
}

#datos_regalo{
    background-color:#f4f4f4;
    display:none;
    padding-bottom: 15px;
}

#datos_factura{
    background-color:#f4f4f4;
    display:none;
}

#dadesAvis,#dadesAvisInfo,#dadesAvisInfoLOPD1,#dadesAvisInfoLOPD2,#dadesAvisInfoLOPD3,#dadesAvisInfoLOPD4{
    font-size: 12px;
    padding: 20px;
    margin-bottom: 30px;
    width: 450px;
    background-color: #f4f4f4;
    border-radius: 10px;
    display: none;
    color:#333;
    position:absolute;
    right: 10%;
    top: -200px;
    box-shadow:1px 1px 6px 2px #ccc;
    overflow-y:auto;
    max-height:300px;
}

#dadesAvisInfo{
    right: 20% !important;
    top: 0px !important;
}


.validate_ok{
    color:green;
    float: right;
    position: absolute;
    right: 21px;
    top: 10px;
}
.validate_ko{
    color:red;
    float: right;
    position: absolute;
    right: 21px;
    top: 10px;
}

.view_cond{
    color: #1679bf;
    font-size: 14px;
    cursor: pointer;
}

@media (max-width: 750px) {
    #dadesAvis,#dadesAvisInfo{
        width: 300px;
        top: -250px;
    }
}

/*********** COMPROBANTE VENTA ****************
*****************************************/
.recuadroOk{
    border:1px solid #ccc;
    padding:15px;
}

.compraExit{
    font-weight:bold;
    text-align:center;
    margin-top:10px;
    margin-bottom:30px;
}
.compraExit span{
    font-weight: 600;
    font-size: 18px;
    color:#1679bf;
}
#divCorrecte .localizador{
    text-align:center;
}

.divLocalizador{
    border: 1px solid #ECECEC;
    background-color:#F5F5F5;
    padding:4px;
    font-weight:bold;
    width:200px;
    margin:auto;
}

.separadorComprovant{
    color: #A3A3A3;
    font-weight: bold;
    border-bottom:1px solid #CCCCCC;
    margin-top:20px;
    margin-bottom:20px;
}

.dadesPagam{
    font-weight:bold;
    margin-bottom:25px;
}

/*Separadores de los campos del comprobante (titular, tiquet,...), más corto*/
.separadorCamp{
    color: #A3A3A3;
    font-weight: bold;
    border-bottom:1px solid #CCCCCC;
    margin:10px;
}

.datos_venta{
    padding:3% 5%;
    border:1px solid #ccc;
}

.subtitle{
    text-align:center;
    margin-bottom:40px;
}
.subtitle h3{
    display:inline;
}
.subtitle span{
    font-size:22px;
    padding-right:5px;
}

.datos_venta .entidad span{
    border: 1px solid #666;
    padding:2px;
}

.datos_venta .entidad p{
    margin-top:5px;
}
.localizador{
    float:right;
}
.localizador input{
    margin-top:5px;
    height:40px;
    background-color:#f4f4f4;
    border:1px solid #ccc;
}

.datos_venta .header{
    padding-bottom:20px;
    border-bottom:1px solid #ddd;
}

.datos_reserva .fila{
    border:none !important;
    border-bottom:1px solid #ccc !important;
}

.datos_reserva {
    margin-bottom:40px;
    margin-top:20px;
}

.datos_reserva .fila{
    height:50px;
    margin: 10px 0;
}

.dato{
  width: 70%;
  padding: 5px;
  margin-left: 5px;
  float: right;
  margin:12px 10px;
  font-size:12px;
  color:#333;
}

.bar-code{
  text-align: center !important;
  max-width: 180px;
  margin: 10% auto;
}

.social {
  text-align:center;
  margin-top:40px;
}

.social h3{
    margin-bottom:25px;
}

.social span{
    cursor:pointer;
    padding: 15px;
    background-color: #f4f4f4;
    margin:2px;
}

.social span:hover{
    color:#1679bf;
}

.datos-regalo{
    background-color: #f4f4f4;
    margin:5%;
    min-height:300px;
    padding:2%;
}

.datos-regalo i{
    color:#9fc5dd;
    font-size:22px;
    margin-right:10px;
}

.datos-regalo h3{
    text-align:center;
    display:inline-block;
    margin-bottom:20px;
}

.datos-regalo span{
    margin-right:10px;
    font-size:14px;
    color:#999;
}

.datos-regalo .fila span{
    font-size:14px;
    color:#333 !important;
}

.datos-regalo .fila{
    border:none;
    border-bottom:1px solid #ccc;
    background:none;
    height:40px;
    margin: 5px 0;
}

#obserActiv{
    font-size:13px;
}

.info_museo div{
    font-size:14px;
    margin-left:5%;
}
.info_museo img{
    width:50%;
    margin-bottom:20px;
}

#infoCompra{
    margin-top:30px;
}

#codiBarres img{
    width:auto !important;
}

#codiBarres, #qrcodeholder{
    margin:auto;
    text-align:center;
}
.dades span{
    margin: 5px 10px;
    display: inline-flex;
    width:30%;
    color:#999;
    font-size:14px;
}

.spanValPagam{
    width:60% !important;
    color:#333 !important;
    font-weight:600;
}

#inputPrint:hover{
    color:#FFF !important;
}

#question #tabPago{
    font-size:20px;
}

@media (max-width: 750px) {
    .info_museo{
        text-align:center;
    }
    .info_museo img{
        width:90%;
    }
    
    .localizador{
        text-align:center;
        margin-top:30px;
    }
    .datos_venta .entidad{
        text-align:center;
    }
    .dato{
        width: 55%;
        font-size:11px;
    }
    .datos_venta{
        padding:10%;
        border:1px solid #ccc;
    }
}

/*********** SELECT ****************
Libreria para renderizar los select
*****************************************/

.select2-selection__rendered{
    padding-top: 10px;
    font-size: 22px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow{
    height: 100% !important;
    width: 100% !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b{
    margin-left:20px !important;
}

.select2-container .select2-selection--single .select2-selection__rendered{
    padding-left:15px !important;
}

.select2-container{
    width:100% !important;
    height:100% !important;
}
.select2-container--default .select2-selection--single{
    border:none !important;
}

/*********** CHECKBOX CUSTOM ****************
*****************************************/

.checkboxFour {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: #fff;
    margin-right: 10px;
    border:2px solid #999;
    position: relative;
    border-radius:50%;
}

input[type=checkbox] {
    visibility: hidden;
}

.checkboxFour label {
    width: 18px;
    height: 18px;
    border-radius: 100px;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    -ms-transition: all .5s ease;
    transition: all .5s ease;
    cursor: pointer;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 1;
}
  
.checkboxFour input[type=checkbox]:checked + label {
    background-image:url('../images/icons/tick.png');
    background-repeat:no-repeat;
}


/*********** BOOTSTRAP ****************
*****************************************/
.navbar-default {
  background-color: #fff !important;
  border-color: #fff !important;
}
@media (min-width: 768px){
    .navbar{
      border-radius: 4px;
    }
    
    
    .navbar ul{
      position: absolute;
      right: 0;
      top: 0;
    }
    .navbar {
      position: relative;
      height: 36px;
      margin-bottom: 10px;
      margin-top: 10px;
      border: 1px solid transparent;
      width:80% !important;
      margin-right:auto;
      margin-left:auto;
    }
    .navbar-header {
            padding-bottom:10px;
            width:25%;
    }
    .navbar-default .navbar-nav>li>a {
      color: #030303;
    }
    
    .navbar-default .navbar-nav>li>a:hover {
      color: #fff;
      background-color: #e7e7e7;
    }
    
    .navbar-brand{
        height:32px;
        float: left;
        padding: 5px;
        font-size: 16px;
        line-height: 20px;
        border: 1px solid #030303;
    }
    .navbar-default .navbar-brand {
      color: #030303;
    }
}

@media (max-width: 750px) { 
    .navbar-header{
        width:90%;
        margin:auto;
    }
}

@media (max-width: 920px) { 
    #divTextBescanvi,#divTextBescanviKxK{
        float: none;
        position: relative;
        right: 0px;
        top: 12px;  
        clear:both;
        color: #1679bf;
    }
}

@media (max-width: 526px) { 
    #divInfoBescanviTarif .button_bescanvi{
        margin-top: 15px !important;
    }
}

@media (min-width: 751px) and (max-width: 992px) {
    .navbar-header{
        width:40%;
    }
}
 
/*********** MENSAJES ERROR ****************
*****************************************/
.spanError i{
    padding-right:10px;
}

.spanAviso{
    color:#F17605;
}
.spanAviso i{
    padding-right:10px;
}

#errorComprovant{
    color: #FC7671;
    border:1px solid;
    padding:10px;
}

#errorComprovant i{
    font-size:22px;
}

/**TIPOS DE PAGO (TARJETA; BIZUM;...)**/
#opcionesPago,#titleFormesPago{/*esconder todos los métodos de pago (por ejemplo si sólo tenemos tarjeta)*/
    visibility:hidden;
}

#pagoTarjeta label span, #pagoBizum label span{
    padding-left:5px;
}

#pagoTarjeta span, #pagoBizum span{
    display:block;
    padding-left:25px;
}

#pagoTarjeta span img {
    margin-top: 10px !important;
    width: 175px !important;
}

#pagoBizum span img {
    margin-top: 10px !important;
    width: 175px !important;
}

/*********** IFRAME PAGO ****************
*****************************************/
#iframeSMP{
     width:100%;
     height:1000px;
}
 
#tabPago{
    text-align: center;
    margin: 2%;
    font-size: 26px;
}
 
#tabPago label{
    margin-left:15px;
}
 
.avisIframe{
    padding: 5px;
    font-size: 14px;
    color: #FFF;
    text-align: center;
    background-color: #EF7E7E;
    border-radius: 10px;
    width: 75%;
    margin: auto;
    margin-bottom: 20px;
}

/*Barra lateral para indicar el paso en el que estamos*/
/*Pedido por BSM pero por ahora lo desactivamos*/
#barra-container{
    display:none;
    padding:0px;
    margin:0px;
    position:fixed;
    right:-130px;
    top:230px;
    width:210px;
    z-index: 1100;
}

.barra li{ font-size: 25px !important;border: 1px solid #ccc; border-radius: 8px; margin-top: 2px;list-style-type:none;background-color:#fff;color:#ccc;height:38px;padding:0px;margin:0px 0px 2px 0px;-webkit-transition:all 0.25s ease-in-out;-moz-transition:all 0.25s ease-in-out;-o-transition:all 0.25s ease-in-out;transition:all 0.25s ease-in-out;}
.barra li:hover{ margin-left:-95px;}
.barra li img{ float:left;}
.barra li p{padding-top:5px;margin:0px;line-height:16px;font-size:small;display: inline-block;}
.barra li i{margin-left: 5px;margin-right: 12px;}
.barra .selected {color: #1679bf !important}

@media (max-width:992px){

    #barra-container{
        padding:0px;
        padding-top: 4px;
        padding-bottom: 14px;
        margin:0px;
        position:fixed;
        right:0px;
        bottom:0px;
        top: auto;
        width: 100%;
        z-index: 1100;
        background-color: #ccc;
    }
    
    .barra ul {
        list-style: none;
        margin: 0;
        padding: 8px;
        display: inline-block;
    }
    .barra li {
        float: left;
        width: 37px;
        height: 35px;
        margin: 0;
        padding: 0;
    }
    .barra li p {
        display:none;
    }
    
}

/*enquestes*/
#formDades{
    display: block;
    font-size: 15px;
    margin-top:10px;
    margin-left:10px;
}



#divEnquesta{
    border: 1px solid #666666;
    display: none;
    margin: 10px;
    padding: 10px;
}

#divEnquesta .enquestaTitle{
    background-color: #FFFFFF;
    color: #1679bf;
    font-size: 12px;
    font-weight: bold;
    margin-bottom: 10px;
    padding: 4px;  
}

.enquestaCurs{
    border-bottom: 2px solid #337ab7 !important;
    font-weight: bold;
    color: #337ab7;
    margin-bottom: 10px;
}

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

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

/* iCheck plugin Square skin, red
----------------------------------- */
#divEnquesta .icheckbox_square-red,
#divEnquesta .iradio_square-red, 
#divBescanviable .icheckbox_square-red,
#divBescanviable .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;
    z-index:99;
}

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

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

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

#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;*/

}
#formDadesCamps .oblig, #formDades .oblig{
    font-weight: bold !important;
}
.oblig-2{
    font-size:12px;
    font-weight: bold !important;
    text-align: left;
    padding-left: 5px; 
    /*width: 160px;*/
    padding: 4px;
    border-radius: 5px;
}

.text-oblig{
	font-weight: bold; 
	padding-left:8px;
}


.not-oblig{
	font-weight: normal; 
	padding-left:8px;
}

.text-mida{
	width: 50%;
}
@media (max-width: 450px) { 
    .text-mida{
		width: 100%;
    }
 }
 
.validate_ok_enquesta{
    float: right;
    margin-right: 6px;
    margin-top: -35px;
    position: relative;
    z-index: 2;
    color:green;
}

.validate_ko_enquesta{
    float: right;
    margin-right: 6px;
    margin-top: -35px;
    position: relative;
    z-index: 2;
    color:red;
}

.validate_ok_enquesta_text_area{
    float: right;
    margin-left: 2px;
    position: relative;
    z-index: 2;
    color:green;
}

.validate_ko_enquesta_text_area{
    float: right;
    margin-left: 2px;
    position: relative;
    z-index: 2;
    color:red;
}

.validate_ko_enquesta_radio_button{
	margin-left: 3px;
    margin-top: 3px;
    position: relative;
    color: red;
}

.tab{
	outline:none;
}

@media (min-width: 990px) and (max-width: 1200px) {
    .header-logo{
       object-fit: contain;
    }
}

/*estils kutxakide*/

#divBescanviable{
    margin-bottom:25px;
    height: 155px;
}

.bescanviKxK{
    margin-right: 5%;
    margin-left: 5%;
}

.bescanviKxK .tarifaKxK{
    margin-top:10px;
    padding-left:15px;
}

.tarifaKxK div{
    padding-top:18px;
}

.tarifaKxK .descrip{
    height:65px;
    border: 1px solid #ddd;
    border-right-width: 0px;
}

.tarifaKxK .descrip span{
    font-size: 28px;
    position: relative;
    top: 5px;
    padding-right:10px;
    cursor:pointer;
    color: #1679bf;
}

.tarifaKxK select{
    width: 100%;
    height: 100%;
    border: none;
    padding-left: 10%;
    border-left:1px solid #ddd;
}

.tarifaKxK .precio{
    height: 65px;
    border-bottom: 1px solid #ddd;
    border-top: 1px solid #ddd;
}

.tarifaKxK .unidades{
    height:65px;
    border-bottom: 1px solid #ddd;
    border-top: 1px solid #ddd;
    border-right: 1px solid #ddd;
}

#divTextIdentifKxK{
    color: #000000;
    text-align:center;
}

#loginKutxakide{
    width:100%;
}


.horarios .col-lg-1{
    width:11.3333% !important;
}

.filtros .col-lg-1{
    width:24% !important;
}

@media (max-width: 1625px) { 
    .filtros .col-lg-1{
        width:26% !important;
    }
}

@media (max-width: 1500px) { 
    .filtros .col-lg-1{
        width:28% !important;
    }
}

@media (max-width: 1395px) { 
    .filtros .col-lg-1{
        width:33% !important;
    }
}

@media (max-width: 1185px) { 
    .filtros .col-lg-1{
        width:35% !important;
    }
}

@media (max-width: 1120px) { 
    .filtros .col-lg-1{
        width:38% !important;
    }
}

@media (max-width: 1025px) { 
    .filtros .col-lg-1{
        width:45% !important;
    }
}

@media (max-width: 870px) { 
    .filtros .col-lg-1{
        width:90% !important;
    }
    .filtros .row {
        display: block;
    }
}

@media (max-width: 1670px) { 
    .horarios .col-lg-1{
        width:13.3333% !important;
    }
}

@media (max-width: 1430px) { 
    .horarios .col-lg-1{
        width:16.3333% !important;
    }
}

@media (max-width: 1160px) { 
    .horarios .col-lg-1{
        width:19.3333% !important;
    }
}

@media (max-width: 985px) { 
    .horarios .col-lg-1{
        width:22.3333% !important;
    }
}

@media (max-width: 850px) { 
    .horarios .col-lg-1{
        width:25.3333% !important;
    }
}

@media (max-width: 670px) { 
    .horarios .col-lg-1{
        width:33.3333% !important;
    }
}

@media (max-width: 510px) { 
    .horarios .col-lg-1{
        width:46.3333% !important;
    }
}


/*MOVIL*/

@media (max-width: 480px) { 
    .loading {
        left:36% !important;
    }
}

@media (max-width:750px) {
    .lineas {
        margin-bottom: 0px !important;
    }
    #divSales {
        width: 100% !important;
    }
    #divSales1 {
        width: 100% !important;
        position:relative !important;
        display:block !important;
        left: 0px !important;
        top: 0px !important;
        padding: 0px !important;
        min-height: 100px !important;
    }
    
    #divSales2 {
        width: 100% !important;
        position:relative !important;
        display:block !important;
        left: 0px !important;
        top: 0px !important;
        padding: 0px !important;
        padding-bottom: 12px !important;
    }

}

@media (min-width: 751px) and (max-width: 1100px) { 
    #divSales {
        width: 75% !important;
    }
    
    #divSales1 {
        width: 54% !important;
        position:relative !important;
        display:block !important;
        left: 0px !important;
        top: 0px !important;
        padding: 0px !important;
        min-height: 100px !important;
    }
    
    #divSales2 {
        width: 45% !important;
        position:relative !important;
        display:block !important;
        left: 0px !important;
        top: 0px !important;
        padding: 0px !important;
        padding-bottom: 12px !important;
    }	
}

@media (max-width: 767px) {
    body{
        font-size:14px;
    }
    .main-content-wrapper{
        width: 90%;
    }
    .button_general,.button_general_sug{
        margin-left:0px !important;
        width:100% !important;
    }
    .button_next,.button_next_disabled, .button_recup{
        margin-left:0px !important;
        width:100% !important;
    }
    .navbar-header button{
        display:block;
    }
}
 
@media (min-width: 768px) and (max-width: 992px) { 
    .button_general,.button_general_sug{
        width:50% !important;
    }
    .button_next,.button_next_disabled, .button_recup{
        width:50% !important;
    }
}

@media (max-width: 992px) {
    header{
        margin-bottom: 50px;
    }
}

@media (max-width: 920px) { 
    #divTextIdentifKxK{
        float: none;
        position: relative;
        right: 0px;
        top: 12px;  
        clear:both;
        color: #000000;
    }
    
    #loginKutxakide{
        padding: 0px;
    }    
}