html { background: #d4e0ec url(/theme/img/tile.png) repeat-x center top; }

body { 
   background: url(/theme/img/tile-curves.png) no-repeat center top; 
   text-align: center; }
 
.wrap {
   width: 980px;
   position: relative; } 

 
/* Site Header
------------------------------------ */
 
header {
    width: 1200px;   
    height: 146px;
    position: relative; 
    }
    
    @media (max-width : 1200px) { header { width: 960px; } }

#logo {
    /* width: 391px; ---original logo size */
    width: 332px;
    height: 106px;
    display: block;
    opacity: .8;
    position: absolute; 
    left: 20px;
    top: 25px;
    -webkit-transition: opacity .3s ease-in-out;
    -moz-transition:    opacity .3s ease-in-out;
    -o-transition:      opacity .3s ease-in-out;
    -ms-transition:     opacity .3s ease-in-out;
    transition:         opacity .3s ease-in-out; 
    }
    
    @media (max-width : 1200px) { #logo { left: 0; } }    

#logo:hover { opacity: 1; }
#logo:active { opacity: .9; }




 /* Content
------------------------------------ */

#body { 
    width: 1200px;
    background: white url(/theme/img/content.png) repeat-y left top;
    text-align: left; 
    }
    
    @media (max-width : 1200px) { 
        #body {
            width: 960px; 
            background-position: -160px top;
            } }
       
#content, #options { 
    float: left; 
    position: relative;
    } 
   
#content {
    width: 760px;
    padding: 20px;
    } 
   
    @media (max-width : 1200px) { #content { width: 600px;} }
   
    #home #content {
        width: 800px;
        padding: 0;
        } 
       
        @media (max-width : 1200px) { #home #content { width: 640px; } }

#options { width: 400px; } 

    @media (max-width : 1200px) { #options { width: 320px;} }

    
.wide #body { background-image: none; }

.wide #content {
    width: 1160px;
    float: none;
    padding: 20px; 
    }      
        
    @media (max-width : 1200px) { .wide #content { width: 920px;} }





 /* Section ID
------------------------------------ */

#id {
    width: 1200px;   
    height: 50px;
    position: relative; 
    text-align: left;
    background: #626776;
    }
    
    @media (max-width : 1200px) { #id { width: 960px; } }

    .work #id                   { background: #7fa548; }
    .initiatives-and-issues #id { background: #3369a4; }
    .about #id                  { background: #674b96; }
    .news #id                   { background: #1a226c; }
    .blog #id                   { background: #c36600; }
    .resources #id              { background: #bf2e1a; }  
    .sbirt #id                  { background: #7fa548; }  
     
#id a { display: block; }

#id .first-parent,
#id .second-parent {
    margin: 0 auto;
    display: inline-block;
    float: left;
    font-size: 27px;
    font-family: "nimbus-sans",sans-serif;
    line-height: 1; 
    font-weight: 300; 
    padding: 11px 0 0 13px;
    }
    
    #id.breadcrumb .first-parent { background: url('/theme/img/breadcrumb-arrow-blue.png') no-repeat right 16px; }
    
    #id .second-parent { padding: 11px 0 0 6px; }
   
    #id .first-parent,
    #id .second-parent { 
        color: rgba(255, 255, 255, .8);
        -webkit-transition: all .25s ease-in-out;  
        -moz-transition: all .25s ease-in-out;  
        -o-transition: all .25s ease-in-out;  
        -ms-transition: all .25s ease-in-out; 
        transition: all .25s ease-in-out;  
        }
   
    #id .first-parent:hover,
    #id .second-parent:hover { color: rgba(255, 255, 255, 1); }
    
    #id .first-parent:active,
    #id .second-parent:active { color: rgba(255, 255, 255, .6); }
       
#id.breadcrumb .first-parent { 
    padding-right: 25px;
    margin-right: 5px;
    }
    
    .about #id.breadcrumb .first-parent { background: url('/theme/img/breadcrumb-arrow-purple.png') no-repeat right 16px; }
    .work #id.breadcrumb .first-parent { background: url('/theme/img/breadcrumb-arrow-green.png') no-repeat right 16px; }
          
   /* .initiatives-and-issues #id.breadcrumb .first-parent,
    .news #id.breadcrumb .first-parent { background: url('/theme/img/breadcrumb-arrow-blue.png') no-repeat right 16px; } */
    
    .blog #id.breadcrumb .first-parent { background: url('/theme/img/breadcrumb-arrow-orange.png') no-repeat right 16px; }
    .resources #id.breadcrumb .first-parent { background: url('/theme/img/breadcrumb-arrow-red.png') no-repeat right 16px; }
    .sbirt #id.breadcrumb .first-parent { background: url('/theme/img/breadcrumb-arrow-green.png') no-repeat right 16px; }

    .about #id.breadcrumb .first-parent         { color: rgba(196, 180, 222, .8); }
    .about #id.breadcrumb .first-parent:hover   { color: rgba(196, 180, 222, 1); }
    .about #id.breadcrumb .first-parent:active  { color: rgba(196, 180, 222, .6); }
    
    .work #id.breadcrumb .first-parent         { color: rgba(192, 224, 144, .8); }
    .work #id.breadcrumb .first-parent:hover   { color: rgba(192, 224, 144, 1); }
    .work #id.breadcrumb .first-parent:active  { color: rgba(192, 224, 144,.6); }
    
    .initiatives-and-issues #id.breadcrumb .first-parent         { color: rgba(153, 200, 255, .8); }
    .initiatives-and-issues #id.breadcrumb .first-parent:hover   { color: rgba(153, 200, 255, 1); }
    .initiatives-and-issues #id.breadcrumb .first-parent:active  { color: rgba(153, 200, 255, .6); }
    
    .blog #id.breadcrumb .first-parent         { color: rgba(247, 187, 135, .8); }
    .blog #id.breadcrumb .first-parent:hover   { color: rgba(247, 187, 135, 1); }
    .blog #id.breadcrumb .first-parent:active  { color: rgba(247, 187, 135, .6); }
    
    .news #id.breadcrumb .first-parent         { color: rgba(161, 202, 252, .8); }
    .news #id.breadcrumb .first-parent:hover   { color: rgba(161, 202, 252, 1); }
    .news #id.breadcrumb .first-parent:active  { color: rgba(161, 202, 252, .6); }
    
    .resources #id.breadcrumb .first-parent         { color: rgba(236, 167, 157, .8); }
    .resources #id.breadcrumb .first-parent:hover   { color: rgba(236, 167, 157, 1); }
    .resources #id.breadcrumb .first-parent:active  { color: rgba(236, 167, 157, .6); }
          
    .sbirt #id.breadcrumb .first-parent         { color: rgba(255,255,255, .5); }
    .sbirt #id.breadcrumb .first-parent:hover   { color: rgba(255,255,255, 1); }
    .sbirt #id.breadcrumb .first-parent:active  { color: rgba(255,255,255, .6); }
    
.ie8 #id a { color: #fff !important; }
.ie8 #id a:hover { color: #e6edf4 !important; }


/* Section ID
------------------------------------ */

#breadcrumbs {
    position: relative; 
    text-align: left;
    padding-bottom: 4px;
    }


#breadcrumbs a { display: block; }

#breadcrumbs a {
    margin: 0 auto;
    display: inline-block;
    float: left;
    font-size: 11px;
    text-transform: uppercase;
    line-height: 1; 
    }
    
    #breadcrumbs .chevron { margin-right: 5px; }
    #breadcrumbs .chevron:after { content: ' » '; }
       
    #breadcrumbs a { 
        color: #89acca;
        -webkit-transition: all .25s ease-in-out;  
        -moz-transition: all .25s ease-in-out;  
        -o-transition: all .25s ease-in-out;  
        -ms-transition: all .25s ease-in-out; 
        transition: all .25s ease-in-out;  
        }
   
    #breadcrumbs a:hover { color: #aacdeb; }
    
    #breadcrumbs a:active { color: #bbd1e4; }
       
#breadcrumbs a:first-child { 
    margin: 0 6px 0 0;
    }
    

/* Subsection branding layer
------------------------------------ */

#subid {
    width: 1200px;   
    height: auto;
    position: relative; 
    text-align: center;
    background: #626776;
    }
    
    @media (max-width : 1200px) { #subid { width: 960px; } }

#subid a { 
	display: block; 
	color: white;
	padding: 1.25em;
	font-size: 150%;
	text-transform: uppercase;
	}

#subid.grassroots { background: #2f3f86; }


/* options blocks attributes
------------------------------------ */


.box {
    padding: 20px;
    margin: auto;
    position: relative;
    background: #e0e9f3;   
    border-bottom: 5px solid #c0d1e2; 
    }  
        
    .box a { 
        color: #4f6883;
        opacity: .9;
        -webkit-transition: all .25s ease-in-out;  
        -moz-transition: all .25s ease-in-out;  
        -o-transition: all .25s ease-in-out;  
        -ms-transition: all .25s ease-in-out; 
        transition: all .25s ease-in-out;  
        }
        
        .box a:hover { opacity: 1; }
        .box a:active { opacity: .5; }
        
    .box small { 
        font-size: 12px;
        line-height: 1.5;
        text-transform: uppercase;
        }
        
    .box h2.title { 
      color: #4f6883;
      text-transform: uppercase;
      font-size: 15px;
      line-height: 1;
      opacity: .85;
      font-weight: 700;
      }
      
      .box.blue h2.title,
      .box.green h2.title ,
      .box.orange h2.title ,
      .box.purple h2.title { color: white; }
        
      .box a:hover h2.title { opacity: 1;}
      .box a:hover h2.title:after { content: " »" }
      
        
        
    .box h3 { 
        color: white;
        font-size: 24px;
        line-height: 1;
        font-weight: 300;
        margin-bottom: 0;
        }
              
    .box p:last-child { margin-bottom: 0;  }
    
    .box .more { color: white; }
    
    .box a h3:hover,
    .box a .more:hover,
    .box article a:hover { text-decoration: underline; }
    
    
    .box iframe { 
        width: 360px;
        height: 260px;
        background: white;
        margin-bottom: 10px;
        } 

        @media (max-width : 1200px) { .box iframe  { width: 280px; height: 210px} }
     
    
.blue {
    background: #4f8acb;   
    border-bottom: 5px solid #3369a4;
    color: #cbddf0;
    }  
    
.green {
    background: #7fa548;   
    border-bottom: 5px solid #40640d;
    color: #f1ffdd;
    }  
    
.orange {
    background: #d06d01;   
    border-bottom: 5px solid #9b5100;
    color: #f9d9b4;
    } 
    
    .orange a small,
    .orange a p { color: #f9d9b4; }  
    
.purple {
    background: #674b96;   
    border-bottom: 5px solid #472b76;
    color: #d0c5e3;
    } 
    
    .purple small { color: #d0c5e3; }  
    
    
.blue article a,
.green article a,
.orange article a,
.purple article a {
    color: #FFFFFF;
    }
    
    
    
    




/* Site Footer
------------------------------------ */

footer {
    background: #6e738c;
    width: 1160px;
    padding: 20px;
    color: #d8dae0; 
    margin-bottom: 50px;
    position: relative;
    text-align: left;
    }
    
    @media (max-width : 1200px) { footer { width: 920px;} }
    
footer a { 
    color: #d8dae0; 
    -webkit-transition: opacity .3s ease-in-out;
    -moz-transition: opacity .3s ease-in-out;
    -o-transition:   opacity .3s ease-in-out;
    -ms-transition:  opacity .3s ease-in-out;
    transition:      opacity .3s ease-in-out; 
    }

footer a:focus,
footer a:hover { color: #e8eaf0; }
      
 
footer .fnav { 
    font-size: 10px;
    text-transform: uppercase;
    margin-bottom: 8px;
    }  
 
footer .links { 
    font-size: 11px;
    margin: 0;
    }   
   
footer .map {
    width: 350px;
    height: 54px;
    padding: 15px 25px; 
    display: block;
    background: #5e627b;
    position: absolute;
    top: 0;
    right: 0;
    }        
   
    @media (max-width : 1200px) { footer .map { width: 270px;} }
    

footer .map img { 
    float: left; 
    margin-right: 10px;
    opacity: .5;
    -webkit-transition: opacity .3s ease-in-out;
    -moz-transition: opacity .3s ease-in-out;
    -o-transition:   opacity .3s ease-in-out;
    -ms-transition:  opacity .3s ease-in-out;
    transition:      opacity .3s ease-in-out; 
    }
    
    footer .map:hover img { opacity: 1; }
    
    @media (max-width : 1200px) { footer .map img { width: 50px; margin-top: 12px; } }
    
footer .map  h2.title { 
    color: white;
    text-transform: uppercase;
    font-size: 14.5px;
    line-height: 1;
    opacity: .85;
    font-weight: 700;
    margin: 10px 0 0 0;
    }
      
    footer .map:hover h2.title { opacity: 1;}
    footer .map:hover h2.title:after { content: " »" }
    
    @media (max-width : 1200px) { footer .map  h2.title  { margin-top: 3px; } }
    
  
.credit {
    font-size: 11px;
    margin: auto;
    padding: 15px;
    display: block; 
    }   
   
   
/* MAP WINDOW */  
    
    
.window { 
    background-color: #fff; 
    width: 740px;
    padding: 30px;
    -moz-box-shadow: 0 0 35px #000;
    -webkit-box-shadow: 0 0 35px #000;
    box-shadow: 0 0 35px #000;
    position: fixed;
    left: 50%;
    top: 15%;
    z-index: 3;
    margin-left: -400px;
    text-align: left;
    font-size: 20px;
    line-height: 26px;
    color: #414f61; 
    border-radius: 4px;
    -moz-border-radius: 4px; 
    -webkit-border-radius: 4px;  
    display:none;
    z-index: 1001;
    }

.window .close-x {
    opacity: 1;
    background: #cdcdcd url(/theme/img/lightbox-close.png) no-repeat center center; 
    width: 40px;
    background-size: 50px 50px;
    height: 40px;
    cursor: pointer;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    border-radius: 20px;  
    position: absolute;
    top: -20px;
    right: -20px;
    -webkit-transition: background-color .3s ease-in-out;
    -moz-transition: background-color .3s ease-in-out;
    -o-transition: background-color .3s ease-in-out;
    -ms-transition: background-color .3s ease-in-out;
    transition: background-color .3s ease-in-out; 
    }  
    
    .window .close-x:hover { background-color: #b2b2b2; }
    
    .window .close-x:active { 
        -moz-box-shadow: inset 1px 1px 2px rgba(0, 0, 0, .25);
        -webkit-box-shadow: inset 1px 1px 2px rgba(0, 0, 0, .25);
        box-shadow: inset 1px 1px 2px rgba(0, 0, 0, .25); 
        }

.shadow {
    width: 100%;
    position: fixed;
    z-index: 1000;
    background: #000;
    height: 100%;
    top: 0;
    opacity: 0.4;
    display:none;
    }


.window h4 { 
    font-size: 32px;
    margin-bottom: 0;
    }
   
.window p { 
    font-size: 17px;
    }
 
.window select,
.state-select { 
    background: none repeat scroll 0 0 #E9EFF5;
    border: medium none;
    padding: 8px;
    position: absolute;
    top: 45px;
    right: 45px;
    width: 240px;
    }
  



/* Error INPUT Styling
--------------------------------------------------- */

input.error { 
   box-shadow: inset 1.5px 1.5px 2.5px rgba(0, 0, 0, 0.25);       
      -moz-box-shadow: inset 1.5px 1.5px 2.5px rgba(0, 0, 0, 0.25);
   	-webkit-box-shadow: inset 1.5px 1.5px 2.5px rgba(0, 0, 0, 0.25); }

input.error:hover { 
   box-shadow: inset 1.5px 1.5px 2.5px rgba(0, 0, 0, 0.35);       
      -moz-box-shadow: inset 1.5px 1.5px 2.5px rgba(0, 0, 0, 0.35);
   	-webkit-box-shadow: inset 1.5px 1.5px 2.5px rgba(0, 0, 0, 0.35); }
      
input.error:active { 
   box-shadow: inset 1.5px 1.5px 2.5px rgba(0, 0, 0, 0.45);       
      -moz-box-shadow: inset 1.5px 1.5px 2.5px rgba(0, 0, 0, 0.45);
      -webkit-box-shadow: inset 1.5px 1.5px 2.5px rgba(0, 0, 0, 0.45); }     
   
   
/* Error LABEL Styling
--------------------------------------------------- */

form label { position: relative; }

strong.error { 
   background: #eb6e1f;
   padding: 3px 5px;   
   display: block;
   white-space: nowrap;
   position: absolute; 
   left: 50%;
   top: 23px;
   z-index: 9999;
   -moz-border-radius:       4px;
      -webkit-border-radius: 4px;
      border-radius:         4px; 
      font-size: 10px;
      line-height: 10px;
      font-weight: 400;
      color: #fff; 
      text-transform: uppercase; } 
strong.error:after { 
   height: 0; 
   width: 0;    
   margin-left: -6px;  
   content: " ";    
   position: absolute; 
      left: 15px; 
      bottom: 100%;
   border-color: rgba(235, 110, 31, 0);    
      border: solid transparent; 
      pointer-events: none;
      border-bottom-color: #eb6e1f; 
      border-width: 6px; }