#TopAniMationMeanDiv{
    position: relative;
}
#animationMeanDiv{
    overflow: hidden;
    position: relative;
}
#Animation {
    position: relative;
    float: left;
    z-index: 0;
    width: 100%;
    margin-top: -1px;
}
/********************** animationMeanDiv *********************************/
.TopAnimation{
    position: relative;
    float: left;
    z-index: 0;
    width: 100%;
    margin-top: -1px;
}
#Animation img{
    max-height: 950px;
    width: 100%;
    position: absolute;
    z-index: 0;
}
.nivo-controlNav{
    display: none;
}

#NavRight:hover,#NavLeft:hover{
    opacity: 1;
}
#TopAniMationMeanDiv:hover #NavRight,#TopAniMationMeanDiv:hover #NavLeft{
    opacity: 0.5;
}
/********************** Assistances **********************************/
#animationContainer{
    position: relative;
    height: 100%;
    z-index: 1; 
}
#animationRow{
    position: absolute;
    width: 100%;
    bottom: 0px;
}
.animationColl{
    margin: 0 1px;
    width: 33.13%;
    background-image: url('images/animation/Col-InfoBG.png');
    background-repeat: repeat-x;
    background-size: 100% 100%;
    padding: 0;
    cursor: pointer;
}
.animationColl .leftImg{
    float: left;
    width: 32%;
    vertical-align: middle;
}
.animationColl .leftImg img{
    margin-left: 34%;
    margin-top: 29%;
}
.animationColl:first-child .leftImg img{
    margin-top: 48%;
}
.animationColl:last-child .leftImg img{
    margin-top: 28%;
}
.animationColl .leftImg img.coll3,.animationColl .leftImg img.coll2{
    margin-top: 22%;
}
.animationColl .Txt{
    float: left;
    width: 68%;
}
.animationColl .Txt h1{
    color: #0a2339;
    font-size: 122%;
    text-transform: capitalize;
    margin-bottom: 0px; margin-top: 20px;
}
.animationColl .Txt h2{
    color: #afadad;
    font-size: 90%;
    margin-top: 8px;
    margin-bottom: 20px;
}
#AnimationTXT{
    position: relative; 
}
#AnimationTXTRow{
    position: absolute;
    width: 100%;
    left: 0;
}
#AnimationTXTCol{
    padding: 0;
    margin: 0;
    margin-top: -42%;
    width: 45%;
    padding-left:2%;
}
#AnimationTXTRow #AnimationTXTCol h1{
    color: #fff;
    font-size: 2.9vw;
    margin-bottom: 4%;
text-decoration: none;
font-size: 5.5vw;
line-height: 1em;
font-family: 'poppinsbold';
}
#AnimationTXTRow #AnimationTXTCol p{
    color: #fff;
  font-family: 'poppinsregular';
  font-size: 1.4vw;
}

#AnimationTXTRow #AnimationTXTCol h1 span{
    color: #fb501c;
}
#AnimationTXTRow #AnimationTXTCol h2{
    color: #fff;
    font-size: 1.65vw;
    margin: 0 0 15px;
    width: 57%;
    line-height: 126%;
}
#AnimationTXTRow #AnimationTXTCol h3,#AnimationTXTRow #AnimationTXTCol h4{
    color: #fff;
     font-family: 'jost_regular';
    letter-spacing: 4px;
    font-size: 18px;
    letter-spacing: 0px;
}
#AnimationTXTRow #AnimationTXTCol h4 span{
    color: #fb501c;
}
#AnimationTXTRow #TopAnimBTDiv{
    margin-top: 2vw;
}
#AnimationTXTRow .TopanimBT{
    display: block;
    float: left;
    color:  #0a2339;
    font-size: 0.9vw;
    padding: 0.7vw 1.3vw;
    text-transform: uppercase;
    text-decoration: none;
}

#AnimationTXTRow #AnimationTXTBut{
    font-size: 0.9vw;
    width: 33%;
    float: left;
    margin-top:-20%;
    padding-left:2%;
}
#AnimationTXTBut a{
  color: #fff;
  text-transform: capitalize;
  text-align: center;
  font-size: 1.5vw;
  background-color: #bb9b22;
  padding: 4% 0;
  float: left;
  font-family: 'poppinsregular';
  width: 53%;

}
#AnimationTXTRow #AnimationContactBut{
    background-color: #078dd7;
    color: #fff;
    margin-left: 0;
    margin-right: 1.4%;
}
/********************** Assistances end ******************************/
#Animation{
    overflow: hidden;
}
.nivoSlider img {
    height: auto !important;
}

#zoomerDiv{
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
    width: 100%;
    height: 100%;
}

#zoomerDiv {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}


.full {
    position: absolute;
    width: 100%;
    height: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    display: block;
}

.zoom {
    animation: scale 40s linear infinite;
}

@keyframes scale {
    50% {
        -webkit-transform:scale(1.2);
        -moz-transform:scale(1.2);
        -ms-transform:scale(1.2);
        -o-transform:scale(1.2);
        transform:scale(1.2);
    }
}
#NavLeft {
    position: relative;
    float: left;
    width: 7%;
    opacity: 1;
    cursor: pointer;
    margin-top: -23%;
    padding-left: 2%;
    width:5%;
}
#NavRight {
    position: relative;
    float: right;
    opacity: 1;
    cursor: pointer;
    margin-top: -23%;
    padding-right: 2%;
    width:5%;
}
.AnimControl {
    -webkit-transition: all ease 1.5s;
    -moz-transition: all ease 1.5s;
    -ms-transition: all ease 1.5s;
    -o-transition: all ease 1.5s;
    transition: all ease 1.5s;
    filter: alpha(opacity=0);
}


 .nivo-controlNav a.active {
  background-color: #bb9b22;
}
.nivo-controlNav{
    position: absolute;
display: block;
z-index: 1000;
right: 0;
height: 58px;
width: auto;
top: 80%;
/*transform: matrix(1, 0, 0, 1, -46, -9);*/
transform: rotate(180deg);
left: 0;
}
.nivo-controlNav a {
  cursor: pointer;
  overflow: hidden;
  width: 15px;
  height: 3px;
  background-color: #7b8694;
  -webkit-transition: background 0.3s ease;
  transition: background 0.3s ease;
  display: block;
  margin-top: 7px;
  font-size: 0;
}
        .nivo-controlNav a{
    width: 11px;
  height: 11px;
  display: inline-block;
  border-radius: 100%;
  margin-left: 8px;
}



/** xs  **/
@media (max-width: 760px) {
    #animationMeanDiv{
        position: relative;
        background-image: url('../images/jpg/topAnimation/XSbg.jpg');
        background-repeat:  no-repeat;
        background-size: 100% 100%;
        width: 100%;  
    }
    #AnimationTXT{
        position: absolute;
        top: 0;
        left: 0;
    }
    #AnimationTXTRow {
        top: -5vw;
    }
    #AnimationTXTCol{
        background-image: none;
        margin-left: 0;
    }
    #AnimationTXTRow #AnimationTXTBut{
        margin-left: 0;
        font-size: 2vw;
        width: 100%;
        margin-top:6%;
        padding:35px 18px;
    }
    #AnimationTXTRow #AnimationContactBut{
        margin-left: 3%;
        font-size: 2.5vw;
    }
    #AnimationTXTRow #AnimationTXTCol h1{
        font-size:11vw;
    }
    #AnimationTXTRow #AnimationTXTCol h2{
        font-size: 2.5vw;
        width: auto;
    }
    #AnimationTXTRow {
        top: 27vw;
        left: 7%;
    }
    #AnimationTXTCol{
        margin-top: 17%;
        width: 100%;
    }
    #AnimationTXTBut a{
        font-size: 20px;
        display: inline-block;
    }
}
@media (min-width: 1404px) {
    #NavRight{
        margin-top: -21%;
    }
    #NavLeft 
    {  margin-top: -21%;                 
    }
}

/** md  **/
@media (min-width:992px) and (max-width:1199px){
}
/** sm  **/
@media (min-width:768px) and (max-width:991px){
}




/**************  pour Top animation rows *********/
@media (min-width: 1500px) {

}
@media (min-width: 1400px) and (max-width:1500px) {

}
@media (min-width: 1300px) and (max-width:1400px)  {

}
@media (min-width: 1200px) and (max-width:1300px)  {

}
@media (min-width: 1100px) and (max-width:1200px)  {

}
@media (min-width: 1000px) and (max-width:1100px)  {

}
@media (min-width: 900px) and (max-width:1000px)  {

}
@media (min-width: 800px) and (max-width:900px)  {

}