/* www.icreate.at - 2014-07-23 - global,grid,sections,forms,css3,gmap,slider,lightbox */ /* GLOBAL */ html, body {margin:0;padding:0;} html {overflow-y:scroll;} body {color:#555;font:16px Arial,Helvetica,Sans-Serif;} h1,h2,h3,h4,.nav a {font-family:'Play',Arial,sans-serif;} h1 {color:rgba(255,255,255,.9);font-size:36px;letter-spacing:1px;margin:5px 0 8px;text-transform:uppercase;} h2,h4 {color:#8E3557;font-size:30px;margin:5px 0 20px;} h3 {color:#555;font-size:20px;margin:10px 0;} h4 {color:#777;font-size:26px} p {font-size:16px;line-height:22px;margin:5px 0 20px;} em {font-weight:bold;} a {color:#8E3557;text-decoration:none;outline:none;} a:hover {background:#8E3557;color:#fff;} a:hover img {background:none;border:#000;} a img {border:0;padding:0;text-decoration:none;} a strong {display:block;font-size:16px;} p strong, li strong {color:#8E3557;display:block;} .big, big {color:#8E3557;display:block;font-size:20px;font-weight:bold;margin:10px 0 10px;} .small {color:#555;font-size:12px;font-weight:bold;text-transform:none;} small {display:block;font-size:13px;font-weight:normal;} img {background:#fff;border:none;} ul {list-style:none;margin:0;padding:0;} .color {color:#8E3557;} .black {color:#000;} .bold {font-weight:bold;} .accent {color:#78A73F;font-weight:bold;} .accent:hover {background:#78A73F;color:#fff;} .bar {background:#777;color:#fff;font-weight:bold;margin:15px 0 20px;padding:5px 10px;} .line {border-bottom:1px solid #999;padding-bottom:5px;} .block {display:block;} .full {width:auto;} .btt,.btt1,.btt2,.btt3 {background:#777;color:#fff;display:block;font-size:16px;font-weight:bold;margin:5px 0;padding:3px 10px;} .btt:hover {background:#8E3557;color:#fff;} .btt1:hover,.btt2:hover,.btt3:hover {background:#777;color:#fff;} .btt1 {text-align:center;width:180px;} .btt2 {background:#78A73F;text-align:right;} .btt3 {background:#8E3557;} /* GRID */ .wrapout {margin:0 auto;width:100%;position:relative;} .wrapper {background:none;border:none;margin:0 auto;padding:0;max-width:995px;} .wrap {overflow:hidden;margin:0 auto;padding:20px 0;max-width:995px;position:relative;} .inner {display:inline-block;border:1px solid #ddd;padding:15px;} .w2,.w3,.w4,.w6,.w8,.w10,.w12 {display:block;float:left;margin:1% 2% 1% 0;} .w2:last-child,.w3:last-child,.w4:last-child,.w6:last-child,.w8:last-child,.w10:last-child,.w12:last-child {margin-right:0;} .w2 {width:15%;} .w3 {width:23%;} .w4 {width:32%;} .w6 {width:49%;} .w8 {width:66%;} .w10 {width:83%;} .w12 {width:100%;} /* SECTIONS */ /* HEADERS-NAV */ .header {background:rgba(255,255,255,1);padding:0;height:65px;position:fixed;top:0;z-index:8999; -webkit-box-shadow: 0px 5px 10px 0px rgba(100, 100, 100, 0.6); -moz-box-shadow: 0px 5px 10px 0px rgba(100, 100, 100, 0.6); box-shadow: 0px 5px 10px 0px rgba(100, 100, 100, 0.6);} .header .wrap {overflow:visible} .banner {background:url('img/bg_motiv2.jpg') repeat-x fixed 50% -40%;min-height:300px;} .banner .wrap {top:220px;} #home .banner {background:#eee;position:fixed;top:0;} #home .banner .wrap {top:80px;left:35px;} #details .banner .wrap {top:0;} .logo img {margin:-15px 5px 0;height:50px;width:175px;} .logo:hover {background:none;} .overlay {background:#fff;width:100%;position:relative;top:330px;} /* Mainnav */ .nav {width:550px;position:absolute;top:15px;right:10px;z-index:9000;} .nav li {float:left;border-right:1px solid #fff;position:relative;} .nav li a {display:block;border:none;color:#999;font-size:16px;font-weight:bold;padding:15px 0;text-align:center;width:120px;} .nav li:hover a, #products .a1, #gallery .a2, #details .a2, #service .a3, #contact .a4 {background:#eee;} .nav li:hover ul {display:block;} .nav li:last-child ul {left:-80px;} /* Dropdown */ .nav ul {display:none;background:#fff;border-top:1px solid #fff;;margin:0;position:absolute;left:0;width:200px;z-index:9000;} .nav ul li {border:none;margin:0;padding:0;} .nav ul li a {font-size:16px;background:#eee;border:none;color:#555;margin-bottom:1px;padding:10px 20px;text-align:left;text-transform:none;width:158px;} .nav ul li a:hover {background:#999;color:#fff;padding:10px 15px 10px 20px;width:162px;} /* RMenu */ .rmenu {display:none;overflow:hidden;} .rbtn {background:#333 url("img/nav_toggle.png") no-repeat 50% 50%; margin:3px 0;padding:5px 10px;height:25px;width:25px;position:absolute;top:15px;right:20px;} .rbtn:hover {cursor:pointer;background:#8FAD26 url("img/nav_toggle.png") no-repeat 50% 50%;border:none;} .rsub {display:none;background:none;font-size:20px;font-weight:bold;letter-spacing:1px;text-transform:uppercase; margin-top:0;padding:0;height:auto;width:100%;} .rsub li {float:left;border-bottom:1px solid #fff;padding:0;position:relative;width:100%;} .rsub a {float:left;background:#8FAD26;color:#fff;padding:12px 0;text-align:center;width:100%;} .rsub a:hover {background:#555;} .rsub ul {display:none;} /* Sharebutton */ .share {background:url(img/share.png) no-repeat center;color:#fff;font-size:20px;font-weight:bold;text-align:center; padding:13px 0 20px;width:50px;height:16px;position:absolute;top:15px;right:25px;z-index:9000;} .share:hover {background:#eee url(img/share.png) no-repeat center;color:#999;} .share:hover ul {display:block;} .share ul {display:none;background:#eee;margin:35px 0 0 -100px;width:150px;position:relative;} .share ul li {background:none;border-top:1px solid #fff;padding:7px 15px 8px;height:18px;width:auto;} .share ul li:last-child {border-bottom:none;} .share ul li:hover {height:18px;} .share ul li a {background:none;} /* Subnavs */ .fqs .a10, .gls .a11, .lnk .a12, .smp .a13, .wik .a14 {background:#8E3557;color:#fff;} /* Aktionen */ .ads, .ads.small {position:absolute;top:90px;right:0;width:250px;z-index:8000;} .ads.small {right:0;top:85px;width:200px;} .ads img, .ads a:hover {background:none;} /* CONTENTS */ .subheader {margin:100px auto 0;height:auto;position:relative;} .teaser .inner {display:block;font-size:14px;padding:15px 13px 10px;min-height:280px;} .teaser img {width:200px;margin:10px 0 0 0;} .teaser p {font-size:14px;} .quote li, .quote p {float:left;line-height:20px;} .quote li {margin-bottom:15px;text-align:right;width:100%;} .quote li:hover {background:#ccc;} .quote p {font-weight:bold;margin:0;text-align:left;width:350px;} .quote span, .quote.c3 span {display:block;float:right;width:80px;} .quote.c3 span {width:65px;} .list, .quote {margin:10px 0;} .list li {float:left;margin-bottom:10px;padding:5px 0;} .list li:hover {background:#eee;padding-left:10px;} .list a {float:left;width:180px;} .list a:hover {background:none;color:#000;font-weight:bold;} .list p {float:right;margin:0;width:420px;} .list a, .list p {line-height:20px;} .sort {list-style:square outside;margin:15px 0 0 15px;} .sort li {line-height:22px;margin:0 0 20px;} .mb li {margin-bottom:10px;} .count {list-style:decimal outside;margin:10px 0 0 20px;} .count li {line-height:22px;margin:0 0 10px;} .inside {list-style:decimal outside;margin:10px 0 0 20px;} .inside li {line-height:22px;margin:0;} .faq strong {display:block;} .contact small {display:inline;} .danke span {float:right;margin-bottom:40px;position:relative;} .gallery span {display:block;} .gallery img, .gallery span {cursor:pointer;height:153px;position:relative;width:460px;z-index:1;} .gallery li {line-height:35px;text-align:center;position:relative;z-index:2;} .gallery li:hover a {background:none;} .gallery li:nth-child(2) {margin-right:0;} /* Details */ #details h1 {float:left;color:#555;font-size:28px;text-transform:none;margin:5px 0;width:850px;} #details p {float:left;font-size:14px;width:auto;} .more {background:#8E3557;color:#fff;font-weight:bold;padding:5px 13px;position:relative;top:12px;} .more:hover {background:#777;} #details iframe {overflow:hidden;border:none;margin-top:60px;height:562px;width:995px;} #details .footer {background:none;border-top:1px solid #ddd;margin-top:20px;padding-top:5px;} #details .footer p {float:right;color:#999;margin:0;text-align:right;width:300px} #details .footer a {color:#8E3557;} #details .footer a:hover {color:#eee;} /* Sidebar */ .side,.sidebar {padding-left:20px;} .side a img {height:130px;width:260px;} .side strong {display:block;color:#8E3557;font-size:16px;font-weight:bold;} #products .side a:hover {background:none;color:#000;} #contact .side strong, #danke .side strong {color:#555;margin-top:10px;} /* FOOTERS */ .footer {clear:both;background:#333;} .footer a {color:#eee;font-size:14px} .footer ul {width:600px} .footer li {float:left;padding-right:20px} .footer p {color:#ddd;float:left;font-size:12px;margin-bottom:0;width:600px} .footer span a {float:right;background:none;border:2px solid #999;margin:0 15px 0;height:45px;width:45px;position:relative;z-index:999;} .footer span a:hover {background:none;box-shadow:0 0 20px rgba(240,240,240,1)} .footer span img {background:none;margin:7px 10px;width:25px;} /* FORMS-TABLES */ .mailer {margin-bottom:40px;position:relative;} .mailer li {border:none;margin:0;padding:5px 0;} .mailer label {color:#78A73F;float:left;font-size:16px;font-weight:bold;line-height:25px;width:100%;} .mailer input, textarea, select {border:1px solid #ccc;color:#555;font:14px 'Lucida Grande',Verdana,Helvetica,sans-serif;padding:5px;width:98%;} .mailer select{width:100%;} .mailer input:focus, textarea:focus, select:focus{background:#eee;} .mailer input.button {background:#78A73F;border:2px solid #fff;color:#fff;cursor:pointer;font:bold 14px Arial, sans-serif; text-align:center;margin-top:0;padding:8px 3px 10px;width:150px;position:absolute;right:0;} .mailer input.button:hover {background:#777;} .confirm {display:none;} /* CSS3 - Backgrounds, Borders, Transparency */ .more,.mailer,input.button {-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;} .share:hover {-moz-border-radius:0;-webkit-border-radius:0;border-radius:0;} .pano {-moz-border-radius-bottomleft:5px;-webkit-border-bottom-left-radius:5px;border-bottom-left-radius:5px; -moz-border-radius-bottomright:5px;-webkit-border-bottom-right-radius:5px;border-bottom-left-radius:5px;} .footer span a {border-radius:50%;} .header,.nav ul,.gallery li {filter:alpha(opacity=90);opacity:0.9;} .gallery li:hover {filter:alpha(opacity=100);opacity:1;} .nav a, .footer li a {text-transform:uppercase;} /* GMap */ #map h2 {text-align:center;} #gmap{margin:0 auto;height:515px;width:990px;} #gmap img{background:none;} #ginfo{font:12px Corbel,Optima,Arial,sans-serif;height:auto;overflow:hidden;width:180px;} #ginfo h1{color:#375D91;display:inline;font-size:18px;font-weight:bold;text-transform:none;} /* Fraction-Slider */ .fraction-slider{position:relative;width:100%;height:100%;overflow:visible;} .fraction-slider .slide{display:none; width:100%; height:100%;position:absolute;z-index:5000;} .fraction-slider .active-slide{z-index:7998;} .fraction-slider .fs_obj{display:block; display:none;position:absolute;top:0px; left:100%;z-index:7000;} .fraction-slider .fs_fixed_obj{z-index:6000;left:0;} .fraction-slider .fs_obj *{display:inline-block;position:relative;top:0px; left:0px;} .fs_loader{width:100%;height:400px;background:url(js/fslider/fs.spinner.gif) center center no-repeat transparent;} /** Controls **/ .fraction-slider .prev,.fraction-slider .next {display:none;position:absolute;width:45px; height:45px;z-index:7999;} .fraction-slider .prev{left:10px; top:45%;background:url(js/fslider/fs.prevnext.png) 0px 0px no-repeat transparent;} .fraction-slider .prev:hover{background:url(js/fslider/fs.prevnext.png) 0px -45px no-repeat transparent;} .fraction-slider .next{right:10px; top:185px;background:url(js/fslider/fs.prevnext.png) -45px 0px no-repeat transparent;} .fraction-slider .next:hover{background:url(js/fslider/fs.prevnext.png) -45px -45px no-repeat transparent;} .fraction-slider:hover .prev,.fraction-slider:hover .next{display:block;} /** Pager **/ .fs-pager-wrapper{position:absolute;left:50%;bottom:10px;z-index:7999;} .fs-pager-wrapper a{display:inline-block;width:14px; height:14px;margin:0 5px 0 0;background:url(js/fslider/fs.pager.png) 0px -14px no-repeat transparent;} .fs-pager-wrapper .active{background:url(js/fslider/fs.pager.png) 0px 0px no-repeat transparent;} .slider {background:#eee;margin:0 auto;width:100%;position:fixed;top:0;} .claim {color:rgba(255,255,255,.9);font:60px 'Play',Arial,sans-serif;line-height:100%} /* VENOBOX RESPONSIVE LIGHTBOX */ body{-webkit-overflow-scrolling:touch;} .vbox-overlay *, .vbox-overlay *:before, .vbox-overlay *:after{ -webkit-backface-visibility: hidden;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} /* overlay: change here background color and opacity */ .vbox-overlay{ background: rgba(0,0,0,.85);width: 100%;height: auto;position: absolute;top: 0;left: 0;z-index: 999;overflow: hidden;opacity: 0; transition: opacity .25s ease-in-out;-moz-transition: opacity .25s ease-in-out;-webkit-transition: opacity .25s ease-in-out;} .relativo{ float: left;width: 100%;height: 100%;display: block;position: relative;} /* preloader - choose between CIRCLE, IOS, DOTS, QUADS */ /* circle preloader */ .vbox-preloader{position:fixed;width:32px;height:32px;left:50%;top:50%;margin-left:-16px;margin-top:-16px; background-image: url(js/venobox/preload-circle.png);text-indent: -100px;overflow: hidden; -webkit-animation: playload 1.4s steps(18) infinite; -moz-animation: playload 1.4s steps(18) infinite; -ms-animation: playload 1.4s steps(18) infinite; -o-animation: playload 1.4s steps(18) infinite; animation: playload 1.4s steps(18) infinite;} @-webkit-keyframes playload { from { background-position: 0px; } to { background-position: -576px; }} @-moz-keyframes playload { from { background-position: 0px; } to { background-position: -576px; }} @-ms-keyframes playload { from { background-position: 0px; } to { background-position: -576px; }} @-o-keyframes playload { from { background-position: 0px; } to { background-position: -576px; }} @keyframes playload { from { background-position: 0px; } to { background-position: -576px; }} /* navigation */ .vbox-close{cursor: pointer;position: fixed;top: -1px;right: 0;width: 46px;height: 40px;padding: 10px 20px 10px 0;display: block; background: url(js/venobox/close.gif) no-repeat #161617;background-position:10px center; color: #fff;text-indent: -100px;overflow: hidden;} .vbox-next, .vbox-prev{cursor: pointer;position: fixed;top: 50%;color: #fff;width: 30px;height: 30px; margin-top: -15px;text-indent: -100px;overflow: hidden;} .vbox-prev{left: 10px;background: url(js/venobox/prev.gif) center center no-repeat;} .vbox-next{right: 10px;background: url(js/venobox/next.gif) center center no-repeat;} .vbox-title{width: 100%;height: 40px;float: left;text-align: center;line-height: 28px;font-size: 12px;color: #fff; padding: 6px 40px;overflow: hidden;background: #161617;position: fixed;display: none;top: -1px;left: 0;} .vbox-num{cursor: pointer;position: fixed;top: -1px;left: 0;height: 40px;display: block;color: #fff;overflow: hidden; line-height: 28px;font-size: 12px;padding: 6px 10px;background: #161617;display: none;} /* inline window */ .vbox-inline{width: 420px;height: 315px;padding: 10px;background: #fff;text-align: left;margin: 0 auto;overflow: auto;} /* Video & iFrames window */ .venoframe{border: none;width: 960px;height: 542px;} @media (max-width: 992px) { .venoframe{width: 640px;height: 362px;} } @media (max-width: 767px) { /*.venoframe{width: 420px;height: 315px;}*/ .venoframe{width: 100%;height: 320px;} } @media (max-width: 460px) { .vbox-inline{width: 100%;} .venoframe{width: 100%;height: 260px;} } /* Please do NOT edit this! (or do it at your own risk) */ .vbox-container{position: relative;background: #000;width: 98%;max-width: 1024px;margin: 0 auto;} .vbox-content{text-align: center;float: left;width: 100%;position: relative;overflow: hidden;} .vbox-container img{max-width: 100%;height: auto;} .vwrap{width: 100%;height: auto;float: left;position: relative;margin: 0;padding: 0;left: 0;overflow: hidden;z-index: 1;opacity: 1; transition: opacity .25s ease-in-out;-moz-transition: opacity .25s ease-in-out;-webkit-transition: opacity .25s ease-in-out;} /* FANCYBOX LIGHT V2 */ #fancybox-loading {position:fixed;top:50%;left:50%;width:40px;height:40px;margin:-20px 0 0 -20px; cursor:pointer;overflow:hidden;z-index:10104;display:none;} #fancybox-loading div {position:absolute;top:0;left:0;width:40px;height:480px; background:url('fancybox/fancybox.png');} #fancybox-overlay {position:absolute;top:0;left:0;width:100%;height:100%;z-index:10100;display:none;} #fancybox-tmp {padding:0;margin:0;border:0;overflow:auto;display:none;} /* Box */ #fancybox-wrap {position:absolute;top:0;left:0;padding:1px 2px 0;z-index:10101;outline:none; display:none;background:#fff;border:3px solid #ccc;margin-top:0;margin-left:10px; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;} #fancybox-outer {position:relative;width:100%;height:100%;background:#fff;border:0px solid #fff;margin-bottom:0;} #fancybox-content {width:0;height:0;padding:0;outline:none;position:relative;overflow:hidden;z-index:10102;border:0px solid #fff;} #fancybox-hide-sel-frame {position:absolute;top:0;left:0;width:100%;height:100%;background:transparent;z-index:10101;} /* Close button */ #fancybox-close {position:absolute;top:-23px;right:-23px;width:30px;height:30px; background:transparent url('fancybox/fancybox.png') -40px 0px;cursor:pointer;z-index:10103;display:none;} #fancybox-error {color:#444;font:normal 12px/20px Arial;padding:14px;margin:0;} #fancybox-img {width:100%;height:100%;padding:0;margin:0;border:none;outline:none;line-height:0;vertical-align:top;} #fancybox-frame {width:100%;height:100%;border:none;display:block;} /* Buttons next/prev angepasst */ #fancybox-left, #fancybox-right {position:absolute;bottom:-20px;height:10px;width:20px;cursor:pointer; outline:none;background:transparent url('fancybox/blank.gif');z-index:10103;display:none;} #fancybox-left {left:890px;} #fancybox-right {right:-15px;} #fancybox-left-ico, #fancybox-right-ico {position:absolute;top:105%;left:-9999px;height:30px;width:30px; margin-top:-10px;cursor:pointer;z-index:10103;display:block;} #fancybox-left-ico {background:url('fancybox/fancybox.png') -40px -30px;} #fancybox-right-ico {background:url('fancybox/fancybox.png') -40px -60px;} #fancybox-left:hover, #fancybox-right:hover {visibility:visible; /* IE6 */} #fancybox-left:hover span {left:20px;} #fancybox-right:hover span {left:auto;right:20px;} /* Buttons immer anzeigen */ #fancybox-left-ico {left:20px;} #fancybox-right-ico {right:20px;left:auto;} /* Backgrounds */ .fancybox-bg {position:absolute;padding:0;margin:0;border:0;width:20px;height:20px;z-index:10001;} /* Title */ #fancybox-title {color:#999;font-family:Helvetica;font-size:20px;font-weight:bold;z-index:10102;} .fancybox-title-inside {padding-bottom:10px;text-align:center;color:#333;background:#fff;position:relative;} .fancybox-title-outside {padding:10px 0 15px;color:#fff;position:relative;left:10px;} .fancybox-title-over {position:absolute;bottom:0;left:0;color:#fff;text-align:left;} #fancybox-title-over {padding:10px;background:url('fancybox/fancy_title_over.png');display:block;} .fancybox-title-float {position:absolute;left:0;bottom:-20px;height:32px;} #fancybox-title-float-wrap {border:none;border-collapse:collapse;width:auto;} #fancybox-title-float-wrap td {white-space:nowrap;} #fancybox-title-float-left {padding-left:15px;background:url('fancybox/fancybox.png') -40px -90px no-repeat;} #fancybox-title-float-main {color:#fff;line-height:29px;font-weight:bold;padding-bottom:3px; background:url('fancybox/fancybox-x.png') 0px -40px;} #fancybox-title-float-right {padding-left: 15px;background:url('fancybox/fancybox.png') -55px -90px no-repeat;} /* MEDIA-QUERIES */ /* Print */ @media print {} /* Smartphones */ /*@media only screen and (max-width: 469px) { .w2,.w3,.w4,.w5,.w6,.w7,.w8,.w9,.w10,.w12 {width:100%;} .teaser li {margin-right:0;} } */ /* Large smartphones */ @media only screen and (max-width: 800px) { .wrapout {width:100%;} .wrap {padding:20px;} .w2,.w3,.w4,.w5,.w6,.w7,.w8,.w9,.w10,.w12 {width:100%;} .top {height:60px;} .banner {background:url('img/bg_motiv2.jpg') repeat-x fixed 50% -40%;min-height:200px;} .banner .wrap {top:120px;} .ads,.ads.small,.ads img,.ads.small img {width:100px;} .slider {top:60px;} .after {top:0;} .ptb {padding:60px 20px 50px;} .logo {font-size:28px;} .rmenu {display:block;} .nav {display:none;} .share {display:none;} #home {width:100%;} #home .inner {min-height:150px} .overlay {top:230px;} #log {right:100px;} .teaser li {margin-right:0;} .teaser img {float:right;margin:15px 0 10px 10px;} .teaser p {margin:0;padding:0;} #details iframe {height:300px;width:100%;} .inner {padding:3%;width:94%;} .footer ul {width:85%;} .footer li {margin:5px 0 15px;width:30%;} } /* Tablets and landscape large smartphones */ @media only screen and (min-width: 801px) and (max-width: 1000px) { #nav {margin-left:20px;width:550px;} #nav a {font-size:14px;letter-spacing:1px;padding:10px 10px;} } /* Desktop screens */ @media only screen and (min-width: 1200px) and (max-width: 1499px){} /* Large screen */ @media only screen and (min-width: 1500px) and (max-width: 1799px){ } /* Very large screen (retina) */ @media only screen and (min-width: 1800px){}