@charset "utf-8";

/*

Theme Name: BeOnWeb
Theme URI: http://beonweb.eu
Version: 1.0

*/


/* Resets */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
font-family: inherit;
}

:focus {
outline: 0;
}

body {
color: #565;
background: #375d80 url(../images/background.jpg) no-repeat fixed 0 0;
font: normal 12px/21px Verdana, Arial, Helvetica, sans-serif;
}

/* Styles */
h1 {
font: normal 24px/24px Verdana, Arial, Helvetica, sans-serif;
color: #316c6a;
margin: 0 0 10px 0;
}

h2 {
font: normal 26px/30px Verdana, Arial, Helvetica, sans-serif;
color: #316c6a;
margin: 15px 0 25px 0;
}

h3 {
float: left;
font: normal 16px/25px Verdana, Arial, Helvetica, sans-serif;
color: #316c6a;
margin: 10px 0 0 0;
}

a {
text-decoration: none;
color: #316c6a;
}

li {
list-style-type: none;
}

/* Structure */

#global {
width: 920px;
margin: 15px auto;
}

#header {
width: 860px;
height: 97px;
margin: 0 auto;
padding: 10px 20px 0 0;
background: transparent url(../images/background_header.png) no-repeat top left;
text-align: right;
}

#navigation {
width: 277px;
height: 25px;
margin: 25px 0 0 590px;
text-align: right;
}

#emploi a {
float: left;
width: 136px;
height: 25px;    
background: #fff url(../images/btn_emploi.jpg) left top no-repeat; 
font-size:14px;
color: #fff;
text-align: center;
text-decoration: none;
margin: 0 5px 0 0;
}

#emploi a:hover {
width: 136px;
height: 25px;    
background: #fff url(../images/btn_emploi.jpg) left bottom no-repeat; 
}

#contact a {
float: left;
width: 136px;
height: 25px;    
background: #fff url(../images/btn_contact.jpg) left top no-repeat; 
font-size:14px;
color: #fff;
text-align: center;
text-decoration: none;
margin: 0 0 0 136px;
}

#contact a:hover {
width: 136px;
height: 25px;    
background: #fff url(../images/btn_contact.jpg) left bottom no-repeat; 
}

#content {
width: 920px;
height: 359px;
background: transparent url(../images/background_slideshow.png) no-repeat bottom left;
}

#content p{
font: normal 12px/17px Verdana, Arial, Helvetica, sans-serif;
}

#slideshow {
float: left;
width: 480px;
height: 359px;
z-index: 0px;
}

#intro {
width: 390px;
height: 339px;
margin: 0 0 0 480px;
padding: 10px;
}

#services {
width: 880px;
height: 235px;
margin: 0 auto;
background: #fff;
}

#service01, #service02 {
float: left;
width: 273px;
padding: 15px;
}

#service03 {
width: 243px;
margin: 0 0 0 586px;
padding: 15px 25px 0 25px;
}

.illu {
float: left;
height: 90px;
margin: 0 10px 5px 0;
}

#siteweb {
width: 870px;
height: 75px;
padding: 5px 20px 0 30px;
background: transparent url(../images/background_slideshow.png) no-repeat bottom left;
}

#footer {
width: 880px;
height: 25px;
margin: 0 auto;
text-align: center;
background: #fff url(../images/border_down.jpg) no-repeat bottom left;
font-size: 10px;
}

/** Popin **/

.mypopin4 {
color:#565;
padding:10px;
text-align:left;
text-indent:5px;
border-radius:.5em;
-moz-border-radius:.5em;
background: transparent url(../images/background_contact.png) no-repeat fixed center center;
}
.mypopin4 .popin-content {
padding:10px;
}
.mypopin4 .popin-content p {
padding:0;
margin:0 0 1em;
}