header { background-color: rgba(0, 0, 12, 0.5);color: #fff; z-index: 1000; } header a { color: #fff; } header::after { content: ""; width: 100%; height: 2px; background-color: rgba(255, 255, 255, 0.02); position: absolute; left: 0; bottom: -20px; } .nav-link { font-family: "Cairo", sans-serif; text-transform: uppercase; } .contact { font-size: 12px; } .tel { margin-right: 30px; } .contact i { color: #fff; margin-right: 10px; } .login { padding: 10px 20px; font-size: 14px; margin-right: 25px; text-transform: uppercase; } .contact a:hover, .login:hover { color: rgba(255, 255, 255, 0.5); text-decoration: none; } .login i { color: #ee1515; margin-right: 8px; } .navbar-brand h1 { margin: 0; } .social { padding-left: 0; margin: 0; list-style: none; } .social li:not(:last-child) { margin-right: 20px; } .social a { font-size: 14px; display: inline-block; width: 40px; height: 40px; border: 1px solid #fff; border-radius: 4px; line-height: 40px; text-align: center; background-color: transparent; transition: all 0.25s ease-in-out; } .social a:hover { color: #fff; background-color: #b0cde8; } .navbar-brand img { width: 135px; } .navbar-collapse .search-form input[type="text"] { border: 1px solid #ced4da; color: #333; padding: 1.5625rem 0.625rem; } .navbar-collapse .search-form .btn { margin-top: 0; border-radius: 0; margin-left: -1px; } .navbar-collapse .nav-link { font-size: 1.125rem; transition: all 0.2s ease-in-out; } .navbar-collapse .nav-link:hover { color: #ee1515; } .cart, .login-icon, .search-icon { color: #fff; font-size: 1.5rem; } .cart:hover, .login-icon:hover, .search-icon:hover { color: #ee1515; } .cart { margin-left: 20px; } form input.btn-primary:hover, form button.btn-primary:hover { background-color: #fff; color: #09437a; } .hero { background: url("../images/hero-bg.webp") no-repeat center; background-size: cover; overflow: hidden; position: relative; z-index: 0; } .herome { background: url("../images/aboutus.webp") no-repeat center; background-size: cover; overflow: hidden; position: relative; z-index: 0; } .herome .container { position: relative; z-index: 5; } .herome .slide-content { min-height: 600px; color: #fff; } .herome .slide-content span { color: #ee1515; } .herome .slide-content h1 { color: #fff; text-shadow: 0px 2px 4px rgba(0, 0, 0, 0.56); text-transform: uppercase; -webkit-transform: matrix(0.93128, 0, 0, 0.93128, 0, 0); transform: matrix(0.93128, 0, 0, 0.93128, 0, 0); font-weight: bold; } .herome .slide-content p { color: #170936; -webkit-transform: matrix(0.93128, 0, 0, 0.93128, 0, 0); transform: matrix(0.93128, 0, 0, 0.93128, 0, 0); padding: 35px 0 35px 30px; background-color: rgba(255, 255, 255, 0.51); border-top-right-radius: 100px; border-bottom-left-radius: 10px; margin-bottom: 0; } .herome .slide-content .btn { margin-top: 50px; } .herome .slide-content .btn:last-child { margin-left: 30px; }.herome .diag-bg { width: 100%; height: 100%; -webkit-clip-path: polygon(0 0, 100% 100%, 100% 0); clip-path: polygon(0 0, 100% 100%, 100% 0); background-color: rgba(0, 0, 255, 0.05); position: absolute; top: 0; left: 0; z-index: -1; } .herome .texture { width: 100%; height: 100%; background: url("../images/hero-texture.webp") no-repeat center; background-size: cover; opacity: 0.4; position: absolute; top: 0; left: 0; z-index: -1; } .herome::after { content: ""; width: 100%; height: 2px; background-color: rgba(255, 255, 255, 0.02); position: absolute; left: 0; bottom: 29%; } .herome::before { content: ""; width: 100%; height: 2px; background-color: rgba(255, 255, 255, 0.02); position: absolute; left: 0; bottom: 58%; } .heroim { background: url("../images/O5X8JH0.webp") no-repeat center; background-size: cover; overflow: hidden; position: relative; z-index: 0; } .heromed { background: url("../images/F11.webp") no-repeat center; background-size: cover; overflow: hidden; position: relative; z-index: 0; } .herocp { background: url("../images/F12.webp") no-repeat center; background-size: cover; overflow: hidden; position: relative; z-index: 0; } .heromeb { background: url("../images/F13.webp") no-repeat center; background-size: cover; overflow: hidden; position: relative; z-index: 0; } .heroremb { background: url("../images/F15.webp") no-repeat center; background-size: cover; overflow: hidden; position: relative; z-index: 0; } .herocms { background: url("../images/F16.webp") no-repeat center; background-size: cover; overflow: hidden; position: relative; z-index: 0; } .herofor { background: url("../images/F17.webp") no-repeat center; background-size: cover; overflow: hidden; position: relative; z-index: 0; } .hero .container { position: relative; z-index: 5; } .hero .slide-content { min-height: 600px; color: #fff; } .hero .slide-content span { color: #ee1515; } .hero .slide-content h1 { color: #fff; text-shadow: 0px 2px 4px rgba(0, 0, 0, 0.56); text-transform: uppercase; -webkit-transform: matrix(0.93128, 0, 0, 0.93128, 0, 0); transform: matrix(0.93128, 0, 0, 0.93128, 0, 0); font-weight: bold; } .hero .slide-content p { color: #170936; -webkit-transform: matrix(0.93128, 0, 0, 0.93128, 0, 0); transform: matrix(0.93128, 0, 0, 0.93128, 0, 0); padding: 35px 30px 35px 30px; background-color: rgba(255, 255, 255, 0.51); border-top-right-radius: 100px; border-bottom-left-radius: 100px; margin-bottom: 0; } .hero .slide-content .btn { margin-top: 50px; } .hero .slide-content .btn:last-child { margin-left: 30px; } .hero .arr-left, .hero .arr-right { font-size: 3rem; display: block; color: #fff; text-align: center; position: absolute; top: 85%; -webkit-transform: translateY(-50%); transform: translateY(-50%); z-index: 9; } .hero .arr-left:hover, .hero .arr-right:hover { cursor: pointer; } [dir="rtl"] .hero .arr-left, [dir="rtl"] .hero .arr-right { left: 15px; right: auto; } [dir="rtl"] .hero .arr-right { left: auto;right: 15px; } [dir="ltr"] .hero .arr-left { left: 15px; right: auto; } [dir="ltr"] .hero .arr-right { left: auto; right: 15px; } .hero .arr-right { right: 15px; }.hero .diag-bg { width: 100%; height: 100%; -webkit-clip-path: polygon(0 0, 100% 100%, 100% 0); clip-path: polygon(0 0, 100% 100%, 100% 0); background-color: rgba(0, 0, 255, 0.1); position: absolute; top: 0; left: 0; z-index: -1; } .hero .texture { width: 100%; height: 100%; background: url("../images/hero-texture.webp") no-repeat center; background-size: cover; opacity: 0.4; position: absolute; top: 0; left: 0; z-index: -1; } .hero::after { content: ""; width: 100%; height: 2px; background-color: rgba(255, 255, 255, 0.02); position: absolute; left: 0; bottom: 29%; } .hero::before { content: ""; width: 100%; height: 2px; background-color: rgba(255, 255, 255, 0.02); position: absolute; left: 0; bottom: 58%; } .cta-content { padding: 30px 0 90px; color: #fff; background-color: #8b99c7; position: relative; z-index: 1; } .cta-content::after { content: ""; width: 100%; height: 100%; background-color: rgba(2, 28, 84, 0.55); position: absolute; top: -25px; left: -1px; z-index: -1; transition: all 0.2s ease-in-out; } .cta-content .subscribe-btn { align-self: flex-end; margin-right: 30px; } .title { font-weight: 700; text-transform: uppercase; } .title h6 { letter-spacing: 4px; margin-bottom: 20px; } .title h1 { font-size: 35px; } .title .title-blue { color: #26264b; } .title .title-primary { color: #fff; } .services { padding: 80px 0 50px; } .services .title { margin-bottom: 20px; } .services .media { margin: 40px 0; } .services h5 { color: #26264b; border-bottom: 2px solid #e7e7e7; padding-bottom: 5px; margin-bottom: 10px; }.featured { padding: 80px 0; background-color: #fafafa; } .featured p { margin: 35px 0 53px; } .featured .media i { font-size: 24px; color: #ee1515; } .featured .media h5 { text-transform: uppercase; color: #26264b; } .featured .btn { margin-top: 80px; } .featured-img { position: relative; height: 530px; margin-top: 60px; } .featured-big { position: absolute; bottom: 0; right: 0; } .featured-small { position: absolute; bottom: 0; left: 0; padding: 25px 25px 0 0; background-color: #fff; }.recent-posts { padding: 65px 0 100px; } .recent-posts .btn { margin-top: 60px; } .recent-posts .row .col-lg-6:nth-of-type(odd) .post-thumb { margin-top: 30px; } .recent-posts .row .col-lg-6:nth-of-type(even) .post-thumb { margin-bottom: 30px; } .single-rpost { margin: 3px 0 0; } .post-thumb { flex: 0 0 273px; } .post-content { color: #ccc; } .post-content time { font-size: 14px; color: #ccc; } .post-content h3 { margin: 10px 0 2px; } .post-content h3 a { color: #26264b; font-weight: 600; } .post-content h3 a:hover { font-weight: 700; text-decoration: none; } .post-content a { color: #ccc; } .post-content a:hover { color: #26264b; } .post-content .post-btn { color: #6e6e6e; text-align: center; font-size: 10px; display: inline-block; width: 38px; height: 38px; line-height: 38px; border-radius: 50%; background-color: whitesmoke; } .post-content .post-btn:hover { color: #fff; background-color: #09437a; }.trust { padding: 75px 0; background-color: #26264b; color: #ddd; position: relative; } .trust .title { margin-bottom: 46px; } .trust h1 { color: #fff; } .trust h5 { font-size: 24px; color: #fefefe; margin: 28px 0 12px; } .trust ul { color: #fff; -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; } .trust li { margin-bottom: 15px; } .trust .gallery img { width: 100%; -o-object-fit: cover; object-fit: cover; height: 100%; } .trust .gal-img { display: inline-block; position: relative; z-index: 1; } .trust .gal-img i { font-size: 72px; color: #fff; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); opacity: 0; z-index: 2; } .trust .gal-img::after { content: ""; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.6); position: absolute; top: 0; left: 0; opacity: 0; transition: all 0.2s ease-in-out; } .trust .gal-img:hover { cursor: pointer; } .trust .gal-img:hover i { opacity: 1; } .trust .gal-img:hover::after { opacity: 1; } .trust .gal-img3 { top: -50%; left: 50%; } .pricing-table { padding: 100px 0; } .single-pricing { padding: 65px 0 40px; margin-top: 23px; color: #fff; background: #2d7699; border: 0px solid #fff; position: relative; overflow: hidden; z-index: 1; transition: all 0.2s ease-in-out; } .single-pricing span { font-size: 12px; text-transform: uppercase; padding: 6px 15px; border-radius: 15px; background-color: transparent; position: absolute; top: 28px; right: 6px; transition: all 0.2s ease-in-out; } .single-pricing h2 { margin-bottom: -5px; } .single-pricing .desc { color: #9d9d9d; padding-bottom: 30px; margin-bottom: 32px; border-bottom: 2px solid #2f2f2f; transition: all 0.2s ease-in-out; }.single-pricing .price { font-size: 2rem; margin-bottom: 8px; } .single-pricing p { color: #ddd; } .single-pricing p:last-of-type { margin-bottom: 25px; } .single-pricing svg { width: 170px; position: absolute; top: -45px; right: -60px; z-index: -1; transition: all 0.5s ease-in-out; } .single-pricing:hover { border: 4px solid #fff; box-shadow: 0px 10px 18px 0px rgba(0, 0, 0, 0.16); margin: 19px 0 -4px; } .single-pricing:hover span { background-color: #26264b; } .single-pricing:hover .desc { color: #fff; border-bottom: 2px solid rgba(245, 245, 245, 0.322); } .single-pricing:hover svg { width: 500%; top: -200%; right: -50%; } .single-pricing:hover .btn { box-shadow: 0px 3px 7px 0px rgba(0, 0, 0, 0.35); } .testimonial-and-clients { background: url(../images/test-clients-bg.webp) center center/cover no-repeat #3f75a7; } .testimonials { padding: 95px 0 85px; color: #fff; border-bottom: 1px solid #26264b; } .testimonials .test-img { width: 600px; height: 400px; border-radius: 10%; margin: auto; overflow: hidden; display: flex; align-items: center; justify-content: center; } .testimonials .test-img img { width: 100%; height: 100%; object-fit: cover; border-radius: 10%; } .testimonials h5 { color: #26264b; margin-top: 15px; } .testimonials span { color: #c4c4c4; display: inline-block; margin: 0 0 17px; } .testimonials p { font-size: 17px; line-height: 27px; } .test-pagination { text-align: center; margin-top: 8px; } .test-pagination span { width: 9px; height: 9px; border-radius: 50%; background-color: #26264b; margin-bottom: 0; transition: all 0.2s ease-in-out; } .test-pagination span:hover { cursor: pointer; } .test-pagination span:not(:last-child) { margin-right: 10px; } .test-pagination span.swiper-pagination-bullet-active { width: 12px; height: 12px; background-color: white; }.clients { padding: 70px 0; } .clients .swiper-wrapper { text-align: center; } .cta2 { margin: 50px 0 -30px; } footer { background: url(../images/test-clients-bg.webp) center center/cover no-repeat #26264b; } .footer-widgets { padding: 100px 0; } .footer-widgets .col-md-6 .single-widget:not(:first-child) .widget-tiltle { margin: 40px 0 30px; } .single-widget { color: #aaa; } .single-widget .widget-tiltle { font-size: 17px; text-transform: uppercase; color: #fff; margin-bottom: 45px; } .single-widget i { color: #ffffff; } .single-widget h6 { color: #fff; } .single-widget .media { margin-bottom: 20px; } .contact-widget a { color: #aaa; } .contact-widget i { font-size: 22px; } .twitter-widget i, .twitter-widget h6 { color: #777; } span { color: #fff; } .recent-post-widget .rcnt-img { width: 68px; height: 68px; border-radius: 4px; overflow: hidden; } .recent-post-widget .rcnt-img img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .recent-post-widget a { color: #fff; } .recent-post-widget p { font-size: 13px; } .recent-post-widget i { margin-right: 10px; } .recent-post-widget i:last-of-type { margin-left: 15px; } .tags-widget { margin: -10px -10px 0 0; } .tags-widget a { color: #aaa; display: inline-block; padding: 10px 12px; border-radius: 2px; background-color: #363636; font-size: 14px; font-family: "Cairo", sans-serif; font-weight: 700; margin: 10px 10px 0 0; } .tags-widget a:hover { text-decoration: none; color: #26264b; background-color: #ee1515; } .subscribe-widget form { margin-bottom: 10px; } .subscribe-widget input { font-size: 14px; padding: 0px 10px; background-color: #444; border: none; line-height: 0; position: relative; z-index: 1; } .subscribe-widget input:focus { outline: none; box-shadow: none; } .subscribe-widget button { background: #ee1515; border: none; padding: 9px 14px; border-top-right-radius: 10px; border-bottom-left-radius: 10px; margin-left: -10px; position: relative; z-index: 5; } .subscribe-widget button i { color: #fff; } .subscribe-widget .social-nav { margin-top: 32px; } .subscribe-widget .social-nav a { display: inline-block; text-align: center; width: 36px; height: 36px; line-height: 36px; background-color: #fff; color: #ddd; background-color: #444; border-top-right-radius: 10px; border-bottom-left-radius: 10px; margin-right: 10px; } .subscribe-widget .social-nav a i { color: #ddd; } .subscribe-widget .social-nav a:hover { background-color: #402fc5; } .foot-note { padding: 35px ; background-color: #27274921; color: #fff; } .foot-note a { color: #fff; } .foot-note a:last-child { margin-left: 30px; }.foot-note a.fh5-link { margin-left: 0; } .portfolio-item { display: block; position: relative; overflow: hidden; max-width: 530px; margin: auto auto 1rem; } .portfolio-item .caption { display: flex; height: 100%; width: 100%; background-color: rgb(206 230 255 / 20%);; position: absolute; top: 0; bottom: 0; z-index: 1; } .portfolio-item .caption .caption-content { color: #fff; margin: auto 2rem 2rem; } .portfolio-item .caption .caption-content h2, .portfolio-item .caption .caption-content .h2 { font-size: 0.8rem; text-transform: uppercase; } .portfolio-item .caption .caption-content p { font-weight: 300; font-size: 1.2rem; } @media (max-width: 992px) { .portfolio-item { max-width: none; margin: 0; } .portfolio-item .caption { transition: -webkit-clip-path 0.25s ease-out, border-radius 0.25s ease-out; transition: clip-path 0.25s ease-out, border-radius 0.25s ease-out; transition: clip-path 0.25s ease-out, -webkit-clip-path 0.25s ease-out, border-radius 0.25s ease-out; -webkit-clip-path: inset(-1px); clip-path: inset(-1px); border-radius: 23%; } .portfolio-item .caption .caption-content { transition: opacity 0.25s; margin-left: 5rem; margin-right: 5rem; margin-bottom: 5rem; } .portfolio-item img { transition: -webkit-clip-path 0.25s ease-out, border-radius 0.25s ease-out; transition: clip-path 0.25s ease-out, border-radius 0.25s ease-out; transition: clip-path 0.25s ease-out, -webkit-clip-path 0.25s ease-out, border-radius 0.25s ease-out; -webkit-clip-path: inset(-1px); clip-path: inset(-1px); border-radius: 50px; } .portfolio-item:hover img { -webkit-clip-path: inset(2rem); clip-path: inset(2rem); border-radius: 50px; }.portfolio-item:hover .caption { background-color: rgba(0, 17, 56, 0.8); -webkit-clip-path: inset(2rem); clip-path: inset(2rem); } } @media (min-width: 992px) { .portfolio-item { max-width: none; margin: 0; } .portfolio-item .caption { transition: -webkit-clip-path 0.25s ease-out, border-radius 0.25s ease-out; transition: clip-path 0.25s ease-out, border-radius 0.25s ease-out; transition: clip-path 0.25s ease-out, -webkit-clip-path 0.25s ease-out, border-radius 0.25s ease-out; -webkit-clip-path: inset(-1px); clip-path: inset(-1px); border-radius: 23%; } .portfolio-item .caption .caption-content { transition: opacity 0.25s; margin-left: 5rem; margin-right: 5rem; margin-bottom: 5rem; } .portfolio-item img { transition: -webkit-clip-path 0.25s ease-out, border-radius 0.25s ease-out; transition: clip-path 0.25s ease-out, border-radius 0.25s ease-out; transition: clip-path 0.25s ease-out, -webkit-clip-path 0.25s ease-out, border-radius 0.25s ease-out; -webkit-clip-path: inset(-1px); clip-path: inset(-1px); border-radius: 50px; } .portfolio-item:hover img { -webkit-clip-path: inset(2rem); clip-path: inset(2rem); border-radius: 50%; } .portfolio-item:hover .caption { background-color: rgba(0, 17, 56, 0.8); -webkit-clip-path: inset(2rem); clip-path: inset(2rem); } } .faq-section .wrapper .faq-content { box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.08); background: #fff; border-radius:5px; padding: 43px 50px 60px 50px; } .accordion-one .panel-heading { padding: 0; border-radius: 0; border:none; border-bottom: 1px solid #e6e6e6; } .accordion-one .panel-heading h6 a { color:#232323; padding: 15px 25px 15px 0; display: block; position: relative; } .accordion-one .panel-group .panel { margin: 0; box-shadow: none; border-radius: 0; border:none; } .accordion-one .panel-group .panel-body {border:none;padding: 20px 0;border-bottom: 1px solid #e6e6e6;} .accordion-one .panel-group .panel-heading a:before { content: "\f10a"; font-family: Flaticon; font-size: 20px; color: #41c4ff69; position: absolute; right:0; top:50%; -webkit-transform:translateY(-50%); transform:translateY(-50%); font-weight: normal; } .accordion-one .panel-group .panel-heading.active-panel a:before {content: "\f109";} .service-details .service-content .accordion-one .panel-group .panel-body p {padding: 0;} .faq-page .faq-panel .panel-group { border:1px solid #efefef; border-bottom: none; } .faq-page .faq-panel .panel {margin: 0;} .faq-page .panel-group .panel-heading h6 a { color:#1c2125; padding: 24px 63px 24px 30px; display: block; position: relative; } .faq-page .panel-group .panel-heading h6 a:before { content: '+'; width:60px; height:100%; position: absolute; top:0; right:0; background: #f8f8f8; border-left:1px solid #efefef; text-align: center; line-height: 65px; font-size: 18px; } .faq-page .panel-group .panel-heading.active-panel h6 a:before { content: ''; font-family: 'font-awesome'; font-size: 14px; } .faq-page .panel-group .panel-heading {border-bottom:1px solid #efefef;} .faq-page .panel-group .panel-body {padding: 35px 50px 50px 30px; border-bottom:1px solid #efefef;} .faq-page .panel-group .panel-body ol {margin:15px 0;padding: 0 0 0 20px;} .faq-page .panel-group .panel-body ol li {line-height: 28px;} .accordion-one .panel-heading { padding: 0; border-radius: 0; border:none; border-bottom: 1px solid #e6e6e6; } .accordion-one .panel-heading h6 a { color:#232323; padding: 15px 25px 15px 0; display: block; position: relative; } @media (max-width: 575px) { .header-one .menu-collapser {margin-left: 0;} } @media (max-width: 991px) { .header-two .collapse-button .icon-bar {background: #333;} .header-two .menu-collapser {margin: 22px 0;} }.blog-inner-page .our-blog .single-blog .post-meta .title {font-size: 26px;margin-top: 25px;} .blog-inner-page .our-blog .single-blog {margin-bottom: 40px;} .blog-inner-page .our-blog .single-blog:last-child { border-bottom: 1px solid #e5e5e5; padding-bottom: 55px; } .blog-inner-page{ margin-top: 80px; } .blog-inner-page .container .row #list-container { height: 800px; width: 700px; margin: 40px; margin-top: 20px; } .blog-inner-page .container .row #list-container .table{ border: 1px solid; border-color: rgb(204, 203, 203); padding: 50px; } .blog-inner-page .container .row .table { border: 0px solid; border-color: rgb(204, 203, 203); padding: 50px; } .blog-inner-page .container .row .table tr th { text-align: left; } .blog-inner-page .container .row .table tr td { text-align: left; } [dir="rtl"] .blog-inner-page .container .row #list-container .table tr th { text-align: right; } [dir="rtl"] .blog-inner-page .container .row #list-container .table tr td { text-align: right; } .blog-inner-page .container .row .table tr th{ color: #09437a; } .blog-inner-page .container .row .table thead tr th{ color: #ffffff; } .blog-inner-page .container .row .table thead{ background-color: #09437a; } .blog-inner-page .container .row .table .answer{ background-color: #4572db7a; } .fb-page { width: 130%; border: none; overflow: hidden; border-radius: 12px; } .container-fb { width: 1000px;background-color: rgb(141 141 183 / 40%); padding: 20px; box-shadow: 0 0 20px rgba(0, 0, 0, 0.1); border-radius: 12px; overflow: hidden; } .logo img { transition: filter 0.3s ease-in-out; } .logo img.logo-black { display: none; } .logo:hover img.logo-black { display: inline; } .logo:hover img.logo-white { display: none; } .icon-list { list-style: none; } .animated-icon { display: inline-block; padding: 5px; background-color: #3498db; color: #fff; border-radius: 5px; margin: 10px; animation: colorChange 2s infinite alternate; } .animated-icon:hover { background-color: #e74c3c; color: #000;} @keyframes colorChange { to { background-color: #2ecc71;} } .iconimg { width: 5%; height: 40px; } .iconimg1 { width: 15%; height: 40px; } .iconimg2 { width: 25%; height: 40px; } .dropdown-menu { background-color: rgba(0, 0, 12, 0.5); } .dropdown-item { color: #ffffff; } .navbar-nav .nav-item:hover .dropdown-menu .dropdown-item, .navbar-nav .nav-item:focus .dropdown-menu .dropdown-item { } .dropdown-toggle::after { display: inline-block; margin-left: 0.255em; vertical-align: 0.255em; content: ""; border-top: 0.3em solid transparent; border-right: 0.3em solid transparent; border-bottom: 0; border-left: 0.3em solid transparent; } .herometo { background: url("../images/bag2.webp") no-repeat center; background-size: cover; overflow: hidden; position: relative; z-index: 0; } .herometo .container { position: relative; z-index: 5; } .herometo .slide-content { min-height: 600px; color: #fff; } .herometo .slide-content span { color: #ee1515; } .herometo .slide-content h1 { color: #fff; text-shadow: 0px 2px 4px rgba(0, 0, 0, 0.56); text-transform: uppercase; -webkit-transform: matrix(0.93128, 0, 0, 0.93128, 0, 0); transform: matrix(0.93128, 0, 0, 0.93128, 0, 0); font-weight: bold; } .herometo .slide-content p { color: #170936; -webkit-transform: matrix(0.93128, 0, 0, 0.93128, 0, 0); transform: matrix(0.93128, 0, 0, 0.93128, 0, 0); padding: 35px 0 35px 30px; background-color: rgba(255, 255, 255, 0.51); border-top-right-radius: 100px; border-bottom-left-radius: 10px; margin-bottom: 0; } .herometo .slide-content .btn { margin-top: 50px; } .herometo .slide-content .btn:last-child { margin-left: 30px; }.herometo .diag-bg { width: 100%; height: 100%; -webkit-clip-path: polygon(0 0, 100% 100%, 100% 0); clip-path: polygon(0 0, 100% 100%, 100% 0); background-color: rgba(0, 0, 255, 0.05); position: absolute; top: 0; left: 0; z-index: -1; } .herometo .texture { width: 100%; height: 100%; background: url("../images/hero-texture.webp") no-repeat center; background-size: cover; opacity: 0.4; position: absolute; top: 0; left: 0; z-index: -1; } .herometo::after { content: ""; width: 100%; height: 2px; background-color: rgba(255, 255, 255, 0.02); position: absolute; left: 0; bottom: 29%; } .herometo::before { content: ""; width: 100%; height: 2px; background-color: rgba(255, 255, 255, 0.02); position: absolute; left: 0; bottom: 58%; }.image-gallery { padding: 50px 0;} .ri-grid ul { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 20px; list-style: none; margin: 0; padding: 0; } .ri-grid li { position: relative; overflow: hidden; border-radius: 8px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); transition: transform 0.3s ease-in-out; } .ri-grid img { max-width: 100%; height: auto; border-radius: 8px; } .ri-grid li:hover { transform: scale(1.05); } .ri-grid .desc { position: absolute; bottom: 0; left: 0; width: 100%; background: rgba(0, 0, 0, 0.7); color: #fff; text-align: center; padding: 10px; opacity: 0; transition: opacity 0.3s ease-in-out; } .ri-grid li:hover .desc { opacity: 1; } .hidden-section { display: none; }.ajust {font-size: 16px; line-height: 1.5;  letter-spacing: 1px;  text-align: justify;  font-weight: 400;  font-family: Arial, sans-serif; color: #666;}.ajustAR {font-size: 20px; line-height: 1.5;  letter-spacing: 1px;  text-align: justify;  font-weight: 400;  font-family: Arial, sans-serif; color: #666;} #flag-img:hover { background-image: url('../images/back.webp');  background-size: cover; height: auto;  }.nav-item.dropdown:hover .dropdown-menu { display: block; } .dropdown-menu .nav-link { cursor: pointer; }.scrollable-section { width: 80%; max-width: 800px; margin: 20px auto; background-color: #fff; border-radius: 10px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); overflow-y: auto; padding: 20px; max-height: 400px; background-image: url('../images/galry.webp'); background-size: cover; background-position: center; }.scrollable-item { display: flex; align-items: center; margin-bottom: 20px; padding: 10px; border-radius: 5px; background-color: #f9f9f9; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); cursor: pointer; } .scrollable-item img { max-width: 150px; height: auto; border-radius: 5px; margin-right: 20px; } .scrollable-item p { margin: 0; font-size: 16px; color: #333; } .details-overlay { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); align-items: center; justify-content: center; z-index: 9999; } .details { background-color: #fff; padding: 20px; border-radius: 10px; max-width: 80%; max-height: 80%; overflow: auto; } .details img { max-width: 100%; height: auto; border-radius: 5px; margin-bottom: 10px; } .close-btn { position: absolute; top: 10px; right: 10px; cursor: pointer; }/* news section start */.news_section {width: 100%;float: left;background-image: url(../images/news-bg.png);height: auto;background-size: 100%;padding-bottom: 190px;background-repeat: no-repeat;}.news_taital {width: 100%;float: left;font-size: 40px;color: #081419;text-align: center;font-weight: bold;}.news_text {width: 60%;margin: 0 auto; font-size: 16px;color: #151515;text-align: center;}.news_section_2 {width: 100%;float: left;   }.box_main {width: 60%;margin: 0 auto;background-color: #ffffff;height: auto;box-shadow: 0px 0px 8px 0px;padding: 0px 20px 0px 20px;margin-bottom: 20px;}.image_1 {width: 100%;text-align: center;position: relative;top: -20px;}.lorem_text {width: 100%;font-size: 16px;color: #081419;text-align: center;margin: 0 auto;}.read_btn {width: 170px;margin: 0 auto;text-align: center;padding-top: 10px;display: flex;top: 20px;position: relative;}.read_btn a {width: 100%;float: left;font-size: 16px;color: #ffffff;background-color: #3674f2;text-align: center;padding: 10px 0px;border-radius: 30px;}.read_btn a:hover {color: #ffffff;background-color: #a258ed;}.design_text {width: 100%;font-size: 24px;font-weight: bold;color: #151515;text-align: center;padding-top: 20px;}#main_slider a.carousel-control-prev {position: absolute;left: -60px;right: 0px;top: 105%;}#main_slider a.carousel-control-next {position: absolute;left: 0px;right: -60px;top: 105%;background: #7d56c9;color: #ffffff;}#main_slider .carousel-control-prev, #main_slider .carousel-control-next {width: 55px;height: 55px;background: #ffffff;opacity: 1;font-size: 30px;color: #000;border-radius: 100%;margin: 0 auto;box-shadow: 0px 0px 5px 0px;}#main_slider .carousel-control-prev:hover,#main_slider .carousel-control-next:hover,#main_slider .carousel-control-prev:focus,#main_slider .carousel-control-next:focus {background: #7d56c9;color: #ffffff;}.whatsapp-button { position: fixed; bottom: 20px; right: 20px; z-index: 1000; background-color: #f5edf2; border-radius: 50%; padding: 10px; box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1); } .whatsapp-button img { width: 50px; height: 50px; } .whatsapp-button:hover { background-color: #e897e5; cursor: pointer; } .animate-image { transition: transform 0.3s ease, box-shadow 0.3s ease; border-radius: 10px; } .animate-image:hover { transform: scale(1.05) rotate(2deg); box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); }