@charset "UTF-8";
body{
	margin:0px;
	padding:0px;
}

.superconteneur{
	height: 686px;
	width: 1057px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	margin-top:0px
	
}
.conteneur {
	background-image: url(Images/fond.jpg);
	height: 686px;
	width: 957px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: 100px;
	position:absolute;
}

.logo {
	height: 110px;
	width: 208px;
	left: 468px;
	top: 25px;
	right: 0px;
	bottom: 0px;
	text-decoration: none;
	position: relative;
}
.menu {
	position: relative;
	margin-top:50px;
	z-index:10000;
	width: 530px;
	left: 460px;
	
}
* html .menu{left: 440px;}
*+html .menu{left: 440px;}
.menuindex {
	position: relative;
	margin-top:50px;
	z-index:10000;
	width: 530px;
	left: 460px;
	
}
* html .menuindex{left: 440px;top:50px;}
*+html .menuindex{left: 440px;top:50px;}
.menu ul, .menu li,.menuindex ul, .menuindex li {
   padding-left: 0px ;
   margin-left:0px
 
}


.lignedeVie {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #666666;
	text-decoration: none;
	width: 400px;
	left: 470px;
	position: relative;
	top: 60px;
}
.navBas {
	position: absolute;
	bottom:50px;
	left:468px;
	width: 250px;
	font-weight: bolder;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
}
* html .navBas{}
*+html .navBas{}
.regionModifiable {
	height: 310px;
	width: 655px;
	position: absolute;
	top: 350px;
	left: 280px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	overflow: auto;
	text-decoration: none;
	
}
* html .regionModifiable {left:250px;}
*+html .regionModifiable {left:250px;}
ul.MenuBarVertical ul {
}
a:link {
	font-weight:bold;
	color: #666666;
	text-decoration: none;
}
a:visited {
	color: #999999;
	text-decoration: none;
}
a img {
	border:none;
}
/*a:hover {
	color: #333333;
	text-decoration: none;
	background-color: #CCCCCC;
}*/
.pucesRouges {
	color: #FF0000;
	font-size: 15px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	vertical-align: -10%;
}
.accueil {
	height: 260px;
	width: 470px;
	left: 470px;
	position: relative;
	top: 60px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	overflow: auto;
}
.textesAccueil {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	left: 130px;
	position: relative;
	width: 450px;
	height: 230px;
	background-image: url(Images/cadreaccueil.gif);
	background-repeat: no-repeat;
	padding-top: 30px;
	padding-right: 20px;
	padding-bottom: 0px;
	padding-left: 40px;
	line-height: 14px;
}
.textesPresentationProduits {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	left: 130px;
	position: relative;
	width: 450px;
	height: 250px;
	background-image: url(Images/cadrePresentationProduits.gif);
	background-repeat: no-repeat;
	padding-top: 30px;
	padding-right: 20px;
	padding-bottom: 0px;
	padding-left: 40px;
	line-height: 14px;
}
.textesCertification {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	left: 130px;
	position: relative;
	width: 450px;
	height: 240px;
	background-image: url(Images/cadreNotreMethode.gif);
	background-repeat: no-repeat;
	padding-top: 15px;
	padding-right: 20px;
	padding-bottom: 0px;
	padding-left: 40px;
	line-height: 14px;
}
.textesCreationJeuxPerso {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	left: 130px;
	position: relative;
	width: 450px;
	height: 230px;
	background-image: url(Images/cadreCreationJeuxPerso.gif);
	background-repeat: no-repeat;
	padding-top: 30px;
	padding-right: 20px;
	padding-bottom: 0px;
	padding-left: 40px;
	line-height: 14px;
}
.textesFormationCollective {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	left: 130px;
	position: relative;
	width: 450px;
	height: 230px;
	background-image: url(Images/cadreFormationCollective.gif);
	background-repeat: no-repeat;
	padding-top: 30px;
	padding-right: 20px;
	padding-bottom: 0px;
	padding-left: 40px;
	line-height: 14px;
}
.textesIndex {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	left: 130px;
	position: relative;
	width: 450px;
	height: 230px;
	background-image: url(Images/cadreIndex.gif);
	background-repeat: no-repeat;
	padding-top: 30px;
	padding-right: 20px;
	padding-bottom: 0px;
	padding-left: 40px;
	line-height: 18px;
	margin-top:30px;
}

.textesJeuxEnLigne {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	left: 130px;
	position: relative;
	width: 450px;
	height: 230px;
	background-image: url(Images/cadreJeuxEnLigne.gif);
	background-repeat: no-repeat;
	padding-top: 30px;
	padding-right: 20px;
	padding-bottom: 0px;
	padding-left: 40px;
	line-height: 14px;
}
.textesLesJeux {
	left: 130px;
	position: relative;
	width: 450px;
	height: 280px;
	background-image: url(Images/cadreLesJeux.gif);
	background-repeat: no-repeat;
	padding-top: 12px;
	padding-right: 20px;
	padding-bottom: 0px;
	padding-left: 40px;
}
* html .textesLesJeux{
	padding-top:10px;
}
*+html .textesLesJeux{
	padding-top:10px;
}
.textesContact {
	left: 130px;
	position: relative;
	width: 450px;
	height: 255px;
	background-image: url(Images/cadreLesJeux.gif);
	background-repeat: no-repeat;
	padding-top: 20px;
	padding-right: 20px;
	padding-bottom: 0px;
	padding-left: 30px;
	
}
* html .textesContact{
	padding-top:20px;
}
*+html .textesContact{
	padding-top:20px;
}
.textesContact p{
	margin-top:5px;
	margin-bottom:5px;
}
.TexteTableau {
	font-family: Arial, Helvetica, sans-serif;
	text-align: left;
	font-weight: normal;
	font-size: 11px;
	vertical-align: text-top;
	line-height: 13px;
}
.textesEspritAkypia {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	left: 130px;
	position: relative;
	width: 450px;
	height: 230px;
	background-image: url(Images/cadreEspritAkypia.gif);
	background-repeat: no-repeat;
	padding-top: 30px;
	padding-right: 20px;
	padding-bottom: 0px;
	padding-left: 40px;
	line-height: 14px;
}
.textesLicenceUtilisateur {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	left: 130px;
	position: relative;
	width: 450px;
	height: 230px;
	background-image: url(Images/cadreLicenceUtilisateur.gif);
	background-repeat: no-repeat;
	padding-top: 30px;
	padding-right: 20px;
	padding-bottom: 0px;
	padding-left: 40px;
	line-height: 14px;
}
.textesNosClients {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	left: 130px;
	position: relative;
	width: 450px;
	height: 230px;
	background-image: url(Images/cadreNosclients.gif);
	background-repeat: no-repeat;
	padding-top: 30px;
	padding-right: 20px;
	padding-bottom: 0px;
	padding-left: 40px;
	line-height: 14px;
}
.textesNotreMethode {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	left: 130px;
	position: relative;
	width: 450px;
	height: 230px;
	background-image: url(Images/cadreNotreMethode.gif);
	background-repeat: no-repeat;
	padding-top: 30px;
	padding-right: 20px;
	padding-bottom: 0px;
	padding-left: 40px;
	line-height: 14px;
}
.textesSupportClients {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	left: 130px;
	position: relative;
	width: 450px;
	height: 230px;
	background-image: url(Images/cadreSupport.gif);
	background-repeat: no-repeat;
	padding-top: 30px;
	padding-right: 20px;
	padding-bottom: 0px;
	padding-left: 40px;
	line-height: 14px;
}

.navigation {
	list-style: none;
	color: #333333;
	width: 350px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	margin-left: 0;
      }
   .navigation a, .navigation span {
	color: #333333;
	text-decoration: none;
	background-repeat: no-repeat;
	background-position: 0;
	display: block;
      }
	  .sousrub{
	  	margin-top:3px;
		margin-bottom:3px;
	}
	
	.sousrub a {
		display:inline;
	}
   .navigation .toggleSubMenu a, .navigation .toggleSubMenu span {
	list-style-image: none;
	list-style-type: none;
      }
   .navigation .open a, .navigation .open span {
	list-style-image: none;
	list-style-type: none;
      }
   .navigation a:hover, .navigation a:focus, .navigation a:active {
	list-style-image: none;
	list-style-type: none;
      }
   .navigation .subMenu {
	background-position: 0 0;
	list-style-image: none;
	list-style-type: none;
      }
   .navigation ul.subMenu a {
	background: none;
	list-style-image: none;
	list-style-type: none;
      }
	  #actu{
	background-image:url(Images/actualites.jpg);
	background-repeat:no-repeat;
	margin-top:3px;
	margin-bottom:5px;
	width: 380px;
	min-height:16px;	  
	  }
	  * html #actu{ height:16px;margin-top:1px;margin-bottom:3px;}
	  *+html #actu{ margin-top:1px;margin-bottom:3px;}
#formation {
	background-image:url(Images/notreoffreformation.jpg);
	background-repeat:no-repeat;
	width: 500px;
	margin-top:3px;
	margin-bottom:5px;
	min-height:16px;
}* html #formation{ height:16px;margin-top:1px;margin-bottom:3px;}
*+html #formation{ margin-top:1px;margin-bottom:3px;}
#supportProduits {
	background-image:url(Images/lesupportauxproduits.jpg);
	background-repeat:no-repeat;
	/*margin-top:5px;*/
	width: 380px;
	margin-top:3px;
	margin-bottom:5px;
	min-height:16px;
}* html #supportProduits{ height:16px;margin-top:1px;margin-bottom:3px;}
*+html #supportProduits{margin-top:1px;margin-bottom:3px;}
#Produits {
	background-image:url(Images/lesproduitsakypia.jpg);
	background-repeat:no-repeat;
	margin-top:3px;
	margin-bottom:5px;
	width: 380px;
	min-height:16px;
}* html #Produits{ height:16px;margin-top:1px;margin-bottom:3px;}
*+html #Produits{ margin-top:1px;margin-bottom:3px;}
#quiSommes {

	background-image:url(Images/quisommesnous.jpg);
	background-repeat:no-repeat;
	margin-top:3px;
	margin-bottom:5px;
	width: 380px;
	min-height:16px;
}* html #quiSommes{ height:16px;margin-top:1px;margin-bottom:3px;}
*+html #quiSommes{margin-top:1px;margin-bottom:3px;}
#contact {
	background-image:url(Images/contact.jpg);
	background-repeat:no-repeat;
	width: 380px;
	margin-top:3px;
	margin-bottom:5px;
	min-height:16px;
}* html #contact{ height:16px;margin-top:1px;margin-bottom:3px;}
*+html #contact{ margin-top:1px;margin-bottom:3px;}
.float {
	float: left;
	margin-bottom:20px;
	
}

.vignetteMethode {
	position: absolute;
	left: 10px;
	top: 158px;
	width: 166px;
	height: 101px;
	z-index:100000;
	/*background-image: url(Images/vignetteNotreMethode.gif);*/
}
.vignettePresentation {
	position: absolute;
	left: 470px;
	top: 150px;
	width: 166px;
	height: 101px;
	z-index:100000;
	/*background-image: url(Images/vignettePresentation.gif);*/
}
.vignetteSupportClients {
	position: absolute;
	left: 130px;
	top: 115px;
	width: 166px;
	height: 101px;
	z-index:100000;
	/*background-image: url(Images/vignetteSupportClients.gif);*/
}
.vignetteLespritAkypia {
	position: absolute;
	left: 10px;
	top: 165px;
	width: 166px;
	height: 101px;
	z-index:100000;
	/*background-image: url(Images/vignetteLespritAkypia.gif);*/
}
.vignetteNosClients {
	position: absolute;
	left: -20px;
	top: 135px;
	width: 166px;
	height: 101px;
	z-index:100000;
	/*background-image: url(Images/vignetteNosClients.gif);*/
}
.vignettePresentationJeux {
	position: absolute;
	left: -16px;
	top: 148px;
	width: 166px;
	height: 101px;
	text-decoration: none;
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	z-index:100000;
}
.vignetteJeuxEnDetail {
	position: absolute;
	left: 10px;
	top: 165px;
	width: 166px;
	height: 101px;
	z-index:100000;
	/*background-image: url(Images/vignetteJeuxEnDetail.gif);*/
}
.vignetteCertification {
	position: absolute;
	left: 10px;
	top: 165px;
	width: 166px;
	height: 101px;
	z-index:100000;
	/*background-image: url(Images/vignetteCertification.gif);*/
}
.vignetteFormationCollective {
	position: absolute;
	left: 10px;
	top: 95px;
	width: 166px;
	height: 101px;
	z-index:100000;
	/*background-image: url(Images/vignetteFormationCollective.gif);*/
}
.vignetteLicenceUtilisateur {
	position: absolute;
	left: 470px;
	top: 140px;
	width: 166px;
	height: 101px;
	z-index:100000;
	/*background-image: url(Images/vignetteFormationCollective.gif);*/
}
.vignetteCreationJeuxPerso {
	position: absolute;
	left: 10px;
	top: 120px;
	width: 166px;
	height: 101px;
	z-index:100000;
	/*background-image: url(Images/vignetteCertification.gif);*/
}
.vignetteJeuxEnLigne {
	position: absolute;
	left: 470px;
	top: 110px;
	width: 166px;
	height: 101px;
	z-index:100000;
	/*background-image: url(Images/vignetteFormationCollective.gif);*/
}
/*--------- Lightbox -----------*/
#lightbox{
    background-color:#eee;
    padding: 10px;
    border-bottom: 2px solid #666;
    border-right: 2px solid #666;
}

#lightboxDetails{
    font-size: 0.9em;
    color: #555;
    padding-top: 0.5em;
}

#closeButton{ top: 5px; right: 5px; }

#lightboxCaption{ float: left; }

#keyboardMsg{ float: right; }

#lightbox img{ border: none; }

#overlay img{ border: none; }

#overlay{ background-image: url(../Images/overlay.png); }

* html #overlay{ /*Hack IE */
    background-color: #000;
    background-color: transparent;
    background-image: url(blank.gif);
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../Images/overlay.png", sizingMethod="scale");
}
/*-------- fin lightbox -------*/

/* SpryAccordion.css - Revision: Spry Preview Release 1.4 */

/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */

/* This is the selector for the main Accordion container. For our default style,
 * we draw borders on the left, right, and bottom. The top border of the Accordion
 * will be rendered by the first AccordionPanelTab which never moves.
 *
 * If you want to constrain the width of the Accordion widget, set a width on
 * the Accordion container. By default, our accordion expands horizontally to fill
 * up available space.
 *
 * The name of the class ("Accordion") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style the
 * Accordion container.
 */
.Accordion {
	overflow: hidden;
	position: relative;
	left: 470px;
	top: 32px;
	width: 450px;
}

/* This is the selector for the AccordionPanel container which houses the
 * panel tab and a panel content area. It doesn't render visually, but we
 * make sure that it has zero margin and padding.
 *
 * The name of the class ("AccordionPanel") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style an
 * accordion panel container.
*/
.AccordionPanel {
	margin: 0px;
	padding: 0px;
}

/* This is the selector for the AccordionPanelTab. This container houses
 * the title for the panel. This is also the container that the user clicks
 * on to open a specific panel.
 *
 * The name of the class ("AccordionPanelTab") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style an
 * accordion panel tab container.
 */
.AccordionPanelTab {
	margin: 0px;
	cursor: pointer;
	-moz-user-select: none;
	-khtml-user-select: none;
	padding-top: 2px;
	padding-right: 0px;
	padding-bottom: 2px;
	padding-left: 0px;
}

/* This is the selector for a Panel's Content area. It's important to note that
 * you should never put any padding on the panel's content area if you plan to
 * use the Accordions panel animations. Placing a non-zero padding on the content
 * area can cause the accordion to abruptly grow in height while the panels animate.
 *
 * Anyone who styles an Accordion *MUST* specify a height on the Accordion Panel
 * Content container.
 *
 * The name of the class ("AccordionPanelContent") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style an
 * accordion panel content container.
 */
.AccordionPanelContent {
	overflow: auto;
	margin: 0px;
	padding: 0px;
	height: 20px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10.5px;
	font-weight: bolder;
}

/* This is an example of how to change the appearance of the panel tab that is
 * currently open. The class "AccordionPanelOpen" is programatically added and removed
 * from panels as the user clicks on the tabs within the Accordion.
 */
.AccordionPanelOpen .AccordionPanelTab {
}

/* This is an example of how to change the appearance of the panel tab as the
 * mouse hovers over it. The class "AccordionPanelTabHover" is programatically added
 * and removed from panel tab containers as the mouse enters and exits the tab container.
 */
.AccordionPanelTabHover {
}
.AccordionPanelOpen .AccordionPanelTabHover {
}

/* This is an example of how to change the appearance of all the panel tabs when the
 * Accordion has focus. The "AccordionFocused" class is programatically added and removed
 * whenever the Accordion gains or loses keyboard focus.
 */
.AccordionFocused .AccordionPanelTab {
}

/* This is an example of how to change the appearance of the panel tab that is
 * currently open when the Accordion has focus.
 */
.AccordionFocused .AccordionPanelOpen .AccordionPanelTab {
}
.rondNoir {
	float: left;
	position: absolute;
	top: 0px;
}
embed, object{
	/*width:576px;
	height:347px;*/
	position:absolute;
	top: -40px;
	z-index:1000;
}
* html embed,* html object{
	/*width:576px;
	height:347px;*/
	position:absolute;
	top: -40px;
	margin-left:-20px;
	z-index:1000;
}
*+html embed,*+html object{
	/*width:576px;
	height:347px;*/
	position:absolute;
	top: -40px;
	margin-left:-20px;
	z-index:1000;
}

.enligne{
	float:left;
}
.HasJS div.toggleSubMenu ul {

	display: none;

}

.jaune{
	color:#F39600;
	
}



.noirgras{
	color:#000000;
	font-weight:bold;
}

/*#######FORMULAIRE######*/
.rouge{
	color:#E2001A;
	font-size:10px;
}
.petit{
	font-size:9px;
}



#envoi{
	position:relative;
	margin-top:-20px;
}
* html #envoi{
	margin-top:0px;
}
*+html #envoi{
	margin-top:0px;
}
legend, fieldset {
	font-weight:bold;
	/*color:#FFFFFF;*/
	border-width:0px;
	font-size:12px;
}
fieldset {font-weight:normal;}

#contactG{
	position:absolute;
	width:200px;
	left:30px;
}
*html #contactG{
	position:absolute;
	width:200px;
	top:50px;
	left:30px;
	font-size:10px;
}
#contactD{
	position:relative;
	margin-left:220px;	
	width:200px;
	float:left;
}
* html #contactD{
	position:absolute;
	left:20px;	
	width:200px;
	top:50px;
	
	font-size:10px;
}
#contactD input.envoye {
	position:absolute;
	left:80px;
	height: 16px;
	border: 1px solid #cccccc;
	width:70%;
}
#contactG input.envoye {
	position:absolute;
	left:60px;
	height: 16px;
	border: 1px solid #cccccc;
	width:70%;
}

*+html #contactD{
	margin-top:0px;
	margin-bottom:0px;
	font-size:10px;
}
*+html #contactG{
	margin-top:0px;
	margin-bottom:0px;
	font-size:10px;
}
*+html #bas{
	margin-top:10px;
}
* html #bas{
	margin-top:85px;
}
textarea{
	border: 1px solid #cccccc;
	width:99%;
	height:40px;
	}
* html textarea{
	
	height:40px;
	}
*+html textarea{
	
	height:40px;
	}
#demandebrochure{
	position:absolute;
	top:10px;
	right:50px;
	z-index:1000;
}