body
{
    background-color: #8a2be2;
    font-family:Arial, Helvetica, sans-serif;
    font-size:14px;
}


.leftthird_yellow
{    
       display:inline;
       width:35%;
background-color:#ffff00;
       border:0;
       height:auto;
       float:left;       
       text-align:left;
       padding:0;
       margin:0;
}  


h1.joke
{
font-family: Comic Sans MS;
font-size:1.5em; 
        text-align:center;
color:blue;
color:#646262;
}

.pinboard_long_1
{
  position:relative;  
display:inline;
width:auto;
background-color:#ffff00;
background-image:url(http://kids.inmatlock.com/images/pinboard_long_1.gif);
background-repeat: no-repeat;
font-family: Comic Sans MS;
color:#669900;
       border:0;
       height:auto;
       float:left;       
       text-align:left;
       padding:6em 5em 7em 6em;
       margin-bottom:0.1em;
}


.pinboard_long_2
{
  position:relative;  
display:inline;
width:auto;
font-family: Comic Sans MS;
color:#6666FF;
background-color:#ffff00;
background-image:url(http://kids.inmatlock.com/images/pinboard_long_2.gif);
background-repeat: no-repeat;
       border:0;
       height:auto;
       float:left;       
       text-align:left;
       padding:6em 5em 7em 6em;
       margin-bottom:0.1em;
}

.pinboard_long_3
{
  position:relative;  
display:inline;
width:auto;
background-color:#ffff00;
font-family: Comic Sans MS;
color:#CC9900;
background-image:url(http://kids.inmatlock.com/images/pinboard_long_3.gif);
background-repeat: no-repeat;
       border:0;
       height:auto;
       float:left;       
       text-align:left;
       padding:6em 5em 7em 6em;
       margin-bottom:0.1em;
}

.pinboard_1
{
  position:relative;  
display:inline;
width:auto;
font-family: Comic Sans MS;
color:#CC9999;
background-color:#ffff00;
background-image:url(http://kids.inmatlock.com/images/pinboard_1.gif);
background-repeat: no-repeat;
       border:0;
       height:auto;
       float:left;       
       text-align:left;
       padding:6em 5em 7em 6em;
       margin-bottom:0.1em;
}


.pinboard_2
{
  position:relative;  
display:inline;
width:auto;
font-family: Comic Sans MS;
color:#66CC00;
background-color:#ffff00;
background-image:url(http://kids.inmatlock.com/images/pinboard_2.gif);
background-repeat: no-repeat;
       border:0;
       height:auto;
       float:left;       
       text-align:left;
       padding:6em 5em 7em 6em;
       margin-bottom:0.1em;
}


.pinboard_3
{
  position:relative;  
display:inline;
width:auto;
font-family: Comic Sans MS;
color:#999900;
background-color:#ffff00;
background-image:url(http://kids.inmatlock.com/images/pinboard_3.gif);
background-repeat: no-repeat;
       border:0;
       height:auto;
       float:left;       
       text-align:left;
       padding:6em 5em 7em 6em;
       margin-bottom:0.1em;
}


.endbox
{   
position:relative;   
 display:inline;
overflow:visible;
right:1%;
float:right;
       width:10%;  
       text-align:center;
padding: 0 1em 0 1em;
}  


.endbox2
{   
position:relative;   
background-color:#ffffff; 
 display:inline;
overflow:visible;
right:0.5%;
float:right;
       width:18%;   
       text-align:left;
padding: 0 0.5em 0 0.5em;
}  

.centerstrip {
position : relative;
width : 580px;
height : auto;
text-align : left;
font : 1.4em palatino, times, "new times roman", bookman, "new century schoolbook", serif;

}

h1.zonecorner
{  
font:bold 110% Arial, Helvetica, sans-serif;
            color:red;
            text-align:center;
}

.zonecorner
            {
            position: absolute;
            display:inline;
            width:150px;
            height:auto;
            top:0;
right:2px;
background-color:yellow;
            padding:0;
            text-align:center;

 }

.leftthird
{    
        position:relative;
       display:inline;
       width:30%;
       height:auto;
       background:transparent;
       float:left;       
       text-align:justify;
       margin:0.75em;
}  

.right2thirds
{    
        position:relative;
       display:inline;
       width:60%; 
       background-color:#ffffff;
       float:right;
       text-align:justify;
       margin:0.75em;
}
.footer
{
padding:5px 20px 5px 20px;
font-size:85%;
}
.footstrip
{
padding:5px 20px 5px 20px;
font-size:80%;
}

a:link {font: bold 98% Arial; color: blue; text-decoration: underline;}
a:active {font: bold 98% Arial; color: blue; text-decoration: underline;}
a:visited {font: bold 98% Arial; color: blue; text-decoration: underline;}
a:hover {font: bold 98% Arial; color: #ad0018; text-decoration:underline;}


.first_quarter
{        
position:relative;
 display:inline;
float:left;
       width:10%;
       height:auto;       
       text-align:center;
font-size:50%;
font-weight:bold;
padding: 0 1em 0 1em;
       margin:0 0 0 5%;
clear:left;
}  


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


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

.clear
{clear:both;}

.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;
}

h1, h2, h3, h4
{
	color:red;
	background: transparent;
	font-family: Arial, Helvetica, sans-serif;
}


h1  {
	font-size:1.5em; 
        text-align:center;
color:blue;
}

h1.kidsheader
{
font-size: 1.6em;
	    font-weight:bold;
	    color:yellow;
text-align:center;
}

h2  {
	font-size:1.2em;
        text-align:left;
color:black;
}

h4  {
	font-size:1.2em;
	text-align:right;
        display:inline;
        margin:0;
        padding:0;
}


h5  {
        color:yellow;
	font-size:1.3em;
        line-height:1.1;
        text-align:center;
}

h6
{
font: italic 0.7em Arial, Helvetica, sans-serif;
 color: black;
text-align:right;
	padding:0;
        margin:0;
        line-height:1.1;
}

h3  {
	font:  bold 150% Arial, Helvetica, sans-serif;
color:red;	
border: 1px solid #7088B0!important;
	line-height:1.1;
	padding:3px 3px 3px 5px;
	background:yellow;
        text-align:center;
}


.caption
{
 font-size : 0.5em;
font-style : italic;
font-weight : bold;
 text-align : center;
color: black;
}


/*
font:italic 1.5em Times 'New Century Schoolbook', Palatino, serif;   */
.quotebox
{
   display:inline;
       width:38%; 
       float:right;
text-align:center;
color:#330066;
       padding:0.5em 0.5em 0.5em 1em;
       margin:0 0 0.5em 1em;
border-top: medium solid #330066;
border-bottom: medium solid #330066;
}

.starsite
{
   display:inline;
       width:38%; 
       float:right;
text-align:center;
background-image:url(http://steepturnpikechurch.inmatlock.com/fallstars.gif);
background-repeat: no-repeat;
color:#330066;
       padding:0.5em 0.5em 0.5em 1em;
       margin:0 0 0.5em 1em;
border-top: medium solid #330066;
border-bottom: medium solid #330066;
}
img
{
display:inline;
border:0;
margin:0.5em;
}


table
{
     border:thin solid #99ccff;
}

td {
	padding: 10px 10px;
	vertical-align: middle;
}
td a { font:  98% Arial; color: blue; text-decoration: none;}
	
	
th {
	padding: 10px 10px;
	font: bold 100% Verdana,Arial,Helvetica,sans-serif;
	color: #666;
	background: #ccffff;
}



.lefthalf
{    
       display:inline;
       width:45%;
background-color:#ffa500;
       border:0;
       height:auto;
       float:left;       
       text-align:left;
       padding:0 0.1em 0.1em 0.1em;
       margin-bottom:0.1em;
}  

.left45pcwhite
{    
       display:inline;
       width:45%;
background-color:#ffa500;
       border:0;
       height:auto;
       float:left;       
       text-align:left;
       padding:0 0.1em 0.1em 0.1em;
       margin-bottom:0.1em;
}  

.orange
{    
       display:inline;
       width:95%; 
background-color:#ffa500;
       border:thick solid yellow;
       height:auto;
       float:left;  
       text-align:left;
       padding:0 1% 0.5em 1%;
margin: 0 1% 1% 1%;
}


.white
{    
       display:inline;
       width:95%; 
background-color:#ffffff;
       border:thick solid yellow;
       height:auto;
       float:left;  
       text-align:left;
       padding:0 1% 0.5em 1%;
margin: 0 1% 1% 1%;
}

.yellow
{    
       display:inline;
       width:95%; 
background-color:#ffff00;
       border:thick solid yellow;
       height:auto;
       float:left;  
       text-align:left;
       padding:0 1% 0.5em 1%;
margin: 0 1% 1% 1%;
}

.whitehalf_r
{    
       display:inline;
       width:45%; 
       float:right;
background-color:#ffffff;
       border:0;
       text-align:left;
       padding:3em 2em 3em 2em;
}


.whitehalf_l
{    
       display:inline;
       width:45%; 
       float:left;
background-color:#ffffff;
       border:0;
       text-align:left;
       padding:3em 2em 3em 2em;
}
.righthalf
{    
       display:inline;
       width:45%; 
       float:right;
background-color:#ffa500;
       border:0;
       text-align:left;
       padding:0 0.1em 0.1em 0.1em;
       margin-bottom:0.1em;
}

.black_half
{    
       display:inline;
       width:40%; 
       float:right;
background-color:#000000;
color:#ffffff;
       border:0;
       text-align:left;
       padding:2em;
       margin:1em;
}

.right45pcwhite
{    
       display:inline;
       width:45%; 
       float:right;
background-color:#ffa500;
       border:0;
       text-align:left;
       padding:0 0.1em 0.1em 0.1em;
       margin-bottom:0.1em;
}

.orangesmall
{    
       display:inline;
font-size:0.5em;
       width:100%; 
       float:right;
background-color:#ffa500;
       border:0;
       text-align:left;
       padding:0 0.1em 0.1em 0.1em;
       margin-bottom:0.1em;
}


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


.epigraph
{
font-size:18px;
font-style:italic;
font-weight:bold;
text-align:center;
color:#330066;
}


.epigraphblue
{
font-size:2em;
font-style:italic;
font-weight:bold;
text-align:center;
color:blue;
}

/* EXPLANATORY POPUPS */

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


.rightbar
{
position:absolute;
width:200px;
height: auto;
top:120px;
right:2px;
padding:0;
margin:0 0 2px 2px;
     font-family:Arial, Helvetica, sans-serif; 
     color:#000000; 
border:0;
    
}





     .rightitemcenteryellow
     {
     width:190px;
     height:auto;
     text-align:center;
     border:thick double red;
     background-color:yellow;
     padding:5px 2px 5px 2px;
     margin:0;
     font-family:Arial, Helvetica, sans-serif; 
     color:#000000;    
}

     .rightitemleftyellow
     {
     width:190px;
     height:auto;
     text-align:left;
     border:thick double red;
    background-color: yellow;
     padding:5px 2px 5px 2px;
     margin:0;
     font-family:Arial, Helvetica, sans-serif; 
     color:#000000;    
}



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

.leftbaryellow
{
position: absolute;
top:200px;
bottom:0;
width:180px;
height:auto;
left:5px;
padding:5px;
margin:5px;
font:12px verdana;
border:thin solid red;
}

     .leftitemcenteryellow
     {
         position:absolute;
         width:160px;
         height:100%;
         color:#000000;
         border-style:none;
         text-align:center;
         padding:6px;
       background-color:yellow;
     }


     .leftitemleftyellow
     {
         position:absolute;
         width:160px;
         height:auto;
         color:#000000;
         border-style:none;
         text-align:left;
         padding:6px;
       background-color:yellow;
     }



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


.maincol
{
        width:auto;
        position:relative;
        padding:0.2em;
        margin:60px 220px 20px 180px;
        text-align:justify;
}


/*
.maincolorange
{
        width:auto;
        position:relative;
        padding:0.2em;
        margin:60px 200px 20px 180px;
        text-align:justify;
background-color:#ffa500;
}
*/
.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:94%;
top:2%;
margin-left:2%;
margin-right:2%;
padding:1em 0 1em 0;
color:red;
text-align:center;
font-size:120%;
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:auto;
            top:100px;
            left:2px;
            right:2px;
            padding:0;
            height:4em;
            font-size:12pt;
            text-align: center;
            }

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


        /*    FOR TEXT CENTERED IN HEADER ONLY  */
        .centerbox
            {    
            width:auto;      
            display:inline;
            overflow: visible;
            right:2px;
	    left:2px;
            text-align:center;
	    font-size: 1.3em;
	    font-weight:bold;
	    color:yellow;
            }

.centerbox2
            {
            position:absolute;
            display:block;
            width:100%;
            padding:1px 1px 10px 1px;
            font:bold 200% Arial, Helvetica, sans-serif;
            color:#ad0018;
            text-align:center;
            margin-left:2px;
            margin-right:2px;
clear:both;
            }

    .centerbox3
            {
            display:block;
            width:auto;
            padding:10px 10px 10px 10px;
            font:bold 150% Arial, Helvetica, sans-serif;
            color:red;
            text-align:center;
            background-color:yellow; 
border:thick solid #ffa500;    
            }


       /*   FOR HEADER AND OTHER USE    */
        .toprightcorner
            {
            position: absolute;
            display:inline;
            width:auto;
            height:auto;
            top:0;
            right:20px;
            padding:5px;
            font-size:10pt;
            text-align:center;
            }


/*  LOGO BOX TO USE WITHIN HEADER */
        .logobox
            {
            position: absolute;
            display:inline;
            width:18em;
            top: 5px;
            left:5px;
            padding:0;
            font-size:130%;
            font-weight:bold;
            color:yellow;
            text-align: justify;
            }

.epigraphjoin
{
font-size:2em;
font-style:italic;
font-weight:bold;
text-align:center;
color:blue;
background-color:#ffa500;
}

.join
{    
       display:inline;
       width:100%; 
       text-align:left;
       padding:0.5em;
margin:0;
bottom:1em;
border:thick solid #ffa500;
background-color:#ffa500;
}  

.rightjoin
{    
       display:inline;
       width:42.8%;
float:right;
       text-align:left;
       padding:1em 1em 1em 1em;
margin:0;
border:thick solid #ffa500;
background-color:#ffa500;
}

/*   
background-image:url(free_hangingmonkey.gif);
background-position: top left;
background-repeat:no-repeat;

*/