.BannerPrincipal{
	position:relative;
}

.BlockDenim{overflow:hidden;}
@media screen  and (min-width:769px)    {
header{
    height: 0px;
    width: 60px;
    content: "";
    -webkit-animation: increase 2s;
    -moz-animation: increase 2s;
    -o-animation: increase 2s;
    animation: increase 2s;
    animation-fill-mode: forwards;
    position: absolute;
    top: 0%;
    bottom: 0px;
}

@-webkit-keyframes increase {
  0%   { opacity: 0; }
    100% {height:100vh; }
}
@-moz-keyframes increase {
  0%   { opacity: 0; }
    100% {height:100vh; }
}
@-o-keyframes increase{
  0%   { opacity: 0; }
    100% {height:100vh; }
}
@keyframes increase {
  0%   { opacity: 0; }
    100% {height:100vh; }
}
}
.BannerPrincipal:after{
	background: rgba(249,221,6,0.35);
	-webkit-animation: revealtop 1s 0s ease-in-out forwards;
	animation: revealtop 1s 0s ease-in-out forwards;
	-webkit-transition-delay: 0.5s;
	transition-delay: 0.7s;
	-webkit-transition: all 0.75s cubic-bezier(0.86,0,0.07,1);
	-moz-transition: all 0.75s cubic-bezier(0.86,0,0.07,1);
	-o-transition: all 0.75s cubic-bezier(0.86,0,0.07,1);
	transition: all 0.75s cubic-bezier(0.86,0,0.07,1);
        top: 0px;
	position:absolute;
	content:"";
	right:0px;
	height: 100%;
        z-index: 99;
 }  
   
   
 @-webkit-keyframes revealtop {
   0% {    width:100%;opacity:1;}
   
    100% {   width:50%;opacity:1;}
}

@keyframes revealtop {
 0% {    width:100%;opacity:1;}
   
    100% {   width:50%;opacity:1;}
}
  
.BlockDenim   .LinkVoirGalerie{
    -webkit-transition: all 0.5s cubic-bezier(0.86,0,0.07,1);
    -moz-transition: all 0.5s cubic-bezier(0.86,0,0.07,1);
    -o-transition: all 0.5s cubic-bezier(0.86,0,0.07,1);
    transition: all 0.5s cubic-bezier(0.86,0,0.07,1);

left:50vw;
       
}
.BlockDenimActive   .LinkVoirGalerie{
    left:-27px !important;
 
}

.ContentDenim{
overflow:hidden;
}
 .BlockRightDenim, .BlockRightWorkWear  {
    -webkit-transition-delay: 1.25s;
    transition-delay: 0.75s;
    -webkit-transition: all 0.5s cubic-bezier(0.86,0,0.07,1);
    -moz-transition: all 0.5s cubic-bezier(0.86,0,0.07,1);
    -o-transition: all 0.5s cubic-bezier(0.86,0,0.07,1);
    transition: all 0.75s ease-in-out;
    transform: translateX(-100%);
}
.BlockLeftDenim,.BlockLeftWorkWear {
    -webkit-transition-delay: 1.25s;
    transition-delay: 0.75s;
    -webkit-transition: all 0.5s cubic-bezier(0.86,0,0.07,1);
    -moz-transition: all 0.5s cubic-bezier(0.86,0,0.07,1);
    -o-transition: all 0.5s cubic-bezier(0.86,0,0.07,1);
    transition: all 0.75s ease-in-out;
    transform: translateX(100%);
}
.BlockDenimActive    .BlockRightDenim, .BlockWorkWearActive  .BlockLeftWorkWear, .BlockWorkWearActive .BlockRightWorkWear{transform: translateX(0%) !important;}
.BlockDenimActive    .BlockLeftDenim   {transform: translateX(0%) !important;}
.BlockServiceActive:before{
	-webkit-animation: revealtopService 1s 0s ease-in-out forwards;
	animation: revealtopService  1s 0s ease-in-out forwards;
	-webkit-transition-delay: 0.5s;
	transition-delay: 0.7s;
	-webkit-transition: all 0.75s cubic-bezier(0.86,0,0.07,1);
	-moz-transition: all 0.75s cubic-bezier(0.86,0,0.07,1);
	-o-transition: all 0.75s cubic-bezier(0.86,0,0.07,1);
	transition: all 0.75s cubic-bezier(0.86,0,0.07,1);
	content:"";
	left:0px;
	top:0px;
	height:100%;
	background:#fef898;
	 position: absolute;
	}  
 
 @-webkit-keyframes revealtopService {
   0% {    width:100%;opacity:1;}
   
    100% {   width:50%;opacity:1;}
}

@keyframes revealtopService {
 0% {    width:100%;opacity:1;}
   
    100% {   width:50%;opacity:1;}
}
  

.Logo {
  -webkit-animation-name: zoomIn;
  animation-name: zoomIn;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  }
  @-webkit-keyframes zoomIn {
  0% {
  opacity: 0;
  -webkit-transform: scale3d(.3, .3, .3);
  transform: scale3d(.3, .3, .3);
  }
  50% {
  opacity: 1;
  }
  }
  @keyframes zoomIn {
  0% {
  opacity: 0;
  -webkit-transform: scale3d(.3, .3, .3);
  transform: scale3d(.3, .3, .3);
  }
  50% {
  opacity: 1;
  }
  } 
.TitService{
    transition: 0.5s ease all;
    -webkit-transition: all ease 0.5s;
    -moz-transition: all ease 0.5s;
    transition: all ease 0.5s;
}
.TitService:hover{
    border: 5px solid #0a76b9;
    background: #0a76b9;
}
.TitService:hover  a{
color:#fff;
}
.TitService:hover  span:before{
    background: #0a76b9;
}
.TitService:hover  span:after{
    background: #0a76b9;
}



.BlockService  .BannerServerLeft, .BlockService  .BannerServerRight  {
    transition: transform 0.8s cubic-bezier(0.6, 0.2, 0.1, 1) 0s;
    transform: translate3d(0px, 600px, 0px);
     overflow: hidden;
}


.BannerServerLeft img,  .BannerServerRight  img{
    transition: transform 1.2s cubic-bezier(0.6, 0.2, 0.1, 1) 0.1s;
    transform: scale3d(1.5, 1.5, 1);
}
.BlockServiceActive   .BannerServerLeft img, .BlockServiceActive .BannerServerRight img{
    transition: transform 1.2s cubic-bezier(0.6, 0.2, 0.1, 1) 0.1s;
    transform: scale3d(1, 1, 1);
}
.BlockServiceActive   .BannerServerLeft, .BlockServiceActive .BannerServerRight{
    transition: transform 1s cubic-bezier(0.6, 0.2, 0.1, 1) 0s;
    transform: translate3d(0px, 0px, 0px);
}
.BlockDenimActive .BlockLeftDenim  img, .BlockSportWearActive .BlockLeftSportWear   img, .BlockWorkWearActive .BlockLeftWorkWear  img{
    transition: transform 1.2s cubic-bezier(0.6, 0.2, 0.1, 1) 0.1s;
    transform: scale3d(1, 1, 1);
}
.BlockLeftDenim  img, .BlockLeftSportWear  img, .BlockLeftWorkWear  img{
    transition: transform 1.2s cubic-bezier(0.6, 0.2, 0.1, 1) 0.1s;
    transform: scale3d(1.5, 1.5, 1);
}

 



.imgBanner{position:relative;}
.imgBanner:after{
	background: rgba(249,221,6,0.35);
	-webkit-animation: revealtopBanner  1s 0s ease-in-out forwards;
	animation: revealtopBanner  1s 0s ease-in-out forwards;
    -webkit-transition: -webkit-transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    transition: -webkit-transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1), 
-webkit-transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
        top: 0px;
	position:absolute;
	content:"";
	right:0px;
	height: 100%;
        z-index: 99;
 }  
   
   
 @-webkit-keyframes revealtopBanner {
   0% {    width:100%;opacity:1;}
   
    100% {   width:00%;opacity:1;}
}

@keyframes revealtopBanner {
 0% {    width:100%;opacity:1;}
   
    100% {   width:00%;opacity:1;}
}


