@import url(http://fonts.googleapis.com/css?family=Lato:400,100,300);
 
       
html, body, div, span, applet, object, iframe, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,  del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,  b, u, i, center,  dl, dt, dd, 
fieldset, form, label, legend,  table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;	padding: 0;	outline: 0;	font-size: 100%; 	background: transparent;	font-weight:normal;
}  
html, form  {     /*  height:90%; */     height: 100%;}
body  {     min-height:100%;}
body        
{  
	height:100%;
	width:100%;
	margin: 0;  
    font-family: 'Lato', sans-serif;
    font-weight: 100;
	font-size:100%;    
    color : #000000;
    line-height: 1.3em;	
}    
/** Common
==============================================================================*/
h1 { font-size: 3em; }
h2 { font-size: 1.4em; margin:0px 0px .5em 0px;}
h3 { font-size: 2em; }
h4 { font-size: 1.5em; }
h5 { font-size: 1.3em; }
h6 { font-size: 1em; }
p{ margin: 15px 0px ;  }
strong{    font-weight:bold;}.clear {	clear: both;}.left {	float: left;  }.right {	float: right;  }   
.center {display:block;	margin:0px auto;  }  
.clearfix {    clear:both;    height:0;    font-size:1px;    line-height:1px;    width:100%;    overflow:hidden;}           
.wrapper {   width:100%;height:100%;margin:0px auto;    }


/***********************************
MAIN
************************************/  

        .main-left, .footer-left
        {
            float:left;
            width:66%;
            height:100%;
            position:relative;   
        }
        .main-right, .footer-right
        {
            FLOAT:left;
            width:34%;height:100%;
            position:relative;    
        }       
        .main 
        {
            background:#f2f2f2;     
            position:relative;  
            
            min-height:90%;
            
            height:auto;
            width: 100%;
            display: table;
        }    
        .main-left  
        {
            float:none;   display: table-cell;vertical-align:top; 
            min-height:100%;height:auto; 
            background: none repeat scroll 0 0 #ddd;
        }   
        .main-right 
        {
            float:none;  display: table-cell;vertical-align:top;
             
            min-height:100%;  height: auto; 
            background:#f2f2f2;
        } 
        .main-right ul,  .main-right ul li
        {
             list-style-type: square;
        }
       
        .page-template-content-projects-php  .main,
        .page-template-content-bios-php  .main 
        {
             min-height:  auto ;    height: auto; 
        } 
         .page-template-content-projects-php   .main-left,
         .page-template-content-bios-php   .main-left
        {
             height: auto; 
        }    
         .page-template-content-projects-php   .main-right,
         .page-template-content-bios-php   .main-right,
         .page-template-content-bios-php .container-top
        {
              min-height:  80%; 
        }        
        
        .page-home h2 {line-height:1.1em; font-size:1.4em; width:100%; text-align:justify;}
/***********************************
BUTTONS
************************************/  
 
    .RightBottom a  {     color:#000; text-decoration:underline; }
    .RightBottom { text-transform:uppercase; font-size:.8em; line-height:1em;  color:#000;    
                   margin: 1% 3% 20px 3%;  
                   }   
    
/*
red: #B12D1B
grn: #4E8635
ble: #4D91CD
*/
    .text-red{color:#B12D1B;}
    .text-green{color:#4E8635;}
    .text-blue{color:#4D91CD;}

    .button-red{background:#B12D1B;}
    .button-green{background:#4E8635;}
    .button-blue{background:#4D91CD;}
    
    .button-full:after{ content:" > "}
    .button-full:hover , .control a:hover
    {        
        -webkit-transition: background-color 1000ms linear;
        -moz-transition: background-color 1000ms linear;
        -o-transition: background-color 1000ms linear;
        -ms-transition: background-color 1000ms linear;
        transition: background-color 1000ms linear;
        background:#222 !important;color:#fff;
    }    
    a.button-full, .control a
    {
            text-align:center;  padding:15px 0px 0px 0px;
            height:40px;background:#b12d1b;
            width: 94% ;   
            display:block;
            color:#fff; 
            text-decoration:none;
            margin:0px auto;        
    }

    .page-home .button_label a { background:#B12D1B; }
    .page-home .button2_label a { background:#4D91CD;  } 
    .page-projects .button_label a { background:#4D91CD;  }   
    .page-about .button_label a { background:#B12D1B;  }    
    .page-staff .button_label a { background:#4D91CD;  }   
    
    .button_contact a {background:#4E8635;}   
     
    
/***********************************
FOOTER
************************************/  
        .footer-container
        {
            clear:both;
            display:flex;  
            position:relative;    
            padding-bottom: 32px;          
        } 
        .footer { 
            position:relative; 
            height:24px;           
        } 
        .pnumbers a{ color:#000; text-decoration:none; }
        .footer-left, .footer-right   {
            margin-top:5px; 
            font-size:11px;
            text-transform:uppercase;
            letter-spacing:0em; 
        } 
        .footer-right   {   width:30%;   text-align:right;   } 
        .footer-left  {   padding-left:1%;   } 
        
        .social-table     {   width:90%; float:right;  padding-bottom:5%;   }   
        .social-table td     {  text-align:center;  } 
        .social{ width:30px; }            
               
        .s-rss  {  float:left; margin-left:8px; }
        .s-twitter   {   }
        .s-facebook   {  float:right;  margin-right:8px;   }           
/***********************************
container-table
************************************/    
        .container-table-right  {
            border-collapse: collapse; 
            height:100%;width:100%;  position:relative;  
        }  
        .container-table-right{height:auto;}
        .container-bottom {  margin:0px auto;color:#fff; }
 
        .container-top  {
           height:25%;width:100%; 
           vertical-align: top;
           font-size:.8em;
           background:#f2f2f2;
           padding:3% 3% 20px 3%; 
        }   
        .rslides_nav  {  width:50% !important;            float:left  !important;           }
        .control .prev  {  width:49% !important;            float:left  !important;           }
        .control .next  {  width:49% !important;            float:right  !important;           }   
        .control .prev:before{ content:" < "}  
        .control .next:after{ content:" > "}  
        .control {
            margin: 0 auto;
            width: 95%;
        }     
   
 /***********************************
container-top
************************************/     
        .page-contact .container-bottom, .page-about  .container-bottom {
            padding-bottom: 15em;  
        }     
       
/***********************************
PROJECT
************************************/      
        .projects {overflow:hidden; } 
        .project {   
            cursor:pointer;
            margin:1%;
            width: 30.6%;  
            height:200px;
            overflow: hidden;
            float: left;
            position: relative;
        }
       .project  {  background-position: center center;   }
       .project:nth-child(n+7) {   margin-bottom:2%;         }   
       .project:nth-child(-n+3) {     margin-top:2%;         }   
       .project:nth-child(3n+1) {  margin-left:2%;         }       
   
        
        .project h2 
        {
            text-shadow: 0px 0px 5px rgba(0, 0, 0, 1);
            font-size:1.5em;height:auto; line-height:200px; text-transform:uppercase;letter-spacing:-1px;
            width:100%;text-align:center;color:#fff; 
            background:rgba(0,0,0,.0);
            text-decoration:none;margin:0px;   
             -webkit-transition: all 1s ease-in-out;
            -moz-transition: all 1s ease-in-out;
            -o-transition: all 1s ease-in-out;
            transition: all 1s ease-in-out;
        }
        .project  h2:hover    {  background:rgba(0,0,0,.8);   }
        .project  a     {    text-decoration:none;    }      
        .project-desc{   margin:5px; color:#fff;  }
        .project-title { float:left;  width:33%;  }
        .project-detail {   float:right;  width:60%;font-size: 0.8em;    }    
        
/***********************************
STAFF
************************************/     
        .bio-container{display: table; font-size: 0.8em; height: 55em; }
        .bio-thumb
        {
            display: table-cell;vertical-align:top; height:100%; width:50%;
            position:relative;background-position:top center;background-size:cover;
        }
        .bio-desc
        {
            display: table-cell;vertical-align:top;  width:50%;position:relative;
            background: none repeat scroll 0 0 #ddd; 
        }        
        .bio-desc-inner
        {
            margin:0em 5% 0% 5%; width:90%; 
            border-top:1px solid #000;  height: 97.7%; vertical-align:top;  position:relative; 
        }    
        .bio-desc-0 .bio-desc-inner   {  border-top:0px solid #000;  }         
/***********************************
header
************************************/   

        /***********************************
        LOGO
        ************************************/  
        .logo    { FLOAT:left;  width:66%;  height:auto;  position:relative;  }
        .header-logo{ margin:2% 0px 1% 2%; width:250px; }
        
        /***********************************
        NAV
        ************************************/   
        
        .nav   { FLOAT:left; width:34%;height:100%; position:relative;       }  
        .nav   { height:60px; position:relative;  }
        .nav ul   {   margin:1em 0px;padding:0px;  position:relative;    margin-top:1.3em;  }
        .nav a:hover, .sel    {  background:#f2f2f2;  }   
        .nav li
        {
            display:block;
            text-align:center;
            float:left;  
            width:33.3%; 
            list-style-type :none; 
            position:relative;     
        }          
        .nav   a
        {
            height: 100%;
           display:block;
            text-align:center;
            float:left;  
            width:33.3%; 
            position:relative; 
            padding:52px 0px 46px 0px;
            color:#000;
            text-decoration:none;   
        }      

         
    
 
               
@media (max-width: 1000px) 
{ 
      .page-contact .container-bottom, .page-about  .container-bottom {
            padding-bottom: 1em;  
      }  
      .bio-container
      {  
        display:flex;  
        display:-webkit-flex;
        position:relative;     
        -webkit-flex-flow: column;
        flex-flow: column;
        flex-direction:column; 
      }   
     .bio-thumb, .bio-desc{ padding:1em 0px; width:100%; float:left;   display: block; min-height:200px;}
     .nav   a   {   padding:32px 0px 32px 0px;    }   
     .nav   { height:100px; } 
     .footer-sep{display:none}
     .footer-block{display:block; text-align:center; letter-spacing:0px;}
     .social-table {    padding-bottom: 0%;   }     
}                 
 
          
@media (max-width: 800px) 
{ 
   .logo {
        text-align:center;
    }  
    .header-logo{ margin:0px;width:95%; }
    .project
    {  
        width: 100%;
        padding:0px;
        margin:15px  0px !important;
        height:200px;
        overflow: hidden;  
    }   
    .social-table     {   width:100%;    }   
    .social-table td     {  text-align:center;  }       
    .logo, .main-left,  .footer-left { 
        width: 100%;
    } 
    .nav, .main-right, .footer-right { 
        width: 100%;
    }
    .footer
    { 
        display:block;
        position:relative;
        float: none;
        clear:both;
        width: 100%;       
    }
    .footer-container
    { 
        display:flex;  
        display:-webkit-flex;
        clear:both;
        width: 100%;     
        -webkit-flex-flow: column;
        flex-flow: column;
        flex-direction:column; 
    }     
    .footer-left
    {
        padding:15px 0px;
        -moz-box-ordinal-group: 2; -webkit-box-ordinal-group: 2;  -ms-flex-order: 2; -webkit-order: 2; order: 2;
    }
    .footer-right
    {
        padding:15px 0px;
        -moz-box-ordinal-group: 1;-webkit-box-ordinal-group: 1;-ms-flex-order: 1;-webkit-order: 1;  order: 1;
    }   
    .footer-right   {     text-align:right;    } 
    
    .address, .pnumbers{ display:block;width:100%; text-align:center;} 
   
    .address-label{display:none;}
    
   .main{ display: block; min-height:150px;} 
  
  .main , .page-template-content-project-php  .main
  , .page-template-content-projects-php  .main
  {  
        display:flex;  
        display:-webkit-flex;
        position:relative;     
        -webkit-flex-flow: column;
        flex-flow: column;
        flex-direction:column; 
  }  
   
  .main-left, .main-right{float:left;   display: block; min-height:200px;}
  
  .page-template-content-project-php .main-left .rslides,
  .page-template-content-project-php .main-left .rslides li,
  .page-template-content-project-php .main-left .rslides img
  { 
      height:230px; 
  }
  
  .main-left, .page-template-content-project-php .main-left
  , .page-template-content-projects-php .main-left
  { 
    min-height:15em;
    height: auto; 
    -moz-box-ordinal-group: 2 ;    -webkit-box-ordinal-group: 2  ;    -ms-flex-order: 2  ;    -webkit-order: 2 ;    order: 2 ;
  }
  .main-right
  , .page-template-content-project-php .main-right
  , .page-template-content-projects-php .main-right
  { 
     
    -moz-box-ordinal-group: 1;    -webkit-box-ordinal-group: 1;    -ms-flex-order: 1;    -webkit-order: 1;    order: 1;
  }   
  .page-template-content-project-php .footer-container
  {
    clear:both; 
  }  
  .bio-container{display: block; min-height:150px;}
  .bio-desc{ padding:5px 0px; margin:25px 0px; height:auto; clear:both;   }
  .bio-thumb{ padding:5px 0px; clear:both;   }

  
}