
  nav, .hide-on-scroll {
    transition: top .2s ease, opacity .2s ease;
  }
/*animations keyframes for on-load and on-scroll*/
@keyframes fadeInAnimation {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

@keyframes slideY {
	0% {
		opacity: 0;
		transform: translateY(-3rem);
	}
	100% {
		opacity: 1;
		transform: translateY(0rem);
	}
}
/*animations on-load*/
.header-cont h1,
.header-cont img {
	animation: slideY ease .8s;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
}
.header-cont p {
	animation: slideY ease .8s;
	animation-delay: 100ms;
}
.header-cont a {
	animation: slideY ease .8s;
	animation-delay: 200ms;
}
/*animations on-scroll*/
main section:has(:not(.header-cont *)) {
	h2,
	h3,
	h4,
	h5,
	p,
	a,
	img,
	li {
		animation: slideY ease-in-out both .8s;
		animation-timeline: view(block);
		animation-range: cover 0% cover 40%;
	}
	p,
	li {
		animation-delay: 200ms;
	}
	a {
		animation-delay: 300ms;
	}
}
/*animations on scroll*/
  a {
    color: inherit;
	text-underline-offset: 4px;
}
  .nonunderline a, a.nonunderline{
    text-decoration: none;
  }
    
  .rich-text ul+h3 {
        margin-top:60px;
    }
  .rich-text ul+h2{
			margin-top:50px;
			
		}

  .bigger-text p{
font-weight:400;
font-size: 1.5rem;
    line-height: 2.2rem;
}
picture{
    display:contents;
}
.min-content{max-width:min-content;}

/*h3 bold when no h2*/
.spe-heading-text .rich-text:has(:not(.h2)) .h3{
        font-weight: bold;
    }
/*h3 bold when no h2*/
/*to have extra padding before network-cont */
@media (min-width: 768px) {
  .grid-2-alternate:has(+.box-cont) {
    padding-bottom:120px;}
    
  }
  /* when 2x boxes*/
  .box-cont+.box-cont .box {
    background: linear-gradient(180deg, #ececec 0%, #fff 25%); 
    border:1px solid white;
}
	.box-cont+.box-cont {
		padding: 0 60px;
}
  .text-wrap {
    text-wrap: balance;}
  img {
    height: 100%;
 	  max-width: 100%;
  }
  .z-index10 {
    z-index: 10;
  }
  .z-index-10 {
    z-index: -10;
  }
  /* anchors */
  .has-anchor {
    scroll-margin: 30px;
  }
  .has-anchor a {
    text-decoration: none;
  }
  .has-anchor:hover a {
    text-decoration: underline;
  }
  .has-anchor:hover::before {
    content: "🔗\00a0";
    display: inline;
    font-size: 0.5em;
	  position: absolute;
  	transform: translateX(-30px);
  }

@media (min-width: 992px) {
  section:nth-of-type(2n) .alternate-in-section {
    flex-direction: row-reverse;
  }
}
  /*alternate BG section*/
  section:nth-of-type(2n):has(.alternate-in-section).bg-gradient{
background: linear-gradient(90deg, rgba(255,255,255,1) 35%, rgba(254,247,248,1) 100%);  }

@media (max-width: 992px) {
  section:nth-of-type(2n) .alternate-in-section .spe-heading-icone { order:1;}  
 .bg-gradient, section:nth-of-type(2n):has(.alternate-in-section).bg-gradient  { background: linear-gradient(180deg, rgba(254,247,248,1) 0%, rgba(255,255,255,1) 65%)!important;}
}


  /* for colors being applied to a, links*/
  /*
  .text-color-363063 *, .text-color-808080 *, a {
    color: inherit;
  }*/

  .bg-gradient {
background: rgb(255,255,255);
background: linear-gradient(90deg, rgba(254,247,248,1) 0%, rgba(255,255,255,1) 65%); }
.bg-pale-pink{
  background-color:#fef7f8;}

  /*BG+blueprint-pattern*/
  .bg-gradient-blue-pattern{
    background: url("/cms/assets/1101fc1c-0958-4238-83d1-37e4a1f9bf87.svg") center/auto repeat, linear-gradient(90deg, #1775CB, #1465AF);
  }
  /*list bullets*/
  .p ul {
    text-align: left;
    list-style: none;
    max-width:700px;
    margin: 0 auto;
    display: inline-block;
  }

.p ul li {  
    background-image: url("data:image/svg+xml;charset=UTF-8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' height='30' width='30'><path d='M21.856,10.303C21.942,10.857 22,11.421 22,12C22,18.075 17.075,23 11,23C4.925,23 0,18.075 0,12C0,5.925 4.925,1 11,1C13.347,1 15.518,1.741 17.304,2.993L15.882,4.45C14.474,3.537 12.8,3 11,3C6.038,3 2,7.038 2,12C2,16.962 6.038,21 11,21C15.894,21 19.879,17.072 19.99,12.205L21.856,10.303ZM20.904,2.167L11.5,11.806L7.657,8.192L4.562,11.29L11.5,18L24,5.263L20.904,2.167Z' fill='rgb(54,48,99)'/></svg>");
    background-repeat: no-repeat;
    background-size: 50px 50px;
    padding-left: 55px;
    margin: 30px 10px;
    min-height:50px;
}
.p ul li p {  
    padding-top:5px;
  }
 
    /*list numbered*/
    .p ol li {
     counter-increment: li;
     background-color:#f9f8f8;
     transition: padding 0.2s cubic-bezier(0, -0.530, 0.405, 2.8);
   }

 .p ol li::marker {
    content: "#" counter(li) " ";
    font-weight: bold;
    font-size: 2.25rem;
  }
@media (min-width: 992px) {
      .p ol {
       text-align: left;
       margin: 0 auto;
       padding-left: 0;
       max-width:700px
  }
     .p ol li {
       counter-increment: li;
       margin: 10px 0;
       padding:10px 20px;
   }
  }
  @media (max-width: 991px)  {
      .p ol {
        list-style-position: inside;
  padding-left:0;
    }
      .p ol li {
        padding: 40px 20px;
        margin: 20px 0;
  }}
  /*FX*/
  .fx-multiply img {mix-blend-mode: multiply;}
  .fx-color-ff557a a:hover {color:#E61E4A;}
  .fx-color-ff557a a{transition: color 0.2s ease-in-out;}
  /*CTA*/
  .cta{
    text-transform: uppercase;
    text-decoration: none;
    break-inside: avoid;
  }
  a.cta:after {
    content: "";
    position: relative;
    display: inline-block;
    width: 100%;
    height: 2px;
    bottom: 10%;
    background-color: white;
    transition: height 0.2s ease-in-out, bottom 0.2s ease-in-out, width 0.2s ease-in-out;
  }
  a.cta:hover{
    z-index: 10;
    color: inherit;
  }
  a.cta:hover:after{
    position: relative;
    z-index: -1;
    padding:0 10px;
    margin:0 10px 0 -10px;
    bottom: 26px;
    height: 100%;
  }
  @media (max-width: 992px)  {
    a.cta:hover:after{
      bottom: 36px;
  }}

  /*CTA*/
  /*CTA-BTN*/
  .cta-btn {
    break-inside: avoid;
    position: relative;
    text-transform: uppercase;
    border-radius:99px;
    text-decoration: none;
    transition: all 0.2s ease-in-out;
  }
  .cta-btn:after{
    content: "";
    position: absolute;
    z-index: -1;
    display: inline-block;
    border-radius:99px;
    width: 0%;
    height:0%;
    left:50%;
    transition: height 0.2s ease-in-out, bottom 0.2s ease-in-out, width 0.2s ease-in-out, left 0.2s ease-in-out;
  }
  .cta-btn:hover {
    color: inherit;
    z-index: 10;
  }
  .cta-btn:hover:after{
    width: 100%;
    height:100%;
    left:0;
    bottom:0;
    background-color: white;
  }
  /*CTA version colored*/
  a.cta.text-color-FF557A:after {
    background: linear-gradient(to right, #ff557a 0%, #FF6985 75%, #FFA2A2 100%);
  }
  /*CTA version colored*/
  /*CTA-BTN version colored*/
  .cta-btn.text-color-FF557A{
    background-image: linear-gradient(white, white), linear-gradient(to right, #72BEFB 0%, #8096F8 25%, #DD71BC 75%, #ff557a 100%);
    background-origin: border-box;
    background-clip: padding-box, border-box;
  }
  .cta-btn.text-color-FF557A.text-color-FFFBFC{
    background-image: linear-gradient(#fffafb, #fff9fb), linear-gradient(to right, #72BEFB 0%, #8096F8 25%, #DD71BC 75%, #ff557a 100%);
  }
  .cta-btn.text-color-FF557A:hover:after{
    background-image: linear-gradient(to right, #72BEFB 0%, #8096F8 25%, #DD71BC 75%, #E61E4A 100%), linear-gradient(to right, #72BEFB 0%, #8096F8 25%, #DD71BC 75%, #ff557a 100%);
  }


  /*CTA-BTN version colored*/
  /*cta-btn-ico NETWORK*/
  .cta:hover, .cta-btn:hover, .cta-btn-ico:hover, .cta-btn-mini-ico:hover {
    transform: scale(1.1);
    transition: transform 0.2s cubic-bezier(0, -0.530, 0.405, 2.8);
  }
  .cta:hover {
    transform: scale(1.1) translateY(10px);
  }
  a.cta-btn-ico .app-ico-title:before {
    content: "";
    position: absolute;
    display: inline-block;
    width: 100%;
    height: 2px;
    margin: 0 auto;
    bottom: 0px;
    left:0;
    background-color: white;
 transition: height 0.2s cubic-bezier(0, -0.530, 0.405, 1.8), bottom 0.2s cubic-bezier(0, -0.530, 0.405, 1.8), width 0.2s cubic-bezier(0, -0.530, 0.405, 1.8);
}
  a.cta-btn-ico:hover .app-ico-title{
    color: inherit;
    margin: 10px 0 -14px 0;
  }
  a.cta-btn-ico:hover .app-ico-title:before {
    z-index: -1;
    top: 0px;
    height: 100%;
}
  a.cta-btn-ico:hover .app-ico-txt {
    margin-top:14px
}
  a.cta-btn-ico .app-ico-cont .app-ico {
    transform: scale(0.85);
    transition: transform 0.2s cubic-bezier(0, -0.530, 0.405, 2.8);
  }
  a.cta-btn-ico:hover .app-ico-cont .app-ico {
    transform: scale(1.1);
  }
  /*cta-btn-ico NETWORK*/
  .box {
    width: fit-content;
  }

  /*cta-btn-mini-ico*/
  a.cta-btn-mini-ico__cont .app-ico{
    transform: scale(0.85);
    transition: transform 0.2s cubic-bezier(0, -0.530, 0.405, 2.8);
  }
  a.cta-btn-mini-ico__cont:hover .app-ico {
    transform: scale(1.1);
  }

  /*cta-btn-mini-ico*/
  /*GRID*/
  /*avoid break column elements*/
  .grid-2 *,
  .grid-4 * {
    /*overflow: hidden; //deactivated for scroll animation*/
  
    /* fix for Firefox */
    break-inside: avoid-column;
    -webkit-column-break-inside: avoid;
  }
  .grid-2 {
    column-count: 2;
  }
  .grid-4 {
    column-count: 4;
    column-gap: 0px;
  }
  @media (max-width: 992px) {
    .grid-2 {
      column-count: 1;
    }
  }
  .grid-gap {
    column-gap: 10rem;
  }
  /*GRID*/
  /*squares*/
  .square h4 {
    transition: color 0.2s ease-in-out;
  }
  .square:hover .h4 {
    color:#ff557a}
  .square:hover p {
    color:#363063}
  /*.multicolored-border*/
  .multicolored-border {
    background: linear-gradient(45deg, #F9F9F9, #ffffff) 50% 50%/calc(100% - 4px) calc(100% - 4px) no-repeat, linear-gradient(-45deg, #D9D9D9 0%, #D9D9D9 100%);
    transition: background 1.2s cubic-bezier(0, -0.530, 0.405, 2.8);
  }

.multicolored-border:hover {
  background: linear-gradient(45deg, #FFF0F4, #ffffff) 50% 50%/calc(100% - 20px) calc(100% - 20px) no-repeat, linear-gradient(45deg, #72befb 0%, #8096f8 25%, #dd71bc 75%, #ff557a 100%);
  transition: background 0.8s cubic-bezier(0, -0.530, 0.405, 2.8);
  animation: gradient .5s linear infinite;
  animation-delay: 0.1s;
}
  /*gradient animation*/
  @keyframes gradient {
    0% {
      background: linear-gradient(0deg, #FFF0F4, #ffffff) 50% 50%/calc(100% - 20px) calc(100% - 20px) no-repeat, linear-gradient(0deg, #72befb 0%, #8096f8 25%, #dd71bc 75%, #ff557a 100%);
    }
    50% {
      background: linear-gradient(0deg, #FFF0F4, #ffffff) 50% 50%/calc(100%- 20px) calc(100% - 20px) no-repeat, linear-gradient(180deg, #72befb 0%, #8096f8 25%, #dd71bc 75%, #ff557a 100%);
    }
    100% {
      background: linear-gradient(0deg, #FFF0F4, #ffffff) 50% 50%/calc(100% - 20px) calc(100% - 20px) no-repeat, linear-gradient(590deg, #72befb 0%, #8096f8 25%, #dd71bc 75%, #ff557a 100%);
    }
  }
  /*gradient animation*/
  /*ease-back animation*/
  .ease-back:hover {
    transform: scale(1.02);
    transition: transform 0.2s cubic-bezier(0, -0.530, 0.405, 2.8);
  }
  .xxxxxxxxxxxxxxxxx_____ease-back:hover p {
    transform: scale(1.07);
    transition: transform 0.2s cubic-bezier(0, -0.530, 0.405, 2.8);
  }
  /*ease-back animation*/
  /*squares*/
  /*ROTATING TITLES*/
  .cd-headline {
    line-height: 1.2;
    margin: 0 0 10px 0;
  }
  .cd-words-wrapper {
    display: inline-block;
    position: relative;
  }
  @media only screen and (max-width: 450px) {
    .cd-words-wrapper b {
      padding: 0;
    }
  }
  .cd-words-wrapper b {
    display: inline-block;
    position: absolute;
    white-space: nowrap;
    padding: 0.1rem 1.5rem;
    background-color: #E61E4A;
    font-size:3.5rem!important;
  }
  @media (max-width: 480px) {
    .cd-words-wrapper b {
      white-space: initial;
    }
  }
  .cd-words-wrapper b.is-visible {
    position: relative;
  }
  .no-js .cd-words-wrapper b {
    opacity: 0;
  }
  .no-js .cd-words-wrapper b.is-visible {
    opacity: 1;
  }
  .cd-headline.slide span {
    display: inline-block;
    padding: .2em 0.5em;
  }
  .cd-headline.slide .cd-words-wrapper {
    overflow: hidden;
    vertical-align: top;
  }
  .cd-headline.slide b {
    opacity: 0;
    top: .2em;
  }
  .cd-headline.slide b.is-visible {
    top: 0;
    opacity: 1;
    -webkit-animation: slide-in 0.6s;
    -moz-animation: slide-in 0.6s;
    animation: slide-in 0.6s;
  }
  .cd-headline.slide b.is-hidden {
    -webkit-animation: slide-out 0.6s;
    -moz-animation: slide-out 0.6s;
    animation: slide-out 0.6s;
  }
  @-webkit-keyframes slide-in {
    0% {
      opacity: 0;
      -webkit-transform: translateY(-100%);
    }
    60% {
      opacity: 1;
      -webkit-transform: translateY(20%);
    }
    100% {
      opacity: 1;
      -webkit-transform: translateY(0);
    }
  }
  @-moz-keyframes slide-in {
    0% {
      opacity: 0;
      -moz-transform: translateY(-100%);
    }
    60% {
      opacity: 1;
      -moz-transform: translateY(20%);
    }
    100% {
      opacity: 1;
      -moz-transform: translateY(0);
    }
  }
  @keyframes slide-in {
    0% {
      opacity: 0;
      -webkit-transform: translateY(-100%);
      -moz-transform: translateY(-100%);
      -ms-transform: translateY(-100%);
      -o-transform: translateY(-100%);
      transform: translateY(-100%);
    }
    60% {
      opacity: 1;
      -webkit-transform: translateY(20%);
      -moz-transform: translateY(20%);
      -ms-transform: translateY(20%);
      -o-transform: translateY(20%);
      transform: translateY(20%);
    }
    100% {
      opacity: 1;
      -webkit-transform: translateY(0);
      -moz-transform: translateY(0);
      -ms-transform: translateY(0);
      -o-transform: translateY(0);
      transform: translateY(0);
    }
  }
  @-webkit-keyframes slide-out {
    0% {
      opacity: 1;
      -webkit-transform: translateY(0);
    }
    60% {
      opacity: 0;
      -webkit-transform: translateY(120%);
    }
    100% {
      opacity: 0;
      -webkit-transform: translateY(100%);
    }
  }
  @-moz-keyframes slide-out {
    0% {
      opacity: 1;
      -moz-transform: translateY(0);
    }
    60% {
      opacity: 0;
      -moz-transform: translateY(120%);
    }
    100% {
      opacity: 0;
      -moz-transform: translateY(100%);
    }
  }
  @keyframes slide-out {
    0% {
      opacity: 1;
      -webkit-transform: translateY(0);
      -moz-transform: translateY(0);
      -ms-transform: translateY(0);
      -o-transform: translateY(0);
      transform: translateY(0);
    }
    60% {
      opacity: 0;
      -webkit-transform: translateY(120%);
      -moz-transform: translateY(120%);
      -ms-transform: translateY(120%);
      -o-transform: translateY(120%);
      transform: translateY(120%);
    }
    100% {
      opacity: 0;
      -webkit-transform: translateY(100%);
      -moz-transform: translateY(100%);
      -ms-transform: translateY(100%);
      -o-transform: translateY(100%);
      transform: translateY(100%);
    }
  }
  /*ROTATING TITLES*/

  /*FOOTER*/
  .footer-text a:hover{
    color:#E61E4A}
  /*FOOTER*/

  .no-padding-between + .no-padding-between {
    padding-top: 0;
  }
  .no-padding-between:has( + .no-padding-between) {
    padding-bottom: 0;
  }
  .grid-2-alternate:nth-child(even) .grid-2 {
    flex-direction: row-reverse;
  }
  @media (max-width: 992px) {
  .grid-2-alternate:nth-child(even) .grid-2 {
  flex-direction: column-reverse;
}}
  
