body {font-size: 1em; font-family: Ubuntu, "Trebuchet MS", Verdana, Arial, "Bitstream Vera Sans", "Lucida Grande", sans-serif}
* {margin:0; padding:0;}
p {font-size:.75em;}
p, ul, ol, caption, details, figure{font-size:1em;line-height:1.5;margin:.75em auto 0}
figcaption{text-align:center}
ul, ol{padding-left:2em}
.unstyled{list-style:none}
em, i, .em, .i{font-style:italic}
strong, b, .strong, .b{font-weight:bold}
.souligne, .s{text-decoration:underline}
.normal{font-style:normal;font-weight:normal}

p:first-child, ul:first-child, ol:first-child, h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child{margin-top:0}
li p, li ul, li ol{margin-top:0;margin-bottom:0}

img, .image-centree{height:auto;vertical-align:middle;display:block;margin:0 auto}

body > script{display:none !important}
.skip-links{position:absolute}
.skip-links a{position:absolute;left:-7000px;padding:0.5em;background:#000;color:#fff;text-decoration:none}
.skip-links a:focus{position:static}
section, article, header, footer, aside, menu, div, .row, .col, figure, img, .bouton, .petit-bouton{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}

.clear, .line, .row{clear:both}
.clearfix:after, /*.line:after,*/ .mod:after{content:"";display:table;clear:both}
.row{display:table;table-layout:fixed;width:100%;margin-left:auto;margin-right:auto;border-collapse:separate;border-spacing:10px 0;page-break-after:avoid}
.col{display:table-cell;vertical-align:top}
.inbl{display:inline-block;vertical-align:top}
.left{float:left}
img.left{margin-right:1em}
.right{float:right}
img.right{margin-left:1em}
img.left, img.right{margin-bottom:5px}
.center{margin-left:auto;margin-right:auto}
.txtleft{text-align:left}
.txtright{text-align:right}
.txtcenter{text-align:center}
.txtjustify{text-align:justify}
.txtsmallcap{font-variant:small-caps}
.txtlight{color:#ffc}
.txtblanc{color:#fff}
.txtbleu{color:#00f}
.txtorange{color:#f93}
.txtrouge{color:#f00}
.txtnoir{color:#000}
.txtsans{word-break:keep-all;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;-o-hyphens:none;hyphens:none}
.bkgrouge{background:#f00}
.w5{width:5%}
.w10{width:10%}
.w20{width:20%}
.w25{width:25%}
.w30{width:30%}
.w33{width:33.3333%}
.w35{width:35%}
.w40{width:40%}
.w50{width:50%}
.w60{width:60%}
.w66{width:66.6666%}
.w70{width:70%}
.w75{width:75%}
.w80{width:80%}
.w90{width:90%}
.w100{width:100%}

@media (orientation:landscape) and (max-device-width:768px){html, body{-webkit-text-size-adjust:100%}}

/* --------------------------------------------------------------- */
div#mainwrap {}
div#contentarea2 {display: -webkit-flex; /* Safari */
    -webkit-flex-direction: row-reverse; /* Safari 6.1+ */
    display: flex;
    flex-direction: row-reverse; }

/* Header */
div#header {background-color:#076BB6; text-align:center; padding-top: 0.3em; padding-bottom:.3em}
div#header img {float:left; margin-right:.5em; margin-left:.5em; padding-top:.2em}
div#header span {margin-right:auto; margin-left:auto; font-size:1.2em; line-height:.9; color:#AE70AF}
div#header span strong {font-size:1.6em;margin-right:.3em; margin-left:.3em}

/* Main column */
div#column2 p {font-size:1em; margin:0 10px 10px}
div#column2 p em {color: #E66665; font-weight:bold; }
div#column2 p.index {color:#9295CA; margin:0 0 0 10px; padding:0}
div#column2 p.reference {color: #E66665; margin: 0 0 0 10px; font-weight:500; padding: 0}
div#column2 img {padding: 2px 0 0 0; display: block}
div#column2 img.left {float:left; padding-top:2px}
div#column2 img.center {margin: 2px 0 0 200px}
div#column2 img#accueil {margin: 2px 0 0 300px; width:441px; height:588px}
div#column2 img.right {margin: 2px 0 0 2px; float: right}
div#column2 ul {color: #9ECEB4; list-style-type: disc}
div#column2 li {position:relative; margin: 0 2px 0px 35px}
div#column2 li p, ul, li {color: black}
div#column2 p#robot {color:#076BB6; text-align:center; text-decoration: underline; font-size: 1.2em}
div#column2 h1 {color:#9295CA; font-variant:small-caps; text-align:center; text-decoration: underline; font-size: 1.2em; margin-bottom:8px}
div#column2 h2 {text-align:left; margin:0 10px 10px; font-size: 1.1em}
div#column2 h2.EN {font-style:italic; color:#A9B2B1}
div#column2 p.EN {font-style:italic; color:#A9B2B1}
div#column2 ul.EN {color:#669933; font-style:italic; list-style-type: disc}
 
/* Vertical menu */
div#column1 {padding-bottom:5px}
div#column1 p {margin:0px 2px 0 6px; padding:2px 6px 2px 2px} /* ligne de titre du menu */
div#listmenu {border:1px solid #000;  font-size:.9em; background-color:#ACCBE8; margin-top:5px}
div#listmenu ul {border:0; margin:2px 2px 2px 5px; padding: 0 0 10px 0px; list-style-type:none}
div#listmenu li {position:relative; list-style-type:none; background-color:#FFD602; border-right:1px solid #9295CA; border-bottom:2px solid#9295CA; padding:.2em; text-indent:.3em; margin-top: .5em; margin-right: .2em}
/*div#listmenu li:first-child {border-top:2px solid #9295CA}*/


/* Footer */
div#footer {background-color:#AE70AF; text-align:center; padding-top:2px; padding-bottom:6px}/* footer styles */
div#footer h3 {font-size:1.2em; color:#076BB6; padding-top:0px}
div#footer p {font-size:.6em; color:#076BB6; padding-top:0px}
/* a {text-decoration:none} */
#cache {display:none; visibility:hiddencolor: white; font-size:0em; position:absolute; left:-7000px; overflow:hidden}
a {color: #076BB6}
a.line {text-decoration:underline}
a:hover {color: #AE70AF; background-color:#076BB6}
img {border:0}
img.enligne {display: inline-block}
table {background-color:"#eeeeee"; width:"160px"}
td.nr {white-space:nowrap}

/* setup for the table */
.mytable {padding: 0;
	margin: 10px; 
	border-spacing : 0;
	border-collapse : collapse}

caption {font: italic .7em Ubuntu, "Trebuchet MS", Verdana, Arial, "Bitstream Vera Sans", "Lucida Grande", sans-serif;
	text-align: center;}

th {font: bold .9em Ubuntu, "Trebuchet MS", Verdana, Arial, "Bitstream Vera Sans", "Lucida Grande", sans-serif;
	color: #6D929B;
	border-right: 1px solid #C1DAD7;
	border-bottom: 1px solid #C1DAD7;
	border-top: 1px solid #C1DAD7;
	letter-spacing: 2px;
	text-align: center;
	padding: 6px 6px 6px 12px;
	background: #CAE8EA;}

th.nobg {border-top: 0;
	border-left: 0;
	border-right: 1px solid #C1DAD7;
	background: none;}

th.spec {border-left: 1px solid #C1DAD7;
	border-top: 0;
	text-align: left;
	letter-spacing: 1px;
	font: 0.8em Ubuntu, "Trebuchet MS", Verdana, Arial, "Bitstream Vera Sans", "Lucida Grande", sans-serif;}

th.specalt {border-left: 1px solid #C1DAD7;
	border-top: 0;
	font: 0.8em Ubuntu, "Trebuchet MS", Verdana, Arial, "Bitstream Vera Sans", "Lucida Grande", sans-serif;
	color: #B4AA9D;}

td {border: 1px solid #C1DAD7;
	font-size:0.9em;
	background: #fff;
	padding: 6px 6px 6px 6px;
	text-align:center;
	color: #6D929B;}

td img#annees {padding: 2px 2px 2px 2px;
	width:60px; 
	height:80px;
	border:0;}
	

td.alt {background: #F5FAFA;
	color: #B4AA9D;}
td.img {margin: 3px; border: 2px #E66665 solid; height: 160px; width: 252px; float: left; padding: 2px 4px 1px 2px; overflow:hidden; }
td.img img {float: left; width:150px; height:100px; }
td.img img:hover {float: left; width:249px; height:166px; }
td.img a:hover img {border: 1px solid #0000ff;  }
.cache {display: none;}

/* Setup for pop-up images
/*C#E66665its: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */
/*http://www.dynamicdrive.com/style/csslibrary/item/css-popup-image-viewer/ */

.thumbnail{
position: relative;
z-index: 0;
}

.thumbnail:hover{
background-color: transparent;
z-index: 50;
}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: #FFD602;
padding: 5px;
left: -1000px;
border: 1px dashed #A9B2B1;
visibility: hidden;
color: black;
height: 320px; width: 240px;
text-decoration: none;
}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
height: 320px; width: 240px;
padding: 2px;
}

.thumbnail:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: 0;
height: 320px; width: 240px;
left: 60px; /*position where enlarged image should offset horizontally */
}

/* Move the image to the left for the text that is on the right of the screens */
.thumbnail2 {
position: relative;
z-index: 0;
}

.thumbnail2:hover{
background-color: transparent;
z-index: 50;
}

.thumbnail2 span{ /*CSS for enlarged image*/
position: absolute;
background-color: #FFD602;
padding: 5px;
right: -1000px;
border: 1px dashed #A9B2B1;
visibility: hidden;
color: black;
height: 320px; width: 240px;
text-decoration: none;
}

.thumbnail2 span img{ /*CSS for enlarged image*/
border-width: 0;
height: 320px; width: 240px;
padding: 2px;
}

.thumbnail2:hover span{ /*CSS for enlarged image on hover*/
position:absolute;
visibility: visible;
top: 0;
height: 320px; width: 240px;
right: 100px; /*position where enlarged image should offset horizontally */
}

/* setup for the catalog images */
div.img-i-h {margin: 3px; border: 2px #E66665 solid; height: 160px; width: 252px; float: left; padding: 2px 4px 1px 2px; overflow:hidden; }
div.img-i-h img {float: left; width:150px; height:100px; }
div.img-i-h img:hover {float: left; width:249px; height:166px; }
div.img-i-h a:hover img {border: 1px solid #0000ff;  }
div.img-i-v {margin: 3px; border: 2px #E66665 solid; height: 160px; width: 252px; float: left; padding: 2px 4px 1px 2px; overflow:hidden; }
div.img-i-v img {float: left; width:100px; height:150px; }
div.img-i-v img:hover {float: left; width:166px; height:249px; }
div.img-i-v a:hover img {border: 1px solid #0000ff; }
div.img-p-h {margin: 3px; border: 2px #076BB6 solid; height: 160px; width: 252px; float: left; padding: 2px 4px 1px 2px; overflow:hidden; }
div.img-p-h img {float: left; width:150px; height:100px; }
div.img-p-h img:hover {float: left; width:249px; height:166px; }
div.img-p-h a:hover img {border: 1px solid #0000ff; }
div.img-p-v {margin: 3px; border: 2px #076BB6 solid; height: 160px; width: 252px; float: left; padding:2 px 4px 1px 2px; overflow:hidden; }
div.img-p-v img {float: left; width:100px; height:150px; }
div.img-p-v img:hover {float: left; width:166px; height:249px; }
div.img-p-v a:hover img {border: 1px solid #0000ff; }
div.desc {text-align: left; font-weight: normal; width: 250px; margin: 1px; }

/* END OF LIST-BASED MENU */

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


@media (min-width:641px){}
@media (-webkit-min-device-pixel-ratio:2), (min-resolution:192dpi), (min-resolution:2dppx){}
@media (min-width:1280px){.taille{color:red}
.large-hidden,
.tablet-hidden{display:none !important}
.large-visible{display:block !important}
.large-no-float{float:none}
.large-inbl{display:inline-block;float:none;vertical-align:top}
.large-row{display:table;table-layout:fixed;width:100% !important}
.large-col{display:table-cell;vertical-align:top}
.large-w20{width:20% !important}
.large-w25{width:25% !important}
.large-w33{width:33.3333% !important}
.large-w50{width:50% !important}
.large-w66{width:66.6666% !important}
.large-w75{width:75% !important}
.large-w100{display:block !important;float:none !important;clear:none !important;width:auto !important;margin-left:0 !important;margin-right:0 !important;border:0}
.large-man{margin:0 !important}
}
/*@media (max-width:768px){header[role="banner"]{width:95%}
section[role="main"]{width:90%}
.ensemble{width:75%}
aside[role="complementary"]{width:75%}
.taille{color:yellow}
nav[role="navigation"] ol{max-width:330px}
nav[role="navigation"] ol{max-width:330px}
nav[role="navigation"] li:hover li{display:inline-block;margin:0;font-size:.8571em}
nav[role="navigation"] .bouton{border-radius:0;border:1px solid #fff;margin:0}
nav[role="navigation"] ol li a{text-align:left;padding:5px}
.w60, .w66, .w70, .w75, .w80, .w90, .w100, .w600p, .w700p, .w800p, .w960p, .mw960p, .small-wauto{width:auto}
div{word-wrap:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;-ms-hyphens:auto;-o-hyphens:auto;hyphens:auto}
.small-hidden,
.tablet-hidden{display:none !important}
.small-visible{display:block !important}
.small-no-float{float:none}
.small-inbl{display:inline-block;float:none;vertical-align:top}
.small-row{display:table !important;table-layout:fixed !important;width:100% !important}
.small-col{display:table-cell !important;vertical-align:top !important}
.large-w20{width:20% !important}
.small-w25{width:25% !important}
.small-w33{width:33.3333% !important}
.small-w50{width:50% !important}
.small-w66{width:66.6666% !important}
.small-w75{width:75% !important}
.small-w100{display:block !important;float:none !important;clear:none !important;width:auto !important;margin-left:0 !important;margin-right:0 !important;border:0}
.small-man{margin:0 !important}
}*/ /* n'affiche pas bien les pdf avec le menu qui se superpose */

@media (max-width:768px){header[role="banner"]{width:99%} /* était 640 ou 648px */
section[role="main"]{width:95%}
.ensemble{width:90%}
aside[role="complementary"]{width:90%}
footer[role="contentinfo"]{padding-bottom:20px;text-align:center}
.titre, .titre-principal, .titre-para, .titre-image{letter-spacing:0}
.taille{color:green}
.mod, .item, .col{display:block !important;float:none !important;clear:none !important;width:auto !important;margin-left:0 !important;margin-right:0 !important;border:0}
.w30, .w33, .w35, .w40, .w50{width:auto}
.row{display:block !important;width:100% !important}
.tiny-hidden, .phone-hidden{display:none !important}
.tiny-visible{display:block !important}
.tiny-no-float{float:none}
.tiny-inbl{display:inline-block;float:none;vertical-align:top}
.tiny-row{display:table !important;table-layout:fixed !important;width:100% !important}
.tiny-col{display:table-cell !important;vertical-align:top !important}
.large-w20{width:20% !important}
.tiny-w25{width:25% !important}
.tiny-w33{width:33.3333% !important}
.tiny-w50{width:50% !important}
.tiny-w66{width:66.6666% !important}
.tiny-w75{width:75% !important}
.tiny-w100{display:block !important;float:none !important;clear:none !important;width:auto !important;margin-left:0 !important;margin-right:0 !important;border:0}
.tiny-man{margin:0 !important}
}