:root{
	--border-width: 4px;
}
.button{
	background-color: rgb(0,0,0,0);
	border-radius: 14px;
	box-shadow: 0px 8px 16px rgb(0,0,0,70%);
	
	transition-duration: 0.1s;
}

.start_button{
	background-color: rgb(0,0,0,0);
	border-radius: 14px;
	box-shadow: 0px 8px 16px rgb(0,0,0,70%);
	
	transition-duration: 0.1s;
}


.start_button:hover{
	cursor: pointer;
	scale: 1.1;
}
.unactive:hover{
	cursor: default;
	scale:1;
}


.backround-gradient{
	background: linear-gradient(rgb(0,0,0,0), rgb(255,255,255));
}
.backround-gradient-list{
	background: linear-gradient(rgb(0,0,0,0), rgb(122, 204, 255));
}
.circle{
	border-radius:50%;
	border:0px;
}



.close_btn{
	background-color: rgb(0,0,0,0);
	border: solid var(--border-width) red;
	border-radius: 14px;
	box-shadow: 0px 8px 16px rgb(0,0,0,70%);
	
	transition-duration: 0.1s;
	
}
.close_btn:hover{
	border: solid var(--border-width) rgb(255,100,100);
	cursor: pointer;
	scale: 1.1;
}


#red{
	border: solid var(--border-width) red;
	box-shadow: 0px 8px 16px rgb(255,0,0,70%);
}

#blue{
	border: solid var(--border-width) blue;
	box-shadow: 0px 8px 16px rgb(0,0,255,70%);
}
#golden{
	border: solid var(--border-width) #F39C12;
	box-shadow: 0px 8px 16px rgb(255,255,0,70%);
}
#green{
	border: solid var(--border-width) green;
	box-shadow: 0px 8px 16px rgb(0,255,0,70%);
}
#gray{
	border: solid var(--border-width) gray;
}
#fiolet{
	border: solid var(--border-width) rgb(212, 0, 255);
	box-shadow: 0px 8px 16px rgb(212, 0, 255,70%);
}
#black{
	border: solid var(--border-width) rgb(0, 0, 0);
	box-shadow: 0px 8px 16px rgb(0, 0, 0,70%);
}