/*banner*/
.swiper-slide-active .alm_fir1{animation: fir1 1s;-moz-animation: fir1 1s;-webkit-animation: fir1 1s;-o-animation: fir1 1s}
.swiper-slide-active .alm_fir2{animation: fir1 1.5s;-moz-animation: fir1 1.5s;-webkit-animation: fir1 1.5s;-o-animation: fir1 1.5s}
.swiper-slide-active .alm_fir3{animation: fir1 2s;-moz-animation: fir1 2s;-webkit-animation: fir1 2s;-o-animation: fir1 2s}
.swiper-slide-active .alm_fir4{animation: fir1 2.5s;-moz-animation: fir1 2.5s;-webkit-animation: fir1 2.5s;-o-animation: fir1 2.5s}
.swiper-slide-active .alm_fir5{animation: fir1 3s;-moz-animation: fir1 3s;-webkit-animation: fir1 3s;-o-animation: fir1 3s}
.swiper-slide-active .alm_fir6{animation: fir2 3s;-moz-animation: fir2 1.5s;-webkit-animation: fir2 1.5s;-o-animation: fir2 1.5s;animation-fill-mode: forwards;-webkit-animation-fill-mode: forwards}
.swiper-slide-active .alm_rollIn1{animation: rollIn 1.5s;-moz-animation: rollIn 1.5s;-webkit-animation: rollIn 1.5s;-o-animation: rollIn 1.5s}

.swiper-slide-active .alm_fil1{animation: fil1 1s;-moz-animation: fil1 1s;-webkit-animation: fil1 1s;-o-animation: fir1 1s}
.swiper-slide-active .alm_fil2{animation: fil1 1.5s;-moz-animation: fil1 1.5s;-webkit-animation: fil1 1.5s;-o-animation: fil1 1.5s}
.swiper-slide-active .alm_fil3{animation: fil1 2s;-moz-animation: fil1 2s;-webkit-animation: fil1 2s;-o-animation: fir1 2s}
.swiper-slide-active .alm_fil4{animation: fil1 2.5s;-moz-animation: fil1 2.5s;-webkit-animation: fil1 2.5s;-o-animation: fil1 2.5s}
.swiper-slide-active .alm_fil5{animation: fil1 3s;-moz-animation: fil1 3s;-webkit-animation: fil1 3s;-o-animation: fir1 3s}
/*fadeInleft1*/
@-webkit-keyframes fil1 {
0% {opacity: 0;-webkit-transform: translateX(-300px);}
100% {opacity: 1;-webkit-transform: translateX(0);}
}
@-moz-keyframes fil1 {
0% {opacity: 0;-moz-transform: translateX(-300px);}
100% {opacity: 1;-moz-transform: translateX(0);}
}
@-o-keyframes fil1 {
0% {opacity: 0;-o-transform: translateX(-300px);}
100% {opacity: 1;-o-transform: translateX(0);}
}
@keyframes fil1 {
0% {opacity: 0;transform: translateX(-300px);}
100% {opacity: 1;transform: translateX(0);}
}

/*fadeInRight1*/
@-webkit-keyframes fir1 {
0% {opacity: 0;-webkit-transform: translateX(300px);}
100% {opacity: 1;-webkit-transform: translateX(0);}
}
@-moz-keyframes fir1 {
0% {opacity: 0;-moz-transform: translateX(300px);}
100% {opacity: 1;-moz-transform: translateX(0);}
}
@-o-keyframes fir1 {
0% {opacity: 0;-o-transform: translateX(300px);}
100% {opacity: 1;-o-transform: translateX(0);}
}
@keyframes fir1 {
0% {opacity: 0;transform: translateX(300px);}
100% {opacity: 1;transform: translateX(0);}
}
/*fadeInRight2*/
@-webkit-keyframes fir2 {
0% {opacity: 0;-webkit-transform: translateX(100px);}
100% {opacity: 1;-webkit-transform: translateX(0);}
}
@-moz-keyframes fir2 {
0% {opacity: 0;-moz-transform: translateX(100px);}
100% {opacity: 1;-moz-transform: translateX(0);}
}
@-o-keyframes fir2 {
0% {opacity: 0;-o-transform: translateX(100px);}
100% {opacity: 1;-o-transform: translateX(0);}
}
@keyframes fir2 {
0% {opacity: 0;transform: translateX(200px);}
100% {opacity: 1;transform: translateX(0);}
}

.menuicon-in span.menuicon-top{animation: menuInx 1s;-moz-animation: menuInx 1s;-webkit-animation: menuInx 1s;-o-animation: menuInx 1s;animation-fill-mode: forwards;-webkit-animation-fill-mode: forwards}
.menuicon-in span.menuicon-bottom{animation: menuIny 1s;-moz-animation: menuIny 1s;-webkit-animation: menuIny 1s;-o-animation: menuIny 1s;animation-fill-mode: forwards;-webkit-animation-fill-mode: forwards}

.menuicon-out span.menuicon-top{animation: menuOutx 1s;-moz-animation: menuOutx 1s;-webkit-animation: menuOutx 1s;-o-animation: menuOutx 1s;animation-fill-mode: forwards;-webkit-animation-fill-mode: forwards}
.menuicon-out span.menuicon-bottom{animation: menuOuty 1s;-moz-animation: menuOuty 1s;-webkit-animation: menuOuty 1s;-o-animation: menuOuty 1s;animation-fill-mode: forwards;-webkit-animation-fill-mode: forwards}

@-webkit-keyframes menuInx {0% {-webkit-transform: rotate(0);}100% {-webkit-transform: rotate(-45deg);}}
@-moz-keyframes menuInx {0% {-moz-transform: rotate(0);}100% {-moz-transform: rotate(-45deg);}}
@-o-keyframes menuInx {0% {-o-transform: rotate(0);}100% {-o-transform: rotate(-45deg);}}
@keyframes menuInx {0% {transform: rotate(0);}100% {transform: rotate(-45deg);}}

@-webkit-keyframes menuIny {0% {-webkit-transform: rotate(0);}100% {-webkit-transform: rotate(45deg);}}
@-moz-keyframes menuIny {0% {-moz-transform: rotate(0);}100% {-moz-transform: rotate(45deg);}}
@-o-keyframes menuIny {0% {-o-transform: rotate(0);}100% {-o-transform: rotate(45deg);}}
@keyframes menuIny {0% {transform: rotate(0);}100% {transform: rotate(45deg);}}

@-webkit-keyframes menuOutx {0% {-webkit-transform: rotate(-45deg);top:8px}100% {-webkit-transform: rotate(0);top:5px}}
@-moz-keyframes menuOutx {0% {-moz-transform: rotate(-45deg);top:8px}100% {-moz-transform: rotate(0);top:5px}}
@-o-keyframes menuOutx {0% {-o-transform: rotate(-45deg);top:8px}100% {-o-transform: rotate(0);top:5px}}
@keyframes menuOutx {0% {transform: rotate(-45deg);top:8px}100% {transform: rotate(0);top:5px}}

@-webkit-keyframes menuOuty {0% {-webkit-transform: rotate(45deg);top:8px}100% {-webkit-transform: rotate(0);top:12px}}
@-moz-keyframes menuOuty {0% {-moz-transform: rotate(45deg);top:8px}100% {-moz-transform: rotate(0);top:12px}}
@-o-keyframes menuOuty {0% {-o-transform: rotate(45deg);top:8px}100% {-o-transform: rotate(0);top:12px}}
@keyframes menuOuty {0% {transform: rotate(45deg);top:8px}100% {transform: rotate(0);top:12px}}


/*fadeInUp*/
.alm_fadeInUp{animation: fadeInUp 1.5s;-moz-animation: fadeInUp 1.5s;webkit-animation: fadeInUp 1.5s;-o-animation: fadeInUp 1.5s}
/*fadeInDown*/
.alm_fadeInDown{animation: fadeInDown 1.5s;-moz-animation: fadeInDown 1.5s;webkit-animation: fadeInDown 1.5s;-o-animation: fadeInDown 1.5s}
/*fadeOut*/
.alm_fadeOut{animation: fadeOut 1.5s;-moz-animation: fadeOut 1.5s;webkit-animation: fadeOut 1.5s;-o-animation: fadeOut 1.5s}
/*fadeIn*/
.alm_fadeIn{animation: fadeIn 1.5s;-moz-animation: fadeIn 1.5s;webkit-animation: fadeIn 1.5s;-o-animation: fadeIn 1.5s}
/*pulse*/
.alm_pulse{animation: pulse 1.5s;-moz-animation: pulse 1.5s;webkit-animation: pulse 1.5s;-o-animation: pulse 1.5s}
/*flipInX*/
.alm_flipInX{animation: flipInX 1.5s;-moz-animation: flipInX 1.5s;webkit-animation: flipInX 1.5s;-o-animation: flipInX 1.5s}
/*flipOutX*/
.alm_flipOutX{animation: flipOutX 1.5s;-moz-animation: flipOutX 1.5s;webkit-animation: flipOutX 1.5s;-o-animation: flipOutX 1.5s}
/*flipInY*/
.alm_flipInY{animation: flipInY 1.5s;-moz-animation: flipInY 1.5s;webkit-animation: flipInY 1.5s;-o-animation: flipInY 1.5s}
/*flipOutY*/
.alm_flipOutY{animation: flipOutY 1.5s;-moz-animation: flipOutY 1.5s;webkit-animation: flipOutY 1.5s;-o-animation: flipOutY 1.5s}
/*fadeInLeft*/
.alm_fadeInLeft{animation: fadeInLeft 1.5s;-moz-animation: fadeInLeft 1.5s;webkit-animation: fadeInLeft 1.5s;-o-animation: fadeInLeft 1.5s}
/*fadeInRight*/
.alm_fadeInRight{animation: fadeInRight 1.5s;-moz-animation: fadeInRight 1.5s;webkit-animation: fadeInRight 1.5s;-o-animation: fadeInRight 1.5s}
/*bounceIn*/
.alm_bounceIn{animation: bounceIn 1.5s;-moz-animation: bounceIn 1.5s;webkit-animation: bounceIn 1.5s;-o-animation: bounceIn 1.5s}
/*rotateIn*/
.alm_rotateIn{animation: rotateIn 1.5s;-moz-animation: rotateIn 1.5s;webkit-animation: rotateIn 1.5s;-o-animation: rotateIn 1.5s}
/*rollIn*/
.alm_rollIn{animation: rollIn 1.5s;-moz-animation: rollIn 1.5s;webkit-animation: rollIn 1.5s;-o-animation: rollIn 1.5s}
/*leftSpring*/
.alm_leftSpring{animation: leftSpring 1.5s;-moz-animation: leftSpring 1.5s;webkit-animation: leftSpring 1.5s;-o-animation: leftSpring 1.5s}





@-webkit-keyframes fadeOut {
0% {opacity: 1;}
100% {opacity: 0;}
}
@-moz-keyframes fadeOut {
0% {opacity: 1;}
100% {opacity: 0;}
}
@-o-keyframes fadeOut {
0% {opacity: 1;}
100% {opacity: 0;}
}
@keyframes fadeOut {
0% {opacity: 1;}
100% {opacity: 0;}
}
.fadeOut {
-webkit-animation-name: fadeIn;
-moz-animation-name: fadeIn;
-o-animation-name: fadeIn;
animation-name: fadeIn;
}

@-webkit-keyframes pulse {
0% { -webkit-transform: scale(1); }50% {-webkit-transform: scale(1.1); }
100% { -webkit-transform: scale(1); }
}
@-moz-keyframes pulse {
0% { -moz-transform: scale(1); }
50% { -moz-transform: scale(1.1); }
100% { -moz-transform: scale(1); }
}
@-o-keyframes pulse {
0% { -o-transform: scale(1); }
50% { -o-transform: scale(1.1); }
100% { -o-transform: scale(1); }
}
@keyframes pulse {
0% { transform: scale(1); }
50% { transform: scale(1.1); }
100% { transform: scale(1); }
}
.pulse {
-webkit-animation-name: pulse;
-moz-animation-name: pulse;
-o-animation-name: pulse;
animation-name: pulse;
}
@-webkit-keyframes flipInX {
0% {
-webkit-transform: perspective(400px) rotateX(90deg);
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotateX(-10deg);
}
70% {
-webkit-transform: perspective(400px) rotateX(10deg);
}
100% {
-webkit-transform: perspective(400px) rotateX(0deg);
opacity: 1;
}
}
@-moz-keyframes flipInX {
0% {
-moz-transform: perspective(400px) rotateX(90deg);
opacity: 0;
}
40% {
-moz-transform: perspective(400px) rotateX(-10deg);
}
70% {
-moz-transform: perspective(400px) rotateX(10deg);
}
100% {
-moz-transform: perspective(400px) rotateX(0deg);
opacity: 1;
}
}
@-o-keyframes flipInX {
0% {
-o-transform: perspective(400px) rotateX(90deg);
opacity: 0;
}
40% {
-o-transform: perspective(400px) rotateX(-10deg);
}
70% {
-o-transform: perspective(400px) rotateX(10deg);
}
100% {
-o-transform: perspective(400px) rotateX(0deg);
opacity: 1;
}
}
@keyframes flipInX {
0% {
transform: perspective(400px) rotateX(90deg);
opacity: 0;
}
40% {
transform: perspective(400px) rotateX(-10deg);
}
70% {
transform: perspective(400px) rotateX(10deg);
}
100% {
transform: perspective(400px) rotateX(0deg);
opacity: 1;
}
}
.flipInX {
-webkit-backface-visibility: visible !important;
-webkit-animation-name: flipInX;
-moz-backface-visibility: visible !important;
-moz-animation-name: flipInX;
-o-backface-visibility: visible !important;
-o-animation-name: flipInX;
backface-visibility: visible !important;
animation-name: flipInX;
}
@-webkit-keyframes flipOutX {
0% {
-webkit-transform: perspective(400px) rotateX(0deg);
opacity: 1;
}
100% {
-webkit-transform: perspective(400px) rotateX(90deg);
opacity: 0;
}
}
@-moz-keyframes flipOutX {
0% {
-moz-transform: perspective(400px) rotateX(0deg);
opacity: 1;
}
100% {
-moz-transform: perspective(400px) rotateX(90deg);
opacity: 0;
}
}
@-o-keyframes flipOutX {
0% {
-o-transform: perspective(400px) rotateX(0deg);
opacity: 1;
}
100% {
-o-transform: perspective(400px) rotateX(90deg);
opacity: 0;
}
}
@keyframes flipOutX {
0% {
transform: perspective(400px) rotateX(0deg);
opacity: 1;
}
100% {
transform: perspective(400px) rotateX(90deg);
opacity: 0;
}
}
.flipOutX {
-webkit-animation-name: flipOutX;
-webkit-backface-visibility: visible !important;
-moz-animation-name: flipOutX;
-moz-backface-visibility: visible !important;
-o-animation-name: flipOutX;
-o-backface-visibility: visible !important;
animation-name: flipOutX;
backface-visibility: visible !important;
}
@-webkit-keyframes flipInY {
0% {
-webkit-transform: perspective(400px) rotateY(90deg);
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotateY(-10deg);
}
70% {
-webkit-transform: perspective(400px) rotateY(10deg);
}
100% {
-webkit-transform: perspective(400px) rotateY(0deg);
opacity: 1;
}
}
@-moz-keyframes flipInY {
0% {
-moz-transform: perspective(400px) rotateY(90deg);
opacity: 0;
}
40% {
-moz-transform: perspective(400px) rotateY(-10deg);
}
70% {
-moz-transform: perspective(400px) rotateY(10deg);
}
100% {
-moz-transform: perspective(400px) rotateY(0deg);
opacity: 1;
}
}
@-o-keyframes flipInY {
0% {
-o-transform: perspective(400px) rotateY(90deg);
opacity: 0;
}
40% {
-o-transform: perspective(400px) rotateY(-10deg);
}
70% {
-o-transform: perspective(400px) rotateY(10deg);
}
100% {
-o-transform: perspective(400px) rotateY(0deg);
opacity: 1;
}
}
@keyframes flipInY {
0% {
transform: perspective(400px) rotateY(90deg);
opacity: 0;
}
40% {
transform: perspective(400px) rotateY(-10deg);
}
70% {
transform: perspective(400px) rotateY(10deg);
}
100% {
transform: perspective(400px) rotateY(0deg);
opacity: 1;
}
}
.flipInY {
-webkit-backface-visibility: visible !important;
-webkit-animation-name: flipInY;
-moz-backface-visibility: visible !important;
-moz-animation-name: flipInY;
-o-backface-visibility: visible !important;
-o-animation-name: flipInY;
backface-visibility: visible !important;
animation-name: flipInY;
}
@-webkit-keyframes fadeIn {
0% {opacity: 0;}
100% {opacity: 1;}
}
@-moz-keyframes fadeIn {
0% {opacity: 0;}
100% {opacity: 1;}
}
@-o-keyframes fadeIn {
0% {opacity: 0;}
100% {opacity: 1;}
}
@keyframes fadeIn {
0% {opacity: 0;}
100% {opacity: 1;}
}
.fadeIn {
-webkit-animation-name: fadeIn;
-moz-animation-name: fadeIn;
-o-animation-name: fadeIn;
animation-name: fadeIn;
}
@-webkit-keyframes fadeInUp {
0% {
opacity: 0;
-webkit-transform: translateY(20px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
}
}
@-moz-keyframes fadeInUp {
0% {
opacity: 0;
-moz-transform: translateY(20px);
}
100% {
opacity: 1;
-moz-transform: translateY(0);
}
}
@-o-keyframes fadeInUp {
0% {
opacity: 0;
-o-transform: translateY(20px);
}
100% {
opacity: 1;
-o-transform: translateY(0);
}
}
@keyframes fadeInUp {
0% {
opacity: 0;
transform: translateY(20px);
}
100% {
opacity: 1;
transform: translateY(0);
}
}
.fadeInUp {
-webkit-animation-name: fadeInUp;
-moz-animation-name: fadeInUp;
-o-animation-name: fadeInUp;
animation-name: fadeInUp;
}
@-webkit-keyframes fadeInDown {
0% {
opacity: 0;
-webkit-transform: translateY(-20px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
}
}
@-moz-keyframes fadeInDown {
0% {
opacity: 0;
-moz-transform: translateY(-20px);
}
100% {
opacity: 1;
-moz-transform: translateY(0);
}
}
@-o-keyframes fadeInDown {
0% {
opacity: 0;
-o-transform: translateY(-20px);
}
100% {
opacity: 1;
-o-transform: translateY(0);
}
}
@keyframes fadeInDown {
0% {
opacity: 0;
transform: translateY(-20px);
}
100% {
opacity: 1;
transform: translateY(0);
}
}
.fadeInDown {
-webkit-animation-name: fadeInDown;
-moz-animation-name: fadeInDown;
-o-animation-name: fadeInDown;
animation-name: fadeInDown;
}
@-webkit-keyframes fadeInLeft {
0% {
opacity: 0;
-webkit-transform: translateX(-20px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
}
}
@-moz-keyframes fadeInLeft {
0% {
opacity: 0;
-moz-transform: translateX(-20px);
}
100% {
opacity: 1;
-moz-transform: translateX(0);
}
}
@-o-keyframes fadeInLeft {
0% {
opacity: 0;
-o-transform: translateX(-20px);
}
100% {
opacity: 1;
-o-transform: translateX(0);
}
}
@keyframes fadeInLeft {
0% {
opacity: 0;
transform: translateX(-20px);
}
100% {
opacity: 1;
transform: translateX(0);
}
}
.fadeInLeft {
-webkit-animation-name: fadeInLeft;
-moz-animation-name: fadeInLeft;
-o-animation-name: fadeInLeft;
animation-name: fadeInLeft;
}
@-webkit-keyframes fadeInRight {
0% {
opacity: 0;
-webkit-transform: translateX(20px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
}
}
@-moz-keyframes fadeInRight {
0% {
opacity: 0;
-moz-transform: translateX(20px);
}
100% {
opacity: 1;
-moz-transform: translateX(0);
}
}
@-o-keyframes fadeInRight {
0% {
opacity: 0;
-o-transform: translateX(20px);
}
100% {
opacity: 1;
-o-transform: translateX(0);
}
}
@keyframes fadeInRight {
0% {
opacity: 0;
transform: translateX(20px);
}
100% {
opacity: 1;
transform: translateX(0);
}
}
.fadeInRight {
-webkit-animation-name: fadeInRight;
-moz-animation-name: fadeInRight;
-o-animation-name: fadeInRight;
animation-name: fadeInRight;
}
@-webkit-keyframes bounceIn {
0% {
opacity: 0;
-webkit-transform: scale(.3);
}
50% {
opacity: 1;
-webkit-transform: scale(1.05);
}
70% {
-webkit-transform: scale(.9);
}
100% {
-webkit-transform: scale(1);
}
}
@-moz-keyframes bounceIn {
0% {
opacity: 0;
-moz-transform: scale(.3);
}
50% {
opacity: 1;
-moz-transform: scale(1.05);
}
70% {
-moz-transform: scale(.9);
}
100% {
-moz-transform: scale(1);
}
}
@-o-keyframes bounceIn {
0% {
opacity: 0;
-o-transform: scale(.3);
}
50% {
opacity: 1;
-o-transform: scale(1.05);
}
70% {
-o-transform: scale(.9);
}
100% {
-o-transform: scale(1);
}
}
@keyframes bounceIn {
0% {
opacity: 0;
transform: scale(.3);
}
50% {
opacity: 1;
transform: scale(1.05);
}
70% {
transform: scale(.9);
}
100% {
transform: scale(1);
}
}
.bounceIn {
-webkit-animation-name: bounceIn;
-moz-animation-name: bounceIn;
-o-animation-name: bounceIn;
animation-name: bounceIn;
}
@-webkit-keyframes rotateIn {
0% {
-webkit-transform-origin: center center;
-webkit-transform: rotate(-200deg);
opacity: 0;
}
100% {
-webkit-transform-origin: center center;
-webkit-transform: rotate(0);
opacity: 1;
}
}
@-moz-keyframes rotateIn {
0% {
-moz-transform-origin: center center;
-moz-transform: rotate(-200deg);
opacity: 0;
}
100% {
-moz-transform-origin: center center;
-moz-transform: rotate(0);
opacity: 1;
}
}
@-o-keyframes rotateIn {
0% {
-o-transform-origin: center center;
-o-transform: rotate(-200deg);
opacity: 0;
}
100% {
-o-transform-origin: center center;
-o-transform: rotate(0);
opacity: 1;
}
}
@keyframes rotateIn {
0% {
transform-origin: center center;
transform: rotate(-200deg);
opacity: 0;
}
100% {
transform-origin: center center;
transform: rotate(0);
opacity: 1;
}
}
.rotateIn {
-webkit-animation-name: rotateIn;
-moz-animation-name: rotateIn;
-o-animation-name: rotateIn;
animation-name: rotateIn;
}
@-webkit-keyframes rollIn {
0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); }
100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); }
}
@-moz-keyframes rollIn {
0% { opacity: 0; -moz-transform: translateX(-100%) rotate(-120deg); }
100% { opacity: 1; -moz-transform: translateX(0px) rotate(0deg); }
}
@-o-keyframes rollIn {
0% { opacity: 0; -o-transform: translateX(-100%) rotate(-120deg); }
100% { opacity: 1; -o-transform: translateX(0px) rotate(0deg); }
}
@keyframes rollIn {
0% { opacity: 0; transform: translateX(-100%) rotate(-120deg); }
100% { opacity: 1; transform: translateX(0px) rotate(0deg); }
}
.rollIn {
-webkit-animation-name: rollIn;
-moz-animation-name: rollIn;
-o-animation-name: rollIn;
animation-name: rollIn;
}
/* Firefox Keyframe Animations */
@-moz-keyframes rightSpring {
0% {margin-left: 0px;}
50% {margin-left: -30px;}
100% {margin-left: 0px;}
}
@-moz-keyframes leftSpring {
0% {margin-left: 0px;}
50% {margin-left: 30px;}
100% {margin-left: 0px;}
}
/* Safari and Chrome Keyframe Animations */
@-webkit-keyframes rightSpring {
0% {margin-left: 0px;}
50% {margin-left: -30px;}
100% {margin-left: 0px;}
}
@-webkit-keyframes leftSpring {
0% {margin-left: 0px;}
50% {margin-left: 30px;}
100% {margin-left: 0px;}
}

/* The gallery overlay */
#galleryOverlay {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  opacity: 0;
  z-index: 100000;
  background-color: #222;
  background-color: rgba(0, 0, 0, 0.8);
  overflow: hidden;
  display: none;
  -moz-transition: opacity 1s ease;
  -webkit-transition: opacity 1s ease;
  transition: opacity 1s ease;
}
/* This class will trigger the animation */
#galleryOverlay.visible {
  opacity: 1;
}
#gallerySlider {
  height: 100%;
  left: 0;
  top: 0;
  width: 100%;
  white-space: nowrap;
  position: absolute;
  -webkit-transition: left 0.4s ease;
  transition: left 0.4s ease;
}
#gallerySlider .placeholder {
  background: url("../images/preloader.gif") no-repeat center center;
  height: 100%;
  line-height: 1px;
  text-align: center;
  width: 100%;
  display: inline-block;
}

.img_block + .img_block {
  margin-left: 30px;
}
.thumbs > div {
  position: relative;
  overflow: hidden;
  padding: 16px 0;
  margin: 11px 0 17px;
}
.thumbs > div > span {
  color: #e22323;
  font-weight: 900;
  font-size: 18px;
}
.thumbs > div > h4 a:hover {
  color: #e22323;
}
a.gal {
  position: relative;
  
  display: block;
}
a.gal span {
  position: absolute;
  display: block;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  z-index: 10;
  -webkit-transition: 0.5s ease;
  transition: 0.5s ease;
  background: url(../images/magnify.png) -100px center no-repeat;
  background-size: 30%;
  opacity:0.6
}
a.gal:hover span {
  background-position: center center;
}
a.gal img {
  position: relative;
  -webkit-transition: 0.5s ease;
  transition: 0.5s ease;
  width: 100%;
}

/* The before element moves the
 * image halfway from the top */
#gallerySlider .placeholder:before {
  content: "";
  display: inline-block;
  height: 50%;
  width: 1px;
  margin-right: -1px;
}
#gallerySlider .placeholder img {
  display: inline-block;
  max-height: 80%;
  max-width: 80%;
  width: auto !important;
  vertical-align: middle;
}
#gallerySlider.rightSpring {
  -moz-animation: rightSpring 0.3s;
  -webkit-animation: rightSpring 0.3s;
}
#gallerySlider.leftSpring {
  -moz-animation: leftSpring 0.3s;
  -webkit-animation: leftSpring 0.3s;
}
/* Arrows */
#prevArrow,
#nextArrow {
  border: none;
  text-decoration: none;
  background: url('../images/arrows.png') no-repeat;
  opacity: 0.5;
  cursor: pointer;
  position: absolute;
  width: 43px;
  height: 58px;
  top: 50%;
  margin-top: -29px;
  -moz-transition: opacity 0.2s ease;
  -webkit-transition: opacity 0.2s ease;
  transition: opacity 0.2s ease;
}
#prevArrow:hover,
#nextArrow:hover { 
  opacity: 1;
}
#prevArrow {
  background-position: left top;
  left: 40px;
}
#nextArrow {
  background-position: right top;
  right: 40px;
}
