/********** new them color *********************/

/* bootstrap.min.css | https://x.isat.tech/css/bootstrap.min.css */
  /*:root {
    --bs-primary: #c90101;
    --bs-blue: #fd0d0d;
    --color2 : #ab0101;
    --color3 : rgba(209, 39, 39, 0.5);
    --color4 : #a10101;
    --color5 : #3d1616;
    --color6 : #341313;
    --color7 : rgba(90, 57, 57, 0.5);
    --color8 : #311212;
    --color9 : #e48080;
    --color10 : rgba(201, 1, 1, 0.25);
    --color11 : #f9f2f2;
    --color12 : #ff0b0b;
    --color13 : rgba(201, 1, 1, 0.2);
    --color14 : rgba(201, 1, 1, 0.8);
  }*/

  /***************************************************/
  .footer {
    color: var(--color9);
  }
  .text-primary {
    color: var(--color6) !important;
  }
  
  .btn-primary {
    background-color: var(--bs-primary);
  }
  
  .btn-check:focus + .btn-primary, .btn-primary:focus {
    background-color: var(--color2);
    box-shadow: 0 0 0 .25rem var(--color3);
  }
  
  .btn-check:checked + .btn-primary, .btn-check:active + .btn-primary, .btn-primary:active, .btn-primary.active, .show > .btn-primary.dropdown-toggle {
    background-color: var(--color4);
  }
  
  .btn-check:checked + .btn-primary:focus, .btn-check:active + .btn-primary:focus, .btn-primary:active:focus, .btn-primary.active:focus, .show > .btn-primary.dropdown-toggle:focus {
    box-shadow: 0 0 0 .25rem var(--color3);
  }
  
  .dropdown-item.active, .dropdown-item:active {
    background-color: var(--bs-primary);
  }
  
  .footer {
    h6, .h6, h5, .h5, h4, .h4, h3, .h3, h2, .h2, h1, .h1
     {
    color: var(--color18);
  }
}
  h6, .h6, h5, .h5, h4, .h4, h3, .h3, h2, .h2, h1, .h1 {
    color: var(--color6);
  }
  
  
  .bg-primary {
    background-color: var(--bs-primary) !important;
  }
  
  .btn-check:focus + .btn-dark, .btn-dark:focus {
    background-color: var(--color6);
    box-shadow: 0 0 0 .25rem var(--color7);
  }
  
  .btn-check:checked + .btn-dark:focus, .btn-check:active + .btn-dark:focus, .btn-dark:active:focus, .btn-dark.active:focus, .show > .btn-dark.dropdown-toggle:focus {
    box-shadow: 0 0 0 .25rem var(--color7);
  }
  
  .btn-check:checked + .btn-dark, .btn-check:active + .btn-dark, .btn-dark:active, .btn-dark.active, .show > .btn-dark.dropdown-toggle {
    background-color: var(--color8);
  }
  
  .btn-dark {
    background-color: var(--color5);
  }
  
  .accordion-button:focus {
    border-color: var(--color9);
    box-shadow: 0 0 0 .25rem var(--color10);
  }
  
  a:hover {
    color: var(--bs-primary);
  }
  
  .btn-check:focus + .btn, .btn:focus {
    box-shadow: 0 0 0 .25rem var(--color10);
  }
  
  .bg-light {
    background-color: var(--color17) !important;
    color: var(--color8) !important;
  }
  
  .text-dark {
    color: var(--color5) !important;
  }
  .nav-bar .text-dark::after {
    color: var(--bs-primary);
  }
  
  .text-secondary {
    color: var(--color12) !important;
  }
    
  .btn.btn-primary:hover {
    background: var(--color5);
  }

  .btn.btn-light {
    color: var(--bs-primary);
  }
  
  .btn.btn-light:hover {
    background: var(--color5);
  }
  
  .feature .feature-item .feature-icon::after {
    background: var(--color5);
  }
  
  .feature .feature-item:hover a.btn:hover {
    background: var(--color5);
  }
  
  .header-carousel .owl-nav .owl-prev:hover, .header-carousel .owl-nav .owl-next:hover {
    box-shadow: inset 0 0 100px 0 var(--color12);
  }
  
  .service .service-item .service-img::after {
    background: var(--color13);
  }
  
  .service .service-item:hover .service-content .service-content-inner .btn.btn-primary:hover {
    background: var(--color5);
  }
  
  .faq-section .accordion .accordion-item .accordion-header .accordion-button {
    background: var(--color14);
  }
  
  .blog .blog-item .blog-img::after {
    background: var(--color13);
  }
  
  .blog .blog-item .blog-content {
    background: var(--color17);
  }
  
  .blog .blog-item .blog-content a.btn {
    color: var(--color5);
  }
  
  
  .team .team-item:hover .team-title, .team .team-item.clicked  .team-title {
    background: var(--color5);
    color: var(--color15);
  }
  
  .footer {
    background: var(--color5) !important;
  }
  
  .copyright {
    background: var(--color5);
  }
  
  .testimonial .owl-nav .owl-next:hover {
    background: var(--color5);
  }
  
  .faq-section .accordion .accordion-item .accordion-header .accordion-button.collapsed {
    background: var(--color9);
  }
  
  .feature .feature-item .feature-icon {
    background: var(--color17);
  }

  .feature .feature-item {
    background: var(--color13);
  }
  .feature .feature-item .feature-icon {
    color: var(--color7);
  }

  .form-control:focus {
    box-shadow: 0 0 0 .25rem var(--color10);
  }
  
  .service .service-content {
    background: var(--color17);
  }
  
  .service .service-item .service-img .service-icon {
    background: var(--color17);
  }
  .modalcontent {
    color: var(--color11);
  }
  .modal-header {
    background-color: var(--color11) !important;
  }
  .nav-bar {
    background: var(--color5) !important;
  }
  .container-fluid.nav-bar {
    box-shadow: 0px 0px 25px var(--color12) !important;
  }
  .dropdown-menu {
    box-shadow: 0px 25px 25px var(--color16) !important;
  }
  .nav-bar .text-dark {
    color: var(--color15) !important;
  }
  .goldstar {
    color: var(--bs-primary);
  }
  .feature .feature-item:hover h4, .feature .feature-item:hover p {
    color: var(--color15);
  }
  
  .service .service-item:hover .service-content .service-content-inner .btn.btn-primary {
    background: var(--color15);
  }
  
  .service .service-item:hover .service-content .service-content-inner .h4, .service .service-item:hover .service-content .service-content-inner p {
    color: var(--color15);
  }
  body {
    color: var(--color8);
  }
  .text-white {
    color: var(--color18) !important;
  }
  .carousel-caption .text-white {
    color: var(--color9) !important;
  }
  .bg-breadcrumb .text-white {
    color: var(--color17) !important;
  }
  .navbar-light .navbar-nav .nav-link {
    color: var(--color6);
  }
  
  .dropdown-item {
    color: var(--color6);
  }
  
  .dropdown .dropdown-menu .dropdown-item:hover {
    color: var(--bs-primary);
    background: var(--color10);
  }
  
  .feature .feature-item:hover .feature-icon {
    color: var(--color15);
  }
  
  .feature .feature-item:hover a.btn {
    background: var(--color15);
  }
  
  .btn.btn-primary {
    color: var(--color17);
  }
  
  .btn.btn-primary:hover {
    color: var(--color15);
  }
  .carousel-caption {
    color: var(--color15);
  }
  .service .service-item:hover .service-img .service-icon {
    color: var(--color11);
  }
  
  .service .service-item:hover .service-img .service-icon i {
    color: var(--color15);
  }
  .service .service-item .service-img .service-icon i {
    color: var(--color18);
  }
  .faq-section .accordion .accordion-item .accordion-header .accordion-button {
    color: var(--color15);
  }
  
  .blog .blog-item .blog-img .blog-categiry {
    color: var(--color15);
  }
  
  .blog .blog-item:hover .blog-content {
    background: var(--color11);
  }
  .accordion-item {
    background-color: var(--color10);
    border: 1px solid var(--color7);
  }
  .team .team-item .team-title {
    color: var(--bs-primary);
    background: var(--color7);
  }
  
  .team .team-item .team-title h4 {
    color: var(--bs-primary);
  }
  .team .team-item:hover .team-title h4, .team .team-item.clicked .team-title h4 {
    color: var(--color15);
  }
  
  .team .team-item:hover .team-img::after, .fromjsclick::after, .team .team-item.clicked  .team-img::after {
    background: var(--color10);
  }
  .header-carousel .owl-nav .owl-prev, .header-carousel .owl-nav .owl-next {
    background: var(--color7);
  }
  
  .header-carousel .owl-nav .owl-prev:hover, .header-carousel .owl-nav .owl-next:hover {
    color: var(--color11);
  }

  .footer-item .footer-instagram:hover .footer-search-icon {
    background: var(--color7) !important;
  }
  
  .footer-item .footer-btn a {
    background: var(--color17) !important;
  }
  
  .footer .footer-item .footer-btn a:hover i {
    color: var(--color8);
  }
  
  .footer-item a {
    color: var(--color18) !important;
  }
  .footer-item a i {
    color: var(--bs-primary) !important;
  }
  .btn.btn-dark {
    color: var(--color11);
  }
  .btn.btn-dark:hover {
    background: var(--color11);
    color: var(--color6);
  }

 
  .nav-bar .btn.btn-light:hover {
    color: var(--color17);
    background: var(--bs-primary);
  }

  .modal-fullscreen .modal-body {
    background-color: var(--color18) !important;
  }

  .bg-dark {
    color: var(--color9);
  }

  .footer-item a:hover {
    color: var(--bs-primary) !important;
  }
  .footer-item a.btn:hover {
    background: var(--bs-primary) !important;
    color: var(--color8) !important;
  }
  .footer-item a.btn:hover i {
    color: var(--color8) !important;
  }
  
  .footer-item .footer-instagram:hover .footer-search-icon {
    background: var(--color7) !important;
  }
  .footer-item .footer-instagram .footer-search-icon {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.5s;
    opacity: 0;
  }
  .footer-item .footer-instagram:hover .footer-search-icon {
    opacity: 1;
  }

  
  @media (min-width: 992px) {
    .navbar .nav-item:hover .dropdown-menu {
      background: var(--color17);
    }
  }
  
  @media (max-width: 991px) {
    .navbar .navbar-nav {
      background: var(--color17);
    }
  }

  @media (min-width: 992px) {
    .navbar .navbar-nav {
      background: var(--color17);
    }
  }

  /* new style */
  .topbar {
    display: none !important;
  }
  .footersocialicon {
    display: inline-block !important;
  }
  .mybgstyle {
    height: 100% !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    min-height: 500px !important;
  }
  .mybgstyle_services {
    height: 100% !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    min-height: 208px !important;
  }
  .mybgstyle_about {
    height: 100% !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    min-height: 208px !important;
  }
  .mybgstyle_faq {
    height: 100% !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    min-height: 375px !important;
  }
  .footerlogo {
    display: inline-block;
    width: 50px;
    height: 26px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
  }
  .headerlogo {
    display: inline-block;
    width: 200px;
    height: 53px;
    background-size: contain;
    background-position: left;
    background-repeat: no-repeat;
    vertical-align: bottom;
  }
  
  .dropdown-menu {
    background-color: var(--color17);
    border-radius: 0;
    width: 100%;
    border:none;
  }
  .dropdown-menu {
    width: 90%;
  }
  .navbar-toggler .fa-bars {
    font-size: 24px;
  }
  .navbar-toggler {
    border: none !important;
  }
  .mygallery {
    background: none;
  }
  .footer-instagram, .footer-instagram-big {
    transition: transform 0.3s ease-in-out;
  }
  .footer-instagram2, .footer-instagram-big {
    background-size: 100%; 
    background-position: center; 
    width: 100%; 
    padding-bottom: 100%; 
    position: relative; 
    overflow: hidden; 
    transition: background-size 0.3s ease-in-out;
    background-repeat: no-repeat;
    max-width: 400px;
    max-height: 400px;
    margin: 0 auto;
  }
  .footer-instagram:hover, .footer-instagram-big:hover {
    background-size: 110% !important;
  }
  .footer-instagram2{
    padding-bottom: 400px; 
  }
  .footer-instagram a {
    position: relative;
    width: 100%;
    height: 100%;
    align-content: center !important;
    text-align: center !important;
  }
  .footer-search-icon a i {
    position: relative;
    top: 0;
    display: block;
    padding: calc(50% - 8px);
    width: 100%;
    height: 100%;
  }
  
  .mywhatscontact {
    display: block !important;
    text-align: center !important;
  }
  .mywhatscontact div {
    display: inline-block;
  }
  .bg-breadcrumb {
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
  }
  .header-carousel .header-carousel-item .carousel-caption {
    background: rgba(0, 0, 0, 0);
  }
  .goldstar {
    color: #f8ec07;
    text-shadow: 0px 0px 2px #00000080;
  }

  @media (min-width: 992px) {
    .navbar .nav-item:hover .dropdown-menu {
      margin-top: 0px;
    }
    .navbar .nav-item .dropdown-menu {
      border-radius: 0 0 10px 10px;
    }
  }

  
/* تم على عجل لإععطاء اللوحة لون الموقع */

.navbar-yellow {
  background-color: var(--bs-primary) !important;
}

.btn-primary {
  --bs-btn-border-color: var(--color15) !important;
}

a {
  color: rgba(var(--bs-blue),var(--bs-link-opacity,1)) !important;
}

.btn-check:checked + .btn, .btn.active, .btn.show, .btn:first-child:active, :not(.btn-check) + .btn:active {
  color: var(--color17) !important;
  background-color: var(--bs-primary) !important;
  border-color: unset !important;
}

.form-control:focus {
  border-color: unset !important;
}

.form-check-input:focus {
  border-color: var(--bs-primary) !important;
  box-shadow: 0 0 0 .25rem var(--color3) !important;
}

.navbar-nav {
  --bs-nav-link-color: var(--color10) !important;
  --bs-nav-link-hover-color: none !important;
  --bs-nav-link-disabled-color: none !important;
}

.navbar-dark, .navbar[data-bs-theme="dark"] {
  --bs-navbar-active-color: var(--bs-primary) !important;
}

.form-check-input:checked {
  background-color: var(--color12) !important;
  border-color: var(--color8) !important;
}


@media (min-width: 992px) {
  .navbar .navbar-nav {
    background: var(--color11) !important;
  }
}


.sidebar-dark-yellow .nav-sidebar > .nav-item > .nav-link.active, .sidebar-light-yellow .nav-sidebar > .nav-item > .nav-link.active {
  background-color: var(--color15) !important;
}
.nav-link {
  background: var(--color9);
}
.sidebar-dark .nav-sidebar > .nav-item.menu-open > .nav-link, .sidebar-dark .nav-sidebar > .nav-item:hover > .nav-link, .sidebar-dark .nav-sidebar > .nav-item > .nav-link:focus, [class*="sidebar-dark-"] .nav-sidebar > .nav-item.menu-open > .nav-link, [class*="sidebar-dark-"] .nav-sidebar > .nav-item:hover > .nav-link, [class*="sidebar-dark-"] .nav-sidebar > .nav-item > .nav-link:focus, [data-bs-theme="dark"] [class*="sidebar-light-"] .nav-sidebar > .nav-item.menu-open > .nav-link, [data-bs-theme="dark"] [class*="sidebar-light-"] .nav-sidebar > .nav-item:hover > .nav-link, [data-bs-theme="dark"] [class*="sidebar-light-"] .nav-sidebar > .nav-item > .nav-link:focus {
  background-color: var(--color15);
}
.sidebar-dark .nav-treeview > .nav-item > .nav-link:focus, .sidebar-dark .nav-treeview > .nav-item > .nav-link:hover, [class*="sidebar-dark-"] .nav-treeview > .nav-item > .nav-link:focus, [class*="sidebar-dark-"] .nav-treeview > .nav-item > .nav-link:hover, [data-bs-theme="dark"] [class*="sidebar-light-"] .nav-treeview > .nav-item > .nav-link:focus, [data-bs-theme="dark"] [class*="sidebar-light-"] .nav-treeview > .nav-item > .nav-link:hover {
  background-color: var(--color18);
}
.btn-link {
  --bs-btn-color: var(--bs-blue);
  --bs-btn-hover-color: var(--color13);
}
.text-bg-yellow {
  background-color: var(--color15) !important;
}
.ew-swal2-actions .btn {
  background-color: var(--color18);
}
.btn-check:focus + .ew-swal2-actions .btn, .ew-swal2-actions .btn:focus {
  background-color: var(--bs-primary);
  border-color: unset;
  box-shadow: 0 0 0 .25rem var(--color10);
}
.select2-container--bootstrap5.select2-container--focus.select2-container--open .select2-selection {
  border-bottom-color: var(--color15);
}
.select2-container--bootstrap5.select2-container--focus .select2-selection--multiple, .select2-container--bootstrap5.select2-container--focus .select2-selection--single {
  border-color: var(--color15);
}
.btn.btn-primary {
  background-color: var(--bs-primary);
}
.btn-primary {
  --bs-btn-focus-shadow-rgb: var(--color15);
}
.nav-link {
  color: var(--bs-primary);
}
.nav {
  --bs-nav-link-color: var(--color12);
  --bs-nav-link-hover-color: var(--color8);
}
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
  background-color: var(--color15);
}
.form-select:focus {
  box-shadow: 0 0 0 .25rem var(--color15) !important;
}
.select2-container--bootstrap5.select2-container--focus .select2-selection {
  box-shadow: 0 0 0 .25rem var(--color15);
}
.dropdown-header {
  color: var(--color12);
  text-align: center !important;
  display: inline-block !important;
  width: auto !important;
}
.dropdown-menu.dropdown-menu-end.ew-user-dropdown.show {
  width: auto !important;
}