body {
	font-family: Lexend,Arial,Tahoma,Verdana,sans-serif;
	background-color: #000;
	color: #f3f3f3;
	margin: 0;
}

p {
	font-size: 16px;
	text-align:left;
}

a.bdy:link {
	color: #b9b9b9;
}

a.bdy:visited {
	color: #b9b9b9;
}

h1 {
	color: #ff7f00;
	font-size: 32px;
	text-align: left;
	font-weight: normal;
	margin-top: 0px;
}

h2 {
	color: #ff7f00;
	font-size: 18px;
	text-align: left;
	font-weight: normal;
	margin-bottom: 0px;
}

img {
	max-width: 150px;
}

ul {
	margin-top: 0px;
	padding-left: 15px;
	font-size: 16px;
}

.body-container {
	display: flex;
	justify-content: center;
}

.main-container {
	display: flex;
	flex-direction: column;	
	max-width: 80%;
	margin-top: 50px;
	position: absolute;
	/*left: 0;*/
	top: 0;
	z-index: -1;
}

.title-container {
	display: flex;
	justify-content: center;
	flex-direction: row;
}

.content-container {
	
}

.app {
	color: #5bc1ab;
	font-size: 14px;
	text-align:left;
}

.nxt {
	color: #b7b7b7;
	text-align:left;
}

.ttl {
	color: #b7b7b7;
}

.title-logo {
	padding: 5px;
	margin-left: 0px;
	margin-top: 0px;
}

.logo-container {
	width: 128px;
	height: 128px;
	background-color: transparent;
	position: relative;
	margin: auto;
}

.logo-bgdcircle {
	width: 128px;
	height: 128px;
	background-color: #EECD0B;
	position: absolute;
	z-index: 1;
	border-radius: 50%;
	opacity: 0.2;
}

.logo-cart {
	width: 128px;
	height: 128px;
	background-color: #EECD0B;
	position: absolute;
	z-index: 2;
	clip-path: polygon(14px 16px, 24px 16px, 30px 38px, 113px 38px, 101px 88px, 32px 88px);
}

.logo-bskt {
	width: 128px;
	height: 128px;
	background-color: #000;
	position: absolute;
	z-index: 3;
	clip-path: polygon(34px 50px, 98px 50px, 92px 78px, 41px 78px);
	opacity: 0.6;
}

.logo-wheel1 {
	width: 24px;
	height: 24px;
	background-color: #EECD0B;
	position: absolute;
	z-index: 3;
	border-radius: 50%;
	left: 31px;
	top: 96px;
}

.logo-wheel2 {
	width: 24px;
	height: 24px;
	background-color: #EECD0B;
	position: absolute;
	z-index: 3;
	border-radius: 50%;
	left: 78px;
	top: 96px;
}

.title-textbox {
	float: left;
	padding: 5px;
	flex-grow: 100;
}

/* xxl */
@media only screen (max-width: 1536px) {
	.body-container {
		max-width: 1280px;
	}
}

/* xl */
@media (max-width: 1280px) {
	.body-container {
		max-width: 1024px;
	}
}

/* lg */
@media (max-width: 1024px) {
	.body-container {
		max-width: 768px;
	}
	h1 {
		font-size: 26px;
	}
	.logo-bgdcircle, .logo-cart, .logo-bskt, .logo-wheel1, .logo-wheel2 {
		zoom: 0.8;
	}
	.logo-container {
		width: 103px;
		height: 103px;
	}
}

/* md */
@media (max-width: 768px) {
	.body-container {
		max-width: 640px;
	}
	h1 {
		font-size: 22px;
	}
	.logo-bgdcircle, .logo-cart, .logo-bskt, .logo-wheel1, .logo-wheel2 {
		zoom: 0.7;
	}
	.logo-container {
		width: 90px;
		height: 90px;
	}
}

/* sm */
@media (max-width: 640px) {
	.body-container {
		max-width: 480px;
	}
	h1 {
		font-size: 16px;
	}
	h2 {
		font-size: 14px;
	}
	p {
		font-size: 12px;
	}
	ul {
		font-size: 12px;
	}
	.logo-bgdcircle, .logo-cart, .logo-bskt, .logo-wheel1, .logo-wheel2 {
		zoom: 0.5;
	}
	.logo-container {
		width: 64px;
		height: 64px;
	}
}

/* xs */
@media (max-width: 480px) {
	.body-container {
		max-width: 100%;
}