:root { --orangeesii: #e54f1d;--blackesii: #555555;--gris:#48566a;}
html,body {    width: 100%;    height: 100%;}
body{background-color:white;overflow-x: hidden;}
*{font-family: Stolzl,Open Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing : antialiased;margin: 0;    padding: 0;position: relative;}
h1{font-size: 3rem;}
h2{font-size: 2.5rem;margin-left: 1.5rem;margin-bottom: 1rem;}
h3{font-size: 1.25rem;margin-bottom:1.5rem;}
h4{font-size: 1.5rem;}
h5{font-size: 1.25rem;}
p,span,input,.menu li{font-size: 1.2rem;font-weight: 300;}
textarea, input {outline: none;border: 1px solid #cacaca;padding: 5px 10px;}

/*global*/
#conteneur{max-width: 1280px;margin: 0 auto;min-height: 100vh;display: flex;flex-direction: column;}
.fondgris{background-color: #f8f7f7;}
.entete{display:flex;position:relative;height:auto;align-items: center;}
.entete a{display: inline-flex;margin-right:10px;text-decoration: none;padding: 0px 1rem;color: var(--blackesii);cursor: pointer;}
.menusol,.menuprod,.menulien{display:none;}
.logoimgentete{width:95px;float:left;margin-top: 0.5rem;margin-left: 0.5rem}
.floatright{margin-left: auto;  order: 2;}
.lienentete {    background-color: var(--orangeesii);    color: white !important;    padding: 6px 28px !important;    border-radius: 14px;}
.rond{border-radius: 50%;position: absolute;}
.vert{background-color: #05e8b3;}
.jaune{background-color: #ffc212;}
#r1{  top:60%;right:-3rem;width: 6rem;height: 6rem;} 
#r2{ top:20%;left:-6.5rem;width: 8rem;height: 8rem;}
.soustitre{margin:0 !important;}
.corps{border-top:1.8px solid var(--blackesii);}
.corpstop{margin-top: 1rem;}
#corps p,#corps h1{margin:1.5rem 1rem;}
.ui-tooltip, .arrow:after { background-color:var(--blackesii);    color:white;    border: 2px solid var(--gris);    width:200px;    text-align: center;    padding: 0.25rem;    border-radius: 5px;z-index:9;font-size: 0.8rem;}
.ui-helper-hidden-accessible{display: none;}
.menusel{color: var(--orangeesii) !important;font-weight: 500;}
.hmenusol{color: var(--orangeesii) !important;font-weight: 700;margin: 2rem 0 0 0;padding: 0.75rem 0rem;border-radius: 5px;text-align: center;display: block;width: max-content;}
#warn{display: none;text-align: center;padding: 1rem 0rem;cursor:pointer;width:100%;background-color:var(--orangeesii);color:white;margin:1rem auto 0rem auto;}
#warn p{font-size:1rem;padding:1rem 4.5rem}
#clientname{width:50%;}
.menutopenligne:hover{color:var(--orangeesii);}
.ombresel{box-shadow: 4px 4px 2px -1px var(--orangeesii) !important;}
.menu{position: absolute;   height: auto;    background-color: white;z-index: 5;border-radius:5px;border:1px solid #cacaca; padding:25px;display:none; top: 75%;width: 600px;}
.arrow-up{  width: 0;   height: 0;   border-left: 8px solid transparent;  border-right: 8px solid transparent;  border-bottom: 8px solid #cacaca;position:absolute;top:-9px;left:10px;}
.menu li{list-style:none;color: var(--blackesii);text-align: left;padding: 0.5rem 2%;}
.menusol{left:12%;}
.menuprod{left:24%;}
.menulink{left:33%;}
.menupsmall{padding-left: 2rem;font-size: 0.9rem;}
.midleft{position: absolute;left: 0;top:50%;}
.topright{position: absolute;right: 0;z-index: 0}
/*page index*/
#form{width: 100%;margin: 0 auto;}
#login{display:block;position:relative;margin:6% auto 0 auto;width: 80%;padding:2.5%;border-radius: 5px;max-width:650px;clear: both;}
#login h1{text-align: left;color: var(--gris);}
#login p{margin: 1rem auto;}
#login input[type="text"]{border: none;margin: 0 auto;text-align:center;padding: 5px 30px;width: calc(90% - 60px);border: 1px solid var(--gris);}
#login label{width: 100%;text-align:left;float: left;padding:5px 0px;font-weight: bold;margin-right: 10px;color: var(--gris);}
#login button:hover{box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);cursor:pointer;background-color: #475569}
#login button{display: block;border-radius: 4px;  background-color:#d6d6d6;  border: none;  color: #FFFFFF;text-align: center;padding: 10px;width: 15%;transition: all 0.5s;cursor: pointer;vertical-align: middle;margin: 1rem 0;}
#login button span {  cursor: pointer;  display: inline-block;  position: relative;  transition: 0.5s;font-size: 0.9rem;}
#login button:hover > span{font-weight:600;}
#login button span:after{  content: '\00bb';  position: absolute;  opacity: 0;  top: 0;  right: -20px;  transition: 0.5s;}
#login button:hover span{  padding-right: 25px;}
#login button:hover span:after {  opacity: 1;  right: 0;}
#labelrememberme{    float: left !important;    width: 87% !important;    margin-right: 0px !important;    margin-left: 5px !important;    font-weight: normal !important;}
#rememberme{float:left;height:20px;width:20px;}
.left1{float:left;width: 49%;margin: 1rem auto;}
.smallspan{font-size:0.75rem;margin: 1rem 0 2rem 0;}
.connexion{background-color: #21d02d !important;}

/*page sol*/

.h3rech{margin-top:1.5rem;margin-bottom:2rem;}
.fil{ margin:1rem auto; color: var(--blackesii); display: block; font-size: 0.9rem}
.fil i{color: #cacaca;font-style: normal;}
.fil a{text-decoration: none;color: var(--blackesii);} 
.sol{cursor: pointer;padding: 0.5rem 2%;text-align: center;margin: 0.15rem 0.5%;float: left;display: inline-block;width: 45%;}
.sol:hover a{color: var(--orangeesii);}
.bigsol{width: 95%;}
.contentsol{display:none; width: 95%;  margin-left: 5%;}
.solres{font-weight:400;display: none;width:50%;margin-top:6px;float:left;color:black;text-decoration:none;}
.solresshow{display: block !important;}
.subbutton{padding: 5px 10px;border-radius: 5px;margin-right:0.25rem;border:none;cursor: pointer;margin-bottom:1.5rem;}
.dlpic{display:block;margin:1.5rem 0rem 2rem 0rem;}
.picto{width: 20px;margin-right: 4px;}
path{fill:red !important;}

.visufr01-Orion{background: url(img/imgsol/Orion.png);background-repeat: no-repeat;background-size:contain;background-position: top right;}
.visufr02-eSirius{background: url(img/imgsol/esirius.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visufr03-eZQ{background: url(img/imgsol/FileUniqueEnCaisse-FR.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visufr04-eGestat{background: url(img/imgsol/egestat.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visufr05-Weasy{background: url(img/imgsol/TicketConnecté-FR.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visufr06-Twavox{background: url(img/imgsol/TWAVOX-LOGO.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visufr07-Smartkiosk{background: url(img/imgsol/SmartKiosk-FR.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visufr08-Phygital_Kiosk{background: url(img/imgsol/Phygital-kiosk-FR.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visufr09-Anciennes_SolutionsHHHOld_Solutions{background: url(img/imgsol/autresol-FR.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visufr01-Stela{background: url(img/imgsol/Stela-FR.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visufr02-KEO{background: url(img/imgsol/Keo-FR.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visufr03-KEOe{background: url(img/imgsol/KEOe-FR.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visufr04-Twana{background: url(img/imgsol/Twana-FR.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visufr05-AfficheursHHHDisplays{background: url(img/imgsol/AFFICHEUR-EN-FR.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visufr06-Périphériques_appelHHHCall_Consoles{background: url(img/imgsol/appel.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visufr07-Coffrets_techniquesHHHTechnical_boxes{background: url(img/imgsol/ctip.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visufr08-Diseo{background: url(img/imgsol/Diseo-FR-EN.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visufr09-Conseils_techniquesHHHTechnical_Advice{background: url(img/imgsol/advice-FR.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}


.visuen01-Orion{background: url(img/imgsol/Orion.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visuen02-eSirius{background: url(img/imgsol/esirius.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visuen03-eZQ{background: url(img/imgsol/FileUniqueEnCaisse-EN.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visuen04-eGestat{background: url(img/imgsol/egestat.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visuen05-Weasy{background: url(img/imgsol/TicketConnecté-EN.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visuen06-Twavox{background: url(img/imgsol/TWAVOX-LOGO.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visuen07-Smartkiosk{background: url(img/imgsol/SmartKiosk-EN.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visuen08-Phygital_Kiosk{background: url(img/imgsol/Phygital-kiosk-EN.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visuen09-Anciennes_SolutionsHHHOld_Solutions{background: url(img/imgsol/autresol-EN.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visuen01-Stela{background: url(img/imgsol/Stela-EN.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visuen02-KEO{background: url(img/imgsol/Keo-EN.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visuen03-KEOe{background: url(img/imgsol/KEOe-EN.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visuen04-Twana{background: url(img/imgsol/Twana-EN.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visuen05-AfficheursHHHDisplays{background: url(img/imgsol/AFFICHEUR-EN-FR.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visuen06-Périphériques_appelHHHCall_Consoles{background: url(img/imgsol/appel.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visuen07-Coffrets_techniquesHHHTechnical_boxes{background: url(img/imgsol/ctip.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visuen08-Diseo{background: url(img/imgsol/Diseo-FR-EN.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}
.visuen09-Conseils_techniquesHHHTechnical_Advice{background: url(img/imgsol/advice-EN.png);background-repeat: no-repeat;background-size: contain;background-position: top right;}

/*page ext*/
.select2-container { width: auto !important;min-width: 20%;}
.select2-selection{width:auto !important;border: 1px solid #2196f3 !important;padding: 2px 20px !important;border-radius: 5px !important;height: auto !important;}
.searchres{display: inline-block;width: 50%;   float:left;margin-top: 6px;text-decoration:none;}
.menutop{   margin-top:1rem;  width: 22%; float: left;border-radius: 15px;height: auto;background-color: #fafafa;box-shadow: 4px 4px 2px -1px #dfd8d8;}
.menutop:first-child;{ margin-left: 1.5rem;}
.dateleft{text-align: left !important;font-size: 0.8rem;}
.menutopcontainer{display: flex;flex-wrap: wrap;margin-left: 1.5rem;    flex-direction: row;    align-content: flex-end;    justify-content: space-between;}
.menutop img{width:100%;border-top-right-radius: 15px;border-top-left-radius: 15px;}
.menutopsol{background:url("img/sol.jpg"); height: 100px;    background-size: contain;    background-repeat: no-repeat;}
.menutoprod{background:url("img/prod.jpg"); height: 100px;    background-size: contain;    background-repeat: no-repeat;}
.menutop p{ text-align: center;color: var(--gris);margin-top:0.5rem;}
.menutopp{margin: 2rem auto !important;padding-left: 1rem;text-align: left !important;min-height: 3.1rem;padding-right: 0.5rem;}
.menutopp a{color: var(--blackesii);font-size: 1rem;}
.menuasmall{font-size:.85rem;}
#menu_sol{margin-left: 1%;}
#menu_prod{margin-left: 1%;}
.newstitle{color: var(--orangeesii);display: block;margin-right: 1.5rem;  margin-top: 1rem;text-align:right;padding-left: 1.7rem;margin-bottom: 1rem;}
.searchsol{margin:0 0 1.5rem 1.5rem;width:25%;border: 1px solid #2196f3;background: url(img/search.svg) no-repeat 4px;   background-size: 20px;    padding:5px 0 5px 30px;border-radius: 5px;display: inline-block;font-size:1.1rem;}
#search{margin:0 0 1.5rem 1.5rem;width: 40%;border: 1px solid #2196f3;padding:7x 0px;background: url(img/search.svg) no-repeat 4px;   background-size: 20px;    padding-left: 30px;border-radius: 5px;display: inline-block;}
.searchrazhome,.searchrazsol{margin-left: -20px;font-weight: 500;font-size: 1.1rem;display: none;cursor: pointer;}
#result{display:none;border: 1px solid var(--gris); background-color: #fafafa;   min-height: 10px;height:auto;padding: 2rem;    flex-direction: column;    flex-wrap: nowrap;    justify-content: center;margin: 1.5rem auto;}
.dlspecesirius{padding:2rem 1rem;background-color:#80808069;clear:both;margin-top:2rem;width: calc(100% - 4rem) !important;}
.esiriuslink{display: block;text-align: center;width: 100% !important;text-decoration: underline;margin-top: 16px;}
.validtoesii,#esiriusversion{padding: 0.5rem 1rem;margin-left: 5px;border-radius: 5px;border:1px solid black;}
.esiriuslink,.MsgDl{display:none;}
.MsgDl{background-color:white;padding: 1rem 4rem;}

/*footer*/
#prefooter{background-color:#fafafa;height:auto;display: block;margin-top: auto;border-radius:5px;padding: 1rem;}
#prefooter p{font-size: 0.9rem;text-align: left;margin-top: 0.5rem;}
#prefooter a{font-size: 0.9rem;}
.prefooterlink{width:49%;margin-top:1%;margin-bottom: 1%;float: left;}
.prefooterlink li{color:#0000ee;margin-left: 25px;}

#footer{border-top:1px solid var(--gris);color: var(--gris);width: 100%;display: block;padding: 0.5% 0%; }
#footer ul{float:left;margin-left: 24%;width: 50%;margin-top: 0.9rem;}
.pictofooter{float:left;height: 1.25rem;margin-right: 1rem;}
.mySlides {display:none;margin-top: 0.25rem;}
.mySlides a{color:var(--gris);}
#fleft a{text-decoration:none;color:var(--gris);}
.smallspan a{color:black;}
#fright{float: right;margin:1rem 2.5% 1rem 0;}
#fleft{float: left;margin:1rem 2.5% 1rem 0;}
@media only screen and (max-width: 968px) {
	#fleft{text-align: center;width: 100%;}
	#footer{display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;}
    #r1,#r2,.midleft,.arrow-up{display:none;} 
    .left1,.searchres,.solres{width: 100%;}
    .menu{width: 90%;}
    #search{width: 80%;}
    .menusol,.menuprod,.menulink{left:0%;}
    .searchsol { margin:0.5rem 0 1.5rem 0rem; width: 50%;     display: block;}
    .logoimgentete {width: 50px;}
    .entete {flex-wrap: wrap;margin: 1rem 0;}
    .entete a{padding: 0 0.5rem;margin:0; }
    .menutop{width: 47%;}
    .menutopcontainer { margin-left: 1rem; margin-right: 1rem;}
}

@media only screen and (max-width: 700px) {
.contentsol{background-size: 6rem !important;}
h1{font-size: 1.75rem;}
h2{font-size: 1.5rem;margin-left: 1.5rem;margin-bottom: 1rem;}
h3{font-size: 1.25rem;margin-bottom:1.5rem;}
h4{font-size: 1.15rem;}
h5{font-size: 1.1rem;}
}
