body
{
width: 100%;
background-color: #F8F8FA;
margin: auto;
padding: 0px;
}
	
#haut
{
height: 50px;
width: 100%;
background-color: #240048;
margin-top: 0px;
margin: auto;
padding: 0px;
}

#haut_ligne
{
height: 6px;
width: 100%;
background-color: #FFCC00;
position:absolute;
margin: auto;
margin-top: 50px;
}

#ecom
{
margin: auto;
margin-top: 50px;
text-align: center;
width: 686px;
}

#produitslink
{
margin-top: 10px;
margin-bottom: 0px;
width: 100%;
background-color: #E1E1E1;
}

#produitslink a
{
display: block;
color: #000000;
font-family: arial;
font-size: 13px;
line-height: 1.2;
text-align: center;
font-weight: bold;
text-decoration: none;
padding: 10px;
border:0px;
}

#produitslink a:hover
{
background: #FFFFFF;
color: #8A2301;
text-decoration: none;
}

#bas
{
margin-top: 10px;
margin-bottom: 0px;
width: 100%;
height: 50px;
background-color: #240048;
padding: 0px;
}

#logo
{
position:absolute;
margin-top: 16px;
margin-left: 20px;
color: #FFFFFF;
text-align: left;
font-family: arial;
font-weight: normal;
font-size: 20px;
padding: 0px;
cursor: pointer;
display: block;
}

#UTCdiv
{
position:absolute;
top: 8px;
right: 0px;
width: 120px;
height: 40px;
color: #FFFFFF;
text-align: left;
font-family: arial;
font-weight: normal;
font-size: 12px;
padding: 4px;
display: none;
}

#gauche
{
float: left;
width: 160px;
background-color: #240048;
position: absolute;
margin-top: 0px;
margin-left: 0px;
margin-bottom: 0px;
z-index:9;
display: none;
}

.gauche_ligne
{
height: 6px;
width: 160px; 
background-color: #FFCC00;
position:absolute;
margin-bottom: 0px;
margin-left: 0px;
}

#gauche2
{
background-color: #E1E1E1;
margin-top: 0px;
margin-left: 0px;
margin-bottom: 0px;
}

#navigation
{
list-style: none;
margin: 0px;
padding: 0px;
padding-top: 11px;
padding-bottom: 6px;
}

#navigation li
{
margin-bottom: 0px ;
}

#navigation li a
{
background-color: #E1E1E1;
display: block;
color: #000000;
font: 1em Arial;
line-height: 1em;
text-align: left;
font-weight: bold;
text-decoration: none;
padding: 7px;
border: 0px solid #240048;
}

#navigation li a:hover
{
background: #FFFFFF;
color: #8A2301;
text-decoration: none;
}

#youtuber
{
width: 180px; 
background-color: #240048;
padding: 2px;
}

#navigation2
{
list-style: none;
margin: 0px;
padding: 0px;
padding-top: 16px;
padding-bottom: 6px;
}

#navigation2 li
{
margin-bottom: 0px ;
}

#navigation2 li a
{
display: block;
color: #000000;
font: 0.90em Arial;
line-height: 1em;
text-align: left;
font-weight: bold;
text-decoration: none;
padding: 7px;
border:0px;
}

#navigation2 li a:hover
{
background: #FFFFFF;
color: #8A2301;
text-decoration: none;
}

#index
{
list-style: none;
margin: 0px;
color: #000000;
font: 1em Arial;
line-height: 1.5em ;
text-align: left;
font-weight: bold;
padding: 0px;
}

#index li a
{
color: #000000;
font-weight: normal;
text-decoration: none;
padding: 0px;
}

#index li a:hover
{
color: #8A2301;
text-decoration: none;
}

#centre
{
width: 686px;
min-height: 810px;
margin-top: 0px;
margin: auto;
padding: 0px;
}

#code
{
padding: 3px;
background-color: #240048;
margin-bottom: 16px;
text-align: left;
font-weight: bold;
font-family: arial;
font-size: 13px;
color: #FFFFFF;
}

#youtubevideo
{
width: 686px;
margin-top: 30px;
padding: 0px;
margin: auto;
}

h2
{
margin-top: 0px;
text-align: center;
font-family: arial;
font-weight: normal;
font-size: 24px;
color: #FFFFFF;
font-style: normal;
padding: 12px;
}

h1
{
margin-top: 16px;
margin-bottom: 0px;
text-align: center;
font-family: arial;
font-size: 30px;
color: #8A2301;
padding: 5px;
}

h3
{
text-align: justify;
font-family: arial;
font-size: 23px;
color: #00B050;
}

h5
{
text-align: center;
font-family: arial;
font-weight: normal;
font-size: 15px;
color: #FFFFFF;
padding: 5px;
}

h5 a
{
color: #FFFFFF;
font-weight: normal;
}

h5 a:hover
{
color: #FFFFFF;
text-decoration: underline;
}

p
{
text-align: justify;
font-family: arial;
font-size: 15px;
color: #000000;
padding: 5px;
}

.pemail
{
text-align: left;
}

a
{
color: #000000;
font-weight: bold;
text-decoration: none;
}

a:hover
{
color: #8A2301;
text-decoration: none;
}

.explanation{
    margin-top: 20px;
    text-align: left;
}

@media only screen and (max-width: 1166px) {

    body{
    width: 100%;
    }
        
    #haut{
    margin: auto;
    width: 100%;
    }

    #ecom
    {
    margin-top: 50px;
    margin: auto;
    width: 686px;;
    }
    
    #haut_ligne{
    margin: auto;
    margin-top: 50px;
    width: 100%;
    }
    
    #bas{
    width: 100%;
    }
    
    #centre{
    margin: auto;
    width: 100%;
    }
    
    #youtubevideo{
    margin: auto;
    margin-top: 30px;
    }
    
    }
    
    @media only screen and (max-width: 686px) {
        
    #haut
    {
    width: 686px;
    }

    #ecom
    {
    width: 686px;
    }
    
    #haut_ligne
    {
    width: 686px;
    }
    
    #bas
    {
    width: 686px;
    }
    
    #centre
    {
    margin: auto;
    width: 686px;
    }
    
    }
    
    @media only screen and (max-width: 600px) {
        
    #UTCdiv
    {
    display: none;
    }
    
    }










p{
    text-align: center;
    font-family: arial;
    font-size: 15px;
    color: #000000;
    padding: 5px;
}

p.directionrectangle{
    margin-top: 0px;
    text-align: center;
    font-family: arial;
    font-size: 20px;
    font-weight: bold;
    color: #FFFFFF;
    padding: 0px;
}

p.rectangles{
    margin-top: 2px;
    text-align: justify;
    font-family: arial;
    font-size: 15px;
    font-weight: bold;
    color: #FFFFFF;
    padding: 0px;
}

strong.blueStrong{
    color: #00FFFF;
}

strong.greenStrong{
    color: #00FF00;
}

#simsky{
    background-color: #240048;
    width: 686px;
    height: 50px;
    margin: auto;
    margin-top: 10px;
    text-align: center;
    font-family: arial;
    font-size: 15px;
    font-weight: bold;
    color: #FFFFFF;
    padding: 0px;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

#divcontrolssimsky{
    position: absolute;
    margin-top: 0px;
    margin-left: 14px;
    z-index:8;
}

#divcontrolssimsky2{
    position: absolute;
    margin-top: 0px;
    margin-left: 344px;
    z-index:8;
}

#simcentre{
    background-color: #8A2301;
    width: 686px;
    height: 1222px;
    margin: auto;
    margin-top: 0px;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

#divtas{
    width: 105px;
    height: 22px;
    border-radius: 5px;
    position: absolute;
    margin-top: 10px;
    margin-left: 80px;
    background-color: #000000;
    padding: 4px;
    z-index: 3;
}

#divaltitude{
    width:155px;
    height:22px;
    border-radius: 5px;
    position:absolute;
    margin-top: 10px;
    margin-left: 490px;
    background-color: #000000;
    padding: 4px;
    z-index: 3;
}

#markerbeacons{
    width:118px;
    height:30px;
    border-radius: 5px;
    position: absolute;
    margin-top: 44px;
    margin-left: 490px;
    background-color: #000000;
    padding: 2px;
    z-index: 3;
}

#outerMarker{
    width:118px;
    height:30px;
    border-radius: 5px;
    position: absolute;
    margin-top: 44px;
    margin-left: 490px;
    background-color: #000000;
    padding: 2px;
    z-index: 3;
    display: none;
}

#middleMarker{
    width:118px;
    height:30px;
    border-radius: 5px;
    position: absolute;
    margin-top: 44px;
    margin-left: 490px;
    background-color: #000000;
    padding: 2px;
    z-index: 3;
    display: none;
}

#innerMarker{
    width:118px;
    height:30px;
    border-radius: 5px;
    position: absolute;
    margin-top: 44px;
    margin-left: 490px;
    background-color: #000000;
    padding: 2px;
    z-index: 3;
    display: none;
}

#divbug{
    width: 82px;
    height: 22px;
    border-radius: 5px;
    position:absolute;
    margin-top: 84px;
    margin-left: 140px;
    background-color: #000000;
    padding: 4px;
    z-index: 8;
}

#divbugControls{
    position: absolute;
    margin-top: 476px;
    margin-left: 16px;
    z-index: 8;
    text-align: center;
    font-family: arial;
    font-size: 14px;
    display: none;
}

#divwind{
    width: 110px;
    height: 38px;
    border-radius: 5px;
    position: absolute;
    margin-top: 210px;
    margin-left: 48px;
    background-color: #000000;
    z-index: 7;
}

#divwind2{
    position: absolute;
    margin-top: 218px;
    margin-left: 104px;
    z-index: 8;
}

#divwindControls{
    position: absolute;
    margin-top: 252px;
    margin-left: 52px;
    z-index: 8;
    text-align: center;
    font-family: arial;
    font-size: 14px;
    display: none;
}

#divdme{
    width: 66px;
    height: 40px;
    border-radius: 5px;
    position: absolute;
    margin-top: 328px;
    margin-left: 120px;
    background-color: #000000;
    padding: 4px;
    z-index: 8;
}

#divdirection{
    width: 70px;
    height: 24px;
    border-radius: 5px;
    position: absolute;
    margin-top: 61px;
    margin-left: 307px;
    background-color: #000000;
    padding: 4px;
    z-index: 8;
}

#divcrs{
    width: 82px;
    height: 22px;
    border-radius: 5px;
    position: absolute;
    margin-top: 84px;
    margin-left: 462px;
    background-color: #000000;
    padding: 4px;
    z-index: 8;
}

#divcrsControls{
    position: absolute;
    margin-top: 542px;
    margin-left: 16px;
    display: none;
    z-index: 8;
    text-align: center;
    font-family: arial;
    font-size: 14px;
}

#divtimer{
    width:110px;
    height:22px;
    border-radius: 5px;
    position: absolute;
    margin-top: 340px;
    margin-left: 500px;
    background-color: #000000;
    padding: 4px;
    z-index: 8;
}

#divtimerControls{
    position:absolute;
    margin-top: 374px;
    margin-left: 504px;
    z-index: 8;
    text-align: center;
    font-family: arial;
    font-size: 14px;
    display: none;
}

#divAP{
    width: 115px;
    height: 60px;
    border-radius: 5px;
    position: absolute;
    margin-top: 397px;
    margin-left: 30px;
    background-color: #000000;
    padding: 4px;
    z-index: 3;
}

#divAPControls{
    position:absolute;
    margin-top: 402px;
    margin-left: 155px;
    z-index: 8;
    text-align: center;
    font-family: arial;
    font-size: 14px;
    display: none;
}

#divNavAids{
    position:absolute;
    margin-top: 608px;
    margin-left: 16px;
    z-index: 8;
    text-align: center;
    font-family: arial;
    font-size: 14px;
    display: none;
}

#divATC{
    position:absolute;
    margin-top: 608px;
    margin-left: 330px;
    z-index: 8;
    text-align: center;
    font-family: arial;
    font-size: 14px;
}

#divsupport{
    width: 288px;
    height: 288px;
    position: absolute;
    margin-top: 100px;
    margin-left: 200px;
    z-index: 0;
}

#divcadran{
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 1;
}

#divbearing2{
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 2;
}

#divbearing1{
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 2;
}

#divbug2{
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 3;
}

#divcourse{
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 4;
}

#divcourse2{
    position:absolute;
    bottom: 0;
    right: 0;
    z-index: 5;
}

#divcourse3{
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 6;
}

#divplane{
    width: 324px;
    height: 324px;
    position: absolute;
    margin-top: 78px;
    margin-left: 182px;
    z-index: 7;
}

#divVORLOC{
    position: absolute;
    margin-top: 200px;
    margin-left: 290px;
    z-index: 8;
    text-align: center;
    font-family: arial;
}

#divglide{
    width: 14px;
    height: 122px;
    position: absolute;
    margin-top: 179px;
    margin-left: 530px;
    background-image: url("aviationsim/barre.png");
    display: block;
    overflow: hidden;
}

#divglosange{
    width: 10px;
    height: 12px;
    position: absolute;
    margin-top: 55px;
    margin-left: 2px;
    background-image: url("aviationsim/losange.png");
    display: block;
}

#divcanvas{
    position: absolute;
    margin-top: 680px;
    margin-left: 142px;
    z-index:4;
}

#canv{
    position: absolute;
    margin-top: 0px;
    margin-left: 0px;
    z-index:4;
}

#divplane2{
    width: 24px;
    height: 25px;
    position: absolute;
    margin-top: 370px;
    margin-left: 208px;
    z-index: 5;
}

#canv2{
    position: absolute;
    margin-top: 0px;
    margin-left: 0px;
    z-index: 6;
}

#divplane3{
    width: 29px;
    height: 8px;
    position: absolute;
    margin-top: 10px;
    margin-left: 10px;
    z-index: 7;
}