:root {
	--deathMenu_gridPixelSpacingX: 45px;
	--deathMenu_gridPixelSpacingY: 45px;
	--deathMenu_gridColor: #2a81b933;
	--deathMenu_grid_lineSize: 1px;
	--deathMenu_divSpacing: 20px;
  }
  
  /* * { margin: 0; padding: 0; box-sizing: border-box; } */
  
#deathMenu {
	display: none;
	margin: var(--deathMenu_divSpacing);
  	/*   background-color: #de00ff6e; */
	position: absolute;
	/* left: calc(50% - var(--deathMenu_divSpacing));
	top: calc(50% - var(--deathMenu_divSpacing));
	transform: translate(-50%, -50%); */
	width: calc(100% - var(--deathMenu_divSpacing) * 2);
	height: calc(100% - var(--deathMenu_divSpacing) * 2);
	/* overflow: hidden; */
}
  
  #deathMenuContainer {
	width: 100%;
    height: calc(100% - var(--deathMenu_divSpacing)); /* height: calc(100% - var(--deathMenu_divSpacing) - 250px); */
	overflow: hidden;
	backdrop-filter: blur(7px);
	border-radius: 0.4em;
	border: 1px solid #000;
	background: radial-gradient(#151515e8, #060606fa);
	box-shadow: inset 0 0 0 1px #272727, 0 0 20px 1px black;
	/* margin-bottom: var(--deathMenu_divSpacing); */
  }
  
  .deathMenuContent {
	transform: translate(calc(50vw - 50% - 50px), calc(50vh - 50% - 50px));
	transform-origin: 0% 0%;
	background: url(../assets/images/deathMenu_background.png);
    background-size: 1000px;
  }
  
  #deathMenu_leftSide {
	padding-right: var(--deathMenu_divSpacing);
	display: flex;
	flex-flow: column;
	justify-content: space-between;
  }
  
  #deathMenu_rightSide {
	width: calc(100% - 300px - var(--deathMenu_divSpacing));
	flex-direction: column;
	display: flex;
	align-items: center;
  }
  
  .deathMenuAd_leftSmall {
	width: 300px;
	height: 250px;
	background: url("../assets/images/small_adViz.png");
	color: #ffffff00;
  }
  
  #deathMenuAd_leftMedium {
	width: 300px;
	height: 600px;
	background: purple;
  }
  
  #deathMenuAd_bottomBanner {
	width: 970px;
	height: 250px;
	background: url("../assets/images/bottomBanner_adViz.jpg");
	color: #ffffff00;
  }
  
  .deathMenuAd_leftSmall:hover, #deathMenuAd_bottomBanner:hover {
	color: #ffffffff;
	text-shadow: 0 0 3px #000000, 0 0 5px #000000;
  }
  
#deathMenu_grid {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: -1;
	height: 100%;
	overflow: hidden;
  
	background-image: 	linear-gradient(var(--deathMenu_gridColor) var(--deathMenu_grid_lineSize), transparent var(--deathMenu_grid_lineSize)),
						linear-gradient(90deg, var(--deathMenu_gridColor) var(--deathMenu_grid_lineSize), transparent var(--deathMenu_grid_lineSize));
	background-size: 1px var(--deathMenu_gridPixelSpacingX), var(--deathMenu_gridPixelSpacingY) 1px;
	background-position:-2px -2px, -2px -2px, -1px -1px, -1px -1px;
}

#deathMenu_respawnButton {
	position: absolute;
    font-size: 12px;
    text-shadow: 1px 1px 0px #132f2e;
    bottom: 36px; /* bottom: 291px; */
    right: 108px;
    z-index: 5;
    padding: 10px 15px;
    text-align: center;
    cursor: pointer;
    outline: none;
    color: #fff;
    background-color: #4cafaa;
    border: none;
    border-radius: 15px;
    box-shadow: 0 7px #ffffff91;
    border: 1px solid #1f545d;
}

#deathMenu_respawnButton:hover {
	background-color: #3e8e7f;
}

#deathMenu_respawnButton:active {
	background-color: #3e8e86;
	box-shadow: 0 3px #ffffff91;
	transform: translateY(4px);
}

#deathMenu_homeButton {
	position: absolute;
    font-size: 12px;
    text-shadow: 1px 1px 0px #132f14;
    bottom: 36px; /* bottom: 291px; */
    right: 15px;
    z-index: 5;
    padding: 10px 15px;
    text-align: center;
    cursor: pointer;
    outline: none;
    color: #fff;
    background-color: #4CAF50;
    border: none;
    border-radius: 15px;
    box-shadow: 0 7px #ffffff91;
    border: 1px solid #1f5d23;
}

#deathMenu_homeButton:hover {
	background-color: #3e8e41;
}

#deathMenu_homeButton:active {
	background-color: #3e8e41;
	box-shadow: 0 3px #ffffff91;
	transform: translateY(4px);
}

#deathMenu_firstTimeVisitUI {
	display: none;

	position: absolute;
	left: calc(50%);
	top: calc(50%);
	transform: translate(-50%, -50%);
	width: 400px;
}

#deathMenu_FTV_description {
	padding: 15px;
    font-size: 14px;
}

#deathMenu_FTV_goToDeathShopButton {
	padding: 5px 20px;
    font-size: 13px;
    margin: 10px 10px 10px;
	height: 41px;
    width: 95%;
}

/* ********************** HEADER ********************** */
#deathMenu_header {
	position: absolute;
    top: 0;
    left: 0;
    background-color: #111111;
    width: 100%;
    height: 50px;
    z-index: 1;
    color: white;
    border-bottom: 1px solid black;
    box-shadow: 0px 0px 15px 0px #111938;
}

#deathMenu_header_title {
	position: absolute;
    top: 50%;
    left: 10px;
    transform: translate(0, -50%);
    font-size: 29px;
}

#deathMenu_header_EPandEXPParent {
	position: absolute;
    top: 50%;
    right: 10px;
    transform: translate(0, -50%);
    text-align: left;
}
/* **************************************************** */