.white{ background: #fff; } .pp{ padding: 15px; } .tres { text-align: center; margin: 50px 0 50px 0; } .tres img{ width: 50%; } .clientes_btn a{ display: block; padding: 10px; text-align: center; } .d { margin: 80px 0 0 0; text-align: center; padding: 0 0 10px 0; } footer { padding: 100px 0 0 0; } .footer_index{ background: url("/images/footer.jpg") no-repeat; background-size: cover; } .footer_index a, .footer_index, .footer_eventos a, .footer_eventos{ color: #fff; font-size: 17px; } .footer_white, .hoteles_footer{ font-size: 17px; } .discover li{ margin-bottom: 10px; padding: 3px; } .tres h2{ margin: 20px 0 0 0; } .canchas{ background: #ebebeb; padding: 50px 0 50px 0; color: #01b7f2; } .canchas h2{ font-size: 30px; color: #01b7f2; } .canchas h2 span{ font-weight: bold; } .canchas p{ margin-top: 15px; } .canchas h4{ font-weight: bold; margin-top: 15px; color: #01b7f2; } #next{ background: url("/images/next.jpg") no-repeat; background-size: cover; padding: 40px 0 40px 0; color: #fff; letter-spacing: 2px; } #container_2{ width: 700px; margin: auto; } #next h2{ font-weight: bold; font-size: 25px; margin: 0 0 20px 0; color: #fff; } #next a{ background: rgba(14, 217, 203, .8); color: #fff; font-weight: bold; font-size: 20px; float: right; padding: 8px 15px; } #servicios{ background: url("/images/servicios.jpg") no-repeat; } #servicios h2{ font-size: 30px; color: #4c4c4c; } #servicios h2 span{ font-weight: bold; } #clientes{ background: #ebebeb; } #clientes h2{ margin: 20px 0 20px 0; font-size: 30px; } .hh{ height: 20px; clear: both; } #clientes h2 span{ font-weight: bold; } #porque{ background: url("/images/porque.jpg"); background-size: cover; padding: 30px 0 30px 0; color: #fff; } #porque h2{ color: #fff; font-size: 30px; } #porque h2 span{ font-weight: bold; } #porque h4{ color: #fff; } #porque img{ margin-bottom: 20px; } .reserva{ background: #7ccd3e; color: #fff; display: block; padding: 10px 15px; text-align: center; margin-top: 30px; } #incluye h2{ font-size: 28px; text-align: center; margin: 30px 0 30px 0; } #incluye h4{ text-align: center; margin: 10px 0 10px 0; } #eventos_2{ background: url("/images/eventos-2.jpg") no-repeat; background-size: cover; padding: 20px 0 20px 0; } #clientes{ padding: 80px 0 80px 0; background: #ffffff; } #mejor_evento{ background: url("/images/eventos_3.jpg") no-repeat; padding: 2px 0 30px 0; margin-bottom: 20px; } #mejor_evento h2{ text-align: center; color: #fff; font-weight: 400; font-size: 45px; margin: 15px 0 15px 0; } #mejor_evento h3{ text-align: center; color: #fff; font-weight: 700; font-size: 45px; margin: 15px 0 15px 0; } #mejor_evento a.cotizar{ background: #95bc45; color: #fff; display: block; width: 150px; margin: auto; margin-top: 20px; text-align: center; font-size: 20px; padding: 10px 10px; } .footer_eventos { color: #fff; background: url("/images/footer_eventos.jpg") no-repeat; background-size: cover; } .footer_eventos a{ color: #fff; } #populares { padding: 80px 0 80px 0; background: #ededed; } #populares h2{ font-size: 35px; margin: 0 0 20p x0; text-transform: uppercase; } #populares h3{ text-align: left; font-weight: 700; color: #009bdb; margin-bottom: 15px; } #populares .tres{ width: 33.3333%; margin: 0; float: left; text-align: left; } #populares .precio{ color: #98ce44; font-size: 19px; font-weight: 400; } #populares .avg{ font-size: 13px; font-weight: 400; } #populares .cotizar-hotel a{ background: #98ce44; color: #fff; width: 100%; text-align: center; display: block; padding: 10px 0 10px 0; font-size: 14px; font-weight: 700; margin-top: -12px; } .datos_hotel_oferta{ padding: 0 10px 0 10px; text-align: left; } .datos_hotel_oferta h4{ font-weight: bold; color: #009bdb; text-align: left; margin-bottom: 5px; } .datos_hotel_oferta #estrella{ width: auto; } .datos_hotel_oferta .inclusive{ text-align: left; color: #000; } .datos_hotel_oferta .inclusive{ border-bottom: 1px solid #000; padding-bottom: 3px; margin-bottom: 3px; } .datos_hotel_oferta .desc{ text-align: left; border-top: 1px solid #000; padding-top: 3px; margin-top: 5px; } .datos_hotel_oferta .cotizar{ background: #95bc45; color: #fff; padding: 6px 13px; text-align: center; } .hoteles_footer{ background: url("/images/hoteles_footer.jpg") no-repeat; background-size: cover; } .hoteles_footer a, .hoteles_footer{ color: #fff; } * { box-sizing: border-box; -moz-box-sizing: border-box; /* Firefox */ margin: 0; padding: 0; -webkit-tap-highlight-color: transparent; zoom: 1; } html { font-size: 16px; min-height: 100%; } body { font: 75%/150% "Lato", Arial, Helvetica, sans-serif; background-color: #fff; color: #838383; overflow-x: hidden; -webkit-font-smoothing: antialiased; -ms-overflow-style: scrollbar; oveflow-y: scroll; } iframe, img { border: 0; } a { text-decoration: none; color: inherit; } a:hover, a:focus { color: #01b7f2; text-decoration: none; } a:focus { outline: none; } p { font-size: 1.0833em; line-height: 1.6666; margin-bottom: 15px; } dt { font-weight: normal; } span.active, a.active, h2.active, h3.active, h4.active, h5.active, h6.active { color: #01b7f2; } .info-primary, .info-success { color: #fff; padding: 2px 5px; line-height: 1em; } .info-success { background: #98ce44; } .info-primary { background: #2d3e52; } /* 2) Heading */ h1, h2, h3, h4, h5, h6 { margin: 0 0 15px; font-weight: normal; color: #2d3e52; } h1 { font-size: 2em; line-height: 1.25em; /*24px, 30px*/ } h2 { font-size: 1.6667em; line-height: 1.25em; /*20px, 35px*/ } h3 { font-size: 1.5em; line-height: 1.2222em; /*18px, 22px*/ } h4 { font-size: 1.3333em; line-height: 1.25em; /*16px, 20px*/ } h5 { font-size: 1.1666em; line-height: 1.1428em; /*14px, 16px*/ } h6 { font-size: 1em; } h1.fourty-space { font-size: 1.3333em; line-height: 1.25em; letter-spacing: .04em; } h2.fourty-space { font-size: 1.1666em; line-height: 1.1428em; letter-spacing: .04em; } h3.fourty-space { font-size: 1.0833em; line-height: 1.1428em; letter-spacing: .04em; } h4.fourty-space { font-size: 1em; line-height: 1.1em; letter-spacing: .04em; } h5.fourty-space { font-size: 0.9166; line-height: 1.1em; letter-spacing: .04em; } h6.fourty-space { font-size: 0.8333em; line-height: 1.1em; letter-spacing: .04em; } /* 3) Lists */ ol, ul { list-style: none; margin: 0; } /* 4) Contents */ blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } hr { margin-top: 20px; margin-bottom: 20px; border-color: #f5f5f5; } /* 5) Table */ table { border-collapse: collapse; border-spacing: 0; } /* 6) HTML5 & CSS3 Styles for older browsers */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } /* 7) Tools */ .clearer { clear: both !important; padding: 0 !important; margin: 0 !important; } .hidden { display: block !important; border: 0 !important; margin: 0 !important; padding: 0 !important; font-size: 0 !important; line-height: 0 !important; width: 0 !important; height: 0 !important; overflow: hidden !important; } .nobr { white-space: nowrap !important; } .wrap { white-space: normal !important; } .no-display { display: none; } .no-float { float: none !important; } .no-margin { margin: 0 !important; } .no-padding { padding: 0 !important; } .no-lpadding { padding-left: 0 !important; } .no-rpadding { padding-right: 0 !important; } .no-border { border: none !important; } .full-width { width: 100% !important; } img.full-width { height: auto; } .uppercase { text-transform: uppercase; } .fourty-space { letter-spacing: .04em !important; } .underline { text-decoration: underline !important; } .inline-block { display: inline-block !important; } .visible-sms { display: none; } .overflow-hidden { overflow: hidden; } .no-letter-spacing { letter-spacing: normal !important; } /* 8) Colors */ .blue-color { color: #01b7f2 !important; } .light-blue-color { color: #7692b4; } .yellow-color { color: #fdb714 !important; } .red-color { color: #e01a33 !important; } .green-color { color: #7db921 !important; } .white-color { color: #fff !important; } .dark-blue-color { color: #2d3e52 !important; } .skin-color { color: #01b7f2; } .default-color { color: inherit !important; } .gray-color { color: #9e9e9e !important; } .hotel-color { color: #01b7f2; } .select-color { color: #fdb714; } .blue-bg { background-color: #01b7f2 !important; } .yellow-bg { background-color: #fdb714 !important; } .red-bg { background-color: #e01a33 !important; } .green-bg { background-color: #98ce44 !important; } .white-bg { background-color: #fff !important; } .dark-blue-bg { background-color: #2d3e52 !important; } .skin-bg { background-color: #01b7f2 !important; } .gray-bg { background-color: #f5f5f5 !important; } /* Icons */ @font-face { font-family: 'soap-icons'; src: url("../fonts/soap-icons.eot?26664784"); src: url("../fonts/soap-icons.eot?26664784#iefix") format("embedded-opentype"), url("../fonts/soap-icons.woff?26664784") format("woff"), url("../fonts/soap-icons.ttf?26664784") format("truetype"), url("../fonts/soap-icons.svg?26664784#soap-icons") format("svg"); font-weight: normal; font-style: normal; } /* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */ /* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */ /* @media screen and (-webkit-min-device-pixel-ratio:0) { @font-face { font-family: 'soap-icons'; src: url('../font/soap-icons.svg?26664784#soap-icons') format('svg'); } } */ [class^="soap-iconn"], [class*=" soap-icon"] { vertical-align: baseline; } [class^="soap-icon"]:before, [class*=" soap-icon"]:before { font-family: "soap-icons"; font-style: normal; font-weight: normal; speak: none; display: inline-block; text-decoration: inherit; text-align: center; font-variant: normal; text-transform: none; line-height: 1em; /* you can be more comfortable with increased icons size */ /*font-size: 120%;*/ } [class^="soap-icon"].circle, [class*=" soap-icon"].circle, .glyphicon.circle { border: 1px solid; width: 1.8em; height: 1.8em; line-height: 1.7333em; -webkit-border-radius: 50% 50% 50% 50%; -moz-border-radius: 50% 50% 50% 50%; -ms-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; display: inline-block; text-align: center; } [class^="soap-icon"].takeoff-effect:before, [class*=" soap-icon"].takeoff-effect:before, .glyphicon.takeoff-effect:before { -webkit-transform: rotate(-25deg); -moz-transform: rotate(-25deg); -ms-transform: rotate(-25deg); -o-transform: rotate(-25deg); transform: rotate(-25deg); } [class^="soap-icon"].takeoff-effect1:before, [class*=" soap-icon"].takeoff-effect1:before, .glyphicon.takeoff-effect1:before { -webkit-transform: rotate(25deg); -moz-transform: rotate(25deg); -ms-transform: rotate(25deg); -o-transform: rotate(25deg); transform: rotate(25deg); } [class^="soap-icon"].landing-effect:before, [class*=" soap-icon"].landing-effect:before, .glyphicon.landing-effect:before { -webkit-transform: rotate(-25deg); -moz-transform: rotate(-25deg); -ms-transform: rotate(-25deg); -o-transform: rotate(-25deg); transform: rotate(-25deg); } [class^="soap-icon"].flip-effect:before, [class*=" soap-icon"].flip-effect:before, .glyphicon.flip-effect:before { -webkit-transform: scaleX(-1); -moz-transform: scaleX(-1); -ms-transform: scaleX(-1); -o-transform: scaleX(-1); transform: scaleX(-1); filter: FlipH; } .soap-icon-fireplace:before { content: '\e800'; } .soap-icon-television:before { content: '\e801'; } .soap-icon-fridge:before { content: '\e802'; } .soap-icon-aircon:before { content: '\e803'; } .soap-icon-fmstereo:before { content: '\e804'; } .soap-icon-beach:before { content: '\e805'; } .soap-icon-juice:before { content: '\e806'; } .soap-icon-food:before { content: '\e807'; } .soap-icon-fueltank:before { content: '\e808'; } .soap-icon-breakfast:before { content: '\e809'; } .soap-icon-coffee:before { content: '\e80a'; } .soap-icon-party:before { content: '\e80b'; } .soap-icon-savings:before { content: '\e80c'; } .soap-icon-address:before { content: '\e80d'; } .soap-icon-horn:before { content: '\e80e'; } .soap-icon-conference:before { content: '\e80f'; } .soap-icon-support:before { content: '\e810'; } .soap-icon-tree:before { content: '\e811'; } .soap-icon-friends:before { content: '\e812'; } .soap-icon-winebar:before { content: '\e813'; } .soap-icon-plans:before { content: '\e814'; } .soap-icon-guideline:before { content: '\e815'; } .soap-icon-wifi:before { content: '\e816'; } .soap-icon-binoculars:before { content: '\e817'; } .soap-icon-key:before { content: '\e818'; } .soap-icon-fork:before { content: '\e819'; } .soap-icon-locations:before { content: '\e81a'; } .soap-icon-couples:before { content: '\e81b'; } .soap-icon-card:before { content: '\e81c'; } .soap-icon-fitnessfacility:before { content: '\e81d'; } .soap-icon-flexible:before { content: '\e81e'; } .soap-icon-phone:before { content: '\e81f'; } .soap-icon-cruise:before { content: '\e820'; } .soap-icon-joystick:before { content: '\e821'; } .soap-icon-lost-found:before { content: '\e822'; } .soap-icon-securevault:before { content: '\e823'; } .soap-icon-cruise-1:before { content: '\e824'; } .soap-icon-cruise-3:before { content: '\e825'; } .soap-icon-anchor:before { content: '\e826'; } .soap-icon-cruise-2:before { content: '\e827'; } .soap-icon-car-2:before { content: '\e828'; } .soap-icon-pickanddrop:before { content: '\e829'; } .soap-icon-car:before { content: '\e82a'; } .soap-icon-car-1:before { content: '\e82b'; } .soap-icon-hotel-2:before { content: '\e82c'; } .soap-icon-hotel-1:before { content: '\e82d'; } .soap-icon-plane:before { content: '\e82e'; } .soap-icon-plane-bottom:before { content: '\e82f'; } .soap-icon-plane-left:before { content: '\e830'; } .soap-icon-plane-right:before { content: '\e831'; } .soap-icon-carryon:before { content: '\e832'; } .soap-icon-businessbag:before { content: '\e833'; } .soap-icon-baggage:before { content: '\e834'; } .soap-icon-bag:before { content: '\e835'; } .soap-icon-suitcase:before { content: '\e836'; } .soap-icon-hotel-3:before { content: '\e837'; } .soap-icon-trunk-2:before { content: '\e838'; } .soap-icon-hotel:before { content: '\e839'; } .soap-icon-trunk-1:before { content: '\e83a'; } .soap-icon-trunk-3:before { content: '\e83b'; } .soap-icon-delayed-baggage:before { content: '\e83c'; } .soap-icon-damaged-baggage:before { content: '\e83d'; } .soap-icon-baggage-3:before { content: '\e83e'; } .soap-icon-baggage-2:before { content: '\e83f'; } .soap-icon-baggage-1:before { content: '\e840'; } .soap-icon-magazine-1:before { content: '\e841'; } .soap-icon-baggage-status:before { content: '\e842'; } .soap-icon-magazine:before { content: '\e843'; } .soap-icon-slider-1:before { content: '\e844'; } .soap-icon-slider:before { content: '\e845'; } .soap-icon-camera-2:before { content: '\e846'; } .soap-icon-photogallery:before { content: '\e847'; } .soap-icon-camera-3:before { content: '\e848'; } .soap-icon-baggage-4:before { content: '\e849'; } .soap-icon-baggage-5:before { content: '\e84a'; } .soap-icon-shopping:before { content: '\e84b'; } .soap-icon-shopping-1:before { content: '\e84c'; } .soap-icon-shopping-2:before { content: '\e84d'; } .soap-icon-shopping-3:before { content: '\e84e'; } .soap-icon-camera-1:before { content: '\e84f'; } .soap-icon-settings-1:before { content: '\e850'; } .soap-icon-bad:before { content: '\e851'; } .soap-icon-recommend:before { content: '\e852'; } .soap-icon-entertainment:before { content: '\e853'; } .soap-icon-balloon:before { content: '\e854'; } .soap-icon-globe:before { content: '\e855'; } .soap-icon-places:before { content: '\e856'; } .soap-icon-clock-1:before { content: '\e857'; } .soap-icon-clock:before { content: '\e858'; } .soap-icon-settings:before { content: '\e859'; } .soap-icon-automatic:before { content: '\e85a'; } .soap-icon-parking:before { content: '\e85b'; } .soap-icon-status:before { content: '\e85c'; } .soap-icon-departure:before { content: '\e85d'; } .soap-icon-letter:before { content: '\e85e'; } .soap-icon-message:before { content: '\e85f'; } .soap-icon-search-plus:before { content: '\e860'; } .soap-icon-search-minus:before { content: '\e861'; } .soap-icon-search:before { content: '\e862'; } .soap-icon-restricted:before { content: '\e863'; } .soap-icon-calendar:before { content: '\e864'; } .soap-icon-stories:before { content: '\e865'; } .soap-icon-liability:before { content: '\e866'; } .soap-icon-insurance:before { content: '\e867'; } .soap-icon-doc-minus:before { content: '\e868'; } .soap-icon-availability:before { content: '\e869'; } .soap-icon-calendar-1:before { content: '\e86a'; } .soap-icon-calendar-check:before { content: '\e86b'; } .soap-icon-list:before { content: '\e86c'; } .soap-icon-doc-plus:before { content: '\e86d'; } .soap-icon-left:before { content: '\e86e'; } .soap-icon-right:before { content: '\e86f'; } .soap-icon-top:before { content: '\e870'; } .soap-icon-grid:before { content: '\e871'; } .soap-icon-block:before { content: '\e872'; } .soap-icon-star-1:before { content: '\e873'; } .soap-icon-letter-1:before { content: '\e874'; } .soap-icon-wishlist:before { content: '\e875'; } .soap-icon-heart:before { content: '\e876'; } .soap-icon-star:before { content: '\e877'; } .soap-icon-roundtriangle-right:before { content: '\e878'; } .soap-icon-roundtriangle-top:before { content: '\e879'; } .soap-icon-roundtriangle-bottom:before { content: '\e87a'; } .soap-icon-chevron-left:before { content: '\e87b'; } .soap-icon-roundtriangle-left:before { content: '\e87c'; } .soap-icon-bottom:before { content: '\e87d'; } .soap-icon-arrow-top:before { content: '\e87e'; } .soap-icon-arrow-bottom:before { content: '\e87f'; } .soap-icon-arrow-right:before { content: '\e880'; } .soap-icon-arrow-left:before { content: '\e881'; } .soap-icon-longarrow-up:before { content: '\e882'; } .soap-icon-longarrow-bottom:before { content: '\e883'; } .soap-icon-triangle-left:before { content: '\e884'; } .soap-icon-triangle-right:before { content: '\e885'; } .soap-icon-triangle-top:before { content: '\e886'; } .soap-icon-chevron-right:before { content: '\e887'; } .soap-icon-chevron-top:before { content: '\e888'; } .soap-icon-chevron-down:before { content: '\e889'; } .soap-icon-longarrow-left:before { content: '\e88a'; } .soap-icon-longarrow-right:before { content: '\e88b'; } .soap-icon-triangle-bottom:before { content: '\e88c'; } .soap-icon-plus:before { content: '\e88d'; } .soap-icon-minus:before { content: '\e88e'; } .soap-icon-ski:before { content: '\e88f'; } .soap-icon-close:before { content: '\e890'; } .soap-icon-handicapaccessiable:before { content: '\e891'; } .soap-icon-check-1:before { content: '\e892'; } .soap-icon-passed:before { content: '\e893'; } .soap-icon-features:before { content: '\e894'; } .soap-icon-passenger:before { content: '\e895'; } .soap-icon-adventure:before { content: '\e896'; } .soap-icon-man-2:before { content: '\e897'; } .soap-icon-dog:before { content: '\e898'; } .soap-icon-man-1:before { content: '\e899'; } .soap-icon-swimming:before { content: '\e89a'; } .soap-icon-man-3:before { content: '\e89b'; } .soap-icon-comfort:before { content: '\e89c'; } .soap-icon-smoking:before { content: '\e89e'; } .soap-icon-playplace:before { content: '\e89f'; } .soap-icon-facebook:before { content: '\e8a0'; } .soap-icon-googleplus:before { content: '\e8a1'; } .soap-icon-pinterest:before { content: '\e8a2'; } .soap-icon-vimeo:before { content: '\e8a3'; } .soap-icon-doorman:before { content: '\e8a4'; } .soap-icon-googleplay:before { content: '\e8a5'; } .soap-icon-elevator:before { content: '\e8a6'; } .soap-icon-apple:before { content: '\e8a7'; } .soap-icon-twitter:before { content: '\e8a8'; } .soap-icon-tub:before { content: '\e8a9'; } .soap-icon-myspace:before { content: '\e8aa'; } .soap-icon-youtube:before { content: '\e8ab'; } .soap-icon-tumblr:before { content: '\e8ac'; } .soap-icon-flickr:before { content: '\e8ad'; } .soap-icon-soundcloud:before { content: '\e8ae'; } .soap-icon-stumbleupon:before { content: '\e8af'; } .soap-icon-linkedin:before { content: '\e8b0'; } .soap-icon-dribble:before { content: '\e8b1'; } .soap-icon-deviantart:before { content: '\e8b2'; } .soap-icon-behance:before { content: '\e8b3'; } .soap-icon-envato:before { content: '\e8b4'; } .soap-icon-instagram:before { content: '\e8b5'; } .soap-icon-skype:before { content: '\e8b6'; } .soap-icon-user:before { content: '\e8b7'; } .soap-icon-pets:before { content: '\e8b8'; } .soap-icon-family:before { content: '\e8b9'; } .soap-icon-check:before { content: '\e8ba'; } .soap-icon-notice:before { content: '\e8bb'; } .soap-icon-error:before { content: '\e8bc'; } .soap-icon-generalmessage:before { content: '\e8bd'; } .soap-icon-automatic-transmission:before { content: '\e8be'; } .soap-icon-flight-hotel:before { content: '\e8bf'; } .soap-icon-comment:before { content: '\e8c0'; } /* font */ @font-face { font-family: 'NexaBlack'; src: url("../fonts/NexaBlack.eot?") format("eot"), url("../fonts/NexaBlack.otf") format("opentype"), url("../fonts/NexaBlack.woff") format("woff"), url("../fonts/NexaBlack.ttf") format("truetype"), url("../fonts/NexaBlack.svg#NexaBlack") format("svg"); } /* 1.2. Layout ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ #page-wrapper { position: relative; overflow: visible; } .gray-area { background: #f5f5f5; } .global-map-area { background: url("/images/playa_gris.jpg") no-repeat; background-size: cover; } .global-map-area .description p { color: #7c9abd; } .global-map-area .description h1, .global-map-area .description h2, .global-map-area .description h3, .global-map-area .description h4, .global-map-area .description h5, .global-map-area .description h6 { color: #fff; } section#content { min-height: 400px; text-align: left; background: #f5f5f5; } section#content:after { display: table; content: ""; clear: both; } .sm-section { padding-top: 30px; padding-bottom: 20px; } .md-section { padding-top: 40px; padding-bottom: 30px; } .section { padding-top: 80px; padding-bottom: 70px; } .small-box { margin-bottom: 20px; } .box { margin-bottom: 30px; padding-bottom: 35px; } .block { margin-bottom: 40px; } .large-block { margin-bottom: 70px; } article { margin-bottom: 20px; } #main { margin-bottom: 40px; } .body-blank { display: table; height: 100%; left: 0; margin: 0; overflow-x: hidden; position: absolute; top: 0; width: 100%; } .wrapper-blank { display: table-cell; float: none; vertical-align: middle; width: 100%; } /* 2. Global Styles ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .table-wrapper { display: table; } .table-wrapper .table-row { display: table-row; float: none !important; } .table-wrapper .table-cell { display: table-cell; vertical-align: top; float: none !important; } .table-wrapper .table-cell.content-middle { vertical-align: middle; } .image-container img { max-width: 100%; } .imagebg-container { background-repeat: no-repeat; background-position: center center; } .banner { position: relative; z-index: 1; padding: 90px 0; } .banner .big-caption, .banner .med-caption { color: #fff; text-shadow: -2px 2px 3px rgba(0, 0, 0, 0.25); } .banner .big-caption { font-size: 4.1667em; } .banner .med-caption { font-size: 2.5em; } /* box title */ .box-title { margin-bottom: 0; line-height: 1em; } .box-title small { font-size: 10px; color: #838383; text-transform: uppercase; display: block; margin-top: 4px; /*letter-spacing: normal;*/ } .box-title small [class^="soap-icon"] { color: #fdb714; font-size: 1.3333em; } h2.box-title small { font-size: 11px; } h1.box-title small { font-size: 12px; } .s-title { color: #01b7f2; } .s-title a:hover { color: #40cbf8; } .m-title { margin: 0; } .f-title { letter-spacing: 0.04em; margin-bottom: 10px; } .border-bottom { border-bottom: 1px solid #f5f5f5; } /*#slideshow, */ .flex-viewport .slides li { /*img { */ -webkit-backface-visibility: hidden; -webkit-perspective: 1000; -webkit-transform: translateZ(0); -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; -o-user-select: none; /* }*/ } /* 2.1. Form Elements ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ input.input-text, select, textarea, span.custom-select { background: #f5f5f5; border: none; line-height: normal; } input.input-text, textarea, span.custom-select { padding-left: 15px; padding-right: 15px; height: 34px; } input.input-text.input-large, textarea.input-large, span.custom-select.input-large { height: 43px; font-size: 1.1667em; } input.input-text.input-medium, textarea.input-medium, span.custom-select.input-medium { height: 34px; } input.input-text.input-small, textarea.input-small, span.custom-select.input-small { height: 28px; } input.input-text.input-mini, textarea.input-mini, span.custom-select.input-mini { height: 19px; } input.input-text.white, textarea.white, span.custom-select.white { background: #fff; } textarea { height: auto; padding-top: 10px; padding-bottom: 10px; } /* 2.1.1. Select box */ select { height: 34px; padding: 8px 0 8px 8px; } select option { padding: 2px 10px; } .selector { position: relative; min-width: 60px; line-height: 0; } .selector select { position: absolute; z-index: 1; filter: alpha(opacity=0); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; -moz-opacity: 0; -khtml-opacity: 0; opacity: 0; width: 100%; -webkit-appearance: menulist-button; line-height: 30px; } .selector span.custom-select { display: inline-block; line-height: 32px; padding: 0 10px; position: relative; width: 100%; overflow: hidden; white-space: nowrap; } .selector span.custom-select:before { position: absolute; right: 0; top: 0; content: ''; background: #fdb714; width: 24px; height: 100%; } .selector span.custom-select:after { position: absolute; right: 9px; top: 15px; border-top: 5px solid #fff; border-left: 3px solid transparent; border-right: 3px solid transparent; content: ""; } .selector.style1 span.custom-select:before { background: transparent; } .selector.style1 span.custom-select:after { border-top-color: #fdb714; } /* 2.1.2. File input box */ .fileinput { position: relative; display: inline-block; min-width: 100px; } .fileinput input[type=file] { position: relative; z-index: 2; filter: alpha(opacity=0); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; -moz-opacity: 0; -khtml-opacity: 0; opacity: 0; width: 100%; } .fileinput .custom-fileinput { position: absolute; z-index: 0; top: 0; left: 0; width: 100%; line-height: normal; } .fileinput:after { display: block; content: "BROWSE"; position: absolute; top: 0; right: 0; bottom: 0; z-index: 1; background: #fdb714; color: #fff; font-size: 1em; padding-left: 15px; padding-right: 15px; letter-spacing: 0.04em; font-weight: bold; vertical-align: middle; } /* 2.1.3. Checkbox and Radio */ .checkbox, .radio { position: relative; margin-top: 0; line-height: 20px; } .checkbox:before, .radio:before { display: block; content: ""; position: absolute; left: 0; top: 3px; width: 14px; height: 14px; border: 1px solid #d1d1d1; z-index: 0; font-family: "soap-icons"; line-height: 12px; text-align: center; } .checkbox.checked:before, .radio.checked:before { border-color: #01b7f2; color: #fff; background: #01b7f2; content: "\e8ba"; } /* checkbox */ .checkbox label, .checkbox.label { font-size: 1.0833em; line-height: 20px; color: #9e9e9e; } .checkbox input[type="checkbox"] { position: relative; z-index: 1; filter: alpha(opacity=0); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; -moz-opacity: 0; -khtml-opacity: 0; opacity: 0; } /* radio */ .radio label, .radio.label { font-size: 0.9167em; line-height: 20px; } .radio input[type="radio"] { position: relative; z-index: 1; filter: alpha(opacity=0); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; -moz-opacity: 0; -khtml-opacity: 0; opacity: 0; } .radio:before { background: #fff; -webkit-border-radius: 50% 50% 50% 50%; -moz-border-radius: 50% 50% 50% 50%; -ms-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; font-size: 1.3333em; line-height: 13px; } .radio.radio-square:before { -webkit-border-radius: 0 0 0 0; -moz-border-radius: 0 0 0 0; -ms-border-radius: 0 0 0 0; border-radius: 0 0 0 0; } .radio.checked:before { content: "\e892"; } .checkbox-inline, .radio-inline { margin-left: 10px; } /* 2.1.4. Form */ form label { text-transform: uppercase; display: block; margin-bottom: 5px; font-weight: normal; font-size: 0.9167em; } form .checkbox label, form label.checkbox { font-size: 1.0833em; text-transform: none; } form .radio label, form label.radio { font-size: 0.9167em; } form .form-group { margin-bottom: 15px; } .sidebar form .form-group { margin-bottom: 10px; } .sidebar form label { font-size: 0.8333em; margin-bottom: 3px; } .panel-content form label { font-size: 0.8333em; margin-bottom: 3px; } /* Fourty space */ .box-title, .post-title, .post-meta, .author .name, .mile, .title, .s-title, .price, button, input[type="button"].button, a.button, dl, label, span.info, .price-wrapper, ul.tabs a, .icon-box.style1, .icon-box.style2, .icon-box.style3 .description, .icon-box.style5, .search-results-title, .breadcrumbs { letter-spacing: 0.04em; } /* 2.2. Buttons ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ /* 2.2.1. Buttons */ button, input[type="button"].button, a.button { border: none; color: #fff; cursor: pointer; padding: 0 15px; white-space: nowrap; } button.btn-large, input[type="button"].button.btn-large, a.button.btn-large { padding: 0 32px; height: 43px; font-size: 1.1667em; line-height: 43px; } button.btn-medium, input[type="button"].button.btn-medium, a.button.btn-medium { padding: 0 32px; height: 34px; line-height: 34px; font-size: 1em; } button.btn-small, input[type="button"].button.btn-small, a.button.btn-small { height: 28px; padding: 0 24px; line-height: 28px; font-size: 0.9167em; } button.btn-mini, input[type="button"].button.btn-mini, a.button.btn-mini { height: 19px; padding: 0 20px; font-size: 0.8333em; line-height: 19px; } button.full-width, input[type="button"].button.full-width, a.button.full-width { padding-left: 0; padding-right: 0; } button, input[type="button"].button { font-size: 0.9167em; font-weight: bold; background: #98ce44; height: 34px; line-height: 34px; } button:hover, input[type="button"].button:hover { background: #7fb231; } a.button { display: inline-block; background: #d9d9d9; font-size: 0.8333em; line-height: 1.8333em; white-space: nowrap; text-align: center; } a.button:hover { background: #98ce44; } a.button.btn-mini { padding-left: 10px; padding-right: 10px; } a.button.btn-large, a.button.btn-medium, a.button.btn-small, a.button.full-width { font-weight: bold; } button, input[type="button"].button, a.button { /* Extra buttons */ } button.white, input[type="button"].button.white, a.button.white { background: #fff; color: inherit; } button.silver, input[type="button"].button.silver, a.button.silver { background: #d9d9d9; } button.sky-blue1, input[type="button"].button.sky-blue1, a.button.sky-blue1 { background: #01b7f2; } button.sky-blue1:hover, input[type="button"].button.sky-blue1:hover, a.button.sky-blue1:hover { background: #07a5d8; } button.yellow, input[type="button"].button.yellow, a.button.yellow { background: #fdb714; } button.yellow:hover, input[type="button"].button.yellow:hover, a.button.yellow:hover { background: #e9b02b; } button.dark-blue1, input[type="button"].button.dark-blue1, a.button.dark-blue1 { background: #2d3e52; } button.green, input[type="button"].button.green, a.button.green { background: #98ce44; } button.green:hover, input[type="button"].button.green:hover, a.button.green:hover { background: #7fb231; } button.red, input[type="button"].button.red, a.button.red { background: #e44049; } button.light-brown, input[type="button"].button.light-brown, a.button.light-brown { background: #e6c687; } button.orange, input[type="button"].button.orange, a.button.orange { background: #ff6000; } button.dull-blue, input[type="button"].button.dull-blue, a.button.dull-blue { background: #12a0c3; } button.light-orange, input[type="button"].button.light-orange, a.button.light-orange { background: #f5a77d; } button.light-purple, input[type="button"].button.light-purple, a.button.light-purple { background: #db8df6; } button.sea-blue, input[type="button"].button.sea-blue, a.button.sea-blue { background: #0ab596; } button.sky-blue2, input[type="button"].button.sky-blue2, a.button.sky-blue2 { background: #6dace6; } button.dark-blue2, input[type="button"].button.dark-blue2, a.button.dark-blue2 { background: #194eb0; } button.dark-orange, input[type="button"].button.dark-orange, a.button.dark-orange { background: #ff3e3e; } button.purple, input[type="button"].button.purple, a.button.purple { background: #9f60b5; } button.light-yellow, input[type="button"].button.light-yellow, a.button.light-yellow { background: #ffd200; } button.btn-extra, input[type="button"].button.btn-extra, a.button.btn-extra { font-size: 1em; height: 70px; padding: 0; text-transform: uppercase; background: transparent; color: #fff; line-height: 1.5em; border: 1px solid #01b7f2; border-left: none; position: relative; overflow: hidden; letter-spacing: 0; display: inline-table; table-layout: fixed; margin-right: 10px; margin-bottom: 10px; } button.btn-extra > i, input[type="button"].button.btn-extra > i, a.button.btn-extra > i { width: 55px; vertical-align: middle; background: #01b7f2; color: #2d3e52; font-size: 36px; display: table-cell; height: 70px; text-align: right; padding-right: 8px; } button.btn-extra > i:after, input[type="button"].button.btn-extra > i:after, a.button.btn-extra > i:after { display: block; content: ""; position: absolute; left: 55px; border-bottom: 70px solid #01b7f2; border-right: 16px solid transparent; top: 0; bottom: 0; } button.btn-extra > span, input[type="button"].button.btn-extra > span, a.button.btn-extra > span { display: table-cell; vertical-align: middle; padding: 0 20px 0 35px; text-align: left; } button.btn-extra > span em, input[type="button"].button.btn-extra > span em, a.button.btn-extra > span em { color: #01b7f2; font-size: 1.6667em; font-weight: bold; font-style: normal; } button.btn-extra:hover, input[type="button"].button.btn-extra:hover, a.button.btn-extra:hover { color: inherit; background: #fff; border: none; border-right: 1px solid transparent !important; } button.btn-extra:hover > i, input[type="button"].button.btn-extra:hover > i, a.button.btn-extra:hover > i { color: #fff; } button.btn-extra.blue, input[type="button"].button.btn-extra.blue, a.button.btn-extra.blue { border-color: #01b7f2; } button.btn-extra.blue > i, input[type="button"].button.btn-extra.blue > i, a.button.btn-extra.blue > i { background: #01b7f2; } button.btn-extra.blue > i:after, input[type="button"].button.btn-extra.blue > i:after, a.button.btn-extra.blue > i:after { border-bottom-color: #01b7f2; } button.btn-extra.blue > span em, input[type="button"].button.btn-extra.blue > span em, a.button.btn-extra.blue > span em { color: #01b7f2; } button.btn-extra.yellow, input[type="button"].button.btn-extra.yellow, a.button.btn-extra.yellow { border-color: #fdb714; } button.btn-extra.yellow > i, input[type="button"].button.btn-extra.yellow > i, a.button.btn-extra.yellow > i { background: #fdb714; } button.btn-extra.yellow > i:after, input[type="button"].button.btn-extra.yellow > i:after, a.button.btn-extra.yellow > i:after { border-bottom-color: #fdb714; } button.btn-extra.yellow > span em, input[type="button"].button.btn-extra.yellow > span em, a.button.btn-extra.yellow > span em { color: #fdb714; } .icon-check { position: relative; padding-right: 30px !important; padding-left: 0 !important; overflow: hidden; /*&:hover:after { @include animation(toTopFromBottom, 0.35s, forwards); }*/ } .icon-check:after { content: ""; position: absolute; top: 0; right: 0; width: 30px; height: 100%; background: url(../images/icon/icon-check.png) no-repeat center center #7db921; } .icon-check:hover:after { background-color: #98ce44; } .with-icon { position: relative; padding: 0 !important; display: inline-block; } .with-icon .icon { position: absolute; right: 0; top: 50%; margin: -17px 0 0 !important; width: 30px; font-size: 18px; color: #a4a4a4; background: none; padding: 0 !important; height: auto; } .with-icon .input-text { padding-right: 40px !important; } .with-icon.input-large .icon { width: 43px; height: 43px; margin-top: -21px !important; font-size: 22px; } .with-icon.input-large .input-text { padding-right: 48px !important; } /* 2.2.2. Alert message */ .alert { -webkit-border-radius: 0 0 0 0; -moz-border-radius: 0 0 0 0; -ms-border-radius: 0 0 0 0; border-radius: 0 0 0 0; border: none; padding: 15px 15px 15px 70px; color: #fff; font-size: 1.0833em; position: relative; } .alert:before { content: "\f003"; font-family: "soap-icons"; display: block; font-size: 18px; width: 30px; height: 30px; line-height: 30px; margin: 0 auto; border: 1px solid #fff; -webkit-border-radius: 50% 50% 50% 50%; -moz-border-radius: 50% 50% 50% 50%; -ms-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; text-align: center; position: absolute; top: 10px; left: 20px; } .alert.alert-general { background: #d9d9d9; } .alert.alert-general:before { content: "\e8bd"; } .alert.alert-notice { background: #f5cf77; } .alert.alert-notice:before { content: "\e8bb"; } .alert.alert-error { background: #f6bcc3; } .alert.alert-error:before { content: "\e8bc"; } .alert.alert-success { background: #bae675; } .alert.alert-success:before { content: "\e8ba"; } .alert.alert-help { background: #91e3fd; } .alert.alert-help:before { content: "\e876"; } .alert.alert-info { background: #bfc9f9; } .alert.alert-info:before { content: "\e818"; } .alert .close, .info-box .close { filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; font-weight: normal; color: #fff; font-size: 12px; cursor: pointer; text-shadow: none; float: none; position: absolute; top: 8px; right: 8px; } .alert .close:before, .info-box .close:before { content: "\f00d"; font-family: FontAwesome; } .error-field { border: 1px solid #f00; } /* 2.2.3. Info box */ .info-box { padding: 20px 25px; border: 1px solid #01b7f2; position: relative; } .info-box .close { color: #01b7f2; } .info-box p { font-size: 1.1667em; } .info-box > *:last-child { margin-bottom: 0; } /* 2.2.4. Term Description */ dl.term-description { text-transform: uppercase; font-size: 0.9167em; } dl.term-description dt, dl.term-description dd { line-height: 1.3333em; float: left; width: 50%; padding-top: 0.5em; padding-bottom: 0.5em; } dl.term-description dt { border-right: 1px solid #f5f5f5; color: #01b7f2; font-weight: 400; padding-right: 5px; clear: both; } dl.term-description dd { padding-left: 20px; } dl.term-description:after { content: ""; display: table; clear: both; } /* 2.2.5. Dropcap */ .dropcap:first-letter { float: left; color: #01b7f2; font-size: 4.153em; line-height: 0.8667em; padding: 0; margin-right: 6px; font-weight: bold; text-transform: uppercase; display: block; } .dropcap.colored:first-letter { color: #fff; background: #01b7f2; padding: 4px 4px; margin-top: 3px; margin-right: 10px; } /* 2.2.6. Blockquote */ q, blockquote { quotes: '\201C' '\201D' '\2018' '\2019'; } blockquote { font-size: 1.3333em; line-height: 1.6em; padding: 20px 20px 20px 40px; border-left: none; position: relative; text-indent: -19px; } blockquote p { font-size: 1em; } blockquote:before, blockquote:after { font-family: Georgia,serif; font-size: 2.5em; vertical-align: middle; line-height: 0; } blockquote:before { content: open-quote; margin-right: 4px; } blockquote:after { content: close-quote; margin-left: 3px; } blockquote.style1, blockquote.style2 { background: #fff; font-style: italic; } blockquote.style1 p, blockquote.style2 p { display: inline; } blockquote.style1 { border-left: 3px solid #fdb714; position: relative; } blockquote.style1 > span.triangle:before { text-indent: 0; content: "\f0da"; font-family: FontAwesome; color: #fdb714; position: absolute; left: -1px; top: 50%; margin-top: -11px; font-style: normal; } blockquote.style1:before, blockquote.style1:after { color: #f5f5f5; } blockquote.style1.border-color-blue { border-color: #01b7f2; } blockquote.style1.border-color-blue > span.triangle:before { color: #01b7f2; } blockquote.style1.border-color-yellow { border-color: #fdb714; } blockquote.style1.border-color-yellow > span.triangle:before { color: #fdb714; } blockquote.style1.quote-color-blue:before, blockquote.style1.quote-color-blue:after { color: #01b7f2; } blockquote.style1.quote-color-yellow:before, blockquote.style1.quote-color-yellow:after { color: #fdb714; } blockquote.style2 { color: #01b7f2; } blockquote.style2:before, blockquote.style2:after { color: #fdb714; } /* 2.2.7. Pagination */ .pagination { -webkit-border-radius: 0 0 0 0; -moz-border-radius: 0 0 0 0; -ms-border-radius: 0 0 0 0; border-radius: 0 0 0 0; } .pagination > li { float: left; height: 32px; margin-right: 6px; text-align: center; font-size: 0.9167em; } .pagination > li.disabled > span { color: #fff; background: #d9d9d9; } .pagination > li.disabled > span:hover { background: #d9d9d9; } .pagination > li > a, .pagination > li > span { line-height: 32px; padding: 0 10px; color: #fff; border-radius: 0 !important; background: #d9d9d9; border: none; text-transform: uppercase; font-weight: bold; } .pagination > li > a:hover, .pagination > li > a:focus, .pagination > li > span:hover, .pagination > li > span:focus { color: #fff; background: #fdb714; } .pagination > li.active > a, .pagination > li.active > span { background: #fdb714 !important; } .pagination > li.first, .pagination > li.prev { margin-right: 10px; } .pagination > li.next, .pagination > li.last { margin-left: 4px; } .pagination > li.first > a, .pagination > li.prev > a, .pagination > li.next > a, .pagination > li.last > a { background: #98ce44; padding: 0 15px; } .pagination > li.first > a:hover, .pagination > li.prev > a:hover, .pagination > li.next > a:hover, .pagination > li.last > a:hover { background: #fdb714; } .pagination > li.first.disabled > a, .pagination > li.first.disabled > span, .pagination > li.prev.disabled > a, .pagination > li.prev.disabled > span, .pagination > li.next.disabled > a, .pagination > li.next.disabled > span, .pagination > li.last.disabled > a, .pagination > li.last.disabled > span { color: #fff; background: #d9d9d9; } /* 2.2.8. Hover effect */ .hover-effect { display: block; position: relative; background: none; overflow: hidden; /*z-index: 0;*/ /*color skin*/ /* style1 : checked icon */ } .hover-effect:after { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; visibility: hidden; -moz-transition: all 0.4s ease-out; -o-transition: all 0.4s ease-out; -webkit-transition: all 0.4s ease-out; -ms-transition: all 0.4s ease-out; transition: all 0.4s ease-out; -webkit-transform: rotateY(180deg) scale(0.5, 0.5); -moz-transform: rotateY(180deg) scale(0.5, 0.5); -ms-transform: rotateY(180deg) scale(0.5, 0.5); -o-transform: rotateY(180deg) scale(0.5, 0.5); transform: rotateY(180deg) scale(0.5, 0.5); background: url(../images/icon/hover-effect.png) no-repeat center; filter: alpha(opacity=0); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; -moz-opacity: 0; -khtml-opacity: 0; opacity: 0; background-color: rgba(1, 183, 242, 0.6); } .hover-effect img { display: block; position: relative; -moz-transition: all 0.4s ease-out; -o-transition: all 0.4s ease-out; -webkit-transition: all 0.4s ease-out; -ms-transition: all 0.4s ease-out; transition: all 0.4s ease-out; -webkit-backface-visibility: hidden; } .hover-effect:hover:after { visibility: visible; -webkit-transform: rotateY(0deg) scale(1, 1); -moz-transform: rotateY(0deg) scale(1, 1); -ms-transform: rotateY(0deg) scale(1, 1); -o-transform: rotateY(0deg) scale(1, 1); transform: rotateY(0deg) scale(1, 1); filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; } .hover-effect:hover img { -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -ms-transform: scale(1.2); -o-transform: scale(1.2); transform: scale(1.2); } .hover-effect.yellow:after { background-color: rgba(255, 255, 40, 0.6); } .hover-effect.style1:after { color: #fff; background: none; content: "\e8ba"; font-family: "soap-icons"; font-size: 1.6667em; text-align: center; line-height: 50px; border: 2px solid #fff; -webkit-border-radius: 50% 50% 50% 50%; -moz-border-radius: 50% 50% 50% 50%; -ms-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; width: 50px; height: 50px; left: 50%; top: 50%; margin-left: -25px; margin-top: -25px; } .hover-effect.style1:hover { background: #01b7f2; } .hover-effect.style1:hover img { filter: alpha(opacity=50); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; -moz-opacity: 0.5; -khtml-opacity: 0.5; opacity: 0.5; } .selected-effect { display: block; position: relative; background: none; overflow: hidden; background: #01b7f2; } .selected-effect img { filter: alpha(opacity=50); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; -moz-opacity: 0.5; -khtml-opacity: 0.5; opacity: 0.5; } .selected-effect:after { position: absolute; color: #fff; background: none; content: "\e8ba"; font-family: "soap-icons"; font-size: 1.6667em; text-align: center; line-height: 50px; border: 2px solid #fff; -webkit-border-radius: 50% 50% 50% 50%; -moz-border-radius: 50% 50% 50% 50%; -ms-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; width: 50px; height: 50px; left: 50%; top: 50%; margin-left: -25px; margin-top: -25px; } .animated .hover-effect { z-index: 0; } /* 2.2.9. Social icons */ .social-icons li { float: left; text-align: center; } .social-icons li a { width: 32px; margin-right: 4px; height: 32px; display: inline-block; background: #d9d9d9; color: #fff; line-height: 32px; font-size: 1.3333em; -moz-transition: opacity 0.3s ease-in; -o-transition: opacity 0.3s ease-in; -webkit-transition: opacity 0.3s ease-in; -ms-transition: opacity 0.3s ease-in; transition: opacity 0.3s ease-in; } .social-icons li a:hover { background: #01b7f2; } .social-icons li:last-child { margin-right: 0; } .social-icons.icon-circle a { -webkit-border-radius: 50% 50% 50% 50%; -moz-border-radius: 50% 50% 50% 50%; -ms-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; overflow: hidden; } .social-icons.style1 a:hover { background: #01b7f2; } .social-icons.style2 a { -webkit-border-radius: 50% 50% 50% 50%; -moz-border-radius: 50% 50% 50% 50%; -ms-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; } .social-icons.full-width { display: block; } .social-icons.full-width li { display: table-cell; float: none; width: 1%; margin: 0; text-align: center; } .social-icons li { overflow: hidden; } .social-icons li:hover i { -webkit-animation: toRightFromLeft 0.3s forwards; -moz-animation: toRightFromLeft 0.3s forwards; animation: toRightFromLeft 0.3s forwards; display: block; } /* 2.2.10. Five Stars */ .five-stars-container { display: inline-block; position: relative; font-family: 'Glyphicons Halflings'; font-size: 14px; text-align: left; cursor: default; white-space: nowrap; line-height: 1.2em; color: #dbdbdb; } .five-stars-container .five-stars, .five-stars-container.editable-rating .ui-slider-range { display: block; overflow: hidden; position: relative; background: #fff; padding-left: 1px; } .five-stars-container .five-stars:before, .five-stars-container.editable-rating .ui-slider-range:before { content: "\e006\e006\e006\e006\e006"; color: #fdb714; } .five-stars-container .five-stars.transparent-bg, .five-stars-container.editable-rating .ui-slider-range.transparent-bg { background: none; } .five-stars-container:before { display: block; position: absolute; top: 0; left: 1px; content: "\e006\e006\e006\e006\e006"; z-index: 0; } /* 2.2.11. Price section */ .price { color: #7db921; font-size: 1.6667em; text-transform: uppercase; float: right; text-align: right; line-height: 1; display: block; } .price small { display: block; color: #838383; font-size: 0.5em; } .price-wrapper { font-weight: normal; text-transform: uppercase; font-size: 0.8333em; color: inherit; line-height: 1.3333em; margin: 0; } .price-wrapper .price-per-unit { color: #7db921; font-size: 1.4em; padding-right: 5px; } /* 2.2.12. Time section */ .time { text-transform: uppercase; font-size: 0.8333em; line-height: 19px; } .time [class^="soap-icon"] { float: left; font-size: 18px; color: #fdb714; margin-right: 5px; } .post-title { margin-bottom: 0; } .post-meta { font-size: 0.8333em; text-transform: uppercase; } .sep { padding: 0 5px; } /* 2.2.13. Badge */ .badge-container { position: relative; display: block; } .badge-container .badge-content { width: 42px; height: 42px; position: absolute; top: -10px; left: -10px; background: #e01a33; color: #fff; font-size: 0.8333em; text-align: center; line-height: 1.0833em; -webkit-border-radius: 50% 50% 50% 50%; -moz-border-radius: 50% 50% 50% 50%; -ms-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; text-transform: uppercase; padding: 10px 0 0; margin: 0; font-weight: bold; z-index: 1; } .badge-container .badge-content.right-side { right: -10px; left: auto; } .badge-container img { margin: 0 !important; } /* 2.3. Travelo Elements ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .suggestions.image-carousel.style2 .slides > li { margin-right: 24px; } .suggestions.image-carousel.style2 .slides > li img { width: 100%; height: auto; } .suggestions .caption { margin-top: 10px; text-align: center; margin-bottom: 0; } .travelo-box { background: #fff; padding: 20px; margin-bottom: 30px; } .travelo-box > *:last-child { margin-bottom: 0; } .travelo-box .title { margin-bottom: 5px; } .travelo-box .box-title { margin-bottom: 15px; } .travelo-box.box-full { padding: 30px; } .travelo-box.search-stories-box button { height: 34px; /*margin: 0 !important;*/ padding: 0 10px; font-size: 1em; } .travelo-box.twitter-box .twitter-holder > ul li { border-bottom: 1px solid #f5f5f5; padding: 15px 0 15px 40px; position: relative; } .travelo-box.twitter-box .twitter-holder > ul li:last-child { border: none; } .travelo-box.twitter-box .twitter-holder > ul li:before { content: "\f099"; font-family: FontAwesome; display: block; width: 32px; height: 32px; -webkit-border-radius: 50% 50% 50% 50%; -moz-border-radius: 50% 50% 50% 50%; -ms-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; border: 1px solid #fdb714; color: #fdb714; line-height: 32px; text-align: center; position: absolute; left: 0; font-size: 16px; } .travelo-box.twitter-box .twitter-holder > ul li .tweet-text a { color: #01b7f2; } .travelo-box.twitter-box .twitter-holder > ul li .tweet-text a:hover { text-decoration: underline; } .travelo-box.contact-box .contact-details { margin: 0; } .travelo-box.contact-box .contact-details .contact-phone { color: #01b7f2; } .travelo-box.contact-box .contact-details .contact-phone > i { color: #fdb714; } .travelo-box.contact-box .contact-details .contact-email { color: inherit; } .travelo-box.book-with-us-box li, .travelo-box.contact-us-box .contact-address li { border-bottom: 1px solid #f5f5f5; padding: 10px 0 10px 40px; position: relative; } .travelo-box.book-with-us-box li > i, .travelo-box.contact-us-box .contact-address li > i { position: absolute; font-size: 1.5em; color: #fdb714; left: 0; top: 12px; } .travelo-box.book-with-us-box li:last-child, .travelo-box.contact-us-box .contact-address li:last-child { border-bottom-width: 0; padding-bottom: 0; } .travelo-box.book-with-us-box li .title, .travelo-box.contact-us-box .contact-address li .title { color: #2d3e52; } .travelo-box.book-with-us-box li:after, .travelo-box.contact-us-box .contact-address li:after { display: table; clear: both; content: ""; } .travelo-box.book-with-us-box li > *:last-child, .travelo-box.contact-us-box .contact-address li > *:last-child { margin-bottom: 0; } .travelo-box.contact-us-box .title { color: #2d3e52; } .travelo-box.contact-us-box .contact-address { margin-bottom: 25px; } .travelo-box.contact-us-box .contact-address li { padding-left: 50px; } .travelo-box.contact-us-box .contact-address li p { font-size: 0.8333em; text-transform: uppercase; margin-bottom: 0; } .travelo-box.contact-us-box .contact-address li:last-child { border-bottom-width: 1px; padding-bottom: 10px; } .travelo-box.contact-us-box .social-icons a { overflow: hidden; } .travelo-box.contact-us-box .social-icons a:hover i:before { -webkit-animation: toBottomFromTop 0.4s forwards; -moz-animation: toBottomFromTop 0.4s forwards; animation: toBottomFromTop 0.4s forwards; } .travelo-box.newsletter-box { padding: 20px 30px; } .travelo-box.newsletter-box button { margin-right: 0 !important; margin-bottom: 0 !important; } .travelo-box.newsletter-box .row > div { margin-bottom: 0 !important; } .travelo-box.re-search-box label { font-size: 0.8333em; text-transform: uppercase; margin: 5px 0 0 0; } .travelo-box.re-search-box button { text-transform: uppercase; } .travelo-box.about-travelo-box .title { color: #01b7f2; } .travelo-box.guarantee-box { text-align: center; } .travelo-box.guarantee-box .guarantee-image { display: block; margin: 0 auto 15px; } .travelo-box.insurance-benefits ul { font-size: 0.9167em; } .travelo-box.insurance-benefits ul li { line-height: 3.6667em; border-bottom: 1px solid #f5f5f5; text-transform: uppercase; } .travelo-box.insurance-benefits ul li:before { color: #d9d9d9; } .travelo-box.insurance-benefits ul li.active:before, .travelo-box.insurance-benefits ul.hover li:hover:before { color: #fdb714; } .contact-details { font-style: normal; } .contact-details .contact-phone { color: #2d3e52; font-size: 1.6667em; } .contact-details .contact-phone i { color: #01b7f2; } .contact-details .contact-email { color: #01b7f2; font-size: 1.1667em; padding: 0 24px; line-height: 2em; } /* 2.4. Skin Color ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .title { color: #2d3e52; } /* 2.5. Positioning ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .middle-block { position: relative; display: block; overflow: hidden; } .middle-block .middle-item { position: absolute; } .middle-block img.middle-item { max-width: none; min-width: 100%; } .column-2 > *, .column-3 > *, .column-4 > *, .column-5 > *, .column-5-no-margin > *, .constant-column-2 > *, .constant-column-3 > *, .constant-column-4 > *, .constant-column-5 > * { float: left; } .column-2:after, .column-3:after, .column-4:after, .column-5:after, .column-5-no-margin:after, .constant-column-2:after, .constant-column-3:after, .constant-column-4:after, .constant-column-5:after { clear: both; content: ""; display: table; } .column-5-no-margin > *:nth-child(5n+1) { clear: both; } .column-5-no-margin > * { width: 20%; } .column-2 > *, .constant-column-2 > * { width: 48.5%; margin-right: 3%; margin-bottom: 3%; } .column-2 > *:nth-child(2n), .constant-column-2 > *:nth-child(2n) { margin-right: 0; } .column-2 > *:nth-child(2n+1), .constant-column-2 > *:nth-child(2n+1) { clear: both; } .column-3 > *, .constant-column-3 > * { width: 31.3333%; margin-right: 3%; margin-bottom: 3%; } .column-3 > *:nth-child(3n), .constant-column-3 > *:nth-child(3n) { margin-right: 0; } .column-3 > *:nth-child(3n+1), .constant-column-3 > *:nth-child(3n+1) { clear: both; } .column-4 > *, .constant-column-4 > * { width: 22.75%; margin-right: 3%; margin-bottom: 3%; } .column-4 > *:nth-child(4n), .constant-column-4 > *:nth-child(4n) { margin-right: 0; } .column-4 > *:nth-child(4n+1), .constant-column-4 > *:nth-child(4n+1) { clear: both; } .column-5 > *, .constant-column-5 > * { width: 17.6%; margin-right: 3%; margin-bottom: 3%; } .column-5 > *:nth-child(5n), .constant-column-5 > *:nth-child(5n) { margin-right: 0; } .column-5 > *:nth-child(5n+1), .constant-column-5 > *:nth-child(5n+1) { clear: both; } /* 2.6. Unordered lists ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ ul.arrow, ul.triangle, ul.circle, ul.check, ul.chevron, ul.arrow-square, ul.check-square, ul.check-circle, ul.decimal, ul.upper-roman, ul.lower-latin, ul.upper-latin { line-height: 2em; font-size: 1em; } ul.arrow li.active, ul.arrow li.active:before, ul.arrow.hover li:hover, ul.arrow.hover li:hover:before, ul.triangle li.active, ul.triangle li.active:before, ul.triangle.hover li:hover, ul.triangle.hover li:hover:before, ul.circle li.active, ul.circle li.active:before, ul.circle.hover li:hover, ul.circle.hover li:hover:before, ul.check l.active, ul.check li.active:before, ul.check.hover li:hover, ul.check.hover li:hover:before, ul.chevron li.active, ul.chevron li.active:before, ul.chevron.hover li:hover, ul.chevron.hover li:hover:before, ul.arrow-square li.active, ul.arrow-square li.active:before, ul.arrow-square.hover li:hover, ul.arrow-square.hover li:hover:before, ul.check-square li.active, ul.check-square li.active:before, ul.check-square.hover li:hover, ul.check-square.hover li:hover:before, ul.check-circle li.active, ul.check-circle li.active:before, ul.check-circle.hover li:hover, ul.check-circle.hover li:hover:before, ul.decimal li.active, ul.decimal li.active:before, ul.decimal.hover li:hover, ul.decimal.hover li:hover:before, ul.upper-roman li.active, ul.upper-roman li.active:before, ul.upper-roman.hover li:hover, ul.upper-roman.hover li:hover:before, ul.lower-latin li.active, ul.lower-latin li.active:before, ul.lower-latin.hover li:hover, ul.lower-latin.hover li:hover:before, ul.upper-latin li.active, ul.upper-latin li.active:before, ul.upper-latin.hover li:hover, ul.upper-latin.hover li:hover:before { color: #01b7f2; } ul.arrow.hover li, ul.triangle.hover li, ul.circle.hover li, ul.check.hover li, ul.chevron.hover li, ul.arrow-square.hover li, ul.check-square.hover li, ul.check-circle.hover li, ul.decimal.hover li, ul.upper-roman.hover li, ul.lower-latin.hover li, ul.upper-latin.hover li { cursor: default; } ul.arrow, ul.triangle, ul.circle, ul.check, ul.chevron, ul.arrow-square, ul.check-square, ul.check-circle { list-style: none; padding: 0; } ul.arrow li:before, ul.triangle li:before, ul.circle li:before, ul.check li:before, ul.chevron li:before, ul.arrow-square li:before, ul.check-square li:before, ul.check-circle li:before { font-family: "FontAwesome"; } ul.arrow li:before { content: "\f178"; margin-right: 10px; color: #01b7f2; } ul.triangle li:before { content: "\f04b"; margin-right: 10px; color: #d9d9d9; display: block; float: left; font-size: 7px; } ul.triangle li.active, ul.triangle li.active:before, ul.triangle.hover li:hover, ul.triangle.hover li:hover .box-title, ul.triangle.hover li:hover:before { color: #01b7f2; } ul.circle li:before { content: "\f111"; margin-right: 10px; color: #01b7f2; display: block; float: left; font-size: 5px; } ul.circle.bullet-yellow li:before { color: #fdb714; } ul.circle.bullet-green li:before { color: #98ce44; } ul.circle.bullet-blue li:before { color: #01b7f2; } ul.check li:before { content: "\e8ba"; margin-right: 10px; color: #98ce44; font-family: "soap-icons"; font-size: 1.3333em; line-height: 1em; } ul.chevron li { padding-left: 30px !important; position: relative; } ul.chevron li:before { position: absolute; left: 0; top: 50%; margin-top: -10px; line-height: 20px; content: "\f054"; color: #01b7f2; display: block; width: 20px; height: 20px; text-align: center; font-size: 10px; border: 1px solid #01b7f2; -webkit-border-radius: 50% 50% 50% 50%; -moz-border-radius: 50% 50% 50% 50%; -ms-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; } ul.arrow-square li:before { content: "\f178"; margin-right: 10px; color: #fff; background: #01b7f2; padding: 0 2px 0 3px; } ul.decimal { counter-reset: item; } ul.decimal li:before { content: counters(item,".") "-"; counter-increment: item; margin-right: 5px; } ul.upper-roman { padding-left: 1.5em; list-style: upper-roman outside none; } ul.lower-latin { padding-left: 1.25em; list-style: lower-latin outside none; } ul.upper-latin { padding-left: 1.5em; list-style: upper-latin outside none; } /* colored */ ul.upper-roman.bullet-colored li, ul.lower-latin.bullet-colored li, ul.upper-latin.bullet-colored li { color: #01b7f2; } ul.upper-roman.bullet-colored li > *, ul.lower-latin.bullet-colored li > *, ul.upper-latin.bullet-colored li > * { color: #838383; } ul.check-square li:before { font-family: 'soap-icons'; content: "\e8ba"; background: #d9d9d9; color: #fff; padding: 1px 4px 0; margin-right: 10px; font-size: 12px; } ul.check-square li.active { background: #01b7f2; color: #fff; } ul.check-square li.active > a { color: #fff; } ul.check-square li.active:before { background: #fff; color: #fdb714; } ul.check-circle li:before { content: "\e8ba"; display: inline-block; color: #fff; margin-right: 10px; font-family: "soap-icons"; background: #fdb714; vertical-align: baseline; -webkit-border-radius: 50% 50% 50% 50%; -moz-border-radius: 50% 50% 50% 50%; -ms-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; width: 18px; height: 18px; text-align: center; line-height: 18px; } /* 2.7. Ordered lists ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ /* 2.8. Toggle & Accordion ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .toggle-container { background: #fff; /* 2.8.3. Accordion with image */ } .toggle-container .panel { margin-bottom: 0; box-shadow: none; -webkit-border-radius: 0 0 0 0; -moz-border-radius: 0 0 0 0; -ms-border-radius: 0 0 0 0; border-radius: 0 0 0 0; border: none; border-bottom: 2px solid #f5f5f5; position: relative; /*.panel-content { font-size: 1.0833em; }*/ /* 2.8.1. Style1 */ /* 2.8.2. Style2 */ } .toggle-container .panel:last-child { border: none; } .toggle-container .panel .panel-title { padding: 0; color: #2d3e52; font-size: 1.1667em; position: relative; } .toggle-container .panel .panel-title a { white-space: normal; display: block; padding: 15px; } .toggle-container .panel h1.panel-title { font-size: 2em; } .toggle-container .panel h2.panel-title { font-size: 1.6667em; } .toggle-container .panel h3.panel-title { font-size: 1.5em; } .toggle-container .panel h4.panel-title { font-size: 1.3333em; } .toggle-container .panel h5.panel-title { font-size: 1.1667em; } .toggle-container .panel h6.panel-title { font-size: 1em; } .toggle-container .panel.style1 .panel-title > a { line-height: 24px; } .toggle-container .panel.style1 .panel-title > a:before { display: block; content: "\f068"; font-family: FontAwesome; margin-right: 16px; line-height: 24px; font-size: 10px; float: left; width: 24px; height: 24px; text-align: center; color: #9e9e9e; background: #f5f5f5; -webkit-border-radius: 50% 50% 50% 50%; -moz-border-radius: 50% 50% 50% 50%; -ms-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; } .toggle-container .panel.style1 .panel-title > a.collapsed:before { content: "\f067"; color: #fff; background: #01b7f2; } .toggle-container .panel.style1 .panel-content { padding: 10px 15px 15px 55px; } .toggle-container .panel.style1.arrow-right .panel-title { position: relative; } .toggle-container .panel.style1.arrow-right .panel-title > a { padding-right: 36px; } .toggle-container .panel.style1.arrow-right .panel-title > a:before { float: none; position: absolute; right: 0; height: 16px; line-height: 17px; width: 16px; font-size: 9px; border: none; margin-top: -8px; top: 50%; } .toggle-container .panel.style1.arrow-right .panel-content { padding: 10px 15px; } .toggle-container .panel.style2 .panel-title { padding: 0; } .toggle-container .panel.style2 .panel-title > a { display: block; line-height: normal; padding: 15px 20px; color: #01b7f2; } .toggle-container .panel.style2 .panel-title > a.collapsed { color: inherit; position: relative; } .toggle-container .panel.style2 .panel-title > a.collapsed:hover { color: #01b7f2; } .toggle-container .panel.style2 .panel-title > a:after { content: "\f068"; font-family: FontAwesome; font-size: 10px; width: 30px; height: 30px; display: block; position: absolute; right: 15px; bottom: 0; color: #9e9e9e; background: #f5f5f5; text-align: center; line-height: 30px; } .toggle-container .panel.style2 .panel-title > a.collapsed:after { content: "\f067"; color: #fff; background: #01b7f2; } .toggle-container .panel.style2 .panel-content { padding: 0 15px 30px 20px; } .toggle-container.with-image > .image-container { background: #01b7f2; } .toggle-container.with-image > .image-container > img { width: 100%; height: auto; } .toggle-container.with-image .panel > img { display: none; } .toggle-container.with-image .panel-title > a { color: #01b7f2; } .toggle-container.with-image .panel-title > a.collapsed { color: inherit; } .toggle-container.with-image .panel-title > a.collapsed:hover { color: #01b7f2; } /* 2.9. Tabs ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .tab-wrapper { background: #fff; } .tab-wrapper .tab-container .tab-content .tab-pane { padding-left: 0; padding-right: 0; } .tab-pane [class^="col-"], .tab-pane [class*=" col-"] { padding-left: 10px; padding-right: 10px; } .tab-pane .row { margin-top: 0; margin-left: -10px; margin-right: -10px; } .tab-container { /* 2.9.1. Style 1 */ /* 2.9.2. Transparent Tab */ /* 2.9.3. Full Width Tab */ } .tab-container ul.tabs { margin: 0; padding: 0; } .tab-container ul.tabs li { float: left; padding-right: 4px; } .tab-container ul.tabs li:last-child { padding-right: 0; } .tab-container ul.tabs li a { color: #fff; display: block; padding: 0 20px; background: #d9d9d9; font-size: 1em; font-weight: bold; height: 40px; line-height: 40px; text-decoration: none; text-transform: uppercase; white-space: nowrap; } .tab-container ul.tabs li.active > a, .tab-container ul.tabs li:hover > a { color: #01b7f2; background: #fff; } .tab-container ul.tabs.full-width { display: block; /*margin-bottom: -4px;*/ } .tab-container ul.tabs.full-width li { float: none; display: table-cell; vertical-align: middle; width: 1%; } .tab-container ul.tabs.full-width li a { padding: 0; text-align: center; } .tab-container ul.tabs:after { display: table; content: ""; clear: both; } .tab-container .tab-content { background: #fff; } .tab-container .tab-content .tab-pane { padding: 20px; line-height: 1.7em; } .tab-container .tab-content .tab-pane .row { margin-bottom: 15px; /*border-top: 1px solid #f5f5f5; padding: 20px 0; &:first-child { border: none; padding-top: 0; } &:last-child { padding-bottom: 0; }*/ } .tab-container .tab-content .tab-pane > img { margin: 0 15px 0 0; } .tab-container .tab-content .tab-pane:after { content: ""; display: table; clear: both; } .tab-container .tab-content .tab-pane .image-box .details { padding-right: 0; } .tab-container.style1 ul.tabs { display: block; background: #fff; padding: 10px 0 10px 10px; border-bottom: 1px solid #f5f5f5; } .tab-container.style1 ul.tabs li { padding-right: 10px; } .tab-container.style1 ul.tabs li a { height: 30px; line-height: 30px; background: #f5f5f5; padding: 0 18px; color: #9e9e9e; font-weight: normal; font-size: 0.9167em; font-weight: bold; } .tab-container.style1 ul.tabs li.active > a, .tab-container.style1 ul.tabs li:hover > a { color: #fff; background: #01b7f2; position: relative; } .tab-container.style1 ul.tabs li.active > a:after, .tab-container.style1 ul.tabs li:hover > a:after { position: absolute; bottom: -5px; left: 50%; margin-left: -10px; border-top: 5px solid #01b7f2; border-left: 7px solid transparent; border-right: 7px solid transparent; content: ""; } .tab-container.style1 ul.tabs li:hover > a:after { display: none; } .tab-container.style1 ul.tabs li.active:hover > a:after { display: block; } .tab-container.style1 ul.tabs.full-width li a { padding: 0; } .tab-container.trans-style { position: relative; z-index: 1; margin-top: -40px; } .tab-container.trans-style ul.tabs { padding: 0 10px; } .tab-container.trans-style ul.tabs li a { filter: alpha(opacity=55.0); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=55.0)"; -moz-opacity: 0.55; -khtml-opacity: 0.55; opacity: 0.55; background: #fff; color: #000; overflow: hidden; } .tab-container.trans-style ul.tabs li a i { font-size: 16px; vertical-align: middle; margin-right: 10px; } .tab-container.trans-style ul.tabs li a i[class^="soap-icon"] { font-size: 20px; } .tab-container.trans-style ul.tabs li a:hover { filter: alpha(opacity=80); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; -moz-opacity: 0.8; -khtml-opacity: 0.8; opacity: 0.8; color: #01b7f2; } .tab-container.trans-style ul.tabs li a:hover i { -webkit-animation: toTopFromBottom 0.3s forwards; -moz-animation: toTopFromBottom 0.3s forwards; animation: toTopFromBottom 0.3s forwards; } .tab-container.trans-style ul.tabs li.active a { filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; color: #01b7f2; } .tab-container.trans-style ul.tabs li a:hover i, .tab-container.trans-style ul.tabs li.active a i { color: #fdb714; } .tab-container.full-width-style ul.tabs { width: 14%; float: left; } .tab-container.full-width-style ul.tabs:after { display: none; clear: none; } .tab-container.full-width-style ul.tabs li { float: none; margin: 0; padding-right: 0; } .tab-container.full-width-style ul.tabs li a { height: 100px; display: block; border-bottom: 3px solid #f5f5f5; border-right: 3px solid #f5f5f5; background: #fff; color: inherit; font-size: 1.1667em; text-transform: none; font-weight: normal; text-align: center; padding-top: 20px; line-height: 2em; } .tab-container.full-width-style ul.tabs li a > i { color: #d9d9d9; display: block; font-size: 18px; margin: 0 auto; width: 1.6em; height: 1.6em; line-height: 1.5em; overflow: hidden; } .tab-container.full-width-style ul.tabs li a:hover i:before { -webkit-animation: toTopFromBottom 0.3s forwards; -moz-animation: toTopFromBottom 0.3s forwards; animation: toTopFromBottom 0.3s forwards; } .tab-container.full-width-style ul.tabs li.active a, .tab-container.full-width-style ul.tabs li a:hover { color: #2d3e52; } .tab-container.full-width-style ul.tabs li a:hover i, .tab-container.full-width-style ul.tabs li.active a i { color: #fdb714; border-color: #fdb714; } .tab-container.full-width-style ul.tabs li:last-child.active a { border-bottom: none; } .tab-container.full-width-style ul.tabs li.active a { border-right-color: transparent; } .tab-container.full-width-style.arrow-left ul.tabs li { margin-bottom: 4px; } .tab-container.full-width-style.arrow-left ul.tabs li a { border: none; margin-right: 4px; } .tab-container.full-width-style.arrow-left ul.tabs li.active a { margin-right: 0; border-left: 2px solid #fdb714; position: relative; } .tab-container.full-width-style.arrow-left ul.tabs li.active a:after { display: block; content: ""; position: absolute; left: 0; top: 50%; margin-top: -5px; border-left: 3px solid #fdb714; border-top: 5px solid transparent; border-bottom: 5px solid transparent; } .tab-container.full-width-style.arrow-left .tab-content .tab-pane { padding: 30px; } .tab-container.full-width-style .tab-content { float: left; width: 86%; } .tab-container.full-width-style .tab-content .tab-content-title { color: #01b7f2; } .tab-container.full-width-style:after { display: table; content: ""; clear: both; } /* 2.10. Promo box ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .promo-box { margin: 0 0 30px 0; overflow: hidden; } .promo-box .table-wrapper { width: 100%; margin: 0; } .promo-box .table-cell { vertical-align: middle; } .promo-box .m-title { font-size: 2em; color: #fff; line-height: 1.5em; margin: 0; } .promo-box .m-title em { font-size: 1.28em; font-weight: bold; font-style: normal; } .promo-box .m-title em i { font-weight: normal; } .promo-box .action-section { padding: 20px 0 0; text-align: right; } .promo-box .action-section form .row > div { margin-bottom: 10px; } .promo-box .action-section button { text-transform: uppercase; } .promo-box .image-container { padding: 0; float: none; position: relative; text-align: center; } .promo-box .image-container img { position: absolute; left: 0; visibility: hidden; height: auto; } .promo-box .table-wrapper { height: 100%; } .promo-box .table-cell { vertical-align: middle; } .promo-box .content-section { padding: 40px 0; z-index: 1; position: relative; } /* 2.11. Photo Gallery ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .flexslider .slides > li { display: none; } .photo-gallery:not(.flex-direction-style) .flex-direction-nav, .image-carousel.style2 .flex-direction-nav { position: absolute; right: 0; top: -40px; width: 72px; height: 22px; } .photo-gallery:not(.flex-direction-style) .flex-direction-nav li a, .image-carousel.style2 .flex-direction-nav li a { width: 30px; height: 22px; background: #01b7f2; color: #fff; text-indent: -9999px; text-align: left; position: static; float: left; margin: 0; filter: alpha(opacity=100) !important; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)" !important; -moz-opacity: 1 !important; -khtml-opacity: 1 !important; opacity: 1 !important; -moz-transition: none 1s ease-in-out; -o-transition: none 1s ease-in-out; -webkit-transition: none 1s ease-in-out; -ms-transition: none 1s ease-in-out; transition: none 1s ease-in-out; } .photo-gallery:not(.flex-direction-style) .flex-direction-nav li a:before, .image-carousel.style2 .flex-direction-nav li a:before { position: absolute; display: block; font-family: FontAwesome; text-indent: 0; font-size: 12px; line-height: 22px; } .photo-gallery:not(.flex-direction-style) .flex-direction-nav li a.flex-prev, .image-carousel.style2 .flex-direction-nav li a.flex-prev { margin-right: 10px; } .photo-gallery:not(.flex-direction-style) .flex-direction-nav li a.flex-prev:before, .image-carousel.style2 .flex-direction-nav li a.flex-prev:before { content: "\f177"; left: 8px; } .photo-gallery:not(.flex-direction-style) .flex-direction-nav li a.flex-next:before, .image-carousel.style2 .flex-direction-nav li a.flex-next:before { content: "\f178"; right: 9px; } .photo-gallery:not(.flex-direction-style) .flex-direction-nav li a.flex-disabled, .image-carousel.style2 .flex-direction-nav li a.flex-disabled { background: #d9d9d9; } .photo-gallery.flex-direction-style .flex-direction-nav a:before { line-height: 1em; } .photo-gallery.flex-direction-style .flex-direction-nav a:hover, .photo-gallery.flex-direction-style .flex-direction-nav a:focus { color: rgba(0, 0, 0, 0.8); } .photo-gallery.flex-direction-style .flex-direction-nav { display: block !important; } .travelo-box > .image-carousel.style2 .flex-direction-nav { top: -60px; } .photo-gallery { background: #fff; box-shadow: none; border: none; margin: 0; -webkit-border-radius: 0 0 0 0; -moz-border-radius: 0 0 0 0; -ms-border-radius: 0 0 0 0; border-radius: 0 0 0 0; } .photo-gallery img { width: 100%; } .photo-gallery .slides > li { display: none; overflow: hidden; position: relative; } .photo-gallery .flex-control-nav { width: auto; position: absolute; right: 30px; bottom: 30px; } .photo-gallery .flex-control-nav > li { float: left; margin-left: 5px; margin-right: 0; } .photo-gallery .flex-control-nav > li a { background: none; display: block; width: 14px; height: 14px; -webkit-border-radius: 50% 50% 50% 50%; -moz-border-radius: 50% 50% 50% 50%; -ms-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; border: 1px solid #fff; text-indent: -9999px; cursor: pointer; background: rgba(255, 255, 255, 0); box-shadow: none; } .photo-gallery .flex-control-nav > li a.flex-active { background: #fdb714; border-color: #fdb714; } .photo-gallery.style1 .flex-control-nav { display: none; } .photo-gallery.style1 .flex-direction-nav { display: none; } .photo-gallery.style3 .flex-control-nav { display: none; } .photo-gallery.style3 .flex-direction-nav { right: 10px; bottom: 10px; top: auto; } .photo-gallery.style4 .flex-control-nav { right: 25px; bottom: 25px; top: auto; } .photo-gallery.style4 .flex-direction-nav { display: none; } .image-carousel { position: relative; box-shadow: none; border: none; -webkit-border-radius: 0 0 0 0; -moz-border-radius: 0 0 0 0; -ms-border-radius: 0 0 0 0; border-radius: 0 0 0 0; background: none; } .image-carousel .slides > li { display: none; } .image-carousel img { max-width: 100%; } .image-carousel.style1 { padding: 10px 45px; background: #fff; } .image-carousel.style1 .slides > li { margin-right: 10px; height: 70px; cursor: pointer; overflow: hidden; } .image-carousel.style1 .slides > li:last-child { margin-right: 0; } .image-carousel.style1 .slides > li img { height: 100%; width: auto; max-width: none; filter: alpha(opacity=50); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; -moz-opacity: 0.5; -khtml-opacity: 0.5; opacity: 0.5; -moz-transition: opacity 0.3s ease-in; -o-transition: opacity 0.3s ease-in; -webkit-transition: opacity 0.3s ease-in; -ms-transition: opacity 0.3s ease-in; transition: opacity 0.3s ease-in; } .image-carousel.style1 .slides > li.flex-active-slide img, .image-carousel.style1 .slides > li:hover img { filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; } .image-carousel.style1 .flex-control-nav { display: none; } .image-carousel.style1 .flex-direction-nav { position: static; width: 0; height: 0; } .image-carousel.style1 .flex-direction-nav li a { background: rgba(1, 183, 242, 0.7); float: none; width: 25px; height: auto; position: absolute; top: 10px; bottom: 10px; margin: 0; filter: alpha(opacity=100) !important; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)" !important; -moz-opacity: 1 !important; -khtml-opacity: 1 !important; opacity: 1 !important; text-indent: -9999px; text-align: left; color: #fff; -moz-transition: background 0.2s ease-in; -o-transition: background 0.2s ease-in; -webkit-transition: background 0.2s ease-in; -ms-transition: background 0.2s ease-in; transition: background 0.2s ease-in; } .image-carousel.style1 .flex-direction-nav li a:hover { background: #01b7f2; } .image-carousel.style1 .flex-direction-nav li a:before { display: block; position: absolute; left: 9px; top: 50%; margin-top: -6px; text-indent: 0; font-family: FontAwesome; font-size: 12px; line-height: 1; text-shadow: none; } .image-carousel.style1 .flex-direction-nav li a.flex-prev { left: 10px; } .image-carousel.style1 .flex-direction-nav li a.flex-prev:before { content: "\f053"; } .image-carousel.style1 .flex-direction-nav li a.flex-next { right: 10px; } .image-carousel.style1 .flex-direction-nav li a.flex-next:before { content: "\f054"; } .image-carousel.style1 .flex-direction-nav li a.flex-disabled { background: #f5f5f5; color: #9e9e9e; } .image-carousel.style2 .slides > li { margin-right: 30px; } .image-carousel.style2 .slides > li:last-child { margin-right: 0; } .image-carousel.style2 .slides > li .hover-effect { z-index: 0; } .image-carousel.style2 .slides > li .hover-effect img { position: relative; } .image-carousel.style2 .slides > li .hover-effect .caption { filter: alpha(opacity=0); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; -moz-opacity: 0; -khtml-opacity: 0; opacity: 0; position: absolute; bottom: 0; left: 0; height: 33px; line-height: 33px; overflow: hidden; padding: 0; text-align: center; right: 0; z-index: 3; margin: 0; background: #2d3e52; color: #fff; font-size: 1.1667em; -webkit-transform: translate3d(0, 100%, 0); -moz-transform: translate3d(0, 100%, 0); -ms-transform: translate3d(0, 100%, 0); -o-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); -moz-transition: -moz-transform 0.35s; -o-transition: -o-transform 0.35s; -webkit-transition: -webkit-transform 0.35s; -ms-transition: -ms-transform 0.35s; transition: transform 0.35s; } .image-carousel.style2 .slides > li .hover-effect:hover .caption { filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; display: block; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .image-carousel.style2 .slides > li .hover-effect:hover:after { /*margin-top: -20px;*/ } .image-carousel.style2 .flex-control-nav { display: none; } .image-carousel.style2.row-2 li > a:first-child { margin-bottom: 30px; } .image-carousel.style3 { margin-bottom: 30px; } .image-carousel.style3 .slides { margin-bottom: 0; } .image-carousel.style3 .slides > li { margin-right: 30px; } .image-carousel.style3 .slides > li:last-child { margin-right: 0; } .image-carousel.style3 .slides > li .box { margin-bottom: 0; } .image-carousel.style3 .flex-control-nav { display: none; } .image-carousel.style3 .flex-direction-nav { position: static; width: 0; height: 0; } .image-carousel.style3 .flex-direction-nav li a { width: 40px; height: 40px; border: 2px solid; -webkit-border-radius: 50% 50% 50% 50%; -moz-border-radius: 50% 50% 50% 50%; -ms-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; position: absolute; top: 50%; margin-top: -20px; background: none; color: #d9d9d9; filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; text-shadow: none; text-align: left !important; text-indent: -9999px; } .image-carousel.style3 .flex-direction-nav li a:before { position: absolute; display: block; top: 0; left: 0; right: 0; text-align: center; line-height: 36px; font-family: "soap-icons"; text-indent: 0; font-size: 24px; } .image-carousel.style3 .flex-direction-nav li a.flex-prev { left: -80px; } .image-carousel.style3 .flex-direction-nav li a.flex-prev:before { content: "\e87b"; } .image-carousel.style3 .flex-direction-nav li a.flex-next { right: -80px; } .image-carousel.style3 .flex-direction-nav li a.flex-next:before { content: "\e887"; } .image-carousel.style3 .flex-direction-nav li a:hover { color: #fff; } .image-carousel.style3 .flex-direction-nav li a.flex-disabled { color: #838383; } /* 2.12. Image Style ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .image-style { padding: 0; position: relative; background: #fff; padding: 30px 0 30px 30px; } .image-style.large-font { font-size: 1.2307em; } .image-style.style1 { margin-right: 60px; } .image-style.style1 .image-block { margin-right: 25px; } .image-style.style1 .title { font-size: 1.875em; margin-bottom: 30px; } .image-style.style1 ul li { margin: 0 10px 10px 0; width: 80px; height: 80px; } .image-style.style1 ul li a { overflow: hidden; display: block; } .image-style.style1 ul li a img { max-width: none; height: 100%; } .image-style.style1:before { display: block; content: ""; width: 60px; background-color: #fff; position: absolute; right: -60px; bottom: 60px; top: 0; } .image-style.style1:after { display: block; content: ""; position: absolute; right: -60px; bottom: 0; border-top: 60px solid #d9d9d9; border-right: 60px solid transparent; } .image-style.style2 p { line-height: 1.5em; } .image-style.style2 .title { font-size: 1.25em; color: #01b7f2; margin-top: 20px; } .image-style.style2 .image-block { padding-left: 50px; position: relative; min-height: 200px; } .image-style.style2 .image-block li { position: absolute; -webkit-border-radius: 50% 50% 50% 50%; -moz-border-radius: 50% 50% 50% 50%; -ms-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; padding: 5px; background: #fff; border: 1px solid #bfbfbf; } .image-style.style2 .image-block li a { display: block; -webkit-border-radius: 50% 50% 50% 50%; -moz-border-radius: 50% 50% 50% 50%; -ms-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; overflow: hidden; -webkit-transform: translateZ(0); -webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%); -webkit-mask-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAA5JREFUeNpiYGBgAAgwAAAEAAGbA+oJAAAAAElFTkSuQmCC); } .image-style.style2 .image-block li a img { height: 100%; max-width: none; } /* 2.13. Image Box Styles ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .image-box .box, .image-box.box { text-align: center; background: #fff; margin-bottom: 30px; pading-bottom: 30px; } .image-box .box img, .image-box.box img { width: 100%; height: auto; display: inline-block; } .image-box .box h4 { margin: 20px 0 20px 0; } .image-box .box h4.box-title { color: #009bdb; } .image-box .box > .details, .image-box.box > .details { padding: 12px 15px; } .image-box .box > .details > *:last-child, .image-box.box > .details > *:last-child { margin-bottom: 0; } .image-box .box .box-title, .image-box.box .box-title { margin-bottom: 10px; color: #2d3e52; } .image-box.style1 .box-title, .image-box.style10 .box-title { margin-bottom: 0; } .image-box.style7 .opacity-wrapper, .image-box.style8 .opacity-wrapper, .image-box.style12 .opacity-wrapper { display: block; position: absolute; left: 0; top: 0; background: #fdb714; filter: alpha(opacity=60); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; -moz-opacity: 0.6; -khtml-opacity: 0.6; opacity: 0.6; width: 100%; height: 100%; } .image-box.style2 figure { float: left; width: 250px; } .image-box.style2 .details { padding: 20px 20px 10px 270px; } .image-box.style2 .details p { margin-bottom: 20px; } .image-box.style2 .box:after, .image-box.style2.box:after { content: ""; display: table; clear: both; } .image-box.style3 .details { padding: 15px; } .image-box.style3 .details .box-title { margin-bottom: 0; } .image-box.style3 .details .offers-content { font-size: 0.8333em; text-transform: uppercase; margin-bottom: 0; } .image-box.style3 .details .description { border-top: 1px solid #f5f5f5; padding-top: 10px; } .image-box.style4 .details .box-title { float: left; margin: 0; } .image-box.style4 .details .goto-detail { float: right; color: #98ce44; font-weight: bold; font-size: 16px; } .image-box.style4 .details:after { content: ""; display: table; clear: both; } .image-box.style5 .box, .image-box.style5.box, .image-box.style11 .box, .image-box.style11.box { position: relative; } .image-box.style5 figure, .image-box.style11 figure { position: relative; overflow: hidden; cursor: pointer; z-index: 0; } .image-box.style5 figure figcaption, .image-box.style11 figure figcaption { position: absolute; z-index: 3; left: 0; top: 10px; padding: 5px 20px 5px 20px; min-width: 130px; background: #2d3e52; -moz-transition: -moz-transform 0.35s; -o-transition: -o-transform 0.35s; -webkit-transition: -webkit-transform 0.35s; -ms-transition: -ms-transform 0.35s; transition: transform 0.35s; -webkit-transform: translate3d(-100%, 0, 0); -moz-transform: translate3d(-100%, 0, 0); -ms-transform: translate3d(-100%, 0, 0); -o-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } .image-box.style5 figure figcaption .caption-title, .image-box.style11 figure figcaption .caption-title { margin: 0; color: #fff; line-height: 1.1em; } .image-box.style5 figure figcaption span, .image-box.style11 figure figcaption span { color: #fdb714; text-transform: uppercase; font-size: 0.8333em; letter-spacing: 0.04em; } .image-box.style5 figure:hover figcaption, .image-box.style11 figure:hover figcaption { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .image-box.style5 figure:hover a:before, .image-box.style11 figure:hover a:before { filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; } .image-box.style5 figure img, .image-box.style11 figure img { -webkit-backface-visibility: hidden; } .image-box.style5 figure a, .image-box.style11 figure a { display: block; } .image-box.style5 figure a:before, .image-box.style11 figure a:before { position: absolute; z-index: 2; display: block; content: ""; top: 0; left: 0; width: 100%; right: 0; bottom: 0; height: 100%; background: rgba(1, 183, 242, 0.3); filter: alpha(opacity=0); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; -moz-opacity: 0; -khtml-opacity: 0; opacity: 0; -moz-transition: all 0.4s ease-out; -o-transition: all 0.4s ease-out; -webkit-transition: all 0.4s ease-out; -ms-transition: all 0.4s ease-out; transition: all 0.4s ease-out; } .image-box.style5 .details, .image-box.style11 .details { padding: 0; } .image-box.style5 .details .detail, .image-box.style11 .details .detail { margin: 0; border-top: 1px solid #f5f5f5; padding: 10px 20px; } .image-box.style5 .details .detail:first-child, .image-box.style11 .details .detail:first-child { border: none; } .image-box.style5 .details .detail .box-title, .image-box.style11 .details .detail .box-title { line-height: 40px; margin: 0; } .image-box.style5 .details .detail:after, .image-box.style11 .details .detail:after { display: table; content: ""; clear: both; } .image-box.style6 figure, .image-box.style14 figure { padding: 0; } .image-box.style6 .details, .image-box.style14 .details { margin-bottom: 0 !important; padding: 20px 30px; line-height: 1.7em; } .image-box.style6 .box:after, .image-box.style6.box:after, .image-box.style14 .box:after, .image-box.style14.box:after { display: table; content: ""; clear: both; } .image-box.style7 .box, .image-box.style7.box { background: #fff; margin-bottom: 30px; } .image-box.style7 .box figure, .image-box.style7.box figure { height: 72px; } .image-box.style7 .box .details, .image-box.style7.box .details { padding: 20px 20px 25px; font-size: 1.0833em; } .image-box.style7 .box .details p, .image-box.style7.box .details p { margin: 0; } .image-box.style8 .box { background: none; } .image-box.style8 figure { width: 25%; float: left; position: relative; overflow: hidden; } .image-box.style8 figure img { height: 100%; width: auto; max-width: none; } .image-box.style8 .details { width: 75%; float: left; padding: 20px; background: #fff; } .image-box.style8 .box:after, .image-box.style8.box:after { display: table; content: ""; clear: both; } .image-box.style9 figure a { position: relative; /*height: 160px; overflow: hidden;*/ display: block; width: 100%; } .image-box.style9 figure img { width: 100%; height: auto; } .image-box.style9 .box-title { margin: 0; } .image-box.style9 .button { margin-top: 20px; } .image-box.style9 .details { background: #fff; padding: 15px; text-align: center; } .image-box.style9 .description { margin-top: 20px; } .image-box.style10 .details a.button { margin-top: 5px; float: right; } .image-box.style11 .box > .details { padding: 15px; } .image-box.style12 .box, .image-box.style12.box { display: table; } .image-box.style12 figure, .image-box.style12 .details, .image-box.style12 .action { display: table-cell; vertical-align: top; } .image-box.style12 figure { margin-right: 30px; max-width: 30%; } .image-box.style12 figure a { position: relative; display: inline-block; height: 100%; } .image-box.style12 figure img { width: auto; max-width: 150px; } .image-box.style12 .details { border-right: 1px solid #f5f5f5; padding: 12px 20px 10px 25px; width: 100%; } .image-box.style12 .details > *:last-child { margin-bottom: 0; } .image-box.style12 .action { padding: 15px; } .image-box.style12 .action .price { text-align: center; float: none; margin: 0 0 10px 0; } .image-box.style12 .action button, .image-box.style12 .action a.button { padding: 0 10px; } .image-box.style12 .image-wrapper { position: relative; overflow: hidden; display: block; } .image-box.style13 figure { float: left; margin-right: 15px; } .image-box.style13 .details { padding: 0 15px; } .image-box.style13 .action { float: right; } .image-box.style13 .action .button { padding: 0 10px; } .image-box.style13 .price { float: none; } .image-box.style13 .box, .image-box.style13.box { margin-bottom: 0; } .image-box.style13 .box:after, .image-box.style13.box:after { display: table; content: ""; clear: both; } .image-box.style14 figure { float: left; width: 63px; } .image-box.style14 .details { margin-left: 63px; padding: 15px 15px 0; } .image-box.style14 .price { float: none; text-align: left; display: inline; font-size: 1.4em; } .image-box.style14 .box-title { margin-bottom: 0; } .image-box.style14 .box-title small { line-height: 1em; } .image-box.style7 .opacity-wrapper, .image-box.style8 .opacity-wrapper, .image-box.style12 .opacity-wrapper { cursor: pointer; -moz-transition: opacity 0.3s ease-out; -o-transition: opacity 0.3s ease-out; -webkit-transition: opacity 0.3s ease-out; -ms-transition: opacity 0.3s ease-out; transition: opacity 0.3s ease-out; } .image-box.style7 figure, .image-box.style8 figure, .image-box.style12 figure { overflow: hidden; z-index: 0; } .image-box.style7 figure img, .image-box.style8 figure img, .image-box.style12 figure img { -moz-transition: -moz-transform 0.35s; -o-transition: -o-transform 0.35s; -webkit-transition: -webkit-transform 0.35s; -ms-transition: -ms-transform 0.35s; transition: transform 0.35s; -webkit-transform: scale(1, 1); -moz-transform: scale(1, 1); -ms-transform: scale(1, 1); -o-transform: scale(1, 1); transform: scale(1, 1); /*-webkit-backface-visibility: hidden;*/ } .image-box.style7 figure:hover img, .image-box.style8 figure:hover img, .image-box.style12 figure:hover img { -webkit-transform: scale(1.07, 1.07); -moz-transform: scale(1.07, 1.07); -ms-transform: scale(1.07, 1.07); -o-transform: scale(1.07, 1.07); transform: scale(1.07, 1.07); } .image-box.style7 figure:hover .opacity-wrapper, .image-box.style8 figure:hover .opacity-wrapper, .image-box.style12 figure:hover .opacity-wrapper { filter: alpha(opacity=0); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; -moz-opacity: 0; -khtml-opacity: 0; opacity: 0; } .sidebar .image-box.style14 { margin-bottom: 0; } .sidebar .image-box.style14 .box { padding-bottom: 15px; border-bottom: 1px solid #f5f5f5; margin-bottom: 15px; } .sidebar .image-box.style14 .box:last-child { border: none; margin-bottom: 0; padding-bottom: 0; } /* 2.14. Icon Box ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ /* Icon Box */ .icon-box { text-transform: uppercase; } .icon-box > i { text-align: center; } .icon-box.style1 { height: 42px; background: #fff; line-height: 42px; font-size: 0.9167em; } .icon-box.style1 > i { display: block; width: 42px; float: left; background: #fdb714; line-height: 42px; color: #fff; font-size: 2em; margin-right: 15px; } .icon-box.style2 { line-height: 1.75em; color: #01b7f2; font-size: 0.9167em; display: inline-block; } .icon-box.style2 > i { font-size: 1.5em; margin-right: 10px; color: #01b7f2; } .icon-box.style3 { background: #fff; text-align: center; margin-bottom: 10px; } .icon-box.style3 .numbers { font-size: 5em; color: #2d3e52; padding: 20px 0; font-weight: 300; } .icon-box.style3 .numbers i { margin-right: 10px; } .icon-box.style3 .description { border-top: 1px solid #f5f5f5; font-weight: bold; padding: 6px 0; } .icon-box.style4, .icon-box.style8, .icon-box.style9 { text-align: center; text-transform: none; } .icon-box.style4 > i, .icon-box.style8 > i, .icon-box.style9 > i { font-size: 5em; color: #98ce44; } .icon-box.style4 .box-title, .icon-box.style8 .box-title, .icon-box.style9 .box-title { margin-top: 10px; margin-bottom: 10px; } .icon-box.style5 { height: 70px; background: #fff; line-height: 70px; text-transform: none; } .icon-box.style5 > i { display: block; width: 70px; float: left; background: #01b7f2; line-height: 70px; color: #fff; font-size: 3em; margin-right: 15px; } .icon-box.style5 .description { line-height: 1.6em; padding: 14px 15px 0 0; } .icon-box.style5 .description small { text-transform: uppercase; } .icon-box.style6, .icon-box.style7 { line-height: 50px; text-transform: none; } .icon-box.style6 > i, .icon-box.style7 > i { display: block; width: 50px; float: left; background: #fdb714; line-height: 50px; color: #fff; font-size: 2.5em; } .icon-box.style6 .box-title, .icon-box.style7 .box-title { margin-bottom: 5px; } .icon-box.style6 .description, .icon-box.style7 .description { line-height: 1.6em; padding-left: 70px; } .icon-box.style6:after, .icon-box.style7:after { display: table; content: ""; clear: both; } .icon-box.style6 .box-title { letter-spacing: normal; margin-bottom: 10px; } .icon-box.style7 { padding: 30px; background: #fff; } .icon-box.style7 > i { -webkit-border-radius: 50% 50% 50% 50%; -moz-border-radius: 50% 50% 50% 50%; -ms-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; width: 60px; height: 60px; line-height: 60px; background: #01b7f2; } .icon-box.style7 > i.glyphicon { font-size: 1.6667em; } .icon-box.style7 .description { padding-left: 80px; } .icon-box.style7 .description .box-title { margin-bottom: 20px; line-height: 1.3333em; } .icon-box.style7 .description ul { margin-bottom: 20px; } .icon-box.style7 .description .view { text-decoration: underline; color: #98ce44; font-size: 1.0833em; } .icon-box.style8 i, .icon-box.style9 i { font-size: 2.6666em; background: #fdb714; color: #fff; width: 1.5em; height: 1.5em; line-height: 1.5em; display: block; margin-left: auto; margin-right: auto; } .icon-box.style9 { display: inline-block; } .icon-box.style9 .box-title { line-height: 1.2em; } .icon-box.style9 > i { background: #01b7f2; -webkit-border-radius: 50% 50% 50% 50%; -moz-border-radius: 50% 50% 50% 50%; -ms-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; width: 2em; height: 2em; line-height: 2em; margin-bottom: 15px; } .icon-box.style10 { border: 1px solid #fdb714; margin-top: 20px; padding: 45px 20px 20px; position: relative; color: #7c9abd; text-align: center; } .icon-box.style10 .box-title { color: #fff; margin-bottom: 15px; } .icon-box.style10 > i { position: absolute; width: 72px; height: 72px; top: -36px; left: 50%; margin-left: -36px; font-size: 3em; color: #fff; background: #fdb714; line-height: 72px; -webkit-border-radius: 50% 50% 50% 50%; -moz-border-radius: 50% 50% 50% 50%; -ms-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; } .icon-box.style10 .description { text-transform: none; } .icon-box.style11, .icon-box.style12 { display: table; } .icon-box.style11 > .icon-wrapper, .icon-box.style12 > .icon-wrapper { display: table-cell; vertical-align: middle; text-align: center; font-size: 18px; } .icon-box.style11 > .icon-wrapper > i, .icon-box.style12 > .icon-wrapper > i { color: #fdb714; } .icon-box.style11 > .details, .icon-box.style12 > .details { display: table-cell; vertical-align: middle; } .icon-box.style11 > .icon-wrapper { width: 1.4em; text-align: left; } .icon-box.style11 .details { text-transform: uppercase; } .icon-box.style11 .details dl, .icon-box.style11 .details dt, .icon-box.style11 .details dd { font-size: 0.8333em; } .icon-box.style11 .details .box-title { margin-bottom: 0; text-transform: none; margin-left: 15px; } .icon-box.style12 > .icon-wrapper { width: auto; } .icon-box.style12 > .icon-wrapper > i { border-color: #01b7f2; background: #01b7f2; color: #fff; font-size: 1.5em; } .icon-box.style12 > .details { padding-left: 10px; margin: 0; text-transform: none; } .icon-box.style12 > .details .m-title { margin: 0; } /* 2.15. Listing Styles ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .listing-style1.hotel .box-title:after, .listing-style1.cruise .box-title:after { display: table; content: ""; clear: both; } .listing-style1.hotel .feedback, .listing-style1.cruise .feedback { margin: 5px 0; border-top: 1px solid #f5f5f5; padding-top: 5px; border-bottom: 1px solid #f5f5f5; } .listing-style1.hotel .feedback .review, .listing-style1.cruise .feedback .review { display: block; float: right; text-transform: uppercase; font-size: 0.8333em; color: #9e9e9e; } .listing-style1.hotel .five-stars-container, .listing-style1.cruise .five-stars-container { color: #dbdbdb; } .listing-style1.hotel .action .button:last-child, .listing-style1.cruise .action .button:last-child { float: right; } .listing-style1.hotel .action .button, .listing-style1.cruise .action .button { width: 45%; padding: 0; text-align: center; } .listing-style1.hotel .action .button + .button, .listing-style1.cruise .action .button + .button { width: 50%; } .listing-style1.flight .details, .listing-style1.car .details { padding: 15px 0 0 !important; text-transform: uppercase; } .listing-style1.flight .details .box-title, .listing-style1.car .details .box-title { text-transform: none; } .listing-style1.flight .details .box-title:after, .listing-style1.car .details .box-title:after { display: table; content: ""; clear: both; } .listing-style1.flight .action .button, .listing-style1.car .action .button { text-align: center; } .listing-style1.flight figure img { max-width: 100%; } .listing-style1.flight .details .time { margin: 10px 0; border-top: 1px solid #f5f5f5; border-bottom: 1px solid #f5f5f5; letter-spacing: 0.04em; } .listing-style1.flight .details .time:after { display: table; content: ""; clear: both; } .listing-style1.flight .details .time > div { width: 50%; float: left; padding: 7px 0; } .listing-style1.flight .details .time > div > .icon { font-size: 16px; float: left; } .listing-style1.flight .details .time > div > .icon + div { padding-left: 24px; } .listing-style1.flight .details .time > div:first-child { border-right: 1px solid #f5f5f5; } .listing-style1.flight .details .time > div + div { padding-left: 20px; } .listing-style1.flight .details .duration { font-size: 0.8333em; text-align: center; letter-spacing: 0.04em; } .listing-style1.car figure img { max-width: 100%; } .listing-style1.car .details .mile { font-size: 0.8333em; text-align: center; } .listing-style1.car .details .amenities { text-align: center; border-top: 1px solid #f5f5f5; border-bottom: 1px solid #f5f5f5; margin: 10px 0; padding: 10px 0 6px; } .listing-style1.cruise .time { padding-top: 5px; } .listing-style1.cruise .time [class^="soap-icon"] { float: left; font-size: 20px; } .listing-style1.cruise .time > div { margin-bottom: 10px !important; } .listing-style1.cruise .time > div:first-child { border-right: 1px solid #f5f5f5; } .listing-style1.cruise .time > div > div { padding-left: 20px; } .listing-style1.cruise .action a.button { float: none !important; } .listing-style1.cruise .description { text-align: center; font-size: 0.8333em; text-transform: uppercase; } .listing-style1.flight .box, .listing-style1.flight.box, .listing-style1.car .box, .listing-style1.car.box, .listing-style2.flight .box, .listing-style2.flight.box, .listing-style2.car .box, .listing-style2.car.box { padding: 15px; } .listing-style1.flight figure, .listing-style1.car figure, .listing-style2.flight figure, .listing-style2.car figure { background: #f5f5f5; display: table; /*height: 140px;*/ width: 100%; table-layout: fixed; } .listing-style1.flight figure > a, .listing-style1.flight figure > span, .listing-style1.car figure > a, .listing-style1.car figure > span, .listing-style2.flight figure > a, .listing-style2.flight figure > span, .listing-style2.car figure > a, .listing-style2.car figure > span { display: table-cell; vertical-align: middle; text-align: center; } .listing-style1.flight figure img, .listing-style1.car figure img, .listing-style2.flight figure img, .listing-style2.car figure img { width: auto; } .listing-style1.flight .icon, .listing-style3.flight .icon { font-size: 16px; } .listing-style1.flight .take-off > .icon, .listing-style3.flight .take-off > .icon { -webkit-transform: rotate(-25deg); -moz-transform: rotate(-25deg); -ms-transform: rotate(-25deg); -o-transform: rotate(-25deg); transform: rotate(-25deg); display: inline-block; } .listing-style1.flight .landing > .icon, .listing-style3.flight .landing > .icon { -webkit-transform: rotate(25deg); -moz-transform: rotate(25deg); -ms-transform: rotate(25deg); -o-transform: rotate(25deg); transform: rotate(25deg); display: inline-block; } .listing-style1.car .amenities ul, .listing-style3.car .amenities ul { display: inline-block; color: #9e9e9e; } .listing-style1.car .amenities ul li, .listing-style3.car .amenities ul li { float: left; text-align: center; padding: 0 5px; cursor: default; font-size: 0.8333em; } .listing-style1.car .amenities ul li .glyphicon, .listing-style1.car .amenities ul li [class^="soap-icon"], .listing-style3.car .amenities ul li .glyphicon, .listing-style3.car .amenities ul li [class^="soap-icon"] { display: block; font-size: 16px; color: #d9d9d9; overflow: hidden; } .listing-style1.car .amenities ul li .glyphicon, .listing-style3.car .amenities ul li .glyphicon { line-height: 25px; } .listing-style1.car .amenities ul li .glyphicon:before, .listing-style3.car .amenities ul li .glyphicon:before { font-size: 12px; } .listing-style1.car .amenities ul li:hover, .listing-style1.car .amenities ul li:hover .glyphicon, .listing-style1.car .amenities ul li:hover [class^="soap-icon"], .listing-style3.car .amenities ul li:hover, .listing-style3.car .amenities ul li:hover .glyphicon, .listing-style3.car .amenities ul li:hover [class^="soap-icon"] { color: #01b7f2; } .listing-style1.car .amenities ul li:hover [class^="soap-icon"]:before, .listing-style3.car .amenities ul li:hover [class^="soap-icon"]:before { -webkit-animation: toTopFromBottom 0.35s forwards; -moz-animation: toTopFromBottom 0.35s forwards; animation: toTopFromBottom 0.35s forwards; } .listing-style1.car .amenities ul:after, .listing-style3.car .amenities ul:after { display: table; content: ""; clear: both; } .listing-style2 .box .box-title { margin-bottom: 0; } .listing-style2 a.button { margin-top: 6px; } .listing-style2.flight .details { padding: 12px 2px 0; } .listing-style2.flight img { width: auto; max-width: 100%; } .listing-style3 .box, .listing-style3.box { background: #fff; margin-bottom: 30px; } .listing-style3 .box > *, .listing-style3.box > * { padding: 0; } .listing-style3 .box:after, .listing-style3.box:after { display: table; clear: both; content: ""; } .listing-style3 .review { display: block; text-transform: uppercase; font-size: 0.8333em; color: #9e9e9e; } .listing-style3 .five-stars-container, .listing-style3 .review { line-height: 1em; } .listing-style3 .five-stars-container { color: #dbdbdb; } .listing-style3 [class^="soap-icon"].circle { color: #d9d9d9; cursor: default; font-size: 16px; overflow: hidden; } .listing-style3 [class^="soap-icon"].circle:hover { color: #01b7f2; } .listing-style3 [class^="soap-icon"].circle:hover:before { -webkit-animation: toTopFromBottom 0.35s forwards; -moz-animation: toTopFromBottom 0.35s forwards; animation: toTopFromBottom 0.35s forwards; } .listing-style3 .price { float: none; text-align: center; } .listing-style3.hotel figure img { width: 100%; height: auto; } .listing-style3.hotel .box-title { margin: 0; float: left; } .listing-style3.hotel .box-title i { font-size: 15px; } .listing-style3.hotel .amenities { float: right; } .listing-style3.hotel .details { padding: 15px 0 15px 20px; display: table; } .listing-style3.hotel .details [class^="soap-icon"].circle { margin-right: 5px; margin-top: 5px; } .listing-style3.hotel .details > * { display: table-row; } .listing-style3.hotel .details > * > * { display: table-cell; padding: 10px 15px 0; text-align: center; vertical-align: middle; } .listing-style3.hotel .details > * > *:first-child { border-right: 1px solid #f5f5f5; padding-left: 0; padding-right: 15px; text-align: left; } .listing-style3.hotel .details > * > *:last-child { width: 120px; } .listing-style3.hotel .details > *:first-child > * { border-bottom: 1px solid #f5f5f5; padding-top: 0; padding-bottom: 10px; } .listing-style3.hotel .details .button { margin-top: 8px; } .listing-style3.flight .box, .listing-style3.flight.box { padding: 15px; display: table; width: 100%; table-layout: fixed; } .listing-style3.flight figure { display: table-cell; background: #f5f5f5; vertical-align: middle; float: none; } .listing-style3.flight figure span { text-align: center; display: block; } .listing-style3.flight figure span img { max-width: 60px; height: auto; } .listing-style3.flight .box-title { float: left; } .listing-style3.flight .stop:hover { background: #fdb714; } .listing-style3.flight .amenities { margin-bottom: 10px; float: right; } .listing-style3.flight .details { display: table-cell; padding-left: 15px; float: none; } .listing-style3.flight .details .details-wrapper { display: table; width: 100%; } .listing-style3.flight .details .details-wrapper > * { display: table-row; } .listing-style3.flight .details .details-wrapper > * > * { display: table-cell; padding: 15px 15px 0 15px; } .listing-style3.flight .details .details-wrapper > * > *:first-child { border-right: 1px solid #f5f5f5; padding-left: 0; } .listing-style3.flight .details .details-wrapper > * > *:last-child { text-align: center; padding-right: 0; } .listing-style3.flight .details .details-wrapper > *:first-child > * { border-bottom: 1px solid #f5f5f5; padding-top: 0; } .listing-style3.flight .details .details-wrapper .box-title { margin: 0 10px 15px 0; } .listing-style3.flight .details .details-wrapper [class^="soap-icon"].circle { margin-right: 5px; } .listing-style3.flight .details .details-wrapper [class^="col-"], .listing-style3.flight .details .details-wrapper [class*=" col-"] { padding: 0; } .listing-style3.flight .details .details-wrapper .time > div { border-right: 1px solid #f5f5f5; padding-left: 15px; } .listing-style3.flight .details .details-wrapper .time > div:last-child { border-right: none; } .listing-style3.flight .details .details-wrapper .time > div:first-child { padding-left: 0; } .listing-style3.flight .details .details-wrapper .time > div > div { padding-left: 25px; } .listing-style3.flight .details .details-wrapper .time .icon { float: left; padding: 0; font-size: 16px; } .listing-style3.flight .details .details-wrapper .time { letter-spacing: 0.04em; } .listing-style3.flight .details .details-wrapper .action { vertical-align: top; } .listing-style3.car .box, .listing-style3.car.box { display: table; padding-top: 15px; padding-bottom: 15px; width: 100%; table-layout: fixed; } .listing-style3.car figure { display: table-cell; vertical-align: middle; float: none; text-align: center; border-right: 1px solid #f5f5f5; } .listing-style3.car figure img { max-width: 80%; height: auto; } .listing-style3.car .details { display: table-cell; float: none; } .listing-style3.car .details .box-title { float: left; } .listing-style3.car .details .logo { margin: 3px 0 0 8px; float: left; border-left: 1px solid #e1e1e1; padding-left: 8px; } .listing-style3.car .details .logo img { max-height: 20px; width: auto; } .listing-style3.car .details .amenities { margin-top: 20px; } .listing-style3.car .details .character { text-align: right; text-transform: uppercase; font-size: 0.8333em; border-right: 1px solid #f5f5f5; } .listing-style3.car .details .character dd { margin-bottom: 5px; } .listing-style3.car .details .character dl { margin-bottom: 0; } .listing-style3.car .details .action { text-align: center; text-transform: uppercase; } .listing-style3.car .details .action .button { margin-top: 30px; } .listing-style3.cruise figure img { width: 100%; height: auto; } .listing-style3.cruise .details { padding: 15px 20px; text-transform: uppercase; } .listing-style3.cruise .details img { max-width: 100%; height: auto; } .listing-style3.cruise .details .box-title { text-transform: none; margin-bottom: 10px; } .listing-style3.cruise .details .character { font-size: 0.8333em; border-top: 1px solid #f5f5f5; border-bottom: 1px solid #f5f5f5; margin-bottom: 15px; display: table; width: 100%; table-layout: fixed; } .listing-style3.cruise .details .character > div { display: table-cell; float: none; vertical-align: middle; margin: 0; padding-top: 12px; padding-bottom: 12px; border-left: 1px solid #f5f5f5; } .listing-style3.cruise .details .character > div:first-child { border: none; padding-left: 0; } .listing-style3.cruise .details .character > div:last-child { padding-right: 0; } .listing-style3.cruise .details .character [class^="soap-icon"] { font-size: 18px; float: left; } .listing-style3.cruise .details .character .cruise-logo { padding: 0; text-align: left; } .listing-style3.cruise .details .character .cruise-logo img { max-width: 90%; width: auto; height: auto; } .listing-style3.cruise .details .character .date > div, .listing-style3.cruise .details .character .departure > div { padding-left: 20px; line-height: 1.1667em; } .listing-style3.cruise .details .review { line-height: 1.6667em; } .listing-style3.cruise .details .review .five-stars-container { float: left; margin-right: 10px; } .listing-style3.cruise .details .review span { display: block; float: left; } .tab-container .tab-pane > .listing-style3 .details { padding-right: 0; } /* 2.16. Pricing Tables ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .pricing-table { padding: 20px; background: #fff; /* colored */ } .pricing-table .header { border-bottom: 1px solid #f5f5f5; } .pricing-table .header > i { float: left; font-size: 16px; margin: 3px 8px 0 0; } .pricing-table .header .box-title { float: left; line-height: 1.3333em; margin-bottom: 20px; } .pricing-table .header .box-title small { text-transform: uppercase; display: block; font-size: 0.6em; } .pricing-table .description { margin: 15px 0; } .pricing-table .features { margin-bottom: 15px; text-transform: uppercase; } .pricing-table .features li { margin-top: 1px; background: #f5f5f5; font-size: 0.9167em; padding-left: 20px; line-height: 40px; } .pricing-table.green, .pricing-table.blue, .pricing-table.yellow, .pricing-table.red { color: #fff; } .pricing-table.green .box-title, .pricing-table.green .box-title small, .pricing-table.green .price, .pricing-table.green .price small, .pricing-table.blue .box-title, .pricing-table.blue .box-title small, .pricing-table.blue .price, .pricing-table.blue .price small, .pricing-table.yellow .box-title, .pricing-table.yellow .box-title small, .pricing-table.yellow .price, .pricing-table.yellow .price small, .pricing-table.red .box-title, .pricing-table.red .box-title small, .pricing-table.red .price, .pricing-table.red .price small { color: #fff; } .pricing-table.green .box-title small, .pricing-table.green .price small, .pricing-table.green .description, .pricing-table.blue .box-title small, .pricing-table.blue .price small, .pricing-table.blue .description, .pricing-table.yellow .box-title small, .pricing-table.yellow .price small, .pricing-table.yellow .description, .pricing-table.red .box-title small, .pricing-table.red .price small, .pricing-table.red .description { filter: alpha(opacity=60); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; -moz-opacity: 0.6; -khtml-opacity: 0.6; opacity: 0.6; } .pricing-table.green { background: #98ce44; } .pricing-table.green .header { border-bottom-color: #91c63d; } .pricing-table.green .features li { background: #91c63d; } .pricing-table.green .features li:before { background: #98ce44; } .pricing-table.yellow { background: #fdb714; } .pricing-table.yellow .header { border-bottom-color: #f5b010; } .pricing-table.yellow .features li { background: #f5b010; } .pricing-table.yellow .features li:before { background: #fdb714; } .pricing-table.blue { background: #01b7f2; } .pricing-table.blue .header { border-bottom-color: #04afe7; } .pricing-table.blue .features li { background: #04afe7; } .pricing-table.blue .features li:before { background: #01b7f2; } .pricing-table.red { background: #e01a33; } .pricing-table.red .header { border-bottom-color: #d51a32; } .pricing-table.red .features li { background: #d51a32; } .pricing-table.red .features li:before { background: #e01a33; } /* 2.17. Post ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .border-box { border: 15px solid #f5f5f5; } .post { position: relative; } .post figure img { width: 100%; height: auto; } .post .entry-date { background: #2d3e52; padding: 7px 15px; color: #fff; text-align: center; text-transform: uppercase; position: absolute; left: 0; top: 10px; } .post .entry-date .date { margin: 0; font-size: 1.6667em; display: block; font-weight: normal; } .post .entry-date .month { margin: 0; font-size: 0.8333em; font-weight: normal; } .fluid-width-video-wrapper { padding: 0; position: relative; width: 100%; } .blog-infinite .post, .single .post { margin-bottom: 50px; } .blog-infinite .post .video-container, .single .post .video-container { position: relative; width: 100%; } .blog-infinite .post .video-container video, .single .post .video-container video { max-width: 100%; height: auto; } .blog-infinite .post .video-container iframe, .blog-infinite .post .video-container embed, .blog-infinite .post .video-container object, .single .post .video-container iframe, .single .post .video-container embed, .single .post .video-container object { max-width: 100%; } .blog-infinite .post .entry-title, .single .post .entry-title { margin-bottom: 25px; } .blog-infinite .post .excerpt-container, .single .post .excerpt-container { margin-bottom: 20px; } .blog-infinite .post .excerpt-container p, .single .post .excerpt-container p { line-height: 1.8333em; } .blog-infinite .post .details, .single .post .details { background: #fff; padding: 20px 20px 10px; } .blog-infinite .post.without-featured-item .entry-title, .blog-infinite .post.without-featured-item .excerpt-container, .single .post.without-featured-item .entry-title, .single .post.without-featured-item .excerpt-container { padding-left: 50px; } .blog-infinite .post .image-carousel, .single .post .image-carousel { margin-bottom: 0; } .blog-infinite .post-content, .single .post-content { margin-bottom: 30px; } .blog-infinite .post-content > p, .single .post-content > p { line-height: 1.6666em; } .blog-infinite .post-content .border-box, .single .post-content .border-box { margin: 30px 0; } .blog-infinite .post-content .border-box blockquote, .single .post-content .border-box blockquote { margin-bottom: 0; } .blog-infinite .post-meta, .single .post-meta { background: #f5f5f5; padding: 10px 10px 0; font-size: 1em; } .blog-infinite .post-meta .entry-author, .single .post-meta .entry-author { float: left; line-height: 28px; font-size: 0.83333em; margin-bottom: 10px; } .blog-infinite .post-meta .entry-author .icon, .single .post-meta .entry-author .icon { float: left; width: 28px; height: 28px; background: #fff; display: inline-block; font-size: 1.6666em; line-height: 28px; text-align: center; color: #d9d9d9; margin-right: 10px; } .blog-infinite .post-meta .entry-author a.author, .single .post-meta .entry-author a.author { color: #01b7f2; } .blog-infinite .post-meta .entry-action, .single .post-meta .entry-action { float: right; } .blog-infinite .post-meta .entry-action > *, .single .post-meta .entry-action > * { height: 28px; line-height: 28px; display: inline-block; padding: 0 10px; margin-left: 8px; margin-bottom: 10px; background: #fff; color: #9e9e9e; letter-spacing: 0.04em; font-size: 0.8333em; font-weight: normal; } .blog-infinite .post-meta .entry-action > * i, .single .post-meta .entry-action > * i { float: left; font-size: 2.6667em; margin-right: 10px; color: #d9d9d9; } .blog-infinite .post-meta .entry-action a.button:hover, .single .post-meta .entry-action a.button:hover { background: #01b7f2; color: #fff; } .blog-infinite .post-meta .entry-action a.button:hover i, .single .post-meta .entry-action a.button:hover i { color: #fff; } .blog-infinite .post-meta:after, .single .post-meta:after { display: table; content: ""; clear: both; } .single .details { margin-bottom: 30px; } .single .single-navigation a.button { font-weight: normal; } .single .single-navigation a.button span { vertical-align: middle; } .single .single-navigation i { font-size: 1.25em; font-weight: normal; line-height: 0; vertical-align: middle; } .single .single-navigation .prev i { margin-right: 20px; } .single .single-navigation .next i { margin-left: 20px; } .about-author .about-author-container { background: #fff; padding: 0 20px; } .about-author .about-author-content { display: table; border-bottom: 1px solid #f5f5f5; } .about-author .avatar { display: table-cell; padding: 20px 20px 20px 0; border-right: 1px solid #f5f5f5; } .about-author .description { display: table-cell; padding: 20px; vertical-align: top; } .about-author .description p { line-height: 1.8333em; } .about-author .about-author-meta { padding: 15px 0; } .about-author .social-icons { float: right; } .about-author .wrote-posts-count { line-height: 28px; font-size: 1.1667em; } .about-author .wrote-posts-count i { font-size: 1.8333em; color: #01b7f2; float: left; margin-right: 10px; } .about-author .wrote-posts-count span { vertical-align: middle; } .single .avatar img, .travel-story-container .avatar img { -webkit-border-radius: 50% 50% 50% 50%; -moz-border-radius: 50% 50% 50% 50%; -ms-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; width: 96px; height: 96px; } .single .suggestions .caption { margin-bottom: 0; } .single .suggestions a.hover-effect:after { color: #fff; background: none; content: "\e8ba"; font-family: "soap-icons"; font-size: 1.6667em; text-align: center; line-height: 50px; border: 2px solid #fff; -webkit-border-radius: 50% 50% 50% 50%; -moz-border-radius: 50% 50% 50% 50%; -ms-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; width: 50px; height: 50px; left: 50%; top: 50%; margin-left: -25px; margin-top: -25px; } .single .suggestions li { cursor: pointer; } .single .suggestions li:hover a.hover-effect:after { visibility: visible; -webkit-transform: rotateY(0deg) scale(1, 1); -moz-transform: rotateY(0deg) scale(1, 1); -ms-transform: rotateY(0deg) scale(1, 1); -o-transform: rotateY(0deg) scale(1, 1); transform: rotateY(0deg) scale(1, 1); filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; } .single .suggestions li:hover a.hover-effect { background: #01b7f2; } .single .suggestions li:hover img { filter: alpha(opacity=50); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; -moz-opacity: 0.5; -khtml-opacity: 0.5; opacity: 0.5; -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -ms-transform: scale(1.2); -o-transform: scale(1.2); transform: scale(1.2); } .single .suggestions li:hover .caption { color: #01b7f2; } /* comment */ .comment-list .the-comment { padding-top: 20px; margin-top: 20px; border-top: 1px solid #f5f5f5; } .comment-list .the-comment .comment-text { padding-right: 50px; } .comment-list .the-comment .comment-text *:last-child { margin-bottom: 0; } .comment-list > li.comment:first-child > .the-comment { padding-top: 0; margin-top: 0; border-top: none; } .comment-list .avatar { margin-right: 30px; float: left; } .comment-list .avatar img { width: 72px; height: 72px; } .comment-list ul.children { padding-left: 50px; } /* 2.18. Testimonial ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .author a { display: inline-block; -webkit-border-radius: 50% 50% 50% 50%; -moz-border-radius: 50% 50% 50% 50%; -ms-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; overflow: hidden; margin-left: 1px; } .author img { -webkit-backface-visibility: visible; } .testimonial .slides > li { display: none; } .testimonial.style1 .slides > li, .testimonial.style2 .slides > li { padding-bottom: 80px; position: relative; } .testimonial.style1 .description, .testimonial.style2 .description { font-size: 1.3333em; color: #01b7f2; font-style: italic; } .testimonial.style1 .author, .testimonial.style2 .author { /*margin: 25px 0 10px;*/ position: absolute; bottom: 0; left: 0; right: 0; width: auto; } .testimonial.style1 .author a, .testimonial.style2 .author a { float: left; width: 74px; height: 74px; margin-right: 10px; } .testimonial.style1 .author .name, .testimonial.style2 .author .name { padding-top: 22px; } .testimonial.style1 .author .name small, .testimonial.style2 .author .name small { display: block; text-transform: uppercase; font-size: 0.7143em; } .testimonial.style1 { background: #fff; padding: 25px; } .testimonial.style1 .testimonial-control-nav { float: right; } .testimonial.style1 .testimonial-control-nav > li { float: left; margin-left: 5px; } .testimonial.style1 .testimonial-control-nav > li a { display: block; width: 14px; height: 14px; -webkit-border-radius: 50% 50% 50% 50%; -moz-border-radius: 50% 50% 50% 50%; -ms-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; border: 1px solid #dbdbdb; text-indent: -9999px; cursor: pointer; } .testimonial.style1 .testimonial-control-nav > li a.testimonial-active { background: #fdb714; border-color: #fdb714; } .testimonial.style1:after { display: table; content: ""; clear: both; } .testimonial.style2 { position: relative; } .testimonial.style2 .description { background: #fff; padding: 25px; } .testimonial.style2 .author { padding-left: 25px; } .testimonial.style2 .testimonial-direction-nav { right: 0; top: -40px; width: 72px; height: 22px; position: absolute; } .testimonial.style2 .testimonial-direction-nav li { float: left; } .testimonial.style2 .testimonial-direction-nav li a { display: block; width: 30px; height: 22px; background: #01b7f2; color: #fff; text-indent: -9999px; } .testimonial.style2 .testimonial-direction-nav li a:before { position: absolute; display: block; top: 2px; font-family: 'soap-icons'; text-indent: 0; font-size: 20px; } .testimonial.style2 .testimonial-direction-nav li a.testimonial-prev { margin-right: 10px; } .testimonial.style2 .testimonial-direction-nav li a.testimonial-prev:before { content: '\e88a'; left: 8px; } .testimonial.style2 .testimonial-direction-nav li a.testimonial-next:before { content: '\e88b'; right: 9px; } .testimonial.style2 .testimonial-direction-nav li a.testimonial-disabled { background: #d9d9d9; } .testimonial.style3 { position: relative; border: 2px solid #fff; margin-top: 80px; padding: 60px 40px 20px; text-align: center; } .testimonial.style3 .author { position: absolute; top: -50px; left: 50%; margin-left: -50px; } .testimonial.style3 .author a { width: 100px; height: 100px; border: 3px solid #fff; background: #fff; } .testimonial.style3 .author a img { width: 100%; height: 100%; -webkit-border-radius: 50% 50% 50% 50%; -moz-border-radius: 50% 50% 50% 50%; -ms-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; } .testimonial.style3 .description { color: #fff; font-size: 2.5em; font-weight: 300; } .testimonial.style3 .description em { font-weight: 400; } .testimonial.style3 .description:before, .testimonial.style3 .description:after { color: #01b7f2; } .testimonial.style3 .name { color: #01b7f2; } .testimonial.style3 .name:before { content: "-"; } .testimonial.style3 ul.slides:after { display: table; content: ""; clear: both; } .testimonial.style3 ul.slides li { position: static !important; } .testimonial.style3 .testimonial-direction-nav .testimonial-prev, .testimonial.style3 .testimonial-direction-nav .testimonial-next { position: absolute; display: block; top: 0; bottom: 0; width: 40px; text-indent: -9999px; background: #fff; color: #01b7f2; } .testimonial.style3 .testimonial-direction-nav .testimonial-prev:before, .testimonial.style3 .testimonial-direction-nav .testimonial-next:before { text-indent: 0; position: absolute; display: block; left: 15px; font-size: 30px; top: 50%; margin-top: -10px; font-family: 'soap-icons'; } .testimonial.style3 .testimonial-direction-nav .testimonial-prev { left: 0; } .testimonial.style3 .testimonial-direction-nav .testimonial-prev:before { content: '\e87c'; } .testimonial.style3 .testimonial-direction-nav .testimonial-next { right: 0; } .testimonial.style3 .testimonial-direction-nav .testimonial-next:before { content: '\e878'; } .testimonial.style3 .testimonial-direction-nav .testimonial-disabled { background: #2d3e52; color: #fff; } /* 2.19. Our Team Section ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .team { text-align: center; } .team figure { position: relative; overflow: hidden; } .team figure:hover figcaption { filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; bottom: 0; } .team figure figcaption { position: absolute; bottom: -32px; line-height: 0; text-align: center; left: 0; right: 0; filter: alpha(opacity=0); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; -moz-opacity: 0; -khtml-opacity: 0; opacity: 0; -moz-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; -webkit-transition: all 0.3s ease-in; -ms-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .team figure figcaption > .social-icons > li a { background: #fff; color: inherit; filter: alpha(opacity=65); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=65)"; -moz-opacity: 0.65; -khtml-opacity: 0.65; opacity: 0.65; } .team figure figcaption > .social-icons > li a:hover { color: #01b7f2; filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; } .team .details { text-align: center; } .team .description { border-top: 1px solid #f5f5f5; margin-top: 10px; padding-top: 8px; } .team .social-icons { display: inline-block; } /* contact form */ .contact-form-container { padding: 30px 30px 20px; } .contact-form-container .contact-form label { text-transform: uppercase; } /* 2.20. Gallery popup ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .opacity-overlay { outline: none; position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.75); z-index: 10000; display: none; -webkit-backface-visibility: hidden; } .opacity-overlay .container { height: 100%; position: relative; z-index: 10001; } .opacity-overlay .spinner { color: #fff; font-size: 32px; position: absolute; left: 50%; top: 50%; margin-left: -16px; margin-top: -16px; } .popup-wrapper { text-align: center; position: absolute; left: 0; top: 0; height: 100%; width: 100%; padding: 0 5px; } .popup-wrapper:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; } .popup-wrapper .popup-content { float: none; padding: 0; margin: 0 auto; text-align: left; z-index: 10003; position: relative; display: inline-block; vertical-align: middle; } /* 2.21. Style changer ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .style-changer { text-align: left; width: 270px; } .style-changer .style-changer-header { width: 330px; padding-left: 30px; height: 55px; line-height: 55px; color: #fff; background: #01b7f2; -webkit-border-radius: 0 0 15px 0; -moz-border-radius: 0 0 15px 0; -ms-border-radius: 0 0 15px 0; border-radius: 0 0 15px 0; position: relative; } .style-changer .style-changer-header .style-main-title { float: left; margin: 0; line-height: 55px; color: #fff; } .style-changer .style-changer-header .style-toggle { position: absolute; right: 15px; top: 12px; font-size: 20px; width: 30px; height: 30px; -webkit-border-radius: 50% 50% 50% 50%; -moz-border-radius: 50% 50% 50% 50%; -ms-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; background: #fff; line-height: 30px; text-align: center; } .style-changer .style-changer-header .style-toggle > .fa { color: #01b7f2; } .style-changer .style-chagner-main { width: 270px; background: #fff; padding: 15px 30px 30px; } .style-changer .style-chagner-main label { margin-top: 15px; font-weight: 400; font-size: 0.8333em; text-transform: uppercase; } .style-changer .style-chagner-main .design-skins { margin-bottom: 15px; } .style-changer .style-chagner-main .design-skins li { padding: 4px; border: 1px solid; -webkit-border-radius: 50% 50% 50% 50%; -moz-border-radius: 50% 50% 50% 50%; -ms-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; width: 35px; height: 35px; } .style-changer .style-chagner-main .design-skins li i { display: none; } .style-changer .style-chagner-main .design-skins li a { display: block; color: #fff; -webkit-border-radius: 50% 50% 50% 50%; -moz-border-radius: 50% 50% 50% 50%; -ms-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; text-align: center; font-size: 20px; line-height: 1.1em; width: 100%; height: 100%; } .style-changer .style-chagner-main .design-skins li.active i { display: inline-block; } .style-changer .style-chagner-main .design-skins li.light-blue { border-color: #01b7f2; } .style-changer .style-chagner-main .design-skins li.light-blue a { background: #01b7f2; } .style-changer .style-chagner-main .design-skins li.purple { border-color: #9f60b5; } .style-changer .style-chagner-main .design-skins li.purple a { background: #9f60b5; } .style-changer .style-chagner-main .design-skins li.orange { border-color: #ff6000; } .style-changer .style-chagner-main .design-skins li.orange a { background: #ff6000; } .style-changer .style-chagner-main .design-skins li.light-orange { border-color: #f5a77d; } .style-changer .style-chagner-main .design-skins li.light-orange a { background: #f5a77d; } .style-changer .style-chagner-main .design-skins li.sea-blue { border-color: #0ab596; } .style-changer .style-chagner-main .design-skins li.sea-blue a { background: #0ab596; } .style-changer .style-chagner-main .design-skins li.sky-blue { border-color: #6dace6; } .style-changer .style-chagner-main .design-skins li.sky-blue a { background: #6dace6; } .style-changer .style-chagner-main .design-skins li.dark-orange { border-color: #ff3e3e; } .style-changer .style-chagner-main .design-skins li.dark-orange a { background: #ff3e3e; } .style-changer .style-chagner-main .design-skins li.dark-blue { border-color: #194eb0; } .style-changer .style-chagner-main .design-skins li.dark-blue a { background: #194eb0; } .style-changer .style-chagner-main .design-skins li.light-yellow { border-color: #ffd200; } .style-changer .style-chagner-main .design-skins li.light-yellow a { background: #ffd200; } .style-changer .style-chagner-main .design-skins li.red { border-color: #e44049; } .style-changer .style-chagner-main .design-skins li.red a { background: #e44049; } .style-changer.dark .style-chagner-main { background: #2d3e52; } .style-changer.dark .style-chagner-main label { color: #7c9abd; } .style-changer#style-changer { position: fixed; left: -275px; top: 100px; z-index: 1000; -moz-transition: all 0.4s ease-in; -o-transition: all 0.4s ease-in; -webkit-transition: all 0.4s ease-in; -ms-transition: all 0.4s ease-in; transition: all 0.4s ease-in; } /* 2.22. Animated effect ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .animated { visibility: hidden; } .no-cssanimations .animated, body.is-mobile .animated { visibility: visible; } /* 2.23. Parallax ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .parallax { background-attachment: fixed; background-position: 50% 0; background-repeat: no-repeat; background-size: auto auto; overflow: hidden; } /* 2.24. Page Loader ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .pace { user-select: none; background: #f5f5f5; height: 100%; left: 0; opacity: 1; position: fixed; top: 0; -moz-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; -webkit-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; visibility: visible; width: 100%; z-index: 999999; -webkit-backface-visibility: hidden; } .pace-inactive { display: none; } .pace .loading-page { -webkit-backface-visibility: hidden !important; -webkit-transform: none !important; } /*.pace-running > div { visibility: hidden; &.pace { visibility: visible; } }*/ /* 3. Header ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ /* 3.1. Main Header ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ #header { position: relative; z-index: 999; /* Logo */ /* 3.1.1. Mobile navigation */ /* 3.1.2. Header Styles */ } #header .topnav { height: 30px; background: #01b7f2; width: 100%; } #header .topnav ul.quick-menu > li { float: left; margin-left: 20px; } #header .topnav ul.quick-menu > li:first-child { margin-left: 0; } #header .topnav ul.quick-menu > li > a { color: #fff; line-height: 30px; display: block; font-size: 0.8333em; text-transform: uppercase; } #header .ribbon { position: relative; } #header .ribbon > a { position: relative; padding: 0 10px 0 0; text-transform: uppercase; } #header .ribbon > a:after { display: inline-block; position: absolute; right: 0; /*top: 0; */ content: "\f0d7"; font-family: FontAwesome; color: #fff; } #header .ribbon:hover > ul.menu { top: 28px; visibility: visible; filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; } #header .ribbon > ul.menu { position: absolute; left: -15px; top: -9999px; z-index: 99; visibility: hidden; } #header .ribbon > ul.menu.left { left: auto; right: -10px; } #header .ribbon.currency > ul.menu li a { text-transform: uppercase; font-size: 0.8333em; } #header .main-header { height: auto; position: relative; width: 100%; padding-bottom: 15px; } #header .logo { padding: 0; text-align: left; margin: 22px 0 0; height: auto; } #header .logo a { display: block; } #header .mobile-menu-toggle { background: url(../images/icon/mobile-menu.png) no-repeat center center #01b7f2; padding: 0; margin: 0; height: 66px; width: 66px; padding: 22px; position: absolute; right: 0; top: 0; bottom: 0; text-indent: -9999px; display: none; } #header .mobile-menu-toggle .icon-bar { background: white; } #header.style1 { background: #01b7f2; padding-top: 30px; /* Main menu */ } #header.style1 * { color: #fff; } #header.style1 .logo { margin: 0; float: none; position: absolute; left: 50%; margin-left: -77px; top: 32px; } #header.style1 .logo a { width: 155px; position: relative; /* background: none;*/ } #header.style1 .logo a:after { position: absolute; display: block; width: 130px; height: 30px; background: url("../images/logo_txt.png") no-repeat #01b7f2; content: ""; top: 0; right: 0; } #header.style1 .logo img { filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; } #header.style1 .social-icons { float: right; } #header.style1 .social-icons li a { background: none; border: 1px solid transparent; overflow: hidden; } #header.style1 .social-icons li a:hover { border: 1px solid #40cbf8; } #header.style1 .social-icons li a:hover i { display: block; -webkit-animation: toBottomFromTop 0.3s forwards; -moz-animation: toBottomFromTop 0.3s forwards; animation: toBottomFromTop 0.3s forwards; } #header.style1 .contact-details { float: left; margin-bottom: 30px; } #header.style1 .contact-details .contact-phone { font-size: 1.1667em; font-weight: bold; } #header.style1 .contact-details .contact-phone i { border-color: #40cbf8; } #header.style1 #main-menu { border-top: 1px solid #40cbf8; } #header.style1 #main-menu ul.menu { margin: 0 auto; float: none; } #header.style1 #main-menu ul.menu > li { padding-left: 0; padding-right: 0px; margin-right: 15px; } #header.style1 #main-menu ul.menu > li > a { padding-left: 20px; padding-right: 20px; height: 50px; line-height: 50px; font-weight: bold; } #header.style1 #main-menu ul.menu > li.active > a, #header.style1 #main-menu ul.menu > li:hover > a { color: #fff; background: #40cbf8; } #header.style1 #main-menu ul.menu > li:hover > ul, #header.style1 #main-menu ul.menu > li:hover > .megamenu-wrapper { top: 47px; } #header.style2 { z-index: 99; /* Main menu */ } #header.style2 .topnav { height: auto; background: #2d3e52; } #header.style2 .topnav ul.quick-menu > li > a { color: #7c9abd; height: 50px; line-height: 50px; } #header.style2 .topnav ul.quick-menu > li > a:hover { color: #fff; } #header.style2 .topnav ul.quick-menu > li.ribbon:hover > ul.menu { top: 47px; } #header.style2 .topnav ul.quick-menu > li.ribbon > a:after { color: #7c9abd; } #header.style2 .logo { margin-top: 28px; } #header.style2 .logo a { background-size: auto 22px; } #header.style2 .logo a img { width: auto; height: 22px; } #header.style2 .header-search { padding-top: 22px; text-align: left; height: 78px; } #header.style2 .header-search [class^="col-"] { padding: 0; } #header.style2 .header-search .where { border: 1px solid #dbdbdb; border-right: none; } #header.style2 .header-search .check-in { border: 1px solid #dbdbdb; border-right: none; } #header.style2 .header-search .check-out { border: 1px solid #dbdbdb; border-right: none; } #header.style2 .header-search .guest span.custom-select { border: 1px solid #dbdbdb; } #header.style2 #main-menu ul.menu { margin: 0 auto; float: none; } #header.style2 #main-menu ul.menu > li { padding-left: 0; padding-right: 0px; margin-right: 10px; } #header.style2 #main-menu ul.menu > li > a { padding-left: 15px; padding-right: 15px; height: 50px; line-height: 50px; color: #7c9abd; } #header.style2 #main-menu ul.menu > li.active > a, #header.style2 #main-menu ul.menu > li > a:hover { color: #fff; background: #263546; } #header.style2 #main-menu ul.menu > li:hover > ul, #header.style2 #main-menu ul.menu > li:hover > .megamenu-wrapper { top: 47px; } #header.style3 { /* Main menu */ } #header.style3 .inspire-btn { margin-top: 34px; } #header.style3 .logo { margin-top: 34px; } #header.style3 .logo a { background-size: auto 26px; } #header.style3 #main-menu .menu { margin-right: 40px; } #header.style3 #main-menu .menu > li > a { font-size: 1.1667em; color: #d9d9d9; height: 96px; line-height: 96px; } #header.style3 #main-menu .menu > li:hover > a, #header.style3 #main-menu .menu > li.active > a { color: #01b7f2; } #header.style4 { padding-top: 30px; /* Main menu */ } #header.style4 .logo { margin: 0; margin-bottom: 16px; } #header.style4 .quick-search { display: inline-block; } #header.style4 .quick-search .input-text { width: 250px; } #header.style4 button { padding: 0 15px; } #header.style4 .topnav { float: right; background: none; width: auto; height: auto; } #header.style4 .topnav ul.quick-menu > li > a { line-height: 50px; height: 50px; color: inherit; } #header.style4 .topnav ul.quick-menu .ribbon:hover > ul.menu { top: 48px; } #header.style4 .topnav ul.quick-menu .ribbon > a:after { color: inherit; } #header.style4 .main-navigation { border-top: 1px solid #f5f5f5; } #header.style4 #main-menu > ul.menu { margin: 0 auto; float: none; } #header.style4 #main-menu > ul.menu > li { padding-left: 0; padding-right: 0px; margin-right: 2px; } #header.style4 #main-menu > ul.menu > li > a { padding-left: 20px; padding-right: 20px; height: 50px; line-height: 50px; } #header.style4 #main-menu > ul.menu > li.active > a, #header.style4 #main-menu > ul.menu > li:hover > a { font-weight: bold; color: inherit; background: #f5f5f5; } #header.style4 #main-menu > ul.menu > li:hover > ul, #header.style4 #main-menu > ul.menu > li:hover > .megamenu-wrapper { top: 48px; } #header.style5 #main-menu > ul > li > a { line-height: 48px; height: 48px; } #header.style5 #main-menu > ul > li:hover > ul, #header.style5 #main-menu > ul > li:hover > .megamenu-wrapper { top: 46px; } #header.style5 .logo { margin-top: 14px; min-height: initial; } #header.style5 .logo img { height: 20px; } #header.style5 .logo a { background-size: auto 20px; } #header.style6 { padding-top: 20px; /* Main menu */ } #header.style6 .logo { margin: 0; } #header.style6 .logo img { height: 24px; } #header.style6 .logo a { background-size: auto 24px; } #header.style6 button { padding: 0 15px; } #header.style6 .topnav { float: left; background: none; width: auto; height: auto; margin: 0 0 22px 20px; } #header.style6 .topnav ul.quick-menu > li > a { line-height: 30px; height: 30px; color: inherit; } #header.style6 .topnav ul.quick-menu .ribbon:hover > ul.menu { top: 28px; } #header.style6 .topnav ul.quick-menu .ribbon > a:after { color: inherit; } #header.style6 .main-navigation { background: #fdb714; } #header.style6 #main-menu > ul.menu { margin: 0 auto; float: none; } #header.style6 #main-menu > ul.menu > li { padding-left: 0; padding-right: 0px; margin-right: 2px; } #header.style6 #main-menu > ul.menu > li > a { padding-left: 20px; padding-right: 20px; height: 50px; line-height: 50px; font-weight: bold; color: #d07f00; } #header.style6 #main-menu > ul.menu > li.active > a, #header.style6 #main-menu > ul.menu > li:hover > a { color: #fff; background: #efa300; } #header.style6 #main-menu > ul.menu > li:hover > ul, #header.style6 #main-menu > ul.menu > li:hover > .megamenu-wrapper { top: 48px; } #header.style6 .social-icons { margin-top: 10px; } #header.style6 .social-icons li > a { background: none; color: #d07f00; } #header.style6 .social-icons li > a:hover { color: #fff; } #header.style6 .social-icons li > a:hover i { display: block; -webkit-animation: toBottomFromTop 0.3s forwards; -moz-animation: toBottomFromTop 0.3s forwards; animation: toBottomFromTop 0.3s forwards; } #header.style7 { /* Main menu */ } #header.style7 .logo { margin: 32px 0 0; } #header.style7 .logo img { height: 28px; } #header.style7 .logo a { background-size: auto 28px; } #header.style7 .topnav { float: left; background: none; width: auto; height: auto; margin: 0; } #header.style7 .topnav ul.quick-menu > li > a { line-height: 36px; height: 36px; color: inherit; } #header.style7 .topnav ul.quick-menu .ribbon:hover > ul.menu { top: 34px; } #header.style7 .topnav ul.quick-menu .ribbon > a:after { color: inherit; } #header.style7 .contact-details { text-transform: uppercase; margin: 0; line-height: 36px; } #header.style7 .contact-details i { color: #01b7f2; vertical-align: middle; } #header.style7 .contact-details .contact-phone { color: inherit; font-size: 0.8333em; } #header.style7 .contact-details .contact-phone i { font-size: 14px; } #header.style7 .contact-details .contact-email { color: inherit; font-size: 0.8333em; padding: 0 0 0 10px; } #header.style7 .contact-details .contact-email i { font-size: 20px; } #header.style7 .main-navigation { background: #2d3e52; } #header.style7 #main-menu > ul.menu { float: right; } #header.style7 #main-menu > ul.menu > li { padding-left: 0; padding-right: 0px; margin-right: 2px; } #header.style7 #main-menu > ul.menu > li > a { padding-left: 20px; padding-right: 20px; height: 96px; line-height: 96px; font-weight: bold; color: #7c9abd; } #header.style7 #main-menu > ul.menu > li.active > a, #header.style7 #main-menu > ul.menu > li:hover > a { color: #fff; } #header.style7 #main-menu > ul.menu > li:hover > ul, #header.style7 #main-menu > ul.menu > li:hover > .megamenu-wrapper { top: 94px; } #header.style7 .social-icons { margin-top: 32px; } #header.style7 .social-icons li > a { background: none; color: #7c9abd; overflow: hidden; } #header.style7 .social-icons li > a:hover { background: #01b7f2; color: #fff; } #header.style7 .social-icons li > a:hover i { display: block; -webkit-animation: toBottomFromTop 0.3s forwards; -moz-animation: toBottomFromTop 0.3s forwards; animation: toBottomFromTop 0.3s forwards; } #header .logo a, #footer .logo a, .chaser .logo a { background: url("../images/logo.png") no-repeat 0 0; display: block; } #header .logo img, #footer .logo img, .chaser .logo img { filter: alpha(opacity=0); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; -moz-opacity: 0; -khtml-opacity: 0; opacity: 0; } /* 3.1.3. Navigation */ .menu > li { position: relative; } /* 3.1.4. Language flags */ .lang-flag { padding-left: 20px !important; } .lang-flag.en-us { background: url(../images/icon/flags/en-us.png) no-repeat left center; } /* 3.1.5. Main Menu */ #main-menu ul.menu li:not(.megamenu-menu) ul, .chaser .menu li:not(.megamenu-menu) ul, .topnav .container > ul ul, .megamenu-wrapper { filter: alpha(opacity=0); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; -moz-opacity: 0; -khtml-opacity: 0; opacity: 0; -moz-transition: opacity 0.2s ease-in; -o-transition: opacity 0.2s ease-in; -webkit-transition: opacity 0.2s ease-in; -ms-transition: opacity 0.2s ease-in; transition: opacity 0.2s ease-in; } #main-menu ul.menu, .chaser ul.menu { margin: 0; float: right; margin-top: 31px; /* 1st level */ /* 2nd level */ /* 3rd level */ /* 3.1.6. Mega Menu */ } #main-menu ul.menu li, .chaser ul.menu li { -webkit-backface-visibility: hidden; -webkit-transform: none !important; } #main-menu ul.menu > li, .chaser ul.menu > li { float: left; padding-left: 20px; padding-right: 20px; } #main-menu ul.menu > li:first-child, .chaser ul.menu > li:first-child { padding-left: 0; } #main-menu ul.menu > li:last-child, .chaser ul.menu > li:last-child { padding-right: 0; } #main-menu ul.menu > li:hover > ul, .chaser ul.menu > li:hover > ul { top: 66px; visibility: visible; height: auto !important; filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; z-index: 1000; } #main-menu ul.menu > li > a, .chaser ul.menu > li > a { font-weight: normal; display: block; padding: 0; height: 68px; line-height: 68px; text-transform: uppercase; letter-spacing: 0.04em; color: #000; font-size: 18px; } #main-menu ul.menu > li.active > a, .chaser ul.menu > li.active > a { color: #01b7f2; font-weight: bold; } #main-menu ul.menu > li:hover > a, .chaser ul.menu > li:hover > a { color: #01b7f2; } #main-menu ul.menu > li > ul.left, .chaser ul.menu > li > ul.left { left: auto; right: -10px; } #main-menu ul.menu > li ul, .chaser ul.menu > li ul { visibility: hidden; position: absolute; left: 0px; top: -9999px; z-index: -1; width: 180px; padding: 0; background: #01b7f2; } #main-menu ul.menu > li ul li, .chaser ul.menu > li ul li { text-align: left; position: relative; } #main-menu ul.menu > li ul li:first-child, .chaser ul.menu > li ul li:first-child { border-top: none; } #main-menu ul.menu > li ul li:hover > ul, .chaser ul.menu > li ul li:hover > ul { top: 0; display: block; visibility: visible; filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; z-index: 1000; } #main-menu ul.menu > li ul li > a, .chaser ul.menu > li ul li > a { border-top: 1px solid #04afe7; white-space: nowrap; color: #fff; padding: 12px 20px 12px 18px; display: block; font-size: 0.9167em; filter: alpha(opacity=70); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; -moz-opacity: 0.7; -khtml-opacity: 0.7; opacity: 0.7; } #main-menu ul.menu > li ul li:hover > a, #main-menu ul.menu > li ul li.active > a, .chaser ul.menu > li ul li:hover > a, .chaser ul.menu > li ul li.active > a { background: #04afe7; filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; } #main-menu ul.menu > li.menu-color-blue ul, .chaser ul.menu > li.menu-color-blue ul { background: #01b7f2; } #main-menu ul.menu > li.menu-color-blue ul li:hover > a, #main-menu ul.menu > li.menu-color-blue ul li.active > a, .chaser ul.menu > li.menu-color-blue ul li:hover > a, .chaser ul.menu > li.menu-color-blue ul li.active > a { background: #04afe7; } #main-menu ul.menu > li.menu-color-blue ul li > a, .chaser ul.menu > li.menu-color-blue ul li > a { border-top: 1px solid #04afe7; } #main-menu ul.menu > li.menu-color-yellow ul, .chaser ul.menu > li.menu-color-yellow ul { background: #fdb714; } #main-menu ul.menu > li.menu-color-yellow ul li:hover > a, #main-menu ul.menu > li.menu-color-yellow ul li.active > a, .chaser ul.menu > li.menu-color-yellow ul li:hover > a, .chaser ul.menu > li.menu-color-yellow ul li.active > a { background: #f5b010; } #main-menu ul.menu > li.menu-color-yellow ul li > a, .chaser ul.menu > li.menu-color-yellow ul li > a { border-top: 1px solid #f5b010; } #main-menu ul.menu > li.menu-color-green ul, .chaser ul.menu > li.menu-color-green ul { background: #98ce44; } #main-menu ul.menu > li.menu-color-green ul li:hover > a, #main-menu ul.menu > li.menu-color-green ul li.active > a, .chaser ul.menu > li.menu-color-green ul li:hover > a, .chaser ul.menu > li.menu-color-green ul li.active > a { background: #91c63d; } #main-menu ul.menu > li.menu-color-green ul li > a, .chaser ul.menu > li.menu-color-green ul li > a { border-top: 1px solid #91c63d; } #main-menu ul.menu > li li > ul, .chaser ul.menu > li li > ul { left: 180px; } #main-menu ul.menu > li li > ul.left, .chaser ul.menu > li li > ul.left { left: -180px; } #main-menu ul.menu > .megamenu-menu:hover > .megamenu-wrapper, .chaser ul.menu > .megamenu-menu:hover > .megamenu-wrapper { filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; top: 66px; z-index: 1002; visibility: visible; } #main-menu ul.menu > .megamenu-menu:hover > .megamenu-wrapper ul, .chaser ul.menu > .megamenu-menu:hover > .megamenu-wrapper ul { visibility: visible; } #main-menu ul.menu > .megamenu-menu .megamenu-wrapper, .chaser ul.menu > .megamenu-menu .megamenu-wrapper { position: absolute; z-index: -1; left: 0; top: -9999px; visibility: hidden; overflow: hidden; display: none; padding: 0; } #main-menu ul.menu > .megamenu-menu .megamenu-wrapper ul, .chaser ul.menu > .megamenu-menu .megamenu-wrapper ul { position: static; width: 100%; filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; } #main-menu ul.menu > .megamenu-menu .megamenu-holder, .chaser ul.menu > .megamenu-menu .megamenu-holder { width: auto; margin-left: -15px; margin-right: -15px; } #main-menu ul.menu > .megamenu-menu ul.megamenu, .chaser ul.menu > .megamenu-menu ul.megamenu { display: table; table-layout: fixed; width: 100%; background: #01b7f2; } #main-menu ul.menu > .megamenu-menu ul.megamenu li.menu-item-has-children.active > a, #main-menu ul.menu > .megamenu-menu ul.megamenu li.menu-item-has-children:hover > a, .chaser ul.menu > .megamenu-menu ul.megamenu li.menu-item-has-children.active > a, .chaser ul.menu > .megamenu-menu ul.megamenu li.menu-item-has-children:hover > a { background: none; } #main-menu ul.menu > .megamenu-menu ul.megamenu li.menu-item-has-children ul, .chaser ul.menu > .megamenu-menu ul.megamenu li.menu-item-has-children ul { background: none; } #main-menu ul.menu > .megamenu-menu ul.megamenu > li, .chaser ul.menu > .megamenu-menu ul.megamenu > li { display: table-cell; float: none; padding-bottom: 25px; border: none; } #main-menu ul.menu > .megamenu-menu ul.megamenu > li > a, .chaser ul.menu > .megamenu-menu ul.megamenu > li > a { border-top: none; padding-left: 40px; font-size: 1em; font-weight: bold; text-transform: uppercase; filter: alpha(opacity=100) !important; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)" !important; -moz-opacity: 1 !important; -khtml-opacity: 1 !important; opacity: 1 !important; } #main-menu ul.menu > .megamenu-menu ul.megamenu > li > a:hover, .chaser ul.menu > .megamenu-menu ul.megamenu > li > a:hover { background: none; } #main-menu ul.menu > .megamenu-menu ul.megamenu > li.megamenu-columns-1 .sub-menu > li, .chaser ul.menu > .megamenu-menu ul.megamenu > li.megamenu-columns-1 .sub-menu > li { width: 100%; } #main-menu ul.menu > .megamenu-menu ul.megamenu > li.megamenu-columns-2 .sub-menu > li, .chaser ul.menu > .megamenu-menu ul.megamenu > li.megamenu-columns-2 .sub-menu > li { width: 50%; } #main-menu ul.menu > .megamenu-menu ul.megamenu > li.megamenu-columns-3 .sub-menu > li, .chaser ul.menu > .megamenu-menu ul.megamenu > li.megamenu-columns-3 .sub-menu > li { width: 33.3333%; } #main-menu ul.menu > .megamenu-menu ul.megamenu > li.megamenu-columns-4 .sub-menu > li, .chaser ul.menu > .megamenu-menu ul.megamenu > li.megamenu-columns-4 .sub-menu > li { width: 25%; } #main-menu ul.menu > .megamenu-menu ul.megamenu > li.megamenu-columns-5 .sub-menu > li, .chaser ul.menu > .megamenu-menu ul.megamenu > li.megamenu-columns-5 .sub-menu > li { width: 20%; } #main-menu ul.menu > .megamenu-menu ul.megamenu > li.megamenu-columns-6 .sub-menu > li, .chaser ul.menu > .megamenu-menu ul.megamenu > li.megamenu-columns-6 .sub-menu > li { width: 16.6666%; } #main-menu ul.menu > .megamenu-menu ul.megamenu > li > ul > li, .chaser ul.menu > .megamenu-menu ul.megamenu > li > ul > li { float: left; border: none; } #main-menu ul.menu > .megamenu-menu ul.megamenu ul.sub-menu:after, .chaser ul.menu > .megamenu-menu ul.megamenu ul.sub-menu:after { display: table; content: ""; clear: both; } #main-menu ul.menu > .megamenu-menu ul.megamenu ul.sub-menu li li, .chaser ul.menu > .megamenu-menu ul.megamenu ul.sub-menu li li { display: block; float: none; padding-left: 15px; padding-right: 15px; border: none; } #main-menu ul.menu > .megamenu-menu ul.megamenu ul.sub-menu li li > a, .chaser ul.menu > .megamenu-menu ul.megamenu ul.sub-menu li li > a { border-top: none; } #main-menu ul.menu > .megamenu-menu ul.megamenu ul.sub-menu li li a, .chaser ul.menu > .megamenu-menu ul.megamenu ul.sub-menu li li a { white-space: normal; padding-right: 0; font-size: 0.9167em; border-bottom: 1px solid #04afe7; position: relative; padding-left: 40px; } #main-menu ul.menu > .megamenu-menu ul.megamenu ul.sub-menu li li a:before, .chaser ul.menu > .megamenu-menu ul.megamenu ul.sub-menu li li a:before { font-family: FontAwesome; content: "\f111"; display: block; font-size: 5px; position: absolute; left: 25px; font-weight: normal; } #main-menu ul.menu > .megamenu-menu ul.megamenu ul.sub-menu li li:hover > a, #main-menu ul.menu > .megamenu-menu ul.megamenu ul.sub-menu li li.active > a, .chaser ul.menu > .megamenu-menu ul.megamenu ul.sub-menu li li:hover > a, .chaser ul.menu > .megamenu-menu ul.megamenu ul.sub-menu li li.active > a { font-weight: bold; } #main-menu ul.menu .megamenu-menu.menu-color-blue ul.megamenu, .chaser ul.menu .megamenu-menu.menu-color-blue ul.megamenu { background: #01b7f2; } #main-menu ul.menu .megamenu-menu.menu-color-blue ul.megamenu ul.sub-menu li li a, .chaser ul.menu .megamenu-menu.menu-color-blue ul.megamenu ul.sub-menu li li a { border-bottom-color: #04afe7; } #main-menu ul.menu .megamenu-menu.menu-color-blue ul.megamenu ul.sub-menu li li:hover > a, #main-menu ul.menu .megamenu-menu.menu-color-blue ul.megamenu ul.sub-menu li li.active > a, .chaser ul.menu .megamenu-menu.menu-color-blue ul.megamenu ul.sub-menu li li:hover > a, .chaser ul.menu .megamenu-menu.menu-color-blue ul.megamenu ul.sub-menu li li.active > a { background: #04afe7; } #main-menu ul.menu .megamenu-menu.menu-color-yellow ul.megamenu, .chaser ul.menu .megamenu-menu.menu-color-yellow ul.megamenu { background: #fdb714; } #main-menu ul.menu .megamenu-menu.menu-color-yellow ul.megamenu ul.sub-menu li li a, .chaser ul.menu .megamenu-menu.menu-color-yellow ul.megamenu ul.sub-menu li li a { border-bottom-color: #f5b010; } #main-menu ul.menu .megamenu-menu.menu-color-yellow ul.megamenu ul.sub-menu li li:hover > a, #main-menu ul.menu .megamenu-menu.menu-color-yellow ul.megamenu ul.sub-menu li li.active > a, .chaser ul.menu .megamenu-menu.menu-color-yellow ul.megamenu ul.sub-menu li li:hover > a, .chaser ul.menu .megamenu-menu.menu-color-yellow ul.megamenu ul.sub-menu li li.active > a { background: #f5b010; } #main-menu ul.menu .megamenu-menu.menu-color-green ul.megamenu, .chaser ul.menu .megamenu-menu.menu-color-green ul.megamenu { background: #98ce44; } #main-menu ul.menu .megamenu-menu.menu-color-green ul.megamenu ul.sub-menu li li a, .chaser ul.menu .megamenu-menu.menu-color-green ul.megamenu ul.sub-menu li li a { border-bottom-color: #91c63d; } #main-menu ul.menu .megamenu-menu.menu-color-green ul.megamenu ul.sub-menu li li:hover > a, #main-menu ul.menu .megamenu-menu.menu-color-green ul.megamenu ul.sub-menu li li.active > a, .chaser ul.menu .megamenu-menu.menu-color-green ul.megamenu ul.sub-menu li li:hover > a, .chaser ul.menu .megamenu-menu.menu-color-green ul.megamenu ul.sub-menu li li.active > a { background: #91c63d; } #main-menu ul.menu .megamenu-menu.menu-skin-light .megamenu-wrapper, .chaser ul.menu .megamenu-menu.menu-skin-light .megamenu-wrapper { border: 2px solid #01b7f2; } #main-menu ul.menu .megamenu-menu.menu-skin-light ul.megamenu, .chaser ul.menu .megamenu-menu.menu-skin-light ul.megamenu { background: #fff; } #main-menu ul.menu .megamenu-menu.menu-skin-light ul.megamenu > li > a, .chaser ul.menu .megamenu-menu.menu-skin-light ul.megamenu > li > a { color: #2d3e52 !important; } #main-menu ul.menu .megamenu-menu.menu-skin-light ul.megamenu ul.sub-menu li li a, .chaser ul.menu .megamenu-menu.menu-skin-light ul.megamenu ul.sub-menu li li a { color: #838383; border-bottom: 1px solid #f5f5f5; } #main-menu ul.menu .megamenu-menu.menu-skin-light ul.megamenu ul.sub-menu li li:hover > a, #main-menu ul.menu .megamenu-menu.menu-skin-light ul.megamenu ul.sub-menu li li.active > a, .chaser ul.menu .megamenu-menu.menu-skin-light ul.megamenu ul.sub-menu li li:hover > a, .chaser ul.menu .megamenu-menu.menu-skin-light ul.megamenu ul.sub-menu li li.active > a { background: #f5f5f5; color: #2d3e52; } #main-menu ul.menu .megamenu-menu.menu-skin-light ul.megamenu ul.sub-menu li li:hover > a:before, #main-menu ul.menu .megamenu-menu.menu-skin-light ul.megamenu ul.sub-menu li li.active > a:before, .chaser ul.menu .megamenu-menu.menu-skin-light ul.megamenu ul.sub-menu li li:hover > a:before, .chaser ul.menu .megamenu-menu.menu-skin-light ul.megamenu ul.sub-menu li li.active > a:before { color: #01b7f2; } #main-menu ul.menu .megamenu-menu.menu-skin-light.menu-color-blue .megamenu-wrapper, .chaser ul.menu .megamenu-menu.menu-skin-light.menu-color-blue .megamenu-wrapper { border-color: #01b7f2; } #main-menu ul.menu .megamenu-menu.menu-skin-light.menu-color-blue ul.megamenu ul.sub-menu li li:hover > a:before, #main-menu ul.menu .megamenu-menu.menu-skin-light.menu-color-blue ul.megamenu ul.sub-menu li li.active > a:before, .chaser ul.menu .megamenu-menu.menu-skin-light.menu-color-blue ul.megamenu ul.sub-menu li li:hover > a:before, .chaser ul.menu .megamenu-menu.menu-skin-light.menu-color-blue ul.megamenu ul.sub-menu li li.active > a:before { color: #01b7f2; } #main-menu ul.menu .megamenu-menu.menu-skin-light.menu-color-yellow .megamenu-wrapper, .chaser ul.menu .megamenu-menu.menu-skin-light.menu-color-yellow .megamenu-wrapper { border-color: #fdb714; } #main-menu ul.menu .megamenu-menu.menu-skin-light.menu-color-yellow ul.megamenu ul.sub-menu li li:hover > a:before, #main-menu ul.menu .megamenu-menu.menu-skin-light.menu-color-yellow ul.megamenu ul.sub-menu li li.active > a:before, .chaser ul.menu .megamenu-menu.menu-skin-light.menu-color-yellow ul.megamenu ul.sub-menu li li:hover > a:before, .chaser ul.menu .megamenu-menu.menu-skin-light.menu-color-yellow ul.megamenu ul.sub-menu li li.active > a:before { color: #fdb714; } #main-menu ul.menu .megamenu-menu.menu-skin-light.menu-color-green .megamenu-wrapper, .chaser ul.menu .megamenu-menu.menu-skin-light.menu-color-green .megamenu-wrapper { border-color: #98ce44; } #main-menu ul.menu .megamenu-menu.menu-skin-light.menu-color-green ul.megamenu ul.sub-menu li li:hover > a:before, #main-menu ul.menu .megamenu-menu.menu-skin-light.menu-color-green ul.megamenu ul.sub-menu li li.active > a:before, .chaser ul.menu .megamenu-menu.menu-skin-light.menu-color-green ul.megamenu ul.sub-menu li li:hover > a:before, .chaser ul.menu .megamenu-menu.menu-skin-light.menu-color-green ul.megamenu ul.sub-menu li li.active > a:before { color: #98ce44; } /* 3.1.7. Mini Menu */ ul.menu.mini { min-width: 180px; border: 2px solid #01b7f2; background: #fff; } ul.menu.mini li { padding: 0 20px; float: none; margin: 0; } ul.menu.mini li a { border-bottom: 1px solid #f5f5f5; display: block; padding: 10px 0; color: inherit; line-height: normal; font-size: 0.9167em; text-align: left; } ul.menu.mini li:hover, ul.menu.mini li.active { background: #f5f5f5; } ul.menu.mini li:hover a, ul.menu.mini li.active a { color: #01b7f2; font-weight: bold; } .menu-color-skin ul.menu.mini, .menu-color-blue ul.menu.mini, .menu-color-yellow ul.menu.mini, .menu-color-green ul.menu.mini { border: none; padding: 10px 0; } .menu-color-skin ul.menu.mini li a, .menu-color-blue ul.menu.mini li a, .menu-color-yellow ul.menu.mini li a, .menu-color-green ul.menu.mini li a { filter: alpha(opacity=70); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; -moz-opacity: 0.7; -khtml-opacity: 0.7; opacity: 0.7; color: #fff; font-size: 0.8333em; } .menu-color-skin ul.menu.mini li:last-child a, .menu-color-blue ul.menu.mini li:last-child a, .menu-color-yellow ul.menu.mini li:last-child a, .menu-color-green ul.menu.mini li:last-child a { border: none; } .menu-color-skin ul.menu.mini li:hover a, .menu-color-blue ul.menu.mini li:hover a, .menu-color-yellow ul.menu.mini li:hover a, .menu-color-green ul.menu.mini li:hover a, .menu-color-skin ul.menu.mini li.active a, .menu-color-blue ul.menu.mini li.active a, .menu-color-yellow ul.menu.mini li.active a, .menu-color-green ul.menu.mini li.active a { filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; } .menu-color-skin ul.menu.mini, .menu-color-blue ul.menu.mini, .menu-color-yellow ul.menu.mini, .menu-color-green ul.menu.mini { background: #01b7f2; } .menu-color-skin ul.menu.mini li a, .menu-color-blue ul.menu.mini li a, .menu-color-yellow ul.menu.mini li a, .menu-color-green ul.menu.mini li a { border-color: #04afe7; } .menu-color-skin ul.menu.mini li:hover, .menu-color-blue ul.menu.mini li:hover, .menu-color-yellow ul.menu.mini li:hover, .menu-color-green ul.menu.mini li:hover, .menu-color-skin ul.menu.mini li.active, .menu-color-blue ul.menu.mini li.active, .menu-color-yellow ul.menu.mini li.active, .menu-color-green ul.menu.mini li.active { background: #04afe7; } .menu-color-blue ul.menu.mini { background: #01b7f2; } .menu-color-blue ul.menu.mini li a { border-color: #04afe7; } .menu-color-blue ul.menu.mini li:hover, .menu-color-blue ul.menu.mini li.active { background: #04afe7; } .menu-color-yellow ul.menu.mini { background: #fdb714; } .menu-color-yellow ul.menu.mini li a { border-color: #f5b010; } .menu-color-yellow ul.menu.mini li:hover, .menu-color-yellow ul.menu.mini li.active { background: #f5b010; } .menu-color-green ul.menu.mini { background: #98ce44; } .menu-color-green ul.menu.mini li a { border-color: #91c63d; } .menu-color-green ul.menu.mini li:hover, .menu-color-green ul.menu.mini li.active { background: #91c63d; } /* 3.1.8. Mobile Menu */ #header .mobile-menu { background: #01b7f2; text-align: left; } #header .mobile-menu a { color: #fff; filter: alpha(opacity=70); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; -moz-opacity: 0.7; -khtml-opacity: 0.7; opacity: 0.7; display: block; padding: 15px 0; background: none !important; } #header .mobile-menu li.active > a, #header .mobile-menu li:hover > a { filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; } #header .mobile-menu > ul.menu > li { float: none; padding-left: 15px; padding-right: 15px; } #header .mobile-menu > ul.menu > li > a { font-size: 1.1667em; border-top: 1px solid #04afe7; } #header .mobile-menu > ul.menu > li > a { text-transform: uppercase; font-weight: bold; } #header .mobile-menu > ul.menu > li.menu-item-has-children { position: relative; } #header .mobile-menu > ul.menu > li.menu-item-has-children.open { background: #04afe7; } #header .mobile-menu > ul.menu > li.menu-item-has-children > .dropdown-toggle { position: absolute; right: 1px; top: 7px; height: 34px; line-height: 34px; padding: 0 15px; background: none; display: inline-block; font-family: FontAwesome; font-size: 1.3333em; font-weight: normal; filter: alpha(opacity=70); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; -moz-opacity: 0.7; -khtml-opacity: 0.7; opacity: 0.7; } #header .mobile-menu > ul.menu > li.menu-item-has-children > .dropdown-toggle:after { content: "\f056"; } #header .mobile-menu > ul.menu > li.menu-item-has-children > .dropdown-toggle.collapsed:after { content: "\f055"; } #header .mobile-menu > ul.menu > li.menu-item-has-children.open > a { color: #fff; /*border-top-color: $skin-bg-color;*/ filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; } #header .mobile-menu > ul.menu > li.menu-item-has-children.open > .dropdown-toggle { filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; } #header .mobile-menu > ul.menu > li.menu-item-has-children:hover > a, #header .mobile-menu > ul.menu > li.menu-item-has-children:hover > .dropdown-toggle { filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; } #header .mobile-menu > ul.menu > li.menu-item-has-children > ul { border-top: 1px solid #01b7f2; } #header .mobile-menu > ul.menu > li:first-child > a { border-top: none; } #header .mobile-menu > ul.menu > li:last-child > a { border-bottom: 1px solid #04afe7; } #header .mobile-menu > ul.menu > li > ul { /*background: $skin-mobile-menu-color;*/ } #header .mobile-menu > ul.menu > li > ul li > a { padding-left: 15px; font-size: 1.0833em; position: relative; } #header .mobile-menu > ul.menu > li > ul li > a:before { font-family: FontAwesome; content: "\f111"; display: block; font-size: 4px; position: absolute; left: 0px; } #header .mobile-menu > ul.menu > li > ul li.menu-item-has-children > a { padding-left: 0; color: #fff; filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; font-size: 1.1667em; font-weight: bold; text-transform: uppercase; } #header .mobile-menu > ul.menu > li > ul li.menu-item-has-children > a:before { content: ""; display: none; } #header .mobile-menu > ul.menu > li > ul li.menu-item-has-children > ul { border-bottom: 1px solid #01b7f2; } #header .mobile-menu > ul.menu > li > ul li.menu-item-has-children:last-child > ul { border-bottom: none !important; } #header .mobile-menu > ul.menu > li li li.menu-item-has-children > a { padding-left: 10px; } #header .mobile-menu > ul.menu > li li li.menu-item-has-children > a:before { display: none; } #header .mobile-menu .mobile-topnav { margin: 0 auto; padding: 0 5px; } #header .mobile-menu .mobile-topnav > li { float: left; position: relative; color: #40cbf8; } #header .mobile-menu .mobile-topnav > li > a { font-size: 0.8333em; padding: 0 10px; margin: 22px 10px; line-height: 1em; width: auto; } #header .mobile-menu .mobile-topnav > li:after { content: "|"; position: absolute; right: -1px; top: 50%; margin-top: -10px; } #header .mobile-menu .mobile-topnav > li:last-child:after { display: none; } #header .mobile-menu .mobile-topnav > li:first-child a { margin-left: 0; } #header .mobile-menu .mobile-topnav .menu.mini { left: 0; top: 40px; visibility: visible; display: none; min-width: 100px; } #header .mobile-menu .mobile-topnav .menu.mini li > a { padding: 10px 0; } #header .mobile-menu .mobile-topnav .menu.mini.left { left: 0; right: auto; } #header .mobile-menu.menu-color-blue .mobile-topnav li:after, #header .mobile-menu.menu-color-yellow .mobile-topnav li:after, #header .mobile-menu.menu-color-green .mobile-topnav li:after { color: #fff; filter: alpha(opacity=70); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; -moz-opacity: 0.7; -khtml-opacity: 0.7; opacity: 0.7; } #header .mobile-menu.menu-color-blue { background: #01b7f2; } #header .mobile-menu.menu-color-blue ul.menu > li > a { border-top-color: #04afe7; } #header .mobile-menu.menu-color-blue ul.menu > li.menu-item-has-children.open { background: #04afe7; } #header .mobile-menu.menu-color-blue ul.menu > li.menu-item-has-children.open > a, #header .mobile-menu.menu-color-blue ul.menu > li.menu-item-has-children > ul { border-top-color: #01b7f2; } #header .mobile-menu.menu-color-blue ul.menu > li:last-child > a { border-bottom-color: #04afe7; } #header .mobile-menu.menu-color-blue ul.menu > li > ul li.menu-item-has-children > ul { border-bottom-color: #01b7f2; } #header .mobile-menu.menu-color-yellow { background: #fdb714; } #header .mobile-menu.menu-color-yellow ul.menu > li > a { border-top-color: #f5b010; } #header .mobile-menu.menu-color-yellow ul.menu > li.menu-item-has-children.open { background: #f5b010; } #header .mobile-menu.menu-color-yellow ul.menu > li.menu-item-has-children.open > a, #header .mobile-menu.menu-color-yellow ul.menu > li.menu-item-has-children > ul { border-top-color: #fdb714; } #header .mobile-menu.menu-color-yellow ul.menu > li:last-child > a { border-bottom-color: #f5b010; } #header .mobile-menu.menu-color-yellow ul.menu > li > ul li.menu-item-has-children > ul { border-bottom-color: #fdb714; } #header .mobile-menu.menu-color-green { background: #98ce44; } #header .mobile-menu.menu-color-green ul.menu > li > a { border-top-color: #91c63d; } #header .mobile-menu.menu-color-green ul.menu > li.menu-item-has-children.open { background: #91c63d; } #header .mobile-menu.menu-color-green ul.menu > li.menu-item-has-children.open > a, #header .mobile-menu.menu-color-green ul.menu > li.menu-item-has-children > ul { border-top-color: #98ce44; } #header .mobile-menu.menu-color-green ul.menu > li:last-child > a { border-bottom-color: #91c63d; } #header .mobile-menu.menu-color-green ul.menu > li > ul li.menu-item-has-children > ul { border-bottom-color: #98ce44; } /* 3.1.9. Sticky Header */ .chaser { /*background: rgba(red($skin-bg-color), green($skin-bg-color), blue($skin-bg-color), 0.8); left: 0; padding: 0; position: fixed; right: 0; top: 0; width: 100%; z-index: 9999;*/ background: rgba(255, 255, 255, 0.95); position: fixed; right: 0; top: 0; width: 100%; z-index: 999; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12); -webkit-backface-visibility: hidden; } .chaser ul.menu > li > a { line-height: 48px; height: 48px; } .chaser ul.menu > li:hover > ul, .chaser ul.menu > li:hover > .megamenu-wrapper { top: 46px !important; } .chaser .logo { margin-top: 14px; min-height: initial; padding: 0; height: auto; margin-bottom: 0; } .chaser .logo img { height: 20px; } .chaser .logo a { background-size: auto 50px; } .no-rgba .chaser { background: #fff; filter: alpha(opacity=95); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=95)"; -moz-opacity: 0.95; -khtml-opacity: 0.95; opacity: 0.95; } .no-backgroundsize .chaser .logo a { background-size: auto 20px; background-image: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/logo.png', sizingMethod='scale'); -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/logo.png', sizingMethod='scale')"; } /* 3.2.0. Sign up & Login box */ .travelo-signup-box, .travelo-login-box { border: 2px solid #01b7f2; width: 300px; margin: 0 auto; display: none; } .travelo-signup-box .login-social .button, .travelo-login-box .login-social .button { width: 100%; height: 36px; line-height: 36px; margin-bottom: 10px; font-size: 1.3333em; font-weight: 400; text-align: left; padding-left: 20px; letter-spacing: 0.04em; } .travelo-signup-box .login-social .button i, .travelo-login-box .login-social .button i { font-size: 1.5em; margin-right: 36px; width: 20px; float: left; display: block; } .travelo-signup-box .login-facebook, .travelo-login-box .login-facebook { background: #155c92; } .travelo-signup-box .login-googleplus, .travelo-login-box .login-googleplus { background: #d13535; } .travelo-signup-box .seperator, .travelo-login-box .seperator { line-height: 0; border-top: 1px solid #f5f5f5; position: relative; margin-top: 10px; margin-bottom: 10px; } .travelo-signup-box .seperator label, .travelo-login-box .seperator label { display: block; font-size: 0.9167em; position: absolute; left: 50%; top: 50%; line-height: 1; background: #fff; padding: 0 10px; margin: -1px 0 0; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); font-weight: 400; } .travelo-signup-box p, .travelo-login-box p { margin-bottom: 0; } .travelo-signup-box .description, .travelo-login-box .description { font-size: 1em; color: #9e9e9e; } .travelo-signup-box .form-group, .travelo-login-box .form-group { margin-bottom: 10px; text-align: left; } .travelo-signup-box .checkbox label, .travelo-login-box .checkbox label { font-size: 1em; } .travelo-signup-box .goto-login, .travelo-signup-box .goto-signup, .travelo-signup-box .signup-email, .travelo-login-box .goto-login, .travelo-login-box .goto-signup, .travelo-login-box .signup-email { color: #01b7f2; font-size: 1.0833em; } .travelo-signup-box .signup-email-section { margin-bottom: 10px; } .travelo-signup-box .signup-email i { font-size: 1.2em; margin-right: 4px; } .travelo-signup-box .email-signup { margin-top: 5px; margin-bottom: 20px; display: none; } .travelo-login-box .checkbox-inline { margin-left: 0; } .travelo-login-box .forgot-password { color: #01b7f2; text-decoration: underline; } /* 3.2. Slideshow ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ #slideshow { position: relative; width: 100%; padding: 0; min-height: 100px; } /* background slideshow */ .slideshow-bg { position: relative; } .slideshow-bg #slideshow { position: absolute; left: 0; top: 0; bottom: 0; width: 100%; margin: 0; padding: 0; } .slideshow-bg .flexslider { height: 100%; border: none; box-shadow: none; } .slideshow-bg .flexslider .slides, .slideshow-bg .flexslider .slides > li { height: 100%; } .slideshow-bg .flexslider .slidebg { position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-position: center center; background-repeat: no-repeat; background-size: cover; -moz-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; -webkit-transition: all 0.5s ease-out; -ms-transition: all 0.5s ease-out; transition: all 0.5s ease-out; } .slideshow-bg #main { position: relative; z-index: 2; } .slideshow-bg .custom-select, .slideshow-bg .input-text { -webkit-backface-visibility: hidden; } /* 3.3. Page Title ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .page-title-container { height: 56px; background: #2d3e52; } .page-title-container .page-title .entry-title { line-height: 56px; color: #fff; margin: 0; } .page-title-container .breadcrumbs { height: 100%; } .page-title-container .breadcrumbs li { float: left; line-height: 56px; display: inline; margin-left: 5px; font-size: 0.8333em; font-weight: bold; text-transform: uppercase; } .page-title-container .breadcrumbs li a { padding-right: 5px; color: #fff; } .page-title-container .breadcrumbs li a:hover { color: #01b7f2; } .page-title-container .breadcrumbs li:after { content: "/"; color: #5a7ca3; } .page-title-container .breadcrumbs li:last-child:after { content: ""; } .page-title-container .breadcrumbs li.active { color: #fdb714; } .page-title-container.style1 { background: #dbdbdb; height: 66px; line-height: 66px; text-align: right; } .page-title-container.style1 .page-title .entry-title { color: inherit; font-style: italic; line-height: 66px; } .page-title-container.style1 button { padding-left: 10px; padding-right: 10px; } .page-title-container.style1 .container { position: relative; } .page-title-container.style1 .container:before { content: ""; display: block; width: 0; height: 0; position: absolute; z-index: 1; left: 0; top: 0; border-top: 5px solid #fff; border-left: 6px solid transparent; border-right: 6px solid transparent; } .page-title-container.style2 { background: url("http://placehold.it/2080x87") no-repeat center top #dbdbdb; height: 86px; line-height: 86px; text-align: right; } .page-title-container.style2 .page-title { float: left; } .page-title-container.style2 .page-title .entry-title { color: #fff; line-height: 86px; font-weight: bold; } .page-title-container.style2 .breadcrumbs { float: right; background: #e5f8fa; margin-top: 28px; padding: 0 15px; } .page-title-container.style2 .breadcrumbs li.active { color: #01b7f2; } .page-title-container.style2 .breadcrumbs li { line-height: 30px; } .page-title-container.style2 .breadcrumbs li a { color: inherit; font-weight: normal; } .page-title-container.style2 .page-title, .page-title-container.style2 .breadcrumbs { position: relative; } .page-title-container.style2 .page-title:after { position: absolute; content: ""; width: 59px; height: 39px; top: 10px; right: -100px; background: url("http://placehold.it/59x39") no-repeat; } .page-title-container.style2 .breadcrumbs:before { position: absolute; content: ""; width: 131px; height: 71px; bottom: -28px; left: -135px; background: url("http://placehold.it/131x71") no-repeat; } .page-title-container.style3 { background: #2d3e52; height: auto; padding: 25px 0 10px; } .page-title-container.style3 form label { font-size: 0.8333em; color: #7c9abd; } .page-title-container.style4 { background: #fdb714; height: 60px; line-height: 60px; text-align: right; overflow: hidden; } .page-title-container.style4 .page-title .entry-title { color: inherit; font-style: italic; line-height: 60px; } .page-title-container.style4 .page-title { float: left; background: #fdb714; padding-right: 20px; position: relative; } .page-title-container.style4 .page-title:after { display: block; content: ""; position: absolute; right: -20px; top: 0; width: 0; height: 0; border-left: 20px solid #fdb714; border-top: 30px solid transparent; border-bottom: 30px solid transparent; } .page-title-container.style4 .page-title i { float: left; font-size: 24px; line-height: 60px; margin-right: 20px; color: #df9207; } .page-title-container.style4 .page-title .entry-title { white-space: nowrap; color: #fff; font-style: normal; font-weight: normal; float: left; } .page-title-container.style4 .container { background: #efa300; position: relative; } .page-title-container.style4 .container:before { position: absolute; content: ""; display: block; right: -100%; top: 0; height: 60px; width: 100%; background: #efa300; } .page-title-container.style4 .breadcrumbs { float: right; } .page-title-container.style4 .breadcrumbs li { line-height: 60px; } .page-title-container.style4 .breadcrumbs li a { color: #ffce5c; } .page-title-container.style4 .breadcrumbs li:before { font-family: "soap-icons"; content: '\e86f'; font-weight: bold; display: inline-block; -webkit-border-radius: 50% 50% 50% 50%; -moz-border-radius: 50% 50% 50% 50%; -ms-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; color: #ffce5c; border: 1px solid; line-height: 12px; text-align: center; height: 14px; width: 14px; margin-right: 8px; } .page-title-container.style4 .breadcrumbs li:after { content: ""; } .page-title-container.style4 .breadcrumbs li.active, .page-title-container.style4 .breadcrumbs li.active:before, .page-title-container.style4 .breadcrumbs li:hover:before, .page-title-container.style4 .breadcrumbs li:hover a { color: #fff; } .page-title-container.style5 { background: #94e2fb; height: 86px; line-height: 86px; } .page-title-container.style5 .page-title { float: left; margin-right: 25px; } .page-title-container.style5 .page-title .entry-title { color: #fff; line-height: 86px; font-size: 2.5em; } .page-title-container.style5 .breadcrumbs { float: left; } .page-title-container.style5 .breadcrumbs li { line-height: 86px; } .page-title-container.style5 .breadcrumbs li a { color: #01b7f2; } .page-title-container.style5 .breadcrumbs li:before { font-family: "soap-icons"; content: '\e86f'; font-weight: bold; display: inline-block; -webkit-border-radius: 50% 50% 50% 50%; -moz-border-radius: 50% 50% 50% 50%; -ms-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; color: #01b7f2; border: 1px solid; line-height: 12px; text-align: center; height: 14px; width: 14px; margin-right: 8px; } .page-title-container.style5 .breadcrumbs li:after { content: ""; } .page-title-container.style5 .breadcrumbs li.active, .page-title-container.style5 .breadcrumbs li.active:before, .page-title-container.style5 .breadcrumbs li:hover:before, .page-title-container.style5 .breadcrumbs li:hover a { color: #fff; } .page-title-container.style5 .breadcrumbs:before { float: left; content: "|"; font-size: 2.5em; font-weight: 300; color: #c6f1ff; margin-right: 25px; } .page-title-container.style5 .social-icons { float: right; margin-top: 27px; } .page-title-container.style5 .social-icons li { line-height: normal; } .page-title-container.style5 .social-icons a { background: none; overflow: hidden; } .page-title-container.style5 .social-icons a:hover { border: 1px solid #fff; -webkit-border-radius: 50% 50% 50% 50%; -moz-border-radius: 50% 50% 50% 50%; -ms-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; background: none; } .page-title-container.style5 .social-icons a:hover i { color: #fff; display: block; -webkit-animation: toBottomFromTop 0.3s forwards; -moz-animation: toBottomFromTop 0.3s forwards; animation: toBottomFromTop 0.3s forwards; } .page-title-container.style5 .social-icons a i { color: #01b7f2; } .page-title-container.style6 { background: #dbdbdb; height: 86px; line-height: 86px; } .page-title-container.style6 .page-title { float: left; margin-right: 25px; font-style: italic; } .page-title-container.style6 .page-title .entry-title { color: #838383; line-height: 86px; font-size: 2.5em; } .page-title-container.style6 .breadcrumbs { float: left; } .page-title-container.style6 .breadcrumbs li { line-height: 86px; } .page-title-container.style6 .breadcrumbs li a { color: #f5f5f5; } .page-title-container.style6 .breadcrumbs li:before { font-family: "soap-icons"; content: '\e86f'; font-weight: bold; display: inline-block; -webkit-border-radius: 50% 50% 50% 50%; -moz-border-radius: 50% 50% 50% 50%; -ms-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; color: #f5f5f5; border: 1px solid; line-height: 12px; text-align: center; height: 14px; width: 14px; margin-right: 8px; } .page-title-container.style6 .breadcrumbs li:after { content: ""; } .page-title-container.style6 .breadcrumbs li.active, .page-title-container.style6 .breadcrumbs li.active:before, .page-title-container.style6 .breadcrumbs li:hover:before, .page-title-container.style6 .breadcrumbs li:hover a { color: inherit; } .page-title-container.style6 .breadcrumbs:before { float: left; content: "|"; font-size: 2.5em; font-weight: 300; color: #f5f5f5; margin-right: 25px; } .page-title-container.style6 .search-box { padding: 25px 0 0; float: right; margin: 0; line-height: normal; } .page-title-container.style6 .search-box .input-text { background: #f5f5f5; font-size: 0.8333em; letter-spacing: 0.04em; text-transform: uppercase; } /* 3.4. Word Map Section ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .world-map-section { height: 750px; } .marker-holder { position: absolute; width: 10px; height: 10px; left: 0; } .marker-holder .image-box { position: absolute; width: 405px; padding: 5px; margin: 0; background: #fff; bottom: 0; left: 0; font-family: "Lato", Arial, Helvetica, sans-serif; } .marker-holder .image-box figure { width: 135px; height: 135px; float: left; } .marker-holder .image-box figure img { height: 100%; } .marker-holder .image-box .details { margin-left: 150px; padding-top: 5px; } .marker-holder .image-box .details .title img { padding-top: 5px; margin-right: 3px; } .marker-holder .image-box .details i { font-size: 2.1667em; color: #d9d9d9; } .marker-holder .image-box .details .price { font-size: 1.3333em; } .marker-holder .image-box .details .price small { font-size: 0.625em; line-height: 1.3333em; } .marker-holder .image-box .details .table-wrapper { width: 100%; table-layout: fixed; } .marker-holder .image-box .details .table-cell { padding: 10px 20px 10px 10px; border-top: 1px solid #f5f5f5; } .marker-holder .image-box .details .table-cell:first-child { border-right: 1px solid #f5f5f5; } .marker-holder .image-box:after { content: ""; position: absolute; left: 180px; bottom: -25px; display: block; width: 0; height: 0; border-width: 25px 25px 0; border-style: solid; border-color: #fff transparent; } /* 4. Search Form ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ /* 4.1. Default Style ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .search-box-wrapper { background: #fff; } .search-box { margin-top: -80px; position: relative; z-index: 99; } ul.search-tabs { margin: 0; padding: 0; } ul.search-tabs li { float: left; padding-right: 4px; } ul.search-tabs li a { color: #333; display: block; padding: 0 30px; background: #fff; font-size: 1em; font-weight: bold; height: 40px; line-height: 40px; text-decoration: none; filter: alpha(opacity=40); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)"; -moz-opacity: 0.4; -khtml-opacity: 0.4; opacity: 0.4; letter-spacing: 0.04em; text-transform: uppercase; } ul.search-tabs li a:hover { filter: alpha(opacity=70); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; -moz-opacity: 0.7; -khtml-opacity: 0.7; opacity: 0.7; } ul.search-tabs li.active a { filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; color: #01b7f2; } .visible-mobile .search-tabs li { float: none; } .visible-mobile .search-tabs li a { color: #01b7f2; filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; padding: 0 80px; text-align: center; } .visible-mobile .search-tabs li a:hover { filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; } .search-tab-content { padding: 30px 0; } .search-tab-content .tab-pane { display: none; } .search-tab-content .tab-pane.active { display: block; } .search-tab-content h4.title { margin: 10px 0; height: 20px; } .search-tab-content .fixheight { padding-top: 40px; } /* search box for mobile */ .search-box #mobile-search-tabs > li { display: none; } .search-box .bx-wrapper .bx-viewport { box-shadow: none; border: none; left: 0; } .search-box .bx-wrapper .bx-prev, .search-box .bx-wrapper .bx-next { background: #01b7f2; font-family: FontAwesome; } .search-box .bx-wrapper .bx-controls-direction a { width: 30px; height: 22px; margin-top: -11px; } .search-box .bx-wrapper .bx-controls-direction a.disabled { display: block; background: #d9d9d9; } .search-box .bx-wrapper .bx-prev:before, .search-box .bx-wrapper .bx-next:before { display: block; position: absolute; text-indent: 0; line-height: 20px; text-align: center; width: 30px; color: #fff; } .search-box .bx-wrapper .bx-prev:before:hover, .search-box .bx-wrapper .bx-next:before:hover { color: white; } .search-box .bx-wrapper .bx-prev:before { content: "\f177"; } .search-box .bx-wrapper .bx-next:before { content: "\f178"; } /* 4.2. Style1 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .search-box-wrapper.style1 { background: none; } .search-box-wrapper.style1 .search-box { margin: 0; } .search-box-wrapper.style1 .search-box > ul.search-tabs { margin-top: 80px; float: left; width: 31%; } .search-box-wrapper.style1 .search-box > ul.search-tabs li { float: none; margin-right: 0; padding-right: 0; } .search-box-wrapper.style1 .search-box > ul.search-tabs li > a { filter: alpha(opacity=65); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=65)"; -moz-opacity: 0.65; -khtml-opacity: 0.65; opacity: 0.65; height: 57px; line-height: 57px; border-bottom: 1px solid #0d9dec; border-right: 1px solid #0d9dec; position: relative; padding-left: 50px; overflow: hidden; } .search-box-wrapper.style1 .search-box > ul.search-tabs li > a:hover { filter: alpha(opacity=85); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)"; -moz-opacity: 0.85; -khtml-opacity: 0.85; opacity: 0.85; } .search-box-wrapper.style1 .search-box > ul.search-tabs li > a:hover i { -webkit-animation: toTopFromBottom 0.3s forwards; -moz-animation: toTopFromBottom 0.3s forwards; animation: toTopFromBottom 0.3s forwards; } .search-box-wrapper.style1 .search-box > ul.search-tabs li > a > i { position: absolute; left: 15px; font-size: 24px; } .search-box-wrapper.style1 .search-box > ul.search-tabs li.active > a { border-right-color: #fff; filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; } .search-box-wrapper.style1 .search-box > ul.search-tabs li.active > a > i { color: #fdb714; } .search-box-wrapper.style1 .search-box > ul.search-tabs li.active > a:after { content: "\e88b"; font-family: "soap-icons"; position: absolute; right: 15px; color: #01b7f2; font-size: 20px; } .search-box-wrapper.style1 .search-box > ul.search-tabs li:last-child > a { border-bottom: none; } .search-box-wrapper.style1 .search-tab-content { background: #fff; float: left; width: 69%; padding: 0; } .search-box-wrapper.style1 .search-tab-content .title-container { background: #fdb714; padding: 15px 40px 0 25px; height: 80px; position: relative; } .search-box-wrapper.style1 .search-tab-content .title-container > i { font-size: 48px; position: absolute; right: 25px; top: 50%; margin-top: -24px; } .search-box-wrapper.style1 .search-tab-content .title-container * { color: #fff; } .search-box-wrapper.style1 .search-tab-content .title-container .search-title { margin: 0; font-weight: bold; } .search-box-wrapper.style1 .search-tab-content .search-content { padding: 18px 25px 25px; } .search-box-wrapper.style1 .search-tab-content .search-content .choose-travel label.radio { color: #2d3e52; font-size: inherit; } .search-box-wrapper.style1 .search-tab-content .search-content .choose-travel > div { margin-bottom: 0; } .search-box-wrapper.style1 .search-tab-content .search-content label { font-size: 0.8333em; } /* 4.3. Style2 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .search-box-wrapper.style2 { background: none; } .search-box-wrapper.style2 .search-box { margin: 0 auto; background: rgba(0, 0, 0, 0.5); padding: 5px; } .search-box-wrapper.style2 .search-box > ul.search-tabs { display: table; width: 100%; } .search-box-wrapper.style2 .search-box > ul.search-tabs li { padding-right: 5px; display: table-cell; float: none; } .search-box-wrapper.style2 .search-box > ul.search-tabs li:last-child { padding-right: 0; } .search-box-wrapper.style2 .search-box > ul.search-tabs li > a { /*margin-bottom: 5px;*/ height: 35px; line-height: 35px; background: #01b7f2; filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; color: #fff; padding: 0; text-align: center; overflow: hidden; } .search-box-wrapper.style2 .search-box > ul.search-tabs li > a i { font-size: 1.6666em; vertical-align: middle; margin-right: 10px; line-height: 0; } .search-box-wrapper.style2 .search-box > ul.search-tabs li > a span { vertical-align: middle; } .search-box-wrapper.style2 .search-box > ul.search-tabs li > a:hover i:before { -webkit-animation: toTopFromBottom 0.35s forwards; -moz-animation: toTopFromBottom 0.35s forwards; animation: toTopFromBottom 0.35s forwards; } .search-box-wrapper.style2 .search-box > ul.search-tabs li.advanced-search > a { background: #fdb714; } .search-box-wrapper.style2 .search-box > ul.search-tabs li.active > a { margin-bottom: 0; height: 40px; background: #fff; color: #01b7f2; } .search-box-wrapper.style2 .search-tab-content { background: #fff; padding: 20px; } .search-box-wrapper.style2 .search-tab-content .tab-pane [class^="col-"], .search-box-wrapper.style2 .search-tab-content .tab-pane [class*=" col-"] { padding-left: 5px; padding-right: 5px; } .search-box-wrapper.style2 .search-tab-content .tab-pane .row { margin-left: -5px; margin-right: -5px; } .search-box-wrapper.style2 .search-tab-content input.input-text, .search-box-wrapper.style2 .search-tab-content select, .search-box-wrapper.style2 .search-tab-content textarea, .search-box-wrapper.style2 .search-tab-content span.custom-select { background: #fff; border: 1px solid #d1d1d1; } .search-box-wrapper.style2 .search-tab-content .selector span.custom-select:before { background: #d1d1d1; } .search-box-wrapper.style2 .search-tab-content .datepicker-wrap:after { background: transparent; color: #d1d1d1; } .search-box-wrapper.style2 .search-tab-content button { font-size: 1.1667em; font-weight: bold; } /* 4.4. Map Search ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .search-box-wrapper .main-search-box { padding: 20px 0 10px; } .search-box-wrapper .main-search-box .row { margin: 0; } .search-box-wrapper .main-search-box .row > div { padding: 0; } .search-box-wrapper .main-search-box .title { line-height: 43px; margin: 0; } .search-box-wrapper .main-search-box button { font-size: 1em; } /* 5. Search Results ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ /* 5.1. Hotel ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ /* 5.1.1. Sort by */ .sort-by-section { background: #fff; padding: 0 20px; } .sort-by-section li { float: left; padding: 15px 5px; /*&:first-child { padding-left: 0; } &:last-child { padding-right: 0; }*/ } .sort-by-section .sort-by-title { margin: 15px 20px 0 0; line-height: 34px; float: left; } .sort-by-section .sort-bar { float: left; } .sort-by-section .sort-bar .sort-by-container { position: relative; display: block; } .sort-by-section .sort-bar .sort-by-container > span { background: #f5f5f5; height: 34px; padding: 0 45px 0 15px; line-height: 34px; display: block; color: #9e9e9e; } .sort-by-section .sort-bar .sort-by-container > span:after { position: absolute; right: 0; top: 0; bottom: 0; height: 100%; width: 30px; background: #d9d9d9; content: ""; } .sort-by-section .sort-bar .sort-by-container:before, .sort-by-section .sort-bar .sort-by-container:after { content: ""; position: absolute; z-index: 1; display: block; top: 50%; right: 12px; border-left: 3px solid transparent; border-right: 3px solid transparent; } .sort-by-section .sort-bar .sort-by-container:before { margin-top: -6px; border-bottom: 5px solid #fff; } .sort-by-section .sort-bar .sort-by-container:after { margin-top: 2px; border-top: 5px solid #fff; } .sort-by-section .sort-bar li.active .sort-by-container > span:after { background: #fdb714; } .sort-by-section .swap-tiles { float: right; font-size: 33px; } .sort-by-section .swap-tiles li > a > i { display: block; width: 34px; line-height: 34px; height: 34px; background: #f5f5f5; color: #d9d9d9; text-align: center; } .sort-by-section .swap-tiles li:hover > a > i, .sort-by-section .swap-tiles li.active > a > i { background: #01b7f2; color: #fff; } .sort-by-section .swap-tiles li.swap-list > a > i { font-size: 30px; } /* 5.1.2. Filters */ .filters-container.toggle-container { background: none; } .filters-container.toggle-container .panel.style1 { border: none; margin-bottom: 4px; background: #fff; } .filters-container.toggle-container .panel.style1 .panel-title { padding-left: 5px; } .filters-container.toggle-container .panel.style1 .panel-content { padding: 10px 20px 20px; } .search-results-title { background: #fff; padding: 0 20px; margin: 0; border-bottom: 4px solid #f5f5f5; line-height: 3em; } .search-results-title > i { color: #fdb714; font-size: 20px; margin-right: 10px; } .filters-container .reviews { margin: 0; letter-spacing: 0.04em; } .filters-container ul.filters-option { margin-bottom: 10px; } .filters-container ul.filters-option li { margin-bottom: 1px; background: #f5f5f5; padding: 0 15px; } .filters-container ul.filters-option li a { color: inherit; display: block; padding: 8px 0; text-transform: uppercase; font-size: 11px; } .filters-container ul.filters-option li small { float: right; } .filters-container ul.filters-option li:before { float: left; width: 15px; height: 16px; display: block; line-height: 14px; text-align: center; margin-top: 12px; } .filters-container ul.filters-option li:after { display: table; clear: both; content: ""; } .filters-container ul.filters-option li.active { background: #01b7f2; } .filters-container ul.filters-option li.active a { color: #fff; } .hotel-list { margin-top: 30px; } /* 5.1.3. Detailed */ .detailed-logo { background: #fff; padding: 15px; } .detailed-logo figure { background: #f5f5f5; text-align: center; padding: 20px 0; } .detailed-logo figure img { max-width: 100%; height: auto; width: auto; } .detailed-logo .box-title, .detailed-logo .price, .detailed-logo .feedback { border-bottom: 1px solid #f5f5f5; } .detailed-logo .box-title { margin-top: 15px; padding-bottom: 10px; letter-spacing: normal; } .detailed-logo .box-title > small { line-height: 1.5em; letter-spacing: 0.04em; font-size: 10px; } .detailed-logo .box-title > small > i { font-size: 1.5em; display: block; float: left; margin-right: 3px; } .detailed-logo .price { float: none; display: block; line-height: 1.75em; } .detailed-logo .feedback { padding: 8px 0 2px; color: #9E9E9E; text-transform: uppercase; font-size: 0.8333em; margin-bottom: 10px; } /* 5.1.4. Hotel main content, Flight main content */ #hotel-main-content .tab-content .tab-pane, #flight-main-content .tab-content .tab-pane, #cruise-main-content .tab-content .tab-pane { padding: 0; } #hotel-main-content #calendar-tab, #flight-main-content #calendar-tab, #cruise-main-content #calendar-tab { background: #2d3e52; padding: 20px 30px; } #hotel-main-content #calendar-tab label, #hotel-main-content #calendar-tab p, #flight-main-content #calendar-tab label, #flight-main-content #calendar-tab p, #cruise-main-content #calendar-tab label, #cruise-main-content #calendar-tab p { color: #7c9abd; } #hotel-main-content #calendar-tab .description, #flight-main-content #calendar-tab .description, #cruise-main-content #calendar-tab .description { padding-top: 30px; } #hotel-main-content #calendar-tab .row, #flight-main-content #calendar-tab .row, #cruise-main-content #calendar-tab .row { border: none; } #hotel-main-content .calendar table, #flight-main-content .calendar table, #cruise-main-content .calendar table { width: 100%; table-layout: fixed; margin-top: 20px; } #hotel-main-content .calendar table thead td, #flight-main-content .calendar table thead td, #cruise-main-content .calendar table thead td { text-align: center; color: #fdb714; text-transform: uppercase; font-size: 0.8333em; text-indent: -5px; line-height: 3em; } #hotel-main-content .calendar table tbody td, #flight-main-content .calendar table tbody td, #cruise-main-content .calendar table tbody td { padding: 0 5px 5px 0; text-align: right; position: relative; } #hotel-main-content .calendar table tbody td > a, #hotel-main-content .calendar table tbody td > span, #flight-main-content .calendar table tbody td > a, #flight-main-content .calendar table tbody td > span, #cruise-main-content .calendar table tbody td > a, #cruise-main-content .calendar table tbody td > span { border: 1px solid #da6161; display: block; color: #da6161; padding: 5px; line-height: 1em; height: 4.6666em; font-size: 1.1667em; position: relative; } #hotel-main-content .calendar table tbody td > a:before, #hotel-main-content .calendar table tbody td > span:before, #flight-main-content .calendar table tbody td > a:before, #flight-main-content .calendar table tbody td > span:before, #cruise-main-content .calendar table tbody td > a:before, #cruise-main-content .calendar table tbody td > span:before { position: absolute; left: 0; top: 0; bottom: 0; right: 0; content: "NOT AVAILABLE"; background: #da6161; font-size: 10px; text-align: center; z-index: 1; line-height: 1; padding: 2.2em 5px 5px; color: #fff; display: none; cursor: default; } #hotel-main-content .calendar table tbody td > a:hover:before, #hotel-main-content .calendar table tbody td > span:hover:before, #flight-main-content .calendar table tbody td > a:hover:before, #flight-main-content .calendar table tbody td > span:hover:before, #cruise-main-content .calendar table tbody td > a:hover:before, #cruise-main-content .calendar table tbody td > span:hover:before { display: block; } #hotel-main-content .calendar table tbody td.available > a, #hotel-main-content .calendar table tbody td.available > span, #flight-main-content .calendar table tbody td.available > a, #flight-main-content .calendar table tbody td.available > span, #cruise-main-content .calendar table tbody td.available > a, #cruise-main-content .calendar table tbody td.available > span { border-color: #98ce44; color: #98ce44; } #hotel-main-content .calendar table tbody td.available > a:before, #hotel-main-content .calendar table tbody td.available > span:before, #flight-main-content .calendar table tbody td.available > a:before, #flight-main-content .calendar table tbody td.available > span:before, #cruise-main-content .calendar table tbody td.available > a:before, #cruise-main-content .calendar table tbody td.available > span:before { background: #98ce44; content: "BOOK FROM"; cursor: pointer; } #hotel-main-content .calendar table tbody td.date-passed > a, #hotel-main-content .calendar table tbody td.date-passed > span, #flight-main-content .calendar table tbody td.date-passed > a, #flight-main-content .calendar table tbody td.date-passed > span, #cruise-main-content .calendar table tbody td.date-passed > a, #cruise-main-content .calendar table tbody td.date-passed > span { border-color: #01b7f2; color: #01b7f2; } #hotel-main-content .calendar table tbody td.date-passed > a:before, #hotel-main-content .calendar table tbody td.date-passed > span:before, #flight-main-content .calendar table tbody td.date-passed > a:before, #flight-main-content .calendar table tbody td.date-passed > span:before, #cruise-main-content .calendar table tbody td.date-passed > a:before, #cruise-main-content .calendar table tbody td.date-passed > span:before { background: #01b7f2; content: "DATE PASSED"; } #hotel-main-content .calendar table tbody td .price-text, #flight-main-content .calendar table tbody td .price-text, #cruise-main-content .calendar table tbody td .price-text { position: absolute; bottom: 5px; right: 5px; color: #fff; font-size: 0.8571em; } #hotel-main-content .calendar-legend, #flight-main-content .calendar-legend, #cruise-main-content .calendar-legend { margin-top: 15px; } #hotel-main-content .calendar-legend label, #flight-main-content .calendar-legend label, #cruise-main-content .calendar-legend label { text-transform: uppercase; font-weight: normal; letter-spacing: 0.04em; line-height: 15px; color: #fff !important; margin-right: 15px; font-size: 0.9167em; } #hotel-main-content .calendar-legend label:before, #flight-main-content .calendar-legend label:before, #cruise-main-content .calendar-legend label:before { content: ""; display: block; float: left; width: 15px; height: 15px; border: 1px solid; margin-right: 4px; } #hotel-main-content .calendar-legend label.available:before, #flight-main-content .calendar-legend label.available:before, #cruise-main-content .calendar-legend label.available:before { border-color: #98ce44; } #hotel-main-content .calendar-legend label.unavailable:before, #flight-main-content .calendar-legend label.unavailable:before, #cruise-main-content .calendar-legend label.unavailable:before { border-color: #da6161; } #hotel-main-content .calendar-legend label.past:before, #flight-main-content .calendar-legend label.past:before, #cruise-main-content .calendar-legend label.past:before { border-color: #01b7f2; } #hotel-description .intro, #hotel-reviews .intro, #hotel-write-review .intro, #car-details .intro, #flight-details .intro, #cruise-description .intro, #cruise-reviews .intro, #cruise-write-review .intro, #travel-guide .intro, #tour-details .intro { background: #f5f5f5; } #hotel-description .intro.table-wrapper, #hotel-reviews .intro.table-wrapper, #hotel-write-review .intro.table-wrapper, #car-details .intro.table-wrapper, #flight-details .intro.table-wrapper, #cruise-description .intro.table-wrapper, #cruise-reviews .intro.table-wrapper, #cruise-write-review .intro.table-wrapper, #travel-guide .intro.table-wrapper, #tour-details .intro.table-wrapper { padding: 0; border-spacing: 15px; border-collapse: separate; table-layout: fixed; } #hotel-description .intro.table-wrapper > *, #hotel-reviews .intro.table-wrapper > *, #hotel-write-review .intro.table-wrapper > *, #car-details .intro.table-wrapper > *, #flight-details .intro.table-wrapper > *, #cruise-description .intro.table-wrapper > *, #cruise-reviews .intro.table-wrapper > *, #cruise-write-review .intro.table-wrapper > *, #travel-guide .intro.table-wrapper > *, #tour-details .intro.table-wrapper > * { border-collapse: collapse; } #hotel-description .intro.table-wrapper .table-cell, #hotel-reviews .intro.table-wrapper .table-cell, #hotel-write-review .intro.table-wrapper .table-cell, #car-details .intro.table-wrapper .table-cell, #flight-details .intro.table-wrapper .table-cell, #cruise-description .intro.table-wrapper .table-cell, #cruise-reviews .intro.table-wrapper .table-cell, #cruise-write-review .intro.table-wrapper .table-cell, #travel-guide .intro.table-wrapper .table-cell, #tour-details .intro.table-wrapper .table-cell { background: #fff; } #hotel-description .intro.table-wrapper .table-cell:first-child, #hotel-reviews .intro.table-wrapper .table-cell:first-child, #hotel-write-review .intro.table-wrapper .table-cell:first-child, #car-details .intro.table-wrapper .table-cell:first-child, #flight-details .intro.table-wrapper .table-cell:first-child, #cruise-description .intro.table-wrapper .table-cell:first-child, #cruise-reviews .intro.table-wrapper .table-cell:first-child, #cruise-write-review .intro.table-wrapper .table-cell:first-child, #travel-guide .intro.table-wrapper .table-cell:first-child, #tour-details .intro.table-wrapper .table-cell:first-child { margin-bottom: 15px; } #hotel-description .intro.table-wrapper .table-cell:last-child, #hotel-reviews .intro.table-wrapper .table-cell:last-child, #hotel-write-review .intro.table-wrapper .table-cell:last-child, #car-details .intro.table-wrapper .table-cell:last-child, #flight-details .intro.table-wrapper .table-cell:last-child, #cruise-description .intro.table-wrapper .table-cell:last-child, #cruise-reviews .intro.table-wrapper .table-cell:last-child, #cruise-write-review .intro.table-wrapper .table-cell:last-child, #travel-guide .intro.table-wrapper .table-cell:last-child, #tour-details .intro.table-wrapper .table-cell:last-child { padding-left: 0; padding-right: 0; } #hotel-features, #cruise-features { margin-top: 30px; } #hotel-description .features, #cruise-description .features, #travel-guide .features { text-transform: uppercase; padding: 25px 20px; font-size: 0.8333em; } #hotel-description .features li, #cruise-description .features li, #travel-guide .features li { line-height: 2em; } #hotel-description .features label, #cruise-description .features label, #travel-guide .features label { margin: 0; width: 110px; border-right: 1px solid #f5f5f5; margin-right: 20px; color: #01b7f2; white-space: nowrap; } #hotel-description .long-description, #cruise-description .long-description, #travel-guide .long-description { margin-top: 25px; padding: 0 15px; } #hotel-availability .update-search, #cruise-availability .update-search { border: 15px solid #f5f5f5; background: #fff; padding: 20px 20px 0; margin-bottom: 20px; } #hotel-availability .update-search [class^="col-"], #hotel-availability .update-search [class*=" col-"], #cruise-availability .update-search [class^="col-"], #cruise-availability .update-search [class*=" col-"] { padding-left: 5px; padding-right: 5px; /*&:first-child { padding-left: 0; } &:last-child { padding-right: 0; }*/ } #hotel-availability .update-search .row, #cruise-availability .update-search .row { margin-left: -5px; margin-right: -5px; } #hotel-availability .update-search > div, #cruise-availability .update-search > div { margin-bottom: 20px; } #hotel-availability .room-list > article, #cruise-availability .room-list > article { margin: 20px 0 0; padding-bottom: 20px; border-bottom: 1px solid #f5f5f5; } #hotel-availability .room-list > article:last-child, #cruise-availability .room-list > article:last-child { border-bottom: none; } #hotel-availability .room-list .load-more button, #cruise-availability .room-list .load-more button { font-size: 1.3333em; } #hotel-availability .room-list .box .price-section, #hotel-availability .room-list .box .action-section, #cruise-availability .room-list .box .price-section, #cruise-availability .room-list .box .action-section { padding-right: 0; } #hotel-availability .room-list .box .price-section, #cruise-availability .room-list .box .price-section { border-bottom: none; } #hotel-availability .room-list .box .action-section, #cruise-availability .room-list .box .action-section { vertical-align: bottom; } #hotel-availability .room-list .box .action-section a.button, #cruise-availability .room-list .box .action-section a.button { padding: 0 20px; } #hotel-amenities .amenities li, #inflight-features .amenities li, #cruise-amenities .amenities li { padding: 0; } #hotel-amenities .amenities.style1 li, #inflight-features .amenities.style1 li, #cruise-amenities .amenities.style1 li { margin-bottom: 1px; } #hotel-amenities .amenities.style1 li .icon-box, #inflight-features .amenities.style1 li .icon-box, #cruise-amenities .amenities.style1 li .icon-box { background: #f5f5f5; } #hotel-amenities .amenities.style2 li, #inflight-features .amenities.style2 li, #cruise-amenities .amenities.style2 li { margin-bottom: 20px; } #hotel-reviews .rating, #cruise-reviews .rating { padding: 20px 30px; background: #fff; text-align: center; } #hotel-reviews .rating .score, #cruise-reviews .rating .score { display: block; font-size: 5em; color: #2d3e52; font-weight: 300; line-height: 1.25em; } #hotel-reviews .rating .five-stars-container, #cruise-reviews .rating .five-stars-container { font-size: 2.5em; margin-bottom: 20px; } #hotel-reviews .detailed-rating, #cruise-reviews .detailed-rating { background: #fff; padding: 30px 0; } #hotel-reviews .detailed-rating li, #cruise-reviews .detailed-rating li { padding: 0 25px; } #hotel-reviews .guest-reviews, #cruise-reviews .guest-reviews { margin-top: 25px; margin-bottom: 30px; } #hotel-reviews .guest-reviews .comment-container, #cruise-reviews .guest-reviews .comment-container { padding-left: 20px; } #hotel-faqs .topics, #flight-fare-rules .topics { margin-bottom: 30px; } #hotel-faqs .topics li, #flight-fare-rules .topics li { padding: 0; margin-bottom: 1px; border-right: 1px solid #fff; background: #f5f5f5; padding-left: 15px; line-height: 3.3333em; text-transform: uppercase; font-size: 0.9167em; } #hotel-faqs .topics li a, #flight-fare-rules .topics li a { color: inherit; } #hotel-faqs .topics li.active, #flight-fare-rules .topics li.active { background: #01b7f2; } .image-box.style2.activities .details { padding-top: 10px; } .image-box.style2.activities.innerstyle { margin-top: 20px; } .image-box.style2.activities.innerstyle .details { padding-right: 0; } .image-box.style2.activities .review-score { float: right; text-transform: uppercase; } .image-box.style2.activities .review-score .reviews { font-size: 0.8333em; } .image-box.style2.activities .five-stars-container { float: left; margin-right: 10px; } .image-box.style2.activities .details-header { border-bottom: 1px solid #f5f5f5; margin-bottom: 15px; } .image-box.style2.activities > * { padding-bottom: 15px; border-bottom: 1px solid #f5f5f5; margin-bottom: 20px; } .image-box.style2.activities > *:last-child { border-bottom: none; padding-bottom: 0; } .image-box.style2.activities.no-bottom-border > * { padding-bottom: 0; border-bottom: none; margin-bottom: 30px; } #hotel-write-review .photo, #cruise-write-review .photo { padding: 0; } #hotel-write-review .photo .feedback, #cruise-write-review .photo .feedback { margin-top: 40px; } #hotel-write-review .photo .details, #cruise-write-review .photo .details { padding-right: 15px; } #hotel-write-review .photo .details .review, #cruise-write-review .photo .details .review { letter-spacing: 0.04em; } #hotel-write-review .overall-rating, #cruise-write-review .overall-rating { background: #fff; } #hotel-write-review .detailed-rating, #cruise-write-review .detailed-rating { margin-left: -20px; margin-right: -20px; } #hotel-write-review .detailed-rating li, #cruise-write-review .detailed-rating li { padding: 0 20px; } #hotel-write-review .detailed-rating li > .each-rating, #cruise-write-review .detailed-rating li > .each-rating { border-top: 1px solid #F5F5F5; border-bottom: none; } #hotel-write-review .main-rating, #cruise-write-review .main-rating { margin-bottom: 20px; } #hotel-write-review .review-form, #cruise-write-review .review-form { padding: 0 10px 10px; } #hotel-write-review .review-form h4, #cruise-write-review .review-form h4 { margin-bottom: 5px; } #hotel-write-review .review-form .form-group, #cruise-write-review .review-form .form-group { margin-bottom: 20px; } #hotel-write-review .sort-trip li, #cruise-write-review .sort-trip li { float: left; margin-right: 20px; text-align: center; } #hotel-write-review .sort-trip li > span, #cruise-write-review .sort-trip li > span { font-weight: 500; font-size: 1.1667em; margin-top: 10px; line-height: 2.5em; } #hotel-write-review .sort-trip li i, #cruise-write-review .sort-trip li i { display: block; width: 70px; height: 70px; line-height: 70px; font-size: 2.3333em; color: #dbdbdb; } #hotel-write-review .sort-trip li.active i, #cruise-write-review .sort-trip li.active i { background: #01b7f2; color: #fff; border-color: #01b7f2; } #hotel-write-review .sort-trip li.active > span, #cruise-write-review .sort-trip li.active > span { color: #01b7f2; } #hotel-write-review .sort-trip li:hover i, #cruise-write-review .sort-trip li:hover i { -webkit-animation: sonarEffect 1s ease-out; -moz-animation: sonarEffect 1s ease-out; animation: sonarEffect 1s ease-out; } .overall-rating { padding: 25px 30px; } .overall-rating .star-rating { margin-bottom: 20px; } .overall-rating .star-rating .five-stars-container { font-size: 3em; line-height: 1em; float: left; } .overall-rating .star-rating .status { text-transform: uppercase; display: block; float: left; line-height: 22px; height: 22px; background: #01b7f2; color: #fff; font-weight: bold; margin-top: 8px; position: relative; margin-left: 25px; padding: 0 15px 0 10px; } .overall-rating .star-rating .status:before { display: block; content: ""; border-right: 15px solid #01b7f2; border-top: 11px solid transparent; border-bottom: 11px solid transparent; position: absolute; top: 0; left: -15px; } .detailed-rating { text-transform: uppercase; } .detailed-rating li { display: block; } .detailed-rating li > .each-rating { border-bottom: 1px solid #f5f5f5; display: block; padding: 8px 0 5px; } .detailed-rating li label { color: #01b7f2; } .detailed-rating li .five-stars-container { float: right; color: #dbdbdb; } .guest-review { border-top: 1px solid #f5f5f5; } .guest-review:last-child { border-bottom: 1px solid #f5f5f5; } .guest-review .author { text-align: center; border-right: 1px solid #f5f5f5; padding-top: 25px; padding-bottom: 25px; } .guest-review .author > a { width: 74px; height: 74px; } .guest-review .author img { width: 100%; height: 100%; } .guest-review .author .name { color: #2d3e52; font-size: 1.0833em; margin-bottom: 0; } .guest-review .author .date { text-transform: uppercase; font-size: 0.8333em; } .guest-review .comment-container { padding-top: 25px; padding-bottom: 25px; } .guest-review .comment-container .comment-title { color: #01b7f2; float: left; font-style: italic; } .guest-review .comment-container .review-score { float: right; } .guest-review .comment-container .review-score .score { font-size: 2em; margin-left: 10px; } .guest-review .comment-container .comment-content p { line-height: 2em; } /* 5.1.5. Booking page */ .booking-section { padding: 20px 30px; } .booking-form label { font-size: 0.9167em; } .booking-form .checkbox label { font-size: 1.0833em; } .booking-form .form-group { margin-bottom: 0; } .booking-form .form-group > * { margin-bottom: 20px; } .booking-form .checkbox label { text-transform: none; } .booking-details figure > a:first-child { width: 75px; height: 75px; float: left; } .booking-details figure img { width: auto; height: 100%; } .booking-details figure .travel-title { margin-left: 90px; } .booking-details figure .travel-title .box-title { margin-bottom: 5px; } .booking-details figure .travel-title .box-title:after { display: none; } .booking-details .details { padding-left: 0; padding-right: 0; padding-top: 7px; } .booking-details .timing { font-size: 0.8333em; text-transform: uppercase; text-align: right; line-height: 1.3333em; border-bottom: 1px solid #f5f5f5; padding: 10px 0 5px; margin: 0; } .booking-details .timing .duration { font-weight: bold; color: #fdb714; } .booking-details .timing .duration > div { margin-top: 5px; } .booking-details .timing .check-out { text-align: left; } .booking-details .timing label, .booking-details .timing span { display: block; line-height: 1.42; letter-spacing: 0.04em; } .booking-details .timing label { color: #01b7f2; font-size: 1em; margin-bottom: 0; font-weight: normal; } .booking-details .timing i { font-size: 2em; } .booking-details .guest { border-bottom: 1px solid #f5f5f5; padding: 10px 0; } .booking-details .other-details { font-size: 0.8333em; margin-bottom: 0; text-align: right; text-transform: uppercase; } .booking-details .other-details dt, .booking-details .other-details dd { padding: 1.3em 0; border-top: 1px solid #f5f5f5; } .booking-details .other-details dt { float: left; text-align: left; margin: 0; color: #01b7f2; clear: both; } .booking-details .other-details .total-price { font-size: 1.5em; color: #2d3e52; text-transform: none; } .booking-details .other-details .total-price-value { color: #98ce44; font-size: 1.4em; } /* 5.1.6. Thankyou page */ .booking-information { padding: 20px 30px 30px; } .booking-information > .booking-confirmation > .icon { color: #fdb714; font-size: 1.5em; float: left; margin-right: 12px; margin-top: 4px; } .booking-information > .booking-confirmation > .message { float: left; } .booking-information > .booking-confirmation .main-message { color: #01b7f2; margin-bottom: 0; letter-spacing: 0.04em; } .booking-information > .booking-confirmation .print-button { float: right; } .booking-information > .booking-confirmation .print-button button { text-transform: uppercase; } .booking-information > .booking-confirmation p { margin-bottom: 0; } .booking-information .view-link { font-size: 1.1667em; } /* 5.2. Flight ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .flight-routes.image-box .box { margin-bottom: 10px; } .flight-routes .box { padding: 10px; } .flight-routes .box figure { height: 40px; width: 40px; background: #f5f5f5; display: table; } .flight-routes .box figure > a { display: table-cell; vertical-align: middle; text-align: center; } .flight-routes .box figure img { /*width: 70%;*/ max-width: 100%; } .flight-routes .box .details { padding: 5px 0 0; margin-left: 55px; } .flight-routes .box .button { margin: 12px 5px 0 0; } .flight-routes .box .box-title { margin-bottom: 0; } .flight-list { margin-bottom: 0; } .flight-booking-details .details { padding: 0; margin-top: 10px; border-top: 1px solid #f5f5f5; } .flight-detail-page .detailed-logo .duration { font-size: 0.8333em; text-transform: uppercase; letter-spacing: 0.04em; border-bottom: 1px solid #f5f5f5; padding: 6px 0; margin-bottom: 10px; } .flight-detail-page .detailed-logo .duration dl, .flight-detail-page .detailed-logo .duration dt, .flight-detail-page .detailed-logo .duration dd { display: inline-block; margin: 0; } .flight-detail-page .detailed-logo .duration dl { vertical-align: middle; } .flight-detail-page .detailed-logo .duration i { color: #fdb714; font-size: 20px; margin-right: 10px; line-height: 0; vertical-align: middle; } #flight-details .term-description, #car-details .term-description { margin: 0; font-size: 0.8333em; } #flight-details .term-description dt, #flight-details .term-description dd, #car-details .term-description dt, #car-details .term-description dd { line-height: 1.1667em; } #flight-details .travelo-box, #car-details .travelo-box { padding: 25px 25px 20px 25px; margin: 0; } #flight-details .detailed-features { background: #fff; } #flight-details .box-title { margin: 0; } #flight-details .flights { width: 100%; padding-bottom: 30px; border-collapse: separate; border-spacing: 0; } #flight-details .flights .timing { padding: 0; border: none; display: table; margin: 0 auto; } #flight-details .flights .timing > div { display: table-cell; vertical-align: middle; text-align: center; padding: 0 7px; } #flight-details .flights .table-cell { border-top: 1px solid #f5f5f5; border-right: 1px solid #f5f5f5; padding: 20px 5px; text-align: center; vertical-align: middle; } #flight-details .flights .table-cell:last-child { border-right: none; } #flight-details .flights .logo label { display: block; font-weight: normal; font-size: 0.8333em; text-transform: uppercase; line-height: 1em; } #flight-details .flights .logo img { max-width: 84px; height: auto; } #flight-details .flights .timing-detail { position: relative; } #flight-details .flights .first-flight .logo { position: relative; } #flight-details .flights .first-flight .logo:after { content: "\e883"; font-family: "soap-icons"; font-size: 24px; position: absolute; display: inline-block; width: 10px; text-align: center; height: 30px; line-height: 30px; right: -5px; bottom: -15px; z-index: 9; color: #e01a33; } #flight-details .flights .layover { position: absolute; display: inline-block; text-transform: uppercase; font-weight: normal; background: #f5f5f5; width: 100px; height: 20px; line-height: 20px; font-size: 0.75em; left: 50%; margin: 0 0 0 -50px; bottom: -10px; z-index: 9; letter-spacing: 0.04em; } #flight-baggage form .checkbox label { font-size: 0.8333em; text-transform: uppercase; } #flight-baggage .baggage .icon-box { cursor: default; } #flight-baggage .baggage .icon-box .box-title { color: #838383; } #flight-baggage .baggage .icon-box:hover .box-title { color: #2d3e52; } #flight-baggage .baggage .icon-box:hover i { -webkit-animation: sonarEffect 1.3s ease-out 75ms; -moz-animation: sonarEffect 1.3s ease-out 75ms; animation: sonarEffect 1.3s ease-out 75ms; } /* 5.3. Car ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .explore-more { padding: 10px 0 0 4px; } .explore-more .intro { text-transform: none; margin-bottom: 19px; margin-left: 12px; } .explore-more .intro i { float: left; margin-right: 10px; color: #01b7f2; font-size: 16px; } .explore-more .intro .box-title small { margin-bottom: 3px; } .explore-more .box { margin: 0; padding-right: 4px; width: 50%; float: left; margin-bottom: 4px; } .explore-more .box figure figcaption { text-transform: uppercase; padding-right: 20px; } .car-list { margin-top: 30px; margin-bottom: 10px; } .car-detail-page .featured-image img { width: 100%; height: auto; } .car-detail-page .detailed-logo .mile { border-bottom: 1px solid #f5f5f5; padding: 8px 0; margin-bottom: 10px; font-size: 0.8333em; text-transform: uppercase; } #car-details .detailed-features { background: #fff; } #car-details .detailed-features > [class^="col-"] { padding: 0 0 10px 0; } #car-details .detailed-features > [class^="col-"]:first-child { border-right: 1px solid #f5f5f5; } #car-details .detailed-features .box-title { padding: 25px 0 25px 25px; border-bottom: 1px solid #f5f5f5; } #car-details .detailed-features .icon-box { margin: 15px 0 30px 20px; } #car-details .car-features .icon-box { color: inherit; margin-bottom: 10px; } #car-details .car-features .icon-box > i { color: #01b7f2; } #car-details .protect-passengers .icon-box { margin-bottom: 15px; } #car-details .protect-passengers label { font-size: 0.8333em; font-weight: normal; text-transform: uppercase; } #car-details .car-damage .logo img { max-height: 25px; width: auto; } #car-details .car-damage .radio { margin: 0; line-height: 20px; font-size: 0.8333em; text-transform: uppercase; margin-bottom: 10px; } .booking-details .car-detail { border-bottom: 1px solid #f5f5f5; margin-bottom: 20px; } .booking-details .car-detail .icon-box { padding-bottom: 10px; padding-top: 10px; border-top: 1px solid #f5f5f5; } /* 5.4. Cruise ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .top-cruise-destinations .details { padding: 15px 20px !important; } .top-cruise-destinations .details li { font-size: 0.8333em; text-transform: uppercase; } .top-cruise-destinations .details .row > div { border-right: 1px solid #f5f5f5; } .top-cruise-destinations .details .row > div:last-child { border-right: none; } .cruise-line-deals { padding-top: 0; } .cruise-line-deals .row { margin-bottom: -1px; overflow: hidden; } .cruise-line-deals .row > div { border-bottom: 1px solid #f5f5f5; } .cruise-line-deals .box-title small { color: #01b7f2; } .cruise-line-deals .box { margin-bottom: 10px; margin-top: 20px; } .cruise-line-deals .box figure { background: #f5f5f5; text-align: center; height: 70px; display: table; width: 100%; table-layout: fixed; } .cruise-line-deals .box figure .image-wrapper { display: table-cell; vertical-align: middle; } .cruise-line-deals .box figure img { max-width: 66.6666%; width: auto; height: auto; } .cruise-line-deals .box .details { padding-left: 0; padding-right: 0; } .cruise-line-deals .box .price { font-size: 1.3333em; } .cruise-line-deals .box .price small { font-size: 0.625em; } .cruise-booking-form .radio { margin-top: 6px; text-transform: none; } .cruise-booking-form .radio:first-child { margin-left: 0; } #cruise-description .intro li { line-height: 2.5em; } .cruise-itinerary .travelo-box { margin: 0; } .cruise-itinerary table { width: 100%; } .cruise-itinerary th { color: #01b7f2; font-weight: normal; padding-bottom: 10px; } .cruise-itinerary td { font-size: 0.8333em; text-transform: uppercase; line-height: 3.8333em; border-top: 1px solid #f5f5f5; vertical-align: middle; } #hotel-availability .room-list .box figure, #cruise-availability .room-list .box figure, #cruise-food-dinning .food-dinning-list .box figure { margin-bottom: 5px; } #hotel-availability .room-list .details, #cruise-availability .room-list .details, #cruise-food-dinning .food-dinning-list .details { padding-top: 0; padding-bottom: 0; } #hotel-availability .room-list .box-title .title, #cruise-availability .room-list .box-title .title, #cruise-food-dinning .food-dinning-list .box-title .title { margin-bottom: 3px; } #hotel-availability .room-list .box-title dl, #cruise-availability .room-list .box-title dl, #cruise-food-dinning .food-dinning-list .box-title dl { margin: 0; } #hotel-availability .room-list .box-title dl:after, #cruise-availability .room-list .box-title dl:after, #cruise-food-dinning .food-dinning-list .box-title dl:after { content: ""; display: table; clear: both; } #hotel-availability .room-list .box-title dt, #hotel-availability .room-list .box-title dd, #cruise-availability .room-list .box-title dt, #cruise-availability .room-list .box-title dd, #cruise-food-dinning .food-dinning-list .box-title dt, #cruise-food-dinning .food-dinning-list .box-title dd { float: left; font-size: 0.8333em; text-transform: uppercase; } #hotel-availability .room-list .box-title dt, #cruise-availability .room-list .box-title dt, #cruise-food-dinning .food-dinning-list .box-title dt { color: #01b7f2; margin-right: 5px; clear: both; } #cruise-food-dinning .food-dinning-list hr { margin-top: 15px; margin-bottom: 15px; } #cruise-food-dinning .food-dinning-list .details { text-transform: none; padding: 0; } #cruise-food-dinning .food-dinning-list figure { margin: 0 20px 10px 0; } #cruise-food-dinning .food-dinning-list .box-title { margin: 0 0 5px 0; } #cruise-food-dinning .food-dinning-list .box-title dl:after { display: none; clear: none; } #cruise-food-dinning .food-dinning-list .box-title dt { clear: none; } #cruise-food-dinning .food-dinning-list .box-title dd { float: none; } #cruise-food-dinning .food-dinning-list .review-score { float: right; margin-top: 6px; } #cruise-food-dinning .food-dinning-list .review-score .five-stars-container { vertical-align: middle; margin-right: 5px; } #cruise-food-dinning .food-dinning-list .review-score .review { vertical-align: middle; color: #9e9e9e; text-transform: uppercase; font-size: 0.8333em; } #cruise-food-dinning .food-dinning-list .box { border-bottom: 1px solid #f5f5f5; margin-bottom: 15px; padding-bottom: 10px; } #cruise-food-dinning .food-dinning-list .box:last-child { border-bottom: none; } #cruise-reviews .guest-review .comment-title { font-style: normal; color: #2d3e52; } /* 5.5. Tour ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .tour-detail-page .featured-image { width: 100%; height: auto; } .tour-detail-page dl.term-description { font-size: 0.8333em; line-height: 1.6em; } .tour-detail-page dl.term-description dt, .tour-detail-page dl.term-description dd { padding-top: 1em; padding-bottom: 1em; } .tour-detail-page .featured-gallery { position: relative; margin-bottom: 10px; } .tour-detail-page .discount { visibility: hidden; } #tour-details .box-title { margin: 0; } #tour-details .price-section { padding: 25px 20px 0 25px; } #tour-details .price-section .details { float: left; margin-bottom: 20px; } #tour-details .price-section .details:last-child { float: right; } #tour-details .price-section .button { height: 32px; line-height: 32px; padding: 0 30px; } #tour-details .price-section .price { text-align: left; line-height: 32px; float: left; margin-right: 15px; } #tour-details .flights { width: 100%; } #tour-details .flights .table-cell { padding: 20px 4px; border: 1px solid #f5f5f5; text-align: center; width: 1%; } #tour-details .flights .table-cell:first-child { padding-left: 25px; border-left: none; text-align: left; } #tour-details .flights .table-cell:last-child { border-right: none; } #tour-details .flights .table-row:last-child .table-cell { border-bottom: none; } #tour-details .flights .icon { color: #fdb714; font-size: 18px; margin-right: 8px; position: relative; top: -4px; display: inline-block; } #tour-details .flights .icon.take-off { -webkit-transform: rotate(-30deg); -moz-transform: rotate(-30deg); -ms-transform: rotate(-30deg); -o-transform: rotate(-30deg); transform: rotate(-30deg); } #tour-details .flights .icon.landing { -webkit-transform: rotate(25deg); -moz-transform: rotate(25deg); -ms-transform: rotate(25deg); -o-transform: rotate(25deg); transform: rotate(25deg); } #tour-details .flights dl { text-transform: uppercase; font-size: 0.8333em; display: inline-block; margin-bottom: 0; } #tour-details .flights dt { color: #01b7f2; } #tour-details .tour-google-map { height: 250px; } #tour-details .intro2 { width: 100%; padding: 20px 10px; } #tour-details .intro2 .table-cell { padding: 10px 20px; } #tour-details .intro2 .image-container { width: 150px; padding-right: 10px; } #tour-details .intro2 .term-description { margin-bottom: 0; font-size: 0.8333em; } #tour-details .intro2 .term-description dt { border-right: none; width: 110px; } #tour-details .intro2 .term-description dd { width: auto; } #tour-details .intro2 .term-description dt, #tour-details .intro2 .term-description dd { padding-top: 0.5em; padding-bottom: 0.5em; line-height: 1.4em; } #tour-details .intro2 .price-section { text-align: center; width: 1%; border-left: 1px solid #f5f5f5; padding-left: 30px; } #tour-details .intro2 .price-section .price { float: none; line-height: 0.8em; text-align: center; margin-bottom: 20px; margin-right: 0; } .tour-packages .box { position: relative; } .tour-packages .box figure { position: relative; overflow: hidden; } .tour-packages .box figcaption { background: rgba(45, 62, 82, 0.9); position: absolute; left: 10px; right: 10px; bottom: 10px; padding: 20px; -webkit-transform: translateY(140%); -moz-transform: translateY(140%); -ms-transform: translateY(140%); -o-transform: translateY(140%); transform: translateY(140%); -moz-transition: -moz-transform 0.5s ease; -o-transition: -o-transform 0.5s ease; -webkit-transition: -webkit-transform 0.5s ease; -ms-transition: -ms-transform 0.5s ease; transition: transform 0.5s ease; } .tour-packages .box .caption-title { margin-bottom: 0; color: #fff; } .tour-packages .box .price { color: #fdb714; } .tour-packages .box .caption-title, .tour-packages .box .price { line-height: 1em; } .tour-packages .box:hover figcaption { -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); } .tour-locations .box .box-title { line-height: 1.3333em; } .tour-locations .box hr { margin: 15px 0; } .tour-locations .box .time { text-align: center; margin-bottom: 15px; display: inline-block; } .tour-locations .box .time i { font-size: 17px; } .tour-locations .box .time span { color: #01b7f2; letter-spacing: 0.04em; } .tour-locations .box .details { padding: 15px 18px 18px; background: #fff; } .tour-locations .box .features { margin-top: -5px; } .tour-locations .box .features li { line-height: 1.2em; position: relative; padding: 0.8em 0 0.8em 18px; } .tour-locations .box .features li:before { color: #fdb714; font-size: 12px; position: absolute; left: 2px; top: 0.9em; } .tour-locations .box .features li:last-child { padding-bottom: 0.4em; } .booking-details .tour-detail { border-bottom: 1px solid #f5f5f5; margin-bottom: 20px; } .booking-details .tour-detail .icon-box { padding-bottom: 10px; padding-top: 10px; border-top: 1px solid #f5f5f5; } .booking-details .tour-detail .icon-box .soap-icon-calendar { font-size: 25px; } .booking-details .tour-detail .icon-box .soap-icon-clock { font-size: 20px; } .booking-details .tour-detail .icon-box .soap-icon-departure { font-size: 24px; } #content.tour { padding-top: 0; } #content.tour .slideshow-bg { min-height: 600px; height: 800px; } #content.tour .slideshow-bg .flexslider { position: absolute; left: 0; width: 100%; top: 0; } #content.tour .slideshow-bg > .container { height: 100%; position: relative; z-index: 2; } #content.tour .slideshow-bg .table-wrapper { height: 100%; } #content.tour .slideshow-bg .table-cell { vertical-align: middle; text-align: center; } #content.tour .heading .title, #content.tour .heading .sub-title { font-weight: 900; text-transform: uppercase; } #content.tour .heading .title { font-size: 4.1667em; color: #fff; letter-spacing: 0; text-shadow: 0 0 8px rgba(0, 0, 0, 0.25); margin-bottom: 0; } #content.tour .heading .sub-title { font-size: 2em; color: #000; letter-spacing: 0.1em; text-shadow: 0 0 6px rgba(255, 233, 169, 0.25); } #content.tour .search-box { background: rgba(0, 0, 0, 0.75); padding: 20px 20px 5px; -webkit-border-radius: 7px 7px 7px 7px; -moz-border-radius: 7px 7px 7px 7px; -ms-border-radius: 7px 7px 7px 7px; border-radius: 7px 7px 7px 7px; display: block; margin: 0 15px 30px; text-align: left; } #content.tour .search-box .row { margin-left: -6px; margin-right: -6px; } #content.tour .search-box [class^="col-"], #content.tour .search-box [class*=" col-"] { padding-left: 6px; padding-right: 6px; } #content.tour .search-box .datepicker-wrap:after { background: none; color: #fdb714; } #content.tour .search-box .selector span.custom-select:before { width: 0; height: 0; border-bottom: 4px solid #fdb714; border-left: 3px solid transparent; border-right: 3px solid transparent; background: none; right: 7px; top: 50%; margin-top: -3px; } #content.tour .search-box .selector span.custom-select:after { border-top-color: #fdb714; right: 7px; top: 50%; margin-top: 3px; border-top-width: 4px; } #content.tour .button { padding-left: 20px; padding-right: 20px; } #content.tour .button.red { background-color: #e01a33; } #content.tour .button.red:hover { background-color: #e44049; } #content.tour .tour-guide .details { padding: 20px 25px 25px; } #content.tour .toggle-container .price { font-size: 20px; } /* 6. Dashboard ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ /* 6.1. Default ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .dashboard #header .logo a, .dashboard #footer .logo a, .post-404page #header .logo a, .post-404page #footer .logo a, .coming-soon-page #header .logo a, .coming-soon-page #footer .logo a, .loading-page #header .logo a, .loading-page #footer .logo a, .soap-login-page #header .logo a, .soap-login-page #footer .logo a { background: none; } .dashboard #header .logo img, .dashboard #footer .logo img, .post-404page #header .logo img, .post-404page #footer .logo img, .coming-soon-page #header .logo img, .coming-soon-page #footer .logo img, .loading-page #header .logo img, .loading-page #footer .logo img, .soap-login-page #header .logo img, .soap-login-page #footer .logo img { filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; } .dashboard #header .logo img { height: 22px; } #dashboard .fact { color: #fff; margin-bottom: 20px; } #dashboard .fact .numbers { padding: 25px 15px; } #dashboard .fact .numbers dl { float: right; text-align: right; margin: 0; } #dashboard .fact .numbers dt { font-size: 2em; font-weight: 400; line-height: 1em; } #dashboard .fact .numbers dd { font-size: 1.3333em; } #dashboard .fact .numbers .icon { font-size: 4em; } #dashboard .fact .description { font-size: 0.8333em; text-transform: uppercase; padding: 0 20px; font-weight: bold; line-height: 3em; } #dashboard .fact .description > .icon { float: right; font-size: 2em; } #dashboard .fact.blue { background: #01b7f2; } #dashboard .fact.blue .description { background: #04afe7; } #dashboard .fact.yellow { background: #fdb714; } #dashboard .fact.yellow .description { background: #f5b010; } #dashboard .fact.red { background: #e01a33; } #dashboard .fact.red .description { background: #d51a32; } #dashboard .fact.green { background: #98ce44; } #dashboard .fact.green .description { background: #91c63d; } #dashboard .notifications .icon-box { background: #f5f5f5; font-size: 1em; padding-right: 15px; margin-bottom: 10px; height: auto; } #dashboard .notifications .icon-box:after { display: table; content: ""; clear: both; } #dashboard .notifications .box-title { line-height: 1em; text-transform: none; color: #2d3e52; padding: 14px 5px 15px 57px; } #dashboard .notifications .price { color: #01b7f2; float: none; text-align: left; display: inline; font-size: inherit; } #dashboard .notifications .time { line-height: inherit; } #dashboard .notifications .load-more { font-size: 2.5em; text-align: center; color: #d9d9d9; } #dashboard .recent-activity { background: #f5f5f5; padding: 15px; } #dashboard .recent-activity ul { background: #fff; margin-bottom: 15px; } #dashboard .recent-activity ul li > a { padding: 15px; border-bottom: 1px solid #f5f5f5; display: block; } #dashboard .recent-activity ul li > a:hover { background: #f5f5f5; } #dashboard .recent-activity ul .icon { float: left; margin-right: 15px; font-size: 1.3333em; } /* 6.1.1. User profile */ #profile .personal-details .details { padding-top: 0; padding-right: 0; } .btn{ display: block; padding: 10px; background: #01b7f2; color: #fff; margin-top: 20px; box-shadow: 1px 1px 5px rgba(0,0,0,.2); }