/*   

MAIN.CSS
Contains:    Basic Template Layout and Universal Elements' Typography
For:         caring-unlimited.org
By:          Joe @ iBec Creative
             joe@ibeccreative.com
Created:     06-30-09 Joe
Last Edit:   09-18-09 JDB, 11-24-09 JDB

*/

/* import content css */
@import 'content.css';

/*   RESET.CSS Contains:   General CSS Resets  */
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input {	margin:0;padding:0; }
html {font-size:100.01%; height: 101%;}
/* links */
:link,:visited {text-decoration:none; }
a img,:link img,:visited img {border:none; }
/* lists */
ul {list-style:none; }
/* default type */
h1,h2,h3,h4,h5,h6,pre,code {font-size:1em;font-weight:normal; }
address {font-style:normal; }

/* -----  HTML & Body  ----- */
body { 
    height:100%;
    font-family:Arial,Verdana,Helvetica,sans-serif;
    font-size:12px;
    background:#b7bd9e;
    background:#fff;
    color:#606060;
}

/* -----  Wrap  ----- */
#wrap { position:relative; width: 911px; margin:10px auto;}

/* -----  Shades  ----- */
#shade-top,
#shade-bottom {
    position:relative;
    height:6px;
    width:911px;
    background-repeat:no-repeat;
    margin:0;
    padding:0;}
#shade-top { background-image:url('../images/bg-shade-top.png'); }
#shade-bottom { background-image:url('../images/bg-shade-bottom.png'); }
#shade-sides {
    position:relative;
    width:911px;
    background-image:url('../images/bg-shade-sides.png');
    background-repeat:repeat-y; }
    
/* -----  Main  ----- */
#main {
    position:relative;
    width:900px;
    margin:0 0 0 6px;
    padding:0;
    background:#fff;
    background-image:url('../images/bg-main.png');
    background-repeat:repeat-x; }
body.home #main { height:600px; }    
  
  
/* -----  Header  ----- */
/* (Includes buttons and search) */
#header {
    position:relative;
    height:55px;
    margin:0 20px;
    padding:0;}
    #header a {
        position:absolute;
        top:15px;
        left:0;
        display:block;
        text-indent:-5000px;}
    #header a#exit-site,
    #header a#clear-history { width:188px; height:38px;background-repeat:no-repeat;}
    #header a#exit-site{ background-image:url('../images/btn-exit-site.png');}
    #header a#clear-history {   background-image:url('../images/btn-clear-history.png'); left: 125px; }
    #header a#exit-site:hover,
    #header a#exit-site:active,
    #header a#clear-history:hover,
    #header a#clear-history:active { background-position:0 -38px; }
    #header a#hotline {
        top:18px;
        left:257px;
        width:301px;
        height:28px;
        background:url('../images/btn-hotline.png') no-repeat; }
        
    #header label,
    #header input { position:absolute; }
    #header label {
        top:27px;
        right:180px;
        font-size:11px;
        color:#7d7d7d; }
    #header input.text,
    #header input.submit { top:21px;display:block; border:1px solid #4d4c4c;}
    #header input.text {
        right:48px;
        height:19px;
        width:120px;
        background:url('../images/bg-search-input.png') no-repeat;
        padding:2px 3px 0 3px;}
    #header input.submit {
        right:24px;
        height:23px;
        width:25px;
        padding:0 1px 2px 1px;
        border-width:1px 1px 1px 0;
        background:#a37fa7;
        color:#fff;
        font:10px Verdana,'Times New Roman',Times,serif;
        cursor:pointer;}
    #header input.submit:hover { background:#976e9b; }
    
/* -----  Logo  ----- */
a#logo {
    position:relative;
    display:block;
    height:133px;
    width:459px;
    margin:60px 0 0 30px;
    background:url('../images/bg-logo.png') no-repeat;
    text-indent:-5000px;}
a#logo.small {
    height:105px;
    width:364px;
    margin-top:20px;
    background-image:url('../images/bg-logo-small.png');}
div#masthead-home {
    position:absolute;
    top:104px;
    right:119px;
    display:block;
    padding:2px;
    border:2px solid #a3a3a1;}
    div#masthead-home img { margin:2px; }
div#news-home {
    position:absolute;
    top:378px;
    right:117px;
    height:195px;
    width:176px;
    padding:0;
    margin:0;}
    div#news-home p {
        color:#af8a9b;
        font-size:11px;
        margin:6px 0;
        padding:0;
        line-height:15px; }

/* -----  Navigation  ----- */
ul#navigation {
    position:relative;
    list-style-type:none;
    margin:10px 0 0 38px;
    padding:0;}
    ul#navigation li {  float:left; position:relative; }
    .home ul#navigation li {  background-image:url('../images/bullet-triangle.gif') no-repeat;  padding:0 10px; }
        ul#navigation li a { 
            display:block;
            overflow:hidden;
            color:#606060;
            margin: 0 17px 0 0;}
        ul#navigation li a:hover,
        ul#navigation li a:active,
        ul#navigation li.current a { color:#2b2b2b; }
        
        ul#navigation li ul {
            position: absolute;
            width:260px;
            background:none;
            top: -999em;
            left: -999em;
            z-index:1000;
            margin:0 0 0 20px;
            list-style-type:disc;
            padding:0;}
        ul#navigation li.sfHover ul,
        ul#navigation li:hover ul{
            top: auto; 
            left: auto;
            z-index:1000;
            padding:0;}
            ul#navigation li.sfHover ul li,
            ul#navigation li:hover ul li {
                float:none;
                margin:9px 0; 
                background:none;
                padding:0;}
                ul#navigation li ul a { display:inline; margin:0; padding:0;}
/* -----  Footer  ----- */
#footer { position:relative; width:900px; margin:0 15px 35px 10px; }
    #footer ul {list-style-type:none; margin:10px 0 5px 0; padding:0; }
        #footer ul li { display:inline; }
            #footer ul li a { font-size:11px;margin:0 5px 0 4px; color:#606060; }
            #footer ul li a:hover,
            #footer ul li a:active { color:#2b2b2b; }
            #footer ul li.home a { margin-left:0; }
    #footer p { margin:0;padding:0; color:#2f2f2f; }
    #footer p.copyright { font-size:10px;color:#959494; margin-top:14px;}
        
/* -----  Classes  ----- */
.hidden { display:none; }
.clear { clear:both; }
.floatright { float:right; }
.floatleft { float:left; }
.aligncenter { text-align:center; }
.alignright { text-align:right; }