html
{
	display:block;
    color: rgb(51, 51, 51);
	}
header{
	margin-left:0px;
    margin-right:0px;

}
body{
	background-color: #f2f2f2;
	margin: 0;
	line-height: 1.6;
	letter-spacing: -0.00278rem;
	font-family: Arial, x-locale-body,sans-serif;
	-webkit-font-smoothing: antialiased;
	font-smoothing: antialiasedlised;
	overflow: hidden;

	}
#affilateContainer{
	border-bottom: 7px solid purple;
	background-color: #f2f2f2;
	width: 100%;
	height: 7%;
	position:fixed;
	top:0;
	box-shadow: 0 5px 5px purple;
}
#affilateContainer div{

	cursor:pointer;
	text-align: center;

}

#header1{
	font-weight: bold;
	font-style: italic;
	font-size: 20px;
	font-family: hazlow solid italic;
}
#header2{
	font-weight: 400;
	font-size: 30px;
	font-family: blackoak Std;

}

	footer{
		width: 100%;
		min-height: 7%;
		border-top: 7px solid purple;

		}
		footer p {
			text-align: center;
			width: inherit;
			height: inherit;

		}

aside{
	padding-top: 30px;
}
aside img{
	width: 80%;
	margin-left:30px;
	margin-top:5px;
	margin-right:30px;

	background-color: inherit;
	border-radius: 5px;
}


h1{
	font-weight: 700;
	font-size: 26px;
	text-align: center;
	font-family: impact;
	text-transform: capitalize;
}
nav{


}
nav li, nav a,nav a:visited{
	margin:0;
	padding: 0;
	list-style-type: none;
	display:block;
	font-size: 15px;
  color: black;
	text-transform: capitalize;
	text-decoration: none;
	align-items: left;

}

nav a:hover{
	color: blue;
}

nav a:active{
	border: 5px solid purple;
}


#overlay{
	width:100%;
	height:100%;
	background-color: black;
	opacity: 0.9;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 3;
}



#readLess, #readMore{
	-webkit-appearance-: none;
	appearance:none;
	border: none;
	color: blue;
	cursor: pointer;
	font-size: inherit;
	padding: 0;
	background-color:inherit;
	padding-bottom: 10px;

}



main{
	padding-top: 100px;
  min-height: 500px;
	overflow-y: auto;

}
#center{

}




 #close{
	 align-items: center;
	 font-size: 30px;
	 height: 35px;
	 cursor: pointer;


	background-color: red;
	position: absolute;
	top:0;
	right: 0;
	box-shadow: 0px 10px 5px black;
}
.close{
	padding: 5px;
	width:20px;
	background-color: red;
	box-shadow: 0px 10px 5px black;
}
@media only screen and (min-width:280px){

	#affilateContainer div{

	margin-top: 10px;
		cursor:pointer;
		text-align: center;

	}


	#header1{
		font-weight: bold;
		font-style: italic;
		font-size: 10px;
		font-family: hazlow solid italic;
	}
	#header2{
		font-weight: 400;
		font-size: 20px;
		font-family: blackoak Std;

	}
	#greet{
		top:20%;
		left:1%;
		position:fixed;
		background-color: blue;
		border: 5px solid purple;
    color: white;
		width:90%;
		align-items: center;
		padding: 10px;
		padding-top: 110px;
		z-index: 4;
		font-size: 20px;
	}
	img{
		width:100%;

	}

	main{
		display:block;
		  margin: 3px;
	}
	nav{
		display: none;
	}
	#menuContainer,#menuContainer2{
		display:block;
		position: absolute;
		left: 2%;
		top: 0;


	}
	#menuContainer div,#menuContainer2 div{
		width: 40px;
		height: 5px;
		margin-bottom: 5px;
		margin-top: 0px;
		background-color:black;

	}
	#menuItems{
		width: 48%;
	  height: 100%;
		position: fixed;
		left: 0%;
		top: 0%;
		z-index: 3;
		background-color: purple;
		box-shadow: 3px 3px 3px black;
		cursor: none;
		display: none;
	}
#menuContainer2{
top: 3%;
cursor: pointer;
}
#menuContainer2 div{
	background-color:rgb(225,225,225);
}

#menuItems ul{
	position: absolute;
	top:15%;}
}
#menuItems li, #menuItems a, #menuItems a:visited{
	font-size: 30px;
	color:rgb(225,225,225);
	text-decoration: none;
	list-style-type: circle;
	font-family: adobe gothic std b;
	text-transform: capitalize;

}
 #menuItems a:active{
	 color: red;
 }
@media only screen and (min-width:768px){

	#header1{
		font-weight: bold;
		font-style: italic;
		font-size: 20px;
		font-family: hazlow solid italic;
	}
	#header2{
		font-weight: 400;
		font-size: 30px;
		font-family: blackoak Std;

	}


	#greet{
		left:20%;
		position:fixed;
		background-color: blue;
		border: 5px solid purple;
    color: white;
		width:60%;
		align-items: center;
		padding: 10px;
		padding-top: 110px;
		font-size: 20px;
	}
	#menuContainer,#menuItems{
		display:none;
	}

	main{
		padding-top: 100px;
		display: flex;
    justify-content:flex-end;

	}
	.div-2{
		width:50%


	}
	.div-1{



		width:20%;

	}
	.div-3{
		width:30%;


	}
	nav{
		top: 20%;
		position:fixed;
		background-color: gray;
		width: 17%;
		height: 60%;
		border: 7px solid black;
		border-radius: 20px;
		display: block;

	}
	nav ul{
		background-color: inherit;
	}
	aside{

		overflow-y: scroll;
		min-width: 25%;
		min-height: 80%;
		box-shadow: 9px 9px 9px black;
		position:fixed;
		margin:20px;
		top: 7%;
		border-left: 3px solid black;
		border-top-left-radius: 20px;
	}
	nav li, nav a,nav a:visited{
		weight:500;
		font-family: adobe garam old pro bold;
		display:block;
		line-height: 2;
		font-size: 20px;
		background-color: gray;
		color: rgb(225,225,225);


	}
	nav ul:first-child{
		padding-top:130px;
	}
footer{
	position: absolute;
	down:0;
	z-index: 2;
	background-color:inherit;
}

/*#down{
	display: none;
}

#readLess{
	display: none;
	*/
}