/*-----------------------------------------------------------------------------
  [CSS - workshop]
  
  Feuille de style specifique au workshop
  
  1. General
  2. Header
    2.1 Logo
    2.2 Retour a l'agence
    2.3 Formulaire de recherche / Resultats Ajax / RSS
  3. Sidebar
  4. Commentaires
  5. Corps
    5.1 Articles
    5.2 Sidebar
    5.3 Bloc "A Propos"
  6. Navigation
  7. Page themes
  8. Social
    8.1 Facebook
    8.2 AddThis
-----------------------------------------------------------------------------*/

/*---------------------------------------------------------------------
  [1. General]
*/

* {
	line-height: 1.2em;
}

html {
	background: #727273;
	color: #777777;
}

body {
	font-family: "Trebuchet MS", Verdana, Tahoma, sans-serif;
}

pre, code {
	font-size: 1.1em;
}

.hr-block {
	background: #ebebeb;
	clear:both;
	height: 1px;
	margin: 0 50px;
}
	
#bg-footer {
	background: #727273 url(../images/workshop/design/bg-x-bottom.png) repeat-x bottom;
	padding-bottom: 8px;
	position: relative;
}

	#main-background {
		background: #c1c1c4 url(../images/workshop/design/bg-x-top.png) repeat-x top;
		position: relative;
	}
	
		#main-background-2 {
			background: transparent url(../images/workshop/design/deco-bottom-alchimie-top.png) no-repeat bottom;
			width:100%;
		}
	
		#main-header {
			background: transparent url(../images/workshop/design/header-logo-ombre.png) no-repeat 5px bottom;
			height: 167px;
			margin: auto;
			width: 900px;
		}
		
		#main-body {
			background: #fff url(../images/workshop/design/corps-bg.png) repeat-x;
			height: auto;
			margin: auto;
			width: 900px;
			padding-bottom: 11px;
		}

	#bg-footer-2 {
		background: transparent url(../images/workshop/design/deco-bottom-alchimie-bottom.png) no-repeat top;
		width:100%;
		height: auto;
		padding-top: 20px;
	}

		#footer {
			color: #c1c1c4;
			height: 53px;
			margin: auto;
			width: 900px;
			font-size: 80%;
		}
		
		div#footer {
			clear: none;
			font-weight: bold;
		}
			#footer a {
				color: #fff;
			}
			#footer a:hover {
				text-decoration: underline;
			}

/*---------------------------------------------------------------------
  [2. Header]
*/

/*---------------------------------------------------------------------
  [2.1 Logo]
*/
div#main-header h1 {
	float: left;
	width: 365px;
	position: relative;
}

	#main-header h1 a,
	#main-header h1 a img {
		display: block;
		height: 113px;
		width: 365px;
	}
	
	#main-header h1 a img {
		position: absolute;
		top: 0;
	}
		#workshop-logo {
			z-index: 20;
		}
		
		#workshop-logo-hover {
			z-index: 10;
		}
		
#search-button {
	background: transparent url(../images/workshop/design/header-form-search-button.png) top left no-repeat;
	border: none;
	display: block;
	height: 25px;
	cursor: pointer;
	width: 25px;
}
#search-button:hover {
	background-position:bottom left;
}

/*---------------------------------------------------------------------
  [2.2 Retour � l'agence]
*/
#header-backcorporate {
	color: #999999;
	float: right;
	height: 107px;
	padding-right: 10px;
	position: relative;
	text-align: right;
	width: 225px;
}
		#header-message {
			position: absolute;
			right: 10px;
			top: 90px;
			text-align: right;
			white-space: nowrap;
		}
		
		#header-message strong {
			font-size: 1.5em;
		}
		
		#link-corporate-home {
			background: transparent url(../images/workshop/design/header-backcorporate.png) no-repeat right top;
			display:block;
			float:right;
			height: 107px;
			width: 222px;
		}
		#link-corporate-home:hover {
			background-position:right bottom;
		}

/*---------------------------------------------------------------------
  [2.3 Formulaire de recherche / Resultats Ajax / RSS]
*/
div#header-toolbar {
	float: right;
	margin-top: 16px;
	width: 269px;
}

	a#rss-link {
		background: transparent url(../images/workshop/design/header-rss.png) no-repeat;
		float: left;
		height: 25px;
		width: 25px;
	}
		a#rss-link:hover {
			background-position:right bottom;
		}
	
	#header-toolbar form {
		width: 238px;
		float: right;
		height: 25px;
	}
	
		#header-toolbar form fieldset {
			border: 0;
			margin: 0;
			padding: 0;
		}
		
		#block-search,
		#block-search p {
			position: relative;
			overflow: hidden;
		}
		
		#search-label {
			position: absolute;
			top: 0;
			left: 0;
			color: #9e9e9e;
			font-size: 0.9em;
			font-weight: normal;
			padding: 4px;
			z-index: 500;
		}
		
		#search-label.focus {
			color: #ccc;
		}
	
		#header-toolbar form input {
			float: left;
			position: relative;
		}

			input#search-input {
				background: url(../images/workshop/design/header-form-search-bginput.png) no-repeat;
				float: left;
				border: 0;
				color: #9e9e9e;
				font-size: 0.9em;
				height: 17px;
				line-height:17px;
				padding: 4px;
				width: 205px;
			}

			/* Resultats de recherche */
			ul.autocompleter-choices {
				background: #fefefe url(../images/workshop/design/header-online-result-bg.png) repeat-x;
				border: #ccc 1px solid;
				font-size: 0.8em;
				line-height: 1.25em;
				margin: 0;
				padding: 0;
				position: absolute;
				z-index: 50;
			}
				ul.autocompleter-choices li {
					cursor: pointer;
					display: block;
					float: none !important; 
					position: relative;
				}
				
					ul.autocompleter-choices a {
						border-top:1px solid #ccc;
						color: #9e9e9e;
						display: block;
						padding:5px;
						text-decoration: none;
					}
					
					ul.autocompleter-choices a.first {
						border: none;
					}
					
					ul.autocompleter-choices a:hover {
						background: #e5297a;
						color: #fff;
					}
			
			ul.autocompleter-choices li.autocompleter-selected {
				background-color: #e5297a;
				color: #fff;
			}
			
			ul.autocompleter-choices span {
				display:none;
			}
			
			ul.autocompleter-choices li.autocompleter-selected a {
				color: #fff;
			}

/*---------------------------------------------------------------------
  [3. Sidebar]
*/
.sidebar-module-small {
	margin: auto 5px;
}

.sidebar-module {
	margin-bottom: 38px;
}

	.sidebar-module h2 {
		background: #EAEAEA;
		color: #cccccc;
		font-family: corbel, 'Trebuchet MS', Verdana, Tahoma, Arial, sans-serif;
		font-size: 2em;
		font-weight: bolder;
		height: 42px;
		padding: 0 6px;
		width: 227px;
	}
	
		.sidebar-module h2.categories span,
		.sidebar-module h2.website span {
			padding:8px 0;
		}

		.sidebar-module h2 span {
			display: block;
			margin: 10px 0;
		}
	
		.sidebar-module h2 a {
			color: #cccccc;
			font-family: corbel, 'Trebuchet MS', Verdana, Tahoma, Arial, sans-serif;
		}
			.sidebar-module h2 a:hover { color:#e11279; }
	
	.sidebar-module-content {
		padding: 5px;
		text-align: justify;
	}
	
		.sidebar-module-content a {
			color: #989898;
		}
		
		.sidebar-module-content a:hover {
			color: #e11279;
			text-decoration: underline;
		}
		
		.sidebar-module-content .tags-size-15 {
			font-size: 1.5em;
			font-weight: bold;
		}
		
		.sidebar-module-content .tags-size-30 {
			font-size: 3em;
			font-weight: bold;
		}
		
			.sidebar-module-liste {
			}
			
				.sidebar-module-liste li {
					width: 50%;
					float: left;
				}
		
		.sidebar-module-content p.maecia-link {
			font-size: 12px;
			margin: 2px 0 6px 0;
		}
		
			.sidebar-module-content p.maecia-link a {
				color: #e5277a;
			}
			
		#module-agence .sidebar-module-liste {
			background: url(../images/workshop/design/picto-liens-agence.png) no-repeat top left;
			font-size: 0.7em;
			padding-left: 9px;
			overflow: hidden;
		}
		
		#module-agence .sidebar-module-liste li {
			width: auto;
			display: inline;
			float: left;
			margin-left: 5px;
			line-height: 1em;
		}
			
/*---------------------------------------------------------------------
  [4. Content]
*/

#res-message {
	margin: 25px 0 40px 0;
}

div.post, div.post-hover {
	margin: 1em 0;
	overflow: hidden;
}

	.post a {
		text-decoration: none;
		font-weight: bold;
	}
	
	.post p a:hover {
		text-decoration: underline;
	}
		
	.post-hover a,
	.post:hover a {
		text-decoration: none;
		font-weight: bold;
		color:#e11279;
	}
	
	.post .post-head {
		color: #78797f;
	}
	
	.post-view-full .post-head {
		margin-bottom: 10px;
	}
	
	.post-date {
		background: #858585 url(../images/workshop/design/article-date-bg.gif) 0 0 no-repeat;
		color: #FFF;
		display: block;
		font-size: 0.5em;
		float: left;
		height: 63px;
		margin: auto 15px 0.5em 0;
		padding: 4px 4px 2px 4px;
		text-align: center;
		width: 46px;
	}

		.post-date:hover,
		.post:hover .post-date,
		.post-hover .post-date {
			background: #e11279 url(../images/workshop/design/article-date-bg-hover.gif) 0 0 no-repeat;
		}

		.post-date-day,
		.post-date-month,
		.post-date-year {
			display: block;
		}

		.post-date-day,
		.post-date-month {
			border: 1px solid #fff;
		}

		.post-date-day {
			border-bottom: 0;
			font: bold 28px "Trebuchet MS", Verdana, Tahoma, sans-serif;
		}

		.post-date-month {
			border-top: 0;
			font: bold 1.75em "Trebuchet MS", Verdana, Tahoma, sans-serif;
			margin-top: -0.6em;
		}

		.post-date-year {
			font-size: 10px;
		}
		
		.post-date-inline {
			color: #999999;
		}
		
		h2.post-title {
			font-family: 'corbel', 'Trebuchet MS', Verdana, Tahoma, Arial, sans-serif;
		}

		.post-title a {
			color: #78797F;
			font-size: 2em;
		}
		
		.post-title a:hover {
			text-decoration: none;
		}

		.post-title .nb-comments,
		.post-title .nb-comments:hover {
			background: transparent url(../images/workshop/design/post-comments.png) no-repeat;
			color: #FFF;
			display: -moz-inline-box;
			display: inline-block;
			font-size: 50%;
			height: 20px;
			left: 10px;
			position: relative;
			top: -1em;
			visibility: hidden;
			width: 32px;
		}
		
			.post-title .nb-comments span,
			.post-title .nb-comments:hover span {
				display: block;
				line-height: 1em;
				text-align: center;
				width: 32px;
			}

		
			.post-title:hover .nb-comments,
			.post-title .nb-comments:hover,
			.post  a:hover .nb-comments,
			.post:hover .nb-comments {
				visibility: visible;
			}
	
		a.link-author {
			color: #e11279;
		}
	
		.post-cats {
			font-size: 0.75em;
			margin-bottom: 18px;
		}
		
			.post .post-cats a:hover {
				text-decoration: none;
			}
	
		.post .post-title-container {
			width: 476px;
			float: left;
		}

	.post-head h1.post-title {
		font-family: corbel, 'Trebuchet MS', Verdana, Tahoma, Arial, sans-serif;
		font-size: 1.7em;
	}
	
	.post-content {
		font-size: 0.8em;
		line-height: 1.25em;
		text-align: justify;
	}
	
		.post-content p {
			line-height: 1.4em;
			margin: 1em 0;
		}
		
		.post-content .post-big-illustration {
			display: block;
			margin: auto;
		}

		.post-content li {
			list-style-type: square;
			list-style-position: inside;
			margin-bottom: 5px;
			padding-left: 15px;
		}
		
			.post-content .post-big-illustration img {
				border: 1px solid #CCC;
				display: block;
			}
			
			.post-hover .post-content .post-big-illustration img,
			.post-content .post-big-illustration img.img-hover {
				border: 1px solid #e11279;
			}
	
	
			.more-posts {
				padding: 15px 0 60px 0;
			}
			
				.more-posts .author-posts , .more-posts .related-posts {
					color: #666665;
					float: left;
					font-size: 11.5px;
					font-weight: bold;
					margin: 5px 0;
					padding:10px;
					width:255px;
				}
			
					.more-posts h1 {
						color: #78797f;
						font-size: 21px;
						margin: 10px 0;
					}
					
					.more-posts a {
						color: #666665;
					}
					
						.more-posts a:hover {
							color: #E5297A;
						}
					
					.more-posts span.date {
						color: #c4c4c4;
						font-weight: normal;
						display: block;
					}
					
				
				
	/* Uniquement posts en vue "blog" */
	.post-footer {
		background: #efeeef;
		clear: both;
		color: #666;
		float:left;
		font-size: 0.75em;
		line-height: 1.25em;
		margin: 5px 0 20px 0;
		padding: 3px;
		width: 544px;
	}
	
		.post-footer a {
			color: #666;
		}
		
		.post:hover .post-footer a,
		.post-hover .post-footer a,
		.post-footer a:hover {
			color: #e5297a;
			font-weight: bold;
		}
	
		p.post-footer-left {
			float: left;
			width: 82%;
		}
		
		.post p.post-footer-left a:hover {
			text-decoration: none;
		}
		
			a.post-category {
				color: #e11279;
			}
			
			.post a.post-category:hover,
			.post p.post-footer-left a.post-category:hover {
				text-decoration: underline;
			}
		
		p.post-footer-right {
			float: right;
			width: 18%;
			text-align:right;
		}
		
		.post p.post-footer-right a:hover {
			text-decoration: none;
		}
		
div#content-nav {
	margin: 1em 0;
}
		
	a#content-p-previous,
	a#content-p-next {
		color: #c7c8ca;
		width: 50%;
	}
	
	a#content-p-previous {
		float: left;
		text-align: left;
	}

	a#content-p-next {
		float: right;
		text-align: right;
	}

		a#content-p-previous:hover span,
		a#content-p-next:hover  span {
			color: #605f60;
			text-decoration: underline;
		}

.tipz {
	z-index: 25;	
}

.tipz,
.tipz:hover,
.post:hover .tipz,
.post-hover .tipz,
.post:hover .post-footer .tipz,
.post-hover .post-footer .tipz {
	color: #666666;
}
		
	.tipz .tip {
		background: url(../images/workshop/design/tooltip-frame.png) no-repeat;
		height: 117px;
		position: relative;
		width: 103px;
	}
	
		.tipz .tip .tip-title {
			left: 14px;
			position: relative;
			top: 15px;
		}
		
/*---------------------------------------------------------------------
  [4. Commentaires]
*/

#all-comments {
	border-top: 1px solid #CCCCCC;
	margin-top: 10px;
	padding-top: 20px;
}

.ezcom-function-title h4,
.ezcom-view-all p {
	color: #666;
	font-size: 12px;
	font-weight: bold;
	margin-bottom: 5px;
	text-indent: 7px;
}

.ezcom-field {
	margin-bottom: 5px;
}

.ezcom-field .ezcom-field-bloc {
	position: relative;
}

.ezcom-field input.replace {
	position: relative;
	z-index: 50;
}

.ezcom-field span.input-default-value {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
	margin: 2px;
}

.ezcom-field span.focus {
	color: #ccc;
}

.ezcom-field label {
	color: #fff;
	font-weight: normal;
	margin-bottom: 3px;
	padding: 0;
	position: relative;
}

.ezcom-field-notified label,
.ezcom-field-remember label {
	display: inline;
}

#CommentAdd {
	background: #d7d7d6;
	margin-top: 10px;
	padding: 5px 10px;
}

#CommentAdd fieldset {
	border: 0 none;
	margin: 0;
	padding: 0;
}

#CommentAdd .box {
	background: #fff;
	border: 0 none;
	color: #808080;
	font-family: "Trebuchet MS",Verdana,Tahoma,sans-serif;
	font-size: 80%;
	padding: 2px;
	width: 526px;
}

.ezcom-buttons {
	text-align: right;
}

.ezcom-buttons input {
	background: url(../images/workshop/design/com-input-both.gif) repeat-x top #9e9e9e;
	border-color: #9e9e9e;
	border-width: 0 1px;
	color: #fff;
	cursor: pointer;
	height: 30px;
	margin-right: 6px;
	margin-top: 5px;
	padding: 2px 5px;
	text-align: center;
	width: auto;
}

.ezcom-buttons input:hover {
	background-position: bottom;
	border-color: #e4237e;
}

.ezcom-view-comment {
	background: url(../images/workshop/design/bg-comment.jpg) repeat-x;
	min-height: 80px;
	padding: 1em 0.5em;
}


.ezcom-view-comment-owner {
	background-image:url(../images/workshop/design/bg-maecia-comment.jpg);
}

	.ezcom-view-comment p {
		font-size: 12px;
	}
	
	.ezcom-comment-author span.comment-infos {
		color:#C4C4C4;
		font-weight: normal;
	}
	
		.comment-date {
			color: #c4c4c4;
		}
		
		.author {
			font-weight: bold;
		}
		
.message-error,
.message-feedback {
	margin-top: 1em;
}

#CommentAdd label .warning {
	background: #e52746;
	border: 0;
	color: #fff;
	margin: 0;
	padding: 0 5px;
	position: absolute;
	right: 0;
	top: 0;
}

/*---------------------------------------------------------------------
  [5. Corps]
*/
#big-mess {
	color: #989898;
	font-family: corbel, 'Trebuchet MS', Verdana, Tahoma, Arial, sans-serif;
	font-size: 1.7em;
	width: 745px;
	float: left;
	padding: 25px 0 0 36px;
}

#small-mess {
	padding: 11px 0 0 36px;
	text-align: right;
	width:550px;
}

	#small-mess h2 {
		font-weight: normal;
		display: block;
	}
	
		#small-mess h2 span {
			color: #4c4c4c;
		}
		
#workshop-label {
	float: right;
	width: 108px;
}

#hr-index {
	clear: both;
	width: 640px;
	margin: 0 0 0 36px;
}

	/*---------------------------------------------------------------------
		[5.1 Articles]
	*/

	div#main-body-content, div#main-post-content {
		float: left;
		margin-left: 11px;
		padding-left: 25px;
		width: 550px;
	}

	div#main-body-content .post-content h2, div#main-post-content .post-content h2, div#main-body-content .post-content h3 {
		font-size: 1.3em;
		margin: 15px 0;
	}

	div#main-body-content .post-content h3 {
		font-size: 1.2em;
	}

	div#main-body-content .post-content h4 {
		font-size: 1.1em;
		margin: 15px 0;
	}

		div.post-content .object-center .content-view-embeddedmedia .class-image .attribute-image p img{
			display: block;
			margin:0 auto;
		}		

		div.post-content .object-left .content-view-embeddedmedia .class-image .attribute-image p img{
			margin-right: 10px;
		}

		div.post-content .object-right .content-view-embeddedmedia .class-image .attribute-image p img{
			margin-left: 10px;
		}

	/*---------------------------------------------------------------------
		[5.2 Sidebar]
	*/
	div#main-body-sidebar {
		float: right;
		width: 249px;
		padding-right: 21px;
		margin: 1em 11px 0 0;
	}

	#go-to-top {
		text-transform: uppercase;
		text-align: right;
		width: 878px;
		margin: 0 11px;
	}

		#go-to-top a {
			background: transparent url(../images/workshop/design/top.gif) no-repeat right;
			color: #999999;
			clear: both;
			display: block;
			float: right;
			font-size: 0.8em;
			padding-right: 12px;
			text-decoration: none;
		}
		
		#go-to-top a:hover {
			text-decoration: none;
		}

	/*---------------------------------------------------------------------
		[5.3 Bloc "A Propos"]
	*/
	div#apropos-bottom {
		background: #c1c1c4;
		color: #fff;
		font-size: 1em;
		padding: 6px;
		width: 866px;
		margin: 0 11px;
	}

		div#apropos-bottom-content {
			border: 2px dashed #fff;
			padding: 10px;
			width: 842px;
		}
		
		#apropos-bottom-content h2,
		#apropos-bottom-content p {
			display: inline;
			font-size: 0.9em;
			font-weight: bold;
			line-height: 1.25em;
		}
		
		#apropos-bottom-content h2 {
			font-size: 2em;
		}
		
		#apropos-bottom-content p strong {
			background: #605f60;
			padding: 0.1em 0.2em;
		}

/*---------------------------------------------------------------------
  [6. Navigation]
*/

.pagenavigator {
	margin-top: 5px;
}

	.pagenavigator a {
		color: #989898;
	}
	
		.pagenavigator a:hover {
			color: #605f60;
			text-decoration: underline;
		}
		
/*---------------------------------------------------------------------
  [7. Page themes]
*/
#themes-page {
	float: left;
	margin-top: 1em;
	margin-left: 11px;
	padding-left: 25px;
	width: 550px;
}

	#themes-page h2 {
		background: #eaeaea none repeat scroll 0 0;
		color: #ccc;
		font-size: 2em;
		font-weight: normal;
		height: 42px;
		margin: 10px 0;
		padding-left: 6px;
		width: 544px;
	}
	
	#themes-page p { font-size: 1.5em; text-align: justify; }
		#themes-page p a { color: #989898; }

/*---------------------------------------------------------------------
  [8. Social]
*/

/*---------------------------------------------------------------------
  [8.1 Facebook]
*/
.facebook-likebutton {
	margin-top: 5px;
	height: 25px;
	overflow: hidden;
}

iframe.facebook-likebutton-frame {
	width: 550px;
	height: 25px;
}

#social {
	overflow: hidden;
	float: right;
}

#social .facebook-likebutton {
	float: left;
	width: 80px;
}

iframe.facebook-likebox-frame {
	width: 239px;
	height: 262px;
}

/*---------------------------------------------------------------------
  [8.2 AddThis]
*/
#social .addthis_toolbox {
	float: left;
	font-size: 0.9em;
	margin-top: 6px;
}

#social .addthis_toolbox a {
	color: #115bb5;
	display: inline;
	float: left;
	margin-right: 5px;
}

#social .addthis_toolbox .at300bs { float: left; }