@import url("pb0d3.css");
@font-face {
    font-family: "sofia-pro";
    src: url("https://use.typekit.net/af/02ad94/00000000000000003b9b46f3/27/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff2"),
        url("https://use.typekit.net/af/02ad94/00000000000000003b9b46f3/27/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff"),
        url("https://use.typekit.net/af/02ad94/00000000000000003b9b46f3/27/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("opentype");
    font-display: auto;
    font-style: normal;
    font-weight: 700;
}
@font-face {
    font-family: "sofia-pro";
    src: url("https://use.typekit.net/af/ed85d3/00000000000000003b9b46f4/27/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3") format("woff2"),
        url("https://use.typekit.net/af/ed85d3/00000000000000003b9b46f4/27/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3") format("woff"),
        url("https://use.typekit.net/af/ed85d3/00000000000000003b9b46f4/27/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3") format("opentype");
    font-display: auto;
    font-style: italic;
    font-weight: 700;
}
@font-face {
    font-family: "sofia-pro";
    src: url("https://use.typekit.net/af/f5f3eb/00000000000000003b9b46eb/27/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n3&v=3") format("woff2"),
        url("https://use.typekit.net/af/f5f3eb/00000000000000003b9b46eb/27/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n3&v=3") format("woff"),
        url("https://use.typekit.net/af/f5f3eb/00000000000000003b9b46eb/27/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n3&v=3") format("opentype");
    font-display: auto;
    font-style: normal;
    font-weight: 300;
}
@font-face {
    font-family: "sofia-pro";
    src: url("https://use.typekit.net/af/ebb75a/00000000000000003b9b46ec/27/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i3&v=3") format("woff2"),
        url("https://use.typekit.net/af/ebb75a/00000000000000003b9b46ec/27/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i3&v=3") format("woff"),
        url("https://use.typekit.net/af/ebb75a/00000000000000003b9b46ec/27/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i3&v=3") format("opentype");
    font-display: auto;
    font-style: italic;
    font-weight: 300;
}
.tk-sofia-pro {
    font-family: "sofia-pro", sans-serif;
}
html,
body {
    font-family: "sofia-pro";
}
.text-blau {
    color: #0bd596 !important;
}
.infobox {
    top: 90px;
}
.infobox:after {
    content: " ";
    width: 100%;
    position: absolute;
    height: 5px;
    left: 0;
    bottom: 0;
    background-color: #0bd596;
    background: linear-gradient(90deg, rgba(149, 236, 48, 1) 0, rgba(0, 218, 152, 1) 60%, rgba(129, 229, 210, 1) 100%);
}
.close-hover:hover {
    cursor: pointer;
}
.themen h1 {
    color: #fff !important;
    text-align: left;
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 10px;
    line-height: 4;
}
.themen h1:before {
    color: #fff !important;
    text-align: left;
    margin: 0;
}
.themen h1:before {
    background-size: cover;
    background-repeat: no-repeat;
    width: 105px;
    height: 105px;
}
.themen h1.wohlbefinden:before {
    content: " ";
    background-image: url("https://www.griesser.ch/images/icons/themen/comfort-daylight.svg");
}
.themen h1.energie-klima:before {
    content: " ";
    background-image: url("https://www.griesser.ch/images/icons/themen/comfort-cool.svg");
}
.themen h1.terrasse:before {
    content: " ";
    background-image: url("https://www.griesser.ch/images/icons/themen/patio-garden.svg");
}
.themen h1.sicherheit:before {
    content: " ";
    background-image: url("https://www.griesser.ch/images/icons/themen/safety.svg");
}
.accordion-link:hover {
    background: #fff;
}
.back a:hover {
    background: transparent;
    color: #0bd596;
}
.kontakt-box {
    background: #f5fff9;
}
.kontakt-box .titel span {
    background: 0;
}
.kontakt-box .titel {
    background: 0;
    padding-top: 15px;
}
.kontakt-box .oder div {
    position: relative;
    background: 0;
}
.kontakt-box .oder div:before {
    content: " ";
    position: absolute;
    top: 15px;
    left: 0;
    width: 40%;
    background-color: #000;
    height: 1px;
}
.kontakt-box .oder div:after {
    content: " ";
    position: absolute;
    top: 15px;
    right: 0;
    width: 40%;
    background-color: #000;
    height: 1px;
}
.kontakt-box .oder span {
    padding: 0;
    background: transparent;
    line-height: 1;
}
.kontakt-box .email .kontakt-link,
.kontakt-box .beratung .kontakt-link {
    border: 0;
}
.kontakt-box .telefon {
    padding-bottom: 15px;
}
.kontakt-box.cart {
    border: 0;
    padding: 5px;
    background: #f5fff9 url(../png/cart.png) no-repeat 15px 10px;
    background-size: 32px 32px;
}
.kontakt-box.cart:hover {
    background-color: #f5fff9;
}
.kontakt-box.cart:hover a {
    color: #0bd596;
}
.design fieldset legend {
    color: #0bd596;
}
.design button,
.design .button {
    background-color: #0bd596;
    color: #fff;
    border-color: #0bd596;
    transition: 0.2s all;
}
.design button:hover,
.design button:focus,
.design .button:hover,
.design .button:focus {
    background-color: #0bd596;
    color: #333332;
    border-color: #0bd596;
}
.archiv li a:hover,
.archiv li a.active {
    background-color: transparent;
    color: #0bd596;
}
.news article a:hover {
    background-color: transparent;
    color: #0bd596;
}
#lstReferenzen li h3 {
    color: #0bd596;
}
.referenz-details .download-pdf {
    background-color: #0bd596;
    color: #fff;
    border-color: #0bd596;
    transition: 0.2s all;
}
.referenz-details .download-pdf:hover {
    background-color: #0bd596;
    color: #333332;
    border-color: #0bd596;
}
@media screen and (max-width: 860px) {
    .infobox {
        top: 0;
        margin-bottom: 15px;
    }
}
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "sofia-pro";
}
header {
    height: 130px;
}
header:after {
    content: " ";
    width: 77%;
    position: absolute;
    height: 5px;
    right: 15px;
    bottom: 32px;
    background-color: #0bd596;
    background: linear-gradient(90deg, rgba(149, 236, 48, 1) 0, rgba(0, 218, 152, 1) 60%, rgba(129, 229, 210, 1) 100%);
}
#imgLogo {
    position: absolute;
    margin-top: 20px;
    width: 200px;
}
#lstMetaNavigation {
    z-index: 15;
    top: 15px;
    right: 275px;
    margin: 0;
}
#lstMetaNavigation a {
    line-height: 1;
    padding: 2px 10px;
}
#lstMetaNavigation a:hover {
    color: #0bd596;
}
#lstMetaNavigation a.active {
    color: #0bd596;
}
#lstHauptNavigation {
    top: 48px;
    right: 260px;
    min-width: 515px;
    width: auto;
    font-size: 1rem;
}
#lstHauptNavigation a {
    padding: 4px 18px;
    line-height: 1;
}
#lstHauptNavigation a:hover {
    color: #0bd596;
}
#lstHauptNavigation a.active {
    color: #0bd596;
}
#lstHauptNavigation li:last-of-type a {
    padding-right: 0;
}
#divLand {
    top: 15px;
    background: #fff;
    color: #4d4d4d;
    border-color: #000;
}
#divLand:before {
    display: none;
}
#divLand .dropdown {
    height: 30px;
    line-height: 1.5rem;
    color: #4d4d4d;
    padding-left: 5px;
    font-size: 1rem;
}
#divLand .dropdown:after {
    height: 30px;
    width: 25px;
    background-color: #e3e3e3;
    border-left: 1px solid #000;
    font-size: 1.5rem;
    line-height: 1.25;
}
#divLand .nav > div {
    background-color: #fff;
    font-size: 0.825rem;
}
#divLand .nav > div:hover {
    background-color: #e3e3e3;
    color: #000;
}
#divLand .nav > div ul {
    background-color: #e3e3e3;
}
#divLand .nav > div ul li a {
    height: 36px;
    width: 30px;
    color: #000;
    line-height: 2.25rem;
}
#divLand .nav > div ul li a:hover {
    background-color: #3c3c3c;
    color: #fff;
}
#divSearch {
    position: absolute;
    top: 48px;
    right: 15px;
    width: 320px;
}
#divSearch input[type="text"] {
    width: 193px;
    border: 0;
    font-size: 1rem;
    height: 25px;
    margin-top: 11px;
    border-bottom: 1px solid #000;
    border-radius: 0;
    line-height: 1;
}
#divSearch input[type="text"]:focus {
    outline: 0;
}
#divSearch .postfix {
    background-color: transparent;
    color: #000;
    border: 0;
    opacity: 1;
    border-bottom: 1px solid #000;
    width: 48px;
    padding-left: 0;
    padding-right: 0;
}
#divSearch .postfix.icon-search:before {
    position: absolute;
    right: 0;
    top: 5px;
}
.icon-search:before {
    content: " ";
    display: block;
    background-image: url(../png/search.png);
    background-position: center;
    background-size: cover;
    width: 30px;
    height: 30px;
}
#divSearch .postfix:hover {
    background-color: transparent;
    color: #000;
    border: 0;
    opacity: 1;
    border-bottom: 1px solid #000;
}
#lstProdukteBigmenu {
    top: 61px;
    background: #fff;
}
.lstProdukteBigmenu-background {
    background: linear-gradient(90deg, rgba(149, 236, 48, 0.6) 0, rgba(0, 218, 152, 0.6) 60%, rgba(129, 229, 210, 0.6) 100%);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
#lstProdukteBigmenu > div.row h2,
#lstProdukteBigmenu li,
#lstProdukteBigmenu li .overview-link,
#lstProdukteBigmenu li a,
#lstProdukteBigmenu .expert-info p {
    color: #000;
}
#lstProdukteBigmenu h2 {
    border-color: #000;
}
#lstProdukteBigmenu li a {
    border-color: #000;
}
#lstProdukteBigmenu .uebersicht-link a {
    background: 0;
}
#lstHauptNavigation ul {
    background: #fff;
}
#lstHauptNavigation ul:before {
    content: " ";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, rgba(149, 236, 48, 0.6) 0, rgba(0, 218, 152, 0.6) 60%, rgba(129, 229, 210, 0.6) 100%);
}
#lstHauptNavigation ul li a {
    color: #000 !important;
    border-color: #000 !important;
}
#lstMetaNavigation li div {
    background-color: #fff;
    color: #000;
}
#lstMetaNavigation li div:before {
    z-index: -15;
    content: " ";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, rgba(149, 236, 48, 0.6) 0, rgba(0, 218, 152, 0.6) 60%, rgba(129, 229, 210, 0.6) 100%);
}
.sub-navigation li a:hover,
.sub-navigation li a.active {
    color: #0bd596;
}
.left-off-canvas-menu {
    background: linear-gradient(90deg, rgba(149, 236, 48, 1) 0, rgba(0, 218, 152, 1) 60%, rgba(129, 229, 210, 1) 100%);
}
.left-off-canvas-menu > div a,
.left-off-canvas-menu a,
.left-off-canvas-menu > ul li a,
.left-off-canvas-menu > ul,
.left-off-canvas-menu > ul.accordion-container li a {
    background: transparent;
    color: #000 !important;
    border-color: #000;
}
.right-off-canvas-menu {
    background: #fff;
}
.right-off-canvas-menu > div {
    color: #000;
    border-color: #000;
}
.right-off-canvas-menu ul {
    background-color: #e3e3e3;
}
.right-off-canvas-menu ul li a:link,
.right-off-canvas-menu ul li a:active,
.right-off-canvas-menu ul li a:visited {
    color: #000;
}
#divFooterNavigation a {
    color: #000;
    border-bottom: 0;
}
#divFooterNavigation a:hover {
    text-decoration: underline;
}
.sub-footer .background {
    color: #fff;
    background-color: #252525;
    padding: 15px;
}
.sub-footer ul {
    float: right;
    margin-top: -5px;
}
.sub-footer ul li {
    display: inline-block;
    position: relative;
}
.sub-footer ul li:not(:last-of-type) {
    padding-right: 5px;
}
.sub-footer ul li:not(:last-of-type):after {
    content: "|";
    position: absolute;
    top: 0;
    right: 0;
}
.sub-footer ul li a {
    color: #fff;
    padding-left: 15px;
    padding-right: 15px;
    text-decoration: none;
}
.sub-footer ul li a:hover {
    color: #0bd596;
}
.sub-footer ul li:first-of-type a {
    padding-left: 0;
}
.sub-footer ul li:last-of-type a {
    padding-right: 0;
}
@media screen and (max-width: 700px) {
    .sub-footer ul {
        float: none;
        margin-top: 15px;
    }
    .sub-footer ul li {
        display: block;
    }
    .sub-footer ul li a {
        padding: 0;
    }
    .sub-footer ul li:after {
        display: none;
    }
}
.owl-theme .owl-dots .owl-dot span {
    background-color: #fff;
    border: 1px solid #808080;
    width: 12px;
    height: 12px;
}
.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span {
    background-color: #a6a6a6;
}
.aktuell-slider li {
    background: transparent;
    border-bottom: 1px solid #000;
}
.aktuell-slider li:hover {
    background: transparent;
}
.aktuell-slider h2 {
    padding: 0;
    margin-top: 0.5rem;
}
.aktuell-slider p {
    padding: 0;
    margin-bottom: 0;
}
.aktuell-slider li:hover .more {
    text-decoration: underline;
}
.aktuell-slider .more {
    background-color: transparent;
    border: 0;
    text-align: right;
    font-weight: bold;
    margin: 0 28px;
    bottom: 0;
}
.aktuell-slider .more:after {
    content: "→";
    background: transparent;
    border: 0;
    font-family: inherit;
}
.aktuell-slider .owl-nav {
    display: none;
}
.tiles {
    margin-bottom: 50px;
}
.tiles li {
    transition: 0.2s opacity;
    background-image: linear-gradient(90deg, rgba(149, 236, 48, 1) 0, rgba(0, 218, 152, 1) 60%, rgba(129, 229, 210, 1) 100%);
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    border-radius: 15px;
}
.tiles li:hover {
    background-image: linear-gradient(90deg, rgba(149, 236, 48, 1) 0, rgba(0, 218, 152, 1) 60%, rgba(129, 229, 210, 1) 100%);
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    opacity: 0.6;
}
.tiles li a.icon:before {
    background-repeat: no-repeat;
    background-size: cover;
    width: 85px;
    height: 85px;
    margin-bottom: 15px;
}
.tiles li a.icon.wohlbefinden:before {
    content: " ";
    background-image: url("https://www.griesser.ch/images/icons/themen/comfort-daylight.svg");
}
.tiles li a.icon.energie-klima:before {
    content: " ";
    background-image: url("https://www.griesser.ch/images/icons/themen/comfort-cool.svg");
}
.tiles li a.icon.terrasse:before {
    content: " ";
    background-image: url("https://www.griesser.ch/images/icons/themen/patio-garden.svg");
}
.tiles li a.icon.sicherheit-schutz:before {
    content: " ";
    background-image: url("https://www.griesser.ch/images/icons/themen/safety.svg");
}
#divProduktKategorien .kategorie {
    background-color: #f5fff9;
}
#divProduktKategorien .kategorie.smart-home-produkt {
    border: 2px solid #f5fff9;
    transition: 0.2s all;
}
#divProduktKategorien .kategorie.smart-home-produkt:hover {
    border: 2px solid #0bd596;
}
#divProduktKategorien .kategorie.smart-home-produkt:hover h2 {
    color: #0bd596;
}
#divProduktKategorien a.produkt-link.cover-hover:hover {
    background: transparent;
}
#divProduktKategorien h2 {
    background-color: #f5fff9;
    color: #333332;
    border-bottom: 1px solid #333332;
    text-indent: 0;
    margin-right: 15px;
    margin-left: 0.7em;
}
#divProduktKategorien a.produkt-link {
    border: 1px solid #0bd596;
    background-color: #fff;
    transition: 0.2s all;
    color: #333332;
}
#divProduktKategorien a.produkt-link:hover {
    background-color: #fff;
    color: #0bd596;
}
#divProduktKategorien .kategorie .produkt-bilder .image-slider .owl-dot.active span {
    background-color: #a6a6a6;
}
#divProduktKategorien .kategorie .info .einleitung {
    padding-right: 15px;
}
.datei .download li a {
    background-color: rgba(11, 213, 150, 0.6);
    color: #000;
}
.datei .download li a:hover {
    background-color: #0bd596;
    color: #000;
}
.datei .download li .datei-groesse {
    color: #000;
}
@media screen and (max-width: 1024px) {
    #divProduktKategorien .kategorie {
        padding: 15px;
    }
    #divProduktKategorien h2 {
        color: #333332;
    }
}
.cbp_tmtimeline > li .cbp_tmlabel,
.cbp_tmtimeline > li:nth-child(odd) .cbp_tmlabel {
    background-color: #f5fff9;
}
.cbp_tmtimeline > li .cbp_tmlabel:after,
.cbp_tmtimeline > li:nth-child(odd) .cbp_tmlabel:after {
    border-right-color: #f5fff9;
}
.cbp_tmtimeline > li .cbp_tmicon {
    color: #333;
}
.cbp_tmtimeline > li .cbp_tmicon {
    border-color: #0bd596;
}
.cbp_tmtimeline:before {
    background-color: #0bd596;
}
.accordion-link {
    color: #333;
    transition: 0.2s all;
}
.accordion-link:hover {
    background-color: transparent;
    color: #0bd596;
}
.themen h1 {
    background: linear-gradient(90deg, rgba(149, 236, 48, 0.6) 0, rgba(0, 218, 152, 0.6) 60%, rgba(129, 229, 210, 0.6) 100%);
    color: #000 !important;
}
.smart-home-content .topic-links a {
    background-color: #f5fff9;
    border: 2px solid #f5fff9;
    transition: 0.2s all;
    color: #000;
}
.smart-home-content .topic-links a:hover {
    background-color: #f5fff9;
    border: 2px solid #0bd596;
    color: #0bd596;
}
.standorte.laender {
    background-color: #f5fff9;
}
.laender.standorte li a {
    background-color: #f5fff9;
}
.laender.standorte li a:hover {
    background-color: #f5fff9;
    color: #0bd596;
}
#divStandorteListe li a:hover {
    background-color: transparent;
    color: #0bd596;
}