سه شنبه ۱۳ آبان ۱۴۰۴ -
راهنمایی بهستان
body {
font-family: sans-serif;
direction: rtl;
background-color: #f0f0f0;
}
.az-container {
display: flex;
justify-content: center;
gap: 30px;
flex-wrap: wrap;
padding: 30px;
margin: 15px;
}
.az-box {
width: 250px;
background-color: white;
border-radius: 12px;
box-shadow: 0 16px 32px rgba(0,0,50,0.5);
display: flex;
flex-direction: column;
align-items: center;
padding: 25px 10px;
transition: all 0.3s ease;
opacity: 0;
transform: translateX(100px);
animation: slideIn 0.8s forwards;
}
/* انیمیشن ورود باکسها */
.az-box:nth-child(1) { animation-delay: 0.2s; }
.az-box:nth-child(2) { animation-delay: 0.4s; }
.az-box:nth-child(3) { animation-delay: 0.6s; }
keyframes slideIn {
to {
opacity: 1;
transform: translateX(0);
}
}
.az-box:hover {
transform: scale(1.05);
box-shadow: 0 16px 32px rgba(80,180,130,0.8);
}
.az-title {
font-size: 16px;
font-weight: bold;
color: #003366;
opacity: 0;
transform: translateX(60px);
animation: titleSlide 0.8s forwards;
text-align: center;
}
/* تاخیر انیمیشن برای عناوین */
.az-box:nth-child(1) .az-title { animation-delay: 0.4s; }
.az-box:nth-child(2) .az-title { animation-delay: 0.6s; }
.az-box:nth-child(3) .az-title { animation-delay: 0.8s; }
keyframes titleSlide {
to {
opacity: 1;
transform: translateX(0);
}
}
/* حالت موبایل */
media (max-width: 768px) {
.az-container {
flex-direction: column;
align-items: center;
gap: 15px;
padding: 20px;
}
.az-box {
width: 200px;
}
.az-box img {
width: 80px;
}
.az-title {
font-size: 14px;
}
}
اساتید
دانشجویان
کارکنان
