/* REMOTE FONT */
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap");
/* COMMOUN STYLE */
body {
  margin: 0;
}
/* NAVBAR STYLE */
.navbar {
  position: absolute;
  width: 100%;
  top: 50px;
}
.navbar .navbar-nav .nav-item {
  margin-right: 67px;
}
.navbar .navbar-nav .nav-item:last-child {
  margin-right: 0;
}
.navbar .navbar-nav .nav-item .nav-link {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-size: 18px;
  line-height: 26px;
  color: #ffffff;
  transition: 0.3s;
}
.navbar .navbar-nav .nav-item .nav-link:hover {
  color: #6a4df4;
}
.btn-contact {
  font-family: "Inter";
  font-style: normal;
  font-weight: 600;
  font-size: 20px;
  line-height: 26px;
  padding: 15px 42px;
  text-align: center;
  color: #ffffff;
  background: #6a4df4;
  border-radius: 10px;
}
.btn-contact:hover {
  color: #6a4df4;
  border: #6a4df4 1px solid;
  background: transparent;
}
/* BANNER STYLE */
#banner {
  width: 100vw;
  background: url(../images/banner.jpg) no-repeat center;
  background-size: cover;
}
#banner .overlay {
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
}
#banner .overlay .text {
  width: 950px;
  margin: 0 auto;
  padding-top: 315px;
}
#banner .overlay .text h1 {
  margin: 0;
  padding-bottom: 51px;
  font-family: "Inter";
  font-style: normal;
  font-weight: 700;
  font-size: 75px;
  line-height: 120%;
  text-align: center;
  color: #ffffff;
}
#banner .overlay .text p {
  width: 621px;
  margin: 0 auto;
  padding-bottom: 40px;
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 26px;
  text-align: center;
  color: #ffffff;
}
#banner .overlay .btn {
  margin-bottom: 170px;
  padding: 15px 42px;
  font-family: "Inter";
  font-style: normal;
  font-weight: 600;
  font-size: 20px;
  line-height: 26px;
  text-align: center;
  color: #ffffff;
  border-radius: 10px;
  background: #6a4df4;
  transition: 0.4s;
}
#banner .overlay .btn:hover {
  background: transparent;
  border: #6a4df4 1px solid;
  color: #6a4df4;
}
/* COUNTER STYLE */
#counter {
  margin: 170px 0 150px;
}
#counter .main-counter {
  background: #e0fff9;
  border-radius: 20px;
}
#counter .main-counter .text {
  padding: 85px 110px 85px 50px;
}
#counter .main-counter .text p {
  margin: 0;
  font-family: "Inter";
  font-style: normal;
  font-weight: 500;
  font-size: 25px;
  line-height: 120%;
  color: #6a4df4;
}
#counter .main-counter .text h3 {
  margin: 0;
  font-family: "Inter";
  font-style: normal;
  font-weight: 600;
  font-size: 35px;
  line-height: 42px;
  color: #151515;
}
#counter .count-number {
  padding-top: 70px;
  padding-bottom: 125px;
}
#counter .count-number h2 {
  margin: 0;
  font-family: "Inter";
  font-style: normal;
  font-weight: 700;
  font-size: 50px;
  line-height: 61px;
  color: #151515;
}
#counter .count-number p {
  margin: 0;
  font-family: "Inter";
  font-style: normal;
  font-weight: 500;
  font-size: 20px;
  line-height: 120%;
  color: #737373;
}
/* SERVICES STYLE */
#service {
  margin-bottom: 100px;
}
#service .service-title .text p {
  margin: 0;
  padding-bottom: 50px;
  width: 600px;
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 26px;
  text-align: center;
  color: #737373;
}
#service .service-title .text h2 {
  margin: 0;
  font-family: "Inter";
  font-style: normal;
  font-weight: 700;
  font-size: 45px;
  line-height: 54px;
  color: #151515;
}
#service .main-services .items {
  width: 424px;
  padding: 0 49px;
  background: #ffffff;
  box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.25);
  border-radius: 20px;
  transition: 0.4s;
}
#service .main-services .items:hover {
  background: #531e1e;
}
#service .main-services .items img {
  margin-top: 80px;
  margin-bottom: 40px;
}
#service .main-services .items p {
  margin: 0;
  width: 326px;
  padding-bottom: 46px;
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 26px;
  text-align: center;
  color: #737373;
}
#service .main-services .items:hover p {
  color: #ffffff;
}
#service .main-services .items h4 {
  margin: 0;
  padding-bottom: 20px;
  font-family: "Inter";
  font-style: normal;
  font-weight: 700;
  font-size: 25px;
  line-height: 30px;
  text-align: center;
  color: #151515;
}
/* RESENT WORK */
#resent-work {
  padding-top: 143px;
  padding-bottom: 157px;
  background: #f3f3f3;
}
#resent-work .resent-work-title .text h2 {
  margin: 0;
  padding-bottom: 20px;
  font-family: "Inter";
  font-style: normal;
  font-weight: 700;
  font-size: 45px;
  line-height: 54px;
  text-align: center;
  color: #151515;
}
#resent-work .resent-work-title .text p {
  padding-bottom: 106px;
  margin: 0;
  width: 620px;
  margin: 0 auto;
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 26px;
  text-align: center;
  color: #737373;
}
#resent-work .work-group .item {
  padding: 0;
  width: 424px;
  border-radius: 20px;
  overflow: hidden;
  background: #ffffff;
  text-align: center;
  transition: 0.3s;
}
#resent-work .work-group .item:hover {
  box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.25);
}
#resent-work .work-group .item .articel {
  margin: 0 auto;
  width: 340px;
}
#resent-work .work-group .item .articel h4 {
  padding-top: 30px;
  padding-bottom: 10px;
  margin: 0;
  font-family: "Inter";
  font-style: normal;
  font-weight: 700;
  font-size: 20px;
  line-height: 24px;

  color: #151515;
}
#resent-work .work-group .item .articel p {
  margin: 0;
  padding-bottom: 30px;
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 26px;
  color: #737373;
}
/* FAQ STYLE */

#faq {
  padding-top: 143px;
  padding-bottom: 106px;
}
#faq .faq-title h2 {
  margin: 0 auto;
  padding-bottom: 20px;
  width: 518px;
  font-family: "Inter";
  font-style: normal;
  font-weight: 700;
  font-size: 45px;
  line-height: 54px;
  text-align: center;
  color: #151515;
}
#faq .faq-title p {
  width: 620px;
  padding-bottom: 137px;
  margin: 0 auto;
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 26px;
  text-align: center;
  color: #737373;
}
#faq .main-skill-group .item {
  width: 344px;
}
#faq .main-skill-group .item .icon img {
  padding-bottom: 20px;
}
#faq .main-skill-group .item h4 {
  margin: 0;
  padding-bottom: 10px;
  font-family: "Inter";
  font-style: normal;
  font-weight: 700;
  font-size: 25px;
  line-height: 30px;
  color: #151515;
}
#faq .main-skill-group .item p {
  margin: 0;
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 26px;
  color: #737373;
}
/*reviews style*/
#reviews {
  padding-bottom: 227px;
}
#reviews .reviews-title h2 {
  margin: 0;
  padding-bottom: 20px;
  font-family: "Inter";
  font-style: normal;
  font-weight: 700;
  font-size: 45px;
  line-height: 54px;
  text-align: center;
  color: #151515;
}
#reviews .reviews-title p {
  width: 620px;
  margin: 0 auto;
  padding-bottom: 130px;
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 26px;
  text-align: center;
  color: #737373;
}
#reviews .reviews-group .item {
  width: 424px;
  padding: 58px 54px;
  background: #ffffff;
  border-radius: 30px;
  transition: 0.4s;
}
#reviews .reviews-group .item:hover {
  background: #f4efef;
}
#reviews .reviews-group .item .icon {
  width: 58px;
  height: 40px;
  margin-bottom: 20px;
}
#reviews .reviews-group .item .text p {
  margin: 0 auto;
  padding-bottom: 20px;
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 26px;
  color: #7b7b7b;
}
#reviews .reviews-group .item .text .star-icon {
  padding-bottom: 20px;
}
#reviews .reviews-group .item .progile .avatar {
  width: 47px;
  height: 47px;
  margin-right: 20px;
}
#reviews .reviews-group .item .progile .text h4 {
  margin: 0;
  font-family: "Inter";
  font-style: normal;
  font-weight: 600;
  font-size: 20px;
  line-height: 120%;
  color: #232323;
}
#reviews .reviews-group .item .progile .text p {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 26px;
  color: #7b7b7b;
}
#contact {
  background: #f3f3f3;
}
#contact .main-contact .login {
  padding: 61px 43px;
  margin: 150px 0;
  width: 536px;
  background: #ffffff;
  border-radius: 20px;
}
#contact .main-contact .text {
  height: 100%;
  width: 526px;
}
#contact .main-contact .text h2 {
  width: 470px;
  font-family: "Inter";
  font-style: normal;
  font-weight: 700;
  font-size: 45px;
  line-height: 54px;
  color: #151515;
}
#contact .main-contact .text p {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 26px;
  color: #7b7b7b;
}
#contact .main-contact .login .title h3 {
  width: 305px;
  padding-bottom: 30px;
  margin: 0 auto;
  font-family: "Inter";
  font-style: normal;
  font-weight: 700;
  font-size: 30px;
  line-height: 36px;
  color: #151515;
}
#contact .main-contact .login label {
  font-family: "Inter";
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 26px;
  color: #151515;
}
#contact .main-contact .login input {
  height: 64px;
}
#contact .main-contact .login input::placeholder {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 26px;
  color: #d0d0d0;
}
#contact .main-contact .login .btn {
  width: 100%;
  padding: 19px 0;
  font-family: "Inter";
  font-style: normal;
  font-weight: 600;
  font-size: 20px;
  line-height: 26px;
  text-align: center;
  color: #ffffff;
  border-radius: 10px;
  background: #6a4df4;
  transition: 0.4s;
}
/* FOOTER STYLE */
#footer {
  padding: 150px 0 50px;
}

#footer .main-footer ul {
  padding: 0;
}
#footer .main-footer .text {
  width: 356px;
}
#footer .main-footer .text img {
  padding-bottom: 30px;
}
#footer .main-footer .text p {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 26px;
  color: #7b7b7b;
}
#footer .main-footer ul li {
  padding-bottom: 20px;
}
#footer .main-footer ul li a {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 40px;
  color: #7b7b7b;
}
#footer .main-footer ul li:first-child {
  padding-top: 20px;
}
#footer .main-footer .copy-right p {
  margin: 0 auto;
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 26px;
  color: #d0d0d0;
}