* {
	margin: 0;
	padding: 0;
	transition: 0.3s;
	font-family: 'Montserrat', sans-serif;
 }
 body{
	 background:#ce85364d;
		  /* width: 100vw;
		  height:100vh;
		  overflow: scroll; */
 }
 .container {
	width: 960px;

	/* margin: 0 auto; */
	margin-top: 10px; 
	margin-left: auto;
	margin-right: auto;
}
 /* h5{
	 margin-top: 100px;
	 margin-left: 100px;
	 color: #ff3366;
 
 } */
 
 .container1{
	width: 960px;
	margin: auto;
	margin-bottom: 20px;
	display: flex;
	justify-content: space-evenly;
	align-items: center;
	padding-top: 50px;
 
 }
 .header{
	align-items: center;
 }
 .box{
 
	 width: 250px;
	 height: 250px;
	 padding: 50px;
	 overflow: hidden;
	 border-radius: 14px;
	 background: linear-gradient(145deg, #e6e6e6, #ffff);
	 box-shadow: 8px 8px 16px #d1d1d1,
				 -8px -8px 16px #ffffff;
	 cursor:pointer;
	 transition:0.3s;
 
 
 }
 
 .box:hover{
	 background: linear-gradient(145deg,#bb0738, #ff3366);
	 box-shadow: 8px 8px 16px #d1d1d1,
				 -8px -8px 16px #ffffff;
 }
 .icons{
	 font-size: 50px;
	 color: #ff3366;
	 margin-top: 10px;
 }
 
 .box:hover .icons{
	 margin-top: 0px;
	 color: #ffffff;
 }
 
 .box h2{
	 font-weight: 500px;
	 margin-top: 25px;
 }
 .box:hover h2{
 
	 color: #ffff;
 
 }
 
 .box p{
	 color: grey;
	 font-weight: 400px;
	 margin-top: 25px;
 }
 .box:hover p{
 
	 color: #ffff;
 
 }
 .arrow{
	 font-size: 30px;
	 color: #ff3366;
	 margin-top: 40px;
	 display: none;
 }
 .box:hover .arrow{
	 color: #fff;
	 margin-top: 30px;
	 display: block;
 }
 a:link {
	/* background-color: transparent; */
	color: #000f00;
	text-decoration: none; 
}


/* below this is added test stuff * tbd if deleted */\