danielle_app/app/assets/stylesheets/public/structure.less

#background1 {
  position: fixed;
  top: 0; left: 0; 
  height:100%;
  overflow:hidden;
  width:100%;
	z-index: 1;
  img{
    width:100%;
    position:absolute;
    top:-100px;
  }  
  
}

#background {
	background: url(/background.png) repeat 5% 5%;
	position: fixed;
	top: 0; left: 0; right: 0; bottom: 0;
	z-index: 1;
  opacity:0.2;
}

#midground {
	background: url(/midground.png) repeat 20% 20%;
	position: fixed;
	top: 0; left: 0; right: 0; bottom: 0;
	z-index: 1;
  opacity:0.2;
}

#foreground {
	background: url(/foreground.png) repeat 90% 110%;
	position: fixed;
	top: 0; left: 0; right: 0; bottom: 0;
	z-index: 2;
  opacity:0.2;
}


#color_background{
background:rgba(233,229,226,1) url(/paper2.png);
position: fixed;
top: 0; left: 0; right: 0; bottom: 0;
z-index: 2;
opacity:0.97;

}

#top_anchor{
  position:absolute;
  top:0px;
  left:0px;
  display:none;
}

#bandeau{
  position:absolute;top:0px;left:0px;width:100%;z-index:4;padding-top:2em;
  .inner{
    padding-left:400px;
  }
}


#top{



//colors #394246 rgba(180,55,34,1) rgba(160,35,14,1) rgba(241,234,227,1)

@top_color : rgba(50,50,50,1);
@background-color :rgba(240,240,240,1);
@hover-background-color :@background-color;
@ac-background-color :@background-color;
@border-color:rgba(255,247,193,1);
background:@background-color url(/paper.png) left bottom;



@top_color : white;
@background-color :rgba(180,55,34,1);
@hover-background-color :rgba(160,35,14,1);
@ac-background-color :rgba(206,141,4,1);
@border-color:rgba(255,247,193,1);
background:@background-color url(/paper.png) left bottom;

h2{
font-size:3em !important;
a{
  color:white !important;
  }

}

  z-index:6;

  width:300px;
  height:100%;
  
  margin:auto;
  
  position:fixed;
  text-align:center;
  opacity:1;
  -webkit-transition-duration:0.5s;
  
  hr::after{
  
  color:@top_color;
  }
  
  &:hover{
  opacity:1;
  background-color:@hover-background-color; //rgba(228,126,88,1)
  }
  
  
  &.acceuil{
  box-shadow:0px 0px 5px rgba(0,0,0,0.5);
  background-color:@ac-background-color;
  
  }
  .inner{  
  
    overflow:auto;
    
    border-left:1px solid;
    border-right:1px solid;
    border-color:@border-color;
    height:100%;
    width:96%;
    margin:auto;
    
    }

  top:0px;
  left:50px;

  #logo{

    display:inline-block;
    
    margin-top:1.3em;
    padding:0px;
    height:60px;
    
    *{color:rgba(204,93,46,1);}
  }
  hr *{
  color:rgba(241,234,227,0.2);
  }
  #menu_top{
    *{color:rgba(27,27,27,1);}
  
    text-align:center;
    
    font-family:@font_title;
    
    
    
    
    margin:0px;
    margin-top:8px;


    text-align:center;
    padding:1px;
    a{
    font-size:1.2em;
      display:inline-block;
      padding:2px 5px;
      padding-top:10px;
      margin-top:15px;
      color:@top_color;
      text-decoration:none;

      border-bottom:1px dashed rgba(222,223,231,1);
      
      &.active, &:hover{
        
        border-bottom:1px solid rgba(222,223,231,1);
      }



    }
  }


}



#accueil{
position:absolute; 
z-index:3;
bottom:1em;
right:1em;

padding:1em;
margin-left:460px;
h3{
margin-top:0px;
color:white;
}

}

#main{

&.with_banner{
top:150px;

}
max-width:1060px;
padding:2em 0;
position:absolute;
z-index:3;
top:0px;
left:400px;
right:50px;
min-height:100%;
}

#large_place{
background:rgba(233,229,226,1);
position:fixed;
text-align:center;
top:0;
left:0;
width:100%;
height:100%;
z-index:7;
display:none;


}

@media only screen and (max-width: 1100px) {

#bandeau{

  
  .inner{
    padding-left:339px;
    
  }
}


#top{

left:-11px;
}
#main{
left:339px;
}
	
	
	
	
}


@media only screen and (max-width: 800px) {
#bandeau{
  position:static;
  
  .inner{
    padding-left:15px;
  }
}
#top{
  position:static;
  width:100%;
  
  .inner{
  border:0px;
  margin:0px;
  width:100%;
  
    border-bottom:1px solid rgba(241,234,227,1);
    padding-bottom:0.5;
    margin-bottom:0.5em;
  }
  
  hr{
  display:none;
  }
  
  &.active{
  hr{
  display:block;
  }
  .inner{
 
  padding-bottom:2em;
    margin-bottom:0.5em;
  }
  
  #menu_top{
  display:block;


  }
  
  }
  
}

#menu_top{
display:none;


}

#main{
  position:static;
  padding:1em;

}

.large_content{
position:relative;
z-index:4;

}
	
	
}