@font-face{
    font-family:IRANSans;
    font-style:normal;
    font-weight:bold;
    src:url('../fonts/IRANSansWeb_Bold.eot');
    src:url('../fonts/IRANSansWeb_Bold.eot?#iefix') format('embedded-opentype'),
    url('../fonts/IRANSansWeb_Bold.woff2') format('woff2'),
    url('../fonts/IRANSansWeb_Bold.woff') format('woff'),
    url('../fonts/IRANSansWeb_Bold.ttf') format('truetype')
  }
@font-face{
    font-family:IRANSans;
    font-style:normal;
    font-weight:normal;
    src:url('../fonts/IRANSansWeb.eot');
    src:url('../fonts/IRANSansWeb.eot?#iefix') format('embedded-opentype'),
    url('../fonts/IRANSansWeb.woff2') format('woff2'),
    url('../fonts/IRANSansWeb.woff') format('woff'),
    url('../fonts/IRANSansWeb.ttf') format('truetype')
}
body{
    overflow-x: 0;
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font-family: IRANSans,"B Yekan",Tahoma,Arial;
    vertical-align: baseline;
    overflow-x: hidden;
    }

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video
{margin:0;padding:0;border:0;font-size:100%;font-family:IRANSans,"B Yekan",Tahoma,Arial !important;vertical-align:baseline}
article,aside,details,figcaptiontion,figure,footer,header,hgroup,menu,nav,section{display:block}
body{line-height:1}
ol,ul{list-style:none}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}
table{border-collapse:collapse;border-spacing:0}
.clrRow{display:block;width:100%;height:0;font-size:0;clear:both}
a,a:hover,a:link,a:visited,a:active{text-decoration:none;color:#333}
img{
    max-width:100%
}
.MainWrapper{
    width:100%;
    text-align:center;
}
.Main{
    width:100%;
    max-width:1440px;
    display:inline-block;
}
.top{
    width: 100%;
    position: relative;
    min-height: 50px;
    margin-top: 40px;
}
.logo-top{
    position: absolute;
    left:50%;
    transform: translate(-50%, -50%);
}
.menu-top{
    position: absolute;
    right: 10%;
    transform: translate(0, -50%);
    z-index: 100;
}
header{
    padding-top:40px
}
h2{
    font-size:32px;margin:80px 0
}
h2:before,h2:after{
    content:'';
    width:120px;
    height:5px;
    background-color:black;
    display:inline-block;
    margin:0 20px;
}
.mt-5{
  margin-top: 140px;
}

/* start menu Hamburger */
.MenuCNTR {
    top: 20px;
    right: 20px;
    text-align: right;
    direction: rtl;
    display: inline-block;
    vertical-align: middle;
    font-size: 16px;
    z-index: 101;
}
.tcon-menu--xbutterfly {
    width: auto;
}
.tcon {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: 0;
    cursor: pointer;
    display: inline-block;
    vertical-align: top;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    height: 40px;
    transition: .3s;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    width: 40px;
    background: transparent;
    outline: 0;
    -webkit-tap-highlight-color: transparent;
    -webkit-tap-highlight-color: transparent;
}
.tcon-menu__lines {
    display: inline-block;
    height: 4px;
    width: 40px;
    border-radius: 3px;
    transition: .3s;
    background: #3a3939;
    position: relative;
}
.tcon-transform .tcon-menu--xbutterfly .tcon-menu__lines::before {
    transform: rotate3d(0,0,1,45deg);
}
.tcon-transform .tcon-menu--xbutterfly .tcon-menu__lines::before, .tcon-transform .tcon-menu--xbutterfly .tcon-menu__lines::after {
    top: 0;
    transition: top .3s ease,transform .3s .5s ease;
    width: 40px;
}
.tcon-menu--xbutterfly .tcon-menu__lines::before, .tcon-menu--xbutterfly .tcon-menu__lines::after {
    transform-origin: 50% 50%;
    transition: top .3s .6s ease,transform .3s ease;
}
.tcon-menu__lines::before {
    top: 8px;
}
.tcon-menu__lines::before, .tcon-menu__lines::after {
    display: inline-block;
    height: 4px;
    width: 40px;
    border-radius: 2.85714px;
    transition: .3s;
    background: #3a3939;
    content: '';
    position: absolute;
    left: 0;
    transform-origin: 2.85714px center;
    width: 100%;
}
.tcon-transform .tcon-menu--xbutterfly .tcon-menu__lines::after {
    transform: rotate3d(0,0,1,-45deg);
}
.tcon-transform .tcon-menu--xbutterfly .tcon-menu__lines::before, .tcon-transform .tcon-menu--xbutterfly .tcon-menu__lines::after {
    top: 0;
    transition: top .3s ease,transform .3s .5s ease;
    width: 40px;
}
.tcon-menu--xbutterfly .tcon-menu__lines::before, .tcon-menu--xbutterfly .tcon-menu__lines::after {
    transform-origin: 50% 50%;
    transition: top .3s .6s ease,transform .3s ease;
}
.Menu a {
    width: 100%;
    display: inline-block;
    line-height: 35px;
    font-weight: 600;
}

.tcon > * {
    display: block;
}
.tcon {
    cursor: pointer;
}
.tcon-menu--xbutterfly .tcon-menu__lines::before, .tcon-menu--xbutterfly .tcon-menu__lines::after {
    transform-origin: 50% 50%;
    transition: top .3s .6s ease,transform .3s ease;
}
.tcon-menu__lines::before {
    top: 8px;
}
.tcon-menu--xbutterfly .tcon-menu__lines::before, .tcon-menu--xbutterfly .tcon-menu__lines::after {
    transform-origin: 50% 50%;
    transition: top .3s .6s ease,transform .3s ease;
}
.tcon-menu__lines::after {
    top: -8px;
}
.tcon-visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.tcon:hover, .tcon:focus {
    outline: 0;
}
.clrRow {
    display: block;
    width: 100%;
    height: 0;
    font-size: 0;
    clear: both;
}
.tcon-transform .Menu {
    height: 237px;
    padding: 30px 20px;
}
.tcon-transform .tcon-menu--xbutterfly .tcon-menu__lines {
    background: transparent;
}
.tcon-transform .tcon-menu__lines {
    transform: scale3d(0.8,0.8,0.8);
}
.Menu {
    display: inline-block;
    width: 180px;
    height: 0;
    overflow: hidden;
    box-sizing: border-box;
    box-shadow: 0 0 7px rgba(0,0,0,0.3);
    background-color: white;
    position: absolute;
    transition: all .3s ease-in-out;
}
.Menu a:first-child {
    text-align: center;
}
.Menu a {
    width: 100%;
    display: inline-block;
    line-height: 35px;
}
.Menu img {
    max-width: 128px;
    padding-bottom:.8em;

}
/* End menu Hamburger */


/* start search box  */
.search-input{
    border:0;
    outline:0;
    background-color:rgba(241, 237, 237, 0.267);
    border-radius:5px;
    -webkit-box-shadow: 1px 1px 5px 0px rgba(237,234,237,1);
    -moz-box-shadow: 1px 1px 5px 0px rgba(237,234,237,1);
    box-shadow: 1px 1px 5px 0px rgba(237,234,237,1);
    height:40px;width:300px;
    padding:0 10px;
    box-sizing:border-box;
    direction:rtl;
    font-family:IRANSans,'B Yekan',Tahoma,Arial;
    font-weight:normal;
    margin-top: 10px;
}
.search{
    position:relative;
    display:inline-block;
    z-index:0;
}
.search:after{
    content:'';
    width:33px;
    height:32px;
    background-image:url(../images/mag.png);
    display:inline-block;
    position:absolute;
    left:7px;
    top:13px
}
@media all and (max-width:400px){.gallery img{width:95%}.search{width:95%}.search-input{width:100%}}
.error{
    display:none;
    color:red;
    font-weight:normal;
    font-size:12px;
    margin-top:10px;
    direction:rtl
}
.spinner{
    position:absolute;
    right:-55px;
    top:0;
    width:50px;
    height:40px;
    text-align:center;
    font-size:10px;
    display:none
}
.spinner>div{
    background-color:#333;
    height:100%;width:6px;
    display:inline-block;
    -webkit-animation:sk-stretchdelay 1.2s infinite ease-in-out;
    animation:sk-stretchdelay 1.2s infinite ease-in-out
}
.spinner .rect2{
    -webkit-animation-delay:-1.1s;
    animation-delay:-1.1s
}
.spinner .rect3{
    -webkit-animation-delay:-1.0;
    animation-delay:-1.0
}
.spinner .rect4{
    -webkit-animation-delay:-0.9s;
    animation-delay:-0.9s
}
.spinner .rect5{
    -webkit-animation-delay:-0.8s;
    animation-delay:-0.8s
}
.results{
    background-color:rgba(241, 237, 237, 0.267);
    padding:50px;
    border-radius:15px;
    margin:0 auto;
    margin-top:15px;
    position:relative;
    display:none;
    box-sizing:border-box;
    width:95%;
    max-width:1000px
}
.close{
    width:30px;
    height:30px;
    display:inline-block;
    background-image:url(../images/Close_333.png);
    position:absolute;
    right:10px;
    top:10px;
    cursor:pointer;
    -moz-transition:all .3s cubic-bezier(0.52,1.64,0.37,0.66) .1s;
    -o-transition:all .3s cubic-bezier(0.52,1.64,0.37,0.66) .1s;
    -webkit-transition:all .3s cubic-bezier(0.52,1.64,0.37,0.66) .1s;
    transition:all .3s cubic-bezier(0.52,1.64,0.37,0.66) .1s
}
.resultWrapper{
    text-align:center;
    direction:rtl;
    box-sizing:border-box
}
.result{
    direction:rtl;
    display:inline-block;
    border-bottom:1px solid #eee;
    padding-bottom:10px;
    margin:10px 20px
}
.result img{
    display:inline-block;
    vertical-align:middle
}
.result span{
    display:inline-block;
    max-width:150px;
    text-align:justify;
    vertical-align:middle;
    line-height:25px;
    font-size:14px
}
.close:hover{
    -webkit-transform:rotate(90deg);
    -moz-transform:rotate(90deg);
    -ms-transform:rotate(90deg);
    -o-transform:rotate(90deg);
    transform:rotate(90deg)
}

/* end search box  */



/* start svg top site  */
.svg-img{
    width: 100%;
    height: auto;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    margin-top: 6em;
    flex-wrap:  wrap;

}
.svg-img a{
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.box1{
    width: 352px;
    height:288px;
    background: url(../images/box1.jpg) center center;
    background-size: cover;
    clip-path:polygon(50% 0%, 0% 100%, 100% 100%);
    -webkit-clip-path:polygon(50% 0%, 0% 100%, 100% 100%);

}
.box2{
    width: 352px;
    height:288px;
    background: url(../images/box2.jpg) center center;
    background-size: cover;
    clip-path: polygon(50% 100%, 0 0, 100% 0);
    -webkit-clip-path: polygon(50% 100%, 0 0, 100% 0);
    margin-left: -160px;
    box-shadow: 0 0 30px #333;

}
.box3{
    width: 352px;
    height:288px;
    background: url(../images/box3.jpg) left bottom;
  background-size: 120%;
  margin-left: -160px;
  clip-path:polygon(50% 0%, 0% 100%, 100% 100%);
  -webkit-clip-path:polygon(50% 0%, 0% 100%, 100% 100%);

}
.box4{
    width: 352px;
    height:288px;
    background: url(../images/box4.jpg) center center;
    background-size: 170%;
    clip-path: polygon(50% 100%, 0 0, 100% 0);
    -webkit-clip-path: polygon(50% 100%, 0 0, 100% 0);
    margin-left: -160px;

}
/* end svg top site  */


/* start  owl carousel */

.owl-next,.owl-prev{
    font-size:0;
    width:40px;
    height:40px;
    display:inline-block;
    border:1px solid black;
    border-radius:50%;
    background-repeat:no-repeat;
    position:absolute;top:50%;transform:translate(0,-50%)
}
.owl-prev{
    background-image:url(../images/arrow.png);background-position:7px;left:5px}
    .owl-next{background-image:url(../images/arrowRight.png);background-position:13px;right:5px}
    .newest-Inger{max-width:1000px;margin:50px auto}
    .NewInger,.NewInger img{width:240px !important;display:inline-block}
    .owl-item{text-align:center}
    .readMore{display:inline-block;color:white !important;position:absolute;left:10px;bottom:10px}
    .readMore:after{content:'';width:0;height:0;box-sizing:border-box;border:15px solid transparent;border-right:20px solid white;font-size:0;vertical-align:middle;margin-right:10px}

/* end owl crousel */




/* start history */
.brandHistory{
    background-image:url(../images/brandHistoryBack.jpg);
    background-repeat:no-repeat;
    max-width:425px;
    height:425px;
    color:white;
    padding:40px;
    box-sizing:border-box;
    direction:rtl;
    font-size:24px;
    line-height:45px;
    text-align:justify;
    margin:0 auto;
    position:relative;
    font-family:IRANSans;
}
.brandHistory p{
    font-family: IRANSans;
}
/* end  history */


.footerWrapper{
    text-align:center;
    background-color:black;
    margin-bottom:40px;
    margin-top:140px;
}
footer{
    width:100%;
    padding:0 30px;
    height:70px;
    line-height:70px;
    font-size:24px;
    font-weight:bold;
    vertical-align:middle;
    text-align:justify;
    box-sizing:border-box;
    overflow:hidden;
    max-width:1440px;
    display:inline-block
}
footer img{
    vertical-align:middle
}
footer>a{
    display:inline-block
}
footer a:hover,footer a:link,footer a:visited,footer a:active{
    color:white
}
footer>ul{
    display:inline-block
}
footer:after{
    content:'';
    width:100%;
    display:inline-block
}
.Socials{
    height:60px;
    line-height:60px
}
.Socials li{
    list-style:none;
    display:inline-block;
    margin:10px
}
.Socials a{
    width:27px;
    height:27px;
    display:inline-block;
    background-image:url(../images/social_spirit.png);
    -webkit-transition:all .3s cubic-bezier(0.52,1.64,0.37,0.66);
    -moz-transition:all .3s cubic-bezier(0.52,1.64,0.37,0.66);
    -o-transition:all .3s cubic-bezier(0.52,1.64,0.37,0.66);
    transition:all .3s cubic-bezier(0.52,1.64,0.37,0.66)
}
.Socials .fb{
    background-position:0 -27px
}
.Socials .ig{
    background-position:-27px -27px
}
.Socials .tg{
    background-position:-54px -27px
}
.Socials .ap{
    background-position:-81px -27px
}
.Socials .em{
    background-position:-108px -27px
}
.Socials .fb:hover{
    background-position:0 0
}
.Socials .ig:hover{
    background-position:-27px 0
}
.Socials .tg:hover{
    background-position:-54px 0
}
.Socials .ap:hover{
    background-position:-81px 0
}
.Socials .em:hover{
    background-position:-108px 0
}

.bottomMenu{
    font-size:0;
    direction:rtl;
    width:1440px;
    display:inline-block;
    width:100%;
    text-align:right;
    padding: 0 auto;
    box-sizing:border-box;
    margin-bottom:30px
}
.bottomMenu .logo{
    vertical-align:middle;
    display:inline-block;
    margin:0 2%;
}
.bottomMenu .menu{
    border-right:2px solid black;
    height:130px;
    vertical-align:middle;
    font-size:14px;
    text-align:right;
    display:inline-block
}
.menu ul{
    margin-right:20px;
    margin-top:13px
}
.menu ul li{
    line-height:35px;
    font-size:1.3em;
    font-weight: 600;
}
@media all and (max-width:750px){
    footer{height:auto;text-align:center}
    footer:after{display:none}
    footer>a{width:100%}
    .Socials li{margin:8px}
    h2:before,h2:after{width:115px}
}
@media all and (max-width:500px){
    footer {padding: 0; }
    .bottomMenu{padding:0;text-align:center}
    .bottomMenu .logo{width:100%;text-align:center}
    .bottomMenu .menu{width:200px;border-right:0;text-align:right;padding:20px;border-top:2px solid black;margin-top:20px}
    .bottomMenu .menu ul{margin:0}h2{font-size:24px}
     h2:before,h2:after{height:4px;width:60px; margin:0 8px;}
    .brandHistory {max-width: 300px;padding:20px;font-size:20px;}
    }

/* start Query wesite */
@media (max-width:970px) {
    .svg-img{
        width: 85%;
    }
    .flex1{
  order: 3;
    }
    .flex2{
        margin-bottom: 13px;
      order: 1;
  }
  .flex3{
      order: 2;
      margin-bottom: 13px;
  }
  .flex4{
      order: 4;
  }
  .box2{
      margin-left: 0;
  }


  }
  @media (max-width:680px) {

    .svg-img{
        width: 95%;
    }
     .box1{
      width: 16em;
      height:12em;
          margin-left: 0;
     }
    .box2{
        margin-left: 0;
        width: 16em;
        height:12em;
    }
    .box3{
    margin-left: -7em;
      width: 16em;
      height:12em;

    }
    .box4{
      width: 16em;
      height:12em;
      margin-left: -7em;
}

  .tcon-menu__lines{
      height: 4px;
      width: 32px;
  }
  .Menu {
      width: 160px;
  }
  .Menu a{
     font-size: .8em;
  }
  .tcon-transform .Menu {

      height: 210px;
      padding: 30px 20px;

  }
  .Menu img {
     width: 110px;
  }
  .menu-top{
    position: absolute;
    right: 2%;
    transform: translate(0, -50%);

}

    }
@media (max-width:450px) {
    .svg-img{
        width: 80%;

    }
  .box1{
      width: 10em;
        height:8em;
          margin-left: 0;
     }
    .box2{
        margin-left: 0;
        width: 10em;
        height:8em;

    }
    .box3{
        margin-left: -4.5em;
      width: 10em;
      height:8em;


    }
    .box4{
      width: 10em;
      height:8em;
      margin-left: -4.5em;


 }

    }
@media (max-width:350px) {
      .svg-img{
          width: 100%;
      }
      .brandHistory{
          padding:20px;
          font-size:20px;
          max-width: 255px;
          line-height:2
      }

    }