/*
**  @author : wimake
*/

/****
* Librairies (CSS reset...)
****/

html,body,span, applet,object,iframe, h1,h2,h3,h4,h5,h6,p,blockquote,pre, a,abbr,acronym,address,big,cite,code, del,dfn,em,font,img,ins,kbd,q,s,samp, small,strike,strong,sub,sup,tt,var, dd,dl,dt,li,ol,ul, fieldset,form,label,legend, table,caption,tbody,tfoot,thead,tr,th,td
{margin:0;padding:0;border:0;font-weight:inherit;font-style:inherit;font-size:100%;line-height:1.3em;font-family:inherit;}
a img,:link img,:visited img{border:0;}
/*table{border-collapse:collapse;border-spacing:0;}*/
ul{list-style:none;}
ol{list-style: decimal inside};
q:before,q:after, blockquote:before,blockquote:after{content:"";}
strong,h1,h2,h3,h4,h5,h6 {font-weight:bold;}
em{font-style:italic;}
input, textarea, select  {font-size:99%}
* {outline:none;margin: 0; padding: 0}


/****
* Styles generaux
****/

body {font: 10px Arial, Helvetica, sans-serif;background: #FFFFFF;margin: 0;padding: 0;color: #333;}

a {text-decoration:none; color:#333;}
a:hover {text-decoration:none; color:#0082bd;}

/* alignement (vertical-align, text-align */
.txtL{text-align:left !important;}
.txtC{text-align:center !important;}
.txtR{text-align:right !important;}
.txtT{vertical-align:top !important;}
.txtM{vertical-align:middle !important;}
.txtB{vertical-align:bottom !important;}
.txt12{font-size: 12px;}

/* positionnement flottant */
.floatL, .float_l {float:left;}
.floatR, .float_r {float:right;}
.clearfl {clear: both;}

/* colonnes */
.col1 {width: 150px; margin-right: 10px;}
.col2 {width: 500px; margin-right: 10px;}
.col3 {width: 150px; margin-right: 10px;}
.col4 {width: 170px;}

/* largeurs des blocs */
.size1on1{float:none !important;margin-right:0; width:auto}
.size1on2{width:497px !important;}
.size1on3{width:32.3% !important;}
.size2on3{width:66% !important;}
.size1on4{width:23.8% !important;}
.size3on4{width:74.8% !important;}
.size1on5{width:18.8% !important;}
.size2on5{width:39% !important;}
.size3on5{width:58% !important;}
.size4on5{width:78% !important;}

.size1on3fix{width:166px !important;}

.minH3 {min-height: 280px;}
.minH1 {min-height: 120px;}
.spacer{min-height: 15px;}

#message-box {color: #cc0000;text-align: center;}

/****
* Structure principale
****/
#global {margin:0 auto;width:1000px;}

#main {float:left;width:1000px; min-height: 400px; padding-top: 3px;}
#header {background:url(skin/header.png) no-repeat; width: 1000px; height: 100px;}
#footer {background: url(skin/footer.jpg) no-repeat; padding:1px 0 1px; margin-top:3px; text-align:center; width: 100%; min-height: 60px; color: #fff; font-weight: bold}
#footer a {color: #fff;}
#footer-content {padding:1px 0 1px; margin-top:3px; text-align:center;}

#nav {float: left; margin-left: }
#nav ul li {display:inline; padding: 5px 5px 0 0; font-weight: bold;}
#nav ul span {min-height: 15px;}

/****
* Composants principaux
****/
.railway {background: #fff;padding-left: 3px; padding-top: 3px; min-height: 16px; border-bottom: 1px dotted #ccc; border-top: 1px dotted #ccc; border-right: 1px dotted #ccc}
.railway ul li {display:inline; background:url(skin/arrow.png) no-repeat left center; padding:0.2em 0 0.2em 8px; font-size: 9px; font-weight: bold}

.media {float: left; border: 0}

.arrow {background:url(skin/arrow.png) no-repeat left center; padding:0 0 0.2em 8px; font-size: 9px; font-weight: bold}
.arrow-big {background:url(skin/arrow_big.png) no-repeat left center; padding:5px 5px 5px 28px; font-size: 9px; font-weight: bold;}
.arrow2 {background:url(skin/arrow2.png) no-repeat left center; padding:0 0 0.2em 8px; font-size: 9px; font-weight: bold; color: #0082bd}
.arrow3 {background:url(skin/arrow3.png) no-repeat left center; padding:0 0 0.2em 8px; font-size: 9px; font-weight: bold; color: #0082bd}

#title {min-height: 55px; margin-top: 5px;}
#title h1 {font-size: 16px; background: #eee; padding-left: 5px;}
#title .content {}
#title span {font-size: 10px}

/****
* Header
****/
h1 a {background: url(skin/logo.png); float:left; display:block;width:150px;height:100px;text-indent: -5000px}


/****
* tabs
****/
#tabs-container {background-color:#0082bd; position:relative; height:114px; width:490px; padding: 5px;}
.tab { height:114px; position:absolute; width:490px; overflow:hidden; background: #eee;}
.tabs li {background: url(skin/top.png) no-repeat; float: left; background-color: #666; padding: 2px 5px 2px 5px; margin-right: 2px; cursor: pointer; height: 16px; line-height: 16px; min-width: 140px;}
.tabs li a { color:#fff; display:inline; padding-left: 15px;text-decoration:none;width:auto; font-weight: bold;}
.tabs li.active { background-color:#0082bd; }
.tabs li a.active { color:#fff; }
.tabs li a.none {padding: 0; margin: 0;}

.next {background: #eee url(skin/arrow3.png) no-repeat center center; width: 14px; height: 114px;float: left; cursor: pointer;}
.prev {background: #eee url(skin/arrow2.png) no-repeat center center; width: 14px; height: 114px;position: absolute; left: 476px; cursor: pointer;}

.info-video {
	position: absolute; top: 75px; background: #000;  width:144px;height: 30px overflow: hidden; color: #fff; font-weight: bold; padding: 5px;
    opacity:0.6;
    filter : alpha(opacity=60);
	/* pour IE 7 */
	min-height: 30px;
	/* pour IE 6 */
	height: auto !important;
	height: 30px;
}

/****
* Box
****/
.box {margin-bottom: 10px;}
.box h2 {background: #0082bd; min-height: 19px;}
.box h2 span {display:block; background:url(skin/arrow.png) no-repeat left center; padding:0.5em 0 0.4em 18px; font-size: 9px; font-weight: bold; color: #fff;}
.box h2 span.plus {background:url(skin/plus.png) no-repeat left center;}
.box h2 span.copy {background:url(skin/copy.png) no-repeat left center;}
.box h2 span.comment {background:url(skin/comment.png) no-repeat left center;}

.box h2.lgreen {background: #33cc66;}
.box h2.purpule {background: #cc99ff;}
.box h2.orange {background: #ff9900;}
.box h2.red {background: #b61b1b;}
.box h2.green {background: #1bb681;}

.box-content{background: #eee; padding: 5px 5px 5px 5px;}

/* Newsletter */
#newsletter {padding-top: 16px; text-align: right; min-height: 48px;}
#newsletter input {border: 1px solid #0082bd;}
#newsletter input.ok {border: 0; background: #0082bd; color: #fff; margin-right: 2px;}

input.btn {background: #0082bd; color: #fff; border: 0;}

#contact input {border: 1px solid #0082bd;margin-bottom: 5px;}

/****
* Specific
****/

/*  */
.answer {padding-left: 5px;}

.square {list-style: square; margin-left: 10px}

.pourcentage {padding: 2px 2px 2px 2px; font-weight: bold; color: #fff;}

#news {margin-left: 210px;}
#newsletter-message{text-align: right;}
#newsletter-message span {text-align: right; color: #cc0000; background: #fff;}

.news-date {border-left: 1px solid #999; border-bottom: 1px solid #999; width: 97%; font-weight: bold; margin-bottom: 3px; padding-left: 3px; color: #00537c}
.news-image {background: #eee; border: 1px solid #666; float: left; margin-right: 3px; width: 50px; height: 38px; text-align: center; vertical-align: middle; overflow: hidden;}
.news-title {}


.channel {background: url(skin/channel.png) no-repeat; overflow: hidden; width: 158px; height: 20px; padding-top: 6px;}
.channel a {font-weight: bold; font-size: 9px; color: #fff; padding-left: 22px}
.channel a:hover {font-weight: bold; color: #ccc}

