@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap');

/* Backgrounds */
.bg-dark {background:#000!important;color:#fff!important;}
.bg-light {background:#f4f4f4!important;}
.bg-primary {background: #00FFFF!important;}
.bg-secondary {background: #00FFC2!important;}
.bg-iop {background-image: url("../images/bg-iop.jpg")!important; background-position: center; background-size: cover;color:#fff!important;}
.bg-spredapp {background-image: url("../images/body_bg.png")!important; background-position: center; background-size: cover;}
.bg-howitworks {background-image: url("../images/howitworks.jpg")!important; background-position: center; background-size: cover;}

/* Margins */
.mt-5 {margin-top: 2rem!important;}
.mt-6 {margin-top: 4rem!important;}
.mt-7 {margin-top: 8rem!important;}
.mt-8 {margin-top: 10rem!important;}

.mb-5 {margin-bottom: 2rem!important;}
.mb-6 {margin-bottom: 4rem!important;}
.mb-7 {margin-bottom: 8rem!important;}
.mb-8 {margin-bottom: 10rem!important;}

.ms-5 {margin-left: 2rem!important;}
.ms-6 {margin-left: 4rem!important;}
.ms-7 {margin-left: 8rem!important;}
.ms-8 {margin-left: 10rem!important;}

.me-5 {margin-right: 2rem!important;}
.me-6 {margin-right: 4rem!important;}
.me-7 {margin-right: 8rem!important;}
.me-8 {margin-right: 10rem!important;}

/* Paddings */
.pt-5 {padding-top: 2rem!important;}
.pt-6 {padding-top: 4rem!important;}
.pt-7 {padding-top: 8rem!important;}
.pt-8 {padding-top: 10rem!important;}

.pb-5 {padding-bottom: 2rem!important;}
.pb-6 {padding-bottom: 4rem!important;}
.pb-7 {padding-bottom: 6rem!important;}
.pb-8 {padding-bottom: 10rem!important;}
.pb-m {margin-bottom: -9rem!important;}

.ps-5 {padding-left: 2rem!important;}
.ps-6 {padding-left: 4rem!important;}
.ps-7 {padding-left: 8rem!important;}
.ps-8 {padding-left: 10rem!important;}

.pe-5 {padding-right: 2rem!important;}
.pe-6 {padding-right: 4rem!important;}
.pe-7 {padding-right: 8rem!important;}
.pe-8 {padding-right: 10rem!important;}

/* Gutters */
.gx-1 [class*="col-"] {padding-left:1px!important;padding-right:1px!important;}
.gx-2 [class*="col-"] {padding-left:2px!important;padding-right:2px!important;}
.gx-3 [class*="col-"] {padding-left:6px!important;padding-right:6px!important;}
.gx-4 [class*="col-"] {padding-left:8px!important;padding-right:8px!important;}
.gx-5 [class*="col-"] {padding-left:10px!important;padding-right:10px!important;}
.gx-1 [class*="col-"]:first-child,
.gx-2 [class*="col-"]:first-child,
.gx-3 [class*="col-"]:first-child,
.gx-4 [class*="col-"]:first-child,
.gx-5 [class*="col-"]:first-child {padding-left: 16px!important;}
.gx-1 [class*="col-"]:last-child,
.gx-2 [class*="col-"]:last-child,
.gx-3 [class*="col-"]:last-child,
.gx-4 [class*="col-"]:last-child,
.gx-5 [class*="col-"]:last-child {padding-right: 16px!important;}

/* Custom grids */
.grid {display:grid;grid-column-gap:24px;grid-row-gap:24px;}
.grid.gx-1 {grid-column-gap:2px;grid-row-gap:2px;}
.grid.gx-2 {grid-column-gap:4px;grid-row-gap:4px;}
.grid.gx-3 {grid-column-gap:8px;grid-row-gap:8px;}
.grid.gx-4 {grid-column-gap:16px;grid-row-gap:16px;}
.grid.gx-5 {grid-column-gap:36px;grid-row-gap:36px;}
.grid .grid-col {display:table-cell;height:100%;width:100%;}
.grid .grid-col.px-0 {padding-left:0!important;padding-right:0!important;}
.grid .grid-col.cols-2 {grid-column: span 2;}
.grid .grid-col.cols-3 {grid-column: span 3;}
.grid .grid-col.cols-4 {grid-column: span 4;}
.grid .grid-col.cols-5 {grid-column: span 5;}
.grid .grid-col.cols-6 {grid-column: span 6;}
.grid .grid-col.cols-7 {grid-column: span 7;}
.grid .grid-col.cols-8 {grid-column: span 8;}
.grid-cols-2 {grid-template-columns:repeat(2, 1fr);}
.grid-cols-3 {grid-template-columns:repeat(3, 1fr);}
.grid-cols-4 {grid-template-columns:repeat(4, 1fr);}
.grid-cols-5 {grid-template-columns:repeat(5, 1fr);}
.grid-cols-6 {grid-template-columns:repeat(6, 1fr);}
.grid-cols-7 {grid-template-columns:repeat(7, 1fr);}
.grid-cols-8 {grid-template-columns:repeat(8, 1fr);}
.grid-cols-9 {grid-template-columns:repeat(9, 1fr);}
.grid-cols-10 {grid-template-columns:repeat(10, 1fr);}
.grid-cols-11 {grid-template-columns:repeat(11, 1fr);}
.grid-cols-12 {grid-template-columns:repeat(12, 1fr);}

/* Text */
h1, h2, h3, h4, h5, h6 {font-weight:700!important;margin-top:0!important;}
h1, .h1 {font-size:64px;letter-spacing: -3.4px;}
h2, .h2 {font-size:44px;letter-spacing: -0.4px;}

.align-center {text-align:center;}
.align-left {text-align:left;}
.align-right {text-align:right;}

.fs-xsmall {font-size:var(--fs-xsmall)!important;line-height: calc(var(--fs-xsmall) + 5px)!important;}
.fs-small {font-size: var(--fs-small)!important;line-height: calc(var(--fs-small) + 8px)!important;}
.fs-medium {font-size:var(--fs-medium)!important;line-height: calc(var(--fs-medium) + 8px)!important;}
.fs-large {font-size:var(--fs-large)!important;line-height: calc(var(--fs-large) + 8px)!important;}
.fs-xlarge {font-size:var(--fs-xlarge)!important;line-height: calc(var(--fs-xlarge) + 8px)!important;}

.fw-light {font-weight:400!important;}
.fw-normal {font-weight:500!important;}
.fw-bold {font-weight:700!important;}

.text-strike {text-decoration: line-through!important; text-decoration-thickness: from-font!important;}
.text-justify {text-align: justify!important;}

/* Buttons */
.btn {
	position: relative!important;
	font-weight: 700!important;
	text-transform: uppercase;
	letter-spacing:1.3px;
	font-size:14px;
	padding:.8rem 2rem .75rem;
	border-radius:3px;
	-webkit-border-radius:3px;
}
.btn:hover,
.btn:focus,
.btn:active {text-decoration: none!important;}
.btn-primary,
.btn-primary.btn-spinner,
.btn-primary.btn-spinner:hover {background-color:#00ffc2!important;border-color:#00ffc2!important;color:#000!important;}
.btn-secondary {background-color: #00ffff!important; border-color: #00ffff!important; color: #000!important;}
.btn-secondary {background-color: #00ffff!important; border-color: #00ffff!important; color: #000!important;}
.btn-primary:hover,
.btn-primary:active,
.btn-primary:focus,
.btn-secondary:hover,
.btn-secondary:active,
.btn-secondary:focus {background-color:#000!important;border-color:#000!important;color:#fff!important;}
.btn-nav {padding:.5rem 2rem .5rem;margin-left: 1.5rem;border-radius:3px;-webkit-border-radius:3px;line-height:24px!important;letter-spacing: initial!important;}
.btn-head {background-color:#000!important;border-color:#000!important;color:#fff!important;}
.btn-head:hover {background-color: #00ffc2!important; border-color: #00ffc2!important; color: #000!important;}


a {color:#019B9B!important;text-decoration: none;}
a:hover {text-decoration: underline;}

/* Sections */
html {
	position: relative;
	min-height: 100%;
	font-size:18px!important;
	line-height: 26px!important;
	-webkit-font-smoothing: antialiased!important;
	-moz-osx-font-smoothing: grayscale!important;
	color:var(--bs-dark-900)!important;
	letter-spacing: -0.03rem;
	/*letter-spacing: -0.85px;*/

	--fs-xsmall: 13px;
	--fs-small: 18px; /* Root default size. */
	--fs-medium: 18px;
	--fs-large: 23px;
	--fs-xlarge: 28px;
	--fs-xlarge-vw: 4.87vw;
}

body {
	font-family: 'Helvetica', sans-serif!important;
	font-weight:400;
}

.content-wrapper {
	margin-bottom: 510px;
}

.nav-link {font-size: 16px; color: black!important; padding-left: 1.3rem; padding-right: 1.3rem; /*color:#8D96A7!important;*/}

header {height: 80px; position: fixed; z-index: 10; top: 0; width: 100%;}
header #menu-mobile {display: none;}
header #menu-desktop {display: flex; align-items: center;}

.header-bg {
	background-color: white;
}

.header-bg-scrolled {
	background-color: #fffffff1;
	border-bottom: #fffffff1 1px solid;
}

footer {position: absolute; bottom: 0; left: 0; right: 0; height: 510px;}
footer .container:first-child {padding:3rem 0 5rem 0;border-top: 2px solid #e5e5e5;border-bottom: 2px solid #e5e5e5;}
footer .social i {font-size: 18px;}
footer .social i:first-child {margin-left: 0.1rem;}
footer ul, li {list-style: none;padding:0;margin:0;}
footer ul li {margin-bottom:.5rem;}
footer a {color:#fff!important; }
footer ul li a {opacity: 85%;}
footer #footer-spred-logo {max-width: 230px;}
footer .grid:last-child .grid-col:not(:first-child) {padding-left: 17%;}

.waitlist-input-section {color: #575757;}
.waitlist-input-section label {font-size: 0.9rem;}
.waitlist-input-section label a {color: #000 !important;}

input[type=text] {
	width: 100%;
	/*padding: 12px;*/
	padding: 0.61rem;
	border: 1px solid #ccc;
	border-radius: 3px;
	box-sizing: border-box;
	/*margin-top: 6px;*/
	/*margin-bottom: 16px;*/
	resize: vertical;
}
input[type=checkbox] {
	width: 1.2rem;
	height: 1.2rem;
	vertical-align: text-bottom;
	cursor: pointer;
}

#hero h1 {
	font-size:7vh;
	letter-spacing: -1px;
}

#hero p {
	max-width: 90%;
}
#hero .world-img {float: right; max-width:100%; margin-top:-80px;}

#green-phone .img1 {width: 440px; margin: 0 auto;}
#green-phone .img2 {width: 670px; margin: 0 auto;}
#green-phone .bottom-line {margin: 1.1rem auto; width: 50px; height: 2px; background-color: white}

#green-phone h2 { 
	position: relative;
	z-index: 2;
}

#green-phone #h1-iop {
	font-size: 3.4em;
	letter-spacing: 1px;
}

#green-phone .img_payments {
	position: relative;
	width: 350px;
	height: 80px;
	margin-top: -115px;
	z-index: 1;
}

#green-phone #slogan {
	letter-spacing: 1.5px;
	font-size: 20px;
}

#sprednet ul {
    list-style: none;
    padding: 0 0 50px 0;
    width: 95%;
    min-height: 450px;
}
#sprednet ul li:not(:first-of-type) {
    padding-top: 10px;
}
.feature {
    display: flex;
    justify-content: space-between;
    border-bottom: 2px solid black;
    cursor: pointer;
    user-select: none;
}
.feature-answer {
    margin-top: 10px;
    max-height: 500px;
    overflow: hidden;
    transition: height 0.3s, transform 0.3s, opacity 0.3s;
    transform-origin: top;
    height: 0;
}
.answer-hidden {
    opacity: 0;
}
.arrow {
    transition: transform 0.3s;
}
.arrow span {
    display: inline-block;
    vertical-align: middle;
    width: 15px;
    height: 15px;
    border-top: 2px solid #000;
    border-right: 2px solid #000;
    transform: rotate(135deg);
}
.arrow-rotated {
    transform: rotate(-180deg);
}

#process-slider {
	overflow: hidden;
	/*position: relative;*/
	/*overflow: hidden;*/
	/*margin: 60px auto 0 auto;*/
	/*margin: 0 auto;*/
	/*border-radius: 4px;*/
}

.how_it_works_mobile {
	display: none;
}

.regular_spred {
	position: absolute;
	text-align: right;
	margin-top: 88px;
	right:10%;
	z-index: 1;
}

.regular_spred_mobile {
	position: relative;
	text-align: center;
	margin-top: 20px;
	z-index: 1;
}

#switcher_mobile {
	display: none;
}

#switcher_desktop {
	display: block;
}

.slider-br {
	display: none;
}

.switch {
	position: relative;
	display: inline-block;
	width: 60px;
	height: 34px;
}
  
.switch input { 
	opacity: 0;
	width: 0;
	height: 0;
}
  
.switcher {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #ccc;
	-webkit-transition: .4s;
	transition: .4s;
}
  
.switcher:before {
	position: absolute;
	content: "";
	height: 26px;
	width: 26px;
	left: 4px;
	bottom: 4px;
	background-color: white;
	-webkit-transition: .4s;
	transition: .4s;
}
  
input:checked + .switcher {
	background-color: #00ffc2;
}
  
input:focus + .switcher {
	box-shadow: 0 0 1px #ccc;
}
  
input:checked + .switcher:before {
	-webkit-transform: translateX(26px);
	-ms-transform: translateX(26px);
	transform: translateX(26px);
}
  
/* Rounded sliders */
.switcher.round {
	border-radius: 34px;
}
  
.switcher.round:before {
	border-radius: 50%;
}

#slider-h2-regular {
	display: none;
}

#slider-img-desktop-regular {
	display: none;
}

#slider-text-regular {
	display: none;
}

#slider-text-spred h5 {
	font-size: 22px;
}

#process-slider #have-deserve {
	white-space: nowrap; 
	display: inline-block;
	text-align: left;
	width: 300px;
	height: 90px;
	background: url("../images/farba\ niebieska.png") no-repeat -10px -20px;
	background-size: 100% 100%;
}

#process-slider .process-we-have-slide .switch-slide-button {
	position: absolute;
	top: 33%;
	right: -7%;
	width: 110px;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	text-align: center;
	gap: 0.3rem;
}

#process-slider .done-in-just {position: absolute; bottom: 10%; right: 5%; display: flex; flex-direction: column;}

#process-slider .slide-content {
	position: relative;
	width: 1100px;
	height: 660px;
	/*height: 720px;*/
	margin: 0 auto;
}

#slider-img-mobile-regular {
	display: none;
}
#slider-img-mobile-spred {
	display: none;
}

/* #whyspred h2 {font-weight: normal!important;} */
#whyspred1 {
	cursor: pointer;
}

#whyspred2 {
	cursor: pointer;
}

#whyspred3 {
	cursor: pointer;
}

#mobile-why-spred {
	display: none;
}

#whyspred h3 {font-weight: normal!important;}

#sprednet {background-color: #fff;}
#sprednet .grid-col p {max-width: 400px;margin: 0 auto; text-align: justify;}

.features p {
	font-size: 15px;
	text-align: left!important;
}

.features {
	display: none;
}

#map_mobile {
	display: none;
}

.world-img-mobile {display: none; width: 100%; margin-bottom: 20px;}

#grow-your-business .sprednet-icon {display: flex; justify-content: flex-end; align-items: center;}
#grow-your-business img {width: 80%; margin: auto;}
#grow-your-business h2 {max-width: 600px;}
/* #grow-your-business .header-with-paint {max-width: 70%;} */
#grow-your-business #header-with-paint-sprednet {
	padding-left: 40px; 
	height: 100px;
	width: 500px;
	background: url('../images/farba\ zielona\ cropped.png') no-repeat 0px 0; 
	background-size: 100% 100%;
}
#grow-your-business #header-with-paint-spredapp {
	padding-left: 30px; 
	height: 100px; 
	width: 450px; 
	background: url('../images/farba\ niebieska\ cropped.png') no-repeat 0px 0; 
	background-size: 100% 100%;
}
#grow-your-business .say-goodbye img {width: 70%; max-width: 170px;}
#grow-your-business .say-goodbye h3 {max-width: 400px;}

#customermerchant ul li:before {content:"\2714\0020";margin-left:-1.5em; margin-right: 0.4em; font-size: 1.4rem;}
#customermerchant img {width: 350px!important; margin: auto;}
.customermerchant-h2 {
	position: relative;
	z-index: 2;
}
.kreska {
	background: url('../images/kreska.png'); 
	background-position: center; 
	background-size: cover;
	position: absolute;
	left: 500px;
	margin-top:-55px;
	width: 360px; 
	height: 20px;
	z-index: 1;
}

#true-internet-of-value img {width: 430px;}

#join-the-waitlist h5 {font-weight: 800!important;}
#join-the-waitlist p {
	max-width: 525px;
}

#join-the-waitlist #telteltel {
	position: relative;
	max-height: 365px;
}

/*#join-the-waitlist #coming-soon a:first-child {margin-top: 15px;}*/
/*#join-the-waitlist h2 {margin-top: 2rem!important;}*/

@media (max-width: 1199px) {
	#process-slider .slide-content {
		width: 900px;
		height: 540px;
		/*height: 590px;*/
		margin: 0 auto;
	}

	#grow-your-business .sprednet-icon {justify-content: flex-start; padding-top: 50px;}
}

@media (max-width: 991px) {
	.nav-link {
		letter-spacing: -0.05rem;
		padding-left: 0.8rem;
		padding-right: 0.8rem;
	}
	.btn-nav {
		padding-left: 1.5rem;
		padding-right: 1.5rem;
		margin-left: 10px;
	}
	.kreska {
		display: none;
	}
	.regular_spred {
		margin-top: 7px;
	}
	
	.switch {
		width: 35px;
		height: 21px;
	}

	.switcher:before {
		height: 16px;
		width: 16px;
		left: 2px;
		top: 2.5px;
	}

	input:checked + .switcher:before {
		-webkit-transform: translateX(15px);
		-ms-transform: translateX(15px);
		transform: translateX(15px);
	}

	.world-img {display: none;}

	.world-img-mobile {display: block;}

	#green-phone img {width: 500px;}

	#process-slider .slide-content {
		width: 100%;
		height: 500px;
		/*height: 524px;*/
		margin: 0 auto;
	}

	#process-slider .process-we-deserve-slide img {
		vertical-align: bottom;
	}

	#process-slider .process-we-have-slide .switch-slide-button {
		right: -3%;
		top: 30%;
		width: 100px;
	}

	#process-slider .process-we-deserve-slide .switch-slide-button {
		top: 57%;
		left: -3%;
		width: 100px;
	}

	#process-slider .switch-slide-button img {
		width: 100%;
	}

	#process-slider .done-in-just {
		bottom: 5%;
	}

	#sprednet .image img {
		width: 100%;
	}

	#map_mobile {
		display: block;
	}

	#map_desktop {
		display: none;
	}

	.features {
		display: block;
	}
	
	#grow-your-business .payment-instore {text-align: center;}
	#grow-your-business .payment-instore img {width: 80%;}
	#grow-your-business #header-with-paint-spredapp {
		width: 420px;
	}

	#true-internet-of-value img {width: 400px;}
	#true-internet-of-value p {max-width: 650px;}

	#join-the-waitlist #telteltel-mobile {width: 300px;}
}

@media (max-width: 767px) {
	.mt-6 {margin-top: 3rem!important;}
	.mt-7 {margin-top: 4rem!important;}
	.mt-8 {margin-top: 6rem!important;}

	.mb-6 {margin-bottom: 3rem!important;}
	.mb-7 {margin-bottom: 4rem!important;}
	.mb-8 {margin-bottom: 6rem!important;}

	.ms-6 {margin-left: 3rem!important;}
	.ms-7 {margin-left: 4rem!important;}
	.ms-8 {margin-left: 6rem!important;}

	.me-6 {margin-right: 3rem!important;}
	.me-7 {margin-right: 4rem!important;}
	.me-8 {margin-right: 6rem!important;}

	.pt-6 {padding-top: 3rem!important;}
	.pt-7 {padding-top: 4rem!important;}
	.pt-8 {padding-top: 6rem!important;}

	.pb-6 {padding-bottom: 3rem!important;}
	.pb-7 {padding-bottom: 4rem!important;}
	.pb-8 {padding-bottom: 6rem!important;}

	.ps-6 {padding-left: 3rem!important;}
	.ps-7 {padding-left: 4rem!important;}
	.ps-8 {padding-left: 6rem!important;}

	.pe-6 {padding-right: 3rem!important;}
	.pe-7 {padding-right: 4rem!important;}
	.pe-8 {padding-right: 6rem!important;}

	.mt-6 {margin-top: 3rem!important;}
	.mt-7 {margin-top: 4rem!important;}
	.mt-8 {margin-top: 6rem!important;}

	.mb-6 {margin-bottom: 3rem!important;}
	.mb-7 {margin-bottom: 4rem!important;}
	.mb-8 {margin-bottom: 6rem!important;}

	.ms-6 {margin-left: 3rem!important;}
	.ms-7 {margin-left: 4rem!important;}
	.ms-8 {margin-left: 6rem!important;}

	.me-6 {margin-right: 3rem!important;}
	.me-7 {margin-right: 4rem!important;}
	.me-8 {margin-right: 6rem!important;}

	.pt-6 {padding-top: 3rem!important;}
	.pt-7 {padding-top: 4rem!important;}
	.pt-8 {padding-top: 6rem!important;}

	.pb-6 {padding-bottom: 3rem!important;}
	.pb-7 {padding-bottom: 4rem!important;}
	.pb-8 {padding-bottom: 6rem!important;}

	.ps-6 {padding-left: 3rem!important;}
	.ps-7 {padding-left: 4rem!important;}
	.ps-8 {padding-left: 6rem!important;}

	.pe-6 {padding-right: 3rem!important;}
	.pe-7 {padding-right: 4rem!important;}
	.pe-8 {padding-right: 6rem!important;}

	.grid, .grid-col {display: block!important;}
	/*.grid-col,*/
	/*.row [class*="col-"]:not(.form-group) {margin-bottom:4rem;}*/
	/*[class*="col-gx-"] .custom-grid-col {margin-bottom: .5rem!important;}*/
	/*.form-group .row [class*="col-"] {margin-bottom: 0!important;}*/
	/*.form-group .row [class*="col-"] [class*="col-"] {margin-bottom:.5rem!important;}*/

	/*h1, .h1 {font-size:44px;letter-spacing: -2.4px;}*/
	/*h2, .h2 {font-size:32px;letter-spacing: -1.5px;}*/

	/* h1 {font-size: 52px; letter-spacing: -2.8px;} */
	/* h2 {font-size: 32px; letter-spacing: -1.9px;} */

	/* .fs-xlarge{font-size: 24px!important; line-height: 32px!important;}
	.fs-large {font-size: 20px!important; line-height: 28px!important;}
	.fs-medium{font-size: 18px!important; line-height: 26px!important;} */

	/* .container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {padding-right: var(--bs-gutter-x,1.75rem);padding-left: var(--bs-gutter-x,1.75rem);} */

	h3 {font-size: 1.6rem;}
	h5 {font-size: 1.5rem;}

	.btn {
		/* letter-spacing:1.3px; */
		font-size:16px;
	}

	.btn-nav {
		padding: 0.7rem 2rem;
		margin-left: 0;
		margin-top: 1.8rem;
		font-size: 1rem!important;
	}

	html {
		font-size: 16px!important;
		line-height: 24px!important;

		--fs-large: 1.55rem;
		--fs-xlarge: 1.6rem;
		
	}

	/* body {} */

	body {
		font-size: 1.35rem;
		background-color: #fff!important;
	}

	.content-wrapper {margin-bottom: 860px;}

	header .container {justify-content:left!important;position: relative;display: block!important;}
	header .logo {display: block;}
	header .btn-menu {
		display: block;
		width:44px;
		height:44px;
		background:#fff;
		position: absolute;
		top:50%;
		margin-top:-22px;
		right:var(--bs-gutter-x,1.75rem);
		border:1px solid #000;
		border-radius:5px;
		-webkit-border-radius:5px;
	}
	header #showMenu {background:#fff url(../images/menu.svg) no-repeat center;}
	header #closeMenu {background:#fff url(../images/menu_close.svg) no-repeat center;margin-top:20px;top:0;right:var(--bs-gutter-x,2.5rem);}
	header #menu-mobile {display:none;position: fixed;left:0;top:0;right:0;bottom:0;background:#fff;z-index: 1090;}
	header #menu-desktop {display: none;}
	header .menu-mobile-visible {display: block!important;}
	header .menu {display: table;width:100%;height:100%;}
	header .nav {flex-direction:column;align-items: center;display: table-cell;width:100%;height:100%;vertical-align: middle;}
	header .nav li {display: block;width: 100%;text-align: center;}
	header .nav .nav-link {font-size:22px;display: block;padding: 1.5rem 0;letter-spacing: inherit;}

	footer {text-align: center; height: 860px;}
	footer .container:first-child {padding: 3rem var(--bs-gutter-x,1.75rem) 0 !important;}
	footer #footer-spred-logo {max-width: 250px; margin: 0 auto;}
	footer .grid:last-child .grid-col {margin-bottom:3rem!important;}
	footer .grid:last-child .grid-col:not(:first-child) {padding-left: inherit;}
	footer li {font-size: 18px; line-height: 26px;}

	.waitlist-input-section label {font-size: 1.2rem;}

	input[type=checkbox] {
		width: 1.5rem;
		height: 1.5rem;
		vertical-align: text-bottom;
	}

	#process-slider .slide-content {
		width: 100%;
		height: auto;
		margin: 0 auto;
	}

	#process-slider .process-we-deserve-slide img {
		vertical-align: middle;
	}

	#slider-text-spred {
		display: none!important;
	}
	#slider-text-regular {
		display: none!important;
	}
	#slider-img-mobile-regular {
		display: none;
	}
	#slider-img-desktop-spred {
		display: none;
	}
	#slider-img-mobile-spred {
		display: block;
	}

	#green-phone {font-size: 22px; line-height: 30px;}
	#green-phone img {width: 80%;}

	#sprednet .image img {
		width: 250px;
	}
	#sprednet .grid-col:first-of-type {
		margin-top: 1.5rem;
	}
	#sprednet .grid-col:not(:first-of-type) {
		margin-top: 4rem;
	}
	#sprednet .grid-col:last-of-type {
		margin-bottom: 1rem;
	}

	#grow-your-business .sprednet-icon {padding-top: 0; margin-bottom: 20px;}
	#grow-your-business .sprednet-icon img {width: 50%;}
	/* #grow-your-business .header-with-paint {max-width: 100%;} */
	#grow-your-business h2 {max-width: 450px;}
	#grow-your-business #header-with-paint-sprednet {
		padding-left: 40px; 
		height: 100px; 
		width: 400px; 
		background: url('../images/farba\ zielona\ cropped.png') no-repeat 0px 0; 
		background-size: 100% 100%;
	}
	#grow-your-business #header-with-paint-spredapp {
		padding-left: 30px; 
		height: 100px; 
		width: 380px; 
		background: url('../images/farba\ niebieska\ cropped.png') no-repeat 0px 0; 
		background-size: 100% 100%;
	}
	/* #grow-your-business .in-store-payments-text {font-size: 1.25rem!important; line-height: 1.5!important;} */
	#grow-your-business .img-fluid {width: 10rem;}
	#grow-your-business .payment-instore img {width: 90%;}
	#grow-your-business .payment-instore h2 {font-size: var(--fs-xlarge); line-height: calc(var(--fs-xlarge) + 8px);}
	
	#customermerchant img {width: 56px;}
	#customermerchant ul li:before {font-size: 1.5rem;}

	#true-internet-of-value img {width: 400px;}
	#true-internet-of-value p {font-size:var(--fs-large)!important;line-height: calc(var(--fs-large) + 8px)!important;}

	/*#join-the-waitlist img {width: 75%;}*/
	#join-the-waitlist .grid-col {margin-bottom: 0;}

	#join-the-waitlist #coming-soon img:first-child {width: 170px;}
	#join-the-waitlist #coming-soon img:last-child {width: 215px;}
	#join-the-waitlist h2 {margin-top: 0!important;}
	/* #join-the-waitlist p {font-size: 23px!important; line-height: 31px!important;} */
}

#footer-linkedin {
    padding: 7px;
    border-radius: 3px;
}

#footer-linkedin:hover {
    background-color:#0E76A8;
    color: white;
}

#footer-facebook {
    padding: 7px;
    border-radius: 3px;
}

#footer-facebook:hover {
    background-color:#3b5998;
    color: white;
}

#footer-discord {
    padding: 7px 6px;
    border-radius: 3px;
}

#footer-discord:hover {
    background-color:#7289da;
    color: white;
}

#footer-twitter {
    padding: 7px;
    border-radius: 3px;
}

#footer-twitter:hover {
    background-color:#00ACEE;
    color: white;
}

#footer-instagram {
    padding: 7px;
    border-radius: 3px;
}

#footer-instagram:hover {
    background-image: linear-gradient(to bottom right, #515BD4,#8134AF,#DD2A7B);
    color: white;
}

@media (max-width: 679px) {
	h1 {margin-top: 20px!important;}

	.hero-h1 {
		font-size: 9vw!important;
		padding-top: 15px;
	}

	#process-we-deserved {
		padding-top: 40px!important;
	}

	#process-slider .slide-content {
		width: 91.3vw;
		height: 76.3vw;
	}
	#process-slider h2 {
		font-size: 6.48vw;
		letter-spacing: -0.35vw;
	}
	#process-slider #have-deserve {
		width: 39.76vw;
		height: 13.25vw;
		background-position: -1.47vw -2.94vw;
	}
	#green-phone h2 {
		font-size: 6.48vw;
		letter-spacing: -0.35vw;
	}
	#green-phone #internet-payment {
		width: 78.76vw;
		height: 6.25vw;
		background-position: -1.47vw -2.94vw;
		margin: auto;
	}
	#green-phone .img1 {width: 100%;}
}

@media (max-width: 575px) {
	.container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
		padding-left: var(--bs-gutter-x,1.75rem);
		padding-right: var(--bs-gutter-x,1.75rem);
	}

	.pe-8 {padding-right: 6rem!important;}
	/* .btn {
		letter-spacing: 0.2vw;
		font-size: 2vw;
	} */
	.btn {
		letter-spacing:0.23vw;
		font-size:2.78vw;
	}

	.fs-6 {
		font-size: 5vw!important;
	}

	/* h1 {font-size: 9vw; letter-spacing: -0.4vw;} */
	/* h2 {font-size: 5.6vw; letter-spacing: -0.3vw;} */
	h1, .h1 {font-size:11.1vw;letter-spacing: -0.6vw;}
	h2, .h2 {font-size:7.5vw;letter-spacing: -0.42vw;}

	/* .fs-xlarge{font-size: 4.2vw!important; line-height: 5.6vw!important;}
	.fs-large {font-size: 3.5vw!important; line-height: 4.9vw!important;}
	.fs-medium{font-size: 3.1vw!important; line-height: 4.5vw!important;} */
	.fs-xsmall {font-size:2.26vw!important;line-height: 3.13vw!important;}
	.fs-small {font-size: 2.78vw!important;line-height: 4.17vw!important;} /* Body default size. */
	.fs-medium {font-size:3.48vw!important;line-height: 4.87vw!important;}
	/* .fs-large {font-size:4vw!important;line-height: 5.39vw!important;} */
	/* .fs-xlarge {font-size:4.87vw!important;line-height: 6.26vw!important;} */

	html {
		font-size: 2.8vw!important;
		line-height: 4.2vw!important;
	}

	.content-wrapper {margin-bottom: 149.57vw;}

	header {height: 14.7vw;}
	header img {width: 34.8vw;}
	header .nav .nav-link {font-size: 3.8vw;}
	header .btn-menu {
		width:7.7vw;
		height:7.7vw;
		margin-top:-3.8vw;
		border-width: 0.2vw;
		border-radius:0.9vw;
		-webkit-border-radius:0.9vw;
	}

	footer {height: 149.57vw;}
	footer #footer-spred-logo {max-width: 43.5vw;}
	footer li {font-size: 3.1vw; line-height: 4.5vw;}
	footer .social i {font-size: 3.8vw;}

	#hero button {
		width: 50%;
		font-size: 1.2em;
	}

	#sprednet ul {min-height: 34.8vw; padding: 0 0 8.7vw 0;}
    #sprednet ul li:not(:first-of-type) {padding-top: 2.4vw;}
    .feature-answer {margin-top: 1.7vw;}
    .arrow span {
        width: 2.6vw;
        height: 2.6vw;
        border-top-width: 0.35vw;
        border-right-width: 0.35vw;
    }
    #sprednet h6{
        font-size: 1.5rem;
    }

	#process-slider ul li {
		padding-top: 26.1vw;
		line-height: 52.17vw;
	}

	.how_it_works_desktop {
		display: none;
	}

	.how_it_works_mobile {
		display: block;
	}

	.how_it_works_mobile img {
		width: 100%!important;
	}

	#process-slider .switch-slide-button {
		width: 13.91vw!important;
		height: 13.91vw!important;
	}

	#switcher_mobile {
		display: block;
	}
	
	#switcher_desktop {
		display: none;
	}

	.slider-br {
		display: block;
	}

	#green-phone #h1-iop {
		font-size: 2.5em;
	}

	#green-phone .iop-paragraph {
		font-size: 0.8em;
	}

	#green-phone .img_payments {
		width: 280px;
		height: 60px;
		margin-top: -100px;
	}

	#desktop-why-spred {
		display: none;
	}

	#mobile-why-spred {
		display: block;
	}

	#mobile_p_whyspred2, 
	#mobile_p_whyspred3 {
		display: none;
	}

	.headers-why-spred {
		text-align: center;
	}

	#whyspredimg {
		width: 70%;
		text-align: center;
	}

	#sprednet .image img {
		/* width: 35vw; */
		/* width: 52.17vw; */
		width: 100%!important;
	}
	#sprednet .grid-col p {
		max-width: 52vw;
		margin: 0 auto;
	}
	#sprednet h2,
	#sprednet p {
		text-align: center;
	}

	#sprednet .gpn-text {
		padding: 30px 0;
	}

	#slider-h2-regular,
	#slider-h2-spred {
		text-align: center;
	}

	#grow-your-business .say-goodbye img {width: 50%;}
	#grow-your-business #header-with-paint-sprednet {
		padding-left: 6.96vw;
		height: 17.39vw; 
		width: 69.57vw;
	}
	#grow-your-business #header-with-paint-spredapp {
		padding-left: 5.22vw; 
		height: 17.39vw; 
		/* width: 60.87vw; */
		width: 66.09vw;
	}

	.customermerchant-h2 {
		text-align: center;
	}

	.customermerchant-img {
		padding-top: 40px;
	}

	#customermerchant img {width: 100.74vw;}

	.checkbox-text {
		font-size: 0.8em!important;
	}

	#join-the-waitlist .img-waitlist {text-align: right;}

	#join-the-waitlist #telteltel-mobile {width: 52.17vw;}
	#join-the-waitlist #coming-soon img:first-child {width: 29.6vw;}
	#join-the-waitlist #coming-soon img:last-child {width: 37.4vw;}
}