header {
    background-color: #BCDFDF;
    width: 100%;
    height: 300px;
}
main {
    background-color: wheat;
    width: 100%;
    height: 700px;
}
aside {
    background-color: white;
    width: 100%;
    height: 1000px;
}
footer {
    background-color: rgb(116, 101, 101);
    width: 100%;
    height:300px;
}
nav {
    background-color: #BCDFDF;
    float: right;
    padding-top: 20px;
}
nav a {
    text-decoration: none;
    color: black;
    font-size: 24px;
    padding-inline-end: 20px;
}
h1 {
    padding-top: 100px;
    font-size: 50px;
    text-align: center;
    color: black;
}
*{
    margin-left: auto;
    margin-right: auto;
    margin-top: 0px;    
}
.footer {
    background-color: #303036 ;
    color: #D3D3D3;
    height: 400px;
    position: relative;
  }
  .footer .footer-bottom {
   background-color: #343A40;
   color: #686868;
   height: 50px;
   text-align: center;
   position: absolute;
   bottom: 0px;
   left: 0px;
   padding-top: 20px;
   width: 100%;
  }
  .footer .footer-top {
   display: flex;
   height: 350px;
  }
  .footer .footer-top h4 {
   flex: 1;
   margin-left: 30px;
   text-align: center;
  }
  .footer .footer-top h4 span {
   color: aqua;
   font-size: 30px;
   font-family: 'Open Sans Condensed', sans-serif;
  }
  body{
    padding: 0px;
    margin: 0px;
      background-color: #f3f3f3;
    }
    .container-fluid{
      position: relative;
    }
    .card1{
      margin: 0%;
      width: 380px;
      min-height: 550px;
      position: absolute;
      left : 50px;
      top: 20px;
      border-radius: 5px;
      background-color: #fff;
      transition : 1s;
      transition-timing-function: ease-in-out;
      justify-content: left;
    }
    .card2{
      margin-left: 525px;
      width: 380px;
      min-height: 550px;
      position: absolute;
      left : 50px;
      top: 20px;
      border-radius: 5px;
      background-color: #fff;
      transition : 1s;
      transition-timing-function: ease-in-out;
      justify-content: center;
    }  
    .card3{
      margin-left: 1050px;
      width: 380px;
      min-height: 550px;
      position: absolute;
      left : 50px;
      top: 20px;
      border-radius: 5px;
      background-color: #fff;
      transition : 1s;
      transition-timing-function: ease-in-out;
      text-align: center;
    }  
    .card-img{
    background-image:url("./Images/images\ \(4\).jpeg");
      width : 100%;
      min-height: 220px;
      background-repeat: no-repeat;
      background-size: cover;
      background-position: center;
      border-radius:5px;
      overflow: hidden;
    }
    .title{
      position: absolute;
      top: 230px;
      left: 10px;
    }
    /* a{
      border-radius: 3px;;
      background-color: #8ebdbd;;
      color: rgba(255, 255, 255, 0.418);
      padding: 10px;
    } */
    .card-img2{
      background-image: url("./Images/images\ \(1\).jpeg")
    }
    .card-img3{
      background-image: url("./Images/images\ \(2\).jpeg");
    }
    /* a:hover{
      text-decoration: none;
      color: #fff;
      background-color: rgba(116, 116, 206, 0.9);
    } */
    .card1:hover{
    transform: rotate(360deg);
      box-shadow : 0px 8px 16px 0px rgba(0,0,0,1); 
    
    }
    .card2:hover{
      transform: rotate(360deg);
        box-shadow : 0px 8px 16px 0px rgba(0,0,0,1); 
      
    }
      .card3:hover{
        transform: rotate(360deg);
          box-shadow : 0px 8px 16px 0px rgba(0,0,0,1); 
        
    }