/**
*
* @file Habillage CSS pour le slideshow principal en bandeau de la
* page d'accueil
*
* @autor Synchro - Fabrice Fioriti
*
*/

@media screen and (min-width: 1025px) {
    .masque-bleu {
        display: block;
        width: 970px;
        height: 251px;
        background: url(../img/BANDEAU-NEUTRE-SS-TXT.png) no-repeat;
        position: absolute;
        z-index: 40;
        top: 0;
    }

    .list-slideshow {
        position: absolute;
        top: 0;
        right: 15px;
        z-index: 41;
        color: #fff
    }

    .list-slideshow a {
        color: #fff;
        font-size: 12px
    }

    .list-slideshow a:hover {
        text-decoration: underline
    }

    .list-slideshow ul {
        margin-top: 20px;
        list-style-type: none;
    }

    .list-slideshow ul li {
        background: url("../img/PUCE.png") no-repeat scroll left top transparent;
        height: 35px;
        list-style-type: none;
        margin-bottom: 5px;
        padding-left: 25px
    }

    .list-slideshow {
        width: 220px;
        font-size: 12px
    }

    .list-slideshow li {
        position: relative
    }

    /* Positionnement des puces une par une */
    .list-slideshow .item-0 {
        left: 15px;
    }

    .list-slideshow .item-1 {
        left: 10px;
    }

    .list-slideshow .item-2 {
        left: 2px;
    }

    .list-slideshow .item-4 {
        left: -24px;
    }

    .list-slideshow .item-3 {
        left: -8px;
    }

    .list-slideshow .item-5 {
        left: -42px;
    }

    /* Affichage d'un masque de préchargement des images */
    .cont-preload {
        width: 960px;
        height: 251px;
        position: absolute;
        top: 0;
        left: 5px;
        background: #0C2D5F url(../img/loader.gif) no-repeat center center;
        z-index: 100;
        display: block;
    }

    .bandeau-accueil {
        position: relative
    }

    #block-views-slideshow-block .block-inner {
        height: 251px;
        width: 970px;
        background: #0C2D5F;
    }

    /* Positionnement du titre du slide show */
    .bandeau-accueil .view-header {
        position: absolute;
        color: #ffffff;
        display: block;
        font-size: 32px;
        left: 15px;
        top: 200px;
        z-index: 10;
        text-shadow: 0 4px 2px #000;
        font-family: inherit;
        font-weight: bold
    }

    /* Couleur des liens actifs en blanc */
    .bandeau-accueil li a.active {
        color: #fff;
    }
}
@media only screen and (max-width: 1025px) {
    .list-slideshow {
        background: #0c2d5f;
        color: #ffffff;
        padding-top: 2em;
        margin-top: -1em;
    }

    .list-slideshow a {
        color: #ffffff;
    }

    .list-slideshow ul li {
        background: url(../img/PUCE.png) no-repeat scroll left top transparent;
        height: 35px;
        list-style-type: none;
        margin-bottom: 5px;
        padding-left: 25px;
    }

    .views-slideshow-cycle-main-frame {
        height: auto;
    }
}

@media only screen and (min-width:750px) and (max-width:1025px) {

    #block-views-slideshow-block {
        overflow: hidden;
        width: 100%;
        margin: 0;
        background-color: #0c2d5f;
    }

    #block-views-slideshow-block .block-inner {

    }

    .bandeau-accueil {
        position: relative;
        max-width: 959px;
        min-height: 256px!important;
    }
    .bandeau-accueil .view-header {
        position: absolute;
        color: #ffffff;
        display: block;
        font-size: 32px;
        left: 15px;
        top: 200px;
        z-index: 10;
        text-shadow: 0 4px 2px #000;
        font-family: inherit;
        font-weight: bold
    }

    .masque-bleu {
        display: block;
        background: url(../img/BANDEAU-NEUTRE-SS-TXT.png) no-repeat right bottom;
        position: absolute;
        z-index: 40;
        top: -5px;
        width: 100%;
        height: 100%;
    }

    .list-slideshow {
        position: absolute;
        top: 0;
        right: 23px;
        z-index: 41;
        color: #fff;
        background: transparent;
    }

    .list-slideshow li {
        position: relative
    }

    /* Positionnement des puces une par une */
    .list-slideshow .item-0 {
        left: 15px;
    }

    .list-slideshow .item-1 {
        left: 10px;
    }

    .list-slideshow .item-2 {
        left: 2px;
    }

    .list-slideshow .item-4 {
        left: -24px;
    }

    .list-slideshow .item-3 {
        left: -8px;
    }

    .list-slideshow .item-5 {
        left: -42px;
    }
}

@media only screen and (max-width:749px) {
    #block-views-slideshow-block {
        overflow: hidden;
        width: 100%;
        margin: 0;
        background-color: #0c2d5f;
        min-height: 257px!important;
    }

    .masque-bleu {
        display: none;
        background: url(../img/BANDEAU-NEUTRE-SS-TXT.png) no-repeat right bottom;
    }

    .view-slideshow .view-content {
        position: relative;
        overflow: hidden;
    }

    .sl-right {
        position: absolute;
        height: 100%;
        width: 81px;
        left: 0;
        top: 0;
        z-index: 90;
        background: url(../img/sl-left.png) no-repeat left bottom;
    }

    .sl-left {
        position: absolute;
        height: 100%;
        width: 81px;
        right: 0;
        top: 0;
        z-index: 90;
        background: url(../img/sl-right.png) no-repeat right top;
    }
}

@media only screen and (min-width:659px) and (max-width:751px) {
    .sl-left {
        position: absolute;
        height: 100%;
        width: 81px;
        right: 0;
        top: 0;
        z-index: 90;
        background: url(../img/sl-right.png) no-repeat right bottom;
    }
}
