body { background:#719D55     /* 719D55;     */;
       font-family:Verdana, Geneva, Tahoma, sans-serif
       }
       
h1, h4  { font-size: 29px; font-style:italic; font-family: Arial; text-align:center; color:#003300; margin-top:20px; margin-bottom:0; width:96% }
.ph     { font-size: 29px; font-style:italic; font-family: Arial; text-align:center; color:#003300; margin-top:20px; margin-bottom:0; width:96% }
.banner h1,.banner h4 {width: 83%; margin-left:8%; float:left; margin-top:5%; margin-bottom:4%}
h2   { font-size:22px }
.section-header { background:transparent; color: #004400; font-weight: normal}
h3   { font-size:22px }
h3.iline   { display:inline; font-weight:normal ;font-size:18px;font-style:italic }
p    { font-size:16px } /* Verdana, */
li   { font-size:18px }
a    { text-decoration:none }
img  { border:0 }


.greensubhd { background: transparent;	color: #008000;	font-weight: normal;}

.banner         { float:left;width:100%; background-image:url('images/banner3.jpg');background-size:100% ;background-repeat:no-repeat}
.promobox       { float:left;width:104px; height:auto; padding:0 4px 0 4px;margin:0 4px 0 4px }
.promoboxschool { float:left;width:104px; height:auto; padding:0 4px 0 4px;margin:0 4px 0 4px;display:inline-block }
.page-remainder { float:left;width:96%;padding:0 3% 0 3%;height:auto }
.shadow         { max-width:900px;padding:1px; margin-left:auto;margin-right:auto;height:auto;background:#CCCCCC; box-shadow: inset 0 0 10px #000000 }
.mainbody       { float:left; width:98%; margin:1%;height:auto;padding-bottom:0; background:#E7D596;background-image:url('images/cheap_diagonal_fabric.jpg')}
.page-background { float:left;width:96%;margin:1%;height:auto;padding-bottom:0 }
.wdth           { width:99% }
.wdth98p		{ width:98% }
.video-box      { width:315px;margin:auto }
.facebook       { width:5%; height:5%; float:right;margin-right:3%;margin-top:12% }
.caption        {display:block}
.replacecaption {display:none }
.hide           { display:block }
.indexpics      { float:left; width:21%; padding:2%; height:auto }
.top-pic        { width:200px; height:200px;margin:auto}

#menu-wrap {/* the container which holds the menu.*/
  float:left;
  background:#003300;
  margin-left:0px;
  padding-top:0px; padding-bottom: 3px;
  font-size:14px;
  text-align:left;
  width:100%;
  height:26px}
  
#menu { margin-left:auto;margin-right:auto;width:460px;vertical-align: middle;height:22px; text-align:center; }
#menu ul, #menu li {list-style:none; margin:0; padding:0 }
#menu ul li { float:left; width:auto;height:26px ;padding: 0 4px 0 4px;border-left:1px white solid } 
#menu a { display:block; color:white; text-decoration:none;padding:0;font-size:20px;font-family:Arial, Helvetica, sans-serif}
  

   @media screen and (max-width: 740px) { 
   .banner { padding:0px;height:130px }
}


   @media screen and (max-width: 635px) { 
   .banner { padding:0;height:117px }
   h1, h4, { font-size:1.6em }
   p {font-size: 14px}
/*  #menu { width:100px;background-color:fuchsia}   */  
  #menu ul li { float:left; height:24px; width:auto;}
  #menu a { padding:0;font-size:20px }
   .pk {font-size: 14px}
  .indexpics { width:45% }
}

   @media screen and (max-width: 600px) { 
   .ph {font-size:26px}   
   }


   @media screen and (max-width: 557px) { 
   .banner { padding:0;height:94px }
   .promoboxschool { display:none }
   .facebook { margin-top:50px }
   h1, h4 { font-size:22px }
      .ph {font-size:22px}   
   #menu { width:360px}
   #menu-wrap  { height:21px }   
   #menu a { padding:0;font-size:16px }
   #menu ul li { float:left; height:24px; width:auto;}	
       .caption {display: none}
       .replacecaption {display: block}
   p {font-size: 13px }
    .pk {font-size: 13px }
  .indexpics { width:45% }
} 
  
   @media screen and (max-width: 506px) {
   h2 { font-size:18px}
      
}    
  
  
   @media screen and (max-width: 450px) { 
   .banner { padding:0;height:75px }
   .promoboxschool { display:none }
   .facebook { margin-top:40px }
   h1, h4 { font-size:16px;padding:0;margin:0 }
      .ph {font-size:16px}   
   h2 { font-size:16px }
   h3.iline { font-size:16px }
   #menu-wrap  { height:16px }   
   #menu { width:340px;height:18px}
   #menu a { font-size:14px }
   #menu ul li { height:18px}
   p  { font-size:13px }
   .pk  { font-size:13px}
} 
 
   @media screen and (max-width: 370px) { 
/*     .ph {font-size:18px} */
   .banner { padding:0;height:65px }
   #menu a { padding:0;font-size:14px }
   #menu { width:300px;height:18px}         
}