/* Document : _sass Created on : 25.05.2012, 15:42:40 Author : krampitz Description: Variables, Mixins */ .alert.alert-success h3, .alert.alert-success h4, .alert.alert-success h5, .alert.alert-success h6 { color: #468847; } .carousel-wrapper .carousel figure .imagecredits a { color: #fff; } table.table-bordered thead th a { color: #ffffff !important; } .ds-w20pct { width: 20%; } .ds-w80pct { width: 80%; } .ds-mb-30 { margin-bottom: 30px; } #bildungsservice .ds-pl-5 { padding-left: 5px; } #bildungsservice .ds-pr-5 { padding-right: 5px; } #bildungsservice .ds-w75 { width: 75px; } #bildungsservice .ds-black { color: #000; } #bildungsservice .ds-red { color: #e31519; } #bildungsservice .ds-audio-icon { background: url("/ds/img/basics/icon-audio.png") no-repeat 0 0; } #bildungsservice .ds-audio-icon-large { background: url("/ds/img/basics/icon-audio-large.gif") no-repeat 0 0; } #bildungsservice .ds-print-icon { background: url("/ds/img/basics/icon-print.png") no-repeat 0 0; min-height: 30px; } #bildungsservice .ds-zip-icon { background: url("/ds/img/basics/icon-zip.png") no-repeat 0 0; min-height: 33px; } #bildungsservice .ds-image-icon { background: url("/ds/img/basics/icon-image.png") no-repeat 0 0; } #bildungsservice .ds-image-icon-large { background: url("/ds/img/basics/icon-image-large.gif") no-repeat 0 0; } #bildungsservice .ds-table-icon { background: url("/ds/img/basics/icon-table.png") no-repeat 0 0; } #bildungsservice .ds-table-icon-large { background: url("/ds/img/basics/icon-table-large.gif") no-repeat 0 0; } #bildungsservice .ds-text-icon { background: url("/ds/img/basics/icon-text.png") no-repeat 0 0; } #bildungsservice .ds-text-icon-large { background: url("/ds/img/basics/icon-text-large.gif") no-repeat 0 0; } #bildungsservice .ds-pdf-icon { background: url("/ds/img/basics/icon-pdf.png") no-repeat 0 0; } #bildungsservice .ds-pdf-icon-large { background: url("/ds/img/basics/icon-pdf-large.gif") no-repeat 0 0; } #bildungsservice .ds-video-icon { background: url("/ds/img/basics/icon-video.png") no-repeat 0 0; } #bildungsservice .ds-video-icon-large { background: url("/ds/img/basics/icon-video-large.gif") no-repeat 0 0; } #bildungsservice .ds-dvd-icon { background: url("/ds/img/basics/icon-dvd.png") no-repeat 0 0; } #bildungsservice .ds-dvd-icon-large { background: url("/ds/img/basics/icon-dvd-large.gif") no-repeat 0 0; } #bildungsservice .ds-book-icon { background: url("/ds/img/basics/icon-book.png") no-repeat 0 0; } #bildungsservice .ds-book-icon-large { background: url("/ds/img/basics/icon-book-large.gif") no-repeat 0 0; } #bildungsservice .ds-ebook-icon { background: url("/ds/img/basics/icon-ebook.png") no-repeat 0 0; } #bildungsservice .ds-ebook-icon-large { background: url("/ds/img/basics/icon-ebook-large.gif") no-repeat 0 0; } #bildungsservice .ds-broschuere-icon-large { background: url("/ds/img/basics/icon-broschuere-large.gif") no-repeat 0 0; } #bildungsservice .ds-film-icon-large { background: url("/ds/img/basics/icon-film-large.gif") no-repeat 0 0; } #bildungsservice .ds-poster-icon-large { background: url("/ds/img/basics/icon-poster-large.gif") no-repeat 0 0; } #bildungsservice .ds-karte-icon-large { background: url("/ds/img/basics/icon-karte-large.gif") no-repeat 0 0; } #bildungsservice .ds-sammelmappe-icon-large { background: url("/ds/img/basics/icon-sammelmappe-large.gif") no-repeat 0 0; } #bildungsservice .ds-element { padding-left: 44px; } #bildungsservice .ds-element-large { padding-left: 104px; min-height: 90px; } #bildungsservice .ds-icon-title { display: block; height: 30px; left: 0; overflow: hidden; position: absolute; text-indent: -10000px; top: 0; width: 30px; } #bildungsservice .ds-icon-title-large { display: block; height: 90px; left: 0; overflow: hidden; position: absolute; text-indent: -10000px; top: 0; width: 90px; } #bildungsservice .ds-material h3 { position: relative; min-height: 30px; padding-left: 35px; } #parallelbericht .ds-ta-l { text-align: left; } #googlemap .infoBox { width: 310px; } #googlemap .infoBox p, #googlemap .infoBox h4, #googlemap .infoBox a { font-size: 13px; } #googlemap .infoBox p { line-height: 1.5em; margin-bottom: 10px; } #googlemap .infoBox .info-box { -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; -moz-box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.2); box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.2); background-color: #fff; border: 1px solid #9f9185; padding: 10px; } #googlemap .infoBox .info-box-beak { background: no-repeat url("/ds/img/map/beak.png") 0 0; height: 13px; width: 21px; z-index: 11; margin: -1px 0 0 142px; } #googlemap .rounded { overflow: hidden; } #googlemap-legende .row div.pull-left { padding-left: 15px; } #googlemap-legende .row div.pull-left img { margin-right: 10px; } #googlemap-legende .row div.pull-left p { padding-top: 2px; } .no-js .tab-pane.well h2 { display: block !important; } .no-js .googlemap-container { display: none; } .btn.white-space-normal { white-space: normal !important; } #inklusion-unibaukasten .fig-responsive { position: relative; } #inklusion-unibaukasten .fig-responsive .img-text { position: absolute; top: 0; right: 0; line-height: 1.5em; font-size: 1.2em; text-align: right; padding-top: 4em; } html.js #inklusion-unibaukasten #form-filter { padding-bottom: 5px; } html.js #inklusion-unibaukasten #form-filter .form-group.submit { display: none; } #carousel-profile blockquote { min-height: 3em; } form#umfrage-partnerpaket h3.has-error { background: url("/ds/img/basics/error.png") no-repeat scroll 0 1px transparent; padding-left: 30px !important; } #begegnungsboerse-suche .table th { background-color: transparent !important; border-bottom: 1px solid #ddd9d4; color: #000; font-weight: normal; padding-left: 20px; } #begegnungsboerse-suche .table td { background-color: transparent; border-bottom: 1px solid #ddd9d4; border-top: none; padding: 20px; } #begegnungsboerse-suche .table td h3 { margin-bottom: 0; } #begegnungsboerse-suche .form-horizontal h2 { padding-top: 5px; } #begegnungsboerse-suche .form-horizontal .form-group label { padding-right: 0; } #begegnungsboerse-suche .form-horizontal .form-group .has-error label { padding-right: 15px; } #begegnungsboerse-suche .form-horizontal .form-group.row { margin-bottom: 0; } @media screen and (max-width: 768px) { #begegnungsboerse-suche .form-horizontal .form-group.row { margin-bottom: 15px; } } #begegnungsboerse-detail .table td { background-color: transparent; border: none; border-bottom: 1px solid #ddd9d4; padding: 20px; } #begegnungsboerse-detail .table tr:first-child td { border-top: 1px solid #ddd9d4; } #begegnungsboerse-detail .table caption.h2 { color: #e31519; margin-bottom: 20px; } #begegnungsboerse-detail .fig-responsive.ds-teaser-1 img { width: 80%; float: right; margin: 2px 5px 10px 0; } #begegnungsboerse-detail .ds-mt { margin-top: 40px; } h1:empty { margin-bottom: 0; } .visible-xs + h1 { margin-top: 10px; } #bildungsservice { word-wrap: break-word; margin-bottom: 15px; } #bildungsservice .top-panel { overflow: hidden; } #bildungsservice a.link-tertiary { float: left; line-height: 25px; } #bildungsservice h1 { word-wrap: break-word; line-height: 1.3; } @media screen and (max-width: 767px) { #bildungsservice h1 { display: block; clear: both; } } #bildungsservice p { word-wrap: break-word; } #bildungsservice .warenkorb { position: relative; margin: 15px 0 10px; color: #e31519; float: right; } @media screen and (min-width: 768px) { #bildungsservice .warenkorb { margin: 0 0 20px; position: absolute; right: 15px; top: 0; } #bildungsservice .warenkorb.warenkorb-home { top: 8px; } } #bildungsservice .warenkorb a { font-family: "Arial Rounded Bold"; font-size: 16px; padding-left: 40px; } #bildungsservice .warenkorb a:before { font-family: 'am-iconfont'; content: "\e001"; position: absolute; top: -4px; left: 0; font-size: 24px; } #bildungsservice .warenkorb a span { font-family: Arial, sans-serif; } #bildungsservice > p { margin-bottom: 30px; } #bildungsservice .item { margin-bottom: 40px; } #bildungsservice .item .img-container { position: relative; overflow: hidden; margin-bottom: 10px; } @media screen and (min-width: 768px) { #bildungsservice .item .img-container { background-color: #f1efec; } } #bildungsservice .item .img-container img { display: block; margin: 0 auto; width: 100%; } @media screen and (min-width: 768px) { #bildungsservice .item .img-container:before { content: ''; display: block; padding-top: 141.43%; } #bildungsservice .item .img-container img { width: 100%; height: auto; position: absolute; top: 0; } } #bildungsservice .item h4 { margin-bottom: 0; } #bildungsservice .item p { margin-bottom: 10px; word-wrap: break-word; } #bildungsservice .item a { clear: both; display: block; margin-bottom: 0; } #bildungsservice .modal .modal-header h3 { color: #e31519; } #bildungsservice .modal .modal-body { overflow: hidden; padding-bottom: 0; } #bildungsservice .modal img { width: 150px; float: left; margin-bottom: 15px; margin-right: 15px; } @media screen and (min-width: 768px) { #bildungsservice .modal img { margin-bottom: 0; } } #bildungsservice .modal .product-data { float: left; width: 100%; } @media screen and (min-width: 768px) { #bildungsservice .modal .product-data { width: 470px; } } #bildungsservice .modal .product-data select { width: auto; padding: 6px 20px 6px 12px; margin-left: 5px; display: inline-block; } #bildungsservice .modal .product-data h4 { margin-bottom: 0; } #bildungsservice .modal button.close { padding: 15px 15px 10px 10px; top: -15px; right: -15px; position: relative; } #bildungsservice .modal-footer { text-align: left; } #bildungsservice .modal-footer .btn { float: right; } #bildungsservice .modal-footer p { margin-bottom: 0; } @media screen and (min-width: 768px) { #bildungsservice .modal-footer p { line-height: 36px; } } #bildungsservice .basketitem { margin-bottom: 0; } #bildungsservice .basketitem .col-1 { float: left; } #bildungsservice .basketitem .col-2 { float: right; } #bildungsservice .basketitem label { display: none; } #bildungsservice .basketitem select { float: left; width: auto; padding: 6px 20px 6px 12px; } @media screen and (min-width: 1024px) { #bildungsservice .basketitem select { float: none; margin-bottom: 10px; } } #bildungsservice .basketitem img { width: 100px; } @media (min-width: 1024px) { #bildungsservice .basketitem img { float: right; } } #bildungsservice .basketitem a.removebasketitem { float: right; line-height: 35px; display: block; margin-bottom: 0; } @media (min-width: 1024px) { #bildungsservice .basketitem a.removebasketitem { float: none; } } #bildungsservice .basketitem a.removebasketitem:before { content: "\e036"; font-size: 0.9em; } #bildungsservice .ds-zip-icon { display: table; height: 43px; background-position: 0 5px; line-height: 1.3; } #bildungsservice .ds-zip-icon p { margin: 0; display: table-cell; vertical-align: middle; } @media screen and (max-width: 767px) { #bildungsservice .ds-element-large a, #bildungsservice .ds-zip-icon a { display: block; clear: both; margin-top: 10px; } } @media screen and (min-width: 768px) { #bildungsservice .ds-element-large a, #bildungsservice .ds-zip-icon a { float: left; margin-right: 5px; } } #bildungsservice .mini-search { margin-bottom: 30px; } #bildungsservice .mini-search .input-container { padding-right: 45px; position: relative; margin-top: 10px; margin-bottom: 10px; } #bildungsservice .mini-search .btn { position: absolute; top: 0; right: 0; width: auto; padding: 6px 12px 6px 3px; } #bildungsservice .mini-search a { clear: both; display: block; margin-top: 15px; } #bildungsservice.didacta { margin-top: 10px; } #bildungsservice.didacta .item { margin-bottom: 15px; } #bildungsservice.didacta .item p { margin-bottom: 5px; } p.format img { position: relative; margin-right: 5px; top: 7px; } .btn-loading { height: 36px; } #caritas-cooperation { margin-bottom: 30px; } @media screen and (max-width: 767px) { #caritas-cooperation { padding-top: 14px; } } @media screen and (min-width: 768px) and (max-width: 1023px) { #caritas-cooperation { padding-top: 36px; } } #caritas-cooperation strong.red { color: #E31518; } #caritas-cooperation .ze041 .ds-content { top: inherit; bottom: 0; padding-top: 0; padding-bottom: 40px; } @media screen and (max-width: 767px) { #caritas-cooperation .ze041 .ds-content { padding-bottom: 0; padding-top: 10px; } } #caritas-cooperation .se005 figure img { min-height: 245px; } #caritas-cooperation .se005 figure > h2 { position: absolute; bottom: 15px; left: 35px; padding: 5px 0; -webkit-box-shadow: 10px 0 0 #fff,-10px 0 0 #fff; box-shadow: 10px 0 0 #fff,-10px 0 0 #fff; background-color: #fff; color: #000; } @media screen and (max-width: 767px) { #caritas-cooperation .se005 figure > h2 { position: static; display: block; border-bottom: 1px solid #ddd9d4; padding: 10px 0; } } #caritas-cooperation [class^="mainteaser-logo"], #caritas-cooperation [class*=" mainteaser-logo"] { position: absolute; display: block; z-index: 10; right: 15px; } #caritas-cooperation [class^="mainteaser-logo"].mainteaser-logo_akm, #caritas-cooperation [class*=" mainteaser-logo"].mainteaser-logo_akm { top: 25px; } #caritas-cooperation [class^="mainteaser-logo"].mainteaser-logo_akm span[data-picture] img, #caritas-cooperation [class*=" mainteaser-logo"].mainteaser-logo_akm span[data-picture] img { width: 246px; } #caritas-cooperation [class^="mainteaser-logo"].mainteaser-logo_caritas, #caritas-cooperation [class*=" mainteaser-logo"].mainteaser-logo_caritas { top: 157px; } #caritas-cooperation [class^="mainteaser-logo"].mainteaser-logo_caritas span[data-picture] img, #caritas-cooperation [class*=" mainteaser-logo"].mainteaser-logo_caritas span[data-picture] img { width: 86px; } #caritas-cooperation [class^="mainteaser-logo"] span[data-picture] img, #caritas-cooperation [class*=" mainteaser-logo"] span[data-picture] img { height: auto; } @media screen and (min-width: 768px) and (max-width: 1023px) { #caritas-cooperation [class^="mainteaser-logo"].mainteaser-logo_akm span[data-picture] img, #caritas-cooperation [class*=" mainteaser-logo"].mainteaser-logo_akm span[data-picture] img { width: 185px; } #caritas-cooperation [class^="mainteaser-logo"].mainteaser-logo_caritas, #caritas-cooperation [class*=" mainteaser-logo"].mainteaser-logo_caritas { top: 117px; } #caritas-cooperation [class^="mainteaser-logo"].mainteaser-logo_caritas span[data-picture] img, #caritas-cooperation [class*=" mainteaser-logo"].mainteaser-logo_caritas span[data-picture] img { width: 64px; } } @media screen and (max-width: 767px) { #caritas-cooperation [class^="mainteaser-logo"].mainteaser-logo_akm, #caritas-cooperation [class*=" mainteaser-logo"].mainteaser-logo_akm { top: 15px; left: inherit; right: 15px; } #caritas-cooperation [class^="mainteaser-logo"].mainteaser-logo_akm span[data-picture] img, #caritas-cooperation [class*=" mainteaser-logo"].mainteaser-logo_akm span[data-picture] img { width: 170px; } #caritas-cooperation [class^="mainteaser-logo"].mainteaser-logo_caritas, #caritas-cooperation [class*=" mainteaser-logo"].mainteaser-logo_caritas { top: 107px; bottom: inherit; } #caritas-cooperation [class^="mainteaser-logo"].mainteaser-logo_caritas span[data-picture] img, #caritas-cooperation [class*=" mainteaser-logo"].mainteaser-logo_caritas span[data-picture] img { width: 60px; } } @media screen and (max-width: 420px) { #caritas-cooperation [class^="mainteaser-logo"].mainteaser-logo_akm span[data-picture] img, #caritas-cooperation [class*=" mainteaser-logo"].mainteaser-logo_akm span[data-picture] img { width: 127px; } #caritas-cooperation [class^="mainteaser-logo"].mainteaser-logo_caritas, #caritas-cooperation [class*=" mainteaser-logo"].mainteaser-logo_caritas { top: 85px; bottom: inherit; } #caritas-cooperation [class^="mainteaser-logo"].mainteaser-logo_caritas span[data-picture] img, #caritas-cooperation [class*=" mainteaser-logo"].mainteaser-logo_caritas span[data-picture] img { width: 46px; } } #caritas-cooperation .caritas-backlinks a { float: right; margin: 10px 0; } #caritas-cooperation .caritas-backlinks a:first-child { float: left; } #caritas-cooperation #accordion-124 { position: fixed; z-index: 100; left: 0; right: 0; top: 0; } #caritas-cooperation #accordion-124 .arr { width: auto; height: auto; display: inline-block; } #caritas-cooperation #accordion-124 .arr:after { display: none; } #caritas-cooperation #accordion-124 .arr:before { margin-left: 6px; top: -2px; position: relative; } #caritas-cooperation #accordion-124 .centered { display: block; text-align: center; line-height: 16px; } #caritas-cooperation #accordion-124 .centered > span { color: #fff; } #caritas-cooperation #accordion-124 .accordion-body { margin-top: 0; } #caritas-cooperation #accordion-124 .accordion-toggle { height: 36px; padding-left: 0; padding-right: 0; } #caritas-cooperation #accordion-124 .accordion-toggle:after { display: none; } @media screen and (min-width: 1024px) { #caritas-cooperation #accordion-124 { display: none; } } @media only screen and (max-width: 1023px) and (min-width: 768px) { #caritas-cooperation .accordion { margin-bottom: 0; } } #caritas-cooperation .accordion:last-child { border: none; } #caritas-cooperation .accordion .panel-heading { background: none; } @media screen and (min-width: 320px) { #caritas-cooperation .accordion .panel-heading .accordion-toggle .arr:after { display: block; } } #caritas-cooperation .accordion .panel-heading .accordion-toggle .arr:after { right: inherit; left: 20px; } #caritas-cooperation .accordion .panel-heading h1.red a.text-primary, #caritas-cooperation .accordion .panel-heading h2.black a.text-primary { color: #6e5e50; line-height: 24px; padding-left: 20px; padding-bottom: 0; } #caritas-cooperation .accordion .panel-heading h1.red a.text-primary .arr, #caritas-cooperation .accordion .panel-heading h2.black a.text-primary .arr { margin-left: -20px; } #caritas-cooperation .accordion .panel-heading h1.red a.text-primary { color: #e31519; padding-left: 30px; } #caritas-cooperation .accordion .panel-heading h1.red a.text-primary .arr { margin-left: -30px; } #caritas-cooperation .accordion .panel-heading a.text-primary { line-height: 0; padding-left: 0; padding-bottom: 26px; } #caritas-cooperation .list-unstyled { margin-bottom: 16px; } #caritas-cooperation .list-unstyled a { padding-left: 20px; position: relative; display: inline-block; } #caritas-cooperation .list-unstyled a:before { position: absolute; top: 2px; left: 0; } #caritas-cooperation .icon.icon--black_red strong, #caritas-cooperation .icon.icon--black_red:before { color: #000; font-weight: 400; } #caritas-cooperation .table-calc { display: inline-block; width: auto; padding-bottom: 20px; } #caritas-cooperation .table-calc [rowspan] { vertical-align: middle; padding-right: 5px; } #caritas-cooperation .table-calc .table-calc--last-row { border-top: 2px solid #e31519; } #caritas-cooperation .table-calc .table-calc_col--bold { font-weight: 700; } #caritas-cooperation .table-calc .table-calc_col--align-right { text-align: right; padding-right: 10px; } #caritas-cooperation .table-calc td { vertical-align: top; line-height: 17px; } #caritas-cooperation .two-cols label { width: 50%; } #caritas-cooperation .two-cols label + div { width: 50%; } @media screen and (max-width: 767px) { #caritas-cooperation .two-cols label { width: 100%; } #caritas-cooperation .two-cols label + div { width: 100%; } } #caritas-cooperation .colorBox .icon { text-decoration: none; } #caritas-cooperation .colorBox .icon:hover > span, #caritas-cooperation .colorBox .icon:focus > span { text-decoration: underline; } #caritas-cooperation .colorBox .icon:hover:before, #caritas-cooperation .colorBox .icon:focus:before { text-decoration: none; } #caritas-cooperation .colorBox.colorBox--inlineBlock { display: inline-block; width: auto; } #caritas-cooperation .colorBox.colorBox--inlineBlock h3 + p { margin-bottom: 0; } #caritas-cooperation .equalheight-container .colorBox--grey p:nth-child(1) { margin-bottom: 0; } #caritas-cooperation .equalheight-container .colorBox--grey p:nth-child(2) span { padding-left: 24px; } #caritas-cooperation #webinar div.colorBox { padding-top: 10px; } #caritas-cooperation [data-jsinit=sticky-infobox].fixed { position: fixed; right: 40px; top: 0; } #caritas-cooperation .wrap_sticky-infobox { position: absolute; top: 0; left: 0; right: 0; padding: 0 15px; } @media screen and (max-width: 1023px) { #caritas-cooperation .wrap_sticky-infobox { display: none; } } #caritas-cooperation .mt-20 { margin-top: 20px; } #caritas-cooperation .mt-60 { margin-top: 60px; } #caritas-cooperation .mt--16 { margin-top: -16px; } #caritas-cooperation .ml-8 { margin-left: 8px; } #caritas-cooperation .destructer { width: 180px; height: 180px; -webkit-border-radius: 90px; -moz-border-radius: 90px; -ms-border-radius: 90px; -o-border-radius: 90px; border-radius: 90px; position: absolute; top: -30px; left: 15px; background-color: #5dc4e9; z-index: 20; } #caritas-cooperation .destructer > div { display: block; height: 84px; margin-top: -42px; position: absolute; top: 50%; left: 0; right: 0; text-align: center; -webkit-transform: rotate(-10deg); -ms-transform: rotate(-10deg); -o-transform: rotate(-10deg); transform: rotate(-10deg); } #caritas-cooperation .destructer > div a { color: #fff; } #caritas-cooperation .destructer > div a:hover, #caritas-cooperation .destructer > div a:focus { text-decoration: none; border: none; } #caritas-cooperation .destructer > div h2 { color: #000; font-size: 1.2em; line-height: 1.3em; } @media screen and (min-width: 768px) and (max-width: 1023px) { #caritas-cooperation .destructer { top: -19px; width: 150px; height: 150px; -webkit-border-radius: 75px; -moz-border-radius: 75px; -ms-border-radius: 75px; -o-border-radius: 75px; border-radius: 75px; } #caritas-cooperation .destructer > div { height: 86px; margin-top: -43px; } #caritas-cooperation .destructer > div h2 { font-size: 1.1em; line-height: 1.3em; } } @media screen and (max-width: 420px) { #caritas-cooperation .destructer { display: none; } } @media screen and (min-width: 768px) and (max-width: 1023px) { #caritas-cooperation .destructer { padding-top: 36px; } } #caritas-cooperation .newsletter-check { margin-bottom: 0; } #caritas-cooperation .newsletter-check + div.row p { padding-left: 20px; } #caritas-cooperation div.colorBox + h2 { margin-top: 40px !important; } #caritas-cooperation #webinar .colorBox .icon + span { color: #e31519; } #caritas-cooperation .switched-headlines { margin-top: 16px; } #caritas-cooperation .switched-headlines h1 { margin-bottom: 0; } #caritas-cooperation .switched-headlines h1 + p { margin-bottom: 14px; } a:hover, a:focus, button:hover, button:focus { outline: none; } #cityrating { margin-bottom: 0; } @media only screen and (max-width: 767px) { #cityrating input, #cityrating textarea { font-size: 16px; } } #cityrating .invisible { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; } #cityrating .thankyou { display: none; margin-top: -25px; } #cityrating .thankyou p { text-align: center; font-size: 24px; } @media only screen and (max-width: 767px) { #cityrating .thankyou p { margin-top: 25px; } } #cityrating .alert h3 { font-size: 1.071em; } #cityrating h1 { line-height: 1.15; font-size: 32px; hyphens: manual !important; -webkit-hyphens: manual !important; } @media only screen and (max-width: 767px) { #cityrating h1 { font-size: 24px; } } #cityrating h3 { font-family: "Arial Rounded Bold",Arial,Helvetica,sans-serif; font-size: 24px; color: #3e2f25; font-weight: 500; line-height: 1.15; } @media only screen and (min-width: 768px) { #cityrating h3 { font-size: 26px; } } #cityrating h3.red { color: #e31519; } #cityrating .teaser { position: relative; background-image: url("/ds/img/content/aktion/bewertungsaktion/teaser_mobile.jpg"); padding-top: 260px; background-size: auto 100%; background-position: center top; background-repeat: no-repeat; } @media only screen and (min-width: 768px) { #cityrating .teaser { height: 268px; padding-top: 0; background-image: url("/ds/img/content/aktion/bewertungsaktion/teaser_tablet.jpg"); } } @media only screen and (min-width: 1024px) { #cityrating .teaser { background-image: url("/ds/img/content/aktion/bewertungsaktion/teaser_desktop.jpg"); } } #cityrating .teaser .teaser-data { background: #fff; padding-top: 20px; } @media only screen and (min-width: 768px) { #cityrating .teaser .teaser-data { width: 530px; position: absolute; top: 20px; left: 20px; padding: 30px; background: rgba(255, 255, 255, 0.95); } } #cityrating .teaser .teaser-data p { margin-bottom: 10px; } @media only screen and (min-width: 768px) { #cityrating .teaser .teaser-data p { margin-bottom: 20px; } } #cityrating .teaser .teaser-data .teaser-circle { width: 140px; height: 140px; border-radius: 50%; background: #ffcd00; position: absolute; top: 40px; right: 10px; text-align: center; padding: 20px; transform: rotate(15deg); } @media only screen and (min-width: 768px) { #cityrating .teaser .teaser-data .teaser-circle { width: 200px; height: 200px; right: -140px; top: auto; padding: 40px 20px; bottom: 10px; } } #cityrating .teaser .teaser-data .teaser-circle span { font-family: "Arial Rounded Bold",Arial,Helvetica,sans-serif; margin-bottom: 5px; display: block; clear: both; font-size: 16px; line-height: 1.7; } #cityrating .teaser .teaser-data .teaser-circle span:first-child { font-size: 12px; } @media only screen and (min-width: 768px) { #cityrating .teaser .teaser-data .teaser-circle span { font-size: 24px; } #cityrating .teaser .teaser-data .teaser-circle span:first-child { font-size: 18px; } } #cityrating .intro-text { margin: 15px 0 20px; position: relative; } @media only screen and (min-width: 768px) { #cityrating .intro-text { margin: 35px 0 40px; } } #cityrating .intro-text h3 { margin-bottom: 15px; text-align: center; } @media only screen and (max-width: 767px) { #cityrating .intro-text h3 { font-size: 15px; text-align: left; } } #cityrating .intro-text p { margin-bottom: 0; } @media only screen and (min-width: 768px) { #cityrating .intro-text p { display: block; height: auto; } } #cityrating .intro-text .bg-left, #cityrating .intro-text .bg-right { width: 160px; height: 160px; } #cityrating .intro-text .bg-left { left: 0; top: 0; position: absolute; background: url("/ds/img/content/aktion/bewertungsaktion/intro-left.png") no-repeat; background-size: 100%; } #cityrating .intro-text .bg-right { right: 0; top: 0; position: absolute; background: url("/ds/img/content/aktion/bewertungsaktion/intro-right.png") no-repeat; } @media only screen and (max-width: 767px) { #cityrating .intro-text .text { border: 1px solid #ddd; background: #f6f5f3; padding: 15px; } } #cityrating .city { margin-bottom: 30px; } @media only screen and (min-width: 768px) { #cityrating .city { padding-top: 45px; margin-bottom: 40px; border-top: 1px solid #d0c9be; } } @media only screen and (min-width: 768px) { #cityrating .city .city-search { text-align: center; } } #cityrating .city .city-search h3 { line-height: 35px; margin-bottom: 15px; } @media only screen and (min-width: 768px) { #cityrating .city .city-search h3 { margin-bottom: 0; display: inline-block; float: right; } } #cityrating .city .city-search > .row > .col-sm-6 { padding: 0 7px; } #cityrating .suggest-form { position: relative; float: left; width: 100%; } @media only screen and (min-width: 768px) { #cityrating .suggest-form { width: 200px; } } #cityrating .suggest-form input { border-color: #aca094; width: 100%; line-height: 1; padding: 6px 12px; } #cityrating .suggest-form input ::-webkit-input-placeholder { color: #aca094; line-height: inherit; padding: 6px 12px; } #cityrating .suggest-form input :-moz-placeholder { color: #aca094; line-height: inherit; padding: 6px 12px; } #cityrating .suggest-form input ::-moz-placeholder { color: #aca094; line-height: inherit; padding: 6px 12px; } #cityrating .suggest-form input :-ms-input-placeholder { color: #aca094; line-height: inherit; padding: 6px 12px; } #cityrating .suggest-form .scroll-box { max-height: 240px; overflow-y: scroll; position: absolute; z-index: 9; top: 34px; left: 0; min-width: 100%; background: #fff; border-bottom: 1px solid #888; display: none; } #cityrating .suggest-form .city-suggest { text-align: left; list-style-type: none; display: none; padding: 0; margin: 0; border: 1px solid #ccc; } #cityrating .suggest-form .city-suggest li { cursor: pointer; border-bottom: 1px solid #ccc; padding: 13px 10px 12px; background: #fff; font-size: 14px; line-height: 14px; transition: background 0.15s cubic-bezier(0.4, 0.01, 0.165, 0.99); } #cityrating .suggest-form .city-suggest li:last-child { border-bottom: 0; } #cityrating .suggest-form .city-suggest li.hover { background: #eee; } #cityrating .city-info { margin-top: 40px; margin-bottom: 50px; display: none; opacity: 0.2; } @media only screen and (max-width: 767px) { #cityrating .city-info .city-data { margin-bottom: 20px; } #cityrating .city-info .city-data .circle { width: 190px; height: 190px; padding-top: 0; } } #cityrating .city-data { text-align: center; } #cityrating .city-data a:hover, #cityrating .city-data a:focus { text-decoration: none; } #cityrating .city-data div { display: block; clear: both; font-size: 17px; font-family: "Arial Rounded Bold",Arial,Helvetica,sans-serif; color: #000; } @media only screen and (min-width: 768px) { #cityrating .city-data div { font-size: 28px; line-height: 1.1; font-weight: 500; } } #cityrating .city-data div.red { color: #e31519; margin-bottom: 10px; } #cityrating .city-data .btn { margin-top: 20px; } #cityrating .carousel-container { background: #f6f5f2; } #cityrating .carousel-container h4 { color: #000; font-weight: normal; font-size: 17px; padding: 10px 0; margin: 0 25px; border-bottom: 1px solid #d0c9be; font-family: "Arial Rounded Bold",Arial,Helvetica,sans-serif; } @media only screen and (min-width: 768px) { #cityrating .carousel-container h4 { margin: 0 30px; text-align: center; font-size: 25px; } } #cityrating .carousel-controls { position: absolute; bottom: -50px; left: 0; width: 100%; } #cityrating .carousel-indicators { bottom: -45px; color: #8c7b71; font-weight: bold; font-size: 14px; line-height: 24px; } #cityrating #cityrating-carousel { padding: 10px 30px 25px; } #cityrating #cityrating-carousel .name { font-family: "Arial Rounded Bold",Arial,Helvetica,sans-serif; font-weight: 500; color: #E31519; font-size: 20px; margin-bottom: 5px; } #cityrating #cityrating-carousel .carousel-inner { margin-bottom: 0; } @media only screen and (min-width: 768px) { #cityrating #cityrating-carousel .carousel-inner .item { height: 195px !important; } } #cityrating #cityrating-carousel .carousel-control { outline: none !important; } #cityrating #cityrating-carousel.touch-carousel { padding: 0; margin-top: 15px; } #cityrating #cityrating-carousel.touch-carousel .carousel-indicators { bottom: 10px; top: auto !important; } #cityrating #cityrating-carousel.touch-carousel h4 { margin: 10px 20px; } #cityrating #cityrating-carousel.touch-carousel .item > * { padding: 0 30px 20px; } #cityrating #cityrating-carousel p:last-child { margin-bottom: 0; } #cityrating .no-comments { display: none; padding: 20px; } @media only screen and (min-width: 768px) { #cityrating .no-comments { padding: 20px 30px; height: 280px; } #cityrating .no-comments a { margin-top: 5px; margin-bottom: 20px; } } #cityrating .no-comments img { width: 100%; } #cityrating .circle { border-radius: 50%; margin: 0 auto 20px; transition: background 0.35s cubic-bezier(0.4, 0.01, 0.165, 0.99); } #cityrating .circle span { transition: all 0.35s cubic-bezier(0.4, 0.01, 0.165, 0.99); display: block; text-align: center; background: url("/ds/img/basics/arrow.png"); background-repeat: no-repeat; background-position: 50% 50%; width: 100%; height: 100%; } @media only screen and (max-width: 767px) { #cityrating .circle { width: 120px; height: 120px; position: relative; } #cityrating .circle span { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } #cityrating .circle span:before { position: absolute; font-size: 16px; top: 50%; left: 50%; margin-top: -10px; margin-left: -13px; line-height: 1; } } @media only screen and (min-width: 768px) { #cityrating .circle { width: 190px; height: 190px; } } #cityrating .circle.bg-1 { background: #f69700; } #cityrating .circle.bg-2 { background: #ffcc00; } #cityrating .circle.bg-3 { background: #9ec83c; } #cityrating .circle.empty { background: #f69700; } #cityrating .circle.empty span { background: none; } #cityrating .circle.empty span:before { content: "\e00f"; font-size: 60px; font-family: 'am-iconfont'; text-align: center; line-height: 190px; } @media only screen and (max-width: 767px) { #cityrating .circle.empty span:before { line-height: 1; margin-left: -13.5px; margin-top: -20px; } } #cityrating .other-cities { text-align: center; padding-top: 20px; border-top: 1px solid #d0c9be; } @media only screen and (min-width: 768px) { #cityrating .other-cities { padding-top: 40px; margin-bottom: 40px; } } #cityrating .other-cities h3 { margin-bottom: 20px; } @media only screen and (min-width: 768px) { #cityrating .other-cities h3 { margin-bottom: 40px; } } #cityrating .other-cities .btn { margin-top: 10px; } @media only screen and (min-width: 768px) { #cityrating .other-cities .btn { margin-top: 50px; } } #cityrating .other-cities .row > div { padding-bottom: 10px; } @media only screen and (min-width: 768px) { #cityrating .other-cities .row > div { padding-bottom: 25px; } } #cityrating .other-cities .row > div.randomcity-2 { border-left: 1px solid #d0c9be; } @media only screen and (min-width: 768px) { #cityrating .other-cities .row > div.randomcity-2 { border-right: 1px solid #d0c9be; } } #cityrating .other-cities .circle { margin: 15px auto; } @media only screen and (min-width: 768px) { #cityrating .other-cities .circle { margin: 30px auto; } } @media only screen and (max-width: 767px) { #cityrating .other-cities .circle span { background-size: 50%; } } #cityrating #teilnahmebedingungen-modal .modal-dialog { width: auto; } @media only screen and (min-width: 768px) { #cityrating #teilnahmebedingungen-modal .modal-dialog { width: 750px; } } @media only screen and (min-width: 1024px) { #cityrating #teilnahmebedingungen-modal .modal-dialog { width: 1000px; } } #cityrating #teilnahmebedingungen-modal .inner-content { padding: 20px 20px 0; max-height: 405px; overflow-y: scroll; } #cityrating #teilnahmebedingungen-modal .inner-content h4 { font-size: 24px; } #cityrating #teilnahmebedingungen-modal ol { margin-top: 16px; } #cityrating #teilnahmebedingungen-modal ol li { list-style-type: none; margin-bottom: 16px; } #cityrating.rate-city form { padding: 15px 20px; } #cityrating.rate-city form .formteaser { background: url("/ds/img/content/aktion/bewertungsaktion/rateform_bg.jpg") no-repeat; padding-top: 220px; background-size: auto 220px; background-position: center top; margin-bottom: 20px; position: relative; } @media only screen and (min-width: 768px) { #cityrating.rate-city form .formteaser { margin-bottom: 30px; } } #cityrating.rate-city form .formteaser .teaser-circle { width: 140px; height: 140px; border-radius: 50%; background: #ffcd00; position: absolute; top: 40px; right: 20px; text-align: center; padding: 25px 10px; transform: rotate(15deg); } @media only screen and (min-width: 768px) { #cityrating.rate-city form .formteaser .teaser-circle { width: 200px; height: 200px; padding: 45px 20px; top: 10px; } } #cityrating.rate-city form .formteaser .teaser-circle span { font-family: "Arial Rounded Bold",Arial,Helvetica,sans-serif; margin-bottom: 5px; display: block; clear: both; font-size: 18px; line-height: 1.4; } #cityrating.rate-city form .formteaser .teaser-circle span:nth-of-type(2) { font-size: 14px; } @media only screen and (min-width: 768px) { #cityrating.rate-city form .formteaser .teaser-circle span { font-size: 24px; } #cityrating.rate-city form .formteaser .teaser-circle span:nth-of-type(2) { font-size: 18px; } } #cityrating.rate-city .suggest-form { max-width: 300px; width: 100%; } @media only screen and (min-width: 768px) { #cityrating.rate-city .suggest-form { width: 300px; } } #cityrating.rate-city .comment-form label { hyphens: none; } @media only screen and (max-width: 767px) { #cityrating.rate-city .comment-form label:after { right: 15px; } } @media only screen and (min-width: 768px) { #cityrating.rate-city .comment-form label { text-align: right; } } #cityrating .top10 { text-align: center; margin-bottom: 30px; } #cityrating .top10 span { font-family: "Arial Rounded Bold",Arial,Helvetica,sans-serif; font-size: 16px; line-height: 18px; font-weight: 400; color: #6e5e50; margin-top: 5px; margin-bottom: 0; transition: color .3s linear; display: block; } #cityrating .top10 a { display: inline-block; } #cityrating .top10 a:hover, #cityrating .top10 a:focus { text-decoration: none; } #cityrating .top10 a:hover p { color: #e31519; } #cityrating .top10 img { width: 32px; } .cityrating-news h2 { margin-bottom: 25px; } #top10-modal .inner-content { padding: 20px 20px 0; } #top10-modal h4 { font-size: 1.55em; font-family: "Arial Rounded Bold",Arial,Helvetica,sans-serif; font-weight: 400; } #top10-modal ul { padding: 0; } #top10-modal ul li { list-style-type: none; border-bottom: 1px solid #eee; display: table; width: 100%; padding: 5px 0; } #top10-modal ul li:last-child { border-bottom: none; } #top10-modal ul li > div { display: table-cell; } #top10-modal ul li > div:first-child { width: 30px; } #top10-modal ul li > div:last-child { width: 40%; text-align: right; vertical-align: middle; } #top10-modal ul li > div span { line-height: 30px; } #top10-modal ul li .top10-rating { position: relative; } @media only screen and (max-width: 767px) { #top10-modal ul li .top10-rating { width: 100% !important; } } @media only screen and (min-width: 768px) { #top10-modal ul li .top10-rating { height: 30px; float: right; display: block; } #top10-modal ul li .top10-rating.bg-1 { background: #f69700; } #top10-modal ul li .top10-rating.bg-2 { background: #ffcc00; } #top10-modal ul li .top10-rating.bg-3 { background: #9ec83c; } } @media only screen and (min-width: 768px) { #top10-modal ul li .top10-rating span { top: 0; left: -40px; width: 35px; position: absolute; } } #top10-modal a { line-height: 36px; } .rating-result { text-align: center; font-size: 20px; } @media only screen and (max-width: 767px) { .rating-result { margin-top: 15px; } } .rating-result span { font-weight: bold; } /* Functional styling These styles are required for noUiSlider to function. You don't need to change these rules to apply your design. */ .noUi-target, .noUi-target * { -webkit-touch-callout: none; -webkit-user-select: none; -ms-touch-action: none; -ms-user-select: none; -moz-user-select: none; -moz-box-sizing: border-box; box-sizing: border-box; } .noUi-target { position: relative; } .noUi-base { height: 100%; position: relative; right: -1px; margin: 0 10px; } .noUi-origin { position: absolute; right: 0; top: 0; left: 0; bottom: 0; } .noUi-handle { position: relative; z-index: 1; } .noUi-stacking .noUi-handle { /* This class is applied to the lower origin when its values is > 50%. */ z-index: 10; } .noUi-stacking + .noUi-origin { /* Fix stacking order in IE7, which incorrectly creates a new context for the origins. */ *z-index: -1; } .noUi-state-tap .noUi-origin { -webkit-transition: left 0.3s, top 0.3s; transition: left 0.3s, top 0.3s; } .noUi-state-drag * { cursor: inherit !important; } /* Painting and performance; Browsers can paint handles in their own layer. */ .noUi-base { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } /* Slider size and handle placement; */ .noUi-horizontal { height: 18px; } .noUi-horizontal .noUi-handle { width: 34px; height: 28px; left: -17px; top: -6px; } .noUi-vertical { width: 18px; } .noUi-vertical .noUi-handle { width: 28px; height: 34px; left: -6px; top: -17px; } /* Styling; */ .noUi-background { background: #FAFAFA; box-shadow: inset 0 1px 1px #f0f0f0; } .noUi-connect { background: #3FB8AF; box-shadow: inset 0 0 3px rgba(51, 51, 51, 0.45); -webkit-transition: background 450ms; transition: background 450ms; } .noUi-origin { border-radius: 2px; } .noUi-target { border-radius: 4px; border: 1px solid #D3D3D3; box-shadow: inset 0 1px 1px #F0F0F0, 0 3px 6px -5px #BBB; } .noUi-target.noUi-connect { box-shadow: inset 0 0 3px rgba(51, 51, 51, 0.45), 0 3px 6px -5px #BBB; } /* Handles and cursors; */ .noUi-dragable { cursor: w-resize; } .noUi-vertical .noUi-dragable { cursor: n-resize; } .noUi-handle { border: 1px solid #D9D9D9; border-radius: 3px; background: #FFF; cursor: default; box-shadow: inset 0 0 1px #FFF, inset 0 1px 7px #EBEBEB, 0 3px 6px -3px #BBB; } .noUi-active { box-shadow: inset 0 0 1px #FFF, inset 0 1px 7px #DDD, 0 3px 6px -3px #BBB; } /* Handle stripes; */ .noUi-handle:before, .noUi-handle:after { content: ""; display: block; position: absolute; height: 14px; width: 1px; background: #E8E7E6; left: 14px; top: 6px; } .noUi-handle:after { left: 17px; } .noUi-vertical .noUi-handle:before, .noUi-vertical .noUi-handle:after { width: 14px; height: 1px; left: 6px; top: 14px; } .noUi-vertical .noUi-handle:after { top: 17px; } /* Disabled state; */ [disabled].noUi-connect, [disabled] .noUi-connect { background: #B8B8B8; } [disabled] .noUi-handle { cursor: not-allowed; } /* Base; */ .noUi-pips, .noUi-pips * { -moz-box-sizing: border-box; box-sizing: border-box; } .noUi-pips { position: absolute; font: 400 12px Arial; color: #999; } /* Values; */ .noUi-value { width: 40px; position: absolute; text-align: center; font-size: 14px; color: #000; } .noUi-value-sub { color: #ccc; font-size: 10px; } /* Markings; */ .noUi-marker { position: absolute; background: #CCC; } .noUi-marker-sub { background: #AAA; } .noUi-marker-large { background: #AAA; } /* Horizontal layout; */ .noUi-pips-horizontal { padding: 10px 0; height: 50px; top: 100%; left: 0; width: 100%; } .noUi-value-horizontal { margin-left: -20px; padding-top: 20px; } .noUi-value-horizontal.noUi-value-sub { padding-top: 15px; } .noUi-marker-horizontal.noUi-marker { margin-left: -1px; width: 2px; height: 5px; } .noUi-marker-horizontal.noUi-marker-sub { height: 10px; } .noUi-marker-horizontal.noUi-marker-large { height: 15px; } /* Vertical layout; */ .noUi-pips-vertical { padding: 0 10px; height: 100%; top: 0; left: 100%; } .noUi-value-vertical { width: 15px; margin-left: 20px; margin-top: -5px; } .noUi-marker-vertical.noUi-marker { width: 5px; height: 2px; margin-top: -1px; } .noUi-marker-vertical.noUi-marker-sub { width: 10px; } .noUi-marker-vertical.noUi-marker-large { width: 15px; } .rating { max-width: 299px; top: -15px; position: relative; left: 1px; } #rating-slider { height: 11px; top: 5px; left: 0px; margin-bottom: 45px; box-shadow: none; border: none; border-radius: 15px; background: #005f45; } @media only screen and (max-width: 767px) { #rating-slider { width: 100%; max-width: 300px; margin-bottom: 65px; } } #rating-slider .noUi-background { background: #005f45; } #rating-slider .noUi-pips-horizontal { left: 0; top: auto; padding: 0; height: auto; bottom: -8px; border: solid transparent; border-width: 0 10px 0 10px; } @media only screen and (max-width: 767px) { #rating-slider .noUi-pips-horizontal { bottom: -11px; } } #rating-slider .noUi-marker-horizontal.noUi-marker { width: 1px; } #rating-slider .noUi-marker-horizontal.noUi-marker.noUi-marker-normal { background: #000; height: 7px; } #rating-slider .noUi-marker-horizontal.noUi-marker.noUi-marker-large { background: #000; height: 9px; } #rating-slider .noUi-origin { background: #d0c9bf; border: none; border-radius: 15px; margin-right: -10px; } #rating-slider .label { position: absolute; color: #000000; top: 15px; left: -4px; } @media only screen and (max-width: 767px) { #rating-slider .label { top: 32px; left: 0px; } } #rating-slider .label.max { left: auto; right: -6px; text-align: right; } @media only screen and (max-width: 767px) { #rating-slider .label.max { right: 0; } } #rating-slider .label.max:before { left: 37px; } #rating-slider .noUi-handle { background: #e31519; border: 3px solid #fff; border-radius: 50%; box-shadow: none; width: 23px; height: 23px; top: -7px; left: -12px; } #rating-slider .noUi-handle:after, #rating-slider .noUi-handle:before { background: none; } #rating-slider .noUi-handle, #rating-slider .noUi-handle:focus { outline: none !important; } #rating-slider .noUi-handle:focus { border: 4px solid #fff; background: #e31519; }