html {
  	height: 100%;
}

body {
	background: rgb(255,253,252);
/*	background: linear-gradient(180deg, rgba(214,214,214,1) 0%, rgba(249,249,249,1) 15%, rgba(249,249,249,1) 85%, rgba(214,214,214,1) 100%);*/
	background-repeat: no-repeat; /* This will prevent the background from repeating */
	background-attachment: fixed; /* This will fix the background relative to the viewport */
	background-size: cover; /* This will make sure the background covers the entire body */
  	display: flex;
  	flex-direction: column;
  	justify-content: flex-start;
  	align-items: center;
  	min-height: 100vh;
  	height: auto;
  	width: 100vw;
  	margin: 0;
  	overflow-x: hidden;
}

#particleCanvas {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1; /* Ensures the canvas is behind other content */
}


.centered-container {
  	margin-top: 10%;
	display: flex;
  	flex-direction: column;
  	align-items: center; /* Center the .grid and .button-container horizontally */
  	width: 95%; /* Take up full width to center children properly */
	max-width: 900px;  /* Other styles remain unchanged */
}

/* Ensure columns do not get too narrow on smaller screens */
@media (max-width: 600px) {
  	.centered-container {
    	margin-top: 20%;
  	}
}

/* Smaller devices (landscape phones, less than 768px) */
@media (max-width: 768px) {
  	.centered-container {
    	margin-top: 20%;
  	}
}

/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575px) {
   	.centered-container {
    	margin-top: 20%;
  	}
}

/* Extra small devices (portrait phones, less than 480px) */
@media (max-width: 480px) {
   	.centered-container {
    	margin-top: 20%;
  	}
}

/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 320px) {
   	.centered-container {
    	margin-top: 20%;
  	}
}

.footer	{
/*	border-top: 2px solid #E1E1E1;*/
	width: 100%;
	margin-left: 6px;
	margin-right: 6px;
	text-align: center;
  	font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
}

.social {
	padding-top: 20px;
	max-width: 35px;
}

.contact {
	margin-top: 1em;	
	font-size: 19px;	
}

.legal {
	font-size: 14px;
}

.image-emitter {
	width: 50px;
}