/*--------------مربوط به فید کردن متن مثلا در تگ p که باید حتما در یک div قرار گیرد با کلاس fade-1.5 ----------*/
		.fade_3s {
  /* font-family: 'IRANYekanXFaNum-Regular', sans-serif; 
  font-size: 60px;*/
  animation: fadeIn 3s;
  -webkit-animation: fadeIn 3s;
  -moz-animation: fadeIn 3s;
  -o-animation: fadeIn 3s;
  -ms-animation: fadeIn 3s;
}

@keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@-moz-keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@-webkit-keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@-o-keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@-ms-keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}
 /*-----------------------------------------------------------------------*/    		.fade_2s {
  /* font-family: 'IRANYekanXFaNum-Regular', sans-serif; 
  font-size: 60px;*/
  animation: fadeIn 2s;
  -webkit-animation: fadeIn 2s;
  -moz-animation: fadeIn 2s;
  -o-animation: fadeIn 2s;
  -ms-animation: fadeIn 2s;
}

@keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@-moz-keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@-webkit-keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@-o-keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@-ms-keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}
/*----------------------------------------------------------*/
 
 
 
/* کلاس برای چرخش 360 درجه */
.slide_rotate_360 {
  animation: rotateSlide360 1.5s ease-out;
  -webkit-animation: rotateSlide360 1.5s ease-out;
  -moz-animation: rotateSlide360 1.5s ease-out;
  -o-animation: rotateSlide360 1.5s ease-out;
  -ms-animation: rotateSlide360 1.5s ease-out;
}

@keyframes rotateSlide360 {
  from { 
    transform: translateX(-100px) rotate(-360deg); 
    opacity: 0; 
  }
  to { 
    transform: translateX(0) rotate(0); 
    opacity: 1; 
  }
}

@-moz-keyframes rotateSlide360 {
  from { transform: translateX(-100px) rotate(-360deg); opacity: 0; }
  to { transform: translateX(0) rotate(0); opacity: 1; }
}

@-webkit-keyframes rotateSlide360 {
  from { transform: translateX(-100px) rotate(-360deg); opacity: 0; }
  to { transform: translateX(0) rotate(0); opacity: 1; }
}

@-o-keyframes rotateSlide360 {
  from { transform: translateX(-100px) rotate(-360deg); opacity: 0; }
  to { transform: translateX(0) rotate(0); opacity: 1; }
}

@-ms-keyframes rotateSlide360 {
  from { transform: translateX(-100px) rotate(-360deg); opacity: 0; }
  to { transform: translateX(0) rotate(0); opacity: 1; }
}







/* کلاس برای چرخش 180 درجه */
.slide_rotate_180 {
  animation: rotateSlide180 1.5s ease-out;
  -webkit-animation: rotateSlide180 1.5s ease-out;
  -moz-animation: rotateSlide180 1.5s ease-out;
  -o-animation: rotateSlide180 1.5s ease-out;
  -ms-animation: rotateSlide180 1.5s ease-out;
}

@keyframes rotateSlide180 {
  from { 
    transform: translateX(-100px) rotate(-180deg); 
    opacity: 0; 
  }
  to { 
    transform: translateX(0) rotate(0); 
    opacity: 1; 
  }
}

@-moz-keyframes rotateSlide180 {
  from { transform: translateX(-100px) rotate(-180deg); opacity: 0; }
  to { transform: translateX(0) rotate(0); opacity: 1; }
}

@-webkit-keyframes rotateSlide180 {
  from { transform: translateX(-100px) rotate(-180deg); opacity: 0; }
  to { transform: translateX(0) rotate(0); opacity: 1; }
}

@-o-keyframes rotateSlide180 {
  from { transform: translateX(-100px) rotate(-180deg); opacity: 0; }
  to { transform: translateX(0) rotate(0); opacity: 1; }
}

@-ms-keyframes rotateSlide180 {
  from { transform: translateX(-100px) rotate(-180deg); opacity: 0; }
  to { transform: translateX(0) rotate(0); opacity: 1; }
}






/* کلاس برای چرخش 180 درجه */
.slide_rotate_45 {
  animation: rotateSlide45 1s ease-out;
  -webkit-animation: rotateSlide45 1s ease-out;
  -moz-animation: rotateSlide45 11s ease-out;
  -o-animation: rotateSlide45 1s ease-out;
  -ms-animation: rotateSlide45 1s ease-out;
}

@keyframes rotateSlide45 {
  from { 
    transform: translateX(-100px) rotate(-45deg); 
    opacity: 0; 
  }
  to { 
    transform: translateX(0) rotate(0); 
    opacity: 1; 
  }
}

@-moz-keyframes rotateSlide180 {
  from { transform: translateX(-100px) rotate(-45deg); opacity: 0; }
  to { transform: translateX(0) rotate(0); opacity: 1; }
}

@-webkit-keyframes rotateSlide180 {
  from { transform: translateX(-100px) rotate(-45deg); opacity: 0; }
  to { transform: translateX(0) rotate(0); opacity: 1; }
}

@-o-keyframes rotateSlide180 {
  from { transform: translateX(-100px) rotate(-45deg); opacity: 0; }
  to { transform: translateX(0) rotate(0); opacity: 1; }
}

@-ms-keyframes rotateSlide180 {
  from { transform: translateX(-100px) rotate(-45deg); opacity: 0; }
  to { transform: translateX(0) rotate(0); opacity: 1; }
}











 
 
 
 .slide_up {
  animation: slideFromBottom 1.5s ease-out;
  -webkit-animation: slideFromBottom 1.5s ease-out;
  -moz-animation: slideFromBottom 1.5s ease-out;
  -o-animation: slideFromBottom 1.5s ease-out;
  -ms-animation: slideFromBottom 1.5s ease-out;
}

@keyframes slideFromBottom {
  0% {
    transform: translateY(100px); /* شروع از پایین */
    opacity: 0; /* اختیاری */
  }
  100% {
    transform: translateY(0);
    opacity: 1; /* اختیاری */
  }
}

@-moz-keyframes slideFromBottom {
  0% { transform: translateY(100px); opacity: 0; }
  100% { transform: translateY(0); opacity: 1; }
}

@-webkit-keyframes slideFromBottom {
  0% { transform: translateY(100px); opacity: 0; }
  100% { transform: translateY(0); opacity: 1; }
}

@-o-keyframes slideFromBottom {
  0% { transform: translateY(100px); opacity: 0; }
  100% { transform: translateY(0); opacity: 1; }
}

@-ms-keyframes slideFromBottom {
  0% { transform: translateY(100px); opacity: 0; }
  100% { transform: translateY(0); opacity: 1; }
}






      
.slide_down { /* تغییر نام کلاس به slide_down */
  animation: slideFromTop 1.5s ease-out;
  -webkit-animation: slideFromTop 1.5s ease-out;
  -moz-animation: slideFromTop 1.5s ease-out;
  -o-animation: slideFromTop 1.5s ease-out;
  -ms-animation: slideFromTop 1.5s ease-out;
}

@keyframes slideFromTop {
  0% { 
    transform: translateY(-100px); /* تغییر از X به Y برای حرکت عمودی */
    opacity: 0; /* اختیاری: برای افکت محو شدن همزمان */
  }
  100% { 
    transform: translateY(0);
    opacity: 1; /* اختیاری */
  }
}

@-moz-keyframes slideFromTop {
  0% { transform: translateY(-100px); opacity: 0; }
  100% { transform: translateY(0); opacity: 1; }
}

@-webkit-keyframes slideFromTop {
  0% { transform: translateY(-100px); opacity: 0; }
  100% { transform: translateY(0); opacity: 1; }
}

@-o-keyframes slideFromTop {
  0% { transform: translateY(-100px); opacity: 0; }
  100% { transform: translateY(0); opacity: 1; }
}

@-ms-keyframes slideFromTop {
  0% { transform: translateY(-100px); opacity: 0; }
  100% { transform: translateY(0); opacity: 1; }
}
 
 
 
      
      
.slide_left { /*حرکت اسلاید از چپ */
  /* font-family: 'IRANYekanXFaNum-Regular', sans-serif; */
  /* font-size: 60px; */
  animation: slideFromLeft 1s;
  -webkit-animation: slideFromLeft 1s;
  -moz-animation: slideFromLeft 1s;
  -o-animation: slideFromLeft 1s;
  -ms-animation: slideFromLeft 1s;
}

@keyframes slideFromLeft {
  0% { 
    transform: translateX(-100px); /* شروع از چپ (100px خارج صفحه) */
  }
  100% { 
    transform: translateX(0); /* حرکت به موقعیت اصلی */
  }
}

@-moz-keyframes slideFromLeft {
  0% { transform: translateX(-100px); }
  100% { transform: translateX(0); }
}

@-webkit-keyframes slideFromLeft {
  0% { transform: translateX(-100px); }
  100% { transform: translateX(0); }
}

@-o-keyframes slideFromLeft {
  0% { transform: translateX(-100px); }
  100% { transform: translateX(0); }
}

@-ms-keyframes slideFromLeft {
  0% { transform: translateX(-100px); }
  100% { transform: translateX(0); }
}
 
 
 
 
 
 .slide_right { /*حرکت اسلاید از راست*/
  /* font-family: 'IRANYekanXFaNum-Regular', sans-serif; */
  /* font-size: 60px; */
  animation: slideFromright 1s;
  -webkit-animation: slideFromright 1s;
  -moz-animation: slideFromright 1s;
  -o-animation: slideFromright 1s;
  -ms-animation: slideFromright 1s;
}

@keyframes slideFromright {
  0% { 
    transform: translateX(100px); /* شروع از چپ (100px خارج صفحه) */
  }
  100% { 
    transform: translateX(0); /* حرکت به موقعیت اصلی */
  }
}

@-moz-keyframes slideFromright {
  0% { transform: translateX(100px); }
  100% { transform: translateX(0); }
}

@-webkit-keyframes slideFromright {
  0% { transform: translateX(100px); }
  100% { transform: translateX(0); }
}

@-o-keyframes slideFromright {
  0% { transform: translateX(100px); }
  100% { transform: translateX(0); }
}

@-ms-keyframes slideFromLeft {
  0% { transform: translateX(100px); }
  100% { transform: translateX(0); }
}     
   
   
   
   
   
 .zoom_effect {
  animation: pureZoom 2s cubic-bezier(0.175, 0.885, 0.32, 1.1) forwards;/*1s سرعت زوم است که هر چه کمتر باشد سریعتر است*/
  -webkit-animation: pureZoom 2s cubic-bezier(0.175, 0.885, 0.32, 1.1) forwards;
  -moz-animation: pureZoom 2s cubic-bezier(0.175, 0.885, 0.32, 1.1) forwards;
  -o-animation: pureZoom 2s cubic-bezier(0.175, 0.885, 0.32, 1.1) forwards;
}

@keyframes pureZoom {
  0% { 
    transform: scale(0);
    opacity: 0;
  }
  100% { 
    transform: scale(1);
    opacity: 1;
  }
}

@-moz-keyframes pureZoom {
  0% { transform: scale(0); opacity: 0; }
  100% { transform: scale(1); opacity: 1; }
}

@-webkit-keyframes pureZoom {
  0% { transform: scale(0); opacity: 0; }
  100% { transform: scale(1); opacity: 1; }
}

@-o-keyframes pureZoom {
  0% { transform: scale(0); opacity: 0; }
  100% { transform: scale(1); opacity: 1; }
}