/*
Description:Main styles for DF Syndication (CPi brand UI).
$Date: 2010-02-03 23:36:25 -0800 (Wed, 03 Feb 2010) $
$LastChangedDate: 2010-02-03 23:36:25 -0800 (Wed, 03 Feb 2010) $
$Rev: 13623 $
$Author: rush $
*/
body {
    background-image: url(../img/layout/bg.gif);
    min-height: 1024px;
    width: 976px;
    margin: 0 auto;
}
#header-wrap {
    position: relative;
    height: 89px;
    width: 976px;
}
#header {
    background: url(../img/layout/header-bg.png) repeat-x;
    width: 921px;
    margin-left: 20px;
}
#header img {
    margin-left: -20px;
}
#header h1 {
    background: url(../img/layout/header-rt.png) top right no-repeat;
    position: absolute;
    top: 0;
    right: 0;
    width: 35px;
    height: 89px;
    text-indent: -999em;
    margin: 0;
    z-index: 1;
}
ul#nav {
    position: absolute;
    top: 9px;
    left: 331px;
    margin: 0;
    height: 33px;
}
#nav li {
    background: url(../img/layout/pipe.png) 0 51% no-repeat;
    float: left;
    height: 33px;
    list-style: none;
    text-indent: -9999em;
}
#nav li.first {
    background: none;
}
#nav a {
    background-image: url(../img/layout/nav.png);
    background-repeat: no-repeat;
    display: block;
    height: 33px;
}
#nav.in a {
    background-image: url(../img/layout/nav-in.png);
}
#navi1 a {
    background-position: -4px 0;
    width: 111px;
}
#navi1 a:hover, #navi1 a:focus, body#register-form #navi1 a {
    background-position: -4px -33px;
}
#navi2 a {
    background-position: -113px 0;
    width: 165px;
}
#navi2 a:hover, #navi2 a:focus, body#photographers-list #navi2 a {
    background-position: -113px -33px;
}
#navi3 a {
    background-position: -280px 0;
    width: 115px;
}
#navi3 a:hover, #navi3 a:focus, body#about #navi3 a {
    background-position: -280px -33px;
}
#navi4 a {
    background-position: -395px 0;
    width: 105px;
}
#navi4 a:hover, #navi4 a:focus, body#contact #navi4 a {
    background-position: -395px -33px;
}
#navi5 a {
    background-position: -500px 0;
    width: 101px;
}
#navi5 a:hover, #navi5 a:focus {
    background-position: -500px -33px;
}
/*
-----
*/
#navi6 a {
    background-position: 0px 0;
    width: 184px;
}
#navi6 a:hover, #navi6 a:focus {
    background-position: 0px -33px;
}
#navi7 a {
    background-position: -184px 0;
    width: 185px;
}
#navi7 a:hover, #navi7 a:focus {
    background-position: -184px -33px;
}
#navi8 a {
    background-position: -369px 0;
    width: 125px;
}
#navi8 a:hover, #navi8 a:focus {
    background-position: -369px -33px;
}
#navi9 a {
    background-position: -494px 0;
    width: 111px;
}
#navi9 a:hover, #navi9 a:focus {
    background-position: -494px -33px;
}
/* login
---------------------------
*/
#enter {
    position: absolute;
    top: 57px;
    left: 336px;
    clear: both;
    z-index: 2;
    width: 604px;
    color: #a4b0ba;
    font-size: 11px;
}
#login-msg {
    margin-top: 3px;
}
#enter input[type="text"], #enter input[type="password"] {
    background: #3a4a61;
    width: 130px;
    margin: 0 2px;
    padding: 3px 4px;
    border: 1px solid #0f151b;
    border-bottom-color: #3e4e5f;
    border-right-color: #3e4e5f;
    color: #8895a2;
    font-size: 11px;
}
#enter input[type="image"] {
    vertical-align: top;
}
#loginForm {
    width: 380px;
}
#loginForm label {
    margin-right: 7px;
    color: #6d7c8b;
    text-shadow: #000 1px -1px 3px;
    text-transform: uppercase;
}
#searchForm {
    position: absolute;
    top: 0;
    right: 12px;
}
#searchForm input[type="text"] {
    background-image: url(../img/layout/search.gif);
    background-position: 100% 50%;
    background-repeat: no-repeat;
    width: 188px;
}
#searchForm input#searchstring.focus, #enter input.focus {
    background: #fff;
    color: #333;
}
#enter p, #enter ul {
    float: left;
    margin: 0;
    padding: 0 1em 0 0;
}
#enter li {
    list-style: none;
    float: left;
    margin-top: 2px;
    padding: 0 10px;
    line-height: 1;
}
#enter li#settings-link {
    border: 1px solid #4b5a66;
    border-width: 0 1px;
}
body#profile #enter li#profile-link a, body#settings #enter li#settings-link a {
    color: #a4b0ba;
    cursor: default;
    font-weight: bold;
    text-decoration: none;
    text-shadow: #000 1px -1px 3px;
}
/* main areas
---------------------------
*/
#main {
    background: url(../img/layout/main-bg.png) repeat-y;
    position: relative;
    width: 976px;
}
#content {
    background: #484848;
    float: left;
    width: 904px;
    min-height: 595px;
    margin: 16px 0 16px 35px;
    border: 1px solid #666;
}
body#home #content {
    background: #1a1a1a;
    margin: 0 0 0 35px;
}
#primary {
    background: #1a1a1a;
    float: left;
    width: 683px;
    min-height: 595px;
    padding: 12px 0;
    border-right: 1px solid #666;
}
body.app #primary {
    width: 651px;
    padding: 12px 16px;
}
body#home #primary {
    background: #000;
    padding: 0;
    min-height: 605px;
}
#secondary {
    float: left;
    width: 220px;
}
body#home #secondary {
    background: #1a1a1a url(../img/layout/secondary-bg.gif) repeat-y;
    min-height: 595px;
}
#primary h2 {
    font-size: 1.5em;
}
#secondary h2 {
    color: #a3a3a3;
    font-size: 12px;
    text-shadow: #000 1px -1px 3px;
    text-transform: uppercase;
}
body#home #secondary h2 {
    margin-bottom: 8px;
    padding: 8px 0 0 11px;
    border: 0;
}
#secondary h2 a {
    background: url(../img/layout/arrow.png) 0 50% no-repeat;
    padding-left: 20px;
}
#secondary ul {
    margin: 0;
}
#secondary li {
    list-style: none;
}
#secondary div {
    border-bottom: 1px solid #666;
}
body#home #secondary div {
    position: relative;
    height: 300px;
}
body#home #secondary div#coming {
    border: 0;
}
#secondary #galleries table {
    margin-left: 10px;
    margin-top:0px;
    padding-top: 0px;
    width:200px;
}
table.galleries td {
    margin: 0;
    padding: 0 5px 0px 5px;
    vertical-align:top;
    height:132px;
}
table.galleries td p {
    margin: 0;
    font-size: 11px;
    text-align: center;
    line-height:1.2em;
}
table.galleries td p a {
    color: #7f7f7f;
}
table.galleries td p a:hover {
    color: #fff;
    text-decoration: underline;
}
table.galleries tr td img {
    margin: 0;
}
body#home #secondary div.frame, body#home #secondary div.matte {
    height: auto !important;
    margin: 0 auto;  /* center the div horizontally */
    white-space: nowrap; /* prevents line breaks */
    display: table;
    padding: 5px;
}
.frame {
    background: #0c0c0c;
    line-height: normal;
    text-align: center;
    border: 1px solid #333;
    border-bottom-color: #000 !important;
    border-right-color: #000;
}
.matte {
    background-color: #a5a5a5;
    font-size: 1%;
    border: 1px solid #404040;
    border-right-color: #7f7f7f;
    border-bottom-color: #c0c0c0 !important;
}
.frame img {
    display: block;
}
.frame a {
    border: 1px solid #4b4b4b;
    display: block;
    z-index: 20;
    border-bottom-color: #bebebe;
    border-right-color: #b2b2b2;
}
.frame a:hover {
    border: 1px solid #85b7d9;
}
.sidenav {
    position: absolute;
    bottom: 0;
    clear: both;
    margin:  0;
    padding: 0 10px;
    width: 200px;
}
.sidenav a {
    display: block;
    width: 25px;
    height: 25px;
    text-indent: -9999em;
    outline: 0;
}
.sidenav a#gal-prev {
    display: none;
/*  background: url(../img/layout/nav-minus.gif) 25% 50% no-repeat;
    float: left;
*/
}
.sidenav a#gal-next {
    display: none;
/*  background: url(../img/layout/nav-plus.gif) 75% 50% no-repeat;
    float: right;
*/
}
.sidenav a.inactive {
    cursor: default;
}
#secondary #coming ul {
    background: url(../img/layout/row-bg.png) no-repeat;
    position: relative;
    width: 196px;
    height: 85px;
    margin-left: 12px;
    padding-left: 7px;
    padding-bottom: 1px;
}
#coming li {
    float: left;
    width: 54px;
    height: 68px;
    margin: 4px 3px;
}
#coming li.msg {
    background: url(../img/layout/row-ft.png) no-repeat;
    float: none;
    position: absolute;
    z-index: 89;
    top: 50px;
    left: 1px;
    width: 188px;
    height: 20px;
    text-indent: -999em;
}
#coming li a {
    display: block;
    width: 54px;
    height: 68px;
    border: 1px solid #4b4b4b;
}
#coming li a:hover {
    border: 1px solid #3b9ed9;
}
/* info and contact
---------------------------
*/
#info {
    width: 906px;
    clear: left;
    margin-left: 35px;
}
#info p {
    color: #939393;
    font-size: .8333em;
    text-align: center;
}
#info p#first {
    padding-top: 10px;
}
#contact-info {
    background: url(../img/layout/contact-l.png) no-repeat;
    position: relative;
    height: 55px;
}
#contact-info ul {
    background: url(../img/layout/contact-bg.png) repeat-x;
    height: 55px;
    width: 906px;
    margin: 0 0 0 35px;
}
#contact-info li {
    list-style: none;
    float: left;
    padding: 12px 8px;
    font-size: .8333em;
    color: #89a2bc;
    letter-spacing: 2px;
}
#contact-info li a {
    color: #89a2bc;
}
#contact-info li#last {
    background: url(../img/layout/contact-r.png) no-repeat;
    position: absolute;
    padding: 0;
    right: 0;
    height: 55px;
    width: 35px;
    text-indent: -999em;
}
#footer {
    position: relative;
    clear: both;
    width: 870px;
    margin: -5px auto 0 auto;
    font-size: .75em;
    color: #979797;
}
#footer ul {
    list-style: none;
    position: absolute;
    top: 1px;
    right: -30px;
    text-align: center;
}
#footer li {
    float: left;
    padding: 0 12px;
    border-left: 1px solid #4B4B4B;
    line-height: 1;
}
#footer li.first {
    border: none;
}
/* search results
---------------------------
*/
.search h2 {
    display: none;
}
.search h3 {
    background: url(../img/layout/rule.png) no-repeat;
    width: 626px;
    height: 24px;
    margin-left: 30px;
    padding: 6px 10px 0 10px;
    font-size: .9167em;
}
.search p {
    margin-left: 12px;
    padding: 6px 12px 9px 6px;
    font-size: .8333em;
}
.thumb {
    list-style: none;
    min-height: 110px;
    width: 684px;
    margin: 15px 0;
    padding-top: 10px;
}
.thumb li {
    background: #000;
    position: relative;
    float: left;
    width: 129px;
    height: 129px;
    margin: 0 2px 31px 29px;
    padding: 1px;
    border: 1px solid #313131;
    color: #7f7f7f;
    line-height: normal;
    text-align: center;
    vertical-align: middle;
}
.thumb li a {
    display: block;
    width: 129px;
    height: 129px;
}
.search h3 {
    clear: left;
}
span.back {
    vertical-align: baseline;
}
.thumb li span {
    font-size: 10px;
    line-height: 2.2; /* create space b/w name and image box */
}

/* image resolutions
---------------------------
*/
span.badge {
    padding: 1px 4px;
    border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    color: #fff;
}
.thumb li span.badge {
    line-height: 13px;
    height: 13px;
    vertical-align: middle;
}
span.badge.res {
    position: absolute;
    bottom: 1px;
    left: 1px;
}
/* green for high-res */
.thumb li.hi-res {
    border: 1px solid #263723;
}
.hi-res span.badge {
    background: #31532c;
}
/* yellow for low-res */
.thumb li.lo-res {
    border: 1px solid #464600;
}
.lo-res span.badge {
    background: #7D7D20;
    color: #eee;
}

/* single image
---------------------------
*/
body#single .search {
    position: relative;
}
body#single .search p {
    line-height: 1;
    margin-bottom: 13px;
}
body#single .search h3 {
    background: url(../img/layout/rule-sm.png) no-repeat;
    width: 454px;
    margin: 0 auto;
}
body#single .search h3 span {
    position: absolute;
    right: 115px;
}
body#single .search h3 span a {
    padding: 0 1px;
}
    body#single .search h3 span.badge.res {
        position: static;
        bottom: auto;
        left: auto;
        margin-left: 4px;
    }
#single-img {
    background: #000;
    width: 627px;
    margin: 1.5em auto 0 auto;
    border: 1px solid #313131;
    text-align: center;
}
#single-img img {
    vertical-align: middle;
}
div.controls {
    background: #1a1a1a url(../img/layout/nav-button.png) no-repeat;
    position: absolute;
    top: 50px;
    width: 71px;
    height: 24px;
}
div.controls#back {
    left: 28px;
}
div.controls#next {
    right: 27px;
}
div.controls a {
    display: block;
    width: 71px;
    height: 21px;
    font-size: 11px;
    padding-top: 4px;
    text-align: center;
    text-transform: uppercase;
}
div.controls#back a {
    background: url(../img/layout/nav-arrow-left.png) 0 -1px no-repeat;
}
div.controls#next a {
    background: url(../img/layout/nav-arrow-right.png) 100% -1px no-repeat;
    text-align: left;
    padding-left: 19px;
    width: 52px;
}
div.controls#next a:hover {
    background-position: 100% -25px;
}
div.controls#back a:hover {
    background-position: 0 -25px;
}
div.controls.inactive a {
    color: #adadad;
}
div.controls.inactive a:hover {
    cursor: default;
    text-decoration: none;
}
div.controls.inactive#back a:hover {
    background-position: 0 -1px;
}
div.controls.inactive#next a:hover {
    background-position: 100% -1px;
}
.actions p {
    text-align: center;
}
.search #image-meta ul {
    list-style: disc;
    min-height: 0;
    width: auto;
    margin: 0 0 0 24px;
}
.search #image-meta li {
    background: inherit;
    float: none;
    width: auto;
    height: auto;
    margin: .25em 0;
    padding: 0;
    border: none;
    vertical-align: auto;
    text-align: left;
    font-size: .8333em;
}
.search #image-meta li li {
    font-size: 1em;
}
.search #image-meta li a {
    display: inline;
    width: auto;
    height: auto;
}
/* paging
---------------------------
*/
body#jobsearchresults .search {
    position: relative;
    padding-bottom: 3em;
}
div.paging {
    position: relative;
    margin: 0;
    padding: 0;
}
.paging a {
    background: #1a1a1a url(../img/layout/nav-button.png) no-repeat;
    display: block;
    position: absolute;
    top: 0;
    width: 71px;
    height: 24px;
    padding: 3px 0 0;
    font-size: 11px;
    text-align: center;
    text-transform: uppercase;
}
.paging .previous {
    left: 28px;
}
.paging .next {
    right: 27px;
}
.paging a.inactive {
    color: #adadad;
    cursor: default;
    text-decoration: none;
}
/* sidebar nav
---------------------------
*/
#secondary h2 {
    border-top: 1px solid #191919;
    border-left: 1px solid #191919;
    padding: 8px 0 8px 6px;
    margin: 0;
}
#secondary h2 a {
    background: url(../img/layout/arrow.png) 0 50% no-repeat;
    padding-left: 20px;
}
#secondary ul {
    display: none;
}
body#home #secondary ul {
    display: block;
}
#secondary div.open {
    background: #5b5b5b;
}
#secondary div.open h2 {
    border-left: 1px solid #303030;
}
#secondary div.open h2 a {
    background-image: url(../img/layout/arrow-down.png);
}
#secondary .open ul {
    display: block;
    padding-left: 2em;
    padding-bottom: 1em;
    border-left: 1px solid #303030;
}
#secondary .open li {
    background: url(../img/layout/bullet.png) no-repeat;
    margin-bottom: .5em;
    padding-left: 20px;
    font-size: .8333em;
}
#secondary .open p {
    display: block;
    margin: 0;
    padding-left: 2em;
    padding-bottom: 1em;
    border-left: 1px solid #303030;
    font-size: .8333em;
}
/* browse nav
---------------------------
*/
#browse {
    width: 683px;
    margin-left: 35px;
    padding: 12px 0 0 19px;
    color: #adadad;
    letter-spacing: 1px;
}
#browse p {
    float: left;
    font-size: .8333em;
}
#browse ul {
    float: left;
    margin: 0;
}
#browse li {
    float: left;
    list-style: none;
    padding: 0 16px;
    line-height: 1.1;
    text-transform: uppercase;
}
#browse li#celebrity-link {
    border-left: 1px solid #4b4b4b;
    border-width: 0 1px;
}
/* forms
---------------------------
*/
.account fieldset {
    padding: 1em;
    border-top: 1px solid #2f2f2f;
}
.account legend {
    padding: 0 6px;
    color: #6d7c8b;
    font-weight: bold;
    text-shadow: #000 1px -1px 3px;
    text-transform: uppercase;
}
.account label {
    display: block;
    float: left;
    clear: left;
    width: 165px;
    padding: 0 1em 0 0;
    text-align: right;
}
.account fieldset span {
    color: #666;
    font-size: .9167em;
}
.account #send p {
    margin-left: 177px;
}
/* messages
---------------------------
*/
#message {
    background: url(../img/message/alert-grey.png) 6px 6px no-repeat;
    margin: .25em 0 1em 0;
    padding: .5em .75em .5em 27px;
    border: 1px solid #989898;
    border-width: 1px 0;
}
#message.success {
    background: url(../img/message/message.png) 6px 5px no-repeat;
    border-color: #7cbe57;
}
#message.alert {
    background: url(../img/message/alert.png) 6px 5px no-repeat;
    border-color: #f5e180;
}
#message.error {
    background: url(../img/message/error.png) 6px 5px no-repeat;
    border-color: #d14126;
}
p.empty {
    background: url(../img/message/alert-grey.png) 6px 6px no-repeat;
    padding: .5em .75em .5em 27px;
}
body#home #message {
    float: left;
    width: 870px;
    margin: 16px 0 16px 35px;
}
#message ul {
    list-style: none;
    margin: 0;
}

/* lboxes
---------------------------
*/
#lbmanage {
    width: 624px;
    margin: 1em auto;
}
#lbmanage ul {
    margin: .5em 0;
}
.search #lbmanage p {
    margin: 0;
    padding: 0;
}
#lbmanage li {
    list-style: none;
    margin-left: 15px;
}
.search textarea {
    width: 94%;
    height: 75px;
}
body#lbox .thumb li {
    margin: 10px 18px 20px 10px;
    font-size: 0.8333em;
}
body#lbox .thumb li a {
    padding-bottom: 4px;
}
body#lbox .search form {
    width: 624px;
    margin: 1em auto;
}
body#lbox .search form p {
    margin: 1em 0;
    padding: 0;
}
body#lbox #message {
    width: 624px;
    margin: 0 auto 1em auto;
}
body#lbox #message p {
    margin: 0;
    padding: 0;
}
/* lightbox
---------------------------
*/
#imageDetails #caption li {
    font-weight:normal;
    list-style-type:none;
    padding-left:6px;
}
#numberDisplay {
    padding-top:8px;
    color:#333;
}
/* clear floats
---------------------------
*/
#main:after, #content:after, #contact-info ul:after, .search ul:after, #browse:after, #galleries ul:after, #enter:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
