/**
 * Main Stylesheet
*/
/* Redefine basic html elements */
* {
    margin: 0;
    padding: 0
    }
body {
    font-family: Arial;
    font-size: 11px;
    color: #737373;
    width: 100%;
    height: 100%
    }
img {
    border: none
    }
a {
    text-decoration: none;
    outline: none;
    color: #737373
    }
a:hover {
    color: #d30f43
    }
/* ==================== Structure du site ==================== */
#mainContainer {
    position: relative;
    left: 50%;
    margin: 12px 0 0 -490px;
    width: 980px
    }
#content {
    position: relative;
    width: 760px;
    min-height: 500px
    }
#sideBar {
    float: right;
    right: 0;
    width: 210px
    }
#footer {
    clear: both
    }
/* ====================  OMBRES  ==================== */
#ombreGauche, #ombreDroite {
    top: -35px;
    height: 100%
    }
#ombreGaucheDetails, #ombreDroiteDetails {
    bottom: 0;
    height: 222px
    }
#ombreGauche, #ombreGaucheCoeur, #ombreGaucheDetails {
    position: absolute;
    left: 0;
    width: 19px;
    border-right: 1px solid #ccc
    }
#ombreDroite, #ombreDroiteCoeur, #ombreDroiteDetails {
    position: absolute;
    width: 19px;
    right: 0;
    border-left: 1px solid #ccc
    }
#ombreGaucheCoeur, #ombreDroiteCoeur {
    top: 0;
    height: 100%
    }
#divPrevious, #divNext {
    position: absolute;
    top: 318px;
    width: 17px;
    height: 46px;
    cursor: pointer;
    background-repeat: no-repeat
    }
#divPrevious {
    left: 3px;
    background-image: url(../images/flecheGauche.jpg)
    }
#divNext {
    right: 3px;
    background-image: url(../images/flecheDroite.jpg)
    }
#divPrevious:hover, #divNext:hover {
    background-position: bottom
    }
/* ====================  ACTIVITY FILTER BAR  ==================== */
#filterBar {
    position: absolute;
    left: 27px;
    width: 500px
    }
#thumbnailsMode, #listMode {
    display: block;
    float: left;
    font: 10px Arial;
    line-height: 10px;
    height: 10px;
    overflow: hidden;
    background-position: right top;
    background-repeat: no-repeat;
    color: #2d2d2d;
    padding-right: 13px;
    margin: 3px 5px
    }
#thumbnailsMode:hover, #listMode:hover {
    background-position: right -10px;
    color: #e32c43
    }
#thumbnailsMode.selected, #listMode.selected {
    background-position: right bottom;
    color: #be1327
    }
#thumbnailsMode {
    background-image: url(../images/iconesVignette.gif)
    }
#listMode {
    background-image: url(../images/iconesListe.gif)
    }
#cbDiscipline {
    position: relative;
    top: -16px
    }
#disciplineComboBox {
    position: relative;
    top: -27px;
    left: 212px;
    width: 116px;
    height: 27px;
    z-index: 100
    }
#disciplineComboBox span {
    width: 116px !important;
    color: #fff;
    height: 27px;
    line-height: 27px;
    text-align: center;
    font-size: 11px;
    font-family: Helvetica;
    text-transform: uppercase;
    font-weight: bold;
    overflow: hidden;
    position: absolute;
    background: #d30f43 url(../images/arrows.png) no-repeat scroll 98% center
    }
#disciplineComboBox select {
    position: relative;
    top: 0;
    height: 27px;
    line-height: 27px;
    font-size: 11px;
    opacity: 0;
    -ms-filter: "alpha(opacity=0)";
    filter: alpha(opacity=0);
    zoom: 1
    }
/* Boutons */
.bouton, .btn {
    float: left;
    border: 1px solid #ccc;
    background-color: #fff;
    padding: 0 10px;
    overflow: hidden;
    font-size: 12px;
    line-height: 21px;
    vertical-align: middle;
    cursor: pointer;
    text-transform: uppercase
    }
.btn.small {
    font-size: 9px;
    line-height: 16px
    }
.bouton.right, .btn.right {
    float: right
    }
.bouton:hover, .btn:hover {
    color: #737373;
    background-color: #eee
    }
.btn.selected {
    background-color: #565656;
    color: #fff
    }
/* ====================  POPUP  ==================== */
#popupContainer {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%
    }
#popupBG, #loginReminderBG {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 1700px;
    background-color: #9c9c9c;
    opacity: 0.74;
    /* Firefox, Safari, Chrome, Opera */
    -ms-filter: "alpha(opacity=74)";
    /* IE 8 */
    filter: alpha(opacity=74);
    /* IE 4-7 */
    zoom: 1;
    /* Trigger hasLayout in IE 7 and lower */
    }
#popupDropShadow {
    position: absolute;
    left: 50%;
    top: 50%;
    background-color: #000;
    opacity: 0.05;
    /* Firefox, Safari, Chrome, Opera */
    -ms-filter: "alpha(opacity=05)";
    /* IE 8 */
    filter: alpha(opacity=5);
    /* IE 4-7 */
    zoom: 1;
    /* Trigger hasLayout in IE 7 and lower */
    }
#popupBox {
    position: absolute;
    left: 50%;
    top: 50%;
    border: 1px solid #ccc;
    background-color: #fff
    }
#popupClose {
    position: absolute;
    right: -8px;
    top: -10px;
    width: 22px;
    height: 22px
    }
#popupCloseArea {
    cursor: pointer
    }
#popupContent {
    position: relative;
    margin: 31px 35px 35px 35px
    }
/* ====================  ADDTHIS BUTTON  ==================== */
.addthis_button {
    float: left;
    display: block;
    width: 65px;
    height: 20px;
    margin-top: 5px;
    margin: 5px 0 0 35px
    }
.addthis_button img {
    visibility: hidden
    }
.addthis_button.FR {
    background-image: url(../images/AddThis_fr.jpg);
    background-repeat: no-repeat
    }
.addthis_button.EN {
    background-image: url(../images/AddThis_en.jpg);
    background-repeat: no-repeat
    }
.addthis_button:hover {
    background-position: 0% 100%
    }
/*#accueilCmdDiv {
        float: left;
}*/
#accueilCmd {
    color: #BE1327;
    font-bold: weight;
    margin-left: 27px
    }
/* ====================  SMS POPUP  ==================== */
#smsPopup {
    display: none
    }
.smsContent {
    width: 380px;
    height: 235px
    }
.smsHeader {
    height: 35px;
    font-size: 26px;
    color: #e91d25
    }
.smsSucces {
    height: 174px;
    font-size: 12px;
    line-height: 16px;
    text-align: justify;
    margin-top: 8px
    }
.phoneNumber {
    width: 106px;
    padding: 0 4px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
    color: #737373
    }
.smsProviders, .smsShowings {
    border: 1px solid #ccc;
    font-size: 9px;
    margin: 0;
    padding: 0
    }
.smsProviders {
    width: 190px
    }
.smsShowings {
    width: 100%
    }
.smsNumber {
    font: normal normal 16px Arial, helvetica, sans-serif;
    width: 120px
    }
.smsErreur {
    height: 30px;
    font-size: 12px;
    line-height: 12px;
    color: #e32c43;
    text-align: left
    }
.smsButtons {
    width: 380px;
    height: 18px
    }
.envoyerTexto {
    float: right;
    color: #e91d25
    }
/* ====================  LOCATION MAP  ==================== */
#mapMainContainer {
    width: 630px;
    height: 301px
    }
#dvLocationHeader {
    height: 46px;
    font-size: 26px;
    color: #e91d25;
    text-align: left
    }
#dvlocationMapTitle {
    font-size: 18px;
    color: #e32c43;
    line-height: 20px;
    text-align: left
    }
#dvLocationMapAddress {
    font-size: 12px;
    line-height: 16px;
    color: #737373;
    text-align: left
    }
#dvLocationMapMore {
    margin-top: 1em;
    font-size: 12px
    }
#dvLocationMapMore a {
    color: #e91d25
    }
#map {
    width: 400px;
    height: 251px;
    float: left;
    margin-right: 12px;
    border: 1px solid #ccc
    }
.locationDetail {
    margin-right: 8px
    }
/* ====================  OTHERS  ==================== */
#noResults {
    vertical-align: middle;
    text-align: center;
    font-size: 12pt;
    width: 754px;
    height: 625px
    }
.publicity {
    width: 130px;
    margin-top: 5px
    }
.publicityImg {
    border: 1px solid #ccc;
    width: 130px;
    margin-top: 5px
    }
#loading {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-color: transparent;
    background-image: url(../images/ajax-loader.gif);
    background-repeat: no-repeat;
    background-position: top
    }
.readMoreButton {
    float: right
    }
/* ====================  INSCRIPTION MODAL  ==================== */
#inscriptionModal {
    position: relative;
    width: 626px;
    height: 450px
    }
#inscriptionHeader {
    position: relative;
    width: 100%;
    height: 36px;
    margin-bottom: 8px;
    background-repeat: no-repeat;
    font: normal normal 26px/35px Helvetica, Arial;
    color: #C2C2C2;
    text-transform: uppercase
    }
#inscriptionHeader span {
    color: #e22c43
    }
/*
#inscriptionHeader.FR { background-image: url("../images/FR/inscriptionHeader.jpg"); }
#inscriptionHeader.EN { background-image: url("../images/EN/inscriptionHeader.jpg"); }
#inscriptionHeader.modification.FR { background-image: url("../images/FR/profilHeader.jpg"); }
#inscriptionHeader.modification.EN { background-image: url("../images/EN/profilHeader.jpg"); }
*/
#inscriptionContent {
    position: relative;
    width: 100%;
    height: 379px;
    border-bottom: 1px solid #ccc
    }
#inscriptionFooter {
    position: relative;
    width: 100%;
    height: 18px;
    margin-top: 8px
    }
#inscriptionTabs {
    display: block;
    height: 22px;
    border-bottom: 1px solid #ccc
    }
#inscriptionTabs li {
    padding: 0 6px;
    background-color: #fff;
    display: inline;
    font-size: 12px;
    line-height: 21px;
    float: left;
    border: 1px solid #ccc;
    margin-left: -1px
    }
#inscriptionTabs li.active {
    color: #fff;
    background-color: #565656
    }
#inscriptionTabsContainer {
    position: relative;
    width: 100%;
    height: 360px
    }
.modalLeftSide, .modalRightSide {
    position: absolute;
    top: 38px;
    width: 16px;
    height: 321px
    }
.modalLeftSide {
    left: -16px;
    border-right: 1px solid #ccc
    }
.modalRightSide {
    right: -16px;
    border-left: 1px solid #ccc
    }
.modalLeftArrow, .modalRightArrow {
    position: absolute;
    top: 45%;
    width: 17px;
    height: 46px;
    cursor: pointer
    }
.modalLeftArrow {
    right: -1px;
    background-image: url(../images/flecheGauche.jpg)
    }
.modalRightArrow {
    left: -1px;
    background-image: url(../images/flecheDroite.jpg)
    }
.modalLeftArrow:hover, .modalRightArrow:hover {
    background-position: bottom
    }
.inscriptionTab {
    position: relative;
    margin: 20px 44px 0 44px;
    height: 320px
    }
.inscriptionColumnPreference {
    position: relative;
    float: left;
    width: 166px;
    margin-right: 20px;
    height: 320px;
    overflow: hidden
    }
.inscriptionColumnPreference.last {
    margin-right: 0
    }
.inscriptionColumn {
    position: relative;
    float: left;
    width: 333px;
    margin-right: 39px;
    height: 320px;
    overflow: hidden
    }
.inscriptionColumn.last {
    margin-right: 0
    }
.inscriptionPhoto {
    float: left;
    width: 164px;
    height: 307px;
    border: 1px solid #ccc;
    overflow: hidden
    }
.inscriptionRequired, .inscriptionDisciplines, .inscriptionSectors {
    font-size: 12px;
    line-height: 12px;
    color: #e32c43;
    font-weight: bold
    }
.inscriptionSectors {
    position: absolute;
    left: 186px;
    color: #737373
    }
.inscriptionDisciplines {
    position: absolute
    }
.inscriptionPrefsScroller {
    position: absolute;
    top: 16px;
    width: 558px;
    height: 304px;
    overflow: auto
    }
.inscriptionPrefsScroller .inscriptionColumn {
    height: auto
    }
.inscriptionLabel, .inscriptionText, .inscriptionSelect, .inscriptionRadios, .inscriptionPhone {
    position: relative
    }
.inscriptionLabel {
    font-size: 10px;
    line-height: 10px
    }
.inscriptionText, .inscriptionSelect, .inscriptionPhone input {
    border: 1px solid #ccc;
    background-color: #fff
    }
.inscriptionText {
    font-size: 11px;
    height: 15px;
    width: 278px
    }
.inscriptionSelect {
    font-size: 9px;
    height: 17px;
    width: 166px
    }
.inscriptionText[disabled="disabled"] {
    background-color: #fff;
    border: 1px solid #fff;
    color: #000
    }
.inscriptionRadios {
    font-size: 10px;
    line-height: 14px
    }
.inscriptionRadios input {
    vertical-align: top
    }
.inscriptionPhone input {
    font-size: 11px;
    height: 15px
    }
.inscriptionPhone input[maxlength="3"] {
    width: 20px
    }
.inscriptionPhone input[maxlength="4"] {
    width: 27px
    }
#inscriptionTabPrefs {
    line-height: 18px;
    font-size: 10px
    }
input[type=checkbox] {
    height: 16px;
    vertical-align: middle
    }
.inscriptionDisciplines, .inscriptionSectors {
    margin-bottom: 5px
    }
#inscriptionSectorSeparator {
    position: absolute;
    top: 16px;
    left: 178px;
    width: 1px;
    height: 304px;
    border-left: 1px solid #ccc
    }
#inscriptionInfoLettreTxt {
    position: relative;
    margin-bottom: 30px
    }
#inscriptionInfoLettreImg {
    position: relative;
    float: left;
    width: 280px;
    height: 230px;
    background-image: url(../images/apercuInfolettre.jpg)
    }
#inscriptionInfoLettre {
    position: relative;
    float: left;
    margin-left: 35px;
    width: 223px
    }
#inscriptionInfoLettreWarning {
    margin-top: 15px;
    clear: both;
    color: #f00
    }
.inscriptionErrorRequired, .inscriptionErrorInvalid, .inscriptionErrorExisting {
    color: red
    }
.hidden {
    display: none
    }
/* ====================  WELCOME PAGE  ==================== */
#welcomePage {
    position: relative;
    top: 24px;
    left: 26px;
    width: 708px
    }
#welcomePage h1, #welcomePage h2 {
    color: red;
    margin-bottom: 10px
    }
#welcomePage h1 {
    font-size: 24px;
    line-height: 24px
    }
#welcomePage h2 {
    font-size: 16px;
    line-height: 16px
    }
#welcomePage img {
    float: right;
    border: 1px solid #ccc
    }
#welcomePage p {
    font-size: 12px;
    line-height: 15px;
    width: 393px;
    text-align: justify;
    margin-bottom: 1em
    }
#welcomePage p.last {
    margin-bottom: 24px
    }
/* ====================  LOGIN REMINDER  ==================== */
#loginReminderBG {
    z-index: 1000
    }
#loginReminderBox {
    position: absolute;
    left: 50%;
    top: 270px;
    width: 215px;
    margin-left: 45px;
    border: 1px solid #666;
    background-color: #fff;
    z-index: 1001
    }
#loginReminderContent {
    margin: 10px 15px;
    line-height: 14px
    }
#loginReminderClose {
    margin: 0 15px 10px 15px;
    height: 18px
    }
#loginReminderPointer {
    position: absolute;
    top: 300px;
    left: 50%;
    width: 16px;
    height: 31px;
    margin-left: 261px;
    background-image: url(../images/pointer.gif);
    z-index: 1001
    }
/* ====================  WELCOME POPUP  ==================== */
#welcomePopup {
    display: none
    }
.welcomePopup {
    position: relative;
    width: 625px;
    height: 290px
    }
.welcomePopupHeader {
    position: relative;
    width: 483px;
    height: 36px;
    font: normal normal 26px/35px Helvetica, Arial;
    color: #C2C2C2;
    text-transform: uppercase
    }
.welcomePopupHeader span {
    color: #e22c43
    }
/*
.welcomePopupHeader.FR { background-image: url("../images/FR/modalConfirmationHeader.jpg"); }
.welcomePopupHeader.EN { background-image: url("../images/EN/modalConfirmationHeader.jpg"); }
*/
.welcomePopupLeft, .welcomePopupRight {
    position: absolute;
    top: 70px;
    width: 15px;
    height: 163px
    }
.welcomePopupLeft {
    left: 0;
    background-image: url(../images/modalConfirmationLeft.jpg)
    }
.welcomePopupRight {
    right: 0;
    background-image: url(../images/modalConfirmationRight.jpg)
    }
.welcomePopupContent {
    position: relative;
    margin: 45px;
    height: 140px
    }
.welcomePopupContent p {
    margin-bottom: 1em
    }
.welcomePopupFooter {
    position: relative;
    border-top: 1px solid #ccc;
    padding-top: 8px;
    height: 18px
    }
#homePage {
    position: absolute;
    top: 32px;
    width: 754px;
    height: 625px;
    overflow: auto
    }
#homePage h1 {
    margin: 20px 10px 0 27px
    }
#homePage p {
    margin: 0 0 59px 27px
    }