
a {
  text-decoration: none !important;
}
* {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}
.form-container .form-group .form-inner .input-container .input-box input {
        padding-right: 1rem !important;
        border-left: 3px solid var(--Nuturals-N-4) !important;


}
 .optional
 {
     left :20px !important;
 }
 .submit-container .left-side-submit
 {
         padding-right: 1.7rem !important;
             margin-left: 1rem !important;


 }
 .submit-container .left-side-submit .custom-checkbox
 {
         right: 0 !important;

 }
 .submit-container .left-side-submit .custom-checkbox input
 {
         right: 0 !important;

 }
  .submit-container .left-side-submit .checkmark
  {
      right: 0% !important;
  }
   .submit-container .right-side-submit
   {
           padding-right: 1.6rem !important;

   }
   .submit-container .right-side-submit .custom-checkbox
   {
           right: 0 !important;

   }
    .submit-container .right-side-submit .custom-checkbox input
    {
            right: 0 !important;

    }
     .submit-container .right-side-submit .checkmark
     {
             right: 0% !important;

     }
      .form-container .form-group .form-inner .input-container .input-box select
      {
              padding-right: 1rem !important;
                  border-left: 3px solid var(--Nuturals-N-4) !important;


      }
      .rotat
      {
          transform:rotate(180deg);
      }
:root {
  --Nuturals-N-1: #140000;
  --Nuturals-N-2: #262121;
  --Nuturals-N-3: #594e4e;
  --Nuturals-N-7: #fcfcfc;
  --Nuturals-N-6: #f2eded;
  --Nuturals-White: #fff;
  --Primary-Primary: #ad1519;
  --Ternary-Ternary: #140000;
  --NuturalsN-5: #bfb6b6;
  --Nuturals-N-4: #807070;
  --secondary: #fee1e1;
  --Success-Success---Primary: #16ad38;
  --Secondary-Secondary: #fabd00;
}
#register_form, #Inquiry_Form, #tailored, #Brochure, #friend, #contact_back, #groupoffer
{
    display:none;
    direction:rtl;
}
.block_form
{
    display:block;
}
html {
  font-size: 100%;
}
body {
  user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
}
p {
  margin-bottom: 0 !important;
}
.navbar-toggle-container {
  width: 40px;
  background-color: rgba(128, 128, 128, 0.589);
  height: 100%;
}
::-webkit-scrollbar {
  width: 12px;
  background-color: #fff;
  color: black;
}
::-webkit-scrollbar-thumb {
  background-color: var(--Primary-Primary);
  border-radius: 0;
  height: 80px;
}
.flag {
  position: absolute;
  top: 80px;
  right: 0px;
  z-index: -1;
}
/* --------------------------------------------- navbar -------------------------------------------------- */
.navigationBar {
  background-color: var(--Nuturals-White);
  display: flex;
  flex-direction: row;
  align-items: center;
  width: 100%;
  padding: 0px 2.5rem;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 10000;
  max-height: 80px;
  color: var(--Nuturals-N-1);
  box-shadow: 0px 0px 5px 0px rgba(20, 0, 0, 0.16);
}
.navigationBar .nav-list-container {
  margin: auto;
}
.navigationBar ul {
  list-style: none;
  display: flex;
  height: 100%;
  justify-content: center;
  align-items: center;
  margin: 0;
  padding-left: 0;
  margin-right: 1rem;
  align-self: center;
}
.navigationBar ul li {
  height: 100%;
  /* margin: 0px 2px; */
  display: flex;
  justify-content: center;
  align-items: center;
}
.navigationBar img {
  pointer-events: none;
}
.active-list {
  background-color: var(--secondary);
}
.active-list a {
  color: var(--Primary-Primary) !important;
font-weight:600;
}
.navigationBar ul li a {
  text-decoration: none;
  color: var(--Nuturals-N-1);
  text-align: center;
  /* line-height: 80px; */
  padding: 0px 1.4rem;
  height: 80px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  transition: all 300ms;
}
.navigationBar ul li a:hover .down-arrow-nav-absolute {
  opacity: 1;
}
.down-arrow-nav {
  margin-left: 1rem;
}
.down-arrow-nav-absolute {
  position: absolute;
  right: 1.4rem;
  opacity: 0;
  transition: all 300ms;
}
.navigationBar ul li a:hover {
  color: var(--Primary-Primary);
}
.navigationBar ul li a:hover path {
  fill: var(--Primary-Primary) !important;
}
.navigationBar .header-search-bar {
  height: 3rem;
  width: 3rem;
  margin-right: 10px;
  cursor: pointer;
}

.navigationBar .changeTo-arabic-courses-box .arabic-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.changeTo-arabic-courses-box {
  background-color: var(--Ternary-Ternary);
  padding: 0.438rem 0.5rem 0.438rem 0.375rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  height: 3rem;
  cursor: pointer;
}
.arabic-course-txt {
  color: var(--Nuturals-White);
  font-size: 0.875rem;
  margin: 0 !important;
}
.navigationBar .navigation-bar-right-side {
  display: flex;
  justify-content: center;
  align-items: center;
  justify-self: flex-end !important;
  margin-left: auto;
}
.logo-image {
  padding: 0.938rem 2rem 0.938rem 0;
}
.navigationBar .nav-list-container .nav-icon-toggler {
  display: none !important;
  margin-left: 1rem;
  position: relative;
  height: 100% !important;
  overflow: hidden;
  max-height: 80px;
}

.navigationBar .nav-icon-toggler p {
  color: #ad1519;
  height: 80px;
  padding: 0rem 1.25rem;
  text-align: center;
font-weight:800;
  background-color: var(--secondary);
  line-height: 80px;
}
.navigationBar .nav-icon-toggler svg {
  margin-left: 10px;
  height: 25px;
}
/* toggler items */
.navigationBar .nav-items-container {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  position: absolute;
  left: 0px;
  top: 100%;
  background-color: white;
  width: 30rem;
  transition: 0.3s;
  visibility: hidden;
  opacity: 0;
}
.navigationBar .nav-items-container .nav-toggler-item {
  padding: 20px 10px;
  border: 0.7px solid rgba(105, 105, 105, 0.39);
  text-align: center;
}
.navigationBar .nav-items-container .careers {
  grid-column: span 2;
  text-align: center;
}

.navigationBar .categories-dropdown-nav {
  position: absolute;
  top: 100%;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  left: 50%;
  transform: translateX(-50%);
  background-color: var(--Nuturals-White);
  border: 1px solid var(--NuturalsN-5);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  height: 250px;
  overflow: auto;
  z-index: 10000;
  visibility: hidden;
  opacity: 0;
  width: 50%;
  transition: 0.3s;
}
#categories-dropdown-collapse {
  position: absolute;
  top: 100%;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  left: 50%;
  transform: translateX(-50%);
  background-color: var(--Nuturals-White);
  border: 1px solid var(--NuturalsN-5);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  height: 250px;
  overflow: auto;
  z-index: 10000;
  visibility: hidden;
  opacity: 0;
  width: 50%;
  transition: 0.3s;
}
.navigationBar .categories-dropdown-nav .categories-dropdown-item {
  padding: 1rem 1rem 10px 0.7rem;
  font-size: 0.8rem;
  text-transform: capitalize;
  border-right: 1px solid var(--NuturalsN-5); /* Add right border */
  border-bottom: 1px solid var(--NuturalsN-5); /* Add bottom border */
}
.navigationBar .categories-dropdown-nav .categories-dropdown-item:hover {
  color: var(--Nuturals-White);
  background-color: var(--Primary-Primary);
  cursor: pointer;
}
.navigationBar .categories-dropdown-nav::-webkit-scrollbar-thumb {
  background-color: var(--Primary-Primary);
  border-radius: 1px;
  border: var(--Nuturals-N-6);
  width: 10px;
}
.navigationBar .categories-dropdown-nav::-webkit-scrollbar {
  width: 6px;
  border-radius: 1px;
  background-color: rgba(245, 227, 227, 0.2);
  border: 1px solid var(--Nuturals-N-6);
}

.navigationBar .cities-dropdown-nav {
  position: absolute;
  top: 100%;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  left: 50%;
  transform: translateX(-50%);
  background-color: var(--Nuturals-White);
  border: 1px solid var(--NuturalsN-5);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  height: 250px;
  overflow: auto;
  z-index: 10000;
  visibility: hidden;
  opacity: 0;
  width: 50%;
  transition: 0.3s;
}
.navigationBar .cities-dropdown-nav .cities-dropdown-item {
  padding: 1rem 1rem 10px 0.7rem;
  font-size: 0.8rem;
  text-transform: capitalize;
  border-right: 1px solid var(--NuturalsN-5); /* Add right border */
  border-bottom: 1px solid var(--NuturalsN-5); /* Add bottom border */
}
.navigationBar .cities-dropdown-nav .cities-dropdown-item:hover {
  color: var(--Nuturals-White);
  background-color: var(--Primary-Primary);
  cursor: pointer;
}
.navigationBar .cities-dropdown-nav::-webkit-scrollbar-thumb {
  background-color: var(--Primary-Primary);
  border-radius: 1px;
  border: var(--Nuturals-N-6);
  width: 10px;
}
.navigationBar .cities-dropdown-nav::-webkit-scrollbar {
  width: 6px;
  border-radius: 1px;
  background-color: rgba(245, 227, 227, 0.2);
  border: 1px solid var(--Nuturals-N-6);
}
.navigationBar ul li a svg {
  margin-left: 10px !important  ;
}
.navigationBar ul li a svg path {
  transition: all 0.5s;
}
.navigationBar ul li a:hover path {
  fill: var(--Primary-Primary) !important;
}
.navigationBar .nav-items-container .nav-toggler-item a {
  text-decoration: none;
  color: var(--Nuturals-N-1);
}

@media (1024px < width <1320px) {
  .logo-image {
    padding-right: 0.5rem;
    width: 148px;
  }
  .navigationBar .nav-list-container ul li a {
    padding: 0px 0.5rem;
  }
  .navigationBar {
    padding: 0px 0.8rem;
  }
}

@media (width<1025px) {
  .header-section {
    height: 70vh;
  }
  .navigationBar .nav-list-container ul {
    display: none;
  }
  .navigationBar {
    justify-content: space-between;
  }
  .navigationBar .nav-icon-toggler p {
    height: 80px;
    padding: 0rem 1.25rem;
  }
  .navigationBar .nav-list-container .nav-icon-toggler {
    display: flex !important;
    margin-left: 1rem;
    margin: auto;
  }
  .navbar-home-item {
    max-height: 80px;
  }
  .navigationBar .header-search-bar {
    width: 3rem;
    height: 3rem;
    margin-right: 10px;
  }
  .navigationBar .nav-items-container {
    left: 50%;
    transform: translateX(-50%);
  }
  .navigation-bar-right-side {
    margin-left: 0 !important;
  }
  #categories-dropdown-collapse {
    width: 80%;
  }
}
@media (width<768px) {
  #categories-dropdown-collapse {
    width: 100%;
  }
  .logo-image {
    width: 130px !important;
    padding: 0.938rem 0rem 0.938rem 0;
  }
  .navigationBar .cities-dropdown-nav {
    width: 100%;
  }
}
@media (width<600px) {
  .navigationBar {
    padding: 0 0.5rem;
  }
  .navigationBar .nav-icon-toggler p {
    height: 80px;
    padding: 0rem 1.25rem;
  }
  .navigationBar .nav-icon-toggler {
    margin: 0 !important;
    margin-right: 1px;
  }
  .logo-image {
    width: 120px;
    padding: 0.938rem 0rem 0.938rem 0;
  }
  .changeTo-arabic-courses-box p {
    display: none;
  }
  .navigationBar .header-search-bar {
    height: 3rem;
    width: 3rem;
    margin-right: 5px;
  }

  .navigationBar .nav-items-container {
    width: 100vw;
    left: 50%;
    transform: translateX(-50%);
  }
}
@media (width<400px) {
  .navigationBar {
    padding: 0 0.1rem;
    max-height: 70px;
    /* overflow: hidden; */
  }
  .navigationBar .nav-list-container .nav-icon-toggler {
    max-height: 70px;
    overflow: hidden;
  }
  .nav-items-container {
    top: 71px !important;
  }
  .logo-image {
    width: 110px !important;
  }
  .navigationBar .nav-icon-toggler p {
    height: 80px;
    padding: 0rem 1.25rem;
  }
  .navigationBar .header-search-bar {
    height: 2.3rem;
    width: 2.3rem;
    margin-right: 2px;
  }
  .changeTo-arabic-courses-box {
    width: 2.3rem;
    height: 2.3rem;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .flag {
    position: absolute;
    top: 70px;
    right: 0px;
  }
}

/* --------------------------------------------- navigation box --------------------------------------------- */
.navigation-box-container {
  display: flex;
}
.navigation-box {
  margin-top: 105px;
  margin-left: 3rem;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
  background-color: var(--Nuturals-N-7);
  overflow: hidden;
  min-height: 40px;
  overflow: hidden;
  padding-right: 12px;
  color: var(--Nuturals-N-3);
}
.navigation-box span a {
  color: var(--NuturalsN-5) !important;
  text-decoration: none;
}
.navigation-box .Opportunity-details {
  margin-right: 1rem;
}
.navigation-box .back-image {
  height: 100%;
}
.navigation-box .careers-span {
  border-right: 1px solid #807070;
  height: 40px;
  margin-right: 2px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0px 10px;
}
.city-name-nav {
  height: 40px;
  margin-right: 2px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0px 10px;
  color: var(--NuturalsN-5) !important;
}
.navigation-box .anchor-back {
  height: 40px;
}

@media (width< 768px) {
  .job-details-container {
    padding-bottom: 7rem;
  }
  .job-information {
    width: 100% !important;
  }
  .business-ethics button {
    width: 90%;
  }
  .navigation-box {
    margin-left: 0.5rem;
    font-size: 13px;
  }
  .navigation-box .Opportunity-details {
    margin-top: 0.7rem;
  }
}
@media (width< 400px) {
  .navigation-box-container {
    margin-left: 0;
    font-size: 8px !important;
  }
  .business-ethics h2 {
    font-size: 1.1rem;
  }
  .navigation-box {
    margin-left: 0.4rem;
    width: 100%;
  }
  .navigation-box img {
    height: 10px;
  }
  .hero-section h1 {
    font-size: 1.2rem;
  }
}
/*------------------------------------------------ hero section -----------------------------------------------*/
.hero-section img {
  pointer-events: none;
}
.hero-section {
  padding: 2rem 0rem;
}
.hero-header {
  padding: 3rem 0rem;
  background-color: var(--Nuturals-N-2);
  background-image: url("https://eurodemy.net/ar/Assets/BG\ Shapes.svg");
  margin: 3rem 0rem;
  margin-bottom: 0rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 400px;
  position: relative;
}
.hero-inner {
  margin-top: -135px !important;
  width: 90%;
  margin: auto;
}
.hero-section p {
  color: var(--Nuturals-N-6);
  margin-bottom: 1rem !important;
}
.hero-section h1 {
  color: var(--Nuturals-N-6);
font-weight:600;
  margin-top: 1rem;
  text-align: center;
  padding 0rem 1rem
}
.hero-section .download-buttons {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  margin-top: 3rem;
}
.hero-section .download-buttons button {
  background-color: transparent;
  padding: 0.5rem 1rem;
  border: 1px solid var(--Nuturals-N-4);
  color: var(--NuturalsN-5);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  cursor: pointer;
}
.hero-section .category-image-container {
  position: relative;
  display: block;
  width: 100%;
  margin: 2rem auto;
}
.hero-section .category-image-container img {
  width: 100%;
  height: 100%;
  z-index: 10;
  position: relative;
}
.hero-section .category-image-container .rects {
  position: absolute;
  bottom: 15px;
  right: 8px;
  height: 80px;
  width: 80px;
  z-index: 1;
}
.hero-section .course-code-section {
  position: relative;
  background-color: var(--Nuturals-White);
  width: 97%;
  margin: auto;
  display: flex;
  flex-direction: column;
  gap: 2rem;
  direction:rtl;
}
.hero-section .course-code-section .border-top-left {
  position: absolute;
  top: -4px;
  left: -4px;
  z-index: -1;
}
.hero-section .course-code-section .border-bottom-left {
  position: absolute;
  bottom: -4px;
  left: -4px;
  z-index: -1;
}
.hero-section .course-code-section .border-top-right {
  position: absolute;
  top: -4px;
  right: -4px;
  z-index: -1;
}
.hero-section .course-code-section .border-bottom-right {
  position: absolute;
  bottom: -4px;
  right: -4px;
  z-index: -1;
}
.hero-section .course-code-section .course-code-row1 {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.hero-section .course-code-section .course-code-row1 .duration-box-container {
  background-color: var(--Nuturals-N-7);
  width: 30%;
  padding: 2rem 1rem;
}
.hero-section .course-code-section .course-code-row1 .duration-box-container p {
  color: var(--Nuturals-N-3) !important;
  display: flex;
  justify-content: flex-start;
  align-items: center;
font-weight:600;
  font-size: 1.125rem;
}
.hero-section
  .course-code-section
  .course-code-row1
  .duration-box-container
  p
  img {
  margin-left: 0.5rem;
}
.hero-section
  .course-code-section
  .course-code-row1
  .duration-box-container
  .duration-box {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 2rem;
}
.hero-section
  .course-code-section
  .course-code-row1
  .duration-box-container
  .duration-box
  p {
  margin-bottom: 0px !important;
  padding: 0.5rem 0.8rem 0rem;
  width: 30%;
  text-align: center;
font-weight:500;
  /* font-size: 18px;    */
}

.hero-section .course-code-section .course-code-row1 .city-box-container {
  background-color: var(--Nuturals-N-7);
  width: 30%;
  padding: 2rem 1rem;
}
.hero-section .course-code-section .course-code-row1 .city-box-container p {
  color: var(--Nuturals-N-3) !important;
  display: flex;
  justify-content: flex-start;
  align-items: center;
font-weight:700;
  font-size: 1.125rem;
}
.hero-section .course-code-section .course-code-row1 .city-box-container p img {
  margin-left: 0.3rem;
}

.hero-section
  .course-code-section
  .course-code-row1
  .city-box-container
  .city-box {
  display: flex;
  gap: 0.5rem;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin-top: 1rem;
}

.hero-section
  .course-code-section
  .course-code-row1
  .city-box-container
  .city-box
  p {
  margin-bottom: 0px !important;
  padding: 0.5rem 0.9rem 0rem;
  text-align: center;
  font-size: 16px;
font-weight:500;
}
.course-code-main-container {
  width: 30%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.hero-section .course-code-section .course-code-box-container {
  background-color: var(--Nuturals-N-7);

  padding: 1rem;
  position: relative;
  /* z-index: 10 !important; */
}
.hero-section .course-code-section .course-code-box-container p {
  color: var(--Nuturals-N-3) !important;
  display: flex;
  justify-content: flex-start;
  align-items: center;
font-weight:600;
  font-size: 1.125rem;
  z-index: 10 !important;
  position: relative;
}
.hero-section .course-code-section .course-code-box-container p img {
  margin-right: 0.5rem;
}
.hero-section .course-code-section .code-box {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin-top: 2rem;
  z-index: 5 !important;
  position: relative;
}
.hero-section .course-code-section .code-box h3 {
  color: var(--Primary-Primary);
font-weight:600;
  font-size: 22px;
  margin-bottom: 1rem;
}
.hero-section .course-code-section .code-box span {
font-weight:400;
  color: var(--Nuturals-N-4);
  border: 1px solid var(--NuturalsN-5);
  padding: 0.3rem 1.5rem;
  cursor: pointer;
}
.hero-section .course-code-section .code-box span:active{
  background: var(--Nuturals-N-6);

}
.hero-section .course-code-section .code-box span img {
  margin-right: 8px;
}
.hero-section
  .course-code-section
  .course-code-box-container
  .code-box-left-top {
  position: absolute;
  top: -4px;
  left: -4px;
  z-index: -1 !important;
}
.hero-section
  .course-code-section
  .course-code-box-container
  .code-box-left-bottom {
  position: absolute;
  bottom: -4px;
  left: -4px;
  z-index: -1 !important;
}
.hero-section
  .course-code-section
  .course-code-box-container
  .code-box-right-top {
  position: absolute;
  top: -4px;
  right: -4px;
  z-index: -1 !important;
}
.hero-section
  .course-code-section
  .course-code-box-container
  .code-box-right-bottom {
  position: absolute;
  bottom: -4px;
  right: -4px;
  z-index: -2 !important;
}
.gray-background {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 0;
}

.hero-section .course-code-section .course-code-row2 {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.hero-section .course-code-section .course-code-row2 .attendance-box-container,
.hero-section .course-code-section .course-code-row2 .salary-box-container {
  background-color: var(--Nuturals-N-7);
  width: 30%;
  padding: 2rem 1rem;
  height: 200px;
}
.hero-section
  .course-code-section
  .course-code-row2
  .attendance-box-container
  p,
.hero-section .course-code-section .course-code-row2 .salary-box-container p {
  color: var(--Nuturals-N-3) !important;
  display: flex;
  justify-content: flex-start;
  align-items: center;
font-weight:600;
  font-size: 1.125rem;
}
.hero-section
  .course-code-section
  .course-code-row2
  .attendance-box-container
  p
  img,
.hero-section
  .course-code-section
  .course-code-row2
  .salary-box-container
  p
  img {
  margin-right: 0.3rem;
}

.hero-section
  .course-code-section
  .course-code-row2
  .attendance-box-container
  .attendance-box {
  display: flex;
  gap: 0.5rem;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin-top: 1rem;
}

.hero-section
  .course-code-section
  .course-code-row2
  .attendance-box-container
  .attendance-box
  p {
  margin-bottom: 0px !important;
  padding: 0.5rem 0.9rem 0rem;
  text-align: center;
  font-size: 16px;
font-weight:500;
  font-size: 1.3rem;
}
.hero-section
  .course-code-section
  .course-code-row2
  .attendance-box-container
  .attendance-box
  span {
  color: var(--Nuturals-N-3);
  font-size: 1rem;
}

.hero-section
  .course-code-section
  .course-code-row2
  .salary-box-container
  .salary-box
  p {
  display: flex;
  gap: 1rem;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  margin-top: 3rem;
}

/* apply container */
.apply-container {
  width: 90%;
  margin: 100px auto;
  padding: 1rem;
}
.apply-container .apply-button {
  background-image: url("https://eurodemy.net/ar/custom_image/coursedetails/apply-BG.png");
  background-size: cover;
  background-repeat: no-repeat;
  width: 25%;
  border: none;
  color: white;
  margin: auto;
  display: block;
  height: 52px;
font-weight:500;
  font-size: 1.125rem;
  cursor: pointer;
}

.apply-container .apply-details-box {
  padding: 1rem 0.5rem;
  margin-top: 2rem;
  width: 100%;
  border-left: 2px solid var(--Nuturals-N-3);
  border-right: 2px solid var(--Nuturals-N-3);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}
.apply-container .apply-details-box button {
  position: relative;
  width: calc(100% / 3 - 0.5rem) !important;
  margin-bottom: 0.5rem;
  height: 44px;
  background-color: var(--Nuturals-N-7);
  border: 1px solid var(--Nuturals-N-4);
  cursor: pointer;
}
.apply-container .apply-details-box button:hover {
  background-color: var(--Nuturals-N-6);
}
.apply-container .apply-details-box button img {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 1rem;
}
@media (width<1025px) {
  .course-code-section {
    justify-content: center;
    gap: 1rem !important    ;
  }
  .course-code-main-container {
    position: static;
    transform: none;
    width: 100%;
    overflow: visible;
  }
  .course-code-box-container {
    position: relative;
    width: 50%;
    margin: auto;
    background-image: url("https://eurodemy.net/ar/Assets/gray-bg.png");
    z-index: 0;
  }
  .code-box {
    z-index: 5 !important;
    position: relative;
  }
  .duration-box-container {
    width: 49% !important;
    height: 200px;
    /* padding: 2rem 0.3rem; */
  }
  .city-box-container {
    width: 49% !important;
    height: 200px;
  }
  .hero-section
    .course-code-section
    .course-code-row2
    .attendance-box-container,
  .hero-section .course-code-section .course-code-row2 .salary-box-container {
    width: 49%;
    height: 200px;
  }
  .hero-section
    .course-code-section
    .course-code-row2
    .salary-box-container
    .salary-box
    p {
    margin-top: 3rem;
  }
  .apply-container .apply-button {
    width: 40%;
  }
  .apply-container .apply-details-box button {
    width: calc(100% / 2 - 0.5rem) !important;
  }
}
@media (width<768px) {
  .hero-section .download-buttons {
    flex-direction: column;
  }
  .hero-section {
    font-size: 85%;
  }
  .course-code-row1,
  .course-code-row2 {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 0.5rem;
  }
  .duration-box-container {
    width: 100% !important;
    height: 200px;
  }
  .city-box-container {
    width: 100% !important;
    height: 200px;
  }
  .attendance-box-container {
    width: 100% !important;
  }
  .salary-box-container {
    width: 100% !important;
  }
  .hero-section .course-code-section .course-code-box-container {
    width: 100% !important;
  }
  .code-box-left-bottom,
  .code-box-left-top,
  .code-box-right-bottom,
  .code-box-right-top {
    display: none;
  }
  .course-code-section {
    gap: 0.5rem !important;
  }
  .hero-inner {
    margin-top: -90px !important;
  }
  .apply-container .apply-button {
    width: 100%;
  }
  .apply-container .apply-details-box button {
    width: 100% !important;
  }
}

/*---------------------------------------- course details ----------------------------------------------------*/

.course-details-section {
  padding: 2rem 0rem 7rem;
  direction:rtl;
}
.course-details-section .course-details-header {
  text-align: center;
  padding: 1rem;
  margin: auto;
  width: 40%;
  margin-bottom: 4rem;
}
.course-details-section .course-details-header h1 {
font-weight:600;
  font-size: 28px;
}
.course-details-section .course-details-header img {
  width: 100%;
}

.course-details-nav-box {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 75%;
  margin: auto;
}
.course-details-nav-box p {
  width: 30%;
  text-align: center;
font-weight:700;
  padding: 0.5rem;
  color: var(--Nuturals-N-4);
}

.course-details-nav-box p.active {
  color: var(--Primary-Primary);
  border-bottom: 2px solid var(--Primary-Primary);
  /* transition: 0.4s;   */
}
.course-details-inner {
  width: 90%;
  padding: 1rem;
  margin: 80px auto;
}
.course-details-inner .about-inner .about-introduction,
.course-details-inner .about-inner .about-training-methodology,
.course-details-inner .about-inner .about-personal-impact {
  background-color: var(--Nuturals-N-7);
  border-left: 5px solid var(--Nuturals-N-3);
  margin-bottom: 2rem;
}

.course-details-inner .about-inner .about-Seminar-Objectives,
.course-details-inner .about-inner .about-organisational-impact,
.course-details-inner .about-inner .about-attendance {
  background-color: var(--Nuturals-White);
  border-left: 5px solid var(--Nuturals-N-3);
  margin-bottom: 2rem;
  box-shadow: 1px 1px 4px 1px var(--Nuturals-N-6);
}
.course-details-inner .about-inner .about-introduction-head,
.course-details-inner .about-inner .about-seminar-head,
.course-details-inner .about-inner .about-training-head,
.course-details-inner .about-inner .about-organizational-head,
.course-details-inner .about-inner .about-personal-head,
.course-details-inner .about-inner .about-attendance-head {
  position: relative;
  padding: 1rem;
  display: flex;
  flex-direction: row;
  padding: 2rem 3rem 1rem 2rem;
}
.course-details-inner .about-inner .about-introduction-head .toggler,
.course-details-inner .about-inner .about-seminar-head .toggler,
.course-details-inner .about-inner .about-training-head .toggler,
.course-details-inner .about-inner .about-organizational-head .toggler,
.course-details-inner .about-inner .about-personal-head .toggler,
.course-details-inner .about-inner .about-attendance-head .toggler {
  position: absolute;
  right: 0;
  top: 0;
  cursor: pointer;
}
.course-details-inner .about-inner .about-introduction-head h5,
.course-details-inner .about-inner .about-seminar-head h5,
.course-details-inner .about-inner .about-training-head h5,
.course-details-inner .about-inner .about-organizational-head h5,
.course-details-inner .about-inner .about-personal-head h5,
.course-details-inner .about-inner .about-attendance-head h5 {
  border-bottom: 1px solid var(--Nuturals-N-3);
  margin-left: 10px;
  width: 100%;
  padding: 4px;
font-weight:700;
}

.course-details-inner
  .about-inner
  .about-introduction
  .about-introduction-content,
.course-details-inner
  .about-inner
  .about-Seminar-Objectives
  .about-seminar-content,
.course-details-inner
  .about-inner
  .about-training-methodology
  .about-training-content,
.course-details-inner
  .about-inner
  .about-organisational-impact
  .about-organizational-content,
.course-details-inner
  .about-inner
  .about-personal-impact
  .about-personal-content,
.course-details-inner .about-inner .about-attendance .about-attendance-content {
  width: 90%;
  margin: auto;
  padding: 0.5rem;
  color: var(--Nuturals-N-2);
}

.about-introduction-content p,
.about-seminar-content p,
.about-impact-content p,
.about-organizational-content p,
.about-personal-content p,
.about-attendance-content p {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 0.5rem;
font-weight:800;
  font-size: 1rem;
  margin-bottom: 0.3rem !important;
  color: var(--Nuturals-N-2);
}

/* content inner */

.content-inner .content-day1,
.content-inner .content-day3,
.content-inner .content-day5 {
  background-color: var(--Nuturals-N-7);
  border-left: 5px solid var(--Nuturals-N-3);
  margin-bottom: 2rem;
}
.content-inner .content-day2,
.content-inner .content-day4 {
  border-left: 5px solid var(--Nuturals-N-3);
  margin-bottom: 2rem;
  background-color: var(--Nuturals-White);
  box-shadow: 1px 1px 4px 1px var(--Nuturals-N-6);
}
.course-details-inner .content-inner .content-day1-head,
.course-details-inner .content-inner .content-day2-head,
.course-details-inner .content-inner .content-day3-head,
.course-details-inner .content-inner .content-day4-head,
.course-details-inner .content-inner .content-day5-head {
  position: relative;
  padding: 1rem;
  display: flex;
  flex-direction: row;
  padding: 2rem 3rem 1rem 2rem;
}

.course-details-inner .content-inner .content-day1-head .toggler,
.course-details-inner .content-inner .content-day2-head .toggler,
.course-details-inner .content-inner .content-day3-head .toggler,
.course-details-inner .content-inner .content-day4-head .toggler,
.course-details-inner .content-inner .content-day5-head .toggler {
  position: absolute;
  right: 0;
  top: 0;
  cursor: pointer;
}

.course-details-inner .content-inner .content-day1-head h5,
.course-details-inner .content-inner .content-day2-head h5,
.course-details-inner .content-inner .content-day3-head h5,
.course-details-inner .content-inner .content-day4-head h5,
.course-details-inner .content-inner .content-day5-head h5 {
  border-bottom: 1px solid var(--Nuturals-N-3);
  margin-left: 10px;
  width: 100%;
  padding: 5px;
  text-align: center;
font-weight:700;
}

.course-details-inner .content-inner h1 {
  width: 100%;
  color: var(--Primary-Primary);
font-weight:700;
  text-align: center;
  font-size: 28px;
  margin: 1rem 0rem 2rem;
}
.content-inner .content-day1-content,
.content-inner .content-day2-content,
.content-inner .content-day3-content,
.content-inner .content-day4-content,
.content-inner .content-day5-content {
  width: 90%;
  margin: auto;
  padding: 0.5rem;
  color: var(--Nuturals-N-2);
}
.content-day1-content p,
.content-day2-content p,
.content-day3-content p,
.content-day4-content p,
.content-day5-content p {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 0.5rem;
 font-weight:800;
  font-size: 1rem;
  margin-bottom: 0.3rem !important;
  color: var(--Nuturals-N-2);
}

.rotate-180 {
  transform: rotate(180deg);
}
.remove-border {
  border-bottom: none !important;
  transition: 0.4s;
}

.about-inner p i,
.content-inner p i {
  font-size: 5px;
}

/* training inner */
.course-details-inner .training-inner {
  border: 1px solid var(--NuturalsN-5);
  margin: auto;
  position: relative;
}
.course-details-inner .training-inner .training-border-top-left {
  position: absolute;
  top: 0;
  left: 0;
}
.course-details-inner .training-inner .training-border-bottom-left {
  position: absolute;
  bottom: 0;
  left: 0;
}
.course-details-inner .training-inner .training-border-top-right {
  position: absolute;
  top: 0;
  right: 0;
}
.course-details-inner .training-inner .training-border-bottom-right {
  position: absolute;
  bottom: 0;
  right: 0;
}
.course-details-inner .training-inner .logo-container {
  width: 100%;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}

.course-details-inner .training-inner .logo-container .training-logo {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}

.course-details-inner .training-inner .training-header {
  width: 90%;
  position: relative;
  margin-top: 50px;
  margin: auto;
  padding: 2rem 0rem;
  text-align: center;
}
.course-details-inner .training-inner .training-header p {
font-weight:500;
  color: var(--Nuturals-N-2);
}
.course-details-inner .training-inner .training-header h4 {
  color: var(--Primary-Primary);
font-weight:600;
  text-align: center;
  padding: 1rem 0rem;
}
.training-header-seperator {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
}
.training-content {
  padding: 2rem 0rem;
}
.training-content .training-content-box {
  padding: 3rem 1rem;
  width: 90%;
  margin: 0 auto;
  text-align: center;
  border-bottom: 1px solid var(--Nuturals-N-4);
}
.training-content .training-content-box h5,
.training-content .training-content-last-box h5 {
font-weight:600;
  margin-bottom: 1rem;
  text-transform: capitalize;
  font-size: 20px;
}
.training-content .training-content-box p {
font-weight:500;
  font-size: 16px;
}
.highlighted-red {
  color: var(--Primary-Primary);
  font-weight: 600;
}
.training-content-last-box {
  padding: 3rem 1rem 2rem;
  width: 90%;
  margin: 0 auto;
  text-align: center;
font-weight:500;
  font-size: 16px;
}
@media (min-width:767px) and (max-width:1024px) {
  .course-details-section .course-details-header {
    width: 70%;
  }
  .course-details-nav-box {
    width: 95%;
  }
}
@media (width<768px) {
  .course-details-inner {
    padding: 0rem;
  }
  .course-details-section .course-details-header {
    width: 90%;
  }
  .course-details-nav-box {
    flex-direction: column;
    width: 100%;
  }
  .course-details-nav-box p {
    width: 55%;
    margin-bottom: 1rem !important;
  }
  .about-introduction-content p,
  .about-seminar-content p,
  .about-impact-content p,
  .about-organizational-content p,
  .about-personal-content p,
  .about-attendance-content p {
    align-items: baseline !important;
    margin-bottom: 0.4rem !important;
  }
  .course-details-inner
    .about-inner
    .about-introduction
    .about-introduction-content,
  .course-details-inner
    .about-inner
    .about-Seminar-Objectives
    .about-seminar-content,
  .course-details-inner
    .about-inner
    .about-training-methodology
    .about-training-content,
  .course-details-inner
    .about-inner
    .about-organisational-impact
    .about-organizational-content,
  .course-details-inner
    .about-inner
    .about-personal-impact
    .about-personal-content,
  .course-details-inner
    .about-inner
    .about-attendance
    .about-attendance-content {
    padding: 1rem 0rem;
  }
  .course-details-inner .content-inner h1 {
    font-size: 22px;
  }
  .content-day1-content p,
  .content-day2-content p,
  .content-day3-content p,
  .content-day4-content p,
  .content-day5-content p {
    align-items: baseline !important;
    margin-bottom: 0.4rem !important;
  }
  .course-details-inner .training-inner .logo-container img {
    width: 200px;
  }
  .course-details-inner .training-inner .training-border-top-left,
  .course-details-inner .training-inner .training-border-bottom-left,
  .course-details-inner .training-inner .training-border-top-right,
  .course-details-inner .training-inner .training-border-bottom-right {
    width: 25px;
  }
  .training-content .training-content-box h5,
  .training-content .training-content-last-box h5 {
    font-size: 18px;
  }
  .training-content {
    padding: 0;
  }
  .course-details-inner .training-inner .training-header h4 {
    font-size: 20px;
  }
}

/* --------------------------------------- related courses ---------------------------------------------- */

.related-courses {
  width: 90%;
  margin: 0 auto;
  padding: 7rem 0rem;
}
.related-courses .related-header {
  position: relative;
  padding: 1rem 0rem;
  font-size: 28px;
font-weight:600;
  border-bottom: 1px solid var(--Nuturals-N-2);
  direction:rtl;
}
.related-courses .related-header img {
  position: absolute;
  left: 100%;
  top: 50%;
  transform: translateY(-50%);
}

.main-filteration {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin-top: 2rem;
  flex-wrap: wrap;
  direction:rtl;
}

.main-filteration .main-filteration-left {
  width: 26%;
}

.main-filteration .main-filteration-left .courses-filter-paragraph {
  position: relative;
  background-color: var(--Nuturals-N-1);
  color: var(--Nuturals-White);
  text-align: center;
  padding: 0.9rem;
font-weight:600;
}

.main-filteration .main-filteration-left .courses-filter-paragraph img {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 8px;
}

.main-filteration .main-filteration-left .filteration-items {
  width: 100%;
  display: flex;
  flex-direction: column;
}

.filterByCity .toggler-arrow,
.other-filterations .filterByStatus .toggler-arrow,
.other-filterations .filterByAvailability .toggler-arrow {
  position: absolute;
  top: 20px;
  left: 1rem;
  transform: rotate(180deg);
}

.filter-by-city-header,
.filter-by-status-header,
.filter-by-availabiity-header {
  background-color: var(--Nuturals-N-1);
  color: var(--Nuturals-White);
  padding: 1rem;
  padding-left: 1rem;
font-weight:600;
}

.all-courses-search-checkbox {
  background-color: var(--Nuturals-N-6);
}

.all-courses-checkbox {
  position: relative;
  padding: 1rem;
}
.custom-checkbox {
  width: 20px;
  height: 20px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 1rem;
  cursor: pointer;
}

/* Hide the default checkbox */
.custom-checkbox input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

/* Style the custom checkbox appearance */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 20px;
  width: 20px;
  border: 1px solid #807070;
  background-color: transparent; /* Set default background color */
  /* border-radius: 3px; */
}
.custom-checkbox input:checked + .checkmark,
.checkmark:hover {
  background-color: #807070;
}
/* Show a checkmark when the checkbox is checked */
.custom-checkbox input:checked + .checkmark:after {
  content: "";
  position: absolute;
  display: block;
  left: 6px;
  top: 2px;
  width: 6px;
  height: 12px;
  border: solid var(--Nuturals-White);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.coursesNumber {
font-weight:700;
  color: var(--Nuturals-N-3);
}
.all-courses-paragraph {
  padding-left: 2rem;
font-weight:600;
  font-size: 14px;
}
.clear-courses,
.clear-durations {
  position: absolute;
  right: 1rem;
  color: #594e4e;
  top: 50%;
  transform: translateY(-50%);
  cursor: pointer;
  font-size: 14px;
}
.courses-filter-items {
  background-color: var(--Nuturals-N-6);
  margin-top: 2px;
  height: 500px;
  overflow: auto;
}
.courses-filter-items::-webkit-scrollbar {
  width: 6px;
  background-color: var(--Nuturals-N-6);
  border: 1px solid var(--NuturalsN-5);
}
.courses-filter-items::-webkit-scrollbar-thumb {
  background-color: var(--Secondary-Secondary);
  height: 90%;
}

.city-filter-item-container,
.status-filter-item-container,
.availability-filter-item-container {
  position: relative;
  padding: 1rem;
  padding-left: 3rem;
  text-transform: capitalize;
}

.status-filter-item-container span,
.availability-filter-item-container span {
  font-size: 14px;
  color: var(--Nuturals-N-3);
}

.all-durations-checkbox {
  position: relative;
  padding: 1rem;
  background-color: var(--Nuturals-N-6);
}
.all-durations-paragraph {
  padding-left: 2rem;
font-weight:600;
  font-size: 14px;
}
.duration-filter-items {
  background-color: var(--Nuturals-N-6);
  margin-top: 2px;
}
.filterByCity {
  position: relative;
  margin-top: 0.5rem;
}
.cities-filter-items {
  background-color: var(--Nuturals-N-6);
  margin-top: 2px;
  height: 450px;
  overflow: auto;
}
.cities-filter-items::-webkit-scrollbar {
  width: 6px;
  background-color: var(--Nuturals-N-6);
  border: 1px solid var(--NuturalsN-5);
}
.cities-filter-items::-webkit-scrollbar-thumb {
  background-color: var(--Secondary-Secondary);
  height: 90%;
}

.city-filter-item-container {
  position: relative;
  padding: 1rem;
  padding-left: 2.8rem;
  text-transform: capitalize;
}
.all-cities-search-checkbox {
  background-color: var(--Nuturals-N-6);
}
.all-cities-checkbox {
  position: relative;
  padding: 1rem;
}

.cities-filter-inner {
  position: relative;
}

.cities-filter-inner .cities-filter-input {
  position: relative;
  padding: 0.9rem;
  font-size: 0.8rem;
}

.cities-filter-inner .cities-filter-input input {
  width: 100%;
  outline: none;
  padding: 0.4rem;
  background-color: #fffefeb6;
  border: 1px solid var(--Nuturals-N-3);
}

.cities-filter-inner .cities-filter-input img {
  position: absolute;
  left: 0;
  height: 100%;
}
.all-cities-paragraph {
  padding-left: 2rem;
font-weight:600;
  font-size: 14px;
}

.clear-cities {
  position: absolute;
  right: 1rem;
  color: #594e4e;
  top: 50%;
  transform: translateY(-50%);
  cursor: pointer;
  font-size: 14px;
}
.filterByStatus {
  position: relative;
  margin-top: 0.5rem;
}

.status-filter-items {
  background-color: var(--Nuturals-N-6);
  margin-top: 2px;
}

.filterByAvailability {
  position: relative;
  margin-top: 0.5rem;
}

.availability-filter-items {
  background-color: var(--Nuturals-N-6);
  margin-top: 2px;
}

@media (width < 1025px) {
  .main-filteration .main-filteration-left {
    width: 100%;
    margin-bottom: 2rem;
  }
  .filteration-items {
    flex-direction: row !important;
    justify-content: space-between;
  }
  .main-filteration {
    justify-content: center;
  }

  .other-filterations {
    width: 46%;
    margin-top: 0 !important;
  }

  .checkmark,
  .checkmark:hover {
    background-color: transparent;
  }
  .cities-filter-items {
    height: 500px;
  }
  .city-filter {
    width: 46%;
  }
}
@media (width<768px) {
  .filteration-items {
    flex-direction: column !important;
    justify-content: center;
  }

  .other-filterations {
    width: 100%;
    margin-top: 0.5rem !important;
  }
}

.main-filteration .main-filteration-right {
  width: 70%;
}

.filteration-boxes-container {
  border-top: 1px solid var(--Nuturals-N-4);
  border-bottom: 1px solid var(--Nuturals-N-4);
  padding: 3px 0px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 0.4rem;
}
.filteration-boxes-container .filteration-box {
  border: 1px solid var(--NuturalsN-5);
  padding: 5px;
  cursor: pointer;
}
.filteration-boxes-container .filteration-box .filteration-box-span {
  color: var(--Nuturals-N-4);
}

.filteration-result-container {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  padding: 2.5rem 0rem;
  width: 100%;
  position: relative;
  align-self: center;
  border-bottom: 1px solid var(--Nuturals-N-4);
}
.filteration-result-number {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 5rem;
  align-self: center;
  justify-self: center;
}
.filteration-result-number p {
  width: fit-content;
  border: 1px solid var(--NuturalsN-5);
font-weight:700;
  padding: 0.4rem;
}
.filteration-result-number img {
  height: 100%;
  margin-left: 2px;
  cursor: pointer;
}
.filteration-result-container button {
  outline: none;
  border: 1px solid var(--Nuturals-N-4);
  background-color: var(--Nuturals-N-7);
  padding: 0.5rem;
  font-size: 1rem;
}

.filteration-result-container button img {
  margin-right: 10px;
}

/* records */
.rocords-courses-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.rocords-courses-container .records-header-nav {
  background-color: var(--Nuturals-N-3);
  display: grid;
  grid-template-columns: 38% 20% 19% 10% 10%;
  color: var(--Nuturals-White);
  text-align: center;
  height: 56px;
  align-items: center;
  padding: 0rem 1rem;
}
.rocords-courses-container .records-header-nav p {
  display: flex;
  justify-content: center;
  align-items: center;
}
.rocords-courses-container .records-courses-items {
  overflow-y: auto;
  height: 1200px;
  border-bottom: 1px solid var(--Nuturals-N-3);
  padding-right: 10px;
}
.rocords-courses-container .records-courses-items::-webkit-scrollbar {
  width: 6px;
  background-color: var(--Nuturals-N-6);
  border: 1px solid var(--NuturalsN-5);
}
.rocords-courses-container .records-courses-items::-webkit-scrollbar-thumb {
  background-color: var(--Secondary-Secondary);
  height: 90%;
}

.rocords-courses-container .records-header-nav p:first-child {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.rocords-courses-container .records-courses-item {
  display: grid;
  grid-template-columns: 37% 38% 1fr 1fr;
  border: 1px solid var(--Nuturals-N-4);
  margin: 0.7rem 0rem;
}

.rocords-courses-container .records-courses-item .record-item-status {
  display: grid;
  grid-template-columns: 60% 40%;
  padding: 0.9rem 0rem;
}
.date-container {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  padding: 0rem 2rem;
}
.date-container .left-slipter {
  position: absolute;
  left: 0;
}
.date-container .right-slipter {
  position: absolute;
  right: 0;
}
.rocords-courses-container .records-courses-item .course-name-item {
  display: flex;
  align-items: center;
font-weight:600;
  padding-right: 1rem;
}
.rocords-courses-container .records-courses-item:hover {
  background-color: var(--Nuturals-N-6);
}

.rocords-courses-container .records-courses-item .record-item-status p {
  line-height: 20px;
  text-align: center;
  font-size: 14px;
}
.classroom-item {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.classroom-item img {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}
.record-course-price {
  color: var(--Primary-Primary);
  font-size: 14px;
  display: flex;
  justify-content: center;
  align-items: center;
font-weight:600;
  position: relative;
}
.record-course-price img {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}
.records-courses-item .view-button {
  display: flex;
  align-items: center;
  justify-content: center;
}
.view-button button {
  height: 55%;
  width: 75%;
  border: 1px solid var(--NuturalsN-5);
  outline: none;
  background-color: white;
  position: relative;
  padding-bottom 7px
}
.view-button button img {
  position: absolute;
  left: 8px;
  top: 46%;
  transform: rotate(180deg)
}
.rocords-courses-container .records-courses-item:hover button {
  background-color: var(--Nuturals-N-3);
  border-color: var(--Nuturals-N-3);
  color: white;
  transition: 0.2s;
}
.pdf-download a {
  color: var(--Nuturals-N-1);
  width: 100%;
  height: 100%;
}
.pdf-download:hover {
  background-color: ghostwhite;
}
.pdf-download a:hover {
  color: var(--Nuturals-N-1);
}
@media (max-width: 1024px) {
  .rocords-courses-container .records-header-nav {
    grid-template-columns: 38% 25% 20% auto;
  }
  .rocords-courses-container .records-courses-item {
    grid-template-columns: 37% 46% 1fr;
  }
  .records-courses-item .view-button {
    display: none !important;
  }
  .record-course-price img {
    display: none;
  }
  .empty-p {
    display: none !important;
  }
  .main-filteration .main-filteration-right {
    width: 100%;
  }
  .rocords-courses-container .records-courses-items {
    height: 1000px;
  }
}
@media (max-width:767px) {
  .records-courses-items {
    padding: 0.6rem 0.7rem;
    border-left: 1px solid var(--Nuturals-N-4);
    border-bottom: 1px solid var(--Nuturals-N-4);
  }
  .rocords-courses-container .records-header-nav {
    display: none;
  }
  .rocords-courses-container .records-courses-item {
    display: flex !important;
    flex-wrap: wrap;
    flex-direction: column;
    padding: 0.5rem;
  }
  .rocords-courses-container .records-courses-item:hover {
    background-color: white;
  }
  .course-name-item {
    width: 100%;
    justify-content: center;
    padding: 1rem;
  }
  .rocords-courses-container .records-courses-item .record-item-status {
    display: flex !important;
    border-top: 1px solid var(--Nuturals-N-4);
    border-bottom: 1px solid var(--Nuturals-N-4);
    justify-content: space-between;
    padding: 0;
  }
  .classroom-item {
    width: 50%;
  }
  .city-filter {
    width: 100% !important;
  }
  .date-container {
    width: 50%;
    padding: 0.3rem 1rem;
  }
  .record-course-price {
    padding: 1rem;
  }
  .date-container .left-slipter {
    display: none;
  }
  .classroom-item img {
    display: none;
  }
  .filteration-result-container {
    flex-direction: column;
    justify-content: center;
    gap: 1rem;
  }
  .filteration-result-number {
    margin-right: 0 !important;
    order: 1;
  }
  .filteration-result-container button {
    width: 100%;
  }
  .related-courses .related-header {
    font-size: 20px;
  }
  .related-courses .related-header img {
    top: 35%;
  }
}

/* swiper */
.cards-courses-container {
  width: 90%;
  margin: 0 auto;
  padding: 7rem 0rem 8rem;
}
.cards-courses-container .related-header {
  position: relative;
  padding: 1rem 0rem;
  font-size: 28px;
font-weight:600;
  border-bottom: 1px solid var(--Nuturals-N-2);
  direction:rtl;
}
.cards-courses-container .related-header img {
  position: absolute;
  left: 100%;
  top: 50%;
  transform: translateY(-50%);
}
.swiper-container1 {
  overflow: hidden !important;
  margin: auto;
  position: relative !important;
  width: 100%;
  margin:2rem auto;
  padding: 1rem 0rem;
  /* display: none; */
}
.swiper-wrapper {
  flex-direction: row !important;
}
.swiper-slide {
  margin-top: 0px !important;
  margin-bottom: 2rem;
}
.coming-training-card {
  padding: 0;
  border-radius: 2px;
  min-height: 23rem;
  border-bottom: 4px solid var(--Nuturals-N-3);
  background: var(--Nuturals-N-7);
  font-size: 0.875rem;
  transition: 500ms;
}
.coming-training-card:hover {
  background: var(--Nuturals-N-6);
}
.coming-training-card-header,
.coming-training-card-img {
  width: 100%;
}
.coming-training-card-content {
  text-align: center;
  direction:rtl;
}
.coming-training-card-content .card-paragraph {
font-weight:600;
  line-height: 1.313rem;
  color: var(--Nuturals-N-3);
  padding: 0.625rem 0.875rem;
}
.card-date-container,
.card-details-container {
font-weight:500;
  display: flex;
  padding: 0 1.25rem;
  align-items: center;
  justify-content: center;
  gap: 0.575rem;
}
.card-date-container img {
  width: 2.8rem !important;
  height: 1rem;
}
.card-date-container p {
  margin: 0;
}
.card-details-container {
  padding: 1.125rem 0 0.813rem;
}
.card-date-container img {
  width: 46px !important;
  height: 16px !important;
}
.card-details-city {
  border-left: 1px solid #ddd9d9;
  border-right: 1px solid #ddd9d9;
  padding: 0 0.625rem;
}
.card-details-container :nth-child(3) {
font-weight:700;
  font-size: 1rem;
}
.coming-training-card-footer {
  background-color: var(--Nuturals-N-3);
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  padding: 0.8rem 0rem;
  transition: 500ms;
  margin-bottom: 0.313rem;
  position: relative;
  cursor: pointer;
}
.view-course-box {
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--Nuturals-White);
}
.view-course-box p {
  margin: 0;
}
.coming-training-card-footer .right-arrow {
  /* margin-left: 1rem; */
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: baseline;
  position: absolute;
  right: 10px;
  top: 30%;
}

.coming-training-card:hover .coming-training-card-footer {
  opacity: 1;
}
.coming-training-card:hover .coming-training-card-content .card-paragraph {
font-weight:600;
}

.swiper .swiper-pagination1 {
  position: static !important;
  margin-top: 2rem;
  display: flex;
  justify-content: center;
  align-items: center;
}
.swiper .swiper-pagination1 span {
  width: 40px !important;
  height: 8px;
  border-radius: 0px !important;
  background-color: var(--Nuturals-N-1) !important;
}
.swiper-pagination-bullets .swiper-pagination-bullet:hover {
  background: var(--Nuturals-N-1) !important;
}
.swiper-pagination-bullet-active {
  background: var(--Nuturals-N-1) !important;
}
.swiper .swiper-button-prev {
  color: var(--Nuturals-N-6) !important;
  position: static !important;
  display: block;
  width: 40px;
  margin-right: 16rem;
  height: 32px;
  background-color: var(--Nuturals-N-1);
  border: none;
  border-radius: 2px;
}
.swiper .swiper-button-prev::after {
  font-size: 15px !important;
  font-weight: bolder !important;
}

.swiper .swiper-button-next {
  color: var(--Nuturals-N-6) !important;
  display: block;
  position: static !important;
  color: blue;
  width: 40px;
  height: 32px !important;
  background-color: var(--Nuturals-N-1);
  border: none;
  border-radius: 2px;
  height: 32px;
}
.swiper .swiper-button-next::after {
  font-size: 15px !important;
  font-weight: bolder !important;
}
.swiper-navigation {
  display: flex;
  justify-content: center;
  align-items: center;
}
@media (1024px < width<1200px) {
  .card-date-container,
  .card-details-container {
    gap: 0.1rem;
  }
  .card-details-container :nth-child(3) {
    font-size: 0.8rem;
  }
}
@media (width<1025px) {
  .filteration-section .main-filteration .main-filteration-right {
    width: 100% !important;
    margin-top: 4rem;
  }
  .coming-training-card {
    background: var(--Nuturals-N-6);
  }
  .coming-training-card-footer {
    opacity: 1;
  }
  .swiper-wrapper {
    flex-wrap: wrap;
  }
}
@media (width<768px) {
  .swiper-navigation {
    display: none !important;
  }
  .filteration-result-container {
    flex-direction: column;
    gap: 1rem;
    justify-content: center;
  }
  .filteration-result-container button {
    width: 100% !important;
    margin: auto;
    order: 0;
  }
  .filteration-result-number {
    order: 1;
    margin-right: 0 !important;
  }
  .cards-courses-container .related-header {
    font-size: 20px;
  }
  .cards-courses-container .related-header img {
    top: 35%;
  }
}

/* ------------------------------------------------- FOOTER ---------------------------------------------- */
.footer {
  background-image: url(https://eurodemy.net/ar/Assets/Footer\ Bg.png);
  margin-top: 4rem;
  min-height: 48rem;
  width: 100%;
  position: relative;
}
.footerLogos-container {
  width: 100%;
  overflow: hidden;
}
.footer img {
  pointer-events: none;
}
.footer-absolute-logo-container {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  min-width: 51%;
  /* width: 100%; */
}
.footer-absolute-logo {
  position: absolute;
  transform: translateX(-50%);
  left: 50%;
  top: -1rem;
}
.footer-contents-container {
  display: flex;
  flex-direction: column;
  padding: 4rem 0 0;
}
.footer-separator {
  position: absolute;
  top: 64%;
  left: 0;
  z-index: 99;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.leftSide-footer,
.rightSide-footer {
  display: flex;
  justify-content: space-between;
}
.leftSide-footer {
  padding: 0 3rem;
}
.rightSide-footer {
  margin: 2rem 0 1rem;
  padding-left: 4rem;
}
.more-details-container {
  width: 31%;
  padding-left: 2rem;
}
.contact-info-container {
  width: 34%;
  padding-left: 2rem;
}
.main-pages-container {
  margin-bottom: 4.813rem;
  width: 30%;
}
.quick-access-container {
  width: 30%;
}
.footer-content-heading {
  width: 65%;
  display: flex;
  gap: 0.5rem;
  color: var(--Nuturals-N-7);
font-weight:600;
  margin-bottom: 2rem;
  font-size: 1.375rem;
  line-height: 1.875rem;
  border-bottom: 1px solid var(--Nuturals-N-7);
}
.footer-content-list {
  color: var(--Nuturals-N-6);
  display: grid;
  grid-template-columns: 1fr;
  list-style-type: none;
  padding: 0;
  margin: 0;
}
.footer-content-list-item {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
}
.footer-content-list-item:not(:last-of-type) {
  margin-bottom: 2rem;
}
.footer-form-container {
  background-color: var(--Nuturals-N-6);
  border-radius: 5rem 5rem 0px 0px;
  min-height: 31.75rem;
  max-width: 30.5rem;

  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
}
.footer-form-header {
  color: var(--Nuturals-N-1);
  text-align: center;
font-weight:600;
  font-size: 2rem;
  line-height: 2.25rem;
  padding: 2rem 0 0.75rem;
}
.footer-form-secondary-header {
  padding-bottom: 2rem;
  color: var(--Nuturals-N-1);
  text-align: center;
  font-size: 1.125rem;
}
.footer-form-socialIcon {
  display: flex;
  width: 90%;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 0.6rem;
  border-radius: 1px;
  border: 2px dashed var(--Nuturals-N-1);
  padding: 0.3rem;
  margin-bottom: 2.125rem;
}
@media (min-width:768px)and (max-width:1024px){
   .footer-form-socialIcon{
       gap:2rem
   } 
}
.footer-form-socialIcon > img {
  display: block;
}
.envelope-icon-container {
  padding: 2rem 0 0.625rem;
}
.assurance-message-form-txt {
  color: var(--Nuturals-N-1);
  text-align: center;
  font-size: 1.125rem;
  line-height: 1.5rem;
  padding-bottom: 1.5rem;
  max-width: 60%;
}
.footer-form-input-container {
  border-radius: 1px;
  border: 0.5px solid var(--Nuturals-N-1, #140000);
  background-color: var(--Nuturals-N-7);
  position: relative;
  width: 90%;
  margin-bottom: 1rem;
}
.footer-formInput {
  padding: 0.813rem 5.5rem 0.813rem 0.875rem;
  border: none;
  width: 100%;
}
.footer-formInput::placeholder {
  color: var(--Nuturals-N-4);
  font-size: 1rem;
}
.footer-form-gmail-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0.25rem;
  border: none;
  border-radius: 1px;
  background: var(--Ternary-Ternary);
  color: var(--Nuturals-White);
  padding: 0.625rem 1.094rem;
}
.successfullySentTxt {
  padding-bottom: 0.813rem;
  color: var(--Success-Success---Primary);
font-weight:700;
  font-size: 1.125rem;
  opacity: 0;
}
.footer-copyright {
  background: linear-gradient(90deg, #670709 0%, #62520f 224.57%);
  color: var(--Nuturals-White);
  text-align: center;
font-weight:600;
  font-size: 1rem;
  line-height: 1.5rem;
  padding: 1rem;
}
@media (max-width:1300px) {
  .footer-separator {
    top: 66%;
  }
}
@media (1024px< width <1125px) {
  .footer-content-list {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media screen and (max-width: 1125px) {
  .footer-contents-container .leftSide-footer,
  .footer-contents-container .rightSide-footer {
    flex-direction: column;
  }
  .footer {
    padding-top: 4rem;
    padding-bottom: 500px;
  }
  .footer-separator {
    display: none;
  }
  .leftSide-footer {
    padding-top: 8rem;
  }
  .main-pages-container,
  .quick-access-container,
  .more-details-container,
  .contact-info-container {
    width: 99%;
    margin-top: 2rem;
    margin-bottom: 2rem;
  }
  .more-details-container {
    padding-left: 0;
  }
  .rightSide-footer {
    padding: 0rem 3rem;
    gap: 1rem;
  }
  .contact-info-container {
    padding-left: 0;
  }
  .footer-form-container {
    width: 70%;
  }
}
@media (769px < width <1025px) {
  .footer-form-container {
    width: 80%;
    max-width: none;
  }
  .footer-form-socialIcon {
    gap: 1.5rem;
    width: 60%;
  }
  .footer-absolute-logo {
    width: 170px;
    height: 170px;
  }
  .more-details-container {
    padding-left: 0;
  }
}
@media (500px < width <768px) {
  .footer-content-list {
    grid-template-columns: repeat(1, 1fr);
  }
  .footer-absolute-logo-container {
    width: 100%;
  }
  .footer-content-heading {
    width: 61%;
  }
  .footer-form-socialIcon {
    gap: 1rem;
    width: 90%;
  }
  .footer-absolute-logo {
    width: 170px;
    height: 135px;
  }
  .footer-content-list {
    grid-template-columns: repeat(1, 1fr);
  }
  .footer-form-container {
    width: 80%;
  }
  .rightSide-footer {
    padding-right: 1rem !important;
  }
}
@media (399px < width <501px) {
  .footer-form-socialIcon {
    gap: 0.8rem;
    width: 95%;
  }
  .leftSide-footer {
    padding: 0 1rem !important;
  }
  .rightSide-footer {
    padding-left: 1rem !important;
  }
  .footer-absolute-logo {
    width: 170px;
    height: 115px;
  }
  .footer-form-container {
    width: 80%;
  }
  .footer-absolute-logo-container {
    width: 100%;
  }
}
@media (width<400px) {
  .footer-form-container {
    width: 90%;
  }
  .footer-form-socialIcon {
    width: 95%;
    gap: 0.3rem;
  }
  .footer-absolute-logo {
    height: 95px;
  }
  .assurance-message-form-txt {
    max-width: 90%;
  }
  .footer-content-heading {
    width: 70%;
  }
  .more-details-container {
    padding-right: 0px;
  }
  .leftSide-footer {
    padding: 0 1rem !important;
  }
  .rightSide-footer {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
    padding-bottom: 3rem;
  }
  .footer {
    padding-bottom: 530px;
  }
  .footer-absolute-logo-container {
    width: 100%;
  }
}

* {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}
::placeholder {
  color: #807070;
}
:root {
  --Nuturals-N-1: #140000;
  --Nuturals-N-2: #262121;
  --Nuturals-N-3: #594e4e;
  --Nuturals-N-4: #807070;
  --Nuturals-N-5: #bfb6b6;
  --Nuturals-N-7: #fcfcfc;
  --Nuturals-N-6: #f2eded;
  --Nuturals-White: #fff;
  --Primary-Primary: #ad1519;
  --Ternary-Ternary: #140000;
  --NuturalsN-5: #bfb6b6;
  --secondary: #fee1e1;
  --Success-Success---Primary: #16ad38;
  --Secondary-Secondary: #fabd00;
  --nuturals-35: #575859;
  --Primary-Blue: #006dc4;
}
::-webkit-scrollbar {
  width: 12px;
  background-color: #fff;
  color: black;
}
::-webkit-scrollbar-thumb {
  background-color: var(--Primary-Primary);
  border-radius: 0;
  height: 80px;
}

#register_form {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  bottom: 0;
  overflow: auto;
  background-color: rgba(0, 0, 0, 0.904);
  padding: 1px;
  z-index:10000;
}
#register_form .form-container {
  width: 80%;
  margin: 80px auto;
  background-color: white;
  position: relative;
  padding-bottom: 1rem;
}
#register_form .form-container .exit-btn {
  position: absolute;
  top: 0;
  right: 0;
  cursor: pointer;
  z-index: 2000;
}
#register_form .form-container .form-group {
  position: relative;
}
#register_form .form-container .form-group .group-heading {
  position: absolute;
  background-color: var(--Nuturals-White);
  padding: 1rem 2rem;
  border: 1px solid var(--Nuturals-N-3);
  left: 50%;
  width: 250px;
  text-align: center;
  transform: translateX(-50%);
  top: -28px;
font-weight:600;
}
#register_form .form-container .form-group h2 {
  text-align: center;
  width: 75%;
  margin: auto;
font-weight:600;
  padding: 1rem;
  margin-bottom: 5rem;
  background-color: var(--Nuturals-N-7);
  border-bottom: 3px solid var(--Nuturals-N-4);
}
#register_form .form-container .form-group .form-inner {
  position: relative;
  padding: 4rem 5rem;
  width: 100%;
  margin: auto;
  border-top: 1px solid var(--Nuturals-N-3);
}
#register_form .form-container .form-group .form-inner .input-container {
  display: flex;
  align-items: center;
  width: 100%;
  height: 50px;
  margin-bottom: 2rem;
}
#register_form .form-container .form-group .form-inner .input-container .input-heading {
  width: 30%;
  border: 1px solid var(--Nuturals-N-4);
  display: flex;
  justify-content: flex-start;
  align-items: center;
  text-align: left;
  height: 100%;
  padding: 0rem 0.5rem 0rem 1rem;
font-weight:600;
  font-size: 14px;
}
#register_form .form-container .form-group .form-inner .input-container img {
  height: 100%;
}
#register_form .form-container .form-group .form-inner .input-container .input-box {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  position: relative;
}
#register_form .form-container .form-group .form-inner .input-container .input-box input {
    height: 100%;
    width: 100%;
    padding-right: 1rem;
    background-color: #f9f9f9;
    border: none;
    outline: none;
    border-left: 3px solid var(--Nuturals-N-4);
    direction: rtl;
    
}
#register_form .optional {
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 12px;
  color: #bfb6b6;
}
#register_form .form-container .form-group .form-inner .input-container .input-box select {
  height: 100%;
  width: 100%;
  border: none;
  outline: none;
  padding-left: 1rem;
  background-color: #f9f9f9;
  border-right: 3px solid var(--Nuturals-N-4);
}

#register_form .submit-container {
  width: 100%;
  margin-top: 15px;
  margin: 30px auto;
}
#register_form .submit-container .submit-container-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-direction: row;
  padding: 2rem;
}

#register_form .submit-container button {
  display: block;
  margin: 1rem auto;
  padding: 0.7rem 6rem;
  border-radius: 1px;
  border: none;
  outline: none;
  background-color: var(--Nuturals-N-3);
  color: var(--Nuturals-White);
  position: relative;
  padding: 1.5rem 5rem;
  width: 350px;
  background-image: url(./Assets/ButtonBG.svg);
  font-size: 18px;
  cursor: pointer;
}
#register_form .submit-container button span {
  z-index: 10;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
#register_form .submit-container button img {
  width: 300px;
  height: 100%;
}

#register_form .submit-container .left-side-submit {
  position: relative;
  padding-right: 1.7rem;
  /* display: flex; */
  width: 55%;
  margin-right: 1rem;
  color: var(--Nuturals-N-1);
}

#register_form .submit-container .left-side-submit .custom-checkbox {
  width: 20px;
  height: 20px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0;
  cursor: pointer;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
#register_form .submit-container a {
  color: #ad1519;
  text-decoration: underline;
}
/* Hide the default checkbox */
#register_form .submit-container .left-side-submit .custom-checkbox input {
  position: absolute;
  right: 50%;
  left: 0;
  transform: translateY(-50%);
  opacity: 0;
  cursor: pointer;
}

/* Style the custom checkbox appearance */
#register_form .submit-container .left-side-submit .checkmark {
  position: absolute;
  right: 0%;
  transform: translateY(-50%);
  top: 50%;
  height: 20px;
  width: 20px;
  background-color: var(--Nuturals-White);
  /* Set default background color */
  border-radius: 3px;
  border: 1px solid var(--Primary-Primary);
  display: flex;
}

/* Show a checkmark when the checkbox is checked */
#register_form .submit-container
  .left-side-submit
  .custom-checkbox
  input:checked
  + .checkmark:after {
  content: "";
  position: absolute;
  display: block;
  left: 29%;
  top: 4%;
  transform: translateX(-50%);
  width: 6px;
  height: 12px;
  border: solid var(--Primary-Primary);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

#register_form .submit-container .right-side-submit {
  position: relative;
  padding-right: 1.6rem;
  color: var(--Nuturals-N-1);
}

#register_form .submit-container .right-side-submit .custom-checkbox {
  width: 20px;
  height: 20px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0;
  cursor: pointer;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

/* Hide the default checkbox */
#register_form .submit-container .right-side-submit .custom-checkbox input {
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  opacity: 0;
  cursor: pointer;
}

/* Style the custom checkbox appearance */
#register_form .submit-container .right-side-submit .checkmark {
  position: absolute;
  right: 0%;
  transform: translateY(-50%);
  top: 50%;
  height: 20px;
  width: 20px;
  background-color: var(--Nuturals-White);
  /* Set default background color */
  border-radius: 3px;
  border: 1px solid var(--Primary-Primary);
  display: flex;
}

/* Show a checkmark when the checkbox is checked */
#register_form .submit-container
  .right-side-submit
  .custom-checkbox
  input:checked
  + .checkmark:after {
  content: "";
  position: absolute;
  display: block;
  left: 29%;
  top: 4%;
  transform: translateX(-50%);
  width: 6px;
  height: 12px;
  border: solid var(--Primary-Primary);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
@media (max-width: 1185px) {
  #register_form  .form-container {
    width: 90%;
  }
  #register_form .form-inner {
    padding: 4rem 2rem !important;
  }
  #register_form .input-heading {
    width: 40% !important;
  }
  #register_form .input-heading span {
    font-size: 14px;
    text-align: left;
  }
}
@media (max-width: 768px) {
  #register_form .input-heading {
    display: none !important;
  }
  #register_form .form-inner {
    padding: 4rem 2rem !important;
  }
  #register_form .form-container input {
    font-size: 70% !important;
  }
  #register_form .form-container {
    width: 90%;
    margin: 50px auto;
  }
  #register_form .submit-container .submit-container-inner {
    flex-direction: column;
    gap: 1.5rem;
  }
  #register_form .submit-container .left-side-submit,
  #register_form .submit-container .right-side-submit {
    width: 100%;
  }
  #register_form .submit-container .left-side-submit {
    margin-right: 0px;
  }
  #register_form .form-container .form-group .form-inner .input-container {
    height: 40px;
  }
}
@media (max-width: 420px) {
  #register_form .form-container {
    width: 90%;
  }
  #register_form  .form-container input {
    font-size: 60% !important;
    padding-left: 0.5rem !important;
  }
  #register_form .form-inner {
    padding: 4rem 1rem !important;
  }
  #register_form .optional {
    font-size: 10px;
    right: 10px;
  }
  #register_form .submit-container .left-side-submit,
  #register_form .submit-container .right-side-submit {
    font-size: 12px;
  }
  #register_form .submit-container button {
    width: 250px;
  }
  #register_form .submit-container .submit-container-inner {
    padding: 2rem 0.6rem;
  }
  #register_form .form-container .form-group h2 {
    width: 65%;
    font-size: 92%;
  }
  #register_form .form-container .form-group .group-heading {
    width: 210px;
    padding: 1rem;
  }
}

/*end register form*/

/*inquereies form*/

* {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}
::placeholder {
  color: #807070;
}
:root {
  --Nuturals-N-1: #140000;
  --Nuturals-N-2: #262121;
  --Nuturals-N-3: #594e4e;
  --Nuturals-N-4: #807070;
  --Nuturals-N-5: #bfb6b6;
  --Nuturals-N-7: #fcfcfc;
  --Nuturals-N-6: #f2eded;
  --Nuturals-White: #fff;
  --Primary-Primary: #ad1519;
  --Ternary-Ternary: #140000;
  --NuturalsN-5: #bfb6b6;
  --secondary: #fee1e1;
  --Success-Success---Primary: #16ad38;
  --Secondary-Secondary: #fabd00;
  --nuturals-35: #575859;
  --Primary-Blue: #006dc4;
}
::-webkit-scrollbar {
  width: 12px;
  background-color: #fff;
  color: black;
}
::-webkit-scrollbar-thumb {
  background-color: var(--Primary-Primary);
  border-radius: 0;
  height: 80px;
}

#Inquiry_Form {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  bottom: 0;
  overflow: auto;
  background-color: rgba(0, 0, 0, 0.904);
  padding: 1px;
  z-index:10000;
}
#Inquiry_Form .form-container {
  width: 80%;
  margin: 80px auto;
  background-color: white;
  position: relative;
  padding-bottom: 1rem;
}
#Inquiry_Form .form-container .exit-btn {
  position: absolute;
  top: 0;
  right: 0;
  cursor: pointer;
  z-index: 2000;
}
#Inquiry_Form .form-container .form-group {
  position: relative;
}
#Inquiry_Form .form-container .form-group .group-heading {
  position: absolute;
  background-color: var(--Nuturals-White);
  padding: 1rem 2rem;
  border: 1px solid var(--Nuturals-N-3);
  left: 50%;
  width: 250px;
  text-align: center;
  transform: translateX(-50%);
  top: -28px;
font-weight:600;
}
#Inquiry_Form .form-container .form-group h2 {
  text-align: center;
  width: 75%;
  margin: auto;
font-weight:600;
  padding: 1rem;
  margin-bottom: 5rem;
  background-color: var(--Nuturals-N-7);
  border-bottom: 3px solid var(--Nuturals-N-4);
}
#Inquiry_Form .form-container .form-group .form-text {
  width: 80%;
  margin: auto;
  text-align: center;
  color: #ad1519;
font-weight:500;
}
#Inquiry_Form .form-container .form-group .form-inner {
  position: relative;
  padding: 4rem 5rem 2rem;
  width: 100%;
  margin: auto;
  border-bottom: 1px solid var(--Nuturals-N-4);
  margin-bottom: 2rem;
}
#Inquiry_Form .form-container .form-group .text-area {
  width: 100%;
  padding: 2rem 5rem 4rem;
  border-bottom: 1px solid var(--Nuturals-N-4);
}
#Inquiry_Form .form-container .form-group .text-area textarea{
    max-height: 180px;
    min-height: 150px;
    width: 100%;
    resize: vertical;
    outline: none;
    border: none;
    border-left: 3px solid var(--Nuturals-N-3);
    border-right: 3px solid var(--Nuturals-N-3);
    padding: 1rem;
    background-color: #f9f9f9;
}
#Inquiry_Form .form-container .form-group .form-inner .input-container {
  display: flex;
  align-items: center;
  width: 100%;
  height: 50px;
  margin-bottom: 2rem;
}
#Inquiry_Form .form-container .form-group .form-inner .input-container .input-heading {
  width: 30%;
  border: 1px solid var(--Nuturals-N-4);
  display: flex;
  justify-content: flex-start;
  align-items: center;
  text-align: left;
  height: 100%;
  padding: 0rem 0.5rem 0rem 1rem;
font-weight:600;
  font-size: 14px;
}
#Inquiry_Form .form-container .form-group .form-inner .input-container img {
  height: 100%;
}
#Inquiry_Form .form-container .form-group .form-inner .input-container .input-box {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  position: relative;
}
#Inquiry_Form .form-container .form-group .form-inner .input-container .input-box input {
  height: 100%;
  width: 100%;
  padding-left: 1rem;
  background-color: #f9f9f9;
  border: none;
  outline: none;
  border-right: 3px solid var(--Nuturals-N-4);
}
#Inquiry_Form .optional {
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 12px;
  color: #bfb6b6;
}
#Inquiry_Form .form-container .form-group .form-inner .input-container .input-box select {
  height: 100%;
  width: 100%;
  border: none;
  outline: none;
  padding-left: 1rem;
  background-color: #f9f9f9;
  border-right: 3px solid var(--Nuturals-N-4);
}

#Inquiry_Form .submit-container {
  width: 100%;
  margin-top: 15px;
  margin: 30px auto;
}
#Inquiry_Form .submit-container .submit-container-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-direction: row;
  padding: 2rem;
}

#Inquiry_Form .submit-container button {
  display: block;
  margin: 1rem auto;
  padding: 0.7rem 6rem;
  border-radius: 1px;
  border: none;
  outline: none;
  background-color: var(--Nuturals-N-3);
  color: var(--Nuturals-White);
  position: relative;
  padding: 1.5rem 5rem;
  width: 350px;
  background-image: url(../RegisterationForm/Assets/ButtonBG.svg);
  font-size: 18px;
  cursor: pointer;
}
#Inquiry_Form .submit-container button span {
  z-index: 10;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
#Inquiry_Form .submit-container button img {
  width: 300px;
  height: 100%;
}

#Inquiry_Form .submit-container .left-side-submit {
  position: relative;
  padding-left: 1.7rem;
  /* display: flex; */
  width: 55%;
  margin-right: 1rem;
  color: var(--Nuturals-N-1);
}

#Inquiry_Form .submit-container .left-side-submit .custom-checkbox {
  width: 20px;
  height: 20px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  cursor: pointer;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
#Inquiry_Form .submit-container a {
  color: #ad1519;
  text-decoration: underline;
}
/* Hide the default checkbox */
#Inquiry_Form .submit-container .left-side-submit .custom-checkbox input {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  opacity: 0;
  cursor: pointer;
}

/* Style the custom checkbox appearance */
#Inquiry_Form .submit-container .left-side-submit .checkmark {
  position: absolute;
  left: 0%;
  transform: translateY(-50%);
  top: 50%;
  height: 20px;
  width: 20px;
  background-color: var(--Nuturals-White);
  /* Set default background color */
  border-radius: 3px;
  border: 1px solid var(--Primary-Primary);
  display: flex;
}

/* Show a checkmark when the checkbox is checked */
#Inquiry_Form.submit-container
  .left-side-submit
  .custom-checkbox
  input:checked
  + .checkmark:after {
  content: "";
  position: absolute;
  display: block;
  left: 29%;
  top: 4%;
  transform: translateX(-50%);
  width: 6px;
  height: 12px;
  border: solid var(--Primary-Primary);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

#Inquiry_Form .submit-container .right-side-submit {
  position: relative;
  padding-left: 1.6rem;
  color: var(--Nuturals-N-1);
}

#Inquiry_Form .submit-container .right-side-submit .custom-checkbox {
  width: 20px;
  height: 20px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  cursor: pointer;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

/* Hide the default checkbox */
#Inquiry_Form .submit-container .right-side-submit .custom-checkbox input {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);

  opacity: 0;
  cursor: pointer;
}

/* Style the custom checkbox appearance */
#Inquiry_Form .submit-container .right-side-submit .checkmark {
  position: absolute;
  left: 0%;
  transform: translateY(-50%);
  top: 50%;
  height: 20px;
  width: 20px;
  background-color: var(--Nuturals-White);
  /* Set default background color */
  border-radius: 3px;
  border: 1px solid var(--Primary-Primary);
  display: flex;
}

/* Show a checkmark when the checkbox is checked */
#Inquiry_Form .submit-container
  .right-side-submit
  .custom-checkbox
  input:checked
  + .checkmark:after {
  content: "";
  position: absolute;
  display: block;
  left: 29%;
  top: 4%;
  transform: translateX(-50%);
  width: 6px;
  height: 12px;
  border: solid var(--Primary-Primary);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
@media (max-width: 1185px) {
  #Inquiry_Form .form-container {
    width: 90%;
  }
  #Inquiry_Form .form-inner {
    padding: 4rem 2rem !important;
  }
  #Inquiry_Form .input-heading {
    width: 40% !important;
  }
  #Inquiry_Form .input-heading span {
    font-size: 14px;
    text-align: left;
  }
}
@media (max-width: 768px) {
  #Inquiry_Form .input-heading {
    display: none !important;
  }
  #Inquiry_Form .form-inner {
    padding: 4rem 2rem !important;
  }
  #Inquiry_Form .form-container input {
    font-size: 70% !important;
  }
  #Inquiry_Form .form-container {
    width: 90%;
    margin: 50px auto;
  }
  #Inquiry_Form .submit-container .submit-container-inner {
    flex-direction: column;
    gap: 1.5rem;
  }
  #Inquiry_Form .submit-container .left-side-submit,
  #Inquiry_Form .submit-container .right-side-submit {
    width: 100%;
  }
  #Inquiry_Form .submit-container .left-side-submit {
    margin-right: 0px;
  }
  #Inquiry_Form .form-container .form-group .form-inner .input-container {
    height: 40px;
  }
  #Inquiry_Form .form-container .form-group .text-area{
    padding: 2rem 1rem 5rem;
  }
}
@media (max-width: 420px) {
  #Inquiry_Form .form-container {
    width: 90%;
  }
  #Inquiry_Form .form-container input {
    font-size: 60% !important;
    padding-left: 0.5rem !important;
  }
  #Inquiry_Form  .form-inner {
    padding: 4rem 1rem !important;
  }
  #Inquiry_Form .optional {
    font-size: 10px;
    right: 10px;
  }
  #Inquiry_Form .submit-container .left-side-submit,
  #Inquiry_Form .submit-container .right-side-submit {
    font-size: 12px;
  }
  #Inquiry_Form  .submit-container button {
    width: 250px;
  }
  #Inquiry_Form .submit-container .submit-container-inner {
    padding: 2rem 0.6rem;
  }
  #Inquiry_Form .form-container .form-group h2 {
    width: 65%;
    font-size: 92%;
  }
  #Inquiry_Form .form-container .form-group .group-heading {
    width: 210px;
    padding: 1rem;
  }
}

/*end enqueris form*/
/*house form*/
  * {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
  }
  ::placeholder {
    color: #807070;
  }
  :root {
    --Nuturals-N-1: #140000;
    --Nuturals-N-2: #262121;
    --Nuturals-N-3: #594e4e;
    --Nuturals-N-4: #807070;
    --Nuturals-N-5: #bfb6b6;
    --Nuturals-N-7: #fcfcfc;
    --Nuturals-N-6: #f2eded;
    --Nuturals-White: #fff;
    --Primary-Primary: #ad1519;
    --Ternary-Ternary: #140000;
    --NuturalsN-5: #bfb6b6;
    --secondary: #fee1e1;
    --Success-Success---Primary: #16ad38;
    --Secondary-Secondary: #fabd00;
    --nuturals-35: #575859;
    --Primary-Blue: #006dc4;
  }
  ::-webkit-scrollbar-thumb {
    background-color: var(--Primary-Primary);
    border-radius: 0;
    height: 80px;
  }
  
  #tailored {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    bottom: 0;
    overflow: auto;
    background-color: rgba(0, 0, 0, 0.904);
    padding: 1px;
    z-index:10000;
  }
  #tailored .form-container {
    width: 80%;
    margin: 80px auto;
    background-color: white;
    position: relative;
    padding-bottom: 1rem;
  }
 #tailored .form-container .exit-btn {
    position: absolute;
    top: 0;
    right: 0;
    cursor: pointer;
    z-index: 2000;
  }
  #tailored .form-container .form-group {
    position: relative;
  }
  #tailored  .form-container .form-group .group-heading {
    position: absolute;
    background-color: var(--Nuturals-White);
    padding: 1rem 2rem;
    border: 1px solid var(--Nuturals-N-3);
    left: 50%;
    width: 250px;
    text-align: center;
    transform: translateX(-50%);
    top: -28px;
font-weight:600;
  }
  #tailored .form-container .form-group h2 {
    text-align: center;
    width: 75%;
    margin: auto;
font-weight:600;
    padding: 1rem;
    margin-bottom: 5rem;
    background-color: var(--Nuturals-N-7);
    border-bottom: 3px solid var(--Nuturals-N-4);
  }
  #tailored  .form-container .form-group .form-text {
    width: 80%;
    margin: auto;
    text-align: center;
    color: #ad1519;
font-weight:500;
  }
  #tailored .form-container .form-group .form-inner {
    position: relative;
    padding: 4rem 5rem 2rem;
    width: 100%;
    margin: auto;
    border-bottom: 1px solid var(--Nuturals-N-4);
    margin-bottom: 2rem;
  }
  #tailored  .form-container .form-group .text-area {
    width: 100%;
    padding: 2rem 5rem 4rem;
    border-bottom: 1px solid var(--Nuturals-N-4);
  }
  #tailored .form-container .form-group .text-area textarea{
      max-height: 180px;
      min-height: 150px;
      width: 100%;
      outline: none;
      border: none;
      border-left: 3px solid var(--Nuturals-N-3);
      border-right: 3px solid var(--Nuturals-N-3);
      padding: 1rem;
      background-color: #f9f9f9;
      resize: vertical;
  }
  #tailored .form-container .form-group .form-inner .input-container {
    display: flex;
    align-items: center;
    width: 100%;
    height: 50px;
    margin-bottom: 2rem;
  }
  #tailored .form-container .form-group .form-inner .input-container .input-heading {
    width: 30%;
    border: 1px solid var(--Nuturals-N-4);
    display: flex;
    justify-content: flex-start;
    align-items: center;
    text-align: left;
    height: 100%;
    padding: 0rem 0.5rem 0rem 1rem;
font-weight:600;
    font-size: 14px;
  }
  #tailored  .form-container .form-group .form-inner .input-container img {
    height: 100%;
  }
  #tailored .form-container .form-group .form-inner .input-container .input-box {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    position: relative;
  }
  #tailored .form-container .form-group .form-inner .input-container .input-box input {
    height: 100%;
    width: 100%;
    padding-left: 1rem;
    background-color: #f9f9f9;
    border: none;
    outline: none;
    border-right: 3px solid var(--Nuturals-N-4);
  }
  #tailored  .optional {
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 12px;
    color: #bfb6b6;
  }
  #tailored  .form-container .form-group .form-inner .input-container .input-box select {
    height: 100%;
    width: 100%;
    border: none;
    outline: none;
    padding-left: 1rem;
    background-color: #f9f9f9;
    border-right: 3px solid var(--Nuturals-N-4);
  }
  
  #tailored .submit-container {
    width: 100%;
    margin-top: 15px;
    margin: 30px auto;
  }
  #tailored  .submit-container .submit-container-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: row;
    padding: 2rem;
  }
  
  #tailored .submit-container button {
    display: block;
    margin: 1rem auto;
    padding: 0.7rem 6rem;
    border-radius: 1px;
    border: none;
    outline: none;
    background-color: var(--Nuturals-N-3);
    color: var(--Nuturals-White);
    position: relative;
    padding: 1.5rem 5rem;
    width: 350px;
    background-image: url(../RegisterationForm/Assets/ButtonBG.svg);
    font-size: 18px;
    cursor: pointer;
  }
  #tailored .submit-container button span {
    z-index: 10;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  #tailored  .submit-container button img {
    width: 300px;
    height: 100%;
  }
  
  #tailored .submit-container .left-side-submit {
    position: relative;
    padding-left: 1.7rem;
    /* display: flex; */
    width: 55%;
    margin-right: 1rem;
    color: var(--Nuturals-N-1);
  }
  
  #tailored .submit-container .left-side-submit .custom-checkbox {
    width: 20px;
    height: 20px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    cursor: pointer;
    display: flex;
    justify-content: flex-start;
    align-items: center;
  }
  #tailored .submit-container a {
    color: #ad1519;
    text-decoration: underline;
  }
  /* Hide the default checkbox */
  #tailored  .submit-container .left-side-submit .custom-checkbox input {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    opacity: 0;
    cursor: pointer;
  }
  
  /* Style the custom checkbox appearance */
  #tailored .submit-container .left-side-submit .checkmark {
    position: absolute;
    left: 0%;
    transform: translateY(-50%);
    top: 50%;
    height: 20px;
    width: 20px;
    background-color: var(--Nuturals-White);
    /* Set default background color */
    border-radius: 3px;
    border: 1px solid var(--Primary-Primary);
    display: flex;
  }
  
  /* Show a checkmark when the checkbox is checked */
  #tailored .submit-container
    .left-side-submit
    .custom-checkbox
    input:checked
    + .checkmark:after {
    content: "";
    position: absolute;
    display: block;
    left: 29%;
    top: 4%;
    transform: translateX(-50%);
    width: 6px;
    height: 12px;
    border: solid var(--Primary-Primary);
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
  }
  
  #tailored .submit-container .right-side-submit {
    position: relative;
    padding-left: 1.6rem;
    color: var(--Nuturals-N-1);
  }
  
  #tailored .submit-container .right-side-submit .custom-checkbox {
    width: 20px;
    height: 20px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    cursor: pointer;
    display: flex;
    justify-content: flex-start;
    align-items: center;
  }
  
  /* Hide the default checkbox */
  #tailored .submit-container .right-side-submit .custom-checkbox input {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
  
    opacity: 0;
    cursor: pointer;
  }
  
  /* Style the custom checkbox appearance */
  #tailored .submit-container .right-side-submit .checkmark {
    position: absolute;
    left: 0%;
    transform: translateY(-50%);
    top: 50%;
    height: 20px;
    width: 20px;
    background-color: var(--Nuturals-White);
    /* Set default background color */
    border-radius: 3px;
    border: 1px solid var(--Primary-Primary);
    display: flex;
  }
  
  /* Show a checkmark when the checkbox is checked */
  #tailored .submit-container
    .right-side-submit
    .custom-checkbox
    input:checked
    + .checkmark:after {
    content: "";
    position: absolute;
    display: block;
    left: 29%;
    top: 4%;
    transform: translateX(-50%);
    width: 6px;
    height: 12px;
    border: solid var(--Primary-Primary);
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
  }
  @media (max-width: 1185px) {
    #tailored .form-container {
      width: 90%;
    }
    #tailored .form-inner {
      padding: 4rem 2rem !important;
    }
    #tailored   .input-heading {
      width: 40% !important;
    }
    #tailored .input-heading span {
      font-size: 14px;
      text-align: left;
    }
  }
  @media (max-width: 768px) {
    #tailored  .input-heading {
      display: none !important;
    }
    #tailored   .form-inner {
      padding: 4rem 2rem !important;
    }
    #tailored .form-container input {
      font-size: 70% !important;
    }
    #tailored .form-container {
      width: 90%;
      margin: 50px auto;
    }
    #tailored .submit-container .submit-container-inner {
      flex-direction: column;
      gap: 1.5rem;
    }
    #tailored .submit-container .left-side-submit,
    #tailored .submit-container .right-side-submit {
      width: 100%;
    }
    #tailored  .submit-container .left-side-submit {
      margin-right: 0px;
    }
    #tailored .form-container .form-group .form-inner .input-container {
      height: 40px;
    }
    #tailored .form-container .form-group .text-area{
      padding: 2rem 1rem 5rem;
    }
  }
  @media (max-width: 420px) {
    #tailored  .form-container {
      width: 90%;
    }
    #tailored  .form-container input {
      font-size: 60% !important;
      padding-left: 0.5rem !important;
    }
    #tailored .form-inner {
      padding: 4rem 1rem !important;
    }
    #tailored  .optional {
      font-size: 10px;
      right: 10px;
    }
    #tailored .submit-container .left-side-submit,
    #tailored  .submit-container .right-side-submit {
      font-size: 12px;
    }
    #tailored .submit-container button {
      width: 250px;
    }
    #tailored .submit-container .submit-container-inner {
      padding: 2rem 0.6rem;
    }
    #tailored .form-container .form-group h2 {
      width: 65%;
      font-size: 92%;
    }
    #tailored .form-container .form-group .group-heading {
      width: 210px;
      padding: 1rem;
    }
  }
  
/*end house form*/
/*form brochoure*/

* {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}
::placeholder {
  color: #807070;
}
:root {
  --Nuturals-N-1: #140000;
  --Nuturals-N-2: #262121;
  --Nuturals-N-3: #594e4e;
  --Nuturals-N-4: #807070;
  --Nuturals-N-5: #bfb6b6;
  --Nuturals-N-7: #fcfcfc;
  --Nuturals-N-6: #f2eded;
  --Nuturals-White: #fff;
  --Primary-Primary: #ad1519;
  --Ternary-Ternary: #140000;
  --NuturalsN-5: #bfb6b6;
  --secondary: #fee1e1;
  --Success-Success---Primary: #16ad38;
  --Secondary-Secondary: #fabd00;
  --nuturals-35: #575859;
  --Primary-Blue: #006dc4;
}
::-webkit-scrollbar {
  width: 12px;
  background-color: #fff;
  color: black;
}
::-webkit-scrollbar-thumb {
  background-color: var(--Primary-Primary);
  border-radius: 0;
  height: 80px;
}
#Brochure {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  bottom: 0;
  overflow: auto;
  background-color: rgba(0, 0, 0, 0.904);
  padding: 1px;
  z-index:10000;
}

#Brochure .form-container {
  width: 70%;
  margin: 80px auto;
  background-color: white;
  position: relative;
  padding-bottom: 1rem;
}

#Brochure .form-container .exit-btn {
  position: absolute;
  top: 0;
  right: 0;
  cursor: pointer;
  z-index: 2000;
}

#Brochure .form-container .form-group {
  position: relative;
}

#Brochure .form-container .form-group h2 {
  text-align: center;
  width: 75%;
  margin: auto;
font-weight:600;
  padding: 1rem;
  margin-bottom: 5rem;
  background-color: var(--Nuturals-N-7);
  border-bottom: 3px solid var(--Nuturals-N-4);
}
#Brochure .form-container .form-group .group-heading {
  position: absolute;
  background-color: var(--Nuturals-White);
  padding: 1rem 2rem;
  border: 1px solid var(--Nuturals-N-3);
  left: 50%;
  width: 250px;
  text-align: center;
  transform: translateX(-50%);
  top: -28px;
font-weight:600;
}
#Brochure .form-container .form-group .form-text {
  width: 80%;
  margin: auto;
  text-align: center;
  color: #ad1519;
font-weight:500;
}
#Brochure .form-container .form-group .form-inner {
  position: relative;
  padding: 4rem 4rem 1rem;
  width: 100%;
  margin: auto;
  border-bottom: 1px solid var(--Nuturals-N-4);
}

#Brochure .form-container .form-group .form-inner .input-container {
  display: flex;
  align-items: center;
  width: 100%;
  height: 50px;
  margin-bottom: 2rem;
}
#Brochure .form-container .form-group .form-inner .input-container .input-heading {
  width: 35%;
  border: 1px solid var(--Nuturals-N-4);
  display: flex;
  justify-content: flex-start;
  align-items: center;
  text-align: left;
  height: 100%;
  padding: 0rem 0.5rem 0rem 1rem;
font-weight:600;
  font-size: 14px;
}
#Brochure .form-container .form-group .form-inner .input-container img {
  height: 100%;
}
#Brochure .form-container .form-group .form-inner .input-container .input-box {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  position: relative;
}
#Brochure .form-container .form-group .form-inner .input-container .input-box input {
  height: 100%;
  width: 100%;
  padding-left: 1rem;
  background-color: #f9f9f9;
  border: none;
  outline: none;
  border-right: 3px solid var(--Nuturals-N-4);
}
#Brochure .optional {
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 12px;
  color: #bfb6b6;
}
#Brochure .submit-container {
  width: 100%;
  margin-top: 15px;
  margin: 30px auto;
}
#Brochure .submit-container .submit-container-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-direction: row;
  padding: 2rem;
}

#Brochure .submit-container button {
  display: block;
  margin: 1rem auto;
  padding: 0.7rem 6rem;
  border-radius: 1px;
  border: none;
  outline: none;
  background-color: var(--Nuturals-N-3);
  color: var(--Nuturals-White);
  position: relative;
  padding: 1.5rem 5rem;
  width: 350px;
  background-image: url(../RegisterationForm/Assets/ButtonBG.svg);
  font-size: 18px;
  cursor: pointer;
}
#Brochure .submit-container button span {
  z-index: 10;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
#Brochure .submit-container button img {
  width: 300px;
  height: 100%;
}

#Brochure .submit-container .left-side-submit {
  position: relative;
  padding-left: 1.7rem;
  /* display: flex; */
  width: 55%;
  margin-right: 1rem;
  color: var(--Nuturals-N-1);
}

#Brochure .submit-container .left-side-submit .custom-checkbox {
  width: 20px;
  height: 20px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  cursor: pointer;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
#Brochure .submit-container a {
  color: #ad1519;
  text-decoration: underline;
}
/* Hide the default checkbox */
#Brochure .submit-container .left-side-submit .custom-checkbox input {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  opacity: 0;
  cursor: pointer;
}

/* Style the custom checkbox appearance */
#Brochure .submit-container .left-side-submit .checkmark {
  position: absolute;
  left: 0%;
  transform: translateY(-50%);
  top: 50%;
  height: 20px;
  width: 20px;
  background-color: var(--Nuturals-White);
  /* Set default background color */
  border-radius: 3px;
  border: 1px solid var(--Primary-Primary);
  display: flex;
}

/* Show a checkmark when the checkbox is checked */
#Brochure .submit-container
  .left-side-submit
  .custom-checkbox
  input:checked
  + .checkmark:after {
  content: "";
  position: absolute;
  display: block;
  left: 29%;
  top: 4%;
  transform: translateX(-50%);
  width: 6px;
  height: 12px;
  border: solid var(--Primary-Primary);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

#Brochure .submit-container .right-side-submit {
  position: relative;
  padding-left: 1.6rem;
  color: var(--Nuturals-N-1);
}

#Brochure .submit-container .right-side-submit .custom-checkbox {
  width: 20px;
  height: 20px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  cursor: pointer;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

/* Hide the default checkbox */
#Brochure .submit-container .right-side-submit .custom-checkbox input {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  opacity: 0;
  cursor: pointer;
}

/* Style the custom checkbox appearance */
#Brochure .submit-container .right-side-submit .checkmark {
  position: absolute;
  left: 0%;
  transform: translateY(-50%);
  top: 50%;
  height: 20px;
  width: 20px;
  background-color: var(--Nuturals-White);
  /* Set default background color */
  border-radius: 3px;
  border: 1px solid var(--Primary-Primary);
  display: flex;
}

/* Show a checkmark when the checkbox is checked */
#Brochure .submit-container
  .right-side-submit
  .custom-checkbox
  input:checked
  + .checkmark:after {
  content: "";
  position: absolute;
  display: block;
  left: 29%;
  top: 4%;
  transform: translateX(-50%);
  width: 6px;
  height: 12px;
  border: solid var(--Primary-Primary);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
@media (max-width: 1185px) {
  #Brochure .form-container {
    width: 90%;
  }
  #Brochure .form-inner {
    padding: 4rem 2rem !important;
  }
  #Brochure .input-heading {
    width: 40% !important;
  }
  #Brochure .input-heading span {
    font-size: 14px;
    text-align: left;
  }
}
@media (max-width: 768px) {
  #Brochure .input-heading {
    display: none !important;
  }
  #Brochure  .form-inner {
    padding: 4rem 2rem !important;
  }
  #Brochure .form-container input {
    font-size: 70% !important;
  }
  #Brochure .form-container {
    width: 90%;
    margin: 50px auto;
  }
  #Brochure .submit-container .submit-container-inner {
    flex-direction: column;
    gap: 1.5rem;
  }
  #Brochure .submit-container .left-side-submit,
  #Brochure .submit-container .right-side-submit {
    width: 100%;
  }
  #Brochure .submit-container .left-side-submit {
    margin-right: 0px;
  }
  #Brochure .form-container .form-group .form-inner .input-container {
    height: 40px;
  }
  #Brochure  .form-container .form-group h2 {
    font-size: 20px;
  }
}
@media (max-width: 420px) {
  #Brochure  .form-container {
    width: 90%;
  }
  #Brochure .form-container input {
    font-size: 60% !important;
    padding-left: 0.5rem !important;
  }
  #Brochure .form-inner {
    padding: 4rem 1rem !important;
  }
  #Brochure .optional {
    font-size: 10px;
    right: 10px;
  }
  #Brochure .submit-container .left-side-submit,
  #Brochure .submit-container .right-side-submit {
    font-size: 12px;
  }
  #Brochure .submit-container button {
    width: 250px;
  }
  #Brochure .submit-container .submit-container-inner {
    padding: 2rem 0.6rem;
  }
  #Brochure .form-container .form-group h2 {
    width: 65%;
    font-size: 92%;
  }
  #Brochure .form-container .form-group .group-heading {
    width: 210px;
    padding: 1rem;
  }
}

/*end form borchoure*/
/*call back*/

  * {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
  }
  ::placeholder {
    color: #807070;
  }
  :root {
    --Nuturals-N-1: #140000;
    --Nuturals-N-2: #262121;
    --Nuturals-N-3: #594e4e;
    --Nuturals-N-4: #807070;
    --Nuturals-N-5: #bfb6b6;
    --Nuturals-N-7: #fcfcfc;
    --Nuturals-N-6: #f2eded;
    --Nuturals-White: #fff;
    --Primary-Primary: #ad1519;
    --Ternary-Ternary: #140000;
    --NuturalsN-5: #bfb6b6;
    --secondary: #fee1e1;
    --Success-Success---Primary: #16ad38;
    --Secondary-Secondary: #fabd00;
    --nuturals-35: #575859;
    --Primary-Blue: #006dc4;
  }
  ::-webkit-scrollbar {
    width: 12px;
    background-color: #fff;
    color: black;
  }
  ::-webkit-scrollbar-thumb {
    background-color: var(--Primary-Primary);
    border-radius: 0;
    height: 80px;
  }
  #contact_back {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    bottom: 0;
    overflow: auto;
    background-color: rgba(0, 0, 0, 0.904);
    padding: 1px;
    z-index :10000;
  }
  
  #contact_back .form-container {
    width: 70%;
    margin: 80px auto;
    background-color: white;
    position: relative;
    padding-bottom: 1rem;
  }
  
  #contact_back  .form-container .exit-btn {
    position: absolute;
    top: 0;
    right: 0;
    cursor: pointer;
    z-index: 2000;
  }
  
  #contact_back  .form-container .form-group {
    position: relative;
  }
  
  #contact_back   .form-container .form-group h2 {
    text-align: center;
    width: 75%;
    margin: auto;
font-weight:600;
    padding: 1rem;
    margin-bottom: 5rem;
    background-color: var(--Nuturals-N-7);
    border-bottom: 3px solid var(--Nuturals-N-4);
  }
  #contact_back  .form-container .form-group .group-heading {
    position: absolute;
    background-color: var(--Nuturals-White);
    padding: 1rem 2rem;
    border: 1px solid var(--Nuturals-N-3);
    left: 50%;
    width: 250px;
    text-align: center;
    transform: translateX(-50%);
    top: -28px;
font-weight:600;
  }
  #contact_back  .form-container .form-group .form-text {
    width: 80%;
    margin: auto;
    text-align: center;
    color: #ad1519;
   font-weight:500;
  }
  #contact_back  .form-container .form-group .form-inner {
    position: relative;
    padding: 4rem 4rem 1rem;
    width: 100%;
    margin: auto;
    border-bottom: 1px solid var(--Nuturals-N-4);
  }
  
  #contact_back  .form-container .form-group .form-inner .input-container {
    display: flex;
    align-items: center;
    width: 100%;
    height: 50px;
    margin-bottom: 2rem;
  }
  #contact_back  .form-container .form-group .form-inner .input-container .input-heading {
    width: 35%;
    border: 1px solid var(--Nuturals-N-4);
    display: flex;
    justify-content: flex-start;
    align-items: center;
    text-align: left;
    height: 100%;
    padding: 0rem 0.5rem 0rem 1rem;
font-weight:600;
    font-size: 14px;
  }
  #contact_back .form-container .form-group .form-inner .input-container img {
    height: 100%;
  }
  #contact_back .form-container .form-group .form-inner .input-container .input-box {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    position: relative;
  }
  #contact_back .form-container .form-group .form-inner .input-container .input-box input {
    height: 100%;
    width: 100%;
    padding-left: 1rem;
    background-color: #f9f9f9;
    border: none;
    outline: none;
    border-right: 3px solid var(--Nuturals-N-4);
  }
  #contact_back .optional {
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 12px;
    color: #bfb6b6;
  }
  #contact_back .submit-container {
    width: 100%;
    margin-top: 15px;
    margin: 30px auto;
  }
  #contact_back .submit-container .submit-container-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: row;
    padding: 2rem;
  }
  
  #contact_back .submit-container button {
    display: block;
    margin: 1rem auto;
    padding: 0.7rem 6rem;
    border-radius: 1px;
    border: none;
    outline: none;
    background-color: var(--Nuturals-N-3);
    color: var(--Nuturals-White);
    position: relative;
    padding: 1.5rem 5rem;
    width: 350px;
    background-image: url(../RegisterationForm/Assets/ButtonBG.svg);
    font-size: 18px;
    cursor: pointer;
  }
  #contact_back .submit-container button span {
    z-index: 10;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  #contact_back  .submit-container button img {
    width: 300px;
    height: 100%;
  }
  
  #contact_back .submit-container .left-side-submit {
    position: relative;
    padding-left: 1.7rem;
    /* display: flex; */
    width: 55%;
    margin-right: 1rem;
    color: var(--Nuturals-N-1);
  }
  
  #contact_back .submit-container .left-side-submit .custom-checkbox {
    width: 20px;
    height: 20px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    cursor: pointer;
    display: flex;
    justify-content: flex-start;
    align-items: center;
  }
  #contact_back .submit-container a {
    color: #ad1519;
    text-decoration: underline;
  }
  /* Hide the default checkbox */
  #contact_back .submit-container .left-side-submit .custom-checkbox input {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    opacity: 0;
    cursor: pointer;
  }
  
  /* Style the custom checkbox appearance */
  #contact_back  .submit-container .left-side-submit .checkmark {
    position: absolute;
    left: 0%;
    transform: translateY(-50%);
    top: 50%;
    height: 20px;
    width: 20px;
    background-color: var(--Nuturals-White);
    /* Set default background color */
    border-radius: 3px;
    border: 1px solid var(--Primary-Primary);
    display: flex;
  }
  
  /* Show a checkmark when the checkbox is checked */
  #contact_back .submit-container
    .left-side-submit
    .custom-checkbox
    input:checked
    + .checkmark:after {
    content: "";
    position: absolute;
    display: block;
    left: 29%;
    top: 4%;
    transform: translateX(-50%);
    width: 6px;
    height: 12px;
    border: solid var(--Primary-Primary);
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
  }
  
  #contact_back .submit-container .right-side-submit {
    position: relative;
    padding-left: 1.6rem;
    color: var(--Nuturals-N-1);
  }
  
  #contact_back  .submit-container .right-side-submit .custom-checkbox {
    width: 20px;
    height: 20px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    cursor: pointer;
    display: flex;
    justify-content: flex-start;
    align-items: center;
  }
  
  /* Hide the default checkbox */
  #contact_back .submit-container .right-side-submit .custom-checkbox input {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    opacity: 0;
    cursor: pointer;
  }
  
  /* Style the custom checkbox appearance */
  #contact_back .submit-container .right-side-submit .checkmark {
    position: absolute;
    left: 0%;
    transform: translateY(-50%);
    top: 50%;
    height: 20px;
    width: 20px;
    background-color: var(--Nuturals-White);
    /* Set default background color */
    border-radius: 3px;
    border: 1px solid var(--Primary-Primary);
    display: flex;
  }
  
  /* Show a checkmark when the checkbox is checked */
  #contact_back .submit-container
    .right-side-submit
    .custom-checkbox
    input:checked
    + .checkmark:after {
    content: "";
    position: absolute;
    display: block;
    left: 29%;
    top: 4%;
    transform: translateX(-50%);
    width: 6px;
    height: 12px;
    border: solid var(--Primary-Primary);
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
  }
  @media (max-width: 1185px) {
    #contact_back  .form-container {
      width: 90%;
    }
    #contact_back  .form-inner {
      padding: 4rem 2rem !important;
    }
    #contact_back  .input-heading {
      width: 40% !important;
    }
    #contact_back  .input-heading span {
      font-size: 14px;
      text-align: left;
    }
  }

  @media (max-width: 768px) {
    #contact_back .input-heading {
      display: none !important;
    }
    #contact_back .form-inner {
      padding: 4rem 2rem !important;
    }
    #contact_back  .form-container input {
      font-size: 70% !important;
    }
    #contact_back   .form-container {
      width: 90%;
      margin: 50px auto;
    }
    #contact_back .submit-container .submit-container-inner {
      flex-direction: column;
      gap: 1.5rem;
    }
    #contact_back .submit-container .left-side-submit,
    #contact_back .submit-container .right-side-submit {
      width: 100%;
    }
    #contact_back  .submit-container .left-side-submit {
      margin-right: 0px;
    }
    #contact_back .form-container .form-group .form-inner .input-container {
      height: 40px;
    }
    #contact_back  .form-container .form-group h2 {
        font-size: 20px;
      }
  }
  @media (max-width: 420px) {
    #contact_back .form-container {
      width: 90%;
    }
    #contact_back  .form-container input {
      font-size: 60% !important;
      padding-left: 0.5rem !important;
    }
    #contact_back  .form-inner {
      padding: 4rem 1rem !important;
    }
    #contact_back  .optional {
      font-size: 10px;
      right: 10px;
    }
    #contact_back   .submit-container .left-side-submit,
    #contact_back .submit-container .right-side-submit {
      font-size: 12px;
    }
    #contact_back .submit-container button {
      width: 250px;
    }
    #contact_back   .submit-container .submit-container-inner {
      padding: 2rem 0.6rem;
    }
    #contact_back  .form-container .form-group h2 {
      width: 65%;
      font-size: 92%;
    }
    #contact_back .form-container .form-group .group-heading {
      width: 210px;
      padding: 1rem;
    }
  }
  /* pop email */
        section.request
        {
            width: 100%;
    height: 100vh;
    flex-shrink: 0;
    background: rgba(0, 14, 26, 0.50);
    backdrop-filter: blur(17.5px);
    display: flex;
    justify-content: center;
    align-items: center;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 10000;
    transition: all;
    transition-duration: .2;
    margin:0 !important;

        }
        section.request .request_content
    {
            display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 20px;
    background: #fff;
    width: 80%;
    padding: 20px;
    border-radius: 4px;
    box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
        }
        section.request .request_content h3 
        {
            font-family: Roboto;
            line-height: 32px;
            font-size: 20px;
            font-weight: semibold;
            text-align: center;
        }
        section.request .request_content h3 span 
        {
            color:#006DC4
        }
        section.request .request_content h4

        {
            color :#3E3F40;
            font-size :16px;
            font-family: Roboto;
            line-height: 32px;
            text-align: center;


        }
        section.request .request_content .button 
        {
            width: 256px;
    height: 56px;
    background-color: #1FAF38;
    color: #FFFFFF;
    font-size: 22px;
    border-radius: 4px;
    text-align: center;
    font-family: Roboto;
    display: flex;
    align-items: center;
    justify-content: center;

        }
@media(max-width:750px)
{
                section.certificates .resuel-serti .details1 .left
            {
                    flex-direction: column;

            }
            section.certificates .resuel-serti .details1 .left .name, section.certificates .resuel-serti .details1 .left .code

            {
                    text-align: center;
                  border: none !important;
                  font-size :18px;

            }

            section.request
            {
                padding :5px !important;
            }
            section.request .request_content
            {
                width   :98%;
                margin:auto;
            }

}
.footer-content-list-item a 
{
        text-decoration: none;
    color: white;
}
/*end*/

/*end call back*/
.search-overlay-section {
  width: 100vw;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  overflow: auto;
  margin: 0;
  z-index: 1000;
  display: none;
  background: linear-gradient(
    115deg,
    rgba(20, 0, 0, 0.93) -4.15%,
    rgba(0, 0, 0, 0.93) 120%
  );
  backdrop-filter: blur(11px);
  direction: rtl;
}
.courseNameSearch {
  width: 100%;
}
.allSearchInputsContainer {
  display: flex;
  margin-top: 0.5rem;
  gap: 0.5rem;
}
.searchInputsLeftSide,
.searchInputsRightSide {
  width: 50%;
  display: flex;
  gap: 0.5rem;
}
.search-overlay-category-input {
  width: 55%;
}
.search-overlay-cities-input {
  width: 45%;
}
.search-overlay-duration-input,
.search-overlay-years-input,
.search-overlay-months-input {
  width: calc((100% - 0.5rem) / 3);
}
.search-overlay-section .search-overlay-close-btn {
  position: fixed;
  top: 1em;
  right: 2em;
  cursor: pointer;
}
.search-overlay-section .search-overlay-logo-image {
  position: fixed;
  top: 1rem;
  left: 2.5rem;
}
.search-overlay-section h2 {
  color: var(--Nuturals-White);
  text-align: center;
  margin: 50px auto;
}
.search-overlay-section .search-overlay-inner-container {
  width: 80%;
  position: fixed;
  left: 50%;
  top: 0%;
  transform: translateX(-50%);
  color: var(--Nuturals-White);
}
.search-overlay-section .search-overlay-inner-container input[type="text"]  {
  background-color: transparent;
  border-radius: 1px;
  border: 0.5px solid var(--Nuturals-N-5, #bfb6b6);
  height: 3rem;
  color: var(--Nuturals-White);
  outline: none;
  padding: 0rem 1rem 0rem 0.5rem;
  width: 100%;
}

.search-overlay-section .search-overlay-inner-container select {
  background-color: transparent;
  border-radius: 1px;
  border: 0.5px solid var(--Nuturals-N-5, #bfb6b6);
  height: 3rem;
  color: var(--Nuturals-White);
  outline: none;
  padding: 0rem 1rem 0rem 0.5rem;
  width: 100%;
}
.search-overlay-section .search-overlay-inner-container select option {
  color:black;
}

.search-overlay-abslute-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0.7rem;
  cursor: pointer;
}
.search-overlay-category-input,
.search-overlay-cities-input,
.search-overlay-duration-input,
.search-overlay-years-input,
.search-overlay-months-input {
  position: relative;
}
.search-overlay-abslute-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0.7rem;
  cursor: pointer;
}
.search-overlay-category-input,
.search-overlay-cities-input,
.search-overlay-duration-input,
.search-overlay-years-input,
.search-overlay-months-input {
  position: relative;
}
.search-overlay-section .search-overlay-dropdown {
  height: 300px;
  overflow: auto;
  overflow-x: hidden;
  display: none;
}
#search-course-dropdown-container {
  max-height: 23.5rem;
  width: 59%;
  margin: auto;
  overflow-y: scroll;
  z-index: 1000;
  position: relative;
  top: 2rem;
  /* border: 0.5px solid var(--Nuturals-N-4); */
}

.search-overlay-section .search-overlay-dropdown::-webkit-scrollbar-thumb,
#search-course-dropdown-container::-webkit-scrollbar-thumb,
.filteredResultWrapper::-webkit-scrollbar-thumb {
  background-color: var(--Secondary-Secondary);
  border-radius: 1px;
  border: var(--Nuturals-N-6);
  width: 10px;
}
.search-overlay-section .search-overlay-dropdown::-webkit-scrollbar,
#search-course-dropdown-container::-webkit-scrollbar,
.filteredResultWrapper::-webkit-scrollbar {
  width: 6px;
  border-radius: 1px;
  background-color: rgba(245, 227, 227, 0.2);
  border: 1px solid var(--Nuturals-N-6);
}
.search-overlay-section .search-overlay-dropdown::-webkit-scrollbar-track,
#search-course-dropdown-container::-webkit-scrollbar-track,
.filteredResultWrapper::-webkit-scrollbar-track {
  width: 10px;
}
.search-overlay-section .search-overlay-dropdown,
#search-course-dropdown-container,
.filteredResultWrapper {
  scrollbar-width: thin;
  scrollbar-color: var(--Secondary-Secondary) rgba(245, 227, 227, 0.2);
}

.search-overlay-dropdown-item {
  position: relative;
  background: rgba(245, 227, 227, 0.2);
  padding: 1rem;
  margin-bottom: 2px;
}
#search-course-dropdown-container .search-overlay-dropdown-item {
  background: var(--Nuturals-N-1);
  margin-bottom: 0;
  border-bottom: 0.25px solid var(--Nuturals-N-4);
}
.search-overlay-dropdown-item .custom-checkbox {
  width: 20px;
  height: 20px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 1.5rem;
  cursor: pointer;
}

/* Hide the default checkbox */
.custom-checkbox input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

/* Style the custom checkbox appearance */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 20px;
  width: 20px;
  background-color: #807070; /* Set default background color */
  border-radius: 3px;
}
.custom-checkbox input:checked + .checkmark,
.checkmark:hover {
  background-color: #fef3d1;
}
/* Show a checkmark when the checkbox is checked */
.custom-checkbox input:checked + .checkmark:after {
  content: "";
  position: absolute;
  display: block;
  left: 6px;
  top: 2px;
  width: 6px;
  height: 12px;
  border: solid var(--Secondary-Secondary);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

.search-overlay-section .search-button-overlay {
  width: 22%;
  padding: 8px 20px;
  margin: auto;
  background-color: var(--Nuturals-White);
  color: var(--Nuturals-N-1);
  text-align: center;
font-weight:600;
  font-size: 18px;
  cursor: pointer;
  margin-top: 1rem;
  visibility: hidden;
}
.search-overlay-section .search-button-overlay:hover {
  background-color: var(--Secondary-Secondary);
}
.search-overlay-section .search-button-overlay img {
  width: 20px;
  height: 20px;
}
.search-overlay-dropdown{
margin-top:0.5rem
}
@media (max-width: 1024px) {
  .allSearchInputsContainer {
    flex-direction: column;
  }
  .searchInputsLeftSide,
  .searchInputsRightSide {
    width: 100%;
  }
}
@media (max-width: 768px) {
  .searchInputsLeftSide {
    flex-direction: column;
  }
  .searchInputsRightSide {
    flex-direction: column;
  }
  .search-overlay-category-input,
  .search-overlay-cities-input,
  .search-overlay-duration-input,
  .search-overlay-years-input,
  .search-overlay-months-input {
    width: 100%;
  }
  .search-overlay-section h2 {
    margin-top: 80px;
    margin-bottom: 40px;
  }
  .search-overlay-section {
    font-size: 80%;
  }
  .search-overlay-dropdown-item{
    padding:1rem 2.8rem 1rem 0.5rem
  }
  .search-overlay-dropdown-item .custom-checkbox{
    right: 1rem;
  }
}
#search
{
        cursor: pointer;
position: absolute;
left: 0;
margin: auto;
right: 0;
margin-top: 25px;
width: 200px;
padding: 10px 5px;
font-size: 20px;
font-weight: bold;
}
#search-overlay
{
  z-index: 100000;
}

