matt-barker
12/3/2017 - 11:38 AM
https://raphael-guldimann-xcl3.squarespace.com
/* styling the default Squarespace cookie banner */
.cookie-notice {
/* Fix to top of browser */
position: fixed!important;
/* dimensions of banner */
width: 82vw;
padding-right: 18vw!important;
/* color of banner */
background: #121212!important;
border: none!important;
/* font size and colour */
font-size: 12px!important;
color: #ccc!important;
line-height: 1em;
}
.cookie-notice a {
/* white underlined link to cookie policy */
color: white;
text-decoration: underline;
}
.cookie-notice button {
/* Replace 'Continue' button with X */
margin-top: 0!important;
position: absolute;
background: #121212;
border: none;
font-style: normal;
font-family: "freight-sans-pro";
font-size: 27px; //Adjust for font used
top: 2px; //Adjust for font used
right: 36px;
color: white;
}
nav a:hover:before {
width: 30px !important;
margin-left: 0px !important;
}
nav a:before {
content: ".";
font-size: 0;
border-bottom: solid 2px #FF9C5B;
position: absolute;
bottom: 10px !important;
width: 0px;
transition: all ease-in-out 200ms;
-ms-transition: all ease-in-out 200ms;
-moz-transition: all ease-in-out 200ms;
-webkit-transition: all ease-in-out 200ms;
}
/* CUSTOM CSS */
.sqs-block-summary-v2 {
.summary-item {
height: auto !important;
background: none;
border: solid 1px #ddd;
padding: 20px 20px 10px 20px;
}
.summary-title {
text-transform: uppercase;
font-weight: 600;
font-size: 15px;
}
.summary-excerpt {
margin-bottom: 20px;
}
.summary-metadata-container.summary-metadata-container--below-content {
top: 0px !important;
position: absolute;
margin-top: 20px;
right: 20px !important;
background: rgba(0,0,0,0.4);
padding: 6px 14px;
}
.summary-metadata-item--date {
color: #fff;
opacity: 1;
}
.summary-read-more-link {
margin-bottom: 0px;
border-top: solid 1px #ddd;
padding-top: 8px;
text-transform: uppercase;
font-size: 12px;
font-weight: 600;
letter-spacing: 3px;
text-align: center;
transition: all ease-in-out 300ms !important;
}
.summary-read-more-link:hover {
letter-spacing: 5px;
}
}
footer {
overflow-y: scroll;
max-height: 100vh;
height: auto !important;
}
// Secondary Navigation Styling
.secondaryNavigationMain,.secondaryNavigationMobile {
font-family: Lato;
font-weight: 600;
position:relative;
padding:0 0 10px 0;
.collection {
display:inline-block;
a {
padding:1em;
font-size:12px!important;
}
}
}
.secondaryNavigationMobile{
padding: 0px 36px 72px;
span {
display:none;
}
.collection {
margin:.75em 0;
display:block;
a {
padding:1em 0!important;
}
}
}
#sidecarNav nav {
padding: 24px 36px 42px;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!--Fullscreen Search Popup Code-->
<div class="sqs-block search-block sqs-block-search fullscreen-search-popup" data-block-type="33">
<div class="sqs-block-content fullscreen-search-input-wrapper">
<div class="sqs-search-ui-text-input sqs-search-ui-button-wrapper color-light" data-source="block" data-preview="true" data-collection="">
<div class="spinner-wrapper" hidden="hidden" style="display: none;"></div><input type="search" class="search-input hover-effect fullscreen-search-input" value="" placeholder="Search...">
<div class="yui3-widget sqs-widget sqs-search-preview">
<div class="sqs-search-preview-content"></div>
</div>
</div>
</div><span class="close-search-popup"><svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18"><path class="close-search-popup-svg" d="M 0,0 L 18,18 M 18,0 L 0,18"/></svg></span></div>
<style>
.fullscreen-search-popup {
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-around;
position: fixed;
z-index: -2;
top: 0;
background: rgba(255, 255, 255, .98);
width: 100vw;
height: 100vh;
opacity: 0;
transition: .5s
}
.fullscreen-search-popup.visible {
opacity: 1;
z-index: 9999
}
.close-search-popup {
position: fixed;
right: 30px;
top: 30px;
cursor: pointer
}
.fullscreen-search-input-wrapper {
width: 50%;
max-width: 500px
}
.close-search-popup-svg {
stroke: black;
fill: transparent;
stroke-linecap: round;
stroke-width: 2;
}
.fullscreen-search-input {
color: #000!important;
border: 0!important;
border-bottom: 2px solid #000!important;
font-size: 2em!important;
background: 0 0!important;
padding: 12px 12px 12px 40px!important
}
@media screen and (max-width:768px) {
.fullscreen-search-popup {
align-items: top;
justify-content: flex-start
}
.fullscreen-search-input-wrapper {
width: 90%;
margin-top: 25%
}
}
@media screen and (max-width:768px) and (orientation:landscape) {
.fullscreen-search-input-wrapper {
margin-top: 0
}
.close-search-popup {
position: fixed;
right: 10px;
top: 10px
}
}
.sqs-spin.light {
border: 3px solid rgba(0, 0, 0, .7)!important
}
.sqs-spin.default {
width: 14px;
height: 14px
}
.spinner-wrapper {
opacity:0;
}
</style>
<script>
$(window).ready(function() {
var searchFont = $('body p').css('font-family');
console.log(searchFont);
$('.fullscreen-search-input').css('font-family',searchFont);
//$("[href*='/suche']").html('<i class="icon ion-search"></i>');
$(".close-search-popup").click(function() {
$(".fullscreen-search-popup").removeClass("visible");
});
$("[href*='/search']").click(function(e) {
e.preventDefault(), $(".fullscreen-search-popup").addClass("visible");
$(".fullscreen-search-input").focus();
})
});</script>
<!--End Fullscreen Search Popup Code-->
<script type="text/javascript">
var _mfq = _mfq || [];
(function() {
var mf = document.createElement("script");
mf.type = "text/javascript"; mf.async = true;
mf.src = "//cdn.mouseflow.com/projects/fe51fa7a-fcc6-43b0-9a96-fa0d4f4a30e9.js";
document.getElementsByTagName("head")[0].appendChild(mf);
})();
</script>
<script type="text/javascript">
Static.EU_COOKIE_POLICY = "bottom-left";
Static.EU_COOKIE_TEXT = 'We use cookies to create the most secure and effective website possible for our customers. By continuing to use the site, you agree to our <a href="/cookie-policy" target="_blank">cookie policy</a>.';
Static.EU_COOKIE_BUTTON_LABEL = 'X';
</script>
<style>footer {position:fixed;left:0;bottom:0;width:100%;box-sizing:border-box; max-width:100vw !important;z-index:-9;} footer .sqs-layout {word-wrap: break-word; width:100%;max-width:1200px;margin-left:auto;margin-right:auto;} html{background:#fff !important;}</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<div class="footerbox" style="pointer-events:none;">
</div>
<script>
$(function(){
$( ".footerbox" ).insertAfter( $( "body" ) );
});
</script>
<script>
$(function(){
var footheight = $("footer").height();
$(".footerbox").css({height: footheight});
});
</script>
<!--Secondary Nav -->
<div class="secondary-nav-wrapper" style="display:none;">
<div class="secondaryNavigationFooter">
<div class="collection">
<a href="/blog">Blog</a>
</div>
<div class="collection">
<a href="/search">Suche</a>
</div>
<span class="divider">
|
</span>
<div class="collection">
<a href="#" class="english-selector">English</a>
</div>
</div>
</div>
<script>
$(document).ready(function(){
var thisPage = window.location.href,
page=thisPage.split('/').pop(),
n=page.substr(page.length - 2);
console.log(n);
$('.secondaryNavigationFooter').clone().prependTo($('#mainNavWrapper')).removeClass('secondaryNavigationFooter').addClass('secondaryNavigationMain');
$('.secondaryNavigationFooter').clone().appendTo($('#mobileNavWrapper')).removeClass('secondaryNavigationFooter').addClass('secondaryNavigationMobile');
if (n == 'en') {
var location = thisPage.slice(0, -3);
$('.english-selector').text('Deutsche');
$('.english-selector').attr('href',location);
} else {
var location = thisPage;
$('.english-selector').text('English');
$('.english-selector').attr('href',location+'-en');
}
});
</script>