.caja-horas #capa_tramos .hora {
    padding: 6px 12px;
}

.caja-horas #capa_tramos .hora label {
    font-weight: inherit;
    font-size: 11pt
}

.caja-horas #capa_tramos .hora .precio {
    font-weight: normal;
    font-size: 10pt
}

.caja-horas #capa_tramos .hora .hora_valle {
    width: 25px;
    height: 25px;
    right: -3px;
    top: 15px;
    position: absolute;
}

.leyenda ul li span.hora_valle, .caja-horas #capa_tramos .hora .hora_valle {
    background-color: transparent;
    color: #F7A600;
}

div.hora.promo {
    border-color: #008bd2 !important;
    background-color: #008bd2;
    color: #ffffff!important;
}
div.hora.promo label, div.hora.promo div.precio {
    color: #ffffff!important;
}

div.hora.normal {
    border-color: #98d6f6 !important;
    background-color: #98d6f6;
    color: #15153e!important;
}
div.hora.normal label, div.hora.normal div.precio {
    color: #15153e!important;
}

div.hora.cara {
    border-color: #d1ecfa !important;
    background-color: #d1ecfa;
    color: #15153e!important;
}
div.hora.cara label, div.hora.cara div.precio {
    color: #15153e!important;
}

div.hora.vacio {
    border-color: #fefefe !important;
    background-color: #fefefe;
    color: #c7c7c7!important;
}
div.hora.vacio label, div.hora.vacio div.precio {
    color: #c7c7c7!important;
}

.caja-horas #capa_tramos .hora.active {
    color: #ffffff!important;
    background-color: #15153e!important;
}
.caja-horas #capa_tramos .hora.active label, .caja-horas #capa_tramos .hora.active .precio {
    color: #ffffff!important;
    background-color: #15153e!important;
}

.caja-horas #capa_tramos .hora.vacio {
    cursor: inherit;
}

.estado-cerrado, #capa_calendario .ui-datepicker table.ui-datepicker-calendar tbody tr td .ui-state-default, #capa_calendario .ui-datepicker table.ui-datepicker-calendar tbody tr td.cerrada .ui-state-default, .leyenda ul li span.cerrada {
    border-radius: inherit;
}

#capa_calendario .ui-datepicker .ui-datepicker-header .ui-datepicker-title {
    background: #f5f5f5;
    border: none;
}

#capa_calendario .ui-datepicker .ui-datepicker-header {
    color: #000000;
}

#capa_calendario .ui-datepicker .ui-datepicker-header .ui-datepicker-prev, #capa_calendario .ui-datepicker .ui-datepicker-header .ui-datepicker-next {
    background-color: #f5f5f5;
}

#capa_calendario .ui-datepicker .ui-datepicker-header .ui-datepicker-title {
    text-transform: inherit;
}

#capa_calendario .ui-datepicker .ui-datepicker-header .ui-datepicker-prev span, #capa_calendario .ui-datepicker .ui-datepicker-header .ui-datepicker-next span {
    color: #F7A600;
}

#capa_calendario .ui-datepicker table.ui-datepicker-calendar thead tr th, #capa_calendario .ui-datepicker table.ui-datepicker-calendar thead tr th span {
    color: #7f7f7f;
    font-weight: bold;
}

#capa_calendario .ui-datepicker table.ui-datepicker-calendar tbody tr td .ui-state-default {
    background-color: #ffffff;
    border: 1px solid #ffffff;
}

.estado-disponible, #capa_calendario .ui-datepicker table.ui-datepicker-calendar tbody tr td.disponible .ui-state-default, .leyenda ul li span.disponible {
    background-color: #e0f0fe;
    color: #0c99eb;
    font-weight: bold;
    border: 1px solid #e0f0fe;
}

.estado-activo, #capa_calendario .ui-datepicker table.ui-datepicker-calendar tbody tr td.disponible .ui-state-active {
    background-color: #0c99eb;
    border: 1px solid #0c99eb;
    font-weight: bold;
    color: #ffffff;
}

#capa_calendario .ui-datepicker table.ui-datepicker-calendar tbody tr td.cerrada .ui-state-default {
    border: 1px solid #ffffff;
    background-color: #ffffff;
    text-align: center;
    color: #0c99eb;
}

.caja-horas #fecha_hoy {
    color: #000;
    font-weight: inherit;
    text-align: left;
}

div.leyenda.leyenda_horas {
    color: #868686;
}

.leyenda ul li span.ultimas {
    background-color: #F7A600;
    color: #0c99eb;
    font-weight: bold;
    border: 1px solid #F7A600;
}

/* #capa_calendario table.ui-datepicker-calendar thead tr th {
    padding-top: 1.5rem!important;
    padding-bottom: 1.5rem!important;
} */

#capa_calendario table.ui-datepicker-calendar thead tr th, #capa_calendario table.ui-datepicker-calendar tbody tr td {
    padding: 0px!important;
    margin: 0px!important;
    width: 62px!important;
    height: 62px!important;
    display: table-cell;
}
#capa_calendario table.ui-datepicker-calendar thead tr th a, #capa_calendario table.ui-datepicker-calendar tbody tr td a {
    padding: 0px!important;
    margin: 0px!important;
    line-height: 62px!important;
    width: 62px!important;
    height: 62px!important;
    display: table-cell;
}
#capa_calendario table.ui-datepicker-calendar thead tr th span, #capa_calendario table.ui-datepicker-calendar tbody tr td span {
    padding: 0px!important;
    margin: 0px!important;
    line-height: 62px!important;
    width: 62px!important;
    height: 62px!important;
    display: table-cell;
}

.leyenda ul li {
    border: none;
}

.caja-horas #capa_tramos .hora {
    width: 97px;
}

div#capa_tramos .nav-pills a {
    color: #000;
    border: 1px solid #000;
}

div#capa_tramos .nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: #fff;
    background-color: #000;
}


.caja-horas #pills-morning .h {
    display:flex;
    justify-self:center;
    align-self:start;
    flex-flow:row wrap;
    justify-content:left
}
@media (min-width: 575.98px) {
    .caja-horas #pills-morning .h {
        justify-content:flex-start
    }
}
.caja-horas #pills-evening .h {
    display:flex;
    justify-self:center;
    align-self:start;
    flex-flow:row wrap;
    justify-content:center
}
@media (min-width: 575.98px) {
    .caja-horas #pills-evening .h {
        justify-content:flex-start
    }
}

.caja-horas #capa_tramos .hora label {
    font-weight:700;
    font-size:12pt;
    line-height:10pt;
    margin-bottom:0
}
.caja-horas #capa_tramos .hora input[type=radio] {
    position:absolute;
    opacity:0;
    cursor:pointer;
    height:0;
    width:0
}

.caja-horas #capa_tramos .hora .precio {
    white-space:nowrap;
    font-size:11pt;
    color:#898989;
    text-align:center;
    line-height:12pt
}

.caja-horas #capa_tramos .hora {
    color: #898989;
    text-align: center;
    font-size: 11pt;
    line-height: 12pt;
    cursor: pointer;
  }

  .caja-horas #capa_tramos .hora {
    width: 100px;
    color: #898989;
    border: 1px solid #898989;
      border-top-color: rgb(137, 137, 137);
      border-right-color: rgb(137, 137, 137);
      border-bottom-color: rgb(137, 137, 137);
      border-left-color: rgb(137, 137, 137);
    border-radius: 15px;
    text-align: center;
    font-size: 11pt;
    line-height: 12pt;
    padding: 12px;
    margin: 5px;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer;
  }

  .caja-horas #capa_tramos .hora .precio {
    white-space: nowrap;
    font-size: 11pt;
    color: #898989;
    text-align: center;
    line-height: 12pt;
  }

  @media (min-width: 576px) {
    .caja-horas #capa_tramos .hora {
        width: 97px;
    }
  }

/* ESPECIFICO HELPFLASH */
#modal_helpflash .modal-content {
    background-color: transparent;
    border: none;
    top: 0;
}
#modal_helpflash .hp-image {
    position: relative;
    text-align: center;
}
#modal_helpflash .hp-image .enlace {
    position: absolute;
    top: 39%;
    width: 100%;
    height: 40px;
}
#modal_helpflash .hp-image .precio p {
    position: absolute;
    bottom: 33%;
    width: 100%;
    color: black;
    left: 32%;
    font-weight: bold;
    font-size: 22px;
}
#modal_helpflash .hp-image .boton1 {
    position: absolute;
    bottom: 12%;
    width: 100%;
    color: black;
    font-weight: bold;
    text-align: right;
    font-size: 20px;
    padding-bottom: 2px;
}
#modal_helpflash .hp-image .boton1 p {
    width: 100%;
    color: black;
    font-weight: bold;
    text-align: right;
    font-size: 15px;
    padding-right: 21%;
    margin-bottom: -2px;
}

#modal_helpflash .hp-image .boton2 {
    position: absolute;
    bottom: 6%;
    width: 100%;
}
#modal_helpflash .hp-image .boton3 {
    position: absolute;
    right: -35%;
    bottom: 85%;
    color: white;
    width: 100%;
}
#modal_helpflash .hp-image .textocabhelpflash
{
	position: absolute;
    right: 0;
    bottom: 92%;
    color: black;
    width: 100%;
	font-size: 0.9rem;
    font-weight: bold;
}
@media (max-width: 767px) {
    #capa_calendario table.ui-datepicker-calendar thead tr th, #capa_calendario table.ui-datepicker-calendar tbody tr td {
        padding: 0px!important;
        margin: 0px!important;
        width: 50px!important;
        height: 50px!important;
        display: table-cell;
    }
    #capa_calendario table.ui-datepicker-calendar thead tr th a, #capa_calendario table.ui-datepicker-calendar tbody tr td a {
        padding: 0px!important;
        margin: 0px!important;
        line-height: 50px!important;
        width: 50px!important;
        height: 50px!important;
        display: table-cell;
    }
    #capa_calendario table.ui-datepicker-calendar thead tr th span, #capa_calendario table.ui-datepicker-calendar tbody tr td span {
        padding: 0px!important;
        margin: 0px!important;
        line-height: 50px!important;
        width: 50px!important;
        height: 50px!important;
        display: table-cell;
    }
    #capa_calendario .ui-datepicker table.ui-datepicker-calendar tbody tr td .ui-state-default {
        /*margin-bottom: 10px!important;*/
    }
    #modal_helpflash .hp-image .enlace {
        position: absolute;
        top: 35%;
        width: 100%;
        height: 40px;
    }
    #modal_helpflash .hp-image .boton1 {
        position: absolute;
        bottom: 13%;
        width: 100%;
        color: black;
        font-weight: bold;
        text-align: right;
        font-size: 18px;
        height: 52px;
		padding-right:13px;
    }
    #modal_helpflash .hp-image .boton1 p {
        width: 100%;
        color: black;
        font-weight: bold;
        text-align: right;
        font-size: 16px;
        padding-right: 25%;
        padding-top: 11%;
    }
    #modal_helpflash .hp-image .boton2 {
        position: absolute;
        bottom: 5%;
        width: 100%;
    }
    #modal_helpflash .hp-image .boton3 {
        position: absolute;
        right: -35%;
        bottom: 88%;
        color: white;
        width: 100%;
    }
    #modal_helpflash .hp-image .precio p {
        position: absolute;
        bottom: 35%;
        width: 100%;
        color: black;
        left: 37%;
        font-weight: bold;
        font-size: 16px;
    }
	#modal_helpflash .hp-image .textocabhelpflash {
		position: absolute;
		right: 0;
		bottom: 94%;
		color: black;
		width: 100%;
		font-size: 0.7rem;
		font-weight: bold;
	}	
}



/* ESPECIFICO HELPFLASH */
#modal_confirmar_calendario .modal-content {
    background-color: transparent;
    border: none;
    top: 0;
}
#modal_confirmar_calendario .hp-image {
    position: relative;
    text-align: center;
}
#modal_confirmar_calendario .hp-image .enlace {
    position: absolute;
    top: 39%;
    width: 100%;
    height: 40px;
}
/*
#modal_confirmar_calendario .hp-image .precio p {
    position: absolute;
    bottom: 33%;
    width: 100%;
    color: black;
    left: 32%;
    font-weight: bold;
    font-size: 22px;
}
    */
#modal_confirmar_calendario .hp-image .boton1 {
    position: absolute;
    bottom: 14%;
    width: 100%;
    color: black;
    font-weight: bold;
    text-align: right;
    font-size: 20px;
    padding-bottom: 2px;
}
#modal_confirmar_calendario .hp-image .boton1 p {
    width: 100%;
    color: black;
    font-weight: bold;
    text-align: right;
    font-size: 15px;
    padding-right: 21%;
    margin-bottom: -4px;
}

#modal_confirmar_calendario .hp-image .boton2 {
    position: absolute;
    bottom: 6%;
    width: 100%;
}
#modal_confirmar_calendario .hp-image .boton3 {
    position: absolute;
    right: -35%;
    bottom: 90%;
    color: white;
    width: 100%;
}
#modal_confirmar_calendario .hp-image .form-group {
    position: absolute;
    width: 100%;
    margin: 0px!important;
    padding: 0px!important;
    height: auto;
}
#modal_confirmar_calendario .hp-image .form-group label {
    color: #15153E;
    text-align: center;
    margin:0px;
}
#modal_confirmar_calendario .hp-image .form-group p {
    color: #FFF;
    text-align: center;
    padding: 0px;
    font-size: 1.25em;
    line-height: 1.2em;
    width: 75%;
    margin: 0 auto;
}
#modal_confirmar_calendario .hp-image .form-group.vehiculo {
    background-image: none;
    top: 55px;
}
#modal_confirmar_calendario .hp-image .form-group.estacion {
    background-image: none;
    top: 150px;
}
#modal_confirmar_calendario .hp-image .form-group.fecha {
    background-image: none;
    top: 215px;
}
#modal_confirmar_calendario .hp-image .form-group.precio {
    background-image: none;
    top: 310px;
}
#modal_confirmar_calendario .hp-image .form-group.btn-ok {
    background-image: none;
    top: 430px;
}
#modal_confirmar_calendario .hp-image .from-group.btn-ok button {
    background-color: #15153E;
    border-color: #15153E;
}
#modal_confirmar_calendario .hp-image .form-group.btn-ko {
    background-image: none;
    top: 500px;
}
#modal_confirmar_calendario .hp-image .form-group.btn-ok div, #modal_confirmar_calendario .hp-image .form-group.btn-ko div {
    width: 65%;
    margin: 0px auto;
}
@media (max-width: 767px) {
    #modal_confirmar_calendario .hp-image .enlace {
        position: absolute;
        top: 35%;
        width: 100%;
        height: 40px;
    }
    #modal_confirmar_calendario .hp-image .boton1 {
        position: absolute;
        bottom: 15%;
        width: 100%;
        color: black;
        font-weight: bold;
        text-align: right;
        font-size: 20px;
        height: 50px;
    }
    #modal_confirmar_calendario .hp-image .boton1 p {
        width: 100%;
        color: black;
        font-weight: bold;
        text-align: right;
        font-size: 16px;
        padding-right: 25%;
        padding-top: 11%;
    }
    #modal_confirmar_calendario .hp-image .boton2 {
        position: absolute;
        bottom: 8%;
        width: 100%;
    }
    #modal_confirmar_calendario .hp-image .boton3 {
        position: absolute;
        right: -35%;
        bottom: 93%;
        color: white;
        width: 100%;
    }
}



#capa_calendario .ui-datepicker table.ui-datepicker-calendar tbody tr td.ultimas a {
	background-image: url(../images/ultimas-plazas.png);
	background-repeat: no-repeat;
	background-position: top right;
	background-size: 40%;
}

.caja-horas::after, .caja-horas::before {
  display: none;
}
@media (max-width: 410px) {
  .caja-horas #capa_tramos .hora {
    width: 88px;
  }
}
.leyenda{
	position: relative;
}
#capa_tramos
{
	margin-top:0px!important;
}

#capa_calendario .ui-datepicker table
{
    width: auto!important;
}

