/* CSS Document */
*{
margin:0;
padding:0;
outline:none;
}

h1,a,li,span { 
behavior: url("iepngfix/iepngfix.htc") /* IE6 pngFix */
}

html, body, #wrap { /* hack footer */
height: 100%;
}

body > #wrap { /* hack footer */
height: auto; 
min-height: 100%;
}

body{
font-family:Arial, Helvetica, sans-serif;
font-size:11px;
color:#ccc;
background:#4c4c4c url(../img/gardient.jpg) top left repeat-x;
}

#wrap{}
#tot-width{
padding-bottom:86px; /* hack footer */
overflow:hidden;
}

#global{
position:relative;
width:965px;
margin:auto;
padding-top:50px;
}

a img{
border:none;
}

h1{
font-family:calibri, arial;
}

.clear{
clear:both;
}

.color1{color:#00cfdc;} /*Cyan*/
.color2{color:#afce06;} /*Vert*/
.color3{color:#f94b22;} /*Orange*/
.color4{color:#fde624;} /*Blanc*/

/*************************************************
-> HEADER
**************************************************/

h1#logo a{
position:absolute;
top:0;
left:0;
display:block;
background:url(../img/logo-eventsee.png) top left no-repeat;
width:179px;
height:83px;
text-indent:-9999px;
}

#header{
overflow:hidden;
height:290px;
}

#banner{
background:url(../img/background-slideshow.jpg) top left no-repeat;
padding:5px 5px 0 5px;
float:right;
width:955px;
}

/*************************************************
-> MENU
**************************************************/

ul#menu{
margin:17px 0 0 0;
list-style-type:none;
height:26px;
float:right;
}

ul#menu li{
float:left;
}

ul#menu li a{
display:block;
height:26px;
text-indent:-9999px;
margin-right:3px;
}

ul#menu li a.menu-accueil{ background:url(../img/menu/accueil.jpg) top left no-repeat; width:65px;}
ul#menu li a.menu-agenda{ background:url(../img/menu/agenda.jpg) top left no-repeat; width:69px;}
ul#menu li a.menu-galeries{ background:url(../img/menu/galeries.jpg) top left no-repeat; width:73px;}
ul#menu li a.menu-videos{ background:url(../img/menu/videos.jpg) top left no-repeat; width:63px;}
ul#menu li a.menu-references{ background:url(../img/menu/references.jpg) top left no-repeat; width:87px;}
ul#menu li a.menu-partenaires{ background:url(../img/menu/partenaires.jpg) top left no-repeat; width:95px;}
ul#menu li a.menu-qui{ background:url(../img/menu/qui.jpg) top left no-repeat; width:134px;}
ul#menu li a.menu-contact{ background:url(../img/menu/contact.jpg) top left no-repeat; width:72px; margin-right:0;}

ul#menu li a:hover, ul#menu li a#menu-active{background-position:0 -26px;}


/*************************************************
-> CONTENT
**************************************************/

#content{
clear:both;
width:955px;
margin:auto;
}

#content p{
line-height:16px;
text-align:justify;
margin-bottom:12px;
}

#content h1{
color:white;
font-size:26px;
text-transform:uppercase;
margin:0 0 25px 0;
}

#content h2{
font-size:16px;
margin:0 0 8px 0;
}

#content h3{
font-size:12px;
color:#fff;
}

/* -> EVENT HOME */

#content ul#event-home{
list-style-type:none;
overflow:hidden;
} 

#content ul#event-home li{
position:relative;
float:left;
margin:0 25px 28px 0;
}

#content ul#event-home li a{
text-decoration:none;
}

#content ul#event-home li a:hover{
text-decoration:underline;
}

#content ul#event-home li.last{
margin-right:0;
}

#content ul#event-home li a img{
border:10px solid white;
width:200px;
height:265px;
}

#content ul#event-home li h2{
font-size:11px;
margin:10px 0 4px 0;
}

#content ul#event-home li span{
color:#a6a6a6;
}

/* -> VIDEO HOME */

#content ul#event-home li a.play{
position:absolute;
top:50%;
left:50%;
margin:-44px 0 0 -32px;
display:block;
width:64px;
height:64px;
background:url(../img/play.png) top left no-repeat;
text-indent:-9999px;
}

/* -> REF HOME */

#content ul#ref-home{
clear:both;
list-style-type:none;
border-top:1px dotted #999;
margin:0;
padding:15px 0;
}

#content ul#ref-home li{
position:relative;
float:left;
margin:0 29px 15px 0;
width:65px;
height:59px;
}

#content ul#ref-home li.last{
margin-right:0;
}

#content ul#ref-home li a img{
position: absolute;
left: 0; 
top: 0;
border:2px solid white;
}

/* -> EVENT DETAIL (agenda, ref) */

#content #event-detail{
position:relative;
float:left;
background:white url(../img/background-event-detail.jpg) bottom left no-repeat;
width:504px;
height: 310px;
padding:15px;
color:#666;
font-size:12px;
}

#content #event-detail img{
float:left;
margin-right:15px;
}

#content #event-detail h2{
font-size:16px;
font-weight:normal;
margin-bottom:15px;
}

#content #event-detail span.datum{
display:block;
margin-bottom:15px;
}

#content #event-detail a.url{
display:block;
margin-top:15px;
font-size:11px;
color:#00cfdc;
}

#content #event-detail a.partenaire-salon{
position:absolute;
bottom:45px;
right:0;
}

/* -> Agenda */

#content ul#event-col{
list-style-type:none;
float:right;
width:325px;
color:#fff;
}

#content ul#event-col li{
background:url(../img/background-event.png) top left no-repeat;
clear:both;
font-size:11px;
padding:10px;
height:60px;
}

#content ul#event-col li:hover, #content ul#event-col li#event-active{
background:url(../img/background-event-hover.png) top left no-repeat;
}

#content ul#event-col li a{
position:relative;
float:left;
margin-right:15px;
border:2px solid white;
}

/*#content ul#event-col li .masque{
position:absolute;
top:0;
left:0;
background:url(../img/masque.png) top left no-repeat;
width:61px;
height:55px;
}*/

#content #event-col li h3 a{
float:none;
font-weight:bold;
text-decoration:none;
font-size:11px;
border:none;
}

#content #event-col li h3 a:hover{
text-decoration:underline;
}

#content ul#event-col li span{
display:block;
}

/* Nav */
#content #event-col-nav{
list-style-type:none;
margin-right:5px;
width:320px;
float:right;
}

#content #event-col-nav li a{
display:block;
height:16px;
color:#ccc;
margin:10px 0 0 0;
text-decoration:none;
}

#content a#next{
background:url(../img/arrow.png) top right no-repeat;
float:right;
padding-right:20px;
color:#a6a6a6;
text-decoration:none;
}

#content a#prev{
background:url(../img/arrow-180.png) top left no-repeat;
float:left;
padding-left:20px;
color:#a6a6a6;
text-decoration:none;
}

/* -> Références */

#content ul#ref{
list-style-type:none;
}

#content ul#ref li{
float:left;
margin-right:15px;
}

/* -> Gallery */

#content ul#gallery, #content ul#gallery_img{
list-style-type:none;
}

#content ul#gallery li{
float:left;
width:310px;
margin:0 0 35px 0;
}

#content ul#gallery li h2{
font-size:16px;
}

#content ul#gallery li p{
color:#a6a6a6;
}

#content ul#gallery li a img, #content ul#gallery_img li a img{
border:3px solid white;
float:left;
margin:0 6px 0 0;
}

#content ul#gallery_img li{
position:relative;
float:left;
margin:0 22px 21px 0;
}

#content ul#gallery li a img.filigrane,#content ul#gallery_img li a img.filigrane{
position:absolute;
top:24px;
left:24px;
border:none;
}

#content ul#gallery li a{
text-decoration:none;
}

/* Nav Gallery */

#content #nav-multi-page{
clear:both;
list-style-type:none;
color:#a6a6a6;
}

#content #p_num {
clear:both;
margin:auto;
text-align:center;
color:#a6a6a6;
}

#content a#back{
clear:both;
display:block;
margin:15px 0 0 0;
color:#00cfdc;
}

/* Partenaires */

#content .partenaire{
float:left;
margin:0 25px 5px 0;
width:145px;
text-align:center;
}

#content .partenaire table{}

#content .partenaire table td{
vertical-align:middle;
height:145px;
}

#content .partenaire .logo{
background:#fff;
padding:10px;
}

#content .partenaire a, #content .partenaire span{
display:block;
margin:5px 0 0 0;
color:#a6a6a6;
text-decoration:none;
}

#content .partenaire a:hover{
text-decoration:underline;
}


/* Col Left/Right */

#content #col-left{
float:left;
width:480px;
}

#content #col-left a{
color:#a6a6a6;
}

#content #col-left a:hover{
text-decoration:none;
}

#content #col-left ul{
list-style-type:none;
margin:0 0 16px 0;
}

#content #col-left ul li{
padding-left:22px;
background:url(../img/tick.png) 0 0 no-repeat;
}

#content #col-right{
float:right;
}

/*************************************************
-> FOOTER
**************************************************/

#footer{
margin-top:-71px; /* hack footer */
height:40px;
padding:15px 0;
border-top:1px solid #999;
background:#212121;
}

#footer div{
position:relative;
width:965px;
margin:auto;
}

#footer div p{
background:url(../img/copyright.jpg) top left no-repeat;
width:113px;
height:39px;
text-indent:-9999px;
}

#footer div a{
position:absolute;
top:0;
right:0;
background:url(../img/pixfactory.jpg) top left no-repeat;
width:118px;
height:17px;
text-indent:-9999px;
}