@import './header.css';
@import './footer.css';
@import './partials/products.css';

.projects {
          background-color: #f1f1f1a8;
          padding: 30px 0;
}
.project {
          background-color: #fff;
          border-radius: 8px;
          padding: 20px;
          height: 380px;
          max-width: 320px;
          position: relative;
          transition: box-shadow 500ms;
}

.more-projects a {
          text-decoration: none;
}
.more-projects a:hover .project {
          box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}

.project-image {
          width: 60px;
          height: 60px;
          margin: auto;
}
.project-image  img {
          width: 100%;
          height: 100%;
}

.project-name {
          color: #333;
          font-weight: bold;
          font-size: 20px;
          margin: 10px 0;
          text-align: center;
}

.project-description {
          color: rgb(107 114 128);
          line-height: 30px;
}
.project-footer {
          position: absolute;
          width: calc(100% - 40px);
          bottom: 20px
}
.statusTitle {
          color: #0d6efd;
          margin-left: 5px;
}

.readMore {
          color: #0d6efd;
}