.main {

   width: 800px;

   margin: auto;

 }



 .header {

   background: rgb(242, 95, 95);

   padding: 2rem;

   text-align: center;


 }

 .cont {
   text-align: center;
   margin-left: 30px;
   /* background-color: brown; */
   width: 350px;
   height: 251px;
   margin-top: 30px;
   box-shadow: 0 2px 10px 0 rgb(237, 31, 103, 2.5);
 }

 .container {
   display: flex;
   width: 800px;
   border-radius: 8px;
   height: auto;
   background-color: antiquewhite;
   justify-items: center;
   flex-wrap: wrap;
 }

 .cont a {
   color: #f25151;
   display: inline-block;
   text-decoration: none;
   text-align: center;
   margin-top: 100px;
   font-size: 23px;
   font-family: 楷体;
   font-weight: bold;

 }

 .cont a:hover {
   background-color: #e3a0a0;
   color: #e7d488;
 }

 .footer {

   padding: 10px;

   background: rgb(231, 151, 151);

   text-align: center;
   width: 800px;

 }

 .footer a {

   color: #fff;
   display: inline-block;
   text-decoration: none;
 }

 .footer a:hover {
   background-color: #e89393;
   color: #efda89;
 }