
body{ 
    text-align: right;
    font-family: 'Tajawal', sans-serif;
}
h2 {
    font-family: 'Tajawal', sans-serif;

}

h3,h6,h4 {
    font-family: 'Tajawal', sans-serif !important;

}

h1 {
    font-family: 'Almarai', sans-serif !important; 
}

.websiteTitle{
    font-family: 'Almarai', sans-serif !important; 
    font-size: 90px !important;
    font-weight: 600;
    padding:10px
}
.websiteSubTitle{
    font-family: 'Tajawal', sans-serif !important; 
    font-size: 65px !important;
    font-weight: 100;
     
}
.aboutArkanTitle {
    color: #c5aa73 !important;
    font-size: 50px !important;
    font-weight: 600;
}
.ownerTitle{
    font-size: 40px !important;
    color: #c5aa73 !important;  
    font-weight: 600; 
    line-height: 0.9;
}
.ownerSubTitle{
    font-size: 20px !important; 
    color: gray;
    font-weight: 200;  
    margin-bottom: 25px;
}
.aboutArkanText {
    color: black !important;
    font-size: 16px !important;
    font-weight: 500;
}
.marketingContactTitle{
    padding: 40px;
    color: #fff !important;  

}
.realEstateContactTitle{
    padding: 40px;
    color: #000 !important;  
    font-weight: 900;
    padding: 50px;

}

.js-scroll-nav{
    direction: rtl;
}

.g-brd-primary {
    border-color: #c5aa73 !important;
}
.dark-theme .nav-item.active .nav-link {
    color: #c5aa73;
}
.light-theme .nav-item.active .nav-link {
    color: #c5aa73;
}

.dark-theme .nav-item .nav-link:hover {
    color: #b18f4b;
  }  
  .light-theme .nav-item .nav-link:hover {
    color: #b18f4b;
  }
  .g-color-primary {
    color: #c5aa73 !important;
}
 
[class*="u-nav-v8"] .nav-link.active, [class*="u-nav-v8"] .nav-link.active .u-nav-v8__icon {
    background-color: #c5aa73;
} 
.hamburger-box:hover .hamburger-inner, .hamburger-box:hover .hamburger-inner::after, .hamburger-box:hover .hamburger-inner::before {
    background-color: #c5aa73;
}
.u-btn-primary {
    color: #fff;
    background-color: #c5aa73;
}
.u-btn-primary:hover {
    color: #fff;
    background-color: #b18f4b;
}

[class*="u-nav-v8"] .nav-link.active,
[class*="u-nav-v8"] .nav-link.active .u-nav-v8__icon {
  background-color: #c5aa73 !important;
}
.g-theme-bg-blue-dark-v2:hover {
    background-color: #b18f4b !important;
}
.u-btn-darkred {
    color: #fff;
    background-color: #c5aa73 !important
}
.u-btn-primary:hover, .u-btn-primary.active {
    border-color: #b18f4b;
    background-color: #b18f4b;
}

.u-btn-darkred:hover {
    color: #fff;
    background-color: #b18f4b !important
}
.u-btn-darkred:hover, .u-btn-darkred.active {
    border-color: #b18f4b;
    background-color: #b18f4b;
  }
  .u-go-to-v1:hover, .u-go-to-v1:focus:hover {
      background-color: #c5aa73 !important;
  }
 

@media (min-width: 768px) {
    [class*="u-nav-v8"] .nav-link.active::before {
      background-image: -webkit-gradient(linear, right top, left bottom, color-stop(49.6%, transparent), color-stop(50%, #be7171)), -webkit-gradient(linear, right bottom, left top, color-stop(49.6%, transparent), color-stop(50%, #c94645));
      background-image: -webkit-linear-gradient(top right, transparent 49.6%, #c94645 50%), -webkit-linear-gradient(bottom right, transparent 49.6%, #c94645 50%);
      background-image: -o-linear-gradient(top right, transparent 49.6%, #c94645 50%), -o-linear-gradient(bottom right, transparent 49.6%, #c94645 50%);
      background-image: linear-gradient(to bottom left, transparent 49.6%, #c5aa73 50%), linear-gradient(to top left, transparent 49.6%, #c5aa73 50%);
    }
}
 