/* * * ////////////////////////////////////////////////////////////////////////////////////////////////////// * * tablet landscape and portrait * */ @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape), only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) { .span10 nav#mainNav #navWrapper #navTable ul.firstLevel li a { font-size: 14px; } .span10 nav#mainNav #navWrapper #navTable ul.firstLevel li.dropdown ul.thirdLevel { display: none !important; } .visible-desktop { display: none !important; } .visible-tablet { display: block !important; } form#search-field .input-append { text-align: right; } .span10 nav#mainNav div.navbar .btn-navbar { display: block; margin-right: 0; margin-top: -10px; } .levelbadges figure { height: 90px; width: 90px; } #private_public_profil figure.avatar figcaption { opacity: 1; } .span10 .row-fluid section#content div#title { flex-direction: column; } .sorting-wrapper { margin-top: 10px; } } /* * * ////////////////////////////////////////////////////////////////////////////////////////////////////// * * tablet settings landscape * */ @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) { h1 { font-size: 30px; } h2 { font-size: 22px; margin: 0 0 10px 0; line-height: 28px; } h3 { font-size: 18px; margin: 0 0 10px 0; line-height: 21px; } h4 { font-size: 16px; margin: 0 0 10px 0; line-height: 21px; } h5 { font-size: 12px; margin: 0 0 5px 0; line-height: 21px; } .span10 header { height: 100px; } .span10 header .span3 nav#language { top: 5px; } .span10 header .span3 nav#language a { font-size: 13px; } .span10 header .span7 nav#meta li a { font-size: 11px; } .span10 nav#mainNav { margin-bottom: 22px; } .span10 nav#mainNav #navWrapper #navTable ul.firstLevel li a { font-size: 13px; } .span10 nav#mainNav div.navbar .btn-navbar { display: none; } .span10 nav#mainNav div.nav-collapse.collapse { height: auto; overflow: visible; } .span10 .row-fluid section#rightCol #myTourenguide { padding: 15px; margin-bottom: 22px; } .span10 .row-fluid section#rightCol #myTourenguide label { margin-bottom: 8px; font-size: 12px; } .span10 .row-fluid section#rightCol #myTourenguide form fieldset input[type="text"], input[type="password"] { font-size: 12px; } .span10 .row-fluid section#rightCol #myTourenguide button { font-size: 12px; padding: 4px 8px; } .span10 .row-fluid section#rightCol #myTourenguide a { font-size: 12px; } #tourenfinder { padding: 15px; margin-bottom: 22px; } #tourenfinder section#activities label { font-size: 12px; } #tourenfinder section#locations label { font-size: 12px; } #tourenfinder section#additional select { width: 100%; padding: 2px 4px; height: 24px; font-size: 12px; } #tourenfinder button { font-size: 12px; } .span10 .row-fluid section#rightCol div#booking { padding: 15px; margin-bottom: 22px; } .span10 .row-fluid section#rightCol div#booking form fieldset input[type="text"] { width: 100%; padding: 2px 0; font-size: 12px; } .span10 .row-fluid section#rightCol div#booking form fieldset select.day { font-size: 12px; padding: 5px 6px; } .span10 .row-fluid section#rightCol div#booking form fieldset select.month { font-size: 12px; padding: 5px 6px; } .span10 .row-fluid section#rightCol div#booking form fieldset label { font-size: 12px; } .span10 .row-fluid section#rightCol div#booking form fieldset button.btn.blue { font-size: 12px; } .span10 .row-fluid section#content div#slideshow { margin-bottom: 20px; } .span10 .row-fluid section#content div#slideshow .carousel-inner { height: 100%; } .span10 .row-fluid section#content div#slideshow a.carousel-control.left { background-position: 0 0; top: 110px; } .span10 .row-fluid section#content div#slideshow a.carousel-control.right { background-position: -30px 0; top: 110px; } .span10 .row-fluid section#content div#slideshow a.carousel-control.left:hover { background-position: 0 0; top: 110px; } .span10 .row-fluid section#content div#slideshow a.carousel-control.right:hover { background-position: -30px 0; top: 110px; } .span10 .row-fluid section#content div#slideshow .carousel-indicators-wrapper { bottom: 15px; } .span10 .row-fluid section#content div#slideshow ol.carousel-indicators li { border-radius: 4px 4px 4px 4px; width: 8px; height: 8px; } .span10 .row-fluid section#content div#slideshow .carousel-inner .item .carousel-caption { top: 110px; padding: 0 70px; } .span10 .row-fluid section#content div#slideshow .carousel-inner .item .carousel-caption h2 { line-height: 25px; font-size: 25px; } .span10 .row-fluid section#content div#slideshow .carousel-inner .item .carousel-caption p { font-size: 18px; line-height: 18px; } .span10 .row-fluid section#rightCol div.teaser_blank { width: 172px; font-size: 12px; padding: 15px; } .span10 .row-fluid section#content article section.textCol h4 { width: 200px; } .span10 .row-fluid section#content article section.textCol span.location { width: 300px; } .span10 .row-fluid section#content article section.textCol span { width: 300px; } #map { top: 0px; } #mapfinder { top: 20px; } .headerMap { top: 0px; } .backToTop { margin-left: 563px; } } /* * * ////////////////////////////////////////////////////////////////////////////////////////////////////// * * tablet settings portrait * */ @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait), only screen and (max-width: 979px) { .visible-desktop { display: none; } .hidden-tablet-portrait { display: none; } h1 { font-size: 30px; } h2 { font-size: 22px; margin: 0 0 10px 0; line-height: 28px; } h3 { font-size: 18px; margin: 0 0 10px 0; line-height: 21px; } h4 { font-size: 16px; margin: 0 0 10px 0; line-height: 21px; } h5 { font-size: 14px; margin: 0 0 5px 0; line-height: 21px; } .row-fluid .span10 { width: 100%; *width: 99.94680851063829%; } .span10 header { height: 100px; margin-top: 20px; } .span10 header .span3 nav#language { top: 5px; } .span10 header .span3 nav#language a { font-size: 13px; } .span10 header .span7 nav#meta li a { font-size: 11px; } .span10 header button { font-size: 13px; padding: 3px 8px; } .span10 nav#mainNav { margin-bottom: 22px; } .span10 nav#mainNav div.navbar .btn-navbar { display: none; } .span10 nav#mainNav div.nav-collapse.collapse { height: auto; overflow: visible; } .span10 nav#mainNav #navWrapper #navTable ul.firstLevel li a { font-size: 13px; } .span10 .row-fluid section#rightCol #myTourenguide { padding: 15px; margin-bottom: 22px; } .span10 .row-fluid section#rightCol #myTourenguide label { margin-bottom: 8px; font-size: 14px; } .span10 .row-fluid section#rightCol #myTourenguide form fieldset input[type="text"], input[type="password"] { padding: 2px 0; font-size: 14px; } .span10 .row-fluid section#rightCol #myTourenguide button { font-size: 14px; padding: 3px 8px; } .span10 .row-fluid section#rightCol #myTourenguide a { font-size: 14px; } #tourenfinder { padding: 15px; margin-bottom: 22px; } #tourenfinder section#activities label { font-size: 12px; } #tourenfinder section#locations label { font-size: 12px; } #tourenfinder section#additional select { width: 100%; padding: 2px 4px; height: 24px; font-size: 12px; } /* #tourenfinder #location_string.span10 { width: 80%; }*/ #tourenfinder button { font-size: 14px; padding: 3px 8px; } #tourenfinder button.location-search i { left: 20%; right: 80%; } #tourenfinder button { font-size: 12px; } .span10 .row-fluid section#rightCol div#booking { padding: 15px; margin-bottom: 22px; } .span10 .row-fluid section#rightCol div#booking form fieldset input[type="text"] { width: 100%; padding: 2px 0; font-size: 14px; } .span10 .row-fluid section#rightCol div#booking form fieldset select.day { font-size: 14px; padding: 5px 6px; } .span10 .row-fluid section#rightCol div#booking form fieldset select.month { font-size: 14px; padding: 5px 6px; } .span10 .row-fluid section#rightCol div#booking form fieldset label { font-size: 14px; } .span10 .row-fluid section#rightCol div#booking form fieldset button.btn.blue { font-size: 14px; padding: 3px 8px; } .span10 .row-fluid section#content div#slideshow { margin-bottom: 20px; } .span10 .row-fluid section#content div#slideshow .carousel-inner { height: 100%; } .span10 .row-fluid section#content div#slideshow a.carousel-control.left { background-position: 0 0; top: 100px; } .span10 .row-fluid section#content div#slideshow a.carousel-control.right { background-position: -30px 0; top: 100px; } .span10 .row-fluid section#content div#slideshow a.carousel-control.left:hover { background-position: 0 0; top: 100px; } .span10 .row-fluid section#content div#slideshow a.carousel-control.right:hover { background-position: -30px 0; top: 100px; } .span10 .row-fluid section#content div#slideshow .carousel-indicators-wrapper { bottom: 15px; } .span10 .row-fluid section#content div#slideshow ol.carousel-indicators li { border-radius: 4px 4px 4px 4px; width: 8px; height: 8px; } .span10 .row-fluid section#content div#slideshow .carousel-inner .item .carousel-caption { top: 110px; padding: 0 70px; } .span10 .row-fluid section#content div#slideshow .carousel-inner .item .carousel-caption h2 { line-height: 25px; font-size: 25px; } .span10 .row-fluid section#content div#slideshow .carousel-inner .item .carousel-caption p { font-size: 18px; line-height: 18px; } .span10 .row-fluid section#content article img.thumb { float: left; margin-right: 20px; padding-bottom: 5px; width: 160px; } .span10 .row-fluid section#content article img.user_image { width: 80px; } .span10 .row-fluid section#content .bodytext object.sf_weather { width: 503px; height: 308px; } footer .span12 #footerNav li { margin: 0; list-style: none; display: inline; } .span10 .row-fluid section#rightCol div.teaser_blank { width: 172px; font-size: 12px; padding: 15px; } .span10 .row-fluid section#content article section.textCol h4 { width: 200px; } .span10 .row-fluid section#content article section.textCol span.location { width: 300px; } .span10 .row-fluid section#content article section.textCol span { width: 100%; } /* .span10 .row-fluid section#content article section.textCol p { width: 480px; }*/ #map { top: 0px; } #mapfinder { top: 20px; } .headerMap nav#mainNav { margin-bottom: 0; } .headerMap nav#mainNav div.navbar .btn-navbar { display: none; } .headerMap nav#mainNav div.nav-collapse.collapse { height: auto; overflow: visible; } .headerMap nav#mainNav #navWrapper #navTable ul li a { font-size: 12px; } .headerMap { top: 0px; } .backToTop { margin-left: 678px; } form#search-field { margin-top: 15px; } .span10 header button { padding: 4px 8px; } .calendar_month article.infobox .infobox_icons .icons { top: -1px!important; } .calendar_month article.infobox .infobox_day { float: none; } .calendar_month article.infobox .infobox_text { padding: 0 20px; } .span10 .row-fluid section#content .bodytext .subscriptions { flex-wrap: wrap; margin: 20px 0; } .span10 .row-fluid section#content .bodytext .subscriptions .subscription { width: calc(50% - 20px); margin-bottom: 20px; padding: 0; } .span10 .row-fluid section#content .bodytext.subscription-template .subscriptions .subscription { width: 100%; margin-bottom: 20px; padding: 0; } .span10 .row-fluid section#content .bodytext .subscriptions .subscription:before, .span10 .row-fluid section#content .bodytext .subscriptions .subscription.blue:before { content: none; } #shop_modal.modal {} .span10 .row-fluid section#content #my-contact .button-wrapper { width: 100%; } article.infobox { padding: 20px; } article.infobox figure.image .img-placeholder { background-size: 25%; } article.infobox.fullsize { padding: 0; } #cookie-banner .button { padding: 10px; } } @media only screen and (max-width: 870px) { .container.map { display: none; } #map .leaflet-control-container { z-index: 1 } #map .leaflet-control-container .leaflet-right { position: absolute; right: 20px; } #map .leaflet-control-container .leaflet-top.leaflet-left { position: absolute; top: 0px; } #map .leaflet-control-layers-base span { vertical-align: middle; } #map input[type=radio].leaflet-control-layers-selector { height: 20px; width: 20px; } }