/************  STYLES GENERAUX DU SITE  ***********************/
body {
	background-color: #18181A;
	margin-top:3px;
}

* {font-family:Arial, Helvetica, sans-serif; font-size: 12px;}

img {border:none;}

#conteneur {
	width:900px;
	margin-left:auto;
	margin-right:auto;
}

#logo {
	float:left;
	margin-left:6px;
	margin-top:12px;
}

/**************  PAGES + BACKGROUNDS  ****************************/
#accueilpage {
	width:900px;
	background:url(images/accueil.jpg) no-repeat;
	background-color:#09090B;
	float:left;
	color:#FFF;
}

#reseaupage {
	width:900px;
	background:url(images/reseau.jpg) no-repeat;
	background-color:#593F5A;
	float:left
}

#collaboratifpage {
	width:900px;
	background:url(images/collaboratif.jpg) no-repeat;
	background-color:#453631;
	float:left
}

#securitepage {
	width:900px;
	background:url(images/securite.jpg) no-repeat;
	background-color:#554D36;
	float:left
}

#systemepage {
	width:900px;
	background:url(images/systeme.jpg) no-repeat;
	background-color:#27503E;
	float:left
}

#telephoniepage {
	width:900px;
	background:url(images/telephonie.jpg) no-repeat;
	background-color:#17313E;
	float:left
}

#grispage {
	width:900px;
	background:url(images/fondgris.jpg) no-repeat;
	float:left;
}

#blancpage {
	width:900px;
	background:url(images/fondblanc.jpg) no-repeat;
	background-color:#FFF;
	float:left;
}

/**************  SIGNATURE  ****************************/
.margeleft48 {
	float:left;
	width:800px;
	margin:0px;
	padding:0px;
	margin-left:48px;
	_margin-left:24px;
	font-family:Georgia, "Times New Roman", Times, serif;
	color:#FFF;
	font-size:20px;
	line-height:21px;
}
.grisclair {
	margin:0px;
	padding:0px;
	color:#CBCBCD;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:20px;
}
.grismoyen {
	margin:0px;
	padding:0px;
	color:#98979F;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:20px;
}

/******************************************  TEXTES  ***********************************************/
/**************  RAPPEL TITRE GROS ET DISCRET  *******************/
div.vide {
float:left; 
height:60px; 
border: 0px solid;
width:325px; 
line-height:60px; 
font-family:Georgia, "Times New Roman", Times, serif;
font-size:40px;
letter-spacing:5px;
padding-left:15px;
}
div#videreseau {color:#614462;}
div#videaccueil {color:#26262D;}
div#videsocietechiffres {color:#26262D;}
div#videsecu {color:#716546;}
div#videsysteme {color:#2F624A;}
div#videcollab {color:#604A4D;}
div#videteleph {color:#1A3948;}
div#videgris {color: #919191;}
div#videblanc {color: #919191;}

/**************** TEXTES PAR DEFAUT DANS CHAQUE ELEMENT DE PAGE **********/
/**************** COLONNE ACTUS-SSMENUS **********/
div.colactu p {
	line-height:16px;
	margin:0px;
	padding:0px;
}
div.colactu p a {
	font-weight:bold;
	text-decoration:underline
}
div.colactu p a:hover {
	font-weight:bold;
	text-decoration:none
}

div p.actutitre {
	font-size:14px;
	height:19px;
	line-height:19px;
	font-weight:bold;
}
div p.actutitre span {
	font-size:14px;
}
#accueilpage div.colactu p#accueilactutitre {
	background:url(images/accueil-bg-actu-haut.jpg) no-repeat;
	color:#CC3431;
}
#grispage div.colactu p#grisactutitre {
	background:url(images/gris-bg-actu-haut.jpg) no-repeat;
	color: #CC3431;
}
#blancpage div.colactu p#blancactutitre {
	background:url(images/blanc-bg-actu-haut.jpg) no-repeat;
	color:#CC3431;
}
#reseaupage div.colactu p#reseauactutitre {
	background:url(images/reseau-bg-actu-haut.jpg) no-repeat;
	color:#9999CC
}
#securitepage div.colactu p#securiteactutitre {
	background:url(images/securite-bg-actu-haut.jpg) no-repeat;
	color:#FDCD61;
}
#systemepage div.colactu p#systemeactutitre {
	background:url(images/systeme-bg-actu-haut.jpg) no-repeat;
	color:#69B694;
}
#telephoniepage div.colactu p#telephonieactutitre {
	background:url(images/telephonie-bg-actu-haut.jpg) no-repeat;
	color:#97CED1;
}
#collaboratifpage div.colactu p#collaboratifactutitre {
	background:url(images/collaboratif-bg-actu-haut.jpg) no-repeat;
	color:#9B7B71;
}

#accueilpage div.colactu p, #blancpage div.colactu p, #grispage div.colactu p {background:url(images/accueil-bg-actu.jpg) repeat;}

#reseaupage div.colactu p.reseauactu {
	background:url(images/reseau-bg-actu.jpg) repeat-y;
	padding:10px;
	padding-left:15px;
	line-height:16px;
	font-weight:bold;
	color:#FFF
}
div p.reseauactu a {
	color:#A8A8A8;
	text-decoration:underline;
	font-weight:bold;
	display:block;
	padding-left:12px;
	background:url(images/fleche-grise2.gif) no-repeat center left;
}
div p.reseauactu a:hover {
	color:#A8A8A8;
	text-decoration:none;
	font-weight:bold
}
div p.securiteactu {
	background:url(images/securite-bg-actu.jpg) repeat-y;
	padding:10px;
	padding-left:15px;
	line-height:16px;
	font-weight:bold;
	color:#FFF
}
div p.securiteactu a {
	color:#FDCD61;
	text-decoration:underline;
	display:block;
	padding-left:12px;
	background:url(images/fleche-6-2.gif) no-repeat center left;
}
div p.securiteactu a:hover {
	color:#FDCD61;
	text-decoration:none
}

div p.systemeactu {
	background:url(images/systeme-bg-actu.jpg) repeat-y;
	padding:10px;
	padding-left:15px;
	line-height:16px;
	font-weight:bold;
	color:#FFF;
}
div p.systemeactu a {
	color:#69B694;
	text-decoration:underline;
	display:block;
	padding-left:12px;
	background:url(images/fleche-7-2.gif) no-repeat center left;
}
div p.systemeactu a:hover {
	color:#69B694;
	text-decoration:none
}
div p.telephonieactu {
	background:url(images/telephonie-bg-actu.jpg) repeat-y;
	padding:10px;
	padding-left:15px;
	line-height:16px;
	font-weight:bold;
	color:#FFF;
}
div p.telephonieactu a {
	color:#97CED1;
	text-decoration:underline;
	display:block;
	padding-left:12px;
	background:url(images/fleche-9-2.gif) no-repeat center left;
}
div p.telephonieactu a:hover {
	color:#97CED1;
	text-decoration:none;
}
div p.collaboratifactu {
	background:url(images/collaboratif-bg-actu.jpg) repeat-y;
	padding:10px;
	padding-left:15px;
	line-height:16px;
	font-weight:bold;
	color:#FFF;
}
div p.collaboratifactu a {
	color:#9B7B71;
	text-decoration:underline;
	display:block;
	padding-left:12px;
	background:url(images/fleche-8-2.gif) no-repeat center left;
}
div p.collaboratifactu a:hover {
	color:#FFF;
	text-decoration:none;
}

div p.servicesmenu {
	padding:10px;
	padding-left:15px;
	line-height:16px;
	color:#CC3431;
}

.servicesmenu a {
	text-decoration:underline;
	display:block;
	padding-left:12px;
	background:url(images/fleche-5-2.gif) no-repeat top left;
	color:#FFF;
}
.servicesmenu a:hover {
	color:#FFF;
	text-decoration:none;
}


/****************** ENTETES ************************/
#systemepage h1 {color:#69B694;}
#telephoniepage h1 {color:#97CED1;}
#collaboratifpage h1 {color:#9B7B71;}
#securitepage h1 {color:#FDCD61;}
h1 {
	margin:0px;
	padding:0px;
	color:#FFF;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:18px;
	height:25px;
	line-height:25px;
	font-weight:normal;
	margin-bottom:18px;
}
h4 {
	margin:0px;
	padding:0px;
	margin-bottom:12px;
	font-size:15px;
	color:#FFF;
}
h4.grismoyen2{
	margin:0px;
	padding:0px;
	margin-top:15px;
	margin-bottom:15px;
	font-size:15px;
	color: #000;
	border-bottom:#F00 solid 1px;
	width:610px;
}
#grispage h4.grismoyen2 {
	margin-left:38px;
}

#accueilpage h4.grismoyen2 {
	color: #FFF;
}


#grispage h1 {
	color:#000;
	padding-left:38px;
	/padding-left:0px;
	margin-top:-100px;
	margin-bottom:18px;
	background:none;
	position: absolute;
}
#conteneur #grispage p.moins100 { 
	margin-top:-58px; 
}
#blancpage h1 {
	color:#000;
}
div.colactu p.brun {
color:#653332;
}
.violetpetit {
color:#9999CC;
}
/****************** 2 COLONNES ************************/

#colmilieu {
	float:left;
	width:360px;
	overflow:visible;
	position:relative;
	padding-left:38px;
	padding-right:15px;
}

#colmilieu p {
	margin:0px;
	padding:0px;
	line-height:16px;
	margin-bottom:12px;
}
#reseaupage #colmilieu p {
	color:#FFF
}

#coldroite {
	float:left;
	width:220px;
	overflow:visible;
	position:relative;
	padding-left:15px;
	border-left: #5E525E solid 1px;
}
#coldroite p {
	margin:0px;
	padding:0px;
	line-height:16px;
	margin-bottom:10px;
}

#coldroite p.blancgrassoulignerouge {
	width:auto;
	border-bottom:#F00 solid 1px; 
	line-height:16px;
	margin-top:6px;
}

#blancpage #coldroite p {
	margin:0px;
	padding:0px;
	line-height:16px;
	margin-bottom:10px;
}
#blancpage #coldroite p strong {
	border-bottom:#F00 solid 1px;
	display:block;
	width:230px;
}

#blancpage #coldroite p a {
	color:#000;
	text-decoration:underline;
}
#blancpage #coldroite p a:hover {
	color:#000;
	text-decoration:none;
}

/****************** 1 COLONNE ************************/

#colunique {
	float:left;
	width:620px;
	overflow:visible;
	position:relative;
	margin-left:38px;
}

#colunique p {
	margin:0px;
	padding:0px;
	line-height:16px;
	text-align:justify;
}

#accueilpage #colunique p a, #accueilpage #colunique p a:visited {
	color:#FFF;
	text-decoration:underline;
}
#accueilpage #colunique p a:hover {
	color:#FFF;
	text-decoration:none;
}

#reseaupage #colunique p, #securitepage #colunique p, #systemepage #colunique p, #collaboratifpage #colunique p, #telephoniepage #colunique p {
	color:#FFF;
}
#reseaupage #colunique p a, #securitepage #colunique p a, #systemepage #colunique p a, #collaboratifpage #colunique p a, #telephoniepage #colunique p a {
	color:#FFF;
	font-weight:bold;
	text-decoration:underline
}
#reseaupage #colunique p a:hover, #securitepage #colunique p a:hover, #systemepage #colunique p a:hover, #collaboratifpage #colunique p a:hover, #telephoniepage #colunique p a:hover {
	color:#FFF;
	font-weight:bold;
	text-decoration:none
}

#grispage div#colunique {
	float:left;
	width:705px;
	overflow:visible;
	position:relative;
	margin-left:0px;
	margin-top:100px;
	background:url(images/fondgris2.jpg) repeat-y;
}

#grispage div#colunique p {
	margin:0px;
	padding:0px;
	line-height:16px;
	margin-left:38px;
	margin-right:60px;
	position:relative
}
#grispage div#colunique p.grisfonce2 {
	color:#2A2A2A;
	margin:0px;
}
.gris2 {
color: #A8A8A8;
}
.gris2 a {
color:#A8A8A8;
text-decoration:underline;
}
.gris2 a:hover {
color:#A8A8A8;
text-decoration:none;
}
.violet {
color:#9999CC;
}	
.blanccasse {
	color:#FEFEFE;
}
.petit {
	line-height:16px;
}
.rouge {
	color:#CD3236;
}
.rouge a {
	color:#CD3236;
}
.rouge a:hover {
	color:#CD3236;
	text-decoration:none;
}

p.blancgrassoulignerouge {
	width:auto;
	border-bottom:#F00 solid 1px; 
	line-height:16px;
	margin-top:6px;
	color:#FFF;
}
.grisfonce {
	color:#2A2A2A;
}

#accueilpage p.puces, #blancpage p.puces, #conteneur #grispage p.puces {
	margin:0px;
	padding:0px;
	padding-left:12px;
}
#conteneur #grispage p.puces {
	margin-left:38px;
}
#accueilpage .puces, #blancpage .puces {
	background:url(images/fleche-rouge-2.gif) top left no-repeat;
}
#grispage .puces {
	background:url(images/fleche-rouge3.gif) top left no-repeat;
}

#conteneur p.margenulle {
	margin:0px;
	padding:0px;
}

/**************  MENU HAUT  ****************/
ul#menuhaut {
	float:left;
	margin:0px;
	padding:0px;
	margin-left:339px;
	_margin-left:287px;
	height:31px;
	list-style: none ;
}
#menuhaut li {
	display:inline;
	padding:0px;
	margin:0px;
}
#menuhaut li a {
	height:31px;
	line-height:27px;
	padding-left:20px;
	padding-right:19px;
	padding-top:7px;
	padding-bottom:12px;
	color:#999999;
	text-decoration:none;
	font-size:10px;
}
#menuhaut li a:hover {
	height:31px;
	color:#FFF;
	text-decoration:none;
	background:url(images/menu-haut-bckgrd.jpg) repeat-x;
	position:relative
}
#menuhaut li#menuh1 a {
	padding-left:22px;
}

/**************  MENU EN "S"  ****************/
#menus1, #menus2, #menus3 {
	float:left;
	display:inline;
	margin:0;
	padding:0;
	margin-top:42px;
	height:32px;
	line-height:22px;
	padding-left: 10px;
	padding-right:10px;
	color:#666666;
	text-decoration:none;
	font-size: 20px;
	text-align:center;
}
#menus1 {
	width:120px;
	margin-left:342px;
}
#menus2 {
	width:80px;
	margin-left:48px;
}
#menus3 {
	width:80px;
	margin-left:110px;
}

/************** SOUS MENU SOLUTIONS ****************/
ul#menusolutions {
	padding:0;
	margin:0;
	width:142px;
	visibility:hidden;
	padding-top:7px;
	float:left;
	margin-top:-10px;
	list-style:none;
}
li#reseau, li#systeme, li#securite, li#collaboratif, li#telephonie {
margin:0px;
padding:0px;
height:17px;
line-height:17px;
}
#reseau a, #systeme a, #securite a, #collaboratif a, #telephonie a {
text-decoration:none;
text-align:center;
color: #CCCCCC;
display:block;
width:136px;
height:17px;
padding-left:6px;
background-color:#1F1D2A; opacity: 0.65; filter:alpha(opacity=65); -moz-opacity:0.65;
}

li#reseau a:hover {background-color:#986699;}

li#systeme a:hover {background-color:#4FA47D;}

li#securite a:hover {background-color:#FFCC67;}

li#collaboratif a:hover {background-color:#CC9A99;} 

li#telephonie a:hover {background-color:#96C4D3;}

#reseau a:hover, #systeme a:hover, #securite a:hover, #collaboratif a:hover, #telephonie a:hover {
color: #FFFFFF;
display:block;
width:136px;
background:url(images/puce.gif) left no-repeat;
}
/************** SOUS MENU SERVICES ****************/
ul#menuservices {
	padding:0;
	margin:0;
	width:140px;
	visibility:hidden;
	padding-top:7px;
	float:left;
	margin-left:28px;
	margin-top:-10px;
	list-style:none;
}
#surmesure, #packagees {
margin:0px;
padding:0px;
height:17px;
line-height:17px;
}
#surmesure a, #packagees a {
text-decoration:none;
text-align:center;
color: #CCCCCC;
display:block;
width:130px;
height:17px;
padding-left:6px;
background-color:#1F1D2A; opacity: 0.65; filter:alpha(opacity=65); -moz-opacity:0.65;
}
li#surmesure a:hover, li#packagees a:hover {
color: #000;
display:block;
width:130px;
background:url(images/puce.gif) left no-repeat;
}
ul#menuservices li a:hover {
background-color: #EEE;
}
/************** SOUS MENU SOCIETE ****************/
ul#menusociete {
	padding:0;
	margin:0;
	width:116px;
	visibility:hidden;
	padding-top:7px;
	float:left;
	margin-left:79px;
	margin-top:-10px;
	list-style:none;
}
li#chiffres, li#strategie, li#valeurs, li#qualite, li#clients {
margin:0px;
padding:0px;
height:17px;
line-height:17px;
}
li#chiffres a, li#strategie a, li#valeurs a, li#qualite a, li#clients a {
text-decoration:none;
text-align:center;
color: #CCCCCC;
display:block;
width:110px;
height:17px;
padding-left:6px;
background-color:#1F1D2A; opacity: 0.65; filter:alpha(opacity=65); -moz-opacity:0.65;
}
li#chiffres a:hover, li#strategie a:hover, li#valeurs a:hover, li#qualite a:hover, li#clients a:hover {
color: #000;
display:block;
width:110px;
background:url(images/puce.gif) left no-repeat;
}
ul#menusociete li a:hover {
background-color: #B6B6B6;
}

/*************** ACTUALITES ***************************/
div.colactu {
	float:left;
	width:195px;
}
#grispage div.colactu {
	color:#FFF;
}

/************* CAROUSEL NEWS ********************/
.stepcarousel{
position: relative; /*leave this value alone*/
border: 0px solid black;
overflow: scroll; /*leave this value alone*/
width: 195px; /*Width of Carousel Viewer itself*/
height: 250px; /*Height should enough to fit largest content's height*/
background:url(images/accueil-bg-actu.jpg) repeat;
}
.stepcarousel .belt{
	position: absolute; /*leave this value alone*/
	left: 0;
	top: 0;
}
.stepcarousel .panel{
float: left; /*leave this value alone*/
overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
margin: 10px; /*margin around each panel*/
width: 175px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
text-align:left
}
/**************** CARRIERES ********************************/
.pointer {
	cursor:pointer;
}
#apDiv1, #apDiv2, #apDiv3, #apDiv4, #apDiv5, #apDiv6 {
	position:absolute;
	width:350px;
	height:500px;
	z-index:1;
	overflow:visible;
	margin-top:0px;
	visibility: hidden;
}
#apDiv2 {
	visibility: visible;
}
.offresemploi a {
	color:#FFF;
	display:block;
	background:url(images/fleche-rouge-2.gif) top left no-repeat;
	padding-left:12px;
	text-decoration:underline;
}
.offresemploi a:hover {
	color:#FFF;
	text-decoration:none;
}

/************* CLIENTS ********************/
div#colunique.clients img {
	margin-left:40px;
	margin-right:5px;
	margin-bottom:40px;
	position:relative;
	visibility:visible;
}
div#colunique.clients img#image1, div#colunique.clients img#image2, div#colunique.clients img#image3, div#colunique.clients img#image4 {
	margin-top:-58px;
}
#grispage div#colunique.clients h1 {
	*margin-left:40px;
}

/************* PARTENAIRES ********************/

.partenaires {
	width:613px; 
	margin-left:32px;
	background-color:#FFF;
}
.partenaires img {
	margin:22px;
}
/**************  PIEDS  ****************************/
.mentions {
	margin:0px;
	padding:0px;
	font-style:italic;
	color:#FEFEFE;
	margin-left:235px;
	height:36px;
	line-height:36px;
}
.mentions a{
	color:#FEFEFE;
	text-decoration:underline
}
.mentions a:hover{
	color:#FEFEFE;
	text-decoration:none
}

#accueilpied, #reseaupied, #collaboratifpied, #securitepied, #systemepied, #telephoniepied {
	width:900px;
	height:36px;
	clear:left
}
#accueilpied {background:url(images/accueil-pied.jpg) no-repeat;}
#reseaupied {background:url(images/reseau-pied.jpg) no-repeat;}
#collaboratifpied {background:url(images/collaboratif-pied.jpg) no-repeat;}
#securitepied {background:url(images/securite-pied.jpg) no-repeat;}
#systemepied {background:url(images/systeme-pied.jpg) no-repeat;}
#telephoniepied {background:url(images/telephonie-pied.jpg) no-repeat;}
