/* -------------------------------------------------------------- 
   
 type.css
 * Sets up some sensible typography.
 * @author    julien bidoret
 * @copyright (c) 2008, oxys.net
 * @date      8 April 2008
 * @version   0.1
 
-------------------------------------------------------------- */


/* Typography  
---------------------------------------------------------------------------------------------------*/
body {  
    font-size: 12px; 
    color: #444; 
    background-color: #fff; 
    font-family:  Arial, Helvetica, sans-serif; 
    background-image:url(img/body-bg.png); 
    background-repeat: repeat-x; 
    }

/* Headings
-------------------------------------------------------------- */
h1,h2,h3 { font-weight: normal; }

h1, h2, h3, .h1, .h2, .h3 { font-family: Georgia, "Times New Roman", Times, serif; line-height: 1.1; }
.h1, h1 { font-size: 36px; margin-bottom: 0.5em; }
.h2, h2 { font-size: 24px; margin-bottom: 0.75em; }
.h3, h3 { font-size: 20px; margin: .8em 0; }
.h4, h4 { font-size: 14px; line-height: 1.25; border-bottom:1px solid #cecece; margin-bottom: .3em; }
.h5, h5 { font-size: 12px; line-height: 1.25; }
.h6, h6 { font-size: 11px;  font-weight:bold; color:#444; margin-bottom:10px; }
h1 img, h2 img, h3 img, h4 img, h5 img, h6 img {margin: 0;}


/* Headings specials
-------------------------------------------------------------- */
h1.big-title { 
    font-size:40px;
    letter-spacing:-1px;
    margin:20px 0 36px;
    text-rendering:optimizeLegibility
    }
    h1.big-title span { 
        display:block; 
        font-size:.6em; 
        letter-spacing:0px; 
        }

h3.section, h2.section, .h3.section { 
    border-bottom:1px solid #e7e7e7; 
    padding-bottom:.2em; 
    margin-top:0
    }
    
.sidebox h3, .sidebox .h3, .sidebox h2, .sidebox .h2 {
    padding-bottom:.2em; 
    border-bottom-width: 0;
    font-size: 1.25em;
    margin: 0 0 0.5em;
    font-weight: bold;
    font-family: Helvetica, Arial, sans-serif;
    }

.box h3, .box .h3, .ox-tab-panel h3{ margin:0 0 10px 0; font-size:18px }
.box h6, .box .h6 { text-shadow:1px 1px 1px #FFFFFF; color:#666 }



h3 .type-link{ color:#333; font-weight:normal;}
h3 .type-link:after{ content:" | " }
h3 .type-link em{background-image:url(img/article-types-black.png); margin:4px 0 0 0; height:14px} 


.tagline{
    position:absolute;
    background:#000;
    color:#fff;
    line-height:1.2;
    top:4px;    
    left:4px;
    opacity:.55;
    font-size:0.85em;
    margin-top:-2px;
    padding:1px 4px 0;
    text-transform:uppercase;
    font-weight:700;
    z-index:6;
    }    
.no-img  { position:relative; background:transparent; color:#A6A6A6; opacity:1; padding:0; left:auto; top:auto; font-weight:normal; }
h4.no-img{ color:#555}

#bottom-tags h6 { font-size: 1.2em; line-height: 1.25; font-weight: bold;  border-bottom:1px solid #cecece; margin-bottom: .3em; }


/* Specials
-------------------------------------------------------------- */
.success-smiley {
    font-family: Georgia,Utopia,Palatino,'Palatino Linotype',serif; 
    background:#fff; 
    font-size:3em; 
    font-weight:normal; 
    height:82px; 
    white-space:nowrap; 
    margin-bottom:0.5em; 
    overflow:hidden; 
    display:block;
    }
.success-smiley strong{ 
    font-family:Palatino,"Palatino Linotype","Baskerville", Utopia, Georgia; 
    background-color:#fff;
    font-size:72px;
    display:block;
    float:left;
    width:auto;
    height:80px;
    margin-top:-20px;
    padding-right:10px;
    vertical-align:top;
    }
#ie6 .success-smiley strong, #ie7 .success-smiley strong{width:70px; display:none}

.success,
.success-smiley span{display:block; float:left; padding:10px 0 0 0; color:#bbca11;  background-color:#fff}
.error,
.error-smiley span {color:#c24603}



/* Text elements
-------------------------------------------------------------- */

/* dark blue (main hover color)  */
.magazine a:focus, .magazine a:hover, a.magazine:focus, a.magazine:hover, a:focus, a:hover { color: #013d63/*hover-default*/; }

/* light blue */
a { color: #247694/*link-default*/; text-decoration: none; }

/* grey */
.grey-link a, a.grey-link { color: #999;}
    a.grey-link:focus,  a.grey-link:hover, .grey-link a:focus,  .grey-link a:hover     { color: #000;  }

/* red orange */
.community a, a.community { color: #c24603;}
    a.community:focus,  a.community:hover, .community a:focus,  .community a:hover     { color: #000;  }

/* green */
.profile a, a.profile { color: #779802/*profile-default*/;}
    a.profile:focus,  a.profile:hover, .profile a:focus,  .profile a:hover     { color: #000;  }

/* dark blue */
a.magazine, .magazine a { color: #247694/*link-default*/; text-decoration: none; }

/* shy links */
a.cobweb { color: inherit; border-bottom:1px dotted #444; text-decoration: none; }
a.cobweb:hover { border-bottom:1px dotted #013d63/*hover-default*/; color: #013d63/*hover-default*/;  }



/* Text elements
-------------------------------------------------------------- */

p { margin: 0 0 .5em; }

.post-date {color:#999}

blockquote  { margin: 1.5em; color: #666; font-style: italic; }
strong      { font-weight: bold; }
em,dfn      { font-style: italic; }
dfn         { font-weight: bold; }
sup, sub    { line-height: 0; }

abbr, 
acronym     { border-bottom: 1px dotted #666; }
address     { margin: 0 0 1.5em; font-style: italic; }
del         { color:#666; }

pre,code    { margin: 1.5em 0; white-space: pre; }
pre,code,tt { font: 1em 'andale mono', 'lucida console', monospace; line-height: 1.5; } 

b           { font-weight:400 }


/* Lists
-------------------------------------------------------------- */

ul, ol      { list-style-type: none; margin:0}

dl          { margin: 0 0 1.5em 0; }
dl dt       { font-weight: bold; }
dd          { margin-left: 1.5em;}

.simple-list {list-style-type:none; margin:0}

.bold-caps-list,
.cities-tags,
.issues-tags{
    font-weight:bold;
    text-transform:uppercase;
    line-height:1.6;
    margin:0; padding:0
    }
    
    .bold-caps-list li,
    .cities-tags li,
    .issues-tags li{
        display:inline;
        font-size:11px;
        padding-right:.5em;
        
        }    
        .cities-tags li,
        .issues-tags li{
            float:left;
        }
    .bold-caps-list a,
    .cities-tags a,
    .issues-tags a{
        color:#979797;
        white-space:nowrap;
        }
    .bold-caps-list a:hover,
    .cities-tags a:hover,
    .issues-tags a:hover{
        color:#c24603;
        }

.inline-list li { display:inline;}
/* Tabbed lists
---------------------------------------------------------------------------------------------------*/
.posts-list { 
    font-size:11px 
    }
.articles-list li,
.posts-list li { 
    border-bottom:1px dotted #ccc;
    margin:0 0 6px;
    padding-bottom:6px;
    }
.posts-list li {
    /* negative indent for dates (first line) */
    padding-left:35px;
    text-indent:-35px;
    }
    .articles-list li:last-child,
    .posts-list li:last-child { margin-bottom:0; border-bottom:none; padding-bottom:0}
    .posts-list .post-date { 
    	color:#999; 
        }
    .posts-list .post-author { 
        display:block;
        padding-left:35px;
        }
    .posts-list a { color:#666 }
    .posts-list a:hover strong { color:#c24603 }
    
    

/* Misc classes
-------------------------------------------------------------- */

.center     { text-align:center }
.small      { font-size: 11px;  }
.last       { margin-right:0; padding-right:0; }
.floatright { float:right }
.floatleft  { float:left }


/* Common classes
-------------------------------------------------------------- */
.author     { display:block; }
.author, .author a, a[href*="/profile/display/"]{ color:#A6A6A6; text-transform:uppercase;  font-size:11px;}
a[href*="/profile/display"]:hover, .author a:hover { color:#c24603;}

a[href*="sendTo"]       { display:inline-block; width:1em; height:1em; text-indent:-9999em; background:url(img/message-link.png) no-repeat 0 3px; text-transform:uppercase;  font-size:11px; }
a[href*="sendTo"]:hover { background-position:0 -47px;}


.info-co    { color:#999; font-size:11px;  line-height:1.1; padding-top:4px; }

.quiet,
.label      {color:#999}


/* a.overlink */
.overlink {position: relative; margin-bottom:10px; height:1%}
.overlink a, .overlink img { display:block; text-decoration:none; line-height:1.1 }
.overlink a:hover{text-decoration:none }
.overlink strong{ display:block; background:url(img/dark-grad.png) repeat-x 0 0; position: absolute; bottom:0; color:#fff; font-weight:400; width:100%; cursor:pointer; }
.overlink a:hover strong, .overlink a:focus strong{color:#fff; background:url(img/dark-grad.png) repeat-x 0 -150px}
.overlink span{ padding:6px 4px; display:block; }

.infront-content .overlink {
    -moz-border-radius:3px;  -webkit-border-radius:3px;  border-radius:3px;
    }
.infront-content .overlink span{ 
    display:block;
    line-height:1.3;
    padding:10px 15px;
    }
.infront-content .overlink span b{
    display:block;
    font-style:normal;
    margin-bottom:4px;
    }

/* Play video button 
---------------------------------------------------------------------------------------------------------------------------- */
a.play-video{
    position:relative;
}
.video-play-button {
    cursor:pointer; z-index:4; width:60px; height:51px; display:block;   
    background: url("img/play-video-alpha.png") no-repeat 0 0;
    position:absolute;
    }
    #ie6 .video-play-button {
        background: url("img/play-video-alpha.png") no-repeat 0 0;
        }

.video-play-button em{
    cursor:pointer; z-index:5; width:60px; height:51px; display:block; text-indent:-999em;
    background: url("img/play-video-alpha-em.png") no-repeat 0 0;
    opacity:0.5;
    }
    #ie7 .video-play-button em{
        filter: alpha(opacity=50);
        }
    #ie6 .video-play-button em{
        filter: alpha(opacity=50);
        background: url("img/play-video-em.png") no-repeat 0 0;
        }
        
    a.play-video:hover .video-play-button em{
        opacity:1;
        }    
        #ie7 a.play-video:hover .video-play-button em{
            filter: alpha(opacity=100);
            }
        #ie6 a.play-video:hover .video-play-button em{
            filter: alpha(opacity=100);
            }          

/* javascript / classe .js ajoutée à <html> en javascript
-------------------------------------------------------------- */
.no-js-hide,
.hide       { display: none; }

.js .js-hide{display:none}
.js .no-js-hide{display:block}



/* Sections colors 
-------------------------------------------------------------- */

.color-world,     .color-world a    {color:#b8cc00}
.color-politics,  .color-politics a {color:#266f9b}
.color-society,   .color-society a  {color:#11b1ff}
.color-economy,   .color-economy a  {color:#99cc33}
.color-culture,   .color-culture a  {color:#f8298b}
.color-sports,    .color-sports a   {color:#6d1052}
.color-brunch,    .color-brunch a   {color:#ce2e20}
.color-mian,      .color-mian a     {color:#ffba00}
.color-tob-1,     .color-tob-1 a    {color:#444444}
.color-tob-2,     .color-tob-2 a    {color:#838383}
.color-tob-3,     .color-tob-3 a    {color:#0c0c0c}