@charset "utf-8";
*{
margin:0;
padding:0;
}
* a{
	color:black;
}

#porples {
	color:white;
	background-color:rgb(255, 0, 255);
}

.menu-area {
	position:move;
}
.menu-area a{
	display: flex;
	align-items: center;
	justify-content:center;
	color:white;   /** highlight when hovering over text **/
	background:#000000;
	height:60px;
	font-weight:bold;
	text-decoration:none;
	text-transform:uppercase;
}

.menu-area a:hover{
	background:white;  /**hover over **/
	color:black; /**text when hovered**/
}

.menu-area ul{
	list-style: none;
	display:flex;
}

.menu-area li{
	position:relative;
	width:100%;
	text-align:center;
	display:inline-block;
}

.menu-area li:hover .dropdown > li{
	display:block;
	text-align:center;
	flex-wrap:nowrap;
}

#wbl {
	display:flex;
	justify-content:center;
	padding:10px;
}

.dropdown li{
	display:none;
	position:relative;
	color:black;
}

.dropdown{
	position:absolute;
	display:flex;
	flex-direction:column;
	width:100%;
}

.dropdown li:hover li{
	display:block;
}

footer{
	display:flex;
	justify-content:center;
	align-items:center;
	background-color:white;
	padding:10px;
	align-items:flex-end;
}

#container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
	flex-wrap:nowrap;
}



article {
	background-color:white;
	color: blackfff;
	margin:10px;
}

p {
	background-color:white;
	display:flex;
	color: black;
	margin:10px;
	justify-content:center
}

body {
	background-color:#000000;
	margin:1px;
}



li:hover {
	background-color:#C19A6B; /** background hover around text **/
}

#footer {
	color:rgb(255, 255, 255);
}

#download {
	background-color:white;
	color:black;
	width:200;
	display:flex;
	align-items:center;
	padding:5px;

}

#download a:hover {
	background-color:blackfff;

}

.box1 a{
	background-color:white;
	display:flex;
	border-radius: 10px 10px 10px 10px;
	color:black;
	width:93px;
	justify-content:center;
	box-shadow:10px 10px;
	margin:10px;
}

.box1 a:hover{
	background-color:black;
	color:white;
}

#death {
display:flex;
}

#slurpity {
	color:black;
	text-decoration:none;
	cursor:text;
}

#projects{
	display:flex;
	justify-content:space-around;
	padding:10px;
	flex-wrap:nowrap;
}
#projecttext{
	width:156px;
	height:156px;
}

figcaption {
	display:flex;
	flex-wrap:wrap;
	align-items:flex-end;
	position:relative;
	justify-content:center-left;
	width:20;
}

td {
	border:5px double;
	background:white;
	color:black;
	text-align:center;
	padding:10px;
}

th {
	border:3px dashed;
	border-bottom: 0px dashed;
	background:white;
	color:black;
	padding:3px;
}

#greatestGrowthImages {
	display:flex;
	margin:50px;
	width:600px
}

#centerinator {
	display:flex; 
	justify-content:center;
	padding:10px
}



#greatestGrowthFlex{
	display:flex;
	justify-content:center;
	align-items:center;
}

#greatestGrowthFlex figcaption {
	align-items:end;
	justify-content:end;
}
.BEGONE {
	border:3px dashed;
	border-bottom: 0px dashed;
	border-top:0px dashed;
}
/* below is how you style something that was id'd (ided idk) */
/* this one, howver is for styling classed items. */
.poof {
	color:black;
}

.down {
	border:3px dashed;
	background:white;
	color:black;
}

.bottom {
	border:3px dashed;
	border-top: 0px dashed;
	background:white;
	color:black;
}	

#experience1 {
	height:300px;
	width:300px;
	background: white;
	color:black;
	display:flex;
	justify-content:center;
	align-items:center;
}


#intro{
	display:flex;
	flex-direction:row;
	justify-content:center;
	gap:50px;
}

#introtext{
	height:300px;
	width:400px;
	background: white;
	color:black;
	display:flex;
	justify-content:center;
	align-items:center;
}

#experience2 {
	height:300px;
	width:300px;
	background: white;
	color:black;
	display:flex;
	justify-content:center;
	align-items:center;
}


#experienceflex{
	display:flex;
	justify-content:space-around;
}

#ggimg {
	display:flex;
	padding:3px;
	align-items:center;
}

#gg {
	display:flex;
	flex-direction:column;
	align-items:center;
	width:800px;
	padding:3px;
}

#ggg {
	display:flex;
	flex-direction:column;
	align-items:center;
	padding:3px;
}

#prevention {
	width:500px;
}

.scrt {
	color:#cfff04;
	background:#C90076;
}

.k {
	background:cyan;
}