@media (prefers-color-scheme: dark) {
	.btn-var-curr {
		background-color: #3B4656;
		cursor: default;
	}
	.btn-var-curr:hover {
		background-color: #3B4656;
	}
	button {
		color: #EEF3F7;
		background-color: #647690;
		border: none;
		cursor: pointer;
	}
	button:hover {
		transition: 0.1s ease;
		background-color: #445062;
	}
	

  .download-btn {
		font-weight: bold;
		background-color: #46726B;
  	font-size: 100%;
		padding: 10px;
		margin-top: 1em;
  }
	
  .download-btn:hover {
		background-color: #334D49;
  }


}

@media (prefers-color-scheme: light) {
	.btn-var-curr {
		background-color: #797D80;
		color: white;
		cursor: default;
	}
	.btn-var-curr:hover {
		background-color: #797D80;
	}
	button {
		color: black;
		background-color: #BBBFC2;
		border: none;
		cursor: pointer;
	}
	button:hover {
		transition: 0.1s ease;
		background-color: #9FA2A5;
	}
	
  .download-btn {
		font-weight: bold;
		background-color: #68AFA3;
  	font-size: 100%;
		padding: 10px;
		margin-top: 1em;
  }
	
  .download-btn:hover {
		background-color: #58847D;
  }

}



@media (min-width: 1000px)
{
	.wall-preview {
		margin-left: 1%;
		display: flex;
		align-items: center;
		flex-direction: row;
		padding-bottom: 1%;
	}

	.info-box {
		display: flex;
		flex-direction: column;
		column-gap: 2px;
		padding-left: 1%;
		width: 60%;

	}
}

@media (max-width: 999px)
{
	img {
		max-width: 100%;
	}

	.wall-preview {
		margin-left: 1%;
		align-items: center;
		flex-direction: column;
		margin: 3%;
	}

	.info-box {
		display: flex;
		flex-direction: column;
		column-gap: 2px;
		padding-left: 1%;
		max-width: 80%;

	}
}