/*[fmt]1A20-1A0B-1*/
/*CSS Document*/
HTML {
    background-color: #FFFFFF;
}

BODY {
    color: #7F7F7F;
    background: #FFFFFF url(/img/design3/header_bgd.gif) repeat-x top;
    font-family: "Trebuchet MS";
    font-size: 13px;
    width: 100%;
}

A, A:visited {
    font-weight: normal;
    color: #77B600;
}

A:hover {
    color: #77B600;
}

H1 {
    font-family: verdana;
    color: #555555;
    padding: 0px;
    margin: 0.75em 0px;
    font-size: 122%;
    font-weight: normal;
    margin: 0.75em 0px;
}

H2 {
    font-family: verdana;
    color: #555555;
    padding: 0px;
    margin: 0.75em 0px;
    font-size: 122%;
    font-weight: normal;
    margin: 0.75em 0px;
}

H3 {
    font-family: verdana;
    padding: 0.5em 0px;
    margin: 0px;
    color: #7F7F7F;
    font-weight: bold;
    font-size: 92%;
}

H4 {
    padding: 0.4em 0px 0.4em 1em;
    margin: 0px;
    color: #000;
    font-family: "Trebuchet MS";
    font-size: 92%;
    background: #D0FF79;
}

H4 A, H4 A:visited, H4 A:hover {
    color: #000;
}

UL, LI {
    margin: 0px;
}

P {
    line-height: 1.4em;
    padding: 0px;
    margin: 0px 0px 1em;
    padding: 0px;
}

STRONG {
    font-weight: bold;
}

EM {
    font-weight: bold;
}

DD {
    margin: 0px;
}

FORM {
    width: auto;
    margin-right: 0px;
}

FORM DIV {
    padding: 0px;
}

FORM DIV.input {
    color: #666;
}

DL {
    width: 100%;
    /*[disabled]background:#333;*/
}

FIELDSET {
    border: 1px solid #CCCCCC;
    margin: 0px;
    padding: 1em;
}

FIELDSET LEGEND {
    font-size: 100%;
    color: #7F7F7F;
    padding: 0.5em 1em;
}

FIELDSET FIELDSET LEGEND {
    font-size: 100%;
}

LABEL {
    font-size: 100%;
    display: inline;
}

INPUT, TEXTAREA {
    width: auto;
    font-size: 100%;
    font-family: verdana;
    display: inline;
}

SELECT {
    font-size: 100%;
}

OPTION {
    font-size: 100%;
}

INPUT[type = submit] {
    font-size: 100%;
}

HR {
    width: 100%;
    text-align: center;
    color: #F0F0F0;
    clear: both;
    border: 0px solid #000000;
    background-color: #F0F0F0;
    height: 2px;
}

/*header*/
.header {
    margin: 0px;
    padding: 0px;
    height: 59px;
}

.header H1 {
    background: none;
    padding: 0px;
    margin: 0px;
}

.header H1 A, .header H1 A:hover, .header H1 A:visited {
    background: none;
    color: #FFF;
}

.header IMG {
    position: absolute;
    left: 55%;
    top: 45px;
}

/*content*/
.content {
    padding: 0px;
    margin: 0px 10%;
    overflow: visible;
    max-width: 974px;
}

.content DIV#story {
    min-height: 300px;
}

.content DIV#storyfooter {
    font-size: 108%;
    color: #7F7F7F;
    padding: 0.5em 1.5em;
    border-left: 1px solid #DFDFDF;
    border-right: 1px solid #DFDFDF;
    border-bottom: 1px solid #DFDFDF;
}

.right {
    text-align: right;
}

.content DIV#storyfooter H2 {
    background: #F0F0F0;
    padding: 0px;
    margin: 0px;
    font-size: 93%;
    font-weight: bold;
    color: #7F7F7F;
    line-height: 1.8em;
}

.content DIV#storyfooter H2 A, .content DIV#storyfooter H2 A:visited, .content DIV#storyfooter H2 A:hover {
    text-decoration: none;
    font-weight: normal;
}

/*-- bgd image for home page is set in default.ctp*/
.contents {
    border-left: 1px solid #DFDFDF;
    border-right: 1px solid #DFDFDF;
    border-top: 2px solid #F5F5F5;
    background: #FFFFFF;
    color: #7F7F7F;
}

.formfooter {
    background: #D3FE8A;
    margin-left: 30px;
    margin-bottom: 2em;
}

.formfooter P {
    padding: 10px 1em 2px;
}

.story {
}

.contents DT {
    color: #D0FF79;
    text-align: right;
    width: 8.5em;
}

.view DT, .view DD, .story DT, .story DD {
    line-height: 1.9em;
    font-weight: normal;
    margin: 0px;
    vertical-align: top;
    padding: 0px 8px;
}

.view DD, .story DD {
    margin-left: 10em;
    margin-top: -1.9em;
    background: #F0F0F0;
    color: #1D1D1D;
}

.roundedcontext {
    background: #77B600;
    margin: 30px 0px 0px 30px;
    color: #F0F0F0;
    font-weight: bold;
    font-family: Verdana;
    text-align: center;
}

#memberscontext.roundedcontext {
    background: #ED8D01;
}

.roundedcontext .homeintro {
    font-size: 116%;
    letter-spacing: -0.05em;
}

P.normal {
    font-weight: normal;
    text-align: left;
}

.homestory .intro {
    padding-top: 2.3em;
    margin-right: 2em;
    padding-left: 0.8em;
    min-height: 288px;
}

.homestory .siteintro {
    padding-top: 1.4em;
}

/*footer*/
#storyfooter {
    background: transparent url(/img/design3/footer_tr.gif) no-repeat right top;
}

#storyfooter LI {
    display: inline;
    margin-right: 0.75em;
    border-right: 1px solid #77B600;
    padding-right: 0.75em;
    line-height: 1.7em;
}

.roundfoot {
    background: #F0F0F0 url(/img/design3/footer_head.gif) repeat-x top;
}

#roundfoot {
    background: #F0F0F0 url(/img/design3/footer_tl.gif) no-repeat left top;
}

/*Notices and Errors*/
DIV.message {
    color: #7F7F7F;
    font-weight: normal;
    font-size: 100%;
    background: #D0FF79;
    /*fffacd*/
    border-bottom: 2px dashed #999;
    padding: 1.6em;
    margin: 0px;
    font-size: 122%;
}

DIV.error {
    color: #7F7F7F;
    font-weight: normal;
    font-size: 100%;
    background: #F9D1C5;
    /*fffacd*/
    border-bottom: 2px dashed #999;
    padding: 1.6em;
    margin: 0px;
    font-size: 122%;
}

P.error {
    font-family: Courier, monospace;
    font-size: 100%;
}

.notice {
    font-family: Courier, monospace;
    font-size: 100%;
}

PRE.cake-debug, PRE {
    font-size: 85%;
    z-index: 99;
    text-align: left;
}

DIV.cake-stack-trace {
    font-size: 85%;
}

DIV.cake-code-dump PRE, DIV.cake-code-dump PRE CODE {
    font-size: 85%;
}

.footer {
    clear: both;
    padding: 0px;
    text-align: right;
    background: #FFFFFF;
    /*url('/img/bgd_footer.gif')*/
    margin: 1em 15% 1em 0px;
}

.footer UL {
    margin: 0.5em 0px 1.5em;
    font-size: 85%;
}

.footer LI {
    display: inline;
}

.footer A, .footer A:visited {
    text-decoration: none;
    padding: 0px 0.5em;
}

.footer A:hover {
    text-decoration: underline;
}

/*site specific css*/
#mainnav {
    padding: 32px 0px 0.3em;
    margin-top: 27px;
    border-bottom: 3px solid #FBFBFB;
}

#mainnav A, #mainnav A:hover, #mainnav A:visited {
    text-decoration: none;
    padding: 1em 0.5em 0.2em 2.6em;
}

#mainnav UL {
    text-align: left;
}

#mainnav LI {
    display: inline;
    list-style-type: none;
    text-align: left;
}

#mainnav LI.current {
    color: #000;
}

#mainnav LI.members A, #mainnav LI.members A:hover, #mainnav LI.members A:visited {
    color: #ED8D01;
}

#mainnav LI.current A, #mainnav LI.current A:visited {
    color: #A6A6A6;
}

#mainnav LI.current A:hover {
    color: #7F7F7F;
}

.companyname {
    font-weight: bold;
    line-height: 1.1em;
}

.companyname .p1 {
    color: #AAA;
}

.companyname .p2 {
    color: #000;
}

.design4 .intro {
}

#design4nav {
    background: #C1C5C6;
    color: #FFF;
    width: 740px;
    text-align: right;
    text-shadow: #666 0px 0px 6px;
}

#design4nav A {
    color: #FFF;
    font-weight: bold;
}

#design4nav UL {
    line-height: 2.5em;
}

#design4nav LI {
    display: inline;
    margin-right: 10px;
    font-size: 116%;
    border-left: 1px solid #FFF;
    padding-left: 10px;
}

#design4nav LI .d4prefix {
    font-weight: bold;
    color: #5B5B5D;
    text-shadow: none;
}

#design4nav .first {
    border: 0px solid #000000 !important;
}

.homestory #design4nav {
    width: 100%;
    text-align: center;
    font-size: 85%;
    line-height: 1em;
    text-shadow: #666 0px 0px 6px;
}

.homestory .intro STRONG {
    font-size: 116%;
}

.homestory .intro STRONG A {
    font-weight: bold;
}

.registerbox {
    display: block;
    width: 280px;
}

.registerbox H3 {
    padding: 3px 1px 3px 30px;
    border-bottom: 1px solid #72B500;
    color: #77B600;
    font-size: 108%;
    background: url(/img/design4/chevron.png) no-repeat left center;
}

.registerbox P {
    padding: 1px 1px 4px 5px;
    background: #D5FE8B;
}

/*Keys detail*/
H3.personaldetails {
    background-image: url(/img/kgpg_identity.png);
}

H3.contactdetails {
    background-image: url(/img/contacts.png);
}

H3.medicaldetails {
    background-image: url(/img/health.png);
}

H3.donordetails {
    background-image: url(/img/donor.png);
}

H3.personaldetails, H3.contactdetails, H3.medicaldetails, H3.donordetails {
    color: #A6A6A6;
    margin: 0px;
    padding: 0.5em 0px;
    border-top: 1px solid #DFDFDF;
    background-color: #F5F5F5;
    background-repeat: no-repeat;
    background-position: 98% 50%;
}

UL.personaldetails {
    background: #F0F0F0;
    margin-left: 10em;
}

UL.personaldetails LI {
    line-height: 1.9em;
    padding: 0px 8px;
}

.quote {
    background: transparent url(/img/design3/quote.gif) no-repeat 10px 10px;
    padding-left: 20px;
    text-align: justify;
}

.unquote {
    background: transparent url(/img/design3/unquote.gif) no-repeat right bottom;
    padding-right: 25px;
}

.medicalnotes P, .medicalnotes BLOCKQUOTE {
    background-color: transparent;
}

.medicalnotes {
    background-color: #D0FF79;
    padding: 20px;
}

.medicalnotes P {
    padding: 0.75em 2.75em 0px 1em;
}

.profileimage {
    float: left;
    width: 10em;
    text-align: center;
    padding: 5px 0px 0px;
}

.view {
    background: #F0F0F0;
    color: #1D1D1D;
}

.intro .keys {
    background: #FFF;
}

.profilename {
    font-size: 122%;
}

.divided {
    border-top: 1px dashed #999;
    margin-top: 3em;
}

.todo {
    border-top: 1px dashed #999;
    margin: 0px;
    padding: 1em 1em 1em 3em;
    background: #EEE url(/img/messagebox_info.png) no-repeat 1em center;
}

.active {
    font-weight: bold;
}

.inactive {
    font-weight: normal;
}

DIV.keys DT {
    color: #7F7F7F;
    line-height: 1.9em;
}

DIV.keys H4 {
    color: #77B600;
    font-weight: bold;
}

/*login forms*/
.loginform {
    font-size: 92%;
    font-family: verdana;
    color: #FFFFFF;
    font-weight: bold;
    padding: 1em 1em 1.5em;
    text-align: center;
}

.loginform P, .loginform DIV {
    margin: 0px 0.5em;
}

.loginform LABEL {
    font-size: 93%;
    display: inline-block;
    color: #FFF;
    min-width: 3.5em;
    height: 2em;
}

.loginform DL {
    margin: 0px 0px 2em;
    padding-top: 0.4em;
    text-align: left;
}

.loginform DT, .loginform DD {
    font-size: 85%;
    line-height: 2.1em;
}

.loginform DT {
}

.loginform DD {
    font-weight: bold;
    margin-top: -2.1em;
    margin-left: 11em;
    text-align: left;
}

.loginform HR {
    border: 0px dashed #F3C37D;
    width: 100%;
    color: #F3C37D;
    background-color: #F3C37D;
    height: 1px;
}

.loginform DIV {
    padding: 1.6em 0em 0px;
}

.loginform DIV.submit {
    text-align: right;
    margin: 0px 2.9em 0.5em 0px;
}

.loginform DIV INPUT {
    padding: 5px 0px;
    background: transparent url(/img/design3/formfield_bgd.png) no-repeat left center;
    border: 0px solid #FFF;
    display: inline;
    width: 115px;
}

.loginform DIV.submit INPUT {
    font-size: 77%;
    font-weight: bold;
    color: #FFF;
    background: #77B600 no-repeat;
    border: none;
    padding: 0px;
    width: auto;
}

.loginform DIV.formfooter {
    font-size: 77%;
    text-align: right;
    padding: 1em 1em 2em 2em;
    margin: 5px;
}

.loginform A, .loginform A.visited, .loginform A:hover {
    margin: 0.5em 0px;
    padding: 0.4em;
    color: #FFFFFF;
    font-weight: bold;
    text-decoration: underline;
}

.loginform .homeintro {
    font-size: 116%;
    letter-spacing: -0.05em;
    color: #FFFFFF;
    font-weight: bold;
    padding-bottom: 0.6em;
}

.loginform .product {
    font-size: 116%;
    letter-spacing: -0.05em;
    color: #FFFFFF;
    font-weight: bold;
    margin-bottom: 1em;
    border-top: 1px dashed #D0FF79;
    border-bottom: 1px dashed #D0FF79;
    padding: 1.3em 0px;
}

.loginform .current {
    font-weight: bold;
}

.loginform DIV.keyid {
    text-align: right;
    margin: 1.4em 2.9em 1.4em 1.4em;
    padding: 0px;
}

.loginform UL {
    text-align: left;
    margin-top: 1em;
}

.loginform LI {
    margin: 1em 0px;
}

.loginform LI A {
    text-decoration: none;
}

/*body forms*/
.bodyform DIV {
    clear: none;
}

DIV.bodyform {
    clear: none;
}

.bodyform LABEL, .bodyform INPUT, .bodyform SELECT {
    display: block;
    width: 150px;
    float: left;
    margin-bottom: 0.5em;
}

.bodyform LABEL {
    text-align: right;
    width: 150px;
    padding-right: 1em;
    clear: left;
}

.bodyform INPUT, .bodyform TEXTAREA, .bodyform SELECT {
    clear: none;
    width: inherit;
}

.bodyform SELECT {
    width: auto;
}

.bodyform FIELDSET {
    margin: 1em 0px;
    padding: 0px 0px 15px;
    background: #F5F5F5 repeat-x top;
    border: 0px solid #000000;
    border-bottom: 1px solid #F0F0F0;
    border-right: 1px solid #F0F0F0;
    border-left: 1px solid #F0F0F0;
}

.bodyform DIV.submit {
    text-align: right;
    padding: 1em 35px;
}

.bodyform HR {
    width: 95%;
    margin: auto;
    height: 20px;
}

.bodyform TEXTAREA {
    width: 85%;
    margin-left: 2em;
}

.bodyform DL {
    padding: 1em 0px 0px;
    background-color: #D0FF79;
    border-bottom: 1px solid #77B600;
    margin: 0px 0px 1em;
}

.bodyform DD, .bodyform DT {
    line-height: 2.1em;
    color: #7F7F7F;
    font-weight: normal;
}

.bodyform DD {
    margin-top: -2.1em;
    margin-left: 11em;
    font-weight: bold;
}

.bodyform TH {
    font-weight: bold;
    color: #7F7F7F;
    border: none;
    padding: 0.5em;
}

.bodyform TD {
    color: #7F7F7F;
    border: none;
    padding: 0.5em;
}

.bodyform TABLE {
    border: none;
    margin-top: 1em;
}

.bodyform #shoppingcart .quantity {
    width: 3em;
}

.bodyform DIV.submit INPUT {
    width: auto;
    height: auto;
}

/*Members detail*/
HR.clearhr {
    border: none;
    height: 0px;
    color: #FFFFFF;
    background-color: #FFFFFF;
}

.content .boxinfo H4 {
    background: #D0FF79;
    color: #77B600;
    margin: 0px;
    padding: 5px 0px 5px 30px;
    border-top: 1px solid #DFDFDF;
}

.content .boxinfo DL DT, .content .boxinfo DL DD {
    color: #7F7F7F;
}

.profile_image {
    /*members page*/
    float: left;
    margin-left: 0.6em;
}

/*cakedebug*/
.cake-sql-log {
    /*display: none;*/
}

.cake-sql-log CAPTION {
    color: #FFF;
    background: #000;
}

/*content*/
.homehand {
    width: 163px;
    height: 268px;
    float: right;
}

.intro LI {
    margin: 0.3em 0px;
}

.story .keys {
    background: #FFF;
}

.story {
    padding: 2em;
}

.story UL {
    margin: 0px 0px 1em 2em;
}

.story LI {
    margin: 0.3em 0px;
}

.story H4 {
    margin: 0px 0px 0px 1.2em;
    background: #D3E369;
}

.intro H4 {
    margin: 0px 0px 0px 1.2em;
    background: #D3E369;
}

OL.getting_started {
    list-style-type: decimal;
    list-style-position: inside;
    margin: 1em 0px;
}

OL.getting_started LI {
    margin: 0.5em 0px;
    list-style-type: decimal;
}

OL.getting_started LI STRONG {
    font-size: 116%;
    margin-right: 0.2em;
}

.yui-gd .yui-u .yui-gforce .yui-u {
    width: 48.1%;
}

P.nodata {
    text-align: center;
    padding: 2em 0px;
}

/*shop*/
.price {
    font-size: 131%;
    margin-top: 0.5em;
    background: #F0F0F0;
}

.details A {
    display: block;
}

.details UL.cols LI {
    display: block;
    float: left;
    padding: 10px 15px 5px 0px;
}

.details UL.cols LI.last {
    display: block;
    float: none;
    width: 100%;
    clear: both;
}

.details UL.cols {
    display: block;
    clear: both;
}

A.enlarge {
    border-top: 2px dashed #72B500;
}

#cardform IMG.creditcard {
    float: right;
    margin-right: 1em;
}

#cvv DIV.imagery {
    vertical-align: middle;
    text-align: center;
}

#cvv DIV.cards {
    margin: 2em;
}

.adminmenu {
    padding: 1.6em 3em;
    text-align: right;
    position: absolute;
    right: 0px;
}

UL.products.cols LI {
    float: left;
    width: 210px;
    margin: 0px 25px 25px 0px;
    border-bottom: 4px solid #77B600;
}

UL.products.cols LI A {
    float: left;
    clear: both;
}

/*AJAX overlay div*/
#overlayer {
    display: none;
}

DIV.design4 DIV.intro {
    position: relative;
    min-height: 283px;
}

DIV.executive {
    background: url(/img/design4/executive.png) no-repeat 50% 11px;
    color: #444;
}

DIV.executive #container {
    background: #8B9DA4;
}

DIV.executive .leader {
    color: #888;
    font-weight: normal;
}

DIV.family {
    background: url(/img/design4/family.png) no-repeat 50% 11px;
    color: #525;
}

DIV.family #container {
    background: #7A6893;
}

DIV.water {
    background: url(/img/design4/water.png) no-repeat 50% 11px;
    color: #256;
}

DIV.water #container {
    background: #62A9BC;
}

DIV.xtreme {
    background: url(/img/design4/xtreme.png) no-repeat 50% 11px;
    color: #333;
    font-weight: bold;
}

DIV.xtreme .follower {
    width: 205px;
    left: 510px;
    position: absolute;
    z-index: 3;
    top: 87px;
    font-size: 93%;
}

DIV.xtreme #container {
    background: #7A6851;
}

DIV.leader {
    width: 210px;
    left: 28px;
    position: absolute;
    z-index: 3;
    top: 127px;
    font-size: 116%;
}

DIV.follower {
    width: 205px;
    left: 510px;
    position: absolute;
    z-index: 3;
    top: 36px;
    font-size: 93%;
}

DIV.follower STRONG {
    font-size: 123.1%;
}

/*YUI carousel*/
#container {
    font-size: 13px;
    left: 272px;
    top: 22px;
    height: 240px;
    background: #BBC;
    padding: 10px 10px 0px;
}

#container A {
    text-decoration: none;
}

#container .item {
    display: inline;
    float: left;
    overflow: hidden;
    width: 200px;
    height: 200px;
}

.yui-skin-sam .yui-carousel-nav {
    background: transparent;
    position: absolute;
    width: 200px;
    bottom: 0px;
}

.yui-skin-sam .yui-carousel-button {
    background: url(/img/design4/sprite.png) no-repeat 0 -600px;
    float: right;
    height: 19px;
    margin: 5px;
    overflow: hidden;
    width: 40px;
}

.yui-skin-sam .yui-carousel-nav UL LI {
    background: url(/img/design4/sprite.png) no-repeat 0 -650px;
    cursor: pointer;
    float: left;
    height: 9px;
    list-style: none;
    margin: 10px 0 0 5px;
    overflow: hidden;
    padding: 0;
    width: 9px;
}

.yui-carousel .yui-carousel-item-selected {
    border: 0px none #999;
    margin: 0px;
}

.yui-carousel-element LI {
    border: 0px solid #999;
    list-style: none;
    margin: 0px;
    overflow: hidden;
    padding: 0px;
    position: absolute;
    text-align: center;
}

.yui-skin-sam .yui-carousel, .yui-skin-sam .yui-carousel-vertical {
    border: 0px solid #999;
}

DIV.yui-carousel {
    /*[disabled]border-top:10px solid #999;*/
    /*[disabled]border-left:10px solid #999;*/
    /*[disabled]border-right:10px solid #999;*/
    background: #999;
    height: 240px;
    width: 220px;
}

DIV.design4 {
    padding: 1.4em;
}

form div {
    clear: none;
}
