@import "https://use.typekit.net/vke6loq.css";

/***** list of pets *****/
.list-body {
	background-color: #fff;
	/*margin: 22px;*/ /* 24 = this + table cellspacing */
}

#tblSearchResults tr {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-around;
}

.list-item {
	background-color: #f2f4f7;
	border: 1px solid #c7c7c7;
	border-radius: 5px;
	display: flex;
	margin-bottom: 24px;
	padding: 12px;
	width: 45%;
	
}

.list-animal-photo-block {
	background-color: #fff;
	border: 1px solid #d9d9d9 !important;
	border-radius: 5px;
	display: flex;
	height: 175px;
	width: 150px;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}

.list-animal-photo {
	border-radius: 5px;
	min-height: 175px;
}

.list-animal-info-block {
	display: flex;
	flex-direction: column;
	margin-left: 28px;
	font: normal 1.0rem/1.6 'azo-sans-web', 'pt sans', sans-serif;
}

.list-animal-name {
	font: 700 1.2rem/2.0 'azo-sans-web', 'pt sans', sans-serif;
}

.list-animal-name a {
	color: #333;
	text-decoration: none;
}

.list-animal-name a:hover {
	text-decoration: underline;
}

.list-animal-foundtype {
	display: none; /* always shows Animal in Custody? */
}



/*
banner

name

image + specs
	image
	add pics
	
	specs
		left/right

desc

buttons
*/


/***** single pet details *****/

/* banner */
#PetConnectBanner {
	/*center?*/
}

/* name */
.detail-animal-name {
	text-align: center;
	font: 700 1.2rem/2.0 'azo-sans-web', 'pt sans', sans-serif;
	padding-bottom: 12px;
}

/* photo + specs */
#DefaultLayoutDiv table + table > tbody > tr {
	display: flex;
	flex-direction: row;
}

/* photo */
#DefaultLayoutDiv table + table > tbody > tr > td {
	width: 420px !important; /* hardcoded into td */
}

/* more photos */
.detail-photo-links {
	display: flex;
	width: 220px;
	text-align: center;
	font: 1.0rem 'azo-sans-web', 'pt sans', sans-serif;
	flex-flow: row wrap;
	margin-left: 100px;
	justify-content: space-around;
}

/* specs - labels */
.detail-label {
	font: 700 1.0rem/1.6 'azo-sans-web', 'pt sans', sans-serif;
	text-align: left !important; /* hardcoded into table */
	padding-right: 12px;
}

/* specs - values */
.detail-value {
	font: 1.0rem/1.6 'azo-sans-web', 'pt sans', sans-serif;
}

/* description */
.detail-animal-desc {
	font: 1.0rem/1.6 'azo-sans-web', 'pt sans', sans-serif;
	padding-bottom: 12px;
}

/* buttons */
div#tblDescription + .group {
	/*flex col on mobile*/
}




/***** media queries *****/

/* smaller pic(s) */
/* pic ratios */
/* addl pic - left margin - remove */
/* botom table - width?? */



@media (max-width: 767px) {
	body {
		/*background-color: #ffe !important;*/
	}
	.list-item {
		flex-direction: column;
		width:100% !important;
	}
	.list-animal-info-block {
		margin-left: 0px;
	}
	
	#DefaultLayoutDiv table + table > tbody > tr > td {
		width: 85vw !important;
	}
	
	#DefaultLayoutDiv > table + table tr:nth-child(2) {
		display: flex;
		flex-direction: column;
		margin: 0 auto;
	}
	
	.detail-animal-photo {
		width: 85vw !important;
	}
	
	.detail-photo-links {
		margin-left: 0;
		width: 85vw;
		padding: 12px 0;
	}
	
	.detail-label {
		
	}
	
	#trSpecies {
		display: table-row !important;
	}
	.detail-body {
		/*width: auto;*/
	}
}