/* (c) 2013 webdecker.de author: webdecker.de, www.webdecker.de date: 2013-03-05 */ /* -------------------------------------- */ /* Basics, reset */ /* -------------------------------------- */ body { background-color: #e8e8dd; background-color: #e8e8e8; background-color: #fff; color: #000; font-family: 'EB Garamond', Trebuchet MS, Verdana, Arial, sans-serif; font-size: 20px; line-height: 28px; padding: 0; margin: 0; } input, select, option, textarea { font-family: 'EB Garamond', Trebuchet MS, Verdana, Arial, sans-serif; } div,h1,h2,h3,h4,h5,h6,p,blockquote,pre,code,ol,ul,li,dl,dt,dd,figure,table,th,td,form,fieldset,legend,input,textarea { margin: 0; padding: 0; } table { border-spacing: 0; border-collapse: collapse; } caption, th, td { text-align: left; vertical-align: top; } abbr, acronym { font-variant: normal; border-bottom: 1px dotted #444444; cursor:help; } blockquote, q { quotes: none; } fieldset, img { border:0; } ul { list-style-type: none; } sup { vertical-align: text-top; } sub { vertical-align: text-bottom; } del { text-decoration: line-through; } ins { text-decoration: none; } p { display: block; position: relative; padding-bottom: 12px; } figure { display: block; position: relative; } div, section, aside, nav { display: block; position: relative; box-sizing: border-box; } img { max-width: 100%; height: auto; } figure img { width: 100%; max-width: none; display: block; position: relative; box-sizing: border-box; } figure a { display: block; position: relative; box-sizing: border-box; } /* -------------------------------------- */ /* Layout */ /* -------------------------------------- */ #header .inside { width: 1000px; margin: 0 auto 0 auto; padding-left: 20px; padding-right: 20px; } #addhead > .inside { width: 1000px; margin: 0 auto 0 auto; padding-left: 20px; padding-right: 20px; } #container > .inside { width: 1000px; margin: 0 auto 0 auto; padding-top: 30px; padding-left: 20px; padding-right: 20px; } #footer .inside { width: 1000px; margin: 0 auto 0 auto; padding-left: 20px; padding-right: 20px; } #main { float: left; width: 600px; } #main .inside { padding-right: 20px; } #right { float: left; width: 360px; } .onecol #main { width: 100%; } .onecol #main .inside { padding-right: 0; } .onecol #right { display: none; } #header { position: relative; width: 100%; padding-top: 30px; } #header #line { border: 0; border-bottom: 1px solid #999999; width: 100%; position: absolute; bottom: 0; left: 0; margin: 0; padding: 0; height: 0px; } #logo { text-align: center; } #logo a, #logo img { display: inline-block; } #logo img { max-width: 400px; margin-top: -20px; margin-bottom: -0px; } #slogan { text-align: center; padding: 5px 0 20px 0; font-size: 16px; clear: both; } #addhead { padding-top: 20px; padding-bottom: 10px; width: 100%; background-color: #fcfcf8; background-color: #fff; background-color: #eee; border-bottom: 1px solid #999; } .start #addhead { padding-top: 32px; } #container { clear: both; position: relative; width: 100%; padding-bottom: 40px; background-color: #fcfcf8; background-color: #fff; } #footer { clear: both; padding-bottom: 200px; width: 100%; border-top: 1px solid #999999; background: #eee; } #copy { padding-top: 15px; padding-right: 60px; float: left; } #nav_imprint_menu { float: right; } /* -------------------------------------- */ /* Tags */ /* -------------------------------------- */ h1, h2, h3, h4, h5 { padding: 5px 0 20px 0; /* font-weight: normal; text-transform: uppercase; */ } /* font-family: Courier New, Courier New, monospace; */ h1 { font-size: 200%; line-height: 130%; } h2 { font-size: 150%; line-height: 130%; } h3 { font-size: 130%; line-height: 130%; } h4 { font-size: 110%; line-height: 130%; } h5 { font-size: 110%; line-height: 130%; } /* .start h1 { margin-top: 32px; } */ a { color: #888; text-decoration: none; } /* color: #775544; color: CF1C1C E14B4B E07070 999999 */ a:hover { text-decoration: none; } #container a { padding-left: 20px; background: transparent url(../img/sprite-right.png) -6px -97px no-repeat; overflow: hidden; color: #884444; } #container a:hover { background-position: -6px -197px; color: #AE0F0F; } #container a:active { background-position: -6px -0px; color: #CF1C1C; } #container .mod_newslist a { display: inline-block; vertical-align: bottom; } #addhead a:hover { color: #AE0F0F; } #addhead nav a { padding-left: 20px; background: transparent url(../img/sprite-right.png) -6px -97px no-repeat; overflow: hidden; color: #000; font-size: 80%; display: inline-block; } #addhead nav a:hover { background-position: -6px -197px; color: #AE0F0F; } #addhead nav a.active { background-position: -6px -197px; color: #CF1C1C; color: #AE0F0F; } #addhead .ce_text a { padding-left: 20px; background: transparent url(../img/sprite-right.png) -6px -97px no-repeat; overflow: hidden; color: #884444; } #addhead .ce_text a:hover { background-position: -6px -197px; color: #AE0F0F; } #addhead .ce_text a:active { background-position: -6px -0px; color: #CF1C1C; } #container h2 a { display: block; padding-left: 24px; background: transparent url(../img/sprite-right.png) -6px -92px no-repeat; overflow: hidden; color: #884444; } #container h2 a:hover { background-position: -6px -192px; color: #AE0F0F; } #container h2 a:active { background-position: -6px -0px; color: #CF1C1C; } #container h3 a { padding-left: 20px; background: transparent url(../img/sprite-right.png) -6px -92px no-repeat; overflow: hidden; color: #884444; } #container h3 a:hover { background-position: -6px -192px; color: #AE0F0F; } #container h3 a:active { background-position: -6px -0px; color: #CF1C1C; } #container h1 a { color: #000; } #container h1 a:hover { color: #AE0F0F; } #container h2 a { color: #000; } #container h2 a:hover { color: #AE0F0F; } #container .ce_image a { padding-left: 0; background: transparent; } #container .ce_image img { border: 1px solid #eeeeee; } #container .ce_gallery img { border: 1px solid #eeeeee; } #addhead img, #container img { border: 1px solid #eeeeee; -webkit-border-radius: 8px 8px 8px 8px; -moz-border-radius: 8px 8px 8px 8px; border-radius: 8px 8px 8px 8px; } #addhead img { border: 1px solid #888; } #wrapper #logo img { border: 0; } /* #addhead a { padding-left: 20px; background: transparent url(../img/sprite-right.png) -6px -97px no-repeat; overflow: hidden; color: #444444; font-size: 80%; display: inline-block; } #addhead a:hover { background-position: -6px -197px; color: #AE0F0F; } #addhead a.active { background-position: -6px -197px; color: #CF1C1C; color: #AE0F0F; } */ #wrapper a.cms_edit { padding-left: 0; background: none; } .printblock { display: none; } .printinline { display: none; } .screenblock { display: block; } .screeninline { display: inline; } .clear { clear: both; } body#top div .invisible { display: none; } table.standard, .ce_table.standard table { width: 100%; } table.standard td, .ce_table.standard table td { padding: 10px 10px 10px 0; } /* -------------------------------------- */ /* Menu */ /* -------------------------------------- */ #nav_main_menu { text-align: center; } #nav_main_menu ul { display: inline-block; } #header .nav ul.level_2 { display: none; } #header .nav li { display: inline-block; vertical-align: top; min-height: 0; background-color: transparent; margin-left: 2px; margin-right: 2px; } .ie7 #header .nav li { display: inline; } .ie6 #header .nav li { display: inline; } #header .nav li a { font-size: 90%; display: block; text-align: center; position: relative; color: #000; padding: 8px 20px 6px 20px; border: 1px solid transparent; /* border-bottom: 1px solid #999999; */ -webkit-border-radius: 5px 5px 0 0; -moz-border-radius: 5px 5px 0 0; border-radius: 5px 5px 0 0; behavior: url(/webdecker/PIE/PIE.htc); text-decoration: none; color: #888; transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; } #header .nav li a:hover, #header .nav li.active a, #header .nav li.trail a { color: #000; color: #AE0F0F; border: 1px solid #999999; border-bottom: 1px solid #fcfcf8; } #header .nav li a:hover, #header .nav li.active a, #header .nav li.trail a { background-color: #fcfcf8; background-color: #fff; } #header .nav li a:hover, #header .nav li.active a, #header .nav li.trail a { background-color: #eee; border-bottom: 1px solid #eee; } /* background-color: #eee; border-bottom: 1px solid #eee; */ #addhead .mod_navigation { padding-bottom: 10px; clear: both; position: relative; border-bottom: 1px solid #999999; margin-bottom: 20px; } #addhead .mod_navigation ul { display: block; position: relative; } /* border-bottom: 1px solid #999999; */ #addhead .mod_navigation li { display: inline; } #addhead .mod_navigation a { display: inline-block; position: relative; margin: 0 10px 0 0px; } #addhead .mod_navigation a.active, #addhead .mod_navigation a.trail { background-position: -6px -297px; color: #000; color: #AE0F0F; } #imprint_menu { padding-top: 15px; float:left; } #imprint_menu li { float: left; padding-right: 15px; } #imprint_menu li a:hover { color: #AE0F0F; } #imprint_menu li a:active { color: #333333; } #momenu_o { float: right; margin-bottom: 12px; } #momenu_o:after { display: block; clear: both; content: ""; font-size: 0; line-height: 0; height: 0px; } #momenu_o a { float: right; padding-top: 10px; } .momenu { display: none; } /* mobile off menu */ div#momenu_wrapper { background: #000; } #momenu_wrapper nav { padding-top: 24px; padding-bottom: 24px; } #momenu_wrapper ul { list-style: none; margin: 0; padding: 0; } #momenu_wrapper ul.level_1 { border-bottom: 1px solid #666666; } #momenu_wrapper li { list-style: none; margin: 0; padding: 0; border-top: 1px solid #666666; } #momenu_wrapper li.last { } #momenu_wrapper li a { display: block; padding: 6px 0 6px 0; color: #f8f8f0; } #momenu_wrapper li li a { padding-left: 20px; } #momenu_wrapper li a.trail, #momenu_wrapper li a.active, #momenu_wrapper li a:hover { color: #DE4F4F; } #momenu_wrapper .close.bottom { display: none; } #momenu_wrapper .close { float: right; display: block; display: none; box-sizing: border-box; background: transparent; width: 32px; height: 32px; text-align: center; padding: 3px 4px 0 4px; border: 1px solid #dddddd; } #momenu_wrapper .close span { display: block; font-weight: bold; font-size: 32px; line-height: 22px; color: #dddddd; } #momenu_wrapper .logo { margin-top: 12px; background: #f8f8f0; padding: 10px; text-align: center; } #momenu_nav_main_menu { clear: both; padding-top: 12px; } .mod_breadcrumb { margin: 0; padding: 0 0 0 0; display: block; overflow: hidden; text-align: right; color: #999; font-size: 80%; } #top .mod_breadcrumb ol { list-style: none; margin: 0; padding: 0; display: inline-block; overflow: hidden; } #top .mod_breadcrumb li { list-style: none; margin: 0; padding: 0 0 0 0; float: left; } #top .mod_breadcrumb li a:after { content: '/'; display: inline-block; padding: 0 6px 0 6px; } #top .mod_breadcrumb li:last-child a:after { content: ''; } #top .mod_breadcrumb li a { padding: 0; background: none; color: #999; } .start .mod_breadcrumb { display: none; } /* -------------------------------------- */ /* Wrappers */ /* -------------------------------------- */ .wrapper { overflow: hidden; } .wrapper > .inside { overflow: hidden; } #wrapper .col4:after { display: block; clear: both; content: ""; font-size: 0; line-height: 0; } #wrapper .col4 > .inside { margin-left: -12px; margin-right: -12px; } #wrapper .col4 > .inside > div { width: calc(25% - 24px); float: left; margin-left: 12px; margin-right: 12px; margin-bottom: 24px; box-sizing: border-box; } #wrapper .col4 > .inside > div:nth-child(4n+1) { clear: both; } #wrapper .col3:after { display: block; clear: both; content: ""; font-size: 0; line-height: 0; } #wrapper .col3 > .inside { margin-left: -12px; margin-right: -12px; } #wrapper .col3 > .inside > div { width: calc(33.333% - 24px); float: left; margin-left: 12px; margin-right: 12px; margin-bottom: 24px; box-sizing: border-box; } #wrapper .col3 > .inside > div:nth-child(3n+1) { clear: both; } #wrapper .col2 { overflow: hidden; } #wrapper .col2:after { display: block; clear: both; content: ""; font-size: 0; line-height: 0; } #wrapper .col2 > .inside { margin-left: -12px; margin-right: -12px; } #wrapper .col2 > .inside > div { width: calc(50% - 24px); float: left; margin-left: 12px; margin-right: 12px; margin-bottom: 24px; box-sizing: border-box; } #wrapper .col2 > .inside > div:nth-child(odd) { clear: both; } .equal > .inside { display: flex; flex-wrap: wrap; align-items: stretch; justify-content: flex-start; margin: 0 -12px 0 -12px; } /* parallax */ .parallax h1 { color: #fff; } .parallax h2 { color: #fff; } .parallax p { color: #fff; } .parallax > .inside { min-height: 300px; } .parallax.h500 > .inside { min-height: 500px; } /* sliding, parallax */ .sliding .parallax > .inside { height: 500px; } .sliding .parallax > .inside > .block { height: 100%; } .sliding .parallax > .inside > .block > .inside { position: absolute; bottom: 44px; left: 0; min-width: 300px; max-width: 400px; border: 1px solid #f8f8f0; padding: 24px 32px 32px 32px; background-color: rgba(0,0,0,0.4); } /* -------------------------------------- */ /* Akkordeon */ /* -------------------------------------- */ .akkordeon { clear: both; margin-bottom: 30px; overflow: hidden; background-color: #e8e8dd; background-color: #e8e8e8; padding: 30px 30px 25px 30px; border: 1px solid #999999; -webkit-border-radius: 8px 8px 8px 8px; -moz-border-radius: 8px 8px 8px 8px; border-radius: 8px 8px 8px 8px; behavior: url(/webdecker/PIE/PIE.htc); } .akkordeon .trigger h1 { padding-left: 20px; background: transparent url(../img/sprite-down.png) -6px -90px no-repeat; overflow: hidden; color: #333333; } .akkordeon.hover .trigger h1 { background-position: -6px -90px; color: #AE0F0F; } .akkordeon.active .trigger h1 { background: transparent url(../img/sprite-up.png) -6px -190px no-repeat; } .akkordeon .trigger h1:hover { background-position: -6px -190px; } .akkordeon.active.hover .trigger h1 { background-position: -6px -190px; color: #AE0F0F; } .akkordeon .trigger h2 { padding-left: 20px; background: transparent url(../img/sprite-down.png) -6px -92px no-repeat; overflow: hidden; color: #333333; } .akkordeon.hover .trigger h2 { background-position: -6px -92px; color: #AE0F0F; } .akkordeon.active .trigger h2 { background: transparent url(../img/sprite-up.png) -6px -192px no-repeat; } .akkordeon .trigger h2:hover { background-position: -6px -192px; } .akkordeon.active.hover .trigger h2 { background-position: -6px -192px; color: #AE0F0F; } #wrapper .akkordeon .close a { background: transparent url(../img/sprite-up.png) -6px -94px no-repeat; color: transparent; color: #e8e8dd; height: 16px; } #wrapper .akkordeon .close a:hover { background-position: -6px -194px; color: transparent; color: #e8e8dd; } .akkordeon .content .inner { padding-top: 20px; } .greyblock { clear: both; margin-bottom: 30px; overflow: hidden; background-color: #e8e8dd; background-color: #e8e8e8; padding: 30px 30px 25px 30px; border: 1px solid #999999; -webkit-border-radius: 8px 8px 8px 8px; -moz-border-radius: 8px 8px 8px 8px; border-radius: 8px 8px 8px 8px; } .whiteblock { clear: both; margin-bottom: 30px; overflow: hidden; background-color: #fff; padding: 30px 30px 25px 30px; border: 1px solid #999999; -webkit-border-radius: 8px 8px 8px 8px; -moz-border-radius: 8px 8px 8px 8px; border-radius: 8px 8px 8px 8px; } /* -------------------------------------- */ /* Slide shows */ /* -------------------------------------- */ .sliding { position: relative; overflow: hidden; padding: 30px; border: 1px solid #999999; -webkit-border-radius: 8px 8px 8px 8px; -moz-border-radius: 8px 8px 8px 8px; border-radius: 8px 8px 8px 8px; behavior: url(/webdecker/PIE/PIE.htc); height: 0; background-color: #f8f8f0; } .start .sliding { background-color: #e8e8dd; background-color: #e8e8e8; } #wrapper .sliding .controls { display: block; position: relative; } #wrapper .sliding .controls span.pagi { display: inline-block; position: relative; overflow: hidden; } #wrapper .sliding .controls a { } #wrapper .sliding .controls a b { font-weight: normal; margin-top: -2px; } #wrapper .sliding .controls a.pagi { padding-right: 15px; } #wrapper .sliding .controls a.pagi.active { color: #AE0F0F; } #wrapper .sliding .controls a.navi { background: none; display: inline-block; padding: 0px 5px 0 5px; font-size: 30px; line-height: 30px; margin-bottom: -3px; } #wrapper .sliding .controls a.navi.prev { padding-left: 0; } #wrapper .sliding .controls a.navi.next { padding-right: 0; } /* -------------------------------------- */ /* References */ /* -------------------------------------- */ /* references */ .ce_reference_list { padding-bottom: 50px; } #wrapper .ce_reference_list ul { list-style-type: none; margin-left: 0; } .ce_reference_list .list > li { clear: both; padding-top: 20px; padding-bottom: 20px; } .ce_reference_list .img { width: 200px; height: 200px; float: left; } .ce_reference_list li .content { margin-left: 220px; } .ce_reference_list li .teaser { margin-bottom: 20px; } .ce_reference_list a.website { padding-right: 20px; } .reference .title { font-weight: bold; color: #AE0F0F; } .reference .subtitle { color: #AE0F0F; } .ce_reference_teaser div.img { width: 200px; float: right; margin-left: 20px; padding-bottom: 10px; } .ce_reference_teaser div.links { margin-bottom: 12px; } .ce_reference_story div.img { width: 200px; float: right; margin-left: 20px; padding-bottom: 10px; } .ce_reference_story div.fromto { margin-bottom: 30px; } .ce_reference_story div.links { margin-bottom: 30px; } .ce_reference_story div.keywords { margin-bottom: 30px; } .ce_reference_story div.sectors { margin-bottom: 30px; } .ce_reference_story div.activities { margin-bottom: 30px; } .ce_reference_story div.subtitle { margin-bottom: 12px; } /* .ce_reference_teaser > div { margin-left: 220px; } .ce_reference_teaser div.img { margin-left: 0px; width: 220px; float: left; } */ #wrapper .ce_gallery ul { margin-left: 0; list-style-type: none; } #wrapper .ce_gallery ul a { padding-left: 0; background: transparent; } .ce_gallery { margin-top: 15px; margin-bottom: 15px; } .ce_gallery ul { margin-left: -12px; margin-right: -12px; overflow: hidden; } #container .ce_gallery li { display: block; position: relative; float: left; vertical-align: top; text-align: center; padding: 0 12px 24px 12px; width: 33.33%; box-sizing: border-box; } .ce_gallery li:nth-child(3n+1) { clear: both; } .ce_gallery figure { display: block; width: 100%; } .ce_gallery img { display: block; position: relative; width: 100%; height: auto; } #wrapper .reference .ce_gallery li { width: 62px; height: 62px; padding: 0 12px 12px 0; } #wrapper .reference .ce_gallery li:nth-child(3n+1) { clear: none; } .ce_reference_slider .slide { margin: 0; padding: 0; display: block; width: 10%; float: left; box-sizing: border-box; padding: 4px; } .ce_reference_slider .slide img { display: block; } #wrapper .ce_reference_slider .slide a { padding-left: 0; background: none; } /* -------------------------------------- */ /* Forms */ /* -------------------------------------- */ #main form { background-color: #e8e8dd; background-color: #e8e8e8; padding: 30px; border: 1px solid #999999; -webkit-border-radius: 8px 8px 8px 8px; -moz-border-radius: 8px 8px 8px 8px; border-radius: 8px 8px 8px 8px; behavior: url(/webdecker/PIE/PIE.htc); overflow: hidden; } fieldset { border: 0; padding: 0; margin: 0; } legend { padding: 0; margin: 0; } label { display: block; padding-bottom: 4px; } option { padding: 2px; } .error { color: #AE0F0F; } input, textarea, select { border: 1px solid #999999; padding: 2px; color: #646464; margin-bottom: 2px; position: relative; } select, option { line-height: 100%; } select { min-width: 150px; } .stylish.selected { min-width: 150px; } input.radio { border: 0; } input.checkbox { border: 0; } input.submit { cursor: pointer; color: #f8f8f0; background-color: #444444; padding: 5px 10px; font-size: 18px; border: 1px solid #444444; -webkit-border-radius: 8px 8px 8px 8px; -moz-border-radius: 8px 8px 8px 8px; border-radius: 8px 8px 8px 8px; behavior: url(/webdecker/PIE/PIE.htc); } input.wide { width: 450px; } input.medium { width: 250px; } input.small { width: 100px; } input.tiny { width: 50px; } .widget-text input, .widget-captcha input { width: 98%; max-width: 450px; } .widget-textarea textarea { width: 98%; max-width: 450px; } div.widget, div.explanation { clear: both; margin-bottom: 10px; } form .headline { padding: 5px 0 5px 0; } form div.label { width: 150px; float: left; } form .input { margin-left: 151px; } .radio_container input { display: block; width: 20px; float: left; margin: 8px 0 4px -24px; } .radio_container span { display: block; padding-left: 24px; } .radio_container label { display: block; float: none; width: auto; } .checkbox_container input { display: block; width: 20px; float: left; margin: 8px 0 4px -24px; } .checkbox_container span { display: block; padding-left: 24px; } .checkbox_container label { display: block; float: none; width: auto; } .submit_container { clear: both; float: right; margin-top: 20px; } .submit_container input { margin-bottom: 0px; } .captcha_text { display: block; } /* #reference_filter div.sectors { float: left; margin-right: 10px; width: 50%; } #reference_filter .keywords { clear: none; } */ #reference_filter .widget { float: left; width: 50%; clear: none; } #reference_filter .sectors { padding-right: 12px; } #reference_filter .keywords > .label { width: 90px; } #reference_filter .keywords .input { margin-left: 90px; } /* -------------------------------------- */ /* Misc */ /* -------------------------------------- */ .mod_article { position: relative; } .ce_comments { margin-top: 30px; } .ce_comments .comment { border-left: 1px solid #AAAAAA; padding-left: 12px; } .comment_default { margin-bottom: 30px; } .reply { padding-left: 30px; } .mod_newslist .layout_short { padding-bottom: 30px; } .mod_newslist .layout_short .info { color: #AAAAAA; padding-bottom: 0px; } .mod_newsreader .info { color: #AAAAAA; padding-bottom: 20px; } .img_left { float: left; margin: 0px 20px 10px 0; } .img_right { float: right; margin: 0px 0 10px 20px; } .overline { color: #999; display: block; position:relative; box-sizing: border-box; } .sliding p .overline { margin-bottom: -12px; } #container ul { list-style-type: disc; list-style-position: outside; margin-left: 20px; } #container .mod_sitemap ul { list-style-type: none; margin-left: 0px; } #container .mod_sitemap ul ul { list-style-type: none; margin-left: 20px; } #container li { padding-bottom: 5px; padding-left: 8px; } #container li ul { padding-top: 5px; padding-bottom: 5px; } #addhead .ce_text ul { list-style-type: disc; list-style-position: outside; margin-left: 20px; } #addhead .ce_text li { padding-bottom: 5px; padding-left: 8px; } #addhead .ce_text li ul { padding-top: 5px; padding-bottom: 5px; } #addhead .ce_text.centerul ul { list-style-type: none; list-style-position: outside; margin-left: 0; display: block; position: relative; text-align: center; } #addhead .ce_text.centerul li { display: inline-block; padding: 12px 32px; margin: 0 12px 16px 12px; background: #ddd; font-weight: bold; border: 1px solid #ddd; -webkit-border-radius: 8px 8px 8px 8px; -moz-border-radius: 8px 8px 8px 8px; border-radius: 8px 8px 8px 8px; } div.centered { text-align: center; } .pagination { clear: both; padding: 20px 0 20px 0; text-align: center; } .pagination li { display: inline-block; padding: 10px 10px 10px 10px; } .mtop { margin-top: 24px; } /* search */ span.stress { background-color: #ffcccc; } pre { overflow: scroll; background-color: #e8e8dd; background-color: #e8e8e8; } /* audio, video */ audio { width: 100%; } video { max-width: 100%; } .ce_external_video { } .ce_external_video .content { background: #000000; display: block; position: relative; } .ce_external_video .stage { overflow: hidden; position: relative; } /* margin: 0 20% 0 20%; */ .ce_external_video .spacer { width: 0px; height: 0px; margin-bottom: 56.1%; } /* margin-bottom: 56.1%; margin-bottom: 66%; */ .ce_external_video iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .ce_external_video .text { margin-top: 12px; } .ce_download { margin-top: 20px; margin-bottom: 20px; } .ce_download img { vertical-align: bottom; } .prevnext { overflow: hidden; margin-top: 24px; margin-bottom: 24px; } .prevnext div.next { float: right; width: 50%; text-align: right; } .prevnext div.prev { float: left; width: 50%; text-align: left; } div.box { background-color: #e8e8dd; background-color: #e8e8e8; padding: 30px; border: 1px solid #999999; -webkit-border-radius: 8px 8px 8px 8px; -moz-border-radius: 8px 8px 8px 8px; border-radius: 8px 8px 8px 8px; behavior: url(/webdecker/PIE/PIE.htc); overflow: hidden; margin-bottom: 24px; } div.stylish.box { padding: 4px; -webkit-border-radius: 0px 0px 0px 0px; -moz-border-radius: 0px 0px 0px 0px; border-radius: 0px 0px 0px 0px; } /* -------------------------------------- */ /* Media queries */ /* -------------------------------------- */ @media all and (max-width: 1100px) { #header .inside { width: 840px; margin: 0 auto 0 auto; padding-left: 20px; padding-right: 20px; } #addhead > .inside { width: 840px; margin: 0 auto 0 auto; padding-left: 20px; padding-right: 20px; } #container > .inside { width: 840px; margin: 0 auto 0 auto; padding-top: 30px; padding-left: 20px; padding-right: 20px; } #footer .inside { width: 840px; margin: 0 auto 0 auto; padding-left: 20px; padding-right: 20px; } #main { float: left; width: 500px; } #main .inside { padding-right: 20px; } #right { float: left; width: 300px; } .onecol #main { width: 100%; } .onecol #main .inside { padding-right: 0; } .onecol #right { display: none; } } @media all and (max-width: 840px) { /* breakpoint */ .momenu { display: block; } #nav_main_menu { display: none; } #header > .inside { padding-right: 58px; } #momenu_o { display: block; margin-right: -38px; } #logo { float: left; margin-right: 12px; width: 230px; } #logo img { width: 100%; margin-top: -15px; } #slogan { text-align: left; } #momenu_o a { padding-top: 0; margin-top: -4px; } #header .inside { width: auto; } #addhead > .inside { width: auto; } #container > .inside { width: auto; } #footer .inside { width: auto; } #main { float: none; width: 100%; padding-right: 0; } #main .inside { padding-right: 0; } #right { float: none; width: 100%; margin-top: 24px; padding-top: 24px; border-top: 1px solid #eeeeee; } #wrapper .col4 > .inside > div { width: 50%; } #wrapper .col4 > .inside > div:nth-child(2n+1) { clear: both; } #wrapper .col3 > .inside > div { width: 50%; } #wrapper .col3 > .inside > div:nth-child(3n+1) { clear: none; } #wrapper .col3 > .inside > div:nth-child(2n+1) { clear: both; } } @media all and (max-width: 740px) { #wrapper #reference_filter .widget { width: 100%; } #wrapper #reference_filter .sectors { padding-right: 0; } .ce_reference_slider .slide { width: 20%; } } @media all and (max-width: 650px) { #nav_main_menu ul { margin-bottom: 10px; } #header .nav li a { -webkit-border-radius: 8px 8px 8px 8px; -moz-border-radius: 8px 8px 8px 8px; border-radius: 8px 8px 8px 8px; } #header .nav li.active a, #header .nav li.trail a { border-bottom: 1px solid #999999; } #header .nav li a:hover { border-bottom: 1px solid #999999; } #wrapper .col3 > .inside > div { width: 100%; } #wrapper .col2 > .inside > div { width: 100%; float: left; } .prevnext div.next { width: 100%; } .prevnext div.prev { width: 100%; } #wrapper .ce_gallery li { width: 50%; } #wrapper .ce_gallery li:nth-child(3n+1) { clear: none; } #wrapper .ce_gallery li:nth-child(2n+1) { clear: both; } #wrapper .ce_reference_story .ce_gallery li:nth-child(2n+1) { clear: none; } #wrapper .ce_reference_list .ce_gallery li:nth-child(2n+1) { clear: none; } } @media all and (max-width: 600px) { #addhead .ce_reference_teaser .gallery { display: none; } #wrapper .sliding .controls a.pagi { display: block; } } @media all and (max-width: 480px) { .reference .img img { width: 100px; height: auto; } div.ce_reference_teaser div.img { width: 100px; } div.ce_reference_story div.img { width: 100px; } div.ce_reference_list .img { width: 90px; } div.ce_reference_list li .content { margin-left: 110px; } #wrapper form div.label { float: none; } #wrapper #container form div.input { margin-left: 0; } #wrapper .ce_gallery li { width: 100%; } #wrapper .ce_gallery li:nth-child(3n+1) { clear: both; } h1 { font-size: 28px; line-height: 32px; } h2 { font-size: 25px; line-height: 28px; } h3 { font-size: 22px; line-height: 26px; } h4 { font-size: 20px; line-height: 23px; } h5 { font-size: 16px; line-height: 20px; } #momenu_wrapper .close { display: block; } #momenu_o a.open { visibility: hidden; } } @media all and (max-width: 370px) { #header > .inside { width: 300px; padding-left: 10px; padding-right: 48px; } #addhead > .inside { width: 300px; padding-left: 10px; padding-right: 10px; } #container > .inside { width: 300px; padding-left: 10px; padding-right: 10px; } #footer .inside { width: 300px; padding-left: 10px; padding-right: 10px; } } figure.float_right { width: 50%; box-sizing: border-box; margin: 0 0 12px 12px; float: right; text-align: right; } .sliding .controls.has_navigation { text-align: center; } @media all and (max-width: 600px) { figure.float_right { width: 100%; margin: 0 0 12px 0; text-align: center; } }