/*
======================================
Design réalisé par Jonathan BUTTIGIEG
Société : Jonathan BUTTGIEG
Dernières modifications : 25/01/2010
======================================
*/

/*
======================
STYLES GENERAL
======================
*/

body {
background: url(../design/images/bg-body.png) repeat-x;
font-family: Helvetica, Tahoma, Verdana, Arial, sans-serif;
font-size: 12px;
padding-top: 10px;
background-color: #464646;

}

* {
margin: 0;
padding: 0;
outline: none;

}

img {
border: none;

}

ul {
list-style-type: none;

}

a {
text-decoration: none;
color: #fff;

}

input {
border: 1px solid #cfcfcf;
height: 15px;
margin-bottom: 8px;
padding: 2px 0 0 5px;

}

select {
border: 1px solid #cfcfcf;
margin-bottom: 8px;

}

textarea {
border: 1px solid #cfcfcf;
margin-bottom: 8px;

}

label {
display: block;
float: left;
margin-top: 4px;
width: 200px;

}

div#left, div#right {
float: left;

}

div#admin {
height: 415px;
overflow: auto;

}

/*
======================
CONTENEUR
======================
*/

div#content {
background:transparent url(../design/images/ecran2.png) no-repeat scroll 0 0;
height:675px;
margin:0 auto;
padding:30px 39px 0;
width:935px;
}

/*
======================
CONTENT ECRAN
======================
*/

div#content_ecran {
background-color:#FFFFFF;
background: url(../design/images/bg_ecran.jpg) no-repeat 0 bottom;
height:490px;
overflow:hidden;
padding: 10px;

}

/*
======================
HEADER
======================
*/

div#logo_header, div#menu {
float: left;

}

/*
======================
MENU
======================
*/

div#menu {
padding-top: 12px;
margin-left: 100px;

}

div#menu a {
color: #000;

}

div#menu li {
display: inline;

}

/*
======================
LISTE REFERENCES
======================
*/

div#liste_ref {
width: 199px;
/*
background: url(../design/images/bg_liste_ref.png) no-repeat;
padding: 12px 13px;
width: 209px;
height: 386px;
*/
margin: 13px 9px 0 0;
padding: 0 10px;

}

/*
div#content_liste {
background: url(../design/images/bg_content_liste.png) repeat-x;
padding: 10px;
height: 366px;

}
*/

div#liste_ref li {
display: inline;
margin-right: 9px;


}

img.mini_ref {
padding: 3px;
background-color: #fff;
border: 1px solid #dfdfdf;

}

/*
======================
REFERENCES
======================
*/

div#show {
width: 645px;
height: 272px;
background: url(../design/images/bg_reference.png) no-repeat;
padding: 12px 13px;
position: relative;
margin-bottom: 10px;

}

div#infos {
width: 170px;
height: 252px;
background-color: #000;
opacity : 0.75;
padding: 10px;
position: absolute;
top: 12px;
color: #fff;
text-align: justify;

}

div#infos h1 {
font-size: 18px;
margin-bottom: 10px;

}

div#infos ul li {
margin-bottom: 10px;
line-height: 14px;

}

/*
div#content_ref {
background: url(../design/images/bg_content_ref.png) repeat-x;
padding: 10px;
height: 84px;

}
*/

div#logo_client, div#techno {
float: left;

}

div#logo_client {
padding-right:10px;
text-align:center;
width:210px;

}

div#techno {
border-left:1px solid #dfdfdf;
height:108px;
padding:0 10px;
width:215px;

}

div#prestation {
border-left:1px solid #dfdfdf;
float:left;
height:108px;
padding:0 10px;
text-align:justify;
width:200px;

}

div#prestation li {
line-height: 20px;

}

/*
======================
TECHNOLOGIES
======================
*/

div#techno li {
float: left;
margin-top: 10px;

}

li.photoshop {
background: url(../design/images/photoshop.png) no-repeat 0 50%;
line-height:34px;
padding-left:40px;
margin-right: 10px;

}

li.illustrator {
background: url(../design/images/illustrator.png) no-repeat 0 50%;
line-height:34px;
padding-left:40px;

}

li.flash {
background: url(../design/images/flash.png) no-repeat 0 50%;
line-height:34px;
padding-left:40px;
margin-right: 10px;

}

li.ajax {
background: url(../design/images/ajax.png) no-repeat 0 50%;
line-height:34px;
padding-left:40px;
margin-right: 10px;

}

li.wordpress {
background: url(../design/images/wordpress.png) no-repeat 0 50%;
line-height:32px;
padding-left:40px;

}

li.php {
background: url(../design/images/php.png) no-repeat 0 50%;
line-height:32px;
padding-left:55px;

}


/*
======================
A PROPOS + CONTACT
======================
*/

div#a_propos {
text-align: justify;
padding-top: 10px;

}

div#contact {
margin-left: 10px;

}

div#a_propos h1, div#contact h1{
margin-bottom: 10px;
font-size: 15px;
color: #126182;

}

div#a_propos li {
line-height: 23px;

}

input.submit {
height:25px;
margin-left:200px;
padding:0 5px;
width:90px;

}

/*
======================
ADMIN
======================
*/

div#admin {
margin-left: 10px;

}

div#admin h1 {
font-size: 14px;
margin: 10px 0;

}

div#admin a {
color: #000;
font-size: 12px;
font-weight: normal !important;

}