/* --------------------------------------------------- Title: IDEENWERKSTATT TINTIFAX - Layout CSS Author: Pierpaolo Federici - IDEENWERKSTATT TINTIFAX ------------------- Color Palette -------------------- blue - rgb(24,56,91); yellow - rgb(255,203,0); ------------------------------------------------------ /*======================== BASIC ========================*/ body {font-family: 'Lato', sans-serif;} h1,h2,h3,h4 {font-family: 'Orbitron', sans-serif;} .bold {font-weight: bold;} .center {text-align: center;} .underline{text-decoration: underline;} .gold {color: rgb(218,165,32);} .highlight {padding-left: 20px;} .highlight:before {content:'\2606'; position: absolute; padding-right: 20px; font-size: 1em; margin-left: -20px;} /*======================== HEADER ========================*/ header {background-color: rgba(24,56,91, .95); width: 100%; top: 0; display: inline-block; position: fixed; z-index: 100;} header.menu-big {height: 120px;} header.menu-small {height: 80px;} .menu-big .logo {width:60%; max-width: 210px; margin: 15px;} .menu-small .logo {width:100%; max-width: 140px; margin: 10px;} header, .logo {-webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; -ms-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear;} /* slide-show */ .bg-fade {position:relative; width:100%;} .bg-fade ul.slides {margin:0; height: 400px;} .bg-fade ul.slides > li {display:block; position:absolute; width: 100%; height: 400px; left:0; top:0; background-position: center; background-size: cover; background-repeat: no-repeat;} #index .bg1 {background-image: url('/web/20170825185032im_/http://bernhardpickl.at/site/templates/images/slide01.jpg');} #index .bg2 {background-image: url('/web/20170825185032im_/http://bernhardpickl.at/site/templates/images/slide02.jpg');} #index .bg3 {background-image: url('/web/20170825185032im_/http://bernhardpickl.at/site/templates/images/slide03.jpg');} #index .bg4 {background-image: url('/web/20170825185032im_/http://bernhardpickl.at/site/templates/images/slide04.jpg');} #index .bg5 {background-image: url('/web/20170825185032im_/http://bernhardpickl.at/site/templates/images/slide05.jpg');} #index .bg6 {background-image: url('/web/20170825185032im_/http://bernhardpickl.at/site/templates/images/slide06.jpg');} #index .bg7 {background-image: url('/web/20170825185032im_/http://bernhardpickl.at/site/templates/images/slide07.jpg');} #slideshow #controls {position: absolute; width: 100%; bottom: 40%;} #slideshow #controls .next, #slideshow #controls .prev {font-size: 6em; padding: 20px; color: #fff; opacity: 0.5; cursor: pointer;} #slideshow #controls .next:hover, #slideshow #controls .prev:hover {opacity: 1;} #slideshow #controls .next {float: right;} #slideshow #controls .prev {float: left;} /* Über uns */ #uebermich {color: rgb(24,56,91); background-color: rgb(255,203,0); padding: 40px 0;} #uebermich .text img {max-width: 40%; float: left; padding: 5px 20px 5px 0;} /*galerie*/ #galerie .container {width: 100%; max-width: 100%; padding: 0;} #galerie img {width: 100%; display: block; float: left;} /*#galerie a:before {content:""; position: absolute; width: 100%; height: 100%; left: 0; background-color: rgb(24,56,91); opacity: 0; transition: all 0.3s ease-in, color 0.3s ease-in;} #galerie a:hover:before {opacity: 0.5; background-blend-mode: multiply;}*/ /* Erfolge */ section#erfolge {margin: 40px 0;} #erfolge h3 {color: rgb(24,56,91);} #erfolge h4 {color: rgb(24,56,91); padding: 0; margin: 0; font-size: 1.2em; font-weight: 700;} #erfolge h5 {margin: 0; font-weight: 700; color: rgb(24,56,91); font-size: 1em;} #erfolge .box {text-align: center; margin-top: 20px;} #erfolge .box img {width:70%;} #erfolge .box p {margin-bottom: 0; font-size: 0.85em;} #erfolge .box span {display: inline-block; margin-top: 20px; font-size: 1em; border-bottom: 5px solid rgb(255,203,0);} /* Foto */ section#foto {margin-top: 70px;} #foto div.img {background:url('/web/20170825185032im_/http://bernhardpickl.at/site/templates/images/foto-parallax.jpg') no-repeat center; background-size: cover; height: 550px; width: 100%;} #foto .motto {position: relative; top:170px;} /* aktuelles */ #aktuelles {padding: 40px 0; color: #fff; background-color: rgb(24,56,91);} #aktuelles .termin {border-bottom: 2px dotted rgba(255,255,255, 0.2); padding: 10px 0;} #aktuelles .termin:first-child {margin-top: 40px;} #aktuelles .termin:last-of-type {border:none;} #aktuelles .termin .date {font-family: 'Orbitron', sans-serif; } #aktuelles .termin h5 {color: rgb(255,203,0); margin-bottom: 0;} #aktuelles .termin p {margin: 0;} #aktuelles.list h5 {font-weight: 400;} #aktuelles .ergebniss {color: rgb(255,203,0); text-decoration: none; display: block;} #aktuelles .ergebniss:before {content: " > ";} #aktuelles #archiv, #aktuelles #next_termine {padding-bottom: 300px;} /*======================== FOOTER ========================*/ footer {color: rgb(255,203,0); line-height: 50px;} #sponsoren {padding: 40px 0;} #sponsoren h5 {text-align: center; font-size: 1.3em; color: rgb(24,56,91);} #sponsoren img {width: 100%; max-width: 150px; display: block; margin: 0 auto;} #sponsoren .haupt img {margin-top: 20px; max-width: 200px;} #kontakt {text-align: center; font: 1.3em 'Orbitron', sans-serif; color: rgb(24,56,91); background-color: rgb(255,203,0);} #kontakt a {color: #18385B; display: inline-block; padding: 15px 0px 10px; letter-spacing: 1px; text-decoration: none; overflow: hidden;} #kontakt a:after{content: ""; width:100%; display: block; border-bottom: 2px solid rgb(24,56,91); margin-left: -110%; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; transition: all 0.3s linear;} #kontakt a:hover:after {margin-left:0;} #credits {background-color: rgb(24,56,91); font-size: 0.9em;} #credits a {color: rgb(255,203,0); text-decoration: none;} #credits a:hover{color: #fff;} footer .tintifax {display: block; text-align: center} footer .impressum {display:block; text-align: center;} footer .copy {display:block; text-align: center;} /*======================== IMPRESSUM PAGE ========================*/ #impressum {background-color: rgb(24,56,91); color: #fff; padding: 20px 0;} #impressum h3 {color: rgb(255,203,0);} .featherlight-iframe, .featherlight-content {overflow: hidden!important;} .featherlight .featherlight-close-icon {top: 10px!important; right: 10px!important; width: 35px!important;} /* Back to top button */ #back-top {position: fixed; z-index: 100; right: 20px; bottom: 20px; display: none;} /* arrow icon (span tag) */ #back-top span {width: 50px; height: 50px; display: block; margin-bottom: 7px; background: rgb(24,56,91) url('/web/20170825185032im_/http://bernhardpickl.at/site/templates/images/up-arrow.png') no-repeat center center; /* rounded corners */ -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; /* background color transition */ -webkit-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; } #back-top a:hover span {background-color: rgb(255,203,0);} /* Media Queries –––––––––––––––––––––––––––––––––––––––––––––––––– */ /* Larger than mobile */ @media (min-width: 400px) { } /* mobile landscape */ @media (max-height: 450px) { #slideshow { margin-top: 80px; } } /* Larger than phablet (also point when grid becomes active) */ @media (min-width: 550px) { .menu-big .logo {width:80%;} footer .logo {display: none;} footer .kontakt, footer .form {width: 100%!important;} } /* Larger than tablet */ @media (min-width: 750px) { .bg-fade ul.slides, .bg-fade ul.slides > li {height: 710px;} #uebermich .text { -webkit-column-count: 2; /* Chrome, Safari, Opera */ -moz-column-count: 2; /* Firefox */ column-count: 2; -webkit-column-gap: 60px; /* Chrome, Safari, Opera */ -moz-column-gap: 60px; /* Firefox */ column-gap: 60px;} #galerie img {width: 50%;} /*#galerie a:before {width: 50%;}*/ #erfolge .box:before {content:""; display: block; position: absolute; border-left: 1px solid rgb(227,227,227); height: 90%; margin-left: -2%;} #erfolge .box.no-border:before {border: none;} #erfolge .box h4 {font-size: 1.8em;} #erfolge .box h5 {font-size: 1.2em;} #erfolge .box p {font-size: 1em;} #erfolge .box span {font-size: 1.2em;} #aktuelles .termin:first-child {margin-top: 0px;} #credits .tintifax {text-align: left;} #credits .impressum {text-align: right;} } /* Larger than desktop */ @media (min-width: 1000px) { #galerie img {width: 25%;} /*#galerie a:before {width: 25%;}*/ #aktuelles #archiv, #aktuelles #next_termine {padding-bottom: 50px;} } /* Larger than Desktop HD */ @media (min-width: 1200px) { } /* Wide Screen */ @media (min-width: 1400px) { } /*====================== buttons =======================*/ .ghost-button { display: block; float: left; margin-right: 10px; color: rgb(255,203,0); border: 1px solid #fff; text-align: center; text-decoration: none; outline: none; transition: all 0.3s ease-in, color 0.3s ease-in; } .ghost-button a {text-decoration: none; color: #fff; transition: all 0.3s ease-in, color 0.3s ease-in;} .ghost-button:hover a {color: rgb(24,56,91); transition: color 0.3s ease-in, color 0.3s ease-in;} .ghost-button:hover, .ghost-button:focus, .ghost-button:active { background-color: rgb(255,203,0); transition: all 0.3s ease-in, color 0.3s ease-in; } /* FILE ARCHIVED ON 18:50:32 Aug 25, 2017 AND RETRIEVED FROM THE INTERNET ARCHIVE ON 16:45:10 Mar 23, 2026. JAVASCRIPT APPENDED BY WAYBACK MACHINE, COPYRIGHT INTERNET ARCHIVE. ALL OTHER CONTENT MAY ALSO BE PROTECTED BY COPYRIGHT (17 U.S.C. SECTION 108(a)(3)). */ /* playback timings (ms): captures_list: 1.688 exclusion.robots: 0.138 exclusion.robots.policy: 0.11 esindex: 0.023 cdx.remote: 27.024 LoadShardBlock: 513.952 (3) PetaboxLoader3.datanode: 334.774 (4) PetaboxLoader3.resolve: 269.137 (2) load_resource: 286.883 */