#root {
	z-index: 2;
	position: absolute;
	top: 0px;
	left: 50px;
	display: none;
	border: none;
	height: 100%;
	padding-right: 1px;
	color: white;
}

#fadeInOut {
	width: 100vw;
	height: 100vh;
	display: block;
	z-index: 0;
	position: fixed;
	background: #000;
	opacity: 0;
}

#reset {
	display: none;
	position: absolute;
	z-index: 99;
	bottom: 13px;
	right: 10px;
	cursor: pointer;
	border: 1px solid #000;
	min-height: 65px;
	min-width: 65px;
	box-sizing: border-box;
	bottom: 13px;
	background: rgba(83, 83, 83, 0.65) url("./img/refresh-button.svg") center
		center no-repeat;
	background-size: 30px;
}

#openClose {
	display: none;
	position: absolute;
	z-index: 99;
	bottom: 13px;
	right: 10px;
	cursor: pointer;
	border: 1px solid #000;
	min-height: 65px;
	min-width: 65px;
	box-sizing: border-box;
	bottom: 85px;
	background: rgba(83, 83, 83, 0.65);
	background-size: 30px;
	user-select: none;
}

#footProntNote {
	display: none;
	position: absolute;
	z-index: 99;
	bottom: 13px;
	right: 100px;
	cursor: pointer;
	min-height: 65px;
	min-width: 65px;
	color: #7d7d7d;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	cursor: auto;
	user-select: none;
}

.logo_div img {
	/* width: 194px; */
	height: 65px;
}

#main {
	text-align: center;
	border: 1px solid #9a9a9a;
	width: 99.8%;
	display: flex;
}

#main div {
	-ms-flex: 1;
	/* IE 10 */
	flex: 1;
	border-right: 1px solid #9a9a9a;
	height: 25px;
	line-height: 25px;
	text-align: center;
	color: #eeeeee;
	cursor: pointer;
	user-select: none;
}

#main div:hover {
	color: #45d62c;
}

#main div.active {
	color: #45d62c;
}

.ports_div div {
	display: none;
}

.ports_div ol {
	list-style: none;
	margin-left: 0;
}

.ports_div li {
	counter-increment: custom;
	margin-left: -10px;
	line-height: 25px;
	font-size: 16px;
	color: #9a9a9a;
	font-family: Arial, Helvetica, sans-serif;
}

.ports_div div.active {
	display: block;
}

#memorydiv {
	text-align: center;
	border: 1px solid #9a9a9a;
	width: 99.8%;
	display: flex;
}

#memorydiv div {
	-ms-flex: 1;
	/* IE 10 */
	flex: 1;
	border-right: 1px solid #9a9a9a;
	height: 25px;
	line-height: 25px;
	text-align: center;
	color: #eeeeee;
	cursor: pointer;
	user-select: none;
}

#memorydiv div:hover {
	color: #45d62c;
}

#memorydiv div.active {
	color: #45d62c;
}

@font-face {
	font-family: "RazerF5";
	src: url("fonts/RazerF5.eot") format("embedded-opentype"),
		url("fonts/RazerF5.woff") format("woff"),
		url("fonts/RazerF5.ttf") format("truetype"),
		url("fonts/RazerF5.svg#MyriadProLight") format("svg");
}

@font-face {
	font-family: "RazerF5Bold";
	src: url("fonts/RazerF5Bold.eot") format("embedded-opentype"),
		url("fonts/RazerF5Bold.woff") format("woff"),
		url("fonts/RazerF5Bold.ttf") format("truetype"),
		url("fonts/RazerF5Bold.svg#MyriadProLight") format("svg");
}

@font-face {
	font-family: "RazerF5BoldItalic";
	src: url("fonts/RazerF5BoldItalic.eot") format("embedded-opentype"),
		url("fonts/RazerF5BoldItalic.woff") format("woff"),
		url("fonts/RazerF5BoldItalic.ttf") format("truetype"),
		url("fonts/RazerF5BoldItalic.svg#MyriadProLight") format("svg");
}

@font-face {
	font-family: "RazerF5Italic";
	src: url("fonts/RazerF5Italic.eot") format("embedded-opentype"),
		url("fonts/RazerF5Italic.woff") format("woff"),
		url("fonts/RazerF5Italic.ttf") format("truetype"),
		url("fonts/RazerF5Italic.svg#MyriadProLight") format("svg");
}

@font-face {
	font-family: "RazerF5Light";
	src: url("fonts/RazerF5Light.eot") format("embedded-opentype"),
		url("fonts/RazerF5Light.woff") format("woff"),
		url("fonts/RazerF5Light.ttf") format("truetype"),
		url("fonts/RazerF5Light.svg#MyriadProLight") format("svg");
}

@font-face {
	font-family: "RazerF5LightItalic";
	src: url("fonts/RazerF5LightItalic.eot") format("embedded-opentype"),
		url("fonts/RazerF5LightItalic.woff") format("woff"),
		url("fonts/RazerF5LightItalic.ttf") format("truetype"),
		url("fonts/RazerF5LightItalic.svg#MyriadProLight") format("svg");
}

@font-face {
	font-family: "RazerF5SemiBold";
	src: url("fonts/RazerF5SemiBold.eot") format("embedded-opentype"),
		url("fonts/RazerF5SemiBold.woff") format("woff"),
		url("fonts/RazerF5SemiBold.ttf") format("truetype"),
		url("fonts/RazerF5SemiBold.svg#MyriadProLight") format("svg");
}

@font-face {
	font-family: "RazerF5SemiboldItalic";
	src: url("fonts/RazerF5SemiboldItalic.eot") format("embedded-opentype"),
		url("fonts/RazerF5SemiboldItalic.woff") format("woff"),
		url("fonts/RazerF5SemiboldItalic.ttf") format("truetype"),
		url("fonts/RazerF5SemiboldItalic.svg#MyriadProLight") format("svg");
}

@font-face {
	font-family: "RazerF5Thin";
	src: url("fonts/RazerF5Thin.eot") format("embedded-opentype"),
		url("fonts/RazerF5Thin.woff") format("woff"),
		url("fonts/RazerF5Thin.ttf") format("truetype"),
		url("fonts/RazerF5Thin.svg#MyriadProLight") format("svg");
}

@font-face {
	font-family: "RazerF5ThinItalic";
	src: url("fonts/RazerF5ThinItalic.eot") format("embedded-opentype"),
		url("fonts/RazerF5ThinItalic.woff") format("woff"),
		url("fonts/RazerF5ThinItalic.ttf") format("truetype"),
		url("fonts/RazerF5ThinItalic.svg#MyriadProLight") format("svg");
}
@media screen and (min-width:3199px) and (max-width:4000px) {
	.wrapper{
		top: 54vh !important;
	height: 55% !important;
    left: 1% !important;
    right: 0 !important;
    bottom: 0 !important;
	}
}

@media screen and (orientation: portrait) and (min-device-width: 319px) and (max-device-width: 780px) {
	.accordia_icon {
		display: block;
	}

	.accordia_icon img {
		display: block;
	}

	#buttons,
	.int-ext {
		display: none;
	}

	#rightAnim {
		display: none !important;
	}

	.loaderTextContainer {
		position: absolute;
		width: 80vw;
		height: 160px;
		transform: translate(-50%, 0%);
		left: 50%;
		top: 4%;
	}
}

@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: landscape) {
	#infoBtn {
		margin-bottom: 20px;
	}
}

body {
	margin: auto;
	font-family: "RazerF5";
	color: #535353;
	background-color: rgb(255, 255, 255);
	overflow: hidden;
}

.imageGrid {
	z-index: 29;
	max-height: 60%;
	max-width: 60%;
	width: auto;
	height: auto;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
}

.mcsymbol01 {
	z-index: 30;
	width: 1224px;
	height: 1824px;
	max-width: 200%;
	max-height: 200%;
	position: absolute;
	transform-origin: 60vw 50vh;
	/* filter: blur(270px); */
	animation: rotate 10s linear infinite;
	/* background: linear-gradient(250deg, #72EC53 -66%, #EBFF00 94%  ); */
	overflow: hidden;
}

.mcsymbol02 {
	z-index: 30;
	width: 1024px;
	height: 2024px;
	max-width: 200%;
	max-height: 200%;
	position: absolute;
	transform-origin: 60vw 50vh;
	/* filter: blur(270px); */
	animation: rotate 10s linear infinite;
	animation-delay: -5s;
	/* background: linear-gradient(250deg, #179DFE 9%, #62ECEC 47%  ); */
	overflow: hidden;
}

.textLoading {
	max-height: 16vmin;
	max-width: 16vmin;
	min-width: 98px;
	width: auto;
	height: auto;
	position: absolute;
	top: -30%;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
}

.loader {
	z-index: 30;
	--size: 184px;
	--stroke-size: 0.3rem;
	--diff: calc(calc(var(--size) / 2) - var(--stroke-size));
	position: absolute;
	background-image: conic-gradient(#45d62c, transparent 85%);
	width: var(--size);
	height: var(--size);
	top: 0px;
	bottom: 0px;
	visibility: hidden;
	left: 0px;
	right: 0px;
	border-radius: 50%;
	-webkit-mask-image: radial-gradient(
		circle var(--diff),
		transparent 99%,
		#fff 100%
	);
	mask-image: radial-gradient(circle var(--diff), transparent 99%, #fff 100%);
	animation: rotate 2s linear infinite;
	margin: auto;
	/* filter: drop-shadow(0px -2px 196px rgba(235, 255, 0, 1)); */
}

@keyframes rotate {
	from {
		transform: rotate(0);
	}

	to {
		transform: rotate(-360deg);
	}
}

@keyframes passingNumbers {
	0% {
		transform: translateY(0px);
	}

	100% {
		transform: translateY(-55px);
	}
}

.digit {
	display: inline-block;
	font-size: 24px;
	/* min-width: 11vmin; */
	font-family: RazerF5;
	color: black;
	height: 55px;
	line-height: 1;
	-webkit-text-fill-color: white;
	/* Will override color (regardless of order) */
	-webkit-text-stroke-width: 1px;
	-webkit-text-stroke-color: #c8d0d5;
}

.digitGrabSize {
	position: absolute;
	visibility: hidden;
	font-size: 24px;
	font-family: mclarenFont;
	color: black;
	line-height: 1;
	-webkit-text-fill-color: white;
	/* Will override color (regardless of order) */
	-webkit-text-stroke-width: 1px;
	-webkit-text-stroke-color: #c8d0d5;
}

.time-part-wrapper:not(:last-child):after {
	content: "";
	display: block;
	width: 30px;
	height: 230px;
	position: absolute;
	top: 0px;
	right: -30px;
	color: rgba(0, 0, 0, 0.25);
	font-size: 200px;
	line-height: 0.9;
}

.time-part {
	width: min-content;
	text-align: center;
	height: 195px;
	overflow: hidden;
	display: inline-block;
	margin-left: -2px;
	box-sizing: border-box;
}

.time-partFirst {
	width: min-content;
	text-align: center;
	height: 195px;
	overflow: hidden;
	display: inline-block;
	margin-left: -37px;
	box-sizing: border-box;
	transition: width 0.2s;
}

.percentage-part {
	width: min-content;
	text-align: center;
	height: 195px;
	overflow: hidden;
	display: inline-block;
	margin-left: -1px;
	box-sizing: border-box;
}

.time-part .digit-wrapper {
	animation-timing-function: cubic-bezier(1, 0, 1, 0);
}

.wrapper {
	text-align: center;
	vertical-align: middle;
	position: absolute;
	top: 49vh;
	bottom: 0;
	left: calc(50% - 48vw);
	right: 0;
	margin: auto;
	clip-path: inset(0px 0px 0px 0px);
}

.wrapper:before,
.wrapper:after {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	left: 0;
	height: 10px;
	z-index: 10;
}

.animSecond {
	animation-name: passingNumbers;
	animation-duration: 0.2s;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
	animation-play-state: paused;
}

.animFirst {
	animation-name: passingNumbers;
	animation-duration: 0.3s;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
	animation-play-state: paused;
}

@supports (-webkit-touch-callout: none) {
	/* CSS specific to iOS devices */
	.loader {
		z-index: 30;
		--size: 134px !important;
		--stroke-size: 0.3rem;
		--diff: calc(calc(var(--size) / 2) - var(--stroke-size));
		position: absolute;
		background-image: conic-gradient(#45d62c, transparent 85%);
		width: calc(var(--size));
		height: calc(var(--size));
		top: 0px;
		bottom: 0px;
		visibility: hidden;
		left: 0px;
		right: 0px;
		border-radius: 50%;
		-webkit-mask-image: radial-gradient(
			circle var(--diff),
			transparent 99%,
			#fff 100%
		);
		mask-image: radial-gradient(
			circle var(--diff),
			transparent 99%,
			#fff 100%
		);
		animation: rotate 2s linear infinite;
		margin: auto;
		/* filter: drop-shadow(0px -2px 196px rgba(235, 255, 0, 1)); */
	}

	.wrapper {
		top: 48vh !important;
	}
}

/*button in AR*/
#ar-controls {
	position: absolute;
	bottom: 10px;
	width: 100%;
	text-align: center;
	left: 30%;
}

#ar-controls .infinity__button {
	width: 60px;
	height: 30px;
	margin: 0 5px;
	background-size: 30px !important;
	border: 1px solid #c8d0d5;
	border-radius: 25px;
}

.MuiTypography-body1 {
	font-family: "RazerF5" !important;
}

.MuiListItem-root.menuActive {
	padding: 10px !important;
	background: rgba(83, 83, 83, 0.65);
}

.MuiListItem-root.mainMenuAccordion {
	padding: 5px 0px 5px 10px !important;
}

.MuiListItem-root.mainMenuAccordion:hover {
	background: rgba(83, 83, 83, 0.65) !important;
}

.MuiCollapse-container .MuiTypography-body1 {
	font-size: 14px;
	line-height: 14px;
}

#leftMenu {
	background: rgba(0, 0, 0, 0.65) !important;
	padding: 40px;
	min-width: 283px;
	max-width: 283px;
	height: 872px;
	margin-top: -436px;
	transform: translateY(50%);
}

/* #btnXR{
  display: none !important;
} */
.accordia_icon img {
	height: 12px;
	padding: 10px;
	display: none;
}

.separator {
	display: none;
}

.collapsible {
	background-color: #777;
	color: white;
	cursor: pointer;
	padding: 18px;
	width: 100%;
	border: none;
	text-align: left;
	outline: none;
	font-size: 15px;
}

/* .active, .collapsible:hover {
  background-color: #555;
} */

.content1 {
	position: relative;
	padding: 0 18px;
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.2s ease-out;
	display: none;
	/* background-color: #f1f1f1; */
}

.content1 div h5 {
	color: #9a9a9a;
	margin-top: 5px;
	font-size: 14px;
	font-weight: normal;
}

.content1 p {
	font-family: "RazerF5Bold";
	font-size: 16px;
	margin-bottom: 0;
}

.QR_div img {
	width: 138px;
	height: 138px;
}

/* responsive css for small devices*/
.responsive-div > .logo_div {
	padding: 22px 0 30px 0;
}

.responsive-div > .logo_div img {
	width: 68%;
	margin-left: 15px;
}

.responsive-div > .QR_div {
	margin-top: 0px;
	width: 93%;
	user-select: none;
}

.responsive-div .menu {
	margin: 7px;
}

.responsive-div .MuiListItem-root.mainMenuAccordion {
	padding: 4px !important;
}

.responsive-div .MuiListItemIcon-root .icondivExterior {
	height: 24px;
}

.responsive-div .MuiListItemIcon-root img {
	height: 30px;
}

/* .MuiCollapse-container {
  padding-left: 20px !important;
} */

/* #menuExterior .MuiCollapse-entered {
	height: 24vh !important;
}

#menuInterior .MuiCollapse-entered {
	height: 22vh !important;
}

#menuSkins .MuiCollapse-entered {
	height: 13vh !important;
}

.responsive-div #menuInterior .MuiCollapse-entered {
	height: 24vh !important;
}

.responsive-div .MuiCollapse-container .MuiTypography-body1 {
	line-height: 14px;
} */

.responsive-div .MuiListItem-root.mainMenuAccordion {
	/* background-color: rgb(29, 29, 29); */
	padding-left: 8px !important;
}

/* .responsive-div #menuExterior .MuiCollapse-entered {
	height: 25vh !important;
} */

/* .responsive-div #reset{
  min-height: 55px;
  min-width: 55px;

}
.responsive-div #openClose{
  min-height: 55px;
  min-width: 55px;

}

.responsive-div #openClose img{
  width: 36px;
  margin: 11px;
  padding-top: 3px;

}
 */

/* Css for hotspots popup */
.overlay {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	/* background: rgba(0, 0, 0, 0.7); */
	transition: opacity 500ms;
	visibility: visible;
	opacity: 1;
}

.overlay:target {
	visibility: visible;
	opacity: 1;
}

#popupContainer {
	z-index: -9;
}

.popup {
	/* margin: 70px auto; */
	padding: 30px;
	background: rgba(0, 0, 0, 0.55);
	border-radius: 0px;
	border: solid 1px #9a9a9a;
	width: 325px;
	position: absolute;
	transition: opacity 0.5s;
	/* z-index: -9; */
	margin-top: -1200px;
	opacity: 0;
	user-select: none;
}

.popup.active {
	z-index: 0;
	opacity: 1;
	margin-top: 0px;
}

.popup h2 {
	margin: 0;
	color: #45d62c;
	font-family: "RazerF5Bold";
	text-align: center;
	font-size: 33px;
	margin-bottom: 15px;
}

.popup .close {
	position: absolute;
	top: 3px;
	right: 3px;
	transition: all 200ms;
	/* font-size: 25px; */
	text-decoration: none;
	color: #ffff;
	background: #9a9a9a;
	height: auto;
	width: 5%;
	text-align: center;
	font-weight: lighter;
	transform: scale(1.3);
}

.popup .close:hover {
	color: #45d62c;
}

.popup .content {
	max-height: 30%;
	overflow: auto;
	text-align: center;
	font-size: 16px;
	color: #9a9a9a;
	font-family: Arial, Helvetica, sans-serif;
}

/*Exterior popup*/
#Ultra_Thin_Bezel_Display_F14_1 {
	right: 55%;
	top: 40%;
}

#Ultra_Thin_Bezel_Display_F14_2 {
	right: 18%;
	top: 60%;
}

#FHD_Webcam_Closeup_F12_1 {
	right: 14%;
	top: 18%;
}

#FHD_Webcam_Closeup_F12_2 {
	right: 14%;
	top: 35%;
}

#FHD_Webcam_Closeup_F12_3 {
	right: 14%;
	top: 55%;
}

#Footprint_F16_New_1 {
	right: 14%;
	top: 40%;
}

#Keyboard_F13_1 {
	right: 31%;
	top: 65%;
}

#Keyboard_F13_2 {
	right: 7%;
	top: 65%;
}

#Ultra_Connectivity_02_F14_1 {
	padding: 30px 0px 0px 0px;
	width: 358px;
	right: 10%;
	top: 52%;
}

#Ultra_Connectivity_02_F14_1 .content {
	margin: 21px 21px 0px;
}

#Ultra_Connectivity_02_F14_2 {
	right: 55%;
	top: 65%;
}

/*Interior popup*/
#Render_Cam_F60_Chasis_1 {
	right: 40%;
	top: 63%;
}

#Render_Cam_F60_Heat_Compound_1 {
	right: 10%;
	top: 11%;
}

#Render_Cam_F60_Heat_Compound_2 {
	right: 10%;
	top: 33%;
}

#Render_Cam_F60_Processor_2 {
	right: 6%;
	top: 21%;
}

#Render_Cam_F60_Processor_1 {
	right: 6%;
	top: 57%;
}

#Render_Cam_F60_RAM_1 {
	padding: 30px 0px 0px 0px;
	width: 358px;
	right: 9%;
	top: 38%;
}

#Render_Cam_F60_RAM_1 .content {
	margin: 21px;
}

#Render_Cam_F60_Thermal_1 {
	right: 7%;
	top: 31%;
}

#Render_Cam_F60_Exhaust_Fins_1 {
	right: 4%;
	top: 30%;
}

#Render_Cam_F60_Battery_1 {
	right: 15%;
	top: 74%;
}

#Render_Cam_F60_Battery_2 {
	right: 37%;
	top: 74%;
}

/* #Render_Cam_F60_Heat_Compound_1:after {
  position: absolute;
  content: "";
  width: 1px;
  height: 1px;
  background: #8c8c8c;
  border-radius: 3px;
  transition: width 1s ease;
  transform: translateX(-100%);
  left: 0px;
  top: 169px;

} */

/* #Render_Cam_F60_Heat_Compound_1:hover:after {
  width: 203px;
  transform: translateX(-100%);
} */

/* #Render_Cam_F60_Battery_1:after {
  position: absolute;
  content: "";
  width: 1px;
  height: 1px;
  background: #8c8c8c;
  border-radius: 3px;
  transition: height  1s ease;
  transform: translateY(-100%);
  left: 70px;
  top: 0px;
}

#Render_Cam_F60_Battery_1:hover:after {
  height: 273px;
  transform: translateY(-100%);
} */

/* Css for hotspots popup end */

@media screen and (max-height: 800px) {
	.popup h2 {
		font-size: 30px;
	}
}

@media screen and (max-width: 1024px) and (max-height: 1365px) and (orientation: portrait) {
	/* @media screen and (device-width: 768px) and (device-height: 1024px)  and (orientation:portrait) { */
	#root {
		z-index: 2;
		position: absolute;
		top: unset;
		left: 0px;
		display: none;
		border: none;
		height: 50vh;
		color: white;
		width: 100%;
		padding: 0;
		margin: 0;
		bottom: 0;
	}

	.title .MuiTypography-displayBlock {
		font-size: 18px !important;
	}

	#leftMenu {
		background: rgba(0, 0, 0, 0.65) !important;
		min-width: 283px;
		width: 100%;
		padding: 0px !important;
		height: 100%;
		margin-top: unset;
		transform: unset;
	}

	.logo_div {
		display: none;
	}

	#popupContainer {
		display: none;
	}

	.main_menu {
		width: 100%;
		position: absolute;
		height: 55vh;
		bottom: 0;
		background: #000;
	}

	.main_menu > .menu {
		position: absolute;
		width: 100%;
		margin: 0;
	}

	/* .QR_div {
    display: none;
  } */

	#reset {
		top: 42%;
		bottom: auto;
		right: 25px;
	}

	#openClose {
		top: 36%;
		bottom: auto;
		right: 25px;
	}

	.wrapper {
		top: 54vh !important;
		left: calc(51% - 48vw);
	}

	.menu {
		margin: 20px;
	}

	.MuiListItem-root.mainMenuAccordion {
		padding-left: 11% !important;
	}

	.menu:nth-child(1) .mainMenuAccordion {
		left: 0%;
		width: 33%;
		clear: right;
		position: absolute;
		z-index: 9;
	}

	.menu:nth-child(2) .mainMenuAccordion {
		left: 33%;
		width: 33%;
		clear: right;
		position: absolute;
		z-index: 9;
	}

	.menu:nth-child(3) .mainMenuAccordion {
		left: 66%;
		width: 33%;
		clear: right;
		position: absolute;
		z-index: 9;
	}

	.MuiCollapse-entered {
		overflow: scroll !important;
	}

	.MuiCollapse-container {
		transition: none !important;
		margin-top: 65px;
	}

	.MuiCollapse-wrapperInner {
		margin-left: 50px;
		/* padding-top: 58px; */
	}

	.MuiCollapse-hidden {
		height: 0;
		transition-duration: 600ms !important;
	}

	.accordia_icon {
		display: block;
	}

	.accordia_icon img {
		display: block;
	}

	.icondivbtnXR,
	.icondivInterior,
	.icondivExterior {
		height: 38px !important;
		padding-right: 11px;
	}

	.MuiCollapse-container .MuiTypography-body1 {
		font-size: 22px;
		line-height: 40px;
	}

	.skin_header span {
		font-size: 22px;
	}

	#skin_type button {
		font-size: 22px;
	}

	.arrow {
		width: 12px;
		height: 12px;
		background: url(img/Chevron_right.png) center center no-repeat;
		background-size: 15px;
	}

	.MuiListItemText-root {
		margin-top: 5px !important;
		/* text-align: center; */
	}

	.content1 {
		display: grid;
		/* max-height: initial; */
	}

	.content1 p {
		display: grid;
		font-size: 22px;
		margin-left: 14px;
	}

	.content1 div h5 {
		margin-left: 14px;
		font-size: 24px;
	}

	#menuExterior .MuiCollapse-entered,
	#menuInterior .MuiCollapse-entered {
		opacity: 1 !important;
		overflow: hidden;
		height: 40vh !important;
		overflow: scroll !important;
		width: 91%;

		/* position: absolute; */
	}

	#footProntNote {
		display: none;
		width: 100%;
		top: 44%;
		bottom: auto;
		right: 0;
		min-height: 50px;
		min-width: 65px;
		font-size: 19px;
		text-align: center;
	}

	.separator {
		display: block;
		border: none;
		height: 1px;
		background: linear-gradient(
			90deg,
			rgba(73, 73, 73, 0) 0%,
			rgba(73, 73, 73, 1) 5%,
			rgba(73, 73, 73, 1) 95%,
			rgba(73, 73, 73, 0) 100%
		);
	}

	#main_mob {
		text-align: center;
		border: 1px solid #9a9a9a;
		width: 99.8%;
		display: flex;
		font-size: 14px;
	}

	#main_mob div {
		-ms-flex: 1;
		/* IE 10 */
		flex: 1;
		border-right: 1px solid #9a9a9a;
		height: 25px;
		line-height: 25px;
		text-align: center;
		color: #eeeeee;
		cursor: pointer;
		user-select: none;
	}

	#main_mob div:hover {
		color: #45d62c;
	}

	#main_mob div.active {
		color: #45d62c;
	}

	.ports_div li {
		font-size: 14px;
	}

	/* mobile skin css start */
	.mob_skins_menu div h6 {
		font-size: 18px !important;
	}

	.mob_skins_menu .skin_header img {
		height: 100%;
	}
	#skin_type .active {
		color: #45d62c !important;
	}
	/* mobile skin css start */
}

@media screen and (max-width: 2048px) and (max-height: 2732px) and (orientation: landscape) and(aspect-ratio: 4/3) {
	#Ultra_Thin_Bezel_Display_F14_1 {
		right: 40%;
	}

	#Ultra_Thin_Bezel_Display_F14_2 {
		right: 8%;
	}

	#FHD_Webcam_Closeup_F12_1 {
		right: 14%;
	}

	#Footprint_F16_New_1 {
		right: 6%;
	}

	#Keyboard_F13_1 {
		right: 40%;
	}

	#Keyboard_F13_2 {
		right: 7%;
	}

	#Ultra_Connectivity_02_F14_1 {
		right: 26%;
	}

	#Ultra_Connectivity_02_F14_2 {
		right: 28%;
		top: 69%;
	}

	#Render_Cam_F60_Processor_1,
	#Render_Cam_F60_Processor_2 {
		right: 2%;
	}

	#Render_Cam_F60_RAM_1 {
		top: 30%;
	}

	#Render_Cam_F60_Thermal_1 {
		right: 5%;
		top: 25%;
	}

	#Render_Cam_F60_Exhaust_Fins_1 {
		right: 38%;
	}

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

	.icondivbtnXR {
		height: 35px;
	}
}

@media screen and (max-width: 1365px) and (max-height: 1024px) and (orientation: landscape) {
	#root {
		z-index: 1;
		left: 0px;
	}

	#leftMenu {
		background: rgba(0, 0, 0, 0.65) !important;
		padding: 40px;
		min-width: 283px;
		height: 100%;
		margin-top: 0px;
		transform: translateY(0%);
	}

	/* .QR_div {
    display: none;
  } */

	#reset,
	#openClose {
		transform: scale(0.8);
	}

	.popup {
		width: 279px;
		padding: 15px;
		transform: scale(0.7);
	}

	.popup h2 {
		font-size: 25px;
	}

	#Ultra_Thin_Bezel_Display_F14_2 {
		right: 6%;
	}

	#Ultra_Thin_Bezel_Display_F14_1 {
		right: 37%;
		top: 60%;
	}

	#FHD_Webcam_Closeup_F12_1 {
		top: 16;
	}

	#Footprint_F16_New_1 {
		right: 8%;
	}

	#Keyboard_F13_1 {
		right: 24%;
		top: 70%;
	}

	#Keyboard_F13_2 {
		right: 3%;
		top: 70%;
	}

	#Ultra_Connectivity_02_F14_1 {
		right: 21%;
		top: 65%;
	}

	#Ultra_Connectivity_02_F14_2 {
		right: 44%;
		width: 301px;
		top: 70%;
	}

	#Render_Cam_F60_Heat_Compound_1 {
		right: 5%;
		top: 14%;
	}

	#Render_Cam_F60_Heat_Compound_2 {
		right: 5%;
		top: 28%;
	}

	#Render_Cam_F60_Processor_2 {
		right: 1%;
		top: 16%;
	}

	#Render_Cam_F60_Processor_1 {
		right: 1%;
		top: 53%;
	}

	#Render_Cam_F60_RAM_1 {
		right: 7%;
		top: 23%;
	}

	#Render_Cam_F60_Thermal_1 {
		right: 5%;
		top: 21%;
	}

	#Render_Cam_F60_Exhaust_Fins_1 {
		right: 2%;
		top: 33%;
	}

	#Render_Cam_F60_Battery_1 {
		right: 15%;
		top: 70%;
	}

	.icondivbtnXR {
		height: 35px;
	}

	#popupContainer {
		display: block !important;
	}
}

@media screen and (max-width: 1366px) and (max-height: 768px) and (orientation: landscape) {
	#root {
		z-index: 2;
		left: 0px;
	}

	.wrapper {
		top: 51vh !important;
		z-index: 6;
	}

	#leftMenu {
		background: rgba(0, 0, 0, 0.65) !important;
		padding: 40px;
		min-width: 283px;
		height: 100%;
		margin-top: 0px;
		transform: translateY(0%);
	}

	/* #menuExterior .MuiCollapse-entered {
		height: 31vh !important;
	}

	#menuInterior .MuiCollapse-entered {
		height: 26vh !important;
	} */

	.responsive-div#leftMenu {
		min-width: 222px;
		max-width: 222px;
	}

	.responsive-div > .logo_div img {
		height: 50px;
		margin-left: 12px;
	}

	.responsive-div .logo_div {
		padding: 32px 0 5px 0 !important;
	}

	.responsive-div .MuiCollapse-container .MuiTypography-body1 {
		line-height: 10px;
	}

	.menu .title .MuiTypography-displayBlock {
		font-size: 14px;
	}

	/* .QR_div {
    display: none;
  } */

	/* .responsive-div .QR_div {
    display: block;

  } */

	/* .responsive-div #menuExterior .MuiCollapse-entered {
		height: 31vh !important;
	}

	.responsive-div #menuInterior .MuiCollapse-entered {
		height: 25vh !important;
	} */

	.responsive-div .MuiListItem-root.mainMenuAccordion {
		padding: 2px !important;
	}

	.responsive-div .MuiListItemIcon-root img {
		height: 26px !important;
	}

	.responsive-div .MuiListItemIcon-root {
		min-width: 35px !important;
	}

	.responsive-div .MuiListItemIcon-root .icondivExterior {
		height: 19px !important;
	}

	#reset,
	#openClose {
		transform: scale(0.7);
	}

	#openClose {
		bottom: 65px;
	}

	.responsive-div > .QR_div {
		padding-top: 0px;
		width: 100%;
	}

	.responsive-div .QR_div h5 {
		font-size: 12px;
		/* margin: 6px auto; */
	}

	.responsive-div > .QR_div img {
		width: 100px;
		height: 100px;
	}

	/* .responsive-div #btnXR {
    display: none;
  } */

	.popup {
		width: 279px;
		padding: 15px;
		transform: scale(0.8);
	}

	.popup h2 {
		font-size: 25px;
	}

	#Ultra_Thin_Bezel_Display_F14_2 {
		right: 9%;
		top: 57%;
	}

	#Ultra_Thin_Bezel_Display_F14_1 {
		right: 46%;
		top: 48%;
	}

	#FHD_Webcam_Closeup_F12_1 {
		top: 16;
	}

	#Footprint_F16_New_1 {
		right: 8%;
	}

	#Keyboard_F13_1 {
		right: 34%;
		top: 70%;
	}

	#Keyboard_F13_2 {
		right: 5%;
		top: 70%;
	}

	#Ultra_Connectivity_02_F14_1 {
		right: 16% !important;
		top: 56%;
	}

	#Ultra_Connectivity_02_F14_2 {
		right: 22%;
		width: 301px;
		top: 70%;
	}

	#Render_Cam_F60_Heat_Compound_1 {
		right: 5%;
		top: 9%;
	}

	#Render_Cam_F60_Heat_Compound_2 {
		right: 5%;
		top: 26%;
	}

	#Render_Cam_F60_Processor_2 {
		right: 1%;
		top: 16%;
	}

	#Render_Cam_F60_Processor_1 {
		right: 1%;
		top: 53%;
	}

	#Render_Cam_F60_RAM_1 {
		right: 6%;
		top: 23%;
	}

	#Render_Cam_F60_Chasis_1 {
		right: 35%;
	}

	#Render_Cam_F60_Thermal_1 {
		right: 5%;
		top: 21%;
	}

	#Render_Cam_F60_Exhaust_Fins_1 {
		right: 0% !important;
		top: 31% !important;
	}

	#Render_Cam_F60_Battery_1 {
		right: 15%;
		top: 74%;
	}

	.icondivbtnXR {
		height: 35px;
	}

	#popupContainer {
		display: block !important;
	}
}

@media only screen and (min-device-width: 768px) and (max-device-width: 2732px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
	.wrapper {
		top: 51vh !important;
		opacity: 1;
		z-index: 6;
	}
}

@media only screen and (min-device-width: 768px) and (max-device-width: 2732px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
	.wrapper {
		top: 49vh !important;
        left: calc(50% - 47vw);
	}

	#Ultra_Thin_Bezel_Display_F14_1 {
		right: 42% !important;
	}

	#Ultra_Thin_Bezel_Display_F14_2 {
		right: 8%;
	}

	#FHD_Webcam_Closeup_F12_1 {
		right: 14%;
	}

	#Footprint_F16_New_1 {
		right: 6%;
	}

	#Keyboard_F13_1 {
		right: 1%;
		top: 51%;
	}

	#Keyboard_F13_2 {
		right: 11%;
		top: 72%;
	}

	#Ultra_Connectivity_02_F14_1 {
		right: 20%;
		top: 55%;
	}

	#Ultra_Connectivity_02_F14_2 {
		right: 38%;
		top: 72%;
	}

	#Render_Cam_F60_Processor_1,
	#Render_Cam_F60_Processor_2 {
		right: 1%;
	}

	#Render_Cam_F60_RAM_1 {
		top: 30%;
	}

	#Render_Cam_F60_Thermal_1 {
		right: 5%;
		top: 25%;
	}

	#Render_Cam_F60_Exhaust_Fins_1 {
		right: 3%;
		top: 32%;
	}

	#Render_Cam_F60_Battery_1 {
		right: 5%;
	}

	/* .QR_div {
    display: none;
  } */

	.icondivbtnXR {
		height: 35px;
	}

	#menuSkins .MuiCollapse-entered {
		height: 18vh !important;
	}
}

@media only screen and (max-width: 768px) {
	#root {
		z-index: 2;
		position: absolute;
		top: unset;
		left: 0px;
		display: none;
		border: none;
		height: 50vh;
		color: white;
		width: 100%;
		padding: 0;
		margin: 0;
		bottom: 0;
	}

	.content1 {
		display: grid;
	}

	.accordia_icon {
		display: block;
	}

	.accordia_icon img {
		display: block;
	}

	.menu.active .content1 {
		max-height: 400px;
	}

	/* #infinityrt-canvas{
  margin-top: -150px;
} */
	.wrapper {
		top: 47vh !important;
		left: calc(56% - 46vw);
	}

	/* #btnXR {
    display: block !important;
  } */

	.MuiListItemText-root {
		margin-top: 5px !important;
	}

	#footProntNote {
		display: none;
		position: absolute;
		z-index: 99;
		bottom: 13px;
		right: 100px;
		cursor: pointer;
		min-height: 65px;
		min-width: 65px;
		color: #7d7d7d;
		font-family: Arial, Helvetica, sans-serif;
		font-size: 16px;
		cursor: auto;
		user-select: none;
	}

	/* .MuiListItem-root.mainMenuAccordion{margin-top: -50px;} */
	#leftMenu {
		background: rgba(0, 0, 0, 0.65) !important;
		min-width: 283px;
		max-width: unset;
		width: 100%;
		padding: 0px !important;

		height: 100%;
		margin-top: unset;
		transform: unset;
	}

	.logo_div {
		display: none;
	}

	.responsive-div .MuiListItemIcon-root img {
		height: 35px !important;
	}

	.MuiCollapse-container .MuiTypography-body1 {
		font-size: 16px;
		line-height: 24px;
	}

	.MuiCollapse-container .MuiTypography-body1 {
		font-size: 16px;
		line-height: 24px;
	}

	#skin_type {
		font-size: 16px;
	}
	#skin_type button {
		font-size: 16px;
	}
	.skin_header span {
		font-size: 16px;
	}
	.main_menu {
		width: 100%;
		/* top: 55%; */
		position: absolute;
		/* left: 25%; */
		height: 55vh;
		bottom: 0;
		background: #000;
		/* display: flex; */
	}

	.main_menu > .menu {
		/* position: relative;
    width: 100%;
    flex: 1; */
		position: absolute;
		width: 100%;
		margin: 0;
	}

	.MuiCollapse-container {
		min-height: 0px;
		margin-top: 0px;
	}

	.MuiCollapse-wrapperInner {
		margin-left: 0px;
		padding-top: 0px;
	}

	/* .QR_div {
    display: none;
  } */

	#openClose {
		display: none !important;
	}

	#reset {
		display: none !important;
	}

	#footProntNote {
		width: 100%;
		top: 45%;
		bottom: auto;
		right: 0;
		display: none;
		min-height: auto;
		min-width: 65px;
		font-size: 12px;
		text-align: center;
	}

	.content1 div h5 {
		margin-left: 0px;
		font-size: 14px;
	}

	.content1 p {
		font-size: 16px;
		margin-left: 0px;
	}

	.responsive-div .MuiListItem-root.mainMenuAccordion {
		width: 33% !important;
		/* top: -50px; */
	}

	#main_mob {
		text-align: center;
		border: 1px solid #9a9a9a;
		width: 99.8%;
		display: flex;
	}

	#main_mob div {
		-ms-flex: 1;
		/* IE 10 */
		flex: 1;
		border-right: 1px solid #9a9a9a;
		height: 25px;
		line-height: 25px;
		text-align: center;
		color: #eeeeee;
		cursor: pointer;
		user-select: none;
	}

	#main_mob div:hover {
		color: #45d62c;
	}

	#main_mob div.active {
		color: #45d62c;
	}

	.menu:nth-child(1) .mainMenuAccordion {
		left: 0%;
		width: 33%;
		clear: right;
		position: absolute;
		z-index: 9;
	}

	.menu:nth-child(2) .mainMenuAccordion {
		left: 33%;
		width: 33%;
		clear: right;
		position: absolute;
		z-index: 9;
	}

	.menu:nth-child(3) .mainMenuAccordion {
		left: 66%;
		width: 33%;
		clear: right;
		position: absolute;
		z-index: 9;
	}

	.responsive-div .MuiCollapse-entered {
		/* height:0px !important; */
		opacity: 1;
		/* margin-top: -45px; */
	}

	.title .MuiTypography-displayBlock {
		font-size: 16px !important;
		text-align: center;
	}

	.MuiListItem-root.mainMenuAccordion {
		padding: 10px !important;
	}

	.MuiCollapse-container {
		height: 100% !important;
		opacity: 0;
		transition: opacity 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms !important;
		margin-top: 51px;
		display: none;
	}

	.MuiCollapse-wrapper {
		overflow: auto;
	}

	.icondivInterior {
		height: 25px !important;
	}

	.mainMenuAccordion .MuiListItemIcon-root {
		min-width: 42px !important;
	}

	.icondivbtnXR {
		height: 28px;
	}

	#menuInterior .MuiCollapse-entered {
		opacity: 1 !important;
		overflow: auto !important;
	}

	#menuExterior .MuiCollapse-entered {
		opacity: 1 !important;
		overflow: auto !important;
	}

	#popupContainer {
		display: none !important;
	}

	.MuiCollapse-wrapperInner {
		height: 400px;
	}

	.MuiCollapse-entered {
		display: block;
	}

	.MuiCollapse-container {
		padding-left: 0 !important;
	}

	#lockForMob {
		text-align: center;
		z-index: 999999991 !important;
		background-color: #191919;
		width: 100%;
		height: 100%;
		display: none;
		justify-content: center;
		align-content: space-around;
		flex-wrap: wrap;
		flex-direction: column;
		align-items: center;
		position: absolute;
	}

	#lockForMob img {
		height: 50px;
		width: 50px;
	}

	.active,
	.collapsible:hover {
		background: transparent;
		color: #45d62c !important;
	}

	.separator {
		display: block;
		border: none;
		height: 1px;
		background: rgb(73, 73, 73);
		background: -moz-linear-gradient(
			90deg,
			rgba(73, 73, 73, 0) 0%,
			rgba(73, 73, 73, 1) 5%,
			rgba(73, 73, 73, 1) 95%,
			rgba(73, 73, 73, 0) 100%
		);
		background: -webkit-linear-gradient(
			90deg,
			rgba(73, 73, 73, 0) 0%,
			rgba(73, 73, 73, 1) 5%,
			rgba(73, 73, 73, 1) 95%,
			rgba(73, 73, 73, 0) 100%
		);
		background: linear-gradient(
			90deg,
			rgba(73, 73, 73, 0) 0%,
			rgba(73, 73, 73, 1) 5%,
			rgba(73, 73, 73, 1) 95%,
			rgba(73, 73, 73, 0) 100%
		);
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#494949", endColorstr="#494949", GradientType=1);
	}

	.arrow {
		width: 12px;
		height: 12px;
		background: url("img/Chevron_right.png") center center no-repeat;
		background-size: 15px;
	}

	/* .menu.active {pointer-events: none;} */
	.menu.active .arrow {
		width: 12px;
		height: 12px;
		background: url("img/Expand_accordion.png") center center no-repeat;
		background-size: 15px;
	}

	.menu .MuiButtonBase-root:hover {
		/* background-color: #45d62c !important; */
		color: unset !important;
	}

	/* #fadeInOut {
    height: 50vh;
  } */
	.mob_skins_menu .skin_header img {
		height: 90%;
	}

	.mob_skins_menu div h6 {
		font-size: 16px !important;
		font-weight: 400;
	}
}

@supports (-webkit-touch-callout: none) {
	/* CSS specific to iOS devices */

	.wrapper {
		top: 48vh;
	}
}

@media only screen and (max-width: 992px) and (orientation: landscape) {
	#popupContainer {
		display: none !important;
	}
}

@media screen and (orientation: landscape) and (max-height: 660px) {
	#leftMenu {
		padding: 0 22px !important;
	}

	.responsive-div > .logo_div {
		padding: 12px 0 12px 0;
	}

	.QR_div h5 {
		margin: 10px auto;
	}
}

@media screen and (min-width: 900px) and (max-height: 660px) {
	#leftMenu {
		padding: 0 22px !important;
	}

	.responsive-div > .logo_div {
		padding: 12px 0 12px 0;
	}

	.QR_div h5 {
		margin: 10px auto;
	}
}

@media only screen and (device-width: 2160px) and (orientation: landscape) {
	#Ultra_Thin_Bezel_Display_F14_1 {
		right: 37%;
		top: 56%;
	}

	#Ultra_Thin_Bezel_Display_F14_2 {
		right: 2%;
	}
}

@media only screen and (max-width: 1024px) and (orientation: portrait) {
	.menu.active .arrow {
		width: 12px;
		height: 12px;
		background: url("img/Expand_accordion.png") center center no-repeat;
		background-size: 15px;
	}

	.menu .MuiButtonBase-root:hover,
	.MuiListItem-button {
		color: #fff !important;
	}

	.menu .active .MuiListItem-button {
		color: #45d62c !important;
	}
	#leftMenu {
		min-width: 100%;
	}
}

#menuSkins button {
	width: 50%;
	margin: 12px 0 4px;
	background: transparent;
	border: 1px solid #363636;
	color: #fff;
	padding: 3px 0;
	cursor: pointer;
}

#menuSkins button:first-child {
	border-right: 0;
}

/* @media not all and (min-resolution:.001dpcm) and (max-width:1280px) and (orientation:landscape){ 
	@supports (-webkit-appearance:none) {

    .popup{
      transform: scale(0.8);
    }

    #Ultra_Thin_Bezel_Display_F14_1 {
      right: 46%;
    }
    #Ultra_Thin_Bezel_Display_F14_2 {

      right: 13%;
      top: 54%;
    }
    
	}
} */

@media only screen and (max-width: 768px) and (orientation: landscape) {
	.wrapper {
		top: 43vh !important;
		left: calc(56% - 51vw);
	}
}
@media only screen and (min-width: 1366px) and (max-width: 1680px) {
	#Ultra_Connectivity_02_F14_2,
	#Keyboard_F13_1,
	#Keyboard_F13_2 {
		transform: scale(0.7) !important;
	}
	#Ultra_Connectivity_02_F14_2 {
		right: 47%;
		top: 64%;
	}
	#Keyboard_F13_2 {
		right: 3%;
		top: 65%;
	}
	#Keyboard_F13_1 {
		right: 25%;
		top: 65%;
	}
	/* #Ultra_Connectivity_02_F14_2 {
		right: 45%;
		top: 56%;
	}
	#Keyboard_F13_2 {
		right: -1%;
		top: 57%;
	}
	#Keyboard_F13_1 {
		right: 22%;
		top: 57%;
	} */
}
@media only screen and (min-width: 900px) and (max-width: 1150px) {
	#Ultra_Connectivity_02_F14_2 {
		right: 25%;
		top: 75%;
	}
	#Keyboard_F13_2 {
		right: 3%;
		top: 75%;
	}
	#Keyboard_F13_1 {
		right: 3%;
		top: 60%;
	}
	/* #Ultra_Connectivity_02_F14_2 {
		right: 45%;
		top: 56%;
	}
	#Keyboard_F13_2 {
		right: -1%;
		top: 57%;
	}
	#Keyboard_F13_1 {
		right: 22%;
		top: 57%;
	} */
}