.caro-container {
	width: 100%;
	margin: 0 auto;
	
	background-color: darksalmon;
	border: ridge 1em darksalmon;
	box-sizing: border-box;
	
	display: flex;
	flex-flow: column nowrap;
	
	user-select: none;
	
	overflow: hidden;
}

.caro-contentContainer {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;	
}

.caro-buttonContainer {
	flex: 0 0;
	

	display: flex;
	flex-flow: row nowrap;
		
	width: 100%;
	margin: 0 auto;
	
	justify-content: center;
	user-select: none;
}

.caro-title, .caro-button {
	text-align: center;

	display: flex;
	align-items: center;
	justify-content: center;
	
	flex: 1 1;
	
	font-size: clamp(1vw, 1.5vh, 3.5vw);
	padding: 0.4em;
	margin: 0.4em 0.4em;
		
	background-color: gray;
	box-sizing: border-box;
  	border: outset 0.4em gray;
  	
  	justify-content: center;
	align-items: stretch;
	text-align: center;
	z-index: 100;
}

.caro-button {
	cursor: pointer;
	user-select: none;
}

.caro-button:active {
  	border: inset 0.4em gray;
	user-select: none;
}

.caro-content {
	display: flex;
	flex: 1;
}

.caro-content video {
  width: 100%;
  height: auto;
  max-width: 100%;
  display: block;
}

.caro-content img {
  width: 100%;
  height: auto;
  max-width: 100%;
  display: block;
  object-fit: contain;
  
  display: flex;
  align-items: center; 
  justify-content: center;
}




.wideCaro-container {
	display: flex;
	flex-flow: row nowrap;
	
	height: 100%;
	width: 100%;
	
	padding: 2%; /* This is key */
	gap: 2%; 

	
	background-color: darksalmon;
	border: ridge 1em darksalmon;
	box-sizing: border-box;
}

.wideCaro-button {
  box-sizing: border-box;
  
  margin: 0;              /* Remove external spacing */
  padding: 0.4em;        /* Controlled internal space */
  
  display: flex;
  align-items: center;
  justify-content: center;

  text-align: center;

  font-size: clamp(1.0vw, 1.5vh, 3vw);
  writing-mode: vertical-lr;
  text-orientation: upright;
  font-weight: bold;
  
	background-color: gray;
	box-sizing: border-box;
  	border: outset 0.4em gray;
  
  cursor: pointer;
}

.wideCaro-button:active {
  	border: inset 0.4em gray;
}

.wideCaro-contentContainer {
	flex: auto;

	display: flex;
	flex-flow: row nowrap;
	gap: 2%;
	
	object-fit: contain;
}

