a:active{outline: none;}
@media (min-width:1200px) {

body { 
background: url('../../../../images/index/bg_desktop.jpg') no-repeat center center fixed;
-moz-background-size: cover;
-webkit-background-size: cover;
-o-background-size: cover;
background-size: cover;
min-height:100%;
font-family: 'Century Gothic', CenturyGothic, AppleGothic, sans-serif;
-khtml-user-select: none;
-webkit-user-select: none;
-moz-user-select: -moz-none;
-ms-user-select: none;
user-select: none;
}
.annonce-display{
 visibility: visible;
}
.erreur{position: absolute; top:5%; left:40%; background: rgba(185, 24, 24, 0.5);width: 200px;height:100px; border-radius:3px; box-shadow: 0px 2px 2px 0px rgba(50, 50, 50, 0.6); }
.erreur p{
	margin-left:5px;
	padding : 0px;
	font-size: 15px;
}

.authentification_form{position: absolute;top: 2%;right: 20%;background: rgba(48, 104, 178, 0.7);width:240px;height: auto;padding:15px 15px 15px 15px;text-align: center;border: 1px solid rgb(197,209,209);border-radius: 4px;}
.authentification_form span {float:left;background-color: rgba(220,220,220,0.3);color: white;text-decoration: none;border-radius: 2px;cursor: pointer;font-family: 'Eurostile', sans-serif;font-size: 1.1em;width: 116px;height: 32px;margin: -4px 2px 6px 0px;padding: 8px 1.5px 0px 1.5px;}
.authentification_form span:hover{background-color: rgb(99, 201,175);}
.authentification_form label{position:relative;top:-8px;left:-105px;font-family: 'Eurostile', sans-serif;font-size: 0.8em;color: white;}
.username {position: relative;}
.password {position: relative;}
.username input {margin-top: 10px;width: 86%;height: 15px;padding: 6px 0px 7px 32px;border: 0;z-index: 1;}
.password input {margin-bottom: 20px;margin-top: 10px;width: 86%;height: 15px;padding: 6px 0px 7px 32px;border: 0;}
.username i {position:absolute;top:10px;background-color:rgb(99, 201,175);padding:6px;color: white;width: 16px;height: 16px;}
.password i {position:absolute;top:10px;background-color:rgb(99, 201,175);padding:6px 9px 6px 7px;color: white;width: 12px;height: 16px;}
.logiciel_nom {color: rgb(43,40,106);font-size: 1.2em;}
.login_mode_2{width:250px;}


.geolocalisation {position: absolute;left:16%;bottom: 8%;z-index: 1;width: 120px;height: 110px;margin: 0;opacity: 0.9;}
.tournee {position: absolute;left:21.8%;bottom: 12%;width: 110px;height: 110px;margin: 0;opacity: 0.9;}
.automate_appel {position: absolute;right: 37%;bottom: 15.5%;width: 145px;height: 145px;margin: 0;opacity: 0.9;}
.vente_minutes {position: absolute;right: 24.2%;bottom: 14.5%;width: 145px;height: 145px;z-index: 1;margin: 0;opacity: 0.9;}
.pabx {position: absolute;right:16%;bottom: 15.5%;width: 110px;height: 110px;margin: 0;opacity: 0.9;}
.teleacteur {position: absolute;right: 20%;bottom: 3%;width: 140px;height: 140px;z-index: 3;margin: 0;opacity: 0.9;}
.teleacteur_mobile{display: none;}
.sms {position: absolute;right: 30%;bottom: 4.5%;width: 160px;height: 160px;z-index: 3;margin: 0;opacity: 0.9;}
.fuelalert {position: absolute;right: 30%;bottom: 4.5%;width: 160px;height: 160px;z-index: 3;margin: 0;opacity: 0.9;}
.lune {position: absolute;top: 3%;left: 5%;width: 100px;height: 100px;opacity: 0.8;z-index: 1;}
.remove_border{cursor: pointer;}

.lune:hover {opacity: 1;}
.geolocalisation:hover {opacity: 1;}
.tournee:hover {opacity: 1;}
.automate_appel:hover {opacity: 1;}
.vente_minutes:hover {opacity: 1;}
.pabx:hover {opacity: 1;}
.teleacteur:hover {opacity: 1;}
.sms:hover {opacity: 1;}
.fuelalert:hover {opacity: 1;}

.boule-societe{position: absolute; opacity: 0.9; left:28%;bottom: 22%;width: 110px;height: 110px; z-index: 1;}
.boule-agenda{position: absolute;opacity: 0.9; left:33%;bottom: 20%;width: 114px;height: 114px;}
.boule-contact{position: absolute;opacity: 0.9; left:38%;bottom: 21%;width: 111px;height: 111px;}
.boule-metagestion{position: absolute;opacity: 0.9; left:43%;bottom: 20%;width: 104px;height: 104px;}

 .boule-societe:hover {opacity: 1;}
 .boule-agenda:hover {opacity: 1;}
 .boule-contact:hover {opacity: 1;}
 .boule-metagestion:hover {opacity: 1;}

.panneau{position: absolute;left:3.4em;top: 9em;}


.panneau a{
 background: url("../../../../images/index/Eone_telecom_interface_onglets_bois.png") center center no-repeat;
 background-size: cover;
 width: 185px;
 height: 34px;
 text-transform: uppercase;
 position: relative;
 display: block;
 color: #1f242d;
 text-decoration: none;
 margin-bottom: 4px;
 font-size: .9em;
 text-align: center;
 line-height: 34px;
}
/*
.panneau img{width: 240px;height: 260px;}

.societe{position:absolute;top:33px;left:82px;transform: rotate(-6deg);text-decoration:none;color: rgb(111,84,63);font-size:1em;}
.agenda{position:absolute;top:77px;left:68px;text-decoration:none;color: rgb(111,84,63);font-size:1em;}
.contact{position:absolute;top:108px;left:68px;text-decoration:none;color: rgb(111,84,63);font-size:1em;}
.mail{position:absolute;top:142px;left:68px;text-decoration:none;color: rgb(111,84,63);font-size:1em;}
.fichier{position:absolute;top:179px;left:68px;text-decoration:none;color: rgb(111,84,63);font-size:1em;}

.arbre{position: absolute;bottom:32%;right: 25%;width: 160px;height: 160px;}
*/
}

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

html{
 height:100%;
 min-height:100%;
}
 .annonce-display{
  visibility: visible;
 }
body { 
background: url(../../../../images/index/bg_pad.jpg) no-repeat center center fixed;
-moz-background-size: cover;
-webkit-background-size: cover;
-o-background-size: cover;
background-size: cover;
min-height:100%;
font-family: 'Century Gothic', CenturyGothic, AppleGothic, sans-serif;
-khtml-user-select: none;
-webkit-user-select: none;
-moz-user-select: -moz-none;
-ms-user-select: none;
user-select: none;
} 

.authentification_form{position: absolute;top: 2%;right: 14%;background: rgba(48, 104, 178, 0.7);width:240px;height: auto;padding:35px 15px 20px 15px;text-align: center;border: 1px solid rgb(197,209,209);border-radius: 4px;}
.authentification_form span {float: left;background-color: rgba(220,220,220,0.3);color: white;text-decoration: none;border-radius: 2px;cursor: pointer;font-family: 'Eurostile', sans-serif;font-size: 1.1em;width: 116px;height: 32px;margin: -4px 2px 6px 0px;padding: 8px 1.5px 0px 1.5px}
.authentification_form span:hover{background-color: rgb(99, 201,175);}
.authentification_form label{position:relative;top: -4px;left: 0px;float: left;font-family: 'Eurostile', sans-serif;font-size: 0.9em;color: white;}
.username {position: relative;}
.password {position: relative;}
.username input {margin-top: 10px;width: 86%;height: 15px;padding: 6px 0px 7px 32px;border: 0;z-index: 1;}
.password input {margin-bottom: 1px;margin-top: 10px;width: 86%;height: 15px;padding: 6px 0px 7px 32px;border: 0;}
.username i {position:absolute;top:10px;background-color:rgb(99, 201,175);padding:6px;color: white;width: 16px;height: 16px;}
.password i {position:absolute;top:10px;background-color:rgb(99, 201,175);padding:6px 9px 6px 7px;color: white;width: 12px;height: 16px;}
.logiciel_nom {color: rgb(43,40,106);font-size: 0.9em;}
.login_mode_2{width:250px;}



.geolocalisation {position: absolute;left:6%;bottom: 15%;z-index: 1;width: 111px;height: 101px;margin: 0;opacity: 0.9;}
.tournee {position: absolute;left:17%;bottom: 18%;width: 108px;height: 108px;margin: 0;opacity: 0.9;}
.automate_appel {position: absolute;right: 40%;bottom: 8%;width: 142px;height: 142px;margin: 0;opacity: 0.9;}
.vente_minutes {position: absolute;right: 25%;bottom: 13%;width: 135px;height: 135px;z-index: 1;margin: 0;opacity: 0.9;}
.pabx {position: absolute;right:13%;bottom: 14.5%;width: 119px;height: 119px;margin: 0;opacity: 0.9;}
.teleacteur {display:none;}
.teleacteur_mobile {position: absolute;right: 15%;bottom: 0.2%;width: 145px;height: 145px;z-index: 3;margin: 0;opacity: 0.9;}
.sms {position: absolute;right: 30%;bottom: 0%;width: 148px;height: 148px;z-index: 3;margin: 0;opacity: 0.9;}
.fuelalert {position: absolute;right: 30%;bottom: 0%;width: 148px;height: 148px;z-index: 3;margin: 0;opacity: 0.9;}
.lune {position: absolute;top: 3%;left: 5%;width: 90px;height: 90px;opacity: 0.8;z-index: 1;}
.remove_border{cursor: pointer;}

.lune:hover {opacity: 1;}
.geolocalisation:hover {opacity: 1;}
.tournee:hover {opacity: 1;}
.automate_appel:hover {opacity: 1;}
.vente_minutes:hover {opacity: 1;}
.pabx:hover {opacity: 1;}
.teleacteur:hover {opacity: 1;}
.sms:hover {opacity: 1;}
.fuelalert:hover {opacity: 1;}

 .boule-societe{position: absolute; opacity: 0.9; left:29%;bottom: 30%;width: 100px;height: 100px; z-index: 1;}
 .boule-agenda{position: absolute;opacity: 0.9; left:36%;bottom: 23%;width: 104px;height: 104px;}
 .boule-contact{position: absolute;opacity: 0.9; left:41%;bottom: 31%;width: 101px;height: 101px;}
 .boule-metagestion{position: absolute;opacity: 0.9; left:52%;bottom: 31%;width: 94px;height: 94px;}

 .boule-societe:hover {opacity: 1;}
 .boule-agenda:hover {opacity: 1;}
 .boule-contact:hover {opacity: 1;}
 .boule-metagestion:hover {opacity: 1;}

 .panneau{position: absolute;left:1.2em;top: 9em;}


 .panneau a{
  background: url("../../../../images/index/Eone_telecom_interface_onglets_bois.png") center center no-repeat;
  background-size: 128px 34px;
  width: 128px;
  height: 34px;
  text-transform: uppercase;
  position: relative;
  display: block;
  color: #1f242d;
  text-decoration: none;
  margin-bottom: 4px;
  font-size: .7em;
  text-align: center;
  line-height: 34px;
 }

 /*
 .panneau{position: absolute;left:12%;bottom: 29%;}
 .panneau img{width: 230px;height: 250px;}
 .societe{position:absolute;top:32px;left:78px;transform: rotate(-6deg);text-decoration:none;color: rgb(111,84,63);font-size:1em;}
 .agenda{position:absolute;top:73px;left:68px;text-decoration:none;color: rgb(111,84,63);font-size:1em;}
 .contact{position:absolute;top:104px;left:68px;text-decoration:none;color: rgb(111,84,63);font-size:1em;}
 .mail{position:absolute;top:135px;left:68px;text-decoration:none;color: rgb(111,84,63);font-size:1em;}
 .fichier{position:absolute;top:172px;left:68px;text-decoration:none;color: rgb(111,84,63);font-size:1em;}

 .arbre{display:none;position: fixed;bottom:34.5%;right: 25.3%;width: 150px;height: 150px;}
 */
}

@media (max-width:479px) {

html{
 height:100%;
 min-height:100%;
}
 .annonce-display{
  visibility: hidden;
 }

body { 
background: url(../../../../images/index/bg_mobile.jpg) no-repeat center center fixed;
-moz-background-size: cover;
-webkit-background-size: cover;
-o-background-size: cover;
background-size: cover;
min-height:100%;
font-family: 'Century Gothic', CenturyGothic, AppleGothic, sans-serif;
-khtml-user-select: none;
-webkit-user-select: none;
-moz-user-select: -moz-none;
-ms-user-select: none;
user-select: none;
} 


.authentification_form{position: absolute;top: 2%;right: 2%;background: rgba(48, 104, 178, 0.7);width:240px;height: auto;padding:10px 5px 10px 5px;text-align: center;border: 1px solid rgb(197,209,209);border-radius: 4px;}
.authentification_form span {float: left;background-color: rgba(220,220,220,0.3);color: white;text-decoration: none;border-radius: 2px;cursor: pointer;font-family: 'Eurostile', sans-serif;font-size: 0.9em;width: 115px;height: 24px;margin: 2px 2px 0px 0px;padding: 6px 1.5px 0px 1.5px;}
.authentification_form span:hover{background-color: rgb(99, 201,175);}
.authentification_form label{float: left;font-family: 'Eurostile', sans-serif;font-size: 1em;color: white;}
.username {position: relative;}
.password {position: relative;}
.username input {margin-top: 10px;width: 86%;height: 15px;padding: 6px 0px 7px 32px;border: 0;z-index: 1;}
.password input {margin-bottom: 1px;margin-top: 10px;width: 86%;height: 15px;padding: 6px 0px 7px 32px;border: 0;}
.username i {position:absolute;top:10px;background-color:rgb(99, 201,175);padding:6px;color: white;width: 16px;height: 16px;}
.password i {position:absolute;top:10px;background-color:rgb(99, 201,175);padding:6px 9px 6px 7px;color: white;width: 12px;height: 16px;}
.logiciel_nom {color: rgb(43,40,106);font-size: 0.9em;}
.login_mode_2{width:250px;}

.geolocalisation {position: absolute;left:6%;bottom: 20%;z-index: 1;width: 71px;height: 61px;margin: 0;opacity: 0.9;}
.tournee {position: absolute;left:24%;bottom: 24%;width: 68px;height: 68px;margin: 0;opacity: 0.9;}
.automate_appel {position: absolute;right: 10%;bottom: 0.3%;width: 92px;height: 92px;margin: 0;opacity: 0.9;}
.vente_minutes {position: absolute;right: 25.2%;bottom: 8%;width: 95px;height: 95px;z-index: 1;margin: 0;opacity: 0.9;}
.pabx {position: absolute;left:33%;bottom: 14.5%;width: 79px;height: 79px;margin: 0;opacity: 0.9;}
.teleacteur {display:none;}
.teleacteur_mobile {position: absolute;left: 25%;bottom: 0.2%;width: 105px;height: 105px;z-index: 3;margin: 0;opacity: 0.9;}
.sms {position: absolute;right: 2%;bottom: 15%;width: 95px;height: 95px;z-index: 3;margin: 0;opacity: 0.9;}
.fuelalert {position: absolute;right: 2%;bottom: 15%;width: 95px;height: 95px;z-index: 3;margin: 0;opacity: 0.9;}
.lune {position: absolute;top: 3%;left: 5%;width: 50px;height: 50px;opacity: 0.8;z-index: 1;}
.remove_border{cursor: pointer;}

.lune:hover {opacity: 1;}
.geolocalisation:hover {opacity: 1;}
.tournee:hover {opacity: 1;}
.automate_appel:hover {opacity: 1;}
.vente_minutes:hover {opacity: 1;}
.pabx:hover {opacity: 1;}
.teleacteur:hover {opacity: 1;}
.sms:hover {opacity: 1;}
.fuelalert:hover {opacity: 1;}

 .boule-societe{position: absolute; opacity: 0.9; left:36%;bottom: 30%;width: 90px;height: 90px; z-index: 1;}
 .boule-agenda{position: absolute;opacity: 0.9; left:52%;bottom: 24%;width: 94px;height: 94px;}
 .boule-contact{position: absolute;opacity: 0.9; left:53%;bottom: 36%;width: 81px;height: 81px;}
 .boule-metagestion{position: absolute;opacity: 0.9; left:74%;bottom: 31%;width: 74px;height: 74px;}

 .boule-societe:hover {opacity: 1;}
 .boule-agenda:hover {opacity: 1;}
 .boule-contact:hover {opacity: 1;}
 .boule-metagestion:hover {opacity: 1;}

 .panneau{margin-top: 14em;}


 .panneau a{
  margin: 0 auto;
  background: url("../../../../images/index/Eone_telecom_interface_onglets_bois.png") center center no-repeat;
  background-size: 100% 34px;
  width: 120px;
  height: 34px;
  text-transform: uppercase;
  position: relative;
  display: block;
  color: #1f242d;
  text-decoration: none;
  margin-bottom: 4px;
  font-size: .7em;
  text-align: center;
  line-height: 34px;
 }


/*
.panneau{position: absolute;left:3%;bottom: 32%;}
.panneau img{width: 140px;height: 160px;}

.societe{position:absolute;top:18px;left:46px;transform: rotate(-6deg);text-decoration:none;color: rgb(111,84,63);font-size:0.8em;}
.agenda{position:absolute;top:45px;left:34px;text-decoration:none;color: rgb(111,84,63);font-size:0.8em;}
.contact{position:absolute;top:65px;left:34px;text-decoration:none;color: rgb(111,84,63);font-size:0.8em;}
.mail{position:absolute;top:84px;left:34px;text-decoration:none;color: rgb(111,84,63);font-size:0.8em;}
.fichier{position:absolute;top:109px;left:34px;text-decoration:none;color: rgb(111,84,63);font-size:0.8em;}


.arbre{display:none;position: fixed;bottom:34.5%;right: 25.3%;width: 150px;height: 150px;}
*/

}


@media (max-height: 479px) {


body { 
background: url(../../../../images/index/bg_mobile.jpg) no-repeat center center fixed;
-moz-background-size: cover;
-webkit-background-size: cover;
-o-background-size: cover;
background-size: cover;
font-family: 'Century Gothic', CenturyGothic, AppleGothic, sans-serif;
-khtml-user-select: none;
-webkit-user-select: none;
-moz-user-select: -moz-none;
-ms-user-select: none;
user-select: none;
}
 .annonce-display{
  visibility: hidden;
 }

.authentification_form{position: absolute;top: 2%;right: 2%;background: rgba(48, 104, 178, 0.7);width:160px;height: auto;padding:3px 5px 2px 5px;text-align: center;border: 1px solid rgb(197,209,209);border-radius: 4px;}
.authentification_form span {float: left;background-color: rgba(220,220,220,0.3);color: white;text-decoration: none;border-radius: 2px;cursor: pointer;font-family: 'Eurostile', sans-serif;font-size: 0.7em;width: 76px;height: 18px;margin: 2px 5px 0px 0px;padding: 6px 1.5px 0px 1.5px;}
.authentification_form span:hover{background-color: rgb(99, 201,175);}
.authentification_form label{float: left;font-family: 'Eurostile', sans-serif;font-size: 0.8em;color: white;}
.username {position: relative;}
.password {position: relative;}
.username input {margin-top: 10px;width: 80%;height: 15px;padding: 6px 0px 7px 32px;border: 0;z-index: 1;}
.password input {margin-bottom: 1px;margin-top: 10px;width: 80%;height: 15px;padding: 6px 0px 7px 32px;border: 0;}
.username i {position:absolute;top:10px;background-color:rgb(99, 201,175);padding:6px;color: white;width: 16px;height: 16px;}
.password i {position:absolute;top:10px;background-color:rgb(99, 201,175);padding:6px 9px 6px 7px;color: white;width: 12px;height: 16px;}
.logiciel_nom {color: rgb(43,40,106);font-size: 0.7em;}
.login_mode_2{width:250px;}

.geolocalisation {position: absolute;left:3%;bottom: 3%;z-index: 1;width: 70px;height: 65px;margin: 0;opacity: 0.9;}
.tournee {position: absolute;left:15%;bottom: 14%;width: 62px;height: 62px;margin: 0;opacity: 0.9;}
.automate_appel {position: absolute;right: 1%;bottom: 0.1%;width: 68px;height: 68px;margin: 0;opacity: 0.9;}
.vente_minutes {position: absolute;right: 15%;bottom: 6%;width: 68px;height: 68px;z-index: 1;margin: 0;opacity: 0.9;}
.pabx {position: absolute;left:40%;bottom: 15%;width: 73px;height: 73px;margin: 0;opacity: 0.9;}
.teleacteur {display:none;}
.teleacteur_mobile {position: absolute;left: 25%;bottom: 0%;width: 80px;height: 80px;z-index: 3;margin: 0;opacity: 0.9;}
.sms {position: absolute;right: 3%;bottom: 18%;width: 70px;height: 70px;z-index: 3;margin: 0;opacity: 0.9;}
.fuelalert {position: absolute;right: 3%;bottom: 18%;width: 70px;height: 70px;z-index: 3;margin: 0;opacity: 0.9;}
.lune {position: absolute;top: 3%;left: 5%;width: 50px;height: 50px;opacity: 0.8;z-index: 1;}
.remove_border{cursor: pointer;}

.lune:hover {opacity: 1;}
.geolocalisation:hover {opacity: 1;}
.tournee:hover {opacity: 1;}
.automate_appel:hover {opacity: 1;}
.vente_minutes:hover {opacity: 1;}
.pabx:hover {opacity: 1;}
.teleacteur:hover {opacity: 1;}
.sms:hover {opacity: 1;}
.fuelalert:hover {opacity: 1;}



/*
.panneau{position: absolute;left:10%;bottom: 28%;}
.panneau img{width: 120px;height: 140px;}

.societe{position:absolute;top:16px;left:42px;transform: rotate(-6deg);text-decoration:none;color: rgb(111,84,63);font-size:0.7em;}
.agenda{position:absolute;top:40px;left:32px;text-decoration:none;color: rgb(111,84,63);font-size:0.7em;}
.contact{position:absolute;top:58px;left:32px;text-decoration:none;color: rgb(111,84,63);font-size:0.7em;}
.mail{position:absolute;top:75px;left:32px;text-decoration:none;color: rgb(111,84,63);font-size:0.7em;}
.fichier{position:absolute;top:96px;left:32px;text-decoration:none;color: rgb(111,84,63);font-size:0.7em;}

.arbre{display:none;position: fixed;bottom:34.5%;right: 25.3%;width: 150px;height: 150px;}
*/

}
