/* style.css v1.1 */ @charset "utf-8"; /* RESET/CONTENT EINSTELLUNGEN */ @import url('content.css'); /* GLOBALE EINSTELLUNGEN */ * { font-family:'Roboto',Arial ,Helvetica, serif; } body { background:#fff; } iframe { background-color:transparent !important; display:block; } #frame { max-width:90%; margin:0 auto; position:relative; } h1 { width:870px; max-width:100%; margin:0px auto 0; height:13px; position:relative; overflow:hidden; } h1 span { width:870px; max-width:100%; height:30px; position:absolute; background-color:#fff; top:0; left:0; display:block; } /* SEITENKOPF */ #head { width:960px; max-width:100%; margin:0 auto; position:relative; background:url(images/leer.png) no-repeat right 54px; padding-top:36px; } #head .BannerLogo { position:absolute; top:34px; right:0px; width:175px; height:104px; background:url(images/leer.png) no-repeat; } #footer .telefon, #head .telefon { display:none; } #footer .email, #head .email { display:none; } #head .WTSketch { display:none; } #panorama2 { max-width:230%; height:150px; border-top:50px solid #fff; background:#fff; } #panorama { max-width:100%; height:360px; overflow:hidden; border-top:28px solid #fff; background:#fff; } #panoramarose { max-width:100%; height:600px; overflow:hidden; border-top:28px solid #fff; background:#fff; } #slider_nav { position:absolute; top:340px; left:0px; width:960px; max-width:100%; z-index:100; text-align:center; } /* Banner */ #banner { width:641; max-width:100%; height:auto; display:block; margin:0px auto 10px; padding-bottom:1px; } #banner img { max-width:100%; } /* Navigation */ #navigation { width:100%; text-align:center; } #navigation ul { width:100%; margin:0 auto; border-top:1px solid #dcdcdc; padding:8px 0 12px; } #navigation ul li { display:inline-block; font-size:13px; position:relative; text-transform:uppercase; margin:10px 12px; } #navigation ul li a { text-decoration:none; color:#099; display:inline-block; font-family:'Roboto Condensed','Roboto',Arial ,Helvetica, serif; font-size:17px; } #navigation ul li a:hover { text-decoration:underline } #navigation ul li.a_sel a { color:#099; } /* INHALTSBEREICH */ #content { max-width:100%; } #content .inner { max-width:870px; margin:0 auto; padding:0 45px 40px; box-shadow:0px 0px 40px rgba(0, 0, 0, 0.15); position:relative; } #content .wrap { width:100%; float:left; margin-right:-200px; } #content #t1_tbl, #content .ContentBody { margin-right:200px; padding-right:40px; padding-bottom:10px; margin-top:20px; border-right:1px dashed #dcdcdc; min-height:420px; position:relative; } #content #t1_tbl { width:670px !important; } #content .WTSketch2 { max-width:100%; height:600px; border-right:100px } #content div.kontaktdaten { float:right; width:auto; padding-top:27px; padding-left:30px; } #content div.kontaktdaten h4 { font-family:'Roboto Condensed','Roboto',Arial ,Helvetica, serif; font-size:19px; color:#000000; padding-top:10px; margin-bottom:10px; } #content div.kontaktdaten * { color:#099; } #content div.kontaktdaten p { line-height:24px; font-size:14px; } #content div.kontaktdaten p.mail span, #content div.kontaktdaten p.fon span { display:none; } #content div.kontaktdaten p.mail, #content div.kontaktdaten p.fon { padding-left:20px; } #content div.kontaktdaten p.mail { background:url(images/contact_icons.png) no-repeat left -22px; } #content div.kontaktdaten p.fon { background:url(images/contact_icons.png) no-repeat left 6px; } #content div.kontaktdaten p.anschrift, #content div.kontaktdaten p.mail { margin-bottom:13px; } #content div.kontaktdaten p.row span { display:block; float:left; width:30px; } #content div.kontaktdaten a { transition:all 0.3s ease-in-out; } #content div.kontaktdaten a:hover { color:#000000; } /* FOOTER & TOOLBAR */ #footer { width:100%; text-align:center; } #footer .inner { padding:20px 5% 40px; } #footer strong { font-weight:normal; color:#000000 } #footer strong a { color:#099; transition:all 0.3s ease-in-out; } #footer strong a:hover { color:#190707; } #minigalerie { display: table; border-spacing: 10px; } #minigalerie a { display: table-cell; vertical-align: middle; } #minigalerie img { background-color: #ffffff; padding: 5px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; box-shadow: 0 0 7px rgba(100, 100, 100, 1); -moz-box-shadow: 0 0 7px rgba(100, 100, 100, 1); -webkit-box-shadow: 0 0 7px rgba(100, 100, 100, 1); } #minigalerie img { transition: 1s; -moz-transition: 1s; -o-transition: 1s; -webkit-transition: 1s; } #minigalerie img:target { width: 250px; height: 375px; } #minigalerie img { background-color: #ffffff; padding: 5px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; box-shadow: 0 0 7px rgba(100, 100, 100, 1); -moz-box-shadow: 0 0 7px rgba(100, 100, 100, 1); -webkit-box-shadow: 0 0 7px rgba(100, 100, 100, 1); } #verweis { background-image: url("content/pfeil_link.gif"); background-position: left 1px; margin-right: 5px; padding-left: 13px; color: #099; background-repeat: no-repeat; } download { background-image: url("css/images/download_pfeil.jpg"); background-position: left 1px; margin-right: 5px; padding-left: 13px; background-repeat: no-repeat; } @media (max-width: 850px) { #head { background:none; } #head .BannerLogo { display:none; } } @media (max-width: 960px) { .ContentBody ul.leistungen { position:relative; top:0px; width:auto; background:none; z-index:10 } .ContentBody ul.leistungen2 { display:none; } .ContentBody p.leistungen { margin-bottom:13px; } } @media (max-width: 650px) { /* @media (max-width: 650px) */ #head .inner { background:none; } #content div.kontaktdaten, div.prevnext, #slider_nav, #panorama { display:none; } #panorama2 { display:none; } #panoramarose { display:none; } #content h1 { display:none; } #navigation, #head .inner, #content .inner { width:100%; } #head { margin-bottom:50px; height:auto; } #footer .telefon, #head .telefon { display:block; text-align:center; padding:53px 0 8px 0; font-size:15px !important; font-weight:bold; color:#ffffff; background:#099 url(images/icon_phone.png) no-repeat center 8px; border-radius:5px; text-decoration:none; text-transform:none !important; } #footer .telefon { margin-bottom:10px; } #footer .email, #head .email { display:block; text-align:center; padding:53px 0 8px 0; font-size:15px !important; font-weight:bold; color:#ffffff; background:#099 url(images/icon_mail.png) no-repeat center 8px; border-radius:5px; text-decoration:none; text-transform:none !important; } #footer .email { margin-bottom:10px; } #head .WTSketch { display:block; text-align:center; padding:4px 0 8px 0; font-size:20px !important; font-weight:bold; color:#ffffff; background:#099 url(images/testwtsketchnochnichtimplementiert.png) no-repeat center 8px; border-radius:5px; text-decoration:none; text-transform:none !important; } #head .WTSketch2 { display:inline; text-align:right; padding:4px 0 8px 0; font-size:20px !important; font-weight:bold url(images/testwtsketchnochnichtimplementiert.png) no-repeat center 8px; border-radius:10px; text-decoration:none; text-transform:none !important; } #footer .appstore, #head .appstore { display:block; text-align:center; padding:53px 0 8px 0; font-size:15px !important; font-weight:bold; color: transparent; background:#000000 url(./images/appstore_picture_gross.png) no-repeat center 8px; border-radius:5px; text-decoration:none; text-transform:none !important; } #footer .appstore { margin-bottom:20px; } #footer .vorschau, #head .vorschau { display:block; text-align:center; padding:53px 0 8px 0; font-size:15px !important; font-weight:bold; color: transparent; background:#099 url(./images/bild_vorschau.png) no-repeat center 8px; border-radius:5px; text-decoration:none; text-transform:none !important; } #footer .vorschau { margin-bottom:20px; } #navigation { position:relative; display:block; margin-top:20px; } #navigation ul { width:100%; height:auto; background:#eee; border:none; padding:0; border-radius:6px; } #navigation ul li { display:block; float:none; margin:0; } #navigation ul li a { display:block; text-align:center; padding:15px 0; border-bottom:1px solid #fff; font-size:17px; } #navigation ul li.KONTAKT a, #navigation ul li.INDEX a { padding:15px 0; } #navigation ul li.KONTAKT { float:none; } #navigation ul li.a_sel a { background:#099; color:#fff; } html.INDEX #navigation ul li.a_sel a { border-radius:6px 6px 0 0; } html.KONTAKT #navigation ul li.a_sel a { border-radius:0 0 6px 6px; } #content .wrap, #content .ContentBody { float:none; padding:0 !important; margin:0 auto; border:none; } #content .inner { padding:0; box-shadow:none; } #footer { width:100%; min-width:100%; margin:0 auto; height:auto; padding-bottom:0px; text-shadow:none; } #footer .inner { margin-top:0; height:auto; padding-top:25px; } #galerie li { list-style-type: none; float: left; margin: 0 10px 10px 0; text-align: center; font-weight: bold; position: relative; } #galerie img { width: 150px; height: 225px; display: block; padding: 3px; border: 1px solid #099; } #galerie a .gross { display: none; } #galerie a:hover .gross { width: 300px; height: 450px; display: block; position: absolute; top: -50px; left: -50px; z-index: 1; background: #fff; } /*--Spezialangaben f�r den Internet Explorer 7--*/ *+html #galerie a:hover { z-index: 1;} *+html #galerie li{position: static;} *+html #galerie a {position: relative;} /*--Spezialangaben f�r den Internet Explorer 6--*/ *html #galerie a:hover {display: block; z-index: 1;} *html #galerie li{position: static;} *html #galerie a {position: relative;} .ContentBody ul.leistungen { position:relative; top:0px; width:auto; background:none; z-index:10 } .ContentBody ul.leistungen2 { display:none; } .ContentBody p.leistungen { margin-bottom:13px; } .ContentBody ul.firma li:first-child { width:99%; } .ContentBody ul.firma li { padding:0; background:none; width:99%; float:left; margin-bottom:25px; } }