* { /* pour tous les éléments */
margin:0;
padding:0;
border:0;
}

a {
text-decoration:none;
color:white;
cursor:pointer;
-webkit-transition:all .2s ease-in-out;
-moz-transition:all .2s ease-in-out;
transition:all .2s ease-in-out
}

a:hover,a:focus{text-decoration:none;color:#009400}

a .rouge:hover,a .vert:hover
{
text-shadow:0px 0px 0px   #000;
-moz-text-shadow:0px 0px 0px  #000;
-webkit-text-shadow:0px 0px 0px  #000;
}


#alerte , #reponse, #alertedel {
display:none;
font-family:verdana;
padding:5px;
text-align:center;
font-size:20px;
color:white;
border:2px solid black;
position:fixed;
top:5px;
left:50%;
width:50%;
margin-left:-25%;
z-index:999;
box-shadow: 0 0 50px 20px #fff;
-moz-box-shadow:0 0 50px 20px #fff;
-webkit-box-shadow:0 0 50px 20px #fff;
}

#alertedel{
display:none;
background-color:orange;
text-shadow: 1px 1px 3px #000;
font-weight:bold;
}

#alerte {background-color:#cc0000;}
#reponse {background-color:#5555ff;}

.arial {font-family:arial;}
.bgalerte {background-image:url(../images/alerterouge.gif);}
.bgblanc{background-color:white;}
.bggris {background-color:#ccc;}
.bgnone {background-color:transparent;background-image:none;}
.blanc {color:white;}
.bleu {color:#8080ff;}

.bgblanc {background-color:white;}

.btadm {
position:absolute;top:0;left:0;width:50px;height:50px;cursor:pointer;z-index:2;
}

.btloupe {
color:white;
cursor:pointer;
float:left;
height:20px;
margin-left:5px;
width:20px;
font-size:14px;
}


.editbloc {
border:1px solid black;
padding:5px;
background-color:white;
margin:10px;
}

.blockactu, .blockcateg {
display:block;
padding: 5px;
-moz-border-radius: 10px 0;
-webkit-border-radius: 10px 0;
border-radius: 10px 0;
width:100%;
}

.blockcategplace {
background-color:white;
margin-top:20px;
border:1px solid blue;
min-height:40px;
width:100%;
}


.blockinv {
background-color:#94b454;
border:1px solid #000;
background-image: -webkit-linear-gradient(top,rgba(0,0,0,.5) 0,rgba(0,0,0,.0001) 100%);
background-image: -moz-linear-gradient(top,rgba(0,0,0,.5) 0,rgba(0,0,0,.0001) 100%);
background-image: -ms-linear-gradient(top,rgba(0,0,0,.5) 0,rgba(0,0,0,.0001) 100%);
background-image: linear-gradient(top,rgba(0,0,0,.5) 0,rgba(0,0,0,.0001) 100%);
border-radius:10px;
margin:0 5px 10px 0; 
}

.blockprod {
width:90%;
min-height:470px;
background-size: 250px 200px;
background-position:center 30px;
}

.blockservo {
padding: 5px;
-moz-border-radius: 10px 0;
-webkit-border-radius: 10px 0;
border-radius: 10px 0;
width:100%;
min-height:100px;
}

.blockservoimg {
border:1px solid black;
background-color:white;
background-size: cover;
background-position:center center;
background-repeat:no-repeat;
width:100px;
height:90px;
float:left;
border-radius:10px 0;
}

.blockte {
border-radius:0 0 10px 10px;
color:black;
background-color:white;
padding:10px;
margin:0 2px 2px 2px;
}

.blockvi {
padding-top:5px;
-moz-border-radius: 10px 0;
-webkit-border-radius: 10px 0;
border-radius: 10px 0;
width:230px;
margin:15px auto;
text-align:center;
}

.bordecal {
border-radius: 10px 0;
}

body {
position:relative;
color:#000;
background-color:#d6d6ea;
font-family:Times New Roman;
margin:0;
padding:0;
}

.bold {font-weight:bold;}

.btfermer, .btfermerout {
cursor:pointer;
position:absolute;
top:0;
right:0;
width:30px;
height:30px;
background-image:url(../images/btfermer.png);
background-repeat:no-repeat;
float:none;
}

.btfermerout {
top:-15px;
right:-15px
}

#bthaut {
font-size:40px;
color:#009400;
position:fixed;
bottom:0;
right:3px;
z-index:999;
}

.btfooter {display:inline-block;margin:5px auto;}
.btfooter a {color:#ccc;margin:0 10px;}
.btfooter a:hover {color:#fff;}

.btinsert, .btmodif, .btdelete, .btdeletenon, .btgo, .btjaune, .btorange, .btemail {
border:1px solid #555;
border-radius:5px;
box-shadow: 2px 2px 4px #666;
-moz-box-shadow:2px 2px 4px #666;  
-webkit-box-shadow:2px 2px 4px #666;
color:#000;
cursor :pointer;
display:inline-block;
float:none;
font:bold 14px verdana;
margin:5px auto;
padding:5px;
position:relative;
text-align:center;
text-decoration:none;
vertical-align:middle;
}

.btemail {
background-color:#99ff99;
font-size:11px;
line-height:12px;
margin:5px auto 0 auto;
}

.btemail:hover {
background-color:#FFF;
}


.btgo {position:fixed;right:5px;background-color:orange;z-index:999;color:black;}

.btjaune {background-color:#FFdd66;color:black}
.btorange {background-color:orange;}

.btinsert {background-color:#9999ff;}
.btmodif {background-color:#99ff99;}
.btdelete {background-color:#ff9999;}
.btdeletenon {
background-color:#ff9999;
cursor:default;
opacity:0.5;
}

.btdeplacer, .btcroixrouge, .popup {
position:absolute;
width:25px;
height:25px;
background-position:center center;
background-repeat:no-repeat;
background-color:white;
}

.btdeplacer {background-image:url(../images/btdeplacer.png);top:-2px;left:-2px;cursor:move;}
.btcroixrouge {background-image:url(../images/croixrouge.jpg);bottom:0;right:0;cursor:url("../images/corbeille.png"), default;}
.popup {background-image:url(../images/popup.gif);top:0;right:0;cursor:pointer;}



.btn{
text-transform:uppercase;
-webkit-transition:all .3s ease-in-out;
-moz-transition:all .3s ease-in-out;
transition:all .3s ease-in-out;
}

.btn-circle{
width:70px;
height:70px;
margin-top:15px;
padding:7px 16px;
border:2px solid white;
border-radius:100%!important;
font-size:40px;
color:#fff;
background:transparent;
-webkit-transition:background .3s ease-in-out;
-moz-transition:background .3s ease-in-out;
transition:background .3s ease-in-out;
}
.btn-circle:hover,.btn-circle:focus{outline:0;color:#fff;background:rgba(255,255,255,.1)}
.btn-circle i.animated{-webkit-transition-property:-webkit-transform;-webkit-transition-duration:1s;-moz-transition-property:-moz-transform;-moz-transition-duration:1s}
.btn-circle:hover i.animated{-webkit-animation-name:pulse;-moz-animation-name:pulse;-webkit-animation-duration:1.5s;-moz-animation-duration:1.5s;-webkit-animation-iteration-count:infinite;-moz-animation-iteration-count:infinite;-webkit-animation-timing-function:linear;-moz-animation-timing-function:linear}


.btplus {
left:50%;
margin:5px auto;
width:140px;
border:0;
bottom:30px;
background-color:#5cb85c;
color:black;
font-weight:bold;
}

.btplusfloat {
width:140px;
border:0;
position:relative;
background-color:#5cb85c;
color:black;
font-weight:bold;
margin:10px 0;
}

.categemailselec {
font-size:10px;
float:left;
border:1px solid black;
margin:3px;
background-color:white;
padding:2px 5px;
border-radius:3px;
}

.categliste {
display:inline-block;
margin:0 auto;
text-align:center;
width:100%;
}

.categliste ul, .categliste li {
display:inline-block;
list-style:none;
margin:0 auto;
}

.categliste li ul {
display:none;
}

.categliste li:hover ul {
/*display:block;*/
position:relative;
}

.categliste  ul ul {
position:relative
}

.categlisteaff {
margin:1px auto;
border:1px solid black;
padding:1px 3px;
cursor:pointer;
}

.categlisteaff {
background-color:white;
color:#333;
}

.categlisteaff:hover {
color:#FFF;
background-color:#333;
}


.center {text-align:center;}

#chargement {
display:block;
position:fixed;
top: 50px; 
left: 0;
width:100%;
height:100%;
z-index:998;
background-color:rgba(0,0,0,.8);
background-image:url(../images/loading.gif);
background-repeat:no-repeat;
background-position:center center;
}

.clear {clear:both;}

.degbleu{
background-image: -webkit-linear-gradient(#fff,#d6d6ea);
background-image:-o-linear-linear-gradient(#fff,#d6d6ea);
background-image:-moz-linear-gradient(#fff,#d6d6ea);
background-image:linear-gradient(#fff,#d6d6ea);
}

.degbleuinv{
background-image: -webkit-linear-gradient(#d6d6ea,#fff);
background-image:-o-linear-linear-gradient(#d6d6ea,#fff);
background-image:-moz-linear-gradient(#d6d6ea,#fff);
background-image:linear-gradient(#d6d6ea,#fff);
}

.degbleuinvplus{
background-image: -webkit-linear-gradient(#c6c6d6,#e6e6ff);
background-image:-o-linear-linear-gradient(#c6c6d6,#e6e6ff);
background-image:-moz-linear-gradient(#c6c6d6,#e6e6ff);
background-image:linear-gradient(#c6c6d6,#eeeeff);
}

.divcateg {
background-color:#a8a9fe;
border:1px solid black;
cursor:pointer;
float:left;
margin:5px;
padding:2px 5px;
}

.divcateg:hover {
background-color:#fff;
}



.divemail {
border:1px solid black;
margin:5px;
background-color:#a8a9fe;
}

#divnavbar {
font-family:verdana;
margin-bottom:0;
}

.drapfr {
width:40px;
position:absolute;
bottom:160px;
right:84%;
}

.enligne {display:inline-block;}


.etiq {
float:left;
font-weight:bold;
width:100%;
margin-top:10px;
text-align:right;
}

.etoilevert, .etoilerouge, .etoileblanc {
background-position:0 2px;
background-repeat:no-repeat;
padding:2px 0 0 35px;
text-align:left;
min-height:32px;
}

.etoilevert {background-image:url(../images/etoilevert30.png);}
.etoilerouge {background-image:url(../images/etoilerouge30.png);}
.etoileblanc {background-image:url(../images/etoileblanc30.png);}

.expli {
background-color:orange;
padding:2px 5px;
border:1px solid black;
display:inline-block;
float:none;
}

#fdservo {
min-height:100%;
width:100%;
position:absolute;
background-position:center center;
background-repeat:no-repeat;
background-image:url(../images/servovalves-hydraustar.png);
margin-top: -50px;
padding-top:50px;
background-size: 450px 383px;
}


#fenup {
background-color:rgba(0, 0, 0, 0.7);
display:none;
padding:10px 10px 50px 10px;
position:absolute;
top:0;
width:100%;
min-height:100%;
z-index:900;
}


fieldset {
float:none;
font-family: Verdana; 
font-size: 12px; 
padding:5px;
margin:10px auto;
border:1px solid #000;
border-radius:5px;
background-color:#bbbbff;
width:100%;
}

.fili, .fili2 {position:absolute;height:150px;padding-top:20px;line-height:150px;vertical-align:middle;}
.fili img, .fili2 img  {max-height:100%;margin:0 auto;}
.fili2{display:none;}
.floatL {float:left;}
.floatR {float:right;}

#footer {
height:60px;
/*margin:-60px 0;
position:fixed;
top:100%;*/
width:100%;
background-color:black;
text-align:center;
z-index:999;
}

.formrech {
text-align:center;width:100%;background-color:black;height:40px;z-index:900;padding:10px 0 5px 0
}

#formrechercheinput {width:280px;}

.gris {color:#666;}

.h2 {font-weight:bold;margin-top:0;}

.hmax {
min-height:100%;
padding-bottom:60px;
}

html{
overflow-y: scroll;
width:100%;
height:100%;
}

input {font-size:16px;}

i {
margin-right:5px;
width:30px;
height:30px;
text-align:center;
margin-top:2px;

}

.image {
width:90%;
border:2px solid #fff;
}

.img-center{max-width:100%;margin:0 auto;}
.italic {font-style:italic;}

legend {
position:relative;
min-height:34px;
font-size:14px;
background-color:#8080ff;
color:#EEE;
font-weight:bold;
border:1px solid #FFF;
border-radius:5px;
padding:5px;
margin-bottom:0;
}

.label {
float:left;
font-size:12px;
}


.logo {
float:left;
width:100px;
height:100px;
background-size: contain;
background-position:center center;
background-repeat:no-repeat;
background-image:url(../images/logo.png);
margin:10px;
}

#logomenu {
display:none;
}

.map-responsive {
overflow:hidden;
padding-bottom:100%;
position:relative;
height:0;
}

.map-responsive iframe {
left:0;
top:0;
height:100%;
width:100%;
position:absolute;
}


.maxl{width:100%;}
.mgh-10 {margin-top:-10px;}
.mgh-20 {margin-top:-20px;}

.mg0 {margin:0}
.mgh5 {margin-top:5px;}
.mg10 {margin-top:10px;}
.mg20 {margin-top:20px;}
.mg30 {margin-top:30px;}
.mgd10 {margin-right:10px;}

.mgb10 {margin-bottom:10px;}
.mgb20 {margin-bottom:20px;}

.mgg10 {margin-left:10px;}
.mgg15 {margin-left:15px;}
.mgg20 {margin-left:20px;}
.mgg50 {margin-left:50px;}
.mgg100 {margin-left:100px;}

.mgh10 {margin-top:10px;}
.mgh15 {margin-top:15px;}
.mgh20 {margin-top:20px;}
.mgh30 {margin-top:30px;}
.mgh40 {margin-top:40px;}
.mgh60 {margin-top:60px;}
.mgh70 {margin-top:70px;}
.mgh80 {margin-top:80px;}

.mgh200 {margin-top:200px;}
.mgh400 {margin-top:400px;}
.mgl20{margin-left:20px;}


.noir {color:#000;}

.omb {
box-shadow: 5px 5px 10px  #000;
-moz-box-shadow:5px 5px 10px  #000;
-webkit-box-shadow:5px 5px 10px  #000;
}

.omb2 {
box-shadow: 2px 2px 5px  #000;
-moz-box-shadow: 2px 2px 5px  #000;
-webkit-box-shadow: 2px 2px 5px  #000;
}


.ombcontour {
text-shadow: 0px 0px 4px   #000;
}

.opac {opacity:0.33;cursor:default;}

.padb20 {padding-bottom:20px;}
.padb70 {padding-bottom:70px;}
.pad10 {padding:10px;}
.pad20 {padding:20px;}
.pad0 {padding:0;}


.photo {
position:absolute;
width:100%;
height:100%;
background-size: cover;
background-position:center center;
background-repeat:no-repeat;
border: 2px solid #aaa;
}

.photoviadm, .photoviadmJPG  {
margin:5px;
float:left;
width: 150px;
height: 150px;
border: 1px solid black;
text-align: center;
vertical-align: middle;
background-image: -webkit-linear-gradient(top,rgba(0,0,0,.5) 0,rgba(0,0,0,.0001) 100%);
background-image: -moz-linear-gradient(top,rgba(0,0,0,.5) 0,rgba(0,0,0,.0001) 100%);
background-image: -ms-linear-gradient(top,rgba(0,0,0,.5) 0,rgba(0,0,0,.0001) 100%);
padding:10px;
}

.photoviadmJPG {
background-color:white;
background-image:none}

#photovoir {
top:0;
text-align:center;
display:none;
width:100%;
height:100%;
position:fixed;
z-index:999;
background-color: rgba(0, 0, 0, 0.5);
}

#photovoirin {
position:relative;
padding:5px;
display:inline-block;
cursor:pointer;
box-shadow: 0 0 40px  #000;
-moz-box-shadow:0 0 40px  #000; 
-webkit-box-shadow:0 0 40px  #000;
border:1px solid black;
background-color:#FFF;
margin:20px auto;
background-image:url(images/loading.gif);
background-repeat:no-repeat;
background-position:center center;
}

.pointer {cursor:pointer;}

.promo {
background-size: contain;
background-position:center center;
background-repeat:no-repeat;
background-image:url(../images/promo.png);
font-family:arial;
font-size:12px;
}

#recup {
display:none;
position:fixed;
top:0;
z-index:2;
text-align:center;
background-color:black;
}

#recupin {
padding:0 10px;
position:relative;
margin:0 auto;
display:inline-block
}

#recupstoc {display:block;}

.rouge {color:#DE0000;}
.te10 {font-size:10px;}
.te12 {font-size:12px;}
.te14 {font-size:14px;}
.te16 {font-size:16px;}
.te18 {font-size:18px;}
.te24 {font-size:24px;}
.te28 {font-size:28px;}
.te32 {font-size:32px;}
.te36 {font-size:36px;}
.te40 {font-size:40px;}

.teblockprod {
font-size:16px;
padding:240px 10px 10px 10px;
text-align:left;
}

.teomb1 {
text-shadow:1px 1px 1px #000;
}

.teomb2 {
text-shadow:2px 2px 2px #000;
}

.teservo {
font-size:15px;
padding:3px;
text-align:center;
line-height:12px;
min-width:200px;
}


.tevi {
font-size:20px;
text-align:center;
}

.titre{
background-color:#777;
border:1px solid black;
color:white;
display:inline-block;
float:none;
font-size:18px;
font-weight:bold;
margin:10px auto;
padding:2px 5px;
text-shadow:1px 1px 1px #000;

}

.vert {color:#009400;}
 
.vertte {
color:#4e591d;
font-size:18px;
text-align:center;
}

.viphotoadm {
position: relative;
display: block;
float: left;
width:120px;
margin:20px;
background-color:white;
padding:5px;
box-shadow: 3px 3px 10px #000;
-moz-box-shadow:3px 3px 10px #000; 
-webkit-box-shadow:3px 3px 10px #000;
border:2px solid white;
}

.viphotoadmbasic {
background-size:contain;
background-position:center center;
background-repeat:no-repeat;
height:110px;
width:100%;
}

.viphotoadmzs {
cursor:pointer;
height:70px;
position:absolute;
top:25px;
width:105px;
}

.vipresent {
padding: 5px;
-moz-border-radius: 10px 0;
-webkit-border-radius: 10px 0;
border-radius: 10px 0;
margin:20px auto;
}

.vipresentprod {
padding: 5px;
-moz-border-radius: 10px 0;
-webkit-border-radius: 10px 0;
border-radius: 10px 0;
margin:20px auto;
max-width:340px;
}

.viservo {
float:left;
background-color:white;
color:black;
margin:8px 10px 2px 2px;
padding:2px 5px;
}

.wi50 {width:50%;}
.wim350 {max-width:350px;}
.wimax {width:100%;}

.xcenter {margin:0 auto;}
#xsimgservo {margin-top:30px;}
#xstepresent{margin-top:5px;padding:0 60px;}
@-webkit-keyframes pulse{
0{ -webkit-transform:scale(1);transform:scale(1)}
50%{-webkit-transform:scale(1.2);transform:scale(1.2)}
100%{-webkit-transform:scale(1);transform:scale(1)}
}

@-moz-keyframes pulse{
0{ -moz-transform:scale(1);transform:scale(1)}
50%{-moz-transform:scale(1.2);transform:scale(1.2)}
100%{-moz-transform:scale(1);transform:scale(1)}
}

 @media (min-width:768px){
 .navbar-brand {margin-left:60px;}
 #logomenu {
display:block;
position:absolute;
top:0;
left:0;
width:80px;
}

#xsimgservo {margin-top:10px;}
#xstepresent{margin-top:20px;}
 .fili2{display:block;}
 .hmax{padding-bottom:30px;padding-top:110px;}
 #footer{height:30px;margin:-30px 0;}
 h1, .h1{font-size:48px}
 h2, .h2{font-size:40px;}
 #bthaut{bottom:0}
.drapfr {width:50px;	bottom:0;right:90%;}
}
 
 @media (min-width:992px){
 #logomenu {width:90px;}

.vipresentte{min-height:220px;}
#xsimgservo {margin-top:0px;}
#xstepresent{margin-top:40px;}

 .hmax{padding-bottom:30px;padding-top:70px;}
 h1, .h1{font-size:60px}
 h4, .h4{font-size:28px}
 h5, .h5{font-size:16px}
#logofrance {top:20px;width:300px;height:200px;}
.drapfr {width:60px;	bottom:0;right:60px;}

}
 
 @media (min-width:1200px){
 #xstepresent{margin-top:100px;}
 #logomenu {width:110px;}

 .hmax{padding-bottom:30px;padding-top:0;}
 h1, .h1{font-size:60px}
 h3, .h3{font-size:32px}
 h4, .h4{font-size:28px}
 h5, .h5{font-size:20px}
.drapfr {width:60px;	bottom:60px;right:60px;}

 }