@charset "UTF-8";
@import "fonts.css";
@import "animate.css";
@import "lighBoxHome.css";
@import "navbar.css";
@import "mapbox.css";
@import "swiper.css";
@import "jquery.dataTables.min.css";
@import "footer.css";

:Root {
    --color1: #d5ab3c;
    --color2: #047940;
    --color3: #1b2651;
    --color4: #144555;
    --color5: rgb(220 219 219 / 50%);
    --color6: #ffd278;
}

body {
    font-family: IranYekan !important;
}

.containerMain {
    position: relative;
    width: 100%;
    max-width: 980px;
    margin: auto;
    color: #6d6d6d;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    background: #fff;
}

b,
strong {
    font-weight: 600
}

html {
    position: static !important;
    top: 0 !important;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    overflow: hidden;
    backface-visibility: hidden
}
a.hoverlink {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
}
*,
:after,
:before {
    box-sizing: inherit;
    box-sizing: border-box;
}

body,
html {
    direction: rtl;
    padding: 0;
    margin: 0;
    overflow: auto;
}

a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
b,
big,
blockquote,
body,
canvas,
caption,
center,
cite,
code,
dd,
del,
details,
dfn,
div,
dl,
dt,
em,
embed,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
hr,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
mark,
menu,
nav,
object,
ol,
output,
p,
pre,
q,
ruby,
s,
samp,
section,
small,
span,
strike,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
tt,
u,
ul,
var,
video {
    border: 0;
    vertical-align: baseline;
    margin: 0;
    padding: 0
}

li,
ol,
ul {
    list-style: none
}

blockquote,
q {
    quotes: none
}

*,
.dialog li,
:focus,
a {
    text-decoration: none
}

main.contentMain {
    position: relative;
    width: 100%;
    padding: 120px 0 10px;
}
.hidealert main.contentMain {
    padding: 80px 0 10px;
}
.background {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: no-repeat center / cover;
}
.breadShare {
    position: relative;
    width: 100%;
    border-bottom: 2px solid #dfdfdf;
    padding: 10px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-bottom: 20px;
}
span.responsiveTitle {
    display: none;
}
.breadcrumbs {
    position: relative;
    display: flex;
    align-items: center;
    gap: 5px;
}


    .breadcrumbs .bread {
        position: relative;
        padding-left: 20px;
        height: 20px;
        text-wrap: nowrap;
    }

.breadcrumbs .bread:before {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 12px;
    color: #000;
    font-weight: bold;
    width: 15px;
}

.breadcrumbs .bread a,
.breadcrumbs .bread a span {
    font-size: 16px;
    font-weight: bold;
    color: var(--color3);
}

    .breadcrumbs .bread span {
        font-size: 16px;
        font-weight: 700;
        color: var(--color3);
    }

.breadcrumbs .bread:last-child:before {
    display: none;
}

.breadShare .shareBox {
    position: relative;
    display: flex;
    align-items: center;
    text-wrap: nowrap;
    font-size: 16px;
}

.breadShare .shareBox label {
    color: var(--color3);
}



.TitleSection {
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.TitleSection .title {
    position: relative;
    font-size: 28px;
    color: var(--color2);
    font-family: 'IRANSharp';
    padding: 40px 0 0;
    transition: all 0.5s;
    transform: translateY(0px);
    opacity: 1;
    z-index: 2;
}
.TitleSection .subtitle {
    position: absolute;
    top: -9px;
    font-size: 80px;
    z-index: 0;
    color: #e3e3e3;
    opacity: 50%;
    transition: all 0.5s;
    /* transform: translateY(-110px); */
    /* opacity: 0; */
}

.active .TitleSection .title {
    transform: translateY(0px);
    opacity: 1;
}
.active  .TitleSection .subtitle {
    transition-delay: 0.5s;
    transform: translateY(0px);
    opacity: 1;
}

.CMForm.monaghese4 .TitleSection .subtitle {
    opacity: 0.2;
}
.CMForm.monaghese4 .TitleSection .title {
    color: var(--color2);
}

.rowBtnCenter {
    display: flex;
    justify-content: center;
    gap: 20px;
    align-items: center;
}

.linkCustom {
    position: relative;
    height: 45px;
    padding: 0px 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    color: var(--color2);
    cursor: pointer;
}

.linkCustom i:nth-child(2) {
    position: absolute;
    left: -1px;
    top: -1px;
    width: calc(100% + 2px);
    height: calc(100% + 2px);
    border-radius: 10px;
    pointer-events: none;
    z-index: 10;
}

.rowCustomSlider1 .col * {
    pointer-events: auto;
}

.linkCustom i:nth-child(3) {
    position: absolute;
    left: -1px;
    top: -1px;
    width: calc(100% - 55px);
    height: calc(100% + 2px);
    right: 0;
    margin: auto;
    border: 1px solid var(--color2);
    border-width: 1px 0;
    transition: all 0.2s;
}

.linkCustom:hover i:nth-child(3) {
    position: absolute;
    left: -1px;
    top: -1px;
    width: calc(100% - 55px);
    height: calc(100% + 2px);
    right: 0;
    margin: auto;
    border: 1px solid var(--color2);
    border-width: 1px 0;
    transition: all 0.2s;
}

.linkCustom i:nth-child(2):before {
    position: absolute;
    left: 0;
    top: 0;
    width: 30px;
    height: 100%;
    content: '';
    border-radius: 10px 0px 0px 10px;
    border: 1px solid var(--color1);
    border-right: 0;
    transition: all 0.2s;
}

.linkCustom i:nth-child(2):after {
    position: absolute;
    right: 0;
    top: 0;
    width: 30px;
    height: 100%;
    content: '';
    border-radius: 0px 10px 10px 0px;
    border: 1px solid var(--color1);
    border-left: 0;
    transition: all 0.2s;
}

.linkCustom:hover i:nth-child(2):before,
.linkCustom:hover i:nth-child(2):after {
    width: 50%;
}

.BoxtextMore {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 20px 0;
}

.contentTextMore {
    line-height: 2;
    color: rgb(20 69 85 / 70%);
    text-align: justify;
}

.linkCustom i.arrow {
    position: relative;
    width: 20px;
    height: 20px;
    display: flex;
    margin-right: 5px;
    justify-content: center;
    align-items: center;
    transition: all 0.5s;
}

.BoxtextMore .contentTextMore {
    position: relative;
    width: 100%;
    transition: all 1s;
    max-height: var(--hd);
    overflow: hidden;
    text-align: justify;
}

.BoxtextMore.open .contentTextMore {
    position: relative;
    width: 100%;
    transition: all 1s;
    max-height: 11000px;
    overflow: hidden;
}

.BoxtextMore.open .moreLink i.arrow {
    position: relative;
    transform: scaleY(-1);
}

.contentTextMore img {
    margin: 10px;
}



.ItemPopupCarousel {
    position: relative;
    width: calc(100% - 20px);
    padding-top: 120%;
    margin: auto;
    overflow: hidden;
    cursor: pointer;
}

.ItemPopupCarousel b {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 85%;
    height: 100%;
    background: transparent;
    border-radius: 0px 0px 180px 180px;
    border: 1px solid #bbb;
    border-top: none;
}

.ItemPopupCarousel b:before {
    position: absolute;
    right: -1px;
    width: 3px;
    height: 120%;
    background: linear-gradient(45deg, transparent, transparent, var(--bg), var(--bg));
    content: '';
}

.ItemPopupCarousel b:after {
    position: absolute;
    left: -1px;
    width: 3px;
    height: 60%;
    background: linear-gradient(45deg, transparent, transparent, var(--bg), var(--bg));
    content: '';
}

.ItemPopupCarousel i.pic {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: no-repeat center / 100%;
    transition: all 1s;
}

.ItemPopupCarousel:hover i.pic {
    transform: scale(1.2) rotate(0deg);
}

.sliderPopup {
    position: relative;
    width: 100%;
    padding: 0 40px;
}

.sliderPopup:before {
    right: calc(100% - 150px);
    position: absolute;
    left: 0;
    top: 0;
    width: 40vw;
    height: 100%;
    background: linear-gradient(-90deg, transparent, var(--bg), var(--bg), var(--bg), var(--bg), var(--bg));
    content: '';
    z-index: 10;
    opacity: .8;
}

.sliderPopup:after {
    left: calc(100% - 150px) !important;
    position: absolute;
    right: auto !important;
    top: 0;
    width: 40vw;
    height: 100%;
    background: linear-gradient(90deg, transparent, var(--bg), var(--bg), var(--bg), var(--bg), var(--bg));
    content: '';
    z-index: 10;
    opacity: .8;
}

.sliderPopup .swiper-container {
    position: relative;
    padding: 40px 0px;
    /* overflow: hidden; */
}

.popupCaroudelBox {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 100000000000000000;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 0.5s;
    opacity: 0;
    pointer-events: none;
}

.popupCaroudelBox.show {
    opacity: 1;
    pointer-events: auto;
}

.popupCaroudelBox i.bg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    background: rgba(0, 0, 0, 0.5);
}

.popupCaroudelBox img.picPopup {
    position: relative;
    display: block;
    z-index: 100000000;
    transition: all 0.5s cubic-bezier(0, 1.04, 0, 1.04);
    opacity: 0;
    transform: scale(0);
    max-width: 90%;
    max-height: 90%;
}

.popupCaroudelBox.show img.picPopup {
    transition-delay: 0.5s;
    opacity: 1;
    transform: scale(1);
}

.SecMore,
.SecLoad {
    position: relative;
    padding: 20px 0;
    background: var(--bg);
    margin: 40px 0;
}
.SecMore, .SecLoad {
    overflow: hidden;
}
.Certificates {
    position: relative;
    width: 40%;
    display: block;
    float: left;
    overflow: hidden;
    min-width: 320px;
    max-width: 360px;
    padding: 0;
}


.itemCertificate {
    position: relative;
    width: 100%;
}

.itemCertificate .pic {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: no-repeat center / 100%;
    right: 0;
    margin: auto;
    bottom: 0;
}

.itemCertificate:before {
    position: relative;
    width: 100%;
    padding-top: 100%;
    display: block;
    content: '';
}

.secCertificates .contentText {
    font-size: 16px;
    line-height: 2;
    text-align: justify;
    color: rgb(20 69 85 / 70%);
}

.contentText {
    font-size: 16px;
    line-height: 2;
    text-align: justify;
    color: rgb(20 69 85 / 70%);
    padding: 20px 0;
}

.contentText img {
    margin: 10px
}

.ItemPopupGallery {
    position: relative;
    width: calc(100% - 40px);
    border-radius: 8px;
    overflow: hidden;
    margin: auto;
    cursor: zoom-in;
}

.ItemPopupGallery:before {
    position: relative;
    width: 100%;
    display: block;
    content: '';
    padding-top: 100%;
}

.ItemPopupGallery i.pic {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: no-repeat center / 100%;
}

.ItemPopupGallery i.pic:before {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #047940;
    content: '';
    opacity: 0;
    pointer-events: none;
    transition: all 0.5s;
}

.ItemPopupGallery:hover i.pic:before {
    opacity: 0.3;
}

.linkMoreSec {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    z-index: 100;
    BOTTOM: 0;
    MARGIN: AUTO;
}

a.moreLinkSec {
    padding: 0 0 0 20px;
    height: 30px;
    display: flex;
    align-items: center;
    z-index: 100;
    color: var(--color2);
}

a.moreLinkSec:hover {
    color: var(--color1);
}

a.moreLinkSec:before {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    display: flex;
    align-items: center;
    color: var(--color1);
    font-weight: 600;
    transition: all 0.2s;
}

a.moreLinkSec:hover:before {
    transform: translateX(-5px);
    color: var(--color2);
}


.swiper-button-next,
.swiper-button-prev {
    color: #ead59d !important;
}

.sliderPopup.gallery .swiper-button-next, .sliderPopup.gallery .swiper-button-prev {
    color: var(--color2) !important;
}

.videoBOx {
    position: relative;
    width: 100%;
    margin: 30px auto;
    max-width: 1300px;
}


/* Show CM */
.showCM {
    position: relative;
    width: 100%;
    max-width: 1300px;
    margin: auto;
    padding: 40px 0;
}

.itemCM {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin: 0 auto 20px;
    box-sizing: border-box;
    border-bottom: 1px solid #e4e4e4;
    background: #fff;
    box-shadow: 0px 0px 20px -12px rgba(0, 0, 0, 0.5);
    padding: 30px;
    border-radius: 10px;
}

.itemCM .colAvatar {
    position: relative;
    width: 100px;
    display: flex;
    justify-content: center;
    align-items: flex-start;
}

.itemCM .colAvatar:before {
    position: absolute;
    left: 0;
    right: 0;
    width: 2px;
    background: var(--color2);
    content: '';
    height: 100%;
    margin: auto;
    top: 0;
    bottom: 0;
}

.itemCM .colAvatar span.cmAvatar {
    position: relative;
    width: 60px;
    height: 60px;
    border-radius: 100%;
    background: #fff no-repeat center / cover;
    border: 5px solid #fff;
    top: 10px;
}

.itemCM .colText {
    position: relative;
    width: calc(100% - 100px);
}

.itemCM .colText .nameUserCM {
    margin: 0;
    color: #333;
}

.itemCM .colText span.Created_at {
    color: #b7b7b7;
    font-size: 14px;
}

.itemCM .colText .ContextCM {
    /* min-height: 80px; */
    position: relative;
    font-size: 12px;
    line-height: 20px;
}

/* Show CM */

.contentTextMore img.picText {
    display: block;
    margin: 0 auto 10px;
    max-width: 100%;
    width: auto;
}

.CMForm .TitleSection .subtitle {
    color: rgb(0 0 0 / 49%);
    font-size: 50px;
}
.CMForm  .TitleSection .title {
    padding: 15px 0 0;
}
.CMForm .TitleSection .title {
    color: #fff;
}
.MapOfficeContact {
    padding: 40px 0 0;
}
.frmCM {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 20px 0 30px;
    width: 100%;
}

.SecLoad.CMForm .rowCustom {
    position: relative;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}

    .SecLoad.CMForm .rowCustom .col {
        width: 50%;
        position: relative;
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding: 0 20px;
    }

.SecLoad.CMForm .bg {
    position: absolute;
    left: 0;
    width: 120%;
    top: -20px;
    height: calc(100% + 40px);
    background: no-repeat right top / 100%;
}

.rowCustom.col6 {
    position: relative;
    width: 100%;
    display: grid !important;
    grid-template-columns: repeat(6, 1fr);
    gap: 10px;
}

.rowCustom.col5 {
    position: relative;
    width: 100%;
    display: grid !important;
    grid-template-columns: repeat(5, 1fr);
    gap: 10px;
}

.rowCustom.col4 {
    position: relative;
    width: 100%;
    display: grid !important;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
}

.rowCustom.col3 {
    position: relative;
    width: 100%;
    display: grid !important;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}

.rowCustom.col2 {
    position: relative;
    width: 100%;
    display: grid !important;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
}

.rowCustom.col1 {
    position: relative;
    width: 100%;
    display: grid !important;
    grid-template-columns: 1fr;
    gap: 10px;
}

.group-input {
    position: relative;
    width: 100%;
}

input,
select,
textarea {
    position: relative;
    width: 100%;
    height: 40px;
    background-color: transparent;
    border: 1px solid rgba(0, 0, 0, 0.4);
    border-radius: 8px;
    padding: 10px;
    outline: none;
    font-family: iranYekan;
    font-weight: 300;
}

textarea {
    min-height: 150px;
    resize: none;
    max-height: 150px;
}


.CMForm input,
.CMForm select,
.CMForm textarea {
    color: #fff;
}

.CMForm select * {
    color: #333;
    font-size: 14px;
}

.CMForm input::placeholder,
.CMForm select::placeholder,
.CMForm textarea::placeholder {
    color: rgba(255, 255, 255, 0.3) !important;
    opacity: 1;
    /* Firefox */
}


button.btnSubmit {
    position: relative;
    width: 100%;
    height: 40px;
    border-radius: 8px;
    border: none !important;
    background: #c19b48;
    color: #fff;
    font-family: 'IranYekan';
    font-size: 16px;
    cursor: pointer;
}

button.btnSubmit:hover {
    background: #fff;
    color: #c19b48;
}

.PageText {
    line-height: 2;
    text-align: justify;
    color: rgb(20 69 85 / 70%);
}

.PageText img {
    margin: 10px;
}

.archiveBlog {
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 30px;
    padding: 40px 0;
}

.itemBlog {
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: row-reverse;
    padding: 15px;
    border: 1px solid #e1e1e1;
    border-radius: 8px;
}

.itemBlog .contentItemBlog {
    position: relative;
    width: 60%;
    padding: 20px;
}

.itemBlog .pic {
    position: relative;
    width: 40%;
    border-radius: 8px;
    overflow: hidden;
}

.itemBlog .pic:before {
    position: relative;
    width: 100%;
    display: block;
    content: '';
    padding-top: 50%;
}

.itemBlog .pic .bg {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: no-repeat center / cover;
}

.itemBlog .pic .bg img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.itemBlog .title {
    position: relative;
    padding: 10px;
    color: var(--color2);
    font-family: 'IRANSharp';
    background: #f6f6f6;
    display: block;
    border-right: 4px solid var(--color1);
    margin-bottom: 20px;
    min-height: 75px;
    max-height: 75px;
}

.itemBlog .title:before {
    position: absolute;
    bottom: -10px;
    right: -2px;
    width: calc(100% + 2px);
    height: 2px;
    background: var(--color1);
    content: '';
}

.itemBlog .description {
    position: relative;
    width: 100%;
    font-size: 14px;
    line-height: 2;
    color: var(--color4);
    opacity: 0.8;
    text-align: justify;
}

.itemBlog .linkMoreSec {
    position: relative;
    display: flex;
    justify-content: flex-end;
}

.itemBlog .pic .date {
    position: absolute;
    left: 30px;
    top: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 10px;
    background: var(--color2);
    color: #ffeec0;
    font-weight: 100 !IMPORTANT;
    line-height: 1;
    border-radius: 0 0 8px 8px;
}

.itemBlog .pic .date strong {
    position: relative;
    font-size: 42px;
    font-weight: bold;
}


.itemBlog .pic .bg:before {
    position: absolute;
    left: -40%;
    bottom: -60%;
    width: 100%;
    display: block;
    background: var(--color1);
    content: '';
    height: 100%;
    border-radius: 100%;
    z-index: 1;
    filter: blur(100px);
    transition: all 0.2s;
    transform: translate(-120px, 20px);
}

.itemBlog:hover .pic .bg:before {
    transform: translate(0px, 0px);
}

.itemBlog .pic .bg i.light {
    position: absolute;
    left: 1%;
    top: -65%;
    width: 100%;
    background: linear-gradient(32deg, #ffffffab, transparent, transparent, transparent);
    border-radius: 100%;
    overflow: hidden;
    z-index: 1;
    transition: all 0.5s;
}

.itemBlog:hover .pic .bg i.light {
    left: 5%;
}

.itemBlog .pic .bg i.light:before {
    position: relative;
    width: 100%;
    padding-top: 100%;
    content: '';
    display: block;
}

.itemBlog .pic .bg i.light:after {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    content: '';
}


/* Pagination */
.pagination {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: center;
    margin: 0;
    background: transparent;
    align-items: center;
    grid-gap: 10px;
    flex-wrap: wrap;
    padding: 10px 0;
}

.pagination a {
    margin: 0 !important;
}

.pagination .pageLink {
    position: relative;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    font-size: 16px;
    border-radius: 0;
    transition: all 0.2s;
    background: #f3f3f3;
    display: none;
    color: #7a7a7a;
}

.pagination .pageLink.active,
.pagination .pageLink.selected {
    display: flex;
}

.pagination .pageLink:hover {
    background: #494949;
    color: #fff;
}

.pagination .pageLink:active {
    background: #5d5d5d;
    color: #1a595a;
}

.pagination span.pageLink {
    background: #5d5d5d;
    color: #fff;
    pointer-events: none;
}

a.prevPage {
    position: relative;
    width: 40px;
    margin-left: 0;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    padding-left: 0;
    background: #f3f3f3;
    font-size: 14px;
    color: #333 !important;
}

a.nextPage {
    position: relative;
    width: 40px;
    margin-left: 0;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    padding-right: 0;
    background: #f3f3f3;
    font-size: 14px;
    color: #333 !important;
}

a.nextPage:hover,
a.prevPage:hover {
    color: #4d4d4d;
}

a.nextPage:active,
a.prevPage:active {
    color: #7e7e7e;
}

/* Pagination */





.SecLoad.CRM .sec9FramePic {
    position: absolute;
    width: 100%;
    height: 100%;
    margin-top: 0 !important;
    opacity: 0;
    transition: all 0.5s;
    transform: translateX(-100px);
    top: 0;
    left: 0;
}

.SecLoad.CRM .sec9FramePic {
    opacity: 1;
    transition-delay: 1s;
    transform: translateX(0px);
}

.SecLoad.CRM .sec9FramePic .bgSec9 {
    background: repeat-x left center / 100%;
    position: absolute;
    left: 0;
    top: 0;
    width: 63vw;
    height: 100%;
    bottom: 0;
    margin: auto;
}

.SecLoad.CRM .sec9FramePic .bgSec9:before {
    position: absolute;
    right: 0;
    top: 0;
    content: '';
    width: 100%;
    height: 100%;
    background: url(../img/sections/sec9/bgFrame.png) no-repeat right center / 100%;
}

.SecLoad.CRM .sec9FramePic .bgSec9 i {
    position: absolute;
    left: 102%;
    bottom: 11%;
    width: 70px;
    height: 70px;
    content: '';
    transition: all 0.5s;
    opacity: 0;
    transform: translateY(-100px);
}

.SecLoad.CRM .sec9FramePic .bgSec9 i {
    transition-delay: 1.5s;
    opacity: 1;
    transform: translateY(0px);
}

.sec9FramePic .bgSec9 i:after {
    position: absolute;
    left: 0%;
    bottom: 0%;
    background: #f8ad7b;
    width: 100%;
    height: 100%;
    content: '';
    border-radius: 100%;

}

.SecLoad.CRM .sec9FramePic .bgSec9 i:after {
    animation: transitionXY1 3s infinite;
}

@keyframes transitionXY1 {

    0%,
    100% {
        transform: translate(3px, 3px);
    }

    50% {
        transform: translate(-3px, -3px);
    }
}

@keyframes transitionXY2 {

    0%,
    100% {
        transform: translate(-3px, 3px);
    }

    50% {
        transform: translate(3px, -3px);
    }
}

.SecLoad.CRM .sec9FramePic i.ic1 {
    position: absolute;
    right: 3%;
    top: 10%;
    width: 70px;
    height: 70px;
    content: '';

    transition: all 1.5s;
    opacity: 0;
    transform: translateY(100px);
    animation: transitionXY2 2s infinite;
}

.SecLoad.CRM .sec9FramePic i.ic1:after {
    position: absolute;
    left: 0%;
    bottom: 0%;
    background: linear-gradient(206deg, #fff, #fae9ce, #fae9ce, #efb48c, #efb48c, #efb48c, #efb48c, #efb48c);
    width: 100%;
    height: 100%;
    content: '';
    border-radius: 100%;

}

.SecLoad.CRM .sec9FramePic i.ic1:after {
    animation: transitionXY2 3s infinite;
}

.SecLoad.CRM .sec9FramePic i.ic2 {
    position: absolute;
    right: -1%;
    bottom: 20%;
    width: 70px;
    height: 70px;
    content: '';
    transition: all 0.5s;
    animation: transitionXY2 3s infinite;
}

.SecLoad.CRM .sec9FramePic i.ic2 {
    transition-delay: 2s;
    opacity: 1;
    transform: translateY(0px);
}

.SecLoad.CRM .sec9FramePic i.ic2:after {
    position: absolute;
    left: 0%;
    bottom: 0%;
    background: linear-gradient(206deg, #fff, #fff, #fae9ce, #fae9ce, #efb48c, #efb48c, #efb48c, #efb48c);
    width: 100%;
    height: 100%;
    content: '';
    border-radius: 100%;

}

.SecLoad.CRM .sec9FramePic i.ic2:after {
    animation: transitionXY2 3s infinite;
}

.SecLoad.CRM .sec9FramePic i.ic3 {
    position: absolute;
    right: 7%;
    bottom: 10%;
    width: 30px;
    height: 30px;
    content: '';
    transition: all 0.5s;
    animation: transitionXY1 3s infinite;
}

.SecLoad.CRM .sec9FramePic i.ic3 {
    transition-delay: all 2.5s;
    opacity: 1;
    transform: translateY(0px);
}

.SecLoad.CRM .sec9FramePic i.ic3:after {
    position: absolute;
    left: 0%;
    bottom: 0%;
    background: linear-gradient(206deg, #fae9ce, #fae9ce, #efb48c, #efb48c);
    width: 100%;
    height: 100%;
    content: '';
    border-radius: 100%;
}

.SecLoad.CRM .sec9FramePic i.ic3:after {
    animation: transitionXY1 2s infinite;
}

.SecLoad.CRM .rowCustom {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: space-between;
    padding-top: 0px;
    height: 100%;
    align-items: center;
}

.SecLoad.CRM .rowCustom .col:nth-child(1) {
    height: 100%;
    position: relative;
    display: flex;
    width: 40%;
    flex-direction: column;
    justify-content: center;
}

.SecLoad.CRM .rowCustom .col:nth-child(2) {
    height: 100%;
    position: relative;
    display: flex;
    width: 60%;
    padding-top: 50%;
}

.newsletterForm {
    position: relative;
    width: 100%;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 5px;
    height: 50px;
    transition: all 0.5s;
    transform: translateY(100px);
    opacity: 0;
}

.SecLoad.CRM .newsletterForm {
    transition-delay: 1.6s;
    transform: translateY(0px);
    opacity: 1;
}

.newsletterForm input.inputNewsletter {
    position: relative;
    width: 100%;
    height: 50px;
    display: flex;
    min-width: 100%;
    border-radius: 8px !important;
    border: 1px solid rgb(4 121 64 / 24%);
    box-shadow: none !important;
    direction: ltr;
    font-size: 26px;
    letter-spacing: 7px;
    margin: 0 !important;
    color: var(--color2);
    font-weight: 100;
}

.newsletterForm button.btnYellow {
    position: relative;
    width: 150px;
    height: 50px;
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0;
    justify-content: center;
    border-radius: 8px;
    background: var(--color1);
    color: #fff;
    font-family: 'IranYekan';
    font-size: 20px;
    border: 1px solid var(--color1);
    cursor: pointer;
}

.newsletterForm button.btnYellow:hover {
    background: var(--color2);
    border: 1px solid var(--color2);
}

.titleSec9 strong {
    font-size: 30px;
    font-family: 'IRANSharp';
    color: var(--color1);
    line-height: 1;
    display: flex;
    align-items: center;
    text-wrap: nowrap;
}
    .titleSec9 strong span {
        font-size: 70px;
        color: var(--color2);
    }

.contentSec9 .description {
    font-size: 16px;
    color: var(--color3);
    transition: all 0.5s;
    transform: translateX(-100px);
    opacity: 0;
    line-height: 2;
    text-align: justify;
}

.SecLoad.CRM .contentSec9 .description {
    transition-delay: 1.4s;
    transform: translateX(0px);
    opacity: 1;
}

.contentSec9 {
    position: relative;
    width: 100%;
    max-width: 480px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.titleSec9 {
    position: relative;
    transition: all 0.5s;
    transform: translateX(100px);
    opacity: 0;
}

.SecLoad.CRM .titleSec9 {
    transition-delay: 1.2s;
    transform: translateX(0px);
    opacity: 1;
}

.UnitsCenter {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: space-between;
    padding: 40px 0;
}

.box2unit {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 5px;
    align-items: center;
}

.boxUnit {
    position: relative;
    width: auto;
    min-width: 280px;
    max-width: 280px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    padding: 20px;
    background: #f3f3f3;
    border-radius: 10px;
}

    .boxUnit .title {
        font-size: 20px;
        font-weight: 300;
        color: #919191;
    }

    .boxUnit a {
        position: relative;
        color: #333;
        font-size: 18px;
        font-weight: 600;
    }

.boxUnit a:hover {
    color: var(--color2);
}

.box2unit .lineGap {
    width: calc(100% - 40px);
    margin: auto;
    position: relative;
    height: 30px;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
}

.box2unit .lineGap:before,
.box2unit .lineGap:after {
    position: relative;
    height: 2px;
    width: 100%;
    display: block;
    content: '';
    background: var(--color1);
}

.box2unit .lineGap b {
    position: relative;
    width: 40px;
    height: 30px;
    background: no-repeat center / 30px;
}

.OfficeDownBox {
    position: relative;
    width: 100%;
    padding: 40px 0;
    display: flex;
    flex-direction: column;
    gap: 80px;
}

.bxOffice {
    position: relative;
    width: 100%;
    padding: 30px 0;
}

.bxOffice .mapsfull2 {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.bxOffice .mapsfull2:before {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    content: '';
    background: rgba(0, 0, 0, 0.5);
    z-index: 3;
    pointer-events: none;
}

.bxOffice .mapsfull2 .js-map {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

    .bxOffice .textOffice {
        position: relative;
        width: 60%;
        display: flex;
        margin-bottom: -60px;
        z-index: 10;
    }

.bxOffice .textOffice .col1 {
    position: relative;
    width: calc(100% - 80px);
    margin: auto;
    padding: 40px 100px;
    background: #ffffff;
    border-radius: 10px 10px 0 0;
    display: flex;
    flex-direction: column;
    gap: 5px;
    z-index: 1;
}

.bxOffice .title {
    position: relative;
    font-size: 18px;
    color: var(--color2);
    font-family: 'IRANSharp';
    font-weight: 900;
}

.bxOffice .rowTxt span.fal {
    position: relative;
    padding-right: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    gap: 5px;
    line-height: 1.5;
}

.bxOffice .rowTxt span.fal:before {
    position: absolute;
    top: 0;
    right: 0;
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #61ce70;
    font-size: 20px;
}

.bxOffice .rowTxt {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: space-between;
}

.bxOffice .rowTxt.mails {
    position: relative;
    flex-wrap: wrap;
}

.bxOffice .rowTxt.mails :is(span, a) {
    width: 50%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.bxOffice .rowTxt.mails a:nth-child(even) {
    justify-content: flex-end;
}

.bxOffice .rowTxt a {
    display: flex;
    align-items: center;
    height: 40px;
    color: #333;
}

.bxOffice .rowTxt a:hover {
    color: var(--color2);
}

.bxOffice .lineflower {
    position: absolute;
    width: 240px;
    top: -17px;
    left: 0;
    right: 0;
    margin: auto;
    height: 30px;
    z-index: 10;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
}

.bxOffice .lineflower b {
    position: relative;
    width: 40px;
    height: 30px;
    display: block;
    background: no-repeat center / 30px;
}

.bxOffice .lineflower:before,
.bxOffice .lineflower:after {
    position: relative;
    width: 100%;
    height: 3px;
    content: '';
    background: var(--color1);
}

.bxOffice .textOffice .col1:before {
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    bottom: 0;
    width: 60%;
    height: 2px;
    content: '';
    background: var(--color1);
}

.bxOffice .textOffice:after {
    position: absolute;
    left: 30px;
    bottom: 0;
    width: 40px;
    height: 30px;
    background: var(--color1);
    content: '';
    transform: skewX(40deg);
    filter: brightness(0.9);
}

.bxOffice .container {
    pointer-events: none;
}

.bxOffice .container a {
    pointer-events: auto;
}

.bxOffice:nth-child(even) .container {
    direction: ltr;
}

.bxOffice:nth-child(even) .textOffice .col1 {
    direction: rtl;
}

.bxOffice:nth-child(even) .textOffice:after {
    left: auto;
    right: 30px;
    transform: skewX(-40deg);
}














.ContentListProducts {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    padding: 20px 0 0;
}

.ContentListProducts .col1 {
    position: relative;
    width: 270px;
    margin-left: 10px;
}

.ContentListProducts .col2 {
    width: calc(100% - 280px);
}
.FilterBox {
    position: relative;
    width: 100%;
    padding: 0;
    border-radius: 10px;
    background: #fafafa;
    border: 1px solid #eaeaea;
    border-radius: 10px;
    padding: 15px;
}

.ads {
    position: relative;
    margin-top: 10px;
    width: 100%;
    display: flex;
}

.ads img {
    position: relative;
    width: 100%;
}

/*---------------------- checkbox --------------*/
.checkboxs {
    position: relative;
    width: 100%;
    display: flex;
    align-items: center;
    height: 30px;
    cursor: pointer;
    margin: 5px 0;
}

.checkboxs input {
    position: absolute;
    right: 0;
    overflow: hidden;
    width: 0;
    height: 0;
    opacity: 0;
}

.checkboxs label.lblinput {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: space-between;
    padding: 0 0 0 25px;
    font-weight: bold;
    align-items: center;
    cursor: pointer;
    font-size: 14px;
    color: #333;
    font-weight: 400;
}

.checkboxs input[type=radio]+label.lblinput:before {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    left: 0;
    width: 16px;
    height: 16px;
    content: '';
    background: #fff;
    border-radius: 100%;
    border: 1px solid #d0d0d0;
    box-shadow: 1px 2px 10px -4px #333;
}

.checkboxs input[type=radio]+label.lblinput:after {
    position: absolute;
    top: 0;
    bottom: 0px;
    margin: auto;
    left: 3px;
    width: 12px;
    height: 12px;
    font-family: 'Font Awesome 5 Pro';
    font-weight: 400;
    content: "";
    border-radius: 100%;
    font-size: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #d48644;
    background: radial-gradient(circle, #f3ae75 0%, #d48644 100%);
    transition: all 0.5s cubic-bezier(0.04, 1.13, 0.02, 1.14);
    transform: scale(0) rotate(-90deg);
}

.checkboxs input[type=checkbox]+label.lblinput:before {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    left: 0;
    width: 16px;
    height: 16px;
    content: '';
    background: #fff;
    border-radius: 0px;
    border: 1px solid #c5c5c5;
    box-shadow: 1px 2px 10px -4px #333;
}

.checkboxs input[type=checkbox]+label.lblinput:after {
    position: absolute;
    top: 0;
    bottom: 0px;
    margin: auto;
    left: 3px;
    width: 10px;
    height: 10px;
    font-family: 'Font Awesome 5 Pro';
    font-weight: 400;
    content: "";
    border-radius: 0;
    font-size: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--color2);
    transition: all 0.2s cubic-bezier(0.04, 1.13, 0.02, 1.14);
    transform: scale(0) rotate(-90deg);
}


.checkboxs label.lblinput small {
    position: relative;
    display: block;
    font-size: 12px;
    color: #b3b3b3;
}

.checkboxs input:checked+label.lblinput {
    color: var(--color2);
}

.checkboxs input:checked+label.lblinput:after {
    transform: scale(1) rotate(0deg);
}

.checkboxs input:checked+label.lblinput small {
    color: var(--color2);
}

.checkboxs label.lblinput span {
    display: flex;
    align-items: center;
}

span.color {
    position: relative;
    width: 15px;
    height: 15px;
    display: block;
    border-radius: 3px;
    margin: 0 0 0 5px;
}

/*---------------------- checkbox --------------*/


.titleSection,
.titleAccordion {
    margin: 0;
    font-size: 18px;
    height: 50px;
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    font-size: 16px;
    font-family: 'IRANSHARP';
    font-weight: bold;
    grid-gap: 10px;
    color: #333;
    border-bottom: 1px solid var(--color2);
    padding: 0 10px 0 10px;
}

.accordion .titleAccordion span {
    transition: all 0.5s;
    transform-origin: center;
    color: var(--color2);
    font-size: 18px;
}

.accordion.active .titleAccordion span {
    transform: scaley(-1);
    transform-origin: center;
}

.accordion .titleAccordion span:before {
    font-weight: 400;
}

.titleAccordion i {
    position: relative;
    height: 1px;
    width: 100%;
    margin: auto;
}

input.inputSearchProduct,
input.searchFilterBrand {
    position: relative;
    width: 100%;
    height: 40px;
    padding: 0 10px 0 40px;
    background: #fff url(../img/search.png) no-repeat calc(0% + 5px) center / 30px;
    border-radius: 8px;
    font-size: 14px;
    border: 1px solid var(--color4) !important;
}

.showRagePrice {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.showRagePrice .box-sliderrange {
    position: relative;
    width: calc(50% - 10px);
    display: flex;
    flex-direction: column;
    align-items: center;
    pointer-events: none;
}

.showRagePrice .box-sliderrange:first-child:before {
    position: absolute;
    left: 0;
    top: 0;
    width: 1px;
    height: 80%;
    bottom: 0;
    margin: auto;
    content: '';
    background: #dfdfdf;
}

.showRagePrice .box-sliderrange input {
    position: relative;
    width: 100%;
    border: none;
    background: transparent;
    text-align: center;
    font-family: 'IranYekan';
    color: #9e9e9e;
    font-size: 20px;
    pointer-events: none;
}

.showRagePrice .box-sliderrange span {
    position: relative;
    right: 0;
    left: 0;
    margin: auto;
    width: 40px;
    text-align: center;
    font-size: 13px;
    top: 0;
    height: 30px;
    font-weight: bold;
    color: #b6b6b6;
}

.showRagePrice .box-sliderrange label {
    font-size: 14px;
    font-weight: bold;
    color: #b6b6b6;
    text-align: center;
}


button.btnsubmitFillter {
    position: relative;
    width: 100%;
    background: #f8931f;
    color: #fff;
    border: none;
    height: 50px;
    padding: 0 20px 0 0;
    cursor: pointer;
    font-size: 16px;
}

button.btnsubmitFillter:before {
    position: absolute;
    right: 0;
    top: 0;
    width: 50px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: 'Font Awesome 5 Pro';
    font-weight: 300;
    content: "\f0b0";
    font-size: 24px;
}

button.btnsubmitFillter:hover {
    background: #a75a01;
    color: #fff;
}

button.btnsubmitFillter:active {
    background: #ffb056;
    color: #a75a01;
}

a.boxADS {
    width: 100%;
    position: relative;
    margin: 0px;
    padding: 20px 0;
    height: auto;
    display: flex;
}

a.boxADS img {
    width: 100%;
    display: flex;
}

.cardFilter {
    position: relative;
    width: 100%;
    margin: 10px 0;
    /* background: #fff; */
    border-radius: 5px;
    /* box-shadow: 0px 0px 8px -5px #000; */
    padding: 10px;
}

.onoffBox {
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 0 0 10px;
}

.buttonOnOff {
    position: relative;
    width: 100%;
    display: flex;
    align-items: center;
    cursor: pointer;
}

.buttonOnOff input {
    position: absolute;
    right: 0;
    overflow: hidden;
    width: 0;
    height: 0;
    opacity: 0;
}

.buttonOnOff label {
    position: relative;
    width: 100%;
    padding-left: 80px;
    height: 30px;
    display: flex;
    align-items: center;
    font-size: 16px;
    color: rgb(109, 109, 109);
    transition: all 0.5s;
    cursor: pointer;
}

.buttonOnOff label span {
    position: relative;
    font-size: 14px;
    font-weight: 600;
    color: #333;
}

.buttonOnOff label i {
    position: absolute;
    width: 70px;
    height: 30px;
    border-radius: 0;
    background: #e7e7e7;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    border: 1px solid #e7e7e7;
    transition: all 0.5s;
    cursor: pointer;
    border-radius: 10px;
}

.buttonOnOff label i:before {
    position: absolute;
    left: 2px;
    top: 0px;
    bottom: 0;
    background: #fff;
    border-radius: 0;
    content: '';
    width: 40px;
    height: 22px;
    margin: auto;
    transition: all 0.5s;
    border-radius: 6px;
}

.buttonOnOff input:checked+label i {
    background-color: #ffffff;
    border-color: var(--color2);
}

.buttonOnOff input:checked+label {
    color: var(--color2);
}

.buttonOnOff input:checked+label i:before {
    border-color: var(--color2);
    left: calc(100% - 43px);
    background: var(--color2);
}

.noUi-handle.noUi-handle-upper {
    right: -10px !important;
    cursor: pointer;
}

.noUi-handle.noUi-handle-lower {
    right: -10px !important;
    cursor: pointer;
}


.accordion .contentAccordion {
    position: relative;
    width: 100%;
    padding: 0px 20px;
    transition: all 0.5s;
    max-height: 0;
    overflow: hidden;
    background: #fff;
}

.accordion.active .contentAccordion {
    padding: 15px 20px;
    max-height: 2000px;
}

.accordion .contentAccordion:before {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    content: '';
    border-width: 0 1px;
    box-sizing: border-box;
    height: calc(100% - 10px);
    margin: auto;
    pointer-events: none;
}

.categoriesProduct {
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.categoriesProduct span.parentCatProd {
    position: relative;
    width: 100%;
    min-height: 40px;
    display: flex;
    flex-wrap: wrap;
    border-bottom: 1px solid #b9bdca;
}

.categoriesProduct span.parentCatProd:last-child {
    border-bottom: none;
}

.categoriesProduct i.openparent,
.categoriesProduct i.openchild,
.categoriesProduct i.openchildchild {
    position: relative;
    width: 30px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #243c5d;
}

.categoriesProduct i.openparent:before,
.categoriesProduct i.openchild:before,
.categoriesProduct i.openchildchild:before {
    font-weight: 400;
    font-size: 14px;
}

span.parentCatProd i.openparent:before {
    transition: all 0.5s;
}

span.parentCatProd.open i.openparent:before {
    transform: rotate(90deg);
    color: #8e9aaa;
}

.categoriesProduct a.linkcat {
    position: relative;
    width: calc(100% - 30px);
    height: 40px;
    display: flex;
    align-items: center;
    font-weight: 500;
    color: #333;
    font-size: 14px;
}

.categoriesProduct span.parentCatProd span.childCatProd {
    position: relative;
    width: 100%;
    /* min-height: 40px; */
    max-height: 0px;
    display: flex;
    flex-wrap: wrap;
    transition: all 0.5s;
    padding: 0 15px 0 0;
    overflow: hidden;
}

span.childCatProd i.openchild:before {
    transition: all 0.5s;
}

span.childCatProd.open i.openchild:before {
    transform: rotate(90deg);
    color: #8e9aaa;
}

.categoriesProduct span.parentCatProd.open span.childCatProd {
    min-height: 40px;
    max-height: 1000px;
}

.categoriesProduct span.parentCatProd span.childCatProd span.childChildCatProd {
    position: relative;
    width: 100%;
    /* min-height: 40px; */
    max-height: 0px;
    display: flex;
    flex-wrap: wrap;
    transition: all 0.5s;
    padding: 0 15px 0 0;
    overflow: hidden;
}

span.childChildCatProd i.openchildchild:before {
    transition: all 0.5s;
}

span.childChildCatProd.open i.openchildchild:before {
    transform: rotate(90deg);
    color: #8e9aaa;
}

.categoriesProduct span.parentCatProd span.childCatProd.open span.childChildCatProd {
    position: relative;
    width: 100%;
    /* min-height: 40px; */
    max-height: 1000px;
    display: flex;
    flex-wrap: wrap;
    padding: 0 15px 0 0;
}

.contenShowProduct {
    position: relative;
    width: 100%;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-column-gap: 20px;
    grid-row-gap: 40px;
    padding: 10px 0 40px;
    border-radius: 0;
}

.contenShowProduct .itemProduct {
    width: 100%;
    max-width: unset;
    border-radius: 0;
    box-shadow: 0px 0px 25px -20px #333;
    transition: all 0.2s;
    padding-bottom: 10px;
}

.rowSort {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    background: #f5f5f5;
    padding: 0 20px;
    min-height: 60px;
    border-radius: 10px;
    flex-wrap: wrap;
    gap: 20px;
}

.rowSort .checkboxs {
    position: relative;
    width: auto;
}

.rowSort .checkboxs label.lblinput {
    padding: 0 30px 0 0px;
}

.rowSort .checkboxs input[type=radio]+label.lblinput:before {
    left: auto;
    right: 5px;
    border: 1px solid #898989;
}

.rowSort .checkboxs input[type=radio]+label.lblinput:after {
    left: auto;
    right: 8px;
    width: 10px;
    height: 10px;
    background: var(--color2) !important;
}

.rowSort .checkboxs input[type=radio]:checked+label.lblinput:after {
    transform: scale(1) rotate(90deg);
}

.itemSlideProduct {
    position: relative;
    width: 100%;
    border: 1px solid #ebebeb;
    border-radius: 10px;
    box-shadow: 0px 0px 11px -6px rgba(0, 0, 0, 0.5);
}

.itemSlideProduct:before {
    position: absolute;
    top: 105%;
    left: 0;
    right: 0;
    margin: auto;
    border-radius: 100%;
    width: 83%;
    height: 6px;
    content: '';
    background: #000;
    filter: blur(4px);
    opacity: 0;
    z-index: 0;
    transition: all 0.2s;
    transform: translateY(-100px);
}

.itemSlideProduct:hover:before {
    opacity: 0.4;
    transform: translateY(0px);
}

.itemSlideProduct .pic {
    position: relative;
    width: 100%;
    background: #fafafa no-repeat center / cover;
    margin-bottom: 50px;
    border-radius: 10px 10px 0 0;
}

.itemSlideProduct .pic img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px 10px 0 0;
    opacity: 0;
    transition: all 0.2s;
}


.itemSlideProduct .pic img.okloadlazy {
    opacity: 1;
}

.itemSlideProduct .pic:before {
    position: relative;
    width: 100%;
    display: block;
    content: '';
    padding-top: 120%;
}

.itemSlideProduct .labelsProduct {
    position: absolute;
    left: 0;
    top: 0;
    padding: 10px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    z-index: 1;
    align-items: flex-end;
}

.itemSlideProduct span.lblProd {
    position: relative;
    padding: 0 10px;
    background: #eee;
    border-radius: 8px;
    font-size: 13px;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 30px;
}

span.lblProd.special {
    background: #ca0000;
    color: #fff;
}

span.lblProd.suggest {
    background: #ceaa57;
    color: #fff;
}

.itemSlideProduct .hoverlink {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border-radius: 10px;
    background: rgb(4 121 64 / 70%);
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 0 !important;
    opacity: 1;
    transition: all 0.5s;
    z-index: 1;
    opacity: 0;
    pointer-events: none;
}

.itemSlideProduct:hover .hoverlink {
    opacity: 1;
    pointer-events: auto;
}

.itemSlideProduct .hoverlink:before {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    font-size: 28px;
    color: #ffd278;
    display: flex;
    justify-content: center;
    align-items: center;
    transform: scaleX(-1);
}

.itemSlideProduct .titleService {
    position: absolute;
    bottom: -13px;
    width: calc(100% - 30px);
    margin: auto;
    left: 0;
    right: 0;
    background: #fff;
    padding: 10px;
    border-radius: 10px;
    height: 60px;
    display: flex;
    align-items: center;
    font-size: 14px !important;
    font-weight: 600;
    color: #6e6e6e;
    justify-content: center;
    text-align: center;
    z-index: 10;
    pointer-events: none;
}

.itemSlideProduct:after {
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    width: 60px;
    height: 2px;
    pointer-events: none;
    content: '';
    background: var(--color2);
    z-index: 11;
}





















section.slide {
    position: relative;
    height: 100vh;
    width: 100%;
}

.contentSecPods {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
}
.ProductCategoruyList {
    position: relative;
    width: 100%;
    overflow: hidden;
}
.contentSecPods .sliderOne, .contentSecPods .sliderOne .swiper-slide, .contentSecPods .sliderOne .itemProductSec {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 900px;
}
.ProductCategoruyList section.slide {
    min-height: 900px;
}
.contentSecPods .rowCustom {
    position: relative;
    width: 100%;
    display: flex;
    height: 100%;
}

.contentSecPods .rowCustom .col1 {
    position: relative;
    width: 40%;
}

.contentSecPods .rowCustom .col2 {
    position: relative;
    width: 60%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.CircleImageGall {
    position: absolute;
    width: 93%;
    background: no-repeat center / cover;
    border-radius: 100% !important;
    overflow: hidden;
    right: -40%;
    top: 12%;
    box-shadow: 14px 60px 0px 0px rgba(255, 255, 255, 0.6) inset, -10px -37px 0px 0px rgba(255, 255, 255, 0.7) inset;
    transition: all 0.5s;
    transform: translateX(100vw);
    opacity: 0;
}

.slide.selected .swiper-slide-active .CircleImageGall {
    transform: translateX(0vw);
    opacity: 1;
    transition: all 1s;
}

.CircleImageGall:before {
    position: relative;
    width: 100%;
    padding-top: 100%;
    content: '';
    display: block;
    transition: all 1s;
}

.CircleImageGall:after {
    position: absolute;
    left: 2%;
    top: 3%;
    width: 100%;
    height: 100%;
    content: '';
    display: block;
    border: 2px solid var(--color1);
    border-radius: 100%;
    transition: all 0.5s;
}

.contentSecPods .rowCustom .col1 img {
    position: absolute;
    z-index: 2;
    right: 12%;
    bottom: -20%;
    top: 0;
    margin: auto;
    width: 40%;
    height: auto;
    transition: all 0.5s;
    transform-origin: bottom center;
    opacity: 0;
    transform: translateX(100px);
    transition-delay: 0s;
}

.slide.selected .swiper-slide-active .rowCustom .col1 img {
    opacity: 1;
    transition: all 1s;
    transform: translateX(0px);
    transition-delay: 1s;
}

.contentSecPods .rowCustom .col1 .lineCircle {
    position: absolute;
    width: 94%;
    background: no-repeat center / cover;
    border-radius: 100% !important;
    overflow: hidden;
    right: -38%;
    top: 11%;
    transition: all 0.5s;
    border: 2px solid var(--color2);
    transform: translateX(100vw);
    opacity: 0;
}

.slide.selected .rowCustom .col1 .lineCircle {
    transform: translateX(0vw);
    opacity: 1;
    transition-delay: 1.5s;
}

.contentSecPods .rowCustom .col1 .lineCircle:before {
    position: relative;
    display: block;
    padding-top: 95%;
    content: '';
}

.SectionProdobjects i.bgpic {
    position: relative;
    width: 100%;
    display: block;
    background: no-repeat left center / cover;
    -webkit-clip-path: url(#sec3Framebg);
    clip-path: url(#sec3Framebg);
    transition: all 0.5s;
    transform: translateY(60px);
    opacity: 0;
}

.slide.section4 .SectionProdobjects i.bgpic {
    -webkit-clip-path: url(#sec4Framebg);
    clip-path: url(#sec4Framebg);
}

.slide.section5 .SectionProdobjects i.bgpic {
    -webkit-clip-path: url(#sec5Framebg);
    clip-path: url(#sec5Framebg);
}

.slide.section6 .SectionProdobjects i.bgpic {
    -webkit-clip-path: url(#sec6Framebg);
    clip-path: url(#sec6Framebg);
}

.slide.section7 .SectionProdobjects i.bgpic {
    -webkit-clip-path: url(#sec7Framebg);
    clip-path: url(#sec7Framebg);
}

.slide.selected .swiper-slide-active .SectionProdobjects i.bgpic {
    transition-delay: 1s;
    transform: translateY(0px);
    opacity: 1;
}

.SectionProdobjects i.bgpic:before {
    position: relative;
    width: 100%;
    padding-top: 72%;
    content: '';
    display: block;
}

.SectionProdobjects svg.lineFrame {
    position: absolute;
    left: -3%;
    top: 1%;
    width: 106%;
    bottom: 0;
    margin: auto;
    stroke-dashoffset: 2490.64697265625px;
    stroke-dasharray: 2490.64697265625px;
    -webkit-transition: stroke-dashoffset 500ms cubic-bezier(0.47, 0, 0.745, 0.715) 0s;
    transition: stroke-dashoffset 500ms cubic-bezier(0.47, 0, 0.745, 0.715) 0s;
    transition: all 0.5s;
    transform: translateY(-60px);
    opacity: 0;
}

.slide.selected .swiper-slide-active .SectionProdobjects svg.lineFrame {
    stroke-dashoffset: 0;
    transition-delay: 2s;
    -webkit-transition: stroke-dashoffset 3s cubic-bezier(0.47, 0, 0.745, 0.715) 0s;
    transition: stroke-dashoffset 3s cubic-bezier(0.47, 0, 0.745, 0.715) 0s;
    transform: translateY(0px);
    opacity: 1;
}

.SectionProdobjects img.groupProd {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -12%;
    height: auto;
    width: 90%;
    margin: auto;
    transition: all 0.5s;
    transform: perspective(1000px) rotateX(90deg);
    transform-origin: bottom center;
}

.slide.selected .swiper-slide-active .SectionProdobjects img.groupProd {
    transition-delay: 1s;
    transform: perspective(1000px) rotateX(0deg);
    transform-origin: bottom center;
}

span.bgProd {
    position: relative;
    width: 70% !important;
    display: flex;
    margin: 18% 12% 0 0;
}

.slide svg.lineSec {
    position: absolute;
    bottom: -40px;
    width: 117%;
    right: -7%;
    stroke-dashoffset: 2832.79638671875px;
    stroke-dasharray: 2832.79638671875px;
    -webkit-transition: stroke-dashoffset 3s cubic-bezier(0.47, 0, 0.745, 0.715) 0s;
    transition: stroke-dashoffset 3s cubic-bezier(0.47, 0, 0.745, 0.715) 0s;
}

.slide.selected svg.lineSec {
    stroke-dashoffset: 0;
    transition-delay: 2s;
}

.SectionProdobjects i.circlePic1 {
    position: absolute;
    right: -100px;
    bottom: 0;
    top: 10%;
    background: no-repeat center / cover;
    width: 60px;
    height: 60px;
    border-radius: 100%;
    margin: auto;
    transition: all 1s;
    transform: translateY(-10vw);
    opacity: 0;
}

.SectionProdobjects i.circlePic1 i {
    position: absolute;
    right: 0;
    bottom: 0;
    top: 0%;
    background: no-repeat center / cover;
    width: 100%;
    height: 100%;
    border-radius: 100%;
    margin: auto;
}

.SectionProdobjects i.circlePic1 i:before {
    position: absolute;
    left: 2px;
    top: -10px;
    width: 90%;
    height: 90%;
    border-radius: 100%;
    border: 2px solid var(--color2);
    content: '';
}

.SectionProdobjects i.circlePic2 {
    position: absolute;
    left: 2%;
    top: 27%;
    background: no-repeat center / cover;
    width: 40px;
    height: 40px;
    border-radius: 100%;
    margin: auto;
    transition: all 1s;
    transform: translateY(-10vw);
    opacity: 0;
}

.SectionProdobjects i.circlePic2 i {
    position: absolute;
    left: 0;
    top: 0;
    background: no-repeat center / cover;
    width: 100%;
    height: 100%;
    border-radius: 100%;
    margin: auto;
    transition: all 1s;
}

.SectionProdobjects i.circlePic2 i:before {
    position: absolute;
    left: -13%;
    top: -13%;
    width: 95%;
    height: 95%;
    border-radius: 100%;
    border: 2px solid var(--color2);
    content: '';
}

.slide.selected .swiper-slide-active .SectionProdobjects i.circlePic1 {
    opacity: 1;
    transform: translateY(0vw);
    transition-delay: 1.5s;
}

.slide.selected .swiper-slide-active .SectionProdobjects i.circlePic2 {
    opacity: 1;
    transform: translateY(0vw);
    transition-delay: 1.5s;
}

.slide.selected .swiper-slide-active .SectionProdobjects i.circlePic1 i {
    opacity: 1;
    animation: transitionXY1 3s infinite;
}

.slide.selected .swiper-slide-active .SectionProdobjects i.circlePic2 i {
    transform: translateY(0vw);
    opacity: 1;
    animation: transitionXY2 3s infinite;
}

.slide.selected .swiper-slide-active .SectionProdobjects i.circlePic1 i:before {
    animation: transitionXY2 3s infinite;
}

.slide.selected .swiper-slide-active .SectionProdobjects i.circlePic2 i:before {
    animation: transitionXY1 3s infinite;
}

.TitleSection {
    position: relative;
    width: 100%;
    top: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.contentSecPods .TitleSection {
    position: absolute;
    top: 11%;
}


    .TitleSection .title {
        position: relative;
        font-size: 28px;
        color: var(--color2);
        font-family: 'IRANSharp';
        padding: 40px 0 0;
        transition: all 0.5s;
        transform: translateY(0px);
        opacity: 1;
        z-index: 2;
    }

    .TitleSection .subtitle {
        position: absolute;
        top: -9px;
        font-size: 80px;
        z-index: 0;
        color: #e3e3e3;
        opacity: 50%;
        transition: all 0.5s;
        transform: translateY(0px);
        opacity: 1;
        z-index: 1;
    }

.slide.selected .TitleSection .title, .slide.selected .TitleSection .subtitle {
    transition-delay: 1s;
    transform: translateY(0px);
    opacity: 1;
    /* z-index: 1 !important; */
}
.slide.selected .TitleSection .subtitle {
    color: #e3e3e3;
}
.slide .linkMoreSec {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 9%;
    display: flex;
    align-items: center;
    z-index: 100;
    transition: all .4s cubic-bezier(0.87, 0.85, 0, 1.21);
    transform: scale(0);
    transform-origin: left;
}

.slide.selected .linkMoreSec {
    transition-delay: 1s;
    transform: scale(1);
}

.slide a.moreLinkSec {
    padding: 0 0 0 20px;
    height: 30px;
    display: flex;
    align-items: center;
    z-index: 100;
    color: var(--color2);
    position: relative;
}

.slide a.moreLinkSec:hover {
    color: var(--color1);
}

a.moreLinkSec:before {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    display: flex;
    align-items: center;
    color: var(--color1);
    font-weight: 600;
    transition: all 0.2s;
}

.slide a.moreLinkSec:hover:before {
    transform: translateX(-5px);
    color: var(--color2);
}

.contentSecPods .rowCustom.fix {
    pointer-events: none;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    display: flex;
    height: 100%;
}

.contentSecPods .rowCustom .col1 .tabsSlider {
    position: absolute;
    width: 92%;
    background: no-repeat center / cover;
    border-radius: 100% !important;
    right: -35.8%;
    top: 13%;
    transition: all 0.5s;
    transform: translateX(0vw);
    opacity: 1;
    z-index: 10;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.contentSecPods .rowCustom .col1 .tabsSlider:before {
    position: relative;
    display: block;
    padding-top: 95%;
    content: '';
}

.contentSecPods .rowCustom .col1 .tabsSlider .contentTabsSlider {
    position: absolute;
    right: 100%;
    display: flex;
    flex-direction: column;
    top: 0;
    height: 100%;
    width: 100%;
    justify-content: center;
    gap: 10px;
    padding: 0;
}

.tabsSlider .tabSlideitem {
    position: relative;
    height: 50px;
    display: flex;
    align-items: center;
    pointer-events: none;
    cursor: pointer;
    transition: transform 0.5s, opacity 0.5s;
    transform: translateX(-100px);
    opacity: 0;
    transition-delay: 0s;
}

.contentTabsSlider[data-count="3"] .tabSlideitem[data-slide="1"] {
    right: -11px;
}

.contentTabsSlider[data-count="3"] .tabSlideitem[data-slide="2"] {
    right: -3px;
}

.contentTabsSlider[data-count="3"] .tabSlideitem[data-slide="3"] {
    right: -8px;
}

.contentTabsSlider[data-count="3"] .tabSlideitem.active[data-slide="3"] {
    right: -2px !important;
}


.contentTabsSlider[data-count="2"] .tabSlideitem[data-slide="1"] {
    right: -6px;
}

.contentTabsSlider[data-count="2"] .tabSlideitem.active[data-slide="1"] {
    right: -4px;
}

.contentTabsSlider[data-count="2"] .tabSlideitem[data-slide="2"] {
    right: -4px;
}

.contentTabsSlider[data-count="2"] .tabSlideitem.active[data-slide="2"] {
    right: 0px;
}

.contentTabsSlider[data-count="1"] .tabSlideitem[data-slide="1"] {
    right: 0;
}

.slide.selected .tabsSlider .tabSlideitem {
    pointer-events: auto;
    transform: translateX(0);
    opacity: 1;
    transition-delay: calc(4s * var(--i));
}

.tabsSlider .tabSlideitem:before {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 10px;
    height: 10px;
    content: '';
    background: var(--color2);
    border-radius: 100%;
    margin: auto;
    transition: all 0.2s;
}

.tabsSlider .tabSlideitem.active:before {
    transform: scale(2);
    transition: all 0.2s;
}

.tabsSlider .tabSlideitem .titleItemTab {
    color: var(--color4);
    position: relative;
    padding: 0 30px 0 20px;
    height: 50px;
    display: flex;
    align-items: center;
    border-radius: 10px 0px 0px 10px;
    border: 1px solid transparent;
    border-width: 0px 0 0px 7px !important;
    transition: all 0.2s;
}

.tabsSlider .tabSlideitem.active .titleItemTab {
    border: 1px solid var(--color2);
    font-weight: bold;
}

.tabsSlider .tabSlideitem .titleItemTab:before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    background: var(--color2);
    height: 1px;
    display: block;
    content: '';
    opacity: 0;
    transition: all 0.2s;
}

.tabsSlider .tabSlideitem.active .titleItemTab:before {
    opacity: 1;
}

.tabsSlider .tabSlideitem .titleItemTab:after {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 70%;
    background: var(--color2);
    height: 1px;
    display: block;
    content: '';
    opacity: 0;
    transition: all 0.2s;
}

.tabsSlider .tabSlideitem.active .titleItemTab:after {
    opacity: 1;
}

.tabsSlider .tabSlideitem .moreTabSlideItem {
    position: relative;
    height: 100%;
    display: flex;
    align-items: center;
    width: 100px;
    padding: 0 20px 0 10px;
    background: var(--color2);
    text-align: center;
    color: #fff;
    font-size: 12px;
    border-radius: 10px 0 0 10px;
    margin-right: -7px;
    transition: all 0.2s;
    opacity: 0;
    pointer-events: none;
}

.tabsSlider .tabSlideitem.active .moreTabSlideItem {
    opacity: 1;
    pointer-events: auto;
}

.slide.section3 svg.lineSec {
    width: 117%;
    right: -7%;
    height: 100% !important;
}

.slide svg.lineSec {
    width: 114%;
    right: -13%;
    height: 100% !important;
}

.slide.section4 i.circlePic1 {
    right: 100% !important;
    top: 20% !important;
    bottom: auto !important;
}

.slide.section4 i.circlePic2 {
    left: 95% !important;
    top: 35% !important;
}

.slide.section5 .SectionProdobjects i.circlePic2 {
    left: -5%;
    top: 47%;
}


.slide.section6 svg.lineFrame path {
    stroke-dashoffset: 2678.760009765625px;
    stroke-dasharray: 2678.760009765625px;
    -webkit-transition: stroke-dashoffset 3s cubic-bezier(0.47, 0, 0.745, 0.715) 0s;
    transition: stroke-dashoffset 3s cubic-bezier(0.47, 0, 0.745, 0.715) 0s;
}

.slide.section6.selected svg.lineFrame path {
    stroke-dashoffset: 0;
}

.slide.section4 svg.lineFrame path {
    stroke-dashoffset: 2678.760009765625px;
    stroke-dasharray: 2678.760009765625px;
    -webkit-transition: stroke-dashoffset 3s cubic-bezier(0.47, 0, 0.745, 0.715) 0s;
    transition: stroke-dashoffset 3s cubic-bezier(0.47, 0, 0.745, 0.715) 0s;
}

.slide.section4.selected svg.lineFrame path {
    stroke-dashoffset: 0;
}


.slide.section6 .SectionProdobjects i.circlePic1 {
    right: 100%;
    bottom: auto;
}

.slide.section6 .SectionProdobjects i.circlePic2 {
    right: 0;
    bottom: auto;
    left: auto;
    top: auto;
    bottom: 20%;
}

.slide.section6 .SectionProdobjects i.circlePic1 i:before,
.slide.section6 .SectionProdobjects i.circlePic2 i:before {
    display: none;
}

.slide .SectionProdobjects i.circlePic3,
.slide .SectionProdobjects i.circlePic4,
.slide .SectionProdobjects i.circlePic5,
.slide .SectionProdobjects i.circlePic6 {
    position: absolute;
    left: 2%;
    top: 27%;
    background: no-repeat center / cover;
    width: 40px;
    height: 40px;
    border-radius: 100%;
    margin: auto;
    transition: all 1s;
    transform: translateY(-10vw);
    opacity: 0;
}

.slide.selected .swiper-slide-active .SectionProdobjects i.circlePic3,
.slide.selected .swiper-slide-active .SectionProdobjects i.circlePic4,
.slide.selected .swiper-slide-active .SectionProdobjects i.circlePic5,
.slide.selected .swiper-slide-active .SectionProdobjects i.circlePic6 {
    transition-delay: 1s;
    transform: translateY(0vw);
    opacity: 1;
}

.slide .SectionProdobjects i.circlePic3 i,
.slide .SectionProdobjects i.circlePic4 i,
.slide .SectionProdobjects i.circlePic5 i,
.slide .SectionProdobjects i.circlePic6 i {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: block;
    content: '';
    border: 2px solid var(--color2);
    border-radius: 100%;
}

.slide .SectionProdobjects i.circlePic3 {
    left: 137%;
    bottom: -3%;
    top: auto !important;
    width: 30px;
    height: 30px;
}

.slide .SectionProdobjects i.circlePic4 {
    left: 105%;
    bottom: -8%;
    top: auto;
    width: 50px;
    height: 50px;
}

.slide .SectionProdobjects i.circlePic5 {
    top: 0%;
    bottom: auto;
    left: 37%;
}

.slide .SectionProdobjects i.circlePic6 {
    top: 0%;
    bottom: auto;
    left: 37%;
}

.slide.section4 .SectionProdobjects i.circlePic5 {
    top: 0%;
    bottom: auto;
    left: 52%;
    width: 50px;
    height: 50px;
}

.slide.section5 .SectionProdobjects i.circlePic5 {
    top: -5%;
    bottom: auto;
    left: 43%;
    width: 50px;
    height: 50px;
}

.slide.section6 .SectionProdobjects i.circlePic5 {
    top: 30%;
    bottom: auto;
    left: -10%;
    width: 30px;
    height: 30px;
}

.slide.section6 .SectionProdobjects i.circlePic6 {
    top: 56%;
    bottom: auto;
    left: 104%;
    width: 50px;
    height: 50px;
}


.slide.selected .swiper-slide-active .SectionProdobjects i.circlePic3 i {
    animation: transitionXY1 3s infinite;
}

.slide.selected .swiper-slide-active .SectionProdobjects i.circlePic4 i {

    animation: transitionXY2 3s infinite;
}

.slide.selected .swiper-slide-active .SectionProdobjects i.circlePic5 i {
    animation: transitionXY1 4s infinite;
}

.slide.selected .swiper-slide-active .SectionProdobjects i.circlePic6 i {
    animation: transitionXY1 5s infinite;
}

.contentSecPods .rowCustom .col1 i.circleRight {
    position: absolute;
    right: 50%;
    bottom: 21%;
    width: 40px;
    height: 40px;
    display: block;
    z-index: 100;
    border-radius: 100%;
    transition: all 0.5s;
    transform: translateY(-10vw);
    opacity: 0;
}

.slide.selected .swiper-slide-active .rowCustom .col1 i.circleRight {
    transition-delay: 1s;
    transform: translateY(0vw);
    opacity: 1;
}

.contentSecPods .rowCustom .col1 i.circleRight:before {
    position: absolute;
    right: 50%;
    bottom: 21%;
    width: 40px;
    height: 40px;
    border: 2px solid var(--color1);
    display: block;
    z-index: 100;
    border-radius: 100%;
    content: '';
}

.slide.selected .contentSecPods .rowCustom .col1 i.circleRight:before {
    animation: transitionXY1 3s infinite;
}

span.tabtitle,
span.tablink {
    display: none !important;
}


.contentGallery {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    width: 100%;
    padding: 40px 0;
}

.detMoreGallery .slider2item {
    width: 100% !important;
}

.detMoreGallery {
    position: relative;
    width: calc(100% + 30px);
    margin: 0 0px 0 -15px !important;
    padding: 0;
    overflow: hidden;
}

.detMoreGallery .slider2item .swiper-wrapper {
    padding: 40px 0;
}

.detMoreGallery .NextPrevSlider.customBtnSlider1 {
    right: 150px;
}

.showLightBoxSlider i.bg {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
}

.detMoreGallery .boxGall {
    width: calc(100% - 100px);
    margin: auto;
}

.detMoreGallery .boxGall:before {
    padding-top: 80% !important;
}

.boxGall {
    position: relative;
    width: calc((100% / 4) - 20px);
    margin: 10px;
    background: no-repeat center / cover;
    transition: all 0.5s;
    /* overflow: hidden; */
    border-radius: 15px;
    margin-bottom: 50px;
}

.boxGall .titleBoxGall {
    position: absolute;
    top: 100%;
    width: 100%;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    height: 50px;
    color: var(--color2);
    font-weight: bold;
    font-size: 14px;
}

.boxGall:hover {
    transform: scale(1.05);
    z-index: 4;
}

.boxGall:before {
    position: relative;
    width: 100%;
    padding-top: 100%;
    display: block;
    content: '';
}

.boxGall .hoverGl {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.5s;
    background-color: rgba(0, 0, 0, 0.7);
    opacity: 0;
    transition-delay: 0.5s;
    overflow: hidden;
    border-radius: 15px;
}

.boxGall:hover .hoverGl {
    opacity: 1;
    transition-delay: 0s;
}


.boxGall .hoverGl label,
.boxGall .hoverGl a {
    position: absolute;
    width: 100%;
    margin: auto;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-color: #ffcc00;
    border-style: solid;
    border-width: 0;
    color: #fff;
    font-size: 16px;
    transition: all 0.5s cubic-bezier(0.66, 0.43, 0.12, 1.31);
    transform: scale(1);
    cursor: pointer;
    transform-origin: center;
    z-index: 8;
}

section.secGallery.catalog .boxGall .hoverGl span {
    position: relative;
    background: #c39768;
    padding: 10px;
    color: #fff;
    border-radius: 6px;
}

section.secGallery.catalog .boxGall .rowCatalog {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    display: flex;
    justify-content: center;
}

section.secGallery.catalog .boxGall .rowCatalog .dlcatalog {
    position: relative;
    padding: 0 20px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #212e79;
    border-radius: 10px 10px 0px 0px;
    color: #fff;
    transition: all 0.2s;
    transform: translateY(100px);
}

section.secGallery.catalog .boxGall:hover .rowCatalog .dlcatalog {
    transform: translateY(0px);
}

section.secGallery.catalog .boxGall:hover .rowCatalog .dlcatalog:hover {
    background-color: #c39768;
}
.dlCatalog:hover {
    background: #16a15d;
    color: #fff !important;
}
.boxGall .hoverGl label i:nth-child(1),
.boxGall .hoverGl a i:nth-child(1) {
    height: 60px;
    position: absolute;
    width: 200px;
    left: 100%;
    border: 2px solid #e67715;
    border-right: 0;
    border-left: 0;
    top: -22px;
}

.boxGall .hoverGl label i:nth-child(2),
.boxGall .hoverGl a i:nth-child(2) {
    height: 60px;
    position: absolute;
    width: 200px;
    right: 100%;
    border: 2px solid #e67715;
    border-right: 0;
    border-left: 0;
    top: -22px;
}

.boxGall .hoverGl label i:before,
.boxGall .hoverGl a i:before,
.boxGall .hoverGl label i:after,
.boxGall .hoverGl a i:after {
    position: absolute;
    width: 2px;
    height: 15px;
    content: '';
    background: #e67715;
    display: block;
}

.boxGall .hoverGl label i:nth-child(1):before,
.boxGall .hoverGl a i:nth-child(1):before {
    left: 0;
    top: 0;
}

.boxGall .hoverGl label i:nth-child(1):after,
.boxGall .hoverGl a i:nth-child(1):after {
    left: 0;
    bottom: 0;
}

.boxGall .hoverGl label i:nth-child(2):before,
.boxGall .hoverGl a i:nth-child(2):before {
    right: 0;
    top: 0;
}

.boxGall .hoverGl label i:nth-child(2):after,
.boxGall .hoverGl a i:nth-child(2):after {
    right: 0;
    bottom: 0;
}

.boxGall .hoverGl a span,
.boxGall .hoverGl label span {
    position: absolute;
    bottom: 10px;
    width: calc(100% - 20px);
    background: linear-gradient(45deg, #047940, #08cf6e, #047940);
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 50px;
    border-radius: 13px;
    transition: all 0.5s;
    transform: translateY(300px);
}

.boxGall:hover .hoverGl label span,
.boxGall:hover .hoverGl a span {
    transition-delay: 0.5s;
    transform: translateY(0px);
}

.RowFilterNewsList.fend {
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
}

.boxGall:hover .hoverGl label,
.boxGall:hover .hoverGl a {
    transition-delay: 0.5s;
    transform: scale(1);
}

.showLightBoxSlider {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.9);
    display: none;
    opacity: 0;
    z-index: -1;
    transition: all 1s;
    transform-style: preserve-3d;

}

.showLightBoxSlider.active {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    background: rgba(0, 0, 0, 0.9);
    opacity: 1;
    z-index: 10000000000000000;
}

i.prevBtn.fas.fa-chevron-left {
    position: absolute;
    bottom: 0;
    width: 30px;
    height: 40px;
    left: -50px;
    background: transparent;
    margin: auto;
    font-size: 28px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    transition: all 1s;
    cursor: pointer;
    color: #e67715;
    right: 0;
    z-index: 1000000;
}

i.nextBtn.fas.fa-chevron-right {
    position: absolute;
    bottom: 0;
    width: 30px;
    right: -50px;
    left: 0;
    height: 40px;
    background: transparent;
    margin: auto;
    font-size: 28px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    transition: all 1s;
    cursor: pointer;
    color: #e67715;
    z-index: 1000000;
}

.showLightBoxSlider i.close {
    font-size: 35px;
    color: #e6e6e6;
    left: 30px;
    top: 30px;
    position: absolute;
    cursor: pointer;
    color: #ffc94a;
    border-radius: 50px;
    overflow: hidden;
    font-size: 41px;
    width: 35px;
    height: 35px;
    line-height: 38px;
    text-align: center;
    display: flex;
    flex-direction: row;
    justify-content: center;
}

i.fas.fa-window-close:hover {
    color: #e67715;
}

.showLightBoxSlider .slideBox {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: auto;
    height: 60%;
    margin: auto;
    max-height: 80%;
    max-width: 80%;
    transform: translateZ(70px);
    opacity: 0;
    -webkit-animation: bounceOutUp 1s 1;
    animation: bounceOutUp 1s 1;
}

.slideBox.activeCenter {
    opacity: 1;
    -webkit-animation: bounceInUp 1s 1;
    animation: bounceInUp 1s 1;
    pointer-events: auto;
}

.slideBox.activeRight {
    opacity: 0;
    -webkit-animation: bounceOutRight 1s 1;
    animation: bounceOutRight 1s 1;
    pointer-events: none;
}

.slideBox.activeLeft {
    opacity: 0;
    -webkit-animation: bounceOutLeft 1s 1;
    animation: bounceOutLeft 1s 1;
    pointer-events: none;
}

.menuTopResponsive {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 160px;
    margin: 0 auto;
}

.menuTopResponsive a.itemMenu:hover {
    filter: grayscale(0) brightness(1);
    padding-right: 70px;
}

.menuTopResponsive a.itemMenu {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    color: #fff;
    padding-right: 40px;
    padding-left: 10px;
    background: transparent no-repeat 88% 45% / 25px;
    filter: grayscale(2) brightness(3);
    height: 30px;
    text-align: right;
    padding-right: 70px;
}

.ShowResultGall {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.boxGall[data-type="pic"]:after {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 50px;
    height: 50px;
    content: '';
    background: var(--color2) url(../img/pic-icon.png) no-repeat center / 40px;
    border-radius: 8px;
}

.boxGall[data-type="video"]:after {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 50px;
    height: 50px;
    content: '';
    background: var(--color2) url(../img/pic-icon-1.png) no-repeat center / 40px;
    border-radius: 8px;
}

.boxGall .hoverGl label:before,
.boxGall .hoverGl a:before {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 80px;
    height: 80px;
    content: "\f002";
    font-family: "Font Awesome 5 Pro";
    font-weight: 300;
    font-size: 24px;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 0.2s;
    transform: scale(0);
}

.boxGall .hoverGl label:after,
.boxGall .hoverGl a:after {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 80px;
    height: 80px;
    content: '';
    border: 2px solid #eee;
    border-radius: 10px;
    transition: all 0.2s;
    transform: scale(0);

}


.boxGall:hover .hoverGl label:before,
.boxGall:hover .hoverGl a:before,
.boxGall:hover .hoverGl label:after,
.boxGall:hover .hoverGl a:after {
    transition-delay: 0.5s;
    transform: scale(1);
}

.showLightBoxSlider .videobx {
    position: absolute;
    left: 0;
    right: 0;
    width: calc(100% - 40px);
    max-width: 800px;
    margin: auto;
    top: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.showLightBoxSlider .videobx i {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5) url(../img/play.png) no-repeat center / 80px;
    content: '';
    cursor: pointer;

}

.showLightBoxSlider .videobx:hover i {
    background-size: 90px;
}

.showLightBoxSlider .videobx:active i {
    background-size: 70px;
}

.showLightBoxSlider .videobx .videoBox iframe {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border: none !important;
    z-index: 100000;
    display: flex;
}

.showLightBoxSlider .videobx .videoBox {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    margin: 0;
    height: 100%;
}

.unitsList .boxGall {
    width: calc((100% / 2) - 20px);
}

.catalogList .boxGall {
    width: calc((100% / 3) - 20px);
}

/*SliderGallery End*/
.showLightBoxSlider i.fa-window-close,
.showLightBoxSlider i.fa-times {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
    padding: 20px;
    color: #ffd278;
    font-size: 28px;
}



.boxSelectRelation {
    position: relative;
    width: 280px;
    margin: auto;
    display: flex;
    flex-direction: column;
}

.boxSelectRelation select {
    height: 50px;
    width: 100%;
    margin: 0 0 10px 0;
    padding: 0 10px;
    background-color: #ffffff !important;
    font-weight: 400;
    font-size: 16px;
    border: 1px solid #b1b1b1;
    box-shadow: 0px 10px 17px -13px #00000069;
    background: transparent !important;
    color: #333 !important;
    margin-bottom: 20px;
}
.titleCity {
    position: relative;
    width: 100%;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--color2);
    text-shadow: 0px 0px 10px;
    font-weight: 400;
    font-size: 18px;
    margin-bottom: 10px;
}

.RowFilterNewsList.betwen {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.filterSelect {
    position: relative;
    height: 50px;
    display: flex;
    align-items: center;
}


.hideIcon .boxGall:after,
.hideIcon .boxGall .hoverGl a:before,
.hideIcon .boxGall .hoverGl label:before,
.hideIcon .boxGall .hoverGl a:after,
.hideIcon .boxGall .hoverGl label:after {

    display: none;
}

.SecDetail {
    position: relative;
    width: 100%;
    padding: 60px 0 140px;
}

.SecDetail i.bgArc {
    position: absolute;
    left: 0;
    top: 0;
    overflow: hidden;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

.SecDetail i.bgArc:before {
    position: absolute;
    left: -50%;
    top: -60%;
    width: 200%;
    height: 160%;
    content: '';
    background-color: var(--bg);
    border-radius: 100%;
}

svg.svg {
    position: absolute;
    opacity: 0;
    pointer-events: none;
    width: 0;
    height: 0;
}

.detailTopRow {
    position: relative;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}

.detailTopRow .col1 {
    position: relative;
    width: calc(100% / 3);
    padding: 0 10px;
}

.detailTopRow .col2 {
    position: relative;
    width: calc((100% / 3) + (100% / 3));
    padding: 0 30px 0 10px;
}

.picProductContent {
    position: relative;
    width: 100%;
}

.picProductContent:before {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, #fff, #fff, #fff, transparent);
    content: '';
}

    .picProductContent .brdr {
        position: absolute;
        left: 0;
        bottom: 0;
        width: 100%;
        height: 80%;
        background: var(--bg);
        border-radius: 300px 300px 0 0;
        border-style: solid;
        border-color: #d5ab3c;
        border-width: 1px 1px 0 1px;
    }

.picProductContent .brdr:after {
    position: absolute;
    right: -1px;
    bottom: 0;
    width: 3px;
    height: 72%;
    background: linear-gradient(0deg, var(--bg), var(--bg), var(--bg), transparent);
    content: '';
    z-index: 10;
    display: block;
}

.picProductContent .labels {
    position: absolute;
    top: 40px;
    right: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}

.picProductContent .labels span.lbl {
    position: relative;
    padding: 0 20px;
    height: 40px;
    font-size: 14px;
    color: #fff;
    background: var(--color1);
    display: flex;
    align-items: center;
    border-radius: 10px 0px 0px 10px;
}

.picProductContent .pic {
    position: relative;
    width: 100%;
}

.picProductContent .pic img {
    width: 100%;
}

.picProductContent .itemProp {
    position: absolute;
    z-index: 5;
    top: 0;
    bottom: 0;
    margin: auto;
}

.rowCustom.center {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: center;
}

.digikalaBuy {
    position: relative;
    padding: 0 20px 0 80px;
    height: 50px;
    background: #fff;
    display: flex;
    align-items: center;
    color: #343434;
    font-weight: 900;
    border: 1px solid #ec0143;
    border-radius: 10px;
    cursor: pointer;
    z-index: 10;
    transition: all 0.2s;
}

.digikalaBuy:hover {
    filter: hue-rotate(30deg);
}

.digikalaBuy i.icon {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 60px;
    background: #f00043 no-repeat center / 40px;
    border-radius: 7px 0px 0px 7px;
    pointer-events: none;
}

.picProductContent .itemProp i.icon {
    position: relative;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.8);
    border-radius: 100%;
    color: var(--color2);
    font-weight: bold;
    cursor: pointer;
    box-shadow: 0px 0px 20px -13px rgba(0, 0, 0, 0.5);
}

.picProductContent .itemProp.active i.icon {
    background: rgb(213 171 60 / 80%);
    color: #fff;
}

.picProductContent .itemProp i.icon:before {
    transition: all 0.5s;
    content: "\f067";
}

.picProductContent .itemProp.active i.icon:before {
    transform: rotate(360deg);
    content: "\f068";
}

.picProductContent .itemProp .contentProp {
    position: absolute;
    top: 50px;
    background: rgba(255, 255, 255, 0.9);
    right: -66px;
    width: 180px;
    height: 110px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px;
    text-align: center;
    -webkit-clip-path: url(#bgContentProp);
    clip-path: url(#bgContentProp);
    transition: all 0.5s;
    transform-origin: top;
    transform: perspective(1000px) rotateX(-90deg);
    opacity: 0;
}

.picProductContent .itemProp.active .contentProp {
    transform: perspective(1000px) rotateX(0deg);
    opacity: 1;
}

.itemProp.prop1 {
    right: 24%;
    top: 43%;
}

.itemProp.prop2 {
    left: 28%;
    top: 33%;
}

.itemProp.prop3 {
    left: 36%;
    bottom: 26%;
    top: auto !important;
}

.detailTopRow .titleOne {
    position: relative;
    width: 100%;
    height: 80px;
    display: flex;
    align-items: center;
    padding: 0 30px;
    background-color: #fff;
    color: var(--color2);
    font-family: iranSharp;
    border-radius: 8px;
    overflow: hidden;
}

.detailTopRow .titleOne:before {
    position: absolute;
    width: 25px;
    height: 25px;
    border-radius: 100%;
    background: var(--color1);
    content: '';
    right: -12px;
}

.detailTopRow .subtitle {
    position: relative;
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    padding: 0 20px;
    background-color: #d5ab3c;
    color: #fff;
    font-family: iranSharp;
    border-radius: 8px;
    margin: 5px 0;
    font-size: 20px;
}
.RowDetProp {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin: 10px 0;
    border-bottom: 1px solid #cbcbcb;
}
.RowDetProp .itemDetProp {
    position: relative;
    height: 40px;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 20px;
    margin: 10px 0;
}

.RowDetProp .itemDetProp :is(span, a) {
    color: #333;
}

.RowDetProp .itemDetProp a:hover {
    color: var(--color2);
}

.dlCatalog {
    position: relative;
    height: 50px;
    display: flex;
    align-items: center;
    font-size: 18px;
    color: #333;
    background: #f5f5f5;
    padding: 0 60px 0px 20px;
    border-radius: 6px;
    box-shadow: 0px 0px 20px -10px rgba(0, 0, 0, 0.5);
    transition: all 0.2s;
}

.dlCatalog i.icon {
    position: absolute;
    top: 0;
    right: 0;
    width: 50px;
    height: 100%;
    background: #0e834a no-repeat center / 40px;
    border-radius: 0px 5px 5px 0px;
}

.detailTopRow .description {
    position: relative;
    width: 100%;
    line-height: 2;
    color: #3a3a3a !important;
    text-align: justify;
    font-size: 16px;
}

.detailTopRow .massBox {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 5px 0;
    border-top: 1px solid #cbcbcb;
    border-bottom: 1px solid #cbcbcb;
    margin-top: 10px;
}

.detailTopRow .massBox .name {
    position: relative;
    font-size: 22px;
    padding: 0px 45px 0px 10px;
    background: 100% center / 35px no-repeat;
    height: 50px;
    display: flex;
    align-items: center;
}

.massItems {
    position: relative;
    display: flex;
    gap: 15px;
}

.detailTopRow .massBox .itemMass {
    position: relative;
    cursor: pointer;
    display: flex;
    align-items: flex-end;
    flex-direction: row-reverse;
}
.detailTopRow .massBox .itemMass .tooltips {
    position: absolute;
    font-style: normal;
    font-size: 12px;
    text-wrap: nowrap;
    top: 106%;
    left: -40px;
    height: 24px;
    background: var(--color2);
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 5px;
    font-weight: 100;
    width: 100px;
    color: #fff;
    transform-origin: top center;
    transform: scale(0) translateY(-60px);
    transition: all 0.2s;
    opacity: 0;
}
.detailTopRow .massBox .itemMass:hover .tooltips {
    opacity: 1;
    transform: scale(1) translateY(0px);
    transition: all 0.2s;
}
.detailTopRow .massBox .itemMass:nth-child(1) i.icon {
    width: 12px;
}

.detailTopRow .massBox .itemMass:nth-child(2) i.icon {
    width: 15px;
}

.detailTopRow .massBox .itemMass:nth-child(3) i.icon {
    width: 19px;
}

.detailTopRow .massBox .itemMass:nth-child(4) i.icon {
    width: 22px;
}

.detailTopRow .massBox .itemMass:nth-child(5) i.icon {
    width: 25px;
}

.detailTopRow .massBox .itemMass:nth-child(6) i.icon {
    width: 27px;
}

.detailTopRow .massBox .itemMass:nth-child(7) i.icon {
    width: 30px;
}

.detailTopRow .massBox .itemMass:nth-child(8) i.icon {
    width: 33px;
}

.detailTopRow .massBox .itemMass i.icon {
    position: relative;
    display: flex;
    background: no-repeat center / 100%;
    filter: grayscale(1) brightness(2);
    z-index: 10;
}

.detailTopRow .massBox .itemMass.active i.icon {
    filter: grayscale(0) brightness(1);
}

.detailTopRow .massBox .itemMass i.icon:before {
    position: relative;
    width: 100%;
    display: block;
    content: '';
    padding-top: 274%;
}

.detailTopRow .massBox .itemMass .lbl {
    position: relative;
    height: 25px;
    border: 1px solid #005952;
    margin-bottom: 4px;
    margin-left: -6px;
    padding: 0;
    font-size: 0;
    border-width: 1px 0;
    display: flex;
    align-items: center;
    transition: all 0.2s;
}

.detailTopRow .massBox .itemMass.active .lbl {

    font-size: 16px;
    padding: 0 8px 0 15px;
}

i.mouseCursor {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 30px;
    width: 35px;
    height: 69px;
    background: transparent;
    margin: auto;
    pointer-events: none;
}

i.mouseCursor i {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: no-repeat center / 100%;
}

i.mouseCursor i:nth-child(2) {
    animation: 1s mousedown infinite;
}

@keyframes mousedown {
    0% {
        transform: translateY(-10px);
        opacity: 0;
    }

    100% {
        transform: translateY(5px);
        opacity: 1;
    }
}

.rowCustomTabs {
    position: relative;
    width: 100%;
    display: grid;
    grid-template-columns: auto 1fr;
    /* align-items: center; */
}

    .rowCustomTabs .col1 {
        position: relative;
        width: 460px;
        display: flex;
        min-height: 500px;
        right: -8%;
    }

.rowCustomTabs .col2 {
    position: relative;
    width: 100%;
    display: flex;
    padding: 20px 40px 20px 300px;
    overflow: hidden;
}

    .rowCustomTabs .col2:before {
        position: absolute;
        left: -380px;
        top: 0;
        bottom: 0;
        margin: auto;
        width: 500px;
        height: 500px;
        content: '';
        border-radius: 100%;
        border: 1px solid var(--color1);
    }

.contentTabs .contentTab {
    position: relative;
    width: 100%;
    transition: all 0.5s;
    overflow: hidden;
    text-align: justify;
    line-height: 2;
    max-height: 0px;
    color: #144555;
}

.contentTabs .contentTab.active {
    max-height: 1000px;
}

.rowCustomTabs .col1 .contentSlider {
    position: relative;
    width: 100%;
    overflow: hidden;
    display: flex;
    height: 100% !important;
    padding: 80px 0;
    max-height: 485px;
}

.rowCustomTabs .col1 .contentSlider .sliderOneGallery {
    box-sizing: border-box;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    right: -40%;
    width: 100%;
}

.itemDetailGall {
    width: 100%;
    position: relative;
    background: radial-gradient(#fff, var(--bgColor));
    border-radius: 100%;
    opacity: 0;
    transition: all 0.5s;
}

.swiper-slide-active .itemDetailGall {
    opacity: 1;
    transition-delay: 0.5s;
}

.rowCustomTabs .col1:after {
    position: absolute;
    right: -205px;
    top: -20px;
    width: 500px;
    height: 500px;
    background: transparent;
    content: '';
    border-radius: 100%;
    border: 1px solid var(--color2);
}


.itemDetailGall:before {
    position: relative;
    width: 100%;
    padding-top: 100%;
    content: '';
    display: block;
}

.itemDetailGall img.picgallery {
    position: absolute;
    left: 10%;
    bottom: 0;
    height: 95%;
    transition: all 0.5s;
    transform: skewX(-90deg);
    transform-origin: left bottom;
}

.swiper-slide-active .itemDetailGall img.picgallery {
    transition-delay: 0.5s;
    transform: skewX(0deg);
}

.rowCustomTabs .col1 .contentSlider .sliderOneGallery .swiper-button-prev {
    left: 30px;
    top: 50px;
    right: auto !important;
    font-size: 18px !important;
    bottom: 0;
    margin: auto;
}

.rowCustomTabs .col1 .contentSlider .sliderOneGallery .swiper-button-next {
    left: 30px;
    top: -30px;
    right: auto !important;
    font-size: 18px !important;
    bottom: 0;
    margin: auto;
}

.rowCustomTabs .col1 .tabBtns {
    position: absolute;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 10px;
    align-items: flex-start;
    top: 0;
    height: 100%;
    right: 64%;
    width: 200px;
    max-height: 485px;
}

.rowCustomTabs .col1 .tabBtns button.btnTab span {
    position: relative;
    display: grid;
    width: 100%;
    grid-template-columns: 1fr auto;
    gap: 5px;
    align-items: center;
}

.rowCustomTabs .col1 .tabBtns button.btnTab span:after {
    position: relative;
    width: 40px;
    height: 1px;
    background: var(--color1);
    content: '';
    opacity: 0;
    transition: all 0.2s;
}

.rowCustomTabs .col1 .tabBtns button.btnTab.active span:after {
    opacity: 1;
}

.rowCustomTabs .col1 .tabBtns button.btnTab {
    position: relative;
    width: 170px;
    height: 50px;
    background: transparent !important;
    font-family: 'IranYekan';
    padding: 0 !important;
    border: none !important;
    display: flex;
    padding: 0 10px 0 10px !important;
    align-items: center;
    font-size: 16px;
    color: var(--color4);
    font-weight: 400;
    transition: all 0.2s;
    cursor: pointer;
}

.rowCustomTabs .col1 .tabBtns button.btnTab:before {
    position: absolute;
    right: -8px;
    width: 8px;
    height: 8px;
    background: var(--color2);
    content: '';
    border-radius: 100%;
    transition: all 0.2s;
}

.rowCustomTabs .col1 .tabBtns button.btnTab.active:before {
    transform: scale(2.2);
}

.rowCustomTabs .col1 .tabBtns button.btnTab i {
    position: absolute;
    left: 0;
    width: 85%;
    height: 100%;
    border: 1px solid var(--color2);
    border-right: 0;
    border-radius: 10px 0px 0px 10px;
    transition: all 0.2s;
    opacity: 0;
}

.rowCustomTabs .col1 .tabBtns button.btnTab.active i {
    opacity: 1;
}

.rowCustomTabs .col1 .tabBtns button.btnTab i:before {
    position: absolute;
    left: 100%;
    top: -1px;
    height: 1px;
    content: '';
    background: var(--color2);
    width: 35px;
    transition: all 0.2s;
}

.rowCustomTabs .col1 .tabBtns button.btnTab:nth-child(2) {
    right: 9px;
}

.rowCustomTabs .col1 .tabBtns button.btnTab:nth-child(3) {
    right: -6px;
}

.rowCustomTabs .col1 .tabBtns button.btnTab:nth-child(3) i:before {
    width: 24px;
}

.rowCustom {
    position: relative;
    width: 100%;
    display: flex;
}

.rowCustom.column2 .col {
    position: relative;
    width: 50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.rowCustom.column2 .col img {
    width: 100%;
    /* height: 100%; */
    /* object-fit: cover; */
}

.SecMore.family .rowCustom {
    margin: 40px 0;
}






/* -------------- FAQ --------------- */

.FAQTitle {
    position: relative;
    height: 50px;
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    color: #414141;
    margin: 10px 0px;
}

.tabBtns {
    position: relative;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    padding: 10px;
    border-radius: 10px;
    background: #ffffff;
    box-shadow: 0px 0px 20px -15px rgba(0,0,0,0.5);
    margin: 10px 0;
}

.tabBtns button.btntab {
    position: relative;
    width: 70px;
    height: 70px;
    border: none;
    outline: none;
    font-size: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    margin: 0px 0px;
    background: none;
}

.tabBtns button.btntab.active {
    font-size: 8px;
}

.tabBtns button.btntab:before {
    position: absolute;
    bottom: -13px;
    height: 3px;
    background: var(--color2);
    content: '';
    width: 3%;
    transition: all 0.5s;
    opacity: 0;
}

.tabBtns button.btntab:after {
    position: absolute;
    bottom: -7px;
    height: 8px;
    background: no-repeat center;
    content: '';
    width: 17px;
    transition: all 0.5s;
    opacity: 0;
    background: #d2ffe9;
    width: 100%;
    height: 100%;
    border-radius: 50px 50px 0 0;
    z-index: 0;
}

.tabBtns button.btntab.active:before {
    opacity: 1;
    width: 100%;
    background: var(--color2);
}

.tabBtns button.btntab.active:after {
    opacity: 1;
}

.tabBtns button.btntab i {
    position: relative;
    width: 60px;
    height: 60px;
    background: no-repeat center / 100%;
    filter: grayscale(0) brightness(1);
    cursor: pointer;
    z-index: 1;
    top: 0;
    transition: all 0.5s;
}

.tabBtns button.btntab:hover i {
    filter: grayscale(1) brightness(0);
}

.tabBtns button.btntab label {
    color: #ffffff;
    position: absolute;
    border: 0;
    bottom: 50%;
    transition: all 0.5s;
    background: #0a4dc1;
    padding: 0 10px;
    width: 150px;
    border-radius: 6px;
    opacity: 0;
    z-index: 100;
    cursor: pointer;
    font-family: 'IranYekan';
    font-size: 14px;
}

.tabBtns button.btntab:hover label {
    bottom: 100%;
    opacity: 1;
}

.tabBtns button.btntab.active label {
    bottom: -56px;
    opacity: 1;
    background-color: transparent;
    padding: 0;
    color: #171c23;
    width: 110px;
    height: 40px;
}
.secCertificates {
    min-height: 460px;
}
section.secFAQ .contentSmall,
section.SecFAQtext .contentSmall {
    display: flex;
    flex-direction: column;
    align-items: center;
}

button.btntab.active i {
    filter: grayscale(1) brightness(0);
    top: 10px;
}
.contentCard.flexDir {
    position: relative;
    padding: 30px 0;
}
.tabContent {
    position: relative;
    width: 100%;
    transition: all 0.2s;
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0 20px;
    background: #fdfdfd;
    border-radius: 15px;
}

    .tabContent.active {
        transition: all 0.5s;
        opacity: 1;
        min-height: 30px;
        max-height: 200000px;
        padding: 20px;
        overflow: inherit;
    }
.accotdionFAQ {
    font-size: 12px;
    position: relative;
    width: calc(100% - 40px);
    margin: 0 auto;
    /* max-width: 860px; */
    transition: all 0.2s;
}

.accotdionFAQ.active {
    margin-bottom: 30px;
}

.accotdionFAQ:before {
    position: absolute;
    top: 0;
    right: 1px;
    width: 2px;
    height: 0px;
    content: '';
    transition: all 0.2s;
}

.accotdionFAQ.active:before {
    height: 100%;
    max-height: 171px;
}

.accotdionFAQ label.name {
    font-family: 'IRANSharp';
    font-size: 16px;
    color: #868686;
    font-weight: normal;
}

.RowFAQ.cm .col2 {
    flex-direction: column;
    font-family: 'IRANSharp';
    font-weight: normal;
    color: #757575;
    padding: 0 10px 10px;
}

.RowFAQ.cm .col2 .rowTitle {
    position: relative;
    width: 100%;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.RowFAQ {
    position: relative;
    width: 100%;
    display: flex;
    margin-bottom: 3px;
    font-size: 14px;
}
.contentCard .accotdionFAQ .RowFAQ {
    position: relative;
    width: 100%;
    display: flex;
    margin-bottom: 8px;
    font-size: 14px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0px 0px 20px -14px rgba(0,0,0,0.5);
}
.contentCard .accotdionFAQ.active .RowFAQ {
    position: relative;
    width: 100%;
    display: flex;
    margin-bottom: 3px;
    font-size: 14px;
    background-color: var(--color2);
    color: #fff;
    border-radius: 10px;
    box-shadow: 0px 0px 20px -14px rgba(0,0,0,0.5);
}
.contentCard .accotdionFAQ .RowFAQ .col2 {
    border: None !important;
    color: #333;
    transition: all 0.2s;
}
.contentCard .accotdionFAQ.active .RowFAQ .col2 {
    border: None !important;
    color: #fff;
}
.ContentFAQ .lineTitle {
    margin-right: 0;
}


.RowFAQ .col2 {
    position: relative;
    width: 100%;
    MIN-height: 50px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-right: 3px;
    color: #333;
    padding: 0 10px 0 40PX;
    border: 2px solid #eeeeee;
    font-size: 14px;
    font-weight: 300;
    border-width: 0 0 1px;
}


.accotdionFAQ.active .RowFAQ .col2,
.accotdionFAQ.active .RowFAQ .col1 {
    border-color: var(--color2);
}

.RowFAQ.title .col1,
.RowFAQ.title .col2 {
    background-color: #161616;
    color: #fff;
    justify-content: center;
}

.accotdionFAQ span.AnswerQuestion {
    position: absolute;
    background: #161616;
    font-weight: normal;
    font-family: IranYekan;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 0px 0 30px;
    left: 5px;
    cursor: pointer;
    font-size: 12px;
    font-weight: bold;
}
.accotdionFAQ span.AnswerQuestion {
    background: transparent;
    color: #396370;
    font-size: 12px;
    border-radius: 5px;
}
.accotdionFAQ span.AnswerQuestion:after {
    /* content: 'مشاهده پاسخ'; */
}

.accotdionFAQ.active span.AnswerQuestion:before {
    content: "\f068";
}

.accotdionFAQ.active span.AnswerQuestion:after {
    /* content: 'بستن پاسخ'; */
}

.accotdionFAQ span.AnswerQuestion {
    background: transparent;
    color: rgba(0, 0, 0, 0.5);
    font-size: 12px;
    border-radius: 5px;
}

.accotdionFAQ span.AnswerQuestion:hover {
    background: #eee;
}

.accotdionFAQ span.AnswerQuestion:active {
    color: var(--color1);
}

.accotdionFAQ.active span.AnswerQuestion {
    background: #f4f4f4;
    color: var(--color2);
}

.accotdionFAQ.active span.AnswerQuestion:hover {
    background: #dddddd;
}

.accotdionFAQ.active span.AnswerQuestion:active {
    background: #acb8ce;
    color: #f4f4f4;
}

.accotdionFAQ span.AnswerQuestion:before {
    font-family: 'Font Awesome 5 Pro';
    font-weight: 900;
    position: absolute;
    left: 0;
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 0.5s;
}

.accotdionFAQ.active span.AnswerQuestion:before {
    transform: rotate(180deg);
}

.accotdionFAQ .ContentAccotdionFAQ {
    position: relative;
    width: 100%;
    display: flex;
    transition: all 0.2s;
    max-height: 0;
    overflow: hidden;
    flex-wrap: wrap;
}

.accotdionFAQ.active .ContentAccotdionFAQ {
    transition: all 0.5s;
    max-height: 100%;
}

.ContentAccotdionFAQ .textAccordionFAQ {
    position: relative;
    width: 100%;
    text-align: right;
    padding: 0px 30px;
    box-sizing: border-box;
    /* font-weight: bold; */
    font-family: 'IranYekan';
    font-size: 12px;
    display: flex;
    flex-direction: column;
    line-height: 1.6;
}
.accotdionFAQ.active .textAccordionFAQ {
    color: #333;
    padding: 10px 30px;
}

.allContentTab {
    position: relative;
    width: 100%;
    padding: 20px 0;
}

.ContentAccotdionFAQ .moreAccordionFAQ {
    position: relative;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0 5px;
    box-sizing: border-box;
}

a.moreAcc {
    position: relative;
    padding: 0 10px;
    height: 30px;
    background: #f5f5f5;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding-left: 30px;
    font-family: IranYekan;
    font-weight: normal;
    transition: all 0.2s;
    font-weight: bold;
    font-size: 12px;
}

a.moreAcc:before {
    position: absolute;
    left: 0;
    top: 0;
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: 'Font Awesome 5 Pro';
}

a.moreAcc:hover {
    color: #f5f5f5;
    background: #161616;
}

a.moreAcc:active {
    color: #161616;
    background: #d3d3d3;
}

.ContentAccotdionFAQ .textAccordionFAQ .textAnswer {
    position: relative;
    width: calc(100% - 100px);
    padding: 20px;
    margin-right: 100px;
    border-bottom: 2px solid #dedede;
    font-size: 14px;
    line-height: initial;
}

.ContentAccotdionFAQ .textAccordionFAQ .textAnswer:before {
    position: absolute;
    top: 0;
    right: -15px;
    bottom: 0;
    margin: auto;
    width: 30px;
    height: 30px;
    background: var(--color2);
    color: #fff;
    border-radius: 100%;
    z-index: 10;
    display: flex;
    justify-content: center;
    align-items: center;
}

.ContentAccotdionFAQ .textAccordionFAQ .textAnswer:after {
    position: absolute;
    right: 0;
    top: 50%;
    background: #dedede;
    width: 2px;
    content: '';
    height: 50%;
    display: block;
}

.ContentAccotdionFAQ .textAccordionFAQ td {
    min-height: 40px;
    height: 40px;
    vertical-align: middle;
    border-bottom: 1px solid #eee !important;
    font-size: 16px;
}

.ContentAccotdionFAQ .textAccordionFAQ tr td .val {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: flex-end;
    color: #2d7d97;
}

/* -------------- FAQ --------------- */


.contentSliderProduct .itemSlideProduct {
    width: calc(100% - 40px);
    margin: auto;
    background: radial-gradient(#fff, var(--bg1));
}

.contentSliderProduct .itemSlideProduct .pic {
    background-color: transparent !important;
}

.contentSliderProduct .swiper-wrapper {
    padding: 30px 0 60px;
}

.contentSliderProduct .nextPrevSlider {
    position: absolute;
    bottom: 0;
    display: flex;
    justify-content: flex-start;
    gap: 10px;
    flex-direction: row-reverse;
}

.contentSliderProduct .nextPrevSlider .swiper-button-next {
    position: relative;
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid var(--color2);
    border-radius: 6px;
    margin: 0 !important;
    left: auto !important;
    right: auto !important;
}

.contentSliderProduct .nextPrevSlider .swiper-button-prev {
    position: relative;
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid var(--color2);
    border-radius: 6px;
    margin: 0 !important;
    left: auto !important;
    right: auto !important;
}

.contentSliderProduct .nextPrevSlider .swiper-button-prev:after,
.contentSliderProduct .nextPrevSlider .swiper-button-next:after {
    font-size: 20px !important;
    font-weight: 800;
    color: var(--color1);
}

.contentBlogList {
    position: relative;
    padding: 40px 0;
    -webkit-column-count: 3;
    -moz-column-count: 3;
    column-count: 3;
    -webkit-column-gap: 1.25rem;
    -moz-column-gap: 1.25rem;
    column-gap: 1.25rem;
    orphans: 1;
    widows: 1;
    column-gap: 1.25rem;
}

.itemNews {
    position: relative;
    display: flex;
    flex-direction: column;
    width: calc((100% / 3) - 10px);
    display: inline-block;
    width: 100%;
    border: 1px solid #eee;
    margin-bottom: 20px;
    border-radius: 10px;
}

    .itemNews .pic {
        position: relative;
        width: 100%;
        display: flex;
        overflow: hidden;
        border-radius: 10px;
        z-index: 10;
    }

.itemNews .pic:before {
    position: relative;
    display: block;
    padding-top: 60%;
    content: '';
    background: red;
    width: 100%;
}

.itemNews .pic img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.itemNews .linkMoreSec {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: flex-end;
}

    .itemNews .contentItemNews {
        position: relative;
        padding: 30px 20px 20px;
        background: #fff;
        transition: all 0.2s;
        margin-top: -10px;
    }

    .itemNews strong.title {
        position: relative;
        display: flex;
        align-items: center;
        width: 100%;
        background: #f5f5f5;
        padding: 10px 10px;
        font-family: 'IRANSharp';
        color: var(--color2);
        border-right: 4px solid var(--color1);
        font-size: 16px;
        line-height: 2;
        transition: all 0.2s;
    }
    .itemNews .textContent {
        position: relative;
        padding: 10px 0 0;
        font-size: 14px;
        line-height: 2;
        text-align: justify;
        color: #144555;
    }
    .itemNews:hover .textContent {
        color: #fff;
    }

.itemNews a.moreLinkSec {
    font-size: 14px;
}

.itemNews .pic .light {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.itemNews .pic .light:before {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    content: '';
    background: linear-gradient(339deg, rgb(4 121 64 / 60%), transparent, transparent);
}

.itemNews .pic .light:after {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    content: '';
    background: linear-gradient(164deg, rgb(213 154 45 /100%), rgb(213 154 45 /20%), transparent, transparent);
}

.itemSlideNews span.date,
.itemNews span.date {
    position: absolute;
    z-index: 10;
    background: var(--color2);
    left: 30px;
    padding: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    color: #ffeec0;
    border-radius: 0px 0px 6px 6px;
    line-height: 1;
    width: 80px;
}

.itemSlideNews span.date strong,
.itemNews span.date strong {
    font-size: 46px;
}

.itemSlideNews span.date small,
.itemNews span.date small {
    font-size: 18px;
    font-weight: 300;
    color: #fff;
}

.itemNews .pic .line {
    position: absolute;
    bottom: 10px;
    width: 80%;
    height: 30px;
    display: grid;
    align-items: center;
    gap: 10px;
    grid-template-columns: 1fr auto 1fr;
    left: 0;
    right: 0;
    margin: auto;
    z-index: 10;
}

.itemNews .pic .line i {
    position: relative;
    width: 41px;
    height: 29px;
    background: no-repeat center / 100%;
    margin-bottom: 15px;
}

.itemNews .pic .line:before,
.itemNews .pic .line:after {
    position: relative;
    width: 100%;
    height: 1px;
    content: '';
    background: #fff;
}


.itemSlideNews {
    position: relative;
    width: 100%;
    display: block;
}

.itemSlideNews .pic {
    position: relative;
    width: 100%;
    display: flex;
    overflow: hidden;
    border-radius: 10px;
}

.itemSlideNews .pic img {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    object-fit: cover;
}

    .itemSlideNews .pic:before {
        position: relative;
        width: 100%;
        content: '';
        padding-top: 35%;
        display: block;
    }
.SliderTopNews .Arrows .swiper-button-next, .SliderTopNews .Arrows .swiper-button-prev {
    color: #0a7c48 !important;
    z-index: 10;
}
.SliderTopNews {
    position: relative;
    width: 100%;
    margin: 10px 0 0;
    overflow: hidden;
}

.itemSlideNews .pic .line {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: calc(100% - 40px);
    height: calc(100% - 40px);
    border: 2px solid #fff;
    transition: all 0.5s;
    transform: translateY(-100px);
    opacity: 0;
    z-index: 1;
    pointer-events: none;
}

.swiper-slide-active .itemSlideNews .pic .line {
    transition-delay: 0.5s;
    transform: translateY(0px);
    opacity: 1;
}

.itemSlideNews span.date {
    transition: all 0.5s;
    transform: translateY(-50vw);
    pointer-events: none;
}

.swiper-slide-active .itemSlideNews span.date {
    transition-delay: 0.7s;
    transform: translateY(0vw);
}

.itemSlideNews .contentItemNews {
    position: absolute;
    bottom: 22px;
    width: calc(100% - 44px);
    left: 0;
    right: 0;
    margin: auto;
    background: rgba(255, 255, 255, 0.8);
    transition: all 1s;
    opacity: 0;
}

.swiper-slide-active .itemSlideNews .contentItemNews {
    transition-delay: 1s;
    opacity: 1;
}

.itemSlideNews .contentItemNews .title {
    position: relative;
    width: 100%;
    height: 40px;
    display: block;
    line-height: 2.8;
    padding: 0 15px;
    border-right: 4px solid var(--color1);
    background: rgba(0, 0, 0, 0.08);
    text-wrap: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--color2);
    font-family: 'IRANSharp';
    font-size: 14px;
}

.itemSlideNews .contentItemNews .title span {
    position: relative;
    width: 100%;
    height: 100%;
    display: block;
    text-wrap: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.itemSlideNews .textContent {
    position: relative;
    padding: 10px 15px;
    font-size: 14px;
    line-height: 1.5;
    overflow: hidden;
    max-height: 110px;
    min-height: 110px;
}

.SliderTopNews .swiper-pagination {
    position: absolute;
    left: 32px;
    bottom: 132px;
    padding: 0 10px;
    width: auto;
    height: 40px !important;
    display: flex;
    align-items: center;
    gap: 3px;
}

.SliderTopNews .swiper-pagination span.swiper-pagination-bullet {
    border-radius: 0;
    opacity: 1;
    background: #3a3a3a;
    margin: 0;
}

.SliderTopNews .swiper-pagination span.swiper-pagination-bullet-active {
    background: var(--color2);
    width: 20px;
}

.SliderTopNews .Arrows {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: calc(100% - 60px);
    height: 0px;
    margin: auto;
    right: 0;
}

.SliderTopNews .Arrows .swiper-button-next,
.SliderTopNews .Arrows .swiper-button-prev {
    color: #fff !important;
}


.itemSlideNews .pic .light {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.itemSlideNews .pic .light:before {
    position: absolute;
    right: 0;
    top: 0;
    width: 60%;
    height: 60%;
    content: '';
    background: linear-gradient(189deg, rgb(4 121 64 / 100%), transparent, transparent);
}

.itemSlideNews .pic .light:after {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 60%;
    height: 60%;
    content: '';
    background: linear-gradient(16deg, rgb(213 154 45 /100%), transparent, transparent);
}

a.hoverLink,
a.hoverlink {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 11;
    opacity: 0;
    font-size: 0;
}

.rowCustom.full .col {
    width: 100% !important;
}

.rowCustom.full .frmCM {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 20px 0 30px;
    width: 100%;
}


.UploadFiles {
    position: relative;
    width: 100%;
    height: 40px;
    border-radius: 6px;
    display: flex;
    align-items: center;
    border: 1px solid #024926;
    color: #ffffff52;
}

.UploadFiles input[type="file"] {
    position: absolute !important;
    width: 0 !important;
    height: 0 !important;
    padding: 0 !important;
    opacity: 0 !important;
    overflow: hidden !important;
}

.UploadFiles .openUploader {
    position: relative;
    width: 100%;
    height: 40px;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    padding-right: 110px;
    cursor: pointer;
}

.UploadFiles .openUploader label:first-child {
    cursor: pointer;
    width: calc(100% - 110px);
    height: 40px;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    padding: 0 10px 0 0;
    gap: 5px;
}

.UploadFiles .openUploader .btn {
    position: absolute;
    right: 5px;
    top: 0;
    bottom: 0;
    margin: auto;
    height: 30px;
    width: 100px;
    background: var(--color1);
    display: flex;
    justify-content: center;
    align-items: center;
    color: #000;
    border-radius: 4px;
    cursor: pointer;
}

.UploadFiles .openUploader .btn:hover {
    background: var(--color3);
    color: #fff;
}

.UploadFiles .openUploader .btn:active {
    background: var(--color1);
    color: var(--color3);
}

.titletable {
    position: relative;
    width: 100%;
    display: flex;
    margin: 40px 0 10px;
    color: var(--color2);
    font-family: 'IRANSharp';
    justify-content: center;
    text-align: center;
}

.rowItemsCenter {
    position: relative;
    width: 100%;
    max-width: 800px;
    margin: auto;
    display: flex;
    justify-content: center;
    font-size: 20px;
    /* color: #fff; */
    margin: 20px auto;
}

.rowItemsStart {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: space-evenly;
    font-size: 20px;
    flex-wrap: wrap;
    /* color: #fff; */
}

.ContentTypePerson {
    position: relative;
    width: 100%;
    max-height: 0;
    overflow: hidden;
    transition: all 0.2s;
    opacity: 0;
}

    .ContentTypePerson.show {
        max-height: 10000px;
        opacity: 1;
    }

    tbody tr input[type="text"] {
        position: relative;
        width: 100%;
        height: 40px;
        border: 1px solid #9e9e9e;
        border-radius: 5px;
        color: #333;
    }

.SecLoad.CMForm.monaghese .TitleSection .title {
    color: var(--color2);
}
.dataTables_wrapper .dataTables_filter, .dataTables_wrapper .dataTables_length {
    display: none;
}
.dataTables_wrapper {
    background: #ffffff;
    padding: 20px;
    box-shadow: 0px 0px 30px -30px rgba(0,0,0,0.5);
    border-radius: 15px;
    width: 100%;
    margin: auto;
}
.TitleCenter {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: center;
    margin: 40px 0 10px;
    color: var(--color2);
    font-family: IranSharp;
}
.CMForm.monaghese .frmCM {
    position: relative;
    width: 100%;
    padding: 30px;
    background: var(--color2);
    border-radius: 15px;
    box-shadow: 0px 0px 20px -15px rgba(0,0,0,0.5);
    margin: 20px 0;
}
.titleRight {
    font-size: 18px;
    position: relative;
    display: flex;
    justify-content: flex-start;
    color: #fff;
    font-family: 'IRANSharp';
}
label.titleQualityControl {
    color: yellow;
}
.BoxtextMore .moreLink {
    display: none;
}

.BoxtextMore .moreLink.show {
    display: flex;
}
.BoxtextMore .contentTextMore:before {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 200px;
    background: linear-gradient(0deg, #fff, transparent);
    content: '';
    transition: all 1s;
}
.BoxtextMore.open .contentTextMore:before {
    height: 0px;
}
.taminkonandeh .TitleCenter {
    color: var(--color1);
}

.taminkonandeh select#TypePerson {
    color: #fff !important;
}
.rowCustomTabs .col1 .tabBtns {
    box-shadow: none !important;
}

button.showFilterMobile {
    position: relative;
    width: 100%;
    margin-top: 10px;
    height: 40px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    background: transparent;
    border: none !important;
    user-select: none;
    outline: none;
    color: #fff;
    font-size: 20px;
    background: #464646;
    border-radius: 6px;
    display: none;
    padding: 0 10px;
    gap: 10px;
}
button.showFilterMobile span {
    position: relative;
    top: 0;
    text-wrap: nowrap;
    background: transparent;
    padding: 5px;
    font-size: 14px;
    font-family: 'IranYekan';
    border-radius: 6px;
    color: #fff;
    transition: all 0.2s;
    transform: translateX(0px);
    /* opacity: 0; */
}
.contentSecPods .swiper-pagination {
    display: none;
}


.itemProductSlider {
    position: relative;
    width: 100%;
    margin: auto;
    background: var(--colorOne);
    border-radius: 10px;
}
.itemProductSlider:before {
    position: relative;
    width: 100%;
    padding-top: 130%;
    content: '';
    display: block;
}
.itemProductSlider .gradient {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    border-radius: 10px;
    height: calc(100% - 80px);
    background: radial-gradient(var(--colorTwo) 3%, var(--colorOne) 60%);
}

.itemProductSlider .gradient i {
    position: absolute;
    width: 100%;
    height: 100%;
    background: no-repeat center / 40px;
    display: block;
}
.itemProductSlider .gradient i.okloadlazy {
    background: no-repeat center / 90%;
}
.itemProductSlider .contentHref .title {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    height: 60px;
    width: calc(100% - 20px);
    background: #fff;
    padding: 10px;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
    color: rgb(49 49 49 / 70%);
    font-size: 18px;
    border-radius: 10px 10px 0 0;
}
.itemProductSlider .contentHref .title:before {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    height: 2px;
    width: 60px;
    content: '';
    background-color: var(--color2);
}
.itemProductSlider .contentHref:before {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgb(4 108 56 / 85%);
    transition: all 0.2s;
    border-radius: 10px;
    opacity: 0;
    content: "\f002";
    font-family: 'Font Awesome 5 Pro';
    font-weight: 300;
    display: flex;
    justify-content: center;
    align-items: center;
    transform: scaleX(-1);
    color: var(--color1);
    font-size: 40px;
}
.itemProductSlider:hover .content:before {
    opacity: 1;
}
.itemProductSlider:after {
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    height: 40px;
    border-radius: 40px;
    content: '';
    background: #000;
    transform: scaleY(0.4) scaleX(0) translateY(-120px);
    filter: blur(40px);
    opacity: 0.6;
    z-index: -1;
    transition: all 0.5s;
}
.itemProductSlider:hover:after {
    transform: scaleY(0.4) scaleX(1) translateY(20px);
}
.ProductListSearch {
    position: relative;
    padding: 40px 0;
    width: 100%;
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 40px !important;
}


.listBlogSearch {
    position: relative;
    padding: 40px 0;
    width: 100%;
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 40px !important;
}
.itemblog .contentItemBlog .title a {
    color: rgb(49 49 49 / 70%);
}
.itemblog:hover .contentItemBlog .title a {
    color: rgb(255 255 255 / 70%);
}
.itemblog .pic g {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: no-repeat center 35% / 60px;
    transition: all 0.5s;
    filter: grayscale(0);
}
.itemblog .pic g.okloadlazy {
    background-size: cover;
}
.itemblog:hover .pic g {
    filter: grayscale(1);
}
.itemblog {
    position: relative;
    width: 100%;
    margin: auto;
    border-radius: 20px 8px 8px 8px;
    background: transparent;
}
.itemblog .pic i {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.itemblog .pic i:before {
    position: absolute;
    right: -25%;
    top: -25%;
    width: 60%;
    padding-top: 60%;
    content: '';
    border-radius: 100%;
    background: var(--color6);
    filter: blur(60px);
    z-index: 1;
    opacity: 0;
    transition: all 0.5s;
}
.itemblog .pic i:after {
    position: absolute;
    left: -25%;
    bottom: -25%;
    width: 60%;
    padding-top: 60%;
    content: '';
    border-radius: 100%;
    background: var(--color2);
    filter: blur(60px);
    z-index: 1;
    opacity: 0;
    transition: all 0.5s;
}
.itemblog:hover .pic i:before {
    opacity: 1;
}
.itemblog:hover .pic i:after {
    opacity: 1;
}

.itemblog .pic {
    position: relative;
    width: 100%;
    display: block;
    background-repeat: no-repeat !important;
    background-position: center !important;
    border-radius: 20px 8px 8px 8px;
    z-index: 10;
    transition: all 0.5s;
    -webkit-clip-path: url(#blogframe0);
    clip-path: url(#blogframe0);
}
.itemblog:hover .pic {
    -webkit-clip-path: url(#blogframe1);
    clip-path: url(#blogframe1);
}

.itemblog .pic.okloadlazy {
    background-size: cover !important;
}
.itemblog .pic:before {
    position: relative;
    width: 100%;
    padding-top: 127%;
    content: '';
    display: block;
}
.itemblog .pic:after {
    position: absolute;
    left: 0;
    top: -15%;
    width: 100%;
    height: 115%;
    background: rgba(0,0,0,0.5);
    content: '';
    transition: all 0.5s;
    content: "\f002";
    font-family: 'Font Awesome 5 Pro';
    font-weight: 300;
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--color6);
    font-size: 26px;
    transform: scaleX(-1);
    opacity: 0;
}
.itemblog:hover .pic:after {
    opacity: 1;
}
.itemblog .contentItemBlog {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    height: 60%;
    overflow: hidden;
    border-radius: 20px 6px 6px 6px;
    z-index: 20;
    padding: 20px;
    box-sizing: border-box;
}
.itemblog .contentItemBlog:before {
    position: absolute;
    left: 0;
    bottom: 0;
    content:'';
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    -webkit-clip-path: url(#blogframe4);
    clip-path: url(#blogframe4);
    background: #eee;
    transition: all 0.2s;
}
.itemblog:hover .contentItemBlog:before {
    height: 0;
}
    .itemblog .contentItemBlog .title {
        position: relative;
        padding: 0 10px;
        line-height: 2;
        color: rgb(49 49 49 / 70%);
        transition: all 0.5s;
        font-weight: 400;
    }

.itemblog:hover .contentItemBlog .title {
    color: rgb(255 255 255 / 100%);
}
.itemblog .contentItemBlog .title:before {
    position: absolute;
    left: 100%;
    top: 0;
    bottom: 0;
    height: 70%;
    background: var(--color2);
    content: '';
    display: block;
    width: 3px;
    border-radius: 15px;
    transition: all 0.2s;
    margin: auto;
}
.itemblog:hover .contentItemBlog .title:before {
    background: var(--color1);
}
.itemblog i.layers {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    overflow: hidden;
    border-radius: 20px 8px 8px 8px;
}
.itemblog i.layers:before {
    position: absolute;
    width: 100%;
    height: 100%;
    right: 0;
    top: 0;
    border-radius: 20px 8px 8px 8px;
    content: '';
    background: var(--color6);
    -webkit-clip-path: url(#blogframe3);
    clip-path: url(#blogframe3);
    transition: all 0.5s;
    transform: translate(30px, 30px);
}
.itemblog i.layers:after {
    position: absolute;
    width: 100%;
    height: 100%;
    right: 0;
    top: 0;
    border-radius:20px 8px 8px 8px;
    content:'';
    background:#fff;
    -webkit-clip-path: url(#blogframe2);
    clip-path: url(#blogframe2);
    transition: all 0.5s;
    transform: translate(30px, 30px);
}
.itemblog:hover i.layers:before {
    transition-delay: 0.3s;
    transform: translate(0px, 0px);
}
.itemblog:hover i.layers:after {
    transition-delay: 0.6s;
    transform: translate(0px, 0px);
}
.itemSlideProduct .pic img.picfront.okloadlazy, .itemSlideProduct .pic img.picfront {
    opacity: 1;
    transition: all 1s;
}

.itemSlideProduct:hover .pic img.picfront.okloadlazy, .itemSlideProduct:hover .pic img.picfront {
    opacity: 0;
}

.itemSlideProduct .pic img.picback.okloadlazy, .itemSlideProduct .pic img.picback {
    opacity: 0;
    transition: all 1s;
}

.itemSlideProduct:hover .pic img.picback.okloadlazy, .itemSlideProduct:hover .pic img.picback {
    opacity: 1;
}

.itemProductSlider .gradient i.picfront.okloadlazy, .itemProductSlider .gradient i.picfront {
    opacity: 1;
    transition: all 1s;
}
.itemProductSlider:hover .gradient i.picfront.okloadlazy, .itemProductSlider:hover .gradient i.picfront {
    opacity: 0;
}
.itemProductSlider .gradient i.picback.okloadlazy, .itemProductSlider .gradient i.picback {
    opacity: 0;
    transition: all 1s;
}
.itemProductSlider:hover .gradient i.picback.okloadlazy, .itemProductSlider:hover .gradient i.picback {
    opacity: 1;
}
.popupCarousel .swiper-button-next {
    left: -10px;
    color: #333 !important;
}
.popupCarousel .swiper-button-prev {
    right: -10px;
    color: #333 !important;
}
.popupCarousel .swiper-button-prev:after,.popupCarousel  .swiper-button-next:after {
    font-size: 32px;
}
.popupCarousel .swiper-pagination {
    display: none;
}
.itemProductSlider .gradient i img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    object-fit: cover;
}
.bxOffice .viewLink {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    width: 140px;
    font-size: 14px;
    margin: auto;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--color1);
    color: #fff;
    border-radius: 10px 10px 0 0;
}

    .bxOffice .viewLink:hover {
        background: var(--color2);
        color: #fff;
    }
.itemProductSlider .hover {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #04713fbd;
    z-index: 2;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-bottom: 60px;
    color: #fff;
    font-size: 30px;
    border-radius: 10px;
    opacity: 0;
    transition: all 0.5s;
}

.itemProductSlider:hover .hover {
    opacity: 1;
}
.itemProductSlider .contentHref {
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    top: 0;
    z-index: 3;
}
.TitleSection .subtitle {
    color: #e3e3e3;
}
.categoriesProduct a.linkcat:hover {
    color: #009688;
}
.popupCarousel .swiper-button-prev:after, .popupCarousel .swiper-button-next:after {
    font-size: 42px;
    color: #d5ab3c;
}
.picProductContent .rowCustom.center {
    margin-top: -60px;
}
.description {
    font-size: 14px;
    line-height: 2;
    text-align: justify;
    font-weight: 400 !important;
    color: rgb(20 69 85 / 70%) !important;
}
.itemQuickAccess strong.title {
    color: rgb(49 49 49 / 70%);
    font-weight: 500;
}
.breadcrumbs .bread a, .breadcrumbs .bread a span {
    font-size: 16px;
    font-weight: 300;
    color: var(--color3);
}
.Arrows {
    z-index: 100 !important;
    position: absolute;
    top: 0;
    bottom: 0;
    height: 0;
    margin: auto;
    width: calc(100% - 80px);
}

.sliderPopup {
    position: relative;
    width: 100%;
    padding: 0 60px;
}

.containerFull {
    position: relative;
    width: 100%;
    padding: 0 40px;
}

.itemSlideProduct .pic :not(img.okloadlazy) {
    opacity: 0 !important;
}

.rowCustomTabs .col1 .tabBtns button.btnTab.active span {
    font-weight: 600;
}

.bgwave {
    z-index: 1 !important;
    overflow: inherit;
    margin: 110px 0 !important;
}

    .bgwave i.bg {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(180deg, #f6f6f6, #fafafa);
    }

        .bgwave i.bg i:nth-child(1) {
            position: absolute;
            left: 0;
            bottom: 100%;
            width: 100%;
            height: 7vw;
            z-index: 10;
            background: no-repeat center bottom / 100%;
        }

        .bgwave i.bg i:nth-child(2) {
            position: absolute;
            left: 0;
            top: 100%;
            width: 100%;
            height: 7vw;
            z-index: 10;
            background: no-repeat center top / 100%;
        }

.bxOffice .rowTxt * {
    font-size: 14px !important;
}

.itemNews .pic:after {
    position: absolute;
    background: rgba(0, 0, 0, .5);
    width: 100%;
    transition: all 0.2s;
    opacity: 0;
    content: "\f002";
    font-family: 'Font Awesome 5 Pro';
    font-weight: 300;
    font-size: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    top: 0;
    left: 0;
    height: 100%;
    padding: 0 !important;
}

.itemNews:hover .pic:after {
    opacity: 1;
}

.itemNews:hover .contentItemNews {
    background: #2b2b2b;
    color: rgba(255, 255, 255, 0.5);
}

.itemNews:hover strong.title {
    background: #1c1c1c;
    color: var(--color1);
    border-color: var(--color2);
}

.itemNews:hover a.moreLinkSec {
    color: #fff;
}

    .itemNews:hover a.moreLinkSec:hover {
        color: var(--color1);
    }

.allContentTab:after {
    position: relative;
    clear: both !important;
    display: block;
    content: '';
}

footer .socialIcons {
    justify-content: flex-start;
}
.SecLoad.CMForm .rowCustom .col2 {
    padding: 50px 20px 40px;
}
.SliderTopNews .Arrows .swiper-button-next, .SliderTopNews .Arrows .swiper-button-prev {
    color: #d5ab3c !important;
}
.tabSlideitem .titleItemTab i {
    position: absolute;
    left: 5px;
    top: 0;
    bottom: 0;
    width: 0;
    height: 1px;
    background: #d5ab3c;
    margin: auto;
    transition: all 0.5s;
}

.tabSlideitem.active .titleItemTab i {
    width: 10px;
}

.contentFooter .socialIcons {
    justify-content: flex-start !important;
}
.itemCertificate .nameproduct,
.ItemPopupCarousel .nameproduct {
    position: absolute;
    left: 0;
    top: 76%;
    right: 0;
    margin: auto;
    width: 95%;
    height: 50px;
    border-radius: 10px;
    font-size: 12px;
    text-align: center;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    filter: drop-shadow(2px 3px 6px rgba(0,0,0,0.1));
    transition: all 0.2s;
    transform: translateY(100px) perspective(1000px);
    transform-origin: top center;
    opacity: 0;
    z-index: 20;
}

.itemCertificate:hover .nameproduct,
.ItemPopupCarousel:hover .nameproduct {
    transform: translateY(0px) perspective(1000px);
    opacity: 1;
}

.itemCertificate .nameproduct:before,
.ItemPopupCarousel .nameproduct:before {
    position: absolute;
    width: 15px;
    height: 15px;
    content: '';
    background: #fff;
    top: -7px;
    transform: rotate(45deg);
    left: 0;
    right: 0;
    margin: auto;
}
.secCertificates .Arrows {
    width: 100% !important;
}
.CircleImageGall i.bgi {
    left: 0px;
    position: absolute;
    top: 0;
    width: 58%;
    height: 100%;
    background: no-repeat center / cover;
    border-radius: 0 !important;
    border: none !important;
}
.contentTabsSlider[data-count="4"] .tabSlideitem:nth-child(1) {
    right: -15px !important;
}

.contentTabsSlider[data-count="4"] .tabSlideitem:nth-child(2) {
    right: -6px !important;
}

.contentTabsSlider[data-count="4"] .tabSlideitem:nth-child(3) {
    right: -6px !important;
}

.contentTabsSlider[data-count="4"] .tabSlideitem:nth-child(4) {
    right: -17px !important;
}



.contentTabsSlider[data-count="5"] .tabSlideitem:nth-child(1) {
    right: -20px !important;
}

.contentTabsSlider[data-count="5"] .tabSlideitem:nth-child(2) {
    right: -8px !important;
}

.contentTabsSlider[data-count="5"] .tabSlideitem:nth-child(3) {
    right: -6px !important;
}

.contentTabsSlider[data-count="5"] .tabSlideitem:nth-child(4) {
    right: -15px !important;
}

.contentTabsSlider[data-count="5"] .tabSlideitem:nth-child(5) {
    right: -28px !important;
}



.contentTabsSlider[data-count="6"] .tabSlideitem:nth-child(1) {
    right: -32px !important;
}

.contentTabsSlider[data-count="6"] .tabSlideitem:nth-child(2) {
    right: -12px !important;
}

.contentTabsSlider[data-count="6"] .tabSlideitem:nth-child(3) {
    right: -4px !important;
}

.contentTabsSlider[data-count="6"] .tabSlideitem:nth-child(4) {
    right: -8px !important;
}

.contentTabsSlider[data-count="6"] .tabSlideitem:nth-child(5) {
    right: -21px !important;
}

.contentTabsSlider[data-count="6"] .tabSlideitem:nth-child(6) {
    right: -43px !important;
}



.contentTabsSlider[data-count="7"] .tabSlideitem:nth-child(1) {
    right: -50px !important;
}

.contentTabsSlider[data-count="7"] .tabSlideitem:nth-child(2) {
    right: -22px !important;
}

.contentTabsSlider[data-count="7"] .tabSlideitem:nth-child(3) {
    right: -7px !important;
}

.contentTabsSlider[data-count="7"] .tabSlideitem:nth-child(4) {
    right: -6px !important;
}

.contentTabsSlider[data-count="7"] .tabSlideitem:nth-child(5) {
    right: -14px !important;
}

.contentTabsSlider[data-count="7"] .tabSlideitem:nth-child(6) {
    right: -32px !important;
}

.contentTabsSlider[data-count="7"] .tabSlideitem:nth-child(7) {
    right: -60px !important;
}