@font-face {
    font-family: Vazir;
    src: url("../fonts/vazir/webfonts/Vazirmatn-FD-Thin.woff2") format("woff2");
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: Vazir;
    src: url("../fonts/vazir/webfonts/Vazirmatn-FD-ExtraLight.woff2") format("woff2");
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: Vazir;
    src: url("../fonts/vazir/webfonts/Vazirmatn-FD-Light.woff2") format("woff2");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: Vazir;
    src: url("../fonts/vazir/webfonts/Vazirmatn-FD-Regular.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: Vazir;
    src: url("../fonts/vazir/webfonts/Vazirmatn-FD-Medium.woff2") format("woff2");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: Vazir;
    src: url("../fonts/vazir/webfonts/Vazirmatn-FD-SemiBold.woff2") format("woff2");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: Vazir;
    src: url("../fonts/vazir/webfonts/Vazirmatn-FD-Bold.woff2") format("woff2");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: Vazir;
    src: url("../fonts/vazir/webfonts/Vazirmatn-FD-ExtraBold.woff2") format("woff2");
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: Vazir;
    src: url("../fonts/vazir/webfonts/Vazirmatn-FD-Black.woff2") format("woff2");
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}
:root{
    --gold: #f0bc16;
}
body {
    background-color: rgb(18, 18, 18);
    color: rgb(255, 255, 255);
    font-family: Vazir, sans-serif;
}

header.header {
    position: sticky;
    top: 0;
    z-index: 999;
    transition: background-color 0.3s ease;
}

header.header .navbar {
    height: 80px;
    position: absolute;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.8) !important;
}

.video-container {
    position: relative;
    width: 100%;
    height: 100%;
    max-height: 560px;
    overflow: hidden;
}
a, li, ul, div, button, input, select, img{
    outline: none;
}
@media (max-width: 768px) {
}

#video-bg {
    position: relative;
    top: 0px;
    left: 0px;
    width: 100%;
    max-height: 560px;
    min-height: 380px;
    object-fit: cover;
    z-index: -1;
}
.navbar-dark{user-select: none}
.navbar-dark .navbar-nav .nav-link {
    color: white;
    transition: 0.3ms;
    outline: none;
}

.navbar-dark .navbar-nav .nav-link:hover {
    color: var(--gold);
}

.navbar-dark .navbar-nav .dropdown-menu {
    background-color: rgb(28, 28, 28);
}

.navbar-dark .navbar-nav .dropdown-item {
    color: rgb(248, 249, 250);
    font-weight: 300;
    font-size: 0.9rem !important;
}
.navbar-dark .navbar-nav .dropdown-item:hover {
    background-color: rgb(52, 58, 64);
}

header.header .navbar .navbar-brand {
}

header.header .navbar .navbar-brand img {
    height: 60px;
}

.navbar-nav {
    gap: 10px;
    margin-right: 1rem;
}

.social-networks {
    list-style: none;
    padding: 0px;
    margin: 0px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.social-networks li {
}

.social-networks li a {
    color: rgba(255, 255, 255, 0.7);
    transition: 0.3ms;
}

.social-networks li a:hover {
    color: white;
}

.social-networks li a i {
    font-size: 18px;
}

.main-content {
    position: relative;
}

.card-inline-home {
    position: relative;
    overflow: hidden;
    height: 563px;
    color: white;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding: 15% 40px 20px;
}

.card-inline-home .image {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-position: center center;
    background-size: cover;
    transition: transform 1s;
    z-index: 0;
}

.card-inline-home::before {
    content: "";
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.44);
    z-index: 1;
    transition: opacity 0.5s;
}

.card-inline-home:hover .image {
    transform: scale(1.2);
}

.card-inline-home:hover::before {
}

.card-inline-home h2, .card-inline-home p, .card-inline-home a {
    position: relative;
    z-index: 2;
}

.card-inline-home h2 {
    font-size: 1.5rem;
}

.card-inline-home p.descr {
    line-height: 1.7;
    margin-top: 10px;
    font-weight: 300;
    font-size: 0.94rem;
    text-align: justify;
}

.card-inline-home a {
    text-underline-offset: 6px;
    color: white;
}
@media (max-width: 768px) {
    .card-inline-home{
        padding: 40px 15px 20px;
        height: 100%;
    }
    .card-inline-home h2{
        line-height: 1.7;
        font-size: 1.2rem;
    }
    .card-inline-home .descr{
        font-size: .875rem !important;
    }
    .card-inline-home a{}
}
@media (max-width: 660px) {
    .card-inline-home{
        /* max-height: 340px; */
        margin-bottom: 6px;
    }
}
.featured-article {
    padding: 80px 0px 40px;
}

.featured-article .article-content {
    display: flex;
    flex-direction: column;
    position: relative;
}

.featured-article .article-content h1, .featured-article .article-content h2 {
    font-size: 1.5rem;
    line-height: 1.5;
    margin-bottom: 20px;
}

.featured-article .article-content .descr {
    font-weight: 200;
    line-height: 2;
    color: rgba(255, 255, 255, 0.94);
    text-align: justify;
}

.featured-article .article-content a {
    display: flex;
    padding: 10px 15px;
    border: 1px solid rgba(255, 255, 255, 0.81);
    color: rgba(255, 255, 255, 0.81);
    text-decoration: none;
    width: auto;
    max-width: 200px;
    font-weight: 300;
    justify-content: space-between;
    align-items: center;
    outline: none;
    user-select: unset;
    transition: 0.3ms;
    position: relative;
    overflow: hidden;
}

.featured-article .article-content a::before {
    inset: 0px auto 0px 0px;
    content: "";
    display: block;
    position: absolute;
    transition: right 0.25s ease-in-out, left 0.25s ease-in-out, width 0.25s ease-in-out;
    width: 0px;
    z-index: -1;
    background: linear-gradient(90deg, rgb(132, 13, 129), rgb(254, 107, 69));
}

.featured-article .article-content a:hover {
    color: white;
}

.featured-article .article-content a:hover::before {
    right: 0px;
    left: auto;
    width: 100%;
}

.featured-article .article-content a span.name {
}

.featured-article .article-content a i {
    font-size: 19px;
    line-height: 1;
}

.featured-article .image-content {
}

.featured-article .image-content figure {
}

.featured-article .image-content figure img {
    border-radius: 4px;
}

.clearmtb {
    border: 1px solid #ffffff1f;
    margin: 40px 0px;
    display: flex;
    position: relative;
}
footer{
    background-color: #0c0c0c;
}
footer a{
    text-decoration: none;
}
.copyright-footer{
    background-color: #000000;
    border-color: #ffffff1a !important;
}
.text-200-kamrang{
    font-weight: 200;
}
.footer-aboutme{}
.footer-aboutme h3, .footer-service h3{
    font-size: 1.3rem;
    margin-bottom: 15px;
    color: #ffc200;
    font-weight: 500;
    margin-bottom: 25px;
}
.footer-aboutme p.descr{
    font-weight: 200;
    line-height: 1.68;
    color: rgb(255 255 255 / 80%) !important;
}
.social-networks-footer{}
.social-networks-footer a{
    font-size: 20px;
}
.social-networks-footer a:hover{color: #ffc200 !important;}

.service-list{}
.service-list a{
    color: rgb(255 255 255 / 80%) !important;
    font-weight: 200;
}
.service-list a:hover{color: white !important;}
.service-list i{
    color: #848484;
}

.nemads-footer{
    align-items: center;
}
.nemads-footer img{
    width: 100px;
    border-radius: 11px;
}
.sec-title{
    position: relative;
}
.sec-title h2{
    position: relative;
    font-size: 1.5rem;
    color: #222222;
    font-weight: 600;
    padding-bottom: 10px;
}
.sec-title h2:after{
    content: '';
    position: absolute;
    right: 40px;
    bottom: 0px;
    width: 40px;
    border-bottom: 2px solid #ffc200;
}
.sec-title h2:before{
    content: '';
    position: absolute;
    right: 0px;
    bottom: 0px;
    width: 40px;
    border-bottom: 2px solid #ffc200;

}

.last-news-home{
    background-color: white;
    padding:50px 0 50px;
}

.card-lastnews{
    display: flex;
    flex-direction: column;
    background: #f9f9f9;
    padding: 20px;
    border-radius: 5px;
}
.card-lastnews .image-box{
    position: relative;
    display: block;
    overflow: hidden;
    border-radius: 5px;
    margin-bottom: 15px;
}
.card-lastnews .image-box .image{
    margin: 0;
}
.card-lastnews .image-box .image img{
    display: block;
    width: 100%;
}
.card-lastnews .image-box .image .overlay-box{
    position: absolute;
    right: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.83);
    opacity: 0;
    -webkit-transition: all 700ms ease;
    -ms-transition: all 700ms ease;
    -o-transition: all 700ms ease;
    -moz-transition: all 700ms ease;
    transition: all 700ms ease;
}
.card-lastnews .overlay-box {
    position: absolute;
    right: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.83);
    opacity: 0;
    -webkit-transition: all 700ms ease;
    -ms-transition: all 700ms ease;
    -o-transition: all 700ms ease;
    -moz-transition: all 700ms ease;
    transition: all 700ms ease;
}
.card-lastnews:hover .overlay-box {
    opacity: 1;
}

.card-lastnews .image-box .overlay-box .link-box{
    position: absolute;
    right: 50%;
    top: 50%;
    width: 50px;
    height: 50px;
    margin-right: -25px;
    margin-top: -25px;
    text-align: center;
    line-height: 42px;
    font-size: 14px;
    color: #ffc300;
    border: 4px solid rgba(255, 195, 0, 0.34);
    border-radius: 50%;
}
.card-lastnews .image-box .overlay-box .link-box .icon{
    display: block;
    width: 42px;
    height: 42px;
    background: #ffffff;
    border-radius: 50%;
    -webkit-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    transition: all 300ms ease;
    margin-top: 0;
}
.card-lastnews .datetime{
    color: #666;
    display: block;
    font-size: .9rem !important;
    font-weight: 300;
}
.card-lastnews h3{
    font-size: 1rem;
    text-decoration: none;
    font-weight: 500;
    line-height: 1.6;
    padding: 10px 0;
    margin: 0;
}
.card-lastnews h3 a{color: black; text-decoration: none;}
.card-lastnews .description{
    margin: 0;
    padding: 0;
    font-weight: 200;
    color: #333;
    font-size: .95rem;
}

@media (min-width: 768px) {
    .navbar-nav .nav-item.mega-dropdown{
        position: static !important;
    }
}
.mega-menu {
    width: 100%;
    background: rgba(0, 0, 0, 0.80) !important;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
    border-radius: 0;
    top: 0;
    margin-top: 0 !important;
    border: 0 !important;
}

.mega-menu .row {
    margin: 0;
}

.mega-menu h6 {
    font-weight: bold;
    margin-bottom: 10px;
    color: white;
}

.mega-menu a {
    color: rgba(255, 255, 255, 0.70);

}

.mega-menu a:hover {

}
.megalist-links{
    position: relative;
}
.megalist-links li{
    list-style: none;
    display: flex;
    align-items: center;
}
.megalist-links li i.icon{
    font-size: 18px;
    line-height: 1;
    color: #999999;
}
.megalist-links li a{
    color: rgba(255, 255, 255, 0.70);
    text-decoration: none;
    font-size: 1rem;
    padding: 5px 0;
    display: block;
    font-weight: 300;
    transition: color 0.3s;
}
.megalist-links li:hover a{
    color: white;
}
.descraboutmega{
    color: rgba(255, 255, 255, 0.70);
    font-weight: 200;
    font-size: .9rem;
    text-align: justify;
    line-height: 1.66;
}


.section-bg-main{
    height: 380px;
    display: flex;
    flex-direction: column;
    position: relative;
    align-items: center;
    justify-content: center;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    /* filter: blur(4px); */
}

@media (min-width: 1440px) {
    .section-bg-main{
        height: 450px;
    }
    .section-bg-main.smallest{
        height: 380px;
    }
}

.section-bg-main:before{
    content: "";
    position: absolute;
    height: 100%;
    width: 100%;
    background-color: #00000054;
    backdrop-filter: saturate(160%) blur(4px);
}
.section-bg-main h1{
    z-index: 1;
    font-weight: bold;
    line-height: 1.66;
    text-shadow: 1px 1px 3px #0000007d;
}
.pages-body-section{
    background-color: #000000;
    position: relative;
    padding: 50px 0;
}
.fullstory{
    font-weight: 300;
    line-height: 1.67;
    color: rgb(255 255 255 / 94%);
    text-align: justify;
}
.fullstory h2{
    font-size: 1.5rem;
}
.fullstory h3{
    font-size: 1.3rem;
}


.blog-post{
    border: 1px solid #313131;
    padding: 10px;
    border-radius: 3px;
    background-color: #1a1a1a;
    position: relative;
    transition: background-color 0.3s ease;
    display: flex;
}
.blog-post:hover{
    background-color: #0e0e0e;
}
.blog-post img{
    width: 200px;
    border-radius: 4px;
    object-fit: cover;
    height: 160px;
}
.blog-post .detail{}
.blog-post .detail h5{
    line-height: 1.66;
    font-size: 1.1rem;
}
.blog-post .detail h5 a{
    color: white;
    text-decoration: none;
}
.blog-post .detail h5 a:hover{
    color: var(--gold);
}
.blog-post .detail small{}
.blog-post .detail p{
    font-size: .9rem;
    font-weight: 300;
}
.new_readmore{
    display: flex;
    padding: 7px 15px;
    color: rgba(255, 255, 255, 0.81);
    text-decoration: none;
    width: auto;
    max-width: 200px;
    font-weight: 300;
    justify-content: space-between;
    align-items: center;
    outline: none;
    user-select: unset;
    transition: 0.3ms;
    position: relative;
    overflow: hidden;
    float: left;
    font-size: .9rem;
    border-radius: 20px;
}

.new_readmore::before {
    inset: 0px auto 0px 0px;
    content: "";
    display: block;
    position: absolute;
    transition: right 0.25s ease-in-out, left 0.25s ease-in-out, width 0.25s ease-in-out;
    width: 0px;
    z-index: 0;
    background: linear-gradient(90deg, rgb(136 102 0), var(--gold));
}

.new_readmore:hover{
    color: black;
}
.new_readmore:hover::before {
    right: 0px;
    left: auto;
    width: 100%;
}

.new_readmore span.name {
    z-index: 1;
}

.new_readmore i {
    font-size: 19px;
    line-height: 1;
    z-index: 1;
}
.blog-post:hover .new_readmore:before{
    right: 0px;
    left: auto;
    width: 100%;
}

@media (max-width: 767px) {
    .blog-post{
        flex-direction: column;
    }
    .blog-post img{
        width: 100%;
        height: auto;
    }
    .blog-post .detail{
        margin-top: 10px;
    }
}

.sdbarbox{
    padding: 20px 15px;
    border-radius: 5px;
    background-color: #1a1a1a;
}
.sdbarbox .heading{
    margin-bottom: 15px;
    border-bottom: 1px solid #313131;
    padding-bottom: 7px;
    color: white;
}
.sdbarbox .heading h5{
    font-size: 1.1rem;
    line-height: 1;
    font-weight: 500;
}
.sdbarbox .sdbox-body{}

.category_list{
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.category_list li{
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center;
}
.category_list li a{
    text-decoration: none;
    color: hsl(0deg 0% 100% / 80%);
    font-weight: 300;
}
.category_list li a:hover{
    color: var(--gold);
}

.detailnews{
    display: flex;
    gap: 10px;
    font-size: .85rem;
    position: relative;
    align-items: center;
}
.detailnews .item{
    color: #ffffffc2;
    text-decoration: none;
}
.detailnews .item i{
    font-size: 18px;
}
.detailnews .item .value{}

.single-blog{
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.single-blog .image{
    border-radius: 10px;
    display: block;
    width: 100%;
    overflow: hidden;
}
.single-blog .image img{}
.single-blog .description{
    font-weight: 300;
    color: #ffffffd4;
    line-height: 1.67;
    font-size: .9rem;
    text-align: justify;
}
.single-blog .fulldescription{
    font-weight: 300;
    line-height: 1.67;
    font-size: 1rem;
    text-align: justify;
    position: relative;
    overflow: hidden;
    word-wrap: break-word;
}

.single-blog .fulldescription a{
    color: var(--gold);
    text-decoration: none;
}
.single-blog .fulldescription h2, .single-blog .fulldescription h3{
    font-size: 1.2rem;
    margin: 10px 0;
    font-weight: bold;
}
.socialshare{
    margin: 20px 0;
    border-top: 1px solid #ffffff36;
    padding: 15px 0;
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: end;
}
.socialshare a{
    background: #363636;
    border-radius: 6px;
    width: 38px;
    height: 38px;
    color: white;
    display: flex;
    align-items: center;
    transition: background-color 0.3s ease;
    vertical-align: middle;
    justify-content: center;
}
.socialshare a:hover{
    background-color: white;
}
.socialshare .icon-np-whatsapp{
    color: #25d22c;
}
.socialshare .icon-np-telegram, .socialshare .icon-np-telegram-1{
    color: #2196F3;
}
.socialshare .icon-np-eitaa{
    color: #FF9800;
}
.socialshare a i{
    font-size: 24px;
    line-height: 1;
}
.shortlink{
    border: none;
}
.shortlink i{}
.shortlink span{}

.addcomment{
    background: #15181b;
    padding: 20px;
    border-radius: 8px;
    position: relative;
}
.comment-item .avatar img {
    object-fit: cover;
}
.comment-box p, .reply-box p {
    word-wrap: break-word;
}
.replies {
    border-color: #e9ecef;
}

.popular-posts{}
.popular-posts .post-item{
    text-decoration: none;
    color: white;
    font-weight: 300;
}
.popular-posts .post-item .title{
    font-size: .9rem;
}
.popular-posts .post-item:hover {color: var(--gold)}
.card-link.abumlink{text-decoration: none; color: var(--gold)}
.album-card{
    background-color: #101010;
    border-color: #232222;
}
.album-card .card-body{}
.album-card .card-body .card-title{
    margin: 10px 0 20px;
    font-size: 1rem;
}
.boxVideo{
    position: relative;
    display: block;
    overflow: hidden;
    border-radius: 5px;
}
.boxVideo video{
    width: 100%;
}



.project-card{position: relative;display: flex;flex-direction: column;align-items: center;overflow: hidden;border-radius: 6px;}
.project-card .image{
    width: 100%;
    display: block;
}
.project-card .image img{
    max-width: 100%;
    object-fit: contain;
}
.project-card .project-card-body {
    background: #151618;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 15px;
}
.project-card .project-card-body:after{
    content: '';
    position: absolute;
    top: 0;
    height: 20px;
    width: 20px;
    background: inherit;
    transform: translate(50%, -50%) rotate(-45deg);
}
.project-card .project-card-body h5{
    display: block;
    text-align: right;
    width: 100%;
    margin-bottom: 1rem;
    margin-top: .54em;
    line-height: 1.6;
    color: var(--gold);
}
.project-card .project-card-body h5 a{
    color: var(--gold);
    text-decoration: none;
}
.project-card .project-card-body h5 a:hover{
    color: white;
}
.project-card .project-card-body .card-text{
    display: block;
    width: 100%;
    font-weight: 200;
    color: #c5c5c5;
    line-height: 1.6;
    margin-bottom: 0;
    text-align: justify;
    font-size: .9rem;
}

@media (max-width: 768px) {
    header.header .navbar{
        position: relative;
        height: auto;
    }
    .navbar-collapse.show{}
}
.hse_descr{
    text-align: justify;
    line-height: 1.66;
    font-weight: 300;
    color: #ffffffe8;
}

.hse_infobox{
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 300px;
    justify-content: center;
    position: relative;
    background: #1a1a1a;
    border-radius: 10px;
    overflow: hidden;
}
.hse_infobox:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    opacity: 0;
    transition: opacity 0.5s ease;
    z-index: 0;
}

.hse_infobox:hover:before {
    opacity: 1;
}

.hse_infobox.health:before {
    background-image: url('../images/hse/health-hse.jpg');
}

.hse_infobox.safety:before {
    background-image: url('../images/hse/safety-steel.jpg');
}

.hse_infobox.enviroment:before {
    background-image: url('../images/hse/Environment-item.jpg');
}
.hse_infobox.enviroment:before{}
.hse_infobox .hselabel{
    color: var(--gold);
    font-weight: bold;
    font-size: 3rem;
    margin-bottom: 20px;
}
.hse_infobox .hselabelen{
    font-size: 1.5rem;
    z-index: 1;
}
.hse_infobox .hselabelfa{
    font-size: 1.5rem;
    z-index: 1;
}
.hse_infobox:hover .hselabelen, .hse_infobox:hover .hselabelfa{text-shadow: 1px 3px 8px black;}


.hsItem {
    padding: 50px 0;
}
.hsebox_left {
    position: relative;
    background: rgba(255, 255, 255, 0.8);
    padding: 20px;
    max-width: 50%;
    right: 50%;
    transform: translateX(0);
    z-index: 2;
}
.hsebox_right {
    position: relative;
    background: rgba(255, 255, 255, 0.8);
    padding: 20px;
    max-width: 50%;
    left: 10%;
    transform: translateX(-10%);
    z-index: 2;
}
.hseItem_title{
    color: #333;
    font-size: 1.5rem;
}
.hseItem_description{
    color: #333;
    margin-top: 30px;
}
.hseItem_description.white{
    color: rgba(255, 255, 255, 0.85);
    margin-top: 30px;
}
.hseItem_description ul{}
.hseItem_description ul li{}
.hseItem_description ul li::marker {
    font-size: 1.5em;
    color: var(--gold);
}

.hsItem.health{
    background-image: url('../images/hse/health-parallax-bg.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    height: auto;
}
.hsItem.safety{
    background-image: url('../images/hse/safety-parallax-bg.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    height: auto;
}
.hsItem.enviroment{
    background-image: url('../images/hse/environmental-modern.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    height: auto;
}

@media (max-width: 768px) {
    .hsebox_right, .hsebox_left{
        left: auto;
        max-width: 100%;
        transform: none;
        right: auto;
    }
}