/* ***** BEGIN LICENSE BLOCK *****
 * This file is part of DotClear.
 * Copyright (c) 2004 Samuel Latchman and contributors. All rights
 * reserved.
 *
 * DotClear is free software; you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation; either version 2 of the License, or
 * (at your option) any later version.
 * 
 * DotClear is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU General Public License for more details.
 * 
 * You should have received a copy of the GNU General Public License
 * along with DotClear; if not, write to the Free Software
 * Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA  02111-1307  USA
 *
 * ***** END LICENSE BLOCK *****
 *
 * Contributor(s):
 *  Olivier Meunier, Julien Carnot
 */


body {
color:#000;
background:#FFF url(img/background.png) repeat-x;
background-image: linear-gradient(to bottom, #E5ECFF 0%, #FFF 40% );
font-family:Ubuntu,Arial,Verdana,sans-serif;
font-size:90%;
text-align:justify;
margin:0;
padding:0
}

p {
background:transparent;
color:#000;
font-size:1em;
line-height:150%;
margin:0 0 1em
}

a:visited {
background:transparent;
color:#8FABFF
}

a[hreflang]:not([hreflang="fr"]):after {
font-size:.7em;
content:"[" attr(hreflang) "]";
margin:0 0 0 .5em
}

/*a:not([href^="/"]) {
background:url(img/external.png) center right no-repeat;
padding-right:13px
}

.feed a, a[href^="http://www.flickr.com/photos/"] {
background:transparent;
padding-right:0
}
*/
a[href$=".pdf"] {
background:url(img/ico_pdf.png) no-repeat right bottom;
padding:4px 1.5em 0 0
}

h1 {
font-size:2em;
margin:0
}

h2 {
font-size:1.4em;
font-weight:400;
margin:.5em 0 .3em;
clear:both
}

h2.post-title{margin:0 0 1em}

h3 {
font-size:1.2em
}

h4 {
font-size:1.1em;
margin:.5em 0 .2em
}

h5 {
font-size:1em;
text-indent:0;
margin:0
}

hr {
background:transparent;
border:none;
color:navy;
height:1px;
text-align:center;
width:75%
}

code {
background:transparent;
color:#5C5C5C;
font-family:"Courier New",Courier,monospace
}

pre {
background:transparent;
color:#000;
font-family:Georgia,"Times New Roman", "Times", serif;
font-size:1em
}

ins {
color:#5C5C5C;
text-decoration:none
}

ins:before {
color:#5C5C5C;
width:29%;
position:relative;
top:-5em;
left:33%;
content:"— Mise à jour: "
}

ins:after {
color:#5C5C5C;
content:" —"
}

q {
font-style:italic;
quotes:"« " " »" "\201C" "\201D"
}

.hidden {
border:none;
clear:both
}

#page {max-width: 80em;
margin: 0 auto}


#top a {
background:transparent;
text-decoration:none;
padding:0
}

#top h1 {
border-bottom:solid 1px;
width:23.3em;
max-width:100%
}

#prelude,#footer {
clear:both;
text-align:center;
font-size:.8em;
opacity:.3;
margin:0
}

#prelude:hover,#footer:hover {
opacity:1
}

#prelude a,#footer a {
background:transparent;
color:#000
}

#wrapper,#top {
width:80%;
margin:0 auto
}

#main {
background:#FFF;
border-radius:3em;
border:solid 5px #E5ECFF;
float:right;
width:70%;
max-width:50em;
margin: 1em 0 2em
}

#content {
padding:1em
}

#content p {
text-indent:1em
}

#content h2 {
color:navy;
text-align:left
}

#content h3 {
clear:both;
border-bottom:2px dotted navy;
margin:.2em 0 .4em 1em
}

#content img {
margin-top:.4em!important
}

ul {
line-height:150%;
list-style:disc;
margin:.2em;
padding:0 0 0 1.5em;
color:navy;
text-align: left
}
ul ul{list-style-type:circle;}

#blognav {float:left;}
#blognav li{
border-radius:1em;
border:solid 5px #FFF;
background:#E5ECFF;
color:#000;
width:7em;
font-size:1.1em;
padding:.5em;
margin: 1em auto;
list-style-type:none;
text-align:center
}

#blognav li.active{
font-weight:bold
}

#blogextra {
clear:both;
text-align:left;
}

#blogextra img {
float:left;
margin:.1em .5em
}

#blogextra h2 {
background:transparent;
color:navy;
font-size:1em;
font-weight:700;
margin:0 0 .3em
}

#blogextra h3{
font-size:.9em;
margin:0 0 .3em
}

#blogextra div {
width:31.3%;
float:left;
margin:0 1% 2em
}

blockquote p {
padding:0 3em
}

blockquote:before,blockquote:after {
font-size:3em;
opacity:0.4
}

blockquote:before {
content:"«";
display:block
}

blockquote:after {
content:"»";
display:block;
text-align:right
}

.post-content blockquote,.post-chapo blockquote {
font-size:.9em;
line-height:150%;
padding-left:1em;
text-indent:0
}

.error,.warning {
background:#FFF;
color:red;
font-weight:700
}

.error ul {
padding-left:3em
}

#warn-comment {
float:right;
width:50%
}

#warn-comment ul {
padding:0
}

#vousenparlez fieldset {
clear:both
}

input,textarea {
background-color:#FFF;
border:1px solid #000!important;
color:#000
}

input[type=submit] {
background:#E5ECFF;
border-style:outset
}

#comment-form fieldset,form,textarea {
width:100%
}

#meta-comment {
clear:none!important;
text-align:left;
width:40%
}

#comment-form label {
display:block;
font-size:.85em;
font-weight:700;
text-indent:0
}


#jquery-overlay {
position:absolute;
top:0;
left:0;
z-index:90;
width:100%;
height:500px
}

#jquery-lightbox {
position:absolute;
top:0;
left:0;
width:100%;
z-index:100;
text-align:center;
line-height:0
}

#lightbox-container-image-box {
position:relative;
background-color:#fff;
width:250px;
height:250px;
margin:0 auto
}

#lightbox-container-image {
padding:10px
}

#lightbox-loading {
position:absolute;
top:40%;
left:0;
height:25%;
width:100%;
text-align:center;
line-height:0;
padding-right:0;
background:none
}

#lightbox-nav {
position:absolute;
top:0;
left:0;
height:100%;
width:100%;
z-index:10
}

#lightbox-container-image-box > #lightbox-nav {
left:0
}

#lightbox-nav a {
outline:none
}

#lightbox-nav-btnPrev,#lightbox-nav-btnNext {
width:49%;
height:100%;
display:block
}

#lightbox-nav-btnPrev {
left:0;
float:left
}

#lightbox-nav-btnNext {
right:0;
float:right
}

#lightbox-container-image-data-box {
font:10px Verdana, Helvetica, sans-serif;
background-color:#fff;
line-height:1.4em;
overflow:auto;
width:100%;
margin:0 auto;
padding:0 10px
}

#lightbox-container-image-data {
color:#666;
padding:0 10px
}

#lightbox-container-image-data #lightbox-image-details {
width:70%;
float:left;
text-align:left
}

#lightbox-image-details-caption {
font-weight:700
}

#lightbox-image-details-currentNumber {
display:block;
clear:left;
padding-bottom:1em
}

#lightbox-secNav-btnClose {
width:66px;
float:right;
background:none;
padding:0 0 .7em
}

a,h1 a:visited,h2 a:visited {
background:transparent;
color:navy
}

fieldset,img,#jquery-lightbox a img {
border:none
}

#tooltip {
	position: absolute;
	z-index: 3000;
	border-radius:1em;
	border:solid 1px navy;
	background-color: #eee;
	padding: 0 5px 5px;
	margin:.2em;
	opacity: 0.85;
        font-size:80%
}
#tooltip h3, #tooltip div { margin: 0; }

/*CV*/
#coordinfo p {margin: 0;text-indent:0}
.dates {float:right;margin:0 0 .1em .1em; background:#FAFAFA;padding:.2em;border-radius:0 0 0 .7em }
.lieu{font-weight:bold}
#experiences, #formation, #competences {
	width: 100%;
	display:flex; 
	justify-content: space-between;
	flex-wrap: wrap
}
#alveoles{flex-basis:100%}
#oqp{flex-basis:64%}
#intothewild{flex-basis:31%}
#gip{flex-basis: 64%;}
#autresexp{flex-basis: 31%}

#letsup,#langues {flex:1}
#formation div, #experiences div, #competences div {margin: .3em}
#premiercycle {flex:1.9}
#master,#informatique {flex: 2.9}
ul#passions{padding-left:0 !important}
#passions li{display:inline}
#passions li:not(:last-child):after{
	content:           ' - ';
	font-weight:700
}

body.p250 p,body.p250 h3,body.p258 p,body.p258 h3{
	padding:.2em;
	text-indent:0 !important;
	margin:0 !important;
	line-height:125% !important;
	text-align:left !important
}
body.p250 h3,body.p258 h3{
	background:#E5ECFF;
	border-bottom:1px solid navy !important;
	border-radius:.7em 0 0 0
}
body.p250 #content ul:not(#passions),body.p258 #content ul:not(#passions){
	padding-left:1.2em;
	line-height:125% !important;
	text-align:left !important
}

#alveoles,#oqp,#intothewild,#gip,#procure,#autresexp,#letsup,#premiercycle,#master,#informatique,#langues{
	border:1px solid navy;
	border-radius: 1em 0 1em;
	padding:0}

#p250,#p258{display: none}

@media screen and (max-width: 640px) { 
body{padding:.3em}
#page, #main, #content, #blognav, #blogextra div, #wrapper, #top, #top h1, #gip, #procure, #autresexp, #letsup, #premiercycle, #master, #informatique, #langues, #experiences, #formation, #competences
{
	display:block;
width:auto !important;
max-width: 100% !important; 
margin: 1em auto !important;  
float:none;
clear:both; 

}
#top,#top h1 {text-align: center}


 /* fixer une largeur maximale  de 100 % aux éléments potentiellement problématiques */ 
 img, table, td, blockquote, code, pre, textarea, input, iframe, object, embed, video { 
   max-width: 85% !important; 
 } 
 
}


@media print {
@page {
  margin: .5cm;
}
body {
	width:100% !important;
	font-size : 10.15pt;
	color: #000;
	background: #fff;
	margin:0;
}

#main,#content,#wrapper,div.post,#page{
		border: none;
		width: 100% !important;
		max-width: 150em !important;
		margin: 0 !important;
		padding: 0 !important;
		border: 0 !important;
}
body.p250 #top,body.p258 #top, #prelude, #sidebar, .pagination, #comment-form, object, #navlinks, .noprint, #comments-feed, #pings, #ping-url, legend, .hidden {
	display: none;
}

p {
	margin: .2em 0 .8em;
	line-height: 1.3em;
}

h1,h2,h3,h4,h5, h6 {
	margin: .3em 0 .1em;
	font-weight: bold;
}
h1 { font-size: 160%; }
h2 { font-size: 140%; font-weight:700 }
h3 { font-size: 120%; }
h4 { font-size: 100%; }
h5 { font-size: 90%; }
h6 { font-size: 80%; }

a {
	color: #00f;
	text-decoration: none;
	border-bottom: 1px solid #999;
}

.post-content a[href^="http"]:after, #comments a[href^="http"]:after,
#trackbacks a[href^="http"]:after {
	content: " ("attr(href)") ";
	color: #333;
}
.p250 a[href^="http"]:after,.p258 a[href^="http"]:after {
	content: "";
}
.p250 a,.p258 a{	color: #000!important;
	text-decoration: none !important;
	border-bottom: 0 !important}
	
#letsup {flex:1.3}
#premiercycle {flex:2}
#master {flex:3}
}