@charset "utf-8";
/* CSS Document */

/* Colours */
:root {

--bggrey_light: #F4F4F4;
--bggrey_mid: #ECECEC;
--grey: #888;
--altgrey: #d4d5d6;
--blue_mid: #2E86E0;
--blue_light: #DEECFA;
--red: #DC0027;
--redhover: #be0006;
--green_light: #7ED47F;
--green_garden: #AECC2C;
--gold: #BD9D78;
--yellow: #FFCD00;
--yellowhover: #ffa500;
--pink_light: #fcebee;


--background_dark_blue: #0a1b66;
--blue: #2f2ae7;
--blue_tint: #2320ad;
--highlight_blue: #35ecff;
--black: #221e1f;
--purple: #cb1ef3;
--purple_darker: #a204e8;
--background_grey: #f4f4f4;

--green: #1efe5d;
--greenhover:#04fd22;
--orange: #f06322;


--buttonprimary: #2E86E0;
--buttonprimary_border: #2E86E0;
--buttonprimary_colour: #fff;
--buttonprimaryhover: #003671;
--buttonprimaryhover_border: #003671;
--buttonprimaryhover_colour: #fff;
--buttonprimarytext: #fff;
--buttonprimaryhovertext: #fff;
--greybutton: #d4d6d8;
--greybuttonhover: #bec2c5;

--buttonsecondary: #F4F4F4;
--buttonsecondary_border: #333;
--buttonsecondary_colour: #333;
--buttonsecondaryhover: #ECECEC;
--buttonsecondaryhover_border: #000;
--buttonsecondaryhover_colour: #333;
--buttonsecondarytext: #000;
--buttonsecondaryhovertext: #000;

}


/* FONTS */
/* outfit-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/outfit-v11-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/outfit-v11-latin-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* outfit-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/outfit-v11-latin-600.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/outfit-v11-latin-600.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* outfit-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/outfit-v11-latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/outfit-v11-latin-700.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* outfit-800 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 800;
  src: url('../fonts/outfit-v11-latin-800.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/outfit-v11-latin-800.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}



/* REPEATABLE POSITION CLASSES - TOO MANY VARS FOR TAILWIND! */
.absolute-center-left { position: absolute; left:0; top:50%; transform: translate(0,-50%); }
.absolute-center-right { position: absolute; right:0; top:50%; transform: translate(0,-50%); }
.absolute-center-center { position: absolute; left:50%; top:50%; transform: translate(-50%,-50%); }
.absolute-center-top { position: absolute; left:50%; top:0%; transform: translate(0%,-50%); }
.line-clamp-1 { overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical;-webkit-line-clamp: 1; }
.line-clamp-2 { overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical;-webkit-line-clamp: 2; }
.line-clamp-3 { overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical;-webkit-line-clamp: 3; }
.wish-button {  }
.wish-button span { width:calc(100% - 12px); float:left; position:absolute; top:50%; left: 50%; transform: translate(-50%,-50%); }
.wish-button span.wish-icon-active { position:absolute; top:50%; left: 50%; transform: translate(-50%,-50%); width:calc(100% - 12px); opacity: 0; transition: all 200ms ease; }
.wish-button:hover span.wish-icon-active { opacity: 1; }
body .reach-sides:before { width: calc(calc(100vw - 100%) / 2) !important; left: calc(0px - calc(calc(100vw - 100%) / 2)) !important; }
body .reach-sides:after { width: calc(calc(100vw - 100%) / 2) !important; right: calc(0px - calc(calc(100vw - 100%) / 2)) !important; }
.blueanimation { background:var(--background_dark_blue) url(/static/version/frontend/PixieMedia/Pixie/en_GB/images/assets/animations/waves.svg) no-repeat center top / 100%; background-blend-mode: color-burn; }

/* ANIMATIONS */
.swooshes .page-wrapper { background-image:url(/static/version/frontend/PixieMedia/Pixie/en_GB/images/assets/animations/waves.svg); background-size: 100%; background-repeat: no-repeat; }
.swooshes-grey .page-wrapper { background-image:url(../images/assets/animations/ripple-grey-2.svg); background-size: 100%; background-repeat: no-repeat; background-position: center top -650px; }
.sideblobs .page-wrapper { background-image:url(../images/assets/animations/sideblobs-light.svg); background-size: 100%;   }
.flyme { animation: fly 7s linear infinite both; }
@keyframes fly {
  0% {
   
            transform: scale(1) rotate(22deg); right:0px;
  }
  50% {
    
            transform: scale(1.1) rotate(30deg); right: 100px;
  }
	
65% {
    
            transform: scale(1.1) rotate(28deg); right: 110px;
  }
  100% {
    
            transform: scale(1) rotate(22deg); right:0px;
  }
}


@media screen and (max-width:640px) { .swooshes-grey .page-wrapper { background-size: auto 1000px; background-position: center top -430px; }}
/* DEF STYLES AND BUTTONS FOR USE IN WIDGETS ETC */
body.pixiedust span.xxlarge, body.pixiedust .xxlarge { font-size: clamp(40px, 1.335rem + 5.8252vw, 100px) !important; display:block; line-height:1.1; font-weight:500; margin-bottom: 20px; display:block;  }
body.pixiedust span.xlarge, body.pixiedust .xlarge { font-size: clamp(32px,1.301rem + 3.4951vw,68px) !important; display:block; line-height:1.3; font-weight:500; margin-bottom: 20px;display:block;  }
body.pixiedust span.large, body.pixiedust .large { font-size:  clamp(22px, 1.0643rem + 1.5534vw, 38px) !important; display:block; line-height:1.3; font-weight:500; margin-bottom: 20px;display:block;  }
body.pixiedust span.medium { font-size: clamp(18px, 0.8835rem + 0.5825vw, 22px) !important; line-height:1.1; margin-bottom: 20px; display:block; font-weight:400; }
body.pixiedust span.small { font-size: clamp(12px, 0.7112rem + 0.1942vw, 14px) !important; line-height:1.4; margin-bottom: 20px; display:block; }
body.pixiedust span.smalltitle { font-size: 12px !important; line-height: 1; display: inline-block !important; }
body.pixiedust p:not(.no-clamp) { font-size: clamp(14px,1.2vw,14px) !important; margin-bottom: 20px; display:block; }
body.pixiedust .title { font-weight: 600 !important; }
body.pixiedust .text-shadow { text-shadow: 1px 2px 8px #00000094; }
body.pixiedust .grey { color:var(--grey) !important; }
body.pixiedust .green { color:var(--green) !important; }
body.pixiedust .yellow { color:var(--yellow) !important; }
body.pixiedust .red { color:var(--red) !important; }
body.pixiedust .blue { color:var(--blue_mid) !important; }
body.pixiedust .dk-blue{ color:var(--blue_tint) !important; }
body.pixiedust .lightblue { color:var(--highlight_blue) !important; }
body.pixiedust .purple { color:var(--purple) !important; }
body.pixiedust .dk-purple { color:var(--purple_darker) !important; }
body.pixiedust a.blue { text-decoration: underline; }
body.pixiedust .divider { position: relative; font-size:0; width:100%; display:flex; height: 1px; margin: 6rem 0; }
body.pixiedust .divider span { display:none; }
body.pixiedust .divider:before { content:''; position:absolute; top:0; width: 100vw !important; left: calc(0px - calc(calc(100vw - 100%) / 2)) !important; height:1px; background:var(--bggrey-light);  }
@media screen and (max-width:1270px) { body.pixiedust .divider { margin: 3rem 0; }}

/* BUTTONS */
body.pixiedust .button { display:inline-flex; align-items: center; justify-content: center; transition:all 200ms ease; background:var(--green); border:1px solid var(--green); box-sizing: border-box; padding:16px 24px; color:#fff !important; font-weight: 500; font-size:16px; line-height: 12px; text-align: center; line-height:1; }
body.pixiedust .button:hover { background:var(--greenhover); border-color:var(--greenhover); }
body.pixiedust .button.whitebutton {  background:#fff; border-color:#fff; color:var(--black) !important;  }
body.pixiedust .button.whitebutton:hover { background:var(--purple_darker); border-color:var(--purple_darker); color:#fff !important; }
body.pixiedust .button.yellowbutton { background:var(--yellow); border-color:var(--yellow);  color:#000 !important;  }
body.pixiedust .button.yellowbutton:hover { background:var(--yellowhover); border-color:var(--yellowhover); }
body.pixiedust .button.blackbutton {  background:#333; border-color:#333; color:#fff !important;  }
body.pixiedust .button.blackbutton:hover { background:#000; border-color:#000; }
body.pixiedust .button.greybutton { background:var(--greybutton); border-color:var(--greybutton);  color:#000 !important;  }
body.pixiedust .button.greybutton:hover { background:var(--greybuttonhover); border-color:var(--greybuttonhover); }
body.pixiedust .button.redbutton { background:var(--red); border-color:var(--red);  color:#fff !important;  }
body.pixiedust .button.redbutton:hover { background:var(--redhover); border-color:var(--redhover); }
body.pixiedust .button.bluebutton { background:var(--blue_mid); border-color:var(--blue_mid);  color:#fff !important;  }
body.pixiedust .button.bluebutton:hover { background:var(--blue); border-color:var(--blue); }

body.pixiedust .button.lightbluebutton { background:var(--highlight_blue); border-color:var(--highlight_blue);  color:#000 !important;  }
body.pixiedust .button.lightbluebutton:hover { background:var(--blue_mid); border-color:var(--blue_mid); color:#fff !important;  }



body.pixiedust .button.bluewirebutton { background:transparent; border-color:var(--highlight_blue);  color:#fff !important;  }
body.pixiedust .button.bluewirebutton:hover { background:#fff; border-color:#fff; color:var(--black) !important; }
body.pixiedust .button.purplebutton { background:var(--purple); border-color:var(--purple);  color:#fff !important;  }
body.pixiedust .button.purplebutton:hover { background:var(--purple_darker); border-color:var(--purple_darker); }
body.pixiedust .button svg, body.pixiedust .btn svg { display: inline-block; width: 25px; height: 25px; transition: all 200ms ease; }
body.pixiedust .button span, body.pixiedust .btn span { font-weight: 500; line-height: 1; }
body.pixiedust .contactbutton svg { width: 16px; }
body.pixiedust .button.uparrowbutton:after { width: 16px; height: 16px; content:''; background:url("../images/assets/adobe-magento/cta-arrow-up-white.svg") no-repeat center; margin-left: 15px; transition: all 200ms ease; }
body.pixiedust .button.uparrowbutton:hover:after { width: 0; margin-left:0; }
.iconme { background:#fff; padding: 8px; border-radius: 4px; transition:all 200ms ease; }
body.pixiedust .bluearrow { color:var(--highlight_blue); display:flex; align-items: center; }
body.pixiedust a.bluearrow { text-decoration: underline; }
body.pixiedust .bluearrow:after { content:''; background:url(../images/assets/adobe-magento/cta-arrow-right-blue.svg) no-repeat center; width: 40px; height: 20px; margin-left: 5px; }

body.pixiedust .purplearrow { color:var(--purple); display:flex; align-items: center; }
body.pixiedust a.purplearrow { text-decoration: underline; }
body.pixiedust .purplearrow:after { content:''; background:url(../images/assets/adobe-magento/cta-arrow-right-purple.svg) no-repeat center; width: 40px; height: 20px; margin-left: 5px; }

body.pixiedust .blackarrow { color:#000; display:inline-flex; align-items: center; }
body.pixiedust a.blackarrow { text-decoration: none; }
body.pixiedust .blackarrow:after { content:''; background:url(../images/assets/adobe-magento/carousel-arrow-right.svg) no-repeat center; width: 30px; height: 20px; margin-left: 5px; }

body.pixiedust .whitearrow { color:#fff; display:inline-flex; align-items: center; }
body.pixiedust a.whitearrow { text-decoration: none; }
body.pixiedust .whitearrow:after { content:''; background:url(../images/assets/adobe-magento/carousel-arrow-right.svg) no-repeat center; width: 30px; height: 20px; margin-left: 5px; filter:invert(1); }

body.pixiedust .slantarrow:after { transform: rotate(315deg); }

body.pixiedust .bluebackground { position: relative; z-index: 1; text-decoration: none; display:inline-block; margin-left:5px; margin-right:5px; line-height: 1; }
body.pixiedust .bluebackground:before { content:''; position: absolute; z-index: -1; background:var(--highlight_blue); width:calc(100% + 10px); height:calc(100% + 10px); border-radius: 12px; left: -5px; top: -5px; }
body.pixiedust .purplebackground { position: relative; z-index: 1; text-decoration: none; display:inline-block; margin-left:5px; margin-right:5px; line-height: 1; }
body.pixiedust .purplebackground:before { content:''; position: absolute; z-index: -1; background:var(--purple); width:calc(100% + 10px); height:calc(100% + 10px); border-radius: 12px; left: -5px; top: -5px; }
body.pixiedust .bluebackground.darkblue:before { background:var(--blue); }
body.pixiedust .smalltitle.purplebackground, body.pixiedust .smalltitle.bluebackground { padding: 5px; margin-left:5px; margin-bottom: 20px; }
body.pixiedust .smalltitle.purplebackground:before, body.pixiedust .smalltitle.bluebackground:before { border-radius: 4px; }

@media screen and (max-width:640px) {
	body.pixiedust .button { padding: 14px 16px; font-size: 14px; }
	body.pixiedust .button svg, body.pixiedust .btn svg { width:20px; height:20px; }
	body.pixiedust .button span, body.pixiedust .btn span { font-size: 12px; }
	body.pixiedust .button.uparrowbutton:after { margin-left: 7px; }
}

/* FORMS */
body [type='checkbox'], body [type='radio'], body [type='checkbox']:hover, body [type='radio']:hover { color:var(--green); outline-color:var(--green); border:1px solid var(--bggrey_mid); box-shadow:none !important; background-color:#fff; outline:0; cursor: pointer; }
body input[type='checkbox']:checked, body input[type='checkbox']:checked:active, body input[type='checkbox']:checked:focus, body input[type='checkbox']:checked:hover { background:var(--green) url(../images/assets/checkmark.svg) no-repeat center / 90%; border:1px solid var(--green); outline:0; }
body.pixiedust input, body.pixiedust select, body.pixiedust textarea { box-shadow:none !important; }
body.pixiedust input:focus, body.pixiedust select:focus, body.pixiedust input:active, body.pixiedust select:active { box-shadow: none !important; border-color:var(--bggrey_mid); }
input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active{  -webkit-box-shadow: 0 0 0 30px white inset !important; }
body .grecaptcha-badge { z-index:999; }
/* PAGINATION */
body .widget ul.splide__pagination { text-align: center; width:100%; margin: 30px 0 20px;  }
body .splide__pagination li { margin:0 5px; }
body .splide__pagination button.splide__pagination__page  { background:var(--altgrey) !important; border:8px solid transparent; opacity:1; transform:scale(0.6); position:relative;}
body .splide__pagination button.splide__pagination__page.is-active { background:#000 !important; outline:1px solid #000; background-clip:content-box !important; position:relative; float:left; margin-top:5px; transform:scale(1.4); }
body .splide__pagination button.splide__pagination__page.is-active:after { content:''; width:5px !important; height:5px !important; border-radius:50%; background:#000; top:50%; left:50%; transform:translate(-50%,-50%); display:block; }

/* ARROWS & SPLIDE */
body .splide--draggable>.splide__track>.splide__list>.splide__slide { vertical-align: top; }
body .splide__arrow { background:var(--altgrey); position:absolute; opacity: 1; border:0; width:50px; height:50px; box-shadow: 0 0 10px -5px #333; z-index:9; }
body .splide__arrow svg { width:55%; height:55%; position:absolute; top: 50%; left: 50%; transform:translate(-50%,-50%); }
body .splide__arrow .cls-2 { fill:#fff; stroke:#fff; }
body .splide__arrow--prev svg { left: calc(50% - 1px); }
body .splide__arrow--next svg { left: calc(50% + 1px); }
body .splide__arrow--prev { left: -15px; }
body .splide__arrow--next { right: -15px; }
@media screen and (min-width:1390px) { body .splide__arrow--prev { left: -25px; } body .splide__arrow--next { right: -25px; } }
@media screen and (min-width:1200px) { body .splide__arrow { transition:all 200ms ease; } body .splide__arrow:hover { opacity: 1 !important; box-shadow: 0 0 10px -2px #333; } }
@media screen and (max-width: 639px) { body .splide__arrow--prev { left: -5px; } body .splide__arrow--next { right: -5px; } }

/* ANIMATIONS */

/* STRUCTURAL - TO DO - FIND IN CONFIG */
html { max-width: 100vw; overflow-x:hidden; }
body { overflow-x:hidden; width:100vw; overflow-y:scroll; }
body .logo-header-link svg { width: 195px; height: auto; }
.page-wrapper { position: relative; }
body .page-wrapper .columns { max-width: 1350px !important; }
.cms-index-index .columns { gap:0; }
.cms-index-index .page-main { margin:0; }
.breadcrumbs { max-width:1350px; margin:auto; }
@media screen and (max-width:1370px) {
	body .columns { max-width:100%; }
	.breadcrumbs { max-width: calc(100vw - 40px); }
}