:root {
	--sprite-icon: url('/wp-content/uploads/sites/28/sprite-2.svg');
	--sprite-icon-social: url('/wp-content/uploads/sites/28/sprite-social.svg');
}
/*
 * The Typekit service used to deliver this font or fonts for use on websites
 * is provided by Adobe and is subject to these Terms of Use
 * http://www.adobe.com/products/eulas/tou_typekit. For font license
 * information, see the list below.
 *
 * brother-1816:
 *   - http://typekit.com/eulas/00000000000000007735cf16
 *   - http://typekit.com/eulas/00000000000000007735cf1c
 *   - http://typekit.com/eulas/00000000000000007735cf22
 *
 * © 2009-2026 Adobe Systems Incorporated. All Rights Reserved.
 */
/*{"last_published":"2026-02-24 12:57:32 UTC"}*/

@import url("https://p.typekit.net/p.css?s=1&k=bfd1nek&ht=tk&f=35364.35366.35370.35381.35382.35385.35386&a=85644551&app=typekit&e=css");

@font-face {
font-family:"brother-1816";
src:url("https://use.typekit.net/af/a4b264/00000000000000007735cf16/31/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n3&v=3") format("woff2"),url("https://use.typekit.net/af/a4b264/00000000000000007735cf16/31/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n3&v=3") format("woff"),url("https://use.typekit.net/af/a4b264/00000000000000007735cf16/31/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n3&v=3") format("opentype");
font-display:auto;font-style:normal;font-weight:300;font-stretch:normal;
}

@font-face {
font-family:"brother-1816";
src:url("https://use.typekit.net/af/c59ba7/00000000000000007735cf1c/31/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff2"),url("https://use.typekit.net/af/c59ba7/00000000000000007735cf1c/31/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff"),url("https://use.typekit.net/af/c59ba7/00000000000000007735cf1c/31/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("opentype");
font-display:auto;font-style:normal;font-weight:400;font-stretch:normal;
}

@font-face {
font-family:"brother-1816";
src:url("https://use.typekit.net/af/c5adeb/00000000000000007735cf22/31/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff2"),url("https://use.typekit.net/af/c5adeb/00000000000000007735cf22/31/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff"),url("https://use.typekit.net/af/c5adeb/00000000000000007735cf22/31/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("opentype");
font-display:auto;font-style:normal;font-weight:700;font-stretch:normal;
}


/* variables via style options */
:root {
	/* text */
    --font-stack-default: 'brother-1816', 'Arial', 'Helvetica', sans-serif;
	--font-stack-title: 'brother-1816', 'Arial', 'Helvetica', sans-serif;
    --text-color: #1d1d1b; /* black */    
    --text-color-title: #1d1d1b; /* black */
    --text-color-link: #1d1d1b; /* black */  
    --text-color-link-icon: #667942; /* green */
    --text-color-link-underline: #667942; /* green */
    --text-color-light: #fff; 
    --font-weight-normal: 400;
    --font-weight-bold: 700;
    --font-weight-title: 700;
    --text-color-disabled: #ccc;
    --letter-spacing: 0.005em;
    
    /* colors */
    --bg-content: #ffffff;
    --bg-dark: #1c2014;    
    --bg-light: #f1ede7;
    --color-primary: #354814; /* violet */
    --color-highlight: #667942; /* green */
    --btn-bg: #667942; /* violet */
    --btn-bg-hover: #354814; /* green */
    --bg-dark-transparent: rgba(4, 7, 0, 0.5);
    --bg-teaser-big: transparent; /* blue */
    --bg-teaser-cta-1: #1c2014; /* blue */
    --bg-teaser-cta-2: #1c2014; /* blue */
    --bg-darker: #1c2014;
    --bg-title-box: #303334;
    --bg-title-box-before: #354814;
    --bg-title-box-after: #c6c6c6;
    
    /* borders */
    --border-basic: #c8b79f;
    --border-footer: #515151;
    --border-highlight: #c8b79f; /* blue */
    --line-width-highlight: 4px;
    --border-outside-width: 20px;
    
        
    /* newsletter */
    --newsletter-bg: rgba(255,255,255,0.5);
    --newsletter-bg-focus: #fff;
    --newsletter-field-text-color: #2A2228;
    
    /* form */
    --form-error: #dd0000; 
    --form-error-text: #dea6af;
    --form-ok: #00D4B4;
    --form-text-small: 0.8rem;
    
    
    /* font Sizes */
    --text-size-main: 18px;
    --text-size-title-h1: 3rem;
    --text-size-title-h2: 2rem;
    --text-size-title-h3: 1.35rem;
    --text-size-nav: 0.9rem;
    --text-size-lead: 1.5rem;
    --text-size-offcanvas: 1.5rem;
    --text-size-team-nr: 2rem;
    --text-size-team-nr-big: 3rem;
    --text-size-quote: 2rem;
    --text-size-small: 0.8rem;
    --text-size-small-xs: 0.75rem;
    
   
    /* accordion */
    --plus-length: 24px;
    --plus-stroke: 4px;
    --plus-stroke-position: 10px;
    --plus-icon-padding: 48px;
    
    --box-padding-small: 1.5em 30px;
    
    --border-radius: 0px;
    
    --title-padding: 0.5em 30px 0.25em 30px;
    
    
}

.c-teaser-big .c-text-light,
.c-cookie-notice.c-text-light {
    --text-color: #1d1d1b;
    --text-color-light: #1d1d1b;
    --text-color-link: #1d1d1b;
    --text-color-title: #1d1d1b; 
    --border-basic: #c8b79f;
}


.c-history::before {
    --bg-light: #ccc;
}


.c-footer {
    --color-primary: var(--bg-dark);
}

.c-text-light {
    --text-color-title: #fff;
    --text-color: #fff;
    --text-color-light: #fff;
}

.c-text-light .c-btn {
    --text-color-light: #ffffff;
}


@media only screen and (min-width:1201px) {
    :root {
        --grid-container: 40px;
        --grid-row: -20px;
        --grid-col: 20px;
    }
}


@media only screen and (max-width:1200px) {
    :root {
        --text-size-title-h1: 2.6rem;
        
       --border-outside-width: 16px;
        
        --grid-container: 30px;
        --grid-row: -15px;
        --grid-col: 15px;
    } 
}



@media only screen and (max-width:768px) {
	:root  {
        --text-size-main: 16px;
        --text-size-title-h1: 1.8rem;
        
        --text-size-title-h2: 1.4rem;
        --text-size-team-nr: 1.5rem;
        
        --text-size-title-h3: 1.15rem;
        --text-size-quote: 1.4rem;
        --text-size-offcanvas-team: 1.15rem;
        
        --text-size-lead: 1.15rem;
        --text-size-offcanvas: 1.25rem;
        --text-size-small: 0.85rem;
        
        --border-outside-width: 8px;
        
        --title-padding: 0.5em 15px 0.25em 15px;
    }
}


@media only screen and (max-width: 767px) {
    :root {
        --plus-length: 16px;
        --plus-stroke: 4px;
        --plus-stroke-position: 6px;
        --plus-icon-padding: 30px;
    }
    
    :root .c-accordion-contest .c-accordion-inner {
        --plus-icon-padding: 0;
    }
}




/* ==========================================================================
  Header
   ========================================================================== */

.c-header-logo {
  height: 88px;
  width: 150px;
}

@media only screen and (max-width: 1024px) {
  .c-header-logo {
    height: 46px;
    width: 80px;
  }
}

@media only screen and (max-width: 900px) {
  .c-header-logo {
    height: 46px;
    width: 80px;
  }
}

.c-main-nav-list,
.c-offcanvas-nav-list {
    font-weight: var(--font-weight-bold);
}


.c-main-nav-list a::before,
.c-offcanvas-nav-list a::before {
    left: -12px;
	width: calc(100% + 24px);
	height: 100%;
    /*border: solid 4px var(--color-highlight);*/
    box-shadow: 0px 0px 0px 0px var(--color-highlight) inset;
	transition: all 0.2s linear;
    background: transparent;
    transform: skew(-7deg, 0deg);
}

.c-main-nav-list a:focus::before,
.c-main-nav-list a:hover::before,
.c-main-nav-list .current_page_item a::before,
.c-offcanvas-nav-list  a:focus::before,
.c-offcanvas-nav-list  a:hover::before,
.c-offcanvas-nav-list  .current_page_item a::before {
	/*width: 100%;*/
    width: calc(100% + 24px);
    box-shadow: 0px 0px 0px 4px var(--color-highlight) inset;
}


.c-header-inner .wpml-ls-legacy-list-horizontal a::before,
.c-offcanvas-content .wpml-ls-legacy-list-horizontal a::before{
    height: 4px;
    height: var(--line-width-highlight);
}


/* ==========================================================================
   Offcanvas
   ========================================================================== */

.c-offcanvas-nav {
    --color-highlight: #809159;
}

.c-offcanvas-nav {
    background-color: var(--bg-darker);
}

.c-offcanvas-nav-list a {
    display: block;
    padding: 0.5em 20px;
}

.c-offcanvas-nav-list a::before {
    left: 0;
	width: calc(100% + 24px);
	height: 100%;
    /*border: solid 4px var(--color-highlight);*/
    box-shadow: 0px 0px 0px 0px var(--color-highlight) inset;
	transition: all 0.2s linear;
    background: transparent;
    transform: skew(-14deg, 0deg);
}

.c-offcanvas-nav-list  a:focus::before,
.c-offcanvas-nav-list  a:hover::before,
.c-offcanvas-nav-list  .current_page_item a::before{
	width: 100%;
}

.c-offcanvas-trigger-open::before {
    height: 22px;
    margin-top: -11px;
    border-width: 4px;
}

.c-offcanvas-trigger-open::after {
    height: 4px;
    margin-top: -2px;
}

.c-offcanvas-trigger-close::before, .c-offcanvas-trigger-close::after {
    height: 4px;
}

.c-offcanvas-lang ul {
    padding-left: 20px;
}

/* ==========================================================================
   Typo
   ========================================================================== */
h1, .c-h1 {
    font-size: var(--text-size-title-h1);
    text-transform: uppercase;
    letter-spacing: var(--letter-spacing);
}

.c-teaser-big h2,
.c-teaser-imgbg h2,
.c-teaser-cta h2,
.c-offcanvas-nav-list {
    text-transform: uppercase;
    letter-spacing: var(--letter-spacing);
}

h3, .c-h3,
h4, .c-h4 {
    font-family: var(--font-stack-default);
    font-weight: var(--font-weight-bold);
}

.c-lead {
    font-weight: var(--font-weight-normal);
}


.c-category-title {
    padding-bottom: 0.75em;
}

.c-box h2 + .c-btn {
    margin-top: 0.75em;
}

.c-text-block blockquote::before {
    width: var(--line-width-highlight);
}

.c-profile-list dt,
.c-table-layout th {
    font-size: var(--text-size-small-xs);
}


/* ==========================================================================
   button /links
   ========================================================================== */

/*.c-btn,
.c-text-light .c-btn {
    border:solid 4px var(--btn-bg);
}

.c-btn:focus,
.c-btn:hover,
.c-text-light .c-btn:focus,
.c-text-light .c-btn:hover {
    border-color: var(--btn-bg);
}*/


.c-btn {
    background-color: transparent;
    text-transform: uppercase;
    letter-spacing: var(--letter-spacing);
    border: none;
}

.c-text-light .c-btn {
    border:none;
}

.c-btn,
.c-btn:visited {
    color: var(--color-highlight);
}

.c-btn:hover, 
.c-btn:focus {
    color: var(--text-color-light);
}

.c-btn::before,
.c-btn::after {
    content:'';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 100%;
    transition: all 0.2s ease-out;
    transform: skew(-7deg, 0deg);
}

.c-btn::before {
    width: 100%;
	height: 100%;
    box-shadow: 0px 0px 0px 4px var(--color-highlight) inset;
    background-color: var(--bg-content);
}    

.c-btn::after {
    width: 0;
    background-color: var(--btn-bg);
}

.c-btn:hover::after {
    width: 100%;
}

.c-btn span {
    z-index: 1;
}


.c-link-arrow::before,
.c-link-back::before {
	top: 0.35em;
}

.c-link-download::before {
	top: 0.05em;
}

.c-link-extern::before {
	top: 0.05em;
    height: 22px;
}

@media only screen and (max-width:767px) {   
	.c-link-arrow::before {
		top: 0.25em;
	}
	
	.c-link-download::before {
		top: -.1em;
	}
	
	.c-link-extern::before {
		top: -.12em;
	}
}

/* ==========================================================================
   Showroom
   ========================================================================== */

.c-showroom::after {
    content: '';
    position: absolute;
    top: 6px;
    width: 100%;
    height: 1px;
    border-top: solid 4px var(--bg-content);
}

.c-showroom, .c-showroom-text .c-row {
  min-height: 100vh;
  min-height: calc(100vh - var(--header-height));
}

.c-img-overlay {
  background: linear-gradient(0deg,rgba(0,0,0,.5) 0,transparent);
}

.c-showroom-text-inner {
  padding-bottom: var(--spacing-m);
}


.c-showroom-img::after {
    content:'';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 40%;
    height: 100%;
    background-image: url("https://lars-zaugg.ch/wp-content/uploads/sites/28/showroom-logo-zaugg.svg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: right top;
    opacity: 0.2;
}

@media only screen and (max-width: 767px) {
    .c-showroom-img::after {
        width: 50%;
        height: 100%;
        background-size: contain;
    }
}

/* ==========================================================================
   news
   ========================================================================== */
.c-teaser-news .c-col-6,
.c-teaser-people .c-col-4,
.c-teaser-people .c-col-4 {
    display: flex;
    flex-direction: column;
}

.c-teaser-item {
    flex: 1;
    border-top: solid 4px var(--border-basic);
    border-left: solid 4px var(--border-basic);
}

/*
.c-teaser-item::before {
    content:'';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    box-shadow: 0px 0px 0px 4px var(--border-basic) inset;
    transform: skew(-7deg, 0deg);
}*/

.c-teaser-text {
    border-top: none;
    padding: var(--box-padding-small);
    padding-bottom: 0;
}

.c-teaser-item .c-category-title {
    color: #7b7162;
}

@media only screen and (min-width: 1300px) {
    .c-teaser-news .c-col-6 {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 33.33333%;
        -ms-flex: 0 0 33.33333%;
        flex: 0 0 33.33333%;
        max-width: 33.33333%;
    }
}

/* ==========================================================================
   c-teaser-cta
   ========================================================================== */

.c-teaser-cta .c-box + .c-box {
    margin-top: 10px;
}

.c-teaser-cta .c-box,
.c-teaser-cta .c-box + .c-box {
    border: solid 1px var(--color-highlight);
}

/* ==========================================================================
   c-teaser-big
   ========================================================================== */

.c-teaser-big {
    max-width: 1360px;
    margin-left: auto;
	margin-right: auto;
    padding-left: var(--grid-container);
    padding-right: var(--grid-container);
    overflow: visible;
    padding-bottom: 1.4em;
}

.c-teaser-big + .c-teaser-big {
    margin-top: calc(var(--spacing-s) * -1);
}

.c-teaser-big .c-box {
    max-width: auto;
}

.c-teaser-big-img {
    min-height: 1px;
    height: auto;
}

.c-teaser-big .c-teaser-img {
    position: relative;
	height: 0;
	display: block;
	overflow: hidden;
    padding-bottom: 66.666%;
}

.c-teaser-big .c-teaser-img img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.c-teaser-big .c-box {
    position: relative;
    margin-left: calc(var(--grid-container) * -2);
    padding-left: calc(var(--grid-container) * 2);
}

.c-teaser-big .c-row-reverse .c-box {
    margin-left: auto;
    margin-right: calc(var(--grid-container) * -2);
    /*padding-left: var(--grid-container);*/
    padding-left: 0;
    padding-right: calc(var(--grid-container) * 2);
}

/*
.c-teaser-big .c-btn {
    position: absolute;
    left: calc(var(--grid-container) * 2);
    bottom: -1.4em;
}
    
.c-teaser-big .c-row-reverse .c-btn {
    left: var(--grid-container);
}*/

.c-teaser-big .c-box::before {
    content:'';
    position: absolute;
    top: 0;
    left: -30px;
    /*width: 100%;*/
    height: 100%;
    /*box-shadow: 0px 0px 0px 4px var(--border-basic) inset;*/
    width: 30px;
    border-left: solid 12px var(--border-basic);
    border-right: solid 12px var(--border-basic);
    transform: skew(-10deg, 0deg);
}


.c-teaser-big .c-box::after {
    content:'';
    position: absolute;
    top: 0;
    left: 18px;
    width: 40px;
    height: 12px;
    /*box-shadow: 0px 0px 0px 4px var(--border-basic) inset;*/
    border-top: solid 12px var(--border-basic);
    transform: skew(-10deg, 0deg);
}

.c-teaser-big .c-row-reverse .c-box::before {
    left: auto;
    right: 0;
}

.c-teaser-big .c-row-reverse .c-box::after {
    left: auto;
    right: 0px;
}

@media only screen and (min-width: 1400px) {
  .c-teaser-big .c-box {
    max-width: 720px;
  }
}

@media only screen and (min-width: 901px) {
    .c-teaser-big .c-row {
        margin-left: var(--grid-row);
        margin-right: var(--grid-row);
        align-items: flex-start;
    }

    .c-teaser-big .c-col-6 {
        padding-left: var(--grid-col);
        padding-right: var(--grid-col);
    }

    .c-teaser-big .c-col-6:first-child {
        margin-top: var(--grid-container);
    }
}

@media only screen and (max-width: 900px) {
    .c-teaser-big {
        margin-left: auto;
        margin-right: auto;
        padding-left: var(--grid-container);
        padding-right: var(--grid-container);
        overflow: hidden;
    }


    .c-teaser-big .c-row {
        margin-left: var(--grid-row);
        margin-right: var(--grid-row);
        align-items: flex-start;
    }

    .c-teaser-big .c-col-6 {
        padding-left: var(--grid-col);
        padding-right: var(--grid-col);
    }
    
    .c-teaser-big .c-col-6:first-child {
        flex: 0 0 83.33333%;
        max-width: 83.33333%;
        margin-left: auto;
    }
    
    /*.c-teaser-big .c-row-reverse .c-col-6:first-child {
        margin-left: 0;
        margin-right: auto;
    }*/
    
    .c-teaser-big .c-box {
        margin-left: 0;
        margin-right: auto;
        /*padding-left: var(--grid-container);*/
        padding-left: 0;
        padding-right: calc(var(--grid-container) * 2);
    }
    
    .c-teaser-big .c-row-reverse .c-box {
        margin-left: 0;
        margin-right: auto;
    }
    
    .c-teaser-big .c-box::before {
      left: auto;
      right: 0;
    }
    
    .c-teaser-big .c-box::after {
        left: auto;
        right: 0px;
    }


    .c-teaser-big .c-box {
        padding-top: calc(var(--grid-container) * 2);
        margin-top: calc(var(--grid-container) * -1);
        max-width: 600px;
    }

    .c-teaser-big-img {
        min-height: 1px;
    }

    .c-teaser-big .c-teaser-img {
        position: relative;
        height: 0;
        display: block;
        overflow: hidden;
        padding-bottom: 66.666%;
    }

    .c-teaser-big .c-teaser-img img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}

@media only screen and (max-width: 767px) {
    .c-teaser-big .c-col-6:first-child,
    .c-teaser-big .c-row-reverse .c-col-6:first-child{
        flex: 0 0 calc(100% + (var(--grid-container) * 2));
        max-width: calc(100% + (var(--grid-container) * 2));
        margin-left: calc(var(--grid-container) * -1);
        margin-right: calc(var(--grid-container) * -1);
    }
}

/* ==========================================================================
   teaser imgbg text
   ========================================================================== */

@media only screen and (min-width: 701px) {
    .c-teaser-imgbg-text .c-box::before {
        border-left: solid 4px var(--bg-content);
        border-right: solid 4px var(--bg-content);
        transform: skew(-7deg, 0deg);
    }
}

@media only screen and (max-width: 700px) {
    .c-teaser-imgbg-text .c-box::before {
        border-top: solid 4px var(--bg-content);
    }
}

/* ==========================================================================
   c-footer
   ========================================================================== */
.c-footer {
    font-size: var(--text-size-small);
}



/* ==========================================================================
   Accordion
   ========================================================================== */

/* plus styles */
.c-accordion-title {
    padding-left: var(--plus-icon-padding);
}

.c-accordion-inner {
    padding-left: var(--plus-icon-padding);
}

.c-accordion-check:checked+label::after,
.c-accordion-check:not(:checked)+label::after,
.c-accordion-check:checked+label::before,
.c-accordion-check:not(:checked)+label::before {
    content: '';
    display: block;
    position: absolute;
	top: 1.1em;
    border: none;
    transform: rotate(0deg);
}

.c-accordion-check:checked+label::after,
.c-accordion-check:not(:checked)+label::after {
    left: 0;
	margin-top: var(--plus-stroke-position);
	width: var(--plus-length);
	height: var(--plus-stroke);
	background-color: var(--color-highlight);
}

.c-accordion-check:checked+label::before,
.c-accordion-check:not(:checked)+label::before {
    left: var(--plus-stroke-position);
	width: var(--plus-stroke);
	height: var(--plus-length);
	background-color: transparent;
}

.c-accordion-check:not(:checked)+label::before {
   	background-color:  var(--color-highlight);
}

/* ==========================================================================
   footer
   ========================================================================== */

.c-footer::after {
    content: '';
    position: absolute;
    top: -10px;
    width: 100%;
    height: 1px;
    border-top: solid 4px var(--bg-dark);
}

.c-footer::before {
    content:'';
    position: absolute;
    right: 0;
    bottom: 0;
    width: 60%;
    height: 100%;
    background-image: url("https://lars-zaugg.ch/wp-content/uploads/sites/28/footer-logo-zaugg.svg");
    background-repeat: no-repeat;
    background-size: cover;
    opacity: 0.1;
}

@media only screen and (max-width: 767px) {
    .c-footer::before {
        width: 100%;
        height: 100%;
    }
}

/* ==========================================================================
   Cookie
   ========================================================================== */
.c-cookie-notice {
    
    border: solid 4px var(--color-highlight);
    /*transform: rotate3d(-2deg);*/
    background-color: var(--bg-content);
}

/* ==========================================================================
   max width images
   ========================================================================== */

@media only screen and (min-width: 1400px) {
  .c-img-wide,
  .c-img-2col {
    max-width: 1360px;
    margin-left: auto;
    margin-right: auto;
  }
}

/* ==========================================================================
   Icon Wreath
   ========================================================================== */

.c-icon-wreath,
.c-icon-wreath-eidg {
    display: inline-block;
    width: 35px;
    height: 1.5em;
    margin-right: 0.5em;
}

.c-icon-wreath::before,
.c-icon-wreath-eidg::before {
    top: 50%;
    left: 0;
    width: 36px;
    height: 32px;
    margin-top: -12px;
    background-position: 0 -160px;
}

.c-icon-wreath-eidg::before {
    background-position: -50px -160px;
}