﻿/* -------------------------------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------------------------------- */
/* Contenu du fichier temporairement COPIÉ dans le fichier /_css/rc.web.root.layout.css */
/* Pour éviter un bug de IE qui ne compile pas les CSS après les 31 premiers fichiers */
/* ------------------ */
/* ------------------ */
/* Si vous faites des modifs ici:
/* IL FAUT ABSOLUMENT LES FAIRE AUSSI DANS /_css/rc.web.root.layout.css */
/* IL FAUT ABSOLUMENT LES FAIRE AUSSI DANS /_css/rc.web.root.layout.css */
/* IL FAUT ABSOLUMENT LES FAIRE AUSSI DANS /_css/rc.web.root.layout.css */
/* IL FAUT ABSOLUMENT LES FAIRE AUSSI DANS /_css/rc.web.root.layout.css */
/* IL FAUT ABSOLUMENT LES FAIRE AUSSI DANS /_css/rc.web.root.layout.css */
/* IL FAUT ABSOLUMENT LES FAIRE AUSSI DANS /_css/rc.web.root.layout.css */
/* IL FAUT ABSOLUMENT LES FAIRE AUSSI DANS /_css/rc.web.root.layout.css */
/* IL FAUT ABSOLUMENT LES FAIRE AUSSI DANS /_css/rc.web.root.layout.css */
/* -------------------------------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------------------------------- */

/* ------------------------------------ */
/* ---- >> BANDEAU VERS MOBILE << ----- */
/* ------------------------------------ */

#invitationMobile {
    height: 102px;
    background: url('/_img/background/background-bandeau-invitation-mobile.jpg') repeat-x;
    display: none;
    min-width: 990px;
}

#invitationMobile > a {
        margin: 0 auto;
        display: block;
        color: #fff;
        height: 85px;
        height: 85px;
        position: relative;
        text-align: center;
}

#invitationMobile > a .fleche {
            display: block;
            width: 82px;
            height: 84px;
            position: absolute;
            text-indent: -9000px;
            top: 9px;
}

#invitationMobile {
    display: block;
}

#invitationMobile > a {
        width: 540px;
        padding: 13px 110px 0px 110px;
        background: url('/_img/logo/logo-rc-bandeau-mobile.png') no-repeat 0px 9px;
        font-size: 37px;
        line-height: 37px;
        text-decoration: none;
}

#invitationMobile > a .petit {
            font-size: 30px;
            display: block;
}

#invitationMobile > a .fleche {
            background: url('/_img/button/button-fleche-invitation-mobile.png') no-repeat;
            right: 0px;
}


@media all and (orientation:landscape) {
    #invitationMobile {
        display: block;
    }

        #invitationMobile > a {
            width: 591px;
            padding: 37px 82px 0px 87px;
            background: url('/_img/logo/logo-rc-bandeau-mobile.png') no-repeat 0px 9px;
            font-size: 20px;
            line-height: 25px;
            white-space: nowrap;
            text-decoration: none;
    }

            #invitationMobile > a .petit {
                font-size: 16px;
                display: inline;
}

            #invitationMobile > a .fleche {
                background: url('/_img/button/button-fleche-invitation-mobile.png') no-repeat;
                right: 0px;
            }
}

/* -------------------------------- */
/* --------- >> SKIP NAV << ------- */
/* -------------------------------- */

a.src-skip-nav {
    color: transparent;
    height: 1px;
    overflow: hidden;
    position: absolute;
    width: 1px;
}

a.src-skip-nav:focus {
    background:white;
    color: #cc0000;
    display: block;
    font-size: 12px;    
    font-family:Arial,Helvetica,sans-serif;
    font-weight: bold !important;
    line-height: 14px;
    height: 24px;
    padding: 10px 0 0 15px;
    /*position: relative;*/
    text-decoration:none !important;
    width: 400px;
}

/* -------------------------------- */
/* --------- >> 
    Conteneurs sémantiques de HTML 5 
    << ------------ */
/* -------------------------------- */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block;
}

audio, canvas, video { 
    display: inline-block; 
    *display: inline; 
    *zoom: 1;
}

    audio:not([controls]) {
        display: none;
    }

[hidden] {
    display: none;
}

figure {
    margin: 0;
    position: relative;
}

/* -------------------------------- */
/* --------- >> NAV << ------------ */
/* -------------------------------- */

#src-header { 
    font-family: Rubrik;
    position: relative;
	z-index: 100;
}

/* À garder à cause du global_2.0.0.css des vieux sites, legacy, etc 
    pcq il y a un font-weight:bold; dans le global  
 */
    #src-header a {
        font-weight: normal;
    }

    #src-header nav li {
        list-style-type: none;
    }

/* -------------------------------- */
/* --------- >> NETWORK << --------- */
/* -------------------------------- */

#src-network {
    background: #fff;
    height: 46px;
    margin: 0 auto;
    width: 990px;
}

/* Logo ICI Radio-Canada*/
#src-nav-logo {
    background: url(/_img/logo/ici-radio-canada-ca.svg) left top no-repeat;
    display: block;
    float: left;
    height: 0;
    margin:3px 18px 3px 17px;
    padding-top: 40px;
    overflow: hidden;
    width: 240px;
}

    #src-nav-logo:focus {
        outline: 1px dotted black;
    }

/* Liste des chaînes */
#src-nav-network {
    float: left;
    margin: 15px 0 0 0;
}

#src-more-network a {
    color: #9a9999;
    font-size: 12px;
    line-height: 20px;
    position: relative;
    text-transform: uppercase;
}

#src-more-network a:hover,
#src-more-network a:focus {
    color: #000;
    text-decoration: none;
}

#src-more-network:hover > ul,
#src-more-network:focus > ul {
    display: block;
}

#src-more-network em {
    color: #bb1612;
    font-size: 20px;
    font-style: normal;
    line-height: 20px;
    vertical-align: middle;
}

#src-more-network ul {
    /*background: url(/_img/background/background-nav-network.png) center top no-repeat;*/
    background: #fff;
    display: none;
    padding: 4px 0;
    border: 1px solid #d2d2d2;
    position: absolute;
    width: 119px;
    margin-top: 10px;
    z-index: 1000;
    -webkit-box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.3);
    box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.3);
}

#src-more-network ul:before {
    content: url(/_img/background/bg-nav-chaines-arrow-up.svg);
    display: block;    
	width: 20px;
    padding-right: 70px; 
	height: 16px; /*6 image height + 10 margin*/
    position: absolute;
    top: -16px;
    left: 5px;
    line-height: 0;
        z-index: 2000;
}

#src-more-network li {
    border-top: 1px solid #d6d6d6;
    height: 24px;
    margin-left: 16px;
    text-align: center;
    width: 88px;
}

    #src-more-network li:first-child {
        border: none;
    }

 #src-more-network li a {
    background: url(/_img/logo/logo-nav-brand.jpg) left top no-repeat;
        color: #707070;
        display: inline-block;
        font-size: 11px;
        font-weight: bold;
        width: 88px;
        height: 0;
    padding-top: 24px;
        line-height: 24px;
        overflow: hidden;
}

 /* Tou.tv */
body #src-icon-toutv a {
    background-position: 0 0; 
}  

body #src-icon-toutv a:hover,
    body #src-icon-toutv a:focus {
        background-position: -88px 0;
    }

/* .mu */
/*body #src-icon-mu a {
    background-position: 0 -23px; 
    margin-top: 6px;
    padding-top: 12px;
    width: 26px;
}*/

body #src-icon-mu a {
    background-position: 0 -24px;
}

body #src-icon-mu a:hover,
    body #src-icon-mu a:focus {
        background-position: -88px -24px;
    }

/* Espace musique */
/*body #src-icon-espacemusique a {
    background-position: 0 -45px;
   
   
}

body #src-icon-espacemusique a:hover,
body #src-icon-espacemusique a:focus { background-position:-83px -45px; }*/

/* RDI */
body #src-icon-rdi a {
    background-position: 0 -48px; 
}

body #src-icon-rdi a:hover,
    body #src-icon-rdi a:focus {
        background-position: -88px -48px;
    }
    
/* RCI */                                  
body #src-icon-rci a { 
    background-position: 0 -120px; 
} 

body #src-icon-rci a:hover,
    body #src-icon-rci a:focus {
        background-position: -88px -120px;
    }

/* Artv */
body #src-icon-artv a { 
    background-position: 0 -72px; 
}

body #src-icon-artv a:hover,
    body #src-icon-artv a:focus {
        background-position: -88px -72px;
    }

/* Explora */
body #src-icon-explora a { 
    background-position: 0 -96px; 
}

body #src-icon-explora a:hover,
    body #src-icon-explora a:focus {
        background-position: -88px -96px;
    }

/* Jeunesse */
body #src-icon-jeunesse a { 
    background-position: 0 -144px; 
} 

body #src-icon-jeunesse a:hover,
    #src-icon-jeunesse a:focus {
        background-position: -88px -144px;
    }

/* CBC.ca */
body #src-cbc {
    background: none;
}

body #src-cbc a {
    background: none;
    height: 28px;
    padding: 4px 0 0 0;
}

body #src-cbc a:hover,
        body #src-cbc a:focus {
            text-decoration: none;
            color: #000;
}

/* Login */
#src-nav-login {
    float: right;
    font-size: 12px;
    margin-right: 15px;
}

#connected {
    margin-top: 18px;
}

#connected div {
        color: #000;
        display: inline;
        text-transform: uppercase;
}

#connected a {
    color: #9a9999;
    font-size: 11px;
    padding-left: 5px;
    text-transform: none;
}

#connected a:hover,
#connected a:focus { 
            color: #000;
            text-decoration: none;
}

#not-connected {
    margin-top: 12px;
}

#not-connected a {
    background: url(/_img/background/background-nav-login.gif) left center no-repeat;
    color: #9a9999;
    display: block;
    font-size: 12px;
    line-height: 11px;
    padding: 7px 0 0 21px;
    text-transform: uppercase;
}

#not-connected a:hover,
#not-connected a:focus { 
            color: #000;
            text-decoration: none;
}

/* -------------------------------- */
/* --------- >> UTIL << ----------- */
/* -------------------------------- */

#src-nav-util {
    background: #fff;
    border-bottom: 1px solid #dcdcdc;
    border-top: 1px solid #dcdcdc;
    clear: both;
    height: 24px;
    margin: 0 auto;
    width: 990px;
}

/* Méteo */
#src-nav-meteo {
    background: url(/_img/background/background-nav-meteo.gif) right center no-repeat;
    float: left;
    margin: 0 0 0 17px;
    padding: 0 9px 0 0;
}

    #src-nav-meteo strong {
        font-weight: normal;
    }

#src-nav-meteo a { 
        color: #757575;
        display: block;
        font-size: 14px;
        line-height: 25px;
}

#src-nav-meteo a:hover,
#src-nav-meteo a:focus { 
            color: #000;
            text-decoration: none;
}

 #src-nav-meteo img { 
        float: left;
}

/* Région */
#src-nav-edition-region {
    color: #000;
    float: left;
    font-size: 11px;
    line-height: 25px;
    margin-left: 7px;
    text-transform: uppercase;
}

    #src-nav-edition-region strong {
        font-weight: normal;
    }

#src-nav-edition-region a { 
    color: #9a9999;
        text-transform: none;
}

#src-nav-edition-region a:hover,
#src-nav-edition-region a:focus { 
            color: #000;
            text-decoration: none;
}

#src-nav-confirm-region {
    color: #000;
    float: left;
    font-size: 11px;
    line-height: 25px;
    margin-left: 31px;
}

    #src-nav-confirm-region a {
        color: #9a9999;
    }

#src-nav-confirm-region a:hover,
#src-nav-confirm-region a:focus { 
            color: #000;
            text-decoration: none;
}

/* Search */
#src-nav-search {
    background: #eeeeee; 
    float: right;
    margin-top: 1px;
}

#src-nav-search input[type=text] {
    background: #eeeeee;
    border: none;
    color: #1b1b1b;
    float: left;
    font-size: 11px;
    height: 22px;
    padding: 0 0 0 9px;
    width: 159px;
}

#src-nav-search input[type=text]:focus,
        #src-nav-search input[type=text]:hover {
            border: none;
        }

#src-nav-search input[type=submit] {
    background: #eeeeee url(/_img/button/button-nav-search.gif) left center no-repeat;
    border: none;
    cursor: pointer;
    float: left;
    height: 22px;
    padding: 0;
    width: 29px;
}

/* -------------------------------- */
/* --------- >> ZONE << ----------- */
/* -------------------------------- */

#src-nav-zone {
    background: #bc120e url(/_img/background/background-nav-zone.gif) center center no-repeat;
    border-bottom: 1px solid #cd2923;
    clear: both;
    height: 40px;

}

#src-nav-zone ul {
    margin: 0 auto;
    width: 990px;
}

#src-nav-zone ul li {
    float: left;
}

/* Info */
#src-info a {
    background: url(/_img/background/background-nav-info.gif) left -7px no-repeat;
    display: block;
    height: 0;
    overflow: hidden;
    padding-top: 40px;
    width: 329px;
}

#src-info a:hover,
    #src-info a:focus {
        background: url(/_img/background/background-nav-info.gif) left -65px no-repeat;
    }

    #src-info a.active {
        background: url(/_img/background/background-nav-info.gif) left -125px no-repeat;
    }

/* Télé */
#src-tele a {
    background: url(/_img/background/background-nav-tele.gif) left -7px no-repeat;
    display: block;
    height: 0;
    overflow: hidden;
    padding-top: 40px;
    width: 330px;
}

#src-tele a:hover,
    #src-tele a:focus {
        background: url(/_img/background/background-nav-tele.gif) left -65px no-repeat;
    }

    #src-tele a.active {
        background: url(/_img/background/background-nav-tele.gif) left -125px no-repeat;
    }

/* Première */
#src-premiere a {
    background: url(/_img/background/background-nav-premiere.gif) left -7px no-repeat;
    display: block;
    height: 0;
    overflow: hidden;
    padding-top: 40px;
    width: 330px;
}

#src-premiere a:hover,
    #src-premiere a:focus {
        background: url(/_img/background/background-nav-premiere.gif) left -65px no-repeat;
    }

    #src-premiere a.active {
        background: url(/_img/background/background-nav-premiere.gif) left -125px no-repeat;
    }

/* -------------------------------- */
/* --------- >> THÈMES << --------- */
/* -------------------------------- */

#src-nav-theme {
    background: #fff;
    border-bottom: 1px solid #dcdcdc;
    border-top: 1px solid #dcdcdc;
    height: 24px;
    margin: 0 auto;
    width: 990px;
}

#src-nav-theme ul {
    margin: 0 auto;
    width: 990px;
}

        #src-nav-theme ul li {
            float: left;
        }

            #src-nav-theme ul li:first-child {
                margin-left: 10px;
            }

#src-nav-theme ul li:first-child a {
    background: url(/_img/background/background-nav-home.gif) left top no-repeat;
    font-size: 0;
    height: 24px;
    line-height: 0;
    padding-top: 0;
    width: 12px;
}

#src-nav-theme ul li:first-child a:hover,
#src-nav-theme ul li:first-child a:focus,
                    #src-nav-theme ul li:first-child a.active {
                        background: url(/_img/background/background-nav-home.gif) left bottom no-repeat;
                    }

#src-nav-theme ul li a {
    color: #3f3f3f;
    display: block;
    font-size: 11px;
    line-height: 20px;
    padding: 4px 5px 0;
    text-transform: uppercase;
}

#src-nav-theme ul li a:hover,
#src-nav-theme ul li a:focus,
#src-nav-theme ul li a.active { 
    background: #ebebeb;
                    text-decoration: none;
}

/* Besoin dun ie7 parce que la plupart des ordis des gens qui travaillents dans la tour de Radio-Canada sont 'setter' en mode compatibilité ie7 */
.ie8 #src-nav-util #src-nav-search input[type=text],
.ie7 #src-nav-util #src-nav-search input[type=text] { 
    height: 16px;
    padding-top: 6px;
}


/* -------------------------------- */
/* ------ >> SOUS-MENU REGIONS << -- */
/* -------------------------------- */

#src-nav-panel-regions {
    background: #fff;
    margin: 0 auto;
    padding: 0 20px;
    width: 950px;
}

#src-nav-panel-regions div {
    background: url(/_img/background/bg_degrade.gif) repeat 0 0;
    padding: 15px 10px 0 15px;
}

#src-nav-panel-regions a.active,
#src-nav-panel-regions a:hover,
 #src-nav-panel-regions a:focus { 
        color: #000;
        text-decoration: none;
}

 #src-nav-panel-regions ul { 
        float: left;
        width: 20%;
}

 #src-nav-panel-regions li { 
        color: #646464;
        font-family: RubrikMd;
        font-size: 12px;
        margin-bottom: 2px;
}

 #src-nav-panel-regions a { 
        color: #939393;
        font-family: RubrikLt;
        font-size: 12px;
        font-weight: normal;
}

 #src-nav-panel-regions a.button-close {
            background: url(/_img/icon/icon-fermer-coffee-machine.gif) 429px 24px no-repeat;
    clear: both;
            color: #000;
            display: block;
            font-family: RubrikLt;
    font-size: 9px;
    height: 18px;
            padding: 18px 0 5px 0;
    text-align: center;    
    text-transform: uppercase;
    width: 100%;
}
 
    #src-nav-panel-regions > ul > li:first-child {
        font-weight: bold;
    }

    #src-nav-panel-regions > ul:nth-child(4) li {
        font-weight: normal;
    }



/* ----------------------------------- */
/* ------- >> 
    NOUVELLE RÉGIONNALISÉEE
     << ------- */
/* ----------------------------------- */

span.regionalFlag {
    background: url(/_img/title/title-nouvelle-regional.png) left top no-repeat;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 16px;
    line-height: 16px;
    font-size: 10px;
    overflow: hidden;
}

span.regionalFlag .titre {
        font-weight: bold;
        color: #fff;
        padding-left: 6px;
}

span.regionalFlag .region {
        color: #333;
        padding-left: 11px;
}

    


















/* -------------------------------- */
/* -------- >> 
        BOUTONS PLAY POUR VIDÉOS       
<< ---------- */
/* -------------------------------- */
/* ici et non dans general pour que les petit play du header soit visible en legacy  */

.lienVideo {
    position: relative;
    display: block;
}
    
a.link-news {
    position: relative;
    display: inline-block;
    cursor: pointer;
}
            
span.play, 
span.play.hover {
    background: url(/_img/button/button-play-new.png) left top no-repeat;
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    text-indent: -9000px;
}

li.emission span.play.xx-small {
    top: 0px;
}

/* Bouton play XX-SMALL */
span.play.xx-small,
span.play.xx-small.hover {
    background-position: -52px -696px;
    width: 20px;
    height: 20px;
    top: -4px;
    margin-right: -4px;
    left: 0px;
}

    span.play.xx-small.hover {
        background-position: -199px -696px;
    }

/* Bouton play X-SMALL */
span.play.x-small,
span.play.x-small.hover {
    background-position: -46px -608px;
    width: 49px;
    height: 49px;
    margin-left: -25px;
    margin-top: -25px;
}

    span.play.x-small.hover {
        background-position: -193px -608px;
    }

/* Bouton play SMALL */
span.play.small,
span.play.small.hover {
    background-position: -46px -607px;
    width: 45px;
    height: 45px;
    margin-left: -23px;
    margin-top: -23px;
}

    span.play.small.hover {
        background-position: -193px -607px;
    }

/* Bouton play MEDIUM */
span.play.medium,
span.play.medium.hover {
    background-position: -40px -490px;
    width: 54px;
    height: 54px;
    margin-left: -32px;
    margin-top: -24px;
}

    span.play.medium.hover {
        background-position: -189px -490px;
    }

/* Bouton play BIG */
span.play.big,
span.play.big.hover {
    background-position: -33px -353px;
    width: 82px;
    height: 82px;
    margin-left: -40px;
    margin-top: -40px;
}

    span.play.big.hover {
        background-position: -182px -353px;
    }


/* Bouton play BIGGER */
span.play.bigger,
span.play.bigger.hover {
    background-position: -32px -196px;
    width: 94px;
    height: 94px;
    margin-left: -47px;
    margin-top: -48px;
}

    span.play.bigger.hover {
        background-position: -179px -196px;
    }

/* Bouton play BIGGEST */
span.play.biggest,
span.play.biggest.hover {
    background-position: -6px -14px;
    width: 148px;
    height: 148px;
    margin-left: -74px;
    margin-top: -74px;
}

    span.play.biggest.hover {
        background-position: -154px -14px;
    }



/*/////////////////////////////////*/
/*  VERSION V2 CENTRE DES MEMBRES  */
#src-nav-login {
    display: none;
}

#rc-oauth2-loginbar {
    float: right;
    margin-right: 20px;
}

#rc-oauth2-loginbar #widgetLogin_btnLogin {
    margin-top: 10px;
}

#rc-oauth2-loginbar-wrapper #rc-oauth2-loginbar #widgetLogin {
    position: static;
}

[class^="icon-avatar_default"], [class*=" icon-avatar_default"], [class^="icon-avatar_default"]:before, [class*=" icon-avatar_default"]:before {
    font-family: 'IcomoonCentreDesMembres' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    font-size: 26px !important;
    text-transform: none;
    line-height: 1;
    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

#widgetLogin_containerUserInfo .wgt_userImg .wgt_userProfileImage .icon-avatar_default {
    margin-top: 4px;
}
#widgetLogin {
    height: 46px !important;
}

#widgetLogin_btnLogin button {
    color: #cc0000 !important;
    text-transform: uppercase;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;

}

.icon-avatar_default {
    margin-top: 4px !important;    
}

#widgetLogin_btnLogin button:hover {
    color: #fff !important;
}

#widgetLogin_btnLogin:hover {
    background: #cc0000;
}

#widgetLogin_btnLogin {
    border: 1px solid #ccc !important;
}