/* THIS WEBSITE CREATED JANUARY 2019 BY WWW.WALTWARNER.COM */

/* ------------------------------------------------------ 
 R E S E T                                                                
------------------------------------------------------- */
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;}



/* ------------------------------------------------------ 
SMARTPHONE - PORTRAIT                                                   
------------------------------------------------------- */
@media only screen and (max-width: 768px) {
  .header {
   overflow: hidden;
   background-color: rgb(30,30,30);
   padding: 28px 0px 28px 0px;
   /*width:100%;*/
   text-align: center;
   }
  img#logo-ww {
   max-width: 80%;
   height: auto;
   }
  body {
   font-size:1.0rem; 
   line-height:1.35em;
   color:rgb(120,120,120); 
   background-color: rgba(255,255,255,1.0);
   }
  .grid-container { 
   display: inline-grid;
   grid-template-columns: auto;   
   padding: 5% 10% 10% 10%;
   }
  .grid-box {
   padding: 10px 10px 10px 10px;
   }
  img#headshot {
   max-width: 100%;
   height: auto;
   margin: 0% 0% 0% 0%;
   }
}


/* ------------------------------------------------------ 
SMARTPHONE - LANDSCAPE                                                   
------------------------------------------------------- */
/*@media only screen and (min-device-width: 321px) {
}*/


/* ------------------------------------------------------ 
TABLET - PORTRAIT                                                   
------------------------------------------------------- */
@media only screen and (min-width: 769px) and (max-width: 1024px) {
  .header {
   overflow: hidden;
   background-color: rgb(30,30,30);
   padding: 30px 0px 30px 0px;
   /*width:100%;*/
   text-align: center;
   }
  img#logo-ww {
   height: 60px;
   }
  body {
   font-size:1.0rem; 
   line-height:1.35em;
   color:rgb(120,120,120); 
   background-color: rgba(255,255,255,1.0);
   }
  .grid-container { 
   display: inline-grid;
   grid-template-columns: auto auto;   
   padding: 5% 10% 10% 10%;
   }
  .grid-box {
   padding: 10px 10px 10px 10px;
   }
  img#headshot {
   max-width: 100%;
   height: auto;
   margin: 0% 0% 0% 0%;
   }
}
 

/* ------------------------------------------------------ 
TABLET - LANDSCAPE                                                   
------------------------------------------------------- */
/*@media only screen and (min-width: 769px) and (max-width: 1024px) and (orientation: landscape) {
  
}*/


/* ------------------------------------------------------ 
DESKTOP DISPLAY                                                   
------------------------------------------------------- */
@media only screen and (min-width: 1025px) and (max-width: 1400px){
  .header {
   overflow: hidden;
   background-color: rgb(30,30,30);
   padding: 30px 0px 30px 0px;
   /*width:100%;*/
   text-align: center;
   }
  img#logo-ww {
   height: 60px;
   }
  body {
   font-size:1.0rem; 
   line-height:1.4em; /*was:1.35em*/
   color:rgb(120,120,120); 
   background-color: rgb(255,255,255);
   }
  .grid-container { 
   display: inline-grid;
   grid-template-columns: auto auto;   
   padding: 2% 15% 2% 15%;
   }
  .grid-box {
   padding: 5px 10px 5px 10px;
   }
  img#headshot {
   max-width: 100%;
   height: auto;
   margin: 0% 0% 0% 0%;
   }
}

@media only screen and (min-width: 1401px){
  .header {
   overflow: hidden;
   background-color: rgb(30,30,30);
   padding: 30px 0px 30px 0px;
   /*width:100%;*/
   text-align: center;
   }
  img#logo-ww {
   height: 60px;
   }
  body {
   font-size:1.0rem; 
   line-height:1.35em;
   color:rgb(120,120,120); 
   background-color: rgb(255,255,255); /* was:240,240,240,1.0 */
   }
  .grid-container { 
   display: inline-grid;
   grid-template-columns: auto auto;   
   padding: 2% 25% 2% 25%;
   }
  .grid-box {
   padding: 5px 10px 5px 10px;
   }
  img#headshot {
   max-width: 100%;
   height: auto;
   margin: 0% 0% 0% 0%;
   }
}


/* ------------------------------------------------------ 
Styles:  G L O B A L                                                   
------------------------------------------------------- */

body {font-family:arial,helvetica,sans-serif;}
p {margin-bottom:1.0em;}

.clearfix {clear: both;}