@charset "UTF-8";
/* CSS Document */
/* Pet & Family CSS Document by Melissa Sherley */


/*This is top lvl #1 content container for all others*/
.pet-and-family-content-container_main {
	max-width:1400px;
	height: auto;
	margin:auto;
	display: flex;
	gap:20px;
	flex-wrap: wrap;
	align-self:flex-start;
	flex-direction:row;
	justify-content: space-around;
}

.pet-and-family-hero-video{
	object-fit:cover; 
	opacity:1; 
	align-content:center; 
	border-radius:20px; 
	border:3px solid black;
}


/**** ((((LOGOS + BRAND COLOURS + BRAND FONTS))) ****/

/*lvl #2 Used for Branding*/
.pet-and-family-content-tile-container1 {
	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;
}

.pet-and-family-page-title{
	width:95vw;
}

.pet-and-family-page-title h5{
	line-height:50px; 
	padding-top:40px;
}

.item-rounded-tile{
	border-radius:20px;
	width:300px;
	height:300px;
}

.pet-and-family-logos{
	margin-bottom:20px;
}

.pet-and-family-main-logo{
	border-radius:20px; 
	box-shadow:var(--box-shadow);
}

.nutrition-sense{
	border: 3px solid rgba(23,39,54,1.00); 
	background-color: rgba(23,39,54,1.00); 
	box-shadow:var(--box-shadow);
}

.nutrition-sense-tile{
	margin:auto; 
	width:95%; 
	padding:110px 0 100px 0;
}

.tagline{
	border: 3px solid rgba(23,39,54,1.00); 
	box-shadow:var(--box-shadow);
}

.tagline-tile{
	margin:auto; 
	width:95%; 
	padding:120px 0 100px 0; 
}

.styleguide{
	margin-bottom:5px;
}

.styleguide-pet-and-family{
	color: white !important; 
	box-shadow:var(--box-shadow); 
	background-color:rgba(230,38,40,1.00);
}

.styleguide-pet-and-family-tile, 
.styleguide-nutrition-sense-tile{
	padding:40px 0 40px 0px; 
}

.nutrition-sense{
	color: white!important; 
	box-shadow:var(--box-shadow); 
	background-color: rgba(23,39,54,1.00);
}

.nutrition-sense-font-guide{
	box-shadow:var(--box-shadow); 
	border: 3px solid rgba(23,39,54,1.00);
}

.nutrition-sense-font-guide-tile{
	padding:37px 0 40px 0px;
}

.nutrition-sense-font-guide-tile p5{
	line-height:37px !important;
}


/**** ((((PACKAGING DESIGNS))) ****/

.pet-and-family-content-tile-container2 {
	max-width:474px;
	min-width:300px;
	max-height:1390px;
	display:flex;
	flex-flow:row wrap; 
	height:auto;
}

.pet-and-family-content-item3{
	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);
	padding:50px;
}

.packaging-designs-brand-title{
	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-item2-title{
	 padding:40px 0px;
}

.pet-and-family-content-item2-title h2{
	column-span:all;
}

.pet-and-family-content-item2-title p2{
	line-height:30px; 
	text-align:left;
}

.red{
	color:rgba(230, 38,40,1.00)
}

/* motion graphic videos*/
.pet-and-family-content-item1{
	max-width:600px;
	height:auto;
	padding-top:20px;
}


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

.pet-and-family-fiftypx-divider{
	height:50px;
}


/**** ((((ADVERTISEMENTS))) ****/

/*lvl #2 Used for advertisements*/
.pet-and-family-content-tile-container3 {
	padding-top:101px;
	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;
}

.pet-and-family-content-tile-container3 img{
	box-shadow:var(--box-shadow);
}

.pet-and-family-content-tile-container3-advertisement{
	padding-top:100px;
}

.pet-and-family-content-tile-container3-advertisement_space{
	margin-bottom:5px;
}

.item-image-page-sized{
	display:flex;
	width:300px;
	padding:0px 0 90px 0;
}

/**** ((((IMAGE GALLERY CAROUSEL))) ****/


/* lvl #2 USED FOR GALLERY */
.pet-and-family-content-tile-container4 {
	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;
}

/* Additional Styles for this section can be found in main-gallery.css */



/**** ((((MOTION GRAPHIC VIDEO))) ****/

.Pet-and-family-motion-graphic-video{
	max-width:800px;
}	

.Pet-and-family-motion-graphic-video video{
	border:1px solid black; 
	box-shadow: var(--box-shadow);
	object-fit:cover;
}