/*
Theme Name: The HTML5 Reset Theme
Theme URI: http://html5reset.org
Description: A style-free theme to get you started on an HTML5-based WordPress theme of your own.
Author: Monkey Do! + @ckhicks
Author URI: http://monkeydo.biz
Version: 2.0
*/

.chromeframe {position: absolute; top: 0;}

/* Ok, this is where the fun starts.
-------------------------------------------------------------------------------*/

/* A Linux- and Windows-friendly sans-serif font stack: http://prospects.mhurrell.co.uk/post/updating-the-helvetica-font-stack */
body {font: 13px 'Trebuchet MS', Geneva, sans-serif; background-image:url('http://www.accent-ergonomie.fr/wp-content/uploads/2014/11/fond.png');}

/* Using local fonts? Check out Font Squirrel's webfont generator: http://www.fontsquirrel.com/tools/webfont-generator */

/* We like off-black for text. */
body, select, input, textarea {color: #333;}

a {color: #cc0000; text-decoration:none;}
a:hover {color: #ff1a1a; text-decoration:none;}

/* Custom text-selection colors (remove any text shadows: http://twitter.com/miketaylr/status/12228805301) */
::-moz-selection{background: #fcd700; color: #fff; text-shadow: none;}
::selection {background: #fcd700; color: #fff; text-shadow: none;}

/*	j.mp/webkit-tap-highlight-color */
a:link {-webkit-tap-highlight-color: #fcd700;}

ins {background-color: #fcd700; color: #000; text-decoration: none;}
mark {background-color: #fcd700; color: #000; font-style: italic; font-weight: bold;}

/* Mozilla dosen't style place holders by default */
input:-moz-placeholder { color:#a9a9a9; }
textarea:-moz-placeholder { color:#a9a9a9; }


/* And here begins the WordPress fun.
-------------------------------------------------------------------------------*/

#wrapper {width: 100%;}
.full-container {max-width:900px; position:relative; margin: auto auto;} /* Position relative permet la positionnement absolu à l'intérieur du block */
.description {position:absolute; right:0px; top:50%; font-color:#4b4b4b; font-style:italic; font-size:1.2em;}
#header {padding: 1em 2em; background-color:rgba(255,255,255, 0.85);}
#header h1 {width:180px;}
nav {background: none repeat scroll 0% 0% #343538; font-size: 13px;}
nav a {color: #E2E2E2; display: block; font-weight: bold; text-decoration: none;}
nav a:hover {background: none repeat scroll 0% 0% #7a0000; color:#fff;}
nav ul {list-style:none outside none; margin:0px;}
nav ul:after {clear: both; content: ""; display: table;}
nav ul li {position:relative; display:block; float:left;}
nav ul li a {transition: all 0.4s ease 0s; box-sizing: border-box; padding: 15px 20px;}

#main {padding: 1em 2em;background-color:rgba(255,255,255, 0.65);font-size:11pt;}
p{line-height:1.3;margin-bottom:10px;}
h1{color:#AA0000 ; font-size:150%;font-style:italic;margin-top:5px;margin-bottom:10px;}
h2{color:#AA0000 ; font-size:130%; margin-top:15px;margin-bottom:5px;}
ul{list-style-type: square;padding-left:25px;line-height:1.4;}

#presentation {width:100%;}
#presentation table{width:100%;display:table;border-collapse:separate;margin-top: 15px; margin-bottom:15px;}
#presentation table tr{display:table-row; text-align:center;}
#presentation table td{display:inline-block; border-radius:10px;text-align:center;padding:10px;margin-left:15px;margin-top:5px;margin-right:15px;vertical-align:middle;background-color:rgba(255,255,255,0.6);}
#presentation table td img{height:75px;}
#presentation table td h2{color:#343538 ;font-size:130%;margin-top:5px;}
#presentation table td h3{color:#343538 ;font-size:110%;font-style:italic;}

#footer {background: none repeat scroll 0% 0% #343538; font-size: 13px; color: #E2E2E2; padding: 1em 2em; text-align:center;}
#references {text-align: center;}
#references h2 {text-align: left;}
#references img {width:20%;height:auto;max-height:100px;width:auto;max-width:200px;margin-left:2%;margin-right:2%;margin-top:5px;margin-bottom:5px;vertical-align:middle;}

form {width:60%;padding-left:20px;}
form input{border:1px solid #333;margin:0;padding:0;}
form textarea {border:1px solid #333;}
form input #submit{background-color:#AA0000;}


/* Print styles!
-------------------------------------------------------------------------------*/
@media print {

}


/* Media queries!
-------------------------------------------------------------------------------*/

/* Always do mobile-first, and consider using em units: http://blog.cloudfour.com/the-ems-have-it-proportional-media-queries-ftw

@media screen and (min-width: 480px) {

} */