@charset "utf-8";

/* CSS Document */

@font-face {font-family: "Buenos Aires Regular" ;src: url("../fonts/BuenosAiresRegular.woff2") format("woff2"); font-weight: normal;font-style: normal;}
@font-face {font-family: "Buenos Aires Light" ;src: url("../fonts/BuenosAiresLight.woff2") format("woff2"); font-weight: normal;font-style: normal;}
@font-face {font-family: "Buenos Aires Bold" ;src: url("../fonts/BuenosAiresBold.woff2") format("woff2"); font-weight: normal;font-style: normal;}

/* Colours */

:root {--cinch-purple-dark: #311c77;}
:root {--cinch-purple-light: #5234b6;}
:root {--cinch-pink-dark: #8c32be;}
:root {--cinch-grey-dark: #2f2f2f;}
:root {--cinch-grey-light: #656565;}
:root {--cinch-white: #FFFFFF;}
:root {--cinch-white-dark: #F8F6FF}
:root {--cinch-black: #2f2f2f;}
:root {--cinch-blue: #1565c0;}
:root {--cinch-aqua: #57e8ff;}-
:root {--cinch-green: #8cffbe;}
:root {--cinch-trans-white: rgba(255, 255, 255, 0.6);}
:root {--cinch-trans-white-dark: rgba(255, 255, 255, 0.2);}
:root {--cinch-trans-black: rgba(0, 0, 0, 0.6);}
:root {--cinch-trans-black-dark: rgba(0, 0, 0, 0.7);}
:root {--cinch-trans-purple: rgba(49, 28, 119, 0.7);}
:root {--cinch-trans-purple-cta: rgba(49, 28, 119, 0.5);}
:root {--cinch-trans-purple-cta-dark: rgba(49, 28, 119, 0.8);}
:root {--error: #cc0000;}
:root {--cinch-checkbox-surround: #f8f8f8;}

.gradient-pink-purple {background: rgb(82,52,182); background-image: linear-gradient( 180deg,#311c77,#ff2dff);}
.gradient-pink-purple-lr {background: rgb(82,52,182); background-image: linear-gradient( 90deg,#311c77,#ff2dff);}
.dark-white {background-color: var(--cinch-white-dark)}
.dark-purple {background-color: var(--cinch-purple-dark);}

.cinch-purple-dark {color: var(--cinch-purple-dark);} 
.cinch-purple-light {color: var(--cinch-purple-light);}
.cinch-green {color: var(--cinch-green);}

.cinch-black {color: var(--cinch-black)!important}

/* Site wide */

html {font-family: 'Buenos Aires Regular', sans-serif; font-size: 18px; line-height: 24px; color: #656565; box-sizing: border-box; -webkit-tap-highlight-color:  rgba(255, 255, 255, 0); scroll-behavior: smooth;    }
button, textarea, select {font-family: 'Buenos Aires Regular', sans-serif; font-size: 16px;}
body {margin: 0;padding: 0; background-color: #FFFFFF; }
input[type=text] {-webkit-appearance: none; -moz-appearance: none; appearance: none;}
a, a:visited {color: var(--cinch-purple-light); text-decoration: none; transition:color ease-in-out 0.2s}
a:hover {text-decoration: underline}

h1, h2, h3, h4, h5 {color: var(--cinch-black);}

h1 {font-family: 'Buenos Aires Bold', sans-serif; font-size: 42px; line-height: 56px; font-weight: normal}
h2 {font-family: 'Buenos Aires Bold', sans-serif; font-size: 34px; line-height: 48px; font-weight: normal}

@media screen and (max-width:600px) {
    h1 {font-size: 32px; line-height: 40px; }
    h2 {font-size: 24px; line-height: 28px; }
    
}


hr {height: 1px; border: 0; background-color: var(--cinch-purple-light); }
strong, b {font-family: "Buenos Aires Bold"; font-weight: normal}
table {border: 1px solid #ddd; border-collapse: collapse; font-size: 13px; }
.xxxxx{overflow-wrap: break-word;  word-wrap: break-word;  word-break: break-all; }
table td {border: 1px solid #ddd; padding: 5px; }
*, *:before, *:after {box-sizing: inherit;}
.clear {clear:both}

.text-light {color: var(--cinch-white)!important;}

.alignL {text-align: left; position: relative}
.alignC {text-align: center; position: relative}
.alignR {text-align: right; position: relative}

@media screen and (max-width:600px) {
    
.alignC__mobile {text-align: left}
    
}

.heading-hero {font-family: 'Buenos Aires Bold', sans-serif; font-size: 72px; line-height: 88px; font-weight: normal}
.heading-main {font-family: 'Buenos Aires Bold', sans-serif; font-size: 42px; line-height: 56px; font-weight: normal}
.heading-large {font-family: 'Buenos Aires Bold', sans-serif; font-size: 34px; line-height: 48px; font-weight: normal}
.heading-medium {font-size: 28px; line-height: 38px; }
.heading-small {font-size: 22px; line-height: 32px; }

.footer-text {font-size:18px; line-height: 28px; color: var(--cinch-white);}
.secondary-text {font-size:16px; line-height: 24px;}
.fine-print {font-size:14px; line-height: 20px;}
.legal {font-size:16px; line-height: 25px; color: var(--cinch-trans-white)}
.trans-text {color: var(--cinch-trans-black)}
.trans-text-purple {color: var(--cinch-trans-purple)}
.trans-text-dark {color: var(--cinch-trans-black-dark)}
.trans-text-white {color: var(--cinch-trans-white)}
.cinch-purple-light {color: var(--cinch-purple-light)}
.title-padding {padding: 0px 40px; margin: 0px auto; max-width: 1200px;}
.heading-comp-closed {display:block; font-family: 'Buenos Aires Bold', sans-serif; font-size: 42px; line-height: 56px; font-weight: normal; color: var(--cinch-green)}


.truncate { display: -webkit-box;-webkit-line-clamp: var(--line-clamp, 2);-webkit-box-orient: vertical;word-break: var(--word-break, 'none');overflow: hidden;}
.truncate-single { display: -webkit-box;-webkit-line-clamp: var(--line-clamp, 1);-webkit-box-orient: vertical;word-break: var(--word-break, 'none');overflow: hidden;}
.truncate-medium { display: -webkit-box;-webkit-line-clamp: var(--line-clamp, 3);-webkit-box-orient: vertical;word-break: var(--word-break, 'none');overflow: hidden;}


@media screen and (max-width:600px) {
    .title-padding {padding: 0px 0px; }
    .mobile__remove {display: none!important}
    .heading-hero {font-size: 38px; line-height: 68px; }
    .heading-main {font-size: 26px; line-height: 32px;}
    .heading-large {font-size: 26px; line-height: 38px;}
    .heading-medium {font-size: 24px; line-height: 34px;}
    .heading-small {font-size: 20px; line-height: 28px;}
}

/* Headers */

header.partner-header {position: relative; padding-top: 150px;}
header.partner-header .hero-text {position: relative; font-size: 65px; line-height: 65px; width: 100%; height: auto ; text-align: center;  font-family: "Buenos Aires Bold"; color: var(--cinch-white); margin: 0;}
header.partner-header .hero-text strong {color:var(--cinch-aqua)}

header.partner-header .hero-text .hero-width {margin: 0px auto; display: block; max-width: 1200px; padding: 0 30px;}


@media screen and (max-width:699px) {
   header.partner-header .hero-text {font-size: 45px; line-height: 45px; }
}

header.mini-header {position: relative; padding-top: 100px;}

header.offset-header {position: relative; padding-top: 80px; padding-bottom: 80px; color: var(--cinch-white)!important}
header.offset-header h1 {color: var(--cinch-white)!important }
header.sub-header {position: relative; padding-top: 100px;}
header.sub-header .inner { align-items: center; max-width: 1200px; margin: 0px auto; padding: 0px 30px;}

header.sub-header .inner .image {width: 100%; max-width: 840px; margin: 0px auto; text-align: center; }
header.sub-header .inner .image img {max-width: 100%!important; display: inline-block; margin:0;vertical-align:top;}
header.sub-header .inner .no-image {height: 450px; width: 1px; }

.hero-full-width {margin-top: -100px; margin-bottom: -100px;}
.hero-full-width .image {width: 100%; margin: 0px auto; text-align: center;  }
.hero-full-width .image img {width: 100%!important; height: auto!important; display: block}

@media screen and (max-width:750px) {

    header.mini-header {position: relative; padding-top: 80px;}    
}
@media screen and (max-width:600px) {
	.hero-full-width {margin-top: 0px; margin-bottom: -60px;}
    header.offset-header {position: relative; padding-top: 80px; padding-bottom: 60px; color: var(--cinch-white)!important}
}

 
/* Margins */

header {margin-bottom: 0px;}
footer {margin-top: 100px }

.curve-offset {position: relative; border-top-left-radius:30px; padding-top: 20px; margin-top: -30px; background-color: #FFFFFF;  }

@media screen and (max-width:1000px) {
    .curve-offset {position: relative; border-top-left-radius:30px; padding-top: 0px; margin-top: 0px; background-color: #FFFFFF;  }
}

.partner-block {margin: 30px auto 30px auto; padding: 0 30px; width: 100%; max-width: 1200px;  }
.internal-block {margin: 30px auto; padding: 0 30px; width: 100%; max-width: 840px; }
.external-block {margin: 100px 0; width: 100%;}
.external-block > div {margin: 30px auto; padding: 0 30px; width: 100%; }
		
.external-block + .external-block {margin-top: -100px}
.header + .external-block {margin-top: -100px; }
.external-block + footer {margin-top: -100px; } 

.external-block-purple {margin: -30px 0 100px 0; width: 100%;}

.external-block-purple-partner {margin: 0px 0 50px 0; width: 100%;}

@media screen and (max-width:600px) {
.external-block-purple {margin: 0px 0 50px 0; width: 100%;}
    .external-block-purple > .internal-block {margin: 0px 0px}
}
.partner-block__desktop {margin-bottom: 80px;}
.pa:before {content: ""; position: relative; display:block; margin-bottom: 100px; padding-top: 1px; }
.pb:after {content: ""; position: relative; display:block; margin-top: 100px; padding-bottom: 1px; }

.pa-medium:before {content: ""; position: relative; display:block; margin-bottom: 50px; padding-top: 1px; }
.pb-medium:after {content: ""; position: relative; display:block; margin-top: 50px; padding-bottom: 1px; }

.pa-small:before {content: ""; position: relative; display:block; margin-bottom: 30px; padding-top: 1px; }
.pb-small:after {content: ""; position: relative; display:block; margin-top: 30px; padding-bottom: 1px; }

.pa-footer:before {content: ""; position: relative; display:block; margin-bottom: 30px; padding-top: 1px;  }
.pb-footer:after {content: ""; position: relative; display:block; margin-top: 30px; padding-bottom: 1px;  }

@media screen and (max-width:600px) {
    
	header {margin-bottom: 0px;}
	footer {margin-top: 60px }
	.external-block {margin: 60px 0; }
	.external-block + .external-block {margin-top: -60px}
	.header + .external-block {margin-top: -80px; }
	.external-block + footer {margin-top: -60px; } 
    .pa:before {content: ""; position: relative; display:block; margin-bottom: 60px; padding-top: 1px; }
    .pb:after {content: ""; position: relative; display:block; margin-top: 60px; padding-bottom: 1px; }
    
    .partner-block {margin: 30px auto; padding: 0 20px; }
    .partner-block__desktop {margin-bottom: 0px; margin-top: 0px; background-color: var(--cinch-white-dark); padding-top: 30px; padding-bottom: 30px; }
    .external-block > div {margin: 30px auto; padding: 0 20px; width: 100%; }
    .internal-block { padding: 0 20px; }
    
}

/* Buttons */

.button-container {position: relative; width: 100%;  margin:25px 0px;  text-align: center}
.button-container a.button {position:relative; display: inline-block; padding: 10px 50px; border-radius: 23px; font-size: 16px; line-height: 25px; color: var(--cinch-white); background-color: var(--cinch-blue); transition: all linear 0.1s; text-decoration: none}
.button-container a.button:hover {background-color: var(--cinch-purple-dark);}
.button-container a.button:focus {outline:2px solid; outline-color:var(--cinch-aqua); }

.button-container a.button-outline {position:relative; display: inline-block; padding: 10px 50px; border-radius: 23px; font-size: 16px; line-height: 25px; color: var(--cinch-blue); min-width: 400px; transition: all linear 0.1s; text-decoration: none; border: 1px solid var(--cinch-blue)}
.button-container a.button-outline:hover {background-color: var(--cinch-purple-dark); color: var(--cinch-white)}
.button-container a.button-outline:focus {outline:2px solid; outline-color:var(--cinch-aqua); }

.button-container a.button-light {position:relative; display: inline-block; padding: 10px 50px; border-radius: 23px; font-size: 16px; line-height: 25px; color: var(--cinch-white); background-color: rgba(255, 255, 255, .0); transition: all linear 0.1s; text-decoration: none; outline: 1px solid; outline-color: var(--cinch-white); }
.button-container a.button-light:hover {background-color: rgba(255, 255, 255, .2); }
.button-container a.button-light:focus {outline:3px solid; outline-color:var(--cinch-aqua); }

.button-container a.button-purple {position:relative; display: inline-block; padding: 10px 50px; border-radius: 23px; font-size: 16px; line-height: 25px; color: var(--cinch-purple-dark); background-color: rgba(0, 0, 0, .0); transition: all linear 0.1s; text-decoration: none; outline: 1px solid; outline-color: var(--cinch-purple-dark); }
.button-container a.button-purple:hover {background-color: rgba(0, 0, 0, .05); }
.button-container a.button-purple:focus {outline:3px solid; outline-color:var(--cinch-aqua); }

.button-container a.button-cookie {position:relative; display: inline-block; padding: 10px 50px; border-radius: 23px; font-size: 16px; line-height: 25px; color: var(--cinch-white); background-color: var(--cinch-blue); transition: all linear 0.1s; text-decoration: none; }
.button-container a.button-cookie:hover {background-color: var(--cinch-purple-dark); }
.button-container a.button-cookie:focus {outline:3px solid; outline-color:var(--cinch-aqua); }

.button-container a.button-alt {position:relative; display: inline-block; padding: 10px 50px; border-radius: 23px; font-size: 16px; line-height: 25px; color: var(--cinch-purple-dark); background-color: rgba(0, 0, 0, .0); transition: all linear 0.1s; text-decoration: none; border: 1px solid; outline-color: var(--cinch-purple-dark); overflow: hidden }
.button-container a.button-alt:hover {background-color: rgba(0, 0, 0, .05); }
.button-container a.button-alt:focus {outline:3px solid; outline-color:var(--cinch-aqua); }

.button-container a.button-full-width {display: block;}

@media screen and (max-width:600px) {
    .button-container a.button {display: block;} 
    .button-container a.button-light {display: block; }
    .button-container a.button-purple {display: block; }
    .button-container a.button-outline {display: block; min-width: auto!important }
    
}

/* Navigation */

.navigation2 {position:absolute; top: 0px; display: block; width: 100%; font-size: 16px;  }
.navigation2 .navigation-inner {position: relative; display: flex; align-items: center; margin: 0px auto; max-width: 1200px; padding: 0 30px; height: 100px; box-sizing: border-box}
.navigation2 a.cinch-logo {width: 65px; height: 80px; margin-right: 30px; flex-grow: 0; background: url("images/cinch_presents_logo2.svg") no-repeat center; background-size: contain; transition: transform ease-in-out 0.2s}
.navigation2 a.cinch-logo:hover {transform: scale(1.05)}
.navigation2 .pack {flex-grow: 1; }
.navigation2 .navigation-inner .nav-container {}
.xxnavigation2 .navigation-inner .nav-container a {color: var(--cinch-white); margin-right:50px; line-height: 25px; transition: all linear 0.1s; }
.xxnavigation2 .navigation-inner .nav-container a:hover {color: var(--cinch-green)}
.navigation2 a.cinch-button {background-color: rgba(255, 255, 255, 0); padding: 10px 20px; border-radius: 23px; font-size: 16px; line-height: 25px; text-decoration:none; outline: 2px solid; color: var(--cinch-white); outline-color: var(--cinch-white); transition: all linear 0.1s; }
.navigation2 a.cinch-button i {margin-left: 6px; font-size: 14px;}
.navigation2 a.cinch-button:hover {background-color: rgba(255, 255, 255, 1);  outline-color: var(--cinch-white); color: var(--cinch-blue) }
.navigation2 a.cinch-button:focus {outline:3px solid; outline-color: var(--cinch-aqua)}
.navigation2 a.nav-button {display: none;}
.navigation2 a.cinch-button-m {display:none; }

.nav-container ul.t1 {position: relative; margin: 0; padding: 0; list-style: none; height: auto;}
.nav-container ul.t1 > li {position: relative; display: inline-block;  margin: 0; padding: 0;}
.nav-container ul.t1 > li > a {position: relative; display: inline-block; padding: 8px 20px; color: #fff; transition: none;}
.nav-container ul.t1 > li > a.subbed {padding-right: 40px;}
.nav-container ul.t1 > li > a.subbed::after {content: ""; position: absolute; top: 50%; right: 20px; margin-top: -6px; width: 10px; height: 10px; border-right: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(45deg) }
.nav-container ul.t1 > li > a:hover {color: var(--cinch-aqua)}
.nav-container ul.t1 > li > a:hover::after {border-color: var(--cinch-aqua)}
.nav-container ul.t1 > li div {display: none;}
.nav-container ul.t1 > li.active {z-index:10;}
.nav-container ul.t1 > li.active a {color: #fff; z-index: 1; text-decoration: none;}
.nav-container ul.t1 > li.active > a {color: var(--cinch-aqua)}
.nav-container ul.t1 > li.active > a:before {content: ""; position: fixed; top: 0; left: 0; width: 100%; height: 100%; }
.nav-container ul.t1 > li.active > a:after {transform: rotate(225deg); margin-top: -2px;border-color: var(--cinch-aqua)}
.nav-container ul.t1 > li.active div {position: absolute; display:block;  top: 0; left: 0; background: var(--cinch-purple-dark); padding-top: 40px; border-radius: 10px; overflow:hidden;}

.nav-container ul.t1 > li.active div > ul.t2 {padding: 0; margin: 0; list-style: none; background: var(--cinch-purple-light); border-top-left-radius: 10px; overflow: hidden; }
.nav-container ul.t1 > li.active div > ul.t2 li a {display: block; position: relative; width: 300px; padding: 8px 20px; color: #fff;}
.nav-container ul.t1 > li.active div > ul.t2 li a:hover {background: var(--cinch-pink-dark); text-decoration: none; }

.nav-container ul.t1 > li.active div > ul.t2.P90 li a {padding: 12px 60px 12px 20px; }
.nav-container ul.t1 > li.active div > ul.t2.P90 li .logo {position: absolute; right: 20px; top: 3px; bottom: 3px; width: 40px; background-position: center; background-repeat: no-repeat; background-size: contain; }

.navigation2 .navigation-inner .nav-container .partners-container {position:absolute; background-color: var(--cinch-purple-dark); padding: 20px 0 0 0 ; border-radius: 10px; overflow: hidden; left: -20px;}
.navigation2 .navigation-inner .nav-container .partners-container .partners-container-inner {position: relative; background-color: var(--cinch-purple-light); padding: 20px; border-top-left-radius: 10px;}
.navigation2 .navigation-inner .nav-container .partners-container .partners-container-inner a {position:relative; display: block; width: 100%; padding-right: 50px; margin: 20px 0; height: 30px; min-width: 300px;}
.navigation2 .navigation-inner .nav-container .partners-container .partners-container-inner a .logo {position: absolute; right: 0px; width: 40px; text-align: center }
.navigation2 .navigation-inner .nav-container .partners-container .partners-container-inner a .logo img {max-height: 25px; max-width: 65px; }

.hero-image {overflow:hidden}
.hero-text2 {position: absolute; z-index: 10;font-size: 6vw; width: 100%; left: 0px; top: 10vw; text-align: center;  font-family: "Buenos Aires Bold"; color: var(--cinch-purple-dark)}
.hero-text2 strong {color: var(--cinch-pink-dark); font-weight: normal;}

			
@media screen and (max-width:750px) {
	.hero-image .hero-text2 {display:none;}
	.navigation2 .navigation-inner {height: 80px; padding: 0 20px; overflow:hidden; }
	.navigation2 .nav-container {position: fixed; z-index: 10; top: 0; right: 0; height: 100%; width: 100%; pointer-events: none; overflow: hidden; background: rgba(49, 28, 119, ,0); transition: background 0.3s}
	.navigation2 .nav-container > div {position: absolute; display:flex; flex-direction: column; top: 0; left: 100%; width: 400px; height: 100%; background: #fff; border-top-left-radius: 20px;  transition: left 0.3s ; justify-content: flex-start} 
	.navigation2 .nav-container > div .menu-top {display:flex; flex-grow: 0; align-items: center; justify-content: space-between; padding: 0px 20px; }
	.navigation2 .nav-container > div .menu-middle {flex-grow: 0; overflow: auto; padding: 0 20px;  }
	.navigation2 .nav-container > div .menu-bottom {flex-grow: 0; padding: 10px 20px 30px 20px;}
	
	.navigation2 .nav-container > div .menu-top .nav-logo {position: relative; width: 65px; height: 80px; background: url("images/cinch_presents_logo2_r.svg") no-repeat center; background-size: contain; }

	.navigation2 .nav-container > div .menu-top .nav-close {position: relative; width: 40px; height: 40px; border-radius: 50%; background: var(--cinch-purple-dark); border: 3px solid var(--cinch-aqua); }
	.navigation2 .nav-container > div .menu-top .nav-close:before {content: ""; position: absolute; top: 50%; left: 50%; width: 20px; height: 2px; margin-top: -1px; margin-left: -10px; background: #fff; transform: rotate(45deg);}
	.navigation2 .nav-container > div .menu-top .nav-close:after {content: ""; position: absolute; top: 50%; left: 50%; width: 20px; height: 2px; margin-top: -1px; margin-left: -10px; background: #fff; transform: rotate(-45deg);}
	
	.navigation2 .nav-container.active {background: rgba(49, 28, 119, 0.5);}
	.navigation2 .nav-container.active > div {left: calc(100% - 400px); pointer-events: all; }
	
	
	
	.navigation2 .nav-container ul.t1 {display:block; border-top: 1px solid #eee; height: auto; background: var(--cinch-purple-dark); border-radius: 10px; overflow:hidden; }
	.navigation2 .nav-container ul.t1 li {display:block;}
	.nav-container ul.t1 > li > a {display: block;}
	.nav-container ul.t1 > li.active div {position: relative; padding: 0;}
	.nav-container ul.t1 > li.active div > ul.t2 li a {width: auto; }
	
	
	.navigation2 a.cinch-button {display:none;}
	.navigation2 a.cinch-button-m {display: block; background: var(--cinch-blue); color: #fff; text-align:center; padding: 10px; border-radius: 24px; }
	
	
	.navigation2 a.nav-button {display: block; margin-right: -15px; padding: 15px; border-radius: 15px; background: rgba(255,255,255,0); transition: none; }
	.navigation2 a.nav-button b {position: relative; display: block; width: 30px; height: 23px; }
	.navigation2 a.nav-button b i {position: absolute; left: 0; width: 100%; height: 3px; border-radius: 2px; transition: all 0.3s; background: #fff; }
	.navigation2 a.nav-button b i:nth-child(1) {top: 0; }
	.navigation2 a.nav-button b i:nth-child(2) {top: 10px; }
	.navigation2 a.nav-button b i:nth-child(3) {bottom: 0; }
	.navigation2 a.nav-button:hover { background: #fff; }
	.navigation2 a.nav-button:hover b i {background-color: var(--cinch-purple-light); }
	
	
}
@media screen and (max-width:400px) {
	.navigation2 .nav-container > div {width: 100%; }
	.navigation2 .nav-container.active > div {left:0; }
}
	

/* Containers */

.wrapper {position: relative;}
.container {position: relative; padding: 0 30px 0 30px; box-sizing: border-box}
.inner-container {position: relative; margin: 0px auto; box-sizing: border-box; max-width: 900px; padding: 0 30px 0 30px;}


/* Parallax hero banners */

.hero-header-banner {position: relative; height: 200px; background-color: var(--cinch-purple-dark); display: flex; align-items: center; justify-content: center;}
.hero-image-scroll { position: fixed;left: 0;top: 0;width: 100%;background-image: url("images/cinch-hero-demo-standard-scale.jpg");background-position: center; background-size: cover; background-repeat: no-repeat; }
.hero-image-inner {height:calc(100vh - 200px); min-height: 500px;}
.partner-logo {position: relative; display: block; width: 150px; height: 125px;}
.partner-logo img {width: 100%!important; height:auto!important }

@media screen and (max-width:1000px) {
    .hero-header-banner {position: relative; height: 100px; background-color: var(--cinch-purple-dark); display: flex; align-items: center; justify-content: center;}
    .hero-image-inner {height:calc(60vh - 100px)}
    .hero-image-scroll { position: fixed;left: 0;top: 0;width: 100%;background-image: url("images/cinch-hero-demo-square-scale.jpg");background-position: center;}
    .partner-logo {position: relative; display: block; width: 90px; height: 75px;}
}

.leftCurve-grey-mini {display: none }

@media screen and (max-width:600px) {
.leftCurve-grey-mini {position: absolute; top: -30px; left: 0; display: block }
.leftCurve-grey-mini  i {position: absolute; top: 0; left: 0; width: 30px; height: 30px; overflow: hidden; background: var(--cinch-white-dark); }
.leftCurve-grey-mini  i:after {content: ""; position: absolute; top: 0; left: 0; width: 60px; height: 60px; border-top-left-radius: 30px; background: #fff; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; z-index: 1; }
}



.leftCurve-pink-mini {position: absolute; bottom: 0; left: 0; }
.leftCurve-pink-mini  i {position: absolute; top: 0; left: 0; width: 30px; height: 30px; overflow: hidden; background: #ff2dff; }
.leftCurve-pink-mini  i:after {content: ""; position: absolute; top: 0; left: 0; width: 60px; height: 60px; border-top-left-radius: 30px; background: #fff; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; z-index: 1; }

.leftCurve-pink {position: relative; height: 0; }
.leftCurve-pink i {position: absolute; top: 0; left: 0; width: 30px; height: 30px; overflow: hidden; background: #ff2dff; }
.leftCurve-pink i:after {content: ""; position: absolute; top: 0; left: 0; width: 60px; height: 60px; border-top-left-radius: 30px; background: #fff; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; z-index: 1; }

@media screen and (max-width:1200px) {
    .leftCurve-pink {display: none }
    .leftCurve-pink-mini {display: none}
}

/* Partner logos */



.main-partner-logos {position: relative; display: flex; align-content: center; justify-content: center; padding: 20px;
    min-height: 160px;
    align-items: center;}
.main-partner-logos img {max-height: 120px!important; width:100%; height: auto!important; max-width: 300px; }

@media screen and (max-width:600px) {
   .main-partner-logos img { max-width: 200px; }
}


/* forms */

form {margin: 0;}
form input[type=text] {width: 100%; padding: 12px 20px; margin: 8px 0; box-sizing: border-box; border: 1px solid #BFBFBF; border-radius: 5px;}
form input[type="checkbox"] {margin-right: 20px;  transform: scale(1.2);}
form .field {margin: 10px 0;}
form .checkSurround {display:flex; background-color: var(--cinch-checkbox-surround);; padding: 10px; font-size: 12px; line-height: 18px; color: #656565; border-radius: 5px;}
form .button {position:relative; display: block;  padding: 10px 50px; border-radius: 23px; font-size: 16px; line-height: 25px; color: var(--cinch-white); background-color: var(--cinch-blue); transition: all linear 0.1s; text-decoration: none; text-align: center; margin-top: 20px; width: 100%; border: 0px;}
form .button:hover {background-color: var(--cinch-purple-dark);}
form .button:focus {outline:2px solid; outline-color:var(--cinch-aqua); }

form .error-message {color: var(--error); display:none; margin-top: 5px; margin-bottom: 5px; }
form .error-message.active {display:block; }

form .successMessage {background-color: #ff990; font-weight: 700; font-size: 26px; color: var(--cinch-purple-dark)}


/* Posts */

.post-grid {position:relative; display: flex; flex-wrap: wrap; box-sizing: border-box;  align-items: center;justify-content: center; max-width: 1200px; margin-top: 80px!important; }
.post-grid .item {box-sizing: border-box; width: 25%; height: 200px; padding: 30px 20px; text-align: center}
.post-grid .item a {position: relative; display: inline-block; width: 100%; height: 100%; max-height: 120px; max-width: 150px; background-repeat: no-repeat; background-position: center; transition:transform ease-in-out 0.2s }
.post-grid .item a:hover {transform: scale(1.1); }

@media screen and (max-width:600px) {
    .post-grid .item { width: 50%; }
    .post-grid .item a {position: relative; display: block; width: 100%; height: 100%; max-height: 500px; max-width: 500px; background-repeat: no-repeat; background-position: center; transition:transform ease-in-out 0.2s }
}

@media screen and (max-width:600px) {
 .post-grid .item { width: 100%; height: 200px; }
}


.post-grid-comp {position:relative; display: flex; flex-wrap: wrap; box-sizing: border-box;  align-items: center;justify-content: center; max-width: 1200px; }
.post-grid-comp .item {box-sizing: border-box; width: 25%; height: 200px; padding: 30px 20px; text-align: center}
.post-grid-comp .item a {position: relative; display: inline-block; width: 100%; height: 100%; max-height: 120px; max-width: 190px; background-repeat: no-repeat; background-position: center; transition:transform ease-in-out 0.2s }
.post-grid-comp .item a:hover {transform: scale(1.1); }

@media screen and (max-width:600px) {
    .post-grid-comp .item { width: 50%; }
    .post-grid-comp .item a {position: relative; display: block; width: 100%; height: 100%; max-height: 500px; max-width: 500px; background-repeat: no-repeat; background-position: center; transition:transform ease-in-out 0.2s }
}

@media screen and (max-width:600px) {
 .post-grid .item { width: 100%; height: 200px; }
}

/* Homepage 2023 additions */

.post-grid-outer {position:relative; margin:  0px auto; max-width: 1200px;}
.post-grid-featured {position:relative; display: grid; grid-template-columns: repeat(3, 1fr);  box-sizing: border-box; grid-column-gap: 30px; grid-row-gap: 30px; }

.post-grid-featured  .item {display: flex; flex-wrap: wrap;  position:relative; border-radius: 10px; background-color:  var(--cinch-white);  text-align: left; box-shadow: 0 3px 10px rgb(0 0 0 / 0.1); overflow: hidden; text-decoration: none; transition: box-shadow ease-in-out 0.2s;  }
.post-grid-featured .item:hover {box-shadow: 0 7px 20px rgb(0 0 0 / 0.2);}
.post-grid-featured .item .image {position: relative; display: block; width: 100%;  }
.post-grid-featured .item .image img {width: 100%!important; height: auto!important}


.post-grid-featured .item .text {display:block; position: relative;  width: 100% ; background-color:#FFFFFF; color:var(--cinch-black); padding: 20px; border-top-left-radius: 5px; top: -10px; font-size: 14px; padding-bottom: 0px; line-height: 20px; }
.post-grid-featured .item .text .heading-small {display: block; color:var(--cinch-purple-light); font-weight: bold}

.post-grid-featured .item .cta {display: block; position:relative;  align-self: flex-end; width: 100%; height: auto; padding:0px 20px 20px 20px;}
.post-grid-featured .item .cta .button-wrapper {position: relative; left: 0px; bottom: 0px; width: 100%;  }
.post-grid-featured .item .cta .button-wrapper a.button {display: inline-block; background-color:var(--cinch-blue); padding: 5px 30px; color: var(--cinch-white); height: 30px; border-radius: 17px; transition: background-color ease-in-out 0.2s; font-size: 14px; line-height: 20px; text-decoration: none  }
.post-grid-featured .item .cta .button-wrapper a.button:hover {background-color:var(--cinch-purple-dark);}
.post-grid-featured .item .cta .logo {position: absolute; right: 20px; bottom: 20px; width: 40%;  text-align: right }
.post-grid-featured .item .cta .logo img {max-width: 45px!important; max-height: 45px!important;}


@media screen and (max-width:600px) {
 .post-grid .item { width: 100%; height: 200px; }
}

/* Competitions */


.post-grid-competitions {position:relative; display: grid; grid-template-columns: repeat(3, 1fr);  box-sizing: border-box; grid-column-gap: 30px; grid-row-gap: 30px;  }

.post-grid-competitions  .item {display: flex; flex-wrap: wrap;  position:relative; border-radius: 10px; background-color:  var(--cinch-white);  text-align: left; box-shadow: 0 3px 10px rgb(0 0 0 / 0.1); overflow: hidden; text-decoration: none; transition: box-shadow ease-in-out 0.2s;  }

.post-grid-competitions  .newsletter {padding: 0 20px; font-size: 16px; color: #656565}
.post-grid-competitions  .newsletter form:before {content: ""; position: relative; display:block; margin-bottom: 20px; padding-top: 1px;  }
.post-grid-competitions  .newsletter form:after {content: ""; position: relative; display:block; margin-top: 20px; padding-bottom: 1px;  }

.post-grid-competitions  .newsletter strong {display: block; width: 100%; font-size: 26px; color:var(--cinch-black); margin-bottom: 5px;}
.post-grid-competitions  .newsletter span {display: block; width: 100%; color: var(--cinch-purple-dark)}
.post-grid-competitions  .item:hover {box-shadow: 0 7px 20px rgb(0 0 0 / 0.2);}
.post-grid-competitions  .item .image {position: relative; display: block; width: 100%; padding: 10px 10px 0px 10px;;  }
.post-grid-competitions  .item .image img {width: 100%!important; height: auto!important; border-radius: 5px; display: block}


.post-grid-competitions  .item .text {display:block; position: relative;  width: 100% ; background-color:#FFFFFF; color:var(--cinch-black); padding: 20px; border-top-left-radius: 5px; top: -10px; font-size: 14px; padding-bottom: 0px; line-height: 20px; }
.post-grid-competitions  .item .text .heading-small {display: block; color:var(--cinch-black); font-weight: bold}

.post-grid-competitions  .item .cta {display: block; position:relative;  align-self: flex-end; width: 100%; height: auto; padding:0px 20px 20px 20px;}
.post-grid-competitions  .item .cta .button-wrapper {position: relative; left: 0px; bottom: 0px; width: 100%;  }
.post-grid-competitions  .item .cta .button-wrapper a.button {display: inline-block; background-color:var(--cinch-blue); padding: 5px 30px; color: var(--cinch-white); height: 30px; border-radius: 17px; transition: background-color ease-in-out 0.2s; font-size: 14px; line-height: 20px; text-decoration: none  }
.post-grid-competitions  .item .cta .button-wrapper a.button:hover {background-color:var(--cinch-purple-dark);}
.post-grid-competitions  .item .cta .logo {position: absolute; right: 20px; bottom: 20px; width: 40%;  text-align: right }
.post-grid-competitions  .item .cta .logo img {max-width: 45px!important; max-height: 45px!important;}



.post-grid-competitions  .item .partner-header {display: block; box-sizing: border-box; display: block; width: 100%; align-items: flex-start;  padding: 10px;  }
.post-grid-competitions  .item .partner-header .inner { display: flex; text-align: center; border-radius: 5px; padding: 20px 20px; min-height: 130px; box-sizing: border-box; width: 100%; justify-content: center }
.post-grid-competitions  .item .partner-header .inner img { display: inline-block; max-height: 100px; align-self: center}

.post-grid-competitions  .item .text-partner {display:block; position: relative; align-self: flex-start!important;  width: 100% ; background-color:#FFFFFF; color:var(--cinch-grey-light); padding: 20px;  font-size: 14px; padding-bottom: 60px; line-height: 20px; height: 100%;   }
.post-grid-competitions  .item .text-partner .partner-truncate { display: -webkit-box; -webkit-line-clamp: 3;-webkit-box-orient: vertical; overflow:hidden; margin-bottom: 10px;  }

.post-grid-competitions  .item .text-partner .heading-small {display: block; color:var(--cinch-black); font-weight: bold}

.post-grid-competitions  .item .cta-partner {display: block; position:absolute;  width: 100%; height: auto; padding:0px 20px 20px 20px; bottom: 0px;}
.post-grid-competitions  .item .cta-partner .button-wrapper {position: relative; left: 0px; bottom: 0px; width: 100%;  }
.post-grid-competitions  .item .cta-partner .button-wrapper a.button {display: block; position: relative;  padding: 0px 0px; color: var(--cinch-black); height: 40px; border-radius: 0px; transition: all ease-in-out 0.2s; font-size: 18px; line-height: 40px; text-decoration: underline  }

.post-grid-competitions  .item .cta-partner .button-wrapper a.button .button-circle {position: absolute; right: 0px; width: 40px; height: 40px; background-color: var(--cinch-white-dark); border-radius: 50%; transition: all ease-in-out 0.2s; }
.post-grid-competitions  .item .cta-partner .button-wrapper a.button .button-circle:after {content: ""; width: 30%; height: 30%; position: absolute; top: 35%; left: 30%; border-top: 2px solid #311c77; border-left: 2px solid #311c77; transform: rotate(135deg);}


.post-grid-competitions  .item .cta-partner .button-wrapper a.button:hover .button-circle {background-color: var(--cinch-purple-light);}
.post-grid-competitions  .item .cta-partner .button-wrapper a.button:hover .button-circle:after { border-top: 2px solid #FFF; border-left: 2px solid #FFF; }



.comp-limit .post-grid-competitions .item:nth-child(n+10) {display: none}
.comp-limit.active .post-grid-competitions .item:nth-child(n+10) {display: block; animation: fade_in_show 0.5s}


@keyframes fade_in_show {
     0% {opacity: 0;}

     100% {opacity: 1;}
}

@media screen and (max-width:600px) {
    
.post-grid-competitions  .item .cta-partner {display: block; position:absolute;  width: 100%; height: auto; padding:0px 20px 20px 20px; bottom: 0px;}
.post-grid-competitions  .item .cta-partner .button-wrapper {position: relative; left: 0px; bottom: 0px; width: 100%;  }
.post-grid-competitions  .item .cta-partner .button-wrapper a.button {display: block;  padding: 0px 0px; color: var(--cinch-white); height: 40px; border-radius: 23px; transition: all ease-in-out 0.2s; font-size: 18px; line-height: 40px; text-decoration: none ; background-color:var(--cinch-blue); text-align: center }

.post-grid-competitions  .item .cta-partner .button-wrapper a.button .button-circle {display: none }


.post-grid-competitions  .item .cta-partner .button-wrapper a.button-closed {display: block;  padding: 0px 0px; color: var(--cinch-purple-dark); height: 40px; border-radius: 23px;  ; background-color:var(--cinch-white); border:1px solid var(--cinch-purple-dark)  }


}

.post-grid-competitions  .item .cta-partner .logo {position: absolute; right: 20px; bottom: 20px; width: 40%;  text-align: right }
.post-grid-competitions  .item .cta-partner .logo img {max-width: 45px!important; max-height: 45px!important;}



.post-grid-competitions  .item .partner-header-min {display: block; box-sizing: border-box; display: block; width: 100%; align-items: flex-start;  padding: 10px;  }
.post-grid-competitions  .item .partner-header-min .inner { display: flex; text-align: center; border-radius: 5px; padding: 20px 20px; min-height: 150px; box-sizing: border-box; width: 100%; justify-content: center; background-repeat: no-repeat; background-position: center; background-size: contain}
.post-grid-competitions  .item .partner-header-min .inner img { display: inline-block; max-height: 100px; align-self: center}

.post-grid-competitions  .item .cta-partner-min {display: block; position:relative;  width: 100%; align-self: flex-end; padding: 10px 20px 20px 20px; box-sizing: border-box}
.post-grid-competitions  .item .cta-partner-min .button-wrapper {position: relative; width: 100%;  }
.post-grid-competitions  .item .cta-partner-min .button-wrapper a.button {display: block; position: relative; align-self: flex-end;  padding: 0px 40px 0px 0px; color: var(--cinch-black);  border-radius: 0px; transition: all ease-in-out 0.2s; font-size: 18px; text-decoration: none  }
.post-grid-competitions  .item .cta-partner-min .button-wrapper a.button .tag {font-size:14px; display: block; color: var(--cinch-grey-light) }
.post-grid-competitions  .item .cta-partner-min .button-wrapper a.button .title {font-size:22px; line-height: 32px; display: block; font-weight: bold }
.post-grid-competitions  .item .cta-partner-min .button-wrapper a.button .button-circle {position: absolute; right: -10px; bottom: 0px; width: 40px; height: 40px;  border-radius: 50%; transition: all ease-in-out 0.2s;   }
.post-grid-competitions  .item .cta-partner-min .button-wrapper a.button .button-circle:after {content: ""; width: 30%; height: 30%; position: absolute; top: 35%; left: 30%; border-top: 2px solid #311c77; border-left: 2px solid #311c77; transform: rotate(135deg);}


.post-grid-competitions  .item .cta-partner-min .button-wrapper a.button:hover .button-circle {background-color: var(--cinch-purple-light);}
.post-grid-competitions  .item .cta-partner-min .button-wrapper a.button:hover .button-circle:after { border-top: 2px solid #FFF; border-left: 2px solid #FFF; }


.post-grid-competitions  .comp-expired {position:relative;   }

.post-grid-competitions  .comp-expired .image {position: relative; display: block; width: 100%; padding: 10px 10px 0px 10px;  }
.post-grid-competitions  .comp-expired .image img {width: 100%!important; position: relative; height: auto!important; border-radius: 5px; display: block; opacity: 0.3}


.post-grid-competitions  .comp-expired .image .closedButton {position: absolute; top: 20px; right: 20px; background-color: var(--cinch-white); z-index: 1; border-radius: 23px; padding: 10px 20px; color: var(--cinch-purple-dark); font-weight: 700}

.post-grid-competitions  .comp-expired .textComp {display:block; position: relative; align-self: flex-start!important;  width: 100% ; background-color:#FFFFFF; color:var(--cinch-grey-light); padding: 20px;  font-size: 14px; padding-bottom: 60px; line-height: 20px; height: 100%;  }
.post-grid-competitions  .comp-expired .textComp  .heading-medium {display: block; color:var(--cinch-black); font-weight: bold}

.post-grid-competitions  .comp-expired .ctaEx {display: block; position:relative; align-self: flex-end; width: 100%; padding:0px 20px 20px 20px; }
.post-grid-competitions  .comp-expired .ctaEx .button-wrapper {position: relative; left: 0px; bottom: 0px; width: 100%;  }
.post-grid-competitions  .comp-expired .ctaEx .button-wrapper a.button {display: block;  padding: 0px 0px; color: var(--cinch-black); height: 40px; border-radius: 0px; transition: all ease-in-out 0.2s; font-size: 18px; line-height: 40px; text-decoration: underline  }

.post-grid-competitions  .comp-expired .ctaEx .button-wrapper a.button .button-circle {position: absolute; right: 0px; width: 40px; height: 40px; background-color: var(--cinch-white-dark); border-radius: 50%; transition: all ease-in-out 0.2s; }
.post-grid-competitions  .comp-expired .ctaEx .button-wrapper a.button .button-circle:after {content: ""; width: 30%; height: 30%; position: absolute; top: 35%; left: 30%; border-top: 2px solid #000; border-left: 2px solid #000; transform: rotate(135deg);}


@media screen and (max-width:1000px) {
    .post-grid-competitions {grid-template-columns: repeat(2, 1fr);  }
    .post-grid .item {box-sizing: border-box; width: 33.3333%; height: 200px; padding: 30px 20px; text-align: center}
}

.button-container-min {padding-bottom: 80px; margin-top: 80px;}

@media screen and (max-width:600px) {
    .button-container-mobile-hide {display: none!important}
    .post-grid .item {box-sizing: border-box; width: 50%; height: 200px; padding: 30px 20px; text-align: center}
    .post-grid-competitions {grid-template-columns: repeat(1, 1fr);  }
    .post-grid-competitions-min {grid-column-gap: 10px; grid-row-gap: 10px;  }
    .post-grid-competitions  .item .partner-header-min {display: block; box-sizing: border-box; display: block; width: 30%; align-self: center; height: 100%    }
    .post-grid-competitions  .item .partner-header-min .inner { display: flex; text-align: center; border-radius: 5px; border: 3px solid transparent; padding: 0px 0px; min-height: auto!important;   box-sizing: border-box; width: 100%; height: 100%;  justify-content: center; background-size:contain}
    
    .post-grid-competitions  .item .partner-header-min .inner:after {content: "";display: block; padding-bottom: 100%;}
    
    .post-grid-competitions  .item .partner-header-min .inner img { display: none; max-height: 50px; max-width: 50px; align-self: center}
    
    .post-grid-competitions  .item .cta-partner-min {display: block; position:relative;  width: 70%;  padding: 0px 20px 0px 10px; box-sizing: border-box;  align-self: center!important}
    .post-grid-competitions  .item .cta-partner-min .button-wrapper a.button .tag {font-size:14px; display: block; color: var(--cinch-grey-light) }
    .post-grid-competitions  .item .cta-partner-min .button-wrapper a.button .button-circle {bottom: calc(50% - 20px); }
    
    .post-grid-competitions  .item .cta-partner-min .button-wrapper a.button .title {font-size:16px; line-height: 25px; display: block; font-weight: bold }
    
    .button-container-min {padding-bottom: 60px; margin-top: 30px;}
   
}

/* Slider */

.competitions-slider {position: relative;  margin-top: 30px; margin-left: -30px; margin-right: -30px; }
.competitions-slider .item {position: relative; display: flex; flex-wrap: wrap;   width: 44%; min-height: 100%; padding: 20px;  }

.competitions-slider .item .itemInner { width: 100%; display: flex; flex-wrap: wrap; position:relative; border-radius: 10px; background-color:  var(--cinch-white);  text-align: left; box-shadow: 0 3px 10px rgb(0 0 0 / 0.1); overflow: hidden; text-decoration: none; transition: box-shadow ease-in-out 0.2s;}

.competitions-slider .item .itemInner:hover {box-shadow: 0 0px 20px rgb(0 0 0 / 0.4); }
.competitions-slider .item .itemInner .image {position: relative; display: block; width: 100%  }
.competitions-slider .item .itemInner .image img {width: 100%!important; height: auto!important}

.competitions-slider .item .itemInner .text {display:block; align-self: center; width: 100%; position:relative; background-color:#FFFFFF; color:var(--cinch-black); padding: 20px; border-top-left-radius: 5px; top: -10px; font-size: 14px; padding-bottom: 0px; line-height: 20px; }
.competitions-slider .item .itemInner .text .truncate-medium {width: 90%; margin-top: 10px; display: block}
.competitions-slider .item .itemInner .text .truncate-medium > p  { margin: 0px 0 0 0;}
.competitions-slider .item .itemInner .text .heading-small {display: block; color:var(--cinch-purple-light); font-weight: bold}

.competitions-slider .item .itemInner .cta {display: block; position:relative;  align-self: flex-end; width: 100%; height: auto; padding:0px 20px 20px 20px; }
.competitions-slider .item .itemInner .cta .button-wrapper {position: relative; left: 0px; bottom: 0px; width: 100%;  }
.competitions-slider .item .itemInner .cta .button-wrapper a.button {display: inline-block; background-color:var(--cinch-blue); padding: 5px 30px; color: var(--cinch-white); height: 30px; border-radius: 17px; transition: background-color ease-in-out 0.2s; font-size: 14px; line-height: 20px; text-decoration: none  }
.competitions-slider .item .itemInner .cta .button-wrapper a.button:hover {background-color:var(--cinch-purple-dark);}
.competitions-slider .item .itemInner .cta .logo {position: absolute; right: 20px; bottom: 20px; width: 40%;  text-align: right }
.competitions-slider .item .itemInner .cta .logo img {max-width: 45px!important; max-height: 45px!important;}

.competitions-slider .item .itemInner .ctaEx {display: block; position:relative; align-self: flex-end; width: 100%; padding:0px 20px 20px 20px; }
.competitions-slider .item .itemInner .ctaEx .button-wrapper {position: relative; display: block;  width: 100%!important; text-align: center; }
.competitions-slider .item .itemInner .ctaEx .button-wrapper a.button {display: inline-block; background-color:transparent; padding: 5px 30px; color: var(--cinch-white); height: 30px; border-radius: 17px; transition: background-color ease-in-out 0.2s; font-size: 14px; line-height: 16px; text-decoration: none; border: 2px solid var(--cinch-white)  }
.competitions-slider .item .itemInner .ctaEx .button-wrapper a.button:hover {background-color:var(--cinch-trans-white-dark);}


.competitions-slider .item .comp-expired {background-color:  var(--cinch-purple-dark);   }
.competitions-slider .item .comp-expired .text {display:block; align-self: center; position:relative; background-color:  var(--cinch-purple-dark);  color:var(--cinch-white); padding: 19px 20px 19px 20px; border-top-left-radius: 5px; top: -10px; font-size: 14px; line-height: 20px; text-align: center}
.competitions-slider .item .comp-expired .text .heading-medium {display: block; color:var(--cinch-green)!important; font-weight: bold; line-height: 30px;}

.comp-trophy {display: inline-block; width: 40px; height: 40px; border:1px solid; border-color: var(--cinch-green); border-radius: 50%; font-size: 20px; line-height: 20px; padding: 10px 0; text-align: center; background-image: url("images/trophy.svg"); background-size: 64%; background-repeat: no-repeat; background-position: center  }


@media screen and (max-width:1200px) {
.competitions-slider .item {width: 70%;}

}

@media screen and (max-width:799px) {
    .competitions-slider {position: relative;  margin-top: 30px; margin-left: 0px; margin-right: 0px; }
    .competitions-slider .item {width: 100%; padding: 0px; margin-left: 10px; margin-right: 10px;}
    .competitions-slider .item .itemInner { box-shadow: 0 0px 0px rgb(0 0 0 / 0);}
    .competitions-slider .item .itemInner:hover {box-shadow: 0 0px 20px rgb(0 0 0 / 0); }

}

/* Anchor link */

.anchor-link {display: none;}

@media screen and (max-width:600px) {
.anchor-link {display: block;  background-color: var(--cinch-white-dark); text-align: center; padding: 20px 20px 50px 20px; margin-bottom: -60px; font-size: 14px; text-decoration: underline}
    .anchor-link i {text-decoration: none}
}
/* Videos */

a.vid-insta-link {position: relative; display: flex; color:  var(--cinch-black); width: 100%; align-content: center; justify-content: center}
a.vid-insta-link i {align-self: flex-start; font-size: 40px; text-decoration: none}
a.vid-insta-link span {align-self: flex-end; display: none}
a.vid-insta-link:hover {text-decoration: none}


@media screen and (max-width:600px) {
a.vid-insta-link {position: relative; display: flex; color:  var(--cinch-black); width: 100%; align-content: center; justify-content: space-between; margin-bottom: 20px;}
    a.vid-insta-link i {text-decoration: none}
a.vid-insta-link span {display: block; align-self: flex-end; text-decoration: underline; font-size: 14px;}
    a.vid-insta-link:hover span {text-decoration: none}
}

.video-slider {position: relative; display: block; padding: 20px 80px;  box-sizing: border-box; margin: 0px auto; max-width: 1200px; margin-top: 40px; margin-bottom: 40px; }
.video-slider .item {position: relative; box-sizing: border-box; width: 33.333%;  padding: 0px 20px; }

.video-slider .item-large {position: relative; box-sizing: border-box; width: 100%;  padding: 0px 20px; }

.video-container {position: relative; padding-bottom: 56.0%; width: 100%; margin: 0px auto; height: 0; overflow: hidden; border-radius: 10px; box-shadow: 0 3px 10px rgb(0 0 0 / 0.1); transition: box-shadow ease-in-out 0.2s; }
.video-container iframe, .video-container object, .video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.video-container:hover {box-shadow: 0 0px 20px rgb(0 0 0 / 0.4);}
.video-container.playing {visibility: hidden;}
.video-container .vid-grip-l {position: absolute; left: 0px; top: 0px; height: calc(100% - 50px); width:calc(50% - 50px);  }
.video-container .vid-grip-l::after {position: absolute; display: block;content: ''; width: 60%; height:calc(50% - 100px) ;top: 0;left: 100%;}
.video-container .vid-grip-r {position: absolute; right: 0px; top: 0px; height: calc(100% - 50px); width:calc(50% - 50px);  }
.video-container .vid-grip-r::after {position: absolute; display: block; content: ''; width: 60%; height:calc(50% - 100px) ;bottom: 0px;right: 100%; }
.video-container a {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-repeat: no-repeat; background-size: cover; background-position: center;}
.video-container .vid-cover {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-repeat: no-repeat; background-size: cover; background-position: center;}
.video-container .vid-cover a {position: absolute; top: 50%; left: 50%; width: 80px; height: 80px; margin-left: -40px; margin-top: -40px; background: #8cffbe; background: rgb(87,232,255);
background: linear-gradient(93deg, rgba(87,232,255,1) 4%, rgba(140,255,190,1) 70%); border-radius: 50%; animation: pulse 1s infinite; }		
.video-container .vid-cover a:before {content: ""; position: absolute; top: 50%; left: 50%; width: 100px; height: 100px; margin-left: -50px; margin-top: -50px; background: #8cffbe; ; border-radius: 50%; animation: pulse2 1s infinite; }		
.video-container .vid-cover a:after {content: ""; position: absolute; top: 50%; left: 50%; margin-top: -6px; margin-left: -3px; width: 0; height: 0; border-style: solid; border-width: 6px 0 6px 10px; border-color: transparent transparent transparent #311c77;  animation: pulse 1s infinite;}


.video-modal {position: fixed; display: flex; left: 0; top: 0; width: 100%; height: 100%; align-items: center; justify-content: center; background: rgba(0,0,0,0.5); z-index: 50;}
.video-modal > div {position: relative; width: 90%; width: calc(100% - 40px); max-width: 1000px; }
.video-modal > div > div {position: relative;  padding-bottom: 56.0%;}
.video-modal iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: none; background: #000; border-radius: 8px;}
.video-modal > div .close-button {position: absolute; top: -18px; right: -18px; width: 36px; height: 36px; border: 2px solid var(--cinch-aqua); background: var(--cinch-purple-dark); border-radius: 50%; }
.video-modal > div .close-button:before {content: ""; position: absolute; top: 15px; left: 5px; width: 21px; height: 1px; background: #fff; transform: rotate(45deg); opacity: 0.7;}
.video-modal > div .close-button:after {content: ""; position: absolute; top: 15px; left: 5px; width: 21px; height: 1px; background: #fff; transform: rotate(-45deg); opacity: 0.7;}
@keyframes pulse {
		0% {transform:scale(1);}
		15% {transform:scale(1.05);}
		30% {transform:scale(1);}
	}
@keyframes pulse2 {
		0% {transform:scale(1);	opacity: 0.5;}
		100% {transform:scale(2);opacity: 0;}
	}	


@media screen and (max-width:800px) {
    
.video-slider {position: relative; display: block; padding: 0px 0px;  box-sizing: border-box;  max-width: 1200px;}
.video-slider .item {position: relative; box-sizing: border-box; width: 100%;  padding: 0px; margin-left: 20px; margin-right: 20px;  counter-increment: carousel-cell;}
    
}

/* Post page */



/* Footer */

.footer-corner {position:absolute; top: -30px; left: 0px; display: block; width: 100%; height: 30px; background-color: var(--cinch-purple-dark); border-top-left-radius: 30px; }
.footer {position:relative; display: block; background-color: var(--cinch-purple-dark); padding-bottom: 30px;}
.footer ul {list-style: none; margin: 0; padding: 0;}
.footer ul li {display: inline-block; margin: 10px}
.footer ul li a {color: var(--cinch-white); font-size: 16px; line-height: 25px; text-decoration: underline; }
.footer ul li a:hover {color: var(--cinch-aqua);}

.footer P {margin-bottom: 0px;}

.footer .footer-text a {color:var(--cinch-white)}
.footer .footer-text a:hover {color: var(--cinch-aqua);}

.footer-socials {display: flex; align-content: center; max-width: 312.5px; margin: 0px auto}
.footer-socials div {position: relative; flex-grow:1; color: var(--cinch-white)}
.footer-socials div::after {content: ""; position: absolute; left: 0px; width: 0px ; height: 100%; background-color: var(--cinch-trans-white)}
.footer-socials div:first-child::after {content: none}

.footer-socials div a {position: relative; display:inline-block; width: 40px; padding: 20px 0; margin: 0 5px; border-radius: 50%; background: #fff; background: rgba(255,255,255,0.7);  color: #311c77; text-decoration: none; line-height: 0; font-size: 25px; vertical-align: middle; transition: all 0.2s;  }
.footer-socials div a:hover {transform:scale(1.1); background: #fff;}
.footer-socials div a.fa-facebook:before{position: absolute; right: 7px; bottom: 13px; font-size: 32px; }


/* Content areas */
.content-image img {width: 100%!important}

/* Cookie banner */
.cookie-container {position: fixed; display:none;  top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.6); z-index: 10; }
.cookie-container .cookie-banner { position: absolute;  width: 100%; bottom: 0; left: 0; background-color: var(--cinch-white); box-shadow: 0px 0px 50px rgba(0, 0, 0, 0.9);}
.cookie-container .cookie-banner .inner {margin: 30px auto; padding: 0 30px; width: 100%; max-width: 1080px; display: flex;  align-items: center;  }
.cookie-container .cookie-banner .inner .text { width: 65%; flex-grow: 1; padding-right: 90px; font-size: 16px!important; }
.cookie-container .cookie-banner .inner .text a {color: var(--cinch-blue)}
.cookie-container .cookie-banner .inner .buttons { width: 35%; flex-grow: 1; max-width: 300px;  }
.cookie-container .cookie-banner .inner .buttons .button-container {position: relative; width: 100%;  margin:20px 0 0 0;  text-align: center}

@media screen and (max-width:900px) {
.cookie-container .cookie-banner .inner { display: block; }
.cookie-container .cookie-banner .inner .text { width: 100%!important; padding-right: 0px; }
.cookie-container .cookie-banner .inner .buttons { width: 100%!important; max-width: 1000px;  }
}


/* Modal */

.cookie-modal { position: fixed; display: none; width: 100%; height: 100%; left: 0; top: 0; background: rgba(0, 0, 0, 0.3); z-index: 200; cursor: pointer; align-items: center; justify-content: center}
.cookie-modal .inner { position: absolute; width: calc(100% - 40px); max-width: 535px; cursor: default;  box-sizing: border-box; background-color: var(--cinch-white); border-radius: 20px;  }
.cookie-modal .inner .modal-header {position: relative; padding: 20px 40px 20px 20px; border-bottom: 1px solid #ddd; color: var(--cinch-purple-dark); font-weight: 700;}
.cookie-modal .inner .modal-header .close-button {position: absolute; top: 50%; right: 20px; width: 35px; height: 35px; margin-top: -17px; border: 2px solid var(--cinch-aqua); background: var(--cinch-purple-dark); border-radius: 50%; }
.cookie-modal .inner .modal-header .close-button:before {content: ""; position: absolute;  top: 15px; left: 5px; width: 21px; height: 1px; background: #fff; transform: rotate(45deg); opacity: 0.7;}
.cookie-modal .inner .modal-header .close-button:after {content: ""; position: absolute; top: 15px; left: 5px; width: 21px; height: 1px; background: #fff; transform: rotate(-45deg); opacity: 0.7;}
.cookie-modal .inner .scrollable {overflow-y: auto; padding: 0 20px; font-size: 16px; max-height: calc(100vh - 200px);  }
.cookie-modal .inner .scrollable:before {content: ""; position: relative; display:block; margin-bottom: 20px; padding-top: 1px; }
.cookie-modal .inner .scrollable::after {content: ""; position: relative; display:block; margin-top: 20px; padding-bottom: 1px; }
.cookie-modal .inner .scrollable > div {margin: 20px 0;}
.cookie-modal .inner .scrollable > div .title {display:flex; align-items: center; font-weight: bold; }
.cookie-modal .inner .scrollable > div .title .check {display:block; width: 30px; height: 30px; margin-right: 10px; border: 1px solid #aaa; border-radius: 5px; cursor: pointer;}
.cookie-modal .inner .scrollable > div .title .check.checked {position: relative; border: 2px solid var(--cinch-purple-dark);}
.cookie-modal .inner .scrollable > div .title .check.checked:after {content: ""; position: absolute; left: 50%; top: 50%; width: 20px; height: 10px; margin-left: -10px; margin-top: -8px; border-left: 2px solid var(--cinch-purple-dark); border-bottom: 2px solid var(--cinch-purple-dark); transform: rotate(-45deg); }
.cookie-modal .inner .scrollable > div p {margin-top: 5px; }
.cookie-modal .inner .scrollable > div .title .compulsory {position:relative; display:block; width: 30px; height: 30px; margin-right: 10px; border: 1px solid #bbb; background-color: #bbbbbb; border-radius: 5px;}
.cookie-modal .inner .scrollable > div .title .compulsory:after {content: ""; position: absolute; left: 50%; top: 50%; width: 20px; height: 10px; margin-left: -10px; margin-top: -8px; border-left: 2px solid #EEEEEE; border-bottom: 2px solid #EEEEEE; transform: rotate(-45deg); }
.cookie-modal .inner .modal-footer {padding: 0px 20px; border-top: 1px solid #ddd; }

.faqs { position: relative; margin: 0 auto; width: 100%; max-width: 740px; padding: 0 20px;  }
.faqs .faq { margin: 20px 0; padding-bottom: 20px; border-bottom: 1px solid #e8e8e8; text-align: left; font-family: 'Buenos Aires Regular', sans-serif; }
.faqs .faq:last-child { border-bottom: none; }
.faqs .faq > a { display: block; position: relative; text-decoration: none; padding-right: 40px; color: #000; font-weight: 700; font-size: 1em; }
.faqs .faq > div { position: relative; height: 0; overflow: hidden; color: #222; font-size: 0.9em; font-family: 'Buenos Aires Regular', sans-serif; }
.faqs .faq > div > div { position: absolute; bottom: 0; width: 100%; }
.faqs .faq > div > div:before { content: ""; display: block; padding-top: 1px; margin-bottom: 10px; }
.faqs .faq > div > div:after { content: ""; display: block; padding-bottom: 1px; margin-top: 10px; }
.faqs .faq > a i { position: absolute; right: 0; top: 50%; width: 12px; height: 12px; border-right: 3px solid #57e8fc; border-bottom: 3px solid #57e8fc; margin-left: -10px; margin-top: -6px; transform: rotate(-45deg); }
.faqs .faq.open > a i {margin-left: -10px; margin-top: -6px; transform: rotate(45deg);  }
.faqs .faq.open > div { height: auto; }
.faqs .faq.open > div > div { position: relative; }


footer .socials_new {margin: 40px 0; }
footer .socials_new a {position: relative; display:inline-block; width: 40px; padding: 20px 0; margin: 0 10px; text-decoration: none; line-height: 0; font-size: 25px; vertical-align: middle; transition: all 0.2s;  }
footer .socials_new a.socials-facebook {background: url(/templates/images/Facebook_White.svg) no-repeat center; background-size: contain;}
footer .socials_new a.socials-x {background: url(/templates/images/X_White.svg) no-repeat center; background-size: contain;}
footer .socials_new a.socials-instagram {background: url(/templates/images/Instagram_White.svg) no-repeat center; background-size: contain;}
footer .socials_new a.socials-tiktok {background: url(/templates/images/TikTok_White.svg) no-repeat center; background-size: contain;}
footer .socials_new a.socials-youtube {background: url(/templates/images/YouTube_White.svg) no-repeat center; background-size: contain;}
footer .socials_new a:hover {transform:scale(1.1); fill: rgba(255,255,255,0.7);}

@media screen and (max-width: 400px) {
	footer .socials_new a {margin: 0 5px;}
}