@import url();

body {
   width: 1024px;
   margin: auto; /* Pour centrer notre page */
   /* Pour éviter de coller avec le haut de la fenêtre du navigateur. Essayez d'enlever pour voir ! */
   margin-bottom: 20px;    /* Idem pour le bas du navigateur */
   font-family: Verdana, Helvetica, sans-serif;
   font-size: 100%;
   line-height: 100%;
   text-align: center;
   background-color: #999999;
	
}



#fond-site{
	width: 1024px;
	height: 800px;
	background-image: url("capsys-images/Fond Gris-1024C.png");
	background-repeat: no-repeat;
}

#logo{
	float: left;
	width: 260px;
	height: 110px;
	padding-top: 15px;
	padding-left: 0px;
			
}		

#slogan{
	float: left;
	width: 754px;
	height: 110px;
	background-image: url("capsys-images/Fond_BandOK_Flash.png");
	
		
}

#banner{
	float: left;
	width: 468px;
	height: 60px;
	padding-top: 40px;
	padding-left: 276px;
	
		
}


#separation{
	clear: left;
	float: left;
	width: 1024px;
	height: 2px;
	background-color: #ffffff;
		
}		

#separation2{
	
	float: left;
	width: 1024px;
	height: 50px;
	background-color: #e96f21;
		
}		


		

#logo_back{
	clear: left;
	float: left;
	width: 1024px;
	height: 10px;
	
	background-color: #e96f21;
		
}		



	


#menu, #menu ul /* Liste */     
{
        
        float: left;
        
	    padding : 0; /* pas de marge intérieure */
        margin: 0; /* ni extérieure */
        list-style : none; /* on supprime le style par défaut de la liste */
        line-height : 20px; /* on définit une hauteur pour chaque élément */
        text-align : center; /* on centre le texte qui se trouve dans la liste */
}

#menu /* Ensemble du menu */
{
	float: left;
	width : 805px;
	height: 20px;
	margin-left: 230px;
	font-weight : bold; /* on met le texte en gras */
    font-family : Verdana; /* on utilise Verdana, c'est plus beau ^^ */
    font-size : 10px; /* hauteur du texte : 10 pixels */
}

#navtop-qui:hover /* Lorsque la souris passe sur un des liens */    
{
        color: #ffffff; /* On passe le texte en gris... */
        background-image: url("capsys-images/menuroll-qui.png");
	    background-repeat: no-repeat;
}


#navtop-qui /* Contenu des listes */
{
        
       display : block; /* on change le type d'élément, les liens deviennent des balises de type block */
        padding-left : 10px; /* aucune marge intérieure */
        background-image: url("capsys-images/menu-qui.png");
	    background-repeat: no-repeat;        
        color : #656565; /* couleur du texte */
        text-decoration : none; /* on supprime le style par défaut des liens (la plupart du temps = souligné) */
        width : 150px; /* largeur */
}

#navtop-offre:hover /* Lorsque la souris passe sur un des liens */    
{
        color: #ffffff; /* On passe le texte en gris... */
        background-image: url("capsys-images/menuroll2-offre.png");
	    background-repeat: no-repeat;
}



#navtop-offre /* Contenu des listes */
{
        display : block; /* on change le type d'élément, les liens deviennent des balises de type block */
        padding-left : 10px; /* aucune marge intérieure */
        background-image: url("capsys-images/menu-offre.png");
	    background-repeat: no-repeat;        
        color : #656565; /* couleur du texte */
        text-decoration : none; /* on supprime le style par défaut des liens (la plupart du temps = souligné) */
        width : 150px; /* largeur */
}


.navtop-infqui:hover /* Lorsque la souris passe sur un des liens */    
{
        color: #ffffff; /* On passe le texte en gris... */
        background: #656565;
	    background-repeat: no-repeat;
}


.navtop-infqui /* Contenu des listes */
{
        display : block; /* on change le type d'élément, les liens deviennent des balises de type block */
        padding : 0px; /* aucune marge intérieure */
        background-color: #e96f21;
	    background-repeat: no-repeat;        
        color : #656565; /* couleur du texte */
        text-decoration : none; /* on supprime le style par défaut des liens (la plupart du temps = souligné) */
        width : 150px; /* largeur */
}

.navtop-infprod:hover /* Lorsque la souris passe sur un des liens */    
{
        color: #ffffff; /* On passe le texte en gris... */
        background: #656565;
	    background-repeat: no-repeat;
}


.navtop-infprod /* Contenu des listes */
{
        display : block; /* on change le type d'élément, les liens deviennent des balises de type block */
        padding : 0px; /* aucune marge intérieure */
        background-color: #e96f21;
	    background-repeat: no-repeat;        
        color : #656565; /* couleur du texte */
        text-decoration : none; /* on supprime le style par défaut des liens (la plupart du temps = souligné) */
        width : 150px; /* largeur */
}


.navtop-inf2tpe:hover /* Lorsque la souris passe sur un des liens */    
{
        color: #ffffff; /* On passe le texte en gris... */
        background: #656565;
	    background-repeat: no-repeat;
}


.navtop-inf2tpe /* Contenu des listes */
{
        display : block; /* on change le type d'élément, les liens deviennent des balises de type block */
        padding : 0px; /* aucune marge intérieure */
        background-color: white;
	    background-repeat: no-repeat;        
        color : #656565; /* couleur du texte */
        text-decoration : none; /* on supprime le style par défaut des liens (la plupart du temps = souligné) */
        width : 150px; /* largeur */
}

.navtop-inf2sante:hover /* Lorsque la souris passe sur un des liens */    
{
        color: #ffffff; /* On passe le texte en gris... */
        background: #656565;
	    background-repeat: no-repeat;
}


.navtop-inf2sante /* Contenu des listes */
{
        display : block; /* on change le type d'élément, les liens deviennent des balises de type block */
        padding : 0px; /* aucune marge intérieure */
        background-color: white;
	    background-repeat: no-repeat;        
        color : #656565; /* couleur du texte */
        text-decoration : none; /* on supprime le style par défaut des liens (la plupart du temps = souligné) */
        width : 150px; /* largeur */
}



#navtop-produit:hover /* Lorsque la souris passe sur un des liens */    
{
        color: #ffffff; /* On passe le texte en gris... */
        background-image: url("capsys-images/menuroll2-produit.png");
	    background-repeat: no-repeat;
}



#navtop-produit /* Contenu des listes */
{
        display: block; /* on change le type d'élément, les liens deviennent des balises de type block */
         padding-left : 10px;/* aucune marge intérieure */
        background-image: url("capsys-images/menu-produit.png");
	    background-repeat: no-repeat;        
        color: #656565; /* couleur du texte */
        text-decoration: none; /* on supprime le style par défaut des liens (la plupart du temps = souligné) */
        width: 150px; /* largeur */
}

#navtop-contact:hover /* Lorsque la souris passe sur un des liens */    
{
        color: #ffffff; /* On passe le texte en gris... */
        background-image: url("capsys-images/menuroll2-contact.png");
	    background-repeat: no-repeat;
	    width : 150px; /* largeur */
}




#navtop-contact /* Contenu des listes */
{
        display : block; /* on change le type d'élément, les liens deviennent des balises de type block */
         padding-left : 10px;/* aucune marge intérieure */
        background-image: url("capsys-images/menu-contact.png");
	    background-repeat: no-repeat;        
        color : #656565; /* couleur du texte */
        text-decoration : none; /* on supprime le style par défaut des liens (la plupart du temps = souligné) */
        width : 150px; /* largeur */
}


#navtop-ecommerce:hover /* Lorsque la souris passe sur un des liens */    
{
        color: #ffffff; /* On passe le texte en gris... */
        background-image: url("capsys-images/menuroll2-ecommerce.png");
	    background-repeat: no-repeat;
	    width : 150px; /* largeur */
}




#navtop-ecommerce /* Contenu des listes */
{
        display : block; /* on change le type d'élément, les liens deviennent des balises de type block */
        padding-left : 10px; /* aucune marge intérieure */
        background-image: url("capsys-images/menu-ecommerce.png");
	    background-repeat: no-repeat;        
        color : #656565; /* couleur du texte */
        text-decoration : none; /* on supprime le style par défaut des liens (la plupart du temps = souligné) */
        width : 150px; /* largeur */
}



#menu li /* Éléments des listes */      
{ 
        float : left; 
        /* pour IE qui ne reconnaît pas "transparent" */
        border-right : 1px solid #fff; /* on met une bordure blanche à droite de chaque élément */
}

/* IE ne reconnaissant pas le sélecteur ">" */
html>body #menu li
{
        border-right: 1px solid transparent ; /* on met une bordure transparente à droite de chaque élément */
}

#menu li ul /* Sous-listes */
{ 
        position: absolute; /* Position absolue */
        width: 144px; /* Largeur des sous-listes */
        left: -999em; /* Hop, on envoie loin du champ de vision */
}

#menu li ul li /* Éléments de sous-listes */
{
        /* pour IE qui ne reconnaît pas "transparent" (comme précédemment) */
        border-top : 1px solid #fff; /* on met une bordure blanche en haut de chaque élément d'une sous liste */
}


/* IE ne reconnaissant pas le sélecteur ">" */
html>body #menu li ul li                
{
        border-top : 1px solid transparent; /* on met une bordure transparente en haut de chaque élément */
}


#menu li ul ul 
{
        margin    : -21px 0 0 150px ; /* On décale les sous-sous-listes pour qu'elles ne soient pas au dessus des sous-listes */ 
        /* pour IE qui ne reconnaît pas "transparent" (comme précédemment) */
        border-left     : 1px solid #fff ; /* Petite bordure à gauche pour ne pas coller ... */      
}

/* IE ne reconnaissant pas le sélecteur ">" ... je me répète ;-) */
html>body #menu li ul ul                
{
        border-left     : 1px solid transparent ; /* on met une bordure transparente sur la gauche de chaque élément */
}


#menu li:hover ul ul, #menu li.sfhover ul ul /* Sous-sous-listes lorsque la souris passe sur un élément de liste */
{
        left: -999em; /* On expédie les sous-sous-listes hors du champ de vision */
}

#menu li:hover ul, #menu li li:hover ul, #menu li.sfhover ul, #menu li li.sfhover ul  /* Sous-listes lorsque la souris passe sur un élément de liste ET sous-sous-lites lorsque la souris passe sur un élément de sous-liste */
{
        left: auto; /* Repositionnement normal */
        min-height: 0; /* Corrige un bug sous IE */
}

#menu_bandeau{
	float: left;
	width: 1024px;
	height:1px;
	margin: 0;
	background-color: #e96f21;
		
}	







.home:hover{
	float: left;
	width: 35px;
	height: 35px;
	background-image: url("capsys-images/iconeroll-home.png");
	background-repeat: no-repeat;       
	margin-left: 12px;		    	
}

.home{
	float: left;
	width: 35px;
	height: 35px;
	background-image: url("capsys-images/icone-home.png");
	background-repeat: no-repeat; 
	margin-left: 12px;
	
		    	
}






.telecharger2:hover{
	
	background-image: url("capsys-images/iconeroll-telecharger.png");
	background-repeat: no-repeat;       
	text-align : center;
			    	
}



.telecharger2{
	
	background-image: url("capsys-images/icone-telecharger.png");
	background-repeat: no-repeat;
	text-align : center;
	
	
		    	
}


.telecharger:hover{
	width: 35px;
	height: 35px;
	background-image: url("capsys-images/iconeroll-telecharger.png");
	background-repeat: no-repeat;       
	margin-left: 5px;		    	
}



.telecharger{
	float: left;
	width: 35px;
	height: 35px;
	background-image: url("capsys-images/icone-telecharger.png");
	background-repeat: no-repeat;
	margin-left: 5px;
	
		    	
}


.ecommerce:hover{
	float: left;
	width: 35px;
	height: 35px;
	background-image: url("capsys-images/iconeroll-ecommerce.png");
	background-repeat: no-repeat;       
	margin-left: 5px;		    	
}

.ecommerce{
	float: left;
	width: 35px;
	height: 35px;
	background-image: url("capsys-images/icone-ecommerce.png");
	background-repeat: no-repeat; 
	margin-left: 5px;
	
		    	
}

.contact:hover{
	float: left;
	width: 35px;
	height: 35px;
	background-image: url("capsys-images/iconeroll-contact.png");
	background-repeat: no-repeat;       
	margin-left: 5px;		    	
}



.contact{
	float: left;
	width: 35px;
	height: 35px;
	background-image: url("capsys-images/icone-contact.png");
	background-repeat: no-repeat;
	margin-left: 5px;
	
		    	
}

.rapidite:hover{
	float: left;
	width: 200px;
	height: 60px;
	background-image: url("capsys-images/rapiditeroll.png");
	background-repeat: no-repeat;       
	margin-left: 10px;		    	
}



.rapidite{
	float: left;
	width: 200px;
	height: 60px;
	background-image: url("capsys-images/rapidite.png");
	background-repeat: no-repeat;
	margin-left: 10px;	
		    	
}

.securite:hover{
	float:left;
	width: 200px;
	height: 60px;
	background-image: url("capsys-images/securiteroll.png");
	background-repeat: no-repeat;       
	margin-left: 10px;		    	
}



.securite{
	float: left;
	width: 200px;
	height: 60px;
	background-image: url("capsys-images/securite.png");
	background-repeat: no-repeat;
	margin-left: 10px;	
		    	
}

.economie:hover{
	float:left;
	width: 200px;
	height: 60px;
	background-image: url("capsys-images/economieroll.png");
	background-repeat: no-repeat;       
	margin-left: 10px;		    	
}



.economie{
	float: left;
	width: 200px;
	height: 60px;
	background-image: url("capsys-images/economie.png");
	background-repeat: no-repeat;
	margin-left: 10px;	
		    	
}

.disponibilite:hover{
	float:left;
	width: 200px;
	height: 60px;
	background-image: url("capsys-images/disponibiliteroll.png");
	background-repeat: no-repeat;       
	margin-left: 10px;		    	
}



.disponibilite{
	float: left;
	width: 200px;
	height: 60px;
	background-image: url("capsys-images/disponibilite.png");
	background-repeat: no-repeat;
	margin-left: 10px;	
		    	
}

.solution:hover{
	float:left;
	width: 200px;
	height: 60px;
	background-image: url("capsys-images/solutionroll.png");
	background-repeat: no-repeat;       
	margin-left: 10px;		    	
}



.solution{
	float: left;
	width: 200px;
	height: 60px;
	background-image: url("capsys-images/solution.png");
	background-repeat: no-repeat;
	margin-left: 10px;	
		    	
}

.competence:hover{
	float:left;
	width: 200px;
	height: 60px;
	background-image: url("capsys-images/competenceroll.png");
	background-repeat: no-repeat;       
	margin-left: 10px;		    	
}



.competence{
	float: left;
	width: 200px;
	height: 60px;
	background-image: url("capsys-images/competence.png");
	background-repeat: no-repeat;
	margin-left: 10px;	
		    	
}







#espace-vide1{
	float: left;
	width: 1024px;
	height: 70px;
	    	
}

#espace-vide2{
	float: left;
	width: 250px;
	height: 400px;
	    	
}

.legend-tpe{
	font-size: 55%;
	font-weight: bold;
	color:#ffffff;
	text-align: center;
	 	
}

.defibrillateur-size{
	width: 80px;
	height: 119px;
	 	
}

.defibrillateur2-size{
	width: 80px;
	height: 80px;
	 	
}


.t-resto-logos{
	width: 120px;
	height: 78px;
	 	
}

.t-resto-crt{
	width: 80px;
	height: 44px;
	 	
}


.t-resto-materiel1{
	width: 80px;
	height: 63px;
	 	
}

.t-resto-materiel2{
	width: 80px;
	height: 87px;
	 	
}

.t-resto-resto1{
	width: 80px;
	height: 107px;
	 	
}






#espace-vide3{
	float: left;
	width: 1024px;
	height: 38px;
	    	
}

#texte-left{
	padding-left: 15px;
	font-size: 60%;
	font-weight: bold;
	color:#656565;
	text-align: left;
	 	
}



#textup{
	
	float: left;
	width: 589px;
	height: 460px;
	padding-right: 5px;
	font-size: 75%;
	line-height: 120%;
	text-align: left;
	color: #656565;
	
    	
}




#textactu{
	
	float: left;
	width: 730px;
	height: 460px;
	padding-right: 5px;
	
	font-size: 75%;
	line-height: 120%;
	text-align: left;
	color: #656565;
	
    	
}


#cadre-contact{
	float: left;
	width: 180px;
	height: 400px;
	background-image: url("capsys-images/cadre-contactgris2.png");
	background-repeat: no-repeat;
	font-size: 90%;
	text-align: center;
	color: #656565;
	
    	
}

#info_capsys{
	float:left;
	width: 180px;
	height: 380px;
	color: #656565;
	font-size: 75%;
	font-weight: bold;
	text-align: center;		    	
}

.text-contact{
	color: #fff;
	font-size: 90%;
	font-weight: bold;
	text-transform: uppercase;
	text-decoration: none;
	text-align: center;		    	
}


#sarl_capsys{
	float: left;
	width: 1024px;
	height: 50px;
	background-color:#e96f21;
	font-size: 55%;
	text-align: center;
	color: #ffffff;
}



#footer_link{
	float: left;
	width: 1024px;
	height: 20px;
	font-size: 60%;
	
	text-transform: uppercase;
	text-align: center;
	
}


#footer-ref{
	float: left;
	width: 1024px;
	height: 20px;
	font-size: 55%;
	text-align: center;
	color: #656565;
}



#footer_legal{
	float: left;
	width: 1024px;
	height: 10px;
	font-size: 55%;
	text-align: center;
	color: #656565;
	
}





.navigation2 {
	font-size: 80%;
	color: #e96f21;
	text-align: center;
	text-decoration: none;
    position: relative;
        	
}

.mail:hover{
	text-decoration: underline;
	color: white;	 	
}

.mail{
	text-decoration: underline;
	color: #656565;
		 	
}

.text-actu:hover{
	font-weight: bold;
	text-transform: uppercase;
	text-decoration: underline;
	color: white;	 	
}

.text-actu{
	font-weight: bold;
	text-transform: uppercase;
	text-decoration: underline;
	color: #656565;
		 	
}






.brochure:hover{
	text-decoration: underline;
	color: white;	 	
}

.brochure{
	text-decoration: underline;
	color: #656565;
		 	
}


.texticone {
	font-size: 55%;
	color: #656565;
	
        	
}



.legal:hover{
	text-decoration: underline;
	color: #ffffff;	 	
}

.legal{
	text-decoration: underline;
	color: #656565;
		 	
}


.important{
	font-weight: bold;
	text-transform: uppercase;
	color: #ffffff;
	 	
}


.important2{
	font-weight: bold;
	color: #ffffff;
	 	
}



img {
	
	border: 0;
}

h2{
	
	color: #656565;
}