.glow /* HEADING */
	{
		font-family:80px;
		color:white;
		text-align: center;
		text-shadow: 1px 1px cyan;
		font-size: 20px;
		-webkit-animation:glow 1s ease-in-out infinite alternate;
		-moz-animation:glow 1s ease-in-out infinite alternate;
		animation: glow 1s ease-in-out infinite alternate;
	}
	.glow a
	{
		font-family:80px;
		color:white;
		text-align: center;
		text-shadow: 1px 2px darkred;
		font-size: 20px;
		-webkit-animation:glow 1s ease-in-out infinite alternate;
		-moz-animation:glow 1s ease-in-out infinite alternate;
		animation: glow 1s ease-in-out infinite alternate;
	}
	@-webkit-keyframes glow 
	{
	from
	{
		text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px yellow, 0 0 40px yellow, 0 0 50px yellow, 0 0 60px yellow, 0 0 50px yellow;

	}
	top
	{
		text-shadow: 0 0 20px #fff, 0 0 30px blue, 0 0 40px blue, 0 0 50px blue, 0 0 60px blue, 0 0 50px blue, 0 0 80px blue;
	}
	}
	.menu/* MENU */
	{
		text-decoration: none;
	}
	.pic
	{
		float: left;
		padding-right: 25px;
		padding-left: 60px;
	}
	.box
	{
		background: linear-gradient(to right, red, gold);
		color: white;
		width: var(--width);
		height: var(--height);
		--width: 140px;
		--height: 60px;
		text-align: center;
		line-height: var(--height);
		font-size: 80px;
		font-family: all;
		letter-spacing: 0.125em;
		border: 4px solid darkgoldenrod;
		border-radius: 2em;
		transform: perspective(500px) rotateY(-15deg);
		text-shadow: 6px 3px 2px rgba(0, 0, 0, 0.2);
		box-shadow: 2px 0 0 5px rgba(0, 0, 0, 0.2);
		transition: 0.5s;
		position: relative;
		overflow: hidden;
	}
	.box:hover
	{
		transform: perspective(500px) rotateY(15deg);
		text-shadow: -6px 3px 2px rgba(0, 0, 0, 0.2);
		box-shadow: -2px 0 0 5px rgba(0, 0, 0, 0.2);
	}
	.box::before 
	{
		content: '';
		position: absolute;
		width: 50%;
		height: 100%;
		background: linear-gradient(to right, transparent, white, transparent);
		left: -100%;
		transition: 0.5s;
	}
	*{
		margin: 0px;
		padding: 0px;
		box-sizing: border-box;
	}
	.navbar
	{
		width: 100%;
		height: 50px;
		background-color: red;
	}
	.sidemenu
	{
		height: 100%;
		background:red;
		width:0px;
		position:fixed;
		top:0;
		left:0;
		padding-top: 60px;
		overflow-x: hidden;
		transition: all 0.6s;
	}
	.sidemenu a
	{
		text-decoration: none;
		color: white;
		display: block;
		margin:20px;
		padding: 10px;
		border: 2px solid grey;
		text-align: center;
		transition: all 0.6s;
	}
	.crossbtn
	{
		position: absolute;
		top:0px;
		right: 5px;
		border: none!important;
		font-size: 40px;


	}
	#mainpagecontent
	{
		transition: 0.6s;
	}
	@import url('https://fonts.googleapis.com/css?family=Poppins:400,500,600,700&display=swap');
	*{
	  margin: 0;
	  padding: 0;
	  box-sizing: border-box;
	}
	html,body
	{
	  height: 100%;
	  place-items: center;
	  background: #000;
	  
	}
	button
	{
	  position: relative;
	  height: 60px;
	  width: 200px;
	  margin: 0 35px;
	  border-radius: 80px;
	  border: 1;
	  outline: 1;
	  background: #111;
	  color: #fff;
	  font-size: 20px;
	  font-weight: 500;
	  letter-spacing: 2px;
	  text-transform: uppercase;
	  cursor: pointer;
	  transition: background 0.5s;
	}
	button:first-child:hover
	{
	  background: linear-gradient(90deg, #03a9f4, #f441a5, #ffeb3b, #03a9f4);
	  background-size: 400%;
	}
	button:last-child:hover
	{
	  background: linear-gradient(90deg, #fa7199, #f5ce62, #e43603, #fa7199);
	  background-size: 400%;
	}
	button:first-child:before,
	button:last-child:before
	{
	  content: '';
	  position: absolute;
	  background: inherit;
	  top: -5px;
	  right: -5px;
	  bottom: -5px;
	  left: -5px;
	  border-radius: 50px;
	  filter: blur(20px);
	  opacity: 0;
	  transition: opacity 0.5s;
	}
	button:first-child:hover:before,
	button:last-child:hover:before
	{
	  opacity: 1;
	  z-index: -1;
	}
	button:hover
	{
	  z-index: 1;
	  animation: glow 8s linear infinite;
	}
	@keyframes glowing
	{
	  0%
	  {
	    background-position: 0%;
	  }
	  100%
	  {
	    background-position: 400%;
	  }
	}
	ul
	{
		padding: 0px;
		margin: 0px;
		display: flex;
	}
	ul li
	{
		list-style: none;
		margin:30px;
		border-radius:15px;

	}
	a:link
	{
		text-decoration: none;
	}
	<style>
	.pic 
	{
	   
	    margin: 0 auto;
	}
   .pic img
    {
	    transition: 0.5s all ease-in-out;
	}
	.pic:hover img
	{
	    transform: scale(1.19);
	}
	</style>