/* https://www.w3schools.com/howto/howto_css_aspect_ratio.asp */
.aspect-ratio-container {
	width: 100%;
	position: relative;
}
.aspect-ratio-1-1 {
	padding-top: 100%; /* 1:1 Aspect Ratio */
}
.aspect-ratio-16-9 {
	padding-top: 56.25%; /* 16:9 Aspect Ratio (divide 9 by 16 = 0.5625) */
}
.aspect-ratio-9-16 {
	padding-top: 160%; /* 9:16 Aspect Ratio (divide 16 by 9 = 1.8) */
}
.aspect-ratio-4-3 {
	padding-top: 75%; /* 4:3 Aspect Ratio (divide 3 by 4 = 0.75) */
}
.aspect-ratio-4-35 {
	padding-top: 84%; /* 4:3.5 Aspect Ratio */
}
.aspect-ratio-3-2 {
	padding-top: 66.66%; /* 3:2 Aspect Ratio (divide 2 by 3 = 0.6666)  */
}
.aspect-ratio-8-5 {
	padding-top: 62.5%; /* 8:5 Aspect Ratio (divide 5 by 8 = 0.625) */
}
.aspect-ratio-4-1 {
	padding-top: 25%; /* 4:1 Aspect Ratio (divide 1 by 4 = 0.25) */
}
.aspect-ratio-object {
	position: absolute;	
	left: 0;
	top: 0;	
	right: 0;
	bottom: 0;
	border: 1px solid lightgrey;
	width: 100%;
	height: 100%;
}
/*----------------------------------------------------------------*/
.text-marquee{
	font-size: 1.5em;
	color: brown;
	text-shadow: 0px 0px 1px #000000;
}
.text-marquee-mobile{
	position: absolute;
	left: 0;
	right: 0;
	top: 10px;
	width: 100%;
}
.text-marquee-laptop{
	position: absolute;
	left: 0;
	right: 0;
	bottom: 15px;
	width: 100%;
}
.mobile-show-only{
	display: block;
}
.laptop-show-only{
	display: none;
}
/* For mobile laptop: */
@media only screen and (min-width: 768px){
	.mobile-show-only{
		display: none;
	}
	.laptop-show-only{
		display: block;
	}
}

.padding-left-right{
	padding-left: 15px;
	padding-right: 15px;
}

.footer{
}