/* $Revision: 1.19 $ */ #media {width: 930px;} #media img {display: block;} /* moved actionsBox styles and icons to actionsBox.css */ #media #main p.author {margin-bottom: 10px; font-size: 92%; font-weight: bold; word-wrap: break-word;} #media #main p.premium em {position: absolute; left: -9999px;} #media #main p.premium cite {padding-right: 16px; background: url(http://p.webshots.net/images/icon/icon_premium_star_12x13.gif) no-repeat right;} #media #main p.author cite img {display: inline; padding: 1px; background: #fff; border: 1px solid #dedede; vertical-align: middle;} #media #main {float: left; width: 607px; overflow: hidden;} #photo {position: relative; margin: 0 auto 29px; padding: 10px; background: #fff; border: 1px solid; border-color: #dedede #c1c1c1 #c0c0c0 #dedede;} #photo #photo-frame {position: relative; margin: 0 auto;} #photo #photo-frame a {position: relative; display: block; width: 100%; height: 100%;} #photo #flash-image {position: absolute; top: 0; left: 0; width: 100%; height: 100%;} #photo #flash-image * {display: block; margin: 0 auto;} #media #main .shortcuts {position: absolute; right: 15px; bottom: -30px; background: url(http://p.webshots.net/images/grfk/grfk_photoIconLinks_bg.gif) no-repeat;} #media #main .shortcuts * {float: left;} #media #main .shortcuts ul {position: relative; left: 5px; padding-right: 5px; background: url(http://p.webshots.net/images/grfk/grfk_photoIconLinks_bg.gif) no-repeat right top;} #media #main .shortcuts ul li {width: 16px; height: 16px; line-height: 16px; padding: 6px 4px 7px;} #media #main .shortcuts ul li a {width: 100%; height: 100%; background-repeat: no-repeat; background-position: center; text-indent: -9999px; overflow: hidden;} #media #main .people-actions {display: inline-block; clear: both; padding-bottom: 10px; border-bottom: 5px double #d3d3d3;} #media #main .people-actions {display: block;} #media #main .people-actions p {margin-top: 6px; padding: 10px 0 3px; font-size: 94%; border-top: 5px double #d3d3d3; word-wrap: break-word;} #media .wrap1 {display: table; height: 507px; background: #fff; overflow: hidden; border: 1px solid #dedede; border-right: 2px solid #c0c0c0; border-bottom: 2px solid #c0c0c0;} #media .wrap1, #media .wrap1 * {float: none !important;} #media .wrap2 {width: 608px; display: table-cell; vertical-align: middle;} #media .wrap3 {text-align: center;} #media .wrap3 p {margin: 0 auto; font-size: 127%; color: #8b8b8b; padding: .5em 1.25em;} #media .wrap3 p strong {padding: 10px 0 10px 40px; color: #393939; background: url(http://p.webshots.net/images/icon/icon_error.gif) no-repeat left; font-size: 150%; font-weight: normal; text-transform: lowercase;} #media .wrap3 ul {margin-top: 1em; line-height: 2em;} #media .wrap3 p em {display: block; font-style: normal;} #media #video {height: 510px; margin-bottom: 10px;} #media #video * {float: left;} #media #video span {display: none;} #media #video .duration-error p {width: 58%;} #media #video .format-error p {width: 65%;} /* #media #video .in-process p strong {background-image: url(http://p.webshots.net/images/icon/icon_error.gif);} #media #video .duration-error p strong {background-image: url(http://p.webshots.net/images/icon/icon_error.gif);} #media #video .format-error p strong {background-image: url(http://p.webshots.net/images/icon/icon_error.gif);} #media #video .internal-error p strong {background-image: url(http://p.webshots.net/images/icon/icon_error.gif);} #media #video .no-flash p strong {background-image: url(http://p.webshots.net/images/icon/icon_error.gif);} */ #media #sidebar {position: relative; float: right; width: 298px;} #media .view-actions {display: inline-block; overflow: hidden; white-space: nowrap;} #media .view-actions {display: block;} #media .view-actions p {float: right; width: 95px; font: 120% arial, helvetica, verdana, sans-serif; color: #747474; overflow: hidden;} #media .view-actions p strong {color: #2b2b2b;} #media .view-actions p span {position: absolute; left: -9999px;} #media .view-actions a {display: block; font-family: arial, sans-serif;} #media .view-actions .thumb {position: relative; float: left; margin-right: 12px;} #media .view-actions .thumb .wrap {float: left; padding: 5px; background: #fff;} #media .view-actions .thumb .wrap a {position: relative; width: 75px; height: 75px; overflow: hidden;} #media .view-actions .thumb .wrap a img {position: absolute; top: 50%; left: 50%; font-weight: normal;} #media .view-actions .thumb .iter {display: block; clear: both; width: 75px; margin-left: 6px; font-size: 110%; font-weight: bold; text-align: center; text-transform: lowercase;} #media .view-actions .thumb .iter span {position: absolute; left: -9999px;} #media .view-actions .thumb .iter span.video {position: absolute; top: 68px; left: 6px; width: 75px; height: 13px; line-height: 13px; background: #212121 url(http://p.webshots.net/images/icon/icon_video_42x13.gif) no-repeat center; text-indent: -9999px; overflow: hidden;} #media .view-actions .first {margin-top: 6px;} #media .view-actions .fullalbum, #media .view-actions .fullsize, #media .view-actions .publish {float: right; clear: right; width: 98px; margin-bottom: 5px; background-repeat: no-repeat; background-position: 4px;} #media .view-actions .fullalbum a, #media .view-actions .fullsize a, #media .view-actions .publish a {padding-left: 27px;} #media .view-actions .thumb .wrap, #media #main #photo .wrap {border: 1px solid; border-color: #dedede #c1c1c1 #c0c0c0 #dedede;} #media #sidebar .mpu {margin-bottom: 23px;} #media #sidebar .textAd {clear:both; margin-bottom:12px} #media #sidebar .flag a {float: left; clear: both; margin: 15px 0 0 5px; padding-left: 22px; background: url(http://p.webshots.net/images/icon/icon_flag.gif) no-repeat left; font-size: 92%; text-transform: lowercase;} #modules {width: 100%; clear: both; padding-top: 5px; font-size: 94%; color: #000; background: url(http://p.webshots.net/images/grfk/grfk_modules_borders.gif) no-repeat; overflow: hidden;} #modules .last {position: relative; height: 5px; margin-top: -5px; background: url(http://p.webshots.net/images/grfk/grfk_modules_borders.gif) no-repeat 50% -45px; overflow: hidden;} #modules h3 {position: relative; z-index: 1; padding: 3px 10px 5px 28px; font-size: 110%; color: #fff; background: #a09f9f url(http://p.webshots.net/images/grfk/grfk_whiteArrow_down.gif) no-repeat 10px; border: 1px solid #707070; text-transform: lowercase; cursor: pointer;} #modules h3:hover, #modules h3.hover {text-decoration: underline;} html.js #modules h3.collapsed {background-image: url(http://p.webshots.net/images/grfk/grfk_whiteArrow_right.gif);} html.js #modules div.collapsed {position: static !important; margin: 0 !important; padding: 0 !important; height: 0 !important; min-height: 0 !important; border: none !important; overflow: hidden !important;} #modules h3.first {margin-top: -2px; border-top: none;} #modules h3 .new {float: right; display: block; width: 26px; font-size: 110%; background: url(http://p.webshots.net/images/icon/icon_new_26x11.gif) no-repeat left; text-indent: -9999px;} #modules #categories, #modules #dates, #modules #data, #modules #tags {padding: 13px 14px; background: #f3f3f3; border: 1px solid #c2c2c2; border-left-color: #c3c1c2; border-top: none; border-bottom: none;} #modules #categories p {margin-top: 10px; word-wrap: break-word;} #modules #categories a {display: block;} #modules dt {float: left; width: 40%; clear: left; text-transform: lowercase;} #modules dd {margin-left: 40%;} #modules #data {margin-bottom: 5px;} #modules #data dl {overflow: hidden;} #modules #data ul {margin-top: 10px; clear: both;} #overlay {position: fixed; top: 0; left: -9999px; width: 100%; height: 100%; background: url(http://p.webshots.net/images/bg/bg_overlay.png); z-index: 32767;} #invite-form {top: 25%; left: -9999px; width: 444px; padding: 10px; clear: left; background: #fff; border: 2px solid #aaa; z-index: 32767;} html.js #invite-form {position: fixed; clear: none;} html.invite-member #overlay {left: 0;} html.invite-member #invite-form {left: 50%; margin-left: -222px;} #invite-form h3, #invite-form label, #invite-form #close-form, #invite-form button {text-transform: lowercase;} #invite-form h3 {clear: both; font-size: 150%;} #invite-form p {margin: 10px 0;} #invite-form #close-form {float: right; padding-right: 15px; font-size: 92%; color: #f00; background: url(http://p.webshots.net/img/icon/icon_closewindow_9x9.gif) no-repeat right; text-decoration: underline; text-transform: lowercase; overflow: visible; border: none; cursor: pointer;} #invite-form #invite-to, #invite-form #invite-from {border: none;} #invite-form label {font-weight: bold;} #invite-form #close-form, #invite-form #send-invite {display: block; margin-left: auto;} #invite-form .note label {position: absolute; text-indent: -9999px;} #invite-form .note textarea {width: 100%;} #media .header {padding: 9px 0 12px;} #media .stats {clear: both; font-size: 92%; line-height: 1.5; padding: 12px 0;} #media h1, #media h2, #media .description {font-weight: normal; word-wrap: break-word; word-break: break-all; overflow: hidden;} #media h1, #media .header .other-info .views strong {font-weight: bold; color: #2b2b2b;} #media .header {display: inline-block; padding-left: 30px; font-family: arial, helvetica, sans-serif; color: #747474; background: url(http://p.webshots.net/images/icon/pictures_24x24.gif) no-repeat 0 9px; overflow: hidden;} #media .video .header {background: url(http://p.webshots.net/images/icon/film_strip_24x17.gif) no-repeat 0 10px;} #media .header {display: block;} #media .header ul {display: inline; padding-left: 5px;} #media .header ul li {display: inline-block;} #media .header ul li {display: inline;} #media .header ul li {display: table-cell;} #media .header ul li a {display: block; width: 20px; background-repeat: no-repeat; background-position: center; text-indent: -9999px; overflow: hidden;} #media .header .media-info {float: left;} #media .header .other-info {float: right; text-align: right; display: none; /* hidden for now */} #media .header .other-info .views {font-size: 120%;} #media .header .other-info .upgrade {font-size: 92%;} #media h1 {display: inline; font-size: 120%; font-family: arial, verdana, helvetica, sans-serif; word-wrap: break-word;} #media h2 {font-family: arial, sans-serif; font-size: 100%; color: #747474;} #media h2 a.premium {padding-right: 16px; background: url(http://p.webshots.net/images/icon/icon_premium_star_12x13.gif) no-repeat right;} #media h2 a.super {padding-right: 20px; background: url(http://p.webshots.net/images/icon/icon_super_prem_sm.gif) no-repeat right;} #media h2 em {position: absolute; left: -9999px;} #media .header span {font-weight: normal; color: #5d5b60;} #media .stats h3 {position: absolute; left: -9999px;} #media .stats li {padding-right: 2.5em;} #media .stats strong {font-size: 115%;} #media .stats * {display: inline;} #media .meta-info {display: block; position: relative; margin-bottom: 10px; padding-left: 63px; height: auto !important; height: 53px; min-height: 53px; overflow: hidden !important; overflow: visible; color: #4c4c4c;} #media .meta-info li {float: right; width: 295px; padding: 0;} #media .meta-info li.by {float: left; width: 230px;} #media .meta-info li.by img {position: absolute; top: 0; left: 0; width: 46px; height: 46px; padding: 2px; border: 1px solid #cbcdca; background: #fff;} #media .meta-info li.by div {display: block;} #media .nstats, #media .nstats strong {display: inline-block;} #media .nstats {display: block; clear: both; padding-top: 6px; font-size: 120%; color: #747474; background: #f6f2e6 url(http://p.webshots.net/images/bg/bg_dot.gif) repeat-x; overflow: hidden;} #media .nstats li {float: left;} #media .nstats li strong {display: inline; color: #2b2b2b; font: bold 100%/1.4 verdana, arial, sans-serif;} /* Transformations Popup */ .common-popup {position: absolute; top: -9999px; left: -9999px; width: 375px; font-size: 92%; z-index: 32767;} .common-popup .inner1 {display: inline-block; padding: 19px 28px 0; background: url(http://p.webshots.net/images/grfk/common_popup_top_375x1600.png) no-repeat;} .common-popup .inner1 {display: block;} .common-popup .inner2 {display: inline-block; position: relative; background: #f5f5f5;} .common-popup .inner2 {display: block;} .common-popup .inner3 {height: 32px; background: url(http://p.webshots.net/images/grfk/common_popup_btm_375x32.png) no-repeat; overflow: hidden;} .common-popup .title-bar {display: inline-block; position: relative; padding: 8px 10px; background: #dadada url(http://p.webshots.net/images/bg/bg_preview.gif) repeat-x; text-transform: lowercase;} .common-popup .title-bar {display: block;} .common-popup .title-bar h3 {font: normal 145% arial, sans-serif; padding: 0 0 0 30px; background: url(http://p.webshots.net/images/icon/rotate_22x18.gif) no-repeat left;} .common-popup .title-bar p {font-size: 100%;} .common-popup .title-bar button {display: inline-block; position: absolute; top: 50%; right: 10px; line-height: 1.4; margin-top: -.7em; padding-right: 17px; font-size: 100%; color: #a0a0a0; background: url(http://p.webshots.net/images/icon/icon_delete_off_14x14.gif) no-repeat right; border: none; overflow: visible; cursor: pointer; text-transform: lowercase;} html.js .common-popup .controls {float: right; width: 62px;} html.js .common-popup .controls * {float: left;} html.js .common-popup .controls li {width: 31px;} #transformations .controls legend {display: block; margin-bottom: 4px; color: #000; font: 86%/1 arial, helvetica, sans-serif; text-transform: lowercase;} html.js .common-popup .controls label, html.js .common-popup .controls input {position: absolute; left: -999em;} html.js .common-popup .controls label {width: 100%; height: 29px; background: url(http://p.webshots.net/images/btn/rotateflip_248x31.gif) no-repeat; text-indent: -9999px; cursor: pointer; overflow: hidden;} html.js .common-popup .controls label.hvr {position: static;} .common-popup .content {padding: 18px; border: 1px solid #e4e4e4;} .common-popup .controls fieldset {margin-bottom: 10px;} #apply-transformation {clear: both; display: block; width: 49px; height: 26px; margin-top: 8px; background: url(http://p.webshots.net/images/btn/apply_purple_98x26.gif) no-repeat; text-indent: -9999px; overflow: hidden;} #apply-transformation:hover, #apply-transformation.hover {background-position: right;} #rotate-right {background-position: 0 0;} #rotate-right:hover, #rotate-right.hover {background-position: -31px 0;} #rotate-left {background-position: -62px 0;} #rotate-left:hover, #rotate-left.hover {background-position: -93px 0;} #flip-horizontal {background-position: -124px 0; height: 31px;} #flip-horizontal:hover, #flip-horizontal.hover {background-position: -155px 0;} #flip-vertical {background-position: -186px 0; height: 31px;} #flip-vertical:hover, #flip-vertical.hover {background-position: -217px 0;} #transformation {width: 200px; height: 200px; line-height: 200px; background: #fff; border: 1px solid #ccc; text-align: center;} #transformation canvas {display: block; width: 100%; height: 100%;} #transformation img, #transformation span {position: absolute; left: -999em; top: -999em;} /* Crop */ body.crop #photo {background: #e5f5af;} body.crop #photo .shortcuts {clear: both;} /* force repaint in Safari 2 */ #crop-box, #crop-box *, body.cropping, body.cropping * {cursor: crosshair !important;} #crop-box {background: url(http://p.webshots.net/images/grfk/clear.gif);} #crop-box, #crop-box * {position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden;} #crop-box * {background: #000; opacity: .5; clip: rect(0 0 0 0);} /* base64 encoding of http://p.webshots.net/images/bg/50p_opacity_50x50.png */ #crop-box.macff * {background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAK3RFWHRDcmVhdGlvbiBUaW1lAFdlZCAzIE9jdCAyMDA3IDIyOjQ3OjI4IC0wNTAweZAolQAAAAd0SU1FB9cKBAIyMbkXieQAAAAJcEhZcwAAHsIAAB7CAW7QdT4AAAAEZ0FNQQAAsY8L/GEFAAAAVElEQVR42u3PAQ0AIAzAsINxrCODhXQK1jUzZz5ovx4AAYkHUgukFkgtkFogtUBqgdQCqQVSC6QWSC2QWiC1QGqB1AKpBVILpBZILZBaILVAan0DuUt9AOMy2VZ5AAAAAElFTkSuQmCC); opacity: 1;} body.cropped #crop-box .outline {border: 1px solid #fff; background: none; clip: rect(0 auto auto 0);} #crop-box .mask {clip: rect(0 auto auto 0);} #photo #crop-form {position: static;} html.js #crop-form {position: absolute;} #crop-form {display: inline-block; left: -999em; top: -999em; clear: left; overflow: hidden; font-size: 84%; text-align: left;} #crop-form {display: block; padding: 0 10px 12px;} #crop-form .header {float: left; height: 35px; overflow: visible; min-height: 35px; padding: 0 0 0 37px; color: #000; background: url(http://p.webshots.net/images/icon/scissors_30x32.gif) no-repeat 0 3px;} #crop-form > .header {height: auto;} #crop-form .header h3 {font: 1.8em/1.2 arial, helvetica, sans-serif;} #crop-form .header p {position: absolute; left: -999em; font: 1.1em/1.2 verdana, arial, helvetica, sans-serif;} html.js #crop-form .header p {position: static;} #crop-form fieldset {margin-top: 6px; clear: both; font-size: 1.1em;} html.js #crop-form fieldset {float: right; width: 121px; clear: none;} #crop-form button {float: left; width: 48px; height: 26px; margin-left: 10px; background: url(http://p.webshots.net/images/btn/applycancel_202x26.gif) no-repeat; text-indent: -9999px;} #crop-form #crop-apply:hover, #crop-form #crop-apply.hover {background-position: -48px 0;} #crop-form #crop-cancel {width: 53px; background-position: -96px 0;} #crop-form #crop-cancel:hover, #crop-form #crop-cancel.hover {background-position: -149px 0;} #crop-form {border: 1px solid #999; background: #f7f7f7;} html.js #crop-form {border: none; background: none;} #crop-form legend {display: inline;} html.js #crop-form legend {display: none;} html.js #transformations, #transformations #transformation, html.js #crop-form .data, html.js .controls p {position: absolute; left: -999em;} #transformations, html.js #transformations #transformation {position: static;}