/*
-=-------------------------------=-
 *             C S S             *
 *  ~-~-~-~-~-~-~-~-~-~-~-~-~-~  *
 *        C A R O U S E L        *
 *  ~-~-~-~-~-~-~-~-~-~-~-~-~-~  *
 *     Design by Anna Greco      *
 *     www.houseofgreco.com      *
 *        Copyright 2026         *
-=-------------------------------=-
*/

.carousel .album table {
	margin: auto;
	width: 75%;
}

.carousel .album td {
	padding: 0px 7px 0px 7px;
}

.carousel .album .top-row-one img,
.carousel .top-row-two table {
	width: 700px;
}

.carousel .album .top-row-two img {
	width: 211px;
}

.carousel .album .top-row-two {
	margin: auto;
}

.carousel .album img {
	border: 1px solid rgba(145, 100, 115, 0.5);
	border-radius: 12px;
	box-shadow: 0px 3px 8px 0px rgba(35, 10, 15, 0.5);
	margin: 7px;
}

.caption {
	background: rgba(30, 10, 15, 0.5);
	border-radius: 12px;
	font-family: 'Baskerville';
	font-size: 15px;
	font-weight: 700;
	margin: 5px auto 20px auto;
	overflow: auto;
	padding: 10px 15px 10px 15px !important;
	text-align: justify;
	height: 100px;
}

.carousel .album img,
.caption {
	width: 300px;
}


/*	-=---------------=-
	 * MEDIA QUERIES *
	-=---------------=-  */


	/*	-=--------=-
		 * 1150px *
		-=--------=-  */

		@media screen and (max-width: 1150px) {

			.carousel .album .top-row-one img,
			.carousel .top-row-two table {
				width: 650px;
			}

		}

	/*	-=-------=-
		 * 950px *
		-=-------=-  */

		@media screen and (max-width: 950px) {

			.carousel .album .top-row-one img,
			.carousel .top-row-two table {
				width: 550px;
			}

		}

	/*	-=-------=-
		 * 800px *
		-=-------=-  */

		@media screen and (max-width: 800px) {

			.carousel .album .top-row-one img,
			.carousel .top-row-two table {
				width: 500px;
			}

		}

	/*	-=-------=-
		 * 700px *
		-=-------=-  */

		@media screen and (max-width: 700px) {

			.carousel .album td {
				padding: 0px 5px 0px 5px;
			}

			.carousel .album img {
				margin: 5px;
			}

			.carousel .album .top-row-one img,
			.carousel .top-row-two table {
				width: 450px;
			}

		}

	/*	-=-------=-
		 * 600px *
		-=-------=-  */

		@media screen and (max-width: 600px) {

			.caption {
				display: none;
			}

		}

	/*	-=-------=-
		 * 550px *
		-=-------=-  */

		@media screen and (max-width: 550px) {

			.carousel .album .top-row-one img,
			.carousel .top-row-two table {
				width: 400px;
			}

		}

	/*	-=-------=-
		 * 500px *
		-=-------=-  */

		@media screen and (max-width: 500px) {

			.carousel .album td {
				padding: 0px 3px 0px 3px;
			}

			.carousel .album img {
				margin: 3px;
			}

			.carousel .album .top-row-one img,
			.carousel .top-row-two table {
				width: 375px;
			}

		}

	/*	-=-------=-
		 * 450px *
		-=-------=-  */

		@media screen and (max-width: 450px) {

			.carousel .album .top-row-one img,
			.carousel .top-row-two table {
				width: 350px;
			}

		}

	/*	-=-------=-
		 * 400px *
		-=-------=-  */

		@media screen and (max-width: 400px) {

			.carousel .album .top-row-one img,
			.carousel .top-row-two table {
				width: 300px;
			}

			.carousel .album .top-row-two img {
				width: 89px;
			}

		}

@media screen and (max-width: 1150px) {.carousel .album .top-row-two img {width: 195px;}}
@media screen and (max-width: 950px) {.carousel .album .top-row-two img {width: 162px;}}
@media screen and (max-width: 850px) {.carousel .album .top-row-two img {width: 171px;}}
@media screen and (max-width: 800px) {.carousel .album .top-row-two img {width: 155px;}}
@media screen and (max-width: 700px) {.carousel .album .top-row-two img {width: 140px;}}
@media screen and (max-width: 600px) {.carousel .album .top-row-two img {width: 135px;}}
@media screen and (max-width: 550px) {.carousel .album .top-row-two img {width: 120px;}}
@media screen and (max-width: 500px) {.carousel .album .top-row-two img {width: 115px;}}
@media screen and (max-width: 450px) {.carousel .album .top-row-two img {width: 107px;}}
@media screen and (max-width: 400px) {.carousel .album .top-row-two img {width: 92px;}}

@media screen and (max-width: 1150px) {.carousel .album img, .caption {width: 275px;}}
@media screen and (max-width: 1050px) {.carousel .album img, .caption {width: 250px;}}
@media screen and (max-width: 950px) {.carousel .album img, .caption {width: 225px;}}
@media screen and (max-width: 900px) {.carousel .album img, .caption {width: 225px;}}
@media screen and (max-width: 850px) {.carousel .album img, .caption {width: 210px;}}
@media screen and (max-width: 800px) {.carousel .album img, .caption {width: 210px;}}
@media screen and (max-width: 750px) {.carousel .album img, .caption {width: 200px;}}
@media screen and (max-width: 725px) {.carousel .album img, .caption {width: 190px;}}
@media screen and (max-width: 700px) {.carousel .album img, .caption {width: 185px;}}
@media screen and (max-width: 675px) {.carousel .album img, .caption {width: 180px;}}
@media screen and (max-width: 650px) {.carousel .album img, .caption {width: 175px;}}
@media screen and (max-width: 625px) {.carousel .album img, .caption {width: 170px;}}
@media screen and (max-width: 600px) {.carousel .album img, .caption {width: 155px;}}
@media screen and (max-width: 575px) {.carousel .album img, .caption {width: 150px;}}
@media screen and (max-width: 550px) {.carousel .album img, .caption {width: 140px;}}
@media screen and (max-width: 525px) {.carousel .album img, .caption {width: 135px;}}
@media screen and (max-width: 500px) {.carousel .album img, .caption {width: 130px;}}
@media screen and (max-width: 475px) {.carousel .album img, .caption {width: 125px;}}
@media screen and (max-width: 450px) {.carousel .album img, .caption {width: 115px;}}
@media screen and (max-width: 425px) {.carousel .album img, .caption {width: 105px;}}
@media screen and (max-width: 400px) {.carousel .album img, .caption {width: 110px;}}
@media screen and (max-width: 375px) {.carousel .album img, .caption {width: 105px;}}

@media screen and (max-width: 850px) {.carousel .album img {margin: 0px;}}
@media screen and (max-width: 600px) {.carousel .album img {margin: 3px;}}
@media screen and (max-width: 500px) {.carousel .album img {margin: 2px;}}
@media screen and (max-width: 400px) {.carousel .album img {margin: 1px;}}
@media screen and (max-width: 375px) {.carousel .album img {margin: 0px;}}

@media screen and (max-width: 800px) {.carousel .album .main table {width: 90%;}}
@media screen and (max-width: 600px) {.carousel .album .main table {width: 95%;}}
@media screen and (max-width: 550px) {.carousel .album .main table {width: 96%;}}
@media screen and (max-width: 500px) {.carousel .album .main table {width: 97%;}}
@media screen and (max-width: 450px) {.carousel .album .main table {width: 98%;}}
@media screen and (max-width: 400px) {.carousel .album .main table {width: 99%;}}
@media screen and (max-width: 375px) {.carousel .album .main table {width: 99%;}}
