/*
----------------------------------------------------
VARIABLE DECLARATIONS
----------------------------------------------------
*/
:root {
	--color_core_blue: #2158ED;
	--color_core_violet: #630979;
	--color_cherry: #F21346;
	--color_dark_cherry: #A80F32;
	--color_light_blue: #9AE4FF;
	--color_middle_blue: #21B6ED;

	--font_family_light: 'Neuzeit-Grotesk-Light', sans-serif;
	--font_family_regular: 'Neuzeit-Grotesk-Regular', sans-serif;
	--font_family_bold: 'Neuzeit-Grotesk-Bold', sans-serif;
	--font_family_black: 'Neuzeit-Grotesk-Black', sans-serif;
	--font_family_condensed_black: 'Neuzeit-Grotesk-Extra-Condensed-Black', sans-serif;
	
}

/*
----------------------------------------------------
NATIVE ELEMENTS
----------------------------------------------------
*/
html {
	background: #111;
}
body {
	padding-top:60px;
	background-color:#f8f8f8 !important;
	color:#111 !important;
	font-family: var(--font_family_regular);
	font-size: 17px;
	}

h1 {
	font-family: var(--font_family_light);
	font-size: 65px;
	line-height: 1;
	margin-bottom: 1rem;
	}
h2 {
	font-family: var(--font_family_bold);
	font-size: 30px;
	margin-bottom: 2rem;
	}
h3 {
	font-family: var(--font_family_regular);
	font-size: 24px;
	}
li {
	font-family: var(--font_family_bold);
	font-size: 16px;
	}

/*
----------------------------------------------------
CTAs
----------------------------------------------------
*/
a {
	color: var(--color_core_blue);
}
.btn {
	border-radius: 2rem;
	font-family: var(--font_family_black);
	text-transform: uppercase;
	padding: 0.5rem 1.5rem;
	border-width: 2px;
}
.btn_red {
	color: #fff;
	background-color: var(--color_cherry);
	border-color: var(--color_cherry);
}
.btn_red:hover {
	color: #fff;
	background-color: var(--color_dark_cherry);
	border-color: var(--color_dark_cherry);
}
.btn_red.hollow {
	color: var(--color_cherry);
	background-color: #fff;
	border-color: var(--color_cherry);
}
.btn_red.hollow:hover {
	color: #fff;
	background-color: var(--color_dark_cherry);
	border-color: var(--color_dark_cherry);
}
.btn_blue {
	color: #000;
	background-color: var(--color_light_blue);
	border-color: var(--color_light_blue);
}
.btn_blue:hover {
	color: #fff;
	background-color: var(--color_middle_blue);
	border-color: var(--color_middle_blue);
}

/*
----------------------------------------------------
NAV
----------------------------------------------------
*/
nav .navbar-brand {max-width:140px;}
nav .navbar-nav .nav-link {
	color:#111;
	text-decoration:none;
	padding-left: 1.5rem;
	padding-right: 1.5rem;
	}
nav .navbar-nav .nav-item .btn {
	margin-left: 1rem;
}
.navbar-toggler,
.navbar-toggler i {
	color: #000;
}

/*
----------------------------------------------------
FORMS
----------------------------------------------------
*/
.form_error {
	margin-top: 0.5rem;
	font-family: var(--font_family_bold);
}

/*
----------------------------------------------------
HOMEPAGE SECTIONS
----------------------------------------------------
*/
.ribbons {z-index:10;}
img.curve-1 {width:100%;} 

.home.section_1 h1 {color:#fff;} 
.home.section_1 p {
	color:#fff;
	line-height: 1.25;
	} 
.sections {
	position:relative;
	width:100%;
	padding:3rem 2rem; 
	color:#111;
	}

.sections.disappear {
	opacity: 0;
	transform: translateY(50px);
	}

.sections.appear {
	opacity: 1;
	transform: translateY(0);
	transition: transform 1000ms,opacity 1000ms;
	}
.inner_container {
	position: relative;
}
.home.section_1 {
	position:relative;
	width:100%;
	background: var(--color_core_blue);
	background: linear-gradient(180deg, var(--color_core_blue) 0%, var(--color_core_violet) 100%);
	color:#fff;
	height:98vh;
	min-height: 800px;
	max-height: 900px;
	overflow: hidden;
	} 
.home.section_1 img.ribbon-1 {
	position:absolute;
	top:0;
	width: 120%;
	left: -2rem;
	} 
.home.section_1 img.screenshot-1 {

	} 
.home.section_1 div.row {
	position:absolute;
	top:3rem;
	padding:2rem;
	z-index:20;
	max-width: 1500px;
	left: 50%;
	transform: translateX(-50%);
	width: 100%;
	} 
.home.section_1 div.align-items-center>div:first-child {
	padding: 8rem 3rem 8rem 2rem;
	} 
.home.section_1 img.curve-1 {
	position:absolute;
	bottom:0;
	left:0; 
	width:100%;
	z-index:20;
	} 
img.curve-2 {
	width:100%;
	margin:0; 
	padding:0; 
	vertical-align: top
	} 
.home.section_2 {
	padding:4rem 2rem; 
	background-color: #fff;
	text-align:center;
	} 
.home.section_2 .webticker_container {
	margin-left: -32px;
	margin-right: -32px;
}
.home.section_3 {
	overflow: hidden;
	} 
.home.section_3 .text-container {
	padding-right: 5rem;
}
.home.section_3 .colorwheel {
	position: absolute;
	z-index: -1;
	width: 80vw;
	right: -20vw;
	top: -10vh;
	} 
.home.section_4 {
	background-color: #fff;
	padding: 7rem 2rem;
	} 
.home.section_4 .text-container {
	padding-left: 5rem;
}
.home.section_5 {
	background-color: #f8f8f8;
	padding: 7rem 2rem;
	} 
.home.section_5 .text-container {
	padding-left: 5rem;
}
.home.section_6 {
	background-color: #fff;
	text-align:center;
	} 
.home.section_6 .inner_container {
	padding: 0 6rem;
}
.home.section_6 p {
	padding: 0 6rem;
}
.home.section_6 .icon_value img {
	width: 100px;
}
.home.section_6 .icon_label {
	margin-top: 1rem;
	font-family: var(--font_family_bold);
	font-size: 16px;
	text-transform: uppercase;
}
.home.section_7 {
	background-color: #f8f8f8;
	padding: 7rem 0;
	text-align:center;
	overflow: hidden;
	} 
.home.section_7 .ribbon_2_container {
	background: url('/assets/public/ribbon-2.png');
	background-size: cover;
	background-position: center;
	position: absolute;
	height: 430px;
	width: 101%;
	left: 0;
	top: 33%;
	z-index: 1;
}
.home.section_7 h1 {
	padding-left:1rem; 
	padding-right:1rem; 
	font-size:56px;
	}
.home.section_7 .carousel_item .testimonial_screnshot {
	box-shadow: 0 0 8px 8px rgb(50 50 50 / 10%);
	border-radius: 22px;
	padding: 0;
	}
.home.section_7 .testimonial_container {
	position: relative;
	}
.home.section_7 .testimonial_container .testimonial_text_container {
	border-radius: 10px;
	width: 90%;
	margin: -2rem auto 0;
	background: #fff;
	z-index: -1;
	padding: 4rem 3rem 1rem;
	box-shadow: 0 0 8px 8px rgb(50 50 50 / 10%);
	}
.home.section_7 .testimonial_container .testimonial_client_name {
	font-family: var(--font_family_bold);
	margin-bottom: 0;
	}
.home.section_7 .testimonial_container .testimonial_client_logo {
	text-align: center;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	top: -85px;
	background: #fff;
	border-radius: 70px;
	padding: 5px;
	}
.home.section_7 .testimonial_container .testimonial_client_logo img {
	display: inline-block;
	width: 100px;
	}
.home.section_8 {
	text-align:center;
	background: transparent url("/assets/public/soccer-field-bg.jpg") no-repeat; 
	background-size: cover;
	background-position: center;
	color: #fff;
	padding: 10rem;
	} 
.home.section_8 .col-12 {
	max-width: 800px;
	margin: 0 auto;
}
.home.section_8 h1 {
	max-width: 500px;
	margin: 0 auto;
}
.home.section_8_a {
	padding: 2rem 2rem 0;
}
.home.section_8_a .col-6 {
	padding: 2rem 0;
}
.home.section_8 .stat_value,
.home.section_8 .stat_label {
	color: #fff;
}
.home.section_8 .stat_value {
	font-size: 55px;
	font-family: var(--font_family_condensed_black);
	line-height: 65px;
}
.home.section_8 .stat_label {
	font-size: 18px;
	font-family: var(--font_family_bold);
	text-transform: uppercase;
}
.home.section_8_b {
	padding-top: 1rem;
	padding-bottom: 5rem;
}
.home.section_8_b .col-6 {
	padding-top: 0;
}
.home.section_8_b img.inc {
	width: 150px;
}
.home.section_8_b img.stars {
	width: 150px;
}
.home.section_9 {
	background: var(--color_core_blue);
	background: linear-gradient(180deg, var(--color_core_blue) 0%, var(--color_core_violet) 100%);
	color:#fff;
	} 
.home.section_9 div.align-items-center>div:first-child {
	padding:8rem 4rem;
	} 
.home.section_9 .inline_container a {
	display: inline-block;
	vertical-align: top;
}
#footer {
	background: #101010;
	color: #fff;
}


/*
----------------------------------------------------
CONTACT SECTIONS
----------------------------------------------------
*/

.contact.section_1 {
	background: var(--color_core_blue);
	background: linear-gradient(180deg, var(--color_core_blue) 0%, var(--color_core_violet) 100%);
}
.contact.sections.section_1 h1,
.contact.sections.section_1 label {color:#fff;} 
.contact.sections.section_1 p {
	color:#fff;
	line-height: 1.25;
	} 
.contact .std_page_container {
	padding-top: 2rem;
}
.contact .inner_container {
	max-width: 600px;
}
.contact a {
	color: #fff;
}

/*
----------------------------------------------------
LOGIN SECTIONS
----------------------------------------------------
*/

.login .info_container {
	width: 80%;
	margin: 0 auto;
	border-radius: 10px;
	background: #fff;
	padding: 1rem 2rem 0.5rem;
	margin-bottom: 2rem;
	text-align: center;
}
.login .info_container h2 {
	color: #111;
	margin-bottom: 0.5rem;
}
.login .info_container h3 {
	color: #444;
}
.login.section_1 {
	background: var(--color_core_blue);
	background: linear-gradient(180deg, var(--color_core_blue) 0%, var(--color_core_violet) 100%);
}
.login.sections.section_1 h1,
.login.sections.section_1 label,
.login.sections.section_1 ul {color:#fff;} 
.login.sections.section_1 li {font-family: var(--font_family_regular);}
.login.sections.section_1 p {
	color:#fff;
	line-height: 1.25;
	} 
.login .std_page_container {
	padding-top: 2rem;
}
.login .inner_container {
	max-width: 600px;
}
.login a {
	color: #fff;
}

/*
----------------------------------------------------
RESPONSIVE
----------------------------------------------------
*/
@media (max-width: 768px) {
	.home.section_1 div.align-items-center>div:first-child {
		padding-bottom: 4rem;
	}
	.home.section_8 h1 {
		padding-top: 4rem;
		}
	.home.section_8 .stat_value {
		font-size: 36px;
		}
	.home.section_6 .inner_container,
	.home.section_6 p {
		padding: 0;
	}
	.home.section_6_a {
		padding: 2rem;
	}
	.contact .inner_container {
	    padding: 0;
	}
}

@media (max-width: 991px) {
	.home.section_1 {
		height:60vh;
		min-height: auto;
		max-height: auto;
		}
	.home.section_1 div.row {
		top:2rem;
		left: 0;
		max-width: auto;
		transform: none;
		} 
	.home.section_1 img.ribbon-1 {
		top:3rem;
		} 
	.home.section_1 h1, 
	.home.section_3 h1, 
	.home.section_7 h1, 
	.home.section_9 h1 {
		font-size:48px;
		}
	.home.section_3 h1 {
		padding-bottom:1.5rem;
		}
	.home.section_7 h1 {
		padding-left:1rem; 
		padding-right:1rem; 
		font-size:42px;
		}
	.home.section_1 div.align-items-center>div:first-child, 
	.home.section_9 div.align-items-center>div:first-child, 
	.home.section_9 div.align-items-center>div:last-child {
		padding-top:2rem;
		}
	.home.section_1 div.row>div:last-child, 
	.home.section_3 div.row>div:last-child img.screenshot-2 {
		} 
	.home.section_3 .colorwheel {
		height: 180vw;
		right: -56vw;
		top: -14vh;
		opacity:0.9;
		} 

	.home.section_4, 
	.home.section_5, 
	.home.section_7, 
	.home.section_9 {
		padding:2rem;
		} 
	.home.section_4 .text-container, 
	.home.section_5 .text-container {
		padding-top:2rem;
		padding-left: 0;
	}
	.home.section_7 .ribbon_2_container {
		top: 30%;
	}
	.home.section_9  {
		text-align:center;
		} 
}


@media (max-width: 767px) {
	nav .navbar-nav .nav-item .btn {
		margin: 1rem 0 0;
	}
	.public_site .sections {
		padding:2rem; 
		} 
	.home.section_1 {
		height:70vh;
		min-height: auto;
		max-height: auto;
		}
	.home.section_1 div.row {
		top:0;
		left: 0;
		max-width: auto;
		transform: none;
		} 
	.home.section_1 img.ribbon-1 {
		top:auto;
		bottom:8rem;
		} 
	.home.section_1 h1, 
	.home.section_3 h1, 
	.home.section_7 h1, 
	.home.section_9 h1 {
		font-size:48px;
		}
	.home.section_3 h1 {
		padding-bottom:1.5rem;
		}
	.home.section_7 h1 {
		padding-left:1rem; 
		padding-right:1rem; 
		}
	.home.section_1 div.align-items-center>div:first-child, 
	.home.section_9 div.align-items-center>div:first-child, 
	.home.section_9 div.align-items-center>div:last-child {
		padding-top:2rem;
		}
	.home.section_1 div.row>div:last-child, 
	.home.section_3 div.row>div:last-child img.screenshot-2 {
		} 
	.home.section_3 .colorwheel {
		height: 180vw;
		right: -56vw;
		top: -14vh;
		opacity:0.9;
		} 

	.home.section_4, 
	.home.section_5, 
	.home.section_7, 
	.home.section_9 {
		padding:2rem;
		} 
	.home.section_4 .text-container, 
	.home.section_5 .text-container {
		padding-top:2rem;
		padding-left: 0;
	}
	.home.section_7 .ribbon_2_container {
		top: 18%
	}
	.home.section_8_a,
	.home.section_8_b {
		padding: 0 2rem;
		max-width: 70%;
		margin: 0 auto
	}
	.home.section_8_b {
		padding-bottom: 5rem;
	}
	.home.section_8_b .inc_container {
		padding-right: 2rem;
		}
	.home.section_8_b img.inc {
		width: 100px;
		}
	.home.section_8_b .stars_container {
		padding-left: 1rem;
		}
	.home.section_9  {
		text-align:center;
		} 
	.home.section_9 div.align-items-center>div:first-child {
		padding-bottom: 3rem;
	}
	.home.section_9 .inline_container a {
		width: 100%;
	}
}

@media (max-width: 767px) {
	.home.section_8_a,
	.home.section_8_b {
		max-width: 100%;
	}
}



@media (max-width: 420px) {
	.home.section_1 {
		height:auto;
		min-height: 90vh;
		max-height: auto;
		}
	.home.section_1 div.row {
		top:0;
		left: 0;
		max-width: auto;
		padding:3rem 1rem 1rem; 
		transform: none;
		} 
	.home.section_1 img.ribbon-1 {
		top:auto;
		bottom:5rem;
		} 
	.home.section_1 h1, 
	.home.section_3 h1, 
	.home.section_7 h1, 
	.home.section_9 h1 {
		font-size:42px;
		}
	.home.section_7 h1, 
	.home.section_8 h1 {
		padding-left:1rem; 
		padding-right:1rem; 
		}
	.home.section_1 div.align-items-center>div:first-child, 
	.home.section_9 div.align-items-center>div:first-child, 
	.home.section_9 div.align-items-center>div:last-child {
		padding-top:2rem;
		}
	.home.section_8 h1 {
		font-size:48px;
		padding-top: 2rem;
		}
	.home.section_1 div.row>div:last-child {
		display:none; 
		} 
	.home.section_3 .colorwheel {
		height: 180vw;
		right: -56vw;
		top: -14vh;
		opacity:0.9;
		} 
	.home.section_3 .text-container {
		padding-right: 0;
	}
	.home.section_4, 
	.home.section_5, 
	.home.section_7, 
	.home.section_9  {
		padding:2rem;
		} 
	.home.section_4 .text-container, 
	.home.section_5 .text-container {
		padding-top:2rem;
		padding-left: 0;
	}
	.home.section_7 .ribbon_2_container {
		top: 20%;
	}
	.home.section_8_a {
		padding: 1rem 1rem 0;
	}
	.home.section_8_b {
		padding: 0 1rem 4rem;
	}
	.home.section_8_b img.stars {
		width: 130px;
	}
	.home.section_8_a .col-6 {
		padding: 1rem 0;
	}
	.home.section_9  {
		text-align:center;
		} 
	.login .info_container {
		width: 95%;
	}
}

@media (max-width: 400px) {
	.home.section_1 img.ribbon-1 {
		bottom:3rem;
		} 
	}



/*
----------------------------------------------------
CAROUSELS
----------------------------------------------------
*/
#webTicker img {
	height: 125px;
	}

.carousel-indicators {
	margin-bottom: 0;
}
.carousel-indicators [data-bs-target] {
	width: 10px;
	height: 10px;
	border: 2px solid #000;
	border-radius: 7px;
}
.carousel-indicators .active {
	background-color: var(--color_cherry);
}


/* SLICK CAROUSEL */
.carousel_container_parent {
	padding: 2rem 0 4rem;
}
.carousel_container {
	padding-top: 3em;
	max-width: 1000px;
	margin: 0 auto;
	z-index: 99;
	}
.carousel_item {
	transition: opacity 0.3s;
	-webkit-transition: opacity 0.3s;
	opacity: 0.4;
	margin: 0 3rem;
}
.carousel_item.slick-current {
	opacity: 1;
}
.slick-list {
	overflow: visible !important;
}
.slick-prev,
.slick-next {
	z-index: 99;
}
.slick-prev {
    left: 4px !important;
}
.slick-next {
	right: 10px !important;
}
.slick-prev:before,
.slick-next:before {
	display: none;
}
.slick-prev img,
.slick-next img {
	position: absolute;
	width: 50px;
	top: -15px;
	left: -12px;
}
.slick-dots {
	bottom: -50px !important;
}
.slick-dots li button {
	width: 15px !important;
	height: 15px !important;
	padding: 0 !important;
	border: 2px solid #000 !important;
	border-radius: 8px !important;
}
.slick-dots li button:before {
	display: none;
}
.slick-dots li.slick-active button {
	background-color: var(--color_cherry);
}

@media (max-width: 768px) {
.carousel_item {
	margin: 0 1rem;
	font-size:14px;
	}
}

@media (max-width: 420px) {
	.slick-prev {
		left: -1px !important;
	}
	.slick-next {
		right: 5px !important;
	}
}