@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300&display=swap');

@-ms-viewport{
	width: device-height;
}
.affiliate :hover{
	cursor: help;
}


body{
	background-color:  rgb(15, 15, 15);
	color: white;
	font-family: 'Roboto', Arial Black, sans-serif;
	margin: 0 auto;
	display:flex;
	flex-direction:column;
	width: 95%;
	min-width: 950px;
	justify-content: center;
	align-items:center;
	zoom: 90%;
}
.affiliate span{
	color: black;
	content: ;
}
a{
	color: rgb(255, 107, 137);
	text-shadow: 0 0 1px grey;
}

nav{
	text-align: center;
	margin-bottom:0;
	padding: 0;
	margin:0;
	
	
}
ul{
	text-align:center;
}
.mode{
	position: fixed;
	bottom: 5%;
	width: 200px;
	font-size: 28px;
	background-color: rgb(60, 60, 60);
	color: white;
	box-shadow: 3px 3px black;
	text-transform: uppercase;
	font-weight: bold;
	text-shadow: 2px 2px black, 1px 1px grey
}
.mode:hover{
	color: grey;
}
p a:hover{
	background-color: rgb(45, 45, 45);
}
li a:hover{
	background-color: rgb(65, 65, 65);
}
a:hover{
	background-color: rgb(45, 45, 45);
	cursor: pointer;
}
.hover{
	cursor:pointer;
}
nav li{
	
	display: inline-block;
	padding: 1px;
	padding-right: 8px;
	padding-left: 8px;
	margin: 0;
	font-weight: bold;
	font-size: 27px;
	border-color: black;
	text-transform: capitalize;
	color: rgb(130, 130, 130);
}
nav li:hover{
	transform:scale(.95);
	background-color: rgb(65, 65, 65);
	cursor: pointer;
	color: white;
}
footer{
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	width: 1170px;
	margin: 0 auto;
	padding: 1%;
	padding-top: .5%;
	bottom: 0;
}
.topheader{
	border: thin double rgb(130, 130, 130);
	background-color: rgb();
	display:flex;
	flex-direction: column;
	
	border-radius: 7px;
	margin-left: 10%;
	margin-right: 10%;
	margin-top: 0; 
	padding: 1%;
	padding-top: auto;
	box-shadow: 5px 5px black;
	width: 1170px;
}
.bdd,.bddd{
	display:flex;
	text-align:center;
	justify-content: center;
}
.row2{
	text-align: left; 
	padding-right: 15px;
}

#container {
	display:flex;
	flex-direction:column;
	background-color: rgb(15, 15, 15);
	width: 100%;
	justify-content: center;
	align-content: center;
	margin: 0 auto;
	width: 1500px;
}
.bod {
	display:flex;
	flex-direction:column;
	background-color: rgb(15, 15, 15);
	max-width: 1920px;
	margin: 0 auto;
	padding: 0.5em;
	
}
a:link{
	text-decoration: none;
}
img{
	width: 475px;
	padding-top: 10px;
}
img:hover{
	transform:scale(.98);
	cursor: pointer;
	
	flex-shrink: 0;
}
.itemlink:hover{
	transform:scale(.98);
	cursor: pointer;
	background-color: black;
	flex-shrink: 0;
}
.socials{
	box-shadow: none;
	cursor: pointer;
	background-color: rgb(15, 15, 15);
}
.socials:hover{
	background-color: rgb(15, 15, 15);
	box-shadow: 0px 0px black;
}
h1,h4{
	text-align: center;
	margin:0;
}
.b_w_link{
	color: white;
	font-weight: bold;
}
.bd{
	display: grid;
	text-align:center;
	white-space: nowrap;
	vertical-align: top;
	padding: .5%;
}
.bd4, .bd6{
	display: flex;
}
.column{
	
	padding: 0;
	padding-top: 5px;
	margin: 0;
	text-align: center;
}
.column2{
	
	padding: 0;
	margin: 0;
	text-align: left;
}
.socials{
	padding: 0;
	padding-top: 0px;
	margin: 0;
	text-align: center;
	
}
.item{
	font-size: 150%;
	text-align: center;
	font-weight: bold;
	padding:0;
	margin:0;
}
.minimize1,.minimize2,.minimize3,.minimize4,.minimize5,.minimize6,.minimize7,.minimize8,.minimize9, .minimize10{
	padding: .1%;
	padding-left: 1%;
	padding-right: 1%;
	align-self: flex-end;
	background-color: rgb(60, 60, 60);
	color: white;
	box-shadow: 3px 3px black;
	margin-top:5px;
	
}
.minimize{
	padding: .1%;
	padding-left: 1%;
	padding-right: 1%;
	align-self: flex-start;
	background-color: rgb(60, 60, 60);
	color: white;
	box-shadow: 3px 3px black;
}
button:hover{
	color:rgb(255, 107, 137);
}
modeButton{
	margin: 0;
}
.screws,.case,.orings,.cable,.springs,.sound,.keycaps,.alternate,.videos,.gallery2,.intro2, .gamingMonitor, .ultrawide  {
	border:  solid black;
	background-color: rgb();
	display:flex;
	flex-direction:column;
	justify-content: center;
	text-align:center;
	align-content: center;
	border-radius: 7px;
	margin: 0 auto;
	padding: 1%;
	padding-top: .5%;
	box-shadow: 5px 5px black;
	width: 1170px;
}
.screws h1,.case h1,.case2 h1,.orings h1,.cable h1,.springs h1,.sound h1,.keycaps h1,.alternate h1,.videos h1, .gamingMonitor h1 {
	text-transform: uppercase;
	color: white;
}
.case2{
	border:  solid black;
	background-color: rgb();
	display:flex;
	flex-direction:column;
	justify-content: center;
	text-align:center;
	align-content: center;
	border-radius: 7px;
	margin: 0 auto;
	padding-top: .5%;
	box-shadow: 5px 5px black;
	width: 1170px;
}
.gallery{
	border:  solid black;
	background-color: rgb();
	display:flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	align-items: center;
	border-radius: 7px;
	padding: 1%;
	box-shadow: 5px 5px black;
	top: 6px;
	
	
}

header{
	border: thin double rgb(15, 15, 15);
	background-color:rgb(15, 15, 15);
	display:flex;
	flex: 1;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	margin: 0 auto;
	margin-left: 10%;
	margin-right: 10%;
	margin-right: 10%;
	margin-bottom: 0;
	padding: 1%;
	padding-top: auto;
	padding-bottom:0;
	box-shadow: 2px 2px rgb(15, 15, 15);
	width: 100%;
	max-width: 1290px;
}

.row{
	border: thin solid rgb(60, 60, 60);
	display:flex;
	flex: 1;
	justify-content: center;
	align-content: center;
	flex-direction: row;
	align-items: center;
	border-radius: 12px;
	
	padding: 2%;
	padding-top: auto;
	margin-left:55px;
	box-shadow: 5px 5px black;
	
}
img:.row{
	
}
.intro {
	border: thin solid rgb(60, 60, 60);
	background-color: rgb(15,15,15);
	display:flex;
	flex-direction:column;
	justify-content: center;
	text-align:center;
	align-content: center;
	border-radius: 7px;
	margin: 0 auto;
	padding: 1%;
	padding-top: .5%;
	margin-top: .5%;
	width: 1170px;
	margin-bottom: 10px;
}
p{
	font-size: 18px;
	text-align: jusitfy;
}
.modeButtons{
	display: flex;
	flex-direction: column;
	
	border:  solid black;
	
	border-radius: 12px;
	box-shadow: 10px 10px black;
	top: 6px;
	
}
.modeButton, .modeButtonUp{
	width: 200px;
	border:  thin solid  black;
	padding: 1%;
	margin-left: 20px;
	margin-top: 5px;
	margin-bottom: 5px;
	top: 6px;
	background-color: rgb(60, 60, 60);
	color: white;
	box-shadow: 3px 3px black;
}
.modeButton: hover, .modeButtonUp: hover{
	color: color: rgb(255, 92, 124);
}
.alternate2{
	border:  solid black;
	background-color: rgb();
	display:flex;
	flex-direction:column;
	justify-content: center;
	text-align:left;
	align-content: center;
	border-radius: 7px;
	margin: 0 auto;
	padding: 1%;
	padding-top: .5%;
	box-shadow: 5px 5px black;
	width: 1170px;
}