/**
 * Defaults and Resets
 */
html, body {margin: 0; padding: 0; background: #738b57;}

body {font-family: Arial, Verdana, Sans-Serif; font-size: 12px; line-height: 24px; color: #4a623b;}

form {margin: 0; padding: 0;}

img {border: 0;}

td {vertical-align: top;}

p {margin: 0 0 20px 0;}

:focus {outline: 0;}

a {color: #869c34; text-decoration: none;}
a:hover {color: #000;}

h1 {margin: 0 0 20px 0; padding: 0 0 25px 0; font-size: 12px; line-height: normal; border-bottom: solid 1px #ecd7b5;}
h1 img {display: block;}
h2 {margin: 0 0 20px 0;}
h2 img {display: block;}

/**
 * General
 */
.clearBoth, .clear {clear: both; height: 0px; font-size: 1px; line-height: 0px; display: block;}

.condensed {line-height: 18px;}

div.separator {margin: 20px 0 30px 0; height: 1px; font-size: 1px; line-height: 1px; background: #ecd7b5;}

a.more {font-size: 14px;}
a.arrows {font-weight: bold; color: #c66529; background: url(../images/green-double-arrow.gif) no-repeat right 3px; padding-right: 20px;}
a.arrows:hover {color: #000;}

img.left {float: left; margin: 0 20px 20px 0}
img.right {float: right; margin: 0 0 20px 20px;}

/**
 * Lists
 */
ul.inline {margin: 0; padding: 0; list-style-type: none;}
ul.inline li {display: inline;}

ul.list {margin: 0; padding: 0; list-style-type: none;}

/**
 * Layout
 */
#masterWrapper {width: 100%; background: #2b3c22 url(../images/layout/bg.gif) repeat-x;}

#master {width: 976px; margin: auto;}

#header {position: relative; height: 173px; background: url(../images/layout/bg-nav.gif) no-repeat; z-index: 10000;}
#header .logo {position: absolute; top: 87px; left: 14px;}
#header .primaryNav {position: absolute; top: 18px; right: 25px;}
#header .primaryNav ul {margin: 0; padding: 0; list-style-type: none;}
#header .primaryNav ul li {display: inline;}
#header .nav {position: absolute; top: 113px; right: 19px; font-size: 14px; line-height: 18px; color: #dde9b6; z-index: 1000;}
#header .nav a {color: #dde9b6; text-decoration: none;}
#header .nav a:hover {color: #000;}
#header .nav ul {margin: 0; padding: 0; list-style-type: none;}
#header .nav ul li {float: left; display: block; position: relative;}
#header .nav ul li div {position: absolute; top: 60px; left: 0; width: 205px; background: #7d9755 url(../images/layout/bg-nav-border.gif) no-repeat 187px 0; border: solid 5px #738b57; border-width: 0 5px; padding: 5px 15px 0 15px;}
#header .nav ul li ul li {float: none; border-bottom: solid 1px #8ea758; padding: 10px 0 10px 15px; background: url(../images/layout/bg-nav-bullet.gif) no-repeat left 17px;}
#header .nav ul li ul li.last {padding-bottom: 25px; border-bottom-width: 0;}
#header .nav ul li ul li.contact {background: #738b57; margin: 0 -15px; padding: 20px 0 20px 15px; border-bottom-width: 0; font-size: 1px; line-height: normal;}
#header .nav ul li.teachers {left: -4px;}
#header .nav ul li.teachers div {background-position: 139px 0;}
#header .nav ul li.students {left: -9px;}
#header .nav ul li.students div {right: 0; left: auto; background-position: -104px 0;}
#header .logos {position: absolute; top: 5px; left: 25px;}
#header .logos ul {margin: 0; padding: 0; list-style-type: none;}
#header .logos ul li {float: left; display: block; padding: 0 20px 0 0;}
#header .logos ul li.nctm {padding-top: 5px;}
#header .logos ul li.wwc {padding-top: 5px;}
#header .login {position: absolute; top: 43px; right: 25px;}

#page {width: 100%; background: url(../images/layout/bg-page.gif) repeat-y;}
#page > div {width: 965px; padding: 0 4px 0 7px; background: url(../images/layout/bg-page-top.gif) no-repeat 0 -20px;}

#title {position: relative; width: 957px; top: 8px; left: 8px; margin: 0 0 -5px 0; padding-bottom: 13px; background: url(../images/layout/bg-corner-right.gif) no-repeat right bottom;}
#title .photo {float: left; width: 610px;}
#title .title {float: left; width: 347px; background: #7d9755 url(../images/layout/bg-title.gif) no-repeat;}
#title h1 {position: absolute; top: 35px; left: 330px; margin: 0; padding: 0; font-size: 18px; line-height: normal; color: #f4eed2; border-bottom-width: 0;}
#title .cta {position: absolute; top: 32px; left: 750px;}
#title .cta .button {display: block; padding: 15px 0 0 22px;}

#content {float: left; width: 580px; padding: 35px 0 0 40px;}
#content .columnLeft {float: left; width: 275px;}
#content .columnRight {float: right; width: 275px;}
#content .columnRightNarrow {float: right; width: 250px;}

#sidebar {float: left; position: relative; width: 299px; margin: 0 0 0 -12px;}
#sidebar .photo {margin: 0 0 26px 0; padding: 0 0 0 12px;}
#sidebar .pageTitle {margin: -51px 0 26px 0; position: relative; padding: 36px 0 0 0 ; background: url(../images/layout/bg-callout.gif) no-repeat 240px 0;}
#sidebar .pageTitle img {display: block;}
#sidebar .subnav {margin: -26px 0 23px 0; padding: 0 0 12px 0; background: url(../images/layout/bg-corner-left.gif) no-repeat left bottom; font-size: 14px; line-height: 18px; color: #dde9b6; text-align: right;}
#sidebar .subnav > div {width: 200px; padding: 20px 25px 30px 74px; background: #738b57 url(../images/layout/bg-subnav.gif) no-repeat;}
#sidebar .subnav a {color: #dde9b6; text-decoration: none;}
#sidebar .subnav a:hover {color: #000;}
#sidebar .subnav ul {margin: 0; padding: 0; list-style-type: none;}
#sidebar .subnav ul li {padding: 10px 5px; border-bottom: solid 1px #8da558;}
#sidebar .subnav ul li.last {border-bottom-width: 0;}
#sidebar .block {margin-bottom: 20px; padding-bottom: 12px; width: 100%; background: url(../images/layout/bg-corner-left.gif) no-repeat left bottom;}
#sidebar .block > div {background: #e6dab3;}
#sidebar .block .title {background: #e1d3a4 no-repeat 30px 20px;}
#sidebar .block .newsHeadlinesTitle {padding: 25px 25px 25px 60px; background-image: url(../images/apple.gif);}
#sidebar .videoBlock > div {padding: 15px; background: #e6dab3;}
#sidebar .videoBlock .featuredVideo {padding: 0 0 10px 0;}
#sidebar .videoBlock .video {margin: 0 0 10px 0; padding: 0 0 7px 7px; background: url(../images/layout/bg-video.gif) repeat-x left bottom;}
#sidebar .videoBlock .video .thumb {float: left; width: 68px; height: 68px; padding: 6px; background: url(../images/layout/bg-video-thumb-trans.png) no-repeat;}
#sidebar .videoBlock .video .thumb img {display: block; border: solid 2px #e4b598;}
#sidebar .videoBlock .video .content {float: left; width: 145px; padding: 10px 10px 0 10px; font-size: 11px; line-height: 14px; color: #6d6d6d;}
#sidebar .videoBlock .video .content h4 {margin: 0 0 5px 0; font-size: 12px; color: #443823;}
#sidebar .videoBlock .video .play {float: left; width: 54px; padding: 40px 0 0 0;}
#sidebar .videoBlock .more {padding: 12px 15px; background: #d6cda8; text-align: right;}
#sidebar .newsBlock {position: relative; font-size: 12px; line-height: 18px; color: #3c5030;}
#sidebar .newsBlock > div {padding: 0 0 10px 0; background: #9faf68;}
#sidebar .newsBlock a {float: left; display: block; width: 210px; padding: 0 20px 5px 0; color: #3c5030; text-decoration: none; position: relative;}
#sidebar .newsBlock a:hover {color: #000;}
#sidebar .newsBlock a.more {float: right; width: 75px; padding: 5px 0 5px 0;}
#sidebar .newsBlock .title {padding: 10px 25px 10px 20px; background: #738b57;}
#sidebar .newsBlock .content {padding: 10px 25px 10px 20px;}
#sidebar .newsBlock .apple {position: absolute; top: 7px; left: -10px;}
#sidebar .quoteBlock .content {padding: 25px 25px 25px 30px; font-size: 11px; line-height: 18px; color: #756d55;}
#sidebar .quoteBlock .quote {margin: 0 0 20px 0;}
#sidebar .quoteBlock .quoteAuthor {font-weight: bold; color: #789156;}
#sidebar .quoteBlock .quoteAuthor .authorTitle {font-weight: normal; font-style: italic; color: #756d55;}
#sidebar .articlesBlock .content {padding: 20px 20px 20px 30px;}
#sidebar .articlesBlock ul {margin: 0; padding: 0; list-style-type: none;}
#sidebar .articlesBlock ul li a {padding: 0 0 0 20px; background: url(../images/green-arrow.gif) no-repeat left 3px; color: #3c5030; text-decoration: none;}
#sidebar .articlesBlock ul li a:hover {color: #000;}

#footer {background: url(../images/layout/bg-footer.gif) repeat-x; min-height: 137px; color: #c4db50;}
#footer > div {width: 976px; margin: auto;}
#footer .nav {float: left; font-size: 12px; line-height: normal; padding: 25px 0 0 5px;}
#footer .nav ul {margin: 0; padding: 0; list-style-type: none;}
#footer .nav ul li {display: inline;}
#footer .nav ul li a {color: #f4eed2; text-decoration: none; padding: 0 15px;}
#footer .nav ul li a:hover {color: #000;}
#footer .logo {float: right; padding: 30px 25px 0 0;}

/**
 * Layout Variations
 */
body.tier2 #page {background-image: url(../images/layout/bg-page-tier-2.gif)}
body.tier2 #page > div {background-image: url(../images/layout/bg-page-top-tier-2.gif)}

body.tier2 #title {left: -12px; margin-bottom: -4px; padding-bottom: 12px; background: url(../images/layout/bg-corner-left.gif) no-repeat left bottom;}
body.tier2 #title > div {background: #659fb5 url(../images/layout/bg-banner-left-blue.gif) no-repeat;}
body.tier2 #title > div > div {background: url(../images/layout/bg-banner-blue.gif) no-repeat right top;}
body.tier2 #title .title {float: none; width: 286px; padding: 0 1px 0 12px; background: url(../images/layout/bg-separator-blue.gif) no-repeat right 11px;}

body.teachers div.separator {background-color: #d5dca2;}
body.teachers #title > div {background: #c96f36 url(../images/layout/bg-banner-left-orange.gif) no-repeat;}
body.teachers #title > div > div {background-image: url(../images/layout/bg-banner-orange.gif);}
body.teachers #title .title {background-image: url(../images/layout/bg-separator-orange.gif);}

body.teal div.separator {background-color: #d5dca2;}
body.teal #title > div {background: #67b2a0 url(../images/layout/bg-banner-left-teal.gif) no-repeat;}
body.teal #title > div > div {background-image: url(../images/layout/bg-banner-teal.gif);}
body.teal #title .title {background-image: url(../images/layout/bg-separator-teal.gif);}

body.lightOrange #title > div {background: #d69238 url(../images/layout/bg-banner-left-light-orange.gif) no-repeat;}
body.lightOrange #title > div > div {background-image: url(../images/layout/bg-banner-light-orange.gif);}
body.lightOrange #title .title {background-image: url(../images/layout/bg-separator-light-orange.gif);}

/**
 * Home Page
 */
body.front #page > div {background-position: 0 0;}

body.front #content {width: 512px; padding: 12px 0 0 40px; font-size: 14px; color: #75836b;}
body.front #content .flash {width: 613px; margin: 0 -53px; z-index: 1;}
body.front #content h1 {margin: 0 0 20px 0; padding: 20px 0 30px 0; font-size: 12px; line-height: normal; border-bottom: solid 1px #eacfac;}

body.front #sidebar {float: right; width: 350px; margin: 0;}
body.front #sidebar .block {background: url(../images/layout/bg-corner-right.gif) no-repeat right bottom;}

/**
 * Corners
 */
div.rounded {position: relative; width: 100%; background: #fff url(../images/layout/corners/border.gif) repeat-x; color: #758969;}
div.rounded > div {width: 100%; background: url(../images/layout/corners/border.gif) repeat-y right top;}
div.rounded > div > div {width: 100%; background: url(../images/layout/corners/border.gif) repeat-x left bottom;}
div.rounded > div > div > div {width: 100%; background: url(../images/layout/corners/border.gif) repeat-y;}
div.rounded > div > div > div > div {width: 100%; background: url(../images/layout/corners/tlc.gif) no-repeat;}
div.rounded > div > div > div > div > div {width: 100%; background: url(../images/layout/corners/trc.gif) no-repeat right top;}
div.rounded > div > div > div > div > div > div {width: 100%; background: url(../images/layout/corners/brc.gif) no-repeat right bottom;}
div.rounded > div > div > div > div > div > div > div {background: url(../images/layout/corners/blc.gif) no-repeat left bottom;}
div.rounded .content {padding: 10px 20px 5px 30px;}
div.rounded .button {position: absolute; bottom: -15px; right: 30px;}

div.roundedGrey {background-color: #f1efe0;}
div.roundedGrey > div > div > div > div {background-image: url(../images/layout/corners/grey/tlc.gif);}
div.roundedGrey > div > div > div > div > div {background-image: url(../images/layout/corners/grey/trc.gif);}
div.roundedGrey > div > div > div > div > div > div {background-image: url(../images/layout/corners/grey/brc.gif);}
div.roundedGrey > div > div > div > div > div > div > div {background-image: url(../images/layout/corners/grey/blc.gif);}

div.roundedOrange {background: #d7963d; color: #fff;}
div.roundedOrange > div {background-image: url(../images/layout/corners/orange/border.gif);}
div.roundedOrange > div > div {background-image: url(../images/layout/corners/orange/border.gif);}
div.roundedOrange > div > div > div {background-image: url(../images/layout/corners/orange/border.gif);}
div.roundedOrange > div > div > div > div {background-image: url(../images/layout/corners/orange/tlc.gif);}
div.roundedOrange > div > div > div > div > div {background-image: url(../images/layout/corners/orange/trc.gif);}
div.roundedOrange > div > div > div > div > div > div {background-image: url(../images/layout/corners/orange/brc.gif);}
div.roundedOrange > div > div > div > div > div > div > div {background-image: url(../images/layout/corners/orange/blc.gif);}

div.roundedKaki {background: #eae0ba;}
div.roundedKaki > div {background-image: url(../images/layout/corners/kaki/border.gif);}
div.roundedKaki > div > div {background-image: url(../images/layout/corners/kaki/border.gif);}
div.roundedKaki > div > div > div {background-image: url(../images/layout/corners/kaki/border.gif);}
div.roundedKaki > div > div > div > div {background-image: url(../images/layout/corners/kaki/tlc.gif);}
div.roundedKaki > div > div > div > div > div {background-image: url(../images/layout/corners/kaki/trc.gif);}
div.roundedKaki > div > div > div > div > div > div {background-image: url(../images/layout/corners/kaki/brc.gif);}
div.roundedKaki > div > div > div > div > div > div > div {background-image: url(../images/layout/corners/kaki/blc.gif);}

div.roundedGreen {background-color: #aac05d;}
div.roundedGreen > div {background-image: url(../images/layout/corners/green/border.gif);}
div.roundedGreen > div > div {background-image: url(../images/layout/corners/green/border.gif);}
div.roundedGreen > div > div > div {background-image: url(../images/layout/corners/green/border.gif);}
div.roundedGreen > div > div > div > div {background-image: url(../images/layout/corners/green/tlc.gif);}
div.roundedGreen > div > div > div > div > div {background-image: url(../images/layout/corners/green/trc.gif);}
div.roundedGreen > div > div > div > div > div > div {background-image: url(../images/layout/corners/green/brc.gif);}
div.roundedGreen > div > div > div > div > div > div > div {background-image: url(../images/layout/corners/green/blc.gif);}

div.roundedQuote {position: relative; margin: 0 0 -15px 0; z-index: 1; padding: 0 0 34px 0; background: url(../images/layout/bg-callout-below.gif) no-repeat 500px bottom;}
div.roundedQuote > div {background-color: #d7963d;}

div.roundedQuoteGreen {background-image: url(../images/layout/bg-callout-below-green.gif); color: #fff;}
div.roundedQuoteGreen > div {background-color: #aac05d;}

div.roundedCallToAction .content {padding: 30px 20px 30px 30px;}

/**
 * Forms
 */
input[type="text"],
input[type="password"],
select,
textarea {font-family: Arial, Verdana, Sans-Serif; font-size: 12px; border: solid 1px #d3deab; padding: 4px;}

form.login {padding: 20px 0 10px 0;}
form.login label {display: block; padding: 0 0 8px 0;}
form.login input[type="text"],
form.login input[type="password"] {width: 210px; display: block; margin: 0 0 21px 0;}

#contact div.rounded {margin: 0 0 15px 0;}
#contact div.roundedQuote {margin: 0 0 -15px 0;}
#contact div.roundedKaki {margin-bottom: 40px;}
#contact div.separator {margin: 20px 0; height: 3px;}
#contact img.label {display: block; margin: 0 0 10px 0;}
#contact .grid > div {padding: 0 0 10px 0;}
#contact .grid .column {float: left; width: 220px;}
#contact .grid label {display: block; font-size: 14px;}
#contact input[type="text"] {width: 200px;}
#contact .products .column {float: left; width: 235px;}
#contact .labelField > div {padding: 0 0 10px 0;}
#contact .labelField .label {float: left; width: 90px; margin: 7px 0 0 0; text-align: right; padding: 0 20px 0 0;}
#contact .labelField .field {float: left; width: 420px;}
#contact textarea {width: 400px; margin: 0 0 30px 0;}

/**
 * Miscellaneous
 */
div.splitBanner {min-height: 126px; margin: 0 0 15px 0; background: url(../images/layout/bg-split-banner.gif) no-repeat; line-height: 18px; color: #54594f;}
div.splitBanner .left {float: left; width: 245px; padding: 20px 40px 5px 30px;}
div.splitBanner .right {float: left; width: 235px; padding: 20px 0 5px 30px;}
div.splitBanner ul.links {margin: 0; padding: 0; list-style-type: none; color: #c66529; font-size: 14px; line-height: 24px;}

div.filterList {width: 100%; padding: 15px 0 0 0; line-height: 18px;}
div.filterList .header {margin: 0 0 -10px 0; position: relative; z-index: 2;}
div.filterList .summary {float: left; width: 220px; padding: 0 30px 0 0; color: #54594f;}
div.filterList .filter {float: left; z-index: 1; width: 252px; height: 91px; padding: 15px 0 0 20px; background: url(../images/layout/bg-filter-box.gif) no-repeat;}
div.filterList .filter img.title {display: block; margin: 0 0 10px 0;}
div.filterList .filter select {padding: 0;}
div.filterList .section {width: 100%; padding: 15px 0 15px 0; border-top: solid 3px #d6e1b4;}
div.filterList .section .column {float: left; width: 240px; padding: 0 20px 0 0;}
div.filterList .section ul {margin: 0; padding: 0; list-style-type: none;}
div.filterList .section h4 {margin: 0; font-size: 12px; color: #4f6940;}
div.filterList .section a {color: #c66529; text-decoration: underline;}
div.filterList .section a:hover {color: #000;}
