﻿body {margin:0px; background-image: url('images/bg-pattern.jpg'); font-family: helvetica;}

.frame {width: 960px; margin-left: auto; margin-right: auto; position: relative;}
.topnav {margin-bottom: 10px; height: 39px;}
.topnav .left {background: url('images/nav-top-left.png'); height: 39px; width: 7px; float: left;}
.topnav .links {background: url('images/nav-top-center.png'); height: 38px; width: 946px; text-align: right; float: left; line-height: 2;}
.topnav .links a {color: #ffffff; font-family: Helvetica ; font-weight: bold; font-size: 12px; text-transform: uppercase; text-decoration: none; float: right; padding: 7px;}
.topnav .links a:hover {background: url('images/menu-marker.gif') no-repeat; background-position: center bottom;}
.topnav .right {background: url('images/nav-top-right.png'); height: 39px; width: 7px; float: left;}
.frame .logo {height: 152px; width: 960px;}
.frame .nav {background: url('images/nav-bg.png'); height: 29px; width: auto; line-height: 1.75;}
.frame .nav a {color: #ffffff; font-family: Helvetica; font-weight: bold; font-size: 12px; text-transform: uppercase; text-decoration: none; padding: 7px;}
.frame .nav a:hover {background: url('images/menu-marker.gif') no-repeat; background-position: center bottom;}
.frame .main {background: url('images/main-bg.gif'); width: 924px; height: auto; min-height: 575px; padding: 18px; float: left;}
.frame .main-bottom {background: url('images/main-bottom.gif'); height: 9px; width: 960px; float: left;}

.left-nav {position: absolute; left: 25px; top: 250px; width: 190px; height: 200px; background: #e5e8e2; padding: 15px;}
.left-nav ul {color: #000; list-style: none; margin: 0; padding: 0;}
.left-nav li {width: 100%; background: url('images/underline-dot.png') no-repeat bottom; padding-bottom: 5px; padding-top: 1px; padding-left: 4px;} 
.left-nav a {color: #60605D; font-size: 12px; text-decoration: none;}
.left-nav .bg-selected {background-color: #1082a7;}
.left-nav .bg-selected a {color: #fff;}
/*
.left-nav a {font-size: 12px; text-decoration: none; color: #60605D;}
.left-nav div {width: 100%; background: url('images/underline-dot.png') no-repeat bottom; padding-bottom: 5px; padding-top: 3px; padding-left: 4px;} 
.left-nav .bg-selected {background-color: #1082a7;}
.left-nav .link-selected {color: #ffffff;}
*/

.center-content {position: absolute; background: url('images/center-bg.png') no-repeat; left: 285px; width: 320px; height: 371px; top: 250px; padding: 15px;}
.center-content h2 {font-size: 18px; color: #3f6469; margin: 0px; padding: 0px;}
.center-content p {font-size: 13px; color: #60605D;}
.center-content li {font-size: 13px; color: #60605D;}
.center-content .scrollable {overflow: auto; width: 318px; height: 367px; padding: 5px;}

.right-content {position: absolute; background: #e5e8e2; left: 675px; width: 225px; height: 548px; top: 250px; padding: 15px;}
.right-content h2 {font-size: 14px; color: #3f6469; margin: 0px; padding: 0px;}
.right-content p {font-size: 13px; color: #60605D;}
.right-content .scrollable {overflow: auto; width: 217px; height: 540px;}
.right-content .partners {padding-left: 10px; font-size: 12px; color: #60605D; margin-bottom: 10px;}
.right-content a {font-size: 13px; color: #5caabf; text-decoration: none;}

.contribute {background: url('images/contribute.png'); height: 86px; width: 219px;}
.contribute .text {margin-left: 10px; font-size: 13px; margin-top: 35px;}
.contribute .text a {color: #60605D; font-family: Helvetica ; font-size: 14px; line-height: 1.5; text-decoration: none; text-transform: uppercase; font-weight: bold;}
.contribute-one {position: absolute; left: 25px; top: 525px;}
.contribute-two {position: absolute; left: 25px; top: 710px;}
.contribute-three {position: absolute; left: 560px; top: 250px;}

.image-one {position: absolute; left: 25px; top: 675px;}
.image-two {position: absolute; left: 285px; top: 675px;}
.main-image {position: absolute; left: 25px; top: 250px;} 

.flickr-icon {position: absolute; left: 290px; top: 738px;} 


.fb-icon {position: absolute; left: 400px; top: 745px;}

.main-content {position: absolute; left: 25px; top: 450px; width: 502px;} 
.main-content p {color: #60605D; font-family: Helvetica ; font-size: 14px; text-decoration: none; line-height: 1.5;}

.main-right {position: absolute; left: 565px; top: 247px; width: 373px; height: 572px; background: url('images/main-right-bg.png') no-repeat; padding: 10px;} 
.main-right .top {color: #948f88; font-family: Helvetica ; font-size: 16px; padding: 10px;}
.main-right .bottom {position: absolute; top: 300px; background: url('images/main-right-bottom-bg.png') no-repeat; margin-left: -5px; height: 250px; width: 353px;}
.main-right .bottom .text {padding: 24px; font-family: Helvetica ; color: #ffffff; font-size: 13px; line-height: 1.15em;}
.main-right .bottom li {margin-left: 15px; margin-bottom: 10px; margin-right: 15px;}

.calendar {position: absolute; top: 250px; left: 270px; width: 640px; height: 400px; padding: 15px; background: url('images/calendar-bg.gif') no-repeat;}
.calendar h2 {font-size: 18px; color: #3f6469; margin: 0px; padding: 0px;}
.calendar p {font-size: 13px; color: #60605D; margin: 0px; padding: 4px;}
.calendar .events {float: left; overflow: auto; height: 310px; width: 635px;}
.calendar .event {margin-bottom: 10px;}
.calendar .event .date {font-size: 13px; color: #3f6469; font-weight: bold;}
.calendar .event .name {font-size: 13px; color: #60605D;}
.calendar .event .description {font-size: 13px; color: #60605D;}

.calendar-images {position: absolute; left: 25px; top: 670px;}
.calendar-images .image {float: left;}
.calendar-images .image-pad {margin-left: 22px;}

.stories {width: 890px; margin-left: 15px;}
.stories .text {width: 66%; padding: 10px;}
.stories .text p {font-size: 13px; color: #60605D; margin-top: 5px; padding: 0px;}
.stories .column {position: relative; padding: 10px; text-align: center; float: left; width: 272px; height: 250px; background: #e5e8e2;}
.stories .pad {margin-left: 7px;}
.stories .column h2 {font-size: 14px; color: #3f6469; font-weight: bold;}
.stories .column p {font-size: 13px; color: #60605D; line-height: 1.3;}
.stories .column a.more {position: absolute; font-size: 13px; color: #5caabf; text-decoration: none; bottom: 5px; right: 5px;} 
.stories .bottom {float: right; margin-top: 25px;}

.case-study {background: url('images/case-study.png') no-repeat; width: 221px; height: 85px; float: right;}
.case-study .text {margin-left: 10px; font-size: 13px; margin-top: 27px;}
.case-study .text a {color: #948f88; font-family: Helvetica ; font-size: 14px; line-height: 1.5; text-decoration: none; text-transform: uppercase; font-weight: bold;}
.stories .bottom .contribute {float: left; margin-right: 10px;}
.stories .bottom .contribute .text {margin-top: 25px;}

.contributions {width: 890px; margin-left: 15px;}
.contributions .text {width: 66%; padding: 10px;}
.contributions .text p {font-size: 13px; color: #60605D; margin-top: 5px; padding: 0px;}
.contributions .column {position: relative; padding: 10px; text-align: center; float: left; width: 272px; height: 150px; background: #e5e8e2;}
.contributions .pad {margin-left: 7px;}
.contributions .column h2 {font-size: 13px; color: #3f6469; font-weight: bold;}
.contributions .column p {font-size: 12px; color: #60605D; line-height: 1.3;}
.contributions .column a.more {position: absolute; font-size: 13px; color: #5caabf; text-decoration: none; bottom: 5px; right: 5px;} 
.contributions .bottom .contribute {float: right; margin-top: 50px;}
.contributions .bottom .contribute .text {margin-top: 25px;}
.contributions .contribute {float: left; margin-top: 25px;}
.contributions .contribute .text {margin-top: 25px;}
.contributions li {font-size: 13px; color: #948f88; margin-top: 3px; margin-bottom: 7px;}
.contributions ol {}

.contact-content {position: absolute; top: 475px; left: 25px; width: 502px;}
.contact-content h2 {font-size: 12px; color: #3f6469; font-weight: bold; margin: 0px; padding: 0px;}
.contact-content p {font-size: 13px; color: #60605D; line-height: 1.2; margin-top: 5px; margin-bottom: 10px; padding: 0px;}
.contact-content a {font-style: italic;} 

.selected {background: url('images/menu-marker.gif') no-repeat; background-position: center bottom;}

.sub-content {position: absolute; top: 250px; left: 270px; width: 640px; height: 400px; padding: 15px; background: url('images/calendar-bg.gif') no-repeat;}
.sub-content .scrollable {overflow: auto; width: 640px; height: 367px;}
.sub-content a {font-size: 13px; text-decoration: none;}
.sub-content h2 {font-size: 18px; color: #3f6469; margin: 0px; padding: 0px;}
.sub-content h3 {font-size: 13px; color: #3f6469; margin-left: 0px; margin-right: 0px; margin-left: 0px; margin-top: 0px; margin-bottom: 0px; padding: 0px;}
.sub-content p {font-size: 13px; color: #60605D; margin-top: 5px;}
.sub-content li {font-size: 13px; color: #60605D; margin-top: 3px;}
.sub-content ul {font-size: 13px; color: #60605D; margin-top: 5px; margin-bottom: 5px;}
.sub-content table {font-size: 13px; color: #60605D; margin-top: 5px; margin-bottom: 5px;}

.sub-content-two  {padding: 10px;}
.sub-content-two  a {font-size: 13px; text-decoration: none;}
.sub-content-two  h2 {font-size: 18px; color: #3f6469; margin: 0px; padding: 0px;}
.sub-content-two  h3 {font-size: 13px; color: #3f6469; margin: 0px; padding: 0px;}
.sub-content-two  p {font-size: 13px; color: #60605D; margin-top: 5px;}
.sub-content-two  li {font-size: 13px; color: #60605D; margin-top: 3px;}
.sub-content-two  ul {font-size: 13px; color: #60605D; margin-top: 5px; margin-bottom: 5px;}
.sub-content-two  table {font-size: 13px; color: #60605D; margin-top: 5px; margin-bottom: 5px;}

.grants ul { margin-bottom: 20px; }