/* ===== 1. PAGE LOAD FADE-IN (Whole page) ===== */
body {
  animation: pageFadeIn 0.6s ease-out;
}

@keyframes pageFadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}




h1{font-family:'Vazir',sans-serif;font-weight:600;color:#29546A;line-height:1.81;margin:5px 0 15px}

h2,h3,h4,h5,h6,p{font-family:'Vazir',sans-serif}

a{text-decoration:none!important;color:inherit}a:hover,a:focus,a:active{text-decoration:none!important}

.img-portfolio {
  margin-bottom: 30px;
}

.img-hover:hover {
  opacity: 0.7;
}

.content-slide-in {
		opacity: 0;
		margin: 0px 0;
		background-color: ;
		border-radius: 5px
	}

	.content-slide-in.slide-in-top {
		transform: translateY(-40%);
		transition: opacity 0.5s ease-out, transform 1.5s ease-out
	}

	.content-slide-in.slide-in-left {
		transform: translateX(-100%);
		transition: opacity 0.5s ease-out, transform 1.5s ease-out
	}

	.content-slide-in.slide-in-right {
		transform: translateX(100%);
		transition: opacity 0.5s ease-out, transform 1.5s ease-out
	}

	.content-slide-in.slide-in-bottom {
		transform: translateY(30%);
		transition: opacity 0.5s ease-out, transform 1.5s ease-out
	}

	.content-slide-in.slide-in-bottom2 {
		transform: translateY(10%);
		transition: opacity 0.5s ease-out, transform 1.5s ease-out
	}

	.content-slide-in.slide-in-bottom3 {
		transform: translateY(7%);
		transition: opacity 0.5s ease-out, transform 1.6s ease-out
	}

	.content-slide-in.slide-in-bottom4 {
		transform: translateY(3%);
		transition: opacity 0.5s ease-out, transform 1.5s ease-out
	}

	.content-slide-in.slide-in-bottom5 {
		transform: translateY(40%);
		transition: opacity 0.5s ease-out, transform 1.5s ease-out
	}

	.content-slide-in.slide-in-bottom6 {
		transform: translateY(20%);
		transition: opacity 0.5s ease-out, transform 1.4s ease-out
	}

	.content-slide-in.slide-in-bottom7 {
		transform: translateY(15%);
		transition: opacity 0.5s ease-out, transform 1.5s ease-out
	}

	.content-slide-in.visible {
		opacity: 1;
		transform: translate(0, 0)
	}

	.fade-in-effect {
		opacity: 0;
		transition: opacity 0.5s ease-in-out
	}

	.fade-in-effect.visible {
		opacity: 1
	}



.pointer {cursor: pointer;
}


.protected-text {
    -webkit-user-select: none; /* Safari */
    -moz-user-select: none;    /* Firefox */
    -ms-user-select: none;     /* IE/Edge */
    user-select: none;         /* Standard */    
    cursor: default; /* Optional: remove text cursor */
}


.container7 {
  position: relative;
  text-align: right;
  color: white;
}

.bottom-left {
  position: absolute;
  bottom: 8px;
  left: 16px;
}

.top-left {
  position: absolute;
  top: 8px;
  left: 16px;
}

.top-left2 {
  position: absolute;
  top: 1px;
  left: 1px;
}

.top-right {
  position: absolute;
  top: 8px;
  right: 16px;
}

.bottom-right {
position: right;
text-align: right;
align-items: right;
justify-content: flex-end;
bottom: 8px;
right: 16px;
left: 8px;
}

.bottom {
  position: absolute;
  bottom: 0px;
  right: 5px;
}

.centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.bottom-center {
    position: absolute;
    bottom: 8px; /* 8 pixels from the bottom */
    left: 50%; /* Center horizontally */
    transform: translateX(-50%); /* Adjust to truly center it */
}

.top-center {
    position: absolute;
    top: 8px; /* 8 pixels from the top */
    left: 50%; /* Center horizontally */
    transform: translateX(-50%); /* Adjust to truly center it */
}


/* Spacers */
.my-spacer1 { display: block; height: 10px; }
.my-spacer2 { display: block; height: 20px; }
.my-spacer3 { display: block; height: 30px; }
.my-spacer4 { display: block; height: 47px; }































/* from navbar */

/* Header */
.custom-header {
    width: 100%;
    height: 100px;
    background: url('https://import-export.ir/images/misc/bg-navbar.webp') no-repeat center/cover;
    position: relative;
}

.header-title {
    position: absolute;
    right: 80px;
    top: 50%;
    transform: translateY(-50%);
    color: #ffffff;
    font-size: 22px;
    font-weight: 700;
    text-decoration: none;
    text-shadow: 0 2px 4px rgba(0,0,0,.45), 0 0 12px rgba(0,0,0,.35);
    transition: transform .35s ease, text-shadow .35s ease;
}

.header-title:hover {
    transform: translateY(-50%) scale(1.15);
    color: #ffffff;
    text-shadow: 0 4px 8px rgba(0,0,0,.55), 0 0 18px rgba(0,0,0,.45);
}

.header-title:focus,
.header-title:active,
.header-title:visited {
    color: #ffffff;
    outline: none;
}

/* Navbar */
.custom-navbar {
    background-color: #29546a;
    position: sticky;
    top: 0;
    z-index: 1000;
	margin-bottom: 10px;
}

.custom-navbar ul {
    list-style: none;
    margin: 0;
    padding-right: 15px;
    display: flex;
    flex-wrap: wrap;
}

.custom-navbar li {
    position: relative;
}

.custom-navbar a {
    display: block;
    padding: 10px 20px;
    color: #ffffff;
    text-decoration: none;
    transition: background-color .3s ease;
    font-size: 16px;
}

.custom-navbar a:hover {
    background-color: #1e3d4d;
}

/* Responsive Navbar */
@media(max-width: 1220px) {
    .custom-navbar a {
        padding: 12px 8px;
    }
}

.custom-toggle {
    display: none;
}

@media(max-width: 950px) {
    .custom-navbar {
        position: relative;
    }

    .custom-navbar ul {
        position: absolute;
        top: 100%;
        right: 0;
        left: 0;
        background-color: #29546a;
        display: grid !important;
        grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
        gap: 6px;
        max-height: 0;
        opacity: 0;
        transform: translateY(-10px);
        transition: .5s ease;
        padding: 8px 10px;

        /* Prevent clicks when hidden */
        pointer-events: none;
    }

    .custom-navbar ul.show {
        max-height: 1000px;
        opacity: .9;
        transform: none;

        /* Allow clicks when visible */
        pointer-events: auto;
    }

    .custom-toggle {
        display: block;
        position: absolute;
        top: 50%;
        right: 15px;
        transform: translateY(-50%);
        background: rgba(41,84,106,.8);
        color: #ffffff;
        border: 0;
        padding: 8px 12px;
        font-size: 18px;
        border-radius: 4px;
        cursor: pointer;
    }
}




























/* from footer */

#scrollTopBtn{
  position:fixed;
  bottom:80px;
  right:8px;
  width:40px;
  height:40px;
  border:none;
  border-radius:0;
  background:rgba(255,255,255,.7);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
  opacity:0;
  visibility:hidden;
  transition:all .3s ease;
  z-index:1000;
  cursor:pointer;
  box-shadow:0 2px 6px rgba(0,0,0,.2);
}
#scrollTopBtn.show{
  opacity:1;
  visibility:visible;
}
#scrollTopBtn:hover{
  transform:scale(1.2);
}
#scrollTopBtn img{
  width:20px;
  height:20px;
}
.responsive-font4{
  font-size:12px;
}
@media screen and (max-width:767px){
  .responsive-font4{
    font-size:8px;
  }
}

.overlay2{
  position:fixed;
  bottom:35px;
  left:5px;
  right:auto !important;
  z-index:1000;
  width:134px;
  height:134px;
  display:none;
  opacity:.8;
  background-color:transparent;
  transition:opacity 1s ease;
}
.gif-background{
  position:absolute;
  top:0;
  left:0;
  right:0;
  bottom:0;
  background-color:transparent;
  z-index:-1;
}
.overlay-gif{
  width:100%;
  height:auto;
  opacity:.9;
}
.close-btn{
  position:absolute;
  padding:5px;
  top:5px;
  right:10px;
  background-color:transparent;
  opacity:.7;
  color:#fff;
  border:none;
  font-size:20px;
  cursor:pointer;
}
.overlay-image{
  position:absolute;
  top:10px;
  left:10px;
  width:40px;
  height:auto;
  opacity:.7;
  z-index:1;
}





















/* from about */

/* =========================
   Table with Shadow
========================= */
.my-table-with-shadow {
  border-collapse: separate;
  border: 0 solid #29546A;
  box-shadow: 0 8px 25px rgba(0, 0, 0, .25);
  border-radius: 5px;
  width: 100%;
  padding: 25px;
  margin-bottom: 20px;
  margin-top: 0; /* keep wrapper aligned */
  position: relative;
  z-index: 10;
}

@media only screen and (max-width: 480px) {
  .my-table-with-shadow {
    padding: 20px 15px;
    margin-bottom: 20px;
    margin-top: -50px; /* move higher on mobile */
  }
}


/* =========================
   Containers
========================= */
#container1, #container2 {
  display: none;
}
#container1 {
  display: block; /* default visible */
}



/* =========================
   Language Buttons
========================= */
.language-buttons {
  position: relative;
  z-index: 30;
}

.language-button {
  display: inline-block;
  padding: 5px 40px;
  color: #29546a;
  border: 1px solid #29546a;
  border-radius: 5px;
  font-size: 1.1em;
  font-weight: 500;
  text-decoration: none;
  transition: all .3s ease;
  position: absolute;
  top: 10px;
  z-index: 40;
  white-space: nowrap;
  cursor: pointer;
  opacity: 1;
  margin-bottom: -40px; /* overlay effect */
}

.language-button.hidden {
  opacity: 0;
  pointer-events: none;
}

.language-button:hover {
  color: #fff;
  background: #29546a;
  border-color: #29546a;
}

/* Position each button separately */
#englishBtn { left: 10px; }
#persianBtn { right: 10px; }

.actions .language-button {
  margin-top: 0;
  margin-bottom: -40px;
  z-index: 20;
}


/* Mobile: stack language buttons cleanly */
@media (max-width: 768px) {
  .language-buttons {
    margin-top: 20px; /* was 30px ? now higher */
  }
  .language-button {
    position: relative;
    display: block;
    text-align: center;
    margin: 0 auto 5px auto; /* keep tight spacing */
    top: auto;
  }
}


/* =========================
   Gallery
========================= */
.gallery92 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 15px;
  padding: 10px;
}

.gallery-item92 img {
  width: 100%;
  height: auto;
  border: 2px solid #29546A;
  border-radius: 8px;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.gallery-item92 img:hover {
  transform: scale(1.03);
  box-shadow: 0 6px 15px rgba(0,0,0,0.25);
}

/* =========================
   Article Styling
========================= */
.about-title {
  font-weight: 600;
  color: #29546A;
  direction: rtl;
  padding-top: 20px;
  font-size: 26px;
  line-height: 1.5;
  text-align: center;
  padding-bottom: 15px;
}
@media (max-width: 480px) {
  .about-title {
   padding-top: 0px;
  }

}

.about-title-en {
  font-weight: 600;
  color: #29546A;
  direction: ltr;
  padding-top: 20px;
  font-size: 27px;
  line-height: 1.5;
  text-align: center;
  padding-bottom: 15px;
}

.about-author {
  font-size: 1.4em;
  font-weight: 500;
  color: #29546A;
  padding-top: 25px;
  padding-bottom: 5px;
  line-height: 1.5;
  text-align: right;
  padding-bottom: 15px;
}


.about-author-en {
  font-size: 1.4em;
  font-weight: 500;
  color: #29546A;
  padding-bottom: 5px
  padding-top: 25px;
  line-height: 1.5;
  direction: ltr;
  text-align: left;
  padding-bottom: 15px;
}

.about-body {
  color: #333;
  line-height: 1.6;
  font-size: 1.2em;
  direction: rtl;
  text-align: justify;
  padding-bottom: 10px;
}
@media (max-width: 480px) {
  .about-body {
  font-size: 1.1em;
}
}

.about-body-en {
  color: #333;
  line-height: 1.6;
  font-size: 1.2em;
  direction: ltr;
  text-align: justify;
  padding-bottom: 10px;
}
@media (max-width: 480px) {
  .about-body-en {
  font-size: 1.1em;
}
}

.highlight {
  color: #29546A;
  font-weight: 600;
}

/* =========================
   Contact Rows (Persian)
========================= */
.contact-row {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 12px;
  background: #29546a;
  padding: 15px 20px;
  margin: 10px 0;
  border-radius: 10px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
  font-family: "Tahoma", sans-serif;
  direction: rtl;
}

.contact-row a {
  color: #fff;
  text-decoration: none; /* default for desktop/tablet */
  font-size: 15px;
}

.contact-row a:hover {
  text-decoration: underline; /* default hover for desktop/tablet */
}

.contact-row span {
  color: #ccc;
}

.contact-row i {
  margin-left: 6px;
  color: #fff;
}

/* =========================
   Mobile Adjustments
========================= */
@media (max-width: 480px) {
  .contact-row {
    justify-content: flex-start; /* align items to the left on mobile */
  }
  .contact-row span {
    display: none; /* hide separators on mobile */
  }
}



/* =========================
   Contact Info Box (English)
========================= */
.contact-info-box {
  background: #29546a;
  padding: 15px 20px;
  margin: 10px 0;
  border-radius: 10px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
  font-family: "Tahoma", sans-serif;
  direction: ltr;
  text-align: left;
  color: #ffffff;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.contact-info-box .contact-row-top,
.contact-info-box .contact-row-bottom {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: flex-start;
  align-items: center;
}

.contact-info-box a {
  color: #ffffff;
  text-decoration: none;
  font-size: 15px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.contact-info-box a:hover {
  text-decoration: underline;
}

.contact-info-box span {
  color: #cccccc;
}

.contact-info-box i {
  color: #ffffff;
  font-size: 1.1em;
}























/* from buttons multimedia */

/* Single Row Container */
.single-row {
    display: flex;
    justify-content: flex-end;
    padding-left: 0;
    padding-right: 0;
    direction: rtl;
}

/* Column Item */
.col-item {
    margin-right: 5px;
    flex: 1;
    text-align: center;
}

.col-item:first-child {
    margin-left: 0;
}

/* Button Styles */
.button-29546A-2 {
    width: 100%;
    padding-top: 5px;
    padding-bottom: 5px;
    background-color: #29546A;
    color: #fff;
    border: 1px solid #29546A;
    border-radius: 0;
    cursor: pointer;
    position: relative;
    z-index: 1;
}

/* GIF Image */
.gif-image {
    width: 100%;
}

/* Seven Item Grid */
.seven-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 10px;
}

.seven-grid .seven-item {
    box-sizing: border-box;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.seven-grid .seven-item img {
    width: 100%;
    border: 1px solid #29546A;
    display: block;
}

/* Hover Effect Overlay */
.seven-grid .seven-item::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 1);
    mix-blend-mode: saturation;
    transform: translateX(100%);
    transition: transform .6s linear;
    pointer-events: none;
    z-index: 2;
}

.seven-grid .seven-item:hover::after {
    transform: translateX(0);
}

/* Tablet Responsive */
@media (max-width: 991px) {
    .button-29546A-2 {
        font-size: 12px;
        font-weight: normal;
    }
}

/* Mobile Responsive */
@media (max-width: 767px) {
    .single-row {
        flex-wrap: wrap;
        justify-content: flex-start;
    }
    
    .button-29546A-2 {
        font-size: 14px;
        font-weight: normal;
    }
    
    .seven-grid {
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: repeat(2, auto);
        gap: 5px;
    }
    
    .seven-grid .seven-item:nth-child(7) {
        display: none;
    }
}



















/* from news gallery */

/* ===== NEWS GRID ===== */
.vg-news-col{padding:4px}
.vg-news-box{
  height:240px;
  display:flex;
  flex-direction:column;
  padding:6px;
  margin-bottom:15px;
  transition:transform .2s, box-shadow .2s;
  background:#fff;
  box-shadow: 0 0 20px #e0dede;
}
.vg-news-box:hover{
  transform:translateY(-3px);
  box-shadow:0 8px 20px rgba(0,0,0,.25);
}
.vg-news-box img{
  height:120px;
  width:100%;
  object-fit:cover;
}
.vg-news-content{
  flex:1;
  overflow:hidden;
  padding:6px;
}
.vg-news-content h4{
  font-size:16px;
  margin:0 0 6px;
  line-height:1.4em;
  font-weight:600;
  height:4.6em;
  overflow:hidden;
}
.vg-news-content h4 a{
  color:#1f3f52;
  text-decoration:none;
}
.vg-news-date{
  font-size:12px;
  color:#666;
}

/* ===== PAGINATION (FIXED) ===== */
.vg-pagination{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:10px;
  list-style:none;
  padding:20px 0;
  margin:0;
}
.vg-pagination li a{
  min-height:40px;
  min-width:40px;
  padding:8px 14px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#fff;
  color:#29546a;
  border:1px solid #29546a;
  border-radius:6px;
  text-decoration:none;
  font-size:14px;
  font-weight:600;
  transition:all .2s ease;
}
.vg-pagination li a:hover{
  background:#29546a;
  color:#fff;
}
.vg-pagination li.active a{
  background:#29546a;
  color:#fff;
  pointer-events:none;
}

/* ===== RESPONSIVE ===== */
@media (max-width:767px){
  .vg-pagination{
    flex-wrap:wrap;
  }
}














/* from multimedia */

.fade-scale-once {
    opacity: 0;
    transform: scale(.9);
    animation: fadeScaleOnce .7s ease-out forwards;
}

@keyframes fadeScaleOnce {
    0% {
        opacity: 0;
        transform: scale(.9);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}

/* Main rounded-table3 styles */
.rounded-table3 {
    border: 2px solid #29546A;
    border-radius: 5px;
    width: 100%;
    padding: 5px 15px;
    margin-top: 5px;
    background-color: #fff;
    box-sizing: border-box;
}

/* h1 styles for rounded-table3 */
.rounded-table3 h1 {
    font-size: 18px;
    margin: 0.4em 0;
    font-family: 'Vazir', sans-serif;
    font-weight: 600;
    color: #29546A;
    line-height: 1.4;
    text-align: right;
    direction: rtl;
}

/* h3 styles for rounded-table3 */
.rounded-table3 h3 {
    font-size: 15px;
    margin: 0.5em 0;
    font-family: 'Vazir', sans-serif;
    font-weight: 500;
    line-height: 1.4;
    text-align: right;
    direction: rtl;
}

/* p styles for rounded-table3 */
.rounded-table3 p {
    font-size: 14px;
    line-height: 1.4;
    text-align: justify;
    direction: rtl;
    margin: 0.5em 0;
}

/* Responsive padding adjustment for mobile */
@media (max-width:767px) {
    .rounded-table3 {
        padding: 8px 12px;
    }
    
    .rounded-table3 h1 {
        font-size: 20px !important;
    }
    
    .rounded-table3 h3 {
        font-size: 18px !important;
    }
    
    .rounded-table3 p {
        font-size: 18px !important;
    }
}


/* Container visibility */
#container1, #container2, #container3, #container4, #container5, 
#container6, #container7, #container8, #container9, #container10,
#container11, #container12, #container13, #container14 {
    display: none;
}

#container1 {
    display: block;
}

/* Parts buttons */
.parts-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    direction: rtl;
    padding: 5px;
    max-width: 100%;
    justify-content: space-between;
}

/* White buttons */
.btn-white {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.95) !important;
    color: #29546A !important;
    padding: 6px 16px !important;
    border-radius: 8px !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    font-size: 13px !important;
    font-family: Vazir, sans-serif !important;
    border: 1px solid rgba(255, 255, 255, 0.8) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
    transition: all 0.2s ease !important;
    min-height: 42px !important;
    white-space: nowrap;
    flex: 1;
    cursor: pointer !important;
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

.btn-white:hover {
    background: #fff !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
    transform: translateY(-2px) !important;
    color: #1a3c5e !important;
    border-color: #29546A !important;
    cursor: pointer !important;
}

.btn-white:active {
    transform: translateY(0) !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
    transition: all 0.1s ease !important;
}

@media (max-width: 768px) {
    .parts-buttons {
        gap: 6px;
        padding: 8px;
        justify-content: stretch;
    }
    
    .btn-white {
        padding: 12px 14px !important;
        font-size: 14px !important;
        flex: 1;
        min-width: 80px;
        cursor: pointer !important;
    }
}

/* For very small screens */
@media (max-width: 480px) {
    .parts-buttons {
        gap: 4px;
        padding: 6px;
    }
    
    .btn-white {
        padding: 10px 12px !important;
        font-size: 13px !important;
        min-width: 70px;
    }
}

/* Dropdown styles - CENTERED */
.drop-container57 {
    position: absolute;
    max-height: 0;
    overflow: hidden;
    margin-top: 30px;
    /* REMOVED: margin-right: 15px; */
    transition: max-height .6s ease;
    background: rgba(41, 84, 106, 0.8);
    border-radius: 6px;
    z-index: 999;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    /* CENTERING ADDED: */
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    min-width: 200px;
}


.drop-container57.active57 {
    max-height: 500px;
}

.drop-content57 {
    padding: 15px;
    font-size: 16px;
    color: #fff;
    border: none !important;
    outline: none !important;
}

/* Ensure no borders on buttons inside */
.drop-content57 .btn-white {
    opacity: 1 !important;
    background: rgba(255, 255, 255, 0.95) !important;
    color: #29546A !important;
    border: 1px solid rgba(255, 255, 255, 0.8) !important; /* Keep button border */
    outline: none !important;
}

.parts-buttons {
    border: none !important;
    outline: none !important;
}

.toggle-btn57 {
    background: #007bff;
    color: #fff;
    border: none;
    padding: 10px 15px;
    cursor: pointer;
    font-size: 16px;
    border-radius: 4px;
    position: relative;
    z-index: 1000;
    opacity: 1;
    outline: none !important;
}

/* Blue button */
.blu-button-m {
    display: inline-block;
    padding: 5px 40px;
    color: #29546a;
    background: #fff;
    border: 2px solid #29546a;
    border-radius: 5px;
    margin: -20px 0 0 30px;
    float: left;
    font-family: Vazir, sans-serif;
    font-size: 1.1em;
    font-weight: 600;
    text-decoration: none;
    transition: all .3s ease;
    position: relative;
    z-index: 10;
}

.blu-button-m:hover {
    color: #fff;
    background: #29546a;
    border-color: #29546a;
}


.mobile-only {
    display: none;
}

@media (max-width: 768px) {
    .mobile-only {
        display: inline !important;
    }
}

.contact-buttons{display:flex;justify-content:space-between;gap:8px;width:100%}
.contact-button{flex:1;text-align:center;padding:10px 0;color:#29546a;background:#fff;border:1px solid #29546a;border-radius:5px;font-family:Vazir,sans-serif;font-size:1em;font-weight:600;text-decoration:none;transition:all .3s ease}
.contact-button:hover{color:#fff;background:#29546a;border-color:#29546a}











/* from columns */

.column-container {
    direction: rtl;
    text-align: right;
    width: 100%;
}

.text-container {
    display: flex;
    align-items: center;
    text-decoration: none;
    box-shadow: 0 4px 7px rgba(0, 0, 0, .1);
    margin: 5px 7px 0px 7px;
    padding: 0;
    background: #fff;
    cursor: pointer;
    transition: box-shadow .3s ease;
}

.text-container:hover {
    box-shadow: 0 8px 15px rgba(0, 0, 0, .3);
}

.text-image {
    float: right;
    margin-left: 10px;
    width: 17%;
    height: auto;
}

.column-container::after {
    content: "";
    display: table;
    clear: both;
}

/* Tablet styles */
@media (min-width: 768px) and (max-width: 1024px) {
    .column-container {
        width: 100%;
        box-sizing: border-box;
        float: left;
    }
}













/* from header articles */

/* ===== ARTICLES HEADER 5 ===== */
.articles-header-5 {
  width: 100%;
  margin-bottom: 10px;
  box-sizing: border-box;
  font-family: 'Vazir', Tahoma, sans-serif;
  padding: 0 1px;
}

.articles-header-5-inner {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.articles-left-4,
.articles-right-1 {
  box-sizing: border-box;
}

@media (min-width: 768px) {
  .articles-left-4,
  .articles-right-1 {
    width: calc(50% - 5px);
  }
}

@media (max-width: 767px) {
  .articles-left-4,
  .articles-right-1 {
    width: 100%;
  }
}

.articles-right-1 {
  padding: 0;
}

/* BIG CARD */
.articles-big-card {
  position: relative;
  width: 100%;
  overflow: hidden;
  border-radius: 0;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.25);
  background: #000;
}

@media (min-width: 768px) {
  .articles-big-card {
    height: 270px;
  }
}

.articles-big-img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  border: 1px solid #29546a;
  border-top: 2px solid #29546a;
  border-radius: 0;
  transition: transform .6s ease, filter .3s ease;
}

.articles-big-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 12px;
  background: linear-gradient(transparent, rgba(41, 84, 106, 0.85));
  color: #fff;
  direction: rtl;
}

.articles-big-title {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 6px;
  background-color: #29546a;
  padding: 4px 6px;
  border-radius: 0;
  display: inline-block;
}

.articles-big-text {
  font-size: 12px;
  line-height: 1.6;
  max-height: 6em;
  overflow: hidden;
}

.articles-top-right {
  position: absolute;
  top: 8px;
  right: 10px;
  border: 1px solid #29546a;
  border-radius: 0;
}

/* SMALL CARDS */
.articles-left-4 {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding: 0;
}

.articles-small-wrap {
  width: calc(50% - 5px);
  box-sizing: border-box;
}

.articles-small-card {
  position: relative;
  width: 100%;
  overflow: hidden;
  border-radius: 0;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.18);
  background: #000;
}

@media (min-width: 768px) {
  .articles-small-card {
    height: 130px;
  }
}

.articles-small-img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  border: 1px solid #29546a;
  border-radius: 0;
  transition: transform .6s ease, filter .3s ease;
}

.articles-small-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(41, 84, 106, 0.85);
  color: #fff;
  padding: 6px;
  direction: rtl;
}

.articles-small-title {
  font-size: 14px;
  font-weight: 500;
  line-height: 1.5;
  max-height: 3.5em;
  overflow: hidden;
}

.articles-top-left {
  position: absolute;
  top: 8px;
  left: 8px;
  border: 1px solid #29546a;
  border-radius: 0;
  width: 22%;
}

/* HOVER EFFECTS */
.articles-header-5 a:hover .articles-big-img {
  transform: scale(1.05);
  filter: brightness(1.1);
}

.articles-header-5 a:hover .articles-small-img {
  transform: scale(1.05);
  filter: brightness(1.1);
}

.articles-header-5 a {
  text-decoration: none;
  color: inherit;
}

/* MOBILE RESPONSIVE */
@media (max-width: 767px) {
  .articles-big-card,
  .articles-small-card {
    height: auto;
  }
  
  .articles-big-img,
  .articles-small-img {
    height: auto;
  }
}















/* from header news and header multimedias */

/* ===== NEWS HEADER 5 - NO RADIUS ===== */
.news-header-5 {
  width: 100%;
  margin-bottom: 15px;
  box-sizing: border-box;
  font-family: 'Vazir', Tahoma, sans-serif;
  padding: 0 1px;
}



.news-header-5-inner {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.news-left-4,
.news-right-1 {
  box-sizing: border-box;
}

@media (min-width: 768px) {
  .news-left-4,
  .news-right-1 {
    width: calc(50% - 5px);
  }
}

@media (max-width: 767px) {
  .news-left-4,
  .news-right-1 {
    width: 100%;
  }
}

.news-right-1 {
  padding: 0;
}

/* BIG CARD - NO RADIUS */
.news-big-card {
  position: relative;
  width: 100%;
  overflow: hidden;
  border-radius: 0;           /* ? NO RADIUS */
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.25);
  background: #000;
  display: block;
  text-decoration: none;
  color: inherit;
}

@media (min-width: 768px) {
  .news-big-card {
    height: 270px;
  }
}

.news-big-img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  border: 1px solid #29546a;
  border-top: 2px solid #29546a;
  border-radius: 0;           /* ? NO RADIUS */
  transition: transform .6s ease, filter .3s ease;
}

.news-big-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 12px;
  background: linear-gradient(transparent, rgba(41, 84, 106, 0.85));
  color: #fff;
  direction: rtl;
}

.news-big-title {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 6px;
  line-height: 1.6;
  background-color: #29546a;
  padding: 4px 6px;
  border-radius: 0;           /* ? NO RADIUS */
  display: inline-block;
}

.news-big-text {
  font-size: 13px;
  line-height: 1.6;
  max-height: 3.2em;
  overflow: hidden;
}

.top-right {
  position: absolute;
  top: 8px;
  right: 10px;
  border-radius: 0;           /* ? NO RADIUS */
  border: 1px solid #29546A;
}

/* SMALL CARDS - NO RADIUS */
.news-left-4 {
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.news-small-wrap {
  width: calc(50% - 5px);
  box-sizing: border-box;
}

.news-small-card {
  position: relative;
  width: 100%;
  overflow: hidden;
  border-radius: 0;           /* ? NO RADIUS */
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.18);
  background: #000;
  display: block;
  text-decoration: none;
  color: inherit;
}

@media (min-width: 768px) {
  .news-small-card {
    height: 130px;
  }
}

.news-small-img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  border: 1px solid #29546a;
  border-radius: 0;           /* ? NO RADIUS */
  transition: transform .6s ease, filter .3s ease;
}

.news-small-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(41, 84, 106, 0.85);
  color: #fff;
  padding: 6px;
  direction: rtl;
}

.news-small-title {
  font-size: 14px;
  font-weight: 500;
  line-height: 1.5;
  max-height: 3.5em;
  overflow: hidden;
}

/* HOVER EFFECTS */
.news-header-5 a:hover .news-big-img {
  transform: scale(1.05);
  filter: brightness(1.1);
}

.news-header-5 a:hover .news-small-img {
  transform: scale(1.05);
  filter: brightness(1.1);
}

.news-header-5 a {
  text-decoration: none;
  color: inherit;
}

/* MOBILE RESPONSIVE */
@media (max-width: 767px) {
  .news-big-card,
  .news-small-card {
    height: auto;
  }
  
  .news-big-img,
  .news-small-img {
    height: auto;
  }
}
















/* from lists articles */

/* Base styles for img-hover-new3 */
    .img-hover-new3 {
        color: #29546a; /* Default font color */
        transition: color 0.1s ease, background-color 0.3s ease, padding 0.3s ease;
        padding: 2px;
        direction: rtl;
        line-height: 2;
        font-size: 1rem; 
    }

    .img-hover-new3:hover {
        padding: 8px;
    }

    .ellipsis {
        white-space: nowrap;        
        overflow: hidden;          
        text-overflow: ellipsis;   
        display: inline-block;      
        direction: rtl;            
        text-align: right;
        font-weight: 600;		
        transition: color 0.3s;    
    }

    .text-container3 {
        display: flex;              
        align-items: center;        
        text-decoration: none;      
        color: #29546A;             
    }

    .column-container3::after {
        content: "";
        display: table;
        clear: both;
    }

    .my-unique-text-box2 {
        width: 100%;
        background-color: white;
        border-radius: 10px;
        padding: 20px 0px 20px 0px;
		margin-bottom: 20px;
        box-sizing: border-box;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    }

    .rtl-grid .col-md-4,
    .rtl-grid .col-sm-4 {
        float: right;
    }

    /* Mobile */
    @media (max-width: 767px) {
        .img-hover-new3 {
            line-height: 2;
            font-size: 1.1rem; 
        }
        
        .img-hover-new3:hover {
            padding: 7px;
        }
    }












/* from lists multimedia */

.info-box2,
.info-box2-blank {
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(33.33% - 20px);
    margin: 0 10px 7px;
    height: 70px;
	padding: 5px;
    border-radius: 5px;
    background: #fff;
    box-shadow: 0 0 10px rgba(0, 0, 0, .1);
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    transition: background-color .3s ease, color .3s ease;
}

.info-box2-new {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: calc(16.66% - 20px);
    margin: 0 10px 7px;
    height: 190px;
    border-radius: 5px;
    background: #fff;
    box-shadow: 0 0 10px rgba(0, 0, 0, .1);
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    transition: background-color .3s ease, color .3s ease;
}

.image-wrapper2 {
    flex: 0 0 32%;
    margin: 5px;
}

.image-wrapper2 img {
    width: 100%;
    height: auto;
    border-radius: 5px;
    border: 1px solid #29546A;
}

.image-wrapper2-new {
    flex: none;
    margin-bottom: 5px;
    padding-top: 5px;
}

.image-wrapper2-new img {
    width: 100%;
    height: auto;
    border-radius: 0;
    border: 0 solid #29546A;
}

.text-wrapper2 {
    flex: 1;
    padding: 2px;
    text-align: right;
    color: #29546A;
    font-weight: 600;
    display: flex;
    align-items: center;
    overflow: hidden;
}

.text-wrapper2 p {
    margin: 0;
    line-height: 1.5;
}

.text-wrapper2-new {
    flex-grow: 1;
    padding: 5px;
    text-align: center;
    color: #29546A;
    font-weight: 600;
    overflow: hidden;
}

.text-wrapper2-new p {
    margin: 0;
    line-height: 1.5;
}

.info-box2:hover,
.info-box2-new:hover {
    background-color: #29546A;
}

.info-box2:hover .text-wrapper2,
.info-box2-new:hover .text-wrapper2-new {
    color: #fff;
}

.flex-container2,
.flex-container2-blank,
.flex-container2-new {
    display: flex;
    flex-wrap: wrap;
    direction: rtl;
    float: right;
    padding: 7px;
    margin: 0;
}

@media (max-width: 991px) {
    .info-box2,
    .info-box2-blank {
        width: calc(50% - 20px);
        height: auto;
        flex-direction: row;
    }
    
    .info-box2-new {
        width: calc(25% - 20px);
    }
    
    .image-wrapper2 {
        flex: 0 0 25%;
    }
    
    .text-wrapper2 {
        padding: 5px;
        direction: rtl;
        text-align: right;
    }
    
    .image-wrapper2-new {
        width: 100%;
    }
}

@media (max-width: 767px) {
    .info-box2,
    .info-box2-blank {
        width: calc(100% - 20px);
        height: 60px;
        flex-direction: row;
    }
    
    .info-box2-new {
        width: calc(50% - 20px);
        height: auto;
    }
    
    .image-wrapper2 {
        flex: 0 0 20%;
        margin-right: 4px;
    }
    
    .text-wrapper2 {
        padding: 0;
        font-size: 1.2em;
        direction: rtl;
        text-align: right;
    }
    
    .image-wrapper2-new {
        margin-bottom: 4px;
    }
    
    .text-wrapper2-new {
        padding-top: 0;
        font-size: 1.2em;
    }
}













/* from lists ebooks and trade with countries */

.ebook-card {
  position: relative;
  display: block;
  overflow: hidden;   /* still clips zoomed image */
  margin-bottom: 0px;
}

.ebook-card img {
  width: 100%;
  height: auto;       /* ? natural height */
  object-fit: cover;  /* optional: keeps aspect ratio */
  border: 1px solid #29546A;
  display: block;
  transition: transform .6s ease, filter .3s ease;
}

.ebook-caption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 55px;
  background: rgba(255, 255, 255,0.9); 
  padding: 6px;
  direction: rtl;
  box-sizing: border-box;
  border: 1px solid #29546a;
}

.ebook-caption h6 {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.5;
  color: #29546a;
  margin: 0;
  text-align: center;
  max-height: 3.5em;
  overflow: hidden;
}

/* HOVER - EXACTLY LIKE SLIDER 99 */
.ebook-card:hover img {
  transform: scale(1.05);
  filter: brightness(1.1);
}

.ebook-link {
  text-decoration: none;
  color: inherit;
  display: block;
}

/* RESPONSIVE - MATCHES SLIDER 99 */
@media (max-width: 991px) {
  .ebook-card {
    height: 160px;
  }
  .ebook-caption h6 {
    font-size: 16px;
  }
}

@media (max-width: 575px) {
  .ebook-card {
    height: 180px;
  }
  .ebook-caption h6 {
    font-size: 18px;
  }
}

@media (max-width: 360px) {
  .ebook-caption h6 {
    font-size: 20px;
  }
  .ebook-card {
    height: 200px;
  }
}

/* ===== BASE STYLE FOR ALL SLIDERS ===== */
.book-slider {
  position: relative;
  width: 100%;
  overflow: hidden;
  margin-bottom: 10px;
}
.book-slider a {
  position: relative;
  display: block;
  text-decoration: none;
  overflow: hidden;
}
.book-slider img {
  width: 100%;
  height: auto;
  object-fit: cover;
  display: block;
  transition: transform .5s ease, filter .3s ease;
}
.book-slider span {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  color: #fff;
  text-align: center;
  padding: 6px 5px;
  font-size: 1em;
  line-height: 1.4em;
  box-sizing: border-box;
  text-shadow: 2px 2px 4px rgba(0,0,0,0.9);
}
.book-slider a:hover img {
  transform: scale(1.05);
  filter: brightness(1.1);
}

/* ===== GROUP 1 ===== */
.row1 { display: flex; flex-wrap: wrap; gap: 10px; }
.row1 a { flex: 0 0 calc(20% - 8px); } /* 5 per row on desktop */
.row1 img { border: 1px solid #C0C0C0; }
.row1 span { background: rgba(0,0,0,0.7); }

/* ===== GROUP 2 ===== */
.row2 { display: flex; flex-wrap: wrap; gap: 10px; }
.row2 a { flex: 0 0 calc(20% - 8px); }
.row2 img { border: 1px solid #29546A; }
.row2 span { background: rgba(41,84,106,0.85); }

/* ===== GROUP 3 ===== */
.row3 { display: flex; flex-wrap: wrap; gap: 10px; }
.row3 a { flex: 0 0 calc(20% - 8px); }
.row3 img { border: 1px solid #006400; }
.row3 span { background: rgba(0,100,0,0.75); }

/* ===== GROUP 4 ===== */
.row4 { display: flex; flex-wrap: wrap; gap: 10px; }
.row4 a { flex: 0 0 calc(20% - 8px); }
.row4 img { border: 1px solid #800000; }
.row4 span { background: rgba(128,0,0,0.75); }

/* ===== GROUP 5 ===== */
.row5 { display: flex; flex-wrap: wrap; gap: 10px; }
.row5 a { flex: 0 0 calc(20% - 8px); }
.row5 img { border: 1px solid #8B008B; }
.row5 span { background: rgba(139,0,139,0.75); }

/* ===== GROUP 6 ===== */
.row6 { display: flex; flex-wrap: wrap; gap: 10px; }
.row6 a { flex: 0 0 calc(20% - 8px); }
.row6 img { border: 1px solid #FF8C00; }
.row6 span { background: rgba(255,140,0,0.75); }

/* ===== GROUP 7 ===== */
.row7 { display: flex; flex-wrap: wrap; gap: 10px; }
.row7 a { flex: 0 0 calc(20% - 8px); }
.row7 img { border: 1px solid #4682B4; }
.row7 span { background: rgba(70,130,180,0.75); }

/* ===== RESPONSIVE ===== */
@media (max-width: 991px) {
  /* Tablet: 4 per row */
  .row1 a, .row2 a, .row3 a, .row4 a, .row5 a, .row6 a, .row7 a {
    flex: 0 0 calc(25% - 8px);
  }
}
@media (max-width: 575px) {
  /* Mobile: 2 per row */
  .row1 a, .row2 a, .row3 a, .row4 a, .row5 a, .row6 a, .row7 a {
    flex: 0 0 calc(50% - 6px);
  }
  .book-slider span {
    font-size: 1.1em;
    padding: 10px 8px;
  }
}
@media (max-width: 360px) {
  .book-slider span {
    font-size: 1.2em;
    line-height: 1.3em;
  }
}

/* ===== SLIDER BUTTONS ===== */
.slider-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(41,84,106,0.8);
  color: #fff;
  border: none;
  padding: 8px 12px;
  cursor: pointer;
  font-size: 20px;
  border-radius: 4px;
  z-index: 10;
}
.slider-btn:hover { background: rgba(41,84,106,1); }
.prev1, .prev2, .prev3, .prev4, .prev5, .prev6, .prev7 { left: 10px; }
.next1, .next2, .next3, .next4, .next5, .next6, .next7 { right: 10px; }





















/* ===== from lists news and editorials ===== */

#news_iframe_scroll	{
		width: 100%;
		max-width: 250px;
		min-width: 200px;
		margin: 0px auto 10px auto;
		border: #000000 1px solid;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		}

#news_iframe_scroll iframe 
		{
		width: 100%;
		height: 176px; /* IF YOU EDIT HEIGHT EDIT THE SCROLLING SCRIPT HEIGHT!!!! */
		display: block;
		margin: 0px;
		padding: 0px;
		overflow: hidden;
		}

.news_scroll-title 
		{
		color: #FFFFFF;
		font: normal 20px "Droid Sans", arial, sans-serif;
		text-align: right;
		background-color: #276396;
		padding: 5px 5px 5px 5px;
		border-bottom: #C0C0C0 5px solid;
		}




/* EMBEDDED NEWS PAGE BODY */

#NewsDiv	{ position: absolute; right: 0; top: 0px; width: 100%; }

body.news-scroll {
		background-color: #FFFFFF;
		margin: 0;
		padding: 0;
		border: 0;
		}

/* FONTS & PADDING */

.scroll-text-if	{
		color: #666666;
		font: normal 12px "Droid Sans", arial, sans-serif;
		text-align: right;
		padding: 8px 7px 0px 7px;
		}

.scroll-title-if {
		color: #000000;
		font: bold 15px "Droid Sans", arial, sans-serif;
		text-align: right;
		border-bottom: #666666 0px solid;
		}

/* EMBEDDED NEWS PAGE LINK COLORS */

.news-scroll a:link	{ color: #0033FF; text-decoration: none; }

.news-scroll a:visited	{ color: #6633FF; text-decoration: none; }

.news-scroll a:active	{ color: #0033FF; text-decoration: none; }

.news-scroll a:hover	{ color: #6699FF; text-decoration: underline; }


.right-class {
  direction: rtl;
  text-align: right;
  color: #29546A;
  white-space: nowrap;        /* keep text on one line */
  overflow: hidden;           /* hide overflow */
  text-overflow: ellipsis;    /* show ... at the end */
  display: block;
  width: 100%;
  line-height: 1;           /* reduce vertical spacing */
}

.right-class p {
  margin: 2px 0;              /* tighten paragraph spacing */
}

.right-class a {
  color: #29546A;
  text-decoration: none;
  display: inline-block;
  max-width: 99%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  line-height: 1.2;           /* match container line-height */
}

.right-class img {
  float: right;
  margin-left: 5px;
  margin-top: 5px;            /* reduce top margin so icon aligns better */
  width: 8px;
  height: 8px;
  vertical-align: middle;     /* align with text baseline */
  flex-shrink: 0;
}















/* from marquee */

.marquee-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    position: fixed;
    bottom: 0;
    left: 0;
    background-color: #fff;
    z-index: 9999;
}

.marquee {
    box-shadow: 0 1px 3px rgba(0,0,0,.1);
    border: 1px solid rgba(0,0,0,.15);
    background-color: #29546A;
    overflow: hidden;
    height: 30px;
    white-space: nowrap;
    flex-grow: 1;
}

.marquee p {
    display: inline-block;
    font-size: 12px;
    color: #FFF;
    height: 100%;
    margin: 0;
    line-height: 30px;
    animation: scroll-right 25s linear infinite;
}

@keyframes scroll-right {
    0% { transform: translateX(-3%); }
    100% { transform: translateX(44%); }
}

.marquee:hover p {
    animation-play-state: paused;
}

.marquee a {
    color: #FFF;
    text-decoration: none;
    padding: 0 15px;
}

.marquee a:hover {
    text-decoration: underline;
}

/* Fixed Text */
.fixed-text {
    margin-right: 0;
    font-size: 13px;
    color: #29546A;
    white-space: nowrap;
    direction: rtl;
    border: 3px solid #29546A;
    padding: 3.5px;
}

/* Close Button for Marquee */
.close-marquee {
    position: fixed;
    bottom: 34px;              /* sits just above the marquee */
    right: 10px;               /* moved to the right side */
    background: rgba(255,255,255,0.8); /* white box with opacity */
    border: 1px solid #ccc;
    border-radius: 0;          /* square corners */
    width: 28px;               /* fixed square size */
    height: 28px;
    padding: 0;                /* no padding ? bigger X inside */
    font-size: 20px;           /* larger X */
    font-weight: bold;
    color: #29546A;
    text-align: center;
    line-height: 28px;         /* vertically center the X */
    cursor: pointer;
    z-index: 10000;            /* above marquee */
    transition: opacity 0.5s ease;
}




















/* from update articles */

/* ===== INFO BOX 87 ===== */
.flex-container-87 {
  display: flex;
  flex-wrap: wrap;
  padding: 7px;
  direction: rtl;
  margin-bottom: 10px;
}

.info-box-87 {
  display: flex;
  align-items: center;
  width: calc(33.333% - 20px);
  margin: 0px 10px 3px 10px;
  border-radius: 5px;
  background-color: #fff;
  box-shadow: 0 0 10px rgba(0,0,0,0.1);
  overflow: hidden;
  position: relative;
  text-decoration: none;
  color: inherit;
  transition: transform 0.3s ease;
}

.image-wrapper-87 {
  flex: 0 0 32%;
  overflow: hidden;
}

.image-wrapper-87 img {
  width: 100%;
  height: auto;
  border-radius: 5px;
  transition: transform .6s ease, filter .3s ease;
  display: block;
}

.text-wrapper-87 {
  flex: 1;
  padding: 10px;
  text-align: right;
  color: #29546A;
  font-weight: 600;
}

.text-wrapper-87 p {
  margin: 0;
  line-height: 1.5;
}

.info-box-87.text-box-hover-87:hover {
  transform: translateY(-2px);
}

.info-box-87:hover .image-wrapper-87 img {
  transform: scale(1.05);
  filter: brightness(1.1);
}

@media (max-width: 991px) {
  .info-box-87 {
    width: calc(33.333% - 20px);
  }
  .image-wrapper-87 {
    flex: 0 0 18%;
    margin-right: 0;
  }
  .text-wrapper-87 {
    flex-basis: 82%;
    text-align: right;
    direction: rtl;
    align-self: flex-start;
  }
}

@media (max-width: 767px) {
  .info-box-87 {
    width: calc(100% - 20px);
    flex-direction: row;
    align-items: center;
  }
  .image-wrapper-87 {
    flex: 0 0 18%;
    margin: 0;
  }
  .text-wrapper-87 {
    flex-basis: 82%;
    text-align: right;
    font-size: 1.4em;
  }
}


/* ===== SLIDER 99 - FIXED HOVER WITH CONTAINER HEIGHT ===== */
.slider99 {
  position: relative;
  width: 100%;
  overflow: hidden;
  padding: 2px;
  box-sizing: border-box;
}

.slide99 {
  display: none;
  flex-direction: column;
  width: 100%;
}

.slide99.active99 {
  display: flex;
}

.row99 {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 10px;
}

.row99 a {
  flex: 0 0 calc(25% - 8px);
  position: relative;
  display: block;
  text-decoration: none;
  overflow: hidden;
  margin-bottom: 2px;
  height: 140px;  /* ? FIXED height for hover containment */
}

.row99 img {
  width: 100%;
  height: 100%;      /* ? Fill container */
  object-fit: cover;
  border: 1px solid #29546A;
  display: block;
  transition: transform .6s ease, filter .3s ease;
}

/* ===== CAPTION STRUCTURE - MATCHES ARTICLES WITH ICONS ===== */
.caption-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(41,84,106,0.85);
  padding: 6px;
  direction: rtl;
  box-sizing: border-box;
}

.caption-text {
  font-size: 14px;
  font-weight: 500;
  line-height: 1.5;
  color: #fff;
  display: inline;
}

.caption-text i.fa {
  margin-left: 4px;
  color: #fff;
  font-size: 12px;
}

/* RESPONSIVE */
@media (max-width: 991px) {
  .row99 a {
    flex: 0 0 calc(50% - 6px);
    height: 160px;  /* ? Bigger for larger font */
  }
  .caption-text {
    font-size: 16px;
  }
}

@media (max-width: 575px) {
  .row99 a {
    flex: 0 0 100%;
    height: 180px;  /* ? Mobile height */
  }
  .caption-text {
    font-size: 18px;
  }
}

@media (max-width: 360px) {
  .caption-text {
    font-size: 20px;
  }
  .row99 a {
    height: 200px;
  }
}

/* HOVER - IMAGE SCALE INSIDE FRAME */
.row99 a:hover img {
  transform: scale(1.05);
  filter: brightness(1.1);
}















/* from updates multimedia */

/* ===== SLIDER WRAPPER ===== */
.slider38{
  position:relative;
  width:100%;
  overflow:hidden;
  padding:0 2px;
  box-sizing:border-box;
}

/* ===== SLIDES ===== */
.image-slide38{
  display:none;
  flex-direction:column;
  width:100%;
}

.image-slide38.active38{
  display:flex;
}

/* ===== ROWS ===== */
.image-row38{
  display:flex;
  flex-wrap:wrap;
  margin:0;
  gap:0;
}

/* ===== LINKS ===== */
.image-row38 a{
  flex:0 0 25%;
  margin:0;
  position:relative;
  display:block;
  text-decoration:none;
  overflow:hidden;
}

/* ===== IMAGES ===== */
.image-row38 img{
  width:100%;
  height:auto;
  object-fit:cover;
  display:block;
  border:0;
  transition: transform .6s ease, filter .3s ease;
}

/* ===== CAPTIONS ===== */
.image-row38 span{
  position:absolute;
  bottom:0;
  left:0;
  width:100%;
  background:rgba(0,0,0,.6);
  color:#fff;
  padding:6px 5px;
  font-size:1em;
  text-align:center;
  line-height:1.4em;
  box-sizing:border-box;
}

/* ===== HOVER EFFECTS ===== */
.image-row38 a:hover img{
  transform:scale(1.05);
  filter:brightness(1.1);
}

.image-row38 a:hover span{
  background:rgba(0,0,0,.8);
}

/* ===== TABLET ===== */
@media (max-width:991px){
  .image-row38 a{
    flex:0 0 50%;
  }
}

/* ===== MOBILE ===== */
@media (max-width:575px){
  .image-row38 a{
    flex:0 0 100%;
  }
  .image-row38 span{
    font-size:1.1em;
    padding:10px 8px;
  }
}

/* ===== VERY SMALL ===== */
@media (max-width:360px){
  .image-row38 span{
    font-size:1.2em;
    line-height:1.3em;
  }
}

/* ===== NAV BUTTONS ===== */
.slider38-button {
  position: absolute;
  top: 15%;
  transform: translateY(-50%);
  background-color: rgba(41,84,106,1);
  color: white;
  border: 3px solid #29546a; /* added border */
  padding: 10px 15px;
  cursor: pointer;
  font-size: 18px;
  z-index: 10;
}

.slider38-button:hover {
  background-color:rgba(41,84,106,0.7);
}

#prevSlide38 {
  left:0;
}

#nextSlide38 {
  right:0;
}

/* =========================
   CONTENT BOX
========================= */
.content-box-alt {
  background: #29546A;
  color: #fff;
  text-align: center;
  border-radius: 0;
  margin: 10px 2px 2px 2px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
  overflow: auto;
}

/* =========================
   BUTTON ROW
========================= */
.btn-row-onyx {
  display: flex;
  justify-content: center;
  flex-wrap: nowrap;
  direction: rtl;
  margin: 0;
  padding: 0;
}

.col-item {
  flex: 1;
  text-align: center;
  position: relative;
  overflow: hidden;
}

.col-item::after {
  content: "";
  position: absolute;
  top: 15%;
  bottom: 15%;
  left: 0;
  width: 1px;
  background: #fff;
}

.col-item:first-child::after {
  display: none;
}

.col-item a {
  display: inline-block;
  width: 100%;
  text-decoration: none;
}

/* =========================
   BUTTON STYLE
========================= */
.btn-amethyst {
  width: 100%;
  padding: 8px 16px;
  background: #29546a;
  color: #fff;
  border: none;
  border-radius: 0 0 5px 5px;
  font-size: 14px;
  cursor: pointer;
  transition:
    background-color 0.3s ease,
    transform 0.25s ease,
    box-shadow 0.25s ease,
    text-shadow 0.25s ease;
}

.btn-amethyst:hover {
  background: #397fa2;
  transform: translateY(-3px);
  box-shadow: 0 4px 12px rgba(255, 255, 255, 0.3);
  text-shadow: 0 5px 8px rgba(0, 0, 0, 0.9);
}

@media (max-width: 991px) {
  .btn-amethyst {
    font-size: 12px;
  }
}

@media (max-width: 767px) {
  .btn-row-onyx {
    flex-wrap: wrap;
    justify-content: flex-start;
  }

  .col-item {
    flex: 1 1 calc(33.33% - 5px);
    margin: 0 3px 5px 0;
    border-radius: 5px 5px 0 0;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  }

  .col-item::after {
    display: none;
  }

  .content-box-alt {
    padding-top: 0 !important;
  }
}

















/* from updates news */



















/* from news pages */

.text-container-with-shadow {
  background: #fff;
  border-radius: 5px;
  padding: 30px;
  margin: -5px 0 30px 0;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
  position: relative;
  border-top: 6px solid #eee;
}

.news-title-39 {
  font-family: 'Vazir', sans-serif;
  font-weight: 600;
  color: #29546A;
  padding-top: 5px; 
  font-size: 22px; 
  line-height: 1.6;
  text-align: right; 
}

.news-date-39 {
  font-family: 'Vazir', sans-serif;
  color: #555;
  display: block;
  text-align: left;        
  font-size: 0.8em;     
  line-height: 1;     
  margin: -15px 0 10px 0;   
}

.news-author-39 {
  font-family: 'Vazir', sans-serif;
  font-size: 18px;
  font-weight: 500;
  color: #29546A;
  padding-bottom: 15px; /* closer to title */
  line-height: 1.5;
}

.news-body-39 {
  font-family: 'Vazir', sans-serif;
  color: #333;
  line-height: 1.8;
  font-size: 16px; /* unified size */
}

.news-image-39 {
    width: 40%;
    margin-right: 10px;
    border: 1px solid #29546A;
    border-radius: 5px;
    float: left;
}

/* MOBILE (?767px) */
@media (max-width: 767px) {
	
  .text-container-with-shadow {
  padding: 15px;
}

  .news-title-39 {
    font-size: 16px;
    padding-top: 0;
  }

  .news-author-39 {
    font-size: 13px;
}	

	.news-body-39 {
    font-size: 13px;
    line-height: 1.6;
  }
  
    .news-image-39 {
        width: 100%;
        margin-right: 0px;
        margin-bottom: 15px;
    }
}


.blu-button{display:inline-block;padding:5px 40px;color:#29546a;background-color:#fff;border:2px solid #29546a;border-radius:5px;margin-top:-5px;float:left;font-family:Vazir,sans-serif;font-size:1.1em;font-weight:600;text-decoration:none;transition:all .3s ease}
.blu-button:hover{color:#fff;background-color:#29546a;border-color:#29546a}



















/* from article pages */


/* DEFAULT styles (Tablet + PC: ?768px) */
.text-container-with-shadow {
  background: #fff;
  border-radius: 5px;
  padding: 30px;
  margin: -5px 0 30px 0;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
  position: relative;
  border-top: 6px solid #eee;
}

.article-title-39 {
  font-family: 'Vazir', sans-serif;
  font-weight: 600;
  color: #29546A;
  direction: rtl;
  padding-top: 5px; /* more space from top */
  font-size: 22px; /* one size smaller */
  line-height: 1.6;
  text-align: center; /* centers the text */
}

.article-author-39 {
  font-family: 'Vazir', sans-serif;
  font-size: 18px;
  font-weight: 500;
  color: #29546A;
  padding-bottom: 15px; /* closer to title */
  line-height: 1.5;
  text-align: right; /* replaces align="right" */
}

.article-body-39 {
  font-family: 'Vazir', sans-serif;
  color: #333;
  line-height: 1.8;
  font-size: 16px; /* unified size */
  direction: rtl;  /* replaces dir="rtl" */
  text-align: justify; /* replaces align="justify" */
}

.article-image-39 {
    width: 40%;
    margin-right: 10px;
    border: 1px solid #29546A;
    border-radius: 5px;
    float: left;
}

/* MOBILE (?767px) */
@media (max-width: 767px) {
	
  .text-container-with-shadow {
  padding: 15px;
}

  .article-title-39 {
    font-size: 24px;
    padding-top: 0;
  }

  .article-author-39 {
    font-size: 20px;
}	
	.article-body-39 {
    font-size: 18px;
    line-height: 1.6;
  }
  
    .article-image-39 {
        width: 100%;
        margin-right: 0px;
        margin-bottom: 15px;
    }
}


.article-summary {
    margin-top: 25px;
    padding: 20px;
    background: #f8f9fa;
    border-radius: 6px;
    border-right: 4px solid #29546a;
    direction: rtl;
    font-family: 'Vazir', sans-serif;
    -webkit-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;
    cursor: text;
}

.summary-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: 1px solid #dee2e6;
}

.summary-title {
    color: #29546a;
    font-size: 16px;
    font-weight: 600;
    margin: 0;
}

.summary-actions {
    display: flex;
    gap: 15px;
}

.summary-action {
    font-size: 13px;
    color: #495057;
    text-decoration: none;
    transition: color 0.2s;
    display: flex;
    align-items: center;
    gap: 5px;
}

.summary-action:hover {
    color: #29546a;
    text-decoration: underline;
}

.summary-action i {
    font-size: 12px;
}

.summary-card {
    background: white;
    padding: 15px;
    border-radius: 4px;
    border: 1px solid #dee2e6;
    line-height: 1.8;
    font-size: 14px;
	text-align: justify;
    margin-bottom: 10px;
}

.copy-notification {
    position: fixed;
    bottom: 300px; /* ? تغيير اين عدد به مقدار دلخواه */
    left: 50%;
    transform: translateX(-50%);
    background: #29546a;
    color: white;
    padding: 12px 24px;
    border-radius: 5px;
    z-index: 10000;
    font-family: 'Vazir', sans-serif;
    direction: rtl;
    box-shadow: 0 3px 10px rgba(0,0,0,0.15);
    animation: fadeInOut 2s ease;
    display: none;
}

@keyframes fadeInOut {
    0% { opacity: 0; bottom: 290px; } /* - 10 */
    15% { opacity: 1; bottom: 300px; } 
    85% { opacity: 1; bottom: 300px; } 
    100% { opacity: 0; bottom: 290px; } /* - 10 */
}

/* MOBILE (?767px) */
@media (max-width: 767px) {
	.summary-card {
    font-size: 14px;
}

.copy-notification {
    bottom: 600px; /* ? تغيير اين عدد به مقدار دلخواه */
}

@keyframes fadeInOut {
    0% { opacity: 0; bottom: 590px; } /* - 10 */
    15% { opacity: 1; bottom: 600px; }
    85% { opacity: 1; bottom: 600px; }
    100% { opacity: 0; bottom: 590px; } /* - 10 */
}
}
	

.responsive-image {
  width: 40%;
  margin-right: 10px;
}
@media only screen and (max-width: 480px) {
  .responsive-image {
    width: 100%;
    margin-right: 0;
    margin-bottom: 15px;
  }
}

.responsive-image-float-right {
  width: 40%;
  margin-left: 10px;
}
@media only screen and (max-width: 480px) {
  .responsive-image-float-right {
    width: 100%;
    margin-left: 0;
    margin-bottom: 10px;
  }
}
	
.responsive-image-float-right{width:40%;margin-left:10px}
@media only screen and (max-width:480px){.responsive-image-float-right{width:100%;margin-right:0;margin-bottom:10px}
}


.responsive-image-float-right2{width:30%;margin-left:10px}
@media only screen and (max-width:480px){
.responsive-image-float-right2{width:100%;margin-right:0;margin-bottom:10px}
}


.responsive-image-float-right3{width:50%;margin-left:10px}
@media only screen and (max-width:480px){.responsive-image-float-right3{width:100%;margin-right:0;margin-bottom:10px}}


.articles-container{display:flex;flex-direction:column;padding-top:10px;padding-bottom:10px;margin-left:0;margin-right:0;background-color:#EEE}
.left-column,.right-column{flex:1}
.vertical-line{width:1px;background-color:#999999;display:none;opacity:.6}
@media(min-width:992px){
.articles-container{flex-direction:row;align-items:stretch;margin-left:0;margin-right:0}
.left-column{order:1}
.vertical-line{display:block;height:auto;margin:0 15px;order:2}
.right-column{order:3}
}


.my-unique-text-box{width:100%;background-color:white;padding:15px;box-sizing:border-box}


.custom-bg1 { background-color: #add8e6; }  /* lightblue */
.custom-bg2 { background-color: #ffb6c1; }  /* lightpink */
.custom-bg3 { background-color: #fffacd; }  /* lightyellow */
.custom-bg4 { background-color: #90ee90; }  /* lightgreen */
.custom-bg5 { background-color: #e0ffff; }  /* lightcyan */
.custom-bg6 { background-color: #f08080; }  /* lightcoral */
.custom-bg7 { background-color: #cccccc; }  /* lightgoldenrodyellow */


  .styled-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 20px;
    font-size: 1.2em; /* or use specific px size like 16px */
    text-align: right;
    background-color: #f9f9f9;
    border: 1px solid #ccc;
    direction: rtl;
  }
  @media (max-width: 767px) {
	.styled-table {
    font-size: 1.4em; 
  }
  }
  
  
.articles-container2{display:flex;flex-direction:column}
.left-column,.right-column{flex:1}
.vertical-line2{width:1px;background-color:#29546A;display:none;opacity:.9}
@media(min-width:992px){.articles-container2{flex-direction:row;align-items:stretch}.left-column{order:1}.vertical-line2{display:block;height:auto;margin:0 15px;order:2}.right-column{order:3}}


  /* Apply right padding only on tablet and larger screens (?768px) */
  @media (min-width: 768px) {
    .padding-right-x1 {
      padding-right: 30px;
    }
    .padding-right-x2 {
      padding-right: 60px;
    }
    .padding-right-x3 {
      padding-right: 90px;
    }
  }

  /* Remove right padding on mobile */
  @media (max-width: 767.98px) {
    .padding-right-x1,
    .padding-right-x2,
    .padding-right-x3 {
      padding-right: 0;
    }
  }















/* my favorites */
.just-shadow{box-shadow:0 4px 8px rgba(0,0,0,.15),0 4px 8px rgba(0,0,0,.04);transition:box-shadow .3s ease}

.enlarge-hover {
  transition: transform 0.3s ease;
}
.enlarge-hover:hover {
  transform: scale(1.1); /* Enlarges 120% on hover */