/* DJ Image Slider üzərinə gələndə əl işarəsi çıxması üçün */
.dj-image-slider {
    cursor: grab;
    cursor: -webkit-grab;
}

.dj-image-slider:active {
    cursor: grabbing;
    cursor: -webkit-grabbing;
}






/*BODY BG LOGO*/


body::before {
    content: "";
    /* 1. DÜZƏLİŞ: Fayl adını sizin dediyiniz kimi 'fortis-logo.png' etdim */
    /* Əgər şəkli 'images/SYSTEM/' qovluğuna yükləmisinizsə, bu link işləyəcək */
    background-image: url('https://azerweb.net/fortis3/images/SYSTEM/fortis-logo2.png');
    
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 500px auto; /* Ölçünü zövqə görə dəyişə bilərsiniz */
    
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    
    /* 2. DÜZƏLİŞ: Görünməsi üçün z-index-i artırırıq */
    z-index: 9999; 
    
    /* Şəffaflığı azaldırıq ki, yazıların oxunmasına mane olmasın */
    opacity: 0.1; 
    
    /* 3. ƏN VACİB HİSSƏ: Bu kod loqonu "xəyal" kimi edir. */
    /* Üst layerdə olsa belə, klikləməyə mane olmur, sanki yoxdur */
    pointer-events: none; 
    
    /* (Opsional) Əgər loqonuz qaradırsa, bu kod onu arxa fonla daha yaxşı qarışdırır */
    mix-blend-mode: multiply;
}


/* END OF BODY BG LOGO*/





/*SLIDE SEARCH*/

/* Axtarış konteyneri - Flexbox ilə yan-yana düzürük */
.fortis-search-wrapper {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    position: relative;
}

/* Lupa düyməsinin stili */
.search-trigger {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 15px;
    color: #333; /* Şəkildəki tünd rəngə uyğun */
    z-index: 2;
    transition: transform 0.3s ease;
    padding: 4px;
}

/* Form konteyneri - əvvəlcə gizli və eni 0 */
.search-form-container {
    width: 0;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    transition: all 0.4s ease-in-out;
    margin-left: 0;
}

/* Input sahəsinin dizaynı */
.search-input {
    width: 100%;
    border: none;
    border-bottom: 2px solid #d4af37; /* Sənin loqodakı qızılı rəng */
    background: transparent;
    padding: 5px 10px;
    outline: none;
    color: #333;
}

/* ACTIVE halı - Lupa basılanda baş verənlər */
.fortis-search-wrapper.active .search-form-container {
    width: 200px; /* Açılan pəncərənin eni */
    opacity: 1;
    visibility: visible;
    margin-left: 10px; /* Lupa ilə ara məsafəsi */
}

/* İkon bir az sola sürüşsün və ya rəngi dəyişsin (istəyə bağlı) */
.fortis-search-wrapper.active .search-trigger {
    color: #d4af37; /* Aktiv olanda qızılı olsun */
}

/*END OF SLIDE SEARCH*/




/*PROJECTS BLOG VIEW UCUN 2 COLUMN*/

/* 1. Əsas Hədəf: Bizim sinifin daxilindəki o "columns-2" div-i */
.zi-projects-grid > div {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr); /* 2 Sütun */
    gap: 30px; /* Ara məsafəsi */
}


.zi-projects-grid {
    display: block !important;
    width: 100%;
}

/* 3. Kartların özünü resetləyirik */
.zi-projects-grid .blog-item {
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
    margin: 0 !important;
}


.com-content-category-blog__item.blog-item.zi_project_items {
    background-color: #eee;
    padding: 30px;
    margin-bottom: 20px;
    border-radius: 5px;
    border: 1px solid #999;
}

.zi_project_items h2 {
    margin-bottom: 29px;
}


/* 4. Mobil versiya */
@media (max-width: 768px) {
    .zi-projects-grid > div {
        grid-template-columns: 1fr; /* Mobildə tək sütun */
        gap: 20px;
    }
}

/*END OF PROJECTS BLOG VIEW UCUN 2 COLUMN*/







/* LANGUAGE IMAGES*/
 .mod-languages img {
      transition: transform 0.3s ease;}
    
    .mod-languages img:hover {
      
      transform: scale(1.5);
      
     }

/* END OF LANGUAGE IMAGES*/



/* PARTNERS CLIENTS */

    .zi-partners img {
      transition: transform 0.3s ease;}
    
    .zi-partners img:hover {
      
      transform: scale(1.3);
      
     }



    .zi-clients img {
      transition: transform 0.3s ease;}
    
    .zi-clients img:hover {
      
      transform: scale(1.3);
      
     }
    

/* END OF PARTNERS CLIENTS */



.axtarish, .diller {
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.axtarish .btn {background: none !important; border: none !important; color: #000;}


/* BLOG LAYOUT UCUN */
.com-content-category-blog__items.blog-items.columns-3 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
}

/* END OF BLOG LAYOUT UCUN */

/* ARTICLE LAYOUT */

.desc-article {
    text-align: left;
}

/*END OF ARTICLE LAYOUT*/


/*  <<<<<<<<<<< DJ IMAGE SLAYDER IMAGE ZOOM >>>>>>>>> */


/* Slayderin hər bir elementini (li) hədəf alırıq */
#slider176 li {
  /* z-index tətbiq edə bilmək üçün */
  position: relative;
 
}

/* Hər bir elementin içindəki şəkli (img) hədəf alırıq */
#slider176 li .dj-image {
  /* Böyümə effektinin hamar olması üçün keçid (transition) əlavə edirik */
  transition: transform 0.3s ease; padding: 30px;
}

/* Siçan (mouse) siyahı elementinin (li) üzərinə gəldikdə... */
#slider176 li:hover {
  /* Həmin elementi digər şəkillərin önünə keçiririk */

}

/* ...və onun içindəki şəkli 1.5 dəfə böyüdürük */
#slider176 li:hover .dj-image {
  transform: scale(1.5);
}


/*ikinci slayder ucun de*/

/* Slayderin hər bir elementini (li) hədəf alırıq */
#slider177 li {
  /* z-index tətbiq edə bilmək üçün */
  position: relative;
 
}

/* Hər bir elementin içindəki şəkli (img) hədəf alırıq */
#slider177 li .dj-image {
  /* Böyümə effektinin hamar olması üçün keçid (transition) əlavə edirik */
  transition: transform 0.3s ease; padding: 30px;
}

/* Siçan (mouse) siyahı elementinin (li) üzərinə gəldikdə... */
#slider177 li:hover {
  /* Həmin elementi digər şəkillərin önünə keçiririk */

}

/* ...və onun içindəki şəkli 1.5 dəfə böyüdürük */
#slider177 li:hover .dj-image {
  transform: scale(1.5);
}






/*  <<<<<<<<<<< END OF DJ IMAGE SLAYDER IMAGE ZOOM >>>>>>>>> */