body{
    font-family: sans-serif;
    color: #555;
    background-color: #eee;
    line-height : 1.5em;
}

header, footer {
    line-height: 2;
	text-align: center;
	color: #555;
	background-color: #333;
	border: 1px solid rgba(225,0,0,0.7);
}
h1 {
    font-size: 2.5em;
    color: #DD5735;
}

h2{
    
    font-size: 2em;
    color: #333;
}
h3 {
    font-size: 1.5em;
}
.container {
	max-width: 1100px;
	margin-left: auto;
	margin-right: auto;
	background-color : #FFF;
    border: 1px solid rgba(105,105,105,0.5);
}
*{
    box-sizing : border-box;
}
.bg-large {
    background-image: url(large.jpg);
}
.bg-small{
    background-image: url(small.jpg);
}
.repeat{
    background-repeat : repeat;
}
.no-repeat{
    background-repeat : no-repeat;
}
.repeat-x{
    background-repeat : repeat-x;
}
.repeat-y{
    background-repeat : repeat-y;
}
.contain{
    background-size: contain;
    background-repeat : no-repeat;
}
.cover{
    background-size: cover;
    background-repeat : no-repeat;
}
.fifty{
    background-size: 50%;
    background-repeat : no-repeat;
}
.eighty{
    background-size: 80% 40%;
    background-repeat : no-repeat;
}
.center{
    background-position: center;
    background-repeat : no-repeat;
}
.right-top{
    background-position: right top;
    background-repeat : no-repeat;
}
.right-bottom{
    background-position: right bottom;
    background-repeat : no-repeat;
}
.fourty{
    background-position: 80% 40%;
    background-repeat : no-repeat;
}












.bloc{
    padding: 2em;
    background-color: teal;
    max-width: 40em;
    min-height: 20em;
    color: #fff;

}
p {
    display: block;
    margin: 1em 1em 0px 0px;
}
pre{
    display: block;
    font-family: monospace;
    white-space: pre;
    margin: 1em 0px;
}
.code {
    padding: 0.5em;
    font-family: Monaco, monospace;
    font-size: 14px;
    color: #000;
    background-color: #ddd;
    border: 1px solid #bbb;
}
article{
    margin : 2em;
    display : block;
}