/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 * Reset
 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

img {
	border:none;
}



/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 * Generic
 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

.invisible {
	display:none;
}

.accessibility {
	display:block !important;
	position:absolute !important;
	left:-9999px !important;

	width:1px !important;
	height:1px !important;
}

.float.left,
.vignette.left {
	float:left;
}

.float.right,
.vignette.right {
	float:right;
}

.fullwidth {
	clear:both;
}

.center {
	text-align:center;
}


/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 * Primary elements
 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

html {
	height:100%;
	overflow-y:scroll;
}

body {
	margin:0;
	padding:0;
	padding-bottom:32px;

	background:black;

	font-family:sans-serif; /* 'Helvetica Neue' */
	font-size:12px;
}

#page {
	margin:0 auto 32px auto;
	border:solid #EE3F34 4px;
	border-top:none;
	width:980px;
}

#header h1 {
	margin:0;
	padding:0;
}

#header h1 a {
	display:block;

	margin:0 0 8px 0;
	padding:0;
	width:480px;
	height:144px;

	background:url('makingprod.gif') right no-repeat;

	text-indent:-9999px; /* hide text */
	overflow:hidden; /* outline correctly */
}

#main {
	clear:both;

	margin:8px;
	margin-top:0;

	background:white url('bg-corporate.gif') right top no-repeat;

	min-height:640px;
}

#footer {
	clear:both;

	margin:8px;
	height:16px;

	line-height:16px;
	color:#A0A0A0;
	font-size:80%;
}

#footer .authoring {
	float:left;

	margin:0;
}

#footer .updatelog {
	display:block !important;
	position:absolute !important;
	left:-9999px !important;

	width:1px !important;
	height:1px !important;
}

#footer .moreinfo {
	float:right;

	margin:0;
}

#footer ul {
	margin:0;
	padding:0;

	list-style:none;
}

#footer li {
	display:inline;
	padding:0;
	padding-left:16px;
}

#footer a {
	color:#A0A0A0;
	text-decoration:none;
}

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


/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 * Navigation menu
 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

#navigation ul {
	margin:0 8px 0 8px;
	padding:0;

	list-style:none;
}

#navigation li {
	position:relative;
	float:left;

	margin:0;
	margin-left:19px;
	padding:0;
}

#navigation li a {
	display:block;

	width:170px;
	height:48px;

	text-indent:-9999px; /* hide text */
	overflow:hidden; /* outline correctly */

	background:black left top no-repeat;

	text-decoration:none;
}

#navigation li:hover a,
#navigation li a:hover,
#navigation li a:focus,
#navigation li a:active {
	background-position:left -96px;
}

#navigation li.active a {
	background-color:white;
	background-position:left -48px;
}

#navigation li.active:hover a,
#navigation li.active a:hover,
#navigation li.active a:focus,
#navigation li.active a:active {
	background-position:left -144px;
}

#navigation li.submenu:hover a {
	background-color:#E0E0E0;
	background-position:left -192px;
}

/* We do not specify #navigation here in order to simplify cascading for submenus */
li#nav-home      a { background-image:url('tab-home.gif'); }
li#nav-corporate a { background-image:url('tab-corporate.gif'); }
li#nav-series    a { background-image:url('tab-series.gif'); }
li#nav-presse    a { background-image:url('tab-presse.gif'); }
li#nav-projets   a { background-image:url('tab-projets.gif'); }

#navigation li#nav-home.active a {
	background:black;
}



#navigation .submenu ul {
	position:absolute;
	top:-9999px;
	left:-58px;

	border:solid #A0A0A0 1px;
	border-top:none;
	width:328px;

	background:#E0E0E0;
}

#navigation .submenu:hover ul {
	top:48px;
}

#navigation .submenu li {
	margin:0;
}

#navigation .submenu li a {
	margin:0;
	padding:4px;
	width:320px;
	height:48px;

	background:#E0E0E0;
	color:#404040;

	text-indent:0;
}

#navigation li.submenu li a:hover {
	background:#EE3F34;
	color:white;
}

#navigation .submenu li img {
	margin:0;
	margin-right:4px;
	border:none;
	float:left;
}

#navigation .submenu li em {
	display:block;

	color:#606060;

	font-style:normal;
	font-weight:bold;
	font-size:150%;
	line-height:100%;
}

#navigation .submenu li a:hover em {
	color:black;
}



/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 * Topic menu
 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

.topicmenu {
	margin:0;
	margin-bottom:32px;
	height:32px;

	background:#EE3F34;

	font-size:133%;
	line-height:32px;
}

.topicmenu ul {
	list-style:none;

	margin:0;
	padding:0 19px 0 19px;
}

.topicmenu li {
	display:inline;

	margin:0;
	margin-right:48px;
	padding:0;
	width:160px;
}

.topicmenu a {
	color:white;
	font-weight:bold;
	text-decoration:none;
}

.topicmenu .active a {
	color:black;
	font-weight:normal;
}

.topicmenu a:hover,
.topicmenu a:focus,
.topicmenu a:active {
	color:black;
}

.topicmenu .active a:hover,
.topicmenu .active a:focus,
.topicmenu .active a:active {
	color:white;
}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 * Content
 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

#main {
	color:#404040;
	padding:1px 0 1px 0; /* to avoid margin-collapsing */
}

h2 {
	margin:-1px 0 0 0;
	height:128px;
	padding:0 19px 0 19px;

	color:#404040;

	font-size:250%;
	font-weight:bold;
	line-height:128px;
}

.content {
	margin:19px 32px 19px 32px;
}


.content a {
	margin-bottom:-1px;
	border-bottom:solid black 1px;
	padding:0 1px 0 1px;

	color:black;

	white-space:nowrap;
	text-decoration:none;
}

.content a:hover,
.content a:focus,
.content a:active {
	background:black;
	color:white;
}


.content a.passivelink,
.content .passivelink a {
	padding:0;
	margin:0;
	border:none;
	background:transparent;
}


.content a.altlink,
.content .altlink a {
	margin:0;
	border:none;

	font-weight:bold;
}


.content a.imglink,
.content .imglink a {
	padding:1px;
	margin:0;
	border:none;
	background:transparent;
}

.content a.imglink img,
.content .imglink a img {
	border:none;
	vertical-align:top;
	margin:1px;
}

.content a.imglink:hover,
.content a.imglink:focus,
.content a.imglink:active,
.content .imglink a:hover,
.content .imglink a:focus,
.content .imglink a:active {
	background:transparent;
	color:black;
}

.content a.imglink:hover img,
.content a.imglink:focus img,
.content a.imglink:active img,
.content .imglink a:hover img,
.content .imglink a:focus img,
.content .imglink a:active img {
	border:solid black 1px;
	margin:0;
}


.content h3 {
	margin:32px 0 4px 0;

	font-size:150%;
	font-weight:normal;
	line-height:32px;
}

.content h4 {
	margin:16px 0 2px 0;

	color:#EE3F34;

	font-size:120%;
	font-weight:bold;
}

.content h5 {
	margin:0;

	font-size:100%;
	font-weight:bold;
}

.content p {
	margin:0;
	margin-bottom:8px;
}

.content ul {
	margin:0;
	margin-bottom:8px;
	padding:0 0 0 1.5em;
}

.content li {
	margin:4px 0 4px 0;
}

.content .nobullets {
	list-style-type:none;
	padding:0;
}

.nobullets li {
	margin:4px 0 4px 0;
}

.content img.float,
.content .vignette {
	margin:8px;
}

img.float.left,
.vignette.left {
	margin-left:0;
}

img.float.right,
.vignette.right {
	margin-right:0;
}

img.float.top,
.vignette.top {
	margin-top:0;
}

img.float.bottom,
.vignette.bottom {
	margin-bottom:0;
}

address {
	margin:0px 0 8px 0;
	font-style:normal;
}

abbr {
	border:none;
}

q,
blockquote {
	font-style:italic;
	font-family:serif;
}

q:before,
q:after {
	content:'';
}

q q,
blockquote q {
	font-style:normal;
}

q cite,
blockquote cite {
	font-style:normal;
	font-family:sans-serif;
}



/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 * Layout
 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

.maincolumn {
	float:left;

	width:640px;
}

.additionalcolumn {
	float:right;

	width:240px;
}

.additionalcolumn h4 {
	font-weight:normal;
}



.column1of2,
.column1of3,
.column2of3,
.column3of3 {
	float:left;
/*	margin-right:16px;*/
}

.column2of2 {
	float:right;
}

.column1of2,
.column2of2 {
	width:48%;
}

.column1of3,
.column2of3,
.column3of3 {
	width:32%;
}



/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 * Panels
 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

.panel {
	margin-bottom:16px;
	padding:16px;
}

.panel.maincolumn {
	width:608px;
}

.panel.additionalcolumn {
	width:208px;
}

.panel h3 {
	margin:-16px -16px 16px -16px;
	padding:0 16px 0 16px;
	height:30px;

	font-size:133%;
	font-weight:bold;
	line-height:32px;
}

.panel.light {
	background:white url('panel-light-bg.jpg') right bottom no-repeat;
}

.panel.light h3 {
	border-style:solid;
	border-width:1px;
	border-color:#F0F0F0 #606060 #606060 #F0F0F0;

	background:#C0C0C0 url('panel-light-title.gif') left 50% repeat-x;
}

.panel.dark {
	background:#C0C0C0 url('panel-dark-bg.jpg') right bottom no-repeat;
	color:black;
}

.panel.dark h3 {
	border-style:solid;
	border-width:1px;
	border-color:#E0E0E0 #282828 #282828 #E0E0E0;

	background:#808080 url('panel-dark-title.gif') left 50% repeat-x;
	color:white;
}

.panel.dark h4 {
	color:white;
	font-weight:normal;
}

.panel.dark h4 a {
	margin:0;
	border:none;
	padding:0;

	color:white;
}

.panel.dark h4 a:hover,
.panel.dark h4 a:focus,
.panel.dark h4 a:active {
	background:transparent;

	text-decoration:underline;
}



/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 * Table of Contents with image
 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

/*.imagetoc {
	margin:16px 0 16px 0;
}

.imagetoc {
	margin:16px 0 16px 0;
}*/



/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 * Topic summary
 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

.summary {
	clear:both;

	margin:16px 0 16px 0;
	height:144px;
	padding:16px;

	background:white url('panel-light-bg.jpg') right bottom no-repeat;
}

.summary h3 {
	margin:0;
	margin-bottom:8px;

	line-height:100%;
}

.summary h3 a {
	color:#606060;
}

.summary p {
	margin:8px 0 8px 0;
	height:96px;
}

.content .summary a img {
	float:left;
	margin-right:16px;
}

.content .summary a.imglink:hover img,
.content .summary a.imglink:focus img,
.content .summary a.imglink:active img {
	margin-right:15px;
}

.summary ul {
	list-style:none;

	margin:0;
	padding:0;
}

.summary li {
	display:inline;

	margin:0;
	margin-right:16px;
	padding:0;
}

.summary li a {
	margin:0;
	border:none;

	color:#404040;	
	font-weight:bold;
}



/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 * Galleries
 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

.picturegallery ul,
ul.picturegallery {
	list-style:none;

	margin:0;
	padding:0;
}

.picturegallery li {
	float:left;

	margin:0 8px 8px 0;
	padding:0;
}



.thumbnailstrip ul,
ul.thumbnailstrip {
	list-style:none;

	margin:0 auto 0 auto;
	padding:0;
}

.thumbnailstrip li {
	float:left;

	margin:0 8px 0 0;
	padding:0;
}


/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 * Page-specific modifiers
 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

body.home #main,
body.series #main        { background:white; }

body.contact #main       { background:white url('bg-contact.jpg') right top no-repeat; }
body.press #main         { background:white url('bg-presse.jpg') 150% 16px no-repeat; }
body.about #main         { background:white url('bg-about.gif') right -6px no-repeat; }
body.invincibles #main   { background:white url('bg-paper.jpg') right -250px; }
body.putaindeserie #main { background:white url('bg-stains.jpg') right 100px; }

body.invincibles h2   { background:url('title-invincibles.jpg') no-repeat; }
body.putaindeserie h2 { background:url('title-putaindeserie.jpg') no-repeat; }

body.invincibles h2,
body.putaindeserie h2 {
	height:160px;
	margin-bottom:-32px;
	text-indent:-9999px; /* hide text */
}

body.invincibles .topicmenu,
body.putaindeserie .topicmenu {
	background:transparent;
}



body.home .content {
	margin:19px;
}

body.home .panel.maincolumn {
	width:628px;
}



body.company .content {
	margin:64px 48px 64px 48px;
}

body.company img.float {
	margin-bottom:32px;
}

body.company img.float.left {
	margin-right:32px;
}

body.company img.float.right {
	margin-left:32px;
}


body.chart .content {
	margin-left:16px;
	margin-right:16px;
}


body.contact .column1of3 {
	width:auto;
}

body.contact .column2of3 {
	margin-left:48px;
	margin-right:48px;
	width:344px;
}

body.contact .column3of3 {
	width:260px;
}

body.contact .column1of3 h4,
body.contact .column3of3 h4 {
	float:left;
	clear:both;

	margin:0;

	font-size:100%;
	font-weight:bold;
}

body.contact .column1of3 h4 {
	width:2.5em;
}

body.contact .column3of3 h4 {
	width:5em;
}

body.contact h3,
body.contact address {
	margin-bottom:16px;
}



body.about .content {
	margin-left:64px;
	margin-right:64px;
}

body.about.tech .content {
	margin-right:240px;
}



body.press .article h3 a {
	margin:0px;
	border:none;
	padding:0;

	color:#606060;
}

body.press .article h3 a:hover,
body.press .article h3 a:focus,
body.press .article h3 a:active {
	background-color:transparent;
	color:black;
}

body.press .article .title {
	margin:2px 0 2px 0;

	color:#EE3F34;

	font-size:120%;
	font-weight:bold;
}



body.invincibles .character h3 {
	font-weight:bold;
	margin-bottom:0;
}

body.invincibles .character h3 .subtitle {
	font-weight:normal;
}

body.invincibles .character {
	margin-bottom:32px;
	clear:both;
}

body.invincibles .character .float {
	margin-top:-48px;
	clear:both;
}

body.invincibles .characterlist .float {
	margin-left:8px;
	margin-top:-4px;
	margin-bottom:16px;
	clear:both;
}

body.invincibles .characterlist h4 {
	clear:both;
}

body.invincibles .intro {
	font-weight:bold;
}

body.invincibles .character .intro {
	font-style:italic;
	font-weight:normal;
}

body.invincibles .character .intro em {
	font-weight:bold;
}

body.invincibles .character h4 {
	margin-bottom:2px;
}

body.invincibles .charactersection h5 {
	float:left;
	clear:left;

	width:8em;
}

body.invincibles .charactersection p {
	margin:2px 0 2px 8em;
}


body.invincibles.behindthescene .additionalcolumn {
	margin-top:32px;
}


body.putaindeserie .character h3 .subtitle {
	font-size:90%;
}

body.putaindeserie .character .intro {
	color:#EE3F34;

	font-weight:bold;
}