.modal{ .media-dialog{ /*margin:0 auto; width:auto;*/ .modal-content{ .modal-body{ padding-bottom:0; } .big-next, .big-prev, .thumb-next, .thumb-prev{ position: absolute; top: 50%; transform: translateY(-50%); z-index: 1; cursor: pointer; svg{ fill:$body-text-color; } } .big{ .close{ position:absolute; right:10px; top:5px; z-index: 1; color:$link-color-ppal; font-weight:normal; opacity:1; margin-right:0px; span{ color:$link-color-ppal; } &:focus, &:active{ background-color: transparent; } } .big-next, .big-prev{ svg{ height:150px; width:150px; fill:#fff; opacity:0.5; } } .big-prev{ left:-4%; } .big-next{ right: 29%; } } .thumb{ .thumb-next, .thumb-prev{ //background-color: $bg-color; height: calc(100% - 4px); top:4px; transform:translateY(0); &.slick-disabled{ svg{ fill:$body-text-color; } } svg{ height:75px; width:40px; position:relative; top:50%; transform:translateY(-50%); fill:$link-color-ppal; } } .thumb-prev{ left:0; } .thumb-next{ right: 0; } } .slider-for{ //background-color: #ffffff; /*.slick-slide, .slick-track{ width: 100%!important; }*/ .media-pic{ img{ width:100%; } } } .slider-nav{ margin:4px 0px 4px 40px; //background-color: $bg-color; .slick-slide{ opacity:0.5; &.slick-current{ opacity:1; } } } .bg-white{ //padding: 20px 15px 0px 15px; h4{ font-weight:400; margin-bottom:10px; color:$dark-color; } } } } } .destinations, .interests{ .big{ .big-next{ right:-4%!important; } } } .mediaModal{ .scrollbar-rail .scroll-element .scroll-bar{ background-color: #cdcdcd!important; } .loader{ border-top: 1.1em solid rgba($link-color-ppal, 0.2); border-right: 1.1em solid rgba($link-color-ppal, 0.2); border-bottom: 1.1em solid rgba($link-color-ppal, 0.2); border-left: 1.1em solid $link-color-ppal; } button.close{ margin-right:15px; text-shadow: 0; margin-top: 15px; } .scrollbar-rail>.scroll-element.scroll-y.scrollbar-rail>.scroll-element.scroll-y{ width:5px; } .scrollbar-rail>.scroll-element.scroll-y .scroll-bar{ width:5px; left:4px; box-shadow: none; } .scrollbar-rail{ max-height:400px; padding:10px 0 10px 0; .scroll-element{ .scroll-bar { //background-color: $link-color; } } } .big-next, .big-prev, .thumb-next, .thumb-prev{ position: absolute; top: 50%; transform: translateY(-50%); z-index: 1; cursor: pointer; svg{ fill:$body-text-color; &:hover{ opacity:1; } } } .big{ position:relative; .close{ position:absolute; right:10px; top:5px; z-index: 1; color:$link-color-ppal; font-weight:normal; opacity:1; margin-right:0px; span{ color:$link-color-ppal; } &:focus, &:active{ background-color: transparent; } } .big-next, .big-prev{ svg{ height:150px; width:150px; fill:#fff; opacity:0.5; &:hover{ opacity:1; } } } .big-prev{ left:4%; } .big-next{ right: 4%; } } .thumb{ .thumb-next, .thumb-prev{ background-color: $bg-color; height: calc(100% - 4px); top:4px; transform:translateY(0); &.slick-disabled{ svg{ fill:$body-text-color; } } svg{ height:75px; width:40px; position:relative; top:50%; transform:translateY(-50%); fill:$link-color-ppal; } } .thumb-prev{ left:0; } .thumb-next{ right: 0; } } .slider-for{ background-color: #ffffff; /*.slick-slide, .slick-track{ width: 100%!important; }*/ .media-pic{ img{ width:100%; } } } .slider-nav{ margin:4px 0px 4px 40px; background-color: $bg-color; .slick-slide{ opacity:0.5; &.slick-current{ opacity:1; } } } .bg-white{ //padding: 20px 15px 0px 15px; h4{ font-weight:400; margin-bottom:10px; color:$dark-color; } } .slider-nav, .thumb .thumb-prev, .thumb .thumb-next{ background-color: $dark-color; } .thumb-next svg, .thumb-prev svg{ fill:#fff; color:#fff; } .toltip{ padding:10px; color:#fff; position:absolute; bottom:0; width:100%; z-index: 1; &:after{ content: ""; background-color: $dark-color; opacity: .65; top: 0; left: 0; bottom: 0; right: 0; position: absolute; z-index: -1; } } .photo-image{ position:relative; } .video{ .embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; iframe, object, embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } } .scrollbar-rail{ div.item-video{ padding:5px 10px 0px 15px; img{ max-width:120px; } ul{ margin: 10px 0 20px 0; padding-bottom: 10px; border-bottom: 1px solid $border-color; .info-video { font-size: 14px; color: #999; } } &:last-child { ul{ border: none; padding-bottom:0; margin-bottom:10px; } } } } } .download{ padding-top:30px; table{ margin-bottom:30px; td{ padding:5px; .icon-pfd-download-icon{ font-size:24px; } } } } &.attractions, &.atracciones{ .scroll-wrapper{ margin:5px -15px 0px 0px; } .scrollbar-rail{ max-height:370px; p{ padding-right:15px; padding-bottom:15px; } } } &.hotels{ .scrollbar-rail{ max-height:380px; } .navbar-toggle{ position:absolute; top:15px; right:0; margin:0; .icon-bar{ background-color: #fff; } } .photo-categories{ z-index:22; ul{ li{ margin: 0; padding:0; //border-bottom:1px solid $border-color; a.invert{ display:block; padding: 10px; &:hover{ color: $price-color; } &.selected{ color: $price-color; } } &:hover, &.selected{ background-color: $bg-color-ppal; } } } } } .nav-tabs{ border:none; .icon-camara, .icon-video, .icon-descargas{ font-size:30px; } li{ margin-bottom:0; } li a, li a:hover, li a:focus{ color: #fff; background-color: transparent; border:none; border-bottom: 4px solid transparent; } li.active a, li.active a:hover, li.active a:focus{ color:$gallery_active_color; background-color: transparent; border:none; border-bottom: 4px solid $gallery_active_color; } } .tab-content{ .tab-pane{ //padding:15px; min-height:200px; } } } .hotelStars{ .icon-estrella-1{ &:before{ fill:$price-color; color: $price-color; font-size: 2rem; vertical-align: text-top; } } } .modal-content .ajaxContent{ //background-color:#fff; .slider-nav { margin: 0px 0px 0px 0px!important; padding:4px 0 4px 40px; } .thumb { .thumb-next, .thumb-prev { height: 100%; top:0; } } } #privacyModal{ .scroll-wrapper{ margin-bottom:20px; } .scrollbar-rail{ max-height:500px; } } #termsModal{ .modal-body{ h2{ color:$body-text-color; font-size:18px; margin:0px 0 20px 0; } ol{ margin-bottom:20px; } } } #divingModal{ .modal-header{ border:none; } } #giftModal{ .duration{ border-top:1px solid $border-color-ppal; color:#333; padding-top:10px; } } @media only screen and (min-width:768px) { #categories.navbar-collapse{ min-width:33%; } } @media only screen and (max-width:1024px) { .modal.mediaModal .navbar-toggle { display: block; } .modal.mediaModal .navbar-collapse.collapse { display: none!important; } .modal.mediaModal .collapse.in{ display:block !important; } .modal .media-dialog .modal-content .big .big-next{ right:0; } } @media only screen and (max-width:768px) { .modal.mediaModal .modal-content{ .big{ .big-prev, .big-next{ top:25%; transform: translateY(-25%); } .big-next{ right:-4%; } } } } @media only screen and (max-width:640px){ .modal.mediaModal{ .big{ .big-prev, .big-next{ top:15%; transform: translateY(-15%); svg{ width:100px; height:100px; } } .big-next{ right:-4%; } } } } @media only screen and (max-width:320px){ .modal.mediaModal{ .big{ .big-prev, .big-next{ top:12%; transform: translateY(-12%); svg{ width:80px; height:80px; } } .big-next{ right:-4%; } } } }