/*------------------------------------------------------------------

[Home Stylesheet] -> Home layout spec



Project:	Brainsonic Website

Version:	2.0

Author:		JC "GoOz" Pagnon

URI:		www.brainsonic.com

-------------------------------------------------------------------*/

/*------------------------------Bandeau Slider---------------------*/

#slider {

    margin: 0 auto;

    position: relative;

}

.scroll {

    height: 300px;

    overflow: auto;

    overflow-x: hidden;

    position: relative;

    clear: left;

    width: 981px;

}

.scrollContainer div.panel {

    padding: 0;

    height: 300px;

    width: 981px;

}

.scrollContainer div.panel .describe {

	height: 100%;

	background-color: black;

	opacity: 0.8;

	filter: alpha(opacity=80);

	-moz-opacity: 0.8; 

	width: 250px;

    margin: 0;

    padding: 0;

	float: right;

	color: white;

	position: relative;

	line-height: 2em;

	overflow: hidden;

}

.scrollContainer div.panel .subtitle {

	margin: 0 15px;

	padding: 10px 0 0;

}

.scrollContainer div.panel h2,

.scrollContainer div.panel p {

	padding: 15px 15px 5px;

}

.scrollContainer div.panel .more {

	position: absolute;

	bottom: 0;

	height: 39px;

}

ul.navigation {

    list-style: none;

    margin: 0;

    padding: 0;

    padding-bottom: 9px;

	width: 26%;

	position: absolute;

	z-index: 10;

	top: 10px;

	left: 10px;

}

ul.navigation li {

    display: inline;

    margin: 0 1px;

	float: left;

}

ul.navigation a {

    padding: 5px;

	opacity: 0.8;

	filter: alpha(opacity=80);

	-moz-opacity: 0.8;

	float: left;

	margin: 0 0 1px;

	white-space:nowrap;

}

ul.navigation a:hover,

ul.navigation a.selected {

	opacity: 1;

	filter:alpha(opacity=100);

	-moz-opacity:1;

}

ul.navigation a:focus {

    outline: none;

}

.hide {

    display: none;

}

/*.scrollContainer div.panel#voeux {

	background-image: url(../images/focus100ans.jpg);

}*/
.scrollContainer div#bestoff.panel {
    background-image: url("../images/focusBestoff.jpg");
}

.scrollContainer div.panel#voeux {

	background-image: url(../images/focusMarc.jpg);

}

.scrollContainer div.panel#facebook {

	background-image: url(../images/focusFacebook.jpg);

}

.scrollContainer div.panel#encoding {

	background-image: url(../images/focusEncodingAll.jpg);

}

.scrollContainer div.panel#live {

	background-image: url(../images/focusLive.jpg);

}

.scrollContainer div.panel#100ans {

	background-image: url(../images/focus100ans.jpg);

}

.scrollContainer div.panel#studios {

	background-image: url(../images/focusStudios.jpg);

}

.scrollContainer div.panel#event {

	background-image: url(../images/focusEvents.jpg);

}

.scrollContainer div.panel#slideo {

	background-image: url(../images/focusSlideo.jpg);

}

.scrollContainer div.panel#webtv {

	background-image: url(../images/focusWebtv.jpg);

}

.scrollContainer div.panel#visibility {

	background-image: url(../images/focusVisibility.jpg);

}

.scrollContainer div.panel#media {

	background-image: url(../images/focusMedia.jpg);

}

.scrollContainer div.panel#videomail {

	background-image: url(../images/focusMailvideo.jpg);

}

.scrollContainer div.panel#magicstudio {

	background-image: url(../images/focusMagicstudio.jpg);

}

.scrollContainer div.panel#webcast {

	background-image: url(../images/focusWebcast.jpg);

}

.scrollContainer div.panel#apps {

	background-image: url(../images/focusApps.jpg);

}

/*--------------------------------------------------------------------*/

/*------------------------------Content---------------------*/

.dotted {

	background: url(../images/dot.gif) repeat 0 0;

	overflow: hidden;

	width: 100%;

	height: 18px;

}

.thin {

	height: 9px;

}

.column {

	width: 330px;

	height: 437px;

	float: left;

	display: inline;

}

.right {

	float: right;

}

.more-all-whitebooks, .more {

	background: #e1e1e1 url(../images/bgRadiusMore.gif) no-repeat top right;

	padding: 0 5px 0 0; 

}

.more-all-whitebooks  span, .more span {

	background-color: white;

	padding: 0 3px;

	margin-right: 2px;

}

/*----------------NewsReader---------------*/

#newsReader {

	padding: 0 12px 0;

	height: 250px;

}

#newsReader h2 {

	margin: 3px 0 0 10px;	

}

#newsReader ul {

	margin-bottom: 20px;

}

#newsReader li {

	margin: 10px 0;

}

#newsReader p {

	background: transparent url(../images/puce2.gif) no-repeat 0 6px;

	padding: 0 0 0 10px;

	}

#newsReader p.date, #newsReader p a {

	background: none;

}

#newsReader p a {

	display: block;

}

#newsLinks { 

	padding:8px 10px 0;

}

#newsLinks .more {

	float: right;

}

/*----------------NewsletterSubscription---------------*/

#newsletterSubscription {

	background: #192a38 url(../images/bgFormNewsletter.png) no-repeat 0 0;

	width: 299px;

	height: 137px;

	margin: 15px auto;

	position: relative;

}

#newsletterSubscription h2 {

	height: 38px;

	padding: 15px 0 0 12px;

}

#newsletterSubscription p {

	padding: 0 5px 0 19px;

}

#newsletterSubscription p.formInputs {

	margin-top: 40px;

}

#newsletterSubscription input {

	height: 16px;

	width: 160px

}

#newsletterSubscription input.submit {

	border: none;

	background: url(../images/btnSubmitNewsletter.png) no-repeat 0 0;

	height: 64px;

	width: 55px;

	cursor: pointer;

	text-indent: -5000px;

	position: absolute;

	top: 31px;

	right: 15px;

}

#newsletterSubscription p.formInputs a {

	position: absolute;

	top: 31px;

	right: 15px;

}

#formNewsletterContainer {

	overflow: hidden;

	padding:  10px 0 10px 20px;

	position: relative;

}

#formNewsletterContainer #mask {

	overflow: hidden;

	position: relative;

	width: 340px;

}

#formNewsletterContainer h2 ol {

	height: 37px;

}

#formNewsletterContainer h2 ol li {

	display: inline;

	margin-right: 10px;

	height: 37px;

}

#formNewsletterContainer h2 ol li:first-child {

	background: url(../images/spriteStepArrow.png) no-repeat center right;

	padding-right: 20px;

}

#btnNext, #btnSubmit {

	position: absolute;

	bottom: 50px;

	left: 178px;

	z-index: 10;

}

#formNewsletterContainer #btnNext a img {

	vertical-align: middle;

}

#formNewsletterContainer #btnSubmit {

	position: absolute;

	left: 450px;

	bottom: 60px;

	width: auto;

	height: auto;

	margin: 0;

}

#formNewsletterContainer #btnSubmit input {

	background: url(../images/btnNewsletterAlpha.png) no-repeat center right;

	border: none;

	display: block;

	cursor:pointer;

	width: 200px;

	height: 55px;

	padding-right: 55px;

}

#formNewsletter {

	position: relative;

	width: 800px;

	height: 340px;

}

#formNewsletter fieldset {

	float: left;

	display: inline;

	width: 350px;

}

#formNewsletter div, #formNewsletter p {

	width: 230px;

	margin: 20px 0;

	position: relative;

}

#formNewsletter legend {

	display: none;

}

#formNewsletter input {

	width: 160px;

	height: 15px;

}

#formNewsletter input.radio, #formNewsletter input.checkbox {

	width: auto;

	height: auto;

}

#formNewsletter input.radio {

	vertical-align: text-bottom;

}

#formNewsletter label.radio {

	margin-right: 15px;

}

#formNewsletter #checkboxes {

	padding-left: 60px;

	width: 170px;

}

#formNewsletter #checkboxes div {

	float: left;

	display: inline;

	width: 80px;

	margin: 3px 0;

}

#formNewsletter label.error {

	position: absolute;

	right: -110px;

	width: 100px;

}

/*----------------WhitePaper---------------*/

#whitePaper {

	padding-left: 10px;

	height: 253px;

}



#whitePaper h2 {

	margin: 3px 0 20px 10px;

	display:block;

	overflow:hidden;

}



#whitePaper .column {

	width: 140px;

	margin-left: 10px;

	height: auto;

}

#whitePaper .column ul {

	margin-left: 20px;

	height: 100px;

}

#whitePaper .column ul li {

	list-style-type: square; 

	list-style-image: url(../images/puce2.gif);

	margin: 3px 0;

}

#whitePaper .more {

	float: right;

}



#whitePaper .more-all-whitebooks {

	float: right;

	margin:0px 20px 0px 0px;

}



/*----------------PressReader---------------*/

#pressReader {

	padding: 10px 18px 0;

}

#pressReader h2 {

	margin: 8px 0 0;

}

#pressReader .more {

	float: right;

}

#pressReader ul {

	background: #E1E1E1 url(../images/bgPressReader.png) no-repeat 0 0;

	width: 273px;

	height: 86px;

	margin: 6px auto 0;

	padding: 10px;

}

#pressReader ul li {

	clear: left;

	line-height: 1.1;

}

#pressReader .thumbContainer {

	float: left;

	background: url(../images/bgPressReaderThumb.png) no-repeat 0 0;

	height: 35px;

	width: 35px;

	margin: 0 10px 10px 0;

}

/*----------------LastProjects---------------------*/

#lastProjects {

	position: absolute;

	background: transparent url(../images/bgReal.png) no-repeat 0 0;

	width: 332px;

	height: 429px;

	top: -11px;

	left: 323px;

	text-align: center;

	padding-top: 50px;

}

#lastProjects a {

	display: block;

	overflow: hidden;

	width: 300px;

	height: 99px;

	margin: 1px auto;

}

#lastProjects #shadowTop {

	position: absolute;

	top: 51px;

	left: 0;

	z-index: 10;

}

#lastProjects #shadowBottom {

	position: absolute;

	bottom: 29px;

	left: 0;

	z-index: 10;

}

#lastProjects .desc {

	display: none;

	position: absolute;

	top: 51px;

	left: 16px;

}

#lastProjects .desc .infos {

	position: absolute;

	bottom: 10px;

	left:5px;

	text-align: left;

	width: 300px;

}

#lastProjects .desc .infos a.external {

	float: right;

	margin:5px 30px 0 10px;

}

#lastProjects .desc .close {

	position: absolute;

	top: -1px;

	right: 0;

	z-index: 2;

}

#lastProjects .desc a {

	display: inline;

	width: auto;

	height: auto;

}

#lastProjects .desc .infos span {

	font-size: 1.6em;	

}

/*----------------404 page---------------------*/

#banner img {

	vertical-align: bottom;

}

#error .text {

	width: 694px;

	height: 417px;

	padding: 10px 18px;

}

#error .text p {

	margin: 35px 0 0;

}

#error .text #redirect {

	margin: 20px 0 0;

}

#error .right {

	width: 250px;

	background:transparent url(../images/dot.gif) repeat scroll 1px 0;

}