@charset "UTF-8";
/* CSS Document */
/* +++++++++++++++++++++++++++++++++++++ Body-START ++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
body {
/*background-image: url(/images/gray_bg.jpg);*/
background-repeat: no-repeat;
background-color: #f2f2f2;
position: relative;
behavior: url("css/csshover3.htc");
margin-top: 0px;
}
/* +++++++++++++++++++++++++++++++++++++ Body END ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* +++++++++++++++++++++++++++++++++++++ Main Container START +++++++++++++++++++++++++++++++++++++++++++++++++
This section is the foundation of the background and surrounds the Header, Main Content Area, and the Footer +
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
#MainContainer #topboxcurve {
background-image: url(/images/main_bg_head.png);
height: 7px;
width: 1000px;
}
#MainContainer {
height: 100%;
width: 1000px;
border: 0;
padding-top: 0px;
padding-right: 0;
padding-bottom: 5px;
padding-left: 0px;
margin-top: 35px;
margin-right: auto;
margin-bottom: auto;
margin-left: auto;
}
#MainContainer2 {
height: 100%;
width: 1000px;
border: 0;
padding-top: 0px;
padding-right: 0;
padding-bottom: 5px;
padding-left: 0px;
margin-top: 35px;
margin-right: auto;
margin-bottom: auto;
margin-left: auto;
}
/*This Style pertains only to the organization.html page*/
/*#MainContainer #org_MainContentContainer {
float: left;
height: 100%;
width: 1000px;
background-color: #FFF;
padding-top: 45px;
}*/
/*end style*/
#MainContainer #whitecurve {
float: left;
height: 75px;
width: 1000px;
background-image: url(/images/main_bg_foot.png);
background-repeat: no-repeat;
background-position: left top;
}
/* +++++++++++++++++++++++++++++++++++++++++ Main Container End +++++++++++++++++++++++++++++++++++++++++++++++*/
/* ++++++++++++++++++++++++++++++++++++++++ Header CSS START ++++++++++++++++++++++++++++++++++++++++++++++++++
This section contains the stlys for the header. This includes the top header bar with the social network links +
as well as the main navigation. To adjust the rollovers for the main nav and the social links nav you will need +
to access the rollovers.css document +
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
/*This is the style is the container for all elements in the header*/
#Header_mp {
float: left;
height: 172px;
width: 1000px;
background-color: #FFF;
z-index: 2;
}
/*This is the style effects the container for the main MP banner image*/
#Header_mp #mainheader {
float: left;
width: 855px;
background-color: #433E3B;
height: 113px;
margin-left: 7px;
margin-bottom: 5px;
display: inline;
}
/*This is the style effects the container for all the social network links*/
#Header_mp #socialnetworklinks {
float: left;
clear: right;
height: 30px;
width: 100px;
padding-top: 9px;
}
/*This is the style effectgs the container for all navigation buttons*/
#Header_mp #headernavigation {
height: auto;
width: 986px;
background-color: #FFF;
overflow: hidden;
float: left;
margin-bottom: 0px;
}
#Header_mp #headernavigation_test {
height: auto;
width: 800px;
background-color: #FFF;
overflow: hidden;
float: left;
margin-bottom: 0px;
padding-left:38px;
}
/*This is the style sets the text list to have no bullets or indentations*/
#header_navigation {
list-style-type: none;
list-style-image: none;
padding: 0;
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
}
/*This is the style effects the ul tag of the navigation*/
#Header_mp #headernavigation #head_navigation {
margin-left: 130px;
width: auto;
}
/*This is the style effects the li tag of the navigation*/
#head_navigation li {
float: left;
margin: auto;
}
/*This is the style effects the individual divs of the social navigation*/
#socialnetworklinks {
float:left;
width: 75px;
height: 100px;
}
#social_navigation {
float:right;
list-style-type: none;
list-style-image: none;
padding: 0;
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
}
/*This is the style effects the li tag of the social navigation*/
#social_navigation li {
float: left;
margin:auto;
list-style-type: none;
list-style-image: none;
}
/* ++++++++++++++++++++++++++++++++++++++++++++++ Header CSS End ++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* ++++++++++++++++++++++++++++++++++++++++++++++ Flash Content Area CSS START ++++++++++++++++++++++++++++++++++++++++
This is only the container for the visual slide show. If you want to change something with the slide show you will need +
to access the slideshow.css +
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
#FlashContent {
height: 450px;
width: 1000px;
float: left;
background-color: #FFF;
/*text-align: center;*/
}
#FlashContent_alt {
height: 100%;
width: 1000px;
float: left;
background-color: #FFF;
/*text-align: center;*/
}
#FlashContent_casestudies {
height: 100%;
width: 950px;
float: left;
background-color: #FFF;
text-align: center;
padding-top: 63px;
padding-left:38px;
padding: 25px;
}
/* ++++++++++++++++++++++++++++++++++++++++++++++ Flash Content Area CSS END ++++++++++++++++++++++++++++++++++++++++++ */
/* ++++++++++++++++++++++++++++++++++++++++++++++ Main Content Area CSS START +++++++++++++++++++++++++++++++++++++++++
This is the 2- 3 column area between the slideshow and the end of the white box. This area will contain all the column +
styles for each page of the web site. +
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/*The following styles effect the index page mainly some of the styles may cross over pages*/
#MainContainer #MainContentContainer {
float: left;
height: 100%;
width: 1000px;
background-color: #FFF;
}
#LeftColumn {
float: left;
height: 308px;
width: 352px;
margin-left: 7px;
background-color: #FFF;
display: inline;
}
#LeftColumn #lefttitle {
height: 27px;
width: 274px;
margin-left: 39px;
}
#LeftColumn #leftcontent {
height: 281px;
width: 274px;
overflow: hidden;
margin-left: 39px;
text-align: left;
}
#MiddleColumn {
clear: right;
float: left;
height: 308px;
width: 315px;
overflow: hidden;
background-color: #FFF;
}
#RightColumn {
float: right;
height: 308px;
width: 319px;
margin-right: 7px;
background-color: #FFF;
}
#RightColumn #right_column_title {
width: 279px;
height: 27px;
}
#RightColumn #right_column_content {
width: 279px;
height: 281px;
}
/*end comment*/
/*++++++++++++++++++++++++++++++++++++ 3 column with 655px middle column ++++++++++++++++++++++++++++++++++++++
The following styles will effect the columns on the following pages: about, case studies, contact, services, +
services sub pages and food expertise +
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
#lg_mid_LeftColumn {
float: left;
height: 100%;
width: 172px;
background-color: #FFF;
}
#lg_mid_LeftColumn_hub {
float: left;
height: 100%;
width: 232px;
background-color: #FFF;
margin-left:45px;
}
#lg_mid_LeftColumn #lefttitle {
height: 27px;
width: auto;
}
#lg_mid_LeftColumn #leftcontent {
height: 100%;
width: auto;
overflow: hidden;
}
#lg_mid_MiddleColumn {
clear: right;
float: left;
height: auto;
width: 655px;
overflow: hidden;
background-color: #FFF;
}
#lg_mid_MiddleColumn_hub {
clear: right;
float: left;
margin-left:20px;
height: auto;
width: 655px;
overflow: hidden;
background-color: #FFF;
}
#lg_mid_MiddleColumn #Midcontent {
float: left;
width: 655px;
}
/*This style is for the contact page only*/
#lg_mid_MiddleColumn #contact_midcontent {
margin-top: 25px;
text-align: left;
}
#lg_mid_RightColumn {
float: right;
height: 100%;
width: 172px;
background-color: #FFF;
}
#lg_mid_RightColumn #right_column_blog {
height: 100%;
}
/*++++++++++++++++++++++++++++++++++++ 3 column with 655px middle column END ++++++++++++++++++++++++++++++++++++++ */
/*++++++++++++++++++++++++++++++++++++ 3 even columns at 276px ++++++++++++++++++++++++++++++++++++++
The following styles will effect the columns on the following pages: individual bio pages only +
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
#three_even_LeftColumn {
float: left;
height: 100%;
width: 276px;
background-color: #FFF;
padding-left:47px;
}
#three_even_LeftColumn #lefttitle {
height: 27px;
width: auto;
overflow: hidden;
}
#three_even_LeftColumn #leftcontent {
height: 100%;
width: auto;
overflow: hidden;
}
#three_even_LeftColumn #bio_leftcontent {
margin-top: 15px;
}
#three_even_MiddleColumn {
height: 100%;
width: 276px;
margin-right: 39px;
margin-left: 39px;
float: left;
clear: right;
}
#three_even_MiddleColumn #Midcontent {
float: left;
width: 655px;
}
#three_even_MiddleColumn #bio_midcontent {
margin-top: 15px;
}
#three_even_RightColumn {
float: left;
height: 100%;
width: 276px;
background-color: #FFF;
}
#three_even_RightColumn #right_column_title {
height: 27px;
width: 276px;
}
#three_even_RightColumn #right_column_content {
height: 100%;
width: 276px;
}
#three_even_RightColumn #bio_right_column_content {
margin-top: 15px;
}
/*++++++++++++++++++++++++++++++++++++ 3 even columns at 276px END ++++++++++++++++++++++++++++++++++++++ */
/*++++++++++++++++++++++++++++++++++++ 3 odd columns ++++++++++++++++++++++++++++++++++++++++++++++++
The following styles will effect the columns on the following pages: Main staff page only +
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
#three_odd_LeftColumn {
float: left;
height: 100%;
width: 323px;
background-color: #FFF;
padding-left: 47px;
}
#three_odd_LeftColumn #lefttitle {
height: 27px;
width: auto;
overflow: hidden;
}
#three_odd_LeftColumn #leftcontent {
height: 100%;
width: auto;
overflow: hidden;
}
#three_odd_LeftColumn #staff_leftcontent {
height: 100%;
width: auto;
margin-top: 5px;
}
#three_odd_MiddleColumn {
clear: right;
float: left;
height: 100%;
width: 320px;
background-color: #FFF;
margin-right: 0px;
margin-left: 25px;
}
#three_odd_MiddleColumn #Midcontent {
float: left;
margin-top: 10px; /*width: 655px;*/
}
#three_odd_RightColumn {
float: right;
height: 100%;
width: 276px;
background-color: #FFF;
}
#three_odd_RightColumn #right_column_title {
height: 27px;
width: 276px;
}
#three_odd_RightColumn #right_column_content {
height: 525px;
width: 276px;
}
/*++++++++++++++++++++++++++++++++++++ 3 odd columns at END ++++++++++++++++++++++++++++++++++++++ */
/*++++++++++++++++++++++++++++++++++++ 2 columns standard +++++++++++++++++++++++++++++++++++++++++++++++++
The following styles will effect the columns on the following pages: Individual Case Studies, Organizations +
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
#twocol_LeftColumn {
float: left;
height: 100%;
width: 338px;
background-color: #FFF;
padding-left: 47px;
}
#twocol_LeftColumn #lefttitle {
height: 27px;
width: auto;
}
#twocol_LeftColumn #leftcontent {
height: 100%;
width: auto;
overflow: hidden;
margin-top: 15px;
}
#twocol_MiddleColumn {
clear: right;
float: left;
height: auto;
width: 560px;
background-color: #FFF;
padding-left: 10px;
}
#twocol_MiddleColumn #midCol_title {
overflow: hidden;
}
#twocol_MiddleColumn #Midcontent {
float: left;
width: 655px;
}
#twocol_MiddleColumn #rightcol_content {
height: 100%;
width: 560px;
margin-top: 15px;
text-align: center;
}
/*++++++++++++++++++++++++++++++++++++ 2 columns standard END +++++++++++++++++++++++++++++++++++++++++++++++++ */
/* +++++++++++++++++++++++++++++++++++++ Main Content Area CSS End ++++++++++++++++++++++++++++++++++++++++++++ */
/* +++++++++++++++++++++++++++++++++++++++++++ Footer Content Area START ++++++++++++++++++++++++++++++++++++++++++
There are essentially 3 footer areas the first is the "EXECUTED PROJECTS FOR SECTION, 3 COLUMN FOOTER SECTION, AND +
THE FOOTER NAVIGATION SECTION. The EXECUTED PROJECTS FOR SECTION only appears on the home page +
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* +++++++++++++++++++++++++++++++++++ Execute Projects For Content Area START +++++++++++++++++++++++++++++++
The following styles effect the div tag that hosts the .swf. +
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
#FooterFlash {
height: 165px;
width: 1000px;
float: left;
clear: both;
padding-top: 25px;
background-color: #FFF;
}
#FooterFlash #footerflash_title {
height: 39px;
width: 986px;
overflow: visible;
visibility: visible;
background-color: #FFF;
}
#FooterFlash #footer_flash_content {
text-align: center;
height: 118px;
width: auto;
background-color: #FFF;
}
/* ++++++++++++++++++++++++++++++++++++ Execute Projects For Content Area End ++++++++++++++++++++++++++++++++ */
/* ++++++++++++++++++++++++++++++++++++ 3 Column Footer Section START ++++++++++++++++++++++++++++++++++++++++
This section includes the 3 column with host the philanthopic info, the contact info, and the employment info +
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
#FootLeftColumn {
float: left;
height: 169px;
width: 337px;
border-right-width: 1px;
border-right-style: solid;
border-right-color: #CCC;
clear: right;
}
#FootLeftColumn #footleftcol_title {
float: right;
height: 27px;
width: 289px;
padding-bottom: 0px;
}
#FootLeftColumn #footleftcol_content {
float: left;
height: 132px;
width: 260px;
overflow: hidden;
margin-left: 50px;
}
#FootMidColumn {
clear: right;
float: left;
height: 169px;
width: 317px;
border-right-width: 1px;
border-right-style: solid;
border-right-color: #CCC;
}
#MainContainer #allfootercol {
float: left;
height: 100%;
width: 1000px;
}
#FootMidColumn #footmidcol_title {
height: 27px;
width: 222px;
margin: auto;
}
#FootMidColumn #footmidcol_content {
height: 142px;
width: 190px;
margin: auto;
}
#FootRightColumn {
float: right;
height: 169px;
width: 343px;
clear: right;
}
#FootRightColumn #footrightcol_title {
height: 27px;
width: 232px;
margin: auto;
}
#FootRightColumn #footrightcol_content {
height: 142px;
width: 232px;
overflow: hidden;
margin-left: 60px;
}
/* ++++++++++++++++++++++++++++++++++++ Footer Content Area END +++++++++++++++++++++++++++++++++++++*/
/* +++++++++++++++++++++++++++++++++++ Footer Navigation Area START +++++++++++++++++++++++++++++++++++
This area contains the bottom navigation as well as the copy right information +
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
#Footer {
height: 100px;
width: 1000px;
float: left;
text-align: center;
margin-top: 20px;
border-top-width: 1px;
border-top-style: solid;
border-top-color: #CCC;
}
#footer_navigation {
list-style-type: none;
list-style-image: none;
width: 550px;
margin: auto;
position: relative;
}
#navigation li {
float:left;
}
#Footer #navigation {
width: 800px;
height: 40px;
margin: auto;
}
/* +++++++++++++++++++++++++++++++++++ Footer Navigation Area END +++++++++++++++++++++++++++++++++++++++++ */
/* ++++++++++++++++++++++++++++++++++ Slideshow CSS Don not Edit START ++++++++++++++++++++++++++++++++++++++++++
This is the Global setting for all the slideshows. If you create a slideshow you will need to delete or not include+
the style link when copying the head material. These set of styles will take over +
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
/**
Stylesheet: Slideshow.css
CSS for Slideshow.
License:
MIT-style license.
Copyright:
Copyright (c) 2008 [Aeron Glemann](http://www.electricprism.com/aeron/).
HTML:
Notes:
These next four rules are set by the Slideshow script.
You can override any of them with the !important keyword but the slideshow probably will not work as intended.
*/
.slideshow {
display: block;
position: relative;
z-index: 0;
left: 47px;
height: 360px;
width: 906px;
}
.slideshow-images {
display: block;
overflow: hidden;
border: solid #666 1px;
position: relative;
}
.slideshow-images img {
display: block;
position: absolute;
z-index: 1;
}
.slideshow-thumbnails {
overflow: hidden;
top: 366px;
}
.slideshow a img {
border: 0;
}
/**
HTML:
Notes:
The images div is where the slides are shown.
Customize the visible / prev / next classes to effect the slideshow transitions: fading, wiping, etc.
*/
.slideshow-images {
width: 906px;
height: 360px;
position: absolute;
}
.slideshow-images-visible {
opacity: 1;
}
.slideshow-images-prev {
opacity: 0;
}
.slideshow-images-next {
opacity: 0;
}
.slideshow-images img {
float: left;
left: 0;
top: 0;
position: static;
}
/**
HTML:
Notes:
Customize the active / inactive classes to affect the thumbnails animation.
Use the !important keyword to override FX without affecting performance.
*/
.slideshow-thumbnails * {
margin: 0;
padding: 0;
}
.slideshow-thumbnails a {
display: block;
float: left;
position: relative;
padding-top: 2px;
padding-right: 5px;
padding-bottom: 2px;
padding-left: 5px;
}
.slideshow-thumbnails a:hover {
background-color: #FFF !important;
opacity: 1 !important;
}
.slideshow-thumbnails img {
display: block;
}
.slideshow-thumbnails-active {
background-color: #CCC;
opacity: 1;
}
.slideshow-thumbnails-inactive {
background-color: #FFF;
opacity: .5;
}
.slideshow-thumbnails {
bottom: -35px;
height: 35px;
left: 0;
position: absolute;
width: 100%;
overflow: auto;
}
.slideshow-thumbnails ul {
height: 15px;
left: 0;
position: absolute;
top: 0;
width: 240px;
}
div.syndicate p.rss {
line-height: 30px;
background: url('images/rss.png') no-repeat 0px 7px;
padding: 0 0 0 23px;
margin: 0 0 0 40px;
float: right;
color: #666;
}
.syndicate {
/*color: ;
width: 940px;
height: 50px;
border-bottom: 1px solid #dadada;*/
background-color: #FFF;
margin-top: 0px;
margin-right: 0;
margin-bottom: 60px;
margin-left: 20px;
padding-top: 0;
padding-right: 20px;
padding-bottom: 0;
padding-left: 20px;
}
div.syndicate p.rss {
line-height: 30px;
background: url('/images/rss.png') no-repeat 0px 7px;
/*padding: 0 0 0 23px;
margin: 0 0 0 40px;*/
float: right;
color: #666;
}
div.syndicate p.twitter {
line-height: 30px;
background: url('images/twitter.png') no-repeat 0px 7px;
padding: 0 0 0 23px;
float: right;
color: #449DD3;
}
div.syndicate p.twitter a {
color: #449DD3;
}*/
div.syndicate p.rss a{
color: #666;
}
div#container div#left {
float: left;
width: 640px;
padding: 0 30px 0 30px;
overflow: hidden;
}
/**************************** HOME PAGE BLOG TEASER*************************************/
.postcontainer {
height: 45px;
width: 279px;
/*border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: 443d3e;*/
padding-top: 5px;
padding-bottom: 5px;
padding-left: 5px;
}
.postexcerpt {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 0.65em;
color: 443d3e;
height: 24px;
width: 269px;
vertical-align: middle;
overflow: hidden;
line-height: 1.3em;
clear: both;
}
.postdate {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 0.5em;
color: 443d3e;
height: 14px;
width: 45px;
float: left;
vertical-align: middle;
}
.posttitle {
float: left;
width: 194px;
height: 14px;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 0.7em;
text-transform: uppercase;
color: 443d3e;
padding-left: 2px;
font-weight: bold;
overflow: hidden;
}
.postmore {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 0.7em;
color: 443d3e;
float: left;
width: 30px;
height: 14px;
}
a:link {
color: #443e3d;
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #443e3d
}
a:hover {
text-decoration: underline;
}
a:active {
text-decoration: none;
color: #2E2A29;
}
.even {
background-color: #FFF;
}
.odd {
background-color: #f2f2f2;
}
.posthead {
width: 279px;
}