@charset "utf-8";
/* CSS Document */

body {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 12px;
	color: #FFFFFF;
	background: url(../img/background.png) repeat-x top center #2c2e31;
	margin: 0 auto;
}

img {
	border: none;
}

a {
	outline: none;
	color: #FFF;
	text-decoration: none;
}

a:hover {
	text-decoration: none;
}

.single p a:hover {
	color: #9cd558;
}

hr {
width: 100%;
height: 1px;
clear: both;
visibility: hidden;
margin: 0;
padding: 0;
}

sup {
font-size: 10px;
}

#main {
	width: 980px;
	margin: 0 auto;
	background: url(../img/logo-warhp2.jpg) no-repeat  scroll 2px 0;
}

img#logo {
	float: left;
}

img#warhp {
	float: right;
	margin: 25px 1px;
}

#head {
	width: 980px;
	height: 120px;
	overflow: hidden;
}

#menu {
	width:970px;
	margin: 0 5px;
	height: 42px;
}

#menu ul { 
	list-style:none; 
	margin:0; 
	padding:0;	
	height:42px;
	float: right;
}

#menu ul li { 
	float:left;	 
	text-indent:0;
	padding:0;
	margin:0;
	list-style-image:none; 
}

#menu ul a {
	display:block;
	height: 42px; 	
	padding:0;
	margin:0 3px;
	text-indent: -9999px;
}

#menu ul a.home {
	background: url(../img/btn-accueil.png) no-repeat scroll 0 10px;
	width: 70px;
}

#menu ul a.home:hover {
	background: url(../img/btn-accueil.png) no-repeat scroll 0 -32px;
}

#menu ul a.offre {
	background: url(../img/btn-decouvrez-offre.png) no-repeat scroll 0 10px;
	width: 127px;
}

#menu ul a.offre:hover {
	background: url(../img/btn-decouvrez-offre.png) no-repeat scroll 0 -32px;
}

#menu ul a.produits {
	background: url(../img/btn-produits-eligibles.png) no-repeat scroll 0 10px;
	width: 127px;
}

#menu ul a.produits:hover {
	background: url(../img/btn-produits-eligibles.png) no-repeat scroll 0 -32px;
}

#menu ul a.commander {
	background: url(../img/btn-commander.png) no-repeat scroll 0 10px;
	width: 99px;
}

#menu ul a.commander:hover {
	background: url(../img/btn-commander.png) no-repeat scroll 0 -32px;
}

#menu ul a.contact {
	background: url(../img/btn-contact.png) no-repeat scroll 0 10px;
	width: 70px;
}

#menu ul a.contact:hover {
	background: url(../img/btn-contact.png) no-repeat scroll 0 -32px;
}

#menu ul a.revendeur {
	background: url(../img/btn-revendeur.png) no-repeat scroll 0 10px;
	width: 135px;
}

#menu ul a.revendeur:hover {
	background: url(../img/btn-revendeur.png) no-repeat scroll 0 -32px;
}

#slide {
	width: 980px;
	height: 210px;
	background: url(../img/slide.png) top left no-repeat;
}

#slogan {
	font-size: 38px;
	padding: 5px 10px;
	margin: 0;
	font-weight: normal;
}

.metier {
	width: 310px;
	margin: 40px 25px 0 0;
	float: left;
	background: url(../img/metier-entete.png) top center no-repeat #434444;
}

.metier.last {
	margin-right: 0;
}

.metier .presentation {
	background: url(../img/metier.png) no-repeat top center #419bd9;
	height: 401px;
	width: 310px;
}

.metier a.entete {
	height: 90px;
	width: 310px;
	display: block;
	<title>Solutions 2D 3D</title>: #FFF;
}

.entete img {
	margin: -30px 0 0 -10px;
	float: left;
}

.entete h2 {
	float: left;
	width: 140px;
	text-align: center;
	display: block;
	font-size: 26px;
	margin: 23px 0 0 20px;
	padding: 0;
	text-decoration: none;
}

.entete h2.aec {
	line-height: 24px;
	margin: 6px 0 0 10px;
}

.entete h2 small {
	font-weight: bold;
	font-size: 18px;
}

a.entete:hover {
	text-decoration: none;
}

.last .entete h2 {
	margin: 7px 0 0 5px;
	width: 155px;
}

.tagcloud {
	font-size: 9px;
	text-align: justify;
	margin-bottom: 10px;
}

.tagcloud p {
	padding: 10px;
}

.tagcloud a {
	margin: 0 5px;
	vertical-align: middle;
}

.video {
	margin: 5px 15px 14px 15px;
	padding: 0;
}

div.video img {
	cursor: pointer;
}

a.btn-packs {
	margin: 0 20px;
}

.intro {
	width: 960px;
	height: 30px;
	padding: 10px;
}

.intro a.close {
	display: block;
	height: 24px;
	width: 65px;
	text-align: left;
	font-size: 12px;
	font-weight: bold;
	background: url(../img/btn-fermer.png) no-repeat right;
	line-height: 22px;
	float: right;
}

.intro div.exemple {
	width: 880px;
	float: left;
	height: 30px;
	font-size: 14px;
	font-weight: bold;
}

.intro div.exemple a {
	color: #f76600;
}

.single {
	margin: 20px 0 0 0;
	padding: 25px;
	width: 930px;
	height: 600px;
	background: url(../img/bg-single.png) top left no-repeat;
}

.single.value {
	height: 1050px;
	background: url(../img/bg-single-long.png) top left no-repeat;
}

.single.long {
	height: auto;
	background: url(../img/bg-single-along.png) repeat-x top #212121;
	border: 1px solid #5b5b5b;
	border-radius: 10px;
	-moz-border-radius: 10px;
}

.single.long .content.wide h3 {
	font-size: 14px;
	font-weight: bold;
}

.single.long .content.wide p {
	font-size: 12px;
}

.single h1 {
	width: 100%;
	text-align: left;
	color: #8dd0ff;
	font-size: 36px;
	margin: 0 0 30px 0;
	padding:0;
}

.single.contact h1 {
	margin: 0 0 20px 0;
}

.single .visuel {
	width: 300px;
	float: left;
	height: 350px;
	margin: 0 40px 0 0;
	padding: 40px 0 10px 0;
	text-align: center;
}

.single.value .content.wide .visuel h3 {
	margin-bottom: 20px;
	color: #9cd558;
}

.single.value .content.wide .visuel p {
	font-weight: bold;
	font-size: 12px;
	line-height: 20px;
}

.single .content {
	width: 600px;
	float: left;
	text-align: left;
	margin: 0 0 0 20px;
	padding:0;
}

.single .content.wide {
	width: 900px;
	float: none;
	margin: 0 15px;
}

.single.long .content.wide {
	width: 930px;
	float:none;
	margin: 0;
}

.produits img {
	float: left;
	margin: 10px 20px 10px 0;
}

*html .produits img {
	margin: 0 20px 15px 0;
}

*+html .produits img {
	margin: 0 20px 0 0;
}

.single .content h2 {
	margin: 0 0 30px 0;
	padding:0;
	font-weight: normal;
	font-size: 23px;
}

.single .content h3 {
	margin: 20px 0 15px 0;
	padding:0;
	font-weight: normal;
	font-size: 23px;
}

.single .content.wide h3 {
	font-size: 20px;
}

.single .content.wide h3 strong {
	font-size: 24px;
}

.single .content p {
	padding: 5px;
	font-size: 16px;
}

.single.long .content p {
	padding: 5px;
	font-size: 14px;
}


.single .content p strong {
	font-size: 16px;
	color: #9cd558;
}

div.value.single .content p {
	font-size: 14px;
}

div.value.single .content h2 {
	color: #9cd558;
	text-align: center;
	margin: 15px 0;
}

div.value.single .content h3 {
	text-align: center;
	font-size: 18px;
	margin: 10px 0;
}

div.value.single .content ul, div.value.single .content h4 {
	font-size: 14px;
}


div.commande h1, div.value h1 {
	margin-bottom: 10px;
}

div.commande h2 {
	font-size: 23px;
	font-weight: normal;
}

div.commande h3 {
	color: #9cd558;
	font-size: 20px;
	margin: 0;
}

div.commande h4 {
	font-size: 16px;
	margin: 0 0 5px 0;
	padding: 0;
}

*html div.commande h4, *+html div.commande h4 {
	margin: 0 0 0 0;
}

div.commande .demi {
	float: left;
	width: 450px;
	padding: 0 10px 0 5px;
	height: 500px;
	font-size: 13px;
}

div.commande .demi a {
	font-weight: bold;
	text-decoration:underline;
}

#footer {
	width: 100%;
	margin: 20px 0;
	font-weight: bold;
	font-size: 14px;
}

#footer ul {
	width: 860px;
	margin: 0 auto;
	list-style: none;
	height: 40px;
	text-align: center;
}

#footer ul li {
	float: left;
}

#footer ul li a {
	display: block;
	margin: 0 14px;
}

#footer a:hover {
	text-decoration: underline;
}

#demotip { 
    display:none; 
    background:transparent url(../img/bulle.png) no-repeat top left; 
    font-size:12px; 
    height:105px; 
    width:240px; 
    padding:20px 20px 35px 30px;
	font-size: 12px;
    color:#fff;     
}

#demotip strong { 
	font-size: 19px;     
}

form#contact {
	width: 600px;
	margin: 0 auto;
}

label {
	font-size: 15px;
	font-weight: bold;
	margin: 10px 0 0 0;
	float: left;
	clear: left;
}

input, textarea, select {
	float: left;
	clear: left;
	width: 250px;
	margin: 6px 0;
	padding: 6px;
	border: 2px #444 solid;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	font-family: Arial, Helvetica, sans-serif;
}

*+html select {
	font-size: 16px;
	margin: 10px 0
}

textarea {
	width: 550px;
}

input:hover, input:focus, textarea:hover, textarea:focus {
	border: 2px #9cd558 solid;
}

.single.revendeur h1 {
	margin-bottom:10px;
}

form#signup {
	width: 400px;
	float: left;
}

#revuedepresse {
	width: 400px;
	float: left;
}


div#kitpromotion {
	margin-top: -45px;
	width: 460px;
	min-height: 500px;
	float: right;
	text-align:right;
}

#kitpromotion h2 {
	color: #9cd558;
	font-size: 28px;
	margin: 0;
}

#kitpromotion h3 {
	font-size: 17px;
}

form#signup .demi {
	float: left;
	width: 200px;
}

form#signup input, form#signup select {
	width: 170px;
}

#conditions {
	float: left;
	width: 400px;
	text-align: left;
	margin: 15px 0 15px 0;
}

#conditions input.checkbox {
	width: 25px;
	margin: 10px 0 0 0;
	border: none;
}

#conditions label {
	clear: none;
	font-size: 12px;
	text-align: left;
}

input.btn {
	width: 185px;
	height: 36px;
	padding: 0;
	margin: 10px 0 0 210px;
}

form div.message {
	display: block;
	line-height: 30px;
	border: 2px #5fbbfb solid;
	text-align: center;
	margin: 0;
	font-size: 14px;
	font-weight: bold;
	color: #FFFFFF;
	background: #669b05;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	width: 91%;
}

div.overlay {	
	width:640px;  
     
    /* must be initially hidden */ 
    display:none; 
     
    /* place overlay on top of other elements */ 
    z-index:10000; 
     
    /* styling */ 
    background-color:#333;   
    min-height:200px; 
    border:1px solid #666; 
     
    /* CSS3 styling for latest browsers */ 
    -moz-box-shadow:0 0 90px 5px #000; 
    -webkit-box-shadow: 0 0 90px #000; 
}

div.overlay div.close {
    background-image:url(../img/close.png); 
    position:absolute; 
    right:-30px; 
    top:-30px; 
    cursor:pointer; 
    height:35px; 
    width:35px;
}

div.overlay a {
	height:360px;
	display:block;
}

/* the overlayed element */ 
.simple_overlay { 
     
    /* must be initially hidden */ 
    display:none; 
     
    /* place overlay on top of other elements */ 
    z-index:10000; 
     
    /* styling */ 
    background-color:#333; 
     
    width:675px;     
    min-height:200px; 
    border:1px solid #666; 
     
    /* CSS3 styling for latest browsers */ 
    -moz-box-shadow:0 0 90px 5px #000; 
    -webkit-box-shadow: 0 0 90px #000;     
} 
 
/* close button positioned on upper right corner */ 
.simple_overlay .close { 
    background-image: url(../img/close_1.png); 
    position:absolute; 
    right:-15px; 
    top:-15px; 
    cursor:pointer; 
    height:35px; 
    width:35px; 
}

/* styling for elements inside overlay */ 
.details { 
    position:absolute; 
    top:15px; 
    right:15px; 
    font-size:11px; 
    color:#fff; 
    width:200px; 
} 
 
.details h2 { 
    color:#aba; 
    font-size:15px; 
    margin:0; 
}

.details h3 { 
    font-size:12px;
	margin-top: 12px;
	margin-bottom: 0;
}