@import "code.css";
@import "homepage.css";

body {
margin: 0px;
font: 14px sans-serif;
}

img { border: 0; vertical-align: middle; }
textarea { width:98%; }
ul li { list-style-position: inside; }

img.left { float: left; padding-right: 20px;}

#content {}
#content-wrapper { margin: 0px auto; text-align:left; }
/* p { max-width: 60em; } */
#commentAnonym { padding-right: .8em; }

/* new header from homepage */
#header {
    font-family: arial, helvetica, sans-serif;
    font-size: 14px;
    padding-top: 10px;
}
div.headerlinks {
    background: black;
    color: #999;
    margin-top:0;
    padding: 10px;
    box-shadow: 0pt 1px 3px rgba(0, 0, 0, 0.7);
}
div.headerlinks a { color: #999; padding: 0 5px; }
div.headerlinks a:first-child { padding-left: 0px; }
.menu a {
    padding: 10px 10px;
    font-weight: bold;
    text-decoration: none;
    line-height: 25px;
}
#menuaction { margin: 0; }
#menuaction {
    padding: 0 12px 0;
}
#menuaction2 {
    padding: 0;
}
.menu a {
    padding: 10px 10px;
    font-weight: bold;
    text-decoration: none;
    line-height: 25px;
}
#menuaction a {
    color: white;
}
div.headerlinks #menuaction a:hover {
    color: #000098;
    background: white;
}

form#search { display: inline; float:right; }
#searchText {
    background: white url(/images/miniloupe.png) no-repeat top right;
    padding-right: 18px;
    width:150px;
    text-align:center;
    color: black;
    border-width: 2px 1px 1px 1px;
    border-color: black;
    border-style: solid;
}
input[type="submit"] {
    border: 1px solid black;
}
span.logo {
    float: left;
    padding-right: 10px;
}
span.logo img { width:48px; height:48px; vertical-align:bottom; }
span.sitename { color:white;font-weight:bold;font-size:24px; }
div.header:after {
    content: "";
    clear: both;
}
#menuadmin {
    clear: right;
    float: right;
}
#menuadmin a {
    text-decoration: none;
    color: white;
    font-weight: bold;
}
#menuadmin a:hover {
    color: #000098;
    background: white;
}


/* old header, switch from #header to #header2 */
#header2 h1 { font-size: 1em; margin:0; }
#entitre { margin: 0; font-size: 1.3em; padding-bottom:6px; }
#commright { float:right; clear: right; margin-right: 10px; }
#entitrelien { position:absolute; left:4px; top:29px; }

#menu { float: left; margin-left: -12.5em; width:12em; overflow:hidden; }

#header2, #footer {
	background-color: rgb(204, 221, 255);
	padding: 4px 0 4px 4px;
	border-left:3px solid #ecebeb;
	border-top:3px solid #ecebeb;
	border-bottom: 2px solid #545353;
	border-right: 2px solid #545353;
}

#header2 {
    padding: 10px 6px;
	margin-bottom: 1em;
	margin-top: 4px;
}
#footer {
    padding: 10px 6px;
	margin-top: 4px;
	clear:both;
}
#footer p      { margin:0;}

#header2 a, #footer a {
text-decoration: none;
color: #666;
}

#header2 a:hover, #footer a:hover {
text-decoration: underline;
color: #333;
}
#content_internal { padding-left: 13em; }
#entitresep { font: 15px sans-serif; }
#entitrepage, #entitrepage a { font-weight: bold; color:black; }

.auteur {
margin: 0;
font-variant: small-caps;
}


.tagsection { clear:right; }
.tagsection .photolettrine { float: left; margin-right: 6px; margin-bottom: 6px; border:3px solid #ccc; }
.tagsection a { text-decoration: none; }
.tagsection a:hover { color: #03f; }
.hentry p, .tagsection p { text-align: left; max-width:60em; }
.hentry ul, .hentry ol { text-align: left; max-width:57em; }
.tagsection ul, .tagsection ol { text-align: left; max-width: 57em; list-style-position: inside; } /* there is a padding of 1em left */
.hentry abbr.updated {border:0; }
.hentry .author { display:none; }

div.hyperlien {
background-color: #f9f9f9; color: black;
border: 1px solid #aaa;
padding:4px;
margin-top: 1em;
}

.hyperlien p {
font-weight: bold;
margin:0;
padding:0;
}

.hyperlien ul {
list-style-position: outside;
list-style-type: circle;
padding-left:25px;
/*padding-left: 2em;*/
}

h3, .hentry h3 {
  font: 18px sans-serif;
  border-bottom: 1px solid #ccc;
  color: #444;
}

.lstsection, .lstcontenu {
padding: 5px;
}

/* inspired from wikipedia .portlet */
#menu .menublock h3 { margin:1em 0 0 0; border-bottom: none;  }
#menu .menublock h3 label, #menu .menublock h3 strong {
	background-color: rgb(224, 227, 230);
	color: black;
	border-top: 1px solid silver;
	border-left: 1px solid silver;
	border-right: 1px solid silver;
	border-bottom: none;
	padding: 4px 1em 0px 0.5em;	
	font-size:80%;
	font-weight: normal;
	border-top-right-radius: 10px;
}
#menu .menublock .menublock_internal {
	margin-top:-2px;
	border:1px solid silver;
	border-top-right-radius: 10px;
	padding:4px;
	padding-left:8px;
	text-align:center;
}
#menu .menublock .menublock_internal li.page.selected a {
	font-weight: bold;
	text-decoration: none;
}
#menu .menublock form .menublock_internal input, 
#menu .menublock form .menublock_internal select { font-size: .8em; width:95%; }
#menu .menublock .menublock_internal li { 
	text-align:left; list-style-type: square;
}
#menu ul {
	margin: 0;
	padding-left:0px;
	list-style-position: inside;
	font-size: .8em;
}
#menu .menugauche { border:0; }
#menu h3 {
	font-size: .8em;
	text-align:left;
	padding-left: 2px;
	background: transparent;
	color: black;
}

#menu h3 {
margin: 0;
font-size: .8em;
border-bottom: 1px solid #ddd;
/*color: #fff; */
}


#piedpage {
	border-top:1px solid #ccc;
}

#pptitre, #ppcourriel {
margin: 0;
padding-left: 1em;
padding-right: 1em;
float: left;
}
#pptitre { padding-left:0; }

#ppcourriel { border-left: 1px solid #000; }

#lastupdated { clear: both; padding-left: 0em; }
#tools { text-align:right; padding-right: 4px; font-size: .9em; }
#tools p { margin: 0; }
login.username { font-weight: bold; }
a {
text-decoration: underline;
color: #00a;
}
a:visited { color:#90a; }
a:hover { text-decoration: none; }

table tbody td, table tbody th {
 border-top:1px solid #ccc;
 vertical-align: top;
}
table tbody th {
 text-align:left;
}
table td.price {text-align:right; }

#comm {clear:both;}
#comm .ysmcomment_reply { border:1px solid white; cursor: pointer; }
#comm .ysmcomment_reply:hover { border:1px outset black; }
#comm .comm { border-bottom:1px solid #ccc; }
#comm .comm:hover { background-color: #ffa; }
#comm .comm.read.valid {}
#comm .comm.read.invalid {
  text-decoration: line-through;
  color: #dddddd;
  background: white;
}

#comm .comm.read.invalid:before {
  content: "Commentaire déclarée invalide: ";
}

#comm .comm.unread:before {
  content: "Commentaire non-validé: ";
}
#comment {
	max-width:60em;
}
#comment .comm {
	border-bottom: 1px solid #ccc;
	padding:15px 0;
	line-height:18px;
}
#comment .author {
	font-size: 1.1em;
	font-weight:bold;
}

#commentAnonym p {
  margin:0; padding:0; clear:left;
}
#commentAnonym p label {
  float:left;
  text-align:right;
  display:block;
  width:8em;
  padding-right:0.5em;
}
#commentAnonyme input {
  border: none;
  border-bottom: 1px solid black;
}
#commentAnonyme textarea {
  border: 1px solid black;  
}
#frmComm input.input_text { width: 20em; }
#frmComm fieldset { position: relative; }
/*#frmComm fieldset p.cmd { margin-bottom: 0px; position:absolute; left:30em; top:1em; } */


/** 
 * cms auth
 */
#cms_auth_login, #cms_auth_login p {
	margin: 10px 0;
}
#cms_auth_login input.text, #cms_auth_login input.password {
	width:12em;
}


/** portefolio */
div.project { font-size: .9em; clear:both; }
div.project p.projectps { float:right; }
div.project p { margin:0; clear:left; }
div.project p label { float:left; text-align:right; padding-right:1em; width:10em; margin-left:-11em; }
div.project p { padding-left: 10em;  }

#header, #footer, fieldset {
	border-radius: 6px;
}

a[hreflang="en"]:after { content: " (en)"; font-size: .8em; color:black; } 
li { padding: 2px 0; }
ins.prof { color: red; }

span.error { color: red; font-style: italic; }

.tabs {
    height: 20px;
    border-bottom: 1px solid black;
}
.tabs .tab {
    margin-left: 4px;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 1px;
    height: 18px;
    border: 1px solid black;
    float: left;
    background: #ddd;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}
.tabs .tab a {
    color: black;
    text-decoration: none;
}
.tabs .tab.selected, .tabs .tab.selected a {
    color: black;
    background: white;
}
.tabs .tab.selected {
    border-bottom: 1px solid white;
}

@media screen and (max-width: 590px) {
	#entitrelien { position: relative; top:0; }
    #menu { float: none; margin:0; width: auto; }
    #content_internal {padding: 0 10px; }
	#content-wrapper{ margin: 0; }
	#inner_content .tagsection img { max-width: 98%; }
    .tagsection ul { padding-left: 10px; }

    body #thumbnaildiv, body #photodiv {
        margin-left: 0;
    }
    #navigation ul {
        float: none;
        width: auto;
        margin: 0;
        padding:0;
    }
}