/********************************* custom css styles spann-bau *********************************/ /*html { height:100%; }*/ body { font-family: 'Droid Sans', sans-serif; font-size: 14px; line-height: 1.428571429; color: #333; background-color: #fff } h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-family: inherit; font-weight: 500; line-height: 1.1; color: inherit } h1 small, h2 small, h3 small, h4 small, h5 small, h6 small, .h1 small, .h2 small, .h3 small, .h4 small, .h5 small, .h6 small, h1 .small, h2 .small, h3 .small, h4 .small, h5 .small, h6 .small, .h1 .small, .h2 .small, .h3 .small, .h4 .small, .h5 .small, .h6 .small { font-weight: normal; line-height: 1; color: #999 } h1 small, .h1 small, h2 small, .h2 small, h3 small, .h3 small, h1 .small, .h1 .small, h2 .small, .h2 .small, h3 .small, .h3 .small { font-size: 65% } h4 small, .h4 small, h5 small, .h5 small, h6 small, .h6 small, h4 .small, .h4 .small, h5 .small, .h5 .small, h6 .small, .h6 .small { font-size: 75% } h1, .h1 { font-size: 28px; margin-top:0px; } h2, .h2 { font-size: 22px } h3, .h3 { font-size: 18px } h4, .h4 { font-size: 16px } h5, .h5 { font-size: 12px; margin:0; } h6, .h6 { font-size: 10px } p { margin: 0 0 10px } .container { position:relative; max-width:100%; width: 1170px; padding: 0 30px; } /********************************* Gallery/Lightbox *********************************/ a[data-gallery] { cursor:pointer; } /********************************* header *********************************/ .navbar { height: 130px; margin: 40px 0px; width:100%; display: block; background:#fff; background:rgba(255,255,255,.8); background: -moz-linear-gradient(top left, transparent 5%, #FFF 30%); background: -webkit-linear-gradient(top left, transparent 5%, #FFF 30%); background: -ms-linear-gradient(top left, transparent 5%, #FFF 30%); background: -o-linear-gradient(top left, transparent 5%, #FFF 30%); } .navbar-brand { float: left; padding: 15px 15px; text-indent:-9999px; height: 130px; width:291px; position:relative;left:-25%; background:url(../img/spann-bau.png) no-repeat; margin:0 30px 0 0!important; } @media(max-width:767px) { .navbar-brand { left:0%; } } /********************************* navigation *********************************/ .navbar-default .navbar-nav > li { padding-top:65px; width:120px; position:relative;} .navbar-default .navbar-nav > li > a { background:url(../img/square7.png) no-repeat 0px 17px; color:#000; padding-top:10px;} .navbar-default .navbar-nav > li.active a, .navbar-default .navbar-nav > li > a:hover { color:#008ccd;background:url(../img/square7_blue.png) no-repeat 0px 17px;} ul#menu-hauptnavi { margin-top:20px;padding-left:5px; float: right; margin-right: -58px; } ul#menu-hauptnavi li p { background:url(../img/dummy_130x130.jpg) no-repeat 0px 0px; background-size:59px 59px; width:63px; height:63px; /*opacity:0.6; transition:opacity 1s ease;*/ display:block; border:2px solid #000000; position:absolute; top:-65px; left:0px; padding:0; margin:0; } ul#menu-hauptnavi li p:hover { opacity:1.0; cursor:pointer; } ul#menu-hauptnavi li.menu-spann-bau p { background-image:url(../img/sb_navi_spannbau.jpg); } ul#menu-hauptnavi li.menu-leistungen p { background-image:url(../img/sb_navi_leistungen.jpg); } ul#menu-hauptnavi li.menu-impressionen p{ background-image:url(../img/sb_navi_impressionen.jpg); } ul#menu-hauptnavi li.menu-referenzen p { background-image:url(../img/sb_navi_referenzen.jpg); } ul#menu-hauptnavi li.menu-team p { background-image:url(../img/sb_navi_team.jpg); } body.parent-pageid-31 li.menu-sonder-konstruktion a, body.parent-pageid-29 li.menu-full-service a, body.parent-pageid-27 li.menu-anwendung a, body.parent-pageid-25 li.menu-spann-bau a { color:#008ccd;background:url(../img/square7_blue.png) no-repeat 0px 7px;} /********************************* main *********************************/ body.home .container.wrap { display:none; } .container.wrap { position:relative; } .sidebar, .main { background:#fff; background:rgba(255,255,255,0.80); } .content { position:relative; } .main { padding:40px 40px; margin-bottom: 50px; } .main.transimp { width:0px; height:0px; padding:0; } .main h1,.main h2, .main h3 { /*background: url("../img/square7.png") no-repeat scroll left center rgba(0, 0, 0, 0);*/ color: #000; padding: 30px 0 30px 0; margin:0; } .main img { margin:20px 0;} .main .site-team img { margin:0;} @media(min-width:768px){ .container.wrap { position:absolute; top:240px; bottom:135px; left:0; right:0; } .content,.sidebar,.main { height:100%; min-height:initial; max-height:initial; } .main { overflow-y:auto; margin-bottom: 0; } } .anker { padding-top:20px; } img.size-full { max-width:100%; height:auto; } figure.alignleft { margin-right:20px; } /* galerie */ .thumbnail { max-width:260px; background:transparent; border: none; } .thumbnail img { border: 2px solid #000; } .su-custom-gallery { z-index:10000; } .gallery-img .su-custom-gallery-slide { width:25%; } .gallery-img .su-custom-gallery-slide img { background: none; border: 2px solid #000; border-radius: 0px; -moz-border-radius:0px; -webkit-border-radius:0px; box-shadow: none; display: block; margin: 0; padding: 0px; transition: all 0.2s ease 0s; } /********************************* sidebar *********************************/ .sidebar { padding-top:40px;padding-bottom:40px;overflow:auto; } .sidebar img, .sidebar .su-button { max-width:95%; } .sidebar hr { border-color: #aaaaaa; margin-left:0; margin-bottom: 30px; margin-top: 30px; width:95%; } .su-button { margin-top:30px; } .fixesubnavi { display: block; height: 170px; left: -14px; margin-bottom: 40px; position: fixed; top: 315px; width: 100%; } .sidebar ul.menu { list-style-type:none; } .sidebar ul.menu li { list-style-type:none; line-height:24px;font-size:14px; max-width:300px;z-index:1000; } .sidebar ul.menu > li > a { background:url(../img/square7.png) no-repeat 0px 5px; color:#000; padding-left:20px; } .sidebar ul.menu > li > a:hover { background:url(../img/square7_blue.png) no-repeat 0px 5px; color:#000; padding-left:20px; color:#008ccd; text-decoration:none; } .sidebar ul.menu > li.current_page_item > a { background:url(../img/square7_blue.png) no-repeat 0px 5px; color:#008ccd; text-decoration:none; } /********************************* footer *********************************/ footer.content-info { left: 0; bottom: 20px; display: block; height: 45px; line-height:30px; margin: 0; padding: 8px 0; width: 100%; background:rgba(255,255,255,1.00); position: fixed; } footer.content-info section { } footer.content-info .container { padding: 0 15px; } footer.content-info address { font-size:12px; float:right; margin-right: 15px; } footer.content-info ul.menu { list-style-type:none; margin: 0; padding:0; } footer.content-info ul.menu li { float:left; margin-right:22px; background:url(../img/square7.png) no-repeat 0px 11px; padding-left:22px; } footer.content-info ul.menu li:hover { background:url(../img/square7_blue.png) no-repeat 0px 11px;} footer.content-info ul.menu li a { color:#000; } footer.content-info ul.menu li a:hover { color:#008ccd; text-decoration:none; } footer.content-info ul.menu:after { content: '\A'; white-space:pre; } footer.content-info span:nth-child(1), footer.content-info span:nth-child(2) { padding-right:20px; background:url(../img/square7.png) no-repeat right 5px; } footer.content-info span:nth-child(2), footer.content-info span:nth-child(3) { padding-left:15px; } .lang { position:absolute; top:7px; right:0; width:200px; text-align:right; height:20px; } .lang img { vertical-align:top; } #lang_sel_list ul { float:right; } /********************************* team *********************************/ .yoo-grid { margin:20px 0 20px -20px; position:relative; } .yoo-grid:after { content:""; display:block; clear:both; } [class*="yoo-width-"] { box-sizing:border-box; padding-left:20px; float:left; } .yoo-width-1-4 { width:25%; } .yoo-width-3-4 { width:75%; } .yoo-width-1-3 { width:33.333%; } /********************************* responsiveness *********************************/ @media (min-width:768px) { /*.container { width: 750px }*/ .navbar { height: 150px; background:rgba(255,255,255,1.00); } .navbar-brand { height: 112px; width:250px; background:url(../img/spann-bau.png) no-repeat; background-size:contain; margin-top:20px; } .navbar-default .navbar-nav > li { padding-top:70px; width:75px; position:relative; font-size:11px; } ul#menu-hauptnavi li p { background-size:59px 59px; width:63px; height:63px; top:-63px; } .navbar-default .navbar-nav > li > a { background:url(../img/square.png) no-repeat 0px 10px; color:#000; } .navbar-nav > li > a { line-height: 15px; padding-bottom: 5px; padding-top: 5px; padding-left:10px; } .fixesubnavi ul.subnavi li { font-size:12px; } .navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li.active > a { background:url(../img/square5_blue.png) no-repeat 0px 10px; color:#008ccd; } } @media (min-width:980px) { .navbar { background:#fff; background:rgba(255,255,255,.8); height: 130px; background: -moz-linear-gradient(top left, transparent 0%, #FFF 30%); background: -webkit-linear-gradient(top left, transparent 0%, #FFF 30%); background: -ms-linear-gradient(top left, transparent 0%, #FFF 30%); background: -o-linear-gradient(top left, transparent 0%, #FFF 30%); } /*.container { width: 970px; padding-right:0px; }*/ .navbar-brand { height: 130px; width:291px; background:url(../img/spann-bau.png) no-repeat; background-size:contain; margin-top:10px; } .navbar-default .navbar-nav > li { padding-top:65px; width:100px; position:relative; font-size:14px; } .fixesubnavi ul.subnavi li { font-size:14px; } } @media (min-width:1200px) { .navbar { background:#fff; background:rgba(255,255,255,.8); background: -moz-linear-gradient(top left, transparent 5%, #FFF 30%); background: -webkit-linear-gradient(top left, transparent 5%, #FFF 30%); background: -ms-linear-gradient(top left, transparent 5%, #FFF 30%); background: -o-linear-gradient(top left, transparent 5%, #FFF 30%); } .navbar-brand { float: left; padding: 15px 15px; text-indent:-9999px; height: 130px; width:291px; background:url(../img/spann-bau.png) no-repeat; margin-right:30px; margin-top:0px; } /* navigation */ ul#menu-hauptnavi { margin-top:20px;padding-left:5px;} ul#menu-hauptnavi li p { background-size:59px 59px; width:63px; height:63px; top:-65px; } ul#menu-hauptnavi li p:hover { opacity:1.0; cursor:pointer;} .navbar-default .navbar-nav > li { padding-top:65px; width:120px; position:relative; font-size:13px; } .navbar-default .navbar-nav > li > a { background:url(../img/square7.png) no-repeat 0px 17px; color:#000; padding-left:15px; line-height:15px; padding-top:13px; } .sidebar ul.menu > li.active a { color:#008ccd;background:url(../img/square7_blue.png) no-repeat 0px 5px; } .navbar-default .navbar-nav > li.active a, .navbar-default .navbar-nav > li > a:hover { color:#008ccd;background:url(../img/square7_blue.png) no-repeat 0px 17px; } } /* wtf? @media (min-width:768px) { .sticky-widget-areas-reloaded.swar.subnavi.subnavi-swar.scroll-to-fixed-fixed { left:1% !important;} } @media (min-width:980px) { .sticky-widget-areas-reloaded.swar.subnavi.subnavi-swar.scroll-to-fixed-fixed { left:3% !important;} } @media (min-width:1300px) { .sticky-widget-areas-reloaded.swar.subnavi.subnavi-swar.scroll-to-fixed-fixed { left:5% !important;} } @media (min-width:1400px) { .sticky-widget-areas-reloaded.swar.subnavi.subnavi-swar.scroll-to-fixed-fixed { left:7.5% !important;} } @media (min-width:1500px) { .sticky-widget-areas-reloaded.swar.subnavi.subnavi-swar.scroll-to-fixed-fixed { left:10.4% !important;} } @media (min-width:1600px) { .sticky-widget-areas-reloaded.swar.subnavi.subnavi-swar.scroll-to-fixed-fixed { left:12.7% !important;} } @media (min-width:1700px) { .sticky-widget-areas-reloaded.swar.subnavi.subnavi-swar.scroll-to-fixed-fixed { left:15% !important;} } @media (min-width:1800px) { .sticky-widget-areas-reloaded.swar.subnavi.subnavi-swar.scroll-to-fixed-fixed { left:17% !important;} } @media (min-width:1900px) { .sticky-widget-areas-reloaded.swar.subnavi.subnavi-swar.scroll-to-fixed-fixed { left:18.5% !important;} } */