body {
  /*background:#94B8DE url('../img/bg-blue.png') top left repeat-x;*/
  background: #E7EBF2;
  
  font-weight:lighter;
  font-family:"Lucida Grande","Lucida Sans Unicode",Arial,Verdana,sans-serif;
  color:#000000;
  
  text-align:left;
  
  -webkit-perspective: 0;
}

h1,h2,h3,h4,h5,h6{
}

.clear{clear:both;}
.border-radius-all{
  -moz-border-radius:7px;
  -webkit-border-radius:7px;
  border-radius:7px;
}

header{
  height: 133px;
  margin: 5px auto;
  position: fixed;
  width: 50%;
  z-index: 100;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border: 1px solid #C4CDE0;
  background: white;
  border-radius: 3px;
  border-bottom-width: 2px;
  margin: 5px auto;
  position:relative;
}

  header h1{
    left:110px;
    top: 20px;
    z-index:10;
    position:absolute;
  }
  
    header h1 a{
      color:#1C2A47;
      display:block;
      font-size:31px;
      font-weight:bolder;
      height:41px;
      overflow:hidden;
      text-decoration:none;
      letter-spacing:-0.05em;
    }

  header h2{
    color:gray;
    display:block;
    font-weight:normal;
    height:23px;
    left:111px;
    overflow:hidden;
    position:absolute;
    top:58px;
    z-index:10;
  }
  
  header #header-picture{
    left:10px;
    position:absolute;
    top:5px;
    z-index:10;
    
    border:1px solid rgba(0, 0, 0, .3);
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
  }
  
    #header-picture .photo{
      border: 4px solid white;

      -webkit-border-radius: 3px;
      -moz-border-radius: 3px;
      -o-border-radius: 3px;
      border-radius: 3px;

      width:80px;
      height:80px;
    }
    
    #header-picture .photo:hover {
      -moz-transform:rotate(0deg);
      -webkit-transform:rotate(0deg);
      transform:rotate(0deg);
      
      -webkit-transition:-webkit-transform ease-in 1s;
      -moz-transition:-moz-transform ease-in 1s;
    }
  
  header #header-twittline{
    height: 38px;
    left: 0;
    overflow: hidden;
    padding: 3px 0px 0 5px;
    position: absolute;
    right: 0;
    top: 89px;
    z-index: 10;
  }
    #header-menu{
      overflow:hidden;
    }
    
    #header-menu ul li{
      display:block;
      float:left;
      
      padding-right:5px;
      padding-top: 10px;
      width:32px;
      position:relative;
    }
    
    #header-menu ul li a{
      color:#F5F5EE;
      overflow:hidden;
      float:left;
      display:block;
      margin-top:7px;
      height:32px;
      text-indent:-200px;
      width:32px;
      margin-left:2px;
      text-decoration:none;
      -webkit-transform:rotate(0deg) scale(1);
      -moz-transform:rotate(0deg) scale(1);
      
      -webkit-transition:-webkit-transform 0.8s linear,margin 0.5s linear;
      -moz-transition:-moz-transform 0.8s linear,margin 0.5s linear;
      transition:transform 0.8s linear,margin 0.5s linear;
    }
    
    #header-menu ul li a:hover{
      margin-top:-2px;
      -webkit-transform:rotate(15deg) scale(1.1);
      -moz-transform:rotate(15deg) scale(1.1);
      
      -webkit-transition:-webkit-transform 0.2s linear,margin-top 0.2s linear;
      -moz-transition:-moz-transform 0.2s linear,margin-top 0.2s linear;
      transition:transform 0.2s linear,margin-top 0.2s linear;
    }
    
    #header-twittline div#lastTweet{
      color:#FFFFFF;
      display:block;
      overflow:hidden;
      font-size:15px;
      font-weight:lighter;
      height:17px;
      
      right:0px;
      
      padding-right:98px;
      position:absolute;
      
      text-align:right;
      
      word-wrap: break-word;
    }
    
      div#lastTweet a{color:#97B5D5;text-decoration:none;}
      div#lastTweet a:hover{text-decoration:underline;}
    
  header #btnfollowMe{
    background:transparent url('../img/twitterBird.png') no-repeat scroll 0 0;
    height:98px;
    position:absolute;
    right:4px;
    top:61px;
    width:92px;
    z-index:11;
    text-decoration:none;
  }
  
      #twitter-followers{
        color:#FFFFFF;
        font-size:11px;
        font-weight:bolder;
        left:31px;
        opacity:0.6;
        position:relative;
        top:45px;
      }
      
  /* Animated header */
  #header-bg{
    overflow:hidden;
    position:relative;
    width:100%;
    height:100%;
  }
  
  .spriteS{
    background:url('../img/spriteSocial.png') no-repeat 0px 0px;
    width:16px;
    height:16px;
  } 
  
    .spriteS.delicious{background-position:-32px 0px;}
    .spriteS.twitter{background-position:0px 0px;}
    .spriteS.lastfm{background-position:-16px 0px;}
    .spriteS.lastfmNow{background-position:-16px 0px;}

  .ico_social{
    clear:left;
    opacity:1;
    padding:0 3px 0 0;
    vertical-align:bottom;
  }
  
  .content{
  }

  #left{
    float: left;
    margin-top: -120px;
    width: 25%;
    position:fixed;
  }

  #right{
    float: left;
    margin-top: -120px;
    width: 25%;
  }

  #right .rightC{
    position:fixed;
  }

  ul.menu{
    padding:0 5px 0 0;
  }

    ul.menu.right{
    padding:0 0 0 5px;
  }
    
      ul.menu li{
        text-align:right;

        border-right: 5px solid #C8D1E2;
        margin-bottom: 1px;
      }
      
      ul.menu.right li{
        text-align:left;
        border-right:0;
        border-left: 5px solid #C8D1E2;
      }
      
        ul.menu li a{ 
          font-size: 12px;
          cursor: pointer;
          color: #94A0C1;
          display:block;
          text-decoration: none;
          padding: 6px 6px 5px 0;
        }
        
          ul.menu.right li a{
            padding: 6px 0 5px 6px;
          }
        
        .menu li a.active{
          color: #627AAD;
          font-weight:bold;
        }

        .menu li a:hover{
          color: #627AAD;
          text-decoration:underline;  
        }

        

        .menu li:hover{
          border-color: #627AAD;
        }
        
        ul.menu li a.resetfilter{
          background-color:rgba(0, 0, 0, 0.7);
          color:rgba(255, 255, 255, 0.8);
        }
        
        ul.menu li a:hover{
          
        }
        
          ul.menu.right li a:hover{
            }
          
          ul.menu.left li a.active:hover{}
          ul.menu.right li a.active:hover{;}

  #center{
    margin-left:25%;
    float:left;
    width:50%;
    
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
    box-sizing:border-box;
  }
    /* style 1 */
    #center .post{
      border: 1px solid #C4CDE0;
      background: white;
      border-radius: 3px;
      border-bottom-width: 2px;
      margin:1em 0;

      font-size:1em;
      padding:3% 2% 3%;
      position: relative;
      overflow: hidden;

      clear:both;
      
      -moz-box-sizing:padding-box;
      -webkit-box-sizing:padding-box;
      box-sizing:padding-box;
    }
    
      #center .post.lastfm{
        padding:1% 2%;
      }
      
    
     ul.slider{
      margin:0;
      padding:0;
      position:absolute;
      white-space:nowrap;
      width:3500px;
      list-style:none;
    }
    
       ul.slider li.slider{
        float:left;
        width:600px;
      }

       .post .post_menu a.next{
        
      }
       .post .post_menu a.prev{
        
      }
      
     .post p a,
     .post p a:link{
      color:#2277BB;
      padding:2px 4px;
      font-size:10px;
      text-decoration:none;
      background-color:#ffffff;
      /*text-shadow:0px -1px 1px #444;*/
      
      -webkit-transition: background-color 0.3s linear;
      -moz-transition: background-color 0.3s linear;
      transition: background-color 0.3s linear;
    }
    
    .post:hover p a{
      background-color:#DDEEF6;
      -webkit-transition:background-color 0.1s linear;
      -moz-transition: background-color 0.1s linear;
      transition: background-color 0.1s linear;
      border-bottom:1px solid #88BBD4;
    }
    
    .post p a:hover,
    .post aside a:hover{
      text-decoration:underline;
      border-bottom:0px;
    }
    
    .post p a:hover{
    background-color:#ffffff;
    -webkit-transition: background-color 2s linear;
    -moz-transition: background-color 2s linear;
    transition: background-color 2s linear;
    }
       .post h2{
        color:#000000;
        font-size:14px;
        text-shadow:0 1px 1px #FFFFFF;
        white-space:normal;
        padding:0% 0% 1% 0%;
      }
      
       .post p{
        color:#555555;
        font-size:11px;
        letter-spacing:0;
        line-height:17px;
        padding-top:5px;
      }
      
       .post aside{
        display:block;
        position:absolute;
        right:0;
        top:0;
        
        -moz-box-sizing:padding-box;
        -webkit-box-sizing:padding-box;
        box-sizing:padding-box;
        opacity:0;
        -webkit-transition:opacity 2s linear;
      }
      
       .post:hover aside,
       .post *:hover aside{
        opacity:1;
        -webkit-transition:opacity 1s linear;
      }
      
         .post aside a,
         .post aside a:link{
          background-color:#88BBD4;
          color:#FFFFFF;
          float:left;
          font-size:10px;
          margin-bottom:5px;
          margin-right:3px;
          padding:5px 4px;
          text-decoration:none;
          text-shadow:0 1px 0 #5599BC;
        
          -moz-border-radius:0px 0px 4px 4px;
          -webkit-border-bottom-right-radius:4px;
          -webkit-border-bottom-left-radius:4px;
          border-radius:0px 0px 4px 4px;
          
          -webkit-transition:padding 0.05s linear;
        }
        
         .post aside a:hover{
          background-color:#90C6E0;
          padding-top:15px;
          text-decoration:underline;
        }

      
       .post img.sitePreview{
        float:right;
        margin:0 2px 2px 6px;
        padding:2px;
        clear:both;
        width:120px;
        height:90px;
        
        background:#EEEEEE url('../img/.png') no-repeat left top;
        box-shadow:0 2px 9px #111111;
        -moz-box-shadow:0 2px 9px #111111;
        -webkit-box-shadow:0 2px 9px #111111;
        
        -webkit-transition: opacity 0.5s linear;
      }
      
      .post p img.ico{
        vertical-align:top;
        margin-right:4px;
      }
      
      .post:hover .post_menu{
        opacity:1;
      }
      

      
       .additionnalContent_flickr{
        -webkit-transition: opacity 0.5s linear;
      }
      
        .additionnalContent_flickr .flickr_pic{
          /*background-color:#DDEEF6;*/
          clear:both;
          margin-top:10px;
          padding-top:10px;
          text-align:center;
        }
        
          .additionnalContent_flickr .flickr_pic img{
            border:2px solid #DDEEF6;
            -moz-box-shadow:0 0 11px #000000;
            -webkit-box-shadow:0 0 11px #000000;
            box-shadow:0 0 11px #000000;
          }
          
          .flickr_pic img:hover{
            border:2px solid #90C6E0;
            cursor:pointer;
          }
          
          .additionnalContent_flickr .flickr_pic p{
            color:#111111;
            font-size:12px;
            font-style:italic;
            line-height:22px;
            margin-left:25%;
            position:relative;
            text-align:center;
            width:50%;
            white-space:normal;
          }
    /*
      PERSONNALISATION DES ARTICLES SELON LA SOURCE
    
    */  
      #awaitingItems.post{
        padding:1% 1%;
      }
      
        #awaitingItems a{
          background-color:#FFFFCC;
          color:#000000;
          display:block;
          font-family:Helvetica,sans-serif;
          font-size:16px;
          font-weight:lighter;
          padding:2% 2% 1%;
          text-decoration:none;
          white-space:normal;
        }
        
        #awaitingItems a:hover span.awaitingTxt{
          text-decoration:underline;
        }
          #awaitingItems span.awaitingTxt{
            float:left;
          }
          
          #awaitingItems ul{float:left;margin:-1% 0 0 2%;}
          #awaitingItems ul li{float:left;padding-right:5px;}
          
          #awaitingItems ul li span, span.notif{
            -moz-border-radius:10px;
            -webkit-border-radius:10px;
            border-radius:10px;
            
            -moz-box-shadow:-1px 2px 6px #000000;
            background-color:#CE0805;
            border:2px solid #FFFFFF;
            color:#FFFFFF;
            font-family:serif;
            font-size:11px;
            font-weight:bold;
            left:22px;
            padding:2px 4px 0;
            position:relative;
            top:-8px;
          }
          
          #header-menu span.notif{
            left:21px;
            position:absolute;
            top:0;
            z-index:11;
          }
      
       .post.post_twitter{
        
      }
      
         a.stat{
          display:block;
          text-decoration:none;
          background-color:rgb(235,242,67);
          /*#EBF257;*/
          color:#111111;
          float:left;
          font-family:Helvetica;
          font-size:13px;
          margin-right:10px;
          padding:8px 0;
          text-align:center;
          text-shadow:0 1px 4px #EBF21E;
          width:50px;
          word-spacing:100px;
          line-height:1.2;
          border-color:1px solid rgb(235,242,20);
          
          border-radius:5px;
          -moz-border-radius:5px;
          -webkit-border-radius:5px;
        }
        
         a.stat:hover{
          box-shadow:-1px -1px 62px #FFFFFF;
          -moz-box-shadow:-1px -1px 62px #FFFFFF;
        }
        
    
    #center a#more{
      background:#00CC00 none repeat scroll 0 0;
      display:block;
      margin-bottom:5px;
      margin-left:5%;
      padding:10px 0;
      text-align:center;
      width:90%;
      text-decoration:none;
      background-color:#88BBD4;
      color:#FFFFFF;
      text-shadow:0 1px 0 #5599BC;
      -moz-border-radius:7px;
      -webkit-border-radius:7px;
      border-radius:7px;
      
    }
    
      #center a#more:hover{
        background-color:#90C6E0;
      }
    /* */
    
    .comments{
      
    }
      .comments .comment{
        border-bottom:1px solid #E5E5E5;
        padding:6px;
      }
    
      .comment .comment_flickr{
      
      }
      
      .comment aside{
        color:#A1A1A1;
        font-size:10px;
      }
      
        .comment aside p{
          float:left;
          font-weight:bold;
          margin-right:2px;
        }
        
        .comment aside time{
          float:left;
        }
        
      
      .comment p.comment_txt{
        display:block;
        text-align:left;
        clear:both;
        padding-top:8px;
        font-size:11px;
      }
    
    .comment_flickr_btn{
      background-color:#EEEEEE;
      color:#000000;
      display:block;
      margin:10px 0;
      padding:12px;
      text-decoration:none;
      
      border-radius:5px;
      -moz-border-radius:5px;
      -webkit-border-radius:5px;
      
      text-shadow:0 1px 1px #9F9F9F;
    }
  
    #right #sidebar{
      clear:both;
      display:block;
      height:18px;
    }
          
    #right .readers{
      
    }
    
      .readers .reader{
        float:left;
        border:2px solid #ffffff;
        margin-left:4px;
      }
      
        .reader img{
          
        }
        
    #right #page{
      display:none;
    }
    
    .content.scrolling #right #page{
      opacity:1;
      -webkit-transition: opacity 0.5s linear;
    }
    
    
    


/*footer{
  background:transparent url('../img/bg-grass.png') repeat-x scroll -7px 0;
  bottom:0;
  height:111px;
  left:0;
  position:absolute;
  width:100%;
  z-index:8;
  
  height:0px;
}*/

/* composants */
.tooltip{
  background-color:#FF00FF;
  border:2px solid black;
}

.tooltip-pointer-up,.tooltip-pointer-up-inner{
  position: absolute; 
  width:0; 
  height:0; 
  border-top-width: 0;
  background: none;
}

.tooltip-pointer-up { 
  border-left: 7px solid transparent; 
  border-right: 7px solid transparent;
  border-bottom-width: 14px;
  /*bottom: -14px;
  right: auto;
  left: 50%;
  margin-left: -7px;*/
}

.tooltip-pointer-up-inner {
  border-left: 5px solid transparent; 
  border-right: 5px solid transparent;
  border-top: 10px solid #fff;
  /*bottom: auto;
  top: -14px;
  left: -5px;*/
}


div.fg{
  background:#45A328 url('../img/fg-bg.png') repeat-x scroll 0 0;
  
  width:250px;
  
  border-top:0.005em solid #45A328;
  border-left:0.005em solid #45A328;
  border-right:0.005em solid #45A328;
  border-bottom-width:0px;
  
  height:40px;
  
  padding:0;
  margin:0;
  
  clear:both;
}
  div.fg.fg-Top{
    border-radius-topLeft:7px;
    border-radius-topRight:7px;
    -webkit-border-radius-topLeft:7px;
    -webkit-border-radius-topRight:7px;
    -moz-border-radius-topLeft:7px;
    -moz-border-radius-topRight:7px;
  }
  
  div.fg.fg-btn{
    border-radius:7px;
    -webkit-border-radius:7px;
    -moz-border-radius:7px;
  }
    div.fg.fg-btn .fg-b{
      border-radius-bottomLeft:7px;
      border-radius-bottomRight:7px;
      -webkit-border-radius-bottomLeft:7px;
      -webkit-border-radius-bottomRight:7px;
      -moz-border-radius-bottomLeft:7px;
      -moz-border-radius-bottomRight:7px;
    }
  
  div.fg div.fg-ico{
    background-color:#FFFFFF;
    float:left;
    height:20px;
    margin:10px 0 0 10px;
    width:20px;
  }
  
  div.fg span.fg-txt{
    color:#FFFFFF;
    display:block;
    float:left;
    font-family:Helvetica;
    font-size:17px;
    padding:13px 0 0 4%;
    text-shadow:0 -1px 0 #333333;
  }
  
  div.fg div.fg-b{
    height:20px;
    margin-top:20px;
    background:#006900 url('../img/fg-bg.png') repeat-x scroll 0 -20px;
  }

/* super de la 3D*/
.content_camera{
  -webkit-transition-property: -webkit-transform;
  -webkit-transition-duration: 5s;
  -webkit-transition-timing-function: cubic-bezier(0.2, 0.6, 0.6, 0.9);
  -webkit-transform: translate3d(0, 0, 0);
  
  -webkit-column-count:0;
  
  /*overflow:hidden;
  display:table-row;*/
}

.content_camera #right{
  display:none;
}

.content_camera, .content_camera *{
  -webkit-transform-style: preserve-3d;
}

.content_camera .center_view{
  -webkit-transform: translate3d(0px, 0px, 0px);
  -webkit-transition-duration: 550ms;
  -webkit-transition-property: -webkit-transform;
  -webkit-transition-timing-function: ease-out;
}

.center_view .post {
  display:table-cell;
  overflow:visible;
}

/* */
.sp{background: url(/img/iconsprite2.png) no-repeat top left;}
.spf{float:left;}
.sp32{background: url(/img/iconsprite2.png) no-repeat top left;display:inline-block;width:32px;height:32px;}
.sp16{background: url(/img/iconsprite2.png) no-repeat top left;display:inline-block;width:16px;height:16px;}
img.sp16, img.sp32{vertical-align:top;margin-right:4px;}

/* New via http://spritegen.website-performance.org/ */
.spblogger_16{ background-position: 0 0;  } 
.spblogger_32{ background-position: 0 -66px;  } 
.spdelicious_16{ background-position: 0 -148px;  } 
.spdelicious_32{ background-position: 0 -214px;  } 
.spdoyoubuzz_32{ background-position: 0 -296px;  } 
.spemail_16{ background-position: 0 -378px;  } 
.spemail_32{ background-position: 0 -444px;  } 
.spfacebook_16{ background-position: 0 -526px;  } 
.spfacebook_32{ background-position: 0 -592px;  } 
.spflickr_16{ background-position: 0 -674px;  } 
.spflickr_32{ background-position: 0 -740px;  } 
.spformspring_32{ background-position: 0 -822px;  } 
.splastfm_16{ background-position: 0 -904px;  } 
.splastfm_32{ background-position: 0 -970px;  } 
.splinkedin_16{ background-position: 0 -1052px;  } 
.splinkedin_32{ background-position: 0 -1118px;  } 
.spnetvibes_16{ background-position: 0 -1200px;  } 
.spnetvibes_32{ background-position: 0 -1266px;  } 
.sprss_16{ background-position: 0 -1348px;  } 
.sprss_32{ background-position: 0 -1414px;  } 
.spspotify_32{ background-position: 0 -1496px;  } 
.spthreewordsme_32{ background-position: 0 -1578px;  } 
.sptwitter_16{ background-position: 0 -1660px;  } 
.sptwitter_32{ background-position: 0 -1726px;  } 
.spvimeo_16{ background-position: 0 -1808px;  } 
.spvimeo_32{ background-position: 0 -1874px;  } 
