/* A */

/*  howplanesfly style sheet */

/* BODY */

body {text-align: center;
	   font-family: "Arial", "Helvetica", "Helvetica Neue", sans-serif;
	   font-size: 100%;
	   margin: 0;
	   -webkit-text-size-adjust: 100%;
	   -ms-text-size-adjust: 100%}

/* DIVS *************************************************************** DIVS */

/* *********************** Coloured bar at top of page */

div#topbar {background: #ccffff;
            border-bottom: 4px solid #bbbbbb}

/* ************************************ MAIN CONTAINER */

div#contmain {max-width: 800px;
              margin: 2em auto 2.5em}             

/* ************************************ Image text div */

div.imgrefc {margin-top: -0.9em;
             background: #dddddd}

/* ******************************************** Footer */

div#footer {height: 200px;
            background: #ccffff;
            border-top: 4px solid #bbbbbb}

/* HORIZONTAL RULES ************************************************ H/RULES */

hr.sect,
hr.emph,
hr.intro {border-style: none}

hr.intro {height: 4px;          
          width: 60%;
          background: #3366cc;
          margin: 2em auto 1em}   
           
hr.emph {height: 3px;
         width: 60%;
         background: #cccccc;
         margin: 2em auto 2em}

/* ******************************* End of text section */

hr.sect {height: 4px;
         width: 50%;
         background: #999999;
         margin: 2em auto 1.5em}

/* HYPERLINKS: SINGLE, INCLUDING BUTTONS ************************ HYPERLINKS */	       

/* ******************************** Back to top button */

#bttop {display: none;
        position: fixed;
        bottom: 6px;
        right: 15px;
        z-index: 99;
        outline: none;
        cursor: pointer;
        font-size: 1.6em;
        font-weight: normal;
        color: #333333; 
        background: #ffffff;
        padding: 6px;
        border: 2px solid #cccccc;
        border-radius: 4px}

/* ************************** Back to top hover colour */        
        
#bttop:hover {background-color: #ffff00}        
        
a {text-decoration: none}

/* IMAGES *********************************************************** IMAGES */

/* ******************************* General page images */

img.pageimg {width: 100%;
             margin-top: 2em}

/* MENUS ************************************************************* MENUS */

/* TEXT RULES ********************************************************* TEXT */

p {font-size: 1.25em;  
   font-weight: 400;
   line-height: 1.6;
   color: #000000}
   
/* ************************************ Main paragraph */

p.stpara {width: 90%;
	       margin: 0.5em auto 0em}
	       
/* ************************************ Image comments */

p.imgref {font-size: 14px;
	       text-align: left;
	       margin-left: 0.7em;
	       padding-top: 6px;
          padding-bottom: 10px}
              
/* ************ Span to push image source to the right */              
              
span.imgref {margin-left: 19%}              

/* ************************** Margin auto and 80% wide */
           
p.emph {width: 80%;
	     margin: 1.5em auto}
	     
/* ****************************** Smaller and centered */           
           
p#topcomm {width: 94%;           
           margin: auto;
           font-size: 15px;
           font-weight: bold;
           color: #333333;
           padding-top: 16px;
           padding-bottom: 16px}
           
p.footermenup  {width: 90%;
               font-size: 0.9em;
               color: #333333;
               line-height: 1.5;
               margin: 1em auto 0em}
               
/* HEADINGS ******************************************************* HEADINGS */

h1,
h2 {width: 90%;
    font-weight: bold;
    line-height: 1.5;
    margin: 1.5em auto 1em}
 
h1 {font-size: 24px;
    color: #555555}
    
h2 {font-size: 22px;
    color: #444444}
    
/*                                                        ********************/
/* For devices up to 770 wide ************************************* Ipad 770 */

@media screen and (min-width: 568px) {

/* ******************************************************************** DIVS */

/* ************************************ Image text div */              

div.imgrefc {display: inline-block;
	          width: 70.25%;
	          margin-top: 0em}
             
/* ******************************************** Footer */            

div#footer {height: 225px}                                  
         
/* HORIZONTAL RULES *********************************** HORIZONTAL RULES 770 */
                           
hr.intro,
hr.emph {width: 200px}
         
/* HYPERLINKS, single buttons ******************************* HYPERLINKS 770 */

/* Back to top button */

#bttop {height: 40px;
        width: 40px}

/* IMAGES ******************************************************* IMAGES 770 */

img.pageimg {width: 70%}	          
	          
/* MENUS ********************************************************* MENUS 770 */

/* TEXT RULES ***************************************************** TEXT 770 */    

p {margin-left: 18px;
   margin-right: 18px}
   
p.imgref {font-size: 15px;
	       padding-top: 3px;
          padding-bottom: 5px}
              
p.footermenup {font-size: 14px}

/* ************ Span to push image source to the right */              
              
span.imgref {margin-left: 22%}              
              
}
              
/*                                                        ********************/              
/* DESKTOP ********************************************************* DESKTOP */

@media screen and (min-width: 770px) {

/* ******************************************************************** DIVS */

/* ****************************** Index page centering */

div#indhdcent {width: 750px}

/* ************************************ Image text div */  

div.imgrefc {width: 35em;
             margin-top: 0em}

/* ******************************************** Footer */        
               
div#footer {height: 300px}

/* HORIZONTAL RULES ************************************ HORIZONTAL RULES DT */

hr.intro,
hr.emph {width: 25%}

/* IMAGES ******************************************************** IMAGES DT */

img.pageimg {width: 35em}                           

/* MENUS ********************************************************** MENUS DT */

/* TEXT RULES ****************************************************** TEXT DT */         

p {color: #111111;
	line-height: 1.85}

p.imgref {padding-top: 0px;
          padding-bottom: 2px}
              
/* ************ Span to push image source to the right */              
              
span.imgref {margin-left: 40%}              
              
}

/* END OF STYLE SHEET */