:root {
  --main_bg: rgb(27,15,38);
  --sec_bg: rgb(16,1,37);
  --accent: rgb(129,65,253);
  --accent2: rgb(213,28,150);
  --main_tx: rgb(249,245,238);
  --sec_tx: rgb(203,206,214);

  
  --tx_s: 1.3em;
  --puw: 88vw;


  
}



header, body {
	background: var(--main_bg);
	color: var(--main_tx);
	font-size: var(--tx_s);

	font-family: sans-serif;
	/* font-family: "Helvetica Neue","Open Sans","Segoe UI","Ubuntu","Roboto","Oxygen","Cantarell",sans-serif; */
	font-weight: 300;
	text-align: justify;
	
}

header {
	height: 4em;
	max-height: 4em;
}

nav {
	background: var(--sec_bg);
}

@media (min-width: 1198px) {
	.navmenu {
		display: block !important;
	}
	.nav-link {
		font-size:1.1em;
	}
}

.nav-link {
	color: var(--main_tx);
	font-weight: bold;
	margin: 1em;
	padding: 0em 1em 0em;
	font-size:0.7em;
}


main {
	margin-top: 12em;
}

main a {
	text-decoration: none;
	color: var(--main_tx);
}

h1,h2,h3,h4 {
	margin-top: var(--tx_s);
	text-align: center;
}

.bbcont {
	
	margin: 2em;
	justify-content: center; align-items: center;
}

.bbcont2 {
	
	margin: 0;
	background-color: var(--sec_bg);
}

.bonusbtn {
	min-width: 35vw;
	padding: 0.5em;
	margin: auto;
	background-color: var(--sec_bg);
	border-color: var(--accent);
	border-width: 4px;
	color: var(--accent)!important;
	text-align: center;
	display: flex;
	position: relative;
}

.bonusbtn2 {
	max-width: 50vw;
	margin: 1.5em auto;
}

.bonusbtn3 {
	max-width: 50vw;
	margin: 1.5em auto;
	border-color: var(--accent2);
	color: var(--accent2)!important;
}

.nav0 {
	width: calc(var(--puw) + 10vw);
}

.nav1 {

	height: 3em;
	min-height: 40px;
	margin: 1em;
}

.nav2 {
	max-height: 3em;
	margin-top: 4em;
}

.text-muted {
	margin-bottom: 4em;
}

.custom-toggler .navbar-toggler-icon {
	background-image: url("../img/cosmolot-menu.png");
	background-size: contain;
}

.custom-toggler.navbar-toggler {
	
 	border-width: 0;
} 

.nav2 img {
	position: absolute;
	top: 5em;
	left: 50%;
	transform: translateX(-50%);
}

table tr td {
	border-color: var(--main_tx);
 	border-width: 0.1em;
 	padding: 0.5em;
}




.tximg {
	max-width: calc(var(--puw) + 10vw - 2em);
	display:block;
	margin:auto;
}

.logoimage {
	max-width: calc(var(--puw) + 10vw - 2em);
	max-height: 7em;
	display:block;
	margin:auto;
}


.goto {
	border-color: var(--accent);
	border-width: 4px;
	color: var(--accent);
}


.a-goto2 {
	color: var(--accent2)!important;
	text-decoration: none;
	text-transform: uppercase;
	font-weight: bold;
	margin: 1.5em 0.5em;
	padding: 1em;
	display: flex;
	position: relative;
	background-color: var(--sec_bg);
	border-color: var(--accent2);
	border-width: 4px;
	width: 50%;
}

.a-goto {
	color: var(--accent);
	text-decoration: none;
	text-transform: uppercase;
	font-weight: bold;
	margin: auto;
	display: flex;
	position: relative;
	
}

.a-goto3 {
	color: var(--accent);
	text-decoration: none;
	text-transform: uppercase;
	font-weight: bold;
	margin: 1.5em 0.5em;
	padding: 1em;
	display: flex;
	position: relative;
	background-color: var(--sec_bg);
	border-color: var(--accent);
	border-width: 4px;
	width: 50%;
}

.slot {
	margin: 1em;
}
.slots {
	max-width: 20vw;
}


footer {
	background: var(--sec_bg);
	color: var(--sec_tx);
	text-align: center;
}