@charset "UTF-8";
@import "fonts.css";
@import "animate.css";

:Root {
    --color1: #252070;
    --color2: #dd1a22;
    --color3: #e8e677;
    --color4: #fff;
    --color5: #efefef;
    --color6: #71c4ff;
    --color7: #f36e21;
    --color7: #903421;
    --textcolor: #5e5e5e;
    --borderRadius: 6px;
    --thumbBG: #c81b21;
    --scrollbarBG: #f7f7f7;
}

body {
    opacity: 1;
    font-family: IRANYekan !important;
    background-color: #fff;
}
html[dir='ltr'] body {
    font-family: IRANYekanEn !important;
}

body.openSearch {
    overflow: hidden;
}

.slide.active,
html {
    -webkit-backface-visibility: hidden
}

ul.menunav a {
    color: #fff;
    font-size: 16px;
}

ul.menunav>li>div>ul.submenu {
    position: absolute;
    top: 100%;
    background: #28227a;
    padding: 10px 20px;
    display: flex;
    flex-direction: column !important;
    gap: 5px;
    transition: all 0.2s;
    transform: translateY(90px);
    pointer-events: none;
    opacity: 0;
    border-radius: 10px;
}

ul.menunav>li:hover>div>ul.submenu {
    transform: translateY(0px) !important;
    pointer-events: auto !important;
    opacity: 1 !important;
}

ul.menunav>li>div>ul.submenu a {
    height: 35px;
    position: relative;
    display: flex;
    align-items: center;
    padding: 0 20px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 10px;
}

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

* {
    user-select: none;
    -webkit-tap-highlight-color: transparent;
}

*::-webkit-scrollbar {
    width: 6px;
    max-height: 6px;
}

* {
    scrollbar-width: thin;
    scrollbar-color: var(--thumbBG) var(--scrollbarBG);
}

*::-webkit-scrollbar-track {
    background: var(--scrollbarBG);
}

*::-webkit-scrollbar-thumb {
    border-radius: 20px;
    transform: translateX(-10px);
    background-color: var(--scrollbarBG);
    border: 3px solid var(--thumbBG);
}

.scrollDraging::-webkit-scrollbar,
.tabsButtonsTestStudy::-webkit-scrollbar {
    width: 5px;
    max-height: 5px;
}

.scrollDraging,
.tabsButtonsTestStudy {
    scrollbar-width: thin;
    scrollbar-color: var(--thumbBG);
}

.scrollDraging::-webkit-scrollbar-thumb,
.tabsButtonsTestStudy::-webkit-scrollbar-thumb {
    background-color: var(--scrollbarBG);
    border: 3px solid var(--thumbBG);
}

input,
button,
select,
textarea {
    font-family: 'IRANYekan';
    font-size: 14px;
    user-select: none;
    outline: none !important;
}
html[dir='ltr'] input,
html[dir='ltr'] button,
html[dir='ltr'] select,
html[dir='ltr'] textarea {
    font-family: 'IRANYekanEn';
}

*,
.dialog li,
:focus,
a {
    text-decoration: none;
    box-sizing: border-box !important;
}

.container .wrap,
form.center input,
form.center textarea {
    text-align: center
}

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

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;
    /* color: var(--color3); */
}

a {
    text-decoration: none;
    color: #000;
}

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

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block
}

.dot,
.dot:after,
.social-circles li,
img {
    display: inline-block
}

/* li,
ol,
ul {
    list-style: none
} */
.brn-navbar :is(ol, ul, li),
footer :is(ol, ul, li) {
    list-style: none ! IMPORTANT;
}

blockquote,
q {
    quotes: none
}

blockquote:after,
blockquote:before,
q:after,
q:before {
    content: none
}

.dot:after,
.grid:after,
.hr:after,
.quoteBubble:after,
.videoThumbnail:after {
    content: ""
}

img[data-hrbsrc],
.hrb_imgloader,
*[data-hrbsrc] {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzgiIGhlaWdodD0iMzgiIHZpZXdCb3g9IjAgMCAzOCAzOCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiBzdHJva2U9IiNhN2E3YTciPg0KICAgIDxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+DQogICAgICAgIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEgMSkiIHN0cm9rZS13aWR0aD0iMiI+DQogICAgICAgICAgICA8Y2lyY2xlIHN0cm9rZS1vcGFjaXR5PSIuMyIgY3g9IjE4IiBjeT0iMTgiIHI9IjE4Ii8+DQogICAgICAgICAgICA8cGF0aCBkPSJNMzYgMThjMC05Ljk0LTguMDYtMTgtMTgtMTgiPg0KICAgICAgICAgICAgICAgIDxhbmltYXRlVHJhbnNmb3JtDQogICAgICAgICAgICAgICAgICAgIGF0dHJpYnV0ZU5hbWU9InRyYW5zZm9ybSINCiAgICAgICAgICAgICAgICAgICAgdHlwZT0icm90YXRlIg0KICAgICAgICAgICAgICAgICAgICBmcm9tPSIwIDE4IDE4Ig0KICAgICAgICAgICAgICAgICAgICB0bz0iMzYwIDE4IDE4Ig0KICAgICAgICAgICAgICAgICAgICBkdXI9IjFzIg0KICAgICAgICAgICAgICAgICAgICByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIvPg0KICAgICAgICAgICAgPC9wYXRoPg0KICAgICAgICA8L2c+DQogICAgPC9nPg0KPC9zdmc+);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 30px;
    background-color: rgb(215 215 215 / 0%) !important;
}

*[data-hrbsrc].okloadbg {
    background-color: transparent !important;
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

b,
strong {
    font-weight: 600
}

body,
html {
    direction: rtl;
    margin: 0;
    padding: 0;
    font-size: 14px;
    color: #545454;
}

.container {
    position: relative;
    width: 100%;
    max-width: 1460px;
    margin: auto;
    padding: 10px;
    z-index: 10;
}

main.MainPage {
    position: relative;
    width: 100%;
    transition: all 0.2s;
    padding-top: 0;
    /* background-color: #c81b21; */
}

body.inner main.mainPage {
    padding-top: 90px !important;
}


.brn-navbar {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 100000000;
}

    .brn-navbar:before {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        content: '';
        filter: drop-shadow(0px 7px 11px rgba(0, 0, 0, 0.4));
        background: #28227a;
        mix-blend-mode: multiply;
        transition: all 0.5s;
    }

body.DownScroll .brn-navbar:before {
    background: #28227a;
}

body.inner .brn-navbar:before {
    background: #28227a;
}

.brn-navbar .container {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    height: 90px;
    justify-content: space-between;
}

.brn-nav-logo {
    position: relative;
    width: 200px;
    display: flex;
    justify-content: flex-start;
    gap: 20px;
    align-items: center;
}

.brn-nav-left {
    position: relative;
    width: 200px;
    display: flex;
    justify-content: space-between;
    justify-content: flex-end;
    gap: 20px;
    align-items: center;
}

.brn-nav-menu {
    position: relative;
    width: calc(100% - 400px);
    display: flex;
    justify-content: center;
    height: 100%;
    align-items: center;
}

.brn-nav-center:before {
    position: absolute;
    top: calc(100% - 1px);
    width: 100%;
    display: flex;
    height: 38px;
    background: url(../img/navbar-obj.png) no-repeat center top / 100%;
    content: '';
}

.brn-nav-menu ul.menunav {
    position: relative;
    width: 100%;
    display: flex;
    align-items: center;
    gap: 50px;
    padding: 0 10px;
}

.sec1home .swiper-button-prev,
.sec1home .swiper-container-rtl .swiper-button-next {
    left: -70px !important;
    right: auto !important;
    height: 80px;
    width: 50px !important;
}

.sec1home .swiper-button-next,
.sec1home .swiper-container-rtl .swiper-button-prev {
    right: -70px !important;
    left: auto !important;
    height: 80px;
    width: 50px !important;
}

ul.menunav a {
    color: var(--color4);
    font-size: 14px;
    position: relative;
}

ul.menunav a.active,
ul.menunav a:hover {
    color: var(--color3);
}

ul.menunav .issub {
    padding-left: 20px;
}

ul.menunav .issub:before {
    position: absolute;
    left: -5px;
    top: 0;
    width: 20px;
    height: 100%;
    background: url(../img/arr.png) no-repeat center / 16px;
    content: '';
}

a.logoheader {
    position: relative;
    top: 0;
    animation: logoAnim 6s 0.5s infinite linear;
    width: 180px;
}

a.logoheader img {
    width: 100%;
}

@keyframes logoAnim {

    0%,
    95% {
        transform: perspective(1000px) rotateX(0deg);
    }

    100% {
        transform: perspective(1000px) rotateX(360deg);
    }
}

.header-icons button.header-icon {
    position: relative;
    width: 40px;
    height: 40px;
    background: transparent !important;
    border: none !important;
    color: #fff;
    font-size: 16px;
    color: var(--color4);
    cursor: pointer;
}

.header-icons button.header-icon.menu-toggle {
    display: none;
}

.header-icons button.header-icon:hover {
    color: var(--color3);
}

.header-icons button.header-icon .fa-search {
    background: #fff;
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #000;
    border-radius: 100%;
}

.header-icons {
    display: flex;
    align-items: center;
}

/* Language */
.languages {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.languages,
.languages * {
    font-family: IRANYekan !important;
    font-weight: 300 !important;
}
html[dir='ltr'] .languages,
html[dir='ltr'] .languages * {
    font-family: IRANYekanEn !important;
    font-weight: 300 !important;
}

.languages>span {
    position: relative;
    width: 50px;
    padding-right: 15px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 16px;
    color: var(--color4);
    font-weight: 100;
    font-family: IRANSans !important;
}

.languages>span:after {
    position: absolute;
    right: 0;
    height: 100%;
    width: 16px;
    content: '';
    background: url(../img/arr.png) no-repeat center / 16px;
    top: 0;
}

.languages {
    position: relative;
    width: 46px;
    height: 35px;
    display: flex;
    align-items: center;
    text-transform: uppercase;
    cursor: pointer;
    justify-content: center;
    margin-right: 5px;
}

.languages * {
    font-family: IRANYekan, Arial, Tahoma !important;
    font-weight: bold;
}
html[dir='ltr'] .languages * {
    font-family: IRANYekanEn, Arial, Tahoma !important;
}

.languages label {
    pointer-events: none;
}

.languages span:before {
    margin-top: 3px !important;
}

.languages.en span:before {
    content: "en";
}

.languages.fa span:before {
    content: "fa";
}

.languages.fr span:before {
    content: "fr";
}

.languages.ar span:before {
    content: "ar";
}

.languages .showLang {
    position: absolute;
    width: 50px;
    top: 100%;
    background: var(--color4);
    box-shadow: 0px 0px 15px -9px;
    border-radius: 5px;
    padding: 10px;
    display: flex;
    flex-direction: column;
    left: 0;
    box-sizing: border-box;
    transform-origin: bottom center;
    transform: translateX(-500px);
    transition: all 0.5s cubic-bezier(0.74, 0.51, 0, 1.19);
    opacity: 0;
    cursor: pointer;
    pointer-events: none;
}

.languages:hover .showLang {
    pointer-events: auto;
    transform: translateX(0px);
    opacity: 1;
}

.languages:hover .showLang * {
    pointer-events: auto !important;
}

.showLang .itemLang {
    position: relative;
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    font-weight: bold;
    margin-bottom: 0px;
    color: var(--color1);
    pointer-events: none;
}

.showLang .itemLang:hover {
    background: var(--color1) !important;
    color: var(--color3) !important;
}

.languages.fr .itemLang.fr:before,
.languages.ar .itemLang.ar:before,
.languages.fa .itemLang.fa:before,
.languages.en .itemLang.en:before {
    /*-webkit-background-clip: none !important;*/
    /*-webkit-text-fill-color: #fff;*/
}

.showLang .itemLang:before {
    font-family: IRANYekan, Arial, Tahoma !important;
    font-weight: bold;
}
html[dir='ltr']  .showLang .itemLang:before {
    font-family: IRANYekanEn, Arial, Tahoma !important;
}

.itemLang.en:before {
    content: 'en'
}

.itemLang.fa:before {
    content: 'fa'
}

.itemLang.fr:before {
    content: 'fr'
}

.itemLang.ar:before {
    content: 'ar'
}

/* Language */

.searchPopup {
    position: fixed;
    top: 90px;
    width: 100%;
    height: calc(100% - 90px);
    background: #fff;
    z-index: 1000000;
    padding: 30px 0;
    pointer-events: none;
    transition: all 0.4s;
    transform: translateY(100vh);
    opacity: 0;
}

.openSearch .searchPopup {
    pointer-events: auto;
    transform: translateY(0vh);
    opacity: 1;
}

.searchPopup .searchBox {
    position: relative;
    width: 100%;
}

.searchPopup .searchBox input {
    position: relative;
    width: 100%;
    height: 90px;
    border: 1px solid #bbb;
    background: transparent !important;
    padding: 0 50px 0 80px;
    font-size: 18px;
}

.searchPopup .searchBox .btnSearch {
    position: absolute;
    left: 0;
    top: 0;
    width: 80px;
    height: 100%;
    border: none !important;
    background: transparent !important;
    font-size: 34px;
    color: #a5a5a5;
    cursor: pointer;
}

.searchPopup .searchBox .btnSearch:hover {
    color: var(--color1);
}

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

.searchPopup .close {
    position: absolute;
    right: 10px;
    height: 90px;
    width: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 26px;
    font-weight: 100;
    cursor: pointer;
    z-index: 10;
}

.searchPopup .close:hover {
    color: var(--color1);
}

section {
    position: relative;
    overflow: hidden;
    width: 100%;
}

.secListCatalog .container {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.itemCatalog,
.itemSlideHome {
    position: relative;
    width: 100%;
}

 .itemSlideHome .pic {
    position: relative;
    border-radius: 0px 0;
    overflow: hidden;
}
.itemCatalog .pic{
    position: relative;
    border-radius: 30px 0;
    overflow: hidden;
}

.itemCatalog .pic:before,
.itemSlideHome .pic:before {
    position: relative;
    width: 100%;
    display: block;
    content: '';
    padding-top: 41%;
}

.itemCatalog .pic:before {
    padding-top: 34%;
}

.itemCatalog .pic img,
.itemSlideHome .pic img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.itemSlideHome .pic img.slideDesktop {
    display: block !important;
}

.itemSlideHome .pic img.slideMobile {
    display: none !important;
}
.swiper-wrapper {
    width: 100%;
    height: auto !important;
}

.itemCatalog .container.contentCatalog,
.itemSlideHome .container.contentSlider {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    right: 0;
    margin: auto;
    z-index: 10;
    padding: 0px 60px 120px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end;
}

.itemCatalog .titleCatalog,
.itemSlideHome .textSlide {
    position: relative;
    display: flex;
    flex-direction: column;
    font-size: 30px;
    color: #fff;
}

.itemCatalog .titleReal,
.itemSlideHome .titleSlide {
    font-weight: 300;
}
.itemSlideHome .titleSlide {
    transition: all 0.5s;
    transform: translateX(-200px);
    opacity: 0;
}
.swiper-slide-active .itemSlideHome .titleSlide {
    transition-delay: 0.5s;
    transform: translateX(0px);
    opacity: 1;
}
.itemSlideHome .rowBtns {
    transition: all 0.5s;
    transform: translateY(250px);
    opacity: 0;
}
.swiper-slide-active  .itemSlideHome .rowBtns {
    transition-delay: 1s;
    transform: translateY(0px);
    opacity: 1;
}
.itemSlideHome .topTitleSlide,
.itemCatalog .titleReal {
    font-family: iranNastaliq;
    font-size: 88px;
    font-weight: 100;
    color: #fff;
    line-height: 1.3;
}
.itemSlideHome .topTitleSlide {
    transition: all 0.5s;
    transform: translateX(-200px);
    opacity: 0;
}
.swiper-slide-active .itemSlideHome .topTitleSlide {
    transform: translateX(0px);
    opacity: 1;
}
.rowBtns {
    position: relative;
    width: 100%;
    display: flex;
    gap: 10px;
    margin: 10px 0 0;
}

.rowBtns.center {
    justify-content: center;
}

.btnCustom {
    position: relative;
    height: 50px;
    padding: 0 35px;
    border: 1px solid #fff;
    color: #fff;
    display: flex;
    align-items: center;
    text-align: center;
    border-radius: 15px 0px 15px 0px;
    transition: all 0.2s;
}

.btnCustom:hover {
    background-color: #fff;
    color: #000;
}

.btnCustom.custom2 {
    background-color: #fff;
    color: #000;
}

.btnCustom.custom2:hover {
    background-color: transparent;
    color: #fff;
}

.sec1home .swiper-pagination-bullet {
    width: 10px;
    height: 10px;
    background: #fff !important;
    opacity: 1 !important;
    transition: all 1s;
}

.sec1home .swiper-pagination-bullet-active {
    background: #e33035 !important;
    transform: scale(1.5);
}

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

.container.controllSlider {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

.sec4home .sliderBox .NextPrevSlider {
    width: 60px;
    z-index: 10;
    height: 0;
    display: flex;
    justify-content: center;
    left: auto;
    right: calc(100% / 4) !important;
    top: calc(50% - 40px) !important;
    bottom: auto !important;
}

.sec4home .sliderBox .NextPrevSlider .swiper-button-prev,
.sec4home .sliderBox .NextPrevSlider .swiper-button-next {
    position: relative;
    width: 30px;
    height: 40px;
    background: #dfdfdf;
    margin: 0 !important;
    transform: none !important;
    top: 0 !important;
    color: #080808 !important;
}

.sec4home .sliderBox .NextPrevSlider .swiper-button-prev:hover,
.sec4home .sliderBox .NextPrevSlider .swiper-button-next:hover {
    background: #cacaca;
}

.sec4home .sliderBox .NextPrevSlider .swiper-button-prev:after,
.sec4home .sliderBox .NextPrevSlider .swiper-button-next:after {
    font-size: 24px;
}



.container.controllSlider {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

.container.controllSlider .swiper-pagination {
    left: 0;
    right: 0;
    bottom: 20px;
    display: flex;
    justify-content: center;
    gap: 8px;
}

.container.controllSlider .swiper-pagination-bullet,
.container.controllSlider .swiper-button-next,
.container.controllSlider .swiper-button-prev {
    pointer-events: auto !important;
}

.itemCatalog .textSlide img,
.itemSlideHome .textSlide img {
    transition: all 0.5s;
    transform: translateY(-200px);
    opacity: 0;
}

.itemCatalog.active .textSlide img,
.swiper-slide-active .itemSlideHome .textSlide img {
    transition: all 0.5s;
    transform: translateY(0px);
    opacity: 1;
}

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

.sec5home i.bg {
    background: no-repeat center / cover;
    animation: bgBurn 10s infinite linear;
}

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

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

div[class^="sec"] {
    overflow: hidden !important;
    width: 100%;
    position: relative;
}

i.bg.texture,
.sec2home i.bg {
    mix-blend-mode: multiply;
    opacity: 20%;
}


.elementor-widget-hrbVideo {
    position: relative;
    width: 100%;
}

.hrbVideo {
    position: relative;
    width: 100%;
    max-width: 100%;
    margin: auto;
}

.hrbVideo .pic {
    position: relative;
    width: 100%;
    display: block;
    z-index: 10;
}

.hrbVideo .pic:before {
    position: relative;
    width: 100%;
    display: block;
    content: '';
    padding-top: 59%;
    z-index: 2;
}

.hrbVideo .h_iframe-aparat_embed_frame>span {
    padding-top: 37% !important;
}

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

.hrbVideo .hrb-custom-video {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 20;
}

.hrbVideo .hrb-custom-video video {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hrbVideo.play .hrb-custom-video .h_iframe-aparat_embed_frame * {
    min-height: 100% !important;
}

.hrbVideo i.play {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: no-repeat center / 80px;
    z-index: 10;
    transition: all 0.2s;
    cursor: pointer;
    background-color: transparent !important;
}

.hrbVideo:hover i.play {
    transform: scale(1.2);
}

textarea.hrb-embed-video {
    display: none !important;
}

.hrbVideo .hrb-custom-video {
    z-index: 30;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    pointer-events: none;
}

.hrbVideo.play .hrb-custom-video {
    opacity: 1;
    pointer-events: auto;
}

/* .rowCustom {
    position: relative;
    display: flex;
    --gap: 20px;
    gap: var(--gap);
    flex-wrap: wrap;
}

.rowCustom.row2col  .colCustom{
    width: calc((100% / 2) - var(--gap));
}

.rowCustom.row3col  .colCustom{
    width: calc((100% / 3) - var(--gap));
}

.rowCustom.row4col  .colCustom{
    width: calc((100% / 4) - var(--gap));
}

.rowCustom.row5col  .colCustom{
    width: calc((100% / 5) - var(--gap));
    flex: 25%
}

.rowCustom.row6col .colCustom {
    width: calc((100% / 6) - var(--gap));
    flex: 25%
} */


.rowCustom {
    position: relative;
    display: grid;
    --gap: 20px;
    gap: var(--gap);
}

.rowCustom.row2col {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.rowCustom.row3col {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.rowCustom.row4col {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.rowCustom.row5col {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.rowCustom.row6col {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}


.rowBtnMore {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: flex-end;
    height: 40px;
    padding: 0 20px;
    align-items: center;
}

.rowBtnMore:before {
    position: absolute;
    bottom: 0;
    right: 0;
    width: calc(100% - 16px);
    content: '';
    height: 1px;
    background-color: #1f197a;
}

.rowBtnMore:after {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 16px;
    content: '';
    height: 17px;
    background: url(../img/endRowMore.png) no-repeat bottom left / 100%;
}

.btnMoreBlank {
    color: #545454;
}

.btnMoreBlank:hover {
    color: #ed1b24;
}

.titleCustom.mb-50 {
    margin-bottom: 50px;
}

.titleCustomMore,
.titleCustom {
    position: relative;
    width: 100%;
    display: grid;
    grid-template-columns: auto auto 1fr;
    gap: 10px;
    align-items: flex-end;
}

.titleCustomMore .texttitle,
.titleCustom .texttitle {
    position: relative;
    font-size: 32px;
    line-height: 1;
    font-weight: 400;
    color: #6a6a6a;
}

.texttitle small.subtitle {
    position: absolute;
    left: 0;
    top: 100%;
    font-size: 20px;
    color: #1a7939;
    padding: 10px 0 0;
    font-weight: 700;
}

.titleCustom:after {
    position: relative;
    width: 100%;
    height: 1px;
    content: '';
    background: #1f197a;
}

.textDescription {
    position: relative;
    padding: 20px 0;
    font-size: 16px;
    font-weight: 300;
    text-align: justify;
    line-height: 2;
}

.gap-5 {
    --gap: 5px;
    gap: var(--gap);
}

.gap-10 {
    --gap: 10px;
    gap: var(--gap);
}

.gap-20 {
    --gap: 20px;
    gap: var(--gap);
}

.gap-30 {
    --gap: 30px;
    gap: var(--gap);
}

.gap-40 {
    --gap: 40px;
    gap: var(--gap);
}

.gap-50 {
    --gap: 50px;
    gap: var(--gap);
}

.gap-60 {
    --gap: 60px;
    gap: var(--gap);
}

.gap-70 {
    --gap: 70px;
    gap: var(--gap);
}

.gap-80 {
    --gap: 80px;
    gap: var(--gap);
}

.customCarousel {
    overflow: hidden;
}


.sec2home .customCarousel {
    margin-top: 20px;
}

.itemConter {
    position: relative;
    display: flex;
    align-items: center;
    flex-direction: column;
    width: 100%;
    padding: 10px 0;
    text-align: center;
}

.itemConter .contentConter {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0px;
}

.itemConter .number {
    position: relative;
    font-size: 50px;
    color: #1a7939;
    font-weight: 700;
    line-height: 1;
}

.itemConter .titleCounter {
    position: relative;
    width: 100%;
    font-size: 15px;
    color: #858585;
    font-weight: 400;
}

.customCarousel .swiper-button-next,
.customCarousel .swiper-button-prev {
    color: #9b9b9b !important;
}

.customCarousel .swiper-button-next:after,
.customCarousel .swiper-button-prev:after {
    font-size: 36px;
}

.swiper-button-prev {
    right: 0px !important;
}

.swiper-button-next {
    left: 0px !important;
}

.sliderBox {
    position: relative;
    padding: 0px 40px;
    right: -40px;
    width: calc(100% + 80px);
    margin-top: 20px;
}

.sectionPY>.container,
.sec2pageText>.container,
.sec3about>.container,
.sec4detail>.container,
.sec2about>.container,
.sec3home>.container {
    padding-top: 70px;
    padding-bottom: 70px;
}

.sliderBox .NextPrevSlider {
    width: 100%;
    height: 0;
    margin: auto;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
}

.sec5home .sliderBox .NextPrevSlider {
    top: 0;
}

.sec5home .sliderBox .NextPrevSlider .swiper-button-next,
.sec5home .sliderBox .NextPrevSlider .swiper-button-prev {
    color: #fff !important;
}

.sec5home .sliderBox .NextPrevSlider .swiper-button-next:after,
.sec5home .sliderBox .NextPrevSlider .swiper-button-prev:after {
    font-size: 36px;
}

.sliderBox .NextPrevSlider .swiper-button-next {
    right: 0 !important;
    left: auto !important;
    margin: 0 !important;
    transform: none !important;
    top: -20px;
}

.sliderBox .NextPrevSlider .swiper-button-prev {
    left: 0 !important;
    right: auto !important;
    margin: 0 !important;
    transform: none !important;
    top: -20px;
}

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

.sec3home .sliderBox .swiper-button-prev:after,
.sec3home .sliderBox .swiper-button-next:after {
    font-size: 36px;
    font-weight: 100 !important;
}

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

.itemProject figure.pic {
    transition: all 0.2s;
    position: relative;
    width: 100%;
    overflow: hidden;
    border-top: 1px solid #e33035;
}

.itemProject:hover figure.pic {
    border-top: 1px solid #fff;
}

.itemDept .pic {
    border-top: 2px solid #e33035;
}

.itemDept .pic:after,
.itemProject figure.pic:after {
    position: absolute;
    bottom: 0;
    width: 100%;
    left: 0;
    height: 60%;
    background: linear-gradient(-345deg, #ed1b24b3, transparent, transparent);
    content: '';
    transition: al 0.5s;
}

.itemDept:hover .pic:after,
.itemProject:hover figure.pic:after {
    opacity: 0;
}

.itemProject figure.pic:before {
    position: relative;
    width: 100%;
    display: block;
    content: '';
    padding-top: 52%;
}

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

.sec2pageText .titleCustom .texttitle,
.sec3about .titleCustom .texttitle,
.sec4detail .titleCustom .texttitle,
.sec3home .titleCustom .texttitle {
    color: #fff;
}

.sec2pageText .titleCustom:after,
.sec3about .titleCustom:after,
.sec4detail .titleCustom:after,
.sec3home .titleCustom:after {
    background: #fff;
}

.itemProject .contentProj {
    position: relative;
    padding: 20px;
}

.itemProject .titleProject {
    position: relative;
    display: flex
;
    padding: 0px 10px;
    border-right: 4px solid #ed1b24;
    color: #fff;
    font-size: 22px;
    font-weight: 300;
}
.itemProject .contentProj p {
    font-size: 14px;
    color: #fff;
    text-align: justify;
    line-height: 1.6;
    padding: 10px 0;
    min-height: 85px;
    max-height: 85px;
    overflow: hidden;
}
.sec2pageText i.bg:before,
.sec3about i.bg:before,
.sec4detail i.bg:before,
.sec3home i.bg:before {
    position: absolute;
    left: 0;
    width: 90%;
    height: 70%;
    content: '';
    bottom: 0;
    /* filter: blur(101px); */
    background: linear-gradient(12deg, #00953c, transparent, transparent, transparent);
    transition: all 0.5s;
}

.sec2pageText:hover i.bg:before,
.sec3about:hover i.bg:before,
.sec4detail:hover i.bg:before,
.sec3home:hover i.bg:before {
    width: 100%;
    height: 100%;
    opacity: 0.7;
}

.itemHorizontlBlog i.hover,
.itemBlogOne i.hover,
.itemBlogSlide i.hover,
.galleryDetProj i.hover,
.itemProject i.hover {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
    background: rgba(19, 16, 76, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 28px;
    color: #fff;
    transition: all 0.5s;
    opacity: 0;
}

.itemHorizontlBlog:hover i.hover,
.itemBlogOne:hover i.hover,
.itemBlogSlide:hover i.hover,
.galleryDetProj:hover i.hover,
.itemProject:hover i.hover {
    opacity: 1;
}

.itemHorizontlBlog i.hover:after,
.itemBlogSlide i.hover:after,
.galleryDetProj i.hover:after,
.itemProject i.hover:after {
    position: absolute;
    top: 0;
    width: 100%;
    right: 0;
    height: 70%;
    background: linear-gradient(-165deg, #ed1b24b3, transparent, transparent);
    content: '';
}

.itemHorizontlBlog i.hover:before,
.itemBlogSlide i.hover:before,
.itemBlogOne i.hover:before,
.galleryDetProj i.hover:before,
.itemProject i.hover:before {
    transition: all 0.2s;
    opacity: 0;
    transform: scale(10);
    pointer-events: none;
}

.itemHorizontlBlog:hover i.hover:before,
.galleryDetProj:hover i.hover:before,
.itemBlogOne:hover i.hover:before,
.itemBlogSlide:hover i.hover:before,
.itemProject:hover i.hover:before {
    opacity: 1;
    transform: scale(1);
}

.colCustom.vcenter {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.sec4home {
    position: relative;
    padding: 50px 0;
}

.sec5detail .sliderBox .customCarousel,
.sec7detail .sliderBox .customCarousel,
.sec6home .sliderBox .customCarousel,
.sec4home .sliderBox .customCarousel {
    width: calc(100vw - var(--contoffsetleft));
    left: 0;
}

.titleCustomMore {
    margin-bottom: 60px;
}

.itemAdmin,
.itemDept {
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.itemAdmin .pic,
.itemDept .pic {
    position: relative;
}

.itemAdmin .pic:before,
.itemDept .pic:before {
    position: relative;
    width: 100%;
    display: block;
    content: '';
    padding-top: 107%;
}

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

.itemAdmin .pic i.hover, .itemDept .pic i.hover {
    position: absolute !important;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(19, 16, 76, 0.5);
    display: flex
;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: 22px;
    opacity: 0;
    transition: all 0.5s;
}

.itemAdmin:hover .pic i.hover,
.itemDept:hover .pic i.hover {
    opacity: 1;
}

.itemAdmin .pic i.hover:after,
.itemDept .pic i.hover:after {
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    height: 80%;
    content: '';
    background: linear-gradient(-169deg, #ed1b24c4, transparent, transparent, transparent);
}

.itemDept .titleDept {
    position: relative;
    display: flex;
    padding: 0px 10px;
    color: #454547;
    font-size: 18px;
    font-weight: 300;
    border-right: 2px solid #ed1b24;
}

.itemAdmin .contentAdmin {
    position: relative;
    padding: 0px 10px;
    color: #454547;
    font-size: 18px;
    font-weight: 400;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.itemAdmin .contentAdmin,
.itemDept .contentDept {
    position: relative;
    padding: 15px;
}

.itemAdmin .contentAdmin .nameAdmin {
    position: relative;
    display: flex;
    border-right: 4px solid red;
    padding: 5px 20px 5px 0;
}

.itemAdmin .contentAdmin .nameAdmin {
    position: relative;
    display: flex;
    border-right: 4px solid red;
    padding: 5px 20px 5px 0;
}

.sec5home {
    position: relative;
    padding: 50px 0;
}

.sec5home .titleCustomMore .texttitle {
    color: #fff;
}

.sec5home .sliderBox {
    position: relative;
    padding: 0px 40px;
    right: -40px;
    width: calc(100% + 80px);
    margin: -30px 0 -40px;
    CONTAIN-INTRINSIC-BLOCK-SIZE: AUTO 100PX;
}

.titleWhite .rowBtnMore:before {
    background: #c8c8c8 !important;
}

.titleWhite .texttitle {
    color: #fff;
}

.titleWhite .rowBtnMore:after {
    background: url(../img/endRowMore1.png) no-repeat bottom left / 100%;
}

.titleWhite .rowBtnMore .btnMoreBlank {
    color: #fff;
}

.titleWhite .rowBtnMore .btnMoreBlank:hover {
    color: #ed6a1b;
}

.sec5home .swiper-wrapper {
    padding: 50px 0;
}

.itemBrand {
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
    padding: 30px 20px;
}

.itemBrand i.border:before {
    position: absolute;
    top: -40px;
    left: 15%;
    width: 40%;
    height: 50%;
    content: '';
    background: #fff;
    border-radius: 100%;
    filter: blur(41px);
    opacity: 0.3;
}

.itemBrand i.border:after {
    position: absolute;
    bottom: -40px;
    right: 15%;
    width: 40%;
    height: 50%;
    content: '';
    background: #fff;
    border-radius: 100%;
    filter: blur(41px);
    opacity: 0.3;
}

.itemBrand i.border {
    transition: all 0.2s;
    opacity: 0;
    overflow: hidden;
}

.itemBrand:hover i.border {
    opacity: 1;
}

.itemBrand i.border,
.itemBrand i.border i {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.itemBrand i.border i:before {
    position: absolute;
    top: 0;
    right: 0;
    height: 1px;
    width: 80%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    content: '';
}

.itemBrand i.border i:after {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 1px;
    width: 80%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    content: '';
}

.itemBrand figure.pic {
    position: relative;
    width: 100%;
    display: flex;
    filter: grayscale(1) brightness(2);
    transition: all 0.5s;
}

.itemBrand:hover figure.pic {
    filter: grayscale(0) brightness(1);
}

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

.itemBrand figure.pic:before {
    position: relative;
    display: block;
    content: '';
    padding-top: 28%;
}

.itemBrand .contentBrand {
    position: absolute;
    left: 0;
    bottom: -6px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 0 40px;
}

.itemBrand .contentBrand .titleBrand {
    position: relative;
    color: #ed1b24;
    font-weight: 400;
    transition: all 0.2s;
    transform: translateX(70%);
    opacity: 0;
    font-size: 26px;
    bottom: -3px;
}

.itemBrand:hover .contentBrand .titleBrand {
    transform: translateX(0%);
    opacity: 1;
}

.itemBrand .link {
    position: absolute;
    bottom: -20px;
    right: 20%;
    width: 40px;
    height: 40px;
    color: #fff;
    transition: all 0.2s;
    opacity: 0;
    transform: translateX(-30%);
}

.itemBrand:hover .link {
    opacity: 1;
    transform: translateX(0%);
}

.itemBrand .link:before {
    position: absolute;
    bottom: 0;
    right: 0%;
    background: linear-gradient(0deg, #343434, #000000);
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: 18px;
    border-radius: 100%;
    z-index: 2;
}

.itemBrand .link:after {
    position: absolute;
    bottom: -1px;
    right: -1px;
    background: linear-gradient(-35deg, rgba(255, 255, 255, 0.4), #000000);
    width: 42px;
    height: 42px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: 18px;
    border-radius: 100%;
    content: '';
    z-index: 1;
}

/* .sectionPY, */
.sec6about,
.sec6home {
    padding: 40px 0 110px;
}

.sec5detail .customCarousel,
.sec7detail .customCarousel,
.sec6about .customCarousel {
    min-width: calc(100vw - var(--contoffsetleft));
}

.sectionPY .customCarousel .swiper-wrapper,
.sec6about .customCarousel .swiper-wrapper {
    padding-bottom: 40px;
}

.swiper-pagination-progressbar {
    position: absolute !important;
    right: 40px !important;
    height: 2px !important;
    width: calc(100% - 40px) !important;
    background-color: #28227a !important;
    width: calc((100% - 40px) + var(--contoffsetleft)) !important;
}

.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    left: auto !important;
    right: 0 !important;
    transform-origin: right top !important;
    background-color: #ed1b24 !important;
    height: 6px !important;
    top: -2px !important;
}

.listDeepLook .col {
    position: relative;
    width: 100%;
    display: flex;
    gap: 40px;
    flex-direction: column;
    justify-content: center;
}

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


.itemBlog {
    position: relative;
    display: flex
;
    flex-direction: column;
    padding: 0 10px 10px;
    background: #eaeaea;
    transition: all 0.2s;
    overflow: hidden;
    border-radius: 30px 0;
    padding-top: 10px;
}

.itemVideo {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 0;
    transition: all 0.2s;
}

.itemBlog:hover {
    background: #dbdbdb;
}

.itemVideo .contentBlog,
.itemBlog .contentBlog {
    position: relative;
    padding: 10px;
}

.itemVideo .pic:before,
.itemBlog .pic:before {
    position: relative;
    width: 100%;
    padding-top: 67%;
    content: '';
    display: block;
    pointer-events:none !important;
}
.itemVideo .pic:before {
    padding-top: 56%;
}
.itemVideo .pic,
.itemBlog .pic {
    position: relative;
}

.itemVideo .pic i.hover,
.itemBlog .pic i.hover {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgba(31, 25, 122, 0.5);
    color: #fff;
    font-size: 24px;
    transition: all 0.2s;
    opacity: 0;
}

.itemVideo:hover .pic i.hover,
.itemBlog:hover .pic i.hover {
    opacity: 1;
}

.itemVideo .pic i.hover:after,
.itemBlog .pic i.hover:after {
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    height: 80%;
    content: '';
    background: linear-gradient(-169deg, #ed1b24c4, transparent, transparent, transparent);
}

.itemVideo .pic:after, .itemBlog .pic:after {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 80%;
    content: '';
    background: linear-gradient(30deg, #ed1b24c4, transparent, transparent, transparent);
    transition: all 0.2s;
    pointer-events: none !important;
}

.itemVideo:hover .pic:after,
.itemBlog:hover .pic:after {
    opacity: 0;
}

.itemVideo .pic .rowDate, .itemBlog .pic .rowDate {
    position: absolute;
    left: 10px;
    top: 4px;
    background: #ed1b24;
    z-index: 3;
    height: 40px;
    padding: 0 20px;
    display: flex;
    align-items: center;
    color: #fff;
    font-size: 18px;
    border-radius: 25px 0 25px 0;
    font-weight: 300;
}
.itemVideo .pic .h_iframe-aparat_embed_frame {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}
.itemVideo .pic img,
.itemBlog .pic img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.itemVideo .contentBlog .titleBlog, .itemBlog .contentBlog .titleBlog {
    position: relative;
    /* height: 50px; */
    display: flex;
    align-items: center;
    font-size: 18px;
    font-weight: 600;
    color: rgb(54 54 54 / 80%);
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    margin: 10px 0;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.2;
    /* max-height: calc(1.2em * 2); */
}
.itemVideo .contentBlog .titleBlog:before,
.itemBlog .contentBlog .titleBlog:before {
    position: relative;
    width: 6px;
    height: 100%;
    top: 0;
    right: -18px;
    content: '';
    background: #ed1b24;
    display: block;
}

.itemVideo .contentBlog p, .itemBlog .contentBlog p {
    position: relative;
    text-align: justify;
    font-size: 14px;
    font-weight: 400;
    color: rgb(39 39 39 / 80%);
    min-height: 95px;
    /* max-height: 95px; */
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
    overflow: hidden;
    text-overflow: ellipsis;
    /* line-height: 1.2; */
}

.hoverlink {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: block;
    z-index: 10;
    opacity: 0;
    z-index: 1000;
}


.sec7home {
    position: relative;
    padding: 60px 0;
}

.sec7home i.bg {
    mix-blend-mode: multiply;
    opacity: 20%;
}

.sec7home .textDescription {
    margin-top: 30px;
}


.listDeepLook {
    position: relative;
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 50px;
    row-gap: 40px;
    padding: 40px 20px;
}

.sec7home .svg-elem-1 {
    stroke-dashoffset: 9025.37109375px;
    stroke-dasharray: 9025.37109375px;
    -webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0s;
    transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0s;
}

.sec7home.active .svg-elem-1 {
    stroke-dashoffset: 0;
    -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;
}

.sec7home.active .bglogoline2 .svg-elem-1 {
    transition-delay: 1s;
}

.itemDeepLock {
    position: relative;
    width: 100%;
    max-width: 500px;
    display: flex;
    flex-direction: column;
    margin: 0 auto;
    transition: all 0.5s;
    opacity: 0 !important;
    transform: translateY(30px);
}

.itemDeepLock.active {
    transition-delay: 0.5s;
    opacity: 1 !important;
    transform: translateY(0);
}


.listDeepLook .col:nth-child(1) article.itemDeepLock:nth-child(1) {
    right: 7%;
}

.listDeepLook .col:nth-child(1) article.itemDeepLock:nth-child(2) {
    right: -5%;
}

.listDeepLook .col:nth-child(1) article.itemDeepLock:nth-child(3) {
    right: 5%;
}

.listDeepLook .col:nth-child(2) article.itemDeepLock:nth-child(1) {
    right: 4%;
}

.listDeepLook .col:nth-child(2) article.itemDeepLock:nth-child(2) {
    right: -6% !important;
}

.itemDeepLock .pic {
    position: relative;
    border-top: 5px solid #e33035;
}

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

.itemDeepLock .pic:after {
    position: absolute;
    bottom: 0;
    width: 100%;
    left: 0;
    height: 60%;
    background: linear-gradient(-345deg, #ed1b24b3, transparent, transparent);
    content: '';
    transition: al 0.5s;
}

.itemDeepLock:hover .pic:after {
    opacity: 0;
}

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

.itemDeepLock .pic i.hover {
    position: absolute !important;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(19, 16, 76, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: 22px;
    opacity: 0;
    transition: all 0.5s;
}

.itemDeepLock:hover .pic i.hover {
    opacity: 1;
}

.itemDeepLock .pic i.hover:after {
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    height: 80%;
    content: '';
    background: linear-gradient(-169deg, #ed1b24c4, transparent, transparent, transparent);
}

.itemDeepLock .titleDept {
    position: relative;
    display: flex;
    padding: 0px 10px;
    border-right: 4px solid #ed1b24;
    color: #454547;
    font-size: 24px;
    font-weight: 400;
}

.itemDeepLock .contentDept {
    position: relative;
    padding: 15px;
}

.sec7home .bglogoline1 {
    position: absolute;
    top: 261px;
    left: -10%;
    width: 70%;
    height: auto;
    opacity: 0.3;
}

.sec7home .bglogoline2 {
    position: absolute;
    bottom: 15%;
    right: -20%;
    width: 80%;
    height: auto;
    opacity: 0.3;
}




.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);
    pointer-events: auto;
}

.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);
}

.sec8home {
    padding: 40px 0 40px;
}

.sec8about {
    padding: 40px 0 40px;
    background: var(--bgcolor2);
}

.sec8about .swiper-wrapper,
.sec8home .swiper-wrapper {
    padding: 40px 0 100px !important;
}

.itemCertificate {
    position: relative;
    display: flex;
    flex-direction: column;
    transition: all 0.2s;
    width: calc(100% - 20px) !important;
    margin: auto;
    left: 0;
    right: 0;
}

.itemCertificate:before {
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    bottom: 50px;
    height: 20px;
    background: #6e6e6e;
    content: '';
    display: block;
    transform: perspective(1000px) rotateX(45deg) translate(0px, 0px);
    filter: blur(10px);
    opacity: 1;
    transition: all 0.2s;
}

.itemCertificate .title:before {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 4px;
    height: 30px;
    content: '';
    background: #ed1b24;
}

.itemCertificate:hover:before {
    transform: perspective(1000px) rotateX(45deg) translate(0px, 110px);
    opacity: 0.5;
}

.itemCertificate:hover {
    transform: scale(1.1);
}

.itemCertificate .pic {
    position: relative;
    width: 100%;
    display: block;
    margin-bottom: 20px;
}

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

.itemCertificate i.hover {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
    background: rgba(19, 16, 76, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 28px;
    color: #fff;
    transition: all 0.5s;
    opacity: 0;
    z-index: 2;
}

.itemCertificate:hover i.hover {
    opacity: 1;
}

.itemCertificate i.hover:after {
    position: absolute;
    top: 0;
    width: 100%;
    right: 0;
    height: 70%;
    background: linear-gradient(-165deg, #ed1b24b3, transparent, transparent);
    content: '';
}

.itemCertificate i.hover:before {
    transition: all 0.2s;
    opacity: 0;
    transform: scale(10);
    pointer-events: none;
}

.itemCertificate:hover i.hover:before {
    opacity: 1;
    transform: scale(1);
}

.itemCertificate .pic .frame {
    position: absolute;
    width: 100%;
    top: 0;
    height: 100%;
    background: no-repeat center / cover;
    z-index: 3;
}

.itemCertificate .pic img {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 83%;
    left: 0;
    right: 0;
    height: 86%;
    object-fit: cover;
    margin: auto;
    z-index: 2;
}

.itemCertificate .title {
    position: absolute;
    height: 40px;
    bottom: auto;
    right: 0 !important;
    left: 0 !important;
    width: 100% !important;
    z-index: 2;
    top: 100% !important;
    display: flex;
    align-items: center;
    padding: 0 20px 0 0;
    font-size: 18px;
    font-weight: 300;
}

.sec8about .itemCertificate .title {
    color: #fff;
}

.sec8home .itemCertificate .title {
    transition: all 0.2s;
    opacity: 0;
    transform: translateY(-38px);
}

.sec8home .itemCertificate:hover .title {
    transition: all 0.2s;
    opacity: 1;
    transform: translateY(0px);
}

.titleCustomMore.titleWhite .texttitle small.subtitle {
    font-size: 16px;
    font-weight: 400;
    color: #0ec74b;
}

/* .swiper-slide {
    transition: all 0.2s;
    transition-delay: 0s !important;
}
.swiper-slide.itemCenter {
    position: relative;
    transform: scale(1.4);
    z-index: 20;
}
.swiper-slide.itemleft-1 {
    transform: scale(1) translateX(-40%);
    z-index: 10;
}
.swiper-slide.itemright-1 {
    transform: scale(1) translateX(40%);
    z-index: 10;
}
.swiper-slide.itemleft-2 {
    transform: scale(.8) translateX(-110%);
    z-index: 9;
}
.swiper-slide.itemright-2 {
    transform: scale(.8) translateX(100%);
    z-index: 9;
}
.swiper-slide.itemleft-3 {
    transform: scale(.6) translateX(-220%) !important;
    z-index: 8;
}
.swiper-slide.itemright-3 {
    transform: scale(.6) translateX(220%) !important;
    z-index: 8;
}
.swiper-slide.itemleft-4 {
    transform: scale(.4) translateX(-200%);
    z-index: 7;
}
.swiper-slide.itemright-4 {
    transform: scale(.4) translateX(200%);
    z-index: 7;
}
.swiper-slide.itemleft-5 {
    transform: scale(.2) translateX(-260%);
    z-index: 6;
}
.swiper-slide.itemright-5 {
    transform: scale(.2) translateX(260%);
    z-index: 6;
} */


.sec8about .sliderBox,
.sec8home .sliderBox {
    overflow: hidden;
}

.sec8about .sliderBox .customCarousel,
.sec8home .sliderBox .customCarousel {
    overflow: unset !important;
}
.sec3about i.bg {
    animation: bgBurn 10s infinite linear;
}
.sec4detail i.bg {
    animation: bgBurn 10s infinite linear;
}
.newsLetter {
    position: relative;
    width: 100%;
    padding: 30px 0 !important;
    overflow: hidden;
}

.newsLetter i.bg {
    background: no-repeat center / cover;
    animation: bgBurn 10s infinite linear;
}

.newsLetter .colCustom:first-child {
    display: flex;
    flex-direction: column;
    color: #fff;
}

.titleNewsletter {
    position: relative;
    font-size: 22px;
    font-weight: 600;
}

.textNewsletter {
    position: relative;
    font-size: 16px;
}

.newsLetter .colCustom:last-child {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.frmNewsletter {
    position: relative;
    display: flex;
    width: 90%;
    border-right: 4px solid #0f6628;
}

.frmNewsletter .inputNewsletter {
    position: relative;
    height: 60px;
    padding: 0 20px 0 160px;
    font-size: 20px;
    direction: ltr;
    width: 100%;
    border: none !important;
    outline: none !important;
    border-radius: 30px 0 0 0 !important;
    background: #fff !important;
    text-align: right;
    font-weight: 200;
}

.frmNewsletter .btnNewsletter {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    left: 5px;
    height: 50px;
    border-radius: 25px 0px 25px 0px !important;
    font-size: 18px;
    padding: 0 40px;
    border: none !important;
    background: #1a1567 !important;
    color: #fff ! IMPORTANT;
    min-height: unset !important;
    font-weight: 300;
    cursor: pointer;
}

.frmNewsletter .btnNewsletter:hover {
    background: #ed1b24 !important;
}

footer {
    position: relative;
    background: #28227a;
    color: #fff;
    padding-bottom: 30px;
}

footer i.bg {
    opacity: 0.3;
    mix-blend-mode: multiply;
}

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

.topFooter .container {
    position: relative;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.titleFooter {
    font-size: 20px;
    color: #ed1b24 !important;
    font-weight: 600 !important;
    margin-bottom: 10px !important;
    display: block;
}

.contentColFooter {
    position: relative;
    display: flex;
    padding-right: 20px;
    flex-direction: column;
    gap: 10px;
}

ul.footerlinks a {
    position: relative;
    display: flex;
    padding: 5px 0;
    color: #fff;
    font-size: 16px;
}

.addressFootre,
.itemcallfooter,
.itemcallfooter * {
    color: #fff;
    font-size: 16px;
}

ul.footerlinks a:hover,
.itemcallfooter a:hover {
    color: #06d349;
}

.subfooter {
    position: relative;
    width: 100%;
    padding: 30px 0;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgb(0 0 0 / 28%);
    font-size: 16px;
    color: #fff !important;
}

.subfooter a.powerby {
    color: #fff;
}

.contentColFooter i.line {
    position: absolute;
    top: 0;
    right: 0;
    width: 2px;
    background: #1a7939;
    height: 50%;
}

.contentColFooter i.line i {
    position: absolute;
    top: calc(100% + 5px);
    width: 100%;
    height: 35px;
    display: block;
    content: '';
    background: #1a7939;
}

.contentColFooter i.line i:before {
    position: absolute;
    top: calc(100% + 10px);
    height: 25px;
    width: 100%;
    left: 0;
    display: block;
    content: '';
    background: #1a7939;
}

.contentColFooter i.line i:after {
    position: absolute;
    top: calc(100% + 60px);
    height: 5px;
    width: 100%;
    left: 0;
    display: block;
    content: '';
    background: #1a7939;
}

.itemcallfooter a {
    direction: ltr !important;
    unicode-bidi: plaintext;
}

.contentColFooter .socialIcons {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: center;
    gap: 5px;
    margin-top: 20px;
}

.contentColFooter .socialIcons a.socicon {
    width: 35px;
    height: 35px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff !important;
    border: 2px solid #fff;
    border-radius: 100%;
    font-size: 19px;
    transition: all 0.2s;
}

.contentColFooter .socialIcons a.socicon:hover {
    transform: scale(1.1);
}

.contentColFooter .socialIcons a.socicon.aparat:before {
    position: relative;
    content: '';
    width: 18px;
    height: 18px;
    display: block;
    background: url(../img/aparat.svg) no-repeat center / 100%;
    filter: invert(1);
    left: -1px;
    top: -1px;
    transition: all 0.2s;
}

.contentColFooter .socialIcons a.socicon.aparat:hover:before {
    filter: invert(1);
}

.heart {
    animation: heartbeat 1s infinite linear;
    display: inline-block !important;
}

@keyframes heartbeat {
    0% {
        transform: scale(1)
            /* rotate(-45deg); */
    }

    40% {
        transform: scale(1.25)
            /* rotate(-45deg); */
    }

    50% {
        transform: scale(1)
            /* rotate(-45deg); */
    }

    60% {
        transform: scale(1.25)
            /* rotate(-45deg); */
    }

    80% {
        transform: scale(1.5)
            /* rotate(-45deg); */
    }

}

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

.pageTitle .breadShare {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.sec3home .container .titleCustom {
    padding: 0 60px;
}

.sec3home .container .textDescription {
    padding: 20px 60px !important;
    color: #fff !important;
}

.sec3home .container .sliderBox {
    padding: 0 100px;
}




.pageTitle .container {
    padding: 30px;
}

ol.breadcrumbs {
    position: relative;
    display: flex;
    align-items: center;
    gap: 5px;
}

ol.breadcrumbs li {
    position: relative;
    padding-left: 20px;
    min-height: 20px;
    display: flex;
    align-items: center;
    text-wrap: nowrap;
}

ol.breadcrumbs li:last-child {
    padding-left: 0px;
}

ol.breadcrumbs li:before {
    position: absolute;
    left: 0;
    top: 0;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

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


.shareBox {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    color: #595959;
}

.shareBox .socialIcons {
    position: relative;
    display: flex;
    align-items: center;
    gap: 5px;
}

.shareBox .socialIcons a.socicon {
    position: relative;
    width: 35px;
    height: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 2px solid #595959;
    border-radius: 100%;
    color: #595959;
    font-size: 20px;
}

.divPuzzlePics {
    position: relative;
    display: flex;
    flex-direction: column;
}

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

.sec1about .colCustom {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.rowBtns {
    position: relative;
    width: 100%;
    display: flex;
    gap: 20px;
}

.moreBtn,
.customLink {
    position: relative;
    height: 50px;
    display: flex;
    align-items: center;
    padding: 0 40px;
    background: transparent;
    border-radius: 20px 0;
    border: 2px solid #1a1567;
    color: #1a1567;
    font-weight: 600;
    font-size: 16px;
    transition: all 0.2s;
    cursor: pointer;
}

.customLink:hover {
    background: #1a1567;
    color: #fff ! IMPORTANT;
}

.moreBtn {
    gap: 10px;
    padding-left: 25px;
    padding-right: 30px;
}

.moreBtn:hover {
    background: #eee !important;
    color: #1a1567 !important;
}

.moreBtn:after {
    position: relative;
    background: url(/dist/img/iconMore.png) no-repeat center / 19px;
    width: 19px;
    height: 15px;
    display: block;
    content: '';
}

.itemPuzzle {
    position: relative;
    width: 45%;
    border: 4px solid #fff;
}

.sec1about {
    position: relative;
    overflow: hidden;
    width: 100%;
    padding-bottom: 100px;
}

.sec1about .topTitle {
    font-family: iranNastaliq;
    font-size: 88px;
    font-weight: 100;
    color: #28227a;
    line-height: 1.3;
}

.sec1about .title {
    position: relative;
    font-weight: 400;
    color: #e33035;
    font-size: 32px;
}

.sec1about .description {
    position: relative;
    padding: 10px 0;
    line-height: 1.8;
    font-size: 16px;
    font-weight: 400;
    text-align: justify;
}

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

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

.itemPuzzle.item1 {
    margin-right: -30%;
}

.itemPuzzle.item2 {
    margin: -13% 0% 0% -45%;
}

.itemPuzzle.item3 {
    margin: -10% -60% 0% 0%;
}

.itemPuzzle.item4 {
    margin: -13% 10% 0% 0%;
}

.sec1about:before {
    position: absolute;
    top: -30%;
    right: -30%;
    width: 80%;
    height: 50%;
    background: #bbffe0;
    content: '';
    border-radius: 100%;
    filter: blur(71px);
}

.sec1about:after {
    position: absolute;
    bottom: -40%;
    left: -20%;
    width: 60%;
    height: 50%;
    background: #db2d44;
    content: '';
    border-radius: 100%;
    filter: blur(200px);
    opacity: 0.8 !important;

}

.sec1about i.bg:before {
    position: absolute;
    bottom: 0%;
    top: 0%;
    right: -20%;
    width: 40%;
    height: 80%;
    background: #b2adff;
    content: '';
    border-radius: 100%;
    filter: blur(230px);
    opacity: 0.8 !important;
    margin: auto;
}










.contentPagetext {
    line-height: 2;
    text-align: justify;
}

.widget-hrbVideo {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 40px 0 0;
}

.sec4detail i.bg,
.sec2pageText i.bg,
.sec3about i.bg {
    background: no-repeat center / cover;
}

.h_iframe-aparat_embed_frame {
    position: relative;
}

.h_iframe-aparat_embed_frame .ratio {
    display: block;
    width: 100%;
    height: auto;
}

.h_iframe-aparat_embed_frame iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.hrbVideo .hrb-custom-embed-video,
.hrbVideo .hrb-custom-embed-video * {
    height: 100%;
    width: 100%;
    border: none !important;
}
figure.pic {
    border-radius: 30px 0;
    overflow: hidden;
}
.hrbVideo {
    position: relative;
    width: 100%;
    max-width: 1024px;
    margin: auto;
    overflow: hidden;
    border-radius: 30px 0px 30px 0;
}

.hrbVideo .pic {
    position: relative;
    width: 100%;
    display: block;
    z-index: 10;
}

.hrbVideo .pic:before {
    position: relative;
    width: 100%;
    display: block;
    content: '';
    padding-top: 57%;
    z-index: 2;
    background: #000000;
    opacity: 0.3;
}

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

.hrbVideo .custom-embed-video-iframe {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: block;
}

.hrbVideo i.play {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: no-repeat center / 80px;
    z-index: 10;
    transition: all 0.2s;
    cursor: pointer;
    background-color: transparent !important;
}

.hrbVideo:hover i.play {
    transform: scale(1.2);
}

textarea.hrb-embed-video {
    display: none !important;
}

.hrbVideo .hrb-custom-embed-video {
    z-index: 30;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 1;
    pointer-events: auto;
}

.hrbVideo.play .hrb-custom-embed-video {
    opacity: 1;
    pointer-events: auto;
}

.boxMore {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 30px !important;
}

.contentBoxMore {
    line-height: 2;
    text-align: justify;
    max-height: 300px;
    overflow: hidden;
    transition: max-height 0.5s ease;
}

.boxMore.open .contentBoxMore {
    max-height: 10000px;
}

.boxMore.open .moreBtn:after {
    transform: rotate(180deg);
}

.sec1about .bglogoline1 {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    height: 80% !important;
    width: auto;
    z-index: 1;
}



.sliderHistoryItems .swiper-wrapper {
    display: flex;
    align-items: center;
}

.sliderHistoryItems .swiper-slide:nth-child(odd) {
    width: 40% !important;
}

.sliderHistoryItems .swiper-slide:nth-child(even) {
    width: 30% !important;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

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

.sliderHistoryItems .itemHistory figure.pic {
    position: relative;
    width: 100%;
    display: flex;
}

.sliderHistoryItems .itemHistory figure.pic:before {
    position: relative;
    width: 100%;
    display: block;
    content: '';
    padding-top: 115%;
    background: red;
}

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

.sliderHistoryItems .itemHistory .contentHistory {
    position: absolute;
    bottom: 0;
    right: 0;
    padding: 30px;
    color: #fff;
    z-index: 1;
    width: 100%;
}

.sec4about {
    position: relative;
    padding: 70px 0;
}

.sec4about:before {
    position: absolute;
    bottom: -10px;
    left: 0;
    width: 100%;
    background: var(--bgcolor2);
    content: '';
    display: block;
    height: 40%;
}

.sec4about .sliderBox.sliderHistory {
    padding: 0;
    right: 0 !important;
}

.sec4about .sliderBox.sliderHistory .sliderHistoryItems {
    overflow: visible;
}

.itemHistory:before {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    content: '';
    background: rgba(0, 0, 0, 0.5);
    height: 40px;
    transform: perspective(1000px) rotateX(45deg);
    filter: blur(13px);
    opacity: 0;
    transition: all 0.2s;
}

.itemHistory:hover:before {
    transform: perspective(1000px) rotateX(45deg) translateY(100px);
    opacity: 1;
}

.itemHistory i.hover {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
    background: rgba(19, 16, 76, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 28px;
    color: #fff;
    transition: all 0.5s;
    opacity: 0;
}

.itemHistory:hover i.hover {
    opacity: 1;
}

.itemHistory i.hover:after {
    position: absolute;
    top: 0;
    width: 100%;
    right: 0;
    height: 70%;
    background: linear-gradient(-165deg, #ed1b24b3, transparent, transparent);
    content: '';
}

.itemHistory i.hover:before {
    transition: all 0.2s;
    opacity: 0;
    transform: scale(10);
    pointer-events: none;
}

.itemHistory:hover i.hover:before {
    opacity: 1;
    transform: scale(1);
}

.itemHistory .titleHis {
    position: relative;
    font-size: 28px;
    padding-right: 20px;
    border-right: 4px solid red;
    font-weight: 400;
}

.itemHistory .captionHis {
    position: relative;
    font-size: 16px;
    line-height: 1.8;
    padding: 10px 0;
}

.sliderHistoryItems .itemHistory .contentHistory:before {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, rgba(8, 6, 44, 1), transparent);
    content: '';
}

.sec4about .sliderBox.sliderHistory .sliderHistoryItems .swiper-wrapper {
    padding: 40px 0 60px;
}



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

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

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

.itemSanaye .pic:before {
    position: relative;
    display: block;
    content: '';
    padding-top: 61%;
}


.itemSanaye i.hover {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
    background: rgba(19, 16, 76, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 28px;
    color: #fff;
    transition: all 0.5s;
    opacity: 0;
}

.itemSanaye:hover i.hover {
    opacity: 1;
}

.itemSanaye i.hover:after {
    position: absolute;
    top: 0;
    width: 100%;
    right: 0;
    height: 70%;
    background: linear-gradient(-165deg, #ed1b24b3, transparent, transparent);
    content: '';
}

.itemSanaye i.hover:before {
    transition: all 0.2s;
    opacity: 0;
    transform: scale(10);
    pointer-events: none;
}

.itemSanaye:hover i.hover:before {
    opacity: 1;
    transform: scale(1);
}

.mb-50 {
    margin-bottom: 50px;
}

.mb-40 {
    margin-bottom: 40px;
}

.mb-30 {
    margin-bottom: 30px;
}

.mb-20 {
    margin-bottom: 20px;
}

.mb-10 {
    margin-top: 10px;
}

.mt-50 {
    margin-top: 50px;
}

.mt-40 {
    margin-top: 40px;
}

.mt-30 {
    margin-top: 30px;
}

.mt-20 {
    margin-top: 20px;
}

.mt-10 {
    margin-top: 10px;
}

.sec7about img {
    width: 100%;
}

.sec7about ol {
    position: relative;
    padding: 0 20px 0 0 !important;
    font-size: 18px;
    line-height: 2.5;
}

.secpage {
    padding: 40px 0;
}

.picPage {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: center;
    margin-bottom: 10px;
}

.boxMore img,
.picPage img {
    max-width: 100%;
}



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

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

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

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


.itemGall i.hover {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
    background: rgba(19, 16, 76, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 28px;
    color: #fff;
    transition: all 0.5s;
    opacity: 0;
}

.itemGall:hover i.hover {
    opacity: 1;
}

.itemGall i.hover:after {
    position: absolute;
    top: 0;
    width: 100%;
    right: 0;
    height: 70%;
    background: linear-gradient(-165deg, #ed1b24b3, transparent, transparent);
    content: '';
}

.itemGall i.hover:before {
    transition: all 0.2s;
    opacity: 0;
    transform: scale(10);
    pointer-events: none;
}

.itemGall:hover i.hover:before {
    opacity: 1;
    transform: scale(1);
}

.catalogList {
    position: relative;
    padding: 0px 0px 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 30px;
}

.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;
    flex-direction: row-reverse
}

.pagination a {
    margin: 0 !important
}

.pagination .pageLink {
    position: relative;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 16px;
    border-radius: 0;
    transition: all 0.2s;
    background: #dfdfdf47;
    /* display: none; */
    color: #000 !important;
    border: none !important;
}

.pagination span.pageLink {
    background: #28227a !important;
}

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

.pagination .pageLink:hover {
    background: rgb(255 87 34 / 18%);
    color: #fff
}

.pagination .pageLink:active {
    background: rgb(255 87 34 / 100%);
    color: #fff
}

.pagination span.pageLink {
    color: #fff !important;
    background: rgb(255 87 34 / 100%) !important;
    border-width: 1px 0 !important;
    pointer-events: none !important;
}

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: transparent;
    font-size: 18px
}

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: transparent;
    font-size: 18px
}

a.nextPage:hover,
a.prevPage:hover {
    color: rgb(255 87 34 / 100%)
}

a.nextPage:active,
a.prevPage:active {
    color: rgb(255 87 34 / 40%)
}

.Moavenin,
.DepartmentsList {
    position: relative;
    width: 100%;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.Projects,
.heyatModire {
    position: relative;
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.Projects .itemProject .titleProject {
    color: #333;
}

.Services {
    position: relative;
    width: 100%;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.sahamdaranList {
    position: relative;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.itemSahamdar {
    position: relative;
    width: 100%;
    margin-bottom: 50px;
}

.itemSahamdar figure.pic {
    position: relative;
    width: 100%;
}

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

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

.itemSahamdar figure.pic .brand {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(40, 34, 122, 60%);
    display: flex
;
    justify-content: center;
    align-items: center;
}

.itemSahamdar figure.pic .brand img {
    max-width: 80%;
    height: auto !important;
    left: 0;
    position: relative;
}

.itemSahamdar .contentBrand {
    position: absolute;
    bottom: 0;
    right: 0;
    padding: 20px;
    color: #fff;
}

.itemSahamdar i.link {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
    background: #1f197abd;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 28px;
    color: #fff;
    transition: all 0.5s;
    opacity: 0;
}

.itemSahamdar:hover i.link {
    opacity: 1;
}

.itemSahamdar i.link:after {
    position: absolute;
    top: 0;
    width: 100%;
    right: 0;
    height: 70%;
    background: linear-gradient(-165deg, #ed1b24b3, transparent, transparent);
    content: '';
}

.itemSahamdar i.link:before {
    transition: all 0.2s;
    opacity: 0;
    transform: scale(10);
    pointer-events: none;
}

.itemSahamdar:hover i.link:before {
    opacity: 1;
    transform: scale(1);
}

.itemSahamdar .titleBrand {
    font-size: 22px;
    font-weight: 400 !important;
}

.itemSahamdar .titleRealSahamdar {
    position: absolute;
    top: 100%;
    right: 0;
    width: 100%;
    padding: 0 20px 0 0;
    height: 50px;
    display: flex;
    align-items: center;
    font-weight: 500;
}

.itemSahamdar .titleRealSahamdar:before {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    right: 0;
    width: 5px;
    height: 35px;
    background: #e33035;
    content: '';
}




/*SliderGallery Start */
.contentGallery {
    position: relative;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;
    width: 100%;
    padding: 20px;
    gap: 20px;
    background: #fff;

}

.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) - 15px);
    background: no-repeat center / cover;
    transition: all 0.5s;
    overflow: hidden;
    border-radius: 30px 0;
}

.contentGallery.fourcol .boxGall {
    width: calc((100% / 4) - 15px);
    box-sizing: border-box !important;
}

.boxGall .titleBoxGall {
    position: absolute !important;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    min-height: 50px;
    color: #fff;
    font-weight: bold;
    font-size: 16px;
    bottom: 0;
    width: 100%;
    pointer-events: none;
    padding: 20px;
    max-width: calc(100% - 40px);
    background: #28227a;
    margin: auto;
    left: 0;
    right: 0;
    border-radius: 10px 10px 0 0;
}

.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: rgba(19, 16, 76, 0.5);
    opacity: 0;
    transition-delay: 0.5s;
    overflow: hidden;
    border-radius: 15px;
}

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




.boxGall .hoverGl {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
    background: rgba(19, 16, 76, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 28px;
    color: #fff;
    transition: all 0.5s;
    opacity: 0;
}

.boxGall:hover .hoverGl {
    opacity: 1;
}

.boxGall .hoverGl:after {
    position: absolute;
    top: 0;
    width: 100%;
    right: 0;
    height: 70%;
    background: linear-gradient(-165deg, #ed1b24b3, transparent, transparent);
    content: '';
}

.boxGall .hoverGl:before {

    content: "\f002";
    font-family: "Font Awesome 5 Pro";
    color: #fff;
    transition: all 0.2s;
    opacity: 0;
    transform: scale(10);
    pointer-events: none;
}

.boxGall:hover .hoverGl:before {
    opacity: 1;
    transform: scale(1);
}



.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;
}

.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: auto;
    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: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%;
}

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

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

.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;
}

.HeaderText {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    font-size: 18px;
    color: var(--color1);
}

.pageText {
    position: relative;
    width: 100%;
    padding: 40px 40px 0;
    background: #fff;
    font-size: 16px;
    line-height: 2;
}

/*SliderGallery End */

.mapsfull {
    position: relative;
    width: 100%;
    height: 350px;
}

.mapsfull2 {
    position: relative;
    width: 100%;
    height: 240px;
}

.groupMap {
    position: relative;
    width: 100%;
    height: 350px;
}

.js-map.mapboxgl-map {
    width: 100%;
    height: 100%;
}

.mapboxgl-marker.mapboxgl-marker-anchor-center {
    background-image: url(../img/marker.png);
    background-size: cover;
    height: 50px;
    border-radius: 0%;
    cursor: pointer;
    width: 50px;
    background-position: center;
    background-size: auto 100%;
    background-repeat: no-repeat;
    z-index: 10;
}

.mapboxgl-marker.mapboxgl-marker-anchor-center svg {
    display: none;
}

.mapboxgl-ctrl-bottom-left {
    display: none !important;
}

.mapboxgl-ctrl-top-right {
    position: relative;
    transform-origin: top right;
    transform: scale(0.5);
}

.mapboxgl-ctrl-top-right {
    top: 0;
    right: auto !important;
    left: 0 !important;
}

.js-map * {
    outline: none !important;
}

.mapboxframe {
    position: relative;
    width: 100%;
    overflow: hidden;
    border-radius: 8px;
    border: 2px solid #e1e1e1;
}

.mapboxframe .mapboxgl-map {
    position: relative;
    width: 100%;
    min-height: 600px;
}


.itemMap {
    position: relative;
    width: 100%;
    margin: 40px 0;
}

.itemMap i.bg {
    left: 0;
}

.contentMap {
    position: relative;
    display: flex;
    flex-direction: column !important;
    gap: 10px;
    direction: rtl;
}

.sec4Contact .container,
.sec1Contact .container {
    padding-top: 0;
    padding-bottom: 0 !important;
}

.sec3Contact .container,
.sec2Contact .container {
    padding-top: 60px;
    padding-bottom: 60px !important;
}

.itemMap .rowCustom.row5col {
    gap: 0 !important;
}

.itemMap .rowCustom.row5col .colCustom.col1 {
    grid-column: span 2;
    position: relative;
    padding: 10px;
    background: #fff;
}

.itemMap .rowCustom.row5col .colCustom.col2 {
    grid-column: span 3;
}

.itemMap .mapoffice {
    position: relative;
    min-height: 420px;
    width: calc(100% + var(--contoffsetleft)) !important;
    height: 100%;
    /* background: #28227a; */
}

.itemMap .mapoffice canvas.mapboxgl-canvas {
    mix-blend-mode: color-burn;
}

.itemMap .mapoffice .js-map {
    position: absolute;
    width: 100%;
    height: 100%;
}

.mapboxgl-canvas-container:before {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #28227a;
    content: '';
    mix-blend-mode: multiply;
    transition: all 0.5s;
    z-index: 1;
}

.mapboxgl-canvas-container:hover:before {
    opacity: 0;
}

.titleMap {
    height: 30px;
    position: relative;
    font-size: 18px;
    color: #28227a;
    padding-right: 45px;
    display: flex;
    align-items: center;
    background: url(/dist/img/titleMapIcon.png) no-repeat calc(100% - 7px) center / 26px;
}

.itemPropmap {
    position: relative;
    display: flex;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.7;
    padding-right: 45px;
    flex-wrap: wrap;
    gap: 10px;
}

.itemPropmap .name {
    position: relative;
    height: 30px !important;
}

.itemPropmap .icon {
    position: absolute;
    top: -10px;
    right: 0px;
    width: 40px;
    height: 40px;
}

.itemMap .rowCustom.row5col .colCustom.col1:before {
    position: absolute;
    left: -30px;
    bottom: -30px;
    height: calc(100% + 60px);
    width: calc(100% + 60px);
    content: '';
    border: 2px solid #e33035;
}

.socials {
    position: relative;
    display: flex;
    align-items: center;
    gap: 5px;
    font-weight: 300;
}

.socials a {
    position: relative;
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #333;
    font-size: 18px;
}

.socials a svg,
.socials a svg * {
    filter: brightness(0.2);
    width: 17px;
    height: 18px;
}

.socials a .tooltips {
    position: absolute;
    bottom: 100%;
    left: 0;
    right: -35px;
    font-size: 12px;
    width: 100px;
    background: #333;
    height: 25px;
    padding: 0 10px;
    text-align: center;
    border-radius: 8px;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
    transform-origin: bottom center;
    transform: scale(0) translateY(40px);
}

.itemrouter a img {
    width: 98px;
    height: auto !important;
}

.socials a:hover .tooltips {
    transform: scale(1) translateY(0px);
}

.itemPropmap.itemrouter {
    padding: 0;
}

.itemrouter .router.mobile {
    display: none;
}

@media only screen and (max-width:768px) {
    .itemrouter .router.desktop {
        display: none;
    }

    .itemrouter .router.mobile {
        display: flex;
    }

}

.itemrouter a {
    display: flex;
    align-items: center;
}

.itemrouter .router {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    align-items: center;
}

.contentMap a:hover {
    color: #ed1b24;
}

.socials a:hover {
    color: #333;
}


.itemMap .bgMap {
    position: absolute;
    left: 100%;
    width: var(--contoffsetleft);
    height: 100%;
}

.officesList {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0px;
}

.officesList .itemMap:nth-child(even) .rowCustom.row5col {
    direction: ltr;
}

.officesList .itemMap:nth-child(even) .bgMap {
    left: auto;
    right: 100%;
}

form.customForm {
    position: relative;
    padding: 40px;
    max-width: 800px;
    margin: auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

form.customForm .boxInput {
    position: relative;
    display: grid !important;
    align-items: center;
    grid-template-columns: auto 1fr;
    gap: 5px;
}

form.customForm .boxInput input,
form.customForm .boxInput select {
    width: 100%;
    height: 50px;
    border: none !important;
    background: rgba(255, 255, 255, 0.8);
    padding: 0 20px;
}

form.customForm .boxInput.full {
    grid-column: span 2;
}

form.customForm .boxInput textarea {
    width: 100% !important;
    min-height: 150px;
    border: none !important;
    background: rgba(255, 255, 255, 0.8);
    padding: 10px 20px;
    grid-column: span 2;
}

form.customForm .rowBtns {
    grid-column: span 2;
}

.sec2Contact .titleCustom {
    max-width: 1024px;
    margin: auto;
}

.units {
    padding: 70px 0 0;
    display: flex;
    justify-content: space-evenly;
    gap: 20px;
    flex-wrap: wrap;
    row-gap: 50px;
}

.units .itemUnit {
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
    max-width: 300px;
    padding: 30px;
    background: #28227a;
    color: #fff;
    align-items: center;
    gap: 10px;
    border-radius: 20px 0;
}

.units .itemUnit .titleUnit {
    position: relative;
    width: 100%;
    background: #e2e2e2;
    color: #28227a;
    height: 70px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: -50px;
    margin-bottom: 20px;
    font-size: 20px;
    font-weight: 500;
    border-top: 2px solid #ed1b24;
}

.units .itemUnit a {
    color: #fff !important;
    font-size: 18px;
}

.listCounter .itemConter .number {
    height: 70px;
    width: 70px;
    border: 2px solid red;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    border-radius: 100%;
    font-size: 30px;
    font-weight: 200;
}

.listCounter .itemConter .contentConter {
    gap: 10px;
}

.listCounter .itemConter .titleCounter {
    color: #fff;
}

.secBreadcrumbsInner .pageTitle {
    position: absolute;
    top: 0;
    right: 0;
}

.sec1detail>.container {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    margin: auto;
    height: 100%;
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
}

.sec1detail:before {
    position: relative;
    display: block;
    content: '';
    padding-top: 32%;
}

.sec1detail i.bg {
    background: no-repeat center / cover;
}

.sec1detail .titleHeade {
    color: #e33035;
    font-weight: 500;
    font-size: 30px;
    background: rgba(0, 0, 0, 1);
    padding: 5px 20px;
}

.sec1detail .subTitleHeader {
    font-weight: 200;
    font-size: 22px;
    background: rgba(0, 0, 0, 1);
    padding: 5px 20px;
}

.secBreadcrumbsInner .shareBox {
    color: #fff;
}

.secBreadcrumbsInner a,
.secBreadcrumbsInner li:before,
.secBreadcrumbsInner span {
    color: #fff !important;
    border-color: #fff !important;
}

.secBreadcrumbsInner a:hover {
    color: #fff !important;
    border-color: #fff !important;
}

.contentHeader {
    position: relative;
    width: 100%;
    padding: 20px 40px 60px;
    color: #fff;
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: flex-start;
}

.itemVideo .contentVideo {
    position: relative;
    padding: 10px 0;
}

.itemVideo .titleVideo {
    font-size: 18px;
    font-weight: 500;
}

.itemVideo .pic i.play {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 80px;
    height: 80px;
    z-index: 100;
    background: url(../img/playVid.png) no-repeat center / 100%;
    transition: all 0.2s;
    pointer-events: none !important;
}

.itemVideo:hover .pic i.play {
    transform: scale(1.1);
}

.itemVideo:active .pic i.play {
    transform: scale(1.1);
}

.sec3detail.sectionPY .swiper-wrapper {
    padding-bottom: 0 !important;
}

.itemStepProj {
    position: relative;
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: center;
    max-width: 100% !important;
    gap: 40px;
}

.itemStepProj .col1 {
    grid-column: span 1;
}

.itemStepProj .col2 {
    grid-column: span 2;
}

.itemStepProj .col1 .sliderBox {
    padding: 0 !important;
    right: 0;
    width: 100% !important;
    margin: 0;
}

.itemStepProj:nth-child(odd) .NextPrevSlider.PaginateCustom {
    top: 0;
    bottom: 0;
    margin: auto !important;
    right: auto !important;
    left: -30px !important;
    width: 60px !important;
}

.itemStepProj .NextPrevSlider.PaginateCustom {
    top: 0;
    bottom: 0;
    margin: auto !important;
    left: auto !important;
    right: -30px;
    width: 60px !important;
}

.itemStepProj .NextPrevSlider.PaginateCustom .swiper-button-next,
.itemStepProj .NextPrevSlider.PaginateCustom .swiper-button-prev {
    width: 30px !important;
    height: 40px !important;
}

.itemStepProj .NextPrevSlider.PaginateCustom .swiper-button-next:after,
.itemStepProj .NextPrevSlider.PaginateCustom .swiper-button-prev:after {
    font-size: 22px;
}

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

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

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

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

.itemStepProj .titleStepProj {
    position: relative;
    display: flex;
    flex-direction: column;
    padding-right: 10px;
}

.itemStepProj .titleStepProj:before {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    width: 2px;
    height: 100%;
    content: '';
    background: red;
}

.itemStepProj .titleStepProj .Title {
    color: #363636;
    font-size: 26px;
    font-weight: 400;
}

.itemStepProj .titleStepProj .subTitle {
    position: relative;
    font-size: 20px;
    color: #0f6628;
    font-weight: 600;
}

.descriptionProj {
    line-height: 2;
    text-align: justify;
    max-height: 300px;
    overflow: hidden;
    transition: max-height 0.5s ease;
    padding: 10px 0 0;
    font-size: 16px;
}

.itemStepProj .swiper-wrapper {
    padding-bottom: 0 !important;
}

.listStepsProject {
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column !important;
    gap: 40px;
    margin-bottom: 40px;
}

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

.itemStepProj .col1,
.itemStepProj .col2 {
    direction: rtl;
}

.sec3_5detail .contentBoxMore {
    max-height: 1010px;
}

.sec1blog .sliderBox {
    padding: 0 !important;
    width: 100%;
    right: 0;
    margin: 0 !important;
}

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

.itemBlogSlide .contentBlog {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 50%;
    z-index: 10;
    padding: 0px 30px 60px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.itemBlogSlide.single .contentBlog {
    padding-bottom: 30px;
}

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

.itemBlogSlide .pic:before {
    position: relative;
    width: 100%;
    display: block;
    content: '';
    background: border-box;
    padding-top: 68%;
}

.itemBlogSlide.single .pic:before {
    padding-top: 67%;
}

.itemBlogSlide .pic:after {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    content: '';
    background: linear-gradient(0deg, #28227a, transparent);
    transition: all 0.2s;
}

.itemBlogSlide:hover .pic:after {
    height: 150%;
}

.itemBlogSlide .pic .rowDate {
    position: absolute;
    left: 0;
    top: 0;
    padding: 20px;
    z-index: 10;
}

.itemBlogSlide .pic .rowDate .date {
    color: #fff;
    background: #161616;
    height: 35px;
    padding: 0 20px;
    display: flex;
    align-items: center;
    border-radius: 0px 0px 20px 0px;
}

.itemBlogSlide.single .pic .rowDate .date {
    color: #fff;
    background: #161616;
    height: 25px;
    padding: 0 10px;
    font-size: 12px;
    border-radius: 0px 0px 20px 0px;
}

.itemBlogSlide .pic i.hover {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

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

.itemBlogSlide .titleBlog {
    color: #fff;
    position: relative;
    font-weight: 400;
    font-size: 18px;
    line-height: 2;
    /* display: -webkit-box;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    overflow: hidden;
    -webkit-line-clamp: 2; */
}

.itemBlogSlide.single .titleBlog {
    font-size: 14px;
}

.sec1blog .sliderBox .swiper-wrapper {
    padding-bottom: 0 !important;
}

.sec1blog .sliderBox .swiper-pagination {
    position: absolute;
    bottom: 30px !important;
    margin: auto;
    width: 100%;
    display: flex;
    justify-content: center;
    gap: 15px;
    align-items: center;
}

.sec1blog .sliderBox .swiper-pagination-bullet {
    width: 10px;
    height: 10px;
    display: inline-block;
    border-radius: 100%;
    background: #fff !important;
    opacity: 1 !important;
    transition: all 0.5s;
}

.sec1blog .sliderBox .swiper-pagination-bullet.swiper-pagination-bullet-active {
    transform: scale(2);
    background: #e33035 !important;
}

.sec1blog .sliderBox .NextPrevSlider {
    max-width: calc(100% - 20px);
    margin: auto;
    left: 0;
    right: 0;
}

.listBlogs {
    position: relative;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
}

.itemBlogOne {
    position: relative;
    display: flex;
    flex-direction: column;
}

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

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

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

.itemBlogOne .contentBlog {
    padding: 2px 0 0;
}

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


.itemBlogOne .rowDate .date {
    position: relative;
    padding: 0 20px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 600;
    color: #000;
    border-top: 2px solid #28227a;
}

.titleBlog {
    position: relative;
    font-weight: 400;
    font-size: 18px;
    line-height: 1.6;
    /* display: -webkit-box;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    overflow: hidden;
    -webkit-line-clamp: 2; */
    color: #000;
}

.itemBlogOne .contentBlog p {
    position: relative;
    text-align: justify;
    font-size: 14px;
    font-weight: 400;
    color: rgb(39 39 39 / 80%);
    min-height: 110px;
    max-height: 110px;
    overflow: hidden;
}

.sec1blog .sliderBox .NextPrevSlider .swiper-button-next,
.sec1blog .sliderBox .NextPrevSlider .swiper-button-prev {
    color: #fff !important;
}

.sec3Blog .row5col>.col1 {
    grid-column: span 2;
}

.sec3Blog .row5col>.col2 {
    grid-column: span 3;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 40px;
}

.itemHorizontlBlog {
    position: relative;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    width: 100%;
    gap: 20px;
    align-items: flex-start;
}

.itemHorizontlBlog .pic {
    position: relative;
    grid-column: span 2;
}

.itemHorizontlBlog .pic:before {
    position: relative;
    content: '';
    display: block;
    padding-top: 67%;
}

.itemHorizontlBlog .pic:after {
    position: absolute;
    content: '';
    display: block;
    right: -3px;
    top: 0;
    height: 100%;
    border-right: 1px solid #e33035;
}

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

.itemHorizontlBlog .contentBlog {
    justify-content: center;
    grid-column: span 3;
    color: #fff;
    display: flex;
    flex-direction: column;
}

.itemHorizontlBlog .contentBlog .titleBlog {
    -webkit-line-clamp: 3;
    color: #fff;
    font-size: 16px;
}

.itemVerticalBlog .rowDate {
    justify-content: flex-start;
}

.itemVerticalBlog .rowDate .date {
    border: none !important;
    color: #fff;
    font-weight: 300;
    font-size: 18px;
    height: auto;
    padding: 5px 0 0;
}

.itemVerticalBlog .titleBlog {
    color: #fff;
    font-weight: 600;
    font-size: 24px;
}

.itemVerticalBlog .contentBlog p {
    position: relative;
    text-align: justify;
    font-size: 15px;
    font-weight: 400;
    color: rgb(255 255 255 / 80%);
    min-height: 90px;
    overflow: hidden;
    line-height: 2;
    display: -webkit-box;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    overflow: hidden;
    -webkit-line-clamp: 3;
}

.sec3Blog .rowCustom.row5col {
    gap: 40px;
}

.titleCustom.titleWhite::after {
    background: #fff;
}

.titleCustomMore .icon,
.titleCustom .icon {
    display: flex;
    position: relative;
    justify-content: flex-end;
    flex-direction: column;
}

.titleCustomMore.titleWhite .texttitle,
.titleCustom.titleWhite .texttitle {
    color: #fff;
}

.titleCustom.noicon,
.titleCustomMore.noicon {
    padding-right: 0 !important;
    grid-template-columns: auto 1fr;
    margin-bottom: 40px;
}

.titleCustom.noicon .icon,
.titleCustomMore.noicon .icon {
    display: none !important;
}

.listItemsBlogSmall .itemHorizontlBlog .pic {
    width: 160px;
}

.listItemsBlogSmall .itemHorizontlBlog .contentBlog {
    color: #333;
    width: calc(100% - 180px);
}

.listItemsBlogSmall .itemHorizontlBlog .contentBlog .titleBlog {
    color: #333;
}

.listItemsBlogSmall {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.listItemsBlogSmall .itemHorizontlBlog {
    display: flex;
    align-items: center;
}


.largBottomBlog .itemVerticalBlog .rowDate .date {
    color: #28227a;
}

.largBottomBlog .itemVerticalBlog .titleBlog {
    color: #4e4e4e;
}

.largBottomBlog .itemVerticalBlog .contentBlog p {
    color: #333;
}

.largBottomBlog .itemBlogOne .pic:before {
    padding-top: 37%;
}

.blogInnerTitleLarg .itemBlogSlide .pic:before {
    padding-top: 73%;
}

.blogInnerTitlesmall .itemBlogSlide .pic:before {
    padding-top: 33%;
}

.blogInnerTitlesmall {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.blogInnerTitlesmall .itemBlogSlide .contentBlog {
    padding: 0px 30px 20px;
}

.picSahamdar {
    position: relative;
    width: 80%;
    display: flex;
    border-radius: 80px 0px !important;
    overflow: hidden;
}

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

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

.sec7about {
    padding-top: 40px;
    padding-bottom: 40px;
}


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


.rowTabsFaq {
    position: relative;
    display: flex;
    gap: 20px;
    width: 100%;
    justify-content: center !important;
    margin: 20px 0 10px;
}

.rowTabsFaq .btntab i.icon {
    position: relative;
    width: 60px;
    height: 70px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100%;
    background-color: transparent !important;
    filter: hue-rotate(205deg) brightness(0.4);
}

.rowTabsFaq .btntab.active i.icon {
    filter: hue-rotate(0deg) brightness(1);
}

.rowTabsFaq .btntab {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: center;
    font-size: 14px;
    border: none !important;
    background: transparent !important;
    cursor: pointer;
    padding: 10px;
    min-width: 120px;
}

.rowTabsFaq .btntab.active {
    background: #f1f1f1 !important;
    border-radius: 20px 0px;
}

.rowTabsFaq .btntab span.titlefaq {
    color: #a4a4a4;
    font-size: 18px;
    font-weight: 700;
}

.rowTabsFaq .btntab.active span.titlefaq {
    color: #0a1d4a;
}

.contentTabfaq {
    position: relative;
    width: 100%;
    display: none;
}

.contentTabfaq.active {
    display: block;
}

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

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

.hrbAccordionItems * {
    z-index: 2;
}

.hrbAccordionItems:before {
    position: absolute;
    right: 16px;
    top: 20px;
    width: 2px;
    content: '';
    background: #d6d6d6;
    height: calc(100% - 40px);
    z-index: 1;
}

.hrbAccordionItems .titleAccordion {
    position: relative;
    width: 100%;
    min-height: 50px;
    display: flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
    color: #777777;

}

.hrbAccordionItems .titleAccordion {
    position: relative;
    width: 100%;
    min-height: 50px;
    display: flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
    color: #777777;

}

.hrbAccordionItems .itemAccordion.open .titleAccordion {
    color: #000;

}

.hrbAccordionItems .titleAccordion strong {
    font-size: 20px;
    font-weight: 700;

}

.hrbAccordionItems .titleAccordion.icon-right {
    padding-right: 60px;
}

.hrbAccordionItems .titleAccordion.icon-left {
    padding-left: 60px;
}

.hrbAccordionItems .titleAccordion.icon-right .icon {
    right: 0;
}

.hrbAccordionItems .titleAccordion.icon-left .icon {
    left: 0;
}

.hrbAccordionItems .titleAccordion .icon {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 35px;
    height: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #28227a;
    color: #fff !important;
    margin: auto;
}

.hrbAccordionItems .itemAccordion.open .titleAccordion .icon {
    background: #e33035;
}

.hrbAccordionItems .titleAccordion .icon * {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.itemAccordion span.e-opened {
    display: flex !important;
}

.itemAccordion.open span.e-opened {
    display: none !important;
}

.itemAccordion.open span.e-closed {
    display: flex !important;
}

.itemAccordion.open span.e-opened {
    display: none !important;
}

.itemAccordion .contentItemAccordion {
    position: relative;
    overflow: hidden;
    transition: all .5s;
    max-height: 0px;
    font-size: 16px;
    font-weight: 400;
    line-height: 2em;
    padding: 0px 60px 0px 0px;
}

.itemAccordion.open .contentItemAccordion {
    transition: all 1s;
    max-height: 5000px;
}

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



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

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

.lightBoxADS i.bg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
}

.lightBoxADS .ContentlightBoxADS {
    position: relative;
    z-index: 1;
    max-width: 400px;
}

.lightBoxADS .ContentlightBoxADS img {
    width: 100%;
}

.lightBoxADS i.close {
    position: absolute;
    top: 0;
    left: 0;
    width: 30px;
    height: 30px;
    background: rgba(255, 255, 255, 0.2);
    display: flex;
    justify-content: center;
    align-items: center;
    color: red;
    font-size: 20px;
    border-radius: 5px;
    cursor: pointer;
}

.lightBoxADS i.close:hover {
    background: rgba(255, 255, 255, 0.5);
    color: yellow;
}

/* light box -------------------------------------------------------------------------- */



.popupVideo {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10000000000;
    background: rgba(0, 0, 0, 0.9);
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    transition: all 0.5s;
    pointer-events: none;
}

.popupVideo.active {
    opacity: 1;
    pointer-events: auto;
}

.popupVideo .contentPopupVideo {
    position: relative;
    width: calc(100% - 40px);
    max-width: 890px;
}

.popupVideo .contentPopupVideo * {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 1s;
    transform: translate(-100vw, 0px);
}

.popupVideo.active .contentPopupVideo * {
    transform: translate(0vw, 0px);
}

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

.popupVideo i.close {
    position: absolute;
    top: 0;
    right: 0;
    width: 70px;
    height: 70px;
    color: #fff;
    z-index: 10;
    font-size: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.swiper-button-prev:after {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: 'arrow' !important;
    speak: never;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    content: '\e900' !important;
    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    transform: scaleX(-1);
}

.swiper-button-next:after {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: 'arrow' !important;
    speak: never;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    content: '\e900' !important;
    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.sec2home .swiper-button-prev:after,
.sec1home .swiper-button-prev:after {
    transform: scaleX(1);
}

.sec2home .swiper-button-next:after,
.sec1home .swiper-button-next:after {
    transform: scaleX(-1);
}

.sec3detail .swiper-button-prev:after {

    transform: scaleX(-1) !important;
}

.sec3detail .swiper-button-next:after {

    transform: scaleX(1) !important;
}

.sec1home .swiper-button-next:after,
.sec1home .swiper-button-prev:after {
    font-size: 70px;
    color: #fff;
}

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

.contentAjax .listBlogs {
    position: relative;
    width: 100%;
    padding: 0px 20px 20px;
    max-height: calc(100vh - 320px);
    overflow: auto;
}





body.openSidebar #sidebar {
    transform: translateX(0px) !important;
}

i.overlay {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    z-index: 10000000000;
    transition: all 0.5s;
    opacity: 0;
    pointer-events: none;
}

.sidebar {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100000000000;
    background: #28227a;
    width: 100%;
    max-width: 400px;
    transition: all 0.5s;
    transform: translateX(-100vw) !important;
    height: 100svh;
}

.openSidebar .sidebar {
    transform: translateX(0vw) !important;
}

body.openSidebar i.overlay {
    opacity: 1;
    pointer-events: auto;
}

.sidebar .logoNavbar {
    max-width: 200px;
    height: auto !important;
}

.headerSidebar {
    position: relative;
    display: flex;
    width: 100%;
    align-items: center;
    padding: 10px;
    justify-content: flex-end;
    background: rgba(0, 0, 0, 0.2);
}

.contentSidebar {
    position: relative;
    width: 100%;
    padding: 10px 20px;
    max-height: calc(100vh - 130px);
    min-height: calc(100vh - 130px);
    overflow: auto;
}

.headerSidebar i.close {
    position: absolute;
    right: -40px;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff !important;
    font-size: 24px;
    cursor: pointer;
    background: #e33035;
    border-radius: 0px 10px 10px 0px;
    transform: perspective(500px) rotateY(90deg);
    transform-origin: left;
    transition: all 0.5s;
}

.openSidebar .headerSidebar i.close {
    transform: perspective(500px) rotateY(180deg);
    transition-delay: 0.5s;
}

.liveTv {
    position: relative;
}

.liveTv:before {
    position: absolute;
    right: 10px;
    width: 8px;
    height: 8px;
    content: '';
    border-radius: 100%;
    background: #ef4444;
    top: 0;
    bottom: 0;
    margin: auto;
    animation: 3s blink infinite linear;
}

.contentSidebar :is(li, a, span) {
    position: relative;
    margin: 0 !important;
}

.contentSidebar ul {
    list-style: none !important;
    padding: 0 !important;
}

li.hasSubmenu.open>span {
    background: #121f32;
}

li.hasSubmenu.open:hover>span {
    color: #bfbfbf !important;
}

li.hasSubmenu ul.Submenu {
    overflow: hidden;
    transition: all 0.2s;
    max-height: 0px;
}

li.hasSubmenu.open ul.Submenu {
    max-height: 10000px;
}

li.hasSubmenu>span:before {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 44px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgba(255, 255, 255, 0.1);
}

li.hasSubmenu.open>span:before {
    transform: rotate(-90deg);
}

.footerSidebar .socialIcons {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 45px;
    background: rgba(0, 0, 0, 0.2);
}

.footerSidebar .socialIcons a.socicon {
    position: relative;
    width: 35px;
    height: 35px;
    color: #fff;
    font-size: 22px;
    display: flex;
    justify-content: center;
    align-items: center;
}

li.titleCategory span {
    color: rgba(255, 255, 255, 0.6);
    font-size: 16px;
    padding: 0;
    width: 100%;
    height: 40px;
    display: flex;
    align-items: center;
}

.contentSidebar ul li a {
    color: #fff;
    width: 100%;
    height: 40px;
    display: flex;
    align-items: center;
    padding: 0 10px;
    font-size: 16px;
}

.contentSidebar ul li a:hover {
    color: #ffe457;
}

.sidebar li ul.submenu {
    overflow: hidden;
    max-height: 0;
    transition: all 0.5s;
}

.sidebar li.open ul.submenu {
    max-height: 1000px;
}


.sidebar .openSubmenu {
    position: absolute;
    left: 5px;
    top: 5px;
    width: 30px;
    height: 30px;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgba(255, 255, 255, 0.1);
    transition: all 0.2s;
    border-radius: 100%;
    cursor: pointer;
}

.sidebar .openSubmenu:hover {
    background: rgba(255, 255, 255, 0.3);
}

.sidebar .menuSubmenu>li:hover {
    background: rgba(255, 255, 255, 0.1);
}

.sidebar li.open .openSubmenu {
    transform: rotate(180deg);
} 

.footerSidebar .socialIcons a.socicon:hover {
    color: #ffe457;
}

.sec2pageText i.bg ,
.sec3home i.bg {
    background: no-repeat center / cover;
    animation: bgBurn 10s infinite linear;
}


footer i.bg ,
.sec3_5detail i.bg ,
.sec1about i.bg ,
.sec2home i.bg ,
.sec7home i.bg {
    animation: textureMove 100s infinite linear;
}


@keyframes textureMove {
    to{
        background-position: 100% top;
    }
}
@keyframes bgBurn {
    0% , 100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.1);
    }
}

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

.NextPrevSlider.PaginateCustom {
    position: absolute;
    margin: 0 !important;
    width: 80px !important;
    height: 50px !important;
    display: flex !important;
}

.NextPrevSlider.PaginateRightBottom {
    left: auto !important;
    right: 40px !important;
    top: auto !important;
    bottom: -60px !important;
}

.NextPrevSlider.PaginateLeftBottom {
    left: 40px !important;
    right: auto !important;
    top: auto !important;
    bottom: -60px !important;
}


.NextPrevSlider.PaginateCustom .swiper-button-prev,
.NextPrevSlider.PaginateCustom .swiper-button-next {
    position: relative;
    width: 40px;
    height: 50px;
    background: #dfdfdf;
    margin: 0 !important;
    transform: none !important;
    top: 0 !important;
    color: #080808 !important;
}

.NextPrevSlider.PaginateCustom .swiper-button-prev:hover,
.NextPrevSlider.PaginateCustom .swiper-button-next:hover {
    background: #cacaca;
}

.NextPrevSlider.PaginateCustom .swiper-button-prev:after,
.NextPrevSlider.PaginateCustom .swiper-button-next:after {
    font-size: 24px;
}

.NextPrevSlider.PaginateCustom.PaginateRightCenter {
    top: 0 !important;
    bottom: 0 !important;
    right: 0 !important;
    left: auto !important;
    margin: auto !important;
}

.mapboxgl-marker.mapboxgl-marker-anchor-center {
    z-index: 10 !important;
    position: absolute;
}

.sec3detail .swiper-button-next,
.sec3detail .swiper-button-prev {
    transform: scaleX(-1);
}






/* ltr css ---------------------------------------------------------------------- */
html[dir=ltr],
html[dir=ltr] body {
    direction: ltr;
}

html[dir=ltr] .NextPrevSlider {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 100% !important;
    height: 0;
    justify-content: space-between;
}

html[dir=ltr] .itemStepProj:nth-child(odd) .NextPrevSlider.PaginateCustom {
    left: auto !important;
    right: -30px !important;
}

html[dir=ltr] .itemStepProj:nth-child(even) {
    direction: rtl;
}

html[dir=ltr] .itemStepProj .NextPrevSlider.PaginateCustom {
    width: 60px !important;
}

html[dir=ltr] .itemStepProj .col1 .sliderBox,
html[dir=ltr] .itemStepProj .col2 {
    direction: ltr;
}

html[dir=ltr] .itemStepProj:nth-child(even) .NextPrevSlider.PaginateCustom {
    right: auto !important;
    left: -30px !important;
}

html[dir=ltr] .itemStepProj .titleStepProj {
    padding: 0 0 0 10px !important;
}

html[dir=ltr] .itemStepProj .titleStepProj:before {
    right: auto !important;
    left: 0 !important;
}

html[dir=ltr] .itemStepProj .NextPrevSlider.PaginateCustom .swiper-button-next,
html[dir=ltr] .itemStepProj .NextPrevSlider.PaginateCustom .swiper-button-prev {
    width: 30px !important;
    height: 40px !important;
    transform: scaleX(-1) !important;
}

html[dir=ltr] .swiper-button-prev,
html[dir=ltr] .swiper-container-rtl .swiper-button-next {
    left: auto !important;
    right: 10px !important;
}

html[dir=ltr] .swiper-button-next,
html[dir=ltr] .swiper-container-rtl .swiper-button-prev {
    left: 10px !important;
    right: auto !important;
}

html[dir=ltr] .sliderBox {
    right: auto;
    left: -40px;
}

html[dir=ltr] .sidebar .openSubmenu {
    left: auto;
    right: 5px;
}

html[dir=ltr] .itemVideo .contentBlog .titleBlog:before,
html[dir=ltr] .itemBlog .contentBlog .titleBlog:before {
    right: auto !important;
    left: -18px;
}

html[dir=ltr] .NextPrevSlider.PaginateCustom.PaginateRightCenter {
    flex-direction: row-reverse;
    right: auto !important;
    left: 0 !important;
}

html[dir=ltr] .NextPrevSlider.PaginateRightBottom {
    flex-direction: row-reverse;
    right: auto !important;
    left: 40px !important;
}

html[dir=ltr] .itemDeepLock .titleDept {
    border-right: none !important;
    border-left: 4px solid #ed1b24;
}

html[dir=ltr] .listDeepLook .col:nth-child(1) article.itemDeepLock:nth-child(1) {
    right: auto;
    left: 7%;
}

html[dir=ltr] .listDeepLook .col:nth-child(2) article.itemDeepLock:nth-child(1) {
    left: 4%;
    right: auto;
}

html[dir=ltr] .listDeepLook .col:nth-child(1) article.itemDeepLock:nth-child(2) {
    left: -5%;
    right: auto;
}

html[dir=ltr] .listDeepLook .col:nth-child(2) article.itemDeepLock:nth-child(2) {
    left: -6% !important;
    right: auto;
}

html[dir=ltr] .listDeepLook .col:nth-child(1) article.itemDeepLock:nth-child(3) {
    left: 5%;
    right: auto;
}

html[dir=ltr] .rowBtnMore:after {
    left: auto;
    right: -12px;
    transform: scaleX(-1);
}

html[dir=ltr] .itemBrand .link {
    right: 10%;
    left: auto;
}

html[dir=ltr] .itemBrand .contentBrand .titleBrand {
    transform: translateX(-100%);
    left: 50px;
}


html[dir=ltr] .sec7about ol {
    padding: 0 0px 0 20px !important;
}

html[dir=ltr] .itemCertificate .title {
    padding: 0 0px 0 20px;
}

html[dir=ltr] .itemCertificate .title:before {
    right: auto;
    left: 0;
}

html[dir=ltr] .swiper-pagination-progressbar {
    right: auto;
    left: 40px;
}

html[dir=ltr] .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    right: auto !important;
    left: 0 !important;
    transform-origin: left top !important;
}

html[dir=ltr] ol.breadcrumbs li {
    padding-right: 20px;
    padding-left: 0 !important;
}

html[dir=ltr] ol.breadcrumbs li:last-child {
    padding-right: 0px;
}

html[dir=ltr] ol.breadcrumbs li:before {
    left: auto;
    right: 0 !important;
    transform: scaleX(-1);
}

html[dir=ltr] .itemPuzzle.item1 {
    margin-right: auto;
    margin-left: 10%;
}

html[dir=ltr] .itemPuzzle.item2 {
    margin: -13% -45% 0% 0%;
}

html[dir=ltr] .itemPuzzle.item3 {
    margin: -10% 0% 0% -60%;
}

html[dir=ltr] .itemPuzzle.item4 {
    margin: -13% 0% 0% 10%;
}

html[dir=ltr] .sec1blog .sliderBox {
    right: auto;
    left: 0;
}

html[dir=ltr] a.nextPage,
html[dir=ltr] a.prevPage {
    transform: scaleX(-1);
}

html[dir=ltr] .officesList .itemMap .bgMap {
    left: auto;
    right: 100%;
}

html[dir=ltr] .itemDept .titleDept {
    border-right: none !important;
    border-left: 4px solid #ed1b24;
}

html[dir=ltr] .listCounter .swiper-button-next,
html[dir=ltr] .listCounter .swiper-button-prev {
    transform: scaleX(-1);
}

html[dir=ltr] .NextPrevSlider.PaginateCustom {
    width: 80px !important;
}

html[dir=ltr] .hrbAccordionItems .titleAccordion.icon-right {
    padding-right: 0;
    padding-left: 60px !important;
}

html[dir=ltr] .hrbAccordionItems .titleAccordion.icon-right .icon {
    right: auto !important;
    left: 0;
}

html[dir=ltr] .itemAccordion .contentItemAccordion {
    padding: 0 0 0 60px;
}

html[dir=ltr] .hrbAccordionItems:before {
    left: 16px;
    right: auto;
}

html[dir=ltr] .contentColFooter {
    padding-right: 0;
    padding-left: 20px;
}

html[dir=ltr] .contentColFooter i.line {
    right: auto;
    left: 0;
}

html[dir=ltr] .itemSahamdar .titleRealSahamdar {
    padding: 0 0 0 20px;
}

html[dir=ltr] .itemSahamdar .titleRealSahamdar:before {
    right: auto;
    left: 0;
}

html[dir=ltr] .pageTitle .container {
    padding: 30px 0;
}

html[dir=ltr] .itemHorizontlBlog .pic:after {
    right: auto;
    left: -3px;
}

html[dir=ltr] .itemHorizontlBlog .pic:after {
    right: auto;
    left: -3px;
}
.boxMore.hidebtn .rowBtns.center {
    display: none;
}

.boxMore.hidebtn .contentBoxMore {
    max-height: 20000px;
}
/* ltr css ---------------------------------------------------------------------- */