.logo-black-icon {
  	position: absolute;
  	height: 100%;
  	width: 100%;
  	top: 0%;
  	right: 0%;
  	bottom: 0%;
  	left: 0%;
  	max-width: 100%;
  	overflow: hidden;
  	max-height: 100%;
}
.logo-barkoder-48h {
  	width: 143px;
  	position: relative;
  	height: 24px;
}
.logo {
  	display: flex;
  	flex-direction: row;
  	align-items: center;
  	justify-content: flex-start;
}
.barcode-scanner-sdk {
  	position: relative;
  	line-height: 24px;
  	font-weight: 500;
}
.vector-stroke-icon {
  	position: absolute;
  	height: 30%;
  	width: 50%;
  	top: 35%;
  	right: 25%;
  	bottom: 35%;
  	left: 25%;
  	max-width: 100%;
  	overflow: hidden;
  	max-height: 100%;
}
.iconschevron {
  	width: 24px;
  	position: relative;
  	height: 24px;
  	overflow: hidden;
  	flex-shrink: 0;
}
.sdk {
  	display: flex;
  	flex-direction: row;
  	align-items: center;
  	justify-content: flex-start;
  	gap: var(--gap-8);
}
.menu {
  	flex: 1;
  	overflow: hidden;
  	display: flex;
  	flex-direction: row;
  	align-items: center;
  	justify-content: center;
  	gap: var(--gap-24);
}
.iconsmessages {
  	width: 24px;
  	position: relative;
  	max-height: 100%;
}
.button1 {
  	position: relative;
  	line-height: 150%;
  	font-weight: 500;
}
.button {
  	border-radius: 999px;
  	background: linear-gradient(105.57deg, var(--color-snow), #ffe5e8);
  	height: 40px;
  	overflow: hidden;
  	display: flex;
  	flex-direction: row;
  	align-items: center;
  	justify-content: center;
  	padding: 0px var(--padding-24) 0px var(--padding-16);
  	box-sizing: border-box;
  	gap: var(--gap-8);
}
.account {
  	display: flex;
  	flex-direction: row;
  	align-items: center;
  	justify-content: flex-end;
  	gap: var(--gap-8);
  	text-align: right;
  	font-size: var(--font-size-16);
  	color: var(--color-gray-200);
  	font-family: var(--font-rubik);
}
.container {
  	display: flex;
  	flex-direction: row;
  	align-items: center;
  	justify-content: flex-start;
  	gap: var(--gap-24);
  	text-align: center;
  	font-size: var(--font-size-14);
  	color: var(--color-crimson-200);
  	font-family: var(--font-roboto);
}
.home-navigation {
  	align-self: stretch;
  	backdrop-filter: blur(30px);
  	background-color: var(--color-gray-400);
  	height: 80px;
  	display: flex;
  	flex-direction: row;
  	align-items: center;
  	justify-content: center;
  	padding: var(--padding-24) var(--padding-60);
  	box-sizing: border-box;
  	gap: var(--gap-8);
  	font-size: var(--font-size-16);
}
.heading-chip-text {
  	position: relative;
  	line-height: 16px;
  	text-transform: uppercase;
}
.txt1 {
  	display: flex;
  	flex-direction: row;
  	align-items: center;
  	justify-content: center;
  	padding: var(--padding-8) 12px;
  	z-index: 0;
}
.corner-icon {
  	width: 5px;
  	position: absolute;
  	margin: 0 !important;
  	top: 3px;
  	left: 3px;
  	border-radius: var(--br-2);
  	height: 5px;
  	object-fit: contain;
  	z-index: 1;
}
.corner-icon1 {
  	width: 5px;
  	position: absolute;
  	margin: 0 !important;
  	top: 3px;
  	right: 3px;
  	border-radius: var(--br-2);
  	height: 5px;
  	z-index: 2;
}
.corner-icon2 {
  	width: 5px;
  	position: absolute;
  	margin: 0 !important;
  	bottom: 3px;
  	left: 3px;
  	border-radius: var(--br-2);
  	height: 5px;
  	object-fit: contain;
  	z-index: 3;
}
.corner-icon3 {
  	width: 5px;
  	position: absolute;
  	margin: 0 !important;
  	right: 3px;
  	bottom: -2px;
  	border-radius: var(--br-2);
  	height: 5px;
  	z-index: 4;
}
.heading-chip {
  	border-radius: 4px;
  	background-color: var(--color-crimson-200);
  	display: flex;
  	flex-direction: row;
  	align-items: center;
  	justify-content: center;
  	padding: 0px 2px;
  	position: relative;
  	text-align: center;
}
.get-your-free {
  	align-self: stretch;
  	position: relative;
  	font-size: 48px;
  	letter-spacing: -0.02em;
  	line-height: 125%;
  	font-weight: 500;
  	color: var(--color-gray-200);
}
.the-barcode-scanner {
  	align-self: stretch;
  	position: relative;
  	font-size: 18px;
  	line-height: 24px;
  	color: var(--color-darkslategray);
}
.txt {
  	width: 648px;
  	overflow: hidden;
  	display: flex;
  	flex-direction: column;
  	align-items: flex-start;
  	justify-content: flex-start;
  	gap: var(--gap-24);
  	min-width: 300px;
  	max-width: 648px;
}
.barkoder-wasm-iphone-mockup-icon {
  	position: absolute;
  	height: 100%;
  	width: 100%;
  	top: 0%;
  	right: 0%;
  	bottom: 0%;
  	left: 0%;
  	max-width: 100%;
  	overflow: hidden;
  	max-height: 100%;
  	object-fit: cover;
}
.barkoder-app-ip14pro-mockup {
  	width: 440px;
  	position: relative;
  	height: 440px;
}
.image-container {
  	width: 440px;
  	display: flex;
  	flex-direction: row;
  	align-items: center;
  	justify-content: center;
}
.hero {
  	align-self: stretch;
  	background: linear-gradient(180deg, var(--color-white), #ebebf0 50%, var(--color-white));
  	height: 600px;
  	display: flex;
  	flex-direction: row;
  	align-items: center;
  	justify-content: center;
  	padding: 0px var(--padding-60);
  	box-sizing: border-box;
  	gap: var(--gap-24);
  	color: var(--color-white);
}
.txt2 {
  	display: flex;
  	flex-direction: row;
  	align-items: center;
  	justify-content: center;
  	padding: 4px var(--padding-8);
  	z-index: 0;
}
.corner-icon4 {
  	width: 4px;
  	position: absolute;
  	margin: 0 !important;
  	top: 1px;
  	left: 1px;
  	height: 4px;
  	object-fit: contain;
  	z-index: 1;
}
.corner-icon5 {
  	width: 4px;
  	position: absolute;
  	margin: 0 !important;
  	top: 1px;
  	right: 1px;
  	height: 4px;
  	z-index: 2;
}
.corner-icon6 {
  	width: 4px;
  	position: absolute;
  	margin: 0 !important;
  	bottom: 1px;
  	left: 1px;
  	height: 4px;
  	object-fit: contain;
  	z-index: 3;
}
.corner-icon7 {
  	width: 4px;
  	position: absolute;
  	margin: 0 !important;
  	right: 1px;
  	bottom: -3px;
  	height: 4px;
  	z-index: 4;
}
.heading-chip1 {
  	border-radius: var(--br-2);
  	background-color: var(--color-gray-300);
  	display: flex;
  	flex-direction: row;
  	align-items: center;
  	justify-content: center;
  	position: relative;
}
.heading {
  	align-self: stretch;
  	position: relative;
  	font-size: 38px;
  	letter-spacing: -0.02em;
  	line-height: 125%;
  	color: var(--color-gray-200);
}
.chiptitle {
  	width: 648px;
  	display: flex;
  	flex-direction: column;
  	align-items: center;
  	justify-content: flex-start;
  	gap: 16px;
  	text-align: center;
  	color: var(--color-darkslategray);
}
.heading1 {
  	align-self: stretch;
  	position: relative;
  	line-height: 125%;
}
.it-was-a {
  	align-self: stretch;
  	position: relative;
  	line-height: 24px;
}
.p {
  	align-self: stretch;
  	display: flex;
  	flex-direction: column;
  	align-items: flex-start;
  	justify-content: flex-start;
  	font-size: var(--font-size-16);
  	color: var(--color-darkslategray);
}
.txt3 {
  	flex: 1;
  	display: flex;
  	flex-direction: column;
  	align-items: flex-start;
  	justify-content: flex-start;
  	gap: var(--gap-8);
}
.icon {
  	width: 80px;
  	border-radius: var(--br-20);
  	height: 80px;
  	overflow: hidden;
  	flex-shrink: 0;
  	object-fit: cover;
}
.sdktrial {
  	flex: 1;
  	border-radius: var(--br-32);
  	background-color: var(--color-snow);
  	border: 0.5px dashed var(--color-crimson-200);
  	display: flex;
  	flex-direction: row;
  	align-items: flex-start;
  	justify-content: flex-start;
  	padding: var(--padding-48);
  	gap: var(--gap-24);
}
.group-icon {
  	position: absolute;
  	height: 83.33%;
  	width: 83.33%;
  	top: 8.33%;
  	right: 8.33%;
  	bottom: 8.33%;
  	left: 8.33%;
  	max-width: 100%;
  	overflow: hidden;
  	max-height: 100%;
}
.ico-webdemo {
  	width: 48px;
  	position: relative;
  	height: 48px;
}
.icon1 {
  	box-shadow: 0px 10px 30px -20px rgba(229, 46, 76, 0.5);
  	border-radius: var(--br-20);
  	background-color: var(--color-white);
  	overflow: hidden;
  	display: flex;
  	flex-direction: row;
  	align-items: center;
  	justify-content: center;
  	padding: var(--padding-16);
}
.sdktrial-parent {
  	width: 980px;
  	display: flex;
  	flex-direction: row;
  	align-items: flex-start;
  	justify-content: flex-start;
  	gap: var(--gap-24);
  	font-size: 28.43px;
}
.txt5 {
  	align-self: stretch;
  	display: flex;
  	flex-direction: row;
  	align-items: flex-start;
  	justify-content: flex-start;
  	gap: var(--gap-24);
  	font-size: 28.43px;
}
.label1 {
  	position: relative;
  	line-height: 16px;
}
.div {
  	position: relative;
  	line-height: 16px;
  	color: var(--color-crimson-100);
}
.label {
  	display: flex;
  	flex-direction: row;
  	align-items: flex-start;
  	justify-content: flex-start;
  	gap: 4px;
}
.value {
  	flex: 1;
  	position: relative;
  	line-height: 24px;
  	overflow: hidden;
  	text-overflow: ellipsis;
  	white-space: nowrap;
}
.input {
  	align-self: stretch;
  	border-radius: var(--br-8);
  	background-color: var(--color-whitesmoke-200);
  	border: 1px solid var(--color-gainsboro);
  	box-sizing: border-box;
  	height: 56px;
  	overflow: hidden;
  	flex-shrink: 0;
  	display: flex;
  	flex-direction: row;
  	align-items: center;
  	justify-content: flex-start;
  	padding: var(--padding-16) var(--padding-8) var(--padding-16) var(--padding-16);
  	font-size: var(--font-size-16);
}
.if-disabled-the {
  	flex: 1;
  	position: relative;
  	line-height: 16px;
}
.caption-txt {
  	align-self: stretch;
  	border-radius: var(--br-16) 0px var(--br-16) var(--br-16);
  	background-color: var(--color-whitesmoke-200);
  	overflow: hidden;
  	display: flex;
  	flex-direction: row;
  	align-items: center;
  	justify-content: flex-start;
  	flex-wrap: wrap;
  	align-content: center;
  	padding: var(--padding-8) var(--padding-16);
}
.input-field {
  	align-self: stretch;
  	display: flex;
  	flex-direction: column;
  	align-items: flex-start;
  	justify-content: flex-start;
  	gap: var(--gap-8);
  	min-width: 250px;
}
.col {
  	align-self: stretch;
  	display: flex;
  	flex-direction: column;
  	align-items: flex-start;
  	justify-content: flex-start;
  	color: var(--color-dimgray);
}
.icon-check {
  	width: 24px;
  	height: 24px;
}
.check-option {
  	align-self: stretch;
  	border-radius: var(--br-8);
  	background-color: var(--color-gray-100);
  	display: flex;
  	flex-direction: row;
  	align-items: center;
  	justify-content: flex-start;
  	padding: var(--padding-16);
  	gap: var(--gap-8);
  	color: var(--color-darkslategray);
}
.bg {
  	position: absolute;
  	width: 100%;
  	top: 0px;
  	right: 0px;
  	left: 0px;
  	box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.08);
  	border-radius: 3px;
  	background-color: var(--color-whitesmoke-100);
  	border: 1px solid var(--color-lightgray);
  	box-sizing: border-box;
  	height: 76px;
}
.text-icon {
  	position: absolute;
  	top: calc(50% + 10.79px);
  	left: calc(50% - 28px);
  	width: 55.4px;
  	height: 19.7px;
}
.recaptcha-symbol-icon {
  	position: absolute;
  	top: calc(50% - 25px);
  	left: calc(50% - 14px);
  	width: 28.6px;
  	height: 28.5px;
}
.recaptcha {
  	position: absolute;
  	top: 7px;
  	right: 7px;
  	width: 66px;
  	height: 62px;
}
.robot-icon {
  	position: absolute;
  	top: 23px;
  	left: 13px;
  	width: 130px;
  	height: 28px;
}
.recaptcha-v2-checkbox {
  	width: 302px;
  	position: relative;
  	height: 76px;
}
.vector-stroke-icon5 {
  	position: absolute;
  	height: 50%;
  	width: 30%;
  	top: 25%;
  	right: 35%;
  	bottom: 25%;
  	left: 35%;
  	max-width: 100%;
  	overflow: hidden;
  	max-height: 100%;
  	object-fit: contain;
}
.button2 {
  	border-radius: 999px;
  	background-color: var(--color-crimson-200);
  	height: 40px;
  	overflow: hidden;
  	flex-shrink: 0;
  	display: flex;
  	flex-direction: row;
  	align-items: center;
  	justify-content: center;
  	padding: 0px var(--padding-16) 0px var(--padding-24);
  	box-sizing: border-box;
  	gap: var(--gap-8);
}
.ctrl {
  	align-self: stretch;
  	display: flex;
  	flex-direction: column;
  	align-items: flex-end;
  	justify-content: flex-start;
  	padding: var(--padding-24) 0px 0px;
  	gap: var(--gap-24);
  	text-align: center;
  	font-size: var(--font-size-14);
  	color: var(--color-white);
  	font-family: var(--font-roboto);
}
.sdktrial2 {
  	flex: 1;
  	box-shadow: 0px 1px 4px rgba(12, 12, 13, 0.1), 0px 1px 4px rgba(12, 12, 13, 0.05);
  	border-radius: var(--br-32);
  	background-color: var(--color-white);
  	border: 1px solid var(--color-crimson-200);
  	display: flex;
  	flex-direction: column;
  	align-items: flex-start;
  	justify-content: flex-start;
  	padding: var(--padding-48);
  	gap: var(--gap-24);
}
.sdktrial3 {
  	flex: 1;
  	border-radius: var(--br-32);
  	background-color: var(--color-snow);
  	border: 0.5px dashed var(--color-crimson-200);
  	display: flex;
  	flex-direction: row;
  	align-items: flex-start;
  	justify-content: flex-start;
  	padding: var(--padding-48);
  	gap: var(--gap-24);
  	font-size: 28.43px;
}
.sdktrial-group {
  	width: 980px;
  	display: flex;
  	flex-direction: row;
  	align-items: flex-start;
  	justify-content: flex-start;
  	gap: var(--gap-24);
}
.section-free-trial {
  	align-self: stretch;
  	display: flex;
  	flex-direction: column;
  	align-items: center;
  	justify-content: flex-start;
  	padding: 80px var(--padding-60);
  	gap: 40px;
}
.home-trial-license {
  	width: 100%;
  	position: relative;
  	background-color: var(--color-white);
  	overflow: hidden;
  	display: flex;
  	flex-direction: column;
  	align-items: flex-start;
  	justify-content: flex-start;
  	text-align: left;
  	font-size: var(--font-size-12);
  	color: var(--color-gray-200);
  	font-family: var(--font-rubik);
}