@font-face{font-family:EffraLight;src:url(brandguidereliant/resources/fonts/Effra_Std_Lt.ttf)}
@font-face{font-family:Effra;src:url(brandguidereliant/resources/fonts/Effra_Std_Rg.ttf)}
body{margin:0;*{box-sizing:border-box}
h1,h2,h3,h4,h5,h6{font-weight:500;&,p{font-family:Effra,sans-serif;font-style:normal}
}
h1{font-size:32px;line-height:38px}
h2{font-size:28px;line-height:38px}
h3{font-size:26px;line-height:36px}
h4{font-size:24px;line-height:34px}
h5{font-size:22px;line-height:32px}
h6{font-size:20px;line-height:30px}
p{font-size:16px;line-height:22px}
@media(min-width:576px){h1{font-size:42px;line-height:52px}
h2{font-size:36px;line-height:46px}
h3{font-size:34px;line-height:44px}
h4{font-size:28px;line-height:36px}
h5{font-size:26px;line-height:34px}
h6{font-size:22px;line-height:32px}
p{font-size:20px;line-height:26px}
}
:-webkit-any(article,aside,nav,section) h1{font-size:32px;@media(min-width:576px){font-size:42px}
}
}
@media(max-width:767px){.container{max-width:100%;padding:0}
}
.bg-black{background-color:#333}
.logo{width:140px;height:75px}
nav.cmp-navigation{height:100px;position:relative;*{user-select:none}
ul.cmp-navigation__group{list-style:none;margin:0}
li.cmp-navigation__item{font-family:Effra;outline:0;font-size:12px;position:relative;display:grid;align-items:center;grid-auto-flow:column;gap:8px;&:has(ul.cmp-navigation__subgroup){&>a.cmp-navigation__item-link{pointer-events:none}
&::after{content:"";border-style:solid;border-width:2px 2px 0 0;border-color:#000;height:5px;transform:rotate(135deg);transform-origin:center;width:5px;transition:transform 100ms linear;justify-self:end}
&.cmp-navigation__item--expanded:has(ul.cmp-navigation__subgroup),&.cmp-navigation__item-nested--expanded:has(ul.cmp-navigation__nested-subgroup){&::after{transform:rotate(-45deg)}
}
}
&:has(ul.cmp-navigation__nested-subgroup){cursor:pointer;padding-inline:24px;& a.cmp-navigation__item-link{padding:8px 0}
}
}
&>ul.cmp-navigation__group{display:flex;padding-right:24px;height:100%;max-height:1000px;transition:max-height 100ms linear;gap:10px;:hover{cursor:pointer}
&>li.cmp-navigation__item{height:100%;padding-inline:5px;text-align:left;&.cmp-navigation__item--expanded,ul.cmp-navigation__subgroup{background-color:#eee}
a.cmp-navigation__item-link{display:block;user-select:none;text-decoration:none;color:#000;cursor:pointer}
>ul.cmp-navigation__subgroup{position:absolute;top:100%;right:0;z-index:1000;width:275px;border-bottom-left-radius:4px;border-bottom-right-radius:4px;display:grid;gap:10px;padding-block:8px;padding-inline-start:unset;:hover{text-decoration:underline;cursor:pointer}
li.cmp-navigation__item:not(.cmp-navigation__item--expanded) &{display:none}
&>li.cmp-navigation__item:not(:has(ul.cmp-navigation__nested-subgroup)) a.cmp-navigation__item-link{padding:8px 24px;cursor:pointer}
& ul.cmp-navigation__nested-subgroup{overflow-y:hidden;grid-row:2;grid-column:span 2;transition:max-height 100ms linear;max-height:0;background-color:#f8f8f8;border-radius:4px;padding-inline:24px 4px;li.cmp-navigation__item-nested--expanded>&{max-height:1000px}
li.cmp-navigation__item:hover{filter:brightness(1.1)}
}
}
}
button.cmp-navigation__toggle{display:none}
}
@media(width <= 767px){height:auto;min-height:24px;&>ul.cmp-navigation__group{position:relative;background-color:#fff;width:100%;left:0;top:40px;flex-direction:column;height:auto;padding-inline:0;z-index:1;gap:2px;&:not(.cmp-navigation__expanded){max-height:0;&>li.cmp-navigation__item,&>li.cmp-navigation__item>a.cmp-navigation__item-link{overflow-y:hidden}
}
& a.cmp-navigation__item-link{line-height:50px;color:#000;font-size:16px;padding:0 8px !important}
li.cmp-navigation__item{gap:0;&:has(ul.cmp-navigation__subgroup){&::after{position:relative;right:16px}
}
&:has(ul.cmp-navigation__nested-subgroup){padding-inline:0}
}
>li.cmp-navigation__item{box-sizing:border-box;padding-inline:0;ul.cmp-navigation__expanded &{border-bottom:1px solid transparent;background-color:#eee;&:not(.cmp-navigation__item--expanded){border-bottom:1px solid white}
>ul.cmp-navigation__subgroup{position:relative;width:100%;background-color:#f3f3f3;border-block:1px solid white;padding:0;border-radius:0;gap:0;grid-row:2;grid-column:span 2;top:0;&>li.cmp-navigation__item:not(:last-of-type)>a.cmp-navigation__item-link{border-bottom:1px solid white}
& ul.cmp-navigation__nested-subgroup{background-color:#f8f8f8;border-radius:0;padding-inline:0;li.cmp-navigation__item-nested--expanded>&{max-height:unset;border-top:1px solid white;li.cmp-navigation__item{border-bottom:1px solid white;padding-left:24px}
}
}
}
}
}
button.cmp-navigation__toggle{display:block;position:absolute;top:-40px;outline:0;background-color:#000;border:0;width:100%;border-bottom:1px solid white;color:white;padding-block:8px;&>span.cmp-navigation__toggle-icon{width:24px;min-height:24px;display:inline-block;vertical-align:middle;content:"";background:50%/100% 100% no-repeat;background-image:url(brandguidereliant/resources/images/hamburguer.svg)}
}
}
}
}
header.cmp-header{background-color:#fff;max-width:100%;>.cmp-container{display:grid;gap:16px;align-items:center;>.image{grid-column:1;padding-left:24px;grid-row:1;margin-block:auto;justify-self:right;img{height:auto;width:132px}
}
>.navigation{grid-column:2;grid-row:1}
@media(width <= 767px){grid-template-columns:1fr;grid-template-rows:auto auto;>.navigation{grid-column:1}
>.image{grid-row:2;padding-block:38px;justify-self:center}
}
}
}
.separator{&>.cmp-separator{&>hr{border-color:rgba(0,0,0,.1)}
}
}
.container{& .cmp-footer .container{@media(min-width:576px){padding-inline:calc((100% - 540px) / 2)}
@media(min-width:768px){padding-inline:calc((100% - 720px) / 2)}
@media(min-width:992px){padding-inline:calc((100% - 960px) / 2)}
@media(min-width:1200px){padding-inline:calc((100% - 1140px) / 2)}
}
}
.cmp-list{.cmp-sidebar-list &{padding:0;margin:0;list-style:none;border-right:1px solid #ebebeb;& li.cmp-list__item{border-bottom:1px solid #ebebeb;& a{text-decoration:none;min-height:35px;padding:2px 10px;color:#444;display:flex;align-items:center;font-family:Effra;&:hover,&.active{background-color:#c8c8c8;color:white}
}
}
}
}
.cmp-text{*{font-family:Effra}
&.cmp-text--primary{color:#b9006d}
&.cmp-text--secondary{color:#00aeef}
}
.cmp-button{outline:0;display:block;white-space:nowrap;cursor:pointer;text-decoration:none;text-align:center;width:auto;min-height:16px;min-width:32px;.cmp-button--primary &,.cmp-button--secondary &,.cmp-button--tertiary &{border:1px solid;color:#FFF}
.cmp-button--secondary &{font-family:EffraLight}
.cmp-button--primary &,.cmp-button--tertiary &{font-family:Effra;font-weight:bold}
.cmp-button--primary &{padding:10px 30px;background-color:#cd007a;font-size:17px;border-color:#cd007a;border-radius:50px}
.cmp-button--secondary &{padding:10px 30px;background-color:#0097d0;font-size:17px;border-color:#0097d0;border-radius:50px}
.cmp-button--tertiary &{padding:10px 30px;background-color:white;font-size:17px;color:#cd007a;border-color:#cd007a;border-radius:50px}
&:hover{background-color:#FFF;text-decoration:underline;.cmp-button--primary &{background-color:#b9006d}
.cmp-button--secondary &{color:#0097d0}
}
@media(width <=767px){.cmp-button--secondary &,.cmp-button--primary &,.cmp-button--tertiary &{border-radius:50px;padding:10px 20px;font-size:15px;width:100%}
}
}
.cmp-download{padding:25px 0 15px;.cmp-download__action{display:inline-block;padding:10px 15px;background-color:#dff2fe;border-radius:5px;color:#00aeef;text-decoration:none;font-family:Effra;&:hover{color:#ec008c;text-decoration:underline}
}
.cmp-download__properties,.cmp-download__title{display:none}
}
footer.cmp-footer{font-family:"Effra";padding-bottom:40px;&>.cmp-container{& p{color:#939598;margin-bottom:0;font-size:14px}
& a{color:#00aeef;text-decoration:none;&:hover{text-decoration:underline;color:#cd007a}
}
}
}
.cmp-image{z-index:1;position:relative;img.cmp-image__image{height:auto}
}
.cmp-accordion{padding-inline:16px;.cmp-accordion__item{border-top:1px solid #d7d7d7;padding-block:24px;color:#707070;.cmp-accordion__header{button.cmp-accordion__button{font-family:Effra;background-color:transparent;border:0;outline:0;span.cmp-accordion__title{font-size:16px;color:#707070;line-height:1.5;transition:color .3s ease-out;&::after{content:"";display:inline-block;position:relative;top:6px;left:12px;height:6px;width:6px;vertical-align:top;border-style:solid;border-width:2px 2px 0 0;-webkit-transform:rotate(135deg);transform:rotate(135deg);-webkit-transition:transform .3s ease-in-out,top .3s ease-in-out;transition:transform .3s ease-in-out,top .3s ease-in-out}
button.cmp-accordion__button:hover &{color:#ec008c}
@media(width <= 767px){font-size:14px}
}
}
}
.cmp-accordion__panel{padding-top:24px;transition:grid-template-rows .3s ease-out;display:grid;grid-template-rows:0fr;&.cmp-accordion__panel--expanded{grid-template-rows:1fr}
>*{overflow:hidden}
}
&.cmp-accordion__item:has(.cmp-accordion__panel--expanded){.cmp-accordion__header{button.cmp-accordion__button{span.cmp-accordion__title{&::after{-webkit-transform:rotate(315deg);transform:rotate(315deg);top:9px}
}
}
}
}
}
}
.container{&.cmp-promo{padding-inline:24px;& img{height:auto}
& .cmp-button{width:fit-content;white-space:unset;@media(width < 575px){width:100%}
}
&:is(.cmp-promo--small,.cmp-promo--medium--first-variant,.cmp-promo--medium--second-variant,.cmp-promo--large--first-variant,.cmp-promo--large--second-variant)>.cmp-container{display:grid}
&:is(.cmp-promo--medium--second-variant,.cmp-promo--large--first-variant,.cmp-promo--large--second-variant)>.cmp-container{border-radius:16px;padding-block:8px;background-color:#f4f4f9}
&.cmp-promo--small{padding-inline:78px;>.cmp-container{background-color:#f2fbff;border-radius:16px;padding-block:8px;grid-template-columns:2fr 5fr 2fr;place-items:center;padding-inline:0 40px;.image{max-width:190px;max-height:190px;grid-column:1;grid-row:1}
&:not(:has(.button)) .text{grid-column:2 / span 2}
&:has(.button) .text{grid-column:2}
.text{grid-row:1;p{text-wrap:balance;font-size:20px;line-height:26px}
a{color:#cd007a;&:hover{text-decoration:none}
}
}
.button{grid-column:3;grid-row:1;justify-self:end}
}
@media(width <=992px){padding-inline:24px;>.cmp-container{grid-template-columns:1fr;padding-inline:20px;&:not(:has(.button)),&:has(.button){.text{grid-column:1;grid-row:2;& *{text-align:center}
}
}
.button{grid-column:1;grid-row:3;justify-self:center}
}
}
}
&.cmp-promo--medium{>.cmp-container{grid-template-columns:repeat(2,1fr)}
&.cmp-promo--medium--first-variant{>.cmp-container{padding-inline:24px;column-gap:30px;>:is(.image,.embed){overflow:hidden;grid-row:1 / span 2;height:100%;width:100%;text-align:center;img{border-radius:16px;max-width:480px;object-fit:cover;object-position:center}
iframe{width:100%;border-radius:16px}
}
.text{grid-column:2;grid-row:1;&>.cmp-text>*:first-child{margin-top:0}
p{text-wrap:balance}
a{color:#cd007a;&:hover{text-decoration:none}
}
}
.button{grid-column:2;grid-row:2}
:not(:has(.button)){.text{grid-row:1 / span 2}
}
}
@media(width < 992px){padding-inline:0;>.cmp-container{padding-inline:20px;grid-template-columns:1fr;column-gap:0;:is(.image,.embed){grid-row:1;grid-column:1}
.text{grid-row:2;grid-column:1}
.button{grid-row:3;grid-column:1}
}
}
}
&.cmp-promo--medium--second-variant{>.cmp-container{padding-block:32px;&>div{padding-inline:16px}
.image{grid-row:1;img{border-radius:16px}
}
.text{grid-row:1;*{margin-top:0}
p{text-wrap:balance;font-size:20px;line-height:26px}
a{color:#cd007a;&:not(:hover){text-decoration:none;&::after{left:0}
}
&::after{border-style:solid;border-width:2px 2px 0 0;content:"";display:inline-block;float:none;height:9px;margin-left:8px;margin-right:10px;padding-right:0;position:relative;top:9px;-webkit-transform:rotate(45deg);transform:rotate(45deg);-webkit-transition:left .25s ease-in-out;transition:left .25s ease-in-out;vertical-align:top;width:9px;left:4px}
}
}
@media(width < 992px){grid-template-columns:1fr;.image{place-self:center}
.text{padding-top:24px;grid-column:1;grid-row:2}
}
}
}
}
&.cmp-promo--large{>.cmp-container{grid-template-columns:1fr 1fr;.text{ul{list-style:none;padding-left:0;padding-bottom:0;li{position:relative;padding-left:32px;ul:not(:last-child) &{padding-bottom:24px}
&::before{position:absolute;left:0}
}
}
}
}
&.cmp-promo--large--first-variant{background-color:#f4f4f9;>.cmp-container{padding:50px 16px;column-gap:30px;max-width:1000px;margin-inline:auto;align-items:center;.image{grid-row:1;grid-column:1;&+.text{grid-row:2;grid-column:1}
}
.button{grid-row:3;grid-column:1}
.text{grid-row:1 / span 3;grid-column:2;li::before{content:url(brandguidereliant/resources/images/check-list-marker.svg)}
}
}
@media(width < 992px){>.cmp-container{padding:50px 20px;grid-template-columns:1fr;max-width:750px;.image{grid-row:1;grid-column:1;&+.text{padding-top:0;grid-row:2;grid-column:1}
}
.text{padding-top:30px;grid-row:3;grid-column:1}
.button{grid-row:4;grid-column:1}
}
}
@media(width < 767px){>.cmp-container{max-width:540px}
}
}
&.cmp-promo--large--second-variant{padding-inline:48px;>.cmp-container{grid-template-rows:repeat(2,auto);padding:0;overflow:hidden;.image{grid-column:1;grid-row:1 / span 2;height:100%;width:100%;*{height:inherit}
img{object-fit:cover;object-position:center}
}
.text{padding:40px 40px 0;*{margin-top:0}
li{&:is(a,p){transition:color .3s ease-in-out;&:hover{color:#cd007a}
}
a{text-decoration:none;color:inherit}
&::before{content:url(brandguidereliant/resources/images/check-list-marker-blue.svg)}
}
}
.button{padding:0 40px 40px}
}
@media(width < 992px){padding-inline:0;max-width:720px;margin-inline:auto;float:none;>.cmp-container{background-color:transparent;grid-template-columns:1fr;.image{grid-row:1}
.text{grid-row:2;padding-inline:16px;ul{padding-bottom:0}
}
.button{grid-row:3;padding-inline:16px}
}
}
}
}
}
}
.cmp-teaser--primary{.cmp-teaser__title{color:#00adef;font-family:EffraLight;font-weight:bolder;text-align:left !important;font-size:32px;margin-block-end:8px;margin-block-start:8px}
.cmp-teaser__description{font-family:EffraLight;font-size:19px;font-weight:700;display:block;p{margin-block-start:0}
}
@media(min-width:768px){.cmp-teaser{position:relative;display:flex;align-items:center;justify-content:center;height:520px;overflow:hidden}
.cmp-teaser__image{object-fit:cover;object-position:center;z-index:-1;.cmp-image{width:max-content}
}
.cmp-teaser__content{max-width:330px;background-color:white;border-radius:25px;padding:40px;z-index:1;overflow:hidden;position:absolute;margin-left:-390px;box-sizing:border-box}
}
@media(min-width:992px){.cmp-teaser{width:100%}
.cmp-teaser__image{width:100%;object-fit:contain;z-index:-1;.cmp-image{width:auto}
}
.cmp-teaser__content{max-width:451px;margin-left:-500px}
}
@media(min-width:1200px){.cmp-teaser__content{max-width:580px;margin-left:-560px}
}
@media(max-width:767px){.cmp-teaser{height:inherit;display:flex;flex-direction:column-reverse;align-items:center}
.cmp-teaser__image{width:100%;max-height:300px;z-index:-1;position:relative}
.cmp-teaser__content{width:100%;background-color:#fff;font-family:EffraLight;padding-left:10px}
}
}
.cmp-teaser--secondary{.cmp-teaser{position:relative;display:flex;align-items:center;justify-content:center;height:100%;background-color:#f4f4f9}
.cmp-teaser__image{width:100%;object-fit:contain;z-index:-1;display:none}
.cmp-teaser__title{color:black;font-family:EffraLight;font-weight:bolder;text-align:center !important;font-size:2.625rem;h3{margin-block-end:0}
}
.cmp-teaser__title:after{content:" ";display:flex;border-bottom:2px solid #cd007a;width:50px;margin-left:auto !important;margin-right:auto !important;margin-block-start:.5em;margin-block-end:.5em}
.cmp-teaser__description{font-family:EffraLight;font-size:19px;font-weight:700;text-align:center;a{color:#cd007a;text-decoration:underline}
a:hover{color:#cd007a;text-decoration:none}
}
}
.cmp-benefit{padding-inline:16px;>.cmp-container{display:grid;grid-template-rows:repeat(3,auto);.image{grid-row:1;.cmp-image img{height:auto;.cmp-benefit--regular>.cmp-container>.image &{width:auto}
}
}
.text{grid-row:2;>.cmp-text>*:first-child{margin-top:0}
a{color:#cd007a;line-height:26px;font-size:18px;font-family:Effra;display:inline-block;&:not(:hover){text-decoration:none;&::after{left:0}
}
&::after{border-style:solid;border-width:2px 2px 0 0;content:"";display:inline-block;float:none;height:9px;margin-left:8px;margin-right:10px;padding-right:0;position:relative;top:9px;-webkit-transform:rotate(45deg);transform:rotate(45deg);-webkit-transition:left .25s ease-in-out;transition:left .25s ease-in-out;vertical-align:top;width:9px;left:4px}
}
}
}
}