.myitem{
    width: 100%;
    height: 25rem;
    cursor: pointer;
}

.myitem img{
    height: 100%;
    width: 100%;
    cursor: pointer;
}
.text00{
    display: block;
    /* animation-name:  zoomIn; */
    animation-duration: 1s;
}




.text01{
    /* animation-name:  zoomIn; */
    animation-duration: 1s;
    display: none;
}



@keyframes example { 
    0% {
      opacity: 0;
      transform: translateY(0px);
    }
  
    25% {
      opacity: 0.25;
      
    }
    50% {
        opacity: 0.5;
        transform: translateY(30px);
      }
      75% {
        opacity: 0.75;
        
      }
      100% {
        opacity: 1;
        transform: translateY(0px);
      }
  }






  /* slder */

  /* external css: flickity.css */



#pezeshsl .carousel {
  background:transparent;
}

#pezeshsl .carousel-cell {
  width: 28%;
  height: 200px;
  margin-right: 10px;
  /* background: #8C8; */
  border-radius: 5px;
  counter-increment: carousel-cell;
}

#pezeshsl .carousel-cell.is-selected {
  /* background: #ED2; */
}

/* cell number */
#pezeshsl .carousel-cell:before {
  display: block;
  text-align: center;
  /* content: counter(carousel-cell); */
  line-height: 200px;
  font-size: 80px;
  color: white;
}

#pezeshsl .flickity-viewport{
  height: 38rem !important;
}





/* slider 2 */


#slderkha .carousel .carousel-cell:nth-child(odd) {
  /* background-color: red; */
}

#slderkha .carousel .carousel-cell:nth-child(even) {
  /* background-color: green; */
}

#slderkha .carousel-cell {
  width: 90%; /* half-width */
  /* line-height: 160px; */
  margin-right: 10px;
  transition: transform 0.3s linear;
}

#slderkha .carousel-cell:not(.is-selected) {
    transform: scale(0.9);
}

#slderkha .flickity-button{
  background-color: transparent !important;
}
#slderkha .flickity-prev-next-button {
  top: 20% !important;
}
#slderkha .flickity-prev-next-button.next{
  right: -40px !important;
}
#slderkha .flickity-prev-next-button.previous{
  left: -50px !important;
}


#slderkha .card:hover{
  background-color: #dbdddb;
}

#slderkha .card{
  width: 80%;
  /* margin-left: 0; */
  margin: auto;
  display: block;
}










/* slder 3 */

#wbslder .carousel .carousel-cell:nth-child(odd) {
  /* background-color: red; */
}

#wbslder .carousel .carousel-cell:nth-child(even) {
  /* background-color: green; */
}

#wbslder .carousel-cell {
  width: 90%; /* half-width */
  /* line-height: 160px; */
  margin-right: 10px;
  transition: transform 0.3s linear;
}

#wbslder .carousel-cell:not(.is-selected) {
    transform: scale(0.9);
}



#wbslder .flickity-prev-next-button.next{
  right: 100px !important;
}
#wbslder .flickity-prev-next-button.previous{
  left: 100px !important;
}
 .flickity-page-dots{
  display: none;
}
/* #wbslder .flickity-button{
  display: none;
} */


.flickity-prev-next-button .flickity-button-icon{
  width: 20px;
  height: 20px;
  top: 25%;
  left: 25%;
}



/* slder3 */

#khadmatsldr .carousel .carousel-cell:nth-child(odd) {
  /* background-color: red; */
}

#khadmatsldr .carousel .carousel-cell:nth-child(even) {
  /* background-color: green; */
}

#khadmatsldr .carousel-cell {
  width: 90%; /* half-width */
  /* line-height: 160px; */
  margin-right: 10px;
  transition: transform 0.3s linear;
}

#khadmatsldr .carousel-cell:not(.is-selected) {
    transform: scale(0.9);
}




#khadmatsldr .flickity-page-dots{
  display: none;
}

#khadmatsldr .flickity-viewport{
  text-align: center;
}
#khadmatsldr .flickity-button{
  background-color: transparent !important;
}







.prev-button, .next-button {
  position: absolute;
  padding: 10px;
  top: 20px;
  font-size: inherit;
  z-index: 2;
}

.prev-button {
  left: 10px;
}

.next-button {
  right: 10px;
}


.flickity-button-icon{
  fill: gray;
}









/* slder 5 */


/** posts slider widget **/
/** page structure **/
#w {
  display: block;
  max-width: 830px;
  min-width: 300px;
  margin: 0 auto;
  padding: 2px 3px;
}

.crsl-items {
  display: block;
  padding: 5px;
}

.crsl-item {
  background: #fff;
  padding: 8px;
  -webkit-box-shadow: 0 2px 3px rgba(0,0,0,0.4);
  -moz-box-shadow: 0 2px 3px rgba(0,0,0,0.4);
  box-shadow: 0 2px 3px rgba(0,0,0,0.4);
}

.crsl-item .thumbnail {
  display: block;
  position: relative;
  margin-bottom: 10px;
  cursor: pointer;
}
.crsl-item .thumbnail img { 
  display: block; /* fix 1px image space http://stackoverflow.com/q/5804256/477958 */
  -webkit-transition: all 0.3s linear;
  -moz-transition: all 0.3s linear;
  transition: all 0.3s linear;
}
.crsl-item .thumbnail:hover img {
  opacity: 0.8;
}

.crsl-item h3 {
  font-family: 'Oswald', 'Trebuchet MS', Helvetica, sans-serif;
  font-size: 1.95em;
  line-height: 1.25em;
  margin-bottom: 12px;
}
.crsl-item h3 a {
  text-decoration: none;
  color: #333;
}
.crsl-item h3 a:hover {
  text-decoration: underline;
}

.crsl-item .postdate {
  display: block;
  position: absolute;
  bottom: 0;
  right: 0;
  padding: 6px;
  color: #fff;
  text-shadow: 1px 1px 0 rgba(0,0,0,0.4);
  font-size: 1.2em;
  font-weight: bold;
  background: #4e90da;
}

.crsl-item p {
  font-size: 1.2em;
  line-height: 1.55em;
  margin-bottom: 5px;
}

.crsl-item p.readmore a {
  display: block;
  float: right;
  color: #4e90da;
  padding: 3px 5px;
  text-decoration: none;
  font-weight: bold;
  -webkit-border-radius: 3px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}
.crsl-item p.readmore a:hover {
  background: #4b6caa;
  color: #fff;
}


/** posts slider nav **/
.slidernav {
  display: block;
  text-align: center;
  margin-bottom: 5px;
}

.slidernav a {
  display: inline-block;
  padding: 5px 8px;
  margin-right: 8px;
  font-size: 1.4em;
  background: #fff;
  color: #666;
  text-decoration: none;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  -webkit-box-shadow: 2px 2px 0px rgba(0,0,0,0.2);
  -moz-box-shadow: 2px 2px 0px rgba(0,0,0,0.2);
  box-shadow: 2px 2px 0px rgba(0,0,0,0.2);
}
.slidernav a:active {
  -webkit-box-shadow: 1px 1px 0 rgba(0,0,0,0.2);
  -moz-box-shadow: 1px 1px 0 rgba(0,0,0,0.2);
  box-shadow: 1px 1px 0 rgba(0,0,0,0.2);
}

