::-webkit-scrollbar {
	background: none;
	display: none;
}

body {
	margin: 0px;
	overflow: hidden;
	-webkit-tap-highlight-color: transparent;
	-webkit-scroll-highlight-color: transparent;
	user-select: none;
	touch-action: manipulation;
}

#closeList {
	display: none;
}

#RaceReplica {
	/* display: none; */
}

@font-face {
	font-family: tvsFont;
	src: url(./preprodAssets/font/gilory/Gilroy-Black.ttf);
}

@font-face {
	font-family: gilroybold;
	src: url(./preprodAssets/font/gilory/Gilroy-Bold.ttf);
}

html {
	font-family: tvsFont;
	background-color: white;
}

#userflow {
	width: 100vw;
	height: 100vh;
	position: absolute;
	top: 0%;
	z-index: 910;
	background-color: rgba(25, 25, 25, 0.7);
}

.userflowclass {
	display: block;
}

#arUserflow {
	position: absolute;
	margin-left: auto;
	margin-right: auto;
	z-index: 920;
	width: 106%;
	top: 110%
}

#buynowUserflow {
	position: absolute;
	margin-left: auto;
	margin-right: auto;
	z-index: 920;
	width: 98%;
	top: 110%;
	left: -39%;
}

#saveUserflow {
	position: absolute;
	margin-left: auto;
	margin-right: auto;
	z-index: 920;
	width: 80%;
	top: 110%;
	left: 35%;
}

#configureflow {
	position: absolute;
	margin-left: auto;
	margin-right: auto;
	z-index: 920;
	width: 30%;
	max-width: 200px;
	height: auto;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

#kitflow {
	position: absolute;
	margin-left: auto;
	margin-right: auto;
	z-index: 920;
	width: 9%;
	top: -164%;
	left: 37%;
}

#racenoflow {
	position: absolute;
	margin-left: auto;
	margin-right: auto;
	z-index: 920;
	width: 9%;
	top: -185%;
	left: 55%;
}

#playFeatureVideo {
	width: 80%;
	height: auto;
	display: none;
	position: absolute;
	left: 10%;
	top: 10vh;
	z-index: 810;
}

#showRNAlert {
	width: 80%;
	max-width: 400px;
	display: none;
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
	position: absolute;
	left: 50%;
	top: 30vh;
	z-index: 810;
}

#showAlert {
	width: 80%;
	max-width: 400px;
	display: none;
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
	position: absolute;
	left: 50%;
	top: 60vh;
	z-index: 810;
}

#showRace00Alert {
	width: 80%;
	max-width: 400px;
	display: none;
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
	position: absolute;
	left: 50%;
	top: 60vh;
	z-index: 810;
}

#showKitDynamicAlert {
	width: 60%;
	max-width: 400px;
	display: none;
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
	position: absolute;
	left: 50%;
	top: 30vh;
	z-index: 810;
}

#showKitDynamicAlertConfirm {
	width: 40%;
	position: absolute;
	top: 63%;
	left: 30%;
	cursor: pointer;
}

#showKitDynamicAlertCross {
	width: 12%;
	position: absolute;
	top: 7%;
	right: 5%;
	cursor: pointer;
}

#showKitRaceAlert {
	width: 60%;
	max-width: 400px;
	display: none;
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
	position: absolute;
	left: 50%;
	top: 30vh;
	z-index: 810;
}

#showKitRaceAlertConfirm {
	width: 40%;
	position: absolute;
	top: 63%;
	left: 30%;
	cursor: pointer;
}

#showKitRaceAlertCross {
	width: 12%;
	position: absolute;
	top: 7%;
	right: 5%;
	cursor: pointer;
}


#featureVideo {
	width: 100%;
	position: absolute;
}

#FeatureVideoCross {
	width: 6%;
	height: 6%;
	right: 0%;
	position: absolute;
	cursor: pointer;
}

#tapToPlaceTextHolder {
	display: none;
	width: 50%;
	height: auto;
	display: none;
	position: absolute;
	left: 25%;
	top: 59%;
}

#tapToPlaceTextHolder h2 {
	color: white;
	font-size: 14px;
}

#background {
	width: 100%;
	height: 100vh;
	top: 0%;
	position: absolute;
	z-index: 998;
	display: flex;
	background-image: url("./preprodAssets/newicon/pc.jpg");
	background-repeat: round;
	background-size: contain;
}

#backgroundImage {
	width: 56%;
	height: auto;
	position: absolute;
	top: 16%;
	left: 50%;

	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
}

#redirectmsg {
	width: 50%;
	position: absolute;
	bottom: 10%;
	left: 50%;
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
	z-index: 999;
	display: none;
}

#redirectmsgImage {
	width: 100%;
	height: auto;
}

#loadingstatic {
	width: 16%;
	position: absolute;
	top: 90%;
	left: 52%;
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
	z-index: 999;
	display: block;
}

#loadingstaticImage {
	width: 100%;
	height: auto;
	display: none;
}

#bookingalert {
	width: 42%;
	position: absolute;
	top: 12%;
	left: 52%;
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
	z-index: 899;
	display: none;
}

#bookingalertImage {
	width: 100%;
	height: auto;
}

#backgroundImage2 {
	width: auto;
	height: 100vh;
	max-width: 800px;
	position: absolute;
	left: 50%;
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
}

#loadingIcon {
	display: block;
	position: absolute;
	width: 100%;
	height: auto;
	bottom: 0%;
	left: 0%;
	z-index: 800;
}

#loadingIconImage {
	height: auto;
	margin-left: auto;
	margin-right: auto;
}

/*main*/
#toggleContainer {
	position: absolute;
	width: 16%;
	max-width: 70px;
	max-height: 60px;
	min-height: 45px;
	right: 5%;
	margin-left: auto;
	margin-right: auto;
	top: 30px;
	display: block;
}

#toggle {
	position: absolute;
	margin-left: auto;
	margin-right: auto;
	z-index: 11;
	width: 100%;
	cursor: pointer;
}

#toggle img {
	display: block;
	margin: 0 auto;
	width: auto;
	;
	height: auto;
	max-height: 60px;
}

#TopLeftContainer {
	position: absolute;
	width: 30%;
	max-width: 140px;
	max-height: 60px;
	left: 2%;
	margin-left: auto;
	margin-right: auto;
	top: 30px;
	/* display: none; */
}

#TopRightContainer {
	position: absolute;
	width: 30%;
	max-width: 140px;
	max-height: 60px;
	right: 9%;
	margin-left: auto;
	margin-right: auto;
	top: 30px;
	display: flex;
}

.TopRightDivCss {
	height: 100%;
	max-height: 60px;
	width: auto;
	margin: 0 auto;
	cursor: pointer;
}

.TopRightCss {
	height: 100%;
	width: auto;
	max-height: 60px;
	margin: 0 auto;
}

#TopMiddleContainer {
	position: absolute;
	width: 50%;
	min-height: 60px;
	max-height: 60px;
	left: 25%;
	z-index: 10;
	margin-left: auto;
	margin-right: auto;
	top: 30px;
	display: flex;
}

.TopMiddleDivCss {
	height: 100%;
	max-height: 60px;
	min-height: 60px;
	width: auto;
	margin: 0 auto;
	cursor: pointer;
}

.TopMiddleCss {
	height: 100%;
	max-height: 60px;
	min-height: 60px;
	width: auto;
	margin: 0 auto;
}

#TopMiddleChildDivContainer {
	width: 35%;
	left: 18%;
	transform: translateX(-50%);
	max-width: 400px;
	top: 100px;
	max-height: 400px;
	overflow-y: auto;
	overflow-x: hidden;
	position: absolute;
	display: block;
	column-gap: 20px;
	justify-content: center;
	margin: 0 auto;
}

.TopMiddleChildDivCss {
	width: 100%;
	height: auto;
	margin: 0 auto;
	pointer-events: none;
	cursor: pointer;
}

.TopMiddleChildCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
	pointer-events: none;
}

.TopMiddleChildCrossDivCss {
	width: 9%;
	position: absolute;
	left: 85%;
	margin-top: 6%;
	cursor: pointer;
}

.TopMiddleChildCrossCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
	cursor: pointer;
}

.TopMiddleChildMoreLessDivCss {
	width: 19%;
	position: absolute;
	right: 7%;
	margin-top: -13%;
	cursor: pointer;
}

.TopMiddleChildMoreLessCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
	cursor: pointer;
}


#saveConfiguratorParentDiv {
	width: 30%;
	left: 35%;
	top: 150px;
	position: absolute;
	display: none;
	column-gap: 20px;
	justify-content: center;
	margin: 0 auto;
	z-index: 800;
}

#saveConfiguratorListParentDiv {
	width: 35%;
	height: 60vh;
	left: 35%;
	top: 150px;
	background-color: white;
	position: absolute;
	display: none;
	flex-direction: column;
	column-gap: 20px;
	overflow-y: auto;
	overflow-x: hidden;
	justify-content: left;
	margin: 0 auto;
	z-index: 800;
}

#configurationListParent {
	width: 90%;
	left: 5%;
	position: relative;
	display: flex;
	flex-direction: column;
	column-gap: 20px;
	justify-content: center;
	z-index: 800;
}

.saveConfigurationClassDiv {
	width: 80%;
	left: 10%;
	position: relative;
	cursor: pointer;
	display: block;
	z-index: 89;
}

.saveConfigurationClassCSS {
	width: 100%;
	z-index: 100;
	height: auto;
	margin: 0 auto;
}

.saveConfigurationNameDivCss {
	width: 33%;
	top: 64%;
	left: 33%;
	text-align: center;
	margin-top: 2%;
	position: absolute;
	font-size: 0.6em;
	display: block;
	z-index: 800;

}

.saveConfigurationNameInputDivCss {
	width: 100%;
	display: none;
	height: 2.2vh;
	padding: 2px 2px;
	box-sizing: border-box;
	text-align: center;
	font-size: 1.2vh;
	border: 2px solid #ccc;
	border-radius: 4px;
	background-color: #f8f8f8;
}

.saveConfigurationPriceDivCss {
	width: 90%;
	top: 20%;
	left: 5%;
	margin-top: 5%;
	position: absolute;
	display: block;
	z-index: 800;
}

.saveConfigurationPriceCss {
	width: 100%;
	height: auto;
	margin: 0 auto;
}

.saveConfigAdd {
	width: 20%;
	height: auto;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	cursor: pointer;
}

.saveConfigurationIconsDivCss {
	width: 80%;
	top: 72%;
	left: 10%;
	margin-top: 5%;
	position: absolute;
	display: flex;
	z-index: 109;
}

.saveConfigurationIconsCss {
	width: 30%;
	margin-left: 2%;
	height: auto;
}


.closeListDivCSS {
	width: 5%;
	left: 5%;
	position: relative;
	display: block;
	z-index: 895;
	cursor: pointer;
}

.closeListCSS {
	width: 100%;
	height: auto;
	margin: 0 auto;
}

.addNewDivCSS {
	width: 40%;
	left: 30%;
	top: 5%;
	margin-top: 5%;
	position: relative;
	display: block;
	z-index: 800;
	cursor: pointer;
}

.addNewCSS {
	width: 100%;
	height: auto;
	margin: 0 auto;
}

#saveConfiguratorBackgroundDivContainer {
	width: 100%;
	left: 0%;
	top: 0%;
	position: absolute;
	display: block;
}

.saveConfiguratorBackgroundDivCss {
	width: 100%;
	height: auto;
	margin: 0 auto;
}

.saveConfiguratorBackgroundCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

#tftConsleDivContainer {
	width: 30%;
	max-width: 200px;
	right: 23%;
	transform: translateX(50%);
	top: 55%;
	position: absolute;
	display: flex;
	flex-direction: column;
}

.tftConsleDivCss {
	width: 100%;
	height: auto;
	margin-top: -5px;
	cursor: pointer;
}

.tftConsleCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

#tftConsleDNDivContainer {
	width: 30%;
	max-width: 50px;
	right: 12%;
	transform: translateX(50%);
	top: 58%;
	position: absolute;
	display: flex;
	flex-direction: column;
}

.tftConsleDNDivCss {
	width: 100%;
	height: auto;
	margin-top: -4px;
	cursor: pointer;
}

.tftConsleDNCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

#tftConsleScreenDivContainer {
	width: 60%;
	max-width: 400px;
	right: 20%;
	transform: translateX(50%);
	top: 5%;
	position: absolute;
	display: block;
}

.tftConsleScreenDivCss {
	width: 100%;
	height: auto;
	margin-top: -4px;
}

.tftConsleScreenCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

#saveConfiguratorHeadingDivContainer {
	width: 70%;
	left: 15%;
	margin-top: 10%;
	position: absolute;
	display: block;
}

#m10c {
	width: 100%;
	font-size: 20px;
	text-align: center;
}

#saveConfiguratorHeadingDivContainer2 {
	width: 70%;
	left: 15%;
	margin-top: 10%;
	position: absolute;
	display: block;
}

#saveConfiguratorParentDiv2 {
	display: none;
}

.saveConfiguratorHeadingDivCss {
	width: 100%;
	height: auto;
	margin: 0 auto;
}

.saveConfiguratorHeadingCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

.saveConfiguratorConfigNameDivCss {
	width: 100%;
	height: auto;
	margin: 0 auto;
	justify-content: center;
	font-size: 2em;
	text-align: center;
	color: #141B4D;
}

.SaveConfigurationTickCSS {
	width: 30%;
	height: auto;
	margin-left: 35%;
	justify-content: center;
	cursor: pointer;
}

#SaveConfigurationTick_img {
	height: auto;
	width: 100%;
	margin: 0 auto;
}



.SaveConfigurationSavedSuccessfullyCSS {
	width: 40%;
	height: auto;
	margin-top: 0%;
	margin-left: 30%;
	justify-content: center;
}

#SaveConfigurationSavedSuccessfully_img {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

.SaveConfigurationContinueCSS {
	width: 40%;
	height: auto;
	margin-top: 0%;
	margin-left: 30%;
	justify-content: center;
	cursor: pointer;
}

#SaveConfigurationContinue_img {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

.SaveConfigurationSavedConfigCSS {
	width: 50%;
	height: auto;
	margin-top: 5%;
	margin-left: 25%;
	justify-content: center;
	cursor: pointer;
}

#SaveConfigurationSavedConfig_img {
	height: auto;
	width: 100%;
	margin: 0 auto;
}


#saveConfiguratorCrossDivContainer {
	width: 5%;
	margin-top: 6%;
	margin-left: 80%;
	position: absolute;
	display: block;
}

.saveConfiguratorCrossDivCss {
	width: 100%;
	height: auto;
	margin: 0 auto;
	cursor: pointer;
}

.saveConfiguratorCrossCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

#saveConfiguratorNameBackDivContainer {
	width: 80%;
	margin-top: 20%;
	position: absolute;
	display: block;
}

.saveConfiguratorNameBackDivCss {
	width: 100%;
	height: auto;
	margin: 0 auto;
}

.saveConfiguratorNameBackCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

#saveConfiguratorNameParentDivContainer {
	width: 70%;
	margin-top: 30%;
	margin-left: 0%;
	font-size: 3em;
	position: absolute;
	display: block;
}

#saveConfiguratorNameDivContainer {
	width: 100%;
	display: none;
	height: 6vh;
	padding: 8px 12px;
	box-sizing: border-box;
	font-size: 3vh;
	border: 2px solid #ccc;
	border-radius: 4px;
	background-color: #f8f8f8;
}

.saveConfiguratorNameDivCss {
	width: 100%;
	height: auto;
	margin: 0 auto;

}

.saveConfiguratorNameCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

#saveConfiguratorSaveDivContainer {
	width: 30%;
	left: 35%;
	margin-top: 55%;
	position: absolute;
	display: block;
}

.saveConfiguratorSaveDivCss {
	width: 100%;
	height: auto;
	margin: 0 auto;
}

.inactive {
	-webkit-filter: grayscale(100%) invert(20%);
	-moz-filter: grayscale(100%) invert(20%);
	-o-filter: grayscale(100%) invert(20%);
	-ms-filter: grayscale(100%) invert(20%);
	filter: grayscale(100%) invert(20%);
	pointer-events: none;
}

.saveConfiguratorSaveCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
	cursor: pointer;
}

#raceNumberSelectorParentDiv {
	width: 600px;
	left: 50%;
	transform: translateX(-50%);
	top: 100px;
	background-color: #B0B0B0;
	position: absolute;
	display: flex;
	column-gap: 20px;
	justify-content: center;
	margin: 0 auto;
	z-index: 800;
}

#featureCalloutParentDiv {
	width: 30%;
	left: 10%;
	top: 110px;
	position: absolute;
	display: flex;
	column-gap: 20px;
	justify-content: center;
	margin: 0 auto;
	z-index: 800;
}

#featureCalloutDivContainer {
	width: 100%;
	position: absolute;
	display: flex;
	max-height: 40vh;
	column-gap: 20px;
	overflow-y: auto;
	overflow-x: hidden;
	justify-content: center;
	margin: 0 auto;
}

.featureCalloutDivCss {
	width: 100%;
	height: auto;
	margin: 0 auto;
	scroll-behavior: smooth;
	cursor: pointer;
}

.featureCalloutCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

#featureCalloutCrossDivContainer {
	width: 8%;
	margin-top: 5%;
	right: 5%;
	position: absolute;
	display: block;
}

.featureCalloutCrossDivCss {
	width: 100%;
	height: auto;
	margin: 0 auto;
	cursor: pointer;

}

.featureCalloutCrossCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

#featureCalloutSoundDivContainer {
	height: 17%;
	max-width: 80%;
	margin-top: 9%;
	left: 8%;
	position: absolute;
	display: block;
}

.featureCalloutSoundDivCss {
	width: auto;
	height: 100%;
	margin: 0 auto;
	cursor: pointer;
}

.featureCalloutSoundCss {
	max-width: 100%;
	max-height: 100%;
	margin: 0 auto;
}

#raceNumberBackgroundDivContainer {
	width: 100%;
	left: 0%;
	top: 3%;
	position: absolute;
	display: block;
}

.raceNumberBackgroundDivCss {
	width: 100%;
	height: auto;
	margin: 0 auto;
}

.raceNumberBackgroundCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

#raceNumberMain1DivContainer {
	width: 25%;
	height: 50%;
	left: 7.5%;
	top: 23%;
	position: absolute;
	display: flex;
}

.raceNumberMain1DivCss {
	width: 100%;
	height: auto;
	margin: 0 auto;
}

.raceNumberMain1Css {
	height: auto;
	opacity: 0;
	width: 100%;
	margin: 0 auto;
}

#raceNumberMain2DivContainer {
	width: 25%;
	height: 50%;
	left: 26.5%;
	top: 23%;
	position: absolute;
	display: flex;
}

.raceNumberMain2DivCss {
	width: 100%;
	font-family: tvsFont;
	height: auto;
	margin: 0 auto;
}

#RaceNumberMain2_img {
	pointer-events: none;
}

#RaceNumberMain1_img {
	pointer-events: none;
}

.raceNumberMain2Css {
	height: auto;
	opacity: 0;
	width: 100%;
	margin: 0 auto;
}

nav,
.scroll-container {
	display: block;
	margin: 0 auto;
	text-align: center;
}

nav {
	width: 339px;
	padding: 5px;
	border: 1px solid black;
}

.scroll-container {
	width: 100%;
	position: absolute;
	height: 100%;
	color: #141B4D;
	overflow-y: scroll;
	overflow-x: hidden;
	scroll-behavior: smooth;
	white-space: nowrap;
	-webkit-overflow-scrolling: touch;
	cursor: ns-resize;
	top: 35px;
	left: 0;
}

.scroll-page {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	font-size: 4em;
}

#raceNumberButton1DivContainer {
	width: 40%;
	left: 55%;
	top: 22%;
	position: absolute;
	display: flex;
	cursor: pointer;
}

.raceNumberButton1DivCss {
	width: 100%;
	height: auto;
	margin: 0 auto;
}

.raceNumberButton1Css {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

#raceNumberButton2DivContainer {
	width: 40%;
	left: 55%;
	top: 52%;
	position: absolute;
	display: flex;
	cursor: pointer;
}

.raceNumberButton2DivCss {
	width: 100%;
	height: auto;
	margin: 0 auto;
}

.raceNumberButton2Css {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

#featureCalloutMoreDivContainer {
	width: 9%;
	right: 5%;
	bottom: 10%;
	position: absolute;
	display: block;
}

.featureCalloutMoreDivCss {
	width: 100%;
	height: auto;
	margin: 0 auto;
	cursor: pointer;
}

.featureCalloutMoreCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

#btn_container {
	width: 100%;
	position: absolute;
	top: 55vh;
	display: flex;
	justify-content: center;
}

#InteractiveTopContainer {
	width: 70%;
	right: 15%;
	position: absolute;
	bottom: 2%;
	z-index: 800;
	display: block;
	justify-content: center;
	margin: 4px auto;
}

#InteractiveContainer {
	width: 100%;
	position: absolute;
	bottom: 5%;
	display: block;
	justify-content: center;
	margin: 4px auto;
}

#interactiveIconDivContainer {
	width: 100%;
	max-width: 400px;
	transform: translateX(-50%);
	left: 50%;
	position: relative;
	display: flex;
	column-gap: 2px;
	justify-content: center;
}

.parentIconDivCss {
	width: 20%;
	max-width: 82px;
	height: auto;
	margin: 0 auto;
	cursor: pointer;
}

.parentIconCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

#interactiveChildIconDivContainer {
	width: 75%;
	position: relative;
	display: flex;
	column-gap: 20px;
	justify-content: center;
	margin: 0 auto;
}

.childIconDivCss {
	width: 14%;
	max-width: 49px;
	height: auto;
	margin: 0 auto;
	cursor: pointer;
}

.childIconCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

#interactiveChildKitDivContainer {
	width: 85%;
	left: 7.5%;
	position: relative;
	display: flex;
	column-gap: 2px;
	justify-content: center;
}

.childKitDivCss {
	width: 100%;
	max-width: 175px;
	min-width: 20px height: auto;
	justify-content: center;
	cursor: pointer;
}

.childKitCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

#interactiveChildColorDivContainer {
	width: 22%;
	left: 50%;
	top: -61%;
	position: absolute;
	transform: translateX(-50%);
	display: flex;
	column-gap: 2px;
	justify-content: center;
}

.childColorDivCss {
	width: 100%;
	max-width: 70px;
	min-width: 60px height: auto;
	cursor: pointer;
	justify-content: center;
}

.childColorCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

#interactiveChildWheelColorDivContainer {
	width: 6%;
	position: absolute;
	top: -61%;
	left: 58%;
	transform: translateX(-50%);
	display: flex;
	column-gap: 2px;
	justify-content: center;
}

.childWheelColorDivCss {
	width: 100%;
	max-width: 50px;
	min-width: 20px;
	height: auto;
	justify-content: center;
	cursor: pointer;
}

.childWheelColorCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

#interactiveChildFeatureDivContainer {
	width: 90%;
	max-width: 367px;
	left: 50%;
	transform: translateX(-50%);
	position: relative;
	display: flex;
	display: -webkit-flex;
	display: -moz-flex;
	justify-content: left;
	flex-flow: row;
	-webkit-flex-flow: row;
	-moz-flex-flow: inherit;
	overflow-x: scroll;
	overflow-y: hidden;
}

.childFeatureDivCss {
	width: 10%;
	max-width: 116px;
	min-width: 75px;
	justify-content: center;
	flex: 20%;
	cursor: pointer;
}

.childFeatureCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

#instruction {
	display: none;
	width: 100%;
	position: absolute;
	z-index: 10;
	height: 100%;
	top: 50px;
	/* bottom: 33px; */
}

#instruction>img {
	display: block;
	margin: 0 auto;
	width: 270px;
}

#placeOrderDivContainer {
	width: 41%;
	height: 70vh;
	max-width: 400px;
	overflow-y: auto;
	overflow-x: hidden;
	left: 50%;
	transform: translateX(-50%);
	top: 11%;
	position: absolute;
	display: none;
	background: white;
}

#DropSummeryDivContainer {
	width: 100%;
	/* max-width: 450px; */
	height: 70vh;
	overflow-y: auto;
	overflow-x: hidden;
	/* left: 35%; */
	top: 10%;
	position: absolute;
	display: none;
	flex-wrap: nowrap;
	justify-content: center;
}

.placeOrderDivCss {
	/* width: 100%; */
	height: auto;
	margin: 0 auto;
	position: absolute;

}

.vehicleProductionNoteDivCss {
	width: 90%;
	max-width: 408px;
	height: auto;
	left: 50%;
	transform: translateX(-50%);
	top: 43.5%;
	margin: 0 auto;
	position: absolute;
	/* display: none !important; */
	display: none;
}

#vehicleProductionNoteAccept {
	width: 25%;
	position: absolute;
	top: 65%;
	right: 37.5%;
	cursor: pointer;
	display: none;
}

#placeOrderSticky {
	width: 41%;
	height: 40vh;
	max-width: 400px;
	overflow-y: auto;
	overflow-x: hidden;
	left: 50%;
	transform: translateX(-50%);
	top: 59%;
	position: absolute;
	/* display: none !important; */
	display: none;
}

.placeOrder2DivCss {
	width: 100%;
	top: 60% height: auto;
	margin: 0 auto;
	position: absolute;
}

.placeOrderCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

.placeOrderContinueDivCss {
	width: 80%;
	top: 66%;
	left: 10%;
	height: auto;
	position: absolute;
	cursor: pointer;
}

.placeOrderContinueCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

.placeOrderTickDivCss {
	width: 8%;
	top: 30%;
	left: 5%;
	height: auto;
	position: absolute;
	cursor: pointer;
	z-index: 978;

}

.placeOrderTickCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

.vehicleProductionNoteCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

.itemClass {
	position: absolute;
	width: 90%;
	top: 32%;
	left: 5%;
	height: auto;
	display: block;
}

#DropSummeryDivContainer .placeOrderDivCss .itemClass {
	position: absolute;
	width: 90%;
	top: 38%;
	left: 5%;
	height: auto;
	display: block;
}

#DropSummeryDivContainer #DropSummeryBackground .itemClass .PriceItemDivContainer {
	height: 40px;
}

.PriceItemDivContainer {
	width: 100%;
	position: relative;
	height: 30px;
}

.item_1CSS {
	height: auto;
	width: 100%;
	margin: 0 auto;
	position: absolute;
}

.itemPriceDivCss {
	width: 30%;
	left: 65%;
	margin-top: 5%;
	height: auto;
	text-align: right;
	color: #141B4D;
	position: absolute;
	font-family: gilroybold;
}

.itemValueDivCss {
	width: 30%;
	left: 33%;
	margin-top: 5%;
	height: auto;
	color: #141B4D;
	position: absolute;
}

.placeOrderDivCss .itemClass .PriceItemDivContainer .itemValueDivCss {
	margin-top: 5.3%;
}

.ExShowroomCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

.DynamicPackageDivCss {
	width: 80%;
	top: 35%;
	left: 73%;
	height: auto;
	position: absolute;

}

.DynamicPackageCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

.DynamicProPackageDivCss {
	width: 80%;
	top: 40%;
	left: 73%;
	height: auto;
	position: absolute;

}

.DynamicProPackageCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

.AlloyWheelColorDivCss {
	width: 80%;
	top: 46%;
	left: 73%;
	height: auto;
	position: absolute;
	cursor: pointer;

}

.AlloyWheelColorCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

.RaceReplicaDivCss {
	width: 80%;
	top: 52%;
	left: 73%;
	height: auto;
	position: absolute;
	cursor: pointer;

}

.RaceReplicaCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

.FavouriteNumberDivCss {
	width: 80%;
	top: 58%;
	left: 73%;
	height: auto;
	position: absolute;
	cursor: pointer;

}

.FavouriteNumberCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

.AvailableBookingDivCss {
	width: 20%;
	top: 25.8%;
	left: 69%;
	height: auto;
	position: absolute;
	font-size: 0.9em;
	color: red;
}

.AvailableBookingDivCss2 {
	width: 20%;
	top: 24.6%;
	left: 67%;
	height: auto;
	position: absolute;
	font-size: 1em;
	color: red;
}

#policyIframesCross {
	width: 5%;
	height: 5%;
	top: 0%;
	right: 0%;
	position: absolute;
	z-index: 898;
}

#policyIframes {
	width: 80%;
	height: 80%;
	top: 10%;
	left: 10%;
	position: absolute;
	z-index: 896;
	display: none;
	background-color: white;
}

#policyBtn {
	width: 20%;
	height: 6%;
	top: 35%;
	left: 43%;
	position: absolute;
	cursor: pointer;
}

#disclaimerIframesCross {
	width: 5%;
	height: 5%;
	top: -1%;
	right: -1%;
	position: absolute;
	z-index: 898;
}

#disclaimerIframes {
	width: 80%;
	height: 80%;
	top: 10%;
	left: 10%;
	position: absolute;
	z-index: 896;
	display: none;
	background-color: white;
}

#disclaimerBtn {
	width: 20%;
	height: 6%;
	top: 35%;
	left: 23%;
	position: absolute;
	cursor: pointer;
}

#cancelIframesCross {
	width: 5%;
	height: 5%;
	top: -1%;
	right: -1%;
	position: absolute;
	z-index: 898;
}

#cancelIframes {
	width: 80%;
	height: 80%;
	top: 10%;
	left: 10%;
	position: absolute;
	z-index: 896;
	display: none;
	background-color: white;
}

#cancelBtn {
	width: 26%;
	height: 6%;
	top: 35%;
	left: 69%;
	position: absolute;
	cursor: pointer;
}

.TotalDivCss {
	width: 80%;
	top: 5%;
	left: 72%;
	height: auto;
	position: absolute;
}

.TotalDivCss2 {
	width: 80%;
	top: 89%;
	left: 75%;
	font-size: 18px;
	height: auto;
	position: absolute;
	font-family: gilroybold;

}

.TotalDivCss1 {
	top: 30%;
	left: 59%;
	height: auto;
	background: white;
	position: absolute;
	font-family: gilroybold;
	color: #0D0146;
	font-size: 20px;
}

.TotalCss {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

#kitpopup {
	width: 30%;
	max-width: 400px;
	position: absolute;
	left: 35%;
	top: 30%;
	display: none;
}

.kitpopupBackgroundCSS {
	width: 100%;
	position: absolute;
}

.kitpopupConfirmCSS {
	width: 50%;
	position: absolute;
	margin-top: 41%;
	left: 25%
}

.kitpopupCrossCSS {
	width: 6%;
	position: absolute;
	margin-top: 6%;
	left: 87%
}

.kitpopupBackgroundCSS {
	width: 100%;
	position: absolute;
}

.kitpopupCSS {
	height: auto;
	width: 100%;
	margin: 0 auto;
}

.NameEditDivCss {
	width: 13%;
	top: 62%;
	left: 64%;
	position: absolute;
	display: none;
	z-index: 896;
	cursor: pointer;
}

.NameEditCss {
	width: 100%;
	height: auto;
	margin: 0 auto;
}

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

	/*for mobile ; for desktop use 'landscape' */
	@media (orientation: portrait) {
		#DropSummeryDivContainer .placeOrderDivCss .itemClass {
			top: 37%;
		}

		#DropSummeryDivContainer #DropSummeryBackground .itemClass .PriceItemDivContainer {
			height: 30px;
		}

		.TotalDivCss2 {
			top: 88%;
			left: 69%;
		}

		.placeOrderDivCss .itemClass .PriceItemDivContainer .itemValueDivCss {
			margin-top: 4.5%;
			font-size: 14px;
		}

		.TotalDivCss {
			width: 80%;
			top: 5%;
			left: 64%;
			height: auto;
			position: absolute;
		}

		.itemClass {
			position: absolute;
			width: 90%;
			top: 39%;
			left: 5%;
			height: auto;
			display: block;
		}

		.itemPriceDivCss {
			margin-top: 3%;
		}

		.itemValueDivCss {
			width: 30%;
			left: 33%;
			margin-top: 3%;
			height: auto;
			color: #141B4D;
			position: absolute;

		}

		#bookingalert {
			width: 81%;
			position: absolute;
			top: 29%;
			left: 52%;
			-ms-transform: translateX(-50%);
			transform: translateX(-50%);
			z-index: 899;
			display: none;
		}

		#bookingalertImage {
			width: 100%;
			height: auto;
		}

		#kitflow {
			position: absolute;
			margin-left: auto;
			margin-right: auto;
			z-index: 920;
			width: 21%;
			top: -98%;
			left: 8%;
		}

		#racenoflow {
			position: absolute;
			margin-left: auto;
			margin-right: auto;
			z-index: 920;
			width: 22%;
			top: -125%;
			left: 72%;
		}

		#cancelIframesCross {
			width: 12%;
			height: 5%;
			top: 0%;
			right: 3%;
			position: absolute;
			z-index: 898;
		}

		#disclaimerIframesCross {
			width: 12%;
			height: 5%;
			top: 0%;
			right: 3%;
			position: absolute;
			z-index: 898;
		}

		#background {
			width: 100%;
			height: 100vh;
			top: 0%;
			position: absolute;
			display: flex;
			background-image: url("./preprodAssets/newicon/mobile.jpg");
			background-repeat: round;
			background-size: contain;
		}

		#InteractiveContainer {
			width: 100%;
			position: absolute;
			bottom: 4%;
			display: block;
			justify-content: center;
			margin: 4px auto;
		}

		#showKitDynamicAlert {
			width: 84%;
			max-width: 400px;
			display: none;
			-ms-transform: translateX(-50%);
			transform: translateX(-50%);
			position: absolute;
			left: 50%;
			top: 30vh;
			z-index: 810;
		}

		#showKitRaceAlert {
			width: 84%;
			max-width: 400px;
			display: none;
			-ms-transform: translateX(-50%);
			transform: translateX(-50%);
			position: absolute;
			left: 50%;
			top: 30vh;
			z-index: 810;
		}

		#m10c {
			width: 100%;
			font-size: 13px;
			text-align: center;
		}

		#policyIframesCross {
			width: 12%;
			height: 5%;
			top: 0%;
			right: 0%;
			position: absolute;
			z-index: 898;
		}
		/* .saveConfiguratorParentDiv2 {
			display: none;
		} */

		#toggleContainer {
			position: absolute;
			width: 15%;
			max-width: 70px;
			max-height: 60px;
			min-height: 45px;
			right: 9%;
			margin-left: auto;
			margin-right: auto;
			top: 30px;
			display: block;
		}

		.parentIconDivCss {
			width: 30%;
			max-width: 86px;
			height: auto;
			margin: 0 auto;
		}

		#interactiveChildColorDivContainer {
			width: 75%;
			left: 50%;
			top: -57%;
			position: absolute;
			transform: translateX(-50%);
			display: flex;
			column-gap: 2px;
			justify-content: center;
		}

		#DropSummeryDivContainer {
			width: 93%;
			height: 60vh;
			left: 4%;
			top: 16%;
			position: absolute;
			display: none;
		}

		#interactiveIconDivContainer {
			width: 100%;
			left: 50%;
			position: relative;
			display: flex;
			column-gap: 2px;
			justify-content: center;
		}

		#interactiveChildFeatureDivContainer {
			width: 90%;
			left: 50%;
			transform: translateX(-50%);
			position: relative;
			display: flex;
			column-gap: 2px;
			justify-content: left;
			flex-flow: row;
			-webkit-flex-flow: row;
			-moz-flex-flow: inherit;
			overflow-x: scroll;
			overflow-y: hidden;
		}

		.childFeatureDivCss {
			width: 10%;
			max-width: 116px;
			min-width: 75px;
			justify-content: center;
			flex: 20%;
		}

		.childFeatureCss {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}

		#TopMiddleContainer {
			position: absolute;
			width: 90%;
			max-height: 50px;
			min-height: 5px;
			height: auto;
			left: 5%;
			z-index: 10;
			margin-left: auto;
			margin-right: auto;
			top: 100px;
			display: flex;
		}

		.TopMiddleDivCss {
			height: auto;
			min-height: 5px;
			width: 100%;
			margin: 0 auto;
		}

		.TopMiddleCss {
			height: auto;
			max-height: 100px;
			min-height: 5px;
			width: 100%;
			margin: 0 auto;
		}

		#TopMiddleChildDivContainer {
			width: 90%;
			left: 50%;
			transform: translateX(-50%);
			top: 20vh;
			height: 46vh;
			position: absolute;
			display: block;
			overflow-y: auto;
			overflow-x: hidden;
			column-gap: 20px;
			justify-content: center;
			margin: 0 auto;
		}

		.TopMiddleChildDivCss {
			width: 100%;
			height: auto;
			margin: 0 auto;
		}

		.TopMiddleChildCss {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}

		#interactiveChildWheelColorDivContainer {
			width: 23%;
			position: absolute;
			top: -57;
			left: 85%;
			transform: translateX(-50%);
			display: flex;
			column-gap: 2px;
			justify-content: center;
		}

		.childWheelColorDivCss {
			width: 100%;
			max-width: 50px;
			min-width: 20px height: auto;
			justify-content: center;
		}

		.childWheelColorCss {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}

		#featureCalloutParentDiv {
			width: 90%;
			left: 5%;
			position: absolute;
			display: flex;
			top: 50%;
			max-width: 350px;
			column-gap: 20px;
			justify-content: center;
			margin: 0 auto;
			z-index: 800;
		}

		#featureCalloutDivContainer {
			width: 100%;
			position: absolute;
			bottom: 0;
			overflow-y: auto;
			overflow-x: hidden;
			max-height: 40vh;
			display: flex;
			column-gap: 20px;
			justify-content: center;

		}

		.featureCalloutDivCss {
			width: 100%;
			height: auto;
			margin: 0 auto;
			scroll-behavior: smooth;
		}

		#raceNumberSelectorParentDiv {
			width: 106%;
			top: 150px;
			position: absolute;
			display: flex;
			column-gap: 20px;
			justify-content: center;
			margin: 0 auto;
			z-index: 800;
		}

		#raceNumberBackgroundDivContainer {
			width: 80%;
			left: 10%;
			top: 10%;
			position: absolute;
			display: block;
		}

		.raceNumberBackgroundDivCss {
			width: 100%;
			height: auto;
			margin: 0 auto;
		}

		.raceNumberBackgroundCss {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}


		#saveConfiguratorParentDiv {
			width: 80%;
			left: 10%;
			top: 150px;
			position: absolute;
			display: none;
			column-gap: 20px;
			justify-content: center;
			margin: 0 auto;
			z-index: 800;
		}

		#saveConfiguratorListParentDiv {
			width: 100%;
			height: 30vh;
			left: 0%;
			top: 150px;
			background-color: white;
			position: absolute;
			display: none;
			flex-direction: column;
			column-gap: 20px;
			overflow-y: auto;
			overflow-x: hidden;
			justify-content: left;
			margin: 0 auto;
			z-index: 800;
		}

		#configurationListParent {
			width: 90%;
			left: 5%;
			position: relative;
			display: flex;
			flex-direction: column;
			column-gap: 20px;
			justify-content: center;

			z-index: 89;
		}

		.saveConfigurationClassDiv {
			width: 80%;
			left: 10%;
			position: relative;
			display: block;
			z-index: 89;
		}

		.saveConfigurationClassCSS {
			width: 100%;
			height: auto;
			margin: 0 auto;
		}

		.saveConfigurationNameDivCss {
			width: 30%;
			top: 63%;
			left: 33%;
			margin-top: 2%;
			position: absolute;
			font-size: 0.8em;
			display: block;
			z-index: 89;
		}

		.NameEditDivCss {
			width: 15%;
			top: 55%;
			left: 54%;
			margin-top: 2%;
			position: absolute;
			display: block;
			z-index: 896;
		}

		.NameEditCss {
			width: 100%;
			height: auto;
			margin: 0 auto;
		}

		.saveConfigurationPriceDivCss {
			width: 90%;
			top: 20%;
			left: 5%;
			margin-top: 5%;
			position: absolute;
			display: block;
			z-index: 89;
		}

		.saveConfigurationPriceCss {
			width: 100%;
			height: auto;
			margin: 0 auto;
		}

		.saveConfigurationIconsDivCss {
			width: 90%;
			top: 70%;
			left: 5%;
			margin-top: 5%;
			position: absolute;
			display: flex;
			z-index: 89;
		}

		.saveConfigurationIconsCss {
			width: 30%;
			margin-left: 2%;
			height: auto;
		}


		.closeListDivCSS {
			width: 8%;
			left: 5%;
			position: relative;
			display: block;
			z-index: 895;
		}

		.closeListCSS {
			width: 100%;
			height: auto;
			margin: 0 auto;
		}

		.addNewDivCSS {
			width: 40%;
			left: 30%;
			top: 5%;
			margin-top: 5%;
			position: relative;
			display: block;
			z-index: 89;
		}

		.addNewCSS {
			width: 100%;
			height: auto;
			margin: 0 auto;
		}

		#saveConfiguratorBackgroundDivContainer {
			width: 100%;
			left: 0%;
			top: 0%;
			position: absolute;
			display: block;
		}

		.saveConfiguratorBackgroundDivCss {
			width: 100%;
			height: auto;
			margin: 0 auto;
		}

		.saveConfiguratorBackgroundCss {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}

		#tftConsleDivContainer {
			width: 50%;
			max-width: 200px;
			left: 25%;
			top: 63%;
			position: absolute;
			display: flex;
			flex-direction: column;
		}

		.tftConsleDivCss {
			width: 100%;
			height: auto;
			margin-top: -7px;
		}

		.tftConsleCss {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}

		#tftConsleDNDivContainer {
			width: 40%;
			max-width: 50px;
			left: 86%;
			top: 66%;
			position: absolute;
			display: flex;
			flex-direction: column;
		}

		.tftConsleDNDivCss {
			width: 100%;
			height: auto;
			margin-top: -4px;
		}

		.tftConsleDNCss {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}

		#tftConsleScreenDivContainer {
			width: 70%;
			left: 50%;
			transform: translateX(-50%);
			top: 14%;
			position: absolute;
			display: block;
		}

		.tftConsleScreenDivCss {
			width: 100%;
			height: auto;
			margin-top: -4px;
		}

		.tftConsleScreenCss {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}

		#saveConfiguratorHeadingDivContainer {
			width: 70%;
			left: 15%;
			margin-top: 10%;
			position: absolute;
			display: block;
		}

		#saveConfiguratorHeadingDivContainer2 {
			width: 70%;
			left: 15%;
			margin-top: 10%;
			position: absolute;
			display: block;
		}

		#saveConfiguratorParentDiv2 {
			display: none;
		}

		.saveConfiguratorHeadingDivCss {
			width: 100%;
			height: auto;
			margin: 0 auto;
		}

		.saveConfiguratorHeadingCss {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}

		.saveConfiguratorConfigNameDivCss {
			width: 100%;
			height: auto;
			margin: 0 auto;
			justify-content: center;
			font-size: 2em;
			text-align: center;
			color: #141B4D;
		}

		.SaveConfigurationTickCSS {
			width: 30%;
			height: auto;
			margin-left: 35%;
			justify-content: center;
		}

		#SaveConfigurationTick_img {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}



		.SaveConfigurationSavedSuccessfullyCSS {
			width: 40%;
			height: auto;
			margin-top: 0%;
			margin-left: 30%;
			justify-content: center;
		}

		#SaveConfigurationSavedSuccessfully_img {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}

		.SaveConfigurationContinueCSS {
			width: 40%;
			height: auto;
			margin-top: 0%;
			margin-left: 30%;
			justify-content: center;
		}

		#SaveConfigurationContinue_img {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}

		.SaveConfigurationSavedConfigCSS {
			width: 50%;
			height: auto;
			margin-top: 5%;
			margin-left: 25%;
			justify-content: center;
		}

		#SaveConfigurationSavedConfig_img {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}


		#saveConfiguratorCrossDivContainer {
			width: 5%;
			margin-top: 6%;
			margin-left: 80%;
			position: absolute;
			display: block;
		}

		.saveConfiguratorCrossDivCss {
			width: 100%;
			height: auto;
			margin: 0 auto;
		}

		.saveConfiguratorCrossCss {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}

		#saveConfiguratorNameBackDivContainer {
			width: 80%;
			margin-top: 20%;
			position: absolute;
			display: block;
		}

		.saveConfiguratorNameBackDivCss {
			width: 100%;
			height: auto;
			margin: 0 auto;
		}

		.saveConfiguratorNameBackCss {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}

		#saveConfiguratorNameParentDivContainer {
			width: 70%;
			margin-top: 24%;
			margin-left: 0%;
			font-size: 3em;
			position: absolute;
			display: block;
		}

		#saveConfiguratorNameDivContainer {
			width: 100%;
			display: none;
			height: 6vh;
			padding: 8px 12px;
			box-sizing: border-box;
			font-size: 3vh;
			border: 2px solid #ccc;
			border-radius: 4px;
			background-color: #f8f8f8;
		}

		.saveConfiguratorNameDivCss {
			width: 100%;
			height: auto;
			margin: 0 auto;

		}

		.saveConfiguratorNameCss {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}

		#saveConfiguratorSaveDivContainer {
			width: 30%;
			left: 35%;
			margin-top: 50%;
			position: absolute;
			display: block;
		}

		.saveConfiguratorSaveDivCss {
			width: 100%;
			height: auto;
			margin: 0 auto;
		}

		.inactive {
			-webkit-filter: grayscale(100%) invert(20%);
			-moz-filter: grayscale(100%) invert(20%);
			-o-filter: grayscale(100%) invert(20%);
			-ms-filter: grayscale(100%) invert(20%);
			filter: grayscale(100%) invert(20%);
		}

		.saveConfiguratorSaveCss {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}

		#placeOrderDivContainer {
			width: 82%;
			height: 60vh;
			overflow-y: auto;
			overflow-x: hidden;
			left: 50%;
			transform: translateX(-50%);
			top: 18%;
			position: absolute;
			display: none;
		}

		#placeOrderSticky {
			width: 82%;
			height: 40vh;
			max-width: 400px;
			overflow-y: auto;
			overflow-x: hidden;
			left: 50%;
			transform: translateX(-50%);
			top: 59%;
			position: absolute;
			/* display: none !important; */
			display: none;
		}

		#DropSummeryDivContainer {
			width: 93%;
			height: 60vh;
			overflow-y: auto;
			overflow-x: hidden;
			left: 4%;
			top: 16%;
			position: absolute;
			display: none;
		}

		#TopLeftContainer {
			position: absolute;
			width: 30%;
			max-width: 140px;
			max-height: 60px;
			left: 0%;
			margin-left: auto;
			margin-right: auto;
			top: 30px;
			/* display: none; */
		}

		#TopRightContainer {
			position: absolute;
			width: 30%;
			max-width: 140px;
			max-height: 60px;
			right: 20%;
			margin-left: auto;
			margin-right: auto;
			top: 30px;
			display: flex;
		}

		#backgroundImage {
			width: 120%;
			height: auto;
			position: absolute;
			top: 19%;
			left: 50%;

			-ms-transform: translateX(-50%);
			transform: translateX(-50%);
		}

		#backgroundImage2 {
			width: auto;
			height: 90vh;
			position: absolute;
			left: 50%;
			-ms-transform: translateX(-50%);
			transform: translateX(-50%);
		}

		.vehicleProductionNoteDivCss {
			width: 90%;
			max-width: 297px;
			height: auto;
			left: 50%;
			transform: translateX(-50%);
			top: 48%;
			margin: 0 auto;
			position: absolute;
			/* display: none !important; */
			display: none;
		}

		.TotalDivCss1 {
			top: 26%;
			left: 62%;
			font-size: 16px;
		}

		.scroll-container {
			top: 12px;
			left: 4px;
		}

		.scroll-page {
			font-size: 3em;
		}
	}

	@media (orientation: landscape) {
		#cancelIframesCross {
			width: 6%;
			height: 5%;
			top: 0%;
			right: 2%;
			position: absolute;
			z-index: 898;
		}

		#disclaimerIframesCross {
			width: 6%;
			height: 5%;
			top: 0%;
			right: 2%;
			position: absolute;
			z-index: 898;
		}

		#m10c {
			width: 100%;
			font-size: 13px;
			text-align: center;
		}

		#policyIframesCross {
			width: 7%;
			height: 5%;
			top: 0%;
			right: 0%;
			position: absolute;
			z-index: 898;
		}

		#backgroundImage {
			width: 48%;
			height: auto;
			position: absolute;
			top: 19%;
			left: 50%;

			-ms-transform: translateX(-50%);
			transform: translateX(-50%);
		}

		.saveConfigurationNameInputDivCss {
			width: 100%;
			display: none;
			height: 3.2vh;
			padding: 2px 2px;
			box-sizing: border-box;
			font-size: 2.2vh;
			border: 2px solid #ccc;
			border-radius: 4px;
			background-color: #f8f8f8;
		}

		.NameEditDivCss {
			width: 15%;
			top: -5%;
			left: 33%;
			margin-top: 2%;
			position: absolute;
			display: block;
			z-index: 896;
		}

		.NameEditCss {
			width: 100%;
			height: auto;
			margin: 0 auto;
		}

		#backgroundImage2 {
			width: auto;
			height: 100vh;
			position: absolute;
			left: 50%;
			-ms-transform: translateX(-50%);
			transform: translateX(-50%);
		}

		.parentIconDivCss {
			width: 20%;
			max-width: 60px;
			height: auto;
			margin: 0 auto;
		}

		.childKitDivCss {
			width: 100%;
			max-width: 92px;
			min-width: 20px height: auto;
			justify-content: center;
		}

		#placeOrderDivContainer {
			width: 300px;
			height: 50vh;
			overflow-y: auto;
			overflow-x: hidden;
			left: 50%;
			transform: translateX(-50%);
			top: 21%;
			position: absolute;
			display: none;
		}

		#DropSummeryDivContainer {
			width: 300px;
			height: 50vh;
			overflow-y: auto;
			overflow-x: hidden;
			left: 50%;
			margin-left: -150px;
			top: 21%;
			position: absolute;
			display: none;
			pointer-events: none;
		}

		#toggleContainer {
			position: absolute;
			width: 15%;
			max-width: 70px;
			max-height: 60px;
			min-height: 45px;
			right: 5%;
			margin-left: auto;
			margin-right: auto;
			top: 30px;
			display: block;
		}

		#TopLeftContainer {
			position: absolute;
			width: 30%;
			max-width: 120px;
			max-height: 60px;
			left: -1%;
			margin-left: auto;
			margin-right: auto;
			top: 30px;
			/* display: none; */
		}

		#TopRightContainer {
			position: absolute;
			width: 30%;
			max-width: 120px;
			max-height: 60px;
			right: 12%;
			margin-left: auto;
			margin-right: auto;
			top: 30px;
			display: flex;
		}

		#interactiveIconDivContainer {
			width: 100%;
			position: relative;
			left: 50%;
			display: flex;
			column-gap: 2px;
			justify-content: center;
		}

		#interactiveChildFeatureDivContainer {
			width: 90%;
			left: 50%;
			transform: translateX(-50%);
			position: relative;
			display: flex;
			column-gap: 2px;
			justify-content: left;
			flex-flow: row;
			-webkit-flex-flow: row;
			-moz-flex-flow: inherit;
			overflow-x: scroll;
			overflow-y: hidden;
		}

		.childFeatureDivCss {
			width: 10%;
			max-width: 116px;
			min-width: 75px;
			justify-content: center;
			flex: 20%;
		}

		.childFeatureCss {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}

		#TopMiddleContainer {
			position: absolute;
			width: 58%;
			max-height: 60px;
			min-height: 5px;
			height: auto;
			left: 11%;
			z-index: 10;
			margin-left: auto;
			margin-right: auto;
			top: 30px;
			display: flex;
		}

		.TopMiddleDivCss {
			height: auto;
			max-height: 50px;
			min-height: 5px;
			width: 100%;
			margin: 0 auto;
		}

		.TopMiddleCss {
			height: auto;
			max-height: 60px;
			min-height: 5px;
			width: 100%;
			margin: 0 auto;
		}

		#TopMiddleChildDivContainer {
			width: 30%;
			left: 50%;
			transform: translateX(-50%);
			height: 50vh;
			overflow-y: auto;
			overflow-x: hidden;
			top: 17vh;
			position: absolute;
			display: block;
			column-gap: 20px;
			justify-content: center;
			margin: 0 auto;
		}

		.TopMiddleChildDivCss {
			width: 100%;
			height: auto;
			margin: 0 auto;
		}

		.TopMiddleChildCss {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}

		#interactiveChildWheelColorDivContainer {
			width: 23%;
			position: absolute;
			top: -57;
			left: 65%;
			transform: translateX(-50%);
			display: flex;
			column-gap: 2px;
			justify-content: center;
		}

		.childWheelColorDivCss {
			width: 100%;
			max-width: 25px;
			min-width: 20px height: auto;
			justify-content: center;
		}

		.childWheelColorCss {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}

		#featureCalloutParentDiv {
			width: 80%;
			left: -10%;
			max-width: 550px;
			top: 44%;
			position: absolute;
			display: flex;
			column-gap: 20px;
			justify-content: center;
			margin: 0 auto;
			z-index: 800;
		}

		#featureCalloutDivContainer {
			width: 40%;
			max-height: 40vh;
			margin-top: -14%;
			position: absolute;
			display: flex;
			overflow-y: auto;
			overflow-x: hidden;
			column-gap: 20px;
			justify-content: center;

		}

		.featureCalloutDivCss {
			width: 100%;
			height: auto;
			margin: 0 auto;
			scroll-behavior: smooth;
		}

		#raceNumberSelectorParentDiv {
			width: 110%;
			left: 34%;
			top: 68%;
			position: absolute;
			display: flex;
			column-gap: 20px;
			justify-content: center;
			margin: 0 auto;
			z-index: 800;
		}

		#raceNumberBackgroundDivContainer {
			width: 40%;
			left: 30%;
			margin-top: -18%;
			position: absolute;
			display: block;
		}

		.raceNumberBackgroundDivCss {
			width: 100%;
			height: auto;
			margin: 0 auto;
		}

		.raceNumberBackgroundCss {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}


		#saveConfiguratorParentDiv {
			width: 30%;
			left: 35%;
			top: 90px;
			position: absolute;
			display: none;
			column-gap: 20px;
			justify-content: center;
			margin: 0 auto;
			z-index: 800;
		}

		#saveConfiguratorListParentDiv {
			width: 30%;
			height: 30vh;
			left: 35%;
			top: 90px;
			background-color: white;
			position: absolute;
			display: none;
			flex-direction: column;
			column-gap: 20px;
			overflow-y: auto;
			overflow-x: hidden;
			justify-content: left;
			margin: 0 auto;
			z-index: 800;
		}

		#configurationListParent {
			width: 90%;
			left: 5%;
			position: relative;
			display: flex;
			flex-direction: column;
			column-gap: 20px;
			justify-content: center;

			z-index: 89;
		}

		.saveConfigurationClassDiv {
			width: 80%;
			left: 10%;
			position: relative;
			display: block;
			z-index: 89;
		}

		.saveConfigurationClassCSS {
			width: 100%;
			height: auto;
			margin: 0 auto;
		}

		.saveConfigurationNameDivCss {
			width: 30%;
			top: 5%;
			left: 5%;
			margin-top: 2%;
			position: absolute;
			font-size: 3vh;
			display: block;
			z-index: 89;
		}

		.saveConfigurationPriceDivCss {
			width: 90%;
			top: 20%;
			left: 5%;
			margin-top: 5%;
			position: absolute;
			display: block;
			z-index: 89;
		}

		.saveConfigurationPriceCss {
			width: 100%;
			height: auto;
			margin: 0 auto;
		}

		.saveConfigurationIconsDivCss {
			width: 90%;
			top: 50%;
			left: 5%;
			margin-top: 5%;
			position: absolute;
			display: flex;
			z-index: 89;
		}

		.saveConfigurationIconsCss {
			width: 30%;
			margin-left: 2%;
			height: auto;
		}


		.closeListDivCSS {
			width: 5%;
			left: 5%;
			position: relative;
			display: block;
			z-index: 895;
		}

		.closeListCSS {
			width: 100%;
			height: auto;
			margin: 0 auto;
		}

		.addNewDivCSS {
			width: 40%;
			left: 30%;
			top: 5%;
			margin-top: 5%;
			position: relative;
			display: block;
			z-index: 89;
		}

		.addNewCSS {
			width: 100%;
			height: auto;
			margin: 0 auto;
		}

		#saveConfiguratorBackgroundDivContainer {
			width: 100%;
			left: 0%;
			top: 0%;
			position: absolute;
			display: block;
		}

		.saveConfiguratorBackgroundDivCss {
			width: 100%;
			height: auto;
			margin: 0 auto;
		}

		.saveConfiguratorBackgroundCss {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}

		#tftConsleDivContainer {
			width: 50%;
			max-width: 130px;
			left: 63%;
			top: 65%;
			position: absolute;
			display: flex;
			flex-direction: column;
		}

		.tftConsleDivCss {
			width: 100%;
			height: auto;
			margin-top: -5px;
		}

		.tftConsleCss {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}

		#tftConsleDNDivContainer {
			width: 40%;
			max-width: 43px;
			left: 85%;
			top: 68%;
			position: absolute;
			display: flex;
			flex-direction: column;
		}

		.tftConsleDNDivCss {
			width: 100%;
			height: auto;
			margin-top: -4px;
		}

		.tftConsleDNCss {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}

		#tftConsleScreenDivContainer {
			width: 21%;
			right: 18%;
			top: 20%;
			position: absolute;
			display: block;
		}

		.tftConsleScreenDivCss {
			width: 100%;
			height: auto;
			margin-top: -4px;
		}

		.tftConsleScreenCss {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}

		#saveConfiguratorHeadingDivContainer {
			width: 70%;
			left: 15%;
			margin-top: 10%;
			position: absolute;
			display: block;
		}

		#saveConfiguratorHeadingDivContainer2 {
			width: 70%;
			left: 15%;
			margin-top: 10%;
			position: absolute;
			display: block;
		}

		#saveConfiguratorParentDiv2 {
			display: none;
		}

		.saveConfiguratorHeadingDivCss {
			width: 100%;
			height: auto;
			margin: 0 auto;
		}

		.saveConfiguratorHeadingCss {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}

		.saveConfiguratorConfigNameDivCss {
			width: 100%;
			height: auto;
			margin: 0 auto;
			justify-content: center;
			font-size: 2em;
			text-align: center;
			color: #141B4D;
		}

		.SaveConfigurationTickCSS {
			width: 30%;
			height: auto;
			margin-left: 35%;
			justify-content: center;
		}

		#SaveConfigurationTick_img {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}



		.SaveConfigurationSavedSuccessfullyCSS {
			width: 40%;
			height: auto;
			margin-top: 0%;
			margin-left: 30%;
			justify-content: center;
		}

		#SaveConfigurationSavedSuccessfully_img {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}

		.SaveConfigurationContinueCSS {
			width: 40%;
			height: auto;
			margin-top: 0%;
			margin-left: 30%;
			justify-content: center;
		}

		#SaveConfigurationContinue_img {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}

		.SaveConfigurationSavedConfigCSS {
			width: 50%;
			height: auto;
			margin-top: 5%;
			margin-left: 25%;
			justify-content: center;
		}

		#SaveConfigurationSavedConfig_img {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}


		#saveConfiguratorCrossDivContainer {
			width: 5%;
			margin-top: 6%;
			margin-left: 80%;
			position: absolute;
			display: block;
		}

		.saveConfiguratorCrossDivCss {
			width: 100%;
			height: auto;
			margin: 0 auto;
		}

		.saveConfiguratorCrossCss {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}

		#saveConfiguratorNameBackDivContainer {
			width: 80%;
			margin-top: 20%;
			position: absolute;
			display: block;
		}

		.saveConfiguratorNameBackDivCss {
			width: 100%;
			height: auto;
			margin: 0 auto;
		}

		.saveConfiguratorNameBackCss {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}

		#saveConfiguratorNameParentDivContainer {
			width: 70%;
			margin-top: 30%;
			margin-left: 0%;
			font-size: 3em;
			position: absolute;
			display: block;
		}

		#saveConfiguratorNameDivContainer {
			width: 100%;
			display: none;
			height: 6vh;
			padding: 8px 12px;
			box-sizing: border-box;
			font-size: 3vh;
			border: 2px solid #ccc;
			border-radius: 4px;
			background-color: #f8f8f8;
		}

		.saveConfiguratorNameDivCss {
			width: 100%;
			height: auto;
			margin: 0 auto;

		}

		.saveConfiguratorNameCss {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}

		#saveConfiguratorSaveDivContainer {
			width: 30%;
			left: 35%;
			margin-top: 55%;
			position: absolute;
			display: block;
		}

		.saveConfiguratorSaveDivCss {
			width: 100%;
			height: auto;
			margin: 0 auto;
		}

		.inactive {
			-webkit-filter: grayscale(100%) invert(20%);
			-moz-filter: grayscale(100%) invert(20%);
			-o-filter: grayscale(100%) invert(20%);
			-ms-filter: grayscale(100%) invert(20%);
			filter: grayscale(100%) invert(20%);
		}

		.saveConfiguratorSaveCss {
			height: auto;
			width: 100%;
			margin: 0 auto;
		}
	}
}

@media only screen and (max-width: 1920px) and (min-width: 1800px) and (max-height: 1000px) and (min-height: 900px) {
	#kitflow {
		/* bottom: 80px; */
		position: absolute;
		margin-left: auto;
		margin-right: auto;
		z-index: 920;
		width: 9%;
		top: -200%;
		left: 40%;
	}

	#racenoflow {
		/* bottom: 80px; */
		position: absolute;
		margin-left: auto;
		margin-right: auto;
		z-index: 920;
		width: 9%;
		top: -260%;
		left: 52%;
	}

}

#BikeBlackWheelRed {
	display: none;
}

.wrapper {
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: 100vh;
}

.qr-container {
	background-color: white;
	padding: 30px;
	border-radius: 15px;
	box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
	position: relative;
	text-align: center;
	max-width: 300px;
	width: 100%;
	display: none;
	z-index: 20;
}

.close-icon {
	position: absolute;
	top: 5px;
	right: 10px;
	cursor: pointer;
	font-size: 24px;
	color: #888;
	transition: color 0.3s;
}

.close-icon:hover {
	color: #333;
}

#qrcode {
	margin-bottom: 20px;
}

#qrcode img {
	border: 1px solid #ddd;
	border-radius: 10px;
	padding: 10px;
	width: 250px;
	height: 250px;
}

.text {
	font-weight: bold;
	margin-bottom: 20px;
	color: #333;
	font-size: 16px;
	line-height: 1.4;
}

.copy-button {
	background-color: #2196F3;
	border: none;
	color: white;
	padding: 12px 24px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	font-size: 16px;
	margin: 4px 2px;
	cursor: pointer;
	border-radius: 50px;
	transition: all 0.3s;
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.copy-button:hover {
	background-color: #0069bd;
	transform: translateY(-2px);
	box-shadow: 0 6px 8px rgba(0, 0, 0, 0.15);
}

.copy-button:active {
	transform: translateY(0);
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.copy-button.copied {
	background-color: #2196F3;
}

.copy-button.error {
	background-color: #f44336;
}

.tooltip {
	position: relative;
	display: inline-block;
}

.tooltip .tooltiptext {
	visibility: hidden;
	width: 140px;
	background-color: #555;
	color: #fff;
	text-align: center;
	border-radius: 6px;
	padding: 5px;
	position: absolute;
	z-index: 1;
	bottom: 150%;
	left: 50%;
	margin-left: -70px;
	opacity: 0;
	transition: opacity 0.3s;
}

.tooltip .tooltiptext::after {
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -5px;
	border-width: 5px;
	border-style: solid;
	border-color: #555 transparent transparent transparent;
}

model-viewer {
	width: 0px;
	height: 0px;
}

#start-ar-button {
	padding: 12px 24px;
	font-size: 18px;
	color: #fff;
	background-color: #1e90ff;
	/* Dodger blue */
	border: none;
	border-radius: 5px;
	cursor: pointer;
	transition: background-color 0.3s ease;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

#start-ar-button:hover {
	background-color: #4682b4;
	/* Steel blue */
}

.popup {
	display: none;
	justify-content: center;
	align-items: center;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.4);
	z-index: 1000;
}

.popup-content {
	background-color: #fff;
	padding: 30px;
	border-radius: 10px;
	text-align: center;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
	width: 300px;
}

.popup-content p {
	font-size: 18px;
	color: #333;
	margin-bottom: 25px;
}

.popup-content button {
	padding: 10px 20px;
	font-size: 16px;
	margin: 0 10px;
	cursor: pointer;
	border: none;
	border-radius: 5px;
	transition: background-color 0.3s ease;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

#confirm-button {
	background-color: #1e90ff;
	/* Dodger blue */
	color: white;
}

#confirm-button:hover {
	background-color: #4682b4;
	/* Steel blue */
}

#cancel-button {
	background-color: #f0f8ff;
	/* Light blue */
	color: #333;
}

#cancel-button:hover {
	background-color: #b0c4de;
	/* Light steel blue */
}

.hidden {
	display: none;
}