/* ============================================================================= * reset & defaults * ========================================================================== */ /* --reset ------------------------------------------------- */ html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section, menu, time, mark, audio, video {margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;} #wrapper * {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box;} ol, ul {list-style: none;} table {border-spacing: 0;} html {-webkit-font-smoothing: antialiased;} article, aside, figure, footer, header, hgroup, nav, section {display:block;} nav ul {list-style:none;} a {margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent;} table {border-collapse:collapse; border-spacing:0;} input, select {vertical-align:middle;} input[type="radio"] {vertical-align: text-bottom;} input[type="checkbox"] {vertical-align: bottom; *vertical-align: baseline;} .clear,#clear{height:0.1px;font-size:0.1px;line-height:0.1px;clear:both} /* --float classes ------------------------------------------------- */ .float-left {float: left;} .float-right {float: right;} /* --lightbox link height ------------------------------------------------- */ figure a {line-height: 0;} /* --lightbox width ------------------------------------------------- */ #mbCenter img {width: auto; max-width: 100%; height: auto; vertical-align: middle;} /* --clearings + defaults ------------------------------------------------- */ .inside{position:relative;text-align:left} .block{overflow:hidden} .clear,#clear{height:0.1px;font-size:0.1px;line-height:0.1px;clear:both} .invisible{width:0;height:0;left:-1000px;top:-1000px;position:absolute;overflow:hidden;display:inline} .custom{display:block;text-align:left} .custom:after{content:".";display:block;height:0;clear:both;visibility:hidden} *+html #main{position:static} header,footer,nav,section,aside,article,figure,figcaption{display:block} #container:after, #header:after {content: "\0020"; display: block; height: 0; clear: both; visibility: hidden;} /* ============================================================================= * COLUMNS FOR BETTER CONTENT SEPARATION - RESPONSIVE * ========================================================================== */ .full {overflow: hidden; margin-left: 0; width:100%; float:left; position:relative;} .one_half {overflow: hidden; margin-left: 4%; width:48%; float:left; position:relative;} .one_third {overflow: hidden; margin-left: 5%; width:30%; float:left; position:relative;} .two_third {overflow: hidden; margin-left: 5%; width:65%; float:left; position:relative;} .one_fourth {overflow: hidden; margin-left: 4%; width:22%; float:left; position:relative;} .two_fourth {overflow: hidden; margin-left: 4%; width:48%; float:left; position:relative;} .three_fourth {overflow: hidden; margin-left: 4%; width:74%; float:left; position:relative;} .one_fifth {overflow: hidden; margin-left: 5%; width:16%; float:left; position:relative;} .two_fifth {overflow: hidden; margin-left: 4%; width:37%; float:left; position:relative;} .three_fifth {overflow: hidden; margin-left: 4%; width:57%; float:left; position:relative;} .four_fifth {overflow: hidden; margin-left: 4%; width:79%; float:left; position:relative;} .one_sixth {overflow: hidden; margin-left: 4%; width:13%; float:left; position:relative;} .two_sixth {overflow: hidden; margin-left: 5%; width:30%; float:left; position:relative;} .three_sixth {overflow: hidden; margin-left: 4%; width:48%; float:left; position:relative;} .four_sixth {overflow: hidden; margin-left: 5%; width:65%; float:left; position:relative;} .five_sixth {overflow: hidden; margin-left: 4%; width:83%; float:left; position:relative;} .full.first, .one_half.first, .one_third.first, .two_third.first, .one_fourth.first, .two_fourth.first, .three_fourth.first, .one_fifth.first, .two_fifth.first, .three_fifth.first, .four_fifth.first, .one_sixth.first, .two_sixth.first, .three_sixth.first, .four_sixth.first, .five_sixth.first { margin-left: 0!important; clear: left;} /* ============================================================================= * BASICS * ========================================================================== */ #container {clear: both; margin: 0 auto; position: relative;} a {text-decoration: none;} p {margin-bottom: 15px;} blockquote {font-style: italic; font-size: 16px; margin-bottom: 20px;} blockquote p {line-height: 22px;} iframe {max-width: 100%;} #container figure img {width: 100%;} code, pre {font-family: monospace;} hr {padding: 0; border: none; border-top: medium double #ddd; color: #ccc; text-align: center; height: 1px; margin: 25px 0;} img {max-width: 100%;} h1, h2, h3, h4, h5, h6 {padding: 0.75em 0 0.2em; line-height: 1.6;} h1 {font-size: 30px; margin-bottom: 0.4em; padding: 0 0 0.1em 0;} h2 {font-size: 22px;} h3 {font-size: 20px;} h4 {font-size: 18px;} h5 {font-size: 13px;} h6 {font-size: 12px;} #top-container .inside, #header .inside, #container-inside, #footer .inside, #container .inside {max-width: 1200px; width: 100%; margin: 0 auto; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;} #wrapper {width: 100%;} .content-gallery .row1 {overflow: hidden; margin-left: 0; width:100%; float:left; margin-bottom: 15px;} .content-gallery .row2 {overflow: hidden; margin-left: 4%; width:48%; float:left; margin-bottom: 15px;} .content-gallery .row3 {overflow: hidden; margin-left: 5%; width:30%; float:left; margin-bottom: 15px;} .content-gallery .row4 {overflow: hidden; margin-left: 4%; width:22%; float:left; margin-bottom: 15px;} .content-gallery .row5 {overflow: hidden; margin-left: 5%; width:16%; float:left; margin-bottom: 15px;} .content-gallery .row6 {overflow: hidden; margin-left: 2%; width:15%; float:left; margin-bottom: 15px;} .content-gallery .row7 {overflow: hidden; margin-left: 1.5%; width:13%; float:left; margin-bottom: 15px;} .content-gallery .row8 {overflow: hidden; margin-left: 1.71%; width:11%; float:left; position:relative;} .content-gallery .row9 {overflow: hidden; margin-left: 1.25%; width:10%; float:left; position:relative;} .content-gallery .row10 {overflow: hidden; margin-left: 1%; width:9.1%; float:left; position:relative;} .content-gallery .row11 {overflow: hidden; margin-left: 1.1%; width:8.09%; float:left; position:relative;} .content-gallery .row12 {overflow: hidden; margin-left: 1%; width: 7.41%; float:left; position:relative;} .content-gallery li:first-child {margin-left: 0!important; clear: both;} .content-gallery img {width: 100%; display: block; height: auto;} .content-gallery li a img:hover {-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; opacity:.5;} .content-gallery li a img {-webkit-transition:all .2s ease-in-out; -o-transition:all .2s ease-in-out; -moz-transition:all .2s ease-in-out; transition:all .2s ease-in-out;} .content-gallery .caption {letter-spacing: 0; word-spacing: 0; font-size: 12px; line-height: 16px;} .content-gallery.image-border img {border: 1px solid #ddd;} .content-gallery.opacity img {-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; opacity: 0.7;} .content-gallery.opacity img:hover {-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; opacity: 1;} figure {position: relative; padding: 0; margin-bottom: 10px;} figure img {width: 100%; display: block; height: auto;} .content-text ul, .content-list ul, .content-text ol, .content-list ol {margin-bottom: 15px;} .content-text li, .content-list li, .content-text ol, .content-list ol {line-height: 1.5em;} .content-text ol, .content-list ol {list-style: decimal; padding-left: 25px;} .content-text ol ol, .content-list ol ol {list-style: upper-alpha;} .content-text ol ol ol, .content-list ol ol ol {list-style: lower-roman;} label.error {color: red;} input.error {border: 1px solid red;} p.error {color: red; clear: both;} #footer .inside {padding: 20px 0; overflow: hidden;} /* ============================================================================= * MEDIA QUERIES * ========================================================================== */ /* --tablets ------------------------------------------------- */ @media only screen and (max-width: 1200px) { /* body */ body {padding: 0;} body.header {background: none!important;} /* width */ #header .inside, #footer .inside, #container .inside {width: 100%!important; padding-left: 20px; padding-right: 20px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;} #container {width: 100%;} #container-inside {width: 100%!important;; padding: 0 20px;} } /* --phones ------------------------------------------------- */ @media only screen and (max-width: 767px) { /* body */ body {padding: 0;} /* wrapper */ #wrapper {width: 100%;} /* image_container */ figure {margin-bottom: 10px; width: 100%; padding: 0; margin: 0 0 10px 0; float: none;} /* content-text */ .content-text {margin-bottom: 10px!important; width: 100%;} /* disable webkit text size adjust (for iPhone) */ html {-webkit-text-size-adjust: none;} /* css-framework */ .full, .one_half, .one_third, .two_third, .one_fourth, .two_fourth, .three_fourth, .one_fifth, .two_fifth, .three_fifth, .four_fifth {width: 100%; margin: 0 0 15px 0;} #footer .one_sixth {width: 100%; margin: 0 0 15px 0;} /* extension subcolumns */ .c20r, .c25r, .c33r, .c40r, .c38r, .c50r, .c60r, .c66r, .c62r, .c75r, .c80r, .c15r, .c16r, .c30r, .c45r, .c55r, .c70r, .c85r, .c20l, .c25l, .c33l, .c40l, .c38l, .c50l, .c60l, .c66l, .c62l, .c75l, .c80l, .c15l, .c16l, .c30l, .c45l, .c55l, .c70l, .c85l {float: none; width: 100%; padding: 0; margin: 0;} .subcr, .subcl, .subc {padding: 0!important;} /* content-gallery */ .content-gallery .row2, .content-gallery .row3, .content-gallery .row4, .content-gallery .row5, .content-gallery .row6, .content-gallery .row7, .content-gallery .row8, .content-gallery .row9, .content-gallery .row10, .content-gallery .row11, .content-gallery .row12 { width: 100%; margin-left: 0;} /* headlines */ h1 {font-size: 24px; margin-bottom: 15px;} h2 {font-size: 20px; margin-bottom: 15px;} h3 {font-size: 18px; margin-bottom: 10px;} h4 {font-size: 16px; margin-bottom: 10px;} h5 {font-size: 13px; margin-bottom: 10px;} h6 {font-size: 12px; margin-bottom: 10px;} } /* ----------------------------- */ /* 2025 - Contao-Upgrade */ /* ----------------------------- */ .mt0 {margin-top: 0rem} .mb0 {margin-bottom: 0rem} .mt1 {margin-top: .8rem} .mb1 {margin-bottom: .8rem} .mt2 {margin-top: 1.6rem} .mb2 {margin-bottom: 1.6rem} .mt3 {margin-top: 2.4rem} .mb3 {margin-bottom: 2.4rem} .mt4 {margin-top: 3.2rem} .mb4 {margin-bottom: 3.2rem} .mt5 {margin-top: 4rem} .mb5 {margin-bottom: 4rem} .mt6 {margin-top: 4.8rem} .mb6 {margin-bottom: 4.8rem} .mt7 {margin-top: 5.6rem} .mb7 {margin-bottom: 5.6rem} .mt8 {margin-top: 6.4rem} .mb8 {margin-bottom: 6.4rem} .mt9 {margin-top: 7.2rem} .mb9 {margin-bottom: 7.2rem} .mt10 {margin-top: 8rem} .mb10 {margin-bottom: 8rem} @media print,screen and (min-width: 40em) { .mt0 {margin-top: 0rem} .mb0 {margin-bottom: 0rem} .mt1 {margin-top: 1rem} .mb1 {margin-bottom: 1rem} .mt2 {margin-top: 2rem} .mb2 {margin-bottom: 2rem} .mt3 {margin-top: 3rem} .mb3 {margin-bottom: 3rem} .mt4 {margin-top: 4rem} .mb4 {margin-bottom: 4rem} .mt5 {margin-top: 5rem} .mb5 {margin-bottom: 5rem} .mt6 {margin-top: 6rem} .mb6 {margin-bottom: 6rem} .mt7 {margin-top: 7rem} .mb7 {margin-bottom: 7rem} .mt8 {margin-top: 8rem} .mb8 {margin-bottom: 8rem} .mt9 {margin-top: 9rem} .mb9 {margin-bottom: 9rem} .mt10 {margin-top: 10rem} .mb10 {margin-bottom: 10rem} }