/**
 * @title       GUI Styles
 * @tree        body
 */


/**
 * @section        studiesBox (Derniere etude publiee)
 * @tree           #sidebar < #core < #wrapper < body
 */
.studiesBox {
    width:258px;
    margin-bottom:10px; padding:8px 10px; border:1px solid #bebebe;
    background:#e7e7e7 url(/templates/ifop/images/common/bg/bg-scrolled-box.png) repeat-x;
}
.studiesBox h3 {
    margin-bottom:0.7em; padding-bottom:0.5em; border-bottom:1px solid #bebebe;
    color:#903;
    font:bold 11px Arial, "Helvetica Neue", Helvetica, sans-serif;
    text-transform:uppercase;
}
.studiesBox .contentScrollable {
    padding-right:15px;
    height:326px;
    overflow:auto;
}

/* l'élément de base est stylé différemment si JS dispo
   overflow:hidden et dimensions sont obligatoires */
#js .studiesBox .contentScrollable {
  position:relative;
  overflow:hidden;
  border:none;
  width:243px; height:405px;
}

/* styles de l'élément inséré en JS, avec scroll actif ou non */
#js .studiesBox .contentScrollable .scrolled, #js .studiesBox .contentScrollable .notScrolled {
  padding:5px 0 1px 5px;
  width:240px;
}
/* quand le scroll est actif, l'élément doit être positionné en absolu */
#js .studiesBox .contentScrollable .scrolled {
  position:absolute; top:0; left:0;
}


/* styles du conteneur de la scrollbar */
#js .studiesBox .contentScrollable .scrollbar {
  position:absolute; top:1px; left:242px;
  width:15px; height:405px;
}

/* styles de la gouttière de l'ascenceur : la hauteur est primordiale ! */
#js .studiesBox .contentScrollable .gutter {
  position:absolute; top:17px; left:0;
  width:15px; height:370px;
}

/* styles de l'ascenceur, positionnée obligatoirement en absolu 
   il est recommendé d'utiliser un overflow:hidden pour IE */
#js .studiesBox .contentScrollable .bar {
  position:absolute; top:0; left:0;
  overflow:hidden;
  width:15px;
  background:url(/templates/ifop/images/common/scrollbar.png) repeat-y;
}
#js .studiesBox .contentScrollable .bar .start, #js .studiesBox .contentScrollable .bar .end {
  position:absolute; left:0;
  overflow:hidden;
  width:15px; height:1px;
  background:url(/templates/ifop/images/common/scrollbar.png) repeat-y;
}
#js .studiesBox .contentScrollable .bar .start {
  top:0;
  background-position:-15px 0;
}
#js .studiesBox .contentScrollable .bar .end {
  bottom:0;
  background-position:-15px -15px;
}

/* styles des boutons */
#js .studiesBox .contentScrollable .prev, #js .studiesBox .contentScrollable .next {
  position:absolute; left:0;
  overflow:hidden;
  width:15px; height:15px;
  background:url(/templates/ifop/images/common/scrollbar.png) no-repeat;
}
#js .studiesBox .contentScrollable .prev {
  top:0;
  background-position:-30px 0;
}
#js .studiesBox .contentScrollable .next {
  top:389px;
  background-position:-45px 0;
}
.studiesBox .study {
    margin-bottom:0.5em; padding:0.5em 0; border-bottom:1px solid #bebebe;
    width:230px;
    font:normal 11px Arial, "Helvetica Neue", Helvetica, sans-serif;
}
.studiesBox .study h4 {
    margin-bottom:0;
    font-weight:bold; font-size:11px;
    text-transform:uppercase;
}
.studiesBox a.more {
    padding-left:8px;
    font-size:11px; font-weight:bold;
    text-decoration:none;
}
.studiesBox a.more:hover {
    text-decoration:underline;
}
.studiesBox .study h5 {
    margin-bottom:0;
    font-style:italic; font-size:10px;
    text-transform:uppercase;
}
.studiesBox .study .date {
    display:block;
    color:#666;
    font-size:10px;
    text-transform:uppercase;
}
.studiesBox .study .source {
    display:block;
    color:#666;
    font-size:10px;
    text-transform:uppercase;
}
.studiesBox .study .category {
    display:block;
    font-size:9px;
    text-transform:uppercase;
}
.studiesBox .services h4, .studiesBox .services h5, .studiesBox .services a, .studiesBox .services .category {
    color:#f15a24;
}
.studiesBox .health h4, .studiesBox .health h5, .studiesBox .health a, .studiesBox .health .category {
    color:#d414ac;
}
.studiesBox .consumer h4, .studiesBox .consumer h5, .studiesBox .consumer a, .studiesBox .consumer .category {
    color:#90cf38;
}
.studiesBox .opinion h4, .studiesBox .opinion h5, .studiesBox .opinion a, .studiesBox .opinion .category {
    color:#0071bc;
}
.studiesBox .media h4, .studiesBox .media h5, .studiesBox .media a, .studiesBox .media .category {
    color:#662d91;
}
.studiesBox .luxury h4, .studiesBox .luxury h5, .studiesBox .luxury a, .studiesBox .luxury .category {
    color:#eca806;
}
.studiesBox .services a.more {
    color:#666;
    background:url(/templates/ifop/images/common/arrow-grey.png) no-repeat 0 0.4em;
}
.studiesBox .health a.more {
    color:#666;
    background:url(/templates/ifop/images/common/arrow-grey.png) no-repeat 0 0.4em;
}
.studiesBox .consumer a.more {
    color:#666;
    background:url(/templates/ifop/images/common/arrow-grey.png) no-repeat 0 0.4em;
}
.studiesBox .opinion a.more {
    color:#666;
    background:url(/templates/ifop/images/common/arrow-grey.png) no-repeat 0 0.4em;
}
.studiesBox .media a.more {
    color:#666;
    background:url(/templates/ifop/images/common/arrow-grey.png) no-repeat 0 0.4em;
}
.studiesBox .luxury a.more {
    color:#666;
    background:url(/templates/ifop/images/common/arrow-grey.png) no-repeat 0 0.4em;
}

/**
 * @section        releases most viewd
 * @tree           .releasesMostViewedBox < #sidebar < #core < #wrapper < body
 */
.releasesMostViewedBox {
    width:258px;
    margin-bottom:10px; padding:8px 10px; border:1px solid #bebebe;
    background:#e7e7e7 url(/templates/ifop/images/common/bg/bg-scrolled-box.png) repeat-x;
}
.releasesMostViewedBox h3 {
    margin-bottom:0.7em; padding-bottom:0.5em; border-bottom:1px solid #bebebe;
    color:#903;
    font:bold 11px Arial, "Helvetica Neue", Helvetica, sans-serif;
    text-transform:uppercase;
}
.releasesMostViewedBox .releasesScrollable {
    padding-right:15px;
    height:326px;
    overflow:auto;
}

/* l'élément de base est stylé différemment si JS dispo
   overflow:hidden et dimensions sont obligatoires */
#js .releasesMostViewedBox .releasesScrollable {
  position:relative;
  overflow:hidden;
  border:none;
  width:243px; height:346px;
}

/* styles de l'élément inséré en JS, avec scroll actif ou non */
#js .releasesMostViewedBox .releasesScrollable .scrolled, #js .releasesMostViewedBox .releasesScrollable .notScrolled {
  padding:5px 0 1px 5px;
  width:240px;
}
/* quand le scroll est actif, l'élément doit être positionné en absolu */
#js .releasesMostViewedBox .releasesScrollable .scrolled {
  position:absolute; top:0; left:0;
}


/* styles du conteneur de la scrollbar */
#js .releasesMostViewedBox .releasesScrollable .scrollbar {
  position:absolute; top:1px; left:242px;
  width:15px; height:346px;
}

/* styles de la gouttière de l'ascenceur : la hauteur est primordiale ! */
#js .releasesMostViewedBox .releasesScrollable .gutter {
  position:absolute; top:17px; left:0;
  width:15px; height:311px;
}

/* styles de l'ascenceur, positionnée obligatoirement en absolu 
   il est recommendé d'utiliser un overflow:hidden pour IE */
#js .releasesMostViewedBox .releasesScrollable .bar {
  position:absolute; top:0; left:0;
  overflow:hidden;
  width:15px;
  background:url(/templates/ifop/images/common/scrollbar.png) repeat-y;
}
#js .releasesMostViewedBox .releasesScrollable .bar .start, #js .releasesMostViewedBox .releasesScrollable .bar .end {
  position:absolute; left:0;
  overflow:hidden;
  width:15px; height:1px;
  background:url(/templates/ifop/images/common/scrollbar.png) repeat-y;
}
#js .releasesMostViewedBox .releasesScrollable .bar .start {
  top:0;
  background-position:-15px 0;
}
#js .releasesMostViewedBox .releasesScrollable .bar .end {
  bottom:0;
  background-position:-15px -15px;
}

/* styles des boutons */
#js .releasesMostViewedBox .releasesScrollable .prev, #js .releasesMostViewedBox .releasesScrollable .next {
  position:absolute; left:0;
  overflow:hidden;
  width:15px; height:15px;
  background:url(/templates/ifop/images/common/scrollbar.png) no-repeat;
}
#js .releasesMostViewedBox .releasesScrollable .prev {
  top:0;
  background-position:-30px 0;
}
#js .releasesMostViewedBox .releasesScrollable .next {
  top:330px;
  background-position:-45px 0;
}
.releasesMostViewedBox .release {
    margin-bottom:0.5em; padding:0.5em 0; border-bottom:1px solid #bebebe;
    width:230px;
    font:normal 11px Arial, "Helvetica Neue", Helvetica, sans-serif;
}
.releasesMostViewedBox .release h4 {
    margin-bottom:0;
    font-weight:bold; font-size:11px;
    text-transform:uppercase;
}
.releasesMostViewedBox a.more {
    padding-left:8px;
    font-size:11px; font-weight:bold;
    text-decoration:none;
}
.releasesMostViewedBox a.more:hover {
    text-decoration:underline;
}

.releasesMostViewedBox .release .date {
    display:block;
    font-size:10px;
    text-transform:uppercase;
}

/**
 * @section     News list
 * @tree        #main < #core < #wrapper < body
 */
#newsList {
    margin-bottom:10px; padding:8px 10px; border:1px solid #bebebe;
    width:538px;
}
#newsList .newsScrollable {
    padding-right:15px;
    height:500px;
    overflow:auto;
}
#newsList .news {
    overflow:hidden;
    margin-bottom:10px; padding-bottom:10px; border-bottom:1px solid #bebebe;
}
#newsList .last {
    border-bottom:0;
}
#newsList .news .pressType {
    display:block;
    padding-bottom:.3em;
    font:bold 12px Arial, "Helvetica Neue", Helvetica, sans-serif;
    text-transform:uppercase; text-decoration:none;
}
#newsList .news h4 {
    font-size:11px;
}
#newsList .news .date {
    padding-bottom:.3em;
    font-weight:bold;
}
#newsList .news .more {
    float:right;
}
#newsList .news p {
    line-height:1.2;
}
/* l'élément de base est stylé différemment si JS dispo
   overflow:hidden et dimensions sont obligatoires */
#js #newsList .newsScrollable {
  position:relative;
  overflow:hidden;
  border:none;
  width:535px; height:500px;
}

/* styles de l'élément inséré en JS, avec scroll actif ou non */
#js #newsList .newsScrollable .scrolled, #js #newsList .newsScrollable .notScrolled {
  padding:5px 0 1px 5px;
  width:510px;
}
/* quand le scroll est actif, l'élément doit être positionné en absolu */
#js #newsList .newsScrollable .scrolled {
  position:absolute; top:0; left:0;
}


/* styles du conteneur de la scrollbar */
#js #newsList .newsScrollable .scrollbar {
  position:absolute; top:1px; left:525px;
  width:15px; height:500px;
}

/* styles de la gouttière de l'ascenceur : la hauteur est primordiale ! */
#js #newsList .newsScrollable .gutter {
  position:absolute; top:17px; left:0;
  width:15px; height:465px;
}

/* styles de l'ascenceur, positionnée obligatoirement en absolu 
   il est recommendé d'utiliser un overflow:hidden pour IE */
#js #newsList .newsScrollable .bar {
  position:absolute; top:0; left:0;
  overflow:hidden;
  width:15px;
  background:url(/templates/ifop/images/common/scrollbar.png) repeat-y;
}
#js #newsList .newsScrollable .bar .start, #js .studiesBox .contentScrollable .bar .end {
  position:absolute; left:0;
  overflow:hidden;
  width:15px; height:1px;
  background:url(/templates/ifop/images/common/scrollbar.png) repeat-y;
}
#js #newsList .newsScrollable .bar .start {
  top:0;
  background-position:-15px 0;
}
#js #newsList .newsScrollable .bar .end {
  bottom:0;
  background-position:-15px -15px;
}

/* styles des boutons */
#js #newsList .newsScrollable .prev, #js #newsList .newsScrollable .next {
  position:absolute; left:0;
  overflow:hidden;
  width:15px; height:15px;
  background:url(/templates/ifop/images/common/scrollbar.png) no-repeat;
}
#js #newsList .newsScrollable .prev {
  top:0;
  background-position:-30px 0;
}
#js #newsList .newsScrollable .next {
  top:485px;
  background-position:-45px 0;
}



/**
 * @section        jobsBox
 * @tree           #sidebar < #core < #wrapper < body
 */
.jobsBox {
    width:258px;
    margin-bottom:10px; padding:8px 10px; border:1px solid #bebebe;
    background:#e7e7e7 url(/templates/ifop/images/common/bg/bg-scrolled-box.png) repeat-x;
}
.jobsBox h3 {
    margin-bottom:0.7em; padding-bottom:0.5em; border-bottom:1px solid #bebebe;
    color:#903;
    font:bold 11px Arial, "Helvetica Neue", Helvetica, sans-serif;
    text-transform:uppercase;
}
.jobsBox .jobsScrollable {
    padding-right:15px;
    height:326px;
    overflow:auto;
}

/* l'élément de base est stylé différemment si JS dispo
   overflow:hidden et dimensions sont obligatoires */
#js .jobsBox .jobsScrollable {
  position:relative;
  overflow:hidden;
  border:none;
  width:243px; height:405px;
}

/* styles de l'élément inséré en JS, avec scroll actif ou non */
#js .jobsBox .jobsScrollable .scrolled, #js .jobsBox .jobsScrollable .notScrolled {
  padding:5px 0 1px 5px;
  width:240px;
}
/* quand le scroll est actif, l'élément doit être positionné en absolu */
#js .jobsBox .jobsScrollable .scrolled {
  position:absolute; top:0; left:0;
}


/* styles du conteneur de la scrollbar */
#js .jobsBox .jobsScrollable .scrollbar {
  position:absolute; top:1px; left:242px;
  width:15px; height:405px;
}

/* styles de la gouttière de l'ascenceur : la hauteur est primordiale ! */
#js .jobsBox .jobsScrollable .gutter {
  position:absolute; top:17px; left:0;
  width:15px; height:370px;
}

/* styles de l'ascenceur, positionnée obligatoirement en absolu 
   il est recommendé d'utiliser un overflow:hidden pour IE */
#js .jobsBox .jobsScrollable .bar {
  position:absolute; top:0; left:0;
  overflow:hidden;
  width:15px;
  background:url(/templates/ifop/images/common/scrollbar.png) repeat-y;
}
#js .jobsBox .jobsScrollable .bar .start, #js .jobsBox .jobsScrollable .bar .end {
  position:absolute; left:0;
  overflow:hidden;
  width:15px; height:1px;
  background:url(/templates/ifop/images/common/scrollbar.png) repeat-y;
}
#js .jobsBox .jobsScrollable .bar .start {
  top:0;
  background-position:-15px 0;
}
#js .jobsBox .jobsScrollable .bar .end {
  bottom:0;
  background-position:-15px -15px;
}

/* styles des boutons */
#js .jobsBox .jobsScrollable .prev, #js .jobsBox .jobsScrollable .next {
  position:absolute; left:0;
  overflow:hidden;
  width:15px; height:15px;
  background:url(/templates/ifop/images/common/scrollbar.png) no-repeat;
}
#js .jobsBox .jobsScrollable .prev {
  top:0;
  background-position:-30px 0;
}
#js .jobsBox .jobsScrollable .next {
  top:389px;
  background-position:-45px 0;
}
.jobsBox .job {
    margin-bottom:0.5em; padding:0 0 .5em 0; border-bottom:1px solid #bebebe;
    width:230px;
    font:normal 11px Arial, "Helvetica Neue", Helvetica, sans-serif;
}
.jobsBox .job h4 {
    margin-bottom:0;
    font-weight:bold; font-size:11px;
    text-transform:uppercase;
}
.jobsBox a.more {
    padding-left:8px;
    font-size:11px; font-weight:bold;
    text-decoration:none;
}
.jobsBox a.more:hover {
    text-decoration:underline;
}
.jobsBox .job .date {
    display:block;
    color:#666;
    font-size:11px;
    text-transform:uppercase;
}
.jobsBox .job .place {
    display:block;
    color:#666;
    font-size:11px; font-weight:bold;
}
.jobsBox .job .contract {
    display:block;
    color:#666;
    font-size:11px; font-weight:bold; font-style:italic;
}

/**
 * @section        Carousel (box carrousel)
 * @tree           #core < #wrapper < body
 */
#core .carousel {
    position:relative;
    z-index:2;
}
#sidebar .carousel {
    width:257px;
}
#core #carouselStudiesSubscription  h3 {
    margin-bottom:0; padding-bottom:.4em; border:none;
    font:bold 12px Arial, "Helvetica Neue", Helvetica, sans-serif;
}
#core #carouselStudiesSubscription  li .more {
    bottom:0;
}
#schedule .carousel h4 {
    color:#666;
    text-transform:uppercase;
}
#core .carousel h5 {
    margin-bottom:0;
}
#core .carousel p {
    padding-bottom:0;
}
#core .carousel ul {
  margin:0; padding:0;
  list-style:none;
}
#core .carousel li {
    position:relative;
    float:left;
    overflow:hidden;
    margin:0 10px 0 0; padding:0;
    width:282px; height:70px;
    background:none;
    text-indent:0;
}
#core #sidebar .carousel li {
    position:relative;
    width:257px; height:112px;
}
#core .wideContent .colContextual .carousel li {
    position:relative;
    width:215px;
}

#js .carousel {
  position:relative; /*référence pour positionner les boutons*/
}
#js .carouselInner {
    position:relative; /*ancrage pour l'objet à déplacer*/
    overflow:hidden; /*pour masquer les items en trop*/
    margin:0 auto;
    width:282px;  height:80px;
}
#js #sidebar .carouselInner {
    width:257px; height:112px;
}
#js .wideContent .colContextual .carouselInner {
    width:215px;
}
#js .carousel ul {
    position:absolute; top:0; left:0; /*objet à déplacer, positionnement primordial*/
}
#js .carousel .prev, #js .carousel .next {
    position:absolute; top:-25px;
    overflow:hidden;
    padding-top:12px;
    width:7px; height:0;
    outline:none;
}
#js .carousel .prev {
    right:20px;
    background:url(/templates/ifop/images/common/arrow-prev-on.png) no-repeat 0 0;
}
#js .carousel .next {
    right:0;
    background:url(/templates/ifop/images/common/arrow-next-on.png) no-repeat 0 0;
}
#js .carousel .prev.off {
    background:url(/templates/ifop/images/common/arrow-prev-off.png) no-repeat;
    cursor:default;
}
#js .carousel .next.off {
    background:url(/templates/ifop/images/common/arrow-next-off.png) no-repeat;
    cursor:default;
}

/**
 * @section        Expertness
 * @tree           #body < #main < #core < #wrapper < body
 */
#body #expertness {
    clear:both;
    width:560px; height:160px;
    overflow:hidden;
}
#body #expertness h2 {
    margin-bottom:7px; padding:0 10px;
    height:26px;
    background-color:#903; color:#fff;
    font:bold 14px Garamond, "Hoefler Text", "Times New Roman", Times, serif;
    line-height:26px;
}
#body #expertness h3 {
    position:relative;
    margin-bottom:5px; padding:0 30px 0 0; border-bottom:1px solid #bebebe;
    height:46px;
    color:#903; 
    background-repeat:no-repeat; background-position:95% 50%;
    font:bold 11px Garamond, "Hoefler Text", "Times New Roman", Times, serif;
    text-transform:uppercase;
}
#body #expertness h3 a {
    position:absolute; bottom:9px;
    display:block;
    width:120px;
    color:#903;
    font:bold 11px Garamond, "Hoefler Text", "Times New Roman", Times, serif;
    text-transform:uppercase;
}
#expertness h3.opinion {
    background-image:url(/templates/ifop/images/common/pictos/picto-opinion.png) ;
}
#expertness h3.omnibus {
    background-image:url(/templates/ifop/images/common/pictos/picto-omnibus.png) ;
}
#expertness h3.strategy {
    background-image:url(/templates/ifop/images/common/pictos/picto-strategy.png);
}
#expertness h3.tendency {
    background-image:url(/templates/ifop/images/common/pictos/picto-tendency.png);
}
#expertness h3.brand {
    background-image:url(/templates/ifop/images/common/pictos/picto-brand.png);
}
#expertness h3.product {
    background-image:url(/templates/ifop/images/common/pictos/picto-product.png);
}
#expertness h3.communication {
    background-image:url(/templates/ifop/images/common/pictos/picto-communication.png);
}
#expertness h3.customer {
    background-image:url(/templates/ifop/images/common/pictos/picto-customer.png);
}
#expertness h3.quality {
    background-image:url(/templates/ifop/images/common/pictos/picto-quality.png);
}
#expertness h3.panel {
    background-image:url(/templates/ifop/images/common/pictos/picto-panel.png);
}
#expertness h3.online {
    background-image:url(/templates/ifop/images/common/pictos/picto-online.png);
}
#expertness h3.phone {
    background-image:url(/templates/ifop/images/common/pictos/picto-phone.png);
}
#expertness h3.faceToFace {
    background-image:url(/templates/ifop/images/common/pictos/picto-face-to-face.png);
}
#expertness h3.quantity {
    background-image:url(/templates/ifop/images/common/pictos/picto-quantity.png);
}
#body #expertness li {
    position:relative;
    margin:0; padding:0 0 0 28px;
    width:150px; height:110px;
    text-indent:0;
}
#body #expertness p {
    color:#666;
    font:bold 10px Arial, "Helvetica Neue", Helvetica, sans-serif;
}
#body #expertness a.more {
    position:absolute; bottom:0; left:24px;
    background:url(/templates/ifop/images/common/arrow-red-bg-grey-8bits.png) no-repeat 0 0.4em;
}
#js #expertness .carouselInner {
    padding:0; border:1px solid #bebebe;
    width:558px; height:124px;
    background:#d9d9d9 url(/templates/ifop/images/common/bg/bg-box-expertness.png) repeat-x;
}
#js #expertness ul {
    position:absolute; top:0; left:0; /*objet à déplacer, positionnement primordial*/
}
#js #expertness .prev, #js #expertness .next {
    position:absolute; top:47px; z-index:3;
    overflow:hidden;
    padding-top:30px;
    width:13px; height:0;
    outline:none;
}
#js #expertness .prev {
    left:1px;
    background:url(/templates/ifop/images/common/arrow-expertness-prev-on.png) no-repeat 0 0;
}
#js #expertness .next {
    right:1px;
    background:url(/templates/ifop/images/common/arrow-expertness-next-on.png) no-repeat 0 0;
}
#js #expertness .prev.off {
    background:url(/templates/ifop/images/common/arrow-expertness-prev-off.png) no-repeat;
    cursor:default;
}
#js #expertness .next.off {
    background:url(/templates/ifop/images/common/arrow-expertness-next-off.png) no-repeat;
    cursor:default;
}

/**
 * @section     Carousel Partners
 * @tree        #partnersCarousel < .colContextual < #body < #main < #core.pageHome < #wrapper < body
 */
#partnersCarousel a.prev, #partnersCarousel a.next {
    display:none;
}
#core #partnersCarousel li {
    position:absolute;
    width:235px; height:80px;
    text-align:center;
}
#js #partnersCarousel .carouselInner {
    width:235px; height:80px;
}
#partnersCarousel a {
    display:table-cell;
    width:235px; height:80px;
    vertical-align:middle;
    text-decoration:none;
}
#partnersCarousel img {
    display:block;
    margin:0 auto;
}

/**
 * @section        searchBox
 * @tree           #sidebar < #core < #wrapper < body
 */
#searchBox {
    margin:0 0 10px -10px; padding:10px 10px 5px 20px;
    width:270px; height:45px;
    background-color:#565656;
}
#searchBox label {
    display:block;
    padding-bottom:5px;
    color:#fff;
    font:bold 14px Garamond, "Hoefler Text", "Times New Roman", Times, serif;
}
#searchBox #searchForm .text {
    float:left;
}
#searchBox #searchForm .text input {
    position:relative;
    padding:1px 2px 0 3px;
    width:225px; height:15px; 
}
#searchBox #searchForm .actions {
    float:left;
    padding-left:5px;
}
#searchBox #searchForm .actions input {
    position:relative;
}

/**
 * @section        tagsBox
 * @tree           #sidebar < #core < #wrapper < body
 */
#tagsBox {
    position:relative;
    margin-bottom:10px; padding:12px 14px; border:1px solid #bebebe;
    width:250px;
    background-color:#fff;
}
#tagsBox h3 {
    margin-bottom:0.7em; padding-bottom:0.5em; border-bottom:1px solid #bebebe;
    color:#903;
    font:bold 14px Garamond, "Hoefler Text", "Times New Roman", Times, serif;
    text-transform:uppercase;
}
#tagsBox a {
    float:left;
    padding-right:0.5em;
    font-weight:bold;
    line-height:18px;
    text-decoration:none; text-transform:uppercase;
}
#tagsBox a:hover {
    text-decoration:underline;
}

#tagsBox .weight1 {
    color:#9c3;
    font-size:9px;
}
#tagsBox .weight2 {
    color:#666;
    font-size:9px;
}
#tagsBox .weight3 {
    color:#6eabe2;
    font-size:10px;
}
#tagsBox .weight4 {
    color:#9c3;
    font-size:10px;
}
#tagsBox .weight5 {
    color:#99c;
    font-size:10px;
}
#tagsBox .weight6 {
    color:#007ccd;
    font-size:10px;
}
#tagsBox .weight7 {
    color:#f60;
    font-size:10px;
}
#tagsBox .weight8 {
    color:#007ccd;
    font-size:12px; font-family:Garamond, "Hoefler Text", "Times New Roman", Times, serif;
}
#tagsBox .weight9 {
    color:#fc3;
    font-size:14px; font-family:Garamond, "Hoefler Text", "Times New Roman", Times, serif;
}
#tagsBox .weight10 {
    color:#f60;
    font-size:14px; font-family:Garamond, "Hoefler Text", "Times New Roman", Times, serif;
}
#tagsBox .weight11 {
    color:#666;
    font-size:14px;
}
#tagsBox .weight12 {
    color:#9c3;
    font-size:14px;
}

/**
 * @section        Box Contact Sectors
 * @tree           .colContextual < #body < #main < #core < #wrapper < body
 */
#contacts {
    position:relative;
    margin:13px 0 10px; padding:5px; border:1px solid #bebebe;
    height:100px;
    background:#e2e2e2 url(/templates/ifop/images/common/bg/bg-box-contact.png) repeat-x;
    z-index:3;
}
#contacts dl {
    float:left;
}
#contacts dt {
    float:left;
    padding-left:4px;
}
#contacts dt.first {
    padding-left:0;
}
#contacts dt a {
    text-decoration:none;
    outline:none;
}
#contacts dd {
    position:absolute; top:60px; left:5px;
}
#contacts dd .contactDescription {
    float:left;
    width:170px;
}
#contacts dd .contactDescription h4 {
    margin:0; padding-left:10px;
    background:url(/templates/ifop/images/common/arrow-red-bg-grey-8bits.png) no-repeat 0 0.3em; color:#903;
    font:bold 12px Arial, "Helvetica Neue", Helvetica, sans-serif;
}
#contacts dd .contactMedia {
    float:left;
}
#contacts dd .contactMedia a {
    display:block;
    padding-left:25px;
    height:16px;
    color:#903;
    font:normal 9px Arial, "Helvetica Neue", Helvetica, sans-serif; font-style:italic;
    text-decoration:none; text-transform:uppercase;
}
#contacts dd .contactMedia a.email {
    background:url(/templates/ifop/images/common/pictos/picto-contact-email.png) no-repeat 0 0;
}
#contacts dd .contactMedia a.phone {
    background:url(/templates/ifop/images/common/pictos/picto-contact-phone.png) no-repeat 0 0;
}
#contacts .contactFormBox {
    position:absolute;top:110px;left:-1px;
    width:303px;
    border:1px solid #BEBEBE;border-top:0;
    background:#E2E2E2;
}
#contacts .contactFormBox #contactForm {
    min-height:153px;
    padding:0 5px 5px;
}
#contacts .contactFormBox #contactForm fieldset {
    border-top:1px solid #CCC;padding-top:10px;
}
.contactFormBox .text, .contactFormBox .radio, .contactFormBox .select {
    height:20px;
}
.contactFormBox .radio {
    padding:5px 0 14px;
    color:#903;
}
.contactFormBox .radio .label {
    float:left;
    width:66px;
    padding-left:7px;
    background:url(/templates/ifop/images/common/arrow-red-bg-grey-8bits.png) no-repeat 0 0.3em; color:#903;
    font-size:10px;
}
.contactFormBox .radio label {
    float:left;
    margin-right:2px;
    font-size:10px;
}
.contactFormBox .radio input {
    float:left;
    width:13px;height:13px;
    margin:2px 0; padding:0;
}
.contactFormBox .text label, .contactFormBox .select label {
    float:left;
    width:80px;
}
.contactFormBox .text input {
    float:left;
    border:1px solid #bebebe;
    width:190px; height:13px;
    font-size:11px;
}

.contactFormBox .selectHidden {
    position:absolute; left:-10000px;
}
 .contactFormBox .select select {
    float:left;
    border:1px solid #bebebe;
    width:200px; height:15px;
    font-size:11px;
}
.contactFormBox .select option {
    padding:2px; 
    font-size:11px;
}
.contactFormBox .actions {
    position:relative;
    margin-top:10px;
    height:30px;
}
.contactFormBox .actions input {
    float:right;
}
#contacts a.close {
    position:absolute; bottom:10px; left:10px;
}


/**
 * @section     Box publication subscription
 * @tree        #sidebar < #wrapper < body
 */
#publicationSubscription {
    overflow:hidden;
    margin-bottom:10px; padding:10px; border:1px solid #bebebe;
    width:258px; height:48px;
    background:#e8e8e8 url(/templates/ifop/images/common/bg/bg-box-publication-subscription.png) repeat-x;
}
#publicationSubscription label {
    display:block;
    padding-bottom:0.5em;
    color:#903;
    font:bold 11px Arial, "Helvetica Neue", Helvetica, sans-serif;
    text-transform:uppercase;
}
#publicationSubscription .text {
    float:left;
}
#publicationSubscription .text input {
    width:210px;
}
#publicationSubscription .actions {
    float:left;
    padding-left:5px;
}

/**
 * @section     Publication Preview
 * @tree        .publicationPreview < #body < #main < #core.pagePublicationHome < #wrapper < body
 */
#body .publicationPreview {
    position:relative;
    clear:left;
    overflow:hidden;
    margin-bottom:10px; padding:10px; border:1px solid #bebebe;
}

#body .publicationPreview h2 {
    margin-bottom:.3em; padding:0 60px .3em 0; border-bottom:1px solid #bebebe;
    height:auto;
    background-color:transparent; color:#903;
    font:bold 14px Arial, "Helvetica Neue", Helvetica, sans-serif;
    text-transform:uppercase;
}
#body .sector {
    font:bold 10px Arial, "Helvetica Neue", Helvetica, sans-serif;
    text-transform:uppercase;
}
#body .publicationPreview .date {
    position:absolute; top:24px; right:10px;
    width:62px;
    color:#903;
    font:normal 10px Arial, "Helvetica Neue", Helvetica, sans-serif;  
    text-align:right;
}
.moreContainer {
    height:15px;
    overflow:hidden;

}
#body .publicationPreview .more {
    float:right;
    display:block;
}
#body .publicationPreview p {
    padding-bottom:0;
}


/**
 * @section     pagination
 * @tree        #main < #core < #wrapper < body
 */
.pagination {
    clear:both;
    margin:0;
    font-size:9px;
    text-align:center;
}
.pagination img {
    display:inline;
}
.pagination ol {
    display:inline;
    margin:0 4px;
}
.pagination li {
    display:inline;
    padding:0 1px;
    font-size:11px;
}
.pagination li a {
    color:#565656;
    text-decoration:none;
}
.pagination li a:hover {
    color:#903;
    text-decoration:underline;
}
.pagination li strong {
    color:#903;
}
.pagination .all {
    margin-left:10px;
}

/**
 * @section        focus
 * @tree           #focus
 */
#focus {
    clear:both;
    background:#d9d9d9 url(/templates/ifop/images/common/bg/bg-analysis-box.png) no-repeat;
}
#focus h3 {text-transform:uppercase;}

/**
 * @section        Clearing
 */
#tagsBox:after, #contacts:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}