/*Reset HTML defaults*/

p,h1,h2,h3,h4{
    margin:0;
    padding:0;
}

/*Global layout css and graphical preferences*/


#flashlink {
    margin-top:20px;
    margin-left:30px;
}

#flashlink a{

    color:#1560ab;
    font-size:12px;
}

#flashlink a:hover{
    color:#d41200;
    background-color:white;
    text-decoration:none;
}

body{
    margin:0;
    font-family:Helvetica, Arial, sans-serif;
    font-size:0.88em;
    background-color:white;
    color:black;
}

p{
    margin:0 0 1em 0;
}


a.title{
    font-size:1.55em;
    display:block;
    margin-bottom:12px;
}


a.back{
    float:right;
    background:url(../images/back.jpg) left center no-repeat;
    padding-left:22px;
    color:black;
    margin-top:20px;
    margin-left:15px;
}

a.next{
    float:right;
    background:url(../images/next.jpg) right center no-repeat;
    padding-right:22px;
    color:black;
    margin-top:20px;
    margin-left:15px;
    margin-right:20px;
}

a.zoomBack{
    margin-top:0px;
}

h1,h2,h3,h4{
    margin:0 0 1em 0;
    font-weight:normal;
}

h1{
    /*color:#fe6c00;*/
    color:#d41200;
    font-size:2.85em;
    border-bottom:5px solid #d6e2ef;
    padding-bottom:15px;
}

#content h1{
    border:none;
    margin-bottom:0;
    padding-bottom:0;
    color:#1560ab;
    font-size:2.1em;
}

#content .subtitle, #content .dates{
    margin-bottom:20px;
    font-size:1.3em;
}

#content .subtitle{
    font-style:italic;
}

h2{
    color:#1560ab;
    font-size:1.55em;
}

h2 strong{
    font-weight:normal;
}

#monthly h2{
    color:#1560ab;
    font-size:1.4em;
    margin-bottom:5px;
}

h3{
    font-weight:bold;
    font-size:1em;
}

h4{

}

#main{
    width:960px;
    margin: 0px auto 0px auto;
    position: relative;
}

#header{
    margin:0 auto;
    width:100%;
    border-bottom:1px solid #cccccc;
    margin-bottom:15px;
}

#breadcrumb{
    margin:15px 0;
    color:#adafb2;
}

#breadcrumb img{
    vertical-align:middle;
    margin-left:4px;
    margin-right:4px;
}

img#logo{
    float:left;
    /*        margin-top: 20px;*/
}

body.fr img#logo{
    margin-top: 15px;
}

.center{
    width:940px;
    margin: 0px auto 0px auto;
}


#content{
    float:left;
    padding-bottom:30px!important;
}

.withsidebar-right{
    float:left;
    padding-bottom:30px!important;
    width:740px!important;
    padding-right:39px!important;
}

.withsidebar-left{
    float:left;
    padding-bottom:30px;
    width:735px!important;
    padding-left:39px!important;
    padding-right:0px!important;
}

#sidebar-left{
    float:left;
    width:163px;
    overflow:hidden;
    padding-bottom:20px;
}

#sidebar-right{
    float:left;
    width:160px;
    overflow:hidden;
    padding-bottom:20px;
}

#side_menu a{
    margin-top:1px;
    display:block;
    padding:5px 5px 5px 23px;
    background:url(../images/arrow-green.jpg) no-repeat 3px 7px;
}

#side_menu a:hover, #side_menu a.selected{
    color:white;
    background:url(../images/arrow-orange.jpg) no-repeat #a2d553 3px 7px;
}


/*FOOTER*/

div#footer{
    clear:both;
    border-top:5px solid #1058a0;
    padding-top:35px;
    padding-bottom:20px;
    background-color:#eff3f9;
    font-family:Helvetica, Arial, sans-serif;
    color:black;
}

div#footer a{
    color:black;
}

div#footer a:hover{
    color:white;
}

div#footer .logo{
    float:left;
    margin:0 40px 0 0px;
}

div#footer .logos{
    clear:both;
    padding-top:30px;
}

div#footer .column{
    width:23%;
    float:left;
    padding-right:2%;
}

div#footer .column span{
    color:#1058a0;
    font-size:1.55em;
    display:block;
    margin-bottom:1em;
}


#evils{
    float:left;
    margin-top:15px;
    clear:both;
    width:100%;
    border-top:1px dotted #b7b9bc;
    padding-top:10px;
}

div.imageWide{
    padding:4px;
    background-color:#eaf0f7;
    text-align:center;
    margin-bottom:25px;
}

div#images{
    float:right;
    margin-left:15px;
}

div#images .image{
    width:250px;
    margin-bottom:15px;
    padding:4px;
    background-color:#eaf0f7;
    text-align:center;
}

div#images .magnefier{
    width:100%;
    text-align:left;
    margin-top:4px;
}

div#images .magnefier a:hover{
    background:none;
    color: #1560ab;
}

div#images .magnefier img{
    margin-right:4px;
}

div.largeImage{
    margin-top:15px;
    float:left;
    clear:both;
    padding:4px;
    background-color:#eaf0f7;
    text-align:center;
}

.img-description{
    padding-top:5px;
    font-size:0.8em;
    text-align:left;
    margin-bottom:5px;
}

.credits{
    padding-top:5px;
    font-style:italic;
    font-size:0.8em;
    text-align:left;
    margin-bottom:5px;
}


/*Menus*/

#menu{
    float:right;
    width:550px;
    margin:35px 0 12px 0;
    font-size:0.85em;
}

#menu div{
    width: 90px;
    padding:0;

}

#menu div#menuItem-5{
    width: 105px;
}

#menu .blue-text{
    color:#00a7dd;
}

#menu .titre_section, #menu .bloc_menu, #menu .sous_section{
    float:left;
    /*	width:103px;*/
    z-index: 999;
}

#menu .titre_section ul, #menu .bloc_menu ul, #menu .sous_section ul{
    z-index: 999;
}

.sous_section ul{
    font-size: 1.25em;
}

#menu .titre_section a{
    display:block;
    float:left;
    /*	width:85px;
	padding-right:10px;
	padding-left:7px;
	padding-bottom:5px;
	padding-top:5px;*/

    padding: 5px 10px;
    height:2.5em;
    color:black;
}

#menu #menuItem-1.titre_section a{
    /*	width:85px;*/
}

#menu #menuItem-1.titre_section, #menu .bloc_menu.bloc_menu1{
    /*	width:85px;*/
}

#menu #menuItem-1.titre_section ul{
    /*	width:99px;*/
}

#menu #menuItem-2.titre_section a{
    /*	width:87px;*/
}

#menu #menuItem-2.titre_section, #menu .bloc_menu.bloc_menu2{
    	width:85px;
}

#menu #menuItem-2.titre_section ul{
    	width:84px;
}



#menu .titre_section a:hover,#menu a.selected, #menu .titre_section.hover a{
    color:white;
    background-color:#662c91;
}

#menu ul{
    /*	width:103px;*/
    list-style-type:none;
    margin:0;
    padding:0;
}

#menu li{
    width:100%;
}

#menu ul a{
    display:block;
    width:94px;
    color:white;
    background-color:#8d40c6;
    padding:7px;
    border-bottom:1px solid #c6a0e3;
    font-size:0.8em;
}

#menu ul a.last{
    border-bottom:none;
}

#menu ul a:hover{
    background-color:#662c91;
    color:white;
}

#monthly{
    width:100%;
}

#monthly img{
    float:left;
/*    width:160px;
    height:160px;*/
    margin-bottom:10px;
}


#monthly .caption{
    font-size:0.8em;
}

#footer #monthly{
    float:left;
    margin-top:20px;
    padding-top:20px;
    border-top:1px dotted #b7b9bc;
}

#footer #monthly .rss_item{
    float:left;
    margin:0 20px 0 0;
    width:160px;
}

#footer .column img{
    margin-top:5px;
}

/*End menus*/


/*MISC*/

#bande_noire{
    width: 100%;
    height: 43px;
    position: absolute;
    top: 0;
    left: 0;
    background-color: #000000;
}

#nav_global {
    width: 940px;
}

img{
    border:none;
}

a{
    color: #1058a0;
    text-decoration:none;
}

a:hover{
    color:white;
    background-color:#1058a0;
}


select{
    font-size:1.00em;
}

input{
    padding:3px;
}

.rss_item{
    margin-bottom:1em;
}

a.rss{
    background:url(../images/feed-icon.gif) no-repeat 0px 2px;
    padding-left:14px;
    float:left;
    clear:both;
    margin-top:10px;
}

#home_feature a.rss{
    margin-top:22px;
}

a.itunes{
    background:url(../images/itunes.jpg) no-repeat;
    padding-left:20px;
    float:left;
    clear:both;
    margin-top:10px;
    line-height:20px;
}

a.episodes{
    background:url(../images/episodes.gif) no-repeat;
    padding-left:20px;
    float:left;
    clear:both;
    margin-top:10px;
    line-height:20px;
}

a.episodes:hover{
    background:url(../images/episodes.gif) no-repeat #1058a0;
}

a.rss:hover{
    background:url(../images/feed-icon.gif) no-repeat 0px 2px #1058a0;
}

a.itunes:hover{
    background:url(../images/itunes.jpg) no-repeat #1058a0;
}

/* Fix for the non floating div with floating content */
.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

br.clear{
    clear:both;
}

table#repertoire th{
    text-align:left;
    padding:6px;
}

table#repertoire td{
    padding:6px;
}

tr.alt-row{
    background-color:#eff3f9;
}

#glossary{
    padding-bottom:20px;
    margin-bottom:20px;
}

#glossary p{
    margin:0;
    display:inline;

}

#glossary .item{
    margin-bottom:1em;
}

#glossary h2{
    clear:both;
}

#glossary_menu{
    float:left;
    padding-bottom:20px;
}

#glossary_menu *{
    float:left;
    padding-right:10px;
    display:block;
}

#content form.aligned *{
    margin:0;
}

#content form.aligned label{
    clear:both;
    text-align:right;
    padding-right:10px;
    line-height:26px;
}

#content form.aligned input.button{
    clear:both;
    float:left;
    margin-left:195px;
    margin-top:10px;
    margin-bottom:15px;
}

input.button{
    background:black;
    border:none;
    color:white;
    padding:2px;
    width:auto;
    margin-left:5px;
}


#content form.aligned span.input_button.blue{
    clear:both;
    float:left;
    margin-left:195px!important;
}


#content form br{
    clear:both;
}

#content form.aligned input{
    margin-left:3px;
}

#content form.aligned label{
    display:block;
    width:350px;
    margin-top:3px;
}

#content form.aligned label.bigText{
    width:599px;
}

#content form.aligned label.bigText textarea{
    vertical-align:top;
}

/*Round buttons*/

a.link_button{
    display:block;
    font-weight:bold;
}

a.link_button span{
    float:none!important;
    display:block;
    line-height:19px;
    padding:0;
    margin:0;
}

a.purple{
    background:url(../images/button-purple-left.jpg) #662d92 no-repeat;
    color:white!important;
}

a.purple span{
    background:url(../images/button-purple-right.jpg) top right no-repeat;
    padding:0 11px 0 11px;
    color:white!important;
    cursor:pointer;
}

a.jukebox{
    background:url(../images/button-blue-left.jpg) #00b0d8 no-repeat;
    color:white!important;
}

a.jukebox:hover{
    background:url(../images/button-blue-left-hover.jpg) #91C953 no-repeat;
}

a.jukebox span{
    background:url(../images/button-blue-right.jpg) top right no-repeat;
    padding:0 30px 2px 11px;
    color:white!important;
    line-height:22px;
    cursor:pointer;
}

a.jukebox:hover span{
    background:url(../images/button-blue-right-hover.jpg) top right no-repeat;
}

a.bigblue{
    background:url(../images/button-big-blue-left.gif) no-repeat;
    color:white!important;
    font-size:1.15em;
    float:left;
}

a.bigblue:hover{
    background:url(../images/button-big-blue-left-hover.gif) no-repeat;
}

a.bigblue span{
    background:url(../images/button-big-blue-right.gif) top right no-repeat;
    padding:0 29px 0 15px;
    color:white!important;
    line-height:30px;
    cursor:pointer;
}

a.bigblue:hover span{
    background:url(../images/button-big-blue-right-hover.gif) top right no-repeat;
}

a.bigblue span.text{
    background:#00b0d8;
    padding:0 4px 0 0;
}

a.bigblue:hover span.text{
    background:#91C953;
}

a.blue{
    background:url(../images/button-small-blue-left.jpg) #00b0d8 no-repeat;
    color:white!important;
    float:left;
}

a.blue:hover{
    background:url(../images/button-small-blue-left.jpg) #00b0d8 no-repeat;
}

a.blue span{
    background:url(../images/button-small-blue-right.jpg) top right no-repeat;
    padding:0 8px 0 8px;
    color:white!important;
    cursor:pointer;
    font-size:0.85em;
    line-height:18px;
}

a.orange{
    background:url(../images/button-orange-left.jpg) #d41200 no-repeat;
    color:white!important;
    float:left;
}

a.orange:hover{
    background:url(../images/button-orange-left.jpg) #d41200 no-repeat;
}

a.orange span{
    background:url(../images/button-orange-right.jpg) top right no-repeat;
    padding:0 8px 0 8px;
    color:white!important;
    cursor:pointer;
    font-size:0.85em;
    line-height:18px;
}

a.green{
    background:url(../images/button-green-left.jpg) #95bb28 no-repeat;
    color:white!important;
    float:left;
}

a.green:hover{
    background:url(../images/button-green-left.jpg) #95bb28 no-repeat;
}

a.green span{
    background:url(../images/button-green-right.jpg) top right no-repeat;
    padding:0 8px 0 8px;
    color:white!important;
    cursor:pointer;
    font-size:0.85em;
    line-height:18px;
}


input#email, input#password{
    width:150px;
}

input#password{
    width:75px;
}


#content form.aligned span.input_button{
    margin: 20px 0px 20px 0px;
}

#content form.aligned span.input_button input{
    width:auto;
}


span.input_button{
    display:inline-block;
}

span.input_button input{
    border:none;
    font-weight:bold;
    font-size:0.85em;
    overflow:visible;
    margin:0!important;
}

/*Color codes*/
span.purple{
    background:url(../images/button-purple-left.jpg) #662d92 no-repeat;
    color:white!important;
}

span.purple input{
    background:url(../images/button-purple-right.jpg) top right no-repeat;
    color:white!important;
    padding:0 11px 0 11px;
    height:19px;
}

span.gray{
    background:url(../images/button-gray-left.jpg) #eff3f9 no-repeat;
}

span.gray input{
    background:url(../images/button-gray-right.jpg) top right no-repeat;
    padding:2px 10px 0 10px;
    height:19px;
}

span.blue{
    background:url(../images/button-small-blue-left.jpg) #00b0d8 no-repeat;
}

span.blue input{
    background:url(../images/button-small-blue-right.jpg) top right no-repeat;
    padding:0px 8px 2px 8px;
    color:white;
    height:18px;
}

/*************/

#podcasts{
    margin-bottom:20px;
}


div#podcasts img{
    width:144px;
    height:144px;
    float:left;
    margin-right:25px;
}

#podcasts h2{
    color: #1058a0;
}

#podcasts .podcast{
    clear:both;
    float:left;
    width:100%;
    margin-bottom:20px;
    padding-bottom:20px;
    border-bottom:1px dotted #cccccc;
}

#podcasts a.rss, #podcasts a.itunes, #podcasts a.episodes{
    float:left;
    clear:none;
    margin-right:20px;
}

#podcasts h3{
    float:left;
    margin-top:20px;
    width:100%;
}

#podcasts .podcast-item{
    float:left;
    width:100%;
    padding-bottom:10px;
    border-bottom:1px dotted #cccccc;
}

#podcasts .audioPlayer{
    float:left;
    margin-right:5px;

}

#podcasts .audioWrapper{
    width:109px;
    float:left;
    background-color: #eeeeee;
    border:1px solid #cccccc;
    padding:5px 0 5px 5px;
    margin-right:20px;
}

#podcasts object{
    float:left;
    margin-right:10px;
}

#podcasts .description{
    float:left;
    width:600px;
    clear:none;
}

#podcasts a.back{
    margin:0 0 0 10px;
}

#podcasts .video_feature{
    float:left;
    padding:0 2% 0 2%;
    margin:0 0px 40px 0;
}

.presents .feature-item img{
    float:left;
    margin-top:-47px;
    margin-bottom:100px;
}

.presents p{
    margin-left:368px;
    /*margin-right:260px;*/
}

.presents .feature-item p{
    margin-left:0px;
    margin-right:0px;
}

.presents .feature-item{
    border-top:1px dotted #cccccc;
    padding-top:15px;
    margin-top:-35px;
}

.presents .first{
    border-top:1px dotted #cccccc;
    padding-top:15px;
    margin-top:15px;
}

.presents .feature-item h2{
    float:left;
    padding-left:170px;
    width:770px;
}


.presents .feature-item .audioWrapper{
    float:left;
    clear:both;
    margin-top:-95px;
    background:none!important;
    border:none!important;
}

#podcasts .rss-image{
    float:right;
    margin:0 0 35px 30px;
    width: 240px;
    height: 240px;
}

#podcasts .feature-column{
    float:left;
    width:31%;
}

#podcasts .feature-item{
    width:100%;
    float:left;
    margin-bottom:30px;
}

.clear{
    clear:both;
}

/*
div.timeline-bg{
	text-align:center;
	background:url(../images/background-timeline.jpg) no-repeat;
	width:738px;
	height:239px;
	margin-bottom:15px;
}

img.timeline{
	margin-top:25px;
	margin-bottom:40px;
}
*/

.column_whoswho{
    width:47%;
    padding-right:3%;
    float:left;
}

.program_note{
    margin-top:4px;
}


/*LANDING PAGES*/

a.landLarge{
    width:464px;
    height:370px;
    margin-right:12px;
    margin-bottom:13px;
}

a.landLarge, a.landMedium, a.landSmall{
    float:left;
    color:white;
    font-size:1.55em;
}

a.landLarge img, a.landMedium img, a.landSmall img{
    float:left;
}

a.landLarge:hover,a.landMedium:hover,a.landSmall:hover{
    background-color:#a2d553;
}

a.landMedium{
    width:464px;
    height:178px;
    margin-bottom:13px;
}

a.landSmall{
    width:226px;
    height:178px;
    margin-left:12px;
    margin-bottom:13px;
}

a.landLarge span,a.landMedium span,a.landSmall span{
    float:left;
    display:block;
    padding:15px 12px 0px 12px;
}

a.landLarge span{
}

a.landMedium span{
    width:205px;
}

a.landSmall span{
    font-size:0.75em;
}

a.landMedium.moremargintop{
    margin-top:1px;
}

a.landMedium.rightImage img{
    float:right;
}

a.landMedium.rightImage span{
    text-align:right;
}

a.landMedium.quizzes, a.landMedium.links{
    margin-left:12px;
}

.nomargin{
    margin:0!important;
}

.blue1{
    background-color:#2768a9;
}

.blue2{
    background-color:#3082c3;
}

.blue3{
    background-color:#19a0cf;
}

.blue4{
    background-color:#19b8dc;
}

.blue5{
    background-color:#2768a9;
}

a.landing{
    padding:10px 0 10px 100px;
    background:url(../images/game-bands.jpg) no-repeat;
    margin:0;
}

a.landing:hover{
    color:white;
    background:url(../images/game-bands.jpg) no-repeat #1058a0;
}

/**/

a.great-composer{
    display:block;
    float:left;
    width:200px;
    padding-left:25px;
    padding-right:5px;
    margin-bottom:25px;
}

a.great-composer:hover{
    background:none;
}

a.great-composer span{
    display:block;
    padding:5px 0px 5px 2px;
}

a.great-composer:hover span{
    background: #1058a0;

}

a.great-composer img{
    margin-bottom:5px;
}

a img.arrow{
    vertical-align:-2px;
}

a.top{
    margin-bottom:20px;
    padding-left:23px;
    float:right;
    background:url(../images/aerrow-top.jpg) 1px 0px no-repeat;
    line-height:1.25em;
}

a.top:hover{
    color: white;
    background:url(../images/aerrow-top-hover.jpg) 1px 0px no-repeat #1058a0;
}

ol ol li{
    list-style:lower-latin;
    margin-bottom:0em;
}

ol{
    margin-bottom:1em;
}

ol ol{
    margin-top:1em;
}

ol li{
    margin-bottom:1em;
}

.resource-kit{
    float:left;
    width:100%;
    border-bottom:1px dotted #cccccc;
    margin-bottom:20px;
    padding-bottom:20px;
}

.resource-kit ul{
    float:left;
    margin:0;
}

.resource-kit img{
    float:left;
    width:165px;
    height:165px;
    margin-right:20px;
}

.logo-credit{
    float:left;
    margin-top:10px;
    margin-bottom:25px;
    margin-right:30px;
}

.credit-logo-bar{
    border-bottom:1px solid #cccccc;
    margin-bottom:15px;
}

.game-bar{
    border-top:1px dotted #cccccc;
    margin-top:15px;
}

#nav_global{
    margin-bottom: 11px;
}

#nav_global h2 {
    float:left;
}

#header{
    margin: 4px 0 15px 0;

}
#nav_global ul {
    margin-top: 4px;
}

.form-header{
    float:left;
    clear:both;

}

.composer-box{
    width: 100%;
    float: left;
}

.alpha-list{
    margin:0;
    padding:0;
}

.alpha-list li{
    list-style: none;
    float: left;
}
.alpha-list li a{
    display: block;
    background: #1560AB;
    color: #fff;
    border-right: 1px solid #fff;
    padding: 5px 15px;
}

.alpha-list li a:hover{
    background: #efefef;
    color:#1560AB;
}

#content h1.alpha-header{
    border-bottom: 1px solid #ccc;
    margin-bottom: 10px;
    padding: 8px 0 4px 24px;
}

.back-to-top{
    width: 100%;

    text-align: right;
    margin: 10px 0;
	clear: both;
}



.description .btn-block{
    margin: 5px 0 0 10px;
    float:right;
}

.description .movement .btn-block{
    margin-top: -5px;
}

.description .movement .btn-block a:hover{
    color: #444;
}


.btn-block a.action-add-to-playlist{
    display: block;
    float:left;
    background: #e8e8e8 url(../images/add-btn.jpg) no-repeat 0 0;
    padding-left:20px;
    line-height: 20px;
    font-size: 11px;
    color: #474848;
    margin: 5px 10px 0 0;
    border: 1px solid #ccc;
}
.btn-block a.action-add-to-playlist span{
    border-left: 1px solid #ccc;
    display: block;
    height: 17px;
    padding: 0 7px;
}

.btn-block a.play-immediately{
    display: block;
    float:left;
    border: 1px solid #ccc;
    background: #e8e8e8 url(../images/play-btn.jpg) no-repeat 0 0 !important;
    padding-left:20px;
    line-height: 20px;
    font-size: 11px;
    color: #474848 !important;
    margin: 5px 10px 0 0;
}

.btn-block  a.play-immediately span{
    border-left: 1px solid #ccc;
    display: block;
    height: 17px;
    padding: 0 7px;
}

#playlist a.delete{
    background: #e8e8e8 url(../images/delete-btn.jpg) no-repeat 0 0 !important;
}

/*
UTILS
*/

.float-right{

    float:right;
}

#tweet{
    width: 55px;
    height: 21px;
    display: block;
    background: url(../images/tweet.png) no-repeat 0 0 !important;
}

a{
    outline:none !important;
}

#footerLogos{
    z-index: 2 !important;
    position: static !important;
    padding-top: 30px;
    background-position: 50% 0;
}

#footer_wrap{
    padding: 0 0 30px 0;
}

#nav_about {
    width: 400px;
}
#nav_about ul{
    width: 400px;
}

#nav_about .user-logged-in {
    color: #aaa;
    padding-right: 10px;
}