main {
	width: calc((100% - 40px));
	min-height: 70vh;
	margin:10px auto;
	background-color: #7cad93;
	border-radius: 10px;
	overflow: hidden;
}

.nTp {
	width: 90%;
    position: relative;
    display: flex;
    justify-content: space-between;
    max-width: 1300px;
    margin: 40px auto 0;
    padding: 0;
	border-radius: 20px;
	overflow: hidden;
}

.about {
    margin: 0 24px 10px 24px;
	padding: 10px 0 0 10px;
    background: #fff;
    box-shadow: 0 6px 12px 0 rgb(0 0 0/24%);
    z-index: 10;
	border-radius: 20px;
	overflow: hidden;
}

.about .sTitle {
    font-size: 9px;
    letter-spacing: 1px;
    color: var(--grey-3);
    text-transform: uppercase;
    font-weight: 600;
    margin: 0;
    padding: 0;
}
a {
    text-decoration: none;
    color: #199dfc;
}

.about h1 {
    font-size: 20px;
}

.about p {
    font-size: 16px;
}

.about h3 {
    font-size: 18px;
}

.about ul, .about ol {
    padding-inline-start: 40px;
}

.about ul, p, h2, h3, ol {
    display: block;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0;
    margin-inline-end: 0;
}

.smallList span img {
	width: auto;
	height: 16px;
	margin-right: 3px;
}

.smallList span {
	color: #fff;
	font-size: 12px;
	display: flex;
	align-items: center;
}

.spanBox {
	height: 30px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 20px;
}


.logoBox {
	width: 100%;
	position: inherit;
}

.goldleftOne {
	padding: 0px;
}

.logoBoxFiexd {
	width: 100%;
	display: none;
}

.smallListBox {
	width: 100%;
}

.container {
	width: 100%;
	display: none;
}

.logoBtn {
	width: auto;
	height: 50%;
}


.listTitle {
	width: 100%;
	height: 60px;
	display: flex;
	align-items: center;
	font-weight: 600;
	text-transform: capitalize;
	font-size: 20px;
	color: rgb(255, 255, 255);
	margin-bottom: 24px;
	padding-left: 20px;
	margin-top: 20px;
	background: linear-gradient(90deg, rgba(129, 67, 255, 0.3), rgba(129, 67, 255, 0));
	border-radius: 16px;
}

@keyframes shake {

	28%,
	46% {
		-webkit-transform: translate3d(0, 0, 0) rotate(0);
		transform: translate3d(0, 0, 0) rotate(0);
	}

	28.4%,
	45.3% {
		-webkit-transform: translate3d(-1px, -1px, 0) rotate(5deg);
		transform: translate3d(-1px, -1px, 0) rotate(5deg);
	}

	30.5%,
	43.2% {
		-webkit-transform: translate3d(2px, -4px, 0) rotate(-2deg);
		transform: translate3d(2px, -4px, 0) rotate(-2deg);
	}

	32.6%,
	36.8%,
	41.1% {
		-webkit-transform: translate3d(-4px, -1px, 0) rotate(3deg);
		transform: translate3d(-4px, -1px, 0) rotate(3deg);
	}

	34.7%,
	38.9% {
		-webkit-transform: translate3d(4px, 2px, 0) rotate(-4deg);
		transform: translate3d(4px, 2px, 0) rotate(-4deg);
	}
}


.container {
	width: 71%;
	/* margin: auto; */
	border-radius: 20px;
	color: #fff;
	position: relative;
	padding: 2rem;
	background: #000;
	box-shadow: 0 6px 12px 0 rgb(0 0 0 / 24%);
	background-color: #2b2c51;
	box-shadow: 0px 0px 21px -6px #fff;
	margin: 80px auto;
}

.container h1 {
	color: #fff;
	font-size: 20px;
}

.container p {
	font-size: 14px;
	margin-top: 5px;
	line-height: 2;
	font-weight: 500;
	font-family: Poppins, sans-serif;
}

.masonry,.masonryTwo {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	padding: 0px 40px;
}

.listLi {
	display: flex;
	width: calc((100% - 120px)/7);
	height: 100px;
	box-shadow: 0 6px 12px 0 rgb(0 0 0 / 24%);
	border-radius: 20px;
	overflow: hidden;
	justify-content: center;
	transition: 0.3s;
	margin-right: 20px;
	margin-bottom: 20px;
	background-color: #fff;
	position: relative;
	cursor: pointer;
}

.listLi:nth-of-type(7n) {
	margin-right: 0px;
}

.listLi img {
	width: 50%;
	height: 100%;
	border: none;
}

.listLi p {
	width: 50%;
	padding: 20px 5px 20px 10px;
	font-size: 12px;
	font-weight: 700;
	color: #c13180;
	overflow: hidden;
	text-transform: uppercase;
	align-items: center;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	line-height: 5;
}

.smallListBox {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
}

.smallList {
	width: calc((100% - 140px)/8);
	height: auto;
	border-radius: 20px;
	margin-right: 20px;
	margin-bottom: 20px;
	overflow: hidden;
	transition: all 0.4s;
	cursor: pointer;
}

.smallList:hover {
	transform: scale(1.02) translateY(-4px);
}

.smallList:nth-of-type(8n) {
	margin-right: 0px;
}

.smallList img {
	width: 100%;
	height: 100%;
}


.smallList:hover p {
	opacity: 1;
	bottom: 0px;
}



.logoBox {
	width: 255px;
	height: 90px;
	border-radius: 30px;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #fff;
	margin-bottom: 20px
}

.logoBoxFiexd {
	width: 200px;
	height: 90px;
	margin-bottom: 20px;
}

.logoBtn {
	width: auto;
	height: auto;
	cursor: pointer;
}

.rightLogoBox {
	width: 25%;
	height: 100%;
	display: flex;
	flex-wrap: wrap;
	border-left: 2px solid gainsboro;
}

.rightLogoBox img {
	width: auto;
	display: block;
	height: 20px;
	cursor: pointer;
}

.zlogoBox {
	width: 75%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.zhomeBox,
.zsearchBox {
	width: 100%;
	height: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
}


.zhomeBox {
	border-bottom: 2px solid gainsboro;
}



.leftOneBottom {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.leftOneBottom .goldRightLi {
	width: 100%;
	margin-right: 0px;
}

.goldleftOne {
	padding-right: 20px;
}

.goldleftTwo {
	padding-right: 10px;
	padding-left: 0px;
}

.textBox {
	width: calc((100% - 40px));
	background-color: #042456;
	margin: 30px 20px;
	border-radius: 10px;
}

.site-info {
	background: #002258;
	border-radius: 8px;
	padding: 15px;
	font-size: 13px;
	line-height: 25px;
	color: #fff;
	margin-bottom: 25px;
}

.site-info h2,
.site-info h4 {
	font-size: 14px;
	color: #fcd91a;
	font-weight: 900;
	margin: 10px 0 10px 0;
	line-height: 38px;
}

.site-info p {
	font-size: 13px;
	line-height: 25px;
	color: #fff;
	margin-bottom: 25px;
}

.site-info h6 {
	font-size: 14px;
}

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

	.masonry{
		padding: 0;
	}

	.classTitle{
		padding: 0px 0px;
	}

	main {
		width: 95%;
		min-height: 75vh;
		padding: 0px;
	}

	.listLi {
		width: 100%;
		margin-right: 0px;
	}

	.smallList {
		width: calc((100% - 20px)/3);
		height: auto;
		margin-right: 10px;
		/* display: flex; */
		flex-wrap: wrap;
		/* align-items: center; */
		/* justify-content: center; */
		border-radius: 0px;
		margin-bottom: 10px;
		border: none;
		border-radius: 10px;
		overflow: hidden;
		background-color: #05142d;
	}

	.smallListBox {
		/* padding: 0px 3%; */
		margin: 10px 0px 5px;
	}

	.smallList:nth-of-type(8n) {
		margin-right: 10px;
	}

	.spanBox {
		padding: 0 5px;
	}

	.smallList:nth-of-type(3n) {
		margin-right: 0px;
	}

	.smallList p {
		width: 100%;
		color: #fff;
		font-size: 13px;
		font-weight: 400;
		text-align: center;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.smallList img {
		width: 100%;
		height: 100%;
		margin-bottom: 5px;
	}

	.poGameBox {
		width: 100%;
		height: auto;
		display: flex;
		overflow-x: scroll;
		position: relative;
		padding: 10px;
	}

	.poGameBox::-webkit-scrollbar {
		display: none;
	}

	.poGameLi {
		display: inline;
		margin-right: 20px;
		border-radius: 20px;
		/* overflow: hidden; */
		box-shadow: 3px 2px 6px 3px #f6f8ff;
		padding-bottom: 10px;
	}

	.poGameLi img {
		width: 300px;
		height: 200px;
		border-radius: 20px 20px 0 0;
	}

	.poGameLi p {
		width: 300px;
		height: auto;
		border-radius: 0 0 20px 20px;
		background-color: #fff;
		font-size: 16px;
		font-weight: 500;
		padding: 0 10px;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.poGameLi p:nth-of-type(1) {
		margin: 5px 0px;
	}

	.poGameLi p:nth-of-type(2) {
		color: #959595;
		font-weight: 400;
		font-size: 14px;
	}

	.baseGameBox::-webkit-scrollbar {
		display: none;
	}

	.baseGameBox {
		width: 100%;
		height: auto;
		display: flex;
		overflow-x: scroll;
		position: relative;
		padding: 10px 0px;
	}

	.baseGameLi {
		display: inline;
		margin-right: 15px;
		padding-bottom: 10px;
	}

	.baseGameLi img {
		width: 100px;
		height: 100px;
		border-radius: 20px;
	}

	.baseGameLi p {
		width: 100px;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.logoBox {
		width: 100%;
		position: inherit;
	}

	.goldleftOne {
		padding: 0px;
	}

	.logoBoxFiexd {
		width: 100%;
		display: none;
	}

	.smallListBox {
		width: 100%;
	}

	.container {
		width: 100%;
		display: none;
	}

	.logoBtn {
		width: auto;
		height: 50%;
	}

	.masonryTwo{
		padding: 0;
	}

}


@media screen and (min-width:960px) {




	.smallListBox {
		margin: 10px 20px;
		width: calc((100% - 40px));
	}


	.smallList {
		border-radius: 10px;
		overflow: hidden;
		background-color: #05142d;
	}

	.smallList p {
		width: 100%;
		height: 40px;
		line-height: 40px;
		color: #fff;
		font-size: 12px;
		font-weight: 600;
		text-align: center;
		padding: 0px 10px;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.smallList img {
		width: 100%;
		height: 100%;
		margin-bottom: 5px;

	}

	.poGameBox {
		width: 100%;
		height: auto;
		display: flex;
		flex-wrap: wrap;
		/* overflow-x: scroll; */
		position: relative;
		padding: 10px;
	}

	.poGameBox::-webkit-scrollbar {
		display: none;
	}

	.poGameLi {
		width: calc((100% - 80px)/5);
		display: block;
		margin-right: 20px;
		border-radius: 20px;
		/* overflow: hidden; */
		box-shadow: 3px 2px 6px 3px #f6f8ff;
		padding-bottom: 10px;
		margin-bottom: 20px;
	}

	.poGameLi:nth-of-type(5n) {
		margin-right: 0px;
	}

	.poGameLi img {
		width: 100%;
		height: 200px;
		border-radius: 20px 20px 0 0;
	}

	.poGameLi p {
		width: auto;
		height: auto;
		border-radius: 0 0 20px 20px;
		background-color: #fff;
		font-size: 16px;
		font-weight: 500;
		padding: 0 10px;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.poGameLi p:nth-of-type(1) {
		margin: 5px 0px;
	}

	.poGameLi p:nth-of-type(2) {
		color: #959595;
		font-weight: 400;
		font-size: 14px;
	}

	.baseGameBox::-webkit-scrollbar {
		display: none;
	}

	.baseGameBox {
		width: 100%;
		height: auto;
		display: flex;
		overflow-x: scroll;
		position: relative;
		padding: 10px 0px;
	}

	.baseGameLi {
		display: inline;
		margin-right: 15px;
		padding-bottom: 10px;
	}

	.baseGameLi img {
		width: 100px;
		height: 100px;
		border-radius: 20px;
	}

	.baseGameLi p {
		width: 100px;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	
}