/*******************************************
 Default Pull-up and Pull-down styling
 Replace/modify/override to your preferences
*******************************************/

.iscroll-pullup {
    /* The wrapper is position:relative or position:absolute, so the pullUp is positioned here
       relative to the scroller, not the page. If we don't do this, the pullUp will initially
       appear briefly at the bottom of content if content is shorter than the wrapper.
    */
    position: absolute;    /* relative to the scroller */
    bottom:   120px;           /* at the bottom of the scroller */
    width:    100%;
}

.iscroll-bottom-spacer {
  height:180px;
}

.iscroll-pulldown,
.iscroll-pullup {
/*  background: #fff;*/
  height: 30px;
  border-radius:4px;
  line-height: 30px;    /* Center text vertically */
  font-weight: bold;
  font-size: 12px;
  color: #c0c0c0;
  text-shadow:none;
}


/* MSIE not supported by iScroll, so not MSIE transitions or animation  */
.iscroll-pulldown .iscroll-pull-icon,
.iscroll-pullup .iscroll-pull-icon  {
  margin-left: 0.5em;
  display: block;
  float: left;
  width:  30px;
  height: 30px;
  background: url(../../img/iscroll-pull-icon@2x.png) 0 0 no-repeat;
  -webkit-background-size: 30px 60px;
  -moz-background-size:  30px 60px;
  -o-background-size:  30px 60px;
  background-size:  30px 60px;
  -webkit-transition: -webkit-transform 250ms linear;
  -moz-transition: -moz-transform 250ms linear;
  -o-transition: -o-transform 250ms linear;
  transition: transform 250ms linear;
  -webkit-animation: none;
  -moz-animation: none;
  -o-animation: none;
  animation: none;
}

/* Note that translateZ(0) triggers hardware acceleration on WebKit browsers
   Acceleration is automatic on Mozilla */

.iscroll-pulldown .iscroll-pull-icon {
  -webkit-transform: rotate(0deg) translateZ(0);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg) translateZ(0);
  -webkit-animation: none;
  -moz-animation: none;
  -o-animation: none;
  animation: none;
}

.iscroll-pullup .iscroll-pull-icon  {
  -webkit-transform: rotate(-180deg) translateZ(0);
  -moz-transform: rotate(-180deg);
  -o-transform: rotate(-180deg);
  transform: rotate(-180deg) translateZ(0);
  -webkit-animation: none;
  -moz-animation: none;
  -o-animation: none;
  animation: none;
}

.iscroll-pulldown.iscroll-pull-pulled .iscroll-pull-icon {
  -webkit-transform: rotate(-180deg) translateZ(0);
  -moz-transform: rotate(-180deg);
  -o-transform: rotate(-180deg);
  transform: rotate(-180deg) translateZ(0);
}

.iscroll-pullup.iscroll-pull-pulled .iscroll-pull-icon {
  -webkit-transform: rotate(0deg) translateZ(0);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg) translateZ(0);
}

.iscroll-pulldown.iscroll-pull-loading .iscroll-pull-icon,.iscroll-pullup.iscroll-pull-loading .iscroll-pull-icon {	
	background: url("../../img/ajax-loader-3.gif") no-repeat scroll 5px 8px transparent !important;
	width:  60px;
	background-size:  43px 11px;	    
}

@-webkit-keyframes iscroll-pull-loading {
  from { -webkit-transform: rotate(0deg); }
  to { -webkit-transform: rotate(360deg); }
}

@-moz-keyframes iscroll-pull-loading {
  from { -moz-transform: rotate(0deg); }
  to { -moz-transform: rotate(360deg); }
}

@-o-keyframes iscroll-pull-loading {
  from { -o-transform: rotate(0deg); }
  to { -o-transform: rotate(360deg); }
}

@-keyframes iscroll-pull-loading {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}
