/* CSS Document */

body
{
background-color: rgba(215, 215, 205, .9);
background-image: url("../images/hc3.jpg");
background-attachment: fixed;
}

.page
{
width: 970px;
font-family: Verdana, Arial, sans-serif;
font-size: 14px;
line-height: 1.5em;
/*line-height: normal;
letter-spacing: .05em;*/
word-spacing: 1px;
text-align: left;
/*color: #002040;*/
color: #002040;
padding-top: 5px;
border: double #669;
margin-top: 20px;
margin-right: auto;
margin-bottom: 20px;
margin-left: auto;
background-image: url(../images/hc4.jpg);
}

header
{
width: 890px;
border-top: 2px solid;
border-bottom: 2px solid;
border-color: #669;
margin-top: 10px;
margin-right: auto;
margin-bottom: 15px;
margin-left: auto;
background-color: rgba(238,238,238,.8);
background-color: rgba(215, 215, 215, .5);
text-shadow: 2px 2px 2px #669;/*rgba(215, 215, 205, .9);*/
}

.left
{
float: left;
width: 570px;
margin-left: 40px;
margin-bottom: 10px;
border: 1px solid #669;
font-size: 100%;
background-color: rgba(215, 215, 215, .5);
border-radius: 10px;
}

.center ul
{
margin: 0 0 0 -10px;
}

.left ul
{
list-style-type: none;
}

.fill
{
clear: both;
width: 570px;
margin-left: 40px;
margin-bottom: 15px;
font-size: 100%;
}

.left2
{
float: left;
width: 553px;
margin-left: 40px;
margin-bottom: 10px;
padding-left: 10px;
padding-right: 7px;
border: 1px solid #669;
color: #002040;
font-size: 100%;
}

.right
{
float: right;
clear: right;
width: 240px;
padding-left: 20px;
padding-right: 20px;
padding-top: 25px;
padding-bottom: 4px;
margin-right: 40px;
margin-bottom: 25px;
text-align: center;
font-size: 85%;
border: 1px solid #669;
border-radius: 10px;
color: #002040;
background-color: rgba(215, 215, 215, .5);
}

.right2
{
float: right;
clear: right;
padding-left: 10px;
padding-right: 7px;
margin-right: 40px;
margin-bottom: 25px;
width: 263px;
text-align: left;
font-size: 85%;
border: 1px solid #669;
color: #002040;
background-color: rgba(215, 215, 215, .5);
}

.right3
{
float: right;
clear: right;
padding: 13px 0 7px 2px;
margin-right: 142px;
width: 71px;
text-align: center;
border: 1px solid #669;
color: #002040;
border-radius: 10px;
background-color: rgba(215, 215, 215, .5);
}

.center
{
clear: both;
width: 858px;
padding: 15px 15px 15px 15px;
border: 1px solid #669;
border-radius: 10px;
margin-top: 5px;
margin-right: auto;
margin-bottom: 10px;
margin-left: auto;
background-image: url(../images/hc4.jpg);
background-color: rgba(215, 215, 205, .9);
}

.center2
{
clear: both;
font-size: 14px;
width: 800px;
padding-left: 14px;
padding-right: 14px;
padding-bottom: 5px;
border: 1px solid #669;
border-radius: 10px;
margin-top: 10px;
margin-right: auto;
margin-bottom: 10px;
margin-left: auto;
}

.scol 
{
clear: both;
width: 858px;
margin: 0 auto 5px auto;
}

.dcol 
{
width: 858px;
margin: 0 auto 5px auto;
-webkit-column-count: 2; /* Chrome, Safari, Opera */
-moz-column-count: 2; /* Firefox */
column-count: 2;
-webkit-column-gap: 18px; /* Chrome, Safari, Opera */
-moz-column-gap: 18px; /* Firefox */
column-gap: 18px;
}

.dcol:before, .dcol:after
{
content: "";
display: table;
clear: both;
}

.lcol
{
float: left;
width: 420px;
margin-bottom: 5px;
}

.rcol
{
float: right;
width: 420px;
margin-bottom: 5px;
}

.hrsep
{
clear: both;
width: 150px;
padding: 10px;
border-bottom: 1px solid #669;
margin: auto;
}

.hrsep1
{
clear: both;
width: 150px;
padding: 5px;
border-bottom: 1px solid #669;
margin: auto;
}

p
{
padding: 0;
margin: 0 0 5px 0;
}

.hrsep0
{
clear: both;
width: 150px;
padding: 3px;
margin: 0 auto 0 auto;
}

.hrsep2
{
clear: both;
width: 150px;
border-bottom: 1px solid #669;
padding: 10px;
margin: 0 auto 5px auto;
}
  
footer
{
clear: both;
font-size: 70%;
width: 860px;
padding-left: 16px;
padding-right: 16px;
padding-bottom: 2px;
border-top: 2px solid #669;
margin-top: 10px;
margin-right: auto;
margin-bottom: 10px;
margin-left: auto;
color: inherit;
}

div.note
{
font-size: 85%;
line-height: 1.25em;
margin-top: 5px;
clear: both;
}

div.note p, p.note
{
padding: 0;
margin: .25em 0 0 0;
}

a.note
{
text-decoration: none;
border: 1px dotted #669;
border-radius: 3px;
}

/**********************************************************************************************************************
*************** Formatage du code HTML, CSS et des résultats **********************************************************
**********************************************************************************************************************/

.div_h, .div_c, .div_o
{
/*font-size: 14px;*/
width: 800px;
padding: 7px 14px 5px 14px;
border: 1px solid #669;
border-radius: 10px;
margin: 7px auto 7px auto;
}
/*
{
clear: both;
padding-left: 15px;
padding-right: 15px;
margin-left: 30px;
margin-right: 30px;
margin-top: 10px;
margin-bottom: 10px;
text-align: left;
border: 1px solid #669;
border-radius: 10px;
}
*/

code
{
font-family: Consolas, 'Courier New', 'Lucida Console', monospace;
color: black;
font-size: 1.0rem;
}

h1 code
{
font-family: Consolas, 'Courier New', 'Lucida Console', monospace;
font-size: 1.75rem;
}

h2 code
{
font-family: Consolas, 'Courier New', 'Lucida Console', monospace;
font-size: 1.1rem;
}

h3 code
{
font-family: Consolas, 'Courier New', 'Lucida Console', monospace;
font-size: .95rem;
}

/*
code.h
{
color: darkred;
}

code.c
{
color: darkgreen;
}
*/
span.h
{
font-family: Consolas, 'Courier New', 'Lucida Console', monospace;
/*color: darkred;*/
font-size: 107%;
background-color: rgba(248,230,230,.67);
padding: 1px 5px 1px 5px;
border: 1px solid #669;
border-radius: 5px;
margin: 5px;
}

span.c
{
font-family: Consolas, 'Courier New', 'Lucida Console', monospace;
/*color: darkgreen;*/
font-size: 107%;
background-color: rgba(230,248,230,.67);
padding: 1px 5px 1px 5px;
border: 1px solid #669;
border-radius: 5px;
margin: 5px;
}

.div_h code, .div_c code
{
font-family: Consolas, 'Courier New', 'Lucida Console', monospace;
/*font-size: 14px;*/
line-height: normal;
word-spacing: normal;
}

.div_h
{ 
background-color: rgba(248,230,230,.67);
}

.div_c
{ 
background-color: rgba(230,248,230,.67);
}

.div_o
{
font-family: 'Times New Roman', serif;
padding-top: 5px;
background-color: rgba(248,248,230,.67);
}

.div_o h2
{
font-size: 110%;
font-weight: bold;
color: black;
margin-top: 0;
margin-bottom: 0;
}
	
.div_o h1, .div_o h2, .div_o h3
{
font-family: inherit;
font-weight: bold;
color: black;
text-align: left;
padding: 0 0 0 0;
background-color: inherit;
background: none;
}
	
.div_o h1
{
margin: 10px 0 10px 0;
}
	
.div_o h2
{
margin: 15px 0 10px 0;
}
	
.div_o h3
{
margin: 10px 0 -10px 0;
}
	
.div_o p
{
font-family: inherit;
font-weight: inherit;
color: black;
text-align: left;
}

.div_o strong
{
font-style: inherit;
background-color: inherit;
}

.div_o em
{
font-style: italic;
background-color: inherit;
}

.nav_o
{
text-align: center;
font-size: 95%;
width: 178px;
padding-top: 5px;
padding-right: 15px;
padding-bottom: 5px;
padding-left: 15px;
border: 1px solid #669;
margin-left: auto;
margin-right: auto;
background-color: #9eaaff;
background-color: #a5b0f8;
background-color: rgba(165,176,248,.8);
background-color: hsla(220,85%,90%,.8);
border-radius: 10px;
}

.test
{
text-align: center;
font-size: 95%;
width:78px;
border: 1px solid #669;
margin-left: auto;
margin-right: auto;
background-color: #9eaaff;
background-color: #a5b0f8;
background-color: rgba(165,176,248,.8);
}

figcaption
{
margin: 5px auto;
font-family: arial, sans-serif;
text-align: center;
font-size: 80%;
line-height: 1.35em;
}

/***************************************************/
/************** Liens de bas de page ***************/
/***************************************************/

.bnav
{
text-align: center;
font-size: 90%;
margin-top: 15px;
/*margin-bottom: 15px;*/
}

.bnav a
{
float:left;
padding-top: 3px;
padding-bottom: 3px;
border: 1px solid #669;
background-color: #ddd;
background-color: rgba(221,221,221,.8);
border-radius: 10px;
background: linear-gradient(top, #d8d8d8 10%, #c8c8c8 90%);  
background: -moz-linear-gradient(top, #d8d8d8 10%, #c8c8c8 90%); 
background: -webkit-linear-gradient(top, #d8d8d8 10%, #c8c8c8 90%); 
}

.bnav a:hover
{
background: #b7ad9e;
background: linear-gradient(top, #d7cdbe 0%, #b7ad9e 40%);
background: -moz-linear-gradient(top, #d7cdbe 0%, #b7ad9e 40%);
background: -webkit-linear-gradient(top, #d7cdbe 0%,#b7ad9e 40%);
}

.prev
{
margin-left: 274px;
width:140px;
}

.up
{
margin-left: 30px;
width:78px;
}

.next
{
margin-left: 30px;
width:140px;
}

.return
{
text-align: center;
font-size: 95%;
margin-left: 447px;
margin-right: 447px;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 5px;
padding-right: 5px;
border: 1px solid #669;
clear: both;
margin-bottom: 10px;
background-color: rgb(255,255,255);
border-radius: 10px;
}

.return0
{
text-align: center;
font-size: 95%;
/*
margin-left: 385px;
margin-right: 385px;
*/
width: 200px;
padding: 5px;
border: 1px solid #669;
clear: both;
margin-left: auto;
margin-right: auto;
margin-bottom: 10px;
background-color: #ddd;
background-color: rgba(221,221,221,.8);
border-radius: 10px;
background: linear-gradient(hsl(240, 0%, 90%), hsl(240, 10%, 80%));  
background: -moz-linear-gradient(top, #d8d8d8 10%, #c8c8c8 90%); 
background: -webkit-linear-gradient(top, #d8d8d8 10%, #c8c8c8 90%); 
}

.return0:hover
{
background: #b7ad9e;
background: linear-gradient(hsl(60, 0%, 85%), hsl(60, 10%, 70%));
background: -moz-linear-gradient(top, #d7cdbe 0%, #b7ad9e 40%);
background: -webkit-linear-gradient(top, #d7cdbe 0%,#b7ad9e 40%);
}

.formula
{
clear: both;
padding-left: 15px;
padding-right: 10px;
margin: auto auto 5px auto;
width: 280px;
text-align: center;
font-size: 100%;
border: 1px dotted #669;
/*margin-top: 22px;*/
color: #002040;
background-color: rgb(183,201,171);
background-color: rgba(235,235,215,.67);
background-color: hsla(60,33%,95%,.67);
}

.spacer
{
clear: both;
margin-bottom: 15px;
}
	
h1
{
font-family: inherit;
font-size: 175%;
font-weight: normal;
text-align: center;
}

h2
{
font-size: 110%;
font-weight: bold;
color: #669;
text-shadow: 2px 2px 1px lightgray;/*rgba(215, 215, 205, .9);*/
padding: 10px 15px 5px 15px;
margin: 15px -15px 0px -15px;
background: rgba(215, 215, 205, .9); /* For browsers that do not support gradients */
background: -webkit-linear-gradient(rgba(215, 215, 205, .9), rgba(215, 215, 205, 0)); /* For Safari 5.1 to 6.0 */
background: -o-linear-gradient(rgba(215, 215, 205, .9), rgba(215, 215, 205, 0)); /* For Opera 11.1 to 12.0 */
background: -moz-linear-gradient(rgba(215, 215, 205, .9), rgba(215, 215, 205, 0)); /* For Firefox 3.6 to 15 */
background: linear-gradient(rgba(215, 215, 205, .9), rgba(215, 215, 205, 0)); /* Standard syntax */
clear: both;
/*border: 1px dotted #669;*/
}

.center>h2:first-child
{
border-top: none;
padding-top: 15px;
margin-top: -15px;
border-radius: 9px 9px 0 0;
}

.left h2
{
font-size: 110%;
font-weight: bold;
color: rgb(91,155,213);
color: #669;
margin: 8px 30px 2px -15px;
background: none;
text-shadow: none;
}

h3
{
font-size: 95%;
/*font-weight: bold;*/
font-weight: bold;
color: #444466;
padding: 5px 0 5px 5px;
margin: 10px 0 0 -5px;
margin-bottom: 1px;
background-color: lavender;
background: -webkit-linear-gradient(left, hsla(240,50%,95%,1), hsla(240,50%,95%,0)); /* For Safari 5.1 to 6.0 */
background: -o-linear-gradient(right, hsla(240,50%,95%,1), hsla(240,50%,95%,0)); /* For Opera 11.1 to 12.0 */
background: -moz-linear-gradient(right, hsla(240,50%,95%,1), hsla(240,50%,95%,0)); /* For Firefox 3.6 to 15 */
background: linear-gradient(to right, hsla(240,50%,95%,1), hsla(240,50%,95%,0)); /* Standard syntax*/
}

.h3
{
font-size: 95%;
font-weight: bold;
color: #444466;
}

ol
{
padding-left: 1.5em;
overflow: hidden;
}

ul
{
padding-left: 2em;
}

.hd_3
{
width: 640px;
height: 360px;
display: block;
margin-left: auto;
margin-right: auto;
margin-top: 20px;
margin-bottom: 20px;
padding: 20px;
}

a:visited
{
color: #002040;
}

a:hover
{
color: #202020;
background-color: #B7AD9E;/*#DAD9C3;*/
background-color: #bbb;
}
/*
table
{
text-align: center;
margin-left: auto;
margin-right: auto;
border: 1px solid #669;
border-collapse: collapse;
}

strong
{
font-weight: bold;
font-size: 90%;
background-color: #E7E4DF;
background-color: rgba(231,228,223,.8);
}

em
{
font-style: normal;
background-color: #E7E4DF;
background-color: rgba(231,228,223,.8);
}
*/
