@font-face {
    font-family: iransans;
    src: url("../fonts/iransans/woff2/IRANSansX-Regular.woff2") format("woff2"), url("../fonts/iransans/woff/IRANSansX-Medium.woff") format("woff");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: iransans;
    src: url("../fonts/iransans/woff2/IRANSansX-Medium.woff2") format("woff2"), url("../fonts/iransans/woff/IRANSansX-Medium.woff") format("woff");
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: iransans;
    src: url("../fonts/iransans/woff2/IRANSansX-DemiBold.woff2") format("woff2"), url("../fonts/iransans/woff/IRANSansX-DemiBold.woff") format("woff");
    font-weight: bold;
    font-style: normal;
}

:root {
    --color-main: #009aa6;
    --color-gray: #f7f7f7;
    --color-gray2: #ede7e7;
    --color-gray3: #525252;
    --color-gray4: #e2e2e2;
    --color-gray5: #9a9a9a;
    --color-ccc: #ccc;
    --color-dark: #333;
    --color-dark2: #393c3d;
    --color-dark3: rgba(61, 65, 66, 0.592);
    --color-dark4: #383c3d;
    --color-black: #000;
    --box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.333);
    --box-shadow2: 0px 5px 10px -3px rgba(0, 0, 0, 0.1);
    --color-second: #cba344;
    --color-blue: #0d1e60;
    --color-blue2: #353662;
    --color-cyan: #109cc5;
    --color-cyan2: #10dfff;
}

* {
    box-sizing: border-box;
}

body {
    font-family: iransans;
    font-weight: normal;
    font-size: 15px;
    direction: rtl;
    text-align: right;
    scroll-behavior: smooth;
    font-feature-settings: "ss01";
    background-color: var(--color-gray);
    line-height: 32px;
}

h1, h2, h3, h4, h5, h6 {
    line-height: 32px;
}

.tooltip {
    font-family: iransans;
}

p {
    padding: 0px;
    margin: 0px;
}

a, a:hover, a:focus {
    text-decoration: none;
}

body::before {
    display: block;
    width: 232px;
    height: 402px;
    background: url("../img/shape.png") no-repeat;
    position: absolute;
    right: -70px;
    top: 0px;
}

header .container {
    position: relative;
}

header .search label::after {
    content: "";
    display: block;
}

header .form-label {
    margin-bottom: 0px;
    width: 100%;
}

.header-top {
    background-color: var(--color-main);
}

.header-top > div {
    margin: auto;
}

.header-top .date, .header-top .lang, .header-top .search, .header-top .user {
    flex-grow: 1;
    text-align: center;
    color: white;
    font-weight: 500;
    position: relative;
    font-size: 0.9rem;
    padding: 0px 0.25rem;
}

.header-top .search {
    flex-basis: 40px;
}

.logo-header img {
    max-width: 100%;
}

.header-top .lang, .header-top .search label, .header-top .user {
    cursor: pointer;
}

header .search input {
    position: absolute;
    left: 0px;
    right: 0px;
    width: 97%;
    margin: auto;
    top: 46px;
    padding-top: 0.7rem;
    padding-bottom: 0.7rem;
    z-index: 99;
}

header .menu-top a.nav-link {
    color: var(--color-dark);
    position: relative;
    font-weight: bold;
}

header .menu-top a.nav-link.active {
    color: var(--color-main);
}

header .menu-top .dropdown-menu {
    min-width: 15rem;
}

header .menu-top .dropdown-menu .dropdown-item {
    padding: 0.5rem 1rem;
}

.btn-main {
    background-color: var(--color-main);
    border-color: var(--color-main);
}

.btn-main:hover, .btn-main:focus {
    background-color: var(--color-second) !important;
    border-color: var(--color-second) !important;
}

.swiper {
    width: 100%;
}

.slider .swiper {
    max-height: 393px;
}

.slider .swiper, .slider .swiper img, .slider .swiper a {
    border-radius: 30px;
    width: 100%;
    height: 100%;
    display: block;
}

.slider .swiper-pagination {
    top: 100%;
    margin-top: 15px;
}

.slider .swiper-pagination .swiper-pagination-bullet {
    background-color: var(--color-black);
    width: 12px;
    height: 12px;
}

.slider .swiper-pagination .bulletActive {
    background-color: var(--color-second);
    opacity: 1;
}

.slider .swiper-button-next, .slider .swiper-button-prev {
    color: white;
}

.slider .swiper-button-next {
    left: 30px;
}

.slider .swiper-button-prev {
    right: 30px;
}

.slider .caption-slider {
    width: 100%;
    position: absolute;
    bottom: -100px;
    left: 0px;
    right: 0px;
    text-align: center;
    color: white;
    padding: 2rem;
    transition: all 0.7s ease-in 0s;
    z-index: 9;
    font-size: calc(1.5rem);
}

.slider .swiper-slide-active::after {
    content: "";
    display: block;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.506) 0%, rgba(0, 212, 255, 0) 49%);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    bottom: 0px;
    border-radius: 40px;
}

.slider .swiper-slide-active .caption-slider {
    bottom: 0px;
}

.companies {
    padding: 3rem 0px;
}

.companies .swiper-slide .item {
    position: relative;
    cursor: pointer;
}

.companies .swiper-slide .item a {
    background-color: white;
    width: 130px;
    height: 130px;
    margin: auto;
    border-radius: 50%;
    box-shadow: var(--box-shadow2);
    display: flex;
    align-items: center;
    justify-content: center;
}

.companies .swiper-slide:hover .caption {
    color: var(--color-main);
}

.companies .swiper-slide .item img {
    max-width: 150px;
}

.companies .swiper-slide .item span.border-line {
    content: "";
    display: block;
    width: 160px;
    height: 160px;
    background: none;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    border: 1px solid var(--color-main);
    margin: auto;
    transform: translateX(-50%) translateY(-50%);
    transition: all 2s ease-out 0s;
}

.companies .swiper-slide .item:hover span.border-line {
    transform-origin: center center;
    top: 50%;
    left: 50%;
    transition: all 1s ease-in 0s;
    transform: translateX(-50%) translateY(-50%) rotate(360deg);
}

.companies .swiper-slide .item span.border-line span {
    font-size: 0px;
    display: block;
    width: 63px;
    height: 11px;
    position: absolute;
    background: var(--color-gray);
    left: 50%;
    bottom: -3px;
    transform: translateX(-50%);
    z-index: 9;
}

.companies .swiper-slide .item span.border-line span::before, .companies .swiper-slide .item span.border-line span::after {
    content: "";
    display: block;
    width: 8px;
    height: 8px;
    position: absolute;
    left: 0px;
    top: 0px;
    background-color: var(--color-main);
    border-radius: 15px;
    animation-name: scale;
    animation-iteration-count: infinite;
    animation-duration: 2s;
    animation-delay: 1s;
    animation-direction: alternate-reverse;
    animation-fill-mode: both;
}

.companies .swiper-slide .item span.border-line span::after {
    left: auto;
    right: 0px;
}

.companies .caption {
    color: var(--color-black);
    font-size: 1rem;
    margin-top: 1rem;
    text-align: center;
    font-weight: bold;
}

.news .more-archive {
    display: block;
    text-align: center;
    margin-top: 2rem;
    color: var(--color-blue);
    font-weight: bold;
    font-size: 1.1rem;
}

.news .more-archive i {
    margin-left: 0.5rem;
}

.companies .swiper-button-next::after, .companies .swiper-button-prev::after, .news .swiper-button-next::after, .news .swiper-button-prev::after {
    color: var(--color-dark);
    font-size: 2rem;
}

.news .swiper-button-next::after, .news .swiper-button-prev::after {
    font-size: 2.8rem;
}

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

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

.companies .swiper-button-next:hover::after, .companies .swiper-button-prev:hover::after {
    color: var(--color-main);
}

.news .inner {
    background-color: var(--color-gray2);
    border-radius: 45px;
    padding: 1rem;
}

.news .inner h2.title {
    text-align: center;
    color: var(--color-main);
    font-weight: bold;
    font-size: 1.5rem;
}

.news .swiper {
    width: 100%;
}

.news .swiper-slide {
    height: calc(50% - 15px);
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1rem;
}

.swiperNews::after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../img/center.png") center center no-repeat;
}

.swiperNews .photo {
    display: flex;
    align-items: center;
    justify-content: center;
}

.swiperNews .photo img {
    border-radius: 50%;
    max-width: 100%;
    height: auto;
    width: 100px;
    object-fit: contain;
    aspect-ratio: 1 / 1;
    outline-style: solid;
    outline-color: var(--color-ccc);
    outline-width: 1px;
    outline-offset: 5px;
}

.swiperNews .detail h2, .swiperNews .detail a {
    font-size: 1rem;
    color: var(--color-blue);
    font-weight: bold;
}

.swiperNews .bottom-detail {
    border: 1px solid var(--color-ccc);
    border-radius: 7px;
    overflow: hidden;
    justify-content: space-between;
}

.swiperNews .bottom-detail .more {
    background: var(--color-ccc);
    color: var(--color-black);
    padding: 0px 1.3rem;
    display: flex;
    align-items: center;
    font-weight: 500;
}

.swiperNews .bottom-detail .more:hover::after {
    transform: translateX(-8px) rotate(45deg);
}

.swiperNews .bottom-detail .date {
    padding: 0px 0.7rem;
}

.swiperNews .bottom-detail .more::after {
    content: "";
    display: block;
    width: 9px;
    height: 9px;
    margin-right: 0.5rem;
    border-left: 1px solid var(--color-black);
    border-bottom: 1px solid var(--color-black);
    transform: translateX(-5px) rotate(45deg);
    transition: transform 0.2s ease-in 0s;
}

.swiperNews .bottom-detail .more:hover {
    background: var(--color-main);
    color: white;
}

.swiperNews .bottom-detail .more:hover::after {
    border-color: white;
}

.about {
    border-top: 12px solid var(--color-cyan);
    margin: 3rem 0px 0px;
    position: relative;
}

.about .clip-photo {
    content: "";
    display: block;
    height: 100%;
    position: absolute;
    left: 0px;
    top: -12px;
    object-position: center center;
    clip-path: url("#myClip2");
    opacity: 0.9;
}

.about::after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: var(--color-main);
    position: absolute;
    left: 0px;
    top: -12px;
    clip-path: url("#myClip");
    opacity: 0.9;
}

.about .about-des {
    height: 100%;
    display: grid;
    align-items: start;
    padding: 3rem 5rem;
}

.about .about-des h1 {
    color: var(--color-main);
    font-size: 1.5rem;
    font-weight: bold;
    align-self: end;
}

.about .about-des p {
    font-weight: 500;
    text-align: justify;
    line-height: 35px;
    align-self: flex-start;
}

.about .photo-about {
    max-width: 100%;
}

.about .photo-about img {
    max-width: 100%;
}

.about .about-des .bottom-about {
    place-self: self-end flex-start;
    align-items: center;
    display: flex;
    width: 100%;
    justify-content: space-between;
    margin-top: 4rem;
}

.about .about-des a.btn {
    display: flex;
    justify-content: space-between;
    border-color: var(--color-main);
    color: var(--color-black);
    font-weight: bold;
}

.about .about-des a.btn:hover, .about .about-des a.btn:focus {
    background-color: var(--color-main);
    color: white;
}

.about .about-des .certificate {
    border: 1px solid var(--color-main);
    padding: 0.5rem;
    border-radius: 10px;
}

.about .about-des .certificate img {
    max-width: 50px;
}

@keyframes scale {
    0% {
        transform: scale(0.8);
    }

    50% {
        transform: scale(1.3);
    }

    100% {
        transform: scale(1);
    }
}

.services {
    background-image: url("../img/bg-services.jpg");
    background-position: center center;
    padding: 2rem 0px;
    background-repeat: no-repeat;
    background-size: cover;
}

.services h2.title {
    text-align: center;
    color: var(--color-second);
    font-weight: bold;
    font-size: 1.5rem;
    margin-bottom: 3rem;
}

.services .item {
    background: var(--color-dark3);
    max-width: 250px;
    height: 250px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    flex-direction: column;
    border-radius: 50%;
    margin: auto;
    border: 2px solid var(--color-gray3);
}

.services .item .title {
    text-align: center;
    color: var(--color-second);
    font-size: 1.3rem;
    font-weight: bold;
    margin-top: 1rem;
}

.services .swiper-slide .item span.border-line {
    content: "";
    display: block;
    width: 80%;
    height: 80%;
    background: none;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    border: 1px solid var(--color-gray3);
    margin: auto;
    transform: translateX(-50%) translateY(-50%);
    transition: all 2s ease-out 0s;
}

.services .swiper-slide .item span.border-line span {
    width: 63px;
    height: 10px;
    position: absolute;
    background: var(--color-dark4);
    left: 50%;
    top: -2px;
    transform: translateX(-50%);
    z-index: 9;
    color: var(--color-second);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
}

.services .swiper-slide .item span.border-line span::before, .services .swiper-slide .item span.border-line span::after {
    content: "";
    display: block;
    width: 8px;
    height: 8px;
    position: absolute;
    left: 0px;
    top: 3px;
    background-color: white;
    border-radius: 15px;
    animation-name: scale;
    animation-iteration-count: infinite;
    animation-duration: 2s;
    animation-delay: 1s;
    animation-direction: alternate-reverse;
    animation-fill-mode: both;
}

.services .swiper-slide .item span.border-line span::after {
    left: auto;
    right: 0px;
}

.services .photo {
    background: var(--color-gray2);
    width: 70%;
    height: 70%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    overflow: hidden;
    padding: 1rem;
    z-index: 9;
    border: 4px solid var(--color-gray2);
}

.services .photo a {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.services .photo img {
    max-width: 100%;
    max-height: 100%;
}

.services .caption {
    text-align: center;
    font-size: 1.2rem;
    margin-top: 1rem;
    color: var(--color-second);
    font-weight: bold;
}

.services .swiper-button-prev::after, .services .swiper-button-next::after {
    color: var(--color-ccc);
}

.services .swiper-pagination {
    bottom: -10px;
}

.services .swiper-pagination-bullet {
    background-color: var(--color-ccc);
}

.services .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background-color: var(--color-second);
}

footer {
    background-color: var(--color-cyan);
    padding: 3rem 0px 0rem;
}

footer .column-footer h2 {
    color: white;
    font-size: 1.2rem;
    font-weight: bold;
    display: inline-block;
    background: var(--color-cyan);
    position: relative;
    padding: 0px 2rem;
}

footer .column-footer ul {
    list-style-position: inside;
    padding: 0px;
}

footer .column-footer ul li {
    padding: 0.3rem 0px;
    position: relative;
    transition: transform 0.3s ease-in 0s;
}

footer .column-footer ul:not(.contact-ways) li:hover {
    transform: translateX(-10px);
}

footer .column-footer ul:not(.contact-ways) li i {
    font-size: 1rem;
    margin-left: 0.5rem;
}

footer .column-footer.link ul li {
    padding-right: 1rem;
}

footer .column-footer ul li {
    list-style: none;
    font-weight: 500;
}

footer .column-footer ul:not(.contact-ways) li, footer .column-footer ul:not(.contact-ways) a {
    color: white;
}

footer .column-footer h2::after {
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    background: white;
    position: absolute;
    right: 0px;
    left: 0px;
    top: 50%;
}

footer .column-footer h2 span {
    background: var(--color-cyan);
    position: relative;
    z-index: 9;
    padding: 0px 1rem;
}

footer .column-footer.link ul li::before {
    content: "";
    display: block;
    width: 5px;
    height: 5px;
    background: var(--color-cyan2);
    position: absolute;
    right: 0px;
    border-radius: 50px;
    top: 50%;
}

footer .column-footer p {
    color: white;
    text-align: justify;
    font-weight: bold;
}

footer .about-footer img {
    margin: 1rem auto;
    display: block;
}

footer .contact-ways ul {
    display: flex;
}

footer .contact-ways ul li {
    background: white;
    border-radius: 4px;
    width: 30px;
    height: 30px;
    margin-left: 25px;
    line-height: 1.5rem;
    color: var(--color-cyan2);
    display: flex;
    justify-content: center;
    align-items: center;
    outline: white solid 2px;
    outline-offset: 3px;
    flex-shrink: 0;
}

footer .contact-ways ul li a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
}

footer .copy-right::before {
    content: "";
    display: block;
    width: 100%;
    height: 2px;
    background: linear-gradient(to right, var(--color-cyan) 15%, #ddd 50%, var(--color-cyan) 85%) left bottom no-repeat;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
}

footer .copy-right {
    text-align: center;
    color: white;
    padding: 0.5rem;
    position: relative;
}

.wrap .wrap-archive {
    background-color: var(--color-gray4);
    padding: 2rem 0px;
}

.wrap .wrap-inner {
    padding: 2rem 0px;
    background: linear-gradient(180deg, var(--color-gray4) 0%, white 30%, white 50%, white 70%, var(--color-gray4) 100%);
}

.wrap-inner .gallery {
    padding: 2rem 0px 0px;
}

.wrap .wrap-archive .top-wrap {
    border-bottom: 2px dotted var(--color-dark);
}

.wrap .top-wrap {
    padding-bottom: 1rem;
}

.wrap .title-page {
    font-size: 1.3rem;
    font-weight: bold;
    margin-bottom: 0px;
    color: var(--color-blue);
    display: flex;
    align-items: center;
}

.wrap .title-page span {
    flex-grow: 1;
    display: block;
    flex-shrink: 0;
    padding-left: 1rem;
}

.wrap .title-page::after {
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    border-bottom: 2px dotted;
}

.wrap .breadcrumb {
    margin-bottom: 0px;
}

.breadcrumb ul {
    display: flex;
    padding: 0px;
    margin-bottom: 0px;
}

.wrap .breadcrumb ul li {
    list-style: none;
    padding: 0px 1rem;
    position: relative;
    display: flex;
    align-items: center;
}

.wrap .breadcrumb ul li:not(:first-child)::before {
    content: "";
    display: block;
    width: 1px;
    height: 20px;
    position: absolute;
    top: 5px;
    right: 0px;
    border-left: 1px dotted var(--color-dark);
}

.wrap .breadcrumb ul li, .wrap .breadcrumb ul li a {
    color: var(--color-gray3);
    font-weight: bold;
    font-size: 0.9rem;
}

.wrap .breadcrumb ul li:last-child {
    padding-left: 0px;
}

.wrap .breadcrumb ul li:last-child a {
    color: var(--color-blue);
}

.gallery.list-items .list-item {
    margin-bottom: 3rem;
}

.news.list-items .list-item {
    padding: 3rem 0px;
}

.list-items.news .list-item:nth-child(2n) {
    background-color: white;
}

.list-items.news .list-item img {
    max-width: 100%;
    aspect-ratio: 4 / 3;
    border-radius: 35px;
    outline: 1px solid var(--color-dark2);
    outline-offset: 8px;
    object-fit: cover;
}

.list-items.news .list-item .date {
    font-size: 0.9rem;
}

.list-items.news .list-item .date span.rounded {
    direction: ltr;
    display: flex;
    align-items: center;
    position: relative;
    background: linear-gradient(336deg, rgb(94, 94, 94) 0%, rgba(58, 60, 64, 0) 30%, rgba(52, 55, 59, 0) 65%, rgb(94, 94, 94) 100%);
    width: 110px;
    height: 40px;
    text-align: center;
    justify-content: center;
}

.list-items.news .list-item .date span.rounded span {
    position: absolute;
}

.list-items.news .list-item .date span.rounded::before {
    content: "";
    display: block;
    width: 106px;
    height: 36px;
    background-color: white;
    position: absolute;
    left: 2px;
    top: 2px;
    margin: auto;
    border-radius: 4px;
}

.list-items.news .list-item .description {
    padding-right: 1rem;
}

.list-items.news .list-item .description h3 {
    color: var(--color-blue);
    font-size: 1.3rem;
    font-weight: bold;
}

.list-items.news .list-item .description p {
    font-size: 1rem;
    font-weight: bold;
    text-align: justify;
}

.wrap .pagination li {
    margin: 7px 5px;
}

.wrap-archive nav.Page {
    position: relative;
    display: flex;
    align-items: center;
}

.wrap-archive nav.Page::before, .wrap-archive nav.Page::after {
    content: "";
    display: block;
    width: 50%;
    height: 1px;
    background-color: var(--color-gray3);
    position: absolute;
    left: 0px;
    top: 50%;
}

.wrap-archive nav.Page::after {
    left: unset;
    right: 0px;
}

.wrap-archive .pagination {
    background-color: var(--color-gray4);
}

.wrap .pagination {
    position: relative;
    z-index: 9;
    width: auto;
    margin: auto;
    padding: 0px;
    flex-wrap: wrap;
}

.wrap .pagination a {
    width: 40px;
    height: 40px;
    text-align: center;
    color: var(--color-blue);
    border: 1px solid var(--color-gray3);
    border-radius: 10px !important;
}

.wrap .pagination a.active {
    background-color: var(--color-blue);
    color: white;
}

.wrap .pagination a:hover {
    background-color: var(--color-blue);
    color: white;
}

.gallery .list-item .content {
    background-color: var(--color-gray2);
    padding: 1rem;
    border-radius: 40px;
    outline: 1px solid var(--color-dark2);
    position: relative;
    transition: all 0.3s ease-in 0s;
}

.gallery .list-item .photo {
    position: relative;
    overflow: hidden;
}

.gallery .list-item img {
    max-width: 100%;
    border-radius: 35px 35px 0px 0px;
    aspect-ratio: 4 / 3;
    object-fit: cover;
}

.gallery .list-item .photo::after {
    content: "";
    display: block;
    width: 600px;
    height: 95%;
    position: absolute;
    left: calc(50% - 300px);
    bottom: -81%;
    background: rgb(237, 231, 231);
    border-radius: 100%;
    transition: all 0.3s ease-in 0s;
}

.gallery .list-item h3 {
    text-align: center;
    color: var(--color-dark);
    font-size: 1rem;
    font-weight: bold;
    margin-bottom: 2rem;
}

.gallery .list-item span.logo {
    background: var(--color-main);
    width: 90px;
    height: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    position: absolute;
    left: calc(50% - 45px);
    bottom: calc(0% + 25px);
    border: 4px solid white;
    z-index: 9;
    box-shadow: rgba(0, 0, 0, 0.2) 0px 10px 25px -7px;
    transition: all 0.3s ease-in 0s;
}

.gallery .list-item span.logo::after {
    content: "";
    display: block;
    width: 70px;
    height: 35px;
    background: url("../img/logo.png") center center / 100% no-repeat;
    filter: brightness(0) invert(1);
}

.gallery .list-item .more {
    position: absolute;
    left: 0px;
    right: 0px;
    text-align: center;
    bottom: -22px;
}

.gallery .list-item .more span {
    display: inline-block;
    padding: 0.2rem 2.5rem;
    background: var(--color-gray);
    border: 1px solid var(--color-dark);
    border-radius: 10px;
    color: var(--color-dark3);
    transition: all 0.3s ease-in 0s;
}

.gallery .list-item:hover .content, .gallery .list-item:hover .photo::after {
    background-color: var(--color-blue2);
    cursor: pointer;
}

.gallery .list-item:hover .more span {
    background-color: var(--color-main);
    color: white;
    border: 1px solid white;
}

.gallery .list-item:hover span.logo {
    background-color: var(--color-blue2);
}

.gallery .list-item:hover h3 {
    color: white;
}

.col-contact {
    flex: 0 0 auto;
    width: 50%;
    background-color: white;
}

.col-contact {
    border-radius: 0px 15px 15px 0px;
    padding: 1rem;
    box-shadow: rgba(0, 0, 0, 0.2) 0px 10px 25px -7px;
}

.col-contact.form {
    border-radius: 15px;
}

.col-contact.form p {
    text-align: center;
    margin-bottom: 2rem;
}

.col-contact.form label {
    font-weight: bold;
    margin-bottom: 0px;
    color: var(--color-main);
}

.col-contact.form input:not([type="submit"]), .col-contact.form select, .col-contact.form textarea {
    background-color: var(--color-gray);
    border: none;
    box-shadow: rgba(0, 0, 0, 0.11) 0px 0px 9px 0px inset;
    position: relative;
}

.col-contact.form .select-form {
    position: relative;
}

.col-contact.form .select-form::after {
    content: "";
    display: block;
    width: 8px;
    height: 8px;
    position: absolute;
    left: 25px;
    z-index: 9;
    bottom: 15px;
    border-bottom-color: ;
    border-bottom-style: ;
    border-bottom-width: ;
    border-left-color: ;
    border-left-style: ;
    border-left-width: ;
    border-image-source: ;
    border-image-slice: ;
    border-image-width: ;
    border-image-outset: ;
    border-image-repeat: ;
    border-top: 0px;
    border-right: 0px;
    transform: rotate(-45deg);
}

.col-contact.form input[type="submit"] {
    background-color: var(--color-main);
    padding: 0.5rem 1.8rem;
    border: none;
}

.col-contact.form textarea {
    height: 200px;
}

.col-contact ul {
    margin: 0px;
    padding-right: 2.5rem;
}

.col-contact ul li {
    list-style: none;
    font-weight: bold;
    position: relative;
    margin-bottom: 2rem;
}

.col-contact ul li:last-child {
    margin-bottom: 0px;
}

.col-contact ul li i {
    list-style: none;
}

.col-contact ul li i {
    position: absolute;
    right: -35px;
    top: 25%;
    font-size: 1.5rem;
    font-weight: bold;
    color: var(--color-main);
}

.col-contact ul li span {
    color: var(--color-gray3);
}

.map {
    min-height: 400px;
}

.wrap-mohtava {
    padding: 2rem 0px 0px;
    background: var(--color-gray2);
}

.wrap-mohtava .photo {
    padding: 1rem;
}

.wrap-mohtava .photo img {
    max-width: 100%;
    border-radius: 35px;
    outline: solid 1px;
    outline-offset: 15px;
    aspect-ratio: 4 / 3;
    object-fit: cover;
}

.wrap-mohtava .access-top {
    background-color: white;
    border-radius: 7px;
}

.wrap-mohtava .list-cat {
    padding: 0px;
    margin: 0px;
}

.wrap-mohtava .list-cat li {
    list-style: none;
    color: var(--color-gray);
    display: flex;
    align-items: center;
}

.wrap-mohtava .list-cat li::after {
    content: "";
    display: inline-block;
    height: 13px;
    width: 1px;
    background: var(--color-ccc);
    font-size: 0.9rem;
}

.wrap-mohtava .list-cat li a {
    color: var(--color-gray5);
    font-weight: bold;
    padding: 0px 0.5rem;
    font-size: 0.9rem;
    display: flex;
}

.wrap-mohtava .list-cat li:hover a {
    color: var(--color-dark);
}

.wrap-mohtava .list-cat li a span {
    margin-left: 5px;
}

.wrap-mohtava .list-cat li:last-child::after {
    display: none;
}

.wrap-mohtava .list-cat li.eita i {
    color: rgb(221, 116, 3);
}

.wrap-mohtava .list-cat li.bale i {
    color: rgb(12, 182, 138);
}

.wrap-mohtava .list-cat li.sms i {
    color: rgb(70, 191, 245);
}

.wrap-mohtava .list-cat li.mail i {
    color: rgb(99, 190, 211);
}

.wrap-mohtava .content-level-1 .t-summray {
    padding: 1.5rem 0px;
}

.wrap-mohtava .content-level-1 h1 {
    color: var(--color-blue);
    font-size: 1.1rem;
    font-weight: bolder;
}

.wrap-mohtava .content-level-1 p {
    color: var(--color-black);
    font-weight: bold;
    text-align: justify;
}

.wrap-mohtava .content {
    padding: 2rem 0px;
    position: relative;
}

.wrap-mohtava .content-level-2::after {
    content: "";
    width: 100%;
    display: block;
    height: 210px;
    position: absolute;
    left: 0px;
    margin: auto;
    background: url("../img/shadow.png") no-repeat;
    background-size: 100% 210px;
    top: -140px;
}

.wrap-mohtava .content-level-1 {
    z-index: 9;
    background: var(--color-gray2);
}

.wrap-mohtava .content-level-2 {
    background: linear-gradient(180deg, white 0%, white 30%, white 50%, white 70%, var(--color-gray4) 100%);
    position: relative;
}

.wrap-mohtava .content-level-2 .editor {
    line-height: 32px;
}

.wrap-mohtava .content-level-2 .editor * {
    font-weight: bold;
}

.wrap-mohtava .content-level-2 .editor h1 {
    font-size: 1.5rem;
}

.wrap-mohtava .content-level-2 .editor h2 {
    font-size: 1.3rem;
}

.wrap-mohtava .content-level-2 .editor h3 {
    font-size: 1.2rem;
}

.wrap-mohtava .content-level-2 .editor h4 {
    font-size: 1rem;
}

.wrap-mohtava .content-level-2 .editor h5 {
    font-size: 0.9rem;
}

.wrap-mohtava .content-level-2 .editor h6 {
    font-size: 0.8rem;
}

.wrap-mohtava .content-level-2 .editor h1, .wrap-mohtava .content-level-2 .editor h2, .wrap-mohtava .content-level-2 .editor h3, .wrap-mohtava .content-level-2 .editor h4, .wrap-mohtava .content-level-2 .editor h5, .wrap-mohtava .content-level-2 .editor h6 {
    color: var(--color-blue);
    font-weight: bold;
}

.wrap-mohtava .content-level-2 .editor a {
    color: var(--color-main);
}

.wrap-mohtava .content-level-2 .editor ul, .wrap-mohtava .content-level-2 .editor ol {
    list-style-position: inside;
    padding: 0;
}

.wrap-mohtava .content-level-2 .editor ul li, .wrap-mohtava .content-level-2 .editor ol li {
    list-style: none;
    padding-right: 1rem;
    position: relative;
}

.wrap-mohtava .content-level-2 .editor ul li::before, .wrap-mohtava .content-level-2 .editor ol li::before {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 15px;
    background-color: var(--color-blue);
    position: absolute;
    right: 0;
    top: 12px;
}

.wrap-mohtava .content-level-2 .editor img {
    max-width: 100%;
    border-radius: 35px;
    margin: 1rem 0;
}

.wrap-mohtava .content-level-2 .access-bottom {
    background: white;
    padding: 0.5rem;
    border-radius: 7px;
    border: 1px solid var(--color-ccc);
    color: var(--color-blue);
}

.wrap-mohtava .content-level-2 .access-bottom a {
    color: var(--color-blue);
    font-size: 0.8rem;
    font-weight: bold;
}

.wrap-mohtava .content-level-2 .access-bottom i {
    color: var(--color-main);
    margin-left: 0.3rem;
}

@media only screen and (min-width: 768px) {
    .news .swiper {
        height: 100%;
    }

    .news .inner {
        height: 680px;
        padding: 2rem;
    }
}

@media only screen and (min-width: 992px) {
    .position-lg-relative {
        position: relative !important;
    }

    body.wrap-home::before {
        content: "";
    }

    header::before {
        content: "";
        display: block;
        position: absolute;
        left: 0px;
        top: 0px;
        background: var(--color-main);
        width: calc(20vw);
        height: 40px;
    }

    .header-top {
        border-bottom-right-radius: 50px;
        padding: 0.5rem 0px;
    }

    .header-top .search label::before, .header-top .lang::before, .header-top .user::before {
        content: "";
        display: block;
        width: 1px;
        height: 20px;
        background-color: white;
        position: absolute;
        left: 0px;
        top: 50%;
        transform: translateY(-50%);
    }

    .news .inner {
        height: 470px;
    }

    .news .swiper {
        height: 90%;
    }
}

@media only screen and (min-width: 1920px) {
    header::before {
        width: calc(28vw);
    }
}

@media only screen and (min-width: 3300px) {
    header::before {
        display: none;
    }
}

@media only screen and (max-width: 1199px) {
    .header-top .date {
        font-size: 0.8rem;
    }
}

@media only screen and (max-width: 991px) {
    .position-lg-static {
        position: static !important;
    }

    .header-top {
        border-radius: 50px;
    }

    header .menu-top .navbar-collapse {
        position: absolute;
        right: 0px;
        left: 0px;
        top: 85px;
        background: white;
        padding: 1rem;
        border-radius: 15px;
        box-shadow: var(--box-shadow);
        width: 97%;
        margin: auto;
        z-index: 9;
        border: 1px solid var(--bs-gray-400);
    }

    header .search input {
        top: 57px;
    }

    .dropdown-toggle::after {
        left: 0px;
        top: 50%;
        position: absolute;
    }

    .about .clip-photo, .about::after {
        display: none;
    }

    .about .about-des {
        padding: 0px;
    }

    .col-contact {
        width: 45%;
    }

    .col-contact.form {
        width: 55%;
    }
}

@media only screen and (max-width: 767px) {
    .header-top .lang::before {
        display: none;
    }

    .slider .caption-slider {
        font-size: 1rem;
    }

    .companies {
        padding: 2rem;
    }

    .news .swiperNews::after {
        display: none;
    }

    .news .inner h2.title {
        font-size: 1.2rem;
    }

    .news .pagination-news {
        height: 40px;
    }

    .about .photo-about {
        text-align: center;
    }

    .about .about-des h1 {
        text-align: center;
    }

    .about .about-des .bottom-about {
        margin-top: 2rem;
    }

    .gallery .list-item .photo::after {
        width: 600px;
        height: 68%;
        left: calc(50% - 300px);
        bottom: calc(-50%);
    }

    .col-contact, .col-contact.form {
        width: 100%;
        border-radius: 15px;
        margin-bottom: 2rem;
    }
}

@media only screen and (max-width: 575px) {
    .slider .swiper, .slider .swiper img, .slider .swiper a, .slider .swiper-slide-active::after {
        border-radius: 15px;
    }

    .slider .caption-slider {
        display: none;
    }

    .about .about-des .bottom-about {
        flex-direction: column;
    }

    .about .about-des a.btn {
        margin-bottom: 2rem;
    }

    .wrap .breadcrumb {
        width: 100%;
    }

    .wrap .breadcrumb ul li:first-child {
        padding-right: 0;
    }
}

@media print {
    body {
        -webkit-print-color-adjust: exact;
    }

    .wrap-mohtava .content-level-2::after, header, footer {
        display: none;
    }

    .wrap-mohtava .content-level-2 {
        background: white;
    }
}