/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/**reset^**/

.audiowide-regular {
  font-family: "Audiowide", sans-serif;
  font-weight: 400;
  font-style: normal;
}


.MainNav {
    background-color:rgb(191, 236, 236);
	width:100%;
	font-family: "Audiowide";
	font-size:20px;
	position:sticky;
	top:0;
	margin:0;
	height:50px;
	padding-top:15px;
	z-index: 10;
}

#QuinnLogo {
	height:30px;
	padding-top:0px;
	padding-bottom:0px;
	vertical-align:middle;
}

#searchbar {
	border-radius: 5px;
	padding:5px;
	font-family: "Audiowide";
}

select {
	font-family: "Audiowide";
	border-style:none;
	padding:5px;
	width: fit-content;
	border-radius:5px;
}

option {
	font-family: "Audiowide";
	border-style:none;
	padding:5px;
	width: fit-content;
	border-radius:5px;
}


#leftnav {
	left:50px;
	position:absolute;
}

#rightnav {
	position:absolute;
	right:50px;
}

#HomePage {
	display:grid;
	place-items:center;
	grid-template-rows: auto auto auto auto 1fr auto 1fr 1fr auto;
	grid-template-columns: 1fr 1fr 1fr;
	margin-left:5%;
	margin-right:5%;
	background-color:white;
	border-radius:15px;
	padding-bottom: 50px;
}

body {
	background-color:rgb(140, 173, 189);
	
}

.shopall {
	place-items:center;
	grid-area: 9 / 2;
	margin-top:100px;
	display:block;
	margin:auto;
}

button {
	width: fit-content;
	padding:15px;
	font-family: "Audiowide", sans-serif;
	background-color: cyan;
	font-size:45px;
	border-radius:10px;
	
}

button:hover {
	background-color:rgb(0, 207, 207);
	cursor: pointer;
}

a {
	text-decoration: none;
	color:rgb(0, 0, 0);
	font-weight: bolder;

}


#RedField {
	font-family:'Courier New', Courier, monospace;
	font-weight: bolder;
	opacity: 0.5;
	margin-top:-50px;
	margin-bottom:25px;
}


#shoppingcart {
	width:100px;
	position:fixed;
margin-left:87%;
margin-top:35%;
text-align: center;
font-family:"Audiowide";
z-index: 5;
background-color:white;
padding:10px 5px 5px 10px;
width:50px;
border-radius:50%;
border: solid 3px rgb(96, 165, 222);
}

#ShopNow {
	grid-area: 1 / 1 / 1 / span 3;
	text-align:center;
	position: relative;
	margin:0;
	border-radius:0px;
}

.Prod { 
	border: black double 5px;
	border-radius: 25px;
	justify-content:center;
	height:350px;
	width:350px;
	place-items: center;
	margin-bottom:0;
	margin-top:0;
}
.ProdInCart { 
	border: black double 5px;
	border-radius: 25px;
	justify-content:center;
	height:200px;
	width:200px;
	place-items: center;
	margin-bottom:0;
	margin-top:0;
	float:left;
	display:inline;
}

figcaption {
	font-family:'Courier New', Courier, monospace;
	font-weight: bolder;

}

.Going {
	border-radius:20px;
	justify-content: center;
	place-items:center;
	width:1050px;
	height:300px;
	background-image: url(images/bahhhquinnmerch/Shimmer.png);
	background-color:rgba(29, 29, 29, 0.6);
	background-size:cover;
	background-blend-mode:darken;
	color:white;
	font-family: 'Broadway', sans-serif;
	font-size: 80px;
	text-align:center;
	display:flex;
	justify-content:center;
	
}


#GoingAway {
	grid-area: 2 / 1 / 2 / span 3;
	text-align:center;
}
#GoingAwaySoon {
	grid-area: 3 / 1 / 3 / span 3;
	text-align:center;
	width: auto;
	 border: black 5px double;
	 border-radius: 25px;
	cursor: pointer;
	margin-left:10%;
	margin-right:10%;
	margin-top:0;
	margin-bottom:100px;
}



#ShopByCats {
	grid-area: 4 / 1 / 4 / span 3;
	text-align:center;
	margin-left:5%;
	margin-right:5%;
	margin-bottom:0;
}

#Cat1 {
	grid-area: 5 / 1;
	margin-left:5%;
	margin-right:5%;
	background-image: url(images/bahhhquinnmerch/LogoCrewneck.png);
	background-color:rgba(29, 29, 29, 0.6);
	background-size: cover;
	background-blend-mode:darken;
	color:white;
	font-family: "Audiowide";
	font-size: 30px;
	text-align:center;
	display:flex;
	justify-content:center;
}

#Cat2 {
	grid-area: 5 / 2;
	margin-left:5%;
	margin-right:5%;
	background-image: url(images/bahhhquinnmerch/LogoMug.png);
	background-color:rgba(29, 29, 29, 0.6);
	background-size: cover;
	background-blend-mode:darken;
	color:white;
	font-family: "Audiowide";
	font-size: 30px;
	text-align:center;
	display:flex;
	justify-content:center;
}

#Cat3 {
	grid-area: 5 / 3;
	margin-left:5%;
	margin-right:5%;
	background-image: url(images/bahhhquinnmerch/QuinnCRKKeychain.png);
	background-color:rgba(29, 29, 29, 0.6);
	background-size: cover;
	background-blend-mode:darken;
	color:white;
	font-family: "Audiowide";
	font-size: 30px;
	text-align:center;
	display:flex;
	justify-content:center;
	
}

.FanFavs {
	grid-area: 6 / 1 / 6 / span 3;
	text-align:center;
	margin-left:5%;
	margin-right:5%;
	margin-bottom:25px;
}

.FanFav1 {
	grid-area: 7 / 1;
	text-align:center;
	margin-left:5%;
	margin-right:5%;
}

.FanFav2 {
	grid-area: 7 / 2;
	text-align:center;
	margin-left:5%;
	margin-right:5%;
}

.FanFav3 {
	grid-area: 7 / 3;
	text-align:center;
	margin-left:5%;
	margin-right:5%;
}

.FanFav4 {
	grid-area: 8 / 1;
	text-align:center;
	margin-left:5%;
	margin-right:5%;
	margin-top:50px;
	margin-bottom:50px;
	
	
}

.FanFav5 {
	grid-area: 8 / 2;
	text-align:center;
	margin-left:5%;
	margin-right:5%;
	margin-top:50px;
	margin-bottom:50px;
	
}

.FanFav6 {
	grid-area: 8 / 3;
	text-align:center;
	margin-left:5%;
	margin-right:5%;
	margin-top:50px;
	margin-bottom:50px;
	
}

footer {
	text-align:center;
	color:white;
}

#Who {
	background-color: rgb(222, 245, 245);
	margin-left:15%;
	margin-right:15%;
	margin-top:50px;
	border-radius: 25px;
	padding-top: 25px;
	padding-bottom: 25px;
	border:black double 5px;
}

h1 {
	font-family:"Audiowide";
	font-size: 40px;
	margin-bottom:50px;
	text-align:center;
}



.h1simulate {
	font-family:"Audiowide";
	font-size: 40px;
	margin-bottom:50px;
	text-align:center;
}

#InImageButton {
	z-index: 2;
	top:-250px;
	position:relative;

}

#WhoBlurb {
	text-align: center;
	margin-right:75px;
	margin-left:75px;
}

p {
	font-family: 'Courier New', Courier, monospace;
	font-weight: bolder;
}

#MeetTheCreators {
background-color:transparent;
display:grid;
grid-template-columns: auto;
grid-template-rows: 1fr 1fr 1fr;
margin-top:100px;
margin-left: 15%;
margin-right: 15%;
}

#CartHoldingCell {
	background-color:transparent;
display:grid;
grid-template-columns: auto;
margin-top:100px;
margin-left: 5%;
margin-right: 5%;
padding-bottom:0;
}

.MeetCreate {
background-color: rgb(222, 245, 245);
padding:25px;
border-radius: 25px;
display:inline;
margin-bottom:25px;
border:black double 5px;

}

.Profile1 {
	font-family: "Audiowide";
	font-size:x-large;
	text-align:center;
	z-index: 3;
	display:inline;
	margin-left:25px;
}

.Profile2 {
	font-family: "Audiowide";
	font-size:x-large;
	text-align:center;
	z-index: 3;
	display:inline-block;
	margin-left:25px;
	transform: scale(-1, 1);
	
}

.Creates1 {
text-align:center;
	display:inline;
	margin-left:50px;
}

.Creates2 {
text-align:center;
	display:inline-block;
	margin-right:50px;
	transform: scale(-1, 1);
	padding-right:50px;
}

.PFP1 {
	border-radius: 50%; 
	width:250px;
	float:left;
	display:inline;
	border:black solid 5px;
}


.Meetsies {
	font-family:"Audiowide";
	font-size: 40px;

	text-align:center;
}

#map {
	display:block;
	margin:auto;
}

#socials {
	display:block;
	text-align:center;
}

.socmedia {
	margin:10px;
	width:25px;
}

form {
	background-color: rgb(222, 245, 245);
	border-radius:25px;
	margin-right:25%;
	margin-left:25%;
	place-items:center;
	margin-top:50px;
	padding:15px;
	text-align:center;
	border:black double 5px;
}

input, textarea {
	width:250px;
	font-family:'Courier New', Courier, monospace;
	font-weight:bolder;
	 border-style: none;
    border-bottom: solid rgb(0, 207, 207);
	border-radius:5px;
	resize:none;
}

textarea {
	height:100px;
}

textarea:active {
	border-style: none;
    border-bottom: solid rgb(0, 207, 207);
}

#submitButton {
		width: fit-content;
	padding:15px;
	font-family: "Audiowide", sans-serif;
	background-color: cyan;
	font-size:30px;
	border-radius:10px;
	margin-top:-50px;
}

input[required]::placeholder {
	color:red;
}

#ShoppingPage {
	background-color: white;
	border-radius:25px;
	margin: 10%;
	margin-top: 5%;
padding:5%;
grid-area: 1 / 1 / 1 / span 3;
border:black double 5px;
}

#Shoppingsubtext {
	color: rgba(0, 0, 0, 0.559);
	font-family:'Courier New', Courier, monospace;
	font-weight:bolder;
	text-align:center;
	margin-top:-45px;
}

#shoppingpagecart {
	display:block;
	margin:auto;
}

.ProductName {
	font-family: "Audiowide";
	font-size:x-large;
	text-align:center;
	z-index: 3;
	display:inline;
	margin-left:25px;
}


#quantity {
		display:inline;
	float:right;
	margin-right: 10%;
	outline:black solid 2px;
}

h4 {
	font-family: "Audiowide";
	font-size: large;
	text-align:center;
	display:inline;
	margin-right:8%;
	float:right;
}