:root {
  --bg-nav: #f7f7f7;
  --text-color: #54585a;
  --text-black-90: #1a1a1a;
  --bg-warning: #ffb500;
  --bg-green: #003c32;
  --bg-gray: #f7f7f7;
  --bg-gray-light: #f3f3f3;
  --bg-dark-light: #282828;
}



@font-face {
  font-family: 'Yekan';
  src: url('../font/iranYekan/IRANYekan_family/IRANYekanX-Regular.ttf');
  font-weight: normal;
  font-style: normal;
  text-rendering: optimizeLegibility;
  font-display: auto;
}

@font-face {
  font-family: 'Yekan-ExtraBlack';
  src: url('../font/iranYekan/IRANYekan_family/IRANYekanX-ExtraBlack.ttf');
  font-weight: 600;
  font-style: normal;
  text-rendering: optimizeLegibility;
  font-display: auto;
}
@font-face {
  font-family: 'TitilliumWeb';
  src: url('../font/TitilliumWeb-Regular.ttf');
  font-weight: 600;
  font-style: normal;
  text-rendering: optimizeLegibility;
  font-display: auto;
}

body{
  background-color: var(--bg-gray);
  overflow-x: hidden;
  font-family: 'Yekan', sans-serif !important;
}

.h1, .h2, .h3, .h4, .h5, .h6, span, p {
  font-family: 'Yekan', sans-serif !important;
  color: var(--text-black-90);
}
.fw-bolder{
  font-family: 'Yekan' !important;
  font-size: 1.8rem !important;
}

.btn-warning {
  background-color: var(--bg-warning) !important;
}

.rounded-top-4 {
  border-top-right-radius: .45rem !important;
  border-top-left-radius: .45rem !important;
}

.rounded-4 {
  border-radius: 0.45rem !important;
}


.rounded-45 {
  border-radius: 1.8rem !important;
}

/* navbar */
header.header-navbar {
  height: 70px;
}

.navbar.navbar-expand-md.navbar-dark.fixed-top {
  background: var(--bg-nav);
}

.navbar UL.navbar-nav .nav-item a {
  color: var(--text-color) !important;
}

.navbar .navbar-brand img {
  height: 100px;
}

.btn-login-green {
  background-color: var(--bg-green);
  color: white !important;
  clip-path: polygon(10% 0, 100% 0, 100% 100%, 0 100%, 0 30%);
}

.btn:hover {
  color: rgba(255, 255, 255, 0.742);
}

/* navbar */

/* footer */

footer{
  background-color: var(--bg-dark-light);
  padding: 10px 75px !important;
  clip-path: polygon(10% 0, 100% 0, 100% 100%, 0 100%, 0 14%);
}

footer .socials ul li {
  margin-left: 10px;
}

footer .socials ul {
  width: 275px;
  direction: ltr;
}

footer .socials ul li img {
  height: 25px;
}

footer .get-application img{
  width: 70px;
}

footer .get-application span{
  display: block;
    color: #fff;
    position: relative;
    top: 10px;
    font-size: 19px;
}

footer .enamad img{
    height: 165px;
}

footer .bottom-shape-footer{
  position: relative;
  top: 145px;
  z-index: 0;
  left: 0;
}

footer .bottom-shape-footer img{
 
}
/* footer */

body main {
  clip-path: polygon(12% 0, 100% 0, 100% 100%, 0 100%, 0 3%);
  background: white;
}
main .header {
  height: 55vh;
  display: flex;
  align-items: center;
  margin-bottom: 70px;
}

/*.shadow-green{*/
/*    box-shadow: 3px 2px 17px 1px var(--bg-green);*/
/*}*/

.shadow-green {
  box-shadow: 0 .5rem 1rem var(--bg-green) !important;
}


.header .row.shapes {
  position: absolute;
  top: 30vh;
  width: 100%;
  right: 0;
}

.header .shapes img {
  height: 300px;
  object-fit: contain;
  width: 300px;
}

.header .shapes .left {
  position: relative;
  bottom: -40px;
}

/* custome class */
.border-black {
  border-color: #000 !important;
}
.bg-gray {
  background: var(--bg-gray) !important;
}

.bg-gray-light {
  background: var(--bg-gray-light) !important;
}

.py-9px {
  padding: 9px 0;
}

.mt-4-5 {
  margin-top: 2.5rem !important;
}

.my-100px {
  margin: 100px 0;
}

.my-140px {
  margin: 140px 0;
}

.pb-6 {
  padding-bottom: 4rem !important;
}


.justify {
  text-align: justify;
}

.best-investment .left .img-footer img {
  position: relative;
  width: 130%;
  left: 0;
}
.service-introduce{
  overflow: hidden;
}

.service-introduce .polygon {
  clip-path: polygon(28% 0, 100% 0, 100% 100%, 0 100%, 0 25%);
  padding: 0 40px;
}

.service-introduce .item {
  background-color: var(--bg-green);
  padding: 30px 30px 0;
  border-radius: 20px;
  height: 520px;
  position: relative;
  filter: drop-shadow(4px 0px -6px var(--bg-green));
  /* clip-path: polygon(28% 0, 100% 0, 100% 100%, 0 100%, 0 17%); */
  background: radial-gradient(circle, rgba(0,101,91,1) 0%, rgba(0,60,50,1) 100%);
}

.service-introduce .item, .service-introduce .item p {
  color: white;
  text-align: justify;
}


.service-introduce .item .bottom-shape {
  width: 148px;
  position: absolute;
  left: 15%;
  bottom: 0;
}


.service-introduce .item .bottom-div {
  position: absolute;
  bottom: 25%;
  width: 100%;
  right: 0;
  text-align: center;
}

.service-introduce .item .bottom-shape svg {
  width: 170px;
  height: 80px;
}

.form-control.form-certificat {
  border-radius: 10px;
  padding: 10px 10px;
  background: #f6f6f6;
  border-color: #b3b3b3;
  color: #b3b3b3;
}

.form-control.form-certificat::placeholder{
  text-align: center;
}
.placeholder-right::placeholder{
  text-align: right !important;
}

/* news */
.news .item {
  clip-path: polygon(20% 0, 100% 0, 100% 100%, 0 100%, 0 15%);
  height: 100%;
}

.news .item img {
  height: 200px;
  width: 100%;
  object-fit: fill;
}

.news .news-title {
  height: 95px;
  display: flex;
  justify-content: center;
  justify-items: center;
}


.list-style-none {
  list-style: none;
}


/* introduct-company */

.introduct-company .images .first {
  width: 350px;
  text-align: center;
}


.introduct-company .images .second {
  width: 400px;
  position: absolute;
  left: 0;
  top: 90px;
}


.outside-btn-login:hover{
  filter: drop-shadow( 0 0.5rem .7rem var(--bg-green));
  color: #fff !important;
  transition: all 500ms ease-out;
}
.btn-login:hover{
  color: #fff !important;
}

.btn-login {
  background: var(--bg-green);
  color: #fff;
  padding: 15px 15px 20px;
  clip-path: polygon(16px 0%, 100% 0%, 100% 100%, 0 100%, 0 25%);
  border-radius: 10px !important;
  text-decoration: none;
  font-size: 0.9rem;
  margin-right: 5px;
}


.outside-btn-suggest {
  width: 100%;
  display: grid;
  text-align: center;
  transition: all 500ms ease-out;
}
.btn-suggest {
  background: var(--bg-green);
  color: #fff;
  padding: 15px;
  clip-path: polygon(16px 0%, 100% 0%, 100% 100%, 0 100%, 0 25%);
  border-radius: 10px !important;
  text-decoration: none;
  font-size: 20px;

}
.outside-btn-suggest:hover {
  filter: drop-shadow( 0 0.5rem .7rem var(--bg-green));
}
.btn-suggest:hover{
  color: #fff !important;
}
.estelam button{
  clip-path: polygon(14% 0, 100% 0, 100% 100%, 0 100%, 0 30%);
}


.input-group-addon {
  position: relative;
  right: 20px;
  top: 44px;
  width: 30px;
}

.input-group-addon i {
  color: #b3b3b3;
font-size: 26px;
}
.item-about-text{
  border: 1px solid #ffb500 !important;
  padding: 20px;
  position: relative;
  padding-right: 35px;
  margin-top: 20px;
}
.item-about-text .circle{
  position: absolute;
  height: 50px;
  width: 50px;
  border-radius: 50%;
  right: -25px;
  margin-left: -55px;
  background: #ffb500;
  transform: translatey(-50%);
  top: 50%;
}
.item-about-head{
  position: relative;
  transform: translatey(-50%);
  top: 50%;
}
.item-about-head h2{
  font-size: 4rem;
  color: #ffb500;
  font-weight: 900;
  text-align: center;
}
.dropdown-item.active, .dropdown-item:active {
  color: #fff;
  text-decoration: none;
  background-color: #ffb500;
}
.asid-list li{
  line-height: 2rem;
  color: var(--text-color) !important;
  font-size: 1.1rem;
}
.asid-list .active{
  border-bottom: 1px solid #8a8a8a;
}
.sharing ul li {
  margin-left: 10px;
}
.sharing ul li svg{
  color: #52575b;
}
.sharing ul{
  justify-content: center;
}
.sharing{
  text-align: center;
  margin-top: 130px;
}
.sharing span{
  color: #52575b;
}
a {
  color: #007bff;
  text-decoration: none;
  background-color: transparent;
}
.overflow-h{
  overflow-x: hidden;
  overflow-y: hidden;
}
.investment-3box img{
  object-fit: fill;
}
.investment-3box{
  margin-top: 10px;
}
.dropdown:hover .dropdown-menu {
  display: block;
  margin-top: 0;
}
.best-investment .bg-image{
  position: absolute;
  width: 40%;
}
.text-justify{
  text-align: justify;
}
.btn-lang{
  padding: 10px;
  border-radius: 50%;
  border: 1px solid #c1c1c1;
  color: #c1c1c1;
  font-size: 1.5rem;
  margin-right: 30px;
  font-family: 'TitilliumWeb' !important;
  margin-left: 10px;
  height: 60px;
  width: 60px;
  text-align: center;
}
.shapes .left img{
  margin-right: 5rem;
}
@media (min-width:992px){
  .border-in-desktop{
    border-right: 1px solid;
  }
}
@media (max-width:575px){
  .item-about-text{
    margin-right: 20px;
  }
  .bottom-shape-footer{
    display: none;
  }
  footer .enamad img{
    height: auto;
    width: 100%;
  }
  footer .get-application img{
    width: 50px;
  }
  footer .border-black{
    border-color: #282828 !important;
  }
  .footer-copyright{
    font-size: 14px;
    text-align: center;
  }

  .fw-bolder{
    font-size: 1.6rem !important;
  }
  .head-text{
    z-index: 10;
  }
  .header .shapes img{
    width: 100%;
    margin-right: 1rem;
    height: 170px;
  }
  .overflow-x{
    overflow-x:clip;
  }
  .header .row.shapes{
    bottom: 150px;
  }
  .news .item{
    margin-top: 10px;
  }
  footer .fw-bolder{
    font-size: 1.3rem !important;
  }
  body main{
    clip-path: unset;
  }
  .service-introduce .item{
    margin-top: 10px;
  }
  .box{
    width: unset !important;
    height: unset !important;
  }
  footer{
    clip-path: polygon(10% 0, 100% 0, 100% 100%, 0 100%, 0 10%);
  }
  .contact-us-img{
    display: none;
  }
  .introduct-company .images .first{
    width: 100%;
  }
  .introduct-company .images .second {
    width: 100%;
  }
  .estelam{
    margin-top: 50px;
  }
  .title-contact{
    margin-top: 80px;
  }
}
.box{
  width: 120px;
  height: 200px;
}
footer {
  overflow: hidden;
}
.call-ico:before {
  content: url(../img/icon/call-ico.svg);
  margin-right: -40px;
  margin-left: 10px;
}
.email-ico:before {
  content: url(../img/icon/email-ico.svg);
  margin-right: -40px;
  margin-left: 10px;
}
.panel-footer{
  margin-top: 60px;
}
.footer-copyright{
  z-index: 10;
}
.black-link{
  color: #242424;
}
.top-btn {
  display: none;
  position: fixed;
  bottom: 20px;
  right: 30px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background-color: #ffb500;
  color: white;
  cursor: pointer;
  padding: 15px;
  border-radius: 4px;
}
.login-bn2{
  box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
}
html { height: 100%; }
body { height: 100%; }
main { display: flex; flex-direction: column; min-height: 100%; }
footer { margin-top: auto!important;}