@charset "UTF-8";
/* CSS Document */

@charset "UTF-8";
/* CSS Document */
.pet-and-familyHeader{
	background-color:#527b9d;
	
}


.pet-and-family-header-container {
	
	padding-top:50px;
	width:95vw;
	height: auto;
	margin:auto;
/*Toggle this border on and off as a guide*/
	border:1px dashed var(--toggle);
	align-content: center;	
		
}

.pet-and-family-header-tile-container {
	display: flex;
	/*flex-flow:  row wrap;  */
	justify-content: center;
	padding: 0px;
	margin: auto;
	list-style: none;
	border:1px dashed var(--toggle);
	height:auto;
}

.pet-and-family-header-item1, .pet-and-family-header-item2 {
	
	border:1px dashed var(--toggle);	
	
	
}

.pet-and-family-header-item1{
	min-width: 360px; 
	width:400px;
	height: auto;
	flex-grow:0.4; 		
}

.pet-and-family-header-item2{
	width:600px;
	
	
}



.pet-and-family-Next-Previous{
	width:auto;
	margin:auto;
	border:1px dashed var(--toggle);
	height:auto;
	padding:0px;
	display:flex;
	align-items:center;
	justify-content:center;
	
}


/* Content section */


.pet-and-family-Content{
	
	border: 1px dashed var(--toggle);
	
}



/*This is top lvl #1 content container for all others*/
.pet-and-family-content-container_main {
	/*YELLOW BORDER*/
	/* border:1px dashed yellow;*/
	
	max-width:1400px;
	height: auto;
	margin:auto;
/*Toggle this border on and off as a guide*/

	/* align-content: center; */
	display: flex;
	/* justify-content: flex-end;
	/*gap: 100px;*/
	/* right:0;*/ 
	/*justify-content: center;*/
	gap:20px;
	flex-wrap: wrap;
	align-self:flex-start;
	flex-direction:row;
	justify-content: space-around;
	
}




}/* lvl #2 Used for the header */
.pet-and-family-content-tile-container{
	justify-content: center;
	margin:auto;
}




/*lvl #2 Used for Branding*/
.pet-and-family-content-tile-container1 {
	/*PINK BORDER*/
	/*border:1px dashed pink;*/
	
	/*display: inline-flex; */
	max-width:1200px;
	height:auto;
	margin:auto;
	display:flex;
	flex-direction:row;
	flex-wrap:wrap;
	border:1px dashed var(--toggle);
	gap: 100px;
	justify-content: center;
	

}




/*lvl #2 Used for Packaging designs */
.pet-and-family-content-tile-container2 {
	/*display: inline-flex; */
	/* GREEN BORDER */
	/* border:1px dashed green; */
	
	max-width:474px;
	min-width:300px;
	max-height:1390px;
	display:flex;
	flex-flow:  row wrap; 
	/*border:1px dashed var(--toggle);*/
	height:auto;

	
	
}


/*lvl #2 Used for advertisements*/
.pet-and-family-content-tile-container3 {
	/* AQUA BORDER */
	/* 	border:1px dashed aqua; */
	
	padding-top:101px;
	/* max-width:900px;
	min-width:100px; */
	/*max-width:900px;*/
	display:flex;
	max-width:700px; 
	height:auto;
	margin:auto;
	flex-direction:row;
	flex-wrap:wrap;
	border:1px dashed var(--toggle);
	gap: 20px;
	justify-content: space-around;

	
}


/* lvl #2 USED FOR GALLERY */

.pet-and-family-content-tile-container4 {
	/* RED BORDER */
	/*border:1px dashed red;*/
	display: flex;
	flex-flow:  row wrap;
	flex-wrap:  wrap-reverse;
	justify-content: center;
	padding: 0px;
	margin: auto;
	list-style: none;
	height:auto;
	max-width:800px;
}



.item-image-page-sized{
	/* BLUE BORDER */
	/* border:1px dashed blue; */
	/* max-width:400px; */
	display:flex;
	width:300px;
	padding:0px 0 90px 0;
	/* Flex: 0 1 100px; */
	
}

.item-full-width; {
	/*display: inline-flex; */
	width:100%;
	height:auto;
	margin:auto;
	border:1px dashed var(--toggle);
	/*border:1px dashed blue;*/
	
}

.item-vertical-text{
	width:auto;
	Writing-mode: vertical-rl;
	
}

.item-text{
	width:400px;
}




.item-rounded-tile{
	/* PURPLE BORDER */
	/* border:1px dashed purple; */
	border-radius:20px;
	width:300px;
	/* min-width:150px; */
	height:300px;
	/* min-height:150px; */
	
}









.pet-and-family-content-item1, .pet-and-family-content-item2 {
	
	border:1px dashed var(--toggle);	
	
	
}

/*column of dynamic text */	
	
.pet-and-family-content-item1{
	
	max-width:600px;
	height:auto;
	padding-top:20px;
	
	
}






.pet-and-family-content-item2{
	width:auto;
	height:auto;
	background-color: rgba(230, 38,40,1.00);
	border:3px solid rgba(230, 38,40,0.00);
	box-shadow: var(--box-shadow);
	border-radius:5px;
	color:white;
	padding:10px 0 10px 0;
	
}



.pet-and-family-content-item3{
	
	/*
	width=474px;
	
	/*max-width:auto; */
	height:auto;
	border: 3px solid rgba(230, 38,40,1.00);
	border-radius:5px;
	box-shadow: var(--box-shadow);
	box-shadow: var(--box-shadow-reverse);
	

}


.pet-and-family-content-item4{
	width:auto;
	height:150px;
	/*margin:auto;*/
	border: 1 px dashed var(--toggle);
	/*border:1px dashed green;*/
	text-align: left;
	/* column-count:2; */
	/*padding: 20px 100px 20px 100px;*/
	/*padding: 20px 100px 20px 100px;*/
	padding: 20px 20px 0 20px;
}



.pet-and-family-divider{
	background-color: var(--toggle);
	height:3vh;
	width: 100vw;
}




	
	.pet-and-family-content-item4_m {
	width:660px;
	height:auto;
	border: var(--toggle);
	Text-align: left;
	column-count: 1;
	column-gap: 15px;
	list-style:none;
	border: 1px solid black;
	padding-top: 20px;
	
}



.pet-and-family-content-item5{
	width=100%;
}


.pet-and-family-description {
	margin-top:20px;
	TEXT-JUSTIFY:LEFT;
}







/* Breakpoints	*/
		/* Extra small devices (phones, 600px and down) */
@media screen and (max-width: 600px) {

.pet-and-family-content-item4{
 	display: none; 
}

.pet-and-family-content-item4_m {
	display: content; 
}

}


/* Small devices (portrait tablets and large phones, 600px and up) */
@media screen and (min-width: 601px) and (max-width: 767px)  {

.pet-and-family-content-item4{
 	display: content; 
}

.pet-and-family-content-item4_m {
	display: none; 
}

}


/*Medium devices (landscape tablets, 768px and up) */
@media screen and (min-width: 768px) and (max-width: 991px) {

.pet-and-family-content-item4{
 	display: content; 
}

.pet-and-family-content-item4_m {
	display: none; 
}

}


/* Large devices (laptops/desktops, 992px and up) */
@media screen and (min-width: 992px) {

.pet-and-family-content-item4{
 	display: content; 
}

.pet-and-family-content-item4_m {
	display: none; 
}

}


/* Exra large devices (large laptops and desktops, 1200px and up) */
@media screen and (min-width: 1200px) {

.pet-and-family-content-item4{
 	display: content; 
}

.pet-and-family-content-item4_m {
	display: none; 
}

}