/*--------------------------------------------------------------
*	Filename:		main.css
*	Description:	Main layout for Aerosol Forum
*	Client:			Orief - www.oriex.fr
*	Author:			Ivan Tatic - www.simplifiedstudio.com
*	Optimised for: 	Safari, Firefox 3, IE 7, Opera
*	Version:		1.0 / 03302009
--------------------------------------------------------------*/

/*
Globals resets
---------------------------------*/
body, html{	padding: 0;	margin: 0; font: normal 12px/1.5em Arial, Helvetica, sans-serif;}
p, h1, h2, h3, h4 ,h5, h6{ padding: 0;	margin: 0; font-weight: normal; font-size: 1em;}
ul, ol, dl, dt, dd{ list-style: none; padding: 0; margin: 0;}
html, body, div, span, applet, object, iframe, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
 margin: 0; padding: 0; border: 0; outline: 0; vertical-align: baseline; background: transparent; }

/*
Layout
---------------------------------*/
body{ background: #f2f2f2;}
#warper{ background:#fff  url('../img/top.png') no-repeat; width: 792px; margin: 0 auto; padding: 5px 18px;}
#content{ margin: 18px 0;}
	#left{ width: 516px; float: left; padding-right: 22px;}
	#right{ width: 222px; background: #f5f5f5 url('../img/right-column-border.png') top left repeat-y; float: left; padding: 0px 12px 16px 20px; position: relative;}

	/* Common */
	.goleft{ float: left; width: 45%; margin-right: 10px;}
	.goright{ float: right;}
	
	#content a { color: #582b7a; padding: 0 1px;}
		#content a:hover{ text-decoration: none; background: #582b7a; color: #fff; padding: 0 1px}
	#right h2, #left h2, .yellowbox h2 { color: #010101;}
	#right, #left{color: #444; text-align: justify;}
	#right p, #left p{ margin: 7px 0;}
	p.breadcrumb{ background: url('../img/breadcrumb-bg.png') no-repeat; display: block; height: 25px; line-height: 25px; padding: 0 18px; }
		p.breadcrumb a{ text-decoration: none;}
	
	.intext{ float: left; margin: 0.4em 1em 0.2em 0;}
	hr{ height: 1px; border: none; background: #999; color: #999; outline: none; margin: 16px 0;}
	
	
	/* Right column */
	#right h2{ background: url('../img/right-column-title.png') no-repeat; font: bold 14px/30px Helvetica, Arial, sans-serif; width: 254px; position: relative; left: -20px; text-indent: 20px; display: block; margin: 14px 0 8px 0;}
	#right .notop{ margin: 0 0 8px 0 !important;}
	#right{ font: normal 11px/1.5em "Lucida Grande", Verdana, sans-serif;}

	#right p.name{ margin-top: 1.2em; line-height: 20px; background: url('../img/quote.jpg') no-repeat bottom left; padding-bottom: 6px; color: #000;}
		#right p.name strong { text-transform: uppercase;}
		#right cite a { font-style: normal;}

	/* Left column */
	#left p.name{ margin: 1.6em 0 0 0; line-height: 20px; background: url('../img/testimonial.jpg') no-repeat bottom left; color: #000; padding-bottom: 6px;}
	#left cite.testimonial{ background: #f2f2f2 !important; display: block; padding: 8px;}
		#left cite.testimonial img{ float: left; margin: 0 16px 0 0;}
	#left h1{ font: bold 24px/26px Helvetica, Arial, sans-serif; display: block; margin: 14px 0 8px 0; color: #bbadd5; letter-spacing: -1px;}
	#left h2{ font: bold 15px/20px Helvetica, Arial, sans-serif; display: block; margin: 28px 0 8px 0; position: relative;}
	#left h3{ font: bold 12px/16px "Lucida Grande", Helvetica, Arial, sans-serif; display: block; margin: 6px 0; text-transform: uppercase;}
	#left{ font: normal 11.22px/1.5em "Lucida Grande", Verdana, sans-serif;}
		#left h2 span.new{ background: #ffcc00; display: inline-block; position: absolute; color: #fff; font: bold 9px/14px "Lucida Grande", Verdana, sans-serif; height: 14px; top: 2px; text-transform: uppercase; text-align: center; padding: 0 3px;}
	
	.yellowbox{ background: url('../img/important-box-bottom.png') bottom left no-repeat; padding: 0 0 6px 0; margin: 0 0 10px 0;}
	.yellowbox h2{ margin: 0 !important; padding: 12px 12px 2px 12px; background: url('../img/important-box-top.png') top left no-repeat; display: block; width: 516px;}
	.yellowbox *{ padding: 0 12px;}
	.yellowbox cite{ display: block; margin: 10px 0;}
	.yellowbox cite img{ float: left; margin: 0 16px 10px 0; padding: 0;}
	.yellowbox img{ float: left; padding: 0; margin: 8px 12px 8px 16px;}
	.yellowbox p { font-size: 11.44px !important;}
	.yellowbox strong, .yellowbox small, .yellowbox sup { padding: 0;}
	.yellowbox a.btn, .yellowbox a{ padding: 0 !important;}
	.yellowbox a.btn span{ padding: 0 32px 0 0 !important;}

/*
Header
---------------------------------*/
#header{ background: url('../img/header.png') no-repeat; display: block; width: 792px; height: 90px; margin: 18px 0;}
 	#header h2{ text-indent: -9999px; display: block;}
	#header h1 a{ display: block; text-indent: -9999px; width: 360px; height: 86px; margin-left: 260px;}

/*
Footer
---------------------------------*/	
#footer p{ font: normal 11px/1.4em "Lucida Grande", Verdana, sans-serif; padding: 0.2em 0; margin: 0 12px; color: #666;}
#footer p strong{ color: #000;}
#footer p a{ color: #582b7a;}
	#footer p a:hover{ text-decoration: none; background: #582b7a; color: #fff;}
	
/*
Navigation
---------------------------------*/
ul#navigation{ background: url('../img/navigation-bg.png') no-repeat; display: block; height: 104px; padding: 0 8px; position: relative; z-index: 990;}
	ul#navigation li{ margin: 44px 0 0 1px; float: left; display: block; background: url('../img/tab-bg-left.png') no-repeat top left; height: 30px; position: relative;}
	ul#navigation li a{ float: left; padding: 0 9px 0 6px; color: #582b7a; text-decoration: none; margin: 0 1px 0 3px; height: 30px; background: url('../img/tab-bg-right.png') no-repeat top right; font: bold 12px/30px "Lucida Grande", Verdana, sans-serif; }
	
	ul#navigation li.current {background-position: bottom left;}
	ul#navigation li.current a{background-position: bottom right; color: #582b7a;}	
	
	ul#navigation li:hover {background-position: bottom left;}
	ul#navigation li:hover a{background-position: bottom right; color: #582b7a;}

	/* Drop down */
	ul#navigation li ul{ display: none;}
	ul#navigation li:hover ul{ display: block; position: absolute; z-index: 1000; top: 30px; border-top: none; border-right: 2px solid #ccc; border-bottom: 2px solid #ccc; border-left: none; left: 0;}
	ul#navigation li:hover ul li{ display: block; clear: both; width: 200px; background: #e6e6e6 !important; margin: 0; padding: 0;}
	ul#navigation li:hover ul li a{ background: #e6e6e6 url('../img/tab-menu-list-item.png') no-repeat 10px 50%; width: 166px; padding: 0 8px 0 26px; margin: 0; font: normal 11px/30px "Lucida Grande", Verdana, sans-serif;}
	ul#navigation li:hover ul li a:hover{ background: #dadada url('../img/tab-menu-list-item.png') no-repeat 10px 50%; color: #582b7a;}

/*
Language bar
---------------------------------*/
ul#language{ position: absolute; z-index: 9999; top: 131px; margin: 0 0 0 744px;}
	ul#language li{ float: left; display: block;}
	ul#language li a{ float: left; display: block; color: #582b7a; width: 20px; height: 15px; text-align: center; font: bold 10px/15px "Lucida Grande", Verdana, sans-serif; text-decoration: none; text-transform: uppercase;}
	ul#language li a:hover{color: #8e6ac4;}
	ul#language li.selected a{background: url('../img/language-select.png'); color: #582b7a;}	

/*
Lists
---------------------------------*/
#content ul{ margin: 6px 0 6px 24px;}
	#content ul li { margin: 3px 0; background: url('../img/list-style.png') 0% 6px no-repeat; padding-left: 12px;}
#right ul { margin: 6px 0px 6px 16px;}
.yellowbox ul { margin: 6px 0px 6px 28px;}
.yellowbox li { padding: 0;}
ul.participant{ margin: 0 0 -20px 0 !important; padding: 0 10px 0 0; text-align: left !important;}
ul.partners{ overflow: auto; margin: 0 !important; padding: 0 !important; background: none  !important; width: 222px;}
	ul.partners li{ margin: 0 !important; padding: 0 !important; float: left; background: none !important;}
	ul.partners li a{ float: left; display: block; width: 109px; color: #f5f5f5 !important;}
	ul.partners li a:hover{ text-decoration: none !important; color: #f5f5f5 !important; background: #f5f5f5 !important;}
	ul.partners li a img{ width: 105px; height: 60px; display: block; outline: none; border: none; }
	ul.partners li a:hover img{ color: #f5f5f5 !important; background: #f5f5f5 !important;}
#content ul.press li{ background: none !important; padding-left: 0px; font: bold 15px/20px Helvetica, Arial, sans-serif;}
	#content ul.press li ul li{ border-bottom: 1px solid #d0d0d0; 
		margin: 3px 0; background: url('../img/list-style.png') 0% 6px no-repeat !important; padding-left: 12px; font: normal 11.22px/1.5em "Lucida Grande", Verdana, sans-serif !important;}
	#content ul.press li ul li a{ display: block;}
	#content ul.press li ul li a:hover{ background: #fff;}	
	#content ul.press li ul li a img{border: 1px solid #e2e2e2; background: #fff; padding: 2px;}
	#content ul.press li ul li a:hover img{ background: #fff !important; border-color: #bd0070;}
#content ul.winners li{ float: left; width: 200px; height: 160px; text-align: center !important; font-size: 10px; background: none;}
#content ul.winners li strong{ display: block; font-size: 11.44px !important;}
#content ul.winners li img{ display: block; width: 80px; height: 80px; margin: 0 auto 6px auto;}

#content ul.mention{ margin: 0; padding: 0;}
#content ul.mention li{ float: left; width: 115px; height: 160px; text-align: center !important; font-size: 10px; background: none;}
#content ul.mention li strong{ display: block; font-size: 11.44px !important;}
#content ul.mention li img{ display: block; width: 80px; height: 110px; margin: 0 auto 6px auto;}

/*
Network links
---------------------------------*/
ul.network{ border: 1px solid #ccc; border-left: 0; border-right: 0; background: #f5f5f5; padding: 0.6em 0; font: normal 11px/2em "Lucida Grande", Verdana, sans-serif; margin-bottom: 0.5em;}
  	ul.network li { display: block; padding: 0; margin: 0; height: 2em;}
	ul.network li a{ background: url('../img/network-list.png') no-repeat 20px 50%; color: #666; text-decoration: none; display: block; padding-left: 40px; border: 1px dashed #f5f5f5; border-left: 0; border-right: 0; height: 2em;}
	ul.network li a strong { color: #000;}
	ul.network li a:hover{ background: #fff url('../img/network-list.png') no-repeat 20px 50%; border-color: #e0e0e0;}
	ul.network li a:hover strong { color: #582b7a;}
	
/*
Forms, buttons and fancy links
---------------------------------*/
a#network{ font: bold 9px/11px "Lucida Grande", Verdana, sans-serif; display: inline-block; background: #ccc; color: #000; text-decoration: none; padding: 2px 16px 2px 6px; background: #ccc url('../img/network-arrow-down.png') no-repeat 95% 50%; float: right;}

a.btn{ font: bold 12px/30px Helvetica, Arial, sans-serif; display: inline-block; text-transform: uppercase; text-decoration: none; color: #000 !important; background: url('../img/button-left.png') top left no-repeat; height: 28px; overflow: hidden; cursor: pointer;}
	a.btn span{ background: url('../img/button-right.png') top right no-repeat; display: inline-block; height: 28px; padding-right: 32px; margin-left: 16px;}
	a.btn:hover{ color: #582b7a !important; background: url('../img/button-left.png') top left no-repeat !important;}
	a.btn:hover span{background: url('../img/button-right.png') top right no-repeat !important;}

form#newsletter, form#contact{ padding: 0; margin: 0; width: 100%;}
	form#newsletter fieldset, form#contact{ padding: 0; margin: 0; width: 100%;}
	form#newsletter p{background: url('../img/newsletter-field.png') no-repeat; display: block; width: 217px; height: 21px;}
	form#newsletter p input{ background: transparent;  border: none; padding-top: 4px; height: 16px; display: block; width: 187px; color: #666; font: normal 11px/11px "Lucida Grande", Verdana, sans-serif; margin: 0 15px; outline: none;}

form#newsletter button { border: 0; margin: 0; padding: 0; display: block; text-decoration:none; color: #000; font: bold 11px/25px Helvetica, Arial, sans-serif !important; cursor:pointer; overflow:visible; background: url('../img/form-button.png') no-repeat; height: 25px; text-transform: uppercase; width: 115px; text-align: left; padding: 0 0 0 14px;} 
	form#newsletter button:active{ padding: 0 0 0 14px; margin: 0; }
	form#newsletter button:hover{ color: #582b7a;}

form#contact{ margin-top: 1em;}
	form#contact label{ font: normal 11px/11px "Lucida Grande", Verdana, sans-serif; padding: 0 0 0 10px;}
	form#contact p{background: url('../img/form-fields-input.png') no-repeat; display: block; width: 217px; height: 21px; margin-top: 0px;}
	form#contact p input{ background: transparent;  border: none; padding-top: 4px; height: 16px; display: block; width: 187px; color: #444; font: normal 11px/11px "Lucida Grande", Verdana, sans-serif; margin: 0 15px; outline: none;}
	form#contact div.txt{ background: url('../img/form-input-textarea.png') no-repeat; width: 436px; height: 154px; display: block; padding: 8px; margin: 0 0 8px 0;}
	form#contact div.txt textarea{background: transparent; overflow: auto; border: none;  outline: none; width: 436px; height: 154px; font: normal 11px/16px "Lucida Grande", Verdana, sans-serif; color: #444;}
	form#contact button { border: 0; margin: 0; padding: 0; display: block; text-decoration:none; color: #000; font: bold 11px/28px Helvetica, Arial, sans-serif !important; cursor:pointer; overflow:visible; background: url('../img/form-contact-button.png') no-repeat; height: 28px; text-transform: uppercase; width: 152px; text-align: left; padding: 0 0 0 14px;} 
		form#contact button:active{ padding: 0 0 0 14px; margin: 0; }
		form#contact button:hover{ color: #582b7a;}	

/*
Tables
---------------------------------*/
table{ width: 100%; margin: 8px 0;}
th{ background: #f2f2f2; font-size: 13px; font-weight: normal; height: 22px; line-height: 22px; padding: 0.3em 0.5em; border-bottom: 1px solid #e0e0e0; border-right: 1px solid #e0e0e0;}
td{ padding: 0.3em 0.5em; border-right: 1px solid #e0e0e0; border-bottom: 1px solid #e0e0e0;}

/*
Registration forms
---------------------------------*/
div#div_code{ margin-top:18px;}
form#register p{ position: relative;}
	span.text1rose{ position: absolute; top: 2px; left: -8px;}
	span.text1rose strong{ color: #c10000;}
form#register label span{ color: #C10000;}
form#register input[type=text], form#register select{ background:#FFFFFF; border:2px solid #DFDFDF; padding: 2px;}
	form#register input[type=text]{ width: 65%;}
	form#register button, #mainForm button{ border: 0; margin: 0; padding: 0; display: block; text-decoration:none; color: #000; font: bold 11px/28px Helvetica, Arial, sans-serif !important; cursor:pointer; overflow:visible; background: url('../img/form-contact-button.png') no-repeat; height: 28px; text-transform: uppercase; width: 152px; text-align: left; padding: 0 0 0 14px;} 
		form#register button:active, #mainForm button:active{ padding: 0 0 0 14px; margin: 0; }
		form#register button:hover, #mainForm button:hover{ color: #ec008c;}		
		form#register a.btn, #mainForm a.btn{ font-size: 11px; line-height: 32px;}
			form#register a.btn span, #mainForm a.btn span{ margin-left: 15px;}
div#div_conferences, div#div_coordonnees, div#div_societe{ margin-top: 32px;}
div#errortext{ padding: 10px 0;}

.error, .notice, .success {padding:.8em;margin-bottom:1em;border:2px solid #ddd;}
.error {background:#FBE3E4;color:#8a1f11;border-color:#FBC2C4;}
.notice {background:#FFF6BF;color:#514721;border-color:#FFD324;}
.success {background:#E6EFC2;color:#264409;border-color:#C6D880;}
.error a {color:#8a1f11;}
.notice a {color:#514721;}
.success a {color:#264409;}


/*
Programme box
---------------------------------*/
#left div#programme-box{ position: relative;}
	#left div#programme-box h2 span, #left div#programme-box h3 span{ position: absolute; display: block; width: 78px; height: 16px; font: bold 10.22px/16px "Lucida Grande", Verdana, Arial, sans-serif; left: 0; top: 0; text-transform: uppercase; text-align: right; padding: 0 3px 0 0;}
	
		#left div#programme-box h2 span{ background: #582b7a; color: #fff;}
		#left div#programme-box h3 span{ background: #dadada; color: #582b7a;}
	#left div#programme-box h3{ font: bold 13px/16px Helvetica, Arial, sans-serif; color: #272727; position: relative; padding-left: 88px; text-transform: none !important; margin: 12px 0 0 0;}
	#left div#programme-box h2{ font: bold 14px/17px Helvetica, Arial, sans-serif; color: #582b7a; position: relative; padding-left: 88px; margin: 24px 0 0 0;}
		#left div#programme-box h3 a{ font-size: 11px !important;}
	#left div#programme-box p{ padding-left: 88px; margin: 0 6px 0 0;}
#left a.top{ display: block; border: 1px solid #ccc; border-width: 1px 0 0 0; text-align: right; padding: 2px 0 !important; margin: 14px 0; }


/*
Facebox
---------------------------------*/
#facebox .b{background:url("../img/yellow-border/b.png");}
#facebox .tl{background:url("../img/yellow-border/tl.png");}
#facebox .tr{background:url("../img/yellow-border/tr.png");}
#facebox .bl{background:url("../img/yellow-border/bl.png");}
#facebox .br{background:url("../img/yellow-border/br.png");}
#facebox{position:absolute;top:0;left:0;z-index:991;text-align:left;}
#facebox .popup{position:relative;}
#facebox table{border-collapse:collapse;}
#facebox td{border-bottom:0;padding:0;}
#facebox .body{padding:0;background:#fffad3;border:1px solid #dad6b4;width:548px; padding: 15px; position: relative;}
	#facebox .body p{ color: #010101; font: normal 11px/18px "Lucida Grande", Verdana, sans-serif; margin: 8px 0;}
	#facebox .body h2{ color: #010101; font: bold 17px/20px Helvetica, Arial, sans-serif; display: block; margin: 8px 0;}	
#facebox .loading{padding:20px 0 5px 0;text-align:center;}
#facebox .image{text-align:center;}
#facebox img{border:0;margin:0;}
#facebox .headding{padding:10px 0;text-align:right; border-bottom: 1px solid #dad6b4; margin-bottom: 18px;}
a.close{color:#666;margin-left:5px;display:inline-block;width:15px;height:15px;text-align:center;font:normal 10px/12px Verdana,sans-serif;text-decoration:none;position:absolute;right:20px;top:24px; z-index: 999; width: 60px;}
	a.close:hover{ color: #000;}
	a.close	span{ display: inline-block; width: 7px; height: 7px; background: url('../img/close.gif') top left;}
	a.close:hover span{ background-position: top right;}
#facebox .tl,#facebox .tr,#facebox .bl,#facebox .br{height:10px;width:10px;overflow:hidden;padding:0;}
#facebox_overlay{position:fixed;top:0px;left:0px;height:100%;width:100%;}
.facebox_hide{z-index:-100;}
.facebox_overlayBG{background-color:#FFF; z-index:990;}

/*
Clear floats
---------------------------------*/
.clearfix:after { content: "."; display: block;	height: 0; clear: both;  visibility: hidden;}
.clearfix {	display: inline-block; }
/* Hides from IE-mac \*/ * html .clearfix { height: 1%;}
.clearfix {	display: block;	}
