/*-----------------------------------------------------------
	Project:	Bonna Sabla
	Date : 	november 2008
	Author:	C2iS - AFO
	Summary :		
		| Imports of Css
		| Global Classes
		| Main Layout			
-----------------------------------------------------------*/

/* ::::::::::: Imports of Css :::::::::: */
@import url(reset_css.css);
@import url(typography.css);

/*:::::::::::::::::::: Global Classes :::::::::::::::::::*/
/* Positionning */
.float_left
{
    float: left;
}
.float_right
{
    float: right;
}
.clear
{
    clear: both;
}
.first
{
    margin-left: 0;
    padding-left: 0;
}
.last
{
    margin-right: 0;
    padding-right: 0;
}
.top
{
    margin-top: 0;
    padding-top: 0;
}
.bottom
{
    margin-bottom: 0;
    padding-bottom: 0;
}
/* Text alignment */
.text_left
{
    text-align: left;
}
.text_right
{
    text-align: right;
}
.text_center
{
    text-align: center;
}
.text_justify
{
    text-align: justify;
}
/* Font modeling */
.bold
{
    font-weight: bold;
}
.italic
{
    font-style: italic;
}
.underline
{
    border-bottom: 1px solid;
}
.small
{
    font-size: .8em;
    margin-bottom: 1.875em;
    line-height: 1.875em;
}
.large
{
    font-size: 1.2em;
    line-height: 2.5em;
    margin-bottom: 1.25em;
}
/* Spacement */
.nopadding
{
    padding: 0;
}
/* Specific attributs */
.hide
{
    display: none;
}

/*:::::::::::  Main layout :::::::::::*/
body
{
    background: #e2e2e2;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
}

.wrapper
{
    width: 950px;
    margin: 0 auto;
    background: #fff;
    overflow: hidden;
    position: relative;
}

#header
{
    background: url(../images/common/bandeau_superieur.jpg) no-repeat 0 0;
    height: 105px;
}

#header h1 a
{
    display: block;
    background: url(../images/common/fr/logo_bonnaSabla.gif) no-repeat 20px 25px;
    width: 154px;
    height: 49px;
    float: left;
    padding: 25px 0 0 20px;
    margin-right: 30px;
}

#header h1 a span, #header h2 span
{
    position: absolute;
    left: -999em;
}

#header h2
{
    background: url(../images/common/fr/tagline.gif) no-repeat 0 54px;
    width: 370px;
    height: 25px;
    float: left;
    padding-top: 54px;
}

#header .searchBox
{
    padding: 60px 15px 0 0;
    float: right;
}

#header .searchBox .textField
{
    width: 102px;
    height: 12px;
    border: 1px solid #b8b8b8;
    font-size: 0.8em;
    vertical-align: top;
    margin-right: 5px;
}

#TitleBloc
{
    padding: 26px 0 0 161px;
    width: 789px;
    height: 93px;
}

#TitleBloc h3
{
    text-transform: uppercase;
    font-size: 2.2em;
    height: 27px;
}

#TitleBloc .breadcrumbs
{
    padding: 30px 0 0 0;
    font-size: 0.9em;
}

#TitleBloc .breadcrumbs a
{
    color: #004983;
}

#TitleBloc .breadcrumbs a:hover
{
    text-decoration: underline;
}

/*Menu*/
#topMenu
{
    background: #004983;
    height: 30px;
}

#topMenu ul
{
    width: 930px;
    overflow: hidden;
    padding: 0 0 0 20px;
}

#topMenu li
{
    float: left;
}

#topMenu li a
{
    color: #fff;
    font-size: 16px;
    background-color: #004983;
    display: block;
    padding: 7px 12px;
    float: left;
}

#topMenu li a:hover, #topMenu li.active a, #topMenu li a.selected
{
    background-color: #336d9c;
}

#topMenu li.selectBox
{
    float: right;
    padding: 7px 5px 0 0;
}

#topMenu li.selectBox select
{
    width: 150px;
    color: #004983;
    font-size: 0.9em;
    height: 17px;
    padding: 0;
}
#leftMenu
{
    width: 110px;
    padding: 10px 20px 20px 40px;
    float: left;
    background: #fff;
}

#leftMenu li
{
    padding: 0 0 10px 0;
    text-transform: uppercase;
}

#leftMenu li a
{
    color: #ababab;
    font-weight: bold;
}

#leftMenu li a:hover
{
    color: #767676;
}

#leftMenu li li
{
    padding: 0;
}

#leftMenu li li a
{
    font-weight: normal;
    font-size: 0.9em;
    color: #1f5885;
    padding: 1px 0 3px 4px;
    text-transform: none;
    margin: 2px 0;
    display: block;
}

#leftMenu li li a:hover, .solutionAmenag #leftMenu li.active li a:hover
{
    color: #276fa8;
}

#leftMenu li li a.selected
{
    border-top: 1px solid #89ba00;
    border-left: 1px solid #89ba00;
    background: #dbdada url(../images/solutions/bg_subMenuActive.gif) no-repeat bottom right;
}

#homeWideMenu
{
    background: url(../images/home/bg_wideMenu.jpg) no-repeat 0 0;
    width: 950px;
    height: 327px;
}

#homeWideMenu ul
{
    padding: 0 0 0 40px;
}

#homeWideMenu li
{
    float: left;
}

#homeWideMenu li.conduites
{
    width: 139px;
    padding-top: 170px;
}
#homeWideMenu li.genCivil
{
    width: 90px;
    padding-top: 29px;
}
#homeWideMenu li.assain
{
    width: 120px;
    padding-top: 133px;
}
#homeWideMenu li.traitEau
{
    width: 79px;
    padding-top: 8px;
}
#homeWideMenu li.amenagUrb
{
    width: 96px;
    padding-top: 126px;
}
#homeWideMenu li.bat
{
    width: 92px;
    padding-top: 18px;
}
#homeWideMenu li.appli
{
    width: 94px;
    padding-top: 115px;
}
#homeWideMenu li.traverses
{
    width: 139px;
    padding-top: 47px;
}

#homeWideMenu li a
{
    color: #fff;
    text-transform: uppercase;
    font-size: 1em;
    font-weight: bold;
    display: block;
    padding: 4px 2px;
    cursor: pointer;
    height: 1%;
}

#homeWideMenu li.conduites a
{
    background: url(../images/home/bg_itemConduite.png) no-repeat 0 98px;
    height: 15px;
    padding-top: 104px;
}
#homeWideMenu li.genCivil a
{
    background: url(../images/home/bg_itemGenieCivil.png) no-repeat 0 -17px;
    height: 133px;
}
#homeWideMenu li.assain a
{
    background: url(../images/home/bg_itemAssainissement.png) no-repeat 0 114px;
    height: 25px;
    padding-top: 118px;
}
#homeWideMenu li.traitEau a
{
    background: url(../images/home/bg_itemEau.png) no-repeat 0 -17px;
    height: 138px;
}
#homeWideMenu li.amenagUrb a
{
    background: url(../images/home/bg_itemUrbain.png) no-repeat 0 146px;
    height: 27px;
    padding-top: 151px;
}
#homeWideMenu li.bat a
{
    background: url(../images/home/bg_itemBat.png) no-repeat 0 -17px;
    height: 138px;
}
#homeWideMenu li.appli a
{
    background: url(../images/home/bg_itemAppli.png) no-repeat 0 112px;
    height: 26px;
    padding-top: 120px;
}
#homeWideMenu li.traverses a
{
    background: url(../images/home/bg_itemSyst.png) no-repeat 0 -16px;
    height: 124px;
}


#homeActuBloc
{
    padding: 15px 0 15px 38px; /*min-height:130px*/
}

/** html #homeActuBloc {height:130px;}*/

#homeActuBloc h3
{
    color: #8c8c8c;
    font-size: 1.8em;
}

#homeActuBloc ul
{
    overflow: hidden;
}

#homeActuBloc li
{
    float: left;
    width: 268px;
    padding: 20px 34px 0 0;
}

#homeActuBloc dl
{
    color: #1f5885;
    font-size: 0.9em;
}

#homeActuBloc dt
{
    padding: 0 0 5px 0;
    clear: both;
}

#homeActuBloc dd.visu
{
    float: right;
    padding-left: 10px;
}

#homeActuBloc dl a
{
    color: #1F5885;
}

#middleContent
{
    width: 535px;
    float: left;
    padding: 10px 20px 20px 0;
}

#middleContent h4, #middleContent_OneCol h4
{
    color: #004983;
    font-weight: bold;
    font-size: 1.7em;
    padding-bottom: 20px;
}

#middleContent h5
{
    font-size: 1.2em;
    color: #004983;
    font-weight: bold;
    padding: 5px 0;
}

#middleContent p, #middleContent ul
{
    font-size: 12px;
    line-height: 1.6em;
    padding-bottom: 10px;
}



#middleContent img.MainContentVisu
{
    margin-bottom: 20px;
}

#middleContent p a
{
    color: #1f5885;
    text-decoration: underline;
}

#middleContent p a:hover
{
    text-decoration: none;
}

#ficheProduit
{
    border-left: 1px solid #626164;
    border-bottom: 1px solid #626164;
    width: 488px;
    padding: 23px 12px 23px 20px;
    background: url(../images/solutions/bg_ficheProduit.gif) no-repeat top right;
    overflow: hidden;
}

#middleContent #ficheProduit h4
{
    padding: 5px 35px 0 0;
}

#middleContent ul li
{
    padding: 0 0 0 10px;
    height: 1%;
    overflow: hidden;
}

#middleContent img.visuFicheProd
{
    float: left;
    margin: 0 15px 15px 0;
}

#middleContent_OneCol
{
    width: 758px;
    float: left;
    padding: 10px 20px 20px 0;
    min-height: 415px;
}

* html #middleContent_OneCol
{
    height: 415px;
}

.jobOfferTable
{
    width: 450px;
    border: 1px solid #b8b8b8;
    padding: 3px;
    font-size: 0.9em;
    margin-top: 30px;
}

.jobOfferTable td
{
    padding: 10px 5px;
    background: #fff url(../images/recrutement/border_jobOfferTable.gif) repeat-x 1px top;
    vertical-align: middle;
}

.jobOfferTable td.empty
{
    background: #fff;
    width: 6px;
    padding: 10px 0;
}
.jobOfferTable td.loc
{
    color: #808080;
}
.jobOfferTable tr.first td
{
    background: #fff;
}
.jobOfferTable td.seeFullOffer
{
    width: 83px;
}

#middleContent_OneCol .formCandidature p
{
    padding: 4px 0;
}

.formCandidature p label
{
    /*width:170px;*/ /* DRO */
    width: 220px;
    float: left;
    font-weight: bold;
    font-size: 11px;
    color: #474b4f;
    padding: 4px 0 0 0;
}

.formCandidature p input, .formCandidature p select
{
    width: 172px;
    height: 14px;
    font-size: 11px;
    padding: 0;
    margin: 0 7px 0 4px;
}

.formCandidature p select
{
    height: 18px;
    width: 175px;
}

.formCandidature p input.shortTxtField
{
    width: 80px;
}

#middleContent_OneCol p.validForm
{
    text-align: center;
    width: 349px;
    padding: 14px 0 0 0;
}

.formCandidature p.validForm input
{
    border: none;
    width: 60px;
    height: 15px;
}

.formCandidature p.fileUpload input
{
    height: 21px;
    width: 200px;
    margin: 0 !important;
}

.formCandidature p em, p.requiredFields em
{
    color: #d40000;
}

.formCandidature p.fileUpload span.form_candidature_frValidator
{
    padding: 0 0 0 224px;
}

#middleContent p.contactFormLine
{
    padding-bottom: 30px;
}

.contactFormLine select
{
    width: 180px;
    font-size: 1em;
}

.contactFormLine input
{
    width: 27px;
    font-size: 1em;
}

dl.contactItem
{
    padding: 0 0 25px 0;
    font-size: 0.9em;
    line-height: 1.2em;
}

dl.contactItem dt
{
    font-weight: bold;
    color: #898989;
    font-size: 1.3em;
}

dl.contactItem dt a
{
    color: #898989;
}

dl.contactItem dt img
{
    vertical-align: middle;
}

.orgContainer
{
    background: url(../images/corporate/bg_organigram.gif) no-repeat 94px 44px;
    overflow: hidden;
}

.orgContainer table
{
    width: 228px;
    border-collapse: collapse;
}
.orgContainer table.achatInternat
{
    float: left;
    margin-right: 25px;
}
.orgContainer table.achatInternat td
{
    width: 169px;
}
.orgContainer table.dirGen
{
    float: left;
    margin-right: 25px;
    margin-top: 34px;
}
.orgContainer table.fifliales
{
    float: left;
    margin-top: 86px;
}
.orgContainer table.dirGenDelegue
{
    clear: both;
    width: 730px;
    margin: 30px 0 40px 0;
}
.orgContainer table.adminFinances
{
    float: left;
    width: 170px;
    margin-right: 10px;
}
.orgContainer table.informatique
{
    float: left;
    width: 170px;
    margin-right: 10px;
}
.orgContainer table.operations
{
    float: left;
    width: 369px;
}
.orgContainer table.operations td
{
    width: 310px;
}
.orgContainer table.miniOpe
{
    width: 180px;
    float: left;
    margin-right: 9px;
}
.orgContainer table.miniOpe td
{
    width: 121px;
}
.orgContainer table.last
{
    margin-right: 0;
}

.orgContainer th
{
    color: #004983;
    background: #dae6f0;
    text-align: center;
    padding: 7px 0;
    font-weight: bold;
}

.orgContainer td
{
    color: #474b4f;
    background: #f1ede0;
    vertical-align: middle;
    font-size: 11px;
}

.orgContainer table td.trombi
{
    width: 59px;
}
.orgContainer td.trombi img
{
    display: block;
}
.orgContainer td span
{
    color: #8a9199;
}

p.disclaimer
{
    font-size: 0.8em;
    color: #004983;
}

/*Search results*/

.searchResults h2
{
    padding: 0 0 15px 0;
    font-weight: bold;
    font-size: 1.5em;
    color: #004983;
}

.searchResults h3
{
    background: url(../images/common/puce_searchResult.gif) no-repeat 0 1px;
}

.searchResults h3 a
{
    font-weight: bold;
    padding: 0 0 0 20px;
}

.searchResults p
{
    padding-bottom: 20px !important;
}

.pagineur
{
    clear: both;
    text-align: center;
    padding: 0 0 15px 0;
    font-size: 1.2em;
}

.pagineur a.pagineur_on
{
    font-weight: bold;
    color: #004983;
}

#rightCol
{
    width: 210px;
    float: left;
    padding: 0 0 20px 0;
}

#rightCol h6
{
    text-transform: uppercase;
    font-size: 1.2em;
    font-weight: bold;
}

#rightCol .hotSpotRight
{
    padding: 17px 6px 24px 7px;
    width: 185px;
    margin: 1px 0 10px 0;
    overflow: hidden;
    font-size: 0.9em;
    line-height: 1.2em;
}

.hotSpotRight.withoutPadding
{
    padding: 17px 1px 24px 0 !important;
    width: 197px !important;
}

.hotSpotRight .withBullet li
{
    padding: 0 0 5px 13px;
}

.withoutPadding .withBullet li
{
    padding: 3px 0 5px 20px !important;
    background-position: 7px 6px !important;
}

.hotSpotRight .feedBack
{
    font-style: italic;
}

.hotSpotRight .listRealisation
{
    padding: 7px 2px 2px 7px;
    clear: both;
    overflow: hidden;
    height: 1%;
}

.hotSpotRight .listRealisation dt
{
    font-size: 1.1em;
}

.hotSpotRight .listRealisation dd.visu
{
    float: left;
    margin: 0 5px 5px 0;
}

.hotSpotRight .brandListFloated li
{
    width: 90px;
    float: left;
    padding: 0 0 8px 0;
    font-size: 1.1em;
}

.hotSpotRight .brandListFloated li img
{
    vertical-align: middle;
}

.hotSpotRight dl.brandList
{
    width: 182px;
    overflow: hidden;
    padding: 0 0 7px 0;
    color: #004983;
}

.hotSpotRight dl.brandList dt
{
    float: left;
    width: 87px;
    padding: 1px 0 0 0;
    font-size: 1.1em;
    font-weight: bold;
}

.hotSpotRight dl.brandList dd.logo
{
    float: left;
    width: 90px;
    padding-bottom: 7px;
}

/* Patch DRO */
.hotSpotRight .baseLine
{
    display:none;
    visibility:hidden;
}

.hotSpotRight .baseLine a
{
    display:none;
    visibility:hidden;
}
/* Fin Patch DRO */

.hotSpotRight select
{
    width: 180px;
    font-size: 1em;
}

.hotSpotRight .contactResults div
{
    padding: 0 0 0 5px;
}

.hotSpotRight .contactResults .marque
{
    font-weight: bold;
    color: #004983;
    font-size: 1.1em;
    padding: 15px 0 0 0;
}

.hotSpotRight .contactResults .adresse1
{
    padding: 11px 0 0 5px;
    background: url(../images/solutions/bg_adressContact.gif) no-repeat 0 8px;
}

.hotSpotRight .contactResults .fax, .hotSpotRight .contactResults .telephone
{
    font-style: italic;
}

a.singleLink
{
    font-weight: bold;
    color: #004983;
}
a.singleLink:hover
{
    text-decoration: underline;
}

/*details offres emploi*/
.offerDetails
{
    background: #fff;
    width: 440px;
    padding: 0 10px 20px 10px;
}

.offerDetails ul.offerDetailsList
{
    padding: 0 0 20px 86px;
}

.offerDetails .offerDetailsList li
{
    padding: 2px 0;
}

.offerDetails .offerDetailsList li span
{
    display: inline-block;
    width: 100px;
    text-align: right;
    padding: 0 20px 0 0;
    font-weight: bold;
}

.offerDetails h5
{
    color: #004983;
    font-size: 1.2em;
    font-weight: bold;
    padding: 8px 0;
}

.offerDetails p.bottomLinks
{
    padding: 20px 0;
    overflow: hidden;
    zoom: 1;
}

.offerDetails p.bottomLinks a.backToOffers
{
    float: left;
    color: #004983;
    display: block;
    padding: 6px 0 0 0;
    text-decoration: none !important;
}
.offerDetails p.bottomLinks a.backToOffers:hover
{
    text-decoration: underline !important;
}

.offerDetails p.bottomLinks a.applyToOffer
{
    float: right;
    background: #004983;
    color: #fff !important;
    display: block;
    padding: 5px 5px 7px 5px;
    margin-right: 10px;
    border: 1px solid #004983;
    border-width: 1px 0 0 1px;
    text-decoration: none !important;
}
.offerDetails p.bottomLinks a.applyToOffer:hover
{
    text-decoration: underline !important;
}

/* ::::::: FOOTER ::::::::*/
#footer
{
    clear: both;
    background: #b7b7b7 url(../images/common/fr/logo-footer.jpg) no-repeat 0 0;
    height: 13px;
    padding: 12px 11px 0 133px;
}

#footer p
{
    color: #fff;
    font-size: 11px;
}

#footer p a
{
    color: #fff;
}

/*Plan du site*/
#siteMap li
{
    width: 120px;
    float: left;
    margin-right: 22px;
    display: inline;
    background: url(../images/corporate/bg_degMapSite.gif) repeat-x 0 0;
    padding: 10px 0 15px 5px;
}
#siteMap li a
{
    font-weight: bold;
    display: block;
    padding: 0 0 5px 0;
    color: #004983;
}
#siteMap li a:hover
{
    text-decoration: underline;
}
#siteMap li li
{
    float: none;
    margin: 0;
    display: block;
    padding: 3px 0 3px 7px;
    width: 118px;
    background: url(../images/corporate/puce_content_corpo.gif) no-repeat 0 8px;
}
#siteMap li li a
{
    font-weight: normal;
    display: inline;
    color: #000;
}


/* ::::::: ADDITION//PRESSE ::::::::*/

.mini-press
{
    color: #474b4f;
}

.mini-press h5
{
    font-weight: bold !important;
    color: #474b4f !important;
    font-size: 11px !important;
    margin: 0;
    padding: 0;
}

.mini-press p
{
    font-size: 11px;
    margin: 0 !important;
}

.mini-press a.btn-download
{
    color: #004983;
    text-decoration: underline;
    font-size: 11px;
    background: url(../images/common/picto-pdf.png) left top no-repeat;
    width: 25px;
    height: 25px;
    display: block;
    padding: 5px 0 0 30px;
}

.mini-press a.btn-download:hover
{
    color: #004983;
    text-decoration: none;
}

ul.date-pager
{
    padding: 0;
}

div #middleContent ul.date-pager li
{
    display: inline;
    background: url(../images/common/pipe.png) right 1px no-repeat;
    padding: 0 5px 0 2px !important;
}

div #middleContent ul.date-pager li.last
{
    background: none;
    padding: 0 0 0 2px !important;
}

div #middleContent ul.date-pager li span
{
    font-weight: bold;
    color: #004983;
}

div #middleContent ul.date-pager li a
{
    color: #004983;
    text-decoration: underline;
}

div #middleContent ul.date-pager li a:hover
{
    text-decoration: none;
}

div #middleContent ul.pager
{
    padding: 0;
    text-align: center;
}

.skinCorporate div #middleContent ul.pager li
{
    -moz-background-clip: border;
    -moz-background-origin: padding;
    -moz-background-size: auto auto;
    background-attachment: scroll;
    background-color: transparent;
    background-image: none;
    background-position: 0 0;
    background-repeat: repeat;
    display: inline;
}

.skinCorporate div #middleContent ul.pager li span
{
    font-weight: bold;
    color: #004983;
}

.skinCorporate div #middleContent ul.pager li a
{
    color: #004983;
    text-decoration: underline;
}

.skinCorporate div #middleContent ul.pager li a:hover
{
    text-decoration: none;
}


h4.presse
{
    margin-bottom: 0px;
    padding-bottom: 0px;
}