body {
font-family: arial;
font-size: 0.9em;
}


img {
border: 0;
}

a.lien_ext:after {
content: " (lien externe)";
}

a {
text-decoration: none;
}

#header {
position: fixed;
top: 0;
width: 80%;
height: 96px;
left: 10%;
}

h2 {
position: fixed;
top: 0px;
margin-left: 62%;
padding-top: 2%;
width: auto;
text-align: right;
font-size: 2em;
font-weight: bold;
text-transform: uppercase;
text-shadow: 1px 2px 1px #ffa500;
}

#menu {
position: fixed;
top: 96px;
left: 10%;
width: 78%;
height: 24px;
padding-left: 2%;
}

#menu a {
width: 8%;
float: left;
overflow: hidden;
padding: 0,5% ;
text-align: center;
border: solid 1px;
border-color: #73a7e7;
border-radius: 1em;}


/*///////////////////////CÔTE GAUCHE/////////////////*/

#coteg {
position: fixed;
height: 100%;
top: 120px;
left: 10%;
width: 12%;
padding-top: 5%;
}

.menug a {
display: block;
text-align: left;
padding: 1%;
margin: 3%;
width: 90%;
}

/*///////////////PAGE (enfant de body) ////////////////////////*/

#page {
margin-top: 8.5%;
padding-top: 114px; /*ce padding doit être le même pour la classe signet*/
margin-left: 21.6%;
margin-right: 21.6%;
width: 56.4%;
padding-bottom: 100%;
border-right: solid 2px;
border-left: solid 2px;
border-color: #73a7e7;
}

.signet {
padding-top: 114px;
}

.signet-top {
margin-top: -70px; padding-top: 0px;
}

.hidden {
height: 20px;
}

/*///////////////CÔTE DROIT////////////////////////*/

#coted {
position: fixed;
top: 120px;
height: 100%;
width: 12%;
left: 78%;
padding-top: 26%;
}

.menud a {
display: block;
padding: 0px 0px 4px 8px;
text-align: left;
font-size: 0.8em;
}

/*//////////////BAS DE PAGE/////////////////////////*/

#cnil {
text-align: center;
border-style: solid; 
border-width: 1px; 
border-color: #73a7e3; 
width: 72%; 
margin-left: auto;
margin-right: auto;
}


img.w3c {
vertical-align: middle;
border-width: 0px;
margin: 4px;
height: 24px;
width: 66px;
}

#adress {
text-align: center;
}

img.adress {
margin: 0px;
padding: 0px;
vertical-align: middle;
border-width: 0px;
margin: 4px;
height: 32px;
width: 600px;
}

/*///////////////PLANS////////////////////////*/

.menuplan a 
{
display: block;
width: 70%;
margin-left: auto;
padding: 1%;
margin-bottom: 0.5%;
margin-right: auto;
text-align: left;
font-weight: normal;
border: solid 1px;
}


#bloc1,#bloc2,#bloc3,#bloc4,#bloc5,#bloc6,#bloc7,#bloc8,#bloc9,#bloc10,#bloc11,#bloc12,#bloc13,#bloc14,#bloc15,#bloc16,#bloc17,#bloc18,#bloc19,#bloc20,#bloc21,#bloc22,#bloc23,#bloc24,#bloc25,#bloc26,#bloc27
{
border-style: solid;
border-width: 3px 3px;
border-color: #73a7e7;
padding-left:5px;
padding-right:5px;
padding-bottom:1px;
padding-top:1px;
}

/*/////////////////////////////////////////////////////////////////*/

ol {
padding-top:10px;
padding-bottom:10px;
}

ul {
list-style-type: none;
padding: 10px 30px 10px 10px;
}

li {
margin-left: 10%;
text-align: left;
}


table {
width: 90%;
font-style: normal;
border: 2px ridge;
margin-left: auto;
margin-right: auto;
margin-top: 36px;
margin-bottom: 20px;
}

th {
text-align: left;
font-weight: bold;
text-transform: uppercase;
border-style: solid;
border-width: 1px;
text-align: center;
padding: 10px;
}

td {
text-align: left;
border-style: solid;
border-width: 1px;
padding: 10px;
}

textarea,dl,.ubuntu,.windows,.macos,.uwm,.uw,.wm,.tilt {
margin-left: 40px;
margin-right: 40px;
}

textarea {
width:87.5%;
height:90px;
}

p {
margin: 10px 40px;
font-size: 1.0em;
}

.auteur {
text-align: right;
}

.css,.term,.menu,.html,.alerte,.cite {
border: 1px outset;
padding: 0px 10px;
}

.cite {
font-style: italic;
}

.ref {
padding: 0px 8px 0px 8px;
margin-bottom: 8px;
}

/*listes de définitions*/
dt {
text-transform: uppercase;
}

dl {
padding-top: 20px;
padding-bottom: 20px;
padding-left: 16px;
padding-right:16px;
margin-bottom: 16px;
} 
/*///////////////////////////////////*/

hr {
height: 2px;
margin-bottom: 10px;
margin-top: 10px;
}

.ubuntu,.windows,.macos {
width: 32px;
height: 32px;
margin-top:24px;
}

.uwm {
width: 106px;
height: 32px;
margin-top:24px;
}

.uw {
width: 68px;
height: 32px;
margin-top:24px;
}

.wm {
width: 68px;
height: 32px;
margin-top:24px;
}


/*////////////////angles arrondis (Stu Nichols : http://www.cssplay.co.uk/boxes/krazy.html)/////////////////////*/
.line {
padding-top: 10px; padding-bottom: 10px;
}

h1, h3, h4, h5, h6 {
text-align: center;
text-transform: uppercase;
width:100%;
padding: 0;
margin: 0;
text-shadow: 1px 2px 1px #73a7e7;
}

.line .ht1, .line .ht2, .line .ht3, .line .ht4, .line .ht5, .line .ht6, .line .ht7, .line .ht8, .line .ht9, .line .ht10,
.line .bs1, .line .bs2, .line .bs3, .line .bs4, .line .bs5, .line .bs6, .line .bs7, .line .bs8, .line .bs9, .line .bs10 {
display:block;
overflow:hidden;
height:1px;
border-left:3px solid; border-right:3px solid; 
}

.line .ht1 {
border-top:1px solid; margin:0 11px;
}

.line .ht2 {
margin:0 8px;
}

.line .ht3 {
margin:0 6px;
}

.line .ht4 {
margin:0 5px;
}

.line .ht5 {
margin:0 4px;
}

.line .ht6 {
margin:0 3px;
}

.line .ht7 {
margin:0 2px;
}

.line .ht8 {
margin:0 2px;
}

.line .ht9 {
margin:0 1px;
}

.line .ht10 {
margin:0 1px;
}

.line .bs10 {
margin:0 1px;
}

.line .bs9 {
margin:0 1px;
}

.line .bs8 {
margin:0 2px;
}

.line .bs7 {
margin:0 2px;
}

.line .bs6 {
margin:0 3px;
}

.line .bs5 {
margin:0 4px;
}

.line .bs4 {
margin:0 5px;
}

.line .bs3 {
margin:0 6px;
}

.line .bs2 {
margin:0 8px;
}

.line .bs1 {
border-bottom:1px solid; margin:0 11px;
}


form {
 background-color:#2b4059;
 padding:0px;
 padding-bottom: 20px;
 padding-top: 20px;
}

submit {width:111px; 
border: none;
font-size: 0.8em;
text-align:left;
padding-left: 5px;
padding-bottom: 5px;
}

input {
width:111px; 
border: none;
font-size: 0.8em;
text-align:left;
padding-left: 5px;
padding-bottom: 5px;
}

.styled-select {
   width: 145px;
   height: 24px;
   background: transparent;
   padding: 1px;
   border: 1px solid #2b4059;
}

select {
   font-size: 0.8em;
}


.text {width:113px; 
border-style: solid;
border-width: 1px;
font-size: 0.8em;}

/* style infobulle R.Hunel*/
/* Rend invisible tout notre bloc span */
a.bulle span
{
position: absolute;
top: -1000em;
left: -1000em;
width: 150px;
height: auto;
overflow: hidden;
color: #4b4b4b;
background: #49ac64; /* Définition du fond, sinon on a le même que notre lien */
background : url(../img/tuxpaint2.png) repeat;
border-color : #ff2e1a;
border-style : solid;
border-width : 1px; /* Définition des bordures */
}

a.bulle
{
font-family : arial;
font-size : 10pt;
padding: 1px 1px 1px 1px; /*Définition des marges intérieures de notre lien */
position : relative; /* Indispensable pour le bon positionnement de l'info-bulle */
}

/* Rend visible tout notre bloc span et lui attribue une taille */
a.bulle:hover span, a.info_bulle:focus span, a.info_bulle:active span
{
top : 20px;
left : 0px;
width : 150px;
height : auto;
overflow : visible;
}

a.bulle:hover
{
border : 0; /* ligne qui corrige le bug d'IE6 et inférieur */
}
/*fin de style bulle d'après tutoriel http://r-hunel.developpez.com/tutoriels/css/info-bulle/ */ 

b 
{font-style:italic;}
