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

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

.enclose-all{
	width:95vw;
	margin:auto;
}


.pizza-header-container {

	border:1px dashed red;
	width:90vw;
	max-width:1200px;
	/*max-width:1400px;
	width:80vw;
	height: auto;
	margin:auto;
/*Toggle this border on and off as a guide*/
	border:1px dashed var(--toggle);
	align-content: center;	
	justify-content:center;
	margin:auto;
	padding-top:50px;

}


.pizza-header{
	background-color:rgba(213,32,43,1.00);
	height:20vh;
	width:100vw;
	align-content:center;
}



.pizza-category1-wrapper{
	max-width:660px;
	width:90vw;
}



/* NEW INSERT*/

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

.pizza-divider-half{
	background-color: var(--toggle);
	height:1.5vh;
	width: 100vw;
}

.pizza-divider-double{
	background-color: var(--toggle);
	height:6vh;
	width: 100vw;
}




/* DASHBOARD GRID */
.pizza-logo-info-pic-dashboard-wrapper{
	border: 1px dashed var(--toggle);
	display: grid;
	aspect-ratio:1619/1080;
	/* max-width:75vh; */
	width:100%;
	margin:auto;
	height:auto;
	gap:10px;
	grid-template-columns:31.6% 66.65%;
	grid-template-rows: 49% 49%;
	grid-template-areas: 
		'logo feature'
		'info feature';
}

/* DASHBOARD AREAS */
.dashboard-logo{
	grid-area: logo;
	border:3px solid rgba(61,46,46,0.00);
	justify-content:center;
	align-content:center;
	border-radius:10px;
	box-shadow:var(--box-shadow);
	overflow:hidden;
	background-color:black;
	padding:15%;
}

.dashboard-info{
	grid-area: info;
	border:3px solid rgba(213,32,43,1.00);
	background-color:rgba(213,32,43,1.00);
	border-radius:10px;
	box-shadow:var(--box-shadow);
	/* justify-content:center; */
	align-content:space-around;
	display:flex;
	flex-wrap:wrap;
	padding:10% 1%;
	overflow:hidden;
	/* gap:5%; */
	container-type:inline-size;
	justify-content: center;
}

.dashboard-feature{
	border:1px dashed var(--toggle);
	grid-area: feature;
	border-radius:10px;
	box-shadow:var(--box-shadow);
	width:100%;
	overflow:hidden;
	background-color:rgba(213,32,43,1.00);
}

.pizza-info{
	
}


.pizza-definition{
	border:1px solid black; 
	align-content:center; 
	padding:10px; 
	margin-bottom:20px; 
	max-width:75vh;
	border-radius:10px;
}

.pizza-definition-box{
	display: flex; 
	gap:10px; 
	border-radius:10px; 
	padding:10px; 
	text-align:left;
}

/* ENDS DASHBOARD GRID SECTION */



.pizza-header-tile-container {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	padding: 0px;
	margin: auto;
	list-style: none;
	border:1px dashed var(--toggle);
	height:auto;
}


/*
.pizza-development-container{
	border:2px solid green;
	border-radius:50px;
	overflow:hidden;
	padding:50px;
	width:100%;
	text-align:left;
	container-type: inline-size;

}
*/

.pizza-development-container{

	line-height:10px;
	width:100%;
	text-align:left;
	padding-left:7%;
	
	

}

.pizza-development-image{
	border-radius:50px;
	overflow:hidden;
	padding: 1% 5% 3% 5%;
	background-color:white;
}




.pizza-icon-list{
	max-width:300px;
	padding:10px;
	border:1.5px solid #b61f2f;
	border-radius:20px;
	display:flex;
	justify-content: space-evenly;
	margin-bottom:20px;
	filter:sepia(100%);
}


.pizza-icons{
	display:flex;
	border-radius:30%;
	width:23%;
	min-width:47px;
	
}


.pizza-packaging-container{
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	max-width:800px;
	padding:10px;
	gap:20px;
	margin:auto;
	
}

.pizza-packaging{
	display:flex;
	filter:drop-shadow(5.5px 5.5px 10px rgba(0,0,0,0.25));
	width:40%;
	min-width:350px; 
}

.pizza-packaging2{
	filter:drop-shadow(5.5px 5.5px 10px rgba(0,0,0,0.25));
	width:49%;

	min-width:150px; 
}

.logo-info-wrapper{
	display:grid;
	height:auto;
	border:1px dashed var(--toggle);

	
}




.pizza-item-rounded-tile1060{
	/* aspect-ratio:1060/580; */
	border-radius:20px;
	box-shadow:var(--box-shadow);
	max-width:600px;
	/* max-height:581px; */
	height:auto;
	/* object-fit:cover;
	overflow:hidden;
	*/
	
}	





.pizza-item-rounded-tile300{
	
	border-radius:5px;

	/* 
	MAX-width:100%;
	MIN-WIDTH:30%;
	*/
	
	max-width:789px;
	width: auto;
	height:350px;
	padding:0%; 
	align-content:center;
	justify-content:center;
	color:white;

	background-color:rgba(213,32,43,1.00);
	border: 1.5px solid black;
	margin-bottom:20px;

	
	/* object-fit: cover;
	overflow:hidden; */

}

.about-quietude{
	max-width:75vh; 
	height:auto;
	border:1px solid black; 
	border-radius: 8px;
	align-content:center; 
	margin-bottom:20px; 
	background-color: white; 
	filter:drop-shadow(5.5px 5.5px 10px rgba(0,0,0,.25));
	object-fit:cover;
	overflow:hidden;
}

.pizza-item-rounded-tile740x740{
	border:1px dashed var(--toggle);
	background-color:rgba(213,32,43,1.00);
	display:flex;
	border-radius:20px;
	max-width: 500px;
	height:auto;
	background-color:rgba(42,105,240,0.00);
	margin-bottom:40px;
	object-fit:cover;
	overflow:hidden;
	/*align-items:flex-end;*/
	align-content:center;
	justify-content:center;
	align-items: center;
	filter:drop-shadow(5.5px 5.5px 10px rgba(0,0,0,0.3));

	
	/*
	background-image:url(../web-files/images_graphic-designs/19_BeautyScience.png); background-size: 100%;
	*/
	object-fit:cover;
}

.pizza-item-rounded-tile520x740{
	display:flex;
	border-radius:5px;
	box-shadow:var(--box-shadow);
	aspect-ratio:520/740;
	max-width:520px;

	max-height:740px;

	object-fit:cover;
	overflow:hidden;
	align-items:flex-end;
}


.pizza-item-3500{

	box-shadow:var(--box-shadow);

	/* min-width:95vw; */
	max-width:75vh;
	border:3px solid #b61f2f;
	object-fit:cover; 
	overflow:hidden; 
	border-radius:5px;
	height:auto; 
	margin:auto;
		
}






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

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

.pizza-header-item2{
	width:600px;
	
	
}



.pizza-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 */


.pizza-Content{
	
	border: 1px dashed var(--toggle);
	
}


.pizza-content-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;	
		
}

.pizza-content-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;
}

.pizza-content-item1, .pizza-content-item2 {
	
	border:1px dashed var(--toggle);	
	padding: ;
	
}

/*column of dynamic text */	
	
.pizza-content-item1{
	min-width: 320px;
	width:400px;
	height: auto;
	flex-grow:0.4;
	padding-right: 20px;
	
}






.pizza-content-item2{
	width:660px;

	
}

/* 100% width item */
.pizza-content-item3{
	width:90vw;	
	}


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



.pizza-content-item4{
	width:660px;
	height:auto;
	border: var(--toggle);
	Text-align: left;
	column-count: 2;
	column-gap: 15px;
	list-style:none;
	border: 1px solid black;
	padding: 20px;
	
}
	
	.pizza-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: 20px;
	
}


.pizza-description {
	margin-top:20px;
	TEXT-JUSTIFY:LEFT;
}




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

.pizza-content-item4{
 	display: none; 
}

.pizza-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)  {

.pizza-content-item4{
 	display: content; 
}

.pizza-content-item4_m {
	display: none; 
}

}


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

.pizza-content-item4{
 	display: content; 
}

.pizza-content-item4_m {
	display: none; 
}

}


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

.pizza-content-item4{
 	display: content; 
}

.pizza-content-item4_m {
	display: none; 
}

}


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

.pizza-content-item4{
 	display: content; 
}

.pizza-content-item4_m {
	display: none; 
}

}	
	
	








