body {
    background:#e6e6e6;
    outline:none !important;
    padding-top:0 !important;
    font-family:Helvetica, Arial, sans-serif;
    font-size:99%;
    color:#959595;
    margin-top:0;
}
h1,h2 {
   font-family:garamond;
   font-style:italic;
}
a, img {
    color:#959595;
    outline:none !important;
    border:none;
}
p {
    color:#717171;
    font-size:0.8em;
}

/*-- header style --*/
#header {
    margin:0 auto;
    width:100%;
    float:left;
}
#container-header {
    margin:0 auto;
    width:973px;
}

/*-- main nav --*/
.mainnav,#nav > ul {
    list-style:none;
    margin:0;
    padding:0;
    float:left;
    background:url(http://www.yographic.com/projects/joanroot/images/main-menu.gif) no-repeat;
    height:54px;
    width:973px;
}
div#nav {
    /*overflow:hidden;*/
    float:left;
}
#nav > ul > li {
    /*display:inline;
    float:left;*/
    position:relative;
}
#nav > ul > li > a {
    text-indent:-9999px;
    height:54px;
    display:block;
    float:left;
    z-index:100;
    overflow:hidden;
    position:relative;
}
#nav ul.sub-mainnav a {
    float:left;
    text-indent:-9999px;
    display:block;
}
#nav ul.sub-mainnav a#watercolor-sub {
    height:32px;
    width:100px;
    margin-left:-14px;
}
#nav ul.sub-mainnav a#watercolor-sub:focus, #nav ul.sub-mainnav a#watercolor-sub:hover {
    background:url(http://www.yographic.com/projects/joanroot/images/main-submenu.png) no-repeat -25px -32px;
}
#nav ul.sub-mainnav a#watercolor-sub.current {
    background:url(http://www.yographic.com/projects/joanroot/images/main-submenu.png) no-repeat -25px -32px;
}
#nav ul.sub-mainnav.current {
    display:inline !important;
}
#nav ul.sub-mainnav a#lithograph-sub {
    height:32px;
    width:100px;
    margin-left:-5px;
}
#nav ul.sub-mainnav a#lithograph-sub:focus, #nav ul.sub-mainnav a#lithograph-sub:hover {
    background:url(http://www.yographic.com/projects/joanroot/images/main-submenu.png) no-repeat -125px -32px;
}
#nav ul.sub-mainnav a#lithograph-sub.current {
    background:url(http://www.yographic.com/projects/joanroot/images/main-submenu.png) no-repeat -125px -32px;
}
#nav ul li a#about{
    width:154px;
}
div.nav-about{
    background:url(http://www.yographic.com/projects/joanroot/images/main-menu.gif) no-repeat 0 -55px;
    height:54px;
    width:154px;
    position:absolute;
    overflow:hidden;
    z-index:98;
}
#nav ul li a#about:focus, #nav ul li a#about:hover{
    background:url(http://www.yographic.com/projects/joanroot/images/main-menu.gif) no-repeat 0 -55px;
}
#nav ul li a#about.current{
    background:url(http://www.yographic.com/projects/joanroot/images/main-menu.gif) no-repeat 0 -55px;
}
#nav ul li a#paintings{
    width:168px;
}
div.nav-paintings{
    background:url(http://www.yographic.com/projects/joanroot/images/main-menu.gif) no-repeat -154px -55px;
    height:54px;
    width:168px;
    position:absolute;
    overflow:hidden;
    left:154px;
}
.nav-paintings{
    background:url(http://www.yographic.com/projects/joanroot/images/main-menu.gif) no-repeat -154px -55px;
}
#nav ul li a#paintings:focus, #nav ul li a#paintings:hover{
    background:url(http://www.yographic.com/projects/joanroot/images/main-menu.gif) no-repeat -154px -55px;
}
#nav ul li a#paintings.current{
    background:url(http://www.yographic.com/projects/joanroot/images/main-menu.gif) no-repeat -154px -55px;
}
#nav ul li a#worksonpaper{
    width:244px;
}
div.nav-worksonpaper{
    background:url(http://www.yographic.com/projects/joanroot/images/main-menu.gif) no-repeat -322px -55px;
    height:54px;
    width:244px;
    position:absolute;
    overflow:hidden;
    left:322px;
}
.nav-worksonpaper{
    background:url(http://www.yographic.com/projects/joanroot/images/main-menu.gif) no-repeat -322px -55px;
}
#nav ul li a#worksonpaper:focus, #nav ul li a#worksonpaper:hover{
    background:url(http://www.yographic.com/projects/joanroot/images/main-menu.gif) no-repeat -322px -55px;
}
#nav ul li a#worksonpaper.current{
    background:url(http://www.yographic.com/projects/joanroot/images/main-menu.gif) no-repeat -322px -55px;
}
#nav ul li a#lectureseries{
    width:239px;
}
div.nav-lectureseries{
    background:url(http://www.yographic.com/projects/joanroot/images/main-menu.gif) no-repeat -566px -55px;
    height:54px;
    width:239px;
    position:absolute;
    overflow:hidden;
    left:566px;
}
.nav-lectureseries{
    background:url(http://www.yographic.com/projects/joanroot/images/main-menu.gif) no-repeat -566px -55px;
}
#nav ul li a#lectureseries:focus, #nav ul li a#lectureseries:hover{
    background:url(http://www.yographic.com/projects/joanroot/images/main-menu.gif) no-repeat -566px -55px;
}
#nav ul li a#lectureseries.current{
    background:url(http://www.yographic.com/projects/joanroot/images/main-menu.gif) no-repeat -566px -55px;
}
#nav ul li a#contact{
    width:168px;
}
div.nav-contact{
    background:url(http://www.yographic.com/projects/joanroot/images/main-menu.gif) no-repeat -805px -55px;
    height:54px;
    width:168px;
    position:absolute;
    overflow:hidden;
    left:805px;
}
.nav-contact{
    background:url(http://www.yographic.com/projects/joanroot/images/main-menu.gif) no-repeat -805px -55px;
}
#nav ul li a#contact:focus, #nav ul li a#contact:hover{
    background:url(http://www.yographic.com/projects/joanroot/images/main-menu.gif) no-repeat -805px -55px;
}
#nav ul li a#contact.current{
    background:url(http://www.yographic.com/projects/joanroot/images/main-menu.gif) no-repeat -805px -55px;
}
.sub-mainnav-div {
    display:none;
    background: transparent;
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)"; /* IE8 */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);   /* IE6 & 7 */
    zoom: 1;
}
#nav ul div#worksonpaper-submenu-div {
    height:32px;
    width:249px;
    margin-left:-247px;
    position:absolute;
    display:inline;
    top:52px;
}
#nav ul ul {
    display:none;
}
#nav ul ul li {
    display:inline-block;
}
#worksonpaper-submenu {
    margin-left:-247px !important;
    background:url(http://www.yographic.com/projects/joanroot/images/main-submenu.png) no-repeat;
    height:32px;
    width:212px;
    top:52px;
    position:absolute;
}

/*-- header logo --*/
#logo {
    margin:0 0 0 20px;
    float:left;
}

/*-- footer --*/
div#footer {
    margin:0;
    width:100%;
    margin:0 auto;
}
div #container-footer {
    width:930px;
    margin:0 auto;
}
#container-footer p {
    font-size:0.6em;
    font-weight: bold;
    color:#666666;
}
#container-footer p em {
    font-style: normal;
}

/*-- content container --*/
#container-content {
    float:left;
    margin:0 auto;
    width:100%;
}
#container-content div#content {
    background:#b1b1b1;
    margin:0 auto;
    overflow:hidden;
    padding:0;
    width:973px;
}
#container-content #content div#inner {
    margin:35px 25px 15px;
    overflow:hidden;
}
div#frame-wrapper {
    background:#ffffff;
    padding:10px 30px 20px;
    /*float:left;*/
    margin:0 auto;
    overflow:hidden;
}

/*-- about page --*/
div#about-wrapper {
    /*height:522px;*/
    width:1846px;
    margin:0 auto;
    overflow:hidden;
    background:#ffffff;
}
div#aboutframe-wrapper {
    background:#ffffff;
    padding:10px 30px 20px;
    float:left;
    /*height:492px;*/
    width:863px;
}
#aboutframe-wrapper div#about-image {
    float:left;
    margin:0 10px 10px 0;
}
#aboutframe-wrapper div#about-content p {
    padding:0 0 5px;
    font-family:Arimo;
    line-height:1.7em;
}
#aboutframe-wrapper a#artist-statement {
    background:url(http://www.yographic.com/projects/joanroot/images/BtnArtistStatement_Spry.jpg) no-repeat;
    display:block;
    height:40px;
    width:164px;
    text-indent:-9999px;
}
#aboutframe-wrapper a#artist-statement:hover, #aboutframe-wrapper a#artist-statement:focus {
    background-position:0 -40px;
}
#aboutframe-wrapper div#artiststatement-content {
    margin-top:53px;
}
#aboutframe-wrapper div#artiststatement-content p {
    padding:0 0 5px;
    font:italic 1.3em/37px EB Garamond;
}
#aboutframe-wrapper div#artiststatement-image {
    float:left;
    margin:25px 20px 10px 0;
}
#aboutframe-wrapper a#backtoabout {
    background:url(http://www.yographic.com/projects/joanroot/images/BtnBackArtistStatement.jpg) no-repeat;
    display:block;
    height:41px;
    width:138px;
    text-indent:-9999px;
    float:right;
    margin:100px 15px 0 0;
}
#aboutframe-wrapper a#backtoabout:hover, #aboutframe-wrapper a#backtoabout:focus {
    background-position:0 -41px;
}

/*-- contact page --*/
#frame-wrapper div#contactform-content {
    float:left;
    margin:0 5px 0 0;
}
#frame-wrapper div#contactform-content h2 {
    font:italic 2.2em EB Garamond;
}
#frame-wrapper div#contactform-content ul {
    color:#aeaeae;
    font-size:0.9em;
    line-height:30px;
    font-family:Arimo;
    padding-left:32px;
}
#frame-wrapper div#contactform-content ul li span {
    color:#959595;
}
#frame-wrapper div#contactform-content > em {
    font:italic 1.5em EB Garamond;
}
#frame-wrapper div#contactform-content div#contact-info {
    float:right;
    font-style:italic;
    padding-left:37px;
}
#frame-wrapper div#contactform {
    float:right;
    width:304px;
    margin:50px 0 0 0;
    font-size:0.8em;
    font-family:Arimo;
}
#frame-wrapper div#contactform form div.formfield-div{
    height:50px;
    width:290px;
    margin-bottom:5px;
}
#frame-wrapper div#contactform form div#formfield-comment{
    height:284px;
}
#frame-wrapper div#contactform form label {
    float:left;
}
#frame-wrapper div#contactform form input[type=text] {
    width:300px;
    border:none;
    background:#f2f2f2;
    height:25px;
}
#frame-wrapper div#contactform form input[type=text]:hover, #frame-wrapper div#contactform form input[type=text]:focus {
    border-bottom:1px solid #b8b8b8;
}
#frame-wrapper div#contactform form textarea {
    width:300px;
    border:none;
    background:#f2f2f2;
    height:259px;
}
#frame-wrapper div#contactform form textarea:hover, #frame-wrapper div#contactform form textarea:focus {
    border-bottom:1px solid #b8b8b8;
    border-top:1px solid #b8b8b8;
}
#frame-wrapper div#contactform form div#sendbtn-container {
    margin:13px 0 0 0;
}
#frame-wrapper div#contactform-content div#contact-info p.contact-right {
    float:right;
}
#frame-wrapper div#contactform form #submit {
    background:url(http://www.yographic.com/projects/joanroot/images/btnContact_Send.jpg) no-repeat 0 0;
    display:block;
    height:41px;
    width:114px;
    text-indent:-9999px;
    border:none;
    outline:none;
}
#frame-wrapper div#contactform form #submit.sending {
    background:url(http://www.yographic.com/projects/joanroot/images/SendingGif.gif) no-repeat 0 0;
}
#frame-wrapper div#contactform form div#sendbtn-container {
    float:left;
}
#frame-wrapper div#contactform form div#error {
    margin-top:10px;
    float:right;
}
#frame-wrapper div#contactform form div#error p {
    color:red;
}
#frame-wrapper div#contactform form #submit:hover, #frame-wrapper div#contactform form #submit:focus {
    background-position:0 -41px;
    cursor:pointer;
}

/*-- picture frame pages --*/
div#picture-frame-wrapper {
    float:left;
    padding:10px 17px 20px;
}
div#frame a.picture {
    float:left;
    margin:3px;
}
div#frame a.picture:hover, div#frame a.picture:hover {
    outline:2px solid #e6e6e6 !important;
}
div#frame a.picture img {
    float:left;
}
#frame-wrapper div#thankyou img {
    margin:-10px 0 0 30px;
}

/*-- lecture series page --*/
div#lectureseries-div {
    margin:30px 40px;
}
div#lectureseries-div h1 {
    /*argin-bottom:10px;*/
    font-size:1.6em;
}
div#lectureseries-div h3 {
    font-family:garamond;
    font-style:italic;
}
div#lectureseries-div h4 {
    font-size:0.8em;
    margin:20px 0 0;
    font-weight:normal;
}
div#lectureseries-div h4 span {
    color:#29abe2;
    font-weight:bold;
}
div#lectureseries-div span.separator {
    background:url(http://www.yographic.com/projects/joanroot/images/LineSeparator.jpg) no-repeat;
    display:block;
    height:5px;
    width:600px;
    margin:20px 0 10px;
}
div#lectureseries-div ul {
    font-size:0.8em;
    list-style:none;
    margin-top:0px;
    padding-left:2px;
    line-height:22px;
}
div#lectureseries-div p {
    color:#959595;
    line-height:22px;
    margin:5px 0;
}
div#lectureseries-div p.series-summary {
    margin:0 0 0 2px;
}
div#lectureseries-div div#artist-list {
    float:left;
    margin-top:20px;
}
div#lectureseries-div div#artist-list div {
    float:left;
    margin-right:35px;
}
div#lectureseries-div div#artist-list h4 {
    margin:0 !important;
}

/*-- home page --*/
div#home-div-container {
    margin:0 auto;
    overflow:hidden;
    background:#999999;
}
div#home-div-container a.image-links {
    background-image:url(http://www.yographic.com/projects/joanroot/images/HomeGraphics.jpg);
    display:block;
    float:left;
    height:461px;
    width:295px;
    text-indent:-9999px;
    margin:10px 0 10px 10px;
}
div#home-div-container a#paintings {
    background-position:0 0;
    background-repeat:no-repeat;
}
div#home-div-container a#paintings:hover, div#home-div-container a#paintings:focus{
    background-position:0 -462px;
}
div#home-div-container a#lithograph {
    background-position:-612px 0;
    background-repeat:no-repeat;
}
div#home-div-container a#lithograph:hover, div#home-div-container a#lithograph:focus{
    background-position:-612px -462px;
}
div#home-div-container a#watercolor {
    background-position:-306px 0;
    background-repeat:no-repeat;
}
div#home-div-container a#watercolor:hover, div#home-div-container a#watercolor:focus{
    background-position:-306px -462px;
}

/*-- clears --*/
.clear-left {
    clear:left;
}
.clear-both {
    clear:both;
}