/*
  basic contains elements common to all propositions
*/


/*  **************
    Basic elements
**  **************  */
	html, body, div, td, th, form, img, a img { /* By default, box = content box */ 
		margin:0;
		padding:0;
		border:0;
	}
	
	html {
		top: 0;
		overflow: scroll; /* Avoids horizontal jumps between short and long pages */
	} 
	
	body {
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 10px;
		color: #000;
		background-color:#fff; /* black text on standard background */
	}
	
  .darkbg,
  .darkbg h1,
  .darkbg h2,
  .darkbg h3,
  .darkbg p {
    color: #fff; /* white text on dark backgrounds */
  }
  
	p { /* Default: body text margin at top */
		margin: 0.5em 0 0 0;
	}
	
	a { 
		color: inherit; /* Needs fix for IE 6 ? */
		text-decoration:none;
	}

  a em { 
		color: #58f; 
		text-decoration:none;
    font-style:normal;
	}
  
	div#panels a  {
		color:#3c3939;
	}

  p.calltoaction,
  p.calltoaction a {
		font-weight: bold;
		font-size: 11px;
		text-transform:uppercase;
		text-align:right;
		color: #58f;
		margin: 4px 0 0 0;
	}

	a:hover, 
  #main a:hover,
  a:hover em,
  #main a:hover em {
		color: #58f; 
		text-decoration:underline;
	}


  div#panels a em { 
		color: #58f; 
		text-decoration:none;
    font-style:normal;
	}
  
  div#panels a:hover,
  div#panels a:hover em {
		color: #58f; 
		text-decoration:underline;
	}

  p.calltoaction a:hover {
		color: #00d; 
	}
  
  /* Lists use top-left-floated images rather than bullets for consistent positioning */
	
	ul, ol { /* Default: list margin at bottom so it's attached to introductory text */
		margin: 0px 0px 0.5em 0px;
		padding: 0px ;
	}
	
	#divmain ul li
  { /* Default: bullets aligned at left of containing box */
		list-style-type:none; 
		list-style-image:none; 
		background-repeat:no-repeat;
		background-position:0px 1px;
		background-image:url(/s/pix/li1.png); /*  TBD: smaller bullet */ 
		padding-left: 16px;
		list-style-position:outside;
	}
	
	/* Nested lists have specific bullets */
	/* NO Nested lists on home page (#homemain)	 */
	#divmain ul ul li      { background-image:url(/s/pix/li2.gif); }
	#divmain ul ul ul li   { background-image:url(/s/pix/li3.gif); }

	ol {
		margin-left: 24px;
	}
	
/*  **************
    Global  layout
**  **************  */

	body {
		background-color:#FFF;
	}

	img{
		display:block;
	}

	div#canvas { /* Position entire content in page  */
		width:872px;
		overflow:hidden;
		margin: 0 auto 0 auto;
		padding: 0 8px 0 8px;
		background-color:#fff;
		
		background-image:url(/s/pix/bg-canvas2.png);
		background-repeat:repeat-y;
	}

	div#masthead { /* Position entire content in page  */
		padding: 28px 0 0 0; /* Sets top offset */
		}

    div#logo,
    div#tagline { /* Position descriptor  */
      text-align: center;
    }

    div#tagline h1, 
    div#tagline p { /* Set as p in SafeKit and OpenMaster pages  */
      margin: 0 0.4em 0 0;
      color: #00257e;
      font-weight: bold;
      font-size: 18px;
      /* line-height: 18px; */
      text-align:right;
      vertical-align:text-top;
    }

	
	div#menu0  { 
		/* text-align: right; */
    font-size: 12px;
    color: #fff;
	margin: -40px 0 0 -60px;
	
	}

    div#menu0 p { 
      background-position:left top;
      /*background-image:url(/s/pix/bg-menu0.png);*/
      float:right;
      text-align: right;
      min-width: 268px;
      display:inline; /* Shrinks the paragraph to the size of its content */ 
      
      padding: 2px 0 2px 8px;
    }
  
    div#menu0 a { 
      color: #9e9e9e;
    }
  
    div#menu0 a:hover { 
      color:#6699FF;
      text-decoration:underline;
    }

    div#menu0 input#sbox
    { /*
      position: relative;
      top: 2px; */
      color:#999;
      position: relative;
      top: 0px;
      width: 114px;
      height: 14px;/*  */
      font-size: 11px;
      border-style:solid;
      border-width:1px;
      border-color: #888 #fff #fff #888 ;
      background-color:#eee;
    }
  
    div#menu0 input#sbox.used,
    div#menu0 input#sbox:hover,
    div#menu0 input#sbox:focus
    { /* Needs LT IE6 fix */
      color:#00257e;
      background-color:#fff;
    }
   
    div#menu1 div#mainmenu {
      z-index: 6;
      position : relative;
      line-height: 22px;
      padding: 0 0 0 4px;
    }
	 div#menu1 div#mainmenu a{
     cursor:pointer;
	 
    }  
	 div#menu1 div#mainmenu a:hover{
     text-decoration:none;
	 
	  } 
	  
    div#menu1 div#internat img {
	margin:20px 0 0 0;
      float: right;
    }
    div#menu1 div#internat p {
      text-align: right;
      margin:0;
    }
  
	div#panels {
    clear: both;
		background-color: #fff;
    z-index: 1; /* ensure stacking context of video is behind that of menu1 to avoid IE6/7 zindex bug */
    /* TBD: might not be needed */
	}

    div#panell  {
      height: 180px; /* No more, no less */
    }
  
      div#panell object { /* Firefox for one seems to default to inline... */
        display: block;
      }
    
    div#panelr { /* background for events panel */
	position: absolute; 
	 top:-3px;
	 right:-50px;
	 left:879px;
	 width: 258px;
      height: 200px;
	  background-image:url(/s/pix/bg-events-10.jpg);
	  background-repeat:no-repeat;
      background-position:top left;
    }

      div#panelr div#eventslist  {
        position: absolute; 
        bottom: 4px; 
        left: 10px; 
        width: 240px;
		top:3px;
		
      }
    
      div#eventslist h3 {
        font-size: 12px;
        margin: 7px 0 15px 0;
        color: #3c3939;
      }

      div#eventslist ul {
	  width: 240px;
	  font-size: 11px;
        margin: 0;
      }

div#eventslist ul li{
	  width: 240px;
	  font-size: 11px;
        margin: 0 0 4px 0;
      }

      div#eventslist li {
	  	color: #3c3939;
        margin: 4px 0 4px 0;
        list-style-type:none; 
        list-style-image:none; 
        background-repeat:no-repeat;
        background-position:0 1px;
        background-image:none;
        padding-left: 0;
		font-size: 11px;
      }
	  div#eventslist li a{
        margin: 2px 0 2px 0;
        list-style-type:none; 
        list-style-image:none; 
        background-repeat:no-repeat;
        background-position:0 1px;
        background-image:none;
        padding-left: 0;
		font-size: 11px;
      }

	div#offers {
    border-style: solid;
    border-width: 1px 0 0px 0;
    border-color: #fff;
		background-image:url(/s/pix/bg-offers.png);
		min-height: 64px; /* Needs fix for IE 6- */
    background-position: 0 -2px ;
	} 

    div.offerbox {
      padding: 4px 2px 0 6px;
    } 
    
    div#boxsso,
    div#boxidm,
    div#boxrm,
    div#boxom,
    div#boxsk {
      cursor: pointer;
      background-position: 0 -2px ;
    }
  
    div#offers h2,
    div#offers h2 a {
      font-size:11px;
      font-weight: bold;
      color: #fff;
      margin: 0;
    }
  
    div#offers p,
    div#offers p a {
       margin: 2px 0 0 0;
       color: #fff;
    }

    div#offers div.fapitem:hover a {
      /* Make ALL links in an offer box respond to mouseovers on the container */
    	text-decoration:underline;
    }


	div#main {
		padding: 16px 0 8px 0;
	}

    div#main div#boxkeynote h1 {
      font-size:18px;
      font-weight: bold;
      color: #09c;
      margin: 0;
    }

    div#maintop h1 {
      font-size:36px;
      font-weight: bold;
      color: #09c;
      padding: 22px 0 22px 0;
      margin: 0;
    }

    div#main h3 {
      font-size:14px;
      font-weight: bold;
      margin: 0;
    }

    div#coll{
      /* placeholder */
    }

      div#boxexpert {
        cursor: pointer;
        background-image:url(/s/pix/boxexpert.png);
        background-repeat:no-repeat;
        background-position:top left;
        padding: 96px 12px 0 12px;
		margin: 0 0 24px;
      }

      div#boxexpert:hover a {
        /* Make ALL links respond to mouseovers on the container */
        text-decoration:underline;
      }

			div#boxexpert p {
        margin: 0 0 0 4px;
        padding: 0 4px 0 4px;
      }
    
    div#colc {
      overflow:hidden; /* is this needed */
    }

      div#boxkeynote{
        cursor: pointer;
        padding: 0 0 6px 0;
        border-style: solid;
        border-width: 0 0 1px 0;
        border-color: #58f;
      }

      div#bgsector {
        width: 375px;
        padding: 4px 0 0 4px;
        background-image:url(/s/pix/bg-sector.jpg);
        background-repeat:no-repeat;
        background-position:top left;
      }
    
	 div#bgsector2 {
        width: 375px;
        padding: 4px 0 0 4px;
        background-image:url(/s/pix/bg-sector.jpg);
        background-repeat:no-repeat;
        background-position:top left;
      }
      div#boxsector {
        cursor: pointer;
        background-image:url(/s/pix/bg-datamonitor.jpg);
        background-repeat:no-repeat;
        background-position:bottom right;
        padding: 0 96px 0 0;
      }
	  
	  div#boxsector2 {
        
        background-image:url(/s/pix/bg-barclays.jpg);
        background-repeat:no-repeat;
        background-position:bottom right;
        padding: 0 96px 0 0;
      }
    
      div#boxsector p.calltoaction {
        text-align: left;
      }
  
  		  div#boxsector2 p.calltoaction {
        text-align: left;
      }
      div#boxclient {
        /* Make ALL links respond to mouseovers on the container */
        cursor:pointer;
      }

      div#boxkeynote:hover a,
      div#boxclient:hover a,
      div#boxsector:hover a {
        /* Make ALL links respond to mouseovers on the container */
        text-decoration:underline;
      }

			div#boxsector img {
        float: left;
        padding: 0 10px 4px 0;
      }
	  
	  	div#boxsector2 img {
        float: left;
        padding: 0 10px 4px 0;
      }
  
    div#colr{
      /* placeholder */
    }

      div#boxwebsem {
        position: relative; /* Required to set context for positioning content at bottom right */
        padding: 0px 0px 0px 10px; /* background-image-dependent */
        background-image:url(/s/pix/bg-websem.jpg);
        background-repeat:no-repeat;
        background-position:top left;
        overflow:hidden;
        height: 140px; /* Needs a fix for IE6- */
		margin:0 0 0px 0;
		
		
      }
      
      div#boxwebsem a img {
        display: inline;
        float: left;
      }
      div#websemlinks  {
        width: 90px;
        float: right;
      }
        div#boxwebsem div.textatbottom {
          width: 240px;
		  position: absolute;
          padding: 0;
         bottom: 65px;
		  font-size:12px;
        }
    
	 div#boxwebsem div.textatbottom h3
	 {
	  font-size:11px;
	   padding:5px 0 15px 0;
	  color :#3c3939;
	  }
	   div#boxwebsem div.textatbottom h3 a
	 {
	  font-size:12px;
	  padding:5px 0 15px 0;
	  color :#3c3939;
	  }
	  
      div#boxwebsem div.textatbottom a {
        /* Make ALL links respond to mouseovers on the container */
		color:#3c3939;
		font-size:11px;
    
      }
	  
	   div#boxwebsem div.textatbottom a:hover {
        /* Make ALL links respond to mouseovers on the container */
		color:#58f;
    text-decoration:underline;
	}
	  div #newslist
	  {
	  background-image:url(../pix/bg-news.jpg);
	  height:260px;
	  width:245px;
	  padding : 0 5px 0 10px;
	  margin:0 0 20px 0 ;
	  font-size:11px;
		
	  }
		div #newslist h3
	  {
	  font-size:12px;
	  padding: 13px 0 10px 0;
	  color :#3c3939;
	  }
		div#newslist li {
		font-size:11px;
		
        margin: 4px 5px 4px 0;
        list-style-type:none; 
        list-style-image:none; 
        background-repeat:no-repeat;
        background-position:0 1px;
        background-image:none;
        padding-left: 0;
		color :#3c3939;
      }

	div#newslist li a{
	font-size:11px;
	color :#3c3939;
	}
	div#footer { /* Allows for uneven gradients in corners of drop shadows */
		width: 872px;
		padding: 0px 8px 14px 9px;
		position: relative;
		
		left: -9px;
		background-color: #fff;
		background-image:url(/s/pix/bg-footer2.png);*/
    background-repeat:no-repeat;
    background-position:bottom left;
	} 

    div#footer p {
      clear:both;
      padding: 4px 4px 4px 6px;
      margin: 0;
      color: #fff;
    }
    div#footer a {
      color: #fff;
    }
  
    div#footer a:hover {
      color: #00257e;
    }
  
  .search
  {
  background-image:url(/s/pix/loupe.gif);
  background-color:transparent;
  background-repeat:none;
  width:19px;
  border:none;
  margin-left:-26px;
  margin-top:-21px;
  cursor:pointer;
  }
  div #bandeau
  {
  float:left;
  margin: -4px 0 0 0;
  width:596px;
  padding:4px 0 0 0;
  text-align:right;
  }
  
  div #item
  {
   width:600px;
  }
  .boxl
  {
  float:left;
  padding: 30px 10px 0 10px;
  width:180px;
  }
  .boxc
  {
  float:left;
  padding: 30px 10px 0 10px;
  width:180px;
  }
  .boxr
  {
  float:left;
  padding: 30px 10px 0 10px;
  width:180px;
  }
  
  
 #itemgauche
  {
  float:left;
  margin-right:15px;
  }
  
  #itemgauche .proditm
  {
  padding:4px 0 0 4px;
  height:100px;
  width:130px;
  background-image:url(../pix/itmgch.png);
  background-position:0 -13px;
  background-repeat:no-repeat;
  font-size:10px;
  color:#FFFFFF;
  margin:0 0 -20px 0;
  
  }
   #itemgauche .proditm h2
  {
    position:absolute;
  float:left; 
  margin:-45px 0 0 52px;
  font-size:11px;
  }
  
  #itemgauche .proditm h2 a
  {
   color:#FFFFFF;
  }
  
  #itemgauche .proditm h2 a:hover
  {
   color:#6699FF;
  }
  #itemgauche .proditm h3
  {

  color:#FFFFFF;
  font-size:11px;
  }
  
    #itemgauche .proditm h3 a
  {

  color:#FFFFFF;
  font-size:11px;
  }
  
     #itemgauche .proditm p a
  {

  color:#FFFFFF;
  font-size:11px;
  }
       #itemgauche .proditm p a:hover
  {
  color : #6699FF;
  }
  
      #itemgauche .proditm h3 a:hover
  {
  color : #6699FF;
  }
/*  **************
    Drop-down menu is in a separate file : menu1a.css
    ...possibly with variants b, c,...
**  **************  */

/***** FORMATAGE VIDEO HTML5********/
div#panell #caption {

   margin:-200px 0 0 0;
  text-align: center;
  font-family: sans-serif;
  font-weight: bold;
  color: white;
  text-shadow: black 1px 1px 3px;
  padding-bottom: .5em;

}

 div#panell #transcript span {display:table-row;}
/* show the timings in square brackets before each "subtitle" in the transcript. */
 div#panell #transcript [data-begin]:before 
   {content: " [" attr(data-begin) "s-" attr(data-end)"s]   "; font-size:80%; display:table-cell; padding-right:1em;}


/** LOGO CLUSIF**/


#logoclusif
{
width:69px;
height:42px;
float:left;
position:absolute;
margin:15px 0 2px 0px;
}