t/* CSS (c) 2012 NETGENERATOR Version 0.1 29.05.2012 */ @import url(http://fonts.googleapis.com/css?family=Michroma|Open+Sans:400,700&subset=latin,latin-ext); @media only screen and (max-device-width: 960px) { /*fixes too big font in mobile Safari*/ html { -webkit-text-size-adjust:none; } } body { color: #494949; font-family: "Open Sans", sans-serif; font-size: 12px; background: #ffffff; } body.index { background: -moz-linear-gradient(top, #ffffff 0px, #ffffff 283px, #78b42e 284px, #78b42e 487px, #ffffff 488px, #ffffff 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0px,#ffffff), color-stop(283px,#ffffff), color-stop(284px,#78b42e), color-stop(487px,#78b42e), color-stop(488px,#ffffff), color-stop(100%,#ffffff)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #ffffff 0%,#ffffff 283px,#78b42e 284px,#78b42e 487px,#ffffff 488px,#ffffff 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #ffffff 0%,#ffffff 283px,#78b42e 284px,#78b42e 487px,#ffffff 488px,#ffffff 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #ffffff 0%,#ffffff 283px,#78b42e 284px,#78b42e 487px,#ffffff 488px,#ffffff 100%); /* IE10+ */ background: linear-gradient(to bottom, #ffffff 0%,#ffffff 283px,#78b42e 284px,#78b42e 487px,#ffffff 488px,#ffffff 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */ background-repeat: no-repeat; } body.winter { background: #fff url(../grafik/bg.gif) 50% top repeat-y; } h1, h2, h3, h4, h5, h6 { font-size: 27px; color: #78b42e; font-weight: 100; text-transform: uppercase; font-family: "Open Sans", sans-serif; line-height: 1.1em; margin: 0 0 10px; } #headerteaser h2 { font-size: 30px; line-height: 32px; font-family: "Michroma", Sans-serif; text-transform: none !important; } #headerteaser h1 { font-size: 45px; color: #8d8d8d; font-weight: 700; line-height: 46px; } p { margin: 0; padding: 0; line-height: 1.5em; } big { font-size: 18px; font-weight: bold; } a { color: #565656; text-decoration: underline; } a:hover, a:focus, a:active { color: #00225a; } ul { list-style: disc outside; margin: 8px 0 8px 20px; } ul li { margin: 5px 0; } /* login / register */ .form_row { display: block; clear: both; padding: 1px 0 0; margin: 0; } label { width: 225px; margin: 0; float: left; clear: both; display: block; text-align: left; } span.login { margin: 0 20px 0 0; } .labelinfo { margin-left: 150px; display: block; clear: both; } .login_pw_vergessen { text-decoration: underline; } .form_info { display: block; clear: both; padding: 0 0 15px 25px; font-size: 11px; font-style: italic; } input, select, textarea, .submit { margin: 0 0 5px; padding: 1px 3px; color: #fff; background: #bababa; font-family: "Open Sans", "sans-serif"; font-size: 12px; border: none; } input, select, textarea { width: 225px; } /*input[type=text], input[type=password] { width: 250px; }*/ input:hover, input:active, input:focus, select:hover, select:active, select:focus, textarea:hover, textarea:active, textarea:focus { background: #8d8d8d; color: #fff; } .submit { display: inline-block; margin: 5px 0; padding: 6px 15px; border: none; background: #78b42e; color: #fff; text-decoration: none; text-transform: uppercase; font-size: 12px; font-weight: bold; cursor: pointer; } .submit:hover, .submit:active, .submit:focus { background: #8d8d8d; color: #fff; } input.submit { width: auto; height: 28px; padding: 0 10px; margin: 10px 34px 0 0; float: right; } .rechts { float: right; } .fullsize { width: 100%; } .red { color: #ce0000; } .graybox { padding: 10px 20px 30px; background: #141414; } #bg_container { width: 100%; position: relative; display: inline-block; z-index: 1; } #header_container { width: 100%; height: 120px; position: absolute; top: 0px; z-index: 10; } #header { height: 120px; display: block; z-index: 2; position: relative; } #logo{ width: 229px; height: 52px; position: absolute; left: 0; top: 60px; display: block; float: left; text-align: center; text-decoration: none; } #logo .logotext { display: block; text-indent: -10000px; } #logo:after { content: 'GmbH'; width: 50px; height: 10px; color: #c0c0c0; position: absolute; right: 0px; bottom: -10px; font-size: 10px; } #expertenlogo, p.expertenlogo img { width: 76px; height: 97px; position: absolute; right: 16px; bottom: 62px; z-index: 999; } #mainnavi { min-width: 600px; list-style: none; position: absolute; right: 5px; top: 62px; margin: 0; padding: 0; z-index: 99; } #mainnavi li { margin: 0; padding: 0; display: block; float: right; font-size: 17px; line-height: 1.2em; border-left: 1px solid #e6e6e6; } #mainnavi li:last-child { border: none; } #mainnavi li a { margin: 0; padding: 10px 20px; text-decoration: none; cursor: pointer; display: block; font-weight: normal; text-align: left; color: #494949; z-index: 99; position: relative; } #mainnavi li a:hover, #mainnavi li a:active, #mainnavi li a:focus, #mainnavi li a.active { background: #78b42e; color: #fff; } #mainnavi li a.active:after { position: absolute; background: transparent; width: 0px; height: 0px; bottom: -10px; left: 50%; margin: 0 0 0 -9px; content: ''; border-left: 10px solid transparent; border-right: 10px solid transparent; border-top: 17px solid #78b42e; } .dotline { height: 0; display: block; clear: both; margin: 50px 5px; background: transparent; border-top: 1px dotted #e6e6e6; } #headerteaser { height: 350px; width: 950px; position: absolute; top: 185px; left: 0; z-index: 4; } #headerteaser h2 { font-size: 26px; } #slideshow { list-style: none; width: 950px; height: 205px; margin: 0; padding: 0; display: block; overflow: hidden; } #slideshow li { width: 950px; height: 205px; margin: 0 0 20px; padding: 0; display: block; } #content_container { display: block; padding-top: 183px; padding-bottom: 110px; position: relative; } .standort { margin-bottom: 10px; } .standort + h1 { margin-bottom: 25px; } #direktkontakt { width: 200px; padding: 15px; margin: 0 0 50px; background: #78b42e; } #direktkontakt * { color: #fff; } #direktkontakt h3 { font-size: 14px; font-weight: 100; font-family: Michroma, sans-serif; } #content { width: 360px; height: 220px; padding: 20px; float: left; background: #78b42e; color: #fff; } #formular { width: 530px; height: 220px; padding: 20px 0 20px 20px; float: left; background: #e8e8e8; color: #8d8d8d; } #formular form p { width: 265px; display: table; float: left; text-transform: uppercase; } #formular form p textarea { height: 64px; } .cmsnavi { width: 170px; display: block; list-style: none; margin: 0; padding: 0; } .cmsnavi li { display: block; margin: 0 0 2px; } .cmsnavi li a { display: block; padding: 6px 10px; margin: 0; text-align: left; text-decoration: none; font-size: 13px; font-weight: normal; color: #000; background: #E8E8E8; position: relative; } .cmsnavi li a.active, .cmsnavi li a:hover, .cmsnavi li a:focus, .cmsnavi li a:active { background: #78b42e; color: #fff; } .cmsnavi li ul { display: block; list-style: none; padding: 0 0 8px; margin: 0; } .cmsnavi li ul li { display: block; margin: 4px 0 0 0; padding: 0; } .cmsnavi li ul li a { display: block; margin-left: -14px; padding-left: 14px; } #fachbetrieb { width: 150px; margin: 30px 0; padding: 10px; background: #E8E8E8; } .index #fachbetrieb { width: 200px; margin: 0; padding: 15px; background: #E8E8E8; } #fachbetrieb p { font-size: 10px; } #fachbetrieb p img { margin: 0 0 5px 5px; float: right; } #footerlinks { width: 100%; display: inline-block; clear: both; margin: 100px 0 -10px; padding: 25px 0 50px; color: #bababa; background: #cacaca url(../grafik/bg_footer.gif) left 22px repeat-x; } #footernavi { width: 960px; height: 200px; position: relative; list-style: none; display: table; margin: 0 auto 30px; padding: 0; } #footernavi li { width: 177px; display: inline-block; margin: 0 15px 0 0; padding: 0; float: left; font-size: 14px; font-weight: bold; } #footernavi li.netgenerator { display: inline-block; width: 250px; position: absolute; right: 0; bottom: 0px; text-align: right; font-weight: normal; font-size: 11px; } #footernavi li a { padding: 3px 0; display: block; text-decoration: none; color: #fff; font-size: 13px; } #footernavi li a:hover, #footernavi li a:active, #footernavi li a:focus { text-decoration: underline; } #footernavi li ul { width: 100%; list-style: none; margin: 10px 0 0; padding: 0; } #footernavi li ul li { font-size: 11px; font-weight: normal; } #footernavi li ul li a { } /* lightbox */ body.lightbox { background: #fff; background-image: none; } .index #header_container { height: 489px; } .index #header { height: 489px; } .index #content_container { padding-top: 550px; } /* galerie */ .galerien { width: 760px; margin-left: -5px; display: block; clear: both; } .galerien a.thumb { display: block; width: 180px; height: 140px; padding: 5px; margin: 0; float: left; text-align: center; text-decoration: none; position: relative; background: #fff; } .galerien a.thumb:hover, .galerien a.thumb:focus, .galerien a.thumb:active, .galerien a.active { background: #78b42e; } .galerien a.thumb span { display: block; width: 170px; height: 30px; padding: 5px; position: absolute; bottom: 5px; left: 5px; text-align: left; color: #000; line-height: 1.2em; background: rgb(189, 224, 197); background: rgba(255, 255, 255, 0.63); border-top: 1px solid #fff; } .galerien a.thumb:hover span, .galerien a.thumb:focus span, .galerien a.thumb:active span, .galerien a.active span { background: #78b42e; color: #fff; } #galerie_text { width: 250px; float: right; padding: 10px; margin: 0 0 20px 10px; background: #E8E8E8; } #bilderliste { margin: 20px 0 0; } a.galerie_thumb { width: 150px; height: 100px; padding: 5px; margin: 0 0 10px 10px; float: left; display: block; text-align: center; line-height: 95px; vertical-align: middle; position: relative; background: #fff; } a.galerie_thumb:nth-child(4n+1) { margin-left: -5px; } .galerie_thumb:hover, .galerie_thumb:focus, .galerie_thumb:active, .galerie_thumb a.active { background: #78b42e; } a.galerie_thumb img { vertical-align: middle; text-align: center; } a.galerie_thumb span { display: block; width: 140px; padding: 5px; position: absolute; bottom: 5px; left: 5px; text-align: left; color: #000; line-height: 1.2em; background: rgb(189, 224, 197); background: rgba(255, 255, 255, 0.63); border-top: 1px solid #fff; } a.galerie_thumb:hover span, a.galerie_thumb:focus span, a.galerie_thumb:active span { background: #78b42e; color: #fff; } .galerie_details_pic { display: block; margin: 0 0 0 10px; float: right; } /* lightbox */ body.lightbox { width: auto; min-width: 300px; height: auto; padding: 10px; } .field_1 { width: 10px; } .field_2 { width: 20px; } .field_3 { width: 30px; } .field_4 { width: 40px; } .field_5 { width: 50px; } .field_6 { width: 60px; } .field_9 { width: 90px; } .field_10 { width: 100px; } .field_14 { width: 140px; } .field_15 { width: 150px; } .field_19 { width: 190px; } .field_20 { width: 200px; } .field_23 { width: 230px; } .field_24 { width: 240px; } .field_25 { width: 250px; } .field_26 { width: 260px; } .field_27 { width: 270px; } .field_28 { width: 280px; } .field_29 { width: 290px; } .field_30 { width: 300px; } .field_40 { width: 400px; } .field_50 { width: 500px; } .field_60 { width: 600px; } .fieldsuffix_1 { margin-right: 10px; } .fieldsuffix_2 { margin-right: 20px; } .fieldsuffix_3 { margin-right: 30px; } .fieldsuffix_4 { margin-right: 40px; } .fieldsuffix_5 { margin-right: 50px; } .rightfloat, .float_right { float: right; } .leftfloat, .float_left { float: left; } .nodecoration { text-decoration: none; } .bold { font-weight: bold; } /* ########## COLORBOX ############## */ /* ColorBox Core Style: The following CSS is consistent between example themes and should not be altered. */ #colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;} #cboxOverlay{position:fixed; width:100%; height:100%;} #cboxMiddleLeft, #cboxBottomLeft{clear:left;} #cboxContent{position:relative;} #cboxLoadedContent{overflow:auto;} #cboxTitle{margin:0;} #cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;} #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;} .cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none;} .cboxIframe{width:100%; height:100%; display:block; border:0;} #colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;} /* User Style: Change the following styles to modify the appearance of ColorBox. They are ordered & tabbed in a way that represents the nesting of the generated HTML. */ #cboxOverlay{background:#000;} #colorbox{} #cboxContent{margin-top:20px;} .cboxIframe{background:#fff;} #cboxError{padding:50px; border:1px solid #ccc;} #cboxLoadedContent{border:5px solid #000; background:#fff;} #cboxTitle{position:absolute; top:-20px; left:0; color:#ccc;} #cboxCurrent{position:absolute; top:-20px; right:0px; color:#ccc;} #cboxSlideshow{position:absolute; top:-20px; right:90px; color:#fff;} #cboxPrevious{position:absolute; top:50%; left:5px; margin-top:-32px; background:url(../grafik/controls.png) no-repeat top left; width:28px; height:65px; text-indent:-9999px;} #cboxPrevious:hover{background-position:bottom left;} #cboxNext{position:absolute; top:50%; right:5px; margin-top:-32px; background:url(../grafik/controls.png) no-repeat top right; width:28px; height:65px; text-indent:-9999px;} #cboxNext:hover{background-position:bottom right;} #cboxLoadingOverlay{background:#000;} #cboxLoadingGraphic{background:url(../grafik/loading.gif) no-repeat center center;} #cboxClose{position:absolute; top:5px; right:5px; display:block; background:url(../grafik/controls.png) no-repeat top center; width:38px; height:19px; text-indent:-9999px;} #cboxClose:hover{background-position:bottom center;}