/*Avril 2010*/

/* #2D1910 marron foncé
#502C1D marron moyen
#924A29 marron clair
#6F90AF bleu (photofiltre)
#5785AF bleu (html)*/ 

html, body {
margin:0;
padding:0;
}
body{
font-family: "trebuchet ms", helvetica, arial, sans-serif;
background:white url(/images/mammouth/mammouth3.png) no-repeat fixed right bottom; 
min-width:800px;
} 

/*font-face*/
@font-face {
font-family: 'quadranta'; 
src:  url('/images/mammouth/quadranta-bold.eot?') format('eot'),  
url('/images/mammouth/quadranta-bold-webfont.woff') format('woff'), 
url('/images/mammouth/quadranta-bold-webfont.ttf') format('truetype'), 
url('/images/mammouth/quadranta-bold-webfont.svg#quadranta') format('svg');
font-weight:normal;
font-style:normal;
}

/* titres, paragraphes, liens*/
h1 {
font-family:quadranta, sans-serif; 
font-size:3em;  
margin:120px 10px 0 0;	
text-shadow:1px 1px 5px #A9A9A9;
}
h2 { 
font-family:quadranta, sans-serif;	 
font-size:1.5em; 
} 
h3 { 
font-size:1.25em; 
margin:0; 
} 
h4 {
text-align:center;
font-size:1.15em;
}
h5 {
font-size:1.0em;
} 
p, li, dd, dt {
font-size:0.9em;
line-height:1.4em;
} 
dt {
color:#F37100;
font-size:0.95em;
margin-bottom:10px;
}
dd.comments {
font-style:italic;
margin-top:10px;
border:none !important;
}
table, th, td {
border:1px solid black;
border-collapse:collapse;
}
a {
color:#502C1D;
}
a:visited {
color:#924A29;
}
a:hover, a:active, a:focus {
color:#502C1D;
text-decoration:none;
}  
a[hreflang]:after {
content: " [" attr(hreflang) "] "; 
}

h1 a, h1 a:visited, h1 a:hover  {
text-decoration:none;
color:#502C1D;
}
img, a img {
border:0
} 

code {
font-family:'courier new',	monospace;
color:#DC143C; 
font-size:1.05em;
} 
pre {
font-family:'courier new', monospace; 
color:#DC143C;
font-size:0.95em;
line-height:1.4em;
overflow:auto;
}
input {
border:1px solid #F3B67F; 
padding:3px;
border-radius:4px; 
}
q {
font-style:italic;
}
blockquote { 
background-color: #C7D3E6;
padding:10px;
box-shadow:2px 2px 5px #A9A9A9;
}
blockquote p {
font:1em/1.5em georgia, times, serif; 
text-shadow:1px 1px 1px white;
}
blockquote.tweet {
background:#C7D3E6 url(/images/Twitter.png) no-repeat right bottom;
}
span[hreflang] {
font-style:italic;
}
/*html5*/ 
nav, section, article, aside, header, footer, hgroup { 
display:block;	
} 
/* en tête*/	 
header {
margin:0;
padding:1px 10px 30px 50px;
margin-bottom:5%;
} 
header h2 {
color:#567AAF; 
margin:0;
}			  
header p {
margin:0;
padding:0; 
}
header p a, header p a:visited {
font-size:0.8em;
color:#5785AF; 
} 
header p a:focus, header p a:hover, header p a:active {
color:white;
}
header nav {
position:fixed;
z-index:50;		
top:0;
right:0;
width:100%;
background-color:#502C1D;
box-shadow:-2px 2px 2px #A9A9A9;
opacity:0.95
}
header nav ul {  
width:500px;
margin:10px auto;
height:30px;
}
header nav li {	
font-size:0.9em;
list-style-type:none;
float:left; 
text-align:center;
line-height:20px;	 
text-shadow: 1px 1px 1px black;
}					  
header nav li a, header nav li a:visited { 
display:block;	
width:100px;
padding:5px; 
color:white;  
text-decoration:none;
}  
header nav li a:focus, header nav li a:hover, header nav li a:active { 	
background-color:rgba(255,255,255,0.3);
color:white;
border-radius:5px;
transition:all 0.5s linear;
} 
/*article */

/*menu navigation*/	
#menu {	  
width:200px;
float:right; 
background-color:#DCDCDC; 
padding-left:50px;
}	   
#menu h2 {	  
font-size:1.1em;
}	

/* blocs page accueil*/
.page1 {
margin:0 100px 8% 20px; 
}	
#blog h3, #css h3 {
font-family:quadranta, 'trebuchet ms', helvetica, arial, sans-serif; 
color:black; 
border-bottom:1px solid black; 
line-height:48px;
} 
#blog h4, #css h4 {
min-height:46px;
color:#F37100; 
}
#blog h4 + h4, #blog p + h4, #css h3.accueil {
text-align:left;
color:black; 
font-family: "trebuchet ms", helvetica, arial, sans-serif;
font-size:1em;
min-height:0;
border:none;
}	   
#blog, #css {  
padding:5px 10px;   
background-color:rgba(255,255,255,0.8);  
border:1px solid white;
padding-top:0; 
} 
#blog, #css {
width:33%;
}
#blog {	 
margin-left:43%;
}
#css { 
float:left;	
margin-left:20px;	
} 
#css img.rss, #blog img.rss {
float:right;
}  								 
#css p.suite, #blog p.suite {
margin-top:30px;
}
#css p.suite a, #blog p.suite a {
background-color:#FFD89D;
border:1px solid #F3B67F;
text-decoration:none; 
border-radius:5px;
padding:5px;
}	   
/*#css p.suite a:after, #blog p.suite a:after { 
content: " " attr(title);
}*/
#css p.suite a:focus, #blog p.suite a:focus, #css p.suite a:hover, #blog p.suite a:hover, #css p.suite a:active, #blog p.suite a:active {
border:1px solid #F37100;
}

/*blocs pages blog*/ 
.page {
margin:0 100px 8% 150px;  
}	
#content {  
padding:5px;   
background-color:rgba(255,255,255,0.8); 
width:70%; 
max-width:800px;
margin-left:15px;	
}  
#content h2 {
font-size:2.1em;
}
#content h2 span {	
font-family: 'courier new', courier; 
opacity:0.85;
} 
#content h2.dateblog {
position:absolute;
width:120px;
left:30px;
text-align:center;
border-right:2px solid black; 
font-size:1.3em; 
margin-top:7px;
} 
#content h2.dateblog a {
color:black;
text-decoration:none;
}
#content h2.dateblog a span {
display:block;
font-family:quadranta, sans-serif; 
opacity:1;
}
#content h3 {
font-size:1.40em; 
}
#content h3, #content h3 a {
margin:35px 0;
color:#F37100;
text-decoration:none;
} 
#content h3 a:hover, #content h3 a:active, #content h3 a:focus {
text-decoration:underline;
} 
#content h4 {
text-align:left;
}  
#content .zonecomments {   
background-color:#FFD89D;
box-shadow:2px 2px 10px #A9A9A9;  
border-radius:5px; 
margin-top:50px;
} 
#content li {
margin-bottom:0.3em;
}
#content a[href^="http"]:after { 
content: " " url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAMAAABhq6zVAAADAFBMVEX///9QLB0AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADI+EV7AAAAAXRSTlMAQObYZgAAAAlwSFlzAAALEgAACxIB0t1+/AAAAC9JREFUeNp9irEBACAMwsL/T1uxaCeZSAAcOTCISbQ5i+IJ9IpuN26gHzz5g6T6AhNwADvhKQLSAAAAAElFTkSuQmCC);
}
#content a[href$=pdf]:after { 
content: " " url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAKCAIAAAAhCwk/AAAACXBIWXMAAAsSAAALEgHS3X78AAAA3UlEQVR42q2QTQ6CMBSEuYCBC3gAE6PEAIJQFFDAH9TrehJP4YKu6qJ5tvZZK7oT8tF0XmcmBes8HvaCJd7LYPAnWHS1bQUYj5h35LdBB7Ho5jgKdaw3Wv6cmGBR60XUX7SjifJR1zNjdDanbvAxmXqIF7VPsIjFK5ZkzPXx0ve7GWNBzPxF52PFnocpC4nIwvaIRbyoJSHRDh4teRC/ZZia1WrCScHzSgShbrAINjtJkqFbnL3kx79/GWSviijeRXUjKfeQlXLVcrmGJAeSQ1pAXkF16HoUuxMW9cID8n88j86zy6oAAAAASUVORK5CYII=);
}  
#content a[href$=odt]:after { 
content: " " url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAKCAIAAAAhCwk/AAAACXBIWXMAAAsSAAALEgHS3X78AAAAbUlEQVR42mMI0JGlCmIAYdMsChEWg/7DAET8PxLAJYJkkP9cCIJLIzPgCjBF4AhmUNxuCIIqQmLjF4EjmEGFDyEIqgiJjVUE4S+YRphBDf8hCKfXYLJoInCEbhDcLLhq9KBt+E+sQeQhqEFUQQDAxDLiAtbT/QAAAABJRU5ErkJggg==);
} 
#content a[href$=ods]:after { 
content: " " url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAKCAIAAAAhCwk/AAAACXBIWXMAAAsSAAALEgHS3X78AAAAdUlEQVR42mMI0JGlCmIAYQ0RChHMIBs5OPoPAxDx/0gAlwgQwQzyUoUguDQyA64AUwSOYAZF60EQVBESG6sIiovAUjCDCi0gCCqHxMYUwaoYZlCHCwTh9BpMFk0xnAszaH4AHKE4G4mLRwSIsBhEHoIaRBUEAEOWBUzV9tL6AAAAAElFTkSuQmCC);
} 
#content a[href$=odp]:after { 
content: " " url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAKCAIAAAAhCwk/AAAACXBIWXMAAAsSAAALEgHS3X78AAAAf0lEQVR42mMI0JGlCmIA4pZIBgoR1KCpqQxw9B8GIOL/kQAuESCCGrSujAGC4NLIDLgCNBFkKahBx9oYIAgih8zGI4IsBTXo/nQGCILIIbOxiiB7DSIFNejLUgYIwuU1uCyaCBxBDfq/lgWBkGxD5iKLoGtZy4LNILIQ1CCqIADofEwySI9+kwAAAABJRU5ErkJggg==);
} 
#nav2 {
padding-left:10px;
min-width:225px;
}
#nav2 h2, #nav2 p {
text-align:center;
}
#nav2 h2 a {
text-decoration:none;
color:black;
}
#nav2 p {
font-size:0.8em
}
#nav2 li {
list-style-type:none;
margin-left:-5px;
line-height:1.6em;
}
#nav2 li a {
display:block;
}
/*commentaires*/ 
.zonecomments fieldset {
border:1px solid #FFD89D; 
padding:0 20px;	
} 
.zonecomments p.bla {
margin:0 25px;
} 
.zonecomments p.pasbla {
margin:0 25px;
padding: 20px 0; 
text-align: center;
} 
article.mois section.zonecomments{
margin-bottom:50px;
padding:1px;
}
#commentaires legend {
color:#502C1D;
font-weight:bold;
font-size:110%;	
padding-top:20px
}
#commentaires label {
display:block; 
margin-top:10px; 
font-size:90%;
} 
#commentaires input[type=text], #commentaires input[type=email], #commentaires input[type=url], #commentaires textarea, #commentaires input[type=submit] {	
border:1px solid  #F37100; 	  
background-color:white; /*pour opera*/ 
} 
#commentaires input[type=text], #commentaires input[type=email], #commentaires input[type=url] {	
width:50%;
}
#commentaires textarea {	
width:90%;	
}
#commentaires input[type=submit] {   
background-color:#502C1D;
color:white;
border:none;
text-shadow: 1px 1px 1px black;	
box-shadow:1px 1px 5px black;
}
#content .comments {
padding:3px 10px; 
border-bottom:1px solid #F37100;
} 
#content .comments p {
color:black;
}
#content .comments p.auteur {
font-weight:bold;
color:#502C1D;
}
/*#content .comments p:before { 
content:'« '
}
#content .comments p:after { 
content:' »'
} */
#content .comments p.auteur:before, #content .comments p.auteur:after { 
content:""
} 

/*recherche*/
#search p { 
margin-left:20px; 
font-weight:bold;
padding-top:50px;
}
#search input[type=text] {
background-color:#FFD89D;
}
#search input[type=text]:focus {
background-color:white;	
} 
#search input[type=submit] {
background-color:#502C1D;
color:white;
border:none;
text-shadow: 1px 1px 1px black;
width:50px;	
box-shadow:1px 1px 5px black;
}

/* pied de page */ 	
#mammouth, #follow, #standards, #grain {
display:inline-block; 
vertical-align:top;
margin-right:4%;
text-align:left; 
width:170px; 
} 
#mammouth {
margin-left:4%;
}
footer {
background: url(/images/mammouth/footer.png) repeat-x; 
color:white; 	
padding:10px 0; 
clear:both;	
text-align:center;
} 
footer h2 {
color:white;
margin:10px 0;
text-shadow: 1px 1px 1px #2D1910; 
font-size:1.4em;
}  
footer li {
list-style-type:none;
display:block;
margin-left:-40px;
padding-left:0;
line-height:28px;
border-bottom:1px solid #924A29; 
text-shadow: 1px 1px 1px #2D1910; 
font-size:0.9em;
} 
footer li a, footer li a:visited {
color:white;	
text-decoration:none;
display:block; 
padding-left:3px;
} 
footer li a:hover, footer li a:active, footer li a:focus {
color:white;	
text-decoration:none;
background-color:#924A29;
transition:background-color 0.4s linear;
} 
footer p.info {	
clear:both;
text-align:center;	
background-color:rgba(255,255,255,0.8); 
margin:150px auto 0 auto;
color:#502C1D; 
line-height:25px;	
width:250px;
}
/* divers */
.center {
text-align:center
}	
.chemin {
background:whitesmoke;
}  
.photo p img {
box-shadow:2px 2px 5px #696969;
border:1px solid black;
}
.photo p { 
text-align:center;
margin:35px 0;
}
.skip {
position:absolute;
left:5px;
font-size:0.7em;
top:0;
z-index:100;	 
}
p.skip, .skip a {
color:#924A29
} 
.skip a:hover, .skip a:active {
color:#fff;	 
opacity:0.95;
}  
p.ancre {
text-align:center;
}
p.ancre:before {
content:"[ ";
}
p.ancre:after {
content:" ]";
}
.voir:before {
content:url(/images/voir.png) " ";
} 
.haut {
text-align:right;
} 
.haut:after {
content:" " url(/images/up.png);
}
.note {
font-size:0.9em;
font-style:italic;
text-align:right;
}
/* media queries */
@media only screen and (max-width:960px) {  
body {
background:url(/images/mammouth/mammouth3.png) no-repeat scroll right bottom;	
} 
header {
padding:0;
}
header hgroup {
padding-left:30px;
}
header nav {
position:static; 	
width:100%;
margin:0;
padding:1px;
} 
header nav ul { 
width:500px;
margin:10px auto;
height:30px;  
}
header nav li {	
font-size:0.9em;
list-style-type:none;
float:left; 
text-align:center;
line-height:20px;	 
text-shadow: 1px 1px 1px black;
}	
#content {
width:100%;
} 
#blog, #css {
width:100%; 
margin:auto;
}  
#mammouth {
margin-left:0.5em;
}
#mammouth, #follow, #standards, #grain {
margin-right:0.5em;
} 	  
footer p.info {	
padding:5px
}
.skip {
top:40px; 
}
.page {
margin:0 50px 8% 150px;  
}
} 
@media only screen and (max-device-width:960px) {
body {
font-size:120%;
} 
header nav ul {  
width:600px;
}			  
header nav li a { 
width:130px;
} 
#blog p, #css p, article p, article li, article pre {
font-size:1.3em;
} 	
.page {
margin:0 20px 8% 20px;  
}
#content {
width:100%;
}
#content h2.dateblog {
position:static;
width:300px;
text-align:left;
border-right:0; 
margin-top:0;
} 
#content h2.dateblog a span {
display:inline !important;
}
pre {
word-wrap:break-word;
} 
}