$primaryColor: #00377A; /* Dark Blue */ $secondaryColor: #E20026; /* Dark Red */ $blue1Color: #A4BEDD; /* Light Blue-Gray */ $blue2Color: #F2F5F8; /* Lighter Blue-Gray */ $blue3Color: #C6DCEF; /* Light Blue-Gray */ $blue4Color: #D9E1EB; /* Light Blue-Gray */ $colorBlack: #000000; /* Black */ $colorWhite: #FFFFFF; /* White */ a, a:hover, a:focus { color: $primaryColor; text-decoration: none; } li.main-menu { color: $primaryColor; a.a-main-menu { color: $primaryColor; } } body, .icon.form-control-feedback, .slogan-secondary, .search-form-text, .ss-rating-label, .icon.ion-android-star, .tophotels-box, .tophotels-box h3, .tophotels-info, .specials-slide-info, .specials-slide-info h4, .specials-slide-info h4 a, .specials-slide-info p, .box-container h3, .hotelbewertung-text, a.carousel-control, a.carousel-control:hover, a.carousel-control:focus, .top-10-caption, .top-10-slide-info, .top-10-slide-info h4, .advantage-offers, .aktuelles-carousel .item a h4, .aktuelles-carousel .item a p, .aktuelle, .topangebote-carousel, .topangebote-carousel .item a h4, .topangebote-carousel .item a p, .contact-form, .control-label, #kontaktForm .panel-title, #kontaktForm .contact-text, section.newsletter, #nlForm .panel-title, #picsPopup .modal-title, #moreInfoPopup .modal-title, .top-10-offers-carousel .carousel-control:active, .top-10-offers-carousel .carousel-control:focus, .top-10-offers-carousel .carousel-control:hover, .top-10-offers-carousel .carousel-control, .top-10-infotext h4 { color: $primaryColor; } #kontaktForm .btn-default, #nlForm .btn-default, .nav-arrows a, #picsPopup .btn-success, #moreInfoPopup .btn-success, .menu-collapsed, #schnellSuche .fastsearch-tabs, #schnellSuche .modal-footer, .mob-buttons-div button, .partner-name-select, .voucher-select, .btn-specials-offer, .btn-specials-offer:hover, .btn-specials-offer:active, .btn-specials-offer:focus, #individuelleAnfrageForm .btn-primary, #kontaktForm .btn-primary { background-color: $primaryColor; } .errors { color: $secondaryColor; } #nlUForm .btn-danger, #picsPopup .btn-danger, #moreInfoPopup .btn-danger { background-color: $secondaryColor; } .mob-buttons-div button, .specials-section-carousel .specials-name, .specials-section-carousel .carousel-control, .specials-section-carousel .carousel-control:active, .specials-section-carousel .carousel-control:focus, .specials-section-carousel .carousel-control:hover { color: $colorWhite; } footer { background-color: $primaryColor; .partner, .partner-name-tcp, .voucher, .box-footer-2nd-text, .footer-last-social, span { color: $primaryColor; } } #individuelleAnfrageForm h5 { background-color: $blue1Color; } .text-main-font { font-family: Arial,Verdana,Sans-serif !important; } body, #schnellSuche .modal-tabs-content { background-color: $blue2Color; } .contact-form-content, .box-container .box-content { background-color: $blue3Color; } .carousel-section { background-color: $blue4Color; } .box-footer-2nd-text { background-color: $colorWhite; } body.modal-open { overflow: auto; } body.modal-open[style] { padding-right: 0px !important; } .modal-footer .btn-danger, .modal-footer .btn-success { margin: 20px; } .modal::-webkit-scrollbar { width: 0 !important; } .modal-transparent, .modal-content.modal-transparent { background-color: transparent; border: 0; padding-bottom: 0px; } .modal-tabs-content { margin-left: -20px; margin-right: -20px; } .modal-footer { padding: 0px; } .modal-tabs-topheader { margin-top: -20px; background-color: transparent; overflow: hidden; margin-left: -20px; margin-right: -20px; } .modal-tabs-close { float: right; margin-top: 5px; } .dropdown-menu { background-color: rgba(242, 245, 248, 1);; } .container-fluid { max-width: 1750px !important; } .btn:hover { border-bottom-width: 0; } a:focus { outline: none; } .navbar-right { margin-right: 0 !important; } #dlg-welcome .modal-dialog .modal-content { background-image: url("../img/banner-welcome-1.jpg"); background-position: center top; } @media (min-width: 560px) { #dlg-welcome .modal-dialog .modal-content { background-size: cover; } } @media (max-width: 559px) { #dlg-welcome .modal-dialog .modal-content { background-size: contain; } } #dlg-welcome .modal-dialog .modal-content .modal-header { background-color: transparent; border-bottom: medium none; border-top-left-radius: 5px; border-top-right-radius: 5px; } #dlg-welcome .modal-dialog .modal-content .modal-body { height: 450px; padding-left: 0; padding-right: 0; } #dlg-welcome .modal-dialog .modal-content .modal-body .content .inner { background-color: rgba(255, 255, 255, 0.8); font-weight: bold; margin-left: 15px; margin-right: 15px; margin-top: 105px; padding-bottom: 5px; padding-left: 15px; } @media (min-width: 560px) { #dlg-welcome .modal-dialog .modal-content .modal-body .content .inner .logos { overflow: hidden; } #dlg-welcome .modal-dialog .modal-content .modal-body .content .inner .logos .header { background-image: url("../img/travelcheck-logo-small.png"); background-position: left center; background-repeat: no-repeat; float: left; height: 125px; width: 260px; } #dlg-welcome .modal-dialog .modal-content .modal-body .content .inner .logos .bestpreis-logo { background-image: url("../img/bestpreisgarantie-siegel_f-1.png"); background-position: right center; background-repeat: no-repeat; float: right; height: 180px; position: absolute; right: 0; top: 150px; transform: rotate(10deg); width: 180px; } } @media (max-width: 559px) { #dlg-welcome .modal-dialog .modal-content .modal-body .content .inner .logos { overflow: hidden; } #dlg-welcome .modal-dialog .modal-content .modal-body .content .inner .logos .header { background-image: url("../img/travelcheck-logo-small-1.png"); background-position: left center; background-repeat: no-repeat; float: left; height: 125px; width: 260px; } #dlg-welcome .modal-dialog .modal-content .modal-body .content .inner .logos .bestpreis-logo { background-image: url("../img/bestpreisgarantie-siegel_f-2.png"); background-position: right center; background-repeat: no-repeat; float: right; height: 130px; position: absolute; right: 0; top: 150px; transform: rotate(10deg); width: 180px; } } #dlg-welcome .modal-dialog .modal-content .modal-body .content .inner ul { color: $colorBlack; list-style: outside none none; margin-left: 0; padding-left: 1.2em; text-indent: -1.2em; width: 100%; } #dlg-welcome .modal-dialog .modal-content .modal-body .content .inner ul li::before { content: "\f10a"; float: left; font-family: "Ionicons"; line-height: 1; padding-left: 10px; padding-top: 3px; width: 1.2em; } #dlg-welcome .modal-dialog .modal-content .modal-body .content .footer { background-color: #007aff; bottom: 0; color: $colorWhite; padding: 5px 15px 15px; position: absolute; top: 355px; } #dlg-welcome .modal-dialog .modal-content .modal-body .content .footer h3 a { color: $colorWhite; } #dlg-welcome .modal-dialog .modal-content .modal-footer { background-color: #007aff; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; border-top: medium none; } #dlg-welcome .modal-dialog .modal-content .modal-footer button { width: 93%; } @media (min-width: 1200px) { .navbar-nav { /* background-color: rgba(242, 245, 248, 0.6);*/ } .nav .open > a, .nav .open > a:hover, .nav .open > a:focus { background-color: rgba(242, 245, 248, 0.6) } #main-menu { height: 80px; } .navbar-header { height: 80px; } #main-menu>li { position: relative; top: 50%; transform: translateY(-50%); } #navcol-1 { background-color: rgba(242, 245, 248, 0.6); } .navbar-right li a:hover { color: $secondaryColor !important; } .dropdown-menu { min-width: 280px; padding-left: 5px; padding-right: 5px; border-width: 0; } } @media (max-width: 1200px) { .navbar-nav { background-color: rgba(242, 245, 248, 1); } .nav .open > a, .nav .open > a:hover, .nav .open > a:focus { background-color: rgba(242, 245, 248, 1); } #main-menu { height: auto; } } .navbar-default.transparent { background-color: transparent; } body { font-family: Arial,Verdana,Sans-serif; min-height: 540px; } .form-control { box-shadow: none; } .form-control[readonly] { background-color: $colorWhite; } .form-control.error[readonly] { background-color: #fbc4d1; } body[orient="portrait"] { min-height:540px; } body[orient="landscape"] { min-height:400px; } .zooming-circle-holder { position: relative; padding: 0 !important; overflow: hidden; width: 169px; height: 169px; border-radius: 50%; overflow: hidden; display: block; margin: 0 auto; } .zooming-circle-holder img { display: block; margin: 0; transition: all 0.5s; -moz-transition: all 0.5s; -webkit-transition: all 0.5s; -o-transition: all 0.5s; } .zooming-circle-holder img:hover { transform: scale(1.1); -ms-transform: scale(1.1); -webkit-transform: scale(1.1); -o-transform: scale(1.1); -moz-transform: scale(1.1); } .centered-a { text-align: center; } .centered-a-container { display: block; margin: 0 auto; } #individuelleAnfrageForm > h5 { text-align: center; font-weight: bold; } .btn-top-kontakt-mob { border-radius: 50%; border-color: transparent; border-width: 0; font-weight: normal; font-size: 25px; padding-left: 10px; padding-right: 10px; } .btn-top-schnellsuche-mob { border-radius: 50px; border-color: transparent; border-width: 0; font-weight: normal; font-size: 25px; padding-left: 30px; padding-right: 30px; } .ss-form { margin-top: 15px; } .ss-destination-group { font-weight: bold; font-style: italic; } .ss-destination-item { padding-left: 15px; } .ss-tabs { margin-left: -5px; margin-right: -5px; border: 0; border-color: transparent; float: left; } .tm-tag span { font-size: 18px !important; } .select2.select2-container[style] { width: 100% !important; } .ss-form input, .ss-form select, .ss-form ul { font-size: 1em; padding-left: 35px !important; } .select2-search input{ width: 100% !important; padding-left: 0 !important; } .tt-input input { float: left; font-size: 1em !important; } .tt-suggestion { font-size: 1.5em !important; } .tt-menu { width: 45%; } .tt-cursor { border: 1px solid #888; border-radius: 5px; } .bootstrap-tagsinput { width: 100%; } .bootstrap-tagsinput .tag [data-role="remove"] { font-size: 15px; } .ss-form .icon { font-size: 2em; left: 0; } .twitter-typeahead { width: 100%; } .ss-rating-label { font-size: 18px; float: left; } .ss-persons-outer-container { overflow: hidden; } .ss-persons-container.adults { left: 9px !important; } .ss-persons-container { float: left; position: relative; left: 45px; } .ss-persons-label-container { float: left; } .ss-children-ages-container select { width: 55px; padding-left: 0 !important; } .ss-advanced-search { top: 0; margin-top: 0; padding: 0; width: 100%; } .ss-advanced-search-btn { width: 100%; background-color: transparent; color: $colorWhite; border-color: transparent; font-weight: bold; } .modal-close-button:hover, .modal-close-button:focus { background-color: $secondaryColor !important; border-color: transparent !important; border-bottom-width: 0 !important; } .no-margin-on-hover:hover { margin-top: 0; } .no-margin-on-hover-5:hover { margin-top: 5px; } .btn { text-transform: none; border-width: 0; } .select2-container--default .select2-selection--multiple { border: 1px solid #e7e7e7; color: #555555; display: block; font-size: 14px; padding: 7px 12px; transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s; width: 100%; } .select2-container--default.select2-container--focus .select2-selection--multiple { border-color: #66afe9; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(102, 175, 233, 0.6); outline: 0 none; } .slider-spacer { width: 100px; } .slider-horizontal { float: left; left: 100px; margin-top: -20px; } .slider-container { margin-bottom: 35px; } .rating { unicode-bidi: bidi-override; direction: rtl; text-align: center; float: left; margin-top: 10px; margin-left: 10px; } .rating-selected { color: gold !important; } .rating > span:hover, .rating > span:hover ~ span { color: transparent; cursor: pointer; } .rating > span:hover:before, .rating > span:hover ~ span:before { color: gold; } .nav-tabs a { color: $colorWhite !important; font-weight: bold; } .nav-tabs .active a { background-color: $blue2Color !important; color: $primaryColor !important; font-weight: bold; } .text-centered { text-align: center; } .text-font-large { font-size: 28px; } .slogan-secondary { width: 100%; font-weight: bold; font-size: 20px; } .box-container a:hover { text-decoration: none; } .box-container { padding-top: 10px; padding-bottom: 10px; } .box-content:hover { opacity: 0.7; } .box-content { background-size: cover; background-position: center; height: 270px; } .box-content > h3 { width: 100%; background-color: rgba(255, 255, 255, 0.5); top: 0; left: 0; } .pauschalreisen { background-image: url(../img/pauschalreisen-f.jpg) } .lastminute { background-image: url(../img/lastminute-f.jpg) } .topreiseziele { background-image: url(../img/topreiseziele-f.jpg) } .kreuzfahrten { background-image: url(../img/kreuzfahrten-f.jpg) } .flusskreuzfahrten { background-image: url(../img/flusskreuzfahrten-f.jpg) } .windjammer { background-image: url(../img/windjammer-f.jpg) } .hotelsweltweit { background-image: url(../img/hotelsweltweit-f.jpg) } .ferienhaeuser { background-image: url(../img/ferienhaeuser-f.jpg) } .fincas { background-image: url(../img/fincas-f.jpg) } .rhodos { background-image: url(../img/rhodos.jpg) } .bulgarien { background-image: url(../img/bulgarien.jpg) } .ibiza { background-image: url(../img/ibiza.jpg) } .caracao { background-image: url(../img/caracao.jpg) } .barbados { background-image: url(../img/barbados.jpg) } .menorca { background-image: url(../img/menorca.jpg) } .lapalma { background-image: url(../img/lapalma.jpg) } .lagomera { background-image: url(../img/lagomera.jpg) } .teneriffa { background-image: url(../img/teneriffa.jpg) } .grancanaria { background-image: url(../img/grancanaria.jpg) } .lanzarote { background-image: url(../img/lanzarote.jpg) } .fuerteventura { background-image: url(../img/fuerteventura.jpg) } .linienfluege { background-image: url(../img/linienfluege-f.jpg) } .charterfluege { background-image: url(../img/charterfluege-f.jpg) } .golfreisen { background-image: url(../img/golfreisen-f.jpg) } .tennisreisen { background-image: url(../img/tennisreisen-f.jpg) } .box2-content.skireisen { background-position: 0% 0%; } .fussballreisen { background-image: url(../img/fussballreisen-f.jpg) } .reisenmithund { background-image: url(../img/reisenmithund-f.jpg) } .skireisen { background-image: url(../img/skireisen-f.jpg) } .tauchreisen { background-image: url(../img/tauchreisen-f.jpg) } .partyundeventreisen { background-image: url(../img/partyundeventreisen-f.jpg) } .freizeitparks { background-image: url(../img/freizeitparks-f.jpg) } .carousel-fullwidth h3 { font-weight: bold; } .img-aktuelles-carousel-wrapper, .img-aktuelles-carousel-wrapper a, .img-aktuelles-carousel-wrapper div, .img-aktuelles-carousel-wrapper img { text-align: center; } .img-aktuelles-carousel-wrapper img { display: block; margin: 0 auto; } .img-responsive { display: block; margin: 0 auto; } .img-topangebote-carousel-wrapper h4 { font-weight: bold; } .img-topangebote-carousel-wrapper, .img-topangebote-carousel-wrapper a { text-align: center; } .img-topangebote-carousel-wrapper h4 { font-weight: bold; } .carousel-control.menu-control .glyphicon-menu-left { margin-left: -85px; } .carousel-control.menu-control .glyphicon-menu-right { margin-right: -85px; } .carousel-control.menu-control .glyphicon-menu-left, .carousel-control.menu-control .glyphicon-menu-right { font-size: 40px; height: 40px; width: 40px; text-shadow: 0px 0px 10px rgba(255, 255, 255, 0.96); } .carousel-control.menu-control .glyphicon-menu-left { left: 50%; } .carousel-control.menu-control .glyphicon-menu-right { right: 50%; } .carousel-control.menu-control .glyphicon-menu-left, .carousel-control.menu-control .glyphicon-menu-right { display: inline-block; position: absolute; top: 50%; z-index: 5; } .preis { color: $secondaryColor; font-weight: bold; } .footer-last { color: $colorWhite !important; font-family: Arial,Verdana,Sans-serif; padding-top: 25px; } .footer-last a { color: $colorWhite !important; } .box-footer-2nd-text { border-radius: 10px; padding-top: 3px; padding-bottom: 3px; } .box-footer-2nd, .box-footer-2nd h4 { color: $colorWhite !important; margin-top: 25px; } #voucher-input { width: 75%; text-align: left; } .voucher-select { width: 10%; font-size: 22px; color: $colorWhite; border-radius: 50%; text-align: center; padding-left: 10px; padding-right: 8px; } .voucher-money-bg-xs { background-image: url(../img/geld-320.png); background-position: center; background-repeat: no-repeat; background-size: fill; margin-top: 5px; height: 30px; } .voucher-money-bg-sm { background-image: url(../img/geld-600.png); background-position: center; background-repeat: no-repeat; background-size: fill; margin-top: 5px; height: 60px; } .voucher-money-bg-md { background-image: url(../img/geld-900.png); background-position: center; background-repeat: no-repeat; background-size: fill; margin-top: 0px; height: 65px; } .voucher-money-bg-lg { background-image: url(../img/geld.png); background-position: center; background-repeat: no-repeat; background-size: fill; margin-top: 5px; height: 90px; } #partner-name-input { width: 65%; } .partner-name-select { width: 10%; font-size: 22px; color: $colorWhite; border-radius: 50%; text-align: center; padding-left: 10px; padding-right: 8px; } .partner-name-tcp { width: 21%; margin-left: 5px; background-color: $colorWhite; text-transform: none; } .footer-wrapper { margin-left: 20px; margin-right: 20px; } .contact-form .col-xs-6, .contact-form .col-xs-4, .contact-form .col-xs-2, h4.contact-form { padding-left: 0; padding-right: 0; } h4.contact-form { margin-left: -15px; } .xatonce-carousel .carousel-control { width: 4%; background-image: none; } .xatonce-carousel .carousel-control.left { margin-left: 15px; } .xatonce-carousel .carousel-control.right { margin-right: 15px; } .xatonce-carousel .cloneditem-1, .xatonce-carousel .cloneditem-2, .xatonce-carousel .cloneditem-3, .xatonce-carousel .cloneditem-4, .xatonce-carousel .cloneditem-5 { display: none; } @media all and (min-width: 768px) { .xatonce-carousel .carousel-inner > .active.left, .xatonce-carousel .carousel-inner > .prev { left: -33.333%; } .xatonce-carousel .carousel-inner > .active.right, .xatonce-carousel .carousel-inner > .next { left: 33.333%; } .xatonce-carousel .carousel-inner > .left, .xatonce-carousel .carousel-inner > .prev.right, .xatonce-carousel .carousel-inner > .active { left: 0; } .xatonce-carousel .carousel-inner .cloneditem-1, .xatonce-carousel .carousel-inner .cloneditem-2 { display: block; } } @media all and (min-width: 768px) and (transform-3d), all and (min-width: 768px) and (-webkit-transform-3d) { .xatonce-carousel .carousel-inner > .item.active.right, .xatonce-carousel .carousel-inner > .item.next { -webkit-transform: translate3d(33.333%, 0, 0); transform: translate3d(33.333%, 0, 0); left: 0; } .xatonce-carousel .carousel-inner > .item.active.left, .xatonce-carousel .carousel-inner > .item.prev { -webkit-transform: translate3d(-33.333%, 0, 0); transform: translate3d(-33.333%, 0, 0); left: 0; } .xatonce-carousel .carousel-inner > .item.left, .xatonce-carousel .carousel-inner > .item.prev.right, .xatonce-carousel .carousel-inner > .item.active { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); left: 0; } } @media all and (min-width: 992px) { .xatonce-carousel .carousel-inner > .active.left, .xatonce-carousel .carousel-inner > .prev { left: -16.666%; } .xatonce-carousel .carousel-inner > .active.right, .xatonce-carousel .carousel-inner > .next { left: 16.666%; } .xatonce-carousel .carousel-inner > .left, .xatonce-carousel .carousel-inner > .prev.right, .xatonce-carousel .carousel-inner > .active { left: 0; } .xatonce-carousel .carousel-inner .cloneditem-3, .xatonce-carousel .carousel-inner .cloneditem-4, .xatonce-carousel .carousel-inner .cloneditem-5 { display: block; } } @media all and (min-width: 992px) and (transform-3d), all and (min-width: 992px) and (-webkit-transform-3d) { .xatonce-carousel .carousel-inner > .item.active.right, .xatonce-carousel .carousel-inner > .item.next { -webkit-transform: translate3d(16.666%, 0, 0); transform: translate3d(16.666%, 0, 0); left: 0; } .xatonce-carousel .carousel-inner > .item.active.left, .xatonce-carousel .carousel-inner > .item.prev { -webkit-transform: translate3d(-16.666%, 0, 0); transform: translate3d(-16.666%, 0, 0); left: 0; } .xatonce-carousel .carousel-inner > .item.left, .xatonce-carousel .carousel-inner > .item.prev.right, .xatonce-carousel .carousel-inner > .item.active { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); left: 0; } } .img-partner-footer-carousel-wrapper { height: 65px; } .partner-footer-carousel .carousel-inner .item img { position: relative; top: 50%; transform: translateY(-50%); } .carousel-control.left, .carousel-control.right { background-image:none; } .box-footer { background-image: url(../img/insel-footer.png); background-size: cover; height: 165px; } .box-footer h3 { margin-top: 5px; font-size: 22px; font-weight: bold; } .navbar { position: absolute; top: 0; left: 0; right: 0; border-width: 0; } .navbar-default .navbar-toggle .icon-bar { background-color: $colorWhite !important; } .menu-collapsed { padding-left: 15px; padding-right: 15px; padding-top: 5px; padding-bottom: 5px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; width: 50px; height: 50px; } .navbar-toggle { border-style: none; } .navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover { background-color: $primaryColor !important; } .navbar-link { font-size: x-large; } .navbar-right li a { font-size: 20px; text-decoration: none; padding-right: 15px; z-index: 2000; } .navbar-right li.active a { font-weight: bold; } .carousel-title { top: 15%; font-family: Arial,Verdana,Sans-serif; } .carousel-title h1 { position: absolute; right: 0; font-size: 50px; font-weight: bold; text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.96); color: $colorWhite !important; } .carousel-title p { position: absolute; right: 0; top: 75px; font-size: 25px; font-weight: bold; text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.96); color: $colorWhite !important; } .bg-fade-carousel-indicators-container { float: left; } .bg-fade-carousel-indicators { top: 15%; left: auto; right: -456px; margin-top: 50px; white-space: pre-wrap; } .bg-fade-carousel-indicators li { background-color: #7da3bf; border-color: #134884 !important; } .bg-fade-carousel-indicators .active { background-color: #1a4b88; } .carousel.carousel-fade .item { -webkit-transition: opacity 1s linear; -moz-transition: opacity 1s linear; -ms-transition: opacity 1s linear; -o-transition: opacity 1s linear; transition: opacity 1s linear; opacity: .5; } .carousel.carousel-fade .active.item { opacity: 1; } .carousel.carousel-fade .active.left, .carousel.carousel-fade .active.right { left: 0; z-index: 2; opacity: 0; filter: alpha(opacity=0); } /* Carousel Overlay */ .carousel-overlay { position: absolute; bottom: 100px; right: 5px; left: 0; } .topcarousel { min-height: 560px; /* Must have a height or min-height set due to use of background images */ background-size: cover; background-position: center center; } .homeslide1 { background-image: url(../img/carousel_home/1-w.jpg); } .homeslide2 { background-image: url(../img/carousel_home/2-w.jpg); } .homeslide3 { background-image: url(../img/carousel_home/3-w.jpg); } .top-margin-30 { margin-top: 30px; } .specialsslide1 { background-image: url(../img/carousel_home/specials/tauchen.jpg); } .specialsslide2 { background-image: url(../img/carousel_home/specials/ski.jpg); } .specialsslide3 { background-image: url(../img/carousel_home/specials/finca.jpg); } .specialsslide4 { background-image: url(../img/carousel_home/specials/tennis.jpg); } .specialsslide5 { background-image: url(../img/carousel_home/specials/fussball.jpg); } .specialsslide6 { background-image: url(../img/carousel_home/specials/golf.jpg); } .specialsslide7 { background-image: url(../img/carousel_home/specials/party.jpg); } .specialsslide8 { background-image: url(../img/carousel_home/specials/hund.jpg); } .specialsslide9 { background-image: url(../img/carousel_home/specials/freizeitpark.jpg); } .specials-header { background: rgba(51,95,149,1); background: -moz-linear-gradient(top, rgba(51,95,149,1) 0%, rgba(1,55,122,1) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(51,95,149,1)), color-stop(100%, rgba(1,55,122,1))); background: -webkit-linear-gradient(top, rgba(51,95,149,1) 0%, rgba(1,55,122,1) 100%); background: -o-linear-gradient(top, rgba(51,95,149,1) 0%, rgba(1,55,122,1) 100%); background: -ms-linear-gradient(top, rgba(51,95,149,1) 0%, rgba(1,55,122,1) 100%); background: linear-gradient(to bottom, rgba(51,95,149,1) 0%, rgba(1,55,122,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#335f95', endColorstr='#01377a', GradientType=0 ); width: 100%; text-align: justify; -ms-text-justify: distribute-all-lines; text-justify: distribute-all-lines; border-radius: 70px; } .specials-header a { top: 5px; display: inline-block; *display: inline; color: $colorWhite; } .specials-header img { vertical-align: baseline; } .stretch { width: 90%; display: inline-block; font-size: 0; line-height: 0 } .specials-caption { position: absolute; top: 100px; right: 0; padding-right: 15px; /*background-color: rgba(255, 255, 255, 0.5);*/ width: 100%; height: 210px; text-align: right; font-weight: bold; font-size: 30px; display: inline-block; /*border-radius: 30px;*/ } .specials-caption h3 { font-size: 50px; font-weight: bold; color: $colorWhite !important; text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.96); } .specials-caption p { text-align: right; font-size: 25px; font-weight: bold; color: $colorWhite !important; text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.96); } .specials-navigation { position: absolute; bottom: 100px; right: 10px; background-color: transparent; width: 100%; height: 300px; text-align: center; font-weight: bold; font-size: 30px; display: inline-block; } .specials-slide-info { background-color: rgba(255, 255, 255, 0.8); height: 210px; margin-top: 300px; margin-left: 30px; margin-right: 30px; right: 20px; padding-left: 50px; padding-right: 80px; margin-bottom: 20px; width: 95%; } .specials-slide-info h4 { font-weight: bold; text-align: left; font-size: 45px; } .specials-slide-info p { text-align: justify; font-size: 18px; box-sizing: border-box; bottom: 70px; top: 70px; } /*.specials-carousel .carousel-control { text-shadow: none; top: 800px; width: 4%; font-size: 40px; }*/ .specials-carousel .carousel-control.left { left: 0; } .specials-carousel .carousel-control.right { right: 0; } .specials-section-carousel .carousel-inner { background: rgba(51,95,149,1); background: -moz-linear-gradient(top, rgba(51,95,149,1) 0%, rgba(1,55,122,1) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(51,95,149,1)), color-stop(100%, rgba(1,55,122,1))); background: -webkit-linear-gradient(top, rgba(51,95,149,1) 0%, rgba(1,55,122,1) 100%); background: -o-linear-gradient(top, rgba(51,95,149,1) 0%, rgba(1,55,122,1) 100%); background: -ms-linear-gradient(top, rgba(51,95,149,1) 0%, rgba(1,55,122,1) 100%); background: linear-gradient(to bottom, rgba(51,95,149,1) 0%, rgba(1,55,122,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#335f95', endColorstr='#01377a', GradientType=0 ); width: 100%; text-align: justify; -ms-text-justify: distribute-all-lines; text-justify: distribute-all-lines; border-radius: 70px; } .specials-offer-image { -webkit-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75); -moz-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75); box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75); margin-right: 25px; margin-bottom: 8px; float: left; } .img-section-carousel-wrapper, .img-section-carousel-wrapper a { text-align: center; height: 120px; top: 5px; } .staticimage-top-title { position: absolute; top: 120px; right: 0; width: 100%; } .staticimage-top-title h3, .staticimage-top-title h3 a { font-size: 50px; font-weight: bold; text-shadow: 0 0 10px rgba(0, 0, 0, 0.96); /*background-color: rgba(255,255,255,0.8);*/ /*border-radius: 15px;*/ /*padding: 10px 10px 10px 10px;*/ text-align: right; color: $colorWhite !important; text-decoration: none; } .vacation-container { overflow: hidden; } .vacation-item { float: left; padding-right: 15px; } .staticimage-top-title p { font-size: 25px; font-weight: bold; text-align: right; color: $colorWhite !important; text-shadow: 0 0 10px rgba(0, 0, 0, 0.96); } .staticimage-head { height: 562px; background-position: center; background-repeat: no-repeat; background-size: cover; } .mietwagen-title { background-image: url(../img/mietwagen.jpg); } .charter-title { background-image: url(../img/charterfluege.jpg); } .line-title { background-image: url(../img/linienfluege.jpg); } .kreuzfahrten-title { background-image: url(../img/kreuzfahrten.jpg); } .pauschal-title { background-image: url(../img/pauschalreisen.jpg); } .ferienhaeuser-title { background-image: url(../img/ferienhaeuser.jpg); } .freizeitparks-title { background-image: url(../img/freizeitparks.jpg); } .hotels-title { background-image: url(../img/hotelsweltweit.jpg); } .lastminute-title { background-image: url(../img/lastminute.jpg); } .hund-title { background-image: url(../img/reisenmithund.jpg); } .topreiseziele-title { background-image: url(../img/topreiseziele.jpg); } .top-hotels-title { background-image: url(../img/hotelsweltweit.jpg); } .box-12-content > h3 { width: 100%; background-color: rgba(255, 255, 255, 0.5); top: 0; left: 0; } .tophotels-box { height: 250px; } .tophotels-box:hover { opacity: 1; } .top-10-title { background-image: url(../img/hotelsweltweit.jpg); } .top-10-carousel { margin-bottom: 15px; } .top-10-caption { position: absolute; top: 10px; left: 10px; background-color: rgba(255, 255, 255, 0.8); width: 150px; height: 150px; text-align: center; font-weight: bold; font-size: 30px; border-radius: 50%; display: inline-block; } .top-10-carousel .carousel-control { text-shadow: none; top: 375px; width: 4%; font-size: 40px; } .top-10-left-control { left: 56% !important; } .top-10-slide { background-position: center; background-size: cover; height: 500px; } .top-10-slide-info { background-color: rgba(255, 255, 255, 0.8); height: 40%; top: auto; bottom: 0; left: 56%; position: absolute; overflow: hidden; padding-left: 50px; padding-right: 50px; } .top-10-slide-info h4 { font-weight: bold; text-align: left; font-size: 45px; } .top-10-slide-info p { text-align: justify; font-size: 18px; position: relative; box-sizing: border-box; display: inline-block; } .top-10-infotext { position: absolute; background-color: rgba(242, 245, 248, 0.9); top: 68%; width: 89%; height: 130px; margin-left: 2%; } .top-10-infotext-price { font-size: 20px; position: absolute; bottom: 9px; right: 15px; font-weight: bold; } .navbar-brand .glyphicon{ margin-right:6px; } .icon-feature{ text-align:center; } .icon-feature .glyphicon{ font-size:60px; } section.features{ background-color: $blue2Color; padding: 0; } .features h2 { color: $colorBlack; } .features .icon-features{ margin-top:15px; } .testimonials blockquote{ text-align:center; } section.testimonials{ margin:50px 0; } .site-footer{ padding:20px 0; text-align:center; } @media (min-width:768px) { .site-footer h5{ text-align:left; } } .site-footer h5{ color:inherit; font-size:20px; } .site-footer .social-icons a:hover{ opacity:1; } .site-footer .social-icons a{ display:inline-block; width:32px; border:none; font-size:20px; border-radius:50%; margin:4px; text-align:center; background-color: $colorWhite; height:32px; line-height:32px; padding-top: 0px; } @media (min-width:768px) { .site-footer .social-icons{ text-align:right; } } .wrapper2 { position: relative; padding-bottom: 65.25%; padding-top: 30px; height: 3000px; overflow: auto; -webkit-overflow-scrolling:touch; } .wrapper2 iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .embed-container { position: relative; padding-bottom: 56.25%; /* ratio 16x9 */ height: 0; overflow: hidden; width: 100%; height: auto; } .embed-container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /* ratio 4x3 */ .embed-container.ratio4x3 { padding-bottom: 75%; } iframe { max-width: 100%; } .iframe-container { position: relative; padding-bottom: 56.25%; padding-top: 35px; height: 0; overflow: hidden; background-color: $colorWhite; } .iframe-container iframe { position: absolute; top:0; left: 0; width: 100%; height: 100%; } .greyLabels label{ color: #798FA5; } .error { background-color: #fbc4d1; } .carousel-fade { .carousel-inner { .item { transition-property: opacity; } .item, .active.left, .active.right { opacity: 0; } .active, .next.left, .prev.right { opacity: 1; } .next, .prev, .active.left, .active.right { left: 0; transform: translate3d(0, 0, 0); } } .carousel-control { z-index: 2; } } /* @media only screen and (min-width: 1170px) { .submenu { display: none; } }*/ /* Redefine grid float breakpoint */ @media (max-width: 1200px) { .navbar-header { float: none; } .navbar-left,.navbar-right { float: none !important; } .navbar-toggle { display: block; } .navbar-collapse { border-top: 1px solid transparent; box-shadow: inset 0 1px 0 rgba(255,255,255,0.1); } .navbar-fixed-top { top: 0; border-width: 0 0 1px; } .navbar-collapse.collapse { display: none!important; } .navbar-nav { float: none!important; margin-top: 7.5px; } .navbar-nav>li { float: none; } .navbar-nav>li>a { padding-top: 10px; padding-bottom: 10px; } .collapse.in{ display:block !important; } } .menu-placeholder-lg { height: 110px; } /* .container-3d{ margin: 4% auto; width: 210px; height: 140px; position: relative; perspective: 1000px; } #carousel-3d{ width: 50%; height: 50%; left: 5px; position: absolute; transform-style: preserve-3d; animation: rotation 20s infinite linear; } #carousel-3d:hover{ animation-play-state: paused; } #carousel-3d figure{ display: block; position: absolute; width: 110px; height: 95px; left: 10px; top: 10px; background: black; overflow: hidden; border: solid 5px black; } #carousel-3d figure:nth-child(1) { transform: rotateY(0deg) translateZ(288px);} #carousel-3d figure:nth-child(2) { transform: rotateY(60deg) translateZ(288px);} #carousel-3d figure:nth-child(3) { transform: rotateY(120deg) translateZ(288px);} #carousel-3d figure:nth-child(4) { transform: rotateY(180deg) translateZ(288px);} #carousel-3d figure:nth-child(5) { transform: rotateY(240deg) translateZ(288px);} #carousel-3d figure:nth-child(6) { transform: rotateY(300deg) translateZ(288px);} .img-3d{ -webkit-filter: grayscale(1); cursor: pointer; transition: all .5s ease; } .img-3d:hover{ -webkit-filter: grayscale(0); transform: scale(1.2,1.2); } @keyframes rotation{ from{ transform: rotateY(0deg); } to{ transform: rotateY(360deg); } }*/