@import "http://fonts.googleapis.com/css?family=Noto+Sans:400,700,400italic,700italic|Kelly+Slab";

.body {
    background-attachment: fixed;
    background-color: #f1f2f3;
  /*  background-image: url("http://u.jimdo.com/www72/o/scab93e0a6280bb96/img/i5fa95e415a888692/1422028660/std/image.jpg");*/
    background-position: center top;
    background-repeat: no-repeat;
    background-size: auto auto;
}
div#tp-shaddow {
    width: 970px;
}
div#tp-container {
    position: relative;
    width: 970px;
    margin:0 auto ;
    padding: 0px 0 40px 0;  
}


div#tp-emotion {
	width:970px;
	margin:0 auto;
	border:none;
}
.content {
    box-sizing: border-box;
    margin: 0 auto;
    max-width: 1100px;
    padding: 50px 10px;
}
.content-options {
    background-color: #f1f2f3;
    width: 100%;
}




.sidebar-options {
    background-color: #f1f2f3;
    color: #333;
    min-height: 150px;
    padding: 20px 10px;
}
.sidebar-options > div {
    margin: 0 auto;
    max-width: 1100px;
}



div#tp-sidebar {
    width: 150px;
    float:right;
font-size: 12px;
margin-top: 60px;
}


div.blogselection {
display: block;
width: 100%; 
}

div.n.clearover.j-blogarticle {
width: 30%; /* la largeur des articles */
height: 250px;
min-height:25px;
  float: left; /* permet d'en avoir plusieurs par ligne et donc d'avoir des colonnes */
   margin-left: 3px ;
   margin-right: 3px;
   margin-bottom: 5px;
   margin-top: 5px;
background-color: #DCDCDC;
 } 

div.blogselection h1 a, div.post h1.post-title a { 
text-decoration: none !important;
font-size: 20px;
} 


/*  Navigation jimdo cachee
----------------------------------------------- */
#navigation
{
    float:left;
    width:220px;
    padding:0px;

}

/* Navigation cacher menu jimdo */

   .cacher{display:none;} 

/* menu */


#menu-deroulant, #menu-deroulant ul {
    padding: 0;
    margin: 0;
    list-style: none;
white-space:nowrap;
}

#menu-deroulant {
/* on centre le menu dans la page */
    text-align: center;
position: absolute; /* ou absolute ça dépend de ton design */
z-index: 10; /* A adapter au besoin permet d afficher le menu par dessus*/
margin-right: auto; 
margin-left: 0%; 
margin-top: 20px;


}
#menu-deroulant li {
/* on place les liens du menu horizontalement */
    display: inline-block;
width: 105px;
border-radius:0px 0px 0 0;

}
#menu-deroulant ul li {
/* on enlève ce comportement pour les liens du sous menu */
display: inherit;
border-radius:0;
margin:0px 0 2px 0;
}

#menu-deroulant ul {
    position: absolute;
 width: 100px; 
/* on cache les sous menus complètement sur la gauche */
left: -999em;
 text-align: center;

-moz-transition: .8s all .3s;
-webkit-transition: .8s all .3s;
transition: .8s all .3s;
}

#menu-deroulant li:hover ul {
/* Au survol des li du menu on replace les sous menus */
    left: auto;
border-radius:0;

}
#menu-deroulant ul li:last-child{
border-radius:0 0 0px 0px;
}
#menu-deroulant li:hover ul{
max-height:50em;
}

/* background des liens menus */


#menu-deroulant li:first-child{
background-color: #2b75d2;
background-image:-webkit-linear-gradient(top, #2b75d2 0%, #2b75d2 100%);
background-image:linear-gradient(to bottom, #2b75d2 0%, #2b75d2 100%);

}
#menu-deroulant li:nth-child(2) {
    background-color: #7749ba;
background-image:-webkit-linear-gradient(top, #7749ba 0%, #7749ba 100%);
background-image: linear-gradient(to bottom, #7749ba 0%, #7749ba 100%);
}
#menu-deroulant li:nth-child(3){
background-color: #f09135;
background-image:-webkit-linear-gradient(top, #f09135 0%, #f09135; 100%);
background-image:linear-gradient(to bottom, #f09135 0%, #f09135; 100%);
}
#menu-deroulant li:nth-child(4){
background-color: #fdb406;
background-image:-webkit-linear-gradient(top, #fdb406 0%, #fdb406; 100%);
background-image:linear-gradient(to bottom, #fdb406 0%, #fdb406; 100%);
}
#menu-deroulant li:nth-child(5){
background-color: #ae650b;
background-image:-webkit-linear-gradient(top, #ae650b 0%, #ae650b 100%);
background-image:linear-gradient(to bottom, #ae650b 0%, #ae650b 100%);
}
#menu-deroulant li:nth-child(6){
background-color: #389F27; 
background-image:-webkit-linear-gradient(top, #389F27 0%, #389F27 100%);
background-image:linear-gradient(to bottom, #389F27 0%, #389F27 100%);
}

#menu-deroulant li:nth-child(7){
background-color: #b5ca41;
background-image:-webkit-linear-gradient(top, #b5ca41 0%, #b5ca41 100%);
background-image:linear-gradient(to bottom, #b5ca41 0%, #b5ca41 100%);
}
#menu-deroulant li:nth-child(8){
background-color: #C72C48;
background-image:-webkit-linear-gradient(top, #C72C48 0%, #C72C48 100%);
background-image:linear-gradient(to bottom, #C72C48 0%, #C72C48 100%);
}


#menu-deroulant li:last-child{
background-color: #f69807;
background-image:-webkit-linear-gradient(top, #f69807 0%, #f69807 100%);
background-image:linear-gradient(to bottom, #f69807 0%, #f69807 100%);
}
/* background des liens sous menus */

#menu-deroulant li:first-child li{
background:#4e8cd9;
}
#menu-deroulant li:nth-child(2) li{
background:#8d67c5;
}
#menu-deroulant li:nth-child(3) li{
background:#f0aa66;
}
#menu-deroulant li:nth-child(4) li{
background:#f4c75a;
}

#menu-deroulant li:nth-child(5) li{
background:#9F391A;
}
#menu-deroulant li:nth-child(6) li{
background:#57D53B;
}
#menu-deroulant li:nth-child(7) li{
background:#677F35;
}
#menu-deroulant li:nth-child(8) li{
background:#E9383F;
}
#menu-deroulant li:last-child li{
background:#fbbd5f;
}
/* background des liens menus et sous menus au survol */
#menu-deroulant li:first-child:hover, #menu-deroulant li:first-child li:hover{
background:#2b75d2;
}
#menu-deroulant li:nth-child(2):hover, #menu-deroulant li:nth-child(2) li:hover{
background:#7749ba;
}
#menu-deroulant li:nth-child(3):hover, #menu-deroulant li:nth-child(3) li:hover{
background:#f09135;
}
#menu-deroulant li:nth-child(4):hover, #menu-deroulant li:nth-child(4) li:hover{
background:#fdb406;
}
#menu-deroulant li:nth-child(5):hover, #menu-deroulant li:nth-child(5) li:hover{
background:#ae650b;
}
#menu-deroulant li:nth-child(6):hover, #menu-deroulant li:nth-child(6) li:hover{
background:#389F27;
}
#menu-deroulant li:nth-child(7):hover, #menu-deroulant li:nth-child(7) li:hover{
background:#b5ca41;
}
#menu-deroulant li:nth-child(8):hover, #menu-deroulant li:nth-child(8) li:hover{
background:#C72C48;
}

#menu-deroulant li:last-child:hover, #menu-deroulant li:last-child li:hover{
background:#f69807;
}
/* les a href */
#menu-deroulant a{
text-decoration:none;
display:block;
padding:1px;
color:#fff;
font-family:arial;
font: bold 12px;
}
#menu-deroulant ul a{
padding:0px 0;
}
#menu-deroulant li:hover li a{
color:#fff;
font: bold 12px;
text-transform:inherit;
}
#menu-deroulant li:hover a, #menu-deroulant li li:hover a{
color:#fff;
border-color:#fff;
 font: bold 12px;
}