/* Master CSS for Catherine Freer authored by www.shellycooperdesign.com */

/* Universals */
html {height: 100%; background: transparent; padding: 0; margin: 0;}
body {background: #bbcab7 url('img/bg/bg-internal.jpg') no-repeat top center; height: 100%; margin: 0; padding: 0; position: relative;}
body.news {background: #ffffff url('img/bg/bg-internal.jpg') no-repeat top center; height: 100%; margin: 0; padding: 0; position: relative;}
.clear {clear: both; height: 1%;}
/* Colors */

.orange {color:#cd6701;}
.orange-lt {color: #ffcc99;}
.green-lt {color: #bbcab7;}
.green {color: #669966;}
/* Typography */
body {font: normal normal 14px/1.5em "Futura light", “Century Gothic”, AppleGothic, sans-serif; }
strong {font-weight: bold;}
em {font-style: italic;}
#nav a {text-decoration: none;}
a {outline: none; text-decoration: none; color:#377e37;}
a:hover {color: #cd6701;}
ul, ol {padding: 10px 0 10px 40px;}
ul li {list-style: none outside url('img/ico/bullet.jpg');}
ol li {list-style-type: decimal;}
h1 {color: #336633; font-size: 24px; font-weight: bold; padding: 10px 0 10px 20px;}
h2 {color: #5d482a; font-size: 18px; font-weight: bold; margin: 10px 0 10px 20px; border-bottom: 1px solid #bbcab7;}
h3 {color: #776d5f; font-size: 14px; font-weight: bold; margin: 10px 0 10px 20px; border-bottom: 1px solid #bbcab7;}
h5 {color: #336633; font: normal normal bold 1.2em "Arial Narrow", Arial, sans-serif;}
p {color: #333332; font-size: 14px; padding: 10px 0 10px 20px;}
ul.alt { padding: 0 0 0 20px; margin-bottom: 20px;}
ul.alt li {list-style-image: none; border-bottom: 1px dashed #bbcab7; padding: 6px 0;}
/* Containers */
.container {margin: 0 auto; padding: 0; position: relative; width: 705px; padding-left:0; padding-top: 20px;}
.branding {background: transparent url('img/catherine-freer.jpg') no-repeat top center; height: 104px; position: relative;}
.two-col-left {float: left; width: 320px; }
.two-col-right {float: right; width: 320px; }
/* Other Pages */
#nav ul {float: left;   padding: 118px 0 0 30px;}
#nav li {float: left; margin-left: 20px; list-style-image: none;}
#nav a {color: #fff; font-size: 12px; text-shadow:  2px 2px 5px #000; }
#nav a:hover {color: #2b422b; text-shadow:  1px 1px 0px #7ab97a;}
p#phone-number {color: #4f3c25; float:left; margin-top: 10px; margin-left: 10px; font-weight: bold;  text-shadow:  1px 1px 0px #cee0c9; padding: 0;}
ul.staff {padding: 0 0 0 20px;}
ul.staff li{list-style-image: none; clear: left;}
ul.staff div.image {background: transparent url('../img/staff/picture-frame.jpg') no-repeat top left; height: 161px; width: 150px; float: left; margin-right: 20px; position: relative;}
ul.staff div.image img {position: absolute; top: 18px; left: 21px;}
ul.staff h3 {margin:0; padding: 15px 0 0 0; border: none; }
ul.staff .title, ul.staff .location {margin: 0; padding: 0;}
ul.staff .location {font-size: 12px; font-style: italic;}
ul.staff p.bio{font-size: 12px; line-height: 1.3em; }

/* Nav current markers */
#about #nav li.about a, #programs #nav li.programs a, #serve #nav li.serve a, #staff #nav li.staff a, #success #nav li.success a, #admissions #nav li.admissions a, #contact #nav li.contact a {color: #2b422b; text-shadow:  1px 1px 0px #7ab97a; font-weight: bold;}
#subnav {background: transparent url('img/bark-lg.png') no-repeat top right; position: absolute; right: -60px; top: 9px; width: 275px; height: 257px;}
#subnav ul {padding: 20px 0 0 30px;}
#subnav ul li { margin-bottom: 10px; list-style-image: none;}
#subnav ul li a {color: #003300; font: italic normal bold 14px "Comic Sans MS", sans-serif; text-shadow:  2px 2px 2px #f6d68f;}
#subnav ul li a:hover {color: #003300; text-shadow:  2px 2px 2px #da9a52;}
#hero {background-color: #cd6701; width: 700px;}
#hero img {margin: 0; padding: 0;}
#hero h2 {color: #fff; padding: 0 0 10px 20px; margin: 0; line-height: normal; font: italic normal normal 12px helvetica, sans-serif;}
.content {margin-top: 20px; width: 650px; margin-left: 20px;}
#need-help {position: absolute; top: 0; right: 0px; width: 150px; height: 100px; background: transparent url('img/need-help.png') no-repeat top left;}
#need-help a {display: block; width: 139px; height: 94px;}
#footer {height: 127px; width: 800px; background: transparent url('img/bg/footer.png') no-repeat  top center; margin: 0 auto; position: relative; padding-top: 82px;  }
#footer p {text-align: center;}
#footer ul {margin-left: 65px;}
#footer ul li {display: inline; border-right: 1px solid #945306; list-style-image: none; padding: 0 8px 0 5px; font: normal small-caps bold 14px helvetica, sans-serif; }
#footer ul li.last {border: none;}
#footer ul li a {color: #fff; text-shadow: 1px 1px 1px #945306;}
#footer ul li a:hover {color: #6c3e08; text-shadow: 1px 1px 1px #ff7f00;}
/* Home Page */
body#home {background: #cd6701; background-image: none;}
#home .container {padding: 0;}
#home .branding {background-color: #799c6d; height: 134px; position: relative;}
#home p#phone-number {color: #4f3c25; float: right; margin-top: 20px; margin-right: 0; text-shadow:  1px 1px 0px #e57d15;}
#home #nav ul {float: middle; padding: 0;}
#home #nav li {float: middle; }
#home #nav a {color: #fff; font-size: 12px;}
#home #nav a:hover {color: #4f3c25; text-shadow:  1px 1px 0px #e57d15;}
#home .border {border: 2px solid #663301; margin-bottom: 10px;}
#home #tab-container {background-color: #799c6d;}
#home #tab-container ul {padding-left: 70px; position: absolute; top: 81px; z-index: 99; padding: 0 0 0 70px;}
#home #tab-container ul li {display: inline-block; background: transparent;}
#home #tab-container ul li a {display: block; height: 70px; margin-right: 10px;}
#home #tab-container ul li a#can {background: transparent url('img/home/nav/we-can-help.png') no-repeat top left; width: 166px; }
#home #tab-container ul li a#can:hover, #home #tab-container ul li a#can.active {background: transparent url('img/home/nav/we-can-help-hover.png') no-repeat top left;}
#home #tab-container ul li a#who {background: transparent url('img/home/nav/who-we-help.png') no-repeat top left; width: 190px; }
#home #tab-container ul li a#who:hover, #home #tab-container ul li a#who.active {background: transparent url('img/home/nav/who-we-help-hover.png') no-repeat top left;}
#home #tab-container ul li a#why {background: transparent url('img/home/nav/why.png') no-repeat top left; width: 226px; }
#home #tab-container ul li a#why:hover, #home #tab-container ul li a#why.active {background: transparent url('img/home/nav/why-hover.png') no-repeat top left;}
#home #tab-container div {background-color: #799c6d; height: 430px; position: relative;}
#home #we-can-help {background: #799c6d url('img/home/we-can-help.jpg') no-repeat top left; }
#home #who-we-help {background: #799c6d url('img/home/who-we-help.jpg') no-repeat top left; }
#home #why-choose {background: #799c6d url('img/home/why-choose.jpg') no-repeat top left; }
#home #tab-container div p {color: #fff; font-weight: bold; font-size: 20px; line-height: 1.2em; text-align: right; text-shadow: 2px 2px 5px #000; padding: 100px 0 0 90px; width: 300px;}
#home p.links {text-align: center; padding: 10px 0;}
#home p.orange-lt a {color: #ffcc99;}
#home p.orange-lt a:hover {color: #fff;  text-shadow:  1px 1px 0px #ab5703;}
#home p.white a {color: #fff; padding: 10px 0;}
#home p.white a:hover {background: transparent url('img/home/rollover.png') no-repeat center center; text-shadow:  1px 1px 0px #ab5703;}

/* form */

form {padding: 10px;}
form label {float:left; text-align: right; width: 200px; margin-right: 5px;  }
form label span {color: #000; font-weight: normal; font-size: 90%;}

form input {display: inline; width: 280px; padding: 5px; border: 1px solid #8c9bb7;}
form textarea {display: inline; width: 280px; padding: 5px;border: 1px solid #8c9bb7;}
form select {display: inline; width: auto; padding: 5px; border: 1px solid #8c9bb7;}
form p {margin-bottom: 10px; font-size: .9em;}
legend  {color: #336633; font: normal normal bold 1.3em "Arial Narrow", Arial, sans-serif; margin: 0; background-color: #fff;}
fieldset {margin: 1.5em 0 0 0; border: 1px dashed #666; padding: 10px 0 10px 0;}
form input.radio {width: auto; padding: 0; position: relative; left: 0; top: 5px; margin-right: 5px; margin-left: 0;border: 0; margin-bottom: 5px; }
form label.radio {float: none; text-align:left; }
form input.submit {padding: 5px; width: auto; background-color: #336633;font: normal normal bold 1em "arial narrow", arial, sans-serif; color: #fff; }