@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Reenie+Beanie&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Exo+2:wght@400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Source+Sans+3:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@300;400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Kufi+Arabic:wght@100..900&display=swap');

body{ background:#111 !important; }
.logo{ text-align:center; width:200px; border-radius:50%; padding:5px; background:#fff; margin:40px 0 20px 0; }
.logo img{ border-radius:50%; }

.main_bg{  margin-bottom:70px; }

.company_name{ text-align:center; font-family: "Noto Kufi Arabic", sans-serif; font-size: 22px; color: #fff; font-weight: 600; padding-bottom:20px; }
.person_name{ text-align:center; font-family: "Noto Kufi Arabic", sans-serif; font-size: 20px; color: #fff; font-weight: 600; padding-bottom:5px; }
.person_designation{ text-align:center; font-family: "Noto Kufi Arabic", sans-serif; font-size: 18px; color: #fff; font-weight: 600; }
.social_media{ text-align:center; margin-bottom:30px; }
.social_media a{ margin:0 1px; background:#fff; padding:6px 8px; font-size:12px; border-radius:5px; color:#fff; transition:.3s ease;}
.social_media a:hover{ background:#296c38; color:#fff; transition:.3s ease; }

.email_us{ margin-bottom:25px; }
.email_us a{ display: block; background:#d79827; font-family: "Noto Kufi Arabic", sans-serif; font-size: 18px; color: #fff; font-weight: 700; padding:15px 15px 15px 30px; border-radius:50px; transition:.3s ease; }
.email_us a:hover{ background:#000; color:#fff; padding:15px 15px 15px 45px; transition:.3s ease; }
.email_us i{ font-size:32px; }

.address{ text-align:center; font-family: 'Quicksand', sans-serif; font-size: 16px; color: #111; font-weight: 600; }

.qr_code{ text-align:center; }
.qr_code img{ background:#fff; padding:10px; border-radius:15px; margin-bottom:40px; }

.add_to{ display: block; background:#d79827; font-family: "Noto Kufi Arabic", sans-serif; font-size: 18px; color: #fff; font-weight: 600; padding:15px 15px 15px 30px; border-radius:50px; transition:.3s ease; border:none !important; width:100%; text-align:left; }
.add_to:hover{ background:#64c6c2; color:#111; padding:15px 15px 15px 45px; transition:.3s ease; }

.email{ background:#fbb04f !important }
.email:hover{ background:#bd4c35 !important }

.twitter{ background:#fbb04f !important }
.twitter:hover{ background:#bd4c35 !important }

.linkedin{ background:#0083be !important; }
.linkedin:hover{ background:#bd4c35 !important }

.instagram{ background:#d14791 !important; }
.instagram:hover{ background:#bd4c35 !important }

.youtube{ background:#ea3226 !important; }
.youtube:hover{ background:#bd4c35 !important }

.whatsapp{ background:#00b25e !important; }
.whatsapp:hover{ background:#bd4c35 !important }

.tiktok{ background:#000 !important }
.tiktok:hover{ background:#bd4c35 !important }

.telegram{ background:#24a1de !important }
.telegram:hover{ background:#bd4c35 !important }










/* From Bootstrap */
.dropdown-menu>li>a{ font-family: 'Montserrat', sans-serif; font-size: 16px; color: #fff; font-weight: 500; padding: 10px 0 10px 10px; border-bottom: solid 1px #000;}
.dropdown-menu>li>a:hover, .dropdown-menu>li>a:focus{ color:#000 !important; }

.navbar-default .navbar-nav>li>a{ font-family: 'Open Sans', sans-serif; font-size: 14px; color: #000; font-weight: 500; margin-left: 50px; padding-bottom: 5px; text-transform: uppercase;}
.navbar-default .navbar-nav>li>a:hover, .navbar-default .navbar-nav>li>a:focus{ color: #1099cf;}

.carousel-caption{ left: 0px !important; right: 0px !important; top: 1%;}
.carousel-caption img{ max-width: 100%; }
.carousel-control{ bottom: 50% !important; }

.offcanvas-header{ display:none; }
.btn-close{background: #1099cf;margin: 0px 0px 20px 0px; outline: none !important;}
.btn-close:hover{background: #1099cf; outline: none !important;}
.btn{padding: 8px 12px; border-radius: 0px;}
.btn img{ width: 30px; }

.mobile-menu{ display: none !important; }
.menu_1{ font-family: 'Open Sans', sans-serif; font-size: 14px; color: #fff; font-weight: 500;}
.menu_1 a{ font-family: 'Open Sans', sans-serif; font-size: 14px; color: #fff; font-weight: 500; }

.mobile-menu-new{ display: none; }
.mobile-menu-new ul li{ padding: 10px 0; }
.mobile-menu-new ul li a{ font-family: 'Open Sans', sans-serif; font-size: 14px; color: #fff; font-weight: 500; cursor: pointer; display: block;}
.mobile-menu-new ul li a:hover{ color: #1099cf; text-decoration: none;}
.mobile-menu-new ul li i{ font-size: 11px; float: right; }

.mobile-menu-new-sub li{ padding: 0 !important; }
.mobile-menu-new-sub li a{ font-family: 'Open Sans', sans-serif; font-size: 14px; color: #fff; font-weight: 500; border-bottom: solid 1px #fff; padding: 8px 0;}

.sub_menu{ border-bottom: solid 1px #1f1e1e; padding: 10px 15px; }
.sub_menu a{ font-family: 'Open Sans', sans-serif; font-size: 14px; color: #fff; font-weight: 500; line-height: 20px !important;}
.sub_menu a:hover{ color: #fff !important; text-decoration: underline !important; }

@media (max-width: 768px){
    



    /*Mobile Banner*/
    .carousel-inner>.item{ height:550px !important; background: url(../img/banner_bg.jpg) center top no-repeat;}
    .carousel-inner>.item>img, .carousel-inner>.item>a>img{ display: none;}
    /*Navbar*/
    .nav>li{ display: none; }
    .navbar-nav{ padding: 0px 20px 0px 15px !important; }
    .mobile-menu{ display: block !important; margin: 0 30px;}
    .menu_1{ padding-bottom: 20px; }
    .menu_1 a{ color: #fff; }
    .menu_1 a:hover{ color: #9B9B9B; }
    .mobile-menu-new{ display: block; margin: 0 30px;}
    /*Off Canvas*/
    .offcanvas-header{ display:block; text-align: right;}
    .navbar-collapse { position: fixed; z-index: 99999; top:0; bottom: 0;left: 100%; width: 90%; padding-right: 0;padding-left: 0;overflow-y: auto;visibility: hidden;background-color: white;transition: visibility .2s ease-in-out, transform .2s ease-in-out; transform: translateX(-100%);}
    .navbar-collapse.show {visibility: visible; transform: translateX(-100%);background: black;overflow-x: hidden;}
}