/*
Main green is #538135
lighter is #71A947

*/

@font-face {
  font-family: 'Cavolini';
  src:  url('/fonts/CAVOLINI.TTF') format('truetype');
}

BODY { 
   color : #008000;
   font-family : Trebuchet MS, Verdana, Arial, helvetica, sans-serif; 
   font-size : 17px;
   padding:0;
   margin:0;
   background-color: #CEDFD9;
}

p, ol {line-height: 160%;
 font-size: 1.1em;
 margin: 12px 0 12px 0;
 color: #000000;
}

h1 {
   font-family: 'Chewy', sans-serif;
   font-size : 2.2em;
   font-weight : normal;
   color: #538135;
   margin: 0;
   padding: 0 0 15px 0;
}
/* Allow images at right side in about.php */
div.center-about h1 {
   display:inline-block;
}

h2 { 
   font-family: 'Chewy', sans-serif;
   font-size : 1.4em;
   font-weight : bold;
   color: #008000;
   margin: 18px 0;
}

h3 { 
  color: #008000;
  font-size : 1.1em;
  font-weight: bold;
  margin: 16px 0 0px 0;
}

a { color : #548235;
text-decoration: underline;
}

a:hover { color :#303080;
   text-decoration: underline;
}
img {
   text-decoration: none;
}



#mainframe {
  width:800px;
  margin: 0 auto;
  padding: 0 110px 20px 111px;
  text-align: left;
  background: #CEDFD9 url(../chrome/image_page_shadow.jpg) repeat-y 0 0;
}

#page_wrapper {
   background-color: #ffffff;
   text-align:left;
  margin: 0 auto;
  width:100%;
  
   }


header#site_header {
  position: relative;
  padding: 0 0 0 0;
  margin: 0;
  width:100%;
  height: auto;
  background-color: #ffffff;
}

#center_col {
   font-size:1.1em;
   background-color: #ffffff;
   padding: 20px 25px 0 25px;
   margin: 0px 0px 0 0px;
   width: 100%;
}



div#home {
  padding: 30px 0 0 0;
  margin: 0 0 10px 0;
  width: 100%;
  background-color: #FFFFFF;

}
div#home img {
   width:100%;
}








nav#navmenu {
   padding: 0; 
   margin: 0 10px 0 10px;
   font-family: 'Chewy', sans-serif;
   font-size: 22px;
   color: #538135;
   text-align: left;
   background-color: #ffffff;
}
nav#navmenu ul {
   list-style-type: none;
   line-height:200%;
}
nav#navmenu li {
   padding: 10px 15px;
   display: inline;
   border-radius:15px;
}
nav#navmenu .nav_item {
   float:left;
   height:30px;
   z-index:100;
}
nav#navmenu .nav_item img {
   border: 0;
}

nav#navmenu a {
   text-decoration: none;
   padding: 4px;
   border-radius:15px;
}
nav#navmenu a:hover {
   text-decoration: none;
   background-color: #71A947;
}


nav#navmenu #activemenu {
  /* todo background: #FFFFFF url(chrome/navmenu-active.gif) no-repeat 0 3px;*/
  color: #3F8F3F;
  background-color: #C2E4C2;
  border-radius:15px;
 } 

ul {
   color: #000000; 
   padding: 4px 0 0 0px; 
   margin: 0;
   font-size: 1.1em;
   }
#center_col ul {
   padding: 4px 0 0 25px;  
}
li {
   padding: 4px 0;
}
.img-caption {
  color: #707070;
  font-style: italic;
  font-size: 1.1em;
  margin: 10px 0 10px 10px;
}


.img-caption p, .img-caption-large p {
  padding: 0 0 0 20px;
  text-align: right;
}
.img-caption-large {
  float:right;
  width: 320px;
  color: #707070;
  font-style: italic;
  font-size: 1.1em;
  margin: 10px 0 10px 10px;
}


.intropara {
   color: #006F00;
   font-weight: bold;
   font-size: 1.15em;
   line-height: 150%;
}


div.quote {
   color: #000000;
   font-family: Cavolini;
   padding: 10px; 
   font-size:1.0em;
}
div.author {
   color: #008000;
   font-family: "Brush Script MT", cursive;
   text-align: right;
   font-size: 32px;
}
.smalltext, .smalltext a {
   font-size: small;
}


.centered {text-align: center; margin:0 auto; display:block;}
.centered img {
   padding: 3px;
   border: 1px solid #aa9988;
}
.alignright {text-align: right;}



#footer {
  width: 100%;
  background-color: #ffffff;
  color: #ffffff;
  font-weight: bold;
  font-size: 1em;
  text-align: left;
  float:left;
  margin: 0 0 0 0; padding: 0 0 0 0;
  /*background: transparent url(chrome/footer-bg.gif) repeat-x left bottom;*/
  height: 100px;
}

#footeraddress, #footercontact {
  color: #ffffff;
  font-weight: bold;
  font-size: 1em;
}

#footeraddress {
  width: 500px;
  float:left;
  margin: 0 20px 0 0px;
  padding: 10px 0 10px 30px;
  text-align: left;
}
#footercontact {
  width: 240px;
  float:left;
  margin: 0 0px 0 5px;
  padding: 6px 0 8px 0px;
  text-align: center;
}


.clearboth {
   clear:both;
}
.clearright {
   clear:right;
}
.clearleft {
   clear:left;
}
div#title_area {
   top: 0;
   left: 0;
   width:100%;
}
div#title_area h1  {
   position: absolute;
   top: 10px;
   left: 41%;   
   line-height:100%;
   font-family: 'Chewy', sans-serif;
   font-size: 80px;
   color: #538135;
  
}
div#title_area h2 {
   width:100%;
   position: absolute;
   top: 68px;
   left: 48%;   
   font-family: 'Trebuchet MS', sans-serif;
   font-size: 31px;
   color: #C00000;
}
.img_inset, .img_inset_l, .img_inset_r {
   border: 4px solid #548235;
   border-radius: 4px;
}
.img_inset {
   max-width:99%;
}
div.center-reviews .img_inset_l, div.center-reviews .img_inset_r {
   border: none;
}
.img_inset_triad {   
   margin: 0 10px;
}

.floatright {
   float: right;
   margin: 10px 0 10px 10px;
}
.floatleft {
   float: left;
  margin: 10px 10px 10px 0;

}

.highlight {
   color: #008000;
}

div.center-home p {
 text-align: center;  
}
ul.dashed {
   list-style-type:" - "
}
td {vertical-align: top;}
span.highlight {   font-family: 'Chewy', sans-serif; }
strong {   font-family: 'Chewy', sans-serif; font-weight: normal; font-size:110%;}

div#home-rudy #panel1 {
    border: 4px solid #FFC000;
    border-top-left-radius: 4px; 
    border-bottom-left-radius: 4px; 
    float:left;
    width: 360px;
    height: auto;
}
div#home-rudy #panel2 {
    border: 4px solid #FFC000;
    border-top-right-radius: 4px; 
    border-bottom-right-radius: 4px; 
    height:274px; 
    width:360px; 
    font-size:80%; 
    float:left;
}
div#home-rudy #panel1 img {
   max-width: 102%;
   border: none;
}
   
@media only screen 
and (max-width : 400px) {

   div#mainframe {
     width: 380px;
     background-color: #cedfd9;
     background-image: none;
     padding: 0;
   }

   div#title_area h1 {
      font-size: 34px;
      left: 23%;
   }
 
   div#title_area h2 {
      top: 29px;
      left: 32%;   
      font-size: 18px;
   }

   nav#navmenu {
     width:100%;
     clear: both;
     float:none;
     display: block;
     border-bottom: 5px solid #008000;
     font-size:160%;
     margin: 10px 0 0px 0px;
   }
   
  
   nav#navmenu ul {
     padding: 0 0 0 5px;
   }
   nav#navmenu ul li {
      display: inline-block;
      width: 80%;
   }
   
   #contact_tel div {
      margin: 0 10px;
   }    
   #center_col {
     width:90%;
     border-left: none;
     margin: 0; 
     padding: 0 10px;
   }
   #center_col .img_inset_l, #center_col .img_inset_r  {
     max-width: 280px;
     overflow:hidden;
   }

 
}

@media only screen 
and (min-width : 401px) 
and (max-width : 640px) {

   div#mainframe {
     width: 400px;
     background-color: #cedfd9;
     background-image: none;
     padding: 0;
   }
   
   div#title_area h1 {
      font-size: 40px;
      left: 30%;
   }
   div#title_area h2 {
      font-size: 16px;
      left:35%;
      top: 32px;
   }
   
   nav#navmenu {
     clear: both;
     float:none;
     display: block;
     border-bottom: 5px solid #008000;
     padding-bottom: 10px;
     font-size:120%;
   }
   
  
   nav#navmenu ul {
     padding: 0 0 0 5px;
   }
   nav#navmenu ul li {
      display: inline-block;
      width: 52%;
   }
   
   #contact_tel div {
      margin: 0 10px;
   }    
   #center_col {
     width:90%;
     border-left: none;
     margin: 0; 
     padding: 0 10px;
   }
  
}

@media only screen 
and (min-width : 641px) 
and (max-width : 900px) {

   div#mainframe {
     width: 640px;
     background-color: #cedfd9;
     background-image: none;
     padding: 0;
   }
   

   

   div#title_area h1 {
      font-size: 58px;
      left: 30%;
   }
   div#title_area h2 {
      font-size: 22px;
      left:37%;
      top: 47px;
   }

   nav#navmenu {
     clear: both;
     float:none;
     display: block;
     border-bottom: 5px solid #008000;
     padding-bottom: 10px;
     font-size:160%;
   }
   
  
   nav#navmenu ul {
     padding: 0 0 0 15px;
   }
   nav#navmenu ul::after {
      clear:both;
   }
   nav#navmenu ul li {
      display: inline-block;
      width: 40%;
   }
   
   #contact_tel div {
      margin: 0 20px;
   }    
   #center_col {
     width:90%;
     border-left: none;
     margin: 0; 
   }
  
}

@media only screen 
and (min-width : 641px) {
  .img_inset_r {
      float: right;
      margin: 15px 0 5px 20px;
   }
  .img_inset_l {
      float: left;
       margin: 15px 20px 5px 0;
   }

}
@media only screen 
and (max-width : 640px) {
  .img_inset_r,   .img_inset_l  {
     display: block;
     margin: 0 auto 10px auto;
     max-width: 100%;
     float: none;
   }

   nav#navmenu li {
      padding: 2px 15px;
   }

}

@media only screen 
and (max-width : 760px) {
  div#home-rudy #panel1, div#home-rudy #panel1 img {
      max-width: 100%; 
      padding: 0;
      margin: 0;
   }
   div#home-rudy #panel2 {
      height:auto; 
      max-width: 100%;
   }
   
}