@charset "utf-8";
/* CSS Document */

     html, body {
  width: 100%;
  height: 100%;
  overflow: hidden;
  margin: 0;
}

#container {
  width: 100%;
  height: 100%;
  background-image: url(../vignettes/loading.jpg);
		background-position:center;
		background-repeat:no-repeat;
		background-size:100% auto;z-index: 1000;
}

#btn {
  width:150px; height:150px; bottom:50px; right:50%; position:fixed; background-color:blue; z-index:1000000000000;display:none;
}

#conteneur-vignettes{
  width: 325px;
  height: 40px;
  position: fixed;
  bottom: 10px;
  z-index: 100000;
  left: calc(50% - 162px);
}


#vignette1,#vignette2,#vignette3,#vignette4,#vignette5{
width: 60px;
height: 40px;
z-index: 100000;
float: left;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
margin-left: 5px;box-shadow: inset 5em 1em rgba(0, 0, 0, 0.1);}  

#vignette1{background-image: url(../vignettes/vignette-1.jpg);}

#vignette2{background-image: url(../vignettes/vignette-2.jpg);}

#vignette3{background-image: url(../vignettes/vignette-3.jpg);}

#vignette4{background-image: url(../vignettes/vignette-4.jpg);}

#vignette5{background-image: url(../vignettes/vignette-5.jpg);}


#vignette1:hover,#vignette2:hover,#vignette3:hover,#vignette4:hover,#vignette5:hover{
background-color:rgba(224, 6, 29, 0.5);transform: scale(0.95);box-shadow: inset 5em 1em rgba(0, 0, 0, 0);
}

#conteneur-plan{
width: 100px;
height: 73px;
position: fixed;
top: 15px;
z-index: 100000;
right: 15px;
display:block;
}


#togg1{
    
    width: 100px;
height: 73px;
position: fixed;
top: 50%;
z-index: 1000000000000;
right: 15px;
display: block;cursor: pointer;background-image:url(../vignettes/axo-hd-last-100.jpg);background-position: center;
background-repeat: no-repeat;
background-size: cover;box-shadow: inset 5em 1em rgba(0, 0, 0, 0.1);}


#togg1:hover{
background-color:rgba(224, 6, 29, 0.5);transform: scale(0.95);}


#d1{visibility:hidden;width:350px;height:256px; position:absolute; top: 0px; left:calc(50% - 175px); z-index:1000000;background-image:url(../vignettes/axo-hd-last-700.jpg);background-position: center;
background-repeat: no-repeat;
background-size: cover;}



#point1,#point2,#point3,#point4,#point5

{width:15px;height: 15px;position: absolute;z-index: 10000000000;background-image:url(../vignettes/point-interet15.gif);background-position: center;
background-repeat: no-repeat;
background-size: cover;  border-radius: 20px;}

#point1{top:80px;left:20px;}

#point2{bottom:28px;left:128px;}

#point3{top:28px;left:152px;}

#point4{bottom:20px;left: 231px;;}

#point5{top:40px;right:64px;}




#flechebas{
    
width: 30px;
height: 35px;
position: fixed;
    bottom: calc(50% - 112px);
    z-index: 1000000000000;
    right: 50px;
visibility: visible;
    cursor: pointer;
    background-image: url(../vignettes/fleche-bas.gif);
    background-size: auto 100%;
    background-position: center;
    background-repeat: no-repeat;
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
}



#flechehaut{
    

    
width: 30px;
    height: 35px;
    position: fixed;
    top: calc(50% - 37px);
    z-index: 1000000000000;
    right: 50px;
visibility: visible;
    cursor: pointer;
    background-image: url(../vignettes/fleche-bas.gif);
    background-size: auto 100%;
    background-position: center;
    background-repeat: no-repeat;
}

#iframeHolder{
}






#axo
{


}

@media screen and (min-width: 1280px) and (min-height: 768px){
    #scale-plan{transform: scale(2);}
#d1{top:calc(50% + 100px)}
}