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

* {margin:0;padding:0;}

body {background-color:#FFFFFF;color:#000000;font-family:Arial, Helvetica, sans-serif;text-align:justify;}
body a {text-decoration:none;color:#336699;}
body a:hover {text-decoration:none;color:#000066;}
img {border:none;}
#clear {clear:both;}

#site {position:relative;width:760px;margin:0 auto;padding:0;background-color:#FFFFFF;}
#header {float:left;position:relative;width:760px;height:80px;}
#haut {float:left; position:relative;width:760px;height:30px;background-image:url(images/haut.png);}
#mainContent {float:left;position:relative;width:760px;height:450px;background-image:url(images/bg.png);background-repeat:repeat-y;}
#bas {float:left;position:relative;width:760px;height:15px;background-image:url(images/bas.png);}
#footer {float:left;position:relative;width:700px;padding:0 30px;}
#footer p {font-size:11px;color:#000033;text-align:center;}
#footer a:hover {color:#000066;}

#langues {float:left;position:relative;width:360px;height:80px;padding:0 10px;}
#langues a:hover{color:#FFFFFF;}
.langue {float:left;font-size:8px;font-weight:bold;color:#FFFFFF;height:auto;width:40px;background-color:#336699;padding:5px 0 2px 0;margin:0 5px 0 0;text-decoration:none;border:none;outline:none;text-align:center;}
.langue:hover {float:left;font-size:8px;font-weight:bold;color:#FFFFFF;height:20px;width:40px;background-color:#000066;padding:5px 0 2px 0;margin:0 5px 0 0;text-decoration:none;border:none;outline:none;text-align:center;}
.langues {float:left;font-size:8px;font-weight:bold;color:#FFFFFF;height:20px;width:40px;background-color:#000066;padding:5px 0 2px 0;margin:0 5px 0 0;text-decoration:none;border:none;outline:none;text-align:center;}
.langues:hover {color:#FFFFFF;}
#logo {float:right;position:relative;width:360px;height:80px;padding:0 10px;}
#logoimg {position:relative;float:right;border:none;}
#logo h1{font-size:14px;font-weight:500;color:#336699;text-align:right;letter-spacing:1px;position:relative;float:right;}

#menu {position:relative;float:left;width:720px;height:80px;padding:0 30px;background-image:url(images/bg.png);background-repeat:repeat-y;}
#menu li {position:relative;float:left;list-style:none;}
#menu li a {width:80px;height:80px;margin-right:5px;background-color:#336699;display:block;cursor:pointer;color:#FFFFFF;}
#menu li a:hover {position:relative;float:left;list-style:none;width:80px;height:80px;margin-right:5px;background-color:#000066;display:block;cursor:pointer;}

/*Accueil*/

#img1 {margin: 20px 30px;}
#banner {float:left;position:relative; width:720px;height:auto;padding:0 30px;}
#banner1 {float:left;position:relative;width:460px;height:220px;}
#banner1 h2 {font-size:16px;font-weight:500;color:#336699;}
#banner1 p {font-size:11px;color:#000033;text-align:justify;}

#photo {max-height:50px;max-width:50px;float:left;margin-right:10px;}
#text {padding-right:10px;overflow:auto;scrollbar-base-color:#336699;scrollbar-shadow-color:#336699;scrollbar-highlight-color: #336699;scrollbar-3dlight-color:#eeeeee;scrollbar-darkshadow-color:#336699;scrollbar-track-color:#eeeeee;scrollbar-arrow-color:#eeeeee;height:175px;}
#text2 {padding-right:10px;overflow:auto;scrollbar-base-color:#336699;scrollbar-shadow-color:#336699;scrollbar-highlight-color: #336699;scrollbar-3dlight-color:#eeeeee;scrollbar-darkshadow-color:#336699;scrollbar-track-color:#eeeeee;scrollbar-arrow-color:#eeeeee;height:175px;}
#text h2,#text2 h2 {font-size:12px;font-weight:bold;color:#336699;text-align:left;}
#text h3,#text2 h3 {font-size:11px;font-weight:bold;color:#888888;margin-bottom:5px;text-align:left;}
#pages {font-size:11px;text-align:right;position:relative;font-weight:bold;height:11px;padding-right:10px;}
#hr {margin:10px 0;border-bottom: 1px solid #336699;}

#banner2 {float:left;position:relative;width:220px;height:220px;margin:0 20px;background-color:#336699;}
#banner2 h2 {font-size:16px;font-weight:500;color:#FFFFFF;padding:10px;}
#banner2 p {font-size:12px;color:#000033;padding:10px;}

#label0 {background-color:#336699;border-top:solid 1px #eeeeee;border-bottom:solid 1px #eeeeee;border-left:solid 1px #eeeeee;color:#eeeeee;width:75px;height:20px;display:block;position:relative;float:left;margin:10px 0 10px 10px;}
#login, #password {background-color:#336699;border-top:solid 1px #eeeeee;border-bottom:solid 1px #eeeeee;border-right:solid 1px #eeeeee;border-left:none;color:#eeeeee;width:123px;height:20px;display:block;position:relative;float:left;margin:10px 10px 10px 0;}
#valider {background-color:#336699;color:#eeeeee;border:#eeeeee 1px solid;width:200px;cursor:pointer;margin:10px;position:relative;float:left;}
#valider:hover {background-color:#eeeeee;color:#336699;border:#eeeeee 1px solid;}

/*L'Agence*/

#quisommesnous {float:left;position:relative;width:700px;margin:0 0 20px 0;}
#agence {float:left;position:relative;width:700px;height:265px;margin:20px 30px;}
#philosophie {float:left;position:relative;width:330px;padding:0 20px 0 0;}
#equipe{float:left;position:relative;width:330px;padding:0 0 0 20px;}
#presentation h2, #philosophie h2, #equipe h2, #quisommesnous h2 {font-size:16px;font-weight:500;color:#336699;}
#presentation p, #philosophie p, #equipe p, #quisommesnous p {font-size:12px;color:#000033;}
#img3 {float:left;position:relative;width:700px;height:130px;margin:0 30px 20px 30px;}

/*Les services*/

#img4 {float:left;position:relative;width:200px;height:415px;margin:20px 0 20px 30px;background-image:url(images/img4.jpg);font-weight:bold;}
#table td p {font-size:12px;color:#eeeeee;text-align:left; padding: 5px 5px 0 5px;}
#table td img {padding:8px 5px 0 5px;}
#lesservices {float:left;position:relative;width:480px;height:135px;margin:20px 30px 0 20px;}
#lesservices h2 {font-size:16px;font-weight:500;color:#336699;}
#lesservices p {font-size:12px;color:#000033;}
#lesservices ul {font-size:12px;color:#000033;list-style:none;}
#lesservices ul li {padding:5px 0;}
#packs {float:left;position:relative;width:480px;margin:20px 30px 0 20px;}
#packs p {font-size:12px;color:#000033;}
#pack1,#pack2,#pack3 {float:left;position:relative;width:150px;background-color:#336699;height:120px;display:block;}
#pack1:hover,#pack2:hover,#pack3:hover {background-color:#000066;}
#pack1,#pack2 {margin-right:15px;}

/*Portfolio*/

#portfolio {float:left;position:relative;width:700px;height:auto;margin:20px 30px 20px 30px;}
#portfolio h2 {font-size:16px;font-weight:500;color:#336699;}

#realisation1 {float:left;position:relative;width:230px;height:360px;background-color:#336699;display:block;text-align:left;}
#realisation2 {float:left;position:relative;width:470px;height:360px;background-color:#336699;display:block;text-align:left;background-image:url(images/img5.jpg);}

#h21 {border-bottom:solid 5px #eeeeee;width:230px;height:113px;display:block;background-image:url(images/web.png);}
#h22 {border-top:solid 5px #eeeeee;border-bottom:solid 5px #eeeeee;width:230px;height:114px;display:block;background-image:url(images/contenus.png);}
#h23 {border-top:solid 5px #eeeeee;width:230px;height:113px;display:block;background-image:url(images/support.png);}

#real1 {border-bottom:solid 5px #eeeeee;height:113px;width:452px;display:block;}
#real2 {border-top:solid 10px #eeeeee;border-bottom:solid 5px #eeeeee;height:114px;display:block;}
#real3 {border-top:solid 5px #eeeeee;height:113px;display:block;}

#next1 {width:18px;height:113px;display:block;background:url(images/next.jpg) top;}
#previous1 {width:18px;height:113px;display:block;background:url(images/previous.jpg) top;}
#next1:hover {background:url(images/next.jpg) bottom;}
#previous1:hover {background:url(images/previous.jpg) bottom;}

.realisations {height:113px;width:113px;display:block;float:left;position:relative;}
.realisations:hover {cursor:pointer;}

#special1 {width:220px;height:103px;display:block;background-color:#000066;text-align:left;color:#eeeeee;font-size:12px;padding:5px;}
#special2 {width:220px;height:104px;display:block;background-color:#000066;text-align:left;color:#eeeeee;font-size:12px;padding:5px;}

a.imagehover:hover img, #imagehover img:hover {opacity: .70;filter: alpha(opacity=70);}

/*Contact*/

#contacter{float:left;position:relative;width:500px;height:auto;margin:20px 0 30px 30px;}
#contacter h2{font-size:16px;font-weight:500;color:#336699;}

#contact {float:left;position:relative;width:460px;height:359px;background-color:#336699;padding:20px 10px 0 10px;}

#label1 {background-color:#336699;border-top:solid 1px #eeeeee;border-bottom:solid 1px #eeeeee;border-left:solid 1px #eeeeee;color:#eeeeee;width:100px;height:20px;display:block;position:relative;float:left;margin:10px 0;}

#nom, #email {background-color:#336699;border-top:solid 1px #eeeeee;border-bottom:solid 1px #eeeeee;border-right:solid 1px #eeeeee;border-left:none;color:#eeeeee;width:358px;height:20px;display:block;position:relative;float:left;margin:10px 0;}

#nom2 {background-color:#336699;border-top:solid 1px #eeeeee;border-bottom:solid 1px #eeeeee;border-right:solid 1px #eeeeee;border-left:none;color:#eeeeee;width:358px;height:20px;display:block;position:relative;float:left;margin:10px 0;}

#message1 {background-color:#336699;border:solid 1px #eeeeee;border-bottom:none;display:block;width:458px;height:20px;position:relative;float:left;margin-top:10px;}
#message2 {background-color:#336699;border:solid 1px #eeeeee;border-top:none;display:block;width:458px;position:relative;float:left;color:#eeeeee;overflow:auto;scrollbar-base-color:#336699;scrollbar-shadow-color:#336699;scrollbar-highlight-color: #336699;scrollbar-3dlight-color:#eeeeee;scrollbar-darkshadow-color:#336699;scrollbar-track-color:#eeeeee;scrollbar-arrow-color:#eeeeee;}
#envoi {background-color:#336699;color:#eeeeee;width:460px;height:auto;display:block;border:solid 1px #eeeeee;text-align:right;margin:10px 0;position:relative;float:left;padding:3px;cursor:pointer;}
#envoi:hover {background-color:#eeeeee;color:#336699;}

#img2 {float:right;position:relative;width:200px;height:415px;margin: 20px 30px 0 0;}
#erreur {font-size:11px;color:#FF3300;margin-top:-15px;}
#bon {font-size:11px;color:#000033;}

/*Formulaire*/

#titreform{float:left;position:relative;width:700px;height:auto;margin:0 30px;}
#titreform h1{font-size:16px;font-weight:500;color:#336699;}
#titreform h2{font-size:12px;color:#000033;font-weight:normal;margin-bottom:20px;}
#titreform h3 {border-bottom:solid 1px #336699;}
#form1 {margin:0 30px 30px 30px;}
#slides {float:left;position:relative;}
#questform {float:left;position:relative;width:700px;}
#quest p, #questform p {font-size:12px;color:#000033;}
#tableform {font-size:12px;color:#000033;}
#espace {height:20px;}
#colonne {width:20px;}
#tableform {height:350px;width:700px;display:block;}
#next {float:right;font-size:12px;color:#336699;}
#next:hover {color:#000066;}
#previous {float:left;font-size:12px;color:#336699;}
#previous:hover {color:#000066;}
.boutonforme {background-color:#336699;color:#eeeeee;width:700px;border:solid 1px #eeeeee;padding:3px 0;cursor:pointer;font-size:11px;display:block;text-align:center;}
.boutonforme:hover {background-color:#eeeeee;color:#336699;border:solid 1px #336699;}
#boutonforme {background-color:#336699;color:#eeeeee;width:698px;border:solid 1px #eeeeee;padding:3px 0;cursor:pointer;font-size:11px;display:block; text-align:center;margin-top:5px;}
#boutonforme:hover {background-color:#eeeeee;color:#336699;border:solid 1px #336699;}
#message {float:left;position:relative;width:700px;margin:20px 30px;}
#message p{font-size:12px;color:#000033;padding-bottom:10px;text-align:center;}
#instruction {width:280px;}
#textarea {width:400px;overflow:auto;scrollbar-base-color:#336699;scrollbar-shadow-color:#336699;scrollbar-highlight-color: #336699;scrollbar-3dlight-color:#eeeeee;scrollbar-darkshadow-color:#336699;scrollbar-track-color:#eeeeee;scrollbar-arrow-color:#eeeeee;}