/*
Theme Name: Site de Tractr
Description: Le thème utilisé pour le site de Tractr
Version: 1.0
Author: Stéphane Demets, Olivier Tarbès, Benoît Pruneau

*/



/* Begin Typography & Colors */
body {
 font-size: 62.5%; /* Resets 1em to 10px */
 font-family: Arial, Sans-Serif;
 background: #101010  url(images/bg.jpg) 50% 0px no-repeat fixed;
 color: #cccccc;
 text-align: center;
 border-top:1px solid #101010;
 margin: 0 0 20px;
 padding: 0;
}

.sansserif {
 font-family: Arial, Sans-Serif;
}

#page {
 text-align: left;
 position:relative;
 margin: 0px auto;
 padding: 20px 0;
 width: 800px;
 border: 0;
}

#content {
 font-size: 1.2em
}

#footer {
 border: none;
}

small {
 font-family: Arial, Sans-Serif;
 font-size: 0.9em;
 line-height: 1.5em;
}

h1, h2 {
 font-family: 'Georgia', Arial, Sans-Serif;
 font-weight: lighter;
 font-style:italic;
 line-height:32px;
}
h3 {
 font-family: Arial, Sans-Serif;
}

h1 {
 font-size: 1.8em;
}

h2 {
 font-size: 2.6em;
}

h2.pagetitle {
 font-size: 1.8em;
}

h3 {
 font-size: 1.2em;
}

h1, h1 a, h1 a:hover, h1 a:visited {
 text-decoration: none;
 color: white;
}
#headerimg {
 margin: 0;
 height: 190px;
}
#headerimg h1 {padding-top:35px}
#headerimg h1 a {
 background: transparent url(images/logo.png) bottom left no-repeat;
 height:115px;
 display:block;
 width:340px;
}
#headerimg h1 a:hover {
 background-image: url(images/logo_on.png);
}
#headerimg h1 a span {
 position:absolute;
 top:-999em;
}

a, a:hover, a:active, a:focus, :focus {
 outline:none;
}

#headerimg a {
 outline:none;
}

h2, h2 a, h2 a:visited, h3, h3 a, h3 a:visited {
 color: white;
}

h2, h2 a, h2 a:hover, h2 a:visited, h3, h3 a, h3 a:hover, h3 a:visited, #sidebar h2, #wp-calendar caption, cite {
 text-decoration: none;
}

.entry p a:visited {
 color: #FFFFFF;
}

.commentlist li {
 font: 0.9em Arial, Sans-Serif;
}

.commentlist li ul li {
 font-size: 1em;
} 

.commentlist li {
 font-weight: bold;
}

.commentlist li .avatar { 
 float: right;
 border: 1px solid #eee;
 padding: 2px;
 background: #fff;
}

.commentlist cite, .commentlist cite a {
 font-weight: bold;
 font-style: normal;
 font-size: 1.1em;
}

.commentlist p {
 font-weight: normal;
 line-height: 1.5em;
 text-transform: none;
}

#commentform p {
 font-family: Arial, Sans-Serif;
}

.commentmetadata {
 font-weight: normal;
}

code {
 font: 1.1em Arial, Sans-Serif;
}

a, h2 a:hover, h3 a:hover {
 color: #fff;
 text-decoration: none;
}

a:hover {
 color: #fff;
 text-decoration: underline;
}

/* End Typography & Colors */



/* Begin Structure */

.post {
 margin: 0px;
 text-align: left;
}

.post hr {
 display: block;
}

.clear {
 clear: both;
}

#footer {
 padding: 0;
 margin: 0 auto;
 width: 760px;
 clear: both;
}

#footer p {
 margin: 0;
 padding: 20px 0;
 text-align: center;
}
/* End Structure */



/*	Begin Headers */
h1 {
 padding-top: 70px;
 margin: 0;
}

h2 {
 margin: 30px 0 0;
}

h2.pagetitle {
 margin-top: 30px;
 text-align: center;
}

h3 {
 padding: 0;
 margin: 30px 0 0;
}

h3.comments {
 padding: 0;
 margin: 40px auto 20px ;
}
/* End Headers */



/* Begin Images */
p img {
 padding: 0;
 max-width: 100%;
}

/*	Using 'class="alignright"' on an image will (who would've
	thought?!) align the image to the right. And using 'class="centered',
	will of course center the image. This is much better than using
	align="center", being much more futureproof (and valid) */

img.centered {
 display: block;
 margin-left: auto;
 margin-right: auto;
}

img.alignright {
 padding: 4px;
 margin: 0 0 2px 7px;
 display: inline;
}

img.alignleft {
 padding: 4px;
 margin: 0 7px 2px 0;
 display: inline;
}

.alignright, .captcha {
 float: right;
}

.alignleft {
 float: left
}
/* End Images */



/* Begin Lists

	Special stylized non-IE bullets
	Do not work in Internet Explorer, which merely default to normal bullets. */

html>body .entry ul {
 margin-left: 0px;
 padding: 0 0 0 30px;
 list-style: none;
 padding-left: 10px;
 text-indent: -10px;
}

html>body .entry li {
 margin: 7px 0 8px 10px;
}
/* Pour IE7 seulement */
*+html body .entry ul li {
 margin-left:15px;
 padding-left:0;
}


#sidebar ul { padding-left:0; margin-left:0; margin-top:0;}
#sidebar li { list-style-type:none; padding-bottom:4em; }
#sidebar ul ul li { padding:.7em 0; border-bottom:1px dashed white; font-size:12px;}
#sidebar ul ul li a {
 font-family:'Georgia', Arial, Sans-Serif;
 font-style:italic;
 font-weight:bold;
}

.entry ol {
 padding: 0 0 0 35px;
 margin: 0;
}

.entry ol li {
 margin: 0;
 padding: 0;
}

.postmetadata ul, .postmetadata li {
 display: inline;
 list-style-type: none;
 list-style-image: none;
}

ol li {
 list-style: decimal outside;
}

/* End Entry Lists */



/* Begin Form Elements */

#commentform {
 margin: 5px 10px 0 0;
}

#commentform input {
 width: 225px;
 margin: 5px 5px 1px 0;
}

#commentform textarea {
 width: 100%;
 padding: 10px;
 margin-top:8px;
 width:530px;
}

#respond:after {
 content: ".";
 display: block;
 height: 0;
 clear: both;
 visibility: hidden;
}

#commentform #submit {
 margin: 0 0 5px auto;
 float: right;
}
/* End Form Elements */



/* Begin Comments*/
.alt {
 margin: 30px 0 0 0;
 padding: 10px;
 background-color:#222222;
 color:#888888;
}

.commentlist {
 padding: 0;
 text-align: justify;
}

.commentlist li {
 margin: 15px 0 10px;
 padding: 5px 5px 10px 10px;
 list-style: none;
}
.commentlist li ul li {
 margin-right: -5px;
 margin-left: 10px;
}

.commentlist p {
 margin: 10px 5px 10px 0;
}
.children { padding: 0; }

#commentform p {
 margin: 5px 0;
}

.nocomments {
 text-align: center;
 margin: 0;
 padding: 0;
}

.commentmetadata {
 margin: 0;
 display: block;
}
/* End Comments */

/* Begin Various Tags & Classes */
acronym, abbr, span.caps {
 cursor: help;
}

acronym, abbr {
 border-bottom: 1px dashed #999;
}

blockquote {
 margin: 15px 30px 0 10px;
 padding-left: 20px;
 border-left: 5px solid #ddd;
}

blockquote cite {
 margin: 5px 0 0;
 display: block;
}

.center {
 text-align: center;
}

.hidden {
 display: none;
}

hr {
 display: none;
}

a img {
 border: none;
}

.navigation {
 display: block;
 text-align: center;
 margin-top: 10px;
 margin-bottom: 60px;
 font-family:'Georgia', Arial, Sans-Serif;
 font-style:italic;
}

.aligncenter,
div.aligncenter {
 display: block;
 margin-left: auto;
 margin-right: auto;
}

.wp-caption {
 border: 1px solid #ddd;
 text-align: center;
 background-color: #f3f3f3;
 padding-top: 4px;
 margin: 10px;
 -moz-border-radius: 3px;
 -khtml-border-radius: 3px;
 -webkit-border-radius: 3px;
 border-radius: 3px;
}

.wp-caption img {
 margin: 0;
 padding: 0;
 border: 0 none;
}

.wp-caption p.wp-caption-text {
 font-size: 11px;
 line-height: 17px;
 padding: 0 4px 5px;
 margin: 0;
}

#menutopright {
 position:absolute;
 top:45px; 
 right:0;
 width:400px;
 height:120px;
}
#menutopright p {
 padding:10px 0;
 margin:0;
 font-family: 'Georgia', Arial, Sans-Serif;
 font-size:12px;
 font-style:oblique;
}
#menutopright ul {
 position:absolute;
 bottom:0; right:0;
 margin:0; padding:0;
}
#menutopright ul li {
 display:block;
 float:left;
 list-style-type:none;
}
#menutopright a {
 padding:2px 0px 0 26px;
 font-size:24px;
 color:white;
 background: transparent top right no-repeat;
 height:25px;
 width:100px;
 display:block;
}

#menutopright a span {
 display:none;
}
#menutopright #m_agence     a { background-image: url(images/m_agence.png); width:51px; padding-left:0;}
#menutopright #m_services   a { background-image: url(images/m_services.png); width:63px;}
#menutopright #m_portfolio  a { background-image: url(images/m_portfolio.png); width:71px;}
#menutopright #m_blog       a { background-image: url(images/m_blog.png); width:52px;}
#menutopright #m_contact    a { background-image: url(images/m_contact.png); width:58px;}
#menutopright #m_agence     a:hover, #menutopright #m_agence     a.selflink { background-image: url(images/m_agence_on.png); }
#menutopright #m_services   a:hover, #menutopright #m_services   a.selflink { background-image: url(images/m_services_on.png);}
#menutopright #m_portfolio  a:hover, #menutopright #m_portfolio  a.selflink { background-image: url(images/m_portfolio_on.png); }
#menutopright #m_blog       a:hover, #menutopright #m_blog       a.selflink { background-image: url(images/m_blog_on.png); }
#menutopright #m_contact    a:hover, #menutopright #m_contact    a.selflink { background-image: url(images/m_contact_on.png); }

#separateurmenutopright {
 position:absolute;
 top:45px;
 left:370px;
 height:126px;
 width:2px;
 background:transparent url(images/ligne_petite.png) top left no-repeat;
}
#dernieresnouvelles {
 padding-left:240px;
 position:relative;
 min-height:303px;
}
#dernieresnouvelles h2 {
 margin-top:0px;
}
#lignegrande {
 top:0;
 left:210px;
 position:absolute;
 width:2px;
 height:303px;
 background:transparent url(images/ligne_grande.png) top left no-repeat;
}
#dernieresnouvelles h1 {
 background:transparent url(images/derniere_nouvelle.png) top left no-repeat;
 width:234px;
 height:39px;
 padding:0; margin:0;
}
#dernieresrealisations h1 {
 background:transparent url(images/derniere_rea.png) top left no-repeat;
 width:354px;
 height:39px;
 padding:0; margin:0;
}
#dernieresnouvelles h1 span, #dernieresrealisations h1 span {
 position:absolute;
 top:-999em;
}
#dernieresrealisations {
 margin-bottom:40px;
}
#sidebar {
 position:absolute;
 top:210px;
 left:0;
 width:180px;
 padding:0 20px 20px 0;
}
.narrowcolumn {
 padding-left:240px;
}
#cmenuheaderright {
 position:absolute;
 top:0;
 left:0;
 width:100%;
 padding:0;
 margin:0;
 height:24px;
 background:black;
}
#menuheaderright {
 margin:0 auto;
 width:800px;
 text-align:right;
}
#menuheaderright ul li  {
 list-style-type:none;
 display:inline;
 padding-left:1.5em;
}
#menuheaderright ul {
 margin-top:5px;
}
#conteneur {
 margin:0 auto;
 width:800px;
 position:relative;
 border-top:1px solid black;
}

.btitre .titre {
 font-size:2.6em;
 font-weight:100;
 font-style:italic;
 color:white;
 margin-top:0px;
}
a {color:#;}
#parcateg li {
 list-style-type:none;
 float:left;
 padding-right:1em;
}
#parcateg ul {
 padding:0; margin:0;
}
#grandconteneur {
 background:transparent url(images/bg-slideshow.png) no-repeat scroll center 190px;
}
.preload {
 position:absolute;
 top:-999em;
 left:-999em;
 height:1px;
 width:1px;
}
div.comment {
 float:right;
}
div.comment a {
 padding-left:25px;
 background: transparent url(images/comments-bubble.gif) top left no-repeat;
}
div.comment a:hover {
 background-image:url(images/comments-bubble-hover.gif);
 text-decoration:none;
}

.ladate {
 font-size:smaller;
 padding-top:10px;
}
.lien a {
 display:block;
 height:17px;
 width:93px;
 background:transparent url(images/lire.png) top left no-repeat;
 outline:none;
}
.lien a:hover {
 background-image:url(images/lire_on.png);
}
.lien a span {
 position:absolute;
 top:-999em;
}
#h3-services-design, #h3-services-devweb, #h3-services-market {
 height:49px;
 width:300px;
 background:transparent top left no-repeat;
 margin-top:10px;
 cursor:pointer;
}
#h3-services-design        {background-image:url(images/s_design.png)}
#h3-services-devweb        {background-image:url(images/s_techno.png)}
#h3-services-market        {background-image:url(images/s_marketing.png)}
#h3-services-design:hover  {background-image:url(images/s_design_on.png)}
#h3-services-devweb:hover  {background-image:url(images/s_techno_on.png)}
#h3-services-market:hover  {background-image:url(images/s_marketing_on.png)}

#h3-services-design span, #h3-services-devweb span, #h3-services-market span {
 position:absolute;
 top:-9999em;
}
.singlepage .post {
 border-bottom:none;
}
.singlepage .post h2.title {
 margin-top:0;
}
#suiveznous h3 {
 margin:0;padding:0;
 height:25px;
 width:104px;
 background:transparent url(images/suivez-nous.png) top left no-repeat;
}

#suiveznous a {
 height:24px;
 width:24px;
 float:left;
 background:transparent top left no-repeat;
 padding-left:3px;
}
#suiveznous span {position:absolute; top:-999em}
#suiveznous #linkedin {background-image: url(images/f_linkedin.png)}
#suiveznous #facebook {background-image: url(images/f_facebook.png)}
#suiveznous #twitter  {background-image: url(images/f_twitter_on.png) }
#suiveznous #delicious  {background-image: url(images/f_delicious_on.png) }
#suiveznous #rss      {background-image: url(images/f_rss.png)     }

#suiveznous #linkedin:hover {background-image: url(images/f_linkedin_on.png)}
#suiveznous #facebook:hover {background-image: url(images/f_facebook_on.png)}
#suiveznous #twitter:hover  {background-image: url(images/f_twitter.png) }
#suiveznous #delicious:hover  {background-image: url(images/f_delicious.png) }
#suiveznous #rss:hover      {background-image: url(images/f_rss_on.png)     }


#categoriestitre {
 clear:both;
 width:91px; height:26px;
 background:transparent url(images/categories.png) top left no-repeat;
 margin:0;
}
#categoriestitre span {position:absolute; top:-999em;}
.toppost {
 background:transparent url(images/bg_post-top.png) top left repeat;
 padding:16px 14px 10px;
 margin-top:10px;
}
.bottompost {
 background:transparent url(images/bg_post-bottom.png) top left no-repeat;
 height:22px;
}
ul.listcadre li {
 list-style:square;
 padding-left:1em;
 font-family: 'Georgia', Arial, Sans-Serif;
 font-weight: lighter;
 font-size:140%;
 margin-top:0 !important;
}
ul.listcadre {
 margin-top:0;
}
#grandconteneur #sidebar {
 top:610px;
}
input, textarea {
 -moz-border-radius:4px;
 -webkit-border-radius:4px;
 border-radius:4px;
 border-style:none;
 font-size:20px;
 padding:4px 10px 4px 10px;
 font-family:Arial, Helvetica, sans-serif;
}
textarea {
   padding:10px;
  font-size:12px;
}

.wpcf7-form input, .wpcf7-form textarea {
 width:275px;
}
.wpcf7-form input[type=submit] {
 width:auto;
 font-size:12px;
}