@charset "UTF-8";
@import "init.css";
@import "icons.css";
@import "jquery-ui.css";
@import "flickity.css";


/* Estructura */

/* html { font-size: 11px;} */

[class*=main-] { width: 100%;}

.scroll, .scroll.box-filter { overflow: scroll; -webkit-overflow-scrolling: touch;} 

.in-left { transform: translate3d(100%, 0, 0);}
.in-right { transform: translate3d(-100%, 0, 0);}
.in-top { transform: translate3d(0, -100%, 0);}
.in-bottom { transform: translate3d(0, 100%, 0);}
.in-over { transform: translate3d(100%, 0, 0); opacity: 0;}

.main-init { color: #FFF;}
.main-init .logo-img { width: 13rem;}
.main-init .item-empty { width: 3rem;}
.main-init .item-name { line-height: 2.6rem; text-transform: uppercase; font-size: 1.4rem; font-weight: 600; color: #555;}
.main-init .row-init-form { margin: 4rem 0;}
.main-init-in { color: #555; text-align: left;}

.main { position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: flex; flex-direction: column; z-index: 0;}

.main-head { background-color: #FFF; border-bottom: 1px solid #E7E7E7; min-height: 6.5rem; padding: 0 .5rem .5rem .5rem; display: flex; justify-content: space-between; align-items: flex-start;position: absolute; top: 0px; }
.main-head .logo { margin-bottom: .5rem; max-height:65px; max-width:85%; padding-top:40px;}
.main-head .logo span{  font-size: 2rem;font-weight: 600;font-family:'Source Sans Pro';    color: #444;}    
   
.main-head .btn-back { margin-left: -.3rem; margin-right: .3rem; margin-top: 40px; visibility: hidden; opacity: 0;}
.main-head .btn-conf, .main-head .no-visible, .no-visible { visibility: hidden; opacity: 0;}
.main-foot { background-color: #00BCDE; min-height: 4.5rem; display: flex; position:absolute; bottom: 0;}
.main-foot .btn-footer { width: 33.333%; border-left: .5px #01ADCB solid; border-right: .5px #01ADCB solid;}
.main-foot .btn-footer:first-child { border-left: none;} .main-foot .btn-footer:last-child { border-right: none;}

.main-cont { flex-grow: 1; height: 100%; position: fixed; top: 65px; }
.main-cont-box { background-color: #FFF; position: absolute; top: 0; bottom: 0;}
.main-cont-box-wrap { position: absolute; top: 0; bottom: 0; display: flex; flex-direction: column; background-color: #FFF;}
.main-cont-box-header { position: relative; min-height: 6.5rem; overflow: visible; z-index: 2;}
.main-cont-box-footer { position: absolute; min-height: 6rem; z-index: 1; bottom: 110px;}
.main-cont-box-section { position: relative; flex-grow: 1; z-index: 1;}

.box-destino { opacity: 0; background-color: #000;}
.box-destino.active { opacity: 1;}

.popUp { position: absolute; top: 6.5em; left: 0; width: 100%; bottom: 4.5rem; background-color: rgba(200,200,200,.5);}

.main-cont-edit { position: absolute;}
.main-cont-filter { position: absolute;}


/* Cebeceras */

.main-cont-box-header .box-filter { position: absolute; top: 6.5rem; height: calc(100vh - 17.5rem); z-index: 2; padding: 0; width: 100%;}
.main-cont-box-header-boxTop { background-color: #FFF; border-bottom: 1px solid #E7E7E7; min-height: 6.5rem; padding-top: 1rem; padding-bottom: 1rem; z-index: 3;}
.main-cont-box-header-boxTop.header-boxTop-extra { z-index: 1; border: none;}

.header-boxTop-extra { width: 100%; right: 0;}
.header-boxTop-extra .txt-l { margin-bottom: 0;}

.header-boxTop-extra.box-over.active { width: auto; position: absolute; top: 6.5rem; background: transparent; }

.box-actions { margin-right: -.25rem;}
.box-actions .btn-icon { margin-left: .5rem;}
.box-actions .btn-icon:first-child { margin-left: 0;}

.box-point img { width: 2.4rem;}


/* Footers */

.main-cont-box-footer-boxbottom { background-color: #FFF; border-top: 1px solid #E7E7E7; min-height: 6rem; padding-top: 1rem; padding-bottom: 1.5rem;}
.main-cont-box-footer-boxbottom [class*="btn-"] { margin: 0 .5rem;}

.main-cont-box-footer.box-over.active { position: absolute; bottom: 110px; width: 100%;}

.main-cont-box-footer.box-edit { position: absolute; bottom: 110px;}

[class*=boxbottom-extra] { padding-top: 0rem; padding-bottom: 0rem; min-height: 5rem;}
[class*=boxbottom-extra] .txt-l { margin-bottom: 0;}
.boxbottom-extra-m { min-height: 4rem;}
.boxbottom-extra-s { min-height: 3rem;}

.btn-m.btn-more-point { display: none;}

.box-carousel-edit-points { height: 5rem;} 
.box-carousel-edit-points .carousel-main { height: 4rem; margin-top: 1rem;}
.box-carousel-edit-points .carousel-main:after { content: ''; position: absolute; z-index: 0; bottom: .3rem; width: 100%; height: .3rem; background-image: linear-gradient(to right, #ECECEC 0%, #ECECEC 40%, #FFFFFF 40%, #FFFFFF 60%); background-position: top; background-size: 1.4rem .3rem; background-repeat: repeat-x;}
.box-carousel-edit-points .flickity-viewport { z-index: 1;}
.box-carousel-edit-points .flickity-prev-next-button { bottom: 50%; margin-bottom: -.9rem; z-index: 2; background-color: rgba(255,255,255,.5); border-radius: 50%;}
.box-carousel-edit-points .flickity-prev-next-button.previous { left: .5rem;}
.box-carousel-edit-points .flickity-prev-next-button.next { right: .5rem;}
.box-carousel-edit-points .carousel-cell { height: 100%; width: 50%; z-index: 1;}
.box-carousel-edit-points .carousel-cell .btn-icon-close { position: absolute; left: 1.5rem; top: 0; z-index: 2;}
.box-carousel-edit-points .carousel-cell .box-num-point { position: absolute; left: 3.3rem; top: 1.5rem; z-index: 1; width: 2.4rem; height: 2.4rem; text-align: center; padding: .4rem 0; color: #FFF;}
.box-carousel-edit-points .carousel-cell .txt-point { position: absolute; left: 6rem; bottom: 1.4rem; z-index: 1; line-height: 1.3rem; overflow: visible;}


/* Contenidos */

.boxTransparent { background-color: transparent; border-bottom: none; border-top: none;}
.main-cont-box-footer.box-over.active .btn-grey, 
.header-boxTop-extra.box-over.active .btn-gropu-item { color: #555555; background-color: #FFF;}
.header-boxTop-extra.box-over.active .btn-group-item { color: #555555; background-color: #FFF;}

.btn-virtual {
    width: 3rem;
    height: 3rem;
    background: #FFF;
    border-radius: 3rem;
    position: absolute;
    bottom: 0;
    right: 0;
    margin-bottom: 1rem;
    margin-right: 1rem;
}

.btn-virtual-place {
    width: 2rem!important;
    height: 2rem;
    float: left;
    margin-right: 5px;
    background-image: url(/img/icon-vr-black.png);
    background-size: contain;
}

.btn-s.active .btn-virtual-place {
    background-image: url(/img/icon-vr-white.png);
}

.boxNoBorder { border-bottom: none; border-top: none;}

.circle { border-radius: 50%; overflow: hidden;}

.box-img-user { background-color: #ECECEC; /* Hacer una imagen de sustitución */ }
.box-img-main:before { content: ''; display: block; width: 100%; padding-bottom: 62.5%; /* padding-bottom: 75%; */}
.box-img-main-user { filter: grayscale(100%);}
.box-img-main-user:before { content: ''; display: block; width: 100%; padding-bottom: 59.375%;}
.box-img-main-user:after { content: ''; display: block; position: absolute; width: 100%; height: 5rem; bottom: 0; left: 0; z-index: 2; background-image: url(../img/textura-blanco-user.png); background-size: 100% auto; background-position: top center;} 
.box-img-cuadro:before { content: ''; display: block; width: 100%; padding-bottom: 100%;}

.box-img-main-user-noFoto { position: absolute; top: 0; left: 0; height: 100%; width: 100%; background-color: #555555; color: #FFF; z-index: 1; }
.box-img-main-user-noFoto:before { content: ''; display: block; position: absolute; z-index: 0; top: 0; left: 0; height: 100%; width: 100%; background-image: url(../img/mystreetbook.jpg); background-size: cover; background-position: center; opacity: .75;}
.box-img-main-user-noFoto .btn-mas { display: block; margin: auto; border: .3rem solid rgba(255,255,255,.6); padding: 1.8rem; margin-bottom: 1rem;}
.box-img-main-user-noFoto .btn-mas:before { transform: rotate(45deg);}

.box-img-main-user.con-foto { background-color: #555555; }
.box-img-main-user.con-foto .box-img-cover img { opacity: .75; }
.box-img-main-user.con-foto .box-img-main-user-noFoto:before { display: none;}
.box-img-main-user.con-foto .box-img-main-user-noFoto { background-color: transparent; }

.box-img-main-user [type="file"] { position: absolute; top: 0; height: 100%; left: 0; width: 100%; opacity: 0; }

.box-img-cover { position: relative;}
.box-img-cover img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%;}

.box-grid { }
.box-grid-img img { border: solid #FFF 0.5px;}
.box-grid-img:nth-child(3n+0) img { border-right: 0;}
.box-grid-img:nth-child(3n+1) img { border-left: 0;}

.box-list { display: flex; flex-direction: column;}
.box-list-item { }
.box-list-item:after { position: absolute; bottom: 0; right: 1rem; left: 1rem; content: ''; height: 1px; display: block; background-color: rgba(0,188,222,.15);}
.box-list-item > [class*=box-list-item-] { margin: 1rem;}
.box-list-item .box-list-item-img, .box-in-pop-mapa .box-img-user { width: 6rem;}
.box-list-item .box-list-item-info { margin-left: .5rem;}

.box-title:after { position: absolute; bottom: 0; right: 1rem; left: 1rem; content: ''; height: 1px; display: block; background-color: rgba(0,188,222,.15);}
[class*=box-title].txt-m { line-height: 1.1em; margin-bottom: 0;}
.box-title.padd-2:after, .box-list-in .box-list-item:after { right: 2rem; left: 2rem;}

.box-list-item-point .box-list-item-img-point { position: relative; margin: 1rem 1rem 1rem 2rem;}
.box-list-item-point .box-list-item-img-point img, .box-list-item-point .box-list-item-img-point svg { width: 2.2rem; height: auto; position: relative; z-index: 1;}
.box-list-item-point .box-list-item-img-point strong { position: absolute; width: 100%; left: 0; top: .25rem; text-align: center; color: #FFF; z-index: 2;}
.box-list-item-point .box-list-item-info { margin: .7rem 0;}
.box-list-item-point .box-list-item-info .txt-l { line-height: 1.125em}
.box-list-item-point .box-list-item-close { margin: 1rem 2rem 1rem 1rem; visibility: hidden; opacity: 0;}

.box-list-item-point-between > div { margin: .1rem 0 .1rem 4.25rem;}
.box-list-item-point-between .icon-between:before { background-position-y: -12.6rem; transform: scale(.8) rotate(135deg); display: inline-block;}
.box-list-item-point-between .icon-between:after { background-position-y: -12.6rem; transform: scale(.8) rotate(-45deg); content: ''; display: inline-block; background-image: url(https://web.mystreetbook.es/img/icons-m.svg); background-size: 9rem auto; background-size: 9rem auto; width: 1.8rem; height: 1.8rem; position: relative; margin-left: -.9rem; background-position-x: -5.4rem; }
.box-list-item-point-between:nth-child(2) .icon-between:after { display: none;}
.box-list-item-point-between { max-height: 5rem;}
.box-list-item-point-between.no-display { max-height: 0; display: block; overflow: hidden;}

.box-more-points { display: none;}

.box-btns .btn-s { margin: 0 .2em;}
.box-btns .btn-m { margin: 0 .3em;}

.box-menu-perfil { border-top: 1px solid rgba(0,188,222,.15);}
.box-btn-filter { border-top: 1px solid rgba(255,255,255,.15);}

.box-incio-fin .info { display: inline-block; width: 4rem;}
.icon-marker-num { position: relative;}
.icon-marker-num strong { position: absolute; z-index: 2; width: 100%; top: .4rem; font-size: 1.2rem; text-align: center; color: #FFF;}

.popUp-box { position: absolute; top: 0; left: 0; right: 0; bottom: 0;}
.popUp-box:before { content: ''; display: block; position: absolute; z-index: 1; top: 0; left: 0; right: 0; bottom: 0; background: rgba(200,200,200,.5); background-image: url(../img/textura-blanco-min.png); background-position: center; background-size: auto 200%;}
.popUp-box.popUp-box-g { padding: 2rem 1rem;}
.popUp-box.popUp-box-p { padding: 2rem;}
.popUp-box-in { height: fit-content; position: relative; width: 100%;  z-index: 2; background: #FFF; border-radius: .5rem; border: 1px solid #ECECEC; box-shadow: 0 0 5px rgba(0,0,0,.3)}
.popUp-box-in .btn-icon-close { position: absolute; top: .1rem; right: .1rem; z-index: 5;}
.popUp-box-in .box-in { max-height: 100%; width: 100%;}
.popUp-box.popUp-box-g .popUp-box-in  { width: 100%;}
.popUp-box.popUp-box-g .popUp-box-in .box-in { width: 100%;}

.popUp-box-historia .popUp-box-in, 
.popUp-box-historia .popUp-box-in .box-in { max-height: calc(100% - 100px); top: -50px; }

.popUp-box-audio .popUp-box-in { min-height: 11rem;}
.popUp-box-audio .popUp-box-in .box-in { min-height: 8rem;}
 
.box-in-pop-mapa { position: relative; z-index: 2; background-color: #FFF;}
.box-in-pop-mapa .box-img-loc { width: 5rem; margin: .4rem .75rem .5rem 0;}

.popup-mapa { max-height: calc(100% - 100px); top: -50px; }
.popup-clone, .popup-save-place { max-height: calc(100% - 100px); top: -50px; }

#btn-anadir-puntos:focus, #btn-anadir-puntos:active, #btn-anadir-puntos:hover {
    color: #FFF !important;
    background-color: #555555 !important;
    border-color: #555555 !important;
}

#ui-datepicker-div {
    top: 130px!important;
}

[class*=box-slider] { position: relative;}
[class*=box-slider] .carousel-main { position: absolute; left: 0; top: 0; height: 100%; width: 100%; padding-bottom: 2.5rem;}
[class*=box-slider] .carousel-main .carousel-cell { height: 100%; width: 100%; background-color: #ECECEC;}
[class*=box-slider] .flickity-prev-next-button { bottom: .2rem; z-index: 2;}
[class*=box-slider] .flickity-prev-next-button.previous { left: .5rem;}
[class*=box-slider] .flickity-prev-next-button.next { right: .5rem;}
[class*=box-slider] .flickity-page-dots { z-index: 1;}

.box-slider-cont-noNav .carousel-main { position: absolute; left: 0; top: 0; height: 100%; width: 100%; padding-bottom: 1.5rem;}
.box-slider-cont-noNav .flickity-page-dots { bottom: .1rem;}

.box-mapa { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #ECECEC;}
.box-mapa, .box-mapa * { overflow: initial; border: 0!important; }
.box-mapa .circle { overflow: hidden; }
.box-mapa img { max-width: none !important}
.box-mapa:before { content: ''; position: absolute; left: 50%; top: 50%; margin: -2.4rem 0 0 -2.4rem; width: 4.8rem; height: 4.8rem; background: url(https://web.mystreetbook.es/img/icons-l.svg); background-position: -9.6rem -57.6rem; background-size: 24rem auto; animation: fadeinout infinite 3s; }

.topics { padding: 0 0 1rem 0;}
.topics strong:after { content: ','}
.topics strong:last-child:after { content: '.'}

.box-audio audio { width: 100%; height: 4rem;}


/* Loading */

.loading { z-index: 5; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: #FFF; background-image: url(../img/carga.gif); background-size: 20px 20px; background-position: center; background-repeat: no-repeat;}
.loading.loader {opacity: 0.8;}

/* Componentes */

.row-form { position: relative; margin: .5rem 0; overflow: visible;}
.row-form label, .row-form input, .row-form textarea, .row-form select, .row-form .box-select { position: relative; z-index: 1;}
.row-form label { display: block;}
input, textarea, select, .box-select { display: block; width: 100%; height: 3.4rem; border: 1.5px solid #ECECEC; border-radius: .5rem; padding: .5rem 1.5rem; background: transparent; font-family: 'Source Sans Pro', sans-serif; font-size: 1.6rem; font-weight: 400; color: #555555;}
textarea { resize: vertical; -moz-resize: vertical; min-height: 6rem;}
.input-s { height: 2.4rem; padding: .2rem 1rem; font-size: 1.2rem;}
.textarea-s { height: 3.2rem; min-height: 3.2rem; padding: .2rem 1rem; font-size: 1.2rem;}

input[type="checkbox"], input[type="radio"] { margin-right: .5rem; vertical-align: top;}
input[type="checkbox"]:checked { background-image: url(https://web.mystreetbook.es/img/icons-m.svg); background-position: -0.2rem -7.4rem; background-size: 9rem auto;}
input[type="radio"]:checked { background-image: url(https://web.mystreetbook.es/img/icons-m.svg); background-position: -0.2rem -23.6rem; background-size: 9rem auto;}

.row-form-pass input[type=password] { padding-left: 3.3rem;}
.row-form-pass:before { content: ''; display: block; position: absolute; z-index: 0; width: 1.8rem; height: 1.8rem; top: .75rem; left: .75rem; background-image: url(https://web.mystreetbook.es/img/icons-m.svg); background-size: 9rem auto; background-position: -5.4rem -10.8rem;}

.row-form-select select { padding-right: 3.3rem;}
.row-form-select:before { content: ''; display: block; position: absolute; z-index: 0; width: 1.8rem; height: 1.8rem; top: .75rem; right: .75rem; background-image: url(https://web.mystreetbook.es/img/icons-m.svg); background-size: 9rem auto; background-position: -5.4rem 0rem; transform: rotate(90deg);}

.row-form-loc { position: relative; z-index: 4; } 

.box-select { padding-right: 3.3rem; overflow: visible;}
.box-select:before { content: ''; position: absolute; right: .9rem; top: .7rem; left: auto; background-image: url(https://web.mystreetbook.es/img/icons-m.svg); background-size: 9rem auto; background-position: -3.6rem 0rem; background-color: transparent; width: 1.8rem; height: 1.8rem; padding: 0; z-index: 10; border: 0; -webkit-transform: rotate(90deg); transform: rotate(90deg);}
.box-select-info { display: none; position: absolute; left: 0; top: 100%; width: 100%; overflow: visible; margin-bottom:50px;}
.box-select-info .ui-menu-item-wrapper.active { background-color: rgba(255,255,255,.25);}
.box-select.active .box-select-info { display: block; overflow:scroll;}


::-webkit-input-placeholder { color: #BBBBBB;}
input:focus::-webkit-input-placeholder, textarea:focus::-webkit-input-placeholder { color: transparent;}

.btn-l, .btn-m, .btn-s { display: inline-block; color: #00BCDE; background-color: #FFF; text-transform: uppercase; font-weight: 600; text-align: center;}
.btn-l { min-width: 22rem; height: 4rem; line-height: 2.2em; padding: 0rem 2.5rem; border-radius: 2rem; border: 2px solid #00BCDE; font-size: 1.6rem;}
.btn-m { min-width: 12rem; height: 3.4rem; line-height: 2.2em; padding: 0rem 1.7rem; border-radius: 1.7rem; border: 1.5px solid #00BCDE; font-size: 1.4rem;}
.btn-s { min-width: 6.5rem; height: 2.4rem; line-height: 1.7em; padding: 0rem 1.5rem; border-radius: 1.2rem; border: 1.5px solid #00BCDE; font-size: 1.2rem;}

.btn-blue { border-color: #00BCDE; color: #FFF; background-color: #00BCDE;}
.btn-white { border-color: #FFF; color: #555555; background-color: #FFF;}
.btn-white-transparent { border-color: #FFF; color: #FFF; background-color: transparent;}
.btn-grey { border-color: #ECECEC; color: #555555; background-color: #ECECEC;}

.btn-group { display: flex; align-items: center; justify-content: center;}
.btn-group { text-transform: uppercase; font-size: 1.4rem; font-weight: 600; margin-bottom: 0;}
.btn-gropu-item { height: 3.4rem; line-height: 3.4rem; padding: 0 1.2rem; background-color: #ECECEC; margin: 0 .5px; text-align: center;}
.btn-gropu-item:first-child { border-radius: 5px 0 0 5px; margin-left: 0;} 
.btn-gropu-item:last-child { border-radius: 0 5px 5px 0; margin-right: 0;}
.btn-group-item { height: 3.4rem; line-height: 3.4rem; padding: 0 1.2rem; background-color: #ECECEC; margin: 0 .5px; text-align: center;}
.btn-group-item:first-child { border-radius: 5px 0 0 5px; margin-left: 0;} 
.btn-group-item:last-child { border-radius: 0 5px 5px 0; margin-right: 0;}

.btn-group-icons { justify-content: flex-end;}
.btn-group-icons .btn-gropu-item { width: 3.4rem; padding: 0;}
.btn-group-icons .btn-group-item { width: 3.4rem; padding: 0;}

.stars-s { min-width: 7rem;}
.stars-m { min-width: 10rem;}
.stars-l { min-width: 12rem;}
.stars-s .star-s { display: inline-block; height: 1rem;	width: 1rem; background-image: url(https://web.mystreetbook.es/img/icons-s.svg); background-position: -3rem -7rem; background-size: 5rem auto;}
.stars-m .star-m { display: inline-block; height: 1.8rem; width: 1.8rem; background-image: url(https://web.mystreetbook.es/img/icons-m.svg); background-position: -5.4rem -16.2rem; background-size: 9rem auto;}
.stars-l .star-l { display: inline-block; height: 2.4rem; width: 2.4rem; background-image: url(https://web.mystreetbook.es/img/icons-l.svg); background-position: -7.2rem -21.6rem; background-size: 12rem auto;}

.stars-l.clasificacion { display: inline-block; direction: rtl; unicode-bidi: bidi-override;}
.stars-l.clasificacion input[type = "radio"] { display: none; height: 2.4rem; width: 2.4rem;}
.stars-l.clasificacion label { background-image: url(https://web.mystreetbook.es/img/icons-l.svg); background-position: -7.2rem -21.6rem; background-size: 12rem auto;}
.stars-l.clasificacion label:hover,
.stars-l.clasificacion label:hover ~ label { background-position: -9.6rem -21.6rem;}
.stars-l.clasificacion input[type = "radio"]:checked ~ label { background-position: -9.6rem -21.6rem;}

.icon-euros .icon-euro { display: inline-block; height: 2.4rem; width: 2.4rem;}

.icon-euros.clasificacion { display: inline-block; direction: rtl; unicode-bidi: bidi-override;}
.icon-euros.clasificacion input[type = "radio"] { display: none; height: 2.4rem; width: 2.4rem;}
.icon-euros.clasificacion label { background-image: url(https://web.mystreetbook.es/img/icons-l.svg); background-position: -7.2rem -48rem; background-size: 12rem auto;}
.icon-euros.clasificacion label:hover,
.icon-euros.clasificacion label:hover ~ label { background-position: -9.6rem -48rem;}
.icon-euros.clasificacion input[type = "radio"]:checked ~ label { background-position: -9.6rem -48rem;}
.icon-euros.clasificacion label.icon-l:before { display: none;}

.box-filter { padding: 2rem; color: #FFF; overflow: visible; background-color: rgba(87,214,237,.7); background-image: url(../img/textura-azul-min.png); background-position: center; background-size: 300% auto;}
.box-filter.box-filter-s { padding: 3rem;}
.box-filter .row-form { margin: .5rem 0 1rem 0;}
.box-filter ::-webkit-input-placeholder,
.box-filter input, .box-filter textarea, .box-filter .box-select { color: #FFF; border-color: transparent;}
.box-filter input[type=checkbox] { border-color: #FFF; }
.box-filter input[type="checkbox"]:checked { background-position: -3.8rem -7.4rem;}
.box-filter input.datepicker, .custom-combobox .ui-widget-content, .box-filter .box-select { background-color: rgba(255,255,255,.23);}
.box-filter .row-form-date { position: relative; margin-top: 5rem;}
.box-filter .row-form-date:before { content: ''; display: block; position: absolute; z-index: 0; width: 2.4rem; height: 2.4rem; top: .4rem; right: .6rem; background-image: url(https://web.mystreetbook.es/img/icons-l.svg); background-size: 12rem auto; background-position: -4.8rem -4.8rem;}
.box-filter-box .box-filter-box-item .img-item { width: 2.4rem; margin: 0 .4rem 0 .2rem;}
.box-filter-box .box-filter-box-item input[type=checkbox] { margin: .2rem 1.2rem 0 .5rem;}
.box-filter-box .box-filter-box-item strong { display: inline-block;}

.box-filter .btn-s { background: transparent; border: 1.5px solid #FFF; color: #FFF;}
.box-filter .btn-gropu-item { background-color: rgba(255,255,255,.23); color: #FFF; padding: 0 1rem;}
.box-filter .btn-group-item { background-color: rgba(255,255,255,.23); color: #FFF; padding: 0 1rem;}
.box-filter .box-filter-title input { margin: .6rem .7rem .6rem .6rem;}

.box-filter-search.box-filter.box-filter-s { max-height: 0; padding-top: 0rem; padding-bottom: 0rem; overflow: hidden;}
.box-filter-search .box-filter-title { margin-bottom: .5rem;}

.box-patrocinadores {text-align: center; padding-top: 2rem; margin-bottom: 220px;}
.box-patrocinadores .secondary { display: flex; margin-right: -5%; }
.box-patrocinadores .secondary img{ max-width: 100%; max-height: 100%; }
.box-patrocinadores .secondary div{ flex: 1; height: 20vh; align-items: center; display: flex; margin-right: 5%; }

.box-calendar {}

.ui-datepicker { text-align: center; color: #555555;}
.ui-datepicker td { padding: 0;}
.ui-datepicker td, 
.ui-datepicker td span, 
.ui-datepicker td a { color: #555; text-align: center; font-weight: 600;}
.ui-datepicker th { color: #555; text-align: center; font-weight: 700;}
.ui-datepicker .ui-datepicker-year { font-weight: 400;}
.ui-datepicker td a { height: 3rem; width: 3rem; line-height: 2.5rem; padding: 0; text-align: center; display: inline-block; border-radius: 50%;}
.ui-datepicker .ui-state-highlight, 
.ui-datepicker .ui-widget-content .ui-state-highlight, 
.ui-datepicker .ui-widget-header .ui-state-highlight { border: 1.5px solid rgba(85,85,85,.3); color: #555;}
.ui-datepicker .ui-datepicker-prev, 
.ui-datepicker .ui-datepicker-next { position: absolute; top: 0px; width: 3.4rem; height: 3.4rem;}
.ui-datepicker .ui-datepicker-prev { left: 0;} 
.ui-datepicker .ui-datepicker-next { right: 0;}
.ui-datepicker .ui-datepicker-prev span, 
.ui-datepicker .ui-datepicker-next span { display: block; position: absolute; width: 1.8rem; height: 1.8rem; left: 50%; top: 50%; margin: 0; transform: translate(-50%, -25%); background-image: url(https://web.mystreetbook.es/img/icons-m.svg); background-size: 9rem auto; background-position: 0rem 0rem;}
.ui-datepicker .ui-datepicker-prev span { transform: translate(-50%, -25%) rotate(180deg);}
.ui-datepicker .ui-state-active, 
.ui-datepicker .ui-widget-content .ui-state-active { border: 1.5px solid rgb(0,188,222); color: rgb(0,188,222) }

.box-filter .ui-datepicker.ui-widget-content.ui-widget { background-color: rgb(115,248,255); background-image: url(../img/textura-azul-min.png); background-position: center; background-size: 200% auto; border: 0; border-radius: .6em; box-shadow: 0px 2px 10px rgba(0,0,0,.3);}
.box-filter .ui-datepicker.ui-widget-content.ui-widget .ui-widget-content { border: 0;}
.box-filter .ui-datepicker { display: none; left: 0!important; top: 100%!important; z-index: 100; text-align: center; background-color: rgba(87,214,237,.7); color: #FFF;}
.box-filter .ui-datepicker table { width: 94%; padding: 0 1rem; margin: 0 3% .6em 3%;}
.box-filter .ui-datepicker td, 
.box-filter .ui-datepicker td span, 
.box-filter .ui-datepicker td a { color: #FFF; text-align: center; font-weight: 600;}
.box-filter .ui-datepicker th { color: #FFF; text-align: center; font-weight: 700;}
.box-filter .ui-datepicker .ui-datepicker-year { font-weight: 400;}
.box-filter .ui-datepicker td a { height: 3rem; width: 3rem; line-height: 2.5rem; padding: 0; text-align: center; display: inline-block; border-radius: 50%;}
.box-filter .ui-datepicker .ui-state-highlight, 
.box-filter .ui-datepicker .ui-widget-content .ui-state-highlight, 
.box-filter .ui-datepicker .ui-widget-header .ui-state-highlight { border: 1.5px solid rgba(255,255,255,.5);}
.box-filter .ui-datepicker .ui-datepicker-prev, 
.box-filter .ui-datepicker .ui-datepicker-next { position: absolute; top: 0px; width: 3.4rem; height: 3.4rem;}
.box-filter .ui-datepicker .ui-datepicker-prev { left: 0;} 
.box-filter .ui-datepicker .ui-datepicker-next { right: 0;}
.box-filter .ui-datepicker .ui-datepicker-prev span, 
.box-filter .ui-datepicker .ui-datepicker-next span { display: block; position: absolute; width: 1.8rem; height: 1.8rem; left: 50%; top: 50%; margin: 0; transform: translate(-50%, -25%); background-image: url(https://web.mystreetbook.es/img/icons-m.svg); background-size: 9rem auto; background-position: -3.6rem 0rem;}
.box-filter .ui-datepicker .ui-datepicker-prev span { transform: translate(-50%, -25%) rotate(180deg);}
.box-filter .ui-datepicker .ui-state-active, 
.box-filter .ui-datepicker .ui-widget-content .ui-state-active { border: 1.5px solid rgb(255,255,255); color: rgb(255,255,255) }


.custom-combobox { position: relative; display: block; background-color: transparent;}
.custom-combobox .ui-corner-right { position: absolute; right: 0; top: 0; left: auto; width: 3.4rem; height: 3.4rem; padding: 0; z-index: 10; border: 0;}
.custom-combobox .ui-corner-right.ui-button-icon-only .ui-icon { content: ''; display: block; margin: -.9rem 0 0 0; background-image: url(https://web.mystreetbook.es/img/icons-m.svg); background-size: 9rem auto; background-position: -3.6rem 0rem; background-color: transparent; width: 1.8rem; height: 1.8rem; transform: translate(-50%,0%) rotate(90deg);}

.custom-combobox a.ui-button:active,
.custom-combobox .ui-button:active,
.custom-combobox .ui-button.ui-state-active:hover, .custom-combobox .ui-widget.ui-widget-content { border: 0;}

.row-range { position: relative;}
.row-range .btn-icon-close { position: absolute; right: 0; top: .5rem; background-color: rgba(255,255,255,.25);}
.row-range.first .btn-icon-close { display: none;}

.slider-range { padding: 4rem 0 1.2rem 0;}
.slider-range *,
.slider-one * { overflow: visible;}
.slider-one { padding: 1.2rem 0;}
.slider-range .ui-slider-horizontal.ui-widget.ui-widget-content,
.slider-one .ui-slider-horizontal.ui-widget.ui-widget-content { margin: 0; height: 2px; background: #FFF; border: 0;}
.ui-slider .ui-slider-handle { width: 2.2rem; height: 2.2rem; background-color: #FFF; border: 2px solid #00BCDE; border-radius: 50%; margin-left: -1.1rem; top: 0rem;}
.slider-range .ui-slider .ui-slider-handle,
.slider-one .ui-slider .ui-slider-handle { top: -1.1rem;}
.slider-range .ui-slider .ui-slider-handle.ui-state-hover,
.slider-one .ui-slider .ui-slider-handle.ui-state-hover { height: 3rem; width: 3rem; top: -1.5rem; margin-left: -1.5rem;}
.ui-slider .ui-slider-handle .ui-slider-handle-txt { position: absolute; top: -3rem; width: 100%; text-align: center; font-size: 1.2rem;}
.ui-slider .ui-slider-handle .ui-slider-handle-txt:after { content: ''; position: absolute; width: 2px; height: 1rem; bottom: -1.2rem; left: 50%; background: rgba(255,255,255,.25);}
.ui-slider .ui-slider-range { background: #01A4C0; opacity: .3;}
.slider-one .ui-slider-horizontal.ui-widget.ui-widget-content { margin: 0 1.5rem;}
.slider-one .ui-slider-horizontal.ui-widget.ui-widget-content:after,
.slider-one .ui-slider-horizontal.ui-widget.ui-widget-content:before { content: ''; position: absolute; width: 1.5rem; height: 2px; bottom: 0rem; background: #FFF;}
.slider-one .ui-slider-horizontal.ui-widget.ui-widget-content:after  { right: -1.5rem;}
.slider-one .ui-slider-horizontal.ui-widget.ui-widget-content:before { left: -1.5rem;}
.slider-one-box { position: relative; height: 2.2rem;}
.slider-one-box .ui-slider { top: 1.1rem;}
.slider-one .lines { position: absolute; top: .35rem; height: 1.5rem; left: 1.5rem; right: 1.5rem; opacity: .3;}
.slider-one .lines [class*=line-] { position: absolute; width: 2px; height: 100%; background: #FFF;}
.slider-one-txt { width: 6rem;}
.line-1 { left: 0;}
.line-2 { left: 16.66%;}
.line-3 { left: 33.33%;}
.line-4 { left: 50%;}
.line-5 { left: 66.66%;}
.line-6 { left: 83.33%;}
.line-7 { left: 100%;}

.slider-onOff.ui-widget.ui-widget-content { width: 2.2rem; height: 2.2rem; margin: 0 1.1rem; border: none; overflow: visible;}
.slider-onOff.ui-widget.ui-widget-content:before { content: ''; display: block; position: absolute; left: -1.1rem; top: 0; width: 4.4rem; height: 2.2rem; background: #ECECEC; border-radius: 1.1rem;}
.slider-onOff .ui-slider-handle { width: 2.2rem; height: 2.2rem; border: 2px solid #555; background: #FFF; margin-left: -1.1rem; top: 0; border-radius: 1.1rem;}
.slider-onOff.active .ui-slider-handle { border: 2px solid #00BCDE;}
.slider-onOff .ui-slider-handle.ui-state-hover { border: 2px solid #2C94A7;}

.ui-accordion .ui-accordion-header, .box-filter-title.txt-l { cursor: pointer; position: relative; margin: 0 0 1rem; padding: 0; border: 0;}
.ui-accordion .ui-accordion-header .btn-icon:before { transform: rotate(90deg); margin: .6rem;}
.ui-accordion .ui-accordion-header strong, .box-filter-title strong { margin: 0 .5rem;}
.ui-accordion .ui-accordion-header.ui-state-active { border: 0;}
.ui-accordion .ui-accordion-header.ui-state-active .btn-icon:before { transform: rotate(270deg);}
.ui-accordion .ui-accordion-content.ui-widget-content, .box-filter-box { padding: 0 0 1.5rem 0; border: 0; overflow: visible; background-color: transparent;}

.autosearchtags-container { padding: 10px 30px; background-color: rgba(87,214,237,.7); background-image: url(../img/textura-azul-min.png); background-size: 300% auto; background-position: center; }
.autosearchtags-input-clear { position: absolute; top: 50%; left: 0; width: 30px; padding: 6px; transform: translateY(-50%); }
.autosearchtags-input-clear:before { width: 10px; background-position-x: -5px !important; }
.autosearchtags-input-container { position: relative; }
/* .autosearchtags-input-container:after { content: ''; display: block; position: absolute; height: 100%; width: 40px; top: 0; right: 0; background-image: url(../img/icons-general/icon-search-placeholder.svg); background-repeat: no-repeat; background-size: 70%; background-position: center;} */
.autosearchtags-input-container > input { background: #ffffff; padding-right: calc(1.5rem + 40px); padding-left: 1.5rem; }
.autosearchtags-input-container:focus-within::after { display: none; }
.auto-complete-search-button { display: block;position: absolute;height: 100%;width: 40px;top: 0;right: 0;background-image: url(https://web.mystreetbook.es/img/icons-general/icon-search-placeholder.svg);background-repeat: no-repeat;background-size: 70%;background-position: center; }
.auto-complete-search-button-white { display: block;position: absolute;height: 30px;width: 30px;top: 38px;right: 6.5rem;background-image: url(https://web.mystreetbook.es/img/icons-general/icon-search-white.svg);background-repeat: no-repeat;background-size: 70%;background-position: center;background-color: transparent; }

.ui-autocomplete { max-height: 18.6rem; overflow: auto; -webkit-overflow-scrolling: touch;}
.ui-menu { background-color: rgb(115,248,255); background-image: url(../img/textura-azul-min.png); background-position: center; background-size: 200% auto; border: 0; border-radius: .6em; box-shadow: 0px 2px 10px rgba(0,0,0,.3); padding: .3rem 0 .7rem 0; margin-bottom: 250px!important;}
.ui-menu.ui-widget-content.ui-widget { border: 0;}
.ui-menu .ui-menu { position: absolute;}
.ui-menu .ui-menu-item { margin: 0; cursor: pointer; color: #FFFFFF; font-weight: 600; font-size: 1.6rem;}
.ui-menu .ui-menu-item .ui-menu-item-wrapper { position: relative; padding: 1rem 1.5rem;}
.ui-menu .ui-menu-item .ui-menu-item-wrapper > span { padding-left: 30px; display: block; }
.ui-menu .ui-menu-item .ui-menu-item-wrapper:before { content: ''; display: inline-block; height: 1rem; width: 1rem; margin-right: 1rem; background-image: url(https://web.mystreetbook.es/img/icons-s.svg); background-size: 5rem auto; background-position: -2rem -1rem;}
.ui-menu-search .ui-menu-item .ui-menu-item-wrapper { position: relative; }
.ui-menu-search .ui-menu-item .ui-menu-item-wrapper:before { position: absolute; top: 30%; background-size: 16px; background-repeat: no-repeat; background-position: left; width: 2rem; height: 2rem; }
.menu-item-destination:before { background-image: url(https://web.mystreetbook.es/img/icons-makers/marker-destination.svg) !important; width: 1rem!important; height: 1rem!important; }
.menu-item-point:before { background-image: url(../img/icons-makers/marker-grey.png) !important; }
li[data-type="route"] .ui-menu-item-wrapper:before { 
    background-image: url(https://web.mystreetbook.es/img/icons-general/icon-route-white.svg)!important; 
    background-size: 20px !important;
    height: 20px !important;
    width: 20px !important;
    background-position: 0 !important;}

li[data-type="route"] .ui-menu-item-wrapper:after { border-bottom: 1px solid rgba(255,255,255,.50)!important;}
li[data-type="destination"] .ui-menu-item-wrapper:before { background-image: url(https://web.mystreetbook.es/img/icons-s.svg)!important; background-position: 0rem -9rem!important; background-size: 5rem auto!important;}
li[data-type="destination"] .ui-menu-item-wrapper:after { border-bottom: 1px solid rgba(255,255,255,.50)!important;}
.ui-menu .ui-menu-item .ui-menu-item-wrapper:after { content: ''; display: block; position: absolute; bottom: 0; left: 1.5rem; right: 1.5rem; height: 0; border-bottom: 1px solid rgba(255,255,255,.25);}
.ui-menu .ui-menu-item:last-child .ui-menu-item-wrapper:after { display: none;}
/*.ui-menu .ui-menu-item:first-child .ui-menu-item-wrapper:before { background-image: url(../img/icons-s.svg); background-position: -2rem -9rem; background-size: 5rem auto;}
.ui-menu .ui-menu-item:first-child .ui-menu-item-wrapper:after { border-bottom: 1px solid rgba(255,255,255,.50);}*/
.ui-menu .ui-state-focus, .ui-menu .ui-state-active { margin: 0;}

.custom-ui-accordion .ui-state-active { background-color: #e4e4e4a6 !important; }

.ui-autocomplete .ui-accordion-header.ui-state-active { border: 0;}
.ui-autocomplete .ui-state-active,
.ui-autocomplete .ui-widget-content .ui-state-active,
.ui-autocomplete .ui-widget-header .ui-state-active,
.ui-autocomplete a.ui-button:active,
.ui-autocomplete .ui-button:active,
.ui-autocomplete .ui-button.ui-state-active:hover  { border: 0; background-color: rgba(255,255,255,.23);}


/* icon support */

.ui-menu-icons { position: relative;}
.ui-menu-icons .ui-menu-item-wrapper { padding-left: 2em;}


/* Texto */

.txt-header { align-items: baseline;}
.txt-header-box { padding-right: .5rem;}

.txt-header .txt-l,
.txt-header .txt-m,
.txt-header .txt-s { line-height: 1.65rem; vertical-align: baseline;}

.txt-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}

.txt img { width: 100%;}

.txt-l, .txt-m, .txt-s, .txt h1, .txt h2, .txt h3, .txt p { margin-bottom: .3rem;}
.txt-l, .txt h1, .txt h2, .txt h3, .txt p { font-size: 1.6rem; line-height: 1.25em;}
.txt p { font-size: 1.4rem; line-height: 1.285em; margin-bottom: .7rem;}
.txt-m { font-size: 1.4rem; line-height: 1.285em;}
.txt-s { font-size: 1.2rem; line-height: 1.1em;}

.txt-icon { line-height: 1.8rem; white-space: nowrap; }
.txt-icon [class*="icon-"] { display: inline-block; margin: 0 .5rem; vertical-align: middle;}

.txt-upper { text-transform: uppercase;}
.txt-bold { font-weight: 700;}
.txt-semi { font-weight: 600;}

input[class*=txt-] { border: 0; padding: 0; height: auto;}
select[class*=txt-] { border: 0; padding: 0; height: auto; }
.select-text { display: inline-block; position: relative; width: auto;}
.select-text:before { content: ''; display: block; background-image: url(https://web.mystreetbook.es/img/icons-m.svg); background-size: 9rem auto; width: 1.8rem; height: 1.8rem; position: absolute; top: 0; right: .9rem; transform: rotate(90deg); background-position-y: 0rem; background-position-x: 0rem; z-index: 1;}
.select-text select[class*=txt-] { position: relative; z-index: 2; white-space: nowrap; padding-right: 3rem;}

.avisoEmail {padding-top: .5rem; opacity: .7;}

/* Color */

.txt-grey { color: #9B9B9B;}
.txt-blue { color: #00BCDE;}

.bg-blue { background-color: #00BCDE;}
.bg-black { background-color: #555555;}
.bg-gris-medio { background-color: #D8D8D8;}
.bg-gris-claro { background-color: #ECECEC;}
.bg-white { background-color: #FFFFFF;}

.bg-berenjena { background-color: #70194C;}
.bg-rosa { background-color: #EC637C;}
.bg-morado { background-color: #3F297E;}
.bg-azul-verdoso { background-color: #086872;}
.bg-agua-mar { background-color: #A7D8DD;}
.bg-verde { background-color: #489B34;}
.bg-naranja { background-color: #F6A64E;}
.bg-amarillo { background-color: #F1DA00;}
.bg-gris-azulado { background-color: #5F6982;}
.bg-lila { background-color: #A34C97;}


/* Actives */

.no-display { display: none;}
.no-display.active { display: inherit; animation-name: fadein; animation-duration: .3s}
.no-active.active { display: none;}

.box-filter-search.box-filter.box-filter-s.active { max-height: 100rem; padding-top: 3rem; padding-bottom: 3rem; overflow: visible;}

.in-left.active, .in-right.active, .in-top.active, .in-bottom.active, .in-over.active { transform: translate3d(0, 0, 0);}
.in-over.active, .search .main-cont [data-seccion=search], .path .main-cont [data-seccion=path], .user .main-cont [data-seccion=user] { transform: translate3d(0, 0, 0); opacity: 1; transition: opacity .3s ease;}

.main-head .btn-back.active { visibility: visible; z-index: 2; opacity: 1;}
.main-head .btn-back.active:before { background-position-x: 0rem;}
.user .main-head .btn-conf { visibility: visible; z-index: 2; opacity: 1; margin-top: 40px; }
.user .main-head .btn-conf.no-visible { visibility: hidden; opacity: 0;}

.search .btn-footer[data-seccion=search], .path .btn-footer[data-seccion=path], .user .btn-footer[data-seccion=user] { background-color: #01A4C0;}

.btn-l.active, .btn-m.active, .btn-s.active { color: #FFF !important; background-color: #555555 !important; border-color: #555555 !important;}
.btn-gropu-item.active, .btn-group-item.active,
.header-boxTop-extra.box-over.active .btn-gropu-item.active { color: #FFF; background-color: #00BCDE;}

.box-list-item.active { background: #ECECEC;}
.box-grid-img.active { background: #00BCDE;}
.box-grid-img.active img { opacity: .5;}

.btn-icon.active { background-color: transparent;}

.btn-m.btn-more-point.visible { display: inline-block;}

.stars-s .star-s.active { background-position: -4rem -7rem;}
.stars-m .star-m.active { background-position: -7.2rem -16.2rem;}
.stars-l .star-l.active { background-position: -9.6rem -21.6rem;}

.btn-gropu-item.active .icon-m:before { background-position-x: -3.6rem;}
.box-filter .btn-gropu-item.active { background-color: #FFF; color: #00BCDE;}
.btn-group-item.active .icon-m:before { background-position-x: -3.6rem;}
.box-filter .btn-group-item.active { background-color: #FFF; color: #00BCDE;}

.box-more-points.active { display: block; animation-name: fadein; animation-duration: .3s}
.box-list-item-close.active { visibility: visible; opacity: 1;}

.btn-txt { text-decoration: underline;}

.img-ratio-container {
    position: relative;
}

.img-ratio-container:before {
    content: '';
    display: block;
    padding-top: 100%;
}

.img-ratio {
    border-radius: inherit;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.btn-facebook {
    background-color: #47cde6;
    padding: 10px 20px;
    min-width: 220px;
}

.btn-google {
    background-color: #47cde6;
    padding: 10px 20px;
    min-width: 220px;
}

.img-facebook {
    width: 20px;
    margin-bottom: -5px;
    margin-right: 15px;
}

.img-google {
    width: 20px;
    margin-bottom: -5px;
    margin-right: 10px;
}

.login-facebook-text, .login-google-text {
    font-size:15px;
}

/* Transiciones - Animaciones  */

.box-destino, .btn-conf, .btn-back, .no-visible, .box-list-item-close { transition: opacity .3s ease;}
[class*=in-] [class*=btn-], [class*=btn-] *, .ui-slider-handle, .box-filter-search, .box-list-item, .box-grid-img img, .box-list-item-point-between { transition: all .3s ease;}
.in-right, .in-left, .in-bottom, .in-top, .ui-accordion-header .btn-icon:before { transition: transform .3s ease;}

.in-over { transition: opacity .3s ease, transform .3s .3s ease;}

@keyframes fadein { from { opacity: 0;} to { opacity: 1;} }
@keyframes fadeinout { from { opacity: 1;} 50% { opacity: 0;} to { opacity: 1;} }

@media (min-width: 768px) {
    .ui-menu-search { 
        left: 30px !important;
        width: calc(100% - 60px) !important;
        max-height: 45rem !important;
    }
}

.ui-menu-search { 
    left: 30px !important;
    width: calc(100% - 60px) !important;
    max-height: 45rem !important;
}

.iframeWrap {
    display: none;
}

.iframeUrl {
    width: 100%;
    height: calc(100% - 11rem);
}

[data-id="listamisrutas-path"] {
    margin-bottom: 220px;
}

#city-search-rutas-selector, #city-search-selector {
    padding-bottom: 4rem;
}

.interest-places-wrap {
    text-align: center;
    background-color: transparent;
    width: 100%;
    position: absolute;
    bottom: 15px;
}