@charset "UTF-8"; /*!
  Company Name: Lion MEdia
  Company Site : https://lionmediakw.com/
  Author: Eslam atef
  Description: LionMedia
  Version: 1.0.0
  */
.heading,
footer#footer {
  float: left;
  width: 100%;
  text-align: center;
}
html {
  min-height: 100%;
}
body,
html {
  font-family: Changa, sans-serif;
  font-weight: 700;
  font-style: normal;
  line-height: normal;
  font-size: 22px;
  color: #fff;
  overflow-x: hidden;
  height: 100%;
}
div#main_content {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  float: left;
  width: 100%;
  height: 100%;
}
svg {
  display: block;
}
a,
button,
input,
select,
textarea {
  -webkit-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}
a.btn.btn-primary,
a.btn.btn-primary.who,
a.btn.btn-primary.whatsapp,
a.btn.btn-primary.web,
a.btn.btn-primary::before {
  transition: 0.5s ease-out;
}
button {
  cursor: pointer;
  outline: 0;
}
img {
  max-width: 100%;
}
.banner {
  float: left;
  width: 100%;
  height: auto;
}
img.banner {
  float: left;
  width: 100%;
}
.banner-mob,
.banner-tab {
  display: none;
}
section.social-links-sec {
  float: left;
  width: 100%;
  padding: 2% 0 1%;
  direction: rtl;
}
.btn-primary {
  color: #FCEF48;
  background-color: #000;
  border-color: #000;
  width: 100%;
  position: relative;
  border-radius: 10px;
}
.btn-check:active + .btn-primary,
.btn-check:checked + .btn-primary,
.btn-check:focus + .btn-primary,
.btn-primary.active,
.btn-primary:active,
.btn-primary:focus,
.show > .btn-primary.dropdown-toggle,
a.btn.btn-primary.email,
a.btn.btn-primary.who,
a.btn.btn-primary.location1,
a.btn.btn-primary.gallery,
a.btn.btn-primary.brand,
a.btn.btn-primary.marketing,
a.btn.btn-primary.photo,
a.btn.btn-primary.video,
a.btn.btn-primary.qr,
a.btn.btn-primary.web,
a.btn.btn-primary.animate,
a.btn.btn-primary.whatsapp,
a.btn.btn-primary:hover {
  color: #FCEF48;
  background-color: #000;
  border: 1px solid #000;
}
.btn-check:focus + .btn-primary,
.btn-primary:focus {
  box-shadow: none;
  box-shadow: 0 0 8px 0.3rem #000;
}
a.btn.btn-primary::before {
  content: "";
  height: 40px;
  width: 40px;
  position: absolute;
  top: 7px;
  right: 2px;
}
a.btn.btn-primary.whatsapp::before {
  background: url(/assets/images/whatsapp.svg) no-repeat;
}
a.btn.btn-primary.email::before {
  background: url(/assets/images/mail.svg) no-repeat;
}
a.btn.btn-primary.who::before{
  background: url(/assets/images/bac2.svg) no-repeat;

}
a.btn.btn-primary.qr::before{
  background: url(/assets/images/qrcode.svg) no-repeat;
}

a.btn.btn-primary.instagram::before {
  background: url(/assets/images/insta.svg) no-repeat;
}
a.btn.btn-primary.who::before {
  background: url(/assets/images/bac2.svg) no-repeat;
}
a.btn.btn-primary.location1::before {
  background: url(/assets/images/location2.svg) no-repeat;
}
a.btn.btn-primary.animate::before {
  background: url(/assets/images/animate.svg) no-repeat;
}
a.btn.btn-primary.gallery::before {
  background: url(/assets/images/gallery.svg) no-repeat;
}
a.btn.btn-primary.brand::before {
  background: url(/assets/images/branding.svg) no-repeat;
}
a.btn.btn-primary.photo::before {
  background: url(/assets/images/photography.svg) no-repeat;
}
a.btn.btn-primary.marketing::before {
  background: url(/assets/images/marketing.svg) no-repeat;
}
a.btn.btn-primary.web::before {
  background: url(/assets/images/web.svg) no-repeat;
}
a.btn.btn-primary.video::before {
  background: url(/assets/images/videography.svg) no-repeat;
}
a.btn.btn-primary.location::before {
  background: url(/assets/images/location.svg) no-repeat;
}
a.btn.btn-primary.service::before {
  background: url(/assets/images/service.svg) no-repeat;
}
a.btn.btn-primary.contact::before {
  background: url(/assets/images/phone.svg) no-repeat;
}
a.btn.btn-primary.qr::before {
  background: url(/assets/images/qrcode.svg) no-repeat;
}
a.btn.btn-primary:hover {
  box-shadow: 0 0 8px 0.3rem #FCEF48;
}
a.btn.btn-primary.who:hover,
a.btn.btn-primary.contact:hover,
a.btn.btn-primary.whatsapp:hover,
a.btn.btn-primary.brand:hover,
a.btn.btn-primary.marketing:hover,
a.btn.btn-primary.photo:hover,
a.btn.btn-primary.video:hover,
a.btn.btn-primary.web:hover,
a.btn.btn-primary.location1:hover,
a.btn.btn-primary.gallery:hover,
a.btn.btn-primary.animate:hover,
a.btn.btn-primary.service:hover,
a.btn.btn-primary.qr:hover
{
  background-color: #FCEF48;
  border: 1px solid #FCEF48;
  color: #0c0c0e;
  transition: 0.5s ease-out;
  box-shadow: 0 0 8px 0.3rem #000;
}
footer#footer {
  background: #0c0c0e;
}
footer#footer p {
  margin: 0;
  padding: 20px 0;
  font-size: 18px;
  font-weight: 100;
}
footer#footer a {
  color: #ffffff;
  text-decoration: none;
}
section.banner.error {
  display: flex;
  justify-content: center;
}
.heading {
  color: #000;
  padding: 3%;
}
.error img {
  padding: 0 3% 3%;
}
.heading p {
  font-size: 25px;
  font-weight: 200;
}
@media screen and (max-width: 992px) {
  .banner-tab {
    display: block;
  }
  .banner-desktop {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  .container,
  .container-md,
  .container-sm {
    max-width: 900px;
  }
  section.social-links-sec {
    padding: 6% 0 1%;
  }
}
@media screen and (max-width: 600px) {
  .banner-tab {
    display: none;
  }
  .banner-mob {
    display: block;
  }
  .heading h1 {
    font-size: 25px;
  }
  .heading p {
    font-size: 18px;
  }
}




a.btn.btn-primary.instagram:hover, a.btn.btn-primary.location:hover ,a.btn.btn-primary.qr:hover, a.btn.btn-primary.web:hover ,a.btn.btn-primary.animate:hover {
    background-color: #FCEF48;
    border: 1px solid #FCEF48;
    color: #0c0c0e;
    transition: 0.5s ease-out;
    box-shadow: 0 0 8px 0.3rem #000;
}

.row {
  display: flex;
  flex-wrap: wrap;
  padding: 0 4px;
   margin-right:auto ;
  margin-left: auto;
}

/* Create four equal columns that sits next to each other */
.column {
  flex: 25%;
  max-width: 25%;
  padding: 0 4px;
  margin-left: auto;
  margin-right: 0px;
}

.column img {
  margin-top: 8px;
  vertical-align: middle;
  width: 100%;
  margin-left: auto;
  margin-right: 0px;
}

/* Responsive layout - makes a two column-layout instead of four columns */
@media screen and (max-width: 800px) {
  .column {
    flex: 50%;
    max-width: 50%;
  }
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
  .column {
    flex: 100%;
    max-width: 100%;
  }
}

/* Google Fonts - Poppins */
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600&display=swap");

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: "Poppins", sans-serif;
}
body {
  min-height: 100%;
  background: #e3f2fd;
}
nav {
  position: fixed;
  top: 0;
  left: 0;
  height: 70px;
  width: 100%;
  display: flex;
  align-items: center;
  background: #fff;
  box-shadow: 0 0 1px rgba(0, 0, 0, 0.1);
}
nav .logo {
  display: flex;
  align-items: center;
  margin: 0 24px;
}
.logo .menu-icon {
  color: #333;
  font-size: 24px;
  margin-right: 14px;
  cursor: pointer;
}
.logo .logo-name {
  color: #333;
  font-size: 22px;
  font-weight: 500;
}
nav .sidebar {
  position: fixed;
  top: 0;
  left: -100%;
  height: 100%;
  width: 260px;
  padding: 20px 0;
  background-color: #fff;
  box-shadow: 0 5px 1px rgba(0, 0, 0, 0.1);
  transition: all 0.4s ease;
}
nav.open .sidebar {
  left: 0;
}
.sidebar .sidebar-content {
  display: flex;
  height: 100%;
  flex-direction: column;
  justify-content: space-between;
  padding: 30px 16px;
}
.sidebar-content .list {
  list-style: none;
}
.list .nav-link {
  display: flex;
  align-items: center;
  margin: 8px 0;
  padding: 14px 12px;
  border-radius: 8px;
  text-decoration: none;
}
.lists .nav-link:hover {
  background-color: #FCEF48;
}
.nav-link .icon {
  margin-right: 14px;
  font-size: 20px;
  color: #707070;
}
.nav-link .link {
  font-size: 16px;
  color: #707070;
  font-weight: 400;
}
.lists .nav-link:hover .icon,
.lists .nav-link:hover .link {
  color: #000;
}
.overlay {
  position: fixed;
  top: 0;
  left: -100%;
  height: 1000vh;
  width: 200%;
  opacity: 0;
  pointer-events: none;
  transition: all 0.4s ease;
  background: rgba(0, 0, 0, 0.3);
}
nav.open ~ .overlay {
  opacity: 1;
  left: 260px;
  pointer-events: auto;
}

.social-links-sec {
    background-color: #fff;
}
    
.body1{
    background-color:#FFFFFF;
    
}