html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, div
pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q,
s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li,
figure, header, nav, section, article, aside, footer, figcaption {
margin: 0;
padding: 0;
border: 0;
outline: 0; font-family:Cairo,system-ui,'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif !important ;}
/* clear fix */
.grid:after {content: '';display: block;clear:both;}
/* ---- .grid-item ---- */
.grid-sizer,
.grid-item {width: 50%;}
.grid-item {float: left;}
.grid-item img {display: block;max-width: 100%;}
.clearfix:after {content: ".";display: block;clear: both;visibility: hidden;line-height: 0;height: 0;}
.clearfix {display: inline-block;}
html[xmlns] .clearfix {display: block;}
* html .clearfix {height: 1%;}
ul, li {padding: 0;margin: 0;list-style: none;}
header, nav, section, article, aside, footer, hgroup {display: block;}
* {box-sizing: border-box;}
html, body {font-family: 'Roboto', sans-serif;font-weight: 400;background-color: #fff;-ms-text-size-adjust: 100%;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
a {text-decoration: none !important;}
h1, h2, h3, h4, h5, h6 {margin-top: 0px;margin-bottom: 0px;}
ul {margin-bottom: 0px;}
p {font-size: 16px;line-height: 30px;font-weight: 500;color: #f1f1f1;}
/*
---------------------------------------------
global styles
---------------------------------------------
*/
html,
body {background: #fff;font-family: 'Roboto', sans-serif;}
@media (max-width: 991px) {html, body {overflow-x: hidden;}
.mobile-top-fix {margin-top: 30px;margin-bottom: 0px;}
.mobile-bottom-fix {margin-bottom: 30px;}.mobile-bottom-fix-big {margin-bottom: 60px;}}
.section-heading {position: relative;z-index: 2;}
.section-heading h4 {color: #585858;font-size: 30px;font-weight: 700;text-transform: capitalize;margin-bottom: 10px;}
.section-heading h4 em {font-style: normal;color: #f49434;}
.section-heading img {width: 45px;height: 2px;}
.section-heading p {margin-top: 10px;}
.show-up {position: relative;z-index: 2;}
.white-button a {display: inline-block !important;padding: 10px 20px !important;color: #f49434 !important;text-transform: capitalize;font-size: 15px;background-color: #fff;border-radius: 23px;font-weight: 500 !important;letter-spacing: 0.3px !important;transition: all .5s;}
.white-button a i {margin-left: 5px;font-size: 18px;}
.white-button a:hover {background-color: #dd7812;color: #fff !important;}
/*header*/
nav{height: 120px;width: 100%;background-color:#14163d;box-shadow: 0 3px 20px rgba(0, 0, 0, 0.2);display: flex;position: fixed;z-index: 10;}
/*Styling logo*/
.logo{padding:1vh 1vw;text-align: center;}
.logo img {width: 250px;}
/*Styling Links*/
.nav-links{display: flex;list-style: none; width: 100%; align-items: center;justify-content: space-evenly;text-transform: uppercase;}
.nav-links li a{text-decoration: none; color: whitesmoke;font-weight: bold;}
.nav-links li a:hover {color: #f49434;}
.nav-links li {position: relative;}
.nav-links li a:hover::before{width: 80%;}
ul li ul.drop{text-align: right; padding-right: 20px; z-index: 99; width: 170px; visibility: hidden; opacity: 0; transition: 0.5s ease-in !important; position:absolute; top: 70PX; border-radius: 8px; box-shadow: 4px 5px 5px rgba(0, 0, 0, 0.26);}
ul li ul li{padding-bottom:30px; }
.drop li a{color: #000; }
ul li:hover ul.drop{ transition: 0.5s ease-in-out !important; visibility: visible; opacity: 1;}
/*Styling Buttons*/
.login-button{display: inline-block !important;color: #fff !important; background: linear-gradient(105deg, #f49434 0%, #f4a954cb 100%);border-radius: 23px;letter-spacing: 0.3px !important;font-family: system-ui;border: none;padding:15px 15px; font-weight: 800;}
.login-button:hover {background-color: #f2f5f7;border:1.5px solid #f2f5f7;transition: all ease-in-out 350ms;}
/*Styling Hamburger Icon*/
.hamburger div{width: 30px;height:3px;background: #f2f5f7;margin: 5px;transition: all 0.3s ease; }
.hamburger{display: none;}
/*Stying for small screens*/
@media screen and (max-width: 1306px){nav{position: fixed;z-index: 3;}.hamburger{display:block;position: absolute;cursor: pointer;left: 5%;top: 50%;transform: translate(-5%, -50%);z-index: 2;transition: all 0.7s ease;}
.nav-links{position: fixed; align-items: start; padding-right:25px ;background: #14163d;height: 100vh;width: 100%;flex-direction: column;clip-path: circle(50px at 90% -20%);-webkit-clip-path: circle(50px at 90% -10%);transition: all 1s ease-out;pointer-events: none;}
.nav-links.open{clip-path: circle(1450px at 80% -10%);--clip-path: circle(1420px at 90% -10%);pointer-events: all;}
.nav-links li{color: #000;}
ul li ul.drop{ z-index: 99; width:100%; display: none; right: 117px; top: 0PX;border-radius: 8px;}
ul li:hover ul.drop{ display: block; box-shadow: none; position: relative; }
ul li:hover ul.drop li {border-bottom: #f49434 1px solid ;width: 210px;}
li.fade{opacity: 1;}
.fade:not(.show) {opacity: 1 !important;}}
/*Animating Hamburger Icon on Click*/
.toggle .line1{transform: rotate(-45deg) translate(-5px,6px);}
.toggle .line2{transition: all 0.7s ease;width:0;}
.toggle .line3{transform: rotate(45deg) translate(-5px,-6px);}
@media screen and (max-width:1282px) {.right-image img{width: 90%;}}
/*
---------------------------------------------
Banner Style
---------------------------------------------
*/
.main-banner {background-repeat: no-repeat;background-position: center center;background-size: cover;padding: 250px 120px 150px 120px;position: relative;height: 1000px;}
.main-banner:after {content: '';background-image: url(../images/slider-left-dec.png);background-repeat: no-repeat;background-size: cover;position: absolute;left: 0px;top: 0px;width: 100%;height: 100%;z-index: 1;}
.main-banner .left-content {text-align:center;}
@media screen and (min-width:1450px){.main-banner .left-content {text-align:center;top: 170px; text-align: center; right: 25%;}}
.main-banner .left-content h2 {z-index: 2;position: relative;font-weight: 700;line-height: 70px;font-size: 50px;margin-bottom: 20px;color: whitesmoke; }
@media screen and (max-width:1450px){.main-banner .left-content h2 {font-size: 35px !important;}.main-banner .left-content p {font-size: 17px;}}
.main-banner .left-content p {margin-bottom: 45px;color: #dadada;font-weight: 400; font-size: 20px;}
.main-banner .left-content .first-button {margin-right: 15px;}
.main-banner .left-content .white-button {display: inline-block;}
.main-banner .left-content .white-button a {background-color:#f49434;color: #fff !important;}
/*
---------------------------------------------
Services Style
---------------------------------------------
*/
.services {padding-top: 130px;position: relative;}
.services .section-heading p {margin-top: 10px;margin-left: 18%;margin-right: 18%;color: #000000; font-weight: 700;font-size: 25px !important;}
.services .container-fluid {padding-left: 65px;padding-right: 65px;}
.services:after {content: '';background-image: url(../images/services-left-dec.png);background-repeat: no-repeat;position: absolute;left: 0;bottom: -300px;width: 261px;height: 368px;z-index: 0;}
.services:before {content: '';background-image: url(../images/services-right-dec.png);background-repeat: no-repeat;position: absolute;right: 0;top: 0;width: 1136px;height: 244px;z-index: 0;}
.services .section-heading {text-align: center;margin-bottom: 80px;}
.services .section-heading .line-dec {margin: 0 auto;}
.service-item {position: relative;z-index: 1;padding: 30px;box-shadow: 0px 10px 15px rgba(0,0,0,0.1);background-color: #fff;border-radius: 10px;border-top-right-radius: 50px;transition: all .3s;}
.service-item .icon {margin-left: 0px;margin-bottom: 30px;background-repeat: no-repeat;width: 50px;height: 50px;transition: all .3s;}
.service-item h4 {transition: all .3s;font-size: 20px;font-weight: 700;margin-bottom: 15px;}
.service-item p {transition: all .3s;font-size: 17px; color: #000; font-weight: 500;margin-bottom: 20px}
.service-item:hover h4,
.service-item1:hover p,
.service-item:hover .text-button a {color: #fff;}
.first-service .icon {background-image: url(../images/s1.png); }.first-service:hover .icon {background-image: url(../images/sl1.png);}
.second-service .icon {background-image: url(../images/s2.png);}.second-service:hover .icon {background-image: url(../images/sl2.png);}
.third-service .icon {background-image: url(../images/s3.png);}.third-service:hover .icon {background-image: url(../images/sl3.png);}
.fourth-service .icon {background-image: url(../images/s4.png);}.fourth-service:hover .icon {background-image: url(../images/sl4.png);}
.fifth-service .icon {background-image: url(../images/s5.png);}.fifth-service:hover .icon {background-image: url(../images/sl5.png);}
.six-service .icon {background-image: url(../images/s6.png);}.six-service:hover .icon {background-image: url(../images/sl6.png);}
.seven-service .icon {background-image: url(../images/s7.png);}.seven-service:hover .icon {background-image: url(../images/sl7.png);}
.eight-service .icon {background-image: url(../images/s8.png);}.eight-service:hover .icon {background-image: url(../images/sl8.png);}
.service-item1:hover {background-image: url(../images/service-bg.jpg);background-position: right top;background-repeat: no-repeat;background-size: cover;}
.text-button a{color: #f28c19; }
/*
---------------------------------------------
About Us
---------------------------------------------
*/
.about-us {padding-top: 130px;position: relative}
.about-us .section-heading {margin-bottom: 45px;}
.about-us .section-heading,
.about-us .box-item,
.about-us p,
.about-us .box-item .gradient-button,
.about-us .box-item span {position: relative;z-index: 1;}
.about-us .box-item {box-shadow: 0px 2px 15px rgba(192, 192, 192, 0.322);padding: 10px 30px;background-color: whitesmoke;border-radius: 40px;margin-bottom: 30px;}
.about-us .box-item h4 a {font-size: 20px;font-weight: 700;margin-top: 8px;color: #181818;transition: all .3s;}
.about-us .box-item p {margin-bottom: 0px; font-weight: 400; color: #000;}
.about-us .box-item:hover h4 a {color: #f28c19;}
.about-us .gradient-button {margin-top: 30px;margin-bottom: 10px;}
.about-us span {font-size: 14px;color: #7a7a7a;}
.about-us .right-image {position: relative;z-index: 1;}
.about-us:after {background-image: url(../images/about-bg.jpg);width: 777px;height: 1132px;content: '';position: absolute;background-repeat: no-repeat;right: 0;top: 50%;transform: translateY(-50%);z-index: 0;}
/*
---------------------------------------------
The Clients
---------------------------------------------
*/
.the-clients {margin-top: 130px;}
.the-clients .section-heading {text-align: center;margin-bottom: 80px;}
.the-clients .section-heading p { margin-top: 10px;margin-left: 18%;margin-right: 18%;}
.the-clients .naccs {position: relative;}
.menu .thumb h4 {margin-bottom: 0px;font-size: 20px;color: #2a2a2a;}
.menu .thumb span.date {display: inline-block;margin-top: 0px;color: #afafaf;}
.menu .thumb span.category,
.menu .thumb span.rating {font-weight: 700;color: #afafaf;}
.menu .thumb i {color: #afafaf;}
.the-clients .naccs .menu div {color: #fff;font-size: 15px;margin-bottom: 15px;margin-top: 15px;text-align: left;padding: 0px 15px;cursor: pointer;position: relative;transition: 1s all cubic-bezier(0.075, 0.82, 0.165, 1);}
.the-clients .naccs .menu div.active h4,
.the-clients .naccs .menu div.active i,
.the-clients .naccs .menu div.active span.rating,
.the-clients .naccs .menu div.active .thumb {color: #f49434;}
.the-clients ul.nacc {position: relative;min-height: 100%;list-style: none;margin: 0;padding: 0;transition: 0.5s all cubic-bezier(0.075, 0.82, 0.165, 1);}
.the-clients ul.nacc li {opacity: 0;transform: translateX(-50px);position: absolute;list-style: none;transition: 1s all cubic-bezier(0.075, 0.82, 0.165, 1);}
.the-clients ul.nacc li.active {transition-delay: 0.3s;position: relative;z-index: 2;opacity: 1;transform: translateX(0px);}
.the-clients ul.nacc li {width: 100%;}
.the-clients .nacc .thumb .client-content img {width: 76px;height: 62px;}
.the-clients .nacc .thumb .client-content {padding: 60px 30px;background-image: url(../images/client-bg.png);background-size: cover;border-radius: 50px;width: 100%;height: auto;background-repeat: no-repeat;}
.the-clients .nacc .thumb .client-content p {color: #fff;font-weight: 500;font-size: 16px;margin-top: 30px;}
.the-clients .nacc .thumb .down-content {margin-top: 30px;}
.the-clients .nacc .thumb .down-content img {width: 170px;height: 170px;border-radius: 50%;display: inline;}
.the-clients .nacc .thumb .down-content .right-content {display: inline-block;margin-left: 20px;}
.the-clients .nacc .thumb .down-content .right-content h4 {font-size: 20px;font-weight: 700;margin-bottom: 15px;}
.the-clients .nacc .thumb .down-content .right-content span {color: #2a2a2a;}
.btn-pt{width:500px; height:70px; }
.btn-pt button{width: 100%; height: 100%; background-color: #f28c19;border: none;border-radius: 55px;transition:1s ease-in-out ;}
.btn-pt button a{color: whitesmoke; font-size:20px ;}
.btn-pt button:hover{opacity: 0.8; letter-spacing: 1px; transition:0.5s ease-out ;}
.googlepic{display: flex; justify-content: start;}
@media screen and (max-width:600px) {.btn-pt{width:200px; margin: auto; }.googlepic img{width: 200px; margin: auto;}}
/*
---------------------------------------------
The Clients
---------------------------------------------
*/
.pricing-tables {padding-top: 130px;display: flex; justify-content: center;}
.pricing-tables .section-heading {text-align: center;margin-bottom: 80px;}
.pricing-tables .section-heading p {margin-top: 10px;margin-left: 18%;margin-right: 18%;}
.card{ width:330px;height: 500px;background-color: whitesmoke; margin: auto; display:flex; flex-direction: column; justify-content: space-around; align-items: center;box-shadow: 0px 5px 15px rgba(75, 71, 71, 0.247);}
.imgsec{width:300px ;height:200px; padding-top:20px; }
.imgsec img{border-radius: 8px; box-shadow:rgba(65, 65, 65, 0.349) 0px 8px 10px ;}
.contcard{width:330px;height:300px; text-align: right; padding-top:150px; color: #141842;padding-right: 15px; }
.card span{padding-bottom: 50px;}
.card span a{color: #f28c19;font-weight: 600; letter-spacing: 0.8px;border: 1px solid#f28c19; padding: 4px 8px; border-radius: 10px;box-shadow: 0px 5px 15px rgba(75, 71, 71, 0.123);}
.card span a:hover{opacity: 0.8; transition: 0.5s ease-in; box-shadow: none;}
/*form*/
#form{background:url(../images/55.png);background-size: cover;}
.form{ display: flex;justify-content: center; flex-direction: column;align-items: center; padding:20px ; }
.form input{padding: 8px; margin: 8px; width: 500px; outline: none; border: none; border-bottom: 2px solid #f28c19 ;border-radius: 1px;}
.form button{ letter-spacing:0.8px; border: none; color: whitesmoke; width: 500px;height: 50px; background-color: #f28c19;border: none;border-radius: 55px;transition:1s ease-in-out ;}
@media screen and (max-width:520px) {.form input{width: 250px;}.form button{width:250px ;}}
.policy{ text-align: center; margin: auto; display: flex; justify-content: center;}
/*
---------------------------------------------
Footer Style
---------------------------------------------
*/
.mob{display: none;}
footer {background-image: url(../images/footer-bg.png);background-position: center top;background-repeat: no-repeat;background-size: cover;margin-top: 130px;padding-top: 300px;padding-bottom: 60px;}
footer .logo{ display: flex; justify-content: end;}
.logo
footer .section-heading {margin-bottom: 45px;}
footer .section-heading h4 {line-height: 45px;color: #fff;margin-left: 13%;margin-right: 13%;text-align:center;}
.footer-widget .logo img {max-width: 200px; }
.footer-widget h4 {font-size: 20px;color: #fff;font-weight: 700;margin-bottom: 40px;}
.footer-widget p {margin-bottom: 15px;}
.footer-widget p,
.footer-widget p a {color: #fff;}
.footer-widget ul {display: inline;max-width: 40%;float: left;margin-right: 10%;}
.footer-widget ul li {margin-bottom: 10px;}
.footer-widget ul li:last-child {margin-bottom: 0px;}
.footer-widget ul li a {font-size: 15px;color: #fff;transition: all .3s;;}
.footer-widget a:hover {opacity: 0.75;}
.social{ font-size: 29px; display: flex; direction: rtl;}
.social a{ color: #f28c19;padding: 10px; }
footer .copyright-text p {text-align: center;margin-top: 50px;margin-bottom: 0px;color: #fff;}
footer p a {color: #fff;transition: all .5s }
@media screen and (max-width:944px) {footer{background-color:#1d1c40;}footer .container .section-heading h4{color: whitesmoke;}footer .container {text-align: center;}footer .logo{ display: flex; justify-content: center !important;}.social{align-items: center; justify-content: center;}.mob{display: block;}.des{display: none;}.footer-widget h4{border-right: none !important; color:#f28c19;}
/*
---------------------------------------------
responsive
---------------------------------------------
*/
@media (max-width: 1200px) {
.header-area .main-nav .logo h4 {font-size: 24px;}
.header-area .main-nav .logo h4 img {max-width: 25px;margin-left: 0px;}
.header-area .main-nav .nav li:last-child {padding-left: 20px;}
.main-banner .left-content h2 {z-index: 2;position: relative;font-weight: 700;line-height: 70px;font-size: 50px;margin-bottom: 20px;}
.main-banner .left-content p {margin-bottom: 45px;}}
@media (max-width: 992px) {
.header-area {background-color: #fff;}
.main-banner:after {background-image: url(../images/46.png) !important;background-repeat: no-repeat;background-size: cover;}
.main-banner .left-content h2 {color: #ffffff;margin-right: 0;}
.main-banner .left-content p {color: #afafaf;margin-right: 0;}
form#contact {
overflow: hidden;
}
.header-area .main-nav .logo h4 {
font-size: 20px;
}
.main-banner .left-content {
margin-right: 0px;
}
.main-banner {
text-align: center;
padding: 226px 0px 30px 0px;
}
.main-banner:before {
display: none;
}
.main-banner .right-image {
margin: 30px auto 0px auto;
text-align: center;
}
.features-item {
margin-bottom: 45px;
}
.last-features-item,
.last-skill-item {
margin-bottom: 0px !important;
}
.skill-item {
margin-bottom: 30px;
}
.about-left-image img {
margin-right: 0px;
margin-bottom: 45px;;
}
.services .naccs .menu div {
font-size: 15px;
font-weight: 500;
}
.service-item {
text-align: center;
margin-bottom: 30px;
}
.about-us .box-item {
text-align: center;
}
.about-us:after {
display: none;
}
.about-us .gradient-button,
.about-us span {
text-align: center;
display: block;
}
.about-us .right-image {
margin-top: 30px;
}
.service-item .icon {
margin: 0 auto 30px auto;
}
.about-us .section-heading {
text-align: center;
}
.about-us .left-image {
margin-right: 30px;
margin-left: 30px;
margin-bottom: 45px;
}
.blog-posts {
margin-left: 0px;
margin-top: 30px;
}
.post-item {
margin-bottom: 70px;
}
.pricing-item-regular {
margin-bottom: 30px;
}
.our-portfolio .owl-nav {
display: none !important;
}
.contact-info {
margin-top: 60px;
}
form#contact {
padding: 45px;
}
}
@media (max-width: 767px) {
.the-clients .naccs .menu div {
text-align: center;
}
footer .section-heading h4 {
color: #2a2a2a;
}
footer #search {
margin-bottom: 45px;
}
footer {
padding-top: 0px;
text-align: center;
}
.footer-widget ul {
display: block;
width: 100%;
float: none;
text-align: center;
margin: 0 auto;
}
.footer-widget h4 {
margin-top: 45px;
margin-bottom: 20px;
}
footer #search input {
border: 1px solid #eee;
color: #afafaf;
background-color: #fff;
border-radius: 23px;
margin-bottom: 15px;
padding: 0px 30px;
}
footer #search button {
background-color: #fff;
color: #4b8ef1;
}
footer #search input::placeholder {
color: #2a2a2a;
}
.header-area .main-nav .logo h4 {
font-size: 30px;
}
.header-area .main-nav .logo h4 img {
max-width: 30px;
margin-left: 5px;
}
.main-banner .info-stat {
margin-bottom: 15px;
}
.menu .thumb span.date {
margin-bottom: -20px;
display: block;
}
.service-item {
text-align: center;
padding: 30px;
}
.menu .thumb span.category {
display: none;
}
.about-us .right-image {
margin-top: 30px;
}
.service-item .icon {
float: none;
margin-right: 0px;
margin-bottom: 15px;
}
.service-item .right-content {
display: inline-block;
}
.services .naccs .menu div .thumb {
padding: 5px;
}
.services .icon img {
margin: 0px;
}
.the-clients .nacc .thumb .down-content .right-content {
margin-left: 0px;
margin-top: 15px;
}
.services ul.nacc li.active {
padding: 45px;
}
.services .naccs .menu div {
font-size: 0px;
}
.the-clients .nacc .thumb .down-content {
text-align: center;
}
.services ul.nacc li .right-image img {
float: none;
}
.our-portfolio .section-heading,
.about-us .section-heading,
.about-us .about-item,
.about-us p,
.about-us .main-green-button {
text-align: center;
}
.our-portfolio .section-heading .line-dec {
margin: 0 auto;
}
.our-services .section-heading {
margin-left: 15px;
margin-right: 15px;
}
.free-quote form input {
margin-left: 0px;
padding: 0px 30px;
}
.free-quote form button {
margin-left: 0px;
border-bottom-left-radius: 40px;
border-top-right-radius: 0px;
}
.blog-posts {
margin-left: 0px;
margin-top: 30px;
}
.post-item {
margin-bottom: 30px;
}
.post-item .thumb img {
max-width: 140px;
}
.post-item .right-content p {
display: none;
}
.about-us .about-item {
margin-top: 15px;
}
form#contact {
padding: 30px;
}
} }
/*banner*/
.banner{width: 100wh;height: 300px;display: flex;align-items: center; flex-direction: column;border-bottom: 4px solid #f28c19;background: url(../images/banner.png);background-repeat:no-repeat ;background-size: cover; }
.banner h3{position: absolute; top: 200px; color: #f28c19; font-weight: 900;letter-spacing: 1px;}
/*page about*/
.con{width:100%; height: 700px; display: flex; background-color: #141842;}
.cont-text{width: 50%; height: max-content; text-align: center;}
.cont-img{width:500px; height: 900px;display: flex; align-items: end; }
.cont-text h3{padding-bottom: 20px; padding-top: 80px; font-weight: bold;font-size:35px ; color:#f28c19;}
.cont-text h2{font-weight: bold;font-size:42px ;padding-bottom: 20px;color: whitesmoke;}
.cont-text p{text-align: right; color: whitesmoke;font-size: 16px; letter-spacing:0.5px; width: 600px;margin: auto;font-weight: 400;line-height: 30px;}
@media screen and (max-width:1115px) {.con{flex-direction: column; }.cont-img{display: none;}.cont-text{margin: auto; width: 500px;}.cont-text p{ width: 500px; }}
@media screen and (max-width:510px) {.con{ height: max-content; }.cont-text{margin: auto; width: 300px;}.cont-text p{ width: 300px; text-align: center; }}
.secstat{width:100%; height:max-content; margin-top:20px ;background: url(../images/banner.png);background-size:cover;border-bottom: 3px solid #f79009;border-top: 3px solid #f79009; padding-bottom: 10px;}
.facts {display: flex;justify-content: center;align-items: center;gap: 10px;padding-top: 50px;}
.stat {width: 28vmin;height: 28vmin;display: flex;flex-direction: column;justify-content: space-around;padding: 1em 0;position: relative;font-size: 16px;border-radius: 0.5em;background-color:#14163d;border-bottom: 10px solid #f79009;box-shadow: #000000ad 0px 0px 5px;}
span.num {color: #ffffff;display: grid;place-items: center;font-weight: 600;font-size: 3em;}
span.text {color: #e0e0e0;font-size: 1em;text-align: center;pad: 0.7em 0;font-weight: 400;line-height: 0;}
@media screen and (max-width:740px) {.facts{flex-direction: column; height: max-content;}.stat{width: 200px; height: max-content;}}
.stat .text {font-weight: 600;letter-spacing: 0.7px;}
.group{width:100%; background-color: #141842; height: max-content;border-bottom: 4px solid #f28c19;}
.cardsec{width: 100%; height:max-content; display: flex; align-items: center; justify-content: center;}
.cardsec .row{display: flex; justify-content: space-evenly;align-items: center; height: max-content;}
@media screen and (max-width:991px) {
.group .dd {margin-bottom: 250px;}}
.text-button button { border: none;background-color: #f28c19;border: none;border-radius: 55px; padding:8px 16px ;}
.text-button button a{color: whitesmoke; font-size: 15px; letter-spacing: 0.8px;}
@media screen and (max-width:991px) {.group .dd {margin-bottom: 150px;}.d2{margin-top: 80px; margin-bottom: 50px;}}
/*modawana*/
.maqal{width: 100%; height: max-content;direction: rtl;}
.modwanet{padding-top: 20px; width:100%; height: max-content; display: flex;flex-direction: column;justify-content: center;align-items: center;}
.body-card{width: 1200px; height: max-content;margin-bottom: 35px;border-radius:8px;display: flex;}
.pic-cont{width:400px;display: flex; align-items: center;justify-content: center;}
.text-cont{width: 700px; height: max-content; border-radius: 8px 0px 0px 8px;}
.img-maq img{height: max-content; margin: auto;box-shadow: 0px 5px 10px rgba(31, 30, 30, 0.541);}
.text-cont p{width: 95%;margin: auto; color: #000;font-size: 16px;}
@media screen and (max-width:1219px) {.body-card{flex-direction: column;justify-content: center;align-items: center;} }
@media screen and (max-width:665px) {.body-card{width: 400px;}.text-cont{width: 400px;} }
@media screen and (max-width:405px) { .body-card{width: 300px;} .body-card img{width: 300px !important;}.text-cont{width: 300px;} }
/*contact page*/
.contactpage{width: 100%; height: max-content; background-color: #141842;border-bottom: 4px solid #f28c19;}
.posi{width: 100%;height: max-content;padding-top: 40px;padding-bottom: 40px; display: flex; align-items: center;justify-content: center;}
.maps{width:500px; background-color: whitesmoke;height: max-content;padding-bottom:20px ; border-radius: 8px;box-shadow: 0px 5px 10px rgba(59, 59, 59, 0.363);}
.lin{width:100%;height: max-content; display: flex;flex-direction: column; justify-content: space-around; align-items: center;padding-top: 40px;padding-bottom:10px;}
.formc{margin-top: 50px;padding-bottom: 50px;}
.formc form{background-color: rgb(255, 255, 255); width: max-content; margin: auto;padding: 40px;border-radius: 8px;box-shadow: 0px 5px 10px rgba(54, 54, 54, 0.247);}
.form1 input, .form2 input{border-radius: 55px !important; background-color: whitesmoke;border-bottom: none;}
.formc textarea{border: none;outline: none; width: 100%;border-radius: 55px;background-color: rgb(245, 245, 245);}
.formc form input::placeholder ,.formc form textarea::placeholder{color: #000000;text-align: center;letter-spacing: 0.8px;}
@media screen and (max-width:1141px) {
.formc form{width: 500px;}.formc h3{text-align: center; }.formc form input ,.formc form textarea {width: 400px;}.btn-form{width: 400px !important;}}
@media screen and (max-width:558px) {.formc form{width: 320px;}.formc h3{text-align: center;}.formc form input ,.formc form textarea {width: 250px;}.btn-form{width: 250px !important;}.maps{width:320px}}
.login-button :hover{color: whitesmoke !important;}