/*-----------------------------------------------------------------------------cynthiajoba.com base stylesheetThis is slightly customized by browser, but since I hate hacks, I've madeit simply deliver the tweaked version.File:      cssbase.phpversion:   2.0author:    Bruce Kroezeemail:     bruce@kroozio.comwebsite:   http://cynthiajoba.com-----------------------------------------------------------------------------*//* =General-----------------------------------------------------------------------------*//* Remove padding and margin */* {    margin: 0;	padding: 0;}/* Put it back on certain elements */h1, h2, h3, h4, h5, h6, p, pre, blockquote, form, fieldset, table, ul {    margin: 1em 0;}/* Class for clearing floats */.clear {	clear:both;}/* Remove border around linked images */img {	border: 0;}/* =Typography-----------------------------------------------------------------------------*/html {    font-size: 100%; /* IE hack */}body {    font: 12px Arial, Helvetica, "Lucida Grande", "Lucida Sans", "Trebuchet MS", Tahoma, Verdana, sans-serif;    color: #333;}.titled {    line-height: 16px;}.less {    font-size:11px;}.lesser {    font-size:10px;}.lesser2 {    font-size: 10px;}#maincontent {    line-height: 16px;}/* =Headings-----------------------------------------------------------------------------*/h1 {    font-size: 15px;    color: #999;    font-weight: normal;    font-family: times, serif;}h2 {    color: #333;    font-size: 13px;}h3 {    font-size: 12px;}h4 {    font-size:12px;}h5 {    text-decoration: underline;    font-weight: normal;    font-size:12px;    margin: 0;    padding: 0;}/* =Links-----------------------------------------------------------------------------*/a {    text-decoration: none;    color: #6cc;    font-weight: bold;}/* =Branding-----------------------------------------------------------------------------*//* =Top Nav and Logo-----------------------------------------------------------------------------*/.logo {    width: 141px;    height: 100%;}#topNav {    background-image: url(../images/mainlogo.jpg);    background-repeat: no-repeat;    height: 77px;    padding-top: 8px;    height: 77px;}#topNav .logo {    margin-top: 3px;    float: left;}#topmenu {                         /* menu list container */    list-style-type: none;      /* disable the display of the list item bullets */    padding: 0px;               /* space within the list container */    position: static;           /* need this so that the z-index stuff works correctly */    background-color: #fff;     /* the default background color within the main menu container */    color: #000;                /* the default font color (not links) within the main menu container */    z-index: 20;                /* push the menu up in the layer order a bit so it isn't hidden behind anything */    /* Browser plug-ins like Flash or Quicktime may not allow you to overlap then with this menu! */    margin: 0px 5px 0px 0px;    float: right;    font-size: 11px;}#topmenu li {                      /* top-level menu element */    list-style-type: none;      /* disable the display of the list item bullets */    float: left;                /* this is to allow for the horizontal main menu */    background-color: #fff;     /* main menu item background color */    color: #000;                /* main menu item font color (not links) */    display: block;    width: 65px;   /* the width of each main menu item */    margin: 0;    padding: 0 0 0 0;    border: 1px solid #fff;    float: left;}#topmenu li#aboutmenu {    margin-right: 9px;}#topmenu ul {                     /* third-level (or greater) menu element list elements */    position: absolute;         /* this is so that it doesn't push that page content around on hover */    margin: 1px 0 0 0;                /* space around the list container */    padding: 0px;               /* space within the list container */    list-style-type: none;      /* disable the display of the list item bullets */    display: none;    width: 75px;   /* should be the same as #topmenu li width */    background-color: #fff;     /* sub-menu default background color */    /* border-top: #ccc solid 1px; */ /* the border around the sub-menu list */    color: #ccc;                /* sub-menu default font color (not links) */    z-index: 99;                /* want to be sure this is above the rest of the menu */}#topmenu ul li{                   /* second-level or greater menu element links */    background-color: #fff;     /* default background color for sub-menu container */    color: #000;                /* default font color (not links) for sub-menu container */    margin: 1px;                /* spacing between sub-menu containers */    padding: 0px;               /* This is for padding between menu items in the drop-downs */    width: 75px;               /* (padding*2) must be subtracted from #topmenu li width and set for this one, or borders won't display properly. */}#topmenu li a {                    /* top-level menu element links */    text-align: center;         /* text alignment in main menu item links */    display: block;    color: #333;    width: 65px;               /* set this to #topNav #topmenu ul width */    text-decoration: none;    font-weight: normal;}#topmenu ul a {                   /* all the other level menu link elements */    text-align: left;    padding: 1px;    margin: 0px;    width: 73px;   /* (padding*2) must be subtracted from #topmenu ul li width and set for this one, or borders won't display properly. */    display: block;}/* #topmenu li:hover, */#topmenu li.over {            /* top-level hovering properties */    display: block;    border: 1px solid #ccc;}#topmenu ul li a:hover,#topmenu ul li.over {             /* higher level hovering properties */    display: block;    margin: 0px;    padding: 1px;    background-color: #fff;    color: #75C4C5;}#topmenu ul ul{                   /* higher-level list containers */    display: none;              /* don't display by default */    position: absolute;    margin-left: 73px;         /* this should be the width of #topmenu ul li */    margin-top: -2em;           /* this will push the sub-menu up to the level of it's parent */}/* only non-MSIE browsers use this */#topmenu ul li>ul,#topmenu ul ul li>ul{    margin-top: -2em;           /* should be set to the same as #topmenu ul ul margin-top */}/* additional sub-menu levels in the next 2 blocks. (For up to 5 levels of drop menus) */#topmenu li.over ul ul,/* #topmenu li:hover ul ul, */#topmenu li.over ul ul ul,/* #topmenu li:hover ul ul ul, */#topmenu li.over ul ul ul ul,#topmenu li:hover ul ul ul ul,#topmenu li.over ul ul ul ul ul,#topmenu li:hover ul ul ul ul ul{    display:none;}#topmenu li.over ul,/* #topmenu li:hover ul, *//* #topmenu ul li:hover ul, */#topmenu ul li.over ul,/* #topmenu ul ul li:hover ul, */#topmenu ul ul li.over ul,#topmenu ul ul ul li:hover ul,#topmenu ul ul ul li.over ul,#topmenu ul ul ul ul li:hover ul{    display:block;    /* border: 1px solid #ccc; */}li>ul {    top: auto;    left: auto;}.content {                      /* This is used for the content that will appear below the menu */    clear: left;}/* =Main Nav-----------------------------------------------------------------------------*/#navwrapper {    text-align: center;    min-width: 754px;}#mainNav {    margin: 0px auto 5px auto;    width: 754px;    border: 1px solid #ccc;}#mainNav li a img {    border: none;}/* ---- Drop Down Menus ---- */#mainmenu{                         /* menu list container */    list-style-type: none;      /* disable the display of the list item bullets */    padding: 0px;               /* space within the list container */    position: static;           /* need this so that the z-index stuff works correctly */    background-color: #fff;     /* the default background color within the main menu container */    color: #000;                /* the default font color (not links) within the main menu container */    z-index: 20;                /* push the menu up in the layer order a bit so it isn't hidden behind anything */    /* Browser plug-ins like Flash or Quicktime may not allow you to overlap then with this menu! */    margin: 0px auto 5px auto;    padding: 0;    list-style: none;    height: 32px;    background: #fff;    text-align: center;}#mainmenu li{                      /* top-level menu element */    list-style-type: none;      /* disable the display of the list item bullets */    float: left;                /* this is to allow for the horizontal main menu */    background-color: #fff;     /* main menu item background color */    color: #000;                /* main menu item font color (not links) */    display: block;    width: 123px;               /* the width of each main menu item */    margin: 3px 0px 3px 0px;    /* margin: 0; */    padding: 0;    border: 1px solid #fff;    float: left;}#mainmenu ul {                     /* third-level (or greater) menu element list elements */    position: absolute;         /* this is so that it doesn't push that page content around on hover */    margin: 0px;                /* space around the list container */    padding: 0px;               /* space within the list container */    list-style-type: none;      /* disable the display of the list item bullets */    display: none;    width: 123px;               /* should be the same as #mainmenu li width */    background-color: #fff;     /* sub-menu default background color */    background-image: none;    border: #75C4C5 solid 1px;     /* the border around the sub-menu list */    color: #ccc;                /* sub-menu default font color (not links) */    z-index: 99;                /* want to be sure this is above the rest of the menu */}#mainmenu ul li{                   /* second-level or greater menu element links */    background-color: #75C4C5;     /* default background color for sub-menu container */    background-image: none;    color: #000;                /* default font color (not links) for sub-menu container */    border: 1px solid #75C4C5;    margin: 0;                  /* spacing between sub-menu containers */    padding: 3px;               /* This is for padding between menu items in the drop-downs */    width: 117px;               /* (padding*2) must be subtracted from #mainmenu li width and set for this one, or borders won't display properly. */}#mainmenu li a {                    /* top-level menu element links */    text-align: center;         /* text alignment in main menu item links */    display: block;    color: #333;    width: 123px;               /* set this to #topNav #mainmenu ul width */    height: 32px;    text-decoration: none;    font-weight: normal;}#mainmenu ul a {                   /* all the other level menu link elements */    text-align: left;    padding: 1px;    margin: 0px;    width: 115px;               /* (padding*2) must be subtracted from #mainmenu ul li width and set for this one, or borders won't display properly. */    display: block;    height: auto;    font-size: 12px;}/* #mainmenu a:hover, */                 /* top-level hovering properties */#mainmenu li.over {    display: block;}#mainmenu ul li a:hover,#mainmenu ul li.over            /* higher level hovering properties */{    display: block;    width: 115px;  /* should be set to the same value as #topNav #mainmenu ul li width */    margin: 0px;    background-color: #C6E7E7;    padding: 1px 0 1px 1px;}#mainmenu ul ul{                   /* higher-level list containers */    display: none;              /* don't display by default */    position: absolute;    margin-left: 117px;         /* this should be the width of #mainmenu ul li */    margin-top: -2em;           /* this will push the sub-menu up to the level of it's parent */}/* only non-MSIE browsers use this */#mainmenu ul li>ul,#mainmenu ul ul li>ul{    margin-top: -2em;           /* should be set to the same as #mainmenu ul ul margin-top */}/* additional sub-menu levels in the next 2 blocks. (For up to 5 levels of drop menus) *//*#mainmenu li:hover ul ul,#mainmenu li:hover ul ul ul,#mainmenu li.over ul ul ul ul,#mainmenu li.over ul ul ul ul ul{ */#mainmenu li.over ul ul,#mainmenu li.over ul ul ul,#mainmenu li.over ul ul ul ul,#mainmenu li.over ul ul ul ul ul{    display:none;}/* #mainmenu li.over ul,#mainmenu ul li.over ul,#mainmenu ul ul li.over ul,#mainmenu ul ul ul li.over ul,#mainmenu ul ul ul ul li.over ul{ */#mainmenu li.over ul,#mainmenu ul li.over ul,#mainmenu ul ul li.over ul,#mainmenu ul ul ul li.over ul,#mainmenu ul ul ul ul li.over ul{    display:block;}/* --- end dropdown -- */#mainNav li.fineart {    margin-left: 2px;}#fineart #mainNav .fineart a,#serenity #mainNav .serenity a,#music #mainNav .music a,#storytelling #mainNav .storytelling a,#licensing #mainNav .licensing a,#news #mainNav .news a {    cursor: default;    background-repeat: no-repeat;    color: #fff;}#fineart #mainNav li.fineart,#serenity #mainNav li.serenity,#music #mainNav li.music,#storytelling #mainNav li.storytelling,#licensing #mainNav li.licensing,#news #mainNav li.news {    cursor: default;    background-repeat: no-repeat;    color: #fff;}#mainNav #mainmenu li ul li a {    background-image: none;}#mainNav li.fineart a {    background-image: url(../images/buttons/cynthia.gif);}#mainNav li.fineart a:hover {    background-image: url(../images/buttons/cynthia-on.gif);}#mainNav li.serenity a {    background: url(../images/buttons/serenity.gif) 0 0;}#mainNav li.serenity a:hover {    background-image: url(../images/buttons/serenity-on.gif);}#mainNav li.music a {    background-image: url(../images/buttons/music.gif);}#mainNav li.music a:hover {    background-image: url(../images/buttons/music-on.gif);}#mainNav li.storytelling a {    background-image: url(../images/buttons/storytelling.gif);}#mainNav li.storytelling a:hover {    background-image: url(../images/buttons/storytelling-on.gif);}#mainNav li.licensing a {    background-image: url(../images/buttons/licensing.gif);}#mainNav li.licensing a:hover {    background-image: url(../images/buttons/licensing-on.gif);}#mainNav li.news a {    background-image: url(../images/buttons/news.gif);}#mainNav li.news a:hover {    background-image: url(../images/buttons/news-on.gif);}/* =Sub Nav-----------------------------------------------------------------------------*/div#subnav {    margin: 0 0 0 14px;}#subnav .desc {    float: left;    margin: 42px 0 15px 0;}#subnav .desc h1 {    font-family: Times, serif;    font-size: 17px;    color: #333;    margin: 0;}#subnav h2 {    font-family: Times, serif;    font-weight: normal;    font-size: 12px;    color: #999;    margin: 0 0 5px 0;}#subnav .links {    float: left;    padding-left: 10px;    margin: 55px 0 0 4px;    border-left: 1px solid #999;}#subnav ul {    list-style: none;    padding: 0;    margin: 0;    font-size: 10px;}#subnav ul li {    margin: 0 0 0 0;    background: url(../images/cyan-bullet.gif) no-repeat 0 50%;    padding-left: 10px;}#subnav ul li a:hover {    color: #6cc;}#subnav ul li.on a {    cursor: default;    font-weight: bolder;    color: #000;}#subnav ul li a {    color: #333;    font-weight: normal;}/* #subnav ul li.on a, */#subnav ul li.on a:hover,#subnav ul li a:hover {    color: #6cc}#subnav ul li.on a:hover {    cursor: default;}/* =Main Content-----------------------------------------------------------------------------*/body {    background-color: #333;    text-align: center;}div.pagecontent {    padding: 0px 0px 4px 0px;    width: 778px;    background-color: #fff;    margin: 0 auto;    text-align: left;    border-left: 11px solid #666;    border-right: 11px solid #666;}div.pagebody {    background: #fff url(../images/pagebody_swish.jpg) no-repeat;    min-height: 472px;    padding: 0px 10px 0px 38px;    position: relative;}/* for Internet Explorer *//*\*/* html div.pagebody {    height: 472px;}/**//* =Secondary Content-----------------------------------------------------------------------------*/.adtop {    background: #fff url(../images/shadetop200.gif) no-repeat;    height: 15px;}.adbot {    background: #fff url(../images/shadebot200.gif) no-repeat;    height: 15px;}.adbox {    background: #fff url(../images/shadeside200.gif) repeat-y;    margin-bottom: 10px;}.adbox p {    padding: 0px 10px 0px 87px;    margin-top: 0px;    font-size: 11px;}.adbox p.last {    margin-bottom: 0px;}.adbox img.icon {    float: left;    margin: 5px 0px 0px 20px;}.adbox h3 {    padding: 0 10px 0 87px;    margin: 3px 0 0 0;    font-family: Arial, Helvetica, "Lucida Grande", "Lucida Sans", "Trebuchet MS", Tahoma, Verdana, sans-serif;    font-weight: bold;    font-size: 11px;}.sidebox ul {    list-style-type: none;}.sidebox ul li {    background: url(../images/black-dot-sm.gif) no-repeat 0 5px;    padding-left: 10px;}/* =Footer-----------------------------------------------------------------------------*/#mainFooter {    font-size: 11px;    text-align: center;}#mainFooter .rights {    font-size:  10px;}/* =Forms-----------------------------------------------------------------------------*//* IE Hack */input,select,textarea {    font-size: 100%;}/* Removes fieldset borders. even on Opera 7 */fieldset {  border: 1px solid #fff;}#simpleform {    font-size: 12px;}#simpleform label {    display: block;}#simpleform select,#simpleform textarea,#simpleform input {    background-color: #fff;    margin: 2px 0 10px 0;    font-size: 12px;}#simpleform p {    margin-left: 0px;}.error {    color: red;}input.nobreak {    float: left;}label.nobreak {    padding-left: 20px;    padding-bottom: 5px;}/* =Tables-----------------------------------------------------------------------------*/table {    font-size: 100%;    border-spacing: 0;    border-collapse: collapse;}td {    text-align: left;	font-weight: normal;}/* =Misc 1-----------------------------------------------------------------------------*/.clear {    clear: both;}.contact {    line-height: 13px;}.spaced {    line-height: 13px;}.spaced2 {    line-height: 12px;}span.price {    font-size: 15px;    font-family: times, serif;}/* =Misc 2-----------------------------------------------------------------------------*/.narrow {    letter-spacing: -.5px;}.hidden {	display: None;}/*-----------------------------------------------------------------------------cynthiajoba.com sixty forty 2-col stylesheetFile:      css60-40.phpversion:   2.0author:    Bruce Kroezeemail:     bruce@kroozio.comwebsite:   http://cynthiajoba.com-----------------------------------------------------------------------------*//* =General-----------------------------------------------------------------------------*//* =Typography-----------------------------------------------------------------------------*//* =Headings-----------------------------------------------------------------------------*/h1 {    color: #999;    font-weight: normal;    font-family: times;    margin: 47px 0px 0px 12px;}h2 {    margin: 15px 0px 10px 32px;    padding: 0px;    color: #333;}img.quote {    margin-left: 4px;    clear: both;}#licensing img.quote {    margin-top: 10px;}img.quote2 {    margin-left: -2px;    clear: both;}img.quote3 {    margin: 8px 0 0 8px;    clear: both;}img.quote4 {    margin: 0;    padding: 0;}h4 {    margin: 15px 0px 10px 32px;    padding: 0px;    color: #333;}.mainbody h4 {    font-weight: bold;}h5 {    margin: 0 0 0 32px;    text-decoration: underline;    font-weight: normal;    padding: 0;}/* =Links-----------------------------------------------------------------------------*//* =Branding-----------------------------------------------------------------------------*//* =Main Nav-----------------------------------------------------------------------------*//* =Sub Nav-----------------------------------------------------------------------------*//* =Main Content-----------------------------------------------------------------------------*/#maincontent {    width: 390px;    line-height: 16px;    float: left;}#maincontent p {    padding: 0px 34px 0px 32px;}#maincontent p.header {    padding-bottom: 0px;    margin: 0;}#maincontent .mainbody ul {    margin: 0 0 25px 0;    padding: 0;    list-style: none;}#maincontent .mainbody ul li {    margin-left: 32px;    background: url(../images/black-dot.gif) no-repeat 0 50%;    padding-left: 10px;    font-size: 12px;}/* =Secondary Content-----------------------------------------------------------------------------*/#sidecontent {    float: right;    width: 340px;    padding: 0;}.sidetop {    background: #fff url(../images/shadetop340.gif) no-repeat;    height: 15px;}.sidebot {    background: #fff url(../images/shadebot340.gif) no-repeat;    height: 15px;}.sidebox {    background: #fff url(../images/shadeside340.gif) repeat-y;    margin-bottom: 10px;}.sidebox ul {    padding: 0px 10px 0px 22px;    margin: 0;    font-size: 12px;}.sidebox h3 {    font-size: 12px;    margin: 5px 0px 0px 18px;}.graytop {    background: #fff url(../images/grayboxtop.gif) no-repeat;    height: 20px;    margin: 0;    padding: 0;}.graybot {    background: #fff url(../images/grayboxbot.gif) no-repeat;    height: 14px;    margin: 0;    padding: 0;}.graybox {    background: #fff url(../images/grayboxside.gif) repeat-y;    margin: 0 0 0 32px;    width: 370px;    line-height: 13px;}.graybody {    margin: -6px 0 -8px 0;    padding: 0;}.graybox p {    margin: 0 0 20px -10px;}.graybox h3 {    font-size: 13px;    margin: 5px 0px 0px 18px;}img.sideimage {    margin: 52px 0px 0px 42px;}img.boximage {    margin: 52px 0px 0px 0px;}.sidebox p {    margin: 0 0 0 18px;    font-size: 12px;}.sidenobox {    margin: 0 0 5px 18px;}#adboxes {    margin: 0;    padding: 0;}#adboxes .adbox {    float: left;    width: 237px;    font-size: 12px;    background: #fff url(../images/shadeside230.gif) repeat-y;    margin: 0px 10px 0 -4px;}#adboxes .adbox .adtop {    background: #fff url(../images/shadetop230.gif) no-repeat;    height: 15px;}#adboxes .adbox .adbot {    background: #fff url(../images/shadebot230.gif) no-repeat;    height: 15px;}.adbox div.desc {    height: 160px;    margin: 0 0 0 0px;}.adbox h3 {    margin: 0px 0px 3px 87px;}#adboxes .adbox p {    margin: 0;}#adboxes img.button {    margin: 5px 0 0 85px;}#adboxes img.icon {    margin-top: 0px;}.adbox .adbody {    min-height: 135px;  }/* =Footer-----------------------------------------------------------------------------*//* =Forms-----------------------------------------------------------------------------*//* =Tables-----------------------------------------------------------------------------*/table {    margin: 0 0 0 32px;    font-size: 12px;    padding: 0;}td {    padding-right: 10px;}th {    font-weight: normal;    padding-right: 10px;}/* =Misc 1-----------------------------------------------------------------------------*/#cynthia #maincontent div.poem {    text-align: center;    color: #333;    line-height: 18px;    margin-top: 12px;    font-size: 13px;}#wish #maincontent p {    font-size: 12px;}#wish #maincontent div.poem {    font-family: times, serif;    margin-right: 0px;    font-size: 16px;}#corporate .mainbody {    margin-left: 10px;}.mainbody p {    font-size: 12px;}div.tweak10in {    margin-left: -17px;}cite {    float: right;    font-style: italic;    font-size: 12px;    padding: 0;    margin: 0;}#maincontent div.recommendation,#maincontent div.recommendation2 {    display: block;    margin-bottom: 40px;}#maincontent div.recommendation p {    font-style: italic;    font-size: 13px;    margin-bottom: 0px;}#maincontent div.recommendation2 p {    font-size: 12px;    font-style: italic;    margin-bottom: 0px;}#maincontent div.recommendation2 cite {    font-style: normal;    font-size: 12px;    padding-right: 25px;}#maincontent .disclaimer {    font-size: 9px;}#sidecontent div.sidenobox span.price {    font-size: 14px;    font-family: times, serif;}#sidecontent div.sidenobox p {    margin-bottom: 0px;}/* =Misc 2-----------------------------------------------------------------------------*/.presence {    background: url(../images/cd-icon.jpg) no-repeat 20px 0;}.serenity {    background: url(../images/serenity-icon.jpg) no-repeat 20px 0;}.corporate {    background: url(../images/clearvision-icon.jpg) no-repeat 20px 0;}#faq .question {}#faq .answer {    background-color: #f1f1f1;}#faq .openanswer {    background-color: #fff;}#faq h2 {    margin-left: 5px;}#maincontent div.faq {    line-height: 14px;}#maincontent div.faqsection {    padding: 0;    margin: 0 0 20px 0;}#maincontent div.faqsection h3 {    font-size: 12px;    font-weight: bold;    margin: 0 0 0 5px;    padding: 0;}#maincontent div.faq p.question {    font-size: 12px;    background: url(../images/cyan-arrow-r.gif) no-repeat 5px 5px;    padding: 0 0 0 26px;    margin: 0 0 0 0;    cursor: help;    text-indent: -13px;}#maincontent div.faq p.question:hover {    color: #75C4C5;}/*#maincontent div.faq p.question {    margin: 0;    padding: 0 0 0 13px;}*/#maincontent div.faq div.answer p,#maincontent div.faq div.openanswer p {    font-size: 12px;    padding: 0 5px 5px 5px;    margin: 0;}#maincontent div.active {    background-color: #f1f1f1;}#maincontent div.hidden {    display: none;}#maincontent div.active p.question {    backgroud: url(../images/cyan-arrow-d.gif) no-repeat 5px 5px;    color: #75C4C5;    font-weight: bold;}#faq .tweak {    margin-left: 28px;}#faq h2 {    font-size: 14px;}#storytelling .tweak {    margin-left: -10px;}#storytelling .quote {    margin-top: 10px;}#storytelling ol {    list-style: none;    padding: 0px 10px 0px 22px;    margin: 0;    font-size: 12px;    list-style: none;}.graybox ol li {    font-size: 12px;    text-indent: -12px;    padding-left: 12px;    margin-bottom: 20px;}div.ask {    text-indent: 0px;    padding-top: 20px;}#storytelling .quote {    margin-left: 0px;}