/*-- Index CSS --*/

*	{padding: 0px; margin: 0px; text-decoration: none; color: #000000;}
a:link 		{color: #000000;}
a:hover 	{color: #FF0000;}
img:hover 	{border: none;}

#container{
	border: none;
	width: 80%;
	padding: 50px 0px 0px 0px;
	margin: auto;
}

/*-- Panels --*/
#panels{
	display: flex;
	justify-content: center;
	padding: 50px 0px 0px 0px;
	margin: auto;
}


.row-land{
    display: flex;
    flex-wrap: wrap;        /* Allows side-by-side images to stack on mobile */
    justify-content: center;
    gap: 40px;              /* Horizontal space between 2 portraits */
    width: 100%;            /* Allows row to be as wide as its content */
 	max-width: 1100px; 
}

.card-land{
	display: block;
    border: 1px #333 solid;
    box-shadow: 2px 4px 8px 2px rgba(0, 0, 0, 0.2);
	xxxflex: 1 1 auto; /* Grows card to max room */
	xxxflex: 0 1 auto; /* No Grow max width to .html style */
    xxxmin-width: 0; /* CRITICAL: Allows the card to shrink below the image's size */
    padding: 10px 11.5px 10px 10px;
    box-sizing: border-box;
}

.card-land img{
    display: block;
    border: 1px #333 solid;
    box-shadow: 2px 4px 8px 2px rgba(0, 0, 0, 0.2);
    width: 100%;      /* Image fills the card width */
    max-width: 100%;  /* Image never overflows the card */
    height: auto;     /* Maintains aspect ratio */
 	align-self: flex-start;
}


/*-- End CSS --*/