/* ============================================================================= Modules Style 11.05.2018 Clara ========================================================================== */ h1, h2, h3, h4, .tabelle table tr:first-child td, #libcontent p strong {font-family: 'Josefin Slab', serif;} h1, h2, h3 { text-align: center; font-weight: 400; font-size: 70px; line-height: 70px; color: #5b5d60; margin: 50px 0 30px 0; } h1 > span, h2 > span, h3 > span { display: block; font-weight: 700; font-size: 21px; line-height: 27px; letter-spacing: 1px; color: #d5312d; margin: 10px 0; } h4 { text-align: center; font-weight: 700; font-size: 30px; line-height: 35px; color: #5b5d60; margin: 10px 0; } h4 > span { display: block; font-weight: 700; font-size: 20px; line-height: 20px; letter-spacing: 0; color: #d5312d; margin: 10px 0 0; } hr { border-top: 0; background: url('../media/clara-trenner.svg') center center no-repeat transparent; background-size: auto 45px; min-height: 45px; margin-top: 80px; } .textitem { text-align: center; margin: 0 0 50px 0; padding: 0; } .textbtn { text-align: center; margin: 40px 0; } .textbtn > a.btn { margin: 0 10px 10px 10px; min-width: 260px; } .panel-default > .panel-heading { padding: 0; border: 0; border-radius: 0; background: transparent; } .panel-group { margin: 0; } .panel-group .panel { border: 0; border-radius: 0; } .panel-default { box-shadow: none; } h3.panel-title { text-align: left; font-weight: 700; color: #d5312d; font-size: 30px; line-height: 30px; border-top: 1px solid #a4a8aa; } section .panel-group:last-child { border-bottom: 1px solid #a4a8aa; } .panel-default > .panel-heading a { color: #5b5d60; display: block; text-decoration: none; padding: 20px 0; } .panel-default > .panel-heading a span.mehr, .panel-default > .panel-heading a span.weniger { display: inline-block; float: right; width: auto; color: #d5312d !important; font-size: 15px; font-weight: 700; padding: 0 30px; } .panel-default > .panel-heading a span.mehr { display: none; background: url('../media/plus.svg') right center no-repeat transparent; background-size: 20px auto; } .panel-default > .panel-heading a span.weniger { background: url('../media/minus.svg') right center no-repeat transparent; background-size: 20px 20px; } .panel-default > .panel-heading a.collapsed span.mehr { display: inline-block; } .panel-default > .panel-heading a.collapsed span.weniger { display: none; } .panel-default > .panel-heading a.collapsed, .panel-default > .panel-heading a.collapsed span { color: #5b5d60; } .panel-default > .panel-heading a:hover, .panel-default > .panel-heading a:hover span { color: #d5312d; } .panel-group .panel-heading + .panel-collapse > .list-group, .panel-group .panel-heading + .panel-collapse > .panel-body { border: 0; padding: 15px 0; } .panel-body .textitem { text-align: left; } .panel-body .textbtn { text-align: left; margin: 20px 0; } .panel-body img { max-width: 100%; height: auto; padding-left: 40px; } .carousel { background: transparent; position: relative; margin: 0 0 50px 0; } .carousel .item { } .carousel-inner > .item > img, .carousel-inner > .item > a > img { float: none; width: 100%; height: auto; } .carousel-indicators { bottom: auto; top: 100%; padding-top: 15px; text-align: center; } .carousel-indicators li, .carousel-indicators li.active { background: #a4a8aa; border: 0; height: 12px; width: 12px; border-radius: 50%; padding: 0; margin: 0 3px; } .carousel-indicators li.active { background: #d5312d;} .termin { float: left; width: 50%; padding: 0 10px 20px 10px; text-align: center; } .termin .termin-header { border-radius: 16px 16px 0 0; background: #a4a8aa; color: #fff; font-size: 18px; font-weight: 500; padding: 5px; } .termin .termin-body { border-radius: 0; background: #f5f6f6; padding: 15px 15px 0; } .termin .termin-link { border-radius: 0 0 16px 16px; background: #f5f6f6; padding: 15px; } .termin .termin-link .textbtn {margin: 0; padding: 15px 0; } #libcover { display: none; } html.mitlib, body.mitlib { height: 100%; overflow: visible; } body.mitlib #libcover { display: block; z-index: 300; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: #000; /* background: rgba(100,100,115,0.8); */ } body.mitlib #libclose { position: fixed; top: 0; left: auto; right: 30px; bottom: auto; height: 45px; width: 45px; cursor: pointer; background: url('../media/clara-close.svg') top center no-repeat transparent; background-size: contain; } body.mitlib #libcontent { position: fixed; top: 60px; left: 50px; right: 50px; bottom: 50px; background: #fff; overflow-y: auto; text-align: center; padding: 30px; } #libcontent p { padding-bottom: 30px; } #libcontent .reservierungshinweistext p {padding-bottom: 0px;} #libcontent p strong { color: #d5312d; font-weight: bold; font-size: 25px; line-height: 30px; } .tabelle table { border: 0 !important; width: auto !important; margin: 0 auto; } .tabelle table > tbody > tr > td { width: auto !important; height: auto !important; text-align: left; padding: 5px 0 5px 60px; } .tabelle table > tbody > tr > td:first-child { padding-left: 0; } .tabelle table > tbody > tr:first-child > td { width: auto !important; height: auto !important; text-align: left; font-weight: bold; color: #d5312d; } .table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th { border: 0;} .table > tbody > tr > td { border-bottom: 1px solid #a4a8aa; } /* ============================================================================= PC and Tablet Style ========================================================================== */ @media only screen and (min-width:768px){ .textitem.zweispalten { text-align: left; column-count: 2; column-gap: 50px; } .halbelinkespalte .einzelbild { margin-left: -40%; } .halberechtespalte .einzelbild { margin-right: -40%; } } /* ============================================================================= Smartphone Style ========================================================================== */ @media only screen and (max-width:767px){ h1, h2, h3 { font-size: 45px; line-height: 50px; } h1 span, h2 span, h3 span { font-size: 18px; line-height: 23px; } .termin { float: none; width: 100%; padding: 0 0 20px 0; } .panel-default > .panel-heading a span.mehr span, .panel-default > .panel-heading a span.weniger span { display: none; } .panel-default > .panel-heading a span.mehr, .panel-default > .panel-heading a span.weniger { width: 30px; padding: 30px 30px 0 0; } .panel-default > .panel-heading a span.mehr, .panel-default > .panel-heading a span.weniger { background-size: 30px 30px; } h3.panel-title { font-size: 20px; line-height: 30px; } } @media only screen and (max-width:580px){ .textbtn > a.btn { margin: 10px 0; min-width: 100%; max-width: 100%; } body.mitlib #libcontent { left: 0; right: 0; bottom: 0; padding: 20px; } } @media only screen and (max-width:767px) and (orientation: portrait) { .einzelbild { margin-left: -30%; margin-right: -30%; } } /* ============================================================================= Druckversion ========================================================================== */ @media only print { body.mitlib header { display: none; } body.mitlib .introbild { display: none; } body.mitlib #wrap { display: none; } body.mitlib footer { display: none !important; } body.mitlib #libcover, #libcover { display: block; z-index: 300; position: relative; background: #fff; } #libclose { display: none !important; } body.mitlib #libcontent, #libcontent { position: relative; top: 50px; left: 0; right: 0; bottom: auto; background: #fff; overflow: auto; } #libcontent .btn-default { display: none; } body.mitlib #libcontent, body.mitlib #libcontent p { font-size: 0.8em; } }