.box_scroll{
background: url('../images/bg_scroll1.jpg') 50% 50% repeat;
}

.div_scroll{
max-width: 100%;
box-sizing: border-box;
position: relative;
padding: 50px 0px 34px 0px;
}

.box_scrollGall{
max-width: 100%;
}


.box_mod_gallery{
background-color: #fbfbfb;
border-top: 1px solid #d8d8d8;
padding: 30px 0px 0px 0px; 
}


.modGallery .titleScroll{
color: #144623;
font-size: 24px;
text-align: left;
margin: 0px 0px 0px 0px;
font-weight: 400;
padding: 0px 0px 0px 45px;
position: relative;
}

.modGallery .titleScroll:before{
content: "";
width: 17px;
height: 17px;
background-color: #ffc600;
position: absolute;
top:8px;
left: 0px;
}


.gallImg{
padding: 33px 0px 0px 0px;
position: relative;
max-width: 100%;
}
.galleryImage{
overflow: hidden;
margin: 0px auto;
position: relative;
max-width: 100%;
padding: 10px 0px 10px 0px;
}

.galleryImage ul{
list-style: none;
position: absolute;
}

.galleryImage ul li{
float: left;
position: relative;
z-index: 0;
}
.galleryImage ul li.sel{

}	

.galleryImage ul li a{
display: block;
padding: 0px 0px 0px 0px;
transition: all 0.5s ease-out 0s;
position: relative;
}


.galleryImage ul li a span.titleIm{
display: block;
padding: 16px 5px;
text-align: center;
color: #787878;
font-size: 18px;
box-sizing: border-box;
transition: all 0.5s ease-out 0s;
margin: 11px 0px 0px 0px;
transition: all 0.5s ease-out 0s;
}	

.galleryImage ul li a:hover span.titleIm{
color: #3e9b56;
}

.galleryImage ul li .spImg{
box-sizing: border-box;
display: block;
width: 100%;
padding: 6px;
background-color: rgba(0,0,0,0.05);
overflow: hidden;
}

.galleryImage ul li img{
vertical-align: top;
transition: all 0.5s ease-out 0s;
width: 100% !important;
height: 100% !important;
}

.galleryImage ul li span.sel{
background-color: rgba(0,0,0,0.7);
display: block;
width: 100%;
height: 100%;
position: absolute;
top:0px;
left: 0px;
}

.galleryImage ul li a:hover{

transition: all 1s ease-out 0s;
}

.modGallery{
position: relative;
}
.navTlo{
position: absolute;
width: 87px;
height: 32px;
right: 0px;
top:0px;
background-color: #FFFFFF;
z-index: 1;
}

.titleModGallery{
height: 50px;
text-align: center;
font-size: 24px;
color: #bd9e38;
margin: 0px 0px 30px 0px;
line-height: 50px;
position: relative;
overflow: hidden;
}

.arrowAll{
 
}


.arrowAll span.spArrow {

}

.gallImg .arrowLeft,.gallImg .arrowRight{
display: block;
width: 13px;
height: 21px;
cursor: pointer;
background-position: 0px 0px;
background-repeat: no-repeat;
background-image:url('../images/scroll_arrow2.png');
position: absolute;
top:41%;
}
.gallImg .arrowLeft{
left: 5px;
}

.gallImg .arrowRight{
background-position: -13px 0px;
right: 5px;
}

.gallImg .sl{
background-position: 0px -21px;
}
.gallImg .sr{
background-position: -13px -21px;

}


.galleryImage ul li a:hover{

}


.galleryImage ul li a span.showImg{
display: block;
position: absolute;
opacity:0;
background:transparent url('../images/bg_img_cat.png') 50% 50% no-repeat;
-webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-name: zoomOut;
  animation-name: zoomOut;	
  top:0px;
  left: 0px;
}


.galleryImage ul li a:hover span.showImg{
-webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-name: zoomInA;
  animation-name: zoomInA;	

}

@-webkit-keyframes zoomInA {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
  100%{
   opacity: 1;
	-webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes zoomInA {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    -ms-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
  100%{
   opacity: 1;
-webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}