body  {
    background-color:#72e2ff;
    color:#000000;
    font-family: Arial, Helvetica, sans-serif;
    font-size:14px;
}

a:link {font: bold 100% Arial; color: blue; text-decoration: underline;}
a:active {font: bold 100% Arial; color: blue; text-decoration: underline;}
a:visited {font: bold 100% Arial; color: blue; text-decoration: underline;}
a:hover {font: bold 100% Arial; color: #ad0018; text-decoration:underline;}
 
.first_quarter
{        
position:relative;
 display:inline;
float:left;
       width:8%;
       height:auto;       
       text-align:center;
font-size:30%;
font-weight:bold;
padding: 0 1em 0 1em;
       margin:0 0 0 18%;
clear:left;
}  

.last_quarter  {     
position:relative;   
 display:inline;
float:left;
       width:8%;
       height:auto;       
       text-align:center;
font-size:30%;
font-weight:bold;
padding: 0 1em 0 1em;
       margin:0 18% 0 0;
clear:right;
}  

.quarter  {     
position:relative;   
 display:inline;
float:left;
       width:8%;
       height:auto;       
       text-align:center;
font-size:30%;
font-weight:bold;
padding: 0 1em 0 1em;
       margin:0;
}  

.maincol  {
        width:auto;
        position:relative;
        padding:2px;
        margin:210px 210px 10px 180px;
        text-align:justify;
background:white;
}

.maincolclear  {
        width:auto;
        position:relative;
        padding:2px;
        margin:210px 210px 10px 180px;
        text-align:justify;
}

.clear {
clear:both; 
background:transparent;
width:100%;
margin:0 -5px -5px -5px;
}

.left  {
    /* floats item to LHS of page, and adds a margin */
    float:left;
}

.right  {
    /* floats item to RHS of the page, and adds a margin */
    float:right;
}

img {
position:relative;
display:inline;
border:0;
margin:0.5em;
}

.left25  {
position:relative;
display: inline;
width:23%;
float:left;
border:0;
padding:0;
margin:2px 2px 5px 0;
}


.right25  {
position:relative;
display: inline;
width:23%;
float:left;
border:0;
padding:0;
margin:2px 0 5px 5px;
}


h1  {
	font:  bold 180% Arial, Helvetica, sans-serif;
color:#9050c0;	
border: 2px solid #000000!important;
	line-height:1.1;
	padding:0.3em;
	background:#1eff37;
	font-family:  'Trebuchet MS', Arial, Helvetica, sans-serif;
        text-align:center;
}

h2, h4, h3 h5  {
color:#9050c0;	
	background: transparent;
	font-family:  'Trebuchet MS', Arial, Helvetica, sans-serif;
}


h2  {
	font-size:160%; 
        text-align:center;
}

h3  {
	font-size:160%;
        text-align:left;
}

h4  {
	font-size:120%;
	padding:0;
}


h5  {
        color: #000000;
	font-size:110%;
	padding:0;
}

h6 {
        color: #000000;
	font-size:80%;
	padding:0;
}


.right45pc {    
position:relative;
       display:inline;
       width:40%; 
       background: transparent;
       float:right;
       text-align:left;
       margin:5px;
}

.left45pc
{    
position:relative;
       display:inline;
       width:40%;
       background: transparent;
       float:left;       
       text-align:left;
       margin:5px;
}  


.right45pcwhite
{    
position:relative;
       display:inline;
       width:42%; 
       float:right;
       text-align:left;
       margin:1em;
background-color:white;
padding:1em;
}

.left45pcwhite
{    
position:relative;
       display:inline;
       width:42%;
       float:left;       
       text-align:left;
       margin:1px;
padding:1em;
background-color:white;
}  

.fullwhite
{    
position:relative;
       display:inline;
       width:85%;
       background-color:#ffffff;
       float:center;       
       text-align:left;
       margin:1px;
padding:1em;
}  

.leftboxlinks {
position:relative;	display:inline;
	width:45%;
	background-color:#ffffff;	
	float:left;
	text-align:left;
	font-size:90%;
	margin:5px;
}

.rightboxlinks
{
position:relative;	display:inline;
	width:45%;
	height:auto;
	backgound-color:#ffffff;
	float:right;
	text-align:left;
	font-size:90%;
	margin:5px;
}

.p
{
font:14px verdana;
color:#330066;
text-align:justify;
}


/* EXPLANATORY POPUPS */

.popup
{
color:#9f141a;
text-decoration:none;
}


.rightbar
{
position:absolute;
width:190px;
height: auto;
top:220px;
right:2px;
padding:0;
margin:0 2px;
     font-family:'Trebuchet MS', Arial, Helvetica, sans-serif; 
border:0;
    
}

     .rightitemcenteryel
     {
   position:relative;  width:180px;
     height:auto;
     text-align:center;
     border:thick double #ad0018;
     padding:2px 2px 5px 2px;
     margin:0;
     font-family:'Trebuchet MS', Arial, Helvetica, sans-serif; 
     background-color:yellow;    
}


     .rightitemleftyel
     {
position:relative;     width:180px;
     height:auto;
     text-align:left;
     border:thick double #6699ff;
     padding:2px 2px 5px 2px;
     margin:0; 
     background-color:yellow; 
}

     .rightitemleft
     {
   position:relative;  width:180px;
     height:auto;
     text-align:left;
     border:thick double #ad0018;
     padding:2px 2px 5px 2px;
     margin:0;
     background-color:yellow;
     }

.leftbar
{
position: absolute;
top:120px;
bottom:0;
width:180px;
height:120%;
left:2px;
padding:6px;
margin:0 5px 0 0;
font:12px verdana;
border:0;
}

.leftbaryel
{
position: absolute;
top:200px;
width:180px;
height:120%;
left:5px;
padding:5px;
margin:0;
font:12px verdana;
border:0;
}

     .leftitemyel
     {
         position:absolute;
         width:160px;
         height:120%;
         color:#000000;
         border-style:0;
         margin:0;
         text-align:left;
         padding:6px;
         background-color:yellow;
     }


     .leftitemleft
     {
         position:absolute;
         width:160px;
         height:100%;
         color:#000000;
         border-style:0;
         text-align:left;
         padding:0px;
     }

     .leftitemcenteryel
     {
         position:absolute;
         width:180px;
         height:100%;
         color:#000000;
         text-align:center;
         padding:35px 6px 6px 6px;
         margin:0;     
background-color:yellow;
     }

     .leftitemcenter
     {
         position:absolute;
         width:160px;
         height:100%;
         color:#336699;
         border:0;
         text-align:center;
         padding:0px;
     }


.topleftbox
{
position:relative;
display:inline;
float:right;
width:200px;
margin:5px 5px 0 0;
padding:0;
border:0 none inherit;
font-size:8pt;
text-align:center;
}

.header
    {
    position:absolute;
    top:0;
    right: 0;
    left: 0;
    width:100%;
    height:auto;
    padding:0;
    margin:0;
    text-align:center;
}

        /* this is the TOP BAR FOR HORIZ LINKS  place BELOW maincol end of div */     
.topbar_kids
            {
            position:absolute;
            width:100%;
top:100px;
left:0;
            padding:1em 0 1em 0 ;
            height:auto;
  color:red;
            text-align:center;
            background-color:yellow; 
background-image:url(http://steepturnpikechurch.inmatlock.com/pyramid_rock/corner_yel_out.gif);
background-position: top left;
background-repeat: no-repeat;
            } 
         .topbar
            {
            position:absolute;
            width:90%;
            top:80px;
            left:2px;
            right:2px;
            padding:0;
            height:4em;
            font-size:10pt;
            text-align: center;
            }

         /*   TOP NAV Plain   */
          .navhoriz
            {
  position:relative;          display:inline;
            height:auto;
            left:2px;
            right:2px;
            text-align:center;
            }

       /*  LOGO BOX TO USE WITHIN HEADER */
.topcornerbox
            {
            position: absolute;
            display:inline;
            width:auto;
            top: 5px;
            right:5px;
            padding:0;
            margin:0;           
            }

 .logobox1
            {
            position: absolute;
            display:inline;
            width:18em;
            top: 5px;
            left:5px;
            padding:1px;
            margin:2px;
font:  bold 130% Arial, Helvetica, sans-serif;
            color:#9050c0;
            text-align: justify;
            }

.logobox2
            {
            position: absolute;
            display:inline;
            width:18em;
            left:5px;
            padding:1px;
margin:2px;
font:  bold 99% Arial, Helvetica, sans-serif;
            text-align: justify;
            color:#9050c0;
            }

.centerbox {
            position: relative;    display:inline;
            width:auto; height:auto;
 top: 3em;
padding:1px;
left:5em;   right:5em;
font:  bold 200% Arial, Helvetica, sans-serif;
color:#9050c0;
text-align: center;
            }
