/* Home Page Start */
        
        body {
            background-color: white !important;
        }
        /* Hero Sec Start */
        
        .hero {
            /* background: rgb(34, 193, 195); */
            /* background: linear-gradient(0deg, var(--main-hover) 0%, var(--main-color) 0%, var(--main-hover) 100%, var(--secondary-color) 0%); */
            /* background-image: linear-gradient(to top, rgba(151, 203, 231, 0.2) 0%, rgba(164, 255, 164, 1) 20%, rgba(151, 203, 231, 0.7) 70%), url('Root/Img/backgrounds/3.jpg'); */
            /* background: var(--Gradint); */
            /* , url("/Root/Img/YY.JPG") no-repeat fixed; */
            /* linear-gradient(45deg, rgba(234, 236, 198, .7), rgba(250, 171, 69, 0.733), rgba(100, 216, 243, .7), rgba(250, 171, 69, 0.733), rgba(52, 219, 216, .7)) 0 0 / 1000%; */
            /* linear-gradient(60deg, var(--secondary-color) 0%, #000 100%); */
            /* background: url("/Root/Img/backgrounds/3.jpg") no-repeat cover; */
            /* background-position: relative;
background-repeat: no-repeat; */
            /* background-clip: border-box; */
            background-size: cover;
            height: 80vh;
            margin-top: 0.01rem;
            z-index: 0;
        }
        
        @-webkit-keyframes cube {
            from {
                transform: scale(0) rotate(0deg) translate(-50%, -50%);
                opacity: 1;
            }
            to {
                transform: scale(5) rotate(960deg) translate(-50%, -50%);
                opacity: 0;
            }
        }
        
        @keyframes cube {
            from {
                transform: scale(0) rotate(0deg) translate(-50%, -50%);
                opacity: 1;
            }
            to {
                transform: scale(5) rotate(960deg) translate(-50%, -50%);
                opacity: 0;
            }
        }
        /* Hero Logo Responsive Start*/
        /* // Small devices (landscape phones, 576px and up) */
        
        @media (min-width: 576px) {
            .section-Logo {
                position: relative;
                width: 100%;
                height: auto;
                top: 100;
            }
        }
        
        @media (max-width: 576px) {
            .section-Logo {
                position: relative;
                width: 100%;
                height: auto;
                /* top: 100; */
            }
        }
        
        @media (width: 450px) {
            .section-Logo {
                position: relative;
                width: 100%;
                height: auto;
                /* top: 100; */
            }
        }
        
        @media (width: 414px) {
            .section-Logo {
                position: relative;
                width: 100%;
                height: auto;
                top: 100;
            }
        }
        
        @media (max-width: 393px) {
            .section-Logo {
                position: relative;
                width: 100%;
                height: auto;
                top: 100;
            }
        }
        
        @media (width: 412px) {
            .section-Logo {
                position: relative;
                width: 100%;
                height: auto;
                top: 100;
            }
        }
        
        @media (max-width: 378px) {
            .section-Logo {
                position: relative;
                width: 160%;
                height: 36%;
                top: 50;
            }
        }
        /* // Medium devices (tablets, 768px and up) */
        
        @media (min-width: 768px) {
            .section-Logo {
                position: relative;
                width: 100%;
                height: auto;
                top: 40;
            }
        }
        /* // Large devices (desktops, 992px and up) */
        
        @media (min-width: 992px) {
            .section-Logo {
                width: 100%;
                height: 55%;
            }
        }
        /* // Extra large devices (large desktops, 1200px and up) */
        
        @media (min-width: 1200px) {
            .section-Logo {
                position: relative;
                width: 100%;
                height: auto;
                top: 90;
            }
        }
        /* Hero Sec End */
        /* News Sec Start */
        
        .main-news,
        .proj-ect {
            /* height: 80vh; */
        }
        /*  */
        
        .dropdown-menu {
            box-shadow: rgb(14 30 37 / 12%) 0px 2px 4px 0px, rgb(14 30 37 / 32%) 0px 2px 16px 0px;
        }

        .Toggoler .dropdown-toggle::after {
            display: inline-block;
        }
        
        .custom-block-image {
            border-radius: var(--radius);
            display: block;
            /* width: 112px;
            height: 112px; */
            object-fit: cover;
        }
        
        .custom-block-icon-wrap {
            border-radius: var(--radius);
            position: relative;
            overflow: hidden;
        }
        
        .section-title {
            padding: .5rem;
            font-family: var(--heading-font) !important;
            color: var(--main-color);
            /* font-size: 30px; */
            position: relative;
        }
        
        @media(max-width:912px) {
            .proj-ect .section-title::before {
                display: none !important;
            }
        }
        
        .proj-ect .section-title::before,
        .section-title::after {
            content: "";
            display: inline-block;
            width: 41vw;
            height: 3px;
            background: var(--secondary-color);
            left: 0;
        }
        
        .boundary {
            border-bottom: 1px solid var(--main-color);
            /* border-radius: var(--radius); */
            padding: 0;
        }
        
        .text-primary {
            color: var(--main-color) !important;
        }
        
        .text-secondary {
            color: var(--secondary-color) !important;
        }
        
        .pro {
            /* background: var(--main-color); */
            background: #fff !important;
            border-radius: 5px;
            border: 3px solid var(--main-color);
            text-align: center;
            position: relative;
            top: 50px;
            margin-top: -25px;
            padding: 8px;
            width: 100px;
            height: 100px;
            transform: rotate(45deg);
        }
        
        .pro h5 {
            transform: rotate(-45deg);
        }
        
        .max-letter:first-of-type::first-letter {
            color: var(--secondary-color);
            float: start;
            font-size: 4rem;
            line-height: 4vw;
            padding-right: 8px;
            /* border: 0.25em double; */
        }
        
        .swiper-pagination .swiper-pagination-bullets {
            margin-top: 5rem !important;
        }
        
        .swiper-pagination-bullet,
        .carousel-indicators {
            width: 8px;
            height: 8px;
            border-radius: 0 !important;
            transform: rotate(45deg) !important;
            background: var(--secondary-color) !important;
            text-align: center !important;
        }
        
        .swiper-pagination-bullet-active,
        .carousel-indicators .active {
            background: var(--main-color) !important;
        }
        /* Partaners */
        /* .Partaners .swiper-container,
.esdarat .swiper-container {
direction: ltr;
} */
        /* .Partaners .swiper-container .swiper-slide {
padding: 2rem;
text-align: center;
font-size: 1.5rem;
height: auto !important;
background: none;
background-position: center;
background-size: cover;
border-radius: var(--radius);
box-shadow: rgb(14 30 37 / 12%) 0px 2px 4px 0px, rgb(14 30 37 / 32%) 0px 2px 16px 0px;
} */
        
        .section-bg {
            /* background: var(--VerticalBlueGradint), url("/Root/Img/YY.JPG") no-repeat fixed; */
            background-size: cover;
            height: 90vh;
        }
        
        .imgGray {
            filter: grayscale(100);
        }
        
        .imgGray:hover {
            filter: none;
            /* transform: scale(1.1); */
        }
        
        .border-secondary {
            border-bottom: .5vmin solid white !important;
        }
        /*  */
        
        .progress-secondary-color {
            background-color: var(--secondary-color) !important;
            ;
        }
        
        .progress-primary-color {
            background-color: var(--main-color) !important;
            ;
        }
        /*  */
        
        .title-year {
            /* transform: rotate(-45deg) !important; */
        }
        /* //////////// share /////////// */
        
        .icon-socials-shares ul {
            list-style: none;
            display: flex;
            flex-direction: row;
            padding-inline-start: 0px;
        }
        
        .icon-socials-shares ul li a {
            color: var(--secondary-color) !important;
            font-size: 1rem;
            margin: 0 1px;
            transition: 0.4s;
        }
        
        .icon-socials-shares ul li a:hover {
            color: black;
        }
        
        .lighto:hover {
            background: var(--main-color);
        }
        /*  */
        /* front project and products */
        
        #swiper-Fildes {
            height: 350px !important;
        }
        
        #swiper-Fildes-project {
            height: 350px !important;
        }
        
        .product-type-div {
            /* background: var(--main-color); */
            background: #ebebe9 !important;
            border-radius: 5px;
            /* border: 3px solid var(--main-color); */
            text-align: center;
            position: relative;
            top: 0px;
            margin-top: 0px;
            padding: 2rem;
            /* width: 200px;
height: 200px; */
            /* transform: rotate(45deg); */
            cursor: pointer;
        }
        
        .product-type-div:hover {
            display: block;
            transition: all 0.2s ease-in-out;
            top: -1.2rem;
            box-shadow: 0 19px 20px rgba(12, 138, 195, 0.5270483193277311), 0 19px 20px rgba(252, 159, 92, 0.636) !important;
            /* z-index: 100000; */
        }
        /* product-type-div active style start */
        
        .product-type-div.ptype-active {
            background-color: white !important;
            /* box-shadow: 0 19px 20px rgba(12, 138, 195, 0.5270483193277311), 0 19px 20px rgba(252, 159, 92, 0.636) !important; */
        }
        
        .product-type-div::after,
        .product-type-div::before {
            border: 0;
            content: "";
            position: absolute;
            width: 10px;
            height: 10px;
            transition: all 0.5s cubic-bezier(0.68, 0.55, 0.265, -1.55);
            /* display: none; */
        }
        
        .product-type-div:hover::after,
        .product-type-div:hover::before {
            display: block;
        }
        
        .product-type-div::before {
            border: 0;
            background-color: var(--main-color);
            top: 2.40rem;
            left: -2.3rem;
            -webkit-animation: topAnimation 2s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0.25s infinite alternate;
            animation: topAnimation 2s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0.25s infinite alternate;
            box-shadow: 0 19px 38px rgba(5, 63, 89, 1), 0 15px 12px rgba(12, 138, 195, 0.5270483193277311) !important;
        }
        
        .product-type-div::after {
            background-color: var(--secondary-color);
            top: 4rem;
            left: 10rem;
            -webkit-animation: bottomAnimation 2s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0.5s infinite alternate;
            animation: bottomAnimation 2s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0.5s infinite alternate;
            box-shadow: 0 19px 38px rgba(79, 45, 21, 0.779), 0 15px 12px rgba(252, 159, 92, 0.636) !important;
        }
        
        .product-type-div::after,
        .product-type-div::before {
            border: 0;
            content: "";
            position: absolute;
            width: 15px;
            height: 15px;
            transition: all 0.5s cubic-bezier(0.68, 0.55, 0.265, -1.55);
            opacity: 70%;
            background-color: #818078 !important;
            display: none;
        }
        
        .product-type-div::before {
            border: 0;
            top: -0.45rem;
            left: 2.3rem;
            -webkit-animation: topAnimation 2s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0.25s infinite alternate;
            animation: topAnimation 2s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0.25s infinite alternate;
            box-shadow: 0 0 0 rgba(5, 63, 89, 1), 0 0 0 rgba(12, 138, 195, 0.5270483193277311) !important;
        }
        
        .product-type-div::after {
            top: 14rem;
            left: 12.5rem;
            -webkit-animation: bottomAnimation 2s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0.5s infinite alternate;
            animation: bottomAnimation 2s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0.5s infinite alternate;
            box-shadow: 0 0 0 rgba(79, 45, 21, 0.779), 0 0 0 rgba(252, 159, 92, 0.636) !important;
        }
        
        .product-type-div:hover::after {
            background-color: var(--secondary-color) !important;
            display: block;
            box-shadow: 0 19px 38px rgba(79, 45, 21, 0.779), 0 15px 12px rgba(252, 159, 92, 0.636) !important;
        }
        
        .product-type-div:hover::before {
            background-color: var(--main-color) !important;
            display: block;
            box-shadow: 0 19px 38px rgba(5, 63, 89, 1), 0 15px 12px rgba(12, 138, 195, 0.5270483193277311) !important;
        }
        /* active start*/
        
        .product-type-div.ptype-active::after,
        .product-type-div.ptype-active::before {
            border: 0;
            content: "";
            position: absolute;
            width: 15px;
            height: 15px;
            transition: all 0.5s cubic-bezier(0.68, 0.55, 0.265, -1.55);
            display: block !important;
            opacity: 100%;
        }
        
        .product-type-div.ptype-active::after {
            border: 0;
            background-color: var(--secondary-color) !important;
            top: 13.1rem;
            left: 12.5rem;
            -webkit-animation: bottomAnimation 2s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0.5s infinite alternate;
            animation: bottomAnimation 2s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0.5s infinite alternate;
            box-shadow: 0 19px 38px rgba(79, 45, 21, 0.779), 0 15px 12px rgba(252, 159, 92, 0.636) !important;
        }
        
        .product-type-div.ptype-active::before {
            border: 0;
            background-color: var(--main-color) !important;
            top: -0.45rem;
            left: 2.3rem;
            -webkit-animation: topAnimation 2s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0.25s infinite alternate;
            animation: topAnimation 2s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0.25s infinite alternate;
            box-shadow: 0 19px 38px rgba(5, 63, 89, 1), 0 15px 12px rgba(12, 138, 195, 0.5270483193277311) !important;
        }
        /* product-type-div active style end */
        /* add article */
        
        .Add-Article {
            border: 1px var(--main-color) solid;
            border-style: ridge;
        }
        /* Opinions  */
        /* .profYWBOD {
border-radius: 15px 30px;
background: #818078;
width: 100px;
height: 100px;
} */
        
        .multiple-option option::before {
            content: '\2610';
            display: inline-block;
            -webkit-appearance: checkbox;
        }
        
        .multiple-option option:checked::before {
            content: "\2611";
        }
        
        @media (max-width: 786px) {
            .d-flex-sm {
                display: flex !important;
                flex-direction: column;
            }
        }
        
        .text-truncate {
            white-space: normal;
        }
        
        .container {
            background-color: white !important;
        }