@font-face {
    font-family: "IRANSans-Regular";
    src: url('../fonts/a07449f9dfea7de8-s.p.woff2') format("woff");
}

@font-face {
    font-family: "IRANSans-Bold";
    src: url('../fonts/0ce4e99abd1c5ce3-s.p.woff2') format("woff");
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: sans-serif;
    /*user-select: none;*/
    overflow-x: hidden;
}
.blue-text{
  color: #09247b;
}
.font-bold {
    font-family: "IRANSans-Bold";
}
a.text-white.main-bg:hover{
  background-color: transparent;
  color: #ed1b6f!important;
  border: 1px solid #ed1b6f;
}
.main-text,.main-hover:hover {
    color: #ed1b6f!important;
}

.main-bg {
    background-color: #ed1b6f;
}
a.btn:hover,a.rounded-pill:hover{
    color: white!important;
}
.bg-green{
background-color: #77a464
}
.bg-red{
    background-color: #cd5c5c;
}
.border-main {
    border: 2px solid #ed1b6f;
}
.text-blue{
  color: #0a217d;
}
.transition {
    transition: all .4s;
}

a {
    cursor: pointer;
    text-decoration: none;
    transition: all .4s;
}
.fs-14{
    font-size: 14px;
}
.fs-12{
    font-size: 12px;
}
.cursor-pointer {
    cursor: pointer;
}

.text-justify {
    text-align: justify;
}

.opacity-none {
    opacity: 0;
}
.w-5{
  width: 5px;
}
.h-5{
  height: 5px;
}
.w-10{
    width: 10%;
}
.w-17{
    width: 17%;
}
.w-32{
    width: 32%;
}
.w-35{
    width: 35px;
}
.h-35{
    height: 35px;
}
.w-85{
    width: 85px;
}
.w-122{
  width: 122px;
}
.h-85{
    height: 85px;
}
.w-220{
    width: 220px;
}
.mt-20{
    margin-top: -20px;
}
.z-10{
    z-index: 10;
}
.top-56{
    top: -56px;
}
.drop-shadow{
    filter: drop-shadow(14px 1px 9px #8080809c);
}
.show-link:hover p:first-child{
    display: none;
}
.show-link:hover p:last-child{
    display: block!important;
}
/* header */
header {
    background-color: white;
    z-index: 20;
}

/* banner */
#banner svg,
#contact svg {
    fill: #ed1b6f;
}
  .hero-text h2 {
    margin-bottom: 50px;
  }
  
  .hero-text .hero {
    position: relative;
  }
  
  .hero-text .hero .hero-slide a:hover span {
    color: #033a71;
  }
  
  .hero .hero-slide img[alt='Mars'] {
    width: 100%;
    object-fit: cover;
    object-position: top center;
  }
  
  .hero .hero-slide .header-content {
    top: 20%;
    margin-left: 8rem;
    max-width: 550px;
    width: 100%;
    padding: 2rem;
  }
  
  .slide-content {
    padding: 10px 20px 10px 0;
  }
  
  .slide-content .h1 {
    font-size: 62px;
  }
  
  .btn-primary {
    background-color: #ed1b6f;
    border-radius: 0;
  }
  
  .slick-dots {
    position: absolute;
    bottom: 10px;
    display: block;
    width: 100%;
    padding: 0;
    list-style: none;
    text-align: center;
  }
  
  .slick-dots li {
    position: relative;
    display: inline-block;
    width: 15px;
    height: 15px;
    margin: 0 5px;
    padding: 0;
    cursor: pointer;
  }
  
  .slick-dots li button {
    font-size: 0;
    line-height: 0;
    display: block;
    width: 15px;
    height: 15px;
    padding: 5px;
    cursor: pointer;
    border-radius: 50%;
    border: 0;
    outline: none;
  }
  
  .slick-dots li button::before {
    font-size: 18px;
    color: #fff;
    opacity: 1;
  }
  
  .slick-active button {
    background: #ed1b6f;
  }
  
  /** Text Animation **/
  
  @-webkit-keyframes fadeInUpSD {
    0% {
      opacity: 0;
      -webkit-transform: translateY(100px);
      transform: translateY(100px);
    }
  
    100% {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
    }
  }
  
  @keyframes fadeInUpSD {
    0% {
      opacity: 0;
      -webkit-transform: translateY(100px);
      transform: translateY(100px);
    }
  
    100% {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
    }
  }
  
  .fadeInUpSD {
    -webkit-animation-name: fadeInUpSD;
    animation-name: fadeInUpSD;
  }
  
  .slick-active .slide-content {
    animation-name: fadeInUpSD;
    animation-duration: 1s;
    opacity: 1;
    width: 100%;
    padding: 10px 20px 30px 0;
  }
  
  /* Media Queries */
  
  @media (max-width: 768px) {
    .hero-text .hero .hero-slide a {
      padding-top: 0.8rem;
    }
  
    .hero-text .hero .hero-slide a span {
      font-size: 20px;
      margin-top: 0.5rem;
    }
  
    .hero .hero-slide .header-content {
      left: 50%;
      -webkit-transform: translateX(-50%);
      transform: translateX(-50%);
      margin: 0 auto;
    }
  }

  @-webkit-keyframes fadeInUpSD {
    0% {
      opacity: 0;
      -webkit-transform: translateY(100px);
      transform: translateY(100px);
    }
  
    100% {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
    }
  }
  
  @keyframes fadeInUpSD {
    0% {
      opacity: 0;
      -webkit-transform: translateY(100px);
      transform: translateY(100px);
    }
  
    100% {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
    }
  }
  
  .fadeInUpSD {
    -webkit-animation-name: fadeInUpSD;
    animation-name: fadeInUpSD;
  }
  
  .slick-active .slide-content {
    animation-name: fadeInUpSD;
    animation-duration: 1s;
    opacity: 1;
    width: 100%;
    padding: 10px 20px 30px 0;
  }
  .rotation {
    animation-name: rotation;
    animation-duration: 7s;
    animation-iteration-count: infinite;
  }
  @keyframes rotation {
    from {
       transform: rotate(0deg);
    }
    to {
       transform: rotate(360deg);
       opacity: .5;
    }
 }
 .floating {
    animation-name: floating;
    animation-duration: 6s;
    animation-iteration-count: infinite;
  }
 @keyframes floating {
    0% {
        transform: translate(0px, 0px);
        animation-timing-function:ease-in-out;
    }
 
    50% {
        transform: translate(-433px, 72px);
        animation-timing-function:ease-in-out;
    }
    
    100% {
        transform: translate(0px, 0px);
        animation-timing-function:ease-in-out;
        opacity: 0;
    }
 }
 .floating2 {
    animation-name: floating2;
    animation-duration: 9s;
    animation-iteration-count: infinite;
  }
 @keyframes floating2 {
    0% {
        transform: translate(-222px, 0px);
        animation-timing-function:ease-in-out;
    }
    
    50% {
        transform: translate(1294px, 225px) rotate(180deg);
        animation-timing-function:ease-in-out;
    }
    
    100% {
        transform: translate(-222px, 0px);
        animation-timing-function:ease-in-out;
        opacity: 0;
    }

 }
 .floating3 {
    animation-name: floating3;
    animation-duration: 4s;
    animation-iteration-count: infinite;
  }
 @keyframes floating3 {
    0% {
        transform: translate(0px, 0px);
        animation-timing-function:ease-in-out;
    }
 
    50% {
        transform: translate(433px, 192px) rotate(360deg);
        animation-timing-function:ease-in-out;
    }
    
    100% {
        transform: translate(0px, 0px);
        animation-timing-function:ease-in-out;
        opacity: 0;
    }
}
/* section 2 */
.circle {
    content: "";
    margin: auto;
    padding-top: 59%;
  position: absolute;
  bottom: 40%;
  left: 50%;
  top: auto;
  width: 60%;
    z-index: -1;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    -webkit-transform: translate(-50%, 50%);
    transform: translate(-50%, 50%);
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transition: bottom 0.3s ease-in-out 0s, padding-top 0.3s ease-in-out 0.3s, width 0.3s ease-in-out 0.3s;
    transition: bottom 0.3s ease-in-out 0s, padding-top 0.3s ease-in-out 0.3s, width 0.3s ease-in-out 0.3s;
  }
  .circle-hover:hover .circle {
    bottom: 50%;
    padding-top: 200%;
    width: 200%;
  }
/* section 3 */
#section3{
    background-image: url('../img/noise-parallax-bgimage.jpg');
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
#parallax {
    position: relative;
    width: 100%;
    background-image: url('../img/petals-bg1.png');
    background-repeat: no-repeat;
    background-position: center;
    background-position: 50% 50%;
  }
/* section 4 */
.before::before {
    background: #fff;
    content: "";
    height: 35px;
    margin: auto;
      margin-left: auto;
    margin-left: -45px;
    opacity: 0;
    position: absolute;
    bottom: 0;
    left: -44px;
    top: 0;
    width: 35px;
    z-index: 1;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    -webkit-transition: margin-left 0.45s ease 0s, opacity 0.75s ease-in-out 0s;
    transition: margin-left 0.45s ease 0s, opacity 0.75s ease-in-out 0s;
  }
  .row-hover:hover .before::before {
    margin-left: -18px;
    margin-right: 0;
    opacity: 1;
    left: 0;
  }
  .row-hover img {
    transform: scale(1.2);
   }
  .row-hover img:hover {
   transform: translateX(14px)scale(1.2);
  }
  /* section 5 */
#section5{
    background: url('../img/section-bgimage2b.png')#FFECE7;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
}
/* section 6 */
.translate-hover {
    transition: all .4s;
  }
.translate-hover:hover {
  border: 1px solid #405470!important;
}
.translate-hover .addCart{
    opacity: 0;
    transition: all .4s;
}
.translate-hover:hover .addCart{
    opacity: 100%;
}
.translate-hover .addCart a{
   width: 22px;
   height: 22px;
   transition: all .4s;
}
.translate-hover:hover .addCart a{
   width: 35px;
   height: 35px;
}
.translate-hover:hover .images{
   transform: translateX(-299px);
 }
/* section 7 */
#section7 {
    background-image: url('../img/section-bgimage4a.jpg');
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

/*  */
@media only screen and (min-width:1200px) {

}
@media only screen and (max-width:1200px) {
    

}
@media only screen and (max-width:992px) {
  .slick-dots {
    display: none!important
  }
  .hero .hero-slide .header-content {
    top: -5%;
  }
}

@media only screen and (max-width:768px) {
    .translate-hover:hover .images{
        transform: translateX(-379px);
      }
      .hero h3{
        font-size: 18px;
      }
      .hero h1{
        font-size: 22px;
      }
}
@media only screen and (max-width:576px) {
  .hero h3{
    font-size: 15px;
  }
}
@media only screen and (max-width:400px) {
  .hero .hero-slide .header-content {
    top: -10%;
  }
}
.span_captcha
{
    padding: 10px;
    font-size: 20px;
    position: absolute;
    left: 0;
    bottom: -5px;
    font-weight: 600;
}
.msg-danger,
.msg-success
{
    position: fixed;
    top: 5px;
    right: 5px;
    padding: 8px 20px;
}
.msg-success
{
    background: #009238;
    color: #fff;
}
.msg-danger
{
    background: #92000a;
    color: #fff;
}
.alert_alert
{
    position: fixed;
    top: 10px;
    right: 50%;
    transform: translateX(50%);
    width: 300px;
    max-width: 100%;
    z-index: 999;
}

.footer-distributed{
    background: #ed1b6f90;
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.12);
    box-sizing: border-box;
    width: 100%;
    font: bold 16px sans-serif;
    text-align: left;
    padding: 50px 60px 40px;
    overflow: hidden;
}

.footer-distributed section {
    width: 100%;
    display: inline-block;
    background: #ccc;
    height: 60vh;
    text-align: center;
    font-size: 22px;
    font-weight: 700;
    text-decoration: underline;
}



/* The company logo */

.footer-distributed h3{
    color:  #ffffff;
    font: normal 36px 'Roboto', cursive;
    margin: 0 0 10px;
}

.footer-distributed h3 span{
    color:  #5383d3;
}

/* Footer links */

.footer-distributed .footer-links{
    color:  #ffffff;
    margin: 0 0 10px;
    padding: 0;
}

.footer-distributed .footer-links a{
    display:inline-block;
    line-height: 1.8;
    text-decoration: none;
    color:  inherit;
}

.footer-distributed .footer-company-name{
    color:  #8f9296;
    font-size: 14px;
    font-weight: normal;
    margin: 0;
}

/* Footer social icons */

.footer-distributed .footer-icons{
    margin-top: 40px;
}

.footer-distributed .footer-icons a{
    display: inline-block;
    width: 35px;
    height: 35px;
    cursor: pointer;
    background-color:  #33383b;
    border-radius: 2px;

    font-size: 20px;
    color: #ffffff;
    text-align: center;
    line-height: 35px;

    margin-right: 3px;
    margin-bottom: 5px;
}

/* Footer Right */

.footer-distributed .footer-right iframe{
    width: 100%;
    height: 300px;
    padding: 5px;
    box-shadow: 0 0 2px 0 #ffffff;
    border-radius: 3px;
}

/* If you don't want the footer to be responsive, remove these media queries */

@media (max-width: 1000px) {

    .footer-distributed {
        font: bold 14px sans-serif;
    }

    .footer-distributed .footer-company-name{
        font-size: 12px;
    }
}

@media (max-width: 800px) {

    .footer-distributed{
        padding: 30px;
    }

    .footer-distributed .footer-left,
    .footer-distributed .footer-right{
        max-width: 300px;
        margin: 0 auto;
    }

    .footer-distributed .footer-left{
        margin-bottom: 40px;
    }
}