@charset "UTF-8";
/*================================================
Template name: Acnalys – Business Consulting - HTML Template
Version: 1.0.0
Author: Website_Stock 
Author url: https://themeforest.net/user/website_stock

[ Table of Contents ]

01: Banner
02: Latest Project
==================================================*/
/*================================================
Template name: Acnalys – Business Consulting - HTML Template
Version: 1.0.0
Author: Website_Stock 
Author url: https://themeforest.net/user/website_stock

[ Table of Contents ]

01: Reset css Style
    1.1: mixins
    1.2: color
    1.3: variable
==================================================*/
/*================================================
01: Reset css Style
==================================================*/
/*================================================
Template name: Acnalys – Business Consulting - HTML Template
Version: 1.0.0
Author: Website_Stock 
Author url: https://themeforest.net/user/website_stock

[ Table of Contents ]

01: All mixin css Style
  1.1: transition
  1.2: background-image
  1.3: border-radius
  1.4: text
  1.5: transform
  1.6: transformX
  1.7: transformY
  1.8: scale
  1.9: rotate
02: Responsive Screen
  2.1: sm
  2.2: md
  2.3: lg
  2.4: xl
  2.5: xl2
  2.6: xl3
  2.7: xl4

==================================================*/
/*================================================
// 01: All mixin css Style
==================================================*/
/*================================================
//  02: Responsive Screen
==================================================*/
/*================================================
Template name: Acnalys – Business Consulting - HTML Template
Version: 1.0.0
Author: Website_Stock 
Author url: https://themeforest.net/user/website_stock

[ Table of Contents ]

01: All Color Variable css Style

==================================================*/
/*================================================
Template name: Acnalys – Business Consulting - HTML Template
Version: 1.0.0
Author: Website_Stock 
Author url: https://themeforest.net/user/website_stock

[ Table of Contents ]

01: Font-Family css variables
02: Others css variables

==================================================*/
.banner {
  background-color: #d90a2c;
}
.banner .banner-img {
  border-top-left-radius: 50px;
  border-top-right-radius: 50px;
  overflow: hidden;
  background-image: url("./../images/about-us/banner.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}
.banner .banner-img .overlay {
  background-color: rgba(0, 0, 0, 0.5);
}

.latest-project {
  padding: 140px 0;
  position: relative;
}
@media (max-width: 992px) {
  .latest-project {
    padding: 80px 0;
  }
}
@media (max-width: 768px) {
  .latest-project {
    padding: 40px 0;
  }
}
.latest-project .animated-circle.right {
  top: 0%;
  right: -13%;
}
.latest-project .animated-circle.left {
  bottom: 12%;
  left: -13%;
}
.latest-project .section-title {
  max-width: 538px;
  margin: 0 auto;
  text-align: center;
}
.latest-project .section-title .subtitle {
  margin-bottom: 24px;
  color: #d90a2c;
}
.latest-project .section-title .subtitle::after {
  background-color: #d90a2c;
}
.latest-project .section-title .title {
  margin-bottom: 70px;
}
.latest-project .grid-project {
  -moz-column-count: 3;
       column-count: 3;
  -moz-column-gap: 1em;
       column-gap: 1em;
  margin: 0;
  padding: 0;
}
@media (max-width: 992px) {
  .latest-project .grid-project {
    -moz-column-count: 2;
         column-count: 2;
  }
}
@media (max-width: 576px) {
  .latest-project .grid-project {
    -moz-column-count: 1;
         column-count: 1;
  }
}
.latest-project .grid-project .grid-project-item {
  position: relative;
  overflow: hidden;
  display: block;
  margin-bottom: 16px;
  width: 100%;
}
.latest-project .grid-project .grid-project-item .img {
  width: 100%;
  height: 100%;
}
.latest-project .grid-project .grid-project-item .img img {
  width: 100%;
  height: 100%;
}
.latest-project .grid-project .grid-project-item .content {
  position: absolute;
  opacity: 0;
  bottom: 51px;
  left: 50%;
  width: 10px;
  height: 178px;
  background-color: rgba(217, 10, 44, 0.5019607843);
  border-top: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 38px 36px 47px 19px;
  transition: all ease 0.9s;
  -webkit-transition: all ease 0.9s;
  -moz-transition: all ease 0.9s;
  -ms-transition: all ease 0.9s;
  -o-transition: all ease 0.9s;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
}
@media (max-width: 1200px) {
  .latest-project .grid-project .grid-project-item .content {
    padding: 20px 16px;
  }
}
@media (max-width: 576px) {
  .latest-project .grid-project .grid-project-item .content {
    bottom: 15px;
  }
}
.latest-project .grid-project .grid-project-item .content h4 {
  transform: scale(0.1);
  -webkit-transform: scale(0.1);
  -moz-transform: scale(0.1);
  -ms-transform: scale(0.1);
  -o-transform: scale(0.1);
  color: #fff;
  font-family: "Heebo", sans-serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 48px;
  transition: all ease 0.9s;
  -webkit-transition: all ease 0.9s;
  -moz-transition: all ease 0.9s;
  -ms-transition: all ease 0.9s;
  -o-transition: all ease 0.9s;
}
@media (max-width: 1200px) {
  .latest-project .grid-project .grid-project-item .content h4 {
    font-size: 12px;
    line-height: 30px;
  }
}
.latest-project .grid-project .grid-project-item .content h3 {
  transform: scale(0.1);
  -webkit-transform: scale(0.1);
  -moz-transform: scale(0.1);
  -ms-transform: scale(0.1);
  -o-transform: scale(0.1);
  color: #fff;
  font-family: "Marcellus", serif;
  font-weight: 400;
  font-size: 24px;
  line-height: 34px;
  transition: all ease 0.9s;
  -webkit-transition: all ease 0.9s;
  -moz-transition: all ease 0.9s;
  -ms-transition: all ease 0.9s;
  -o-transition: all ease 0.9s;
}
@media (max-width: 1200px) {
  .latest-project .grid-project .grid-project-item .content h3 {
    font-size: 18px;
    line-height: 25px;
  }
}
@media (max-width: 992px) {
  .latest-project .grid-project .grid-project-item .content h3 {
    font-size: 16px;
    line-height: 20px;
  }
}
.latest-project .grid-project .grid-project-item:hover .content {
  opacity: 1;
  width: 87%;
  transition: all ease 0.9s;
  -webkit-transition: all ease 0.9s;
  -moz-transition: all ease 0.9s;
  -ms-transition: all ease 0.9s;
  -o-transition: all ease 0.9s;
}
.latest-project .grid-project .grid-project-item:hover h4 {
  transform: scale(1);
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transition: all ease 0.9s;
  -webkit-transition: all ease 0.9s;
  -moz-transition: all ease 0.9s;
  -ms-transition: all ease 0.9s;
  -o-transition: all ease 0.9s;
}
.latest-project .grid-project .grid-project-item:hover h3 {
  transform: scale(1);
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transition: all ease 0.9s;
  -webkit-transition: all ease 0.9s;
  -moz-transition: all ease 0.9s;
  -ms-transition: all ease 0.9s;
  -o-transition: all ease 0.9s;
}/*# sourceMappingURL=project-grid.css.map */