/* -------------------------------------------------------------------------------- */ /* YUI reset.css */ /* -------------------------------------------------------------------------------- */ /* delete this */ body,div,dl,dt,dd,ul,ol,li, h1,h2,h3,h4,h5,h6,pre,form, fieldset,input,textarea,p, blockquote,th,td { margin: 0; padding: 0; } table { border-collapse: collapse; border-spacing: 0; } fieldset,img { border: 0; } address,caption,cite,code, dfn,em,strong,th,var { font-style: normal; font-weight: normal; } ol,ul { list-style: none; } caption,th { text-align: left; } h1,h2,h3,h4,h5,h6 { font-size: 100%; font-weight: normal; } q:before,q:after { content: ''; } abbr,acronym { border: 0; } /* -------------------------------------------------------------------------------- */ /* General iPhone page styles. */ /* -------------------------------------------------------------------------------- */ a { color: #0063DC; text-decoration: none; } a:active { background-color: inherit; } h2 { color: #000; font-size: 14px; font-weight: bold; } h3 { color: #000; font-size: 12px; font-weight: bold; } strong { font-weight: bold; } em { font-style: italic; } .grey { font-style: italic; color: #999; } .HighlightNew { padding: 1px 4px; background-color: #000; color: #fff; font-weight: bold; } .disabled { color: #999; } .plain { text-decoration: none; } .Butt { width: auto; padding: 10px; -moz-border-radius: 4px; -webkit-border-radius: 4px; background: #0063DC; border: none; font-family: inherit; font-size: 12px; font-weight: bold; color: #fff; text-shadow: rgba(0, 0, 0, 0) 0 -1px 0; text-overflow: ellipsis; text-decoration: none; white-space: nowrap; } .DeleteButt { background: #e40600; } .DisabledButt { background: #ddd; } .CancelButt { background: #6e6e6e; } .delete { color: red; } .hidden { color: #000; } .breaking-non-space { font-size: 0; } /* -------------------------------------------------------------------------------- */ /* Animation classes. */ /* -------------------------------------------------------------------------------- */ @-webkit-keyframes 'RtC' { from { left: 100%; } to { left: 0%; } } @-webkit-keyframes 'CtL' { from { left: 0%; } to { left: -100%; } } @-webkit-keyframes 'LtC' { from { left: -100%; } to { left: 0%; } } @-webkit-keyframes 'CtR' { from { left: 0%; } to { left: 100%; } } @-webkit-keyframes 'msgIn' { from { top: -30px; } to { top: 0; } } @-webkit-keyframes 'msgOut' { from { top: 0; } to { top: -30px; } } /* -------------------------------------------------------------------------------- */ /* Copyright (c) 2007, iUI Project Members. All rights reserved. Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met: * Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer. * Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution. * Neither the name of the iUI Project nor the names of its contributors may be used to endorse or promote products derived from this software without specific prior written permission. THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. */ /* -------------------------------------------------------------------------------- */ body { background: #fff; overflow-x: hidden; color: #000; font-family: Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 14px; -webkit-user-select: none; -webkit-text-size-adjust: none; min-width: 320px; } body > *:not(.toolbar) { display: none; position: absolute; margin: 0; padding: 0; left: 0; top: 81px; width: 100%; min-height: 336px; min-width: 320px; background: #fff; } body[orient="landscape"] > *:not(.toolbar) { min-height: 232px; } body > .hide-sub-nav { min-height: 361px; margin-top: -25px; background: #fff; } body[orient="landscape"] > .hide-sub-nav { min-height: 257px; } body > .hide-main-nav { min-height: 390px; margin-top: -54px; background: #fff; } body[orient="landscape"] > .hide-main-nav { min-height: 286px; } body > *[selected="true"] { display: block; } body > .toolbar { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; height: 81px; } /* -------------------------------------------------------------------------------- */ body > ul > li { position: relative; margin: 0; border-bottom: 1px solid #E0E0E0; padding: 8px 0 8px 10px; font-size: 20px; font-weight: bold; list-style: none; } body > ul > li.group { position: relative; top: -1px; margin-bottom: -2px; background: #f3f3f3; border-top: 1px solid #E0E0E0; font-size: 15px; font-weight: bold; color: #000; } body > ul > li.group:first-child { top: 0; border-top: none; } body > ul > li.group span { color: #888; font-weight: normal; } body > ul > li.title, body > ul > li.attribution, body > ul > li.description { position: relative; top: -1px; margin-bottom: -1px; padding: 10px 5px; background: #fff; font-weight: bold; color: #000; } body > ul > li > a { display: block; margin: -8px 0 -8px -10px; padding: 8px 32px 8px 10px; text-decoration: none; color: inherit; background: url(https://s.yimg.com/pw/images/iphone/sprite_photo_toolbar.png.v4) no-repeat right -249px; background-size: 24px 323px; } body > ul > li > a[selected="progress"] { background-image: url(https://s.yimg.com/pw/images/iphone/balls-24x12-trans.gif) !important; margin-right: 6px; background-size: 24px 12px; background-position: right center; background-repeat: no-repeat;} body > ul > li.pagination { overflow: hidden; padding: 5px; border-bottom: none; } body > ul > li.pagination a.pagination-next { float: right; min-width: 55px; min-height: 0; padding: 10px 15px; text-align: center; } body > ul > li.pagination a.pagination-prev { float: left; min-width: 55px; min-height: 0; padding: 10px 15px; text-align: center; } body > ul > li.pagination .pagination-info { position: absolute; display: block; top: 16px; left: 50%; width: 150px; margin-left: -75px; color: #999; font-size: 11px; text-align: center; } body > ul > li.pagination a[selected="progress"].Butt { background: #ddd url(https://s.yimg.com/pw/images/iphone/balls-24x12-trans.gif) no-repeat center center; text-indent: -9999em; background-size: 24px 12px; } /* -------------------------------------------------------------------------------- */ input { box-sizing: border-box; -webkit-box-sizing: border-box; width: 100%; margin: 8px 0 0 0; padding: 6px 6px 6px 44px; font-size: 16px; } input[type*="radio"], input[type*="checkbox"] { width: 16px; height: 16px; margin: 0; padding: 0; font-size: 16px; } /* -------------------------------------------------------------------------------- */ #preloader { display: none; background-image: url(https://s.yimg.com/pw/images/iphone/balls-24x12-trans.gif), url(https://s.yimg.com/pw/images/iphone/sprite_activity_icons.png.v6), url(https://s.yimg.com/pw/images/iphone/sprite_photo_toolbar.png.v4), url(https://s.yimg.com/pw/images/iphone/set_case.gif), url(https://s.yimg.com/pw/images/iphone/sprite_confirmation_icons.png.v2), url(https://s.yimg.com/pw/images/iphone/video_play_icon_large.png.v1), url(https://s.yimg.com/pw/images/iphone/icon_info_12.png.v2), url(https://s.yimg.com/pw/images/iphone/gallery_case.gif.v2), url(https://s.yimg.com/pw/images/iphone/set_case_small.gif.v3), url(https://s.yimg.com/pw/images/iphone/gallery_case_small.gif.v2); } /* -------------------------------------------------------------------------------- */ /* End of (very heavily) modified iUI styles. */ /* -------------------------------------------------------------------------------- */ /* -------------------------------------------------------------------------------- */ /* Header, nav and sub-nav styles. */ /* -------------------------------------------------------------------------------- */ #header.show-sub-nav { border-bottom: 1px solid #E0E0E0; } #header-top { overflow: hidden; margin-bottom: 4px; } #logo { float: left; height: 16px; overflow: hidden; padding: 5px 0 0 5px; } #global-loading { display: none; margin: -12px 0 0 128px; } #large-loader { position: absolute; top: 50%; left: 50%; width: 90px; height: 19px; margin: -12px 0 0 -64px; padding: 4px 3px 2px 35px; -moz-border-radius: 10px; -webkit-border-radius: 10px; background: #eee url(https://s.yimg.com/pw/images/iphone/balls-24x12-trans.gif) no-repeat 5px 6px; background-size: 24px 12px; color: #666; } #signedin { float: right; padding: 8px 5px 0; font-size: 11px; color: #999; } #signedin .signin-warning { position: relative; margin: -7px 0 0; padding: 4px 4px 4px 23px; background: #fffdd3; color: #000; } #signedin .signin-warning span.icon { position: absolute; top: 3px; left: 5px; display: block; width: 14px; height: 14px; background: url(https://s.yimg.com/pw/images/iphone/sprite_confirmation_icons.png.v2) no-repeat -20px 0; } #logo-link { display: block; width: 116px; height: 15px; background: url(https://s.yimg.com/pw/images/iphone/flickr-logo.png) no-repeat 0 0; background-size: 48px 15px; } .msg { display: none; position: fixed; top: -30px; left: 0; z-index: 10; width: 100%; height: 25px; padding-bottom: 2px; background: url(https://s.yimg.com/pw/images/iphone/sprite_confirmation_icons.png.v2) repeat-x 0 -35px; } .msg span { position: absolute; top: 6px; left: 7px; display: block; width: 14px; height: 14px; background: url(https://s.yimg.com/pw/images/iphone/sprite_confirmation_icons.png.v2) no-repeat 0 0; } .msg.confirm span { background-position: 0 0; } .msg.warn span { background-position: -20px 0; } .msg.info span { background-position: -40px 0; } .msg a.close { position: absolute; top: 0; right: 0; display: block; width: 100%; height: 100%; } .msg a.close span { position: absolute; top: 10px; left: 100%; display: block; width: 7px; height: 7px; margin-left: -15px; background: url(https://s.yimg.com/pw/images/iphone/sprite_confirmation_icons.png.v2) no-repeat -79px 0; } .msg p { height: 13px; padding: 7px 40px 5px 26px; background: #eee; font-size: 11px; color: #000; } .msg.info p { background-color: #dce8f6; } .msg.warn p { background-color: #fffdd3; } .msg.confirm p { background-color: #effad7; } #nav { position: relative; line-height: 14px; } #nav_main { height: 30px; color: #111; } #nav_main li { float: left; width: 25%; margin: 2px 0 0 -1px; background: #f3f3f3; border: 1px solid #e3e3e3; border-width: 0 0 1px 1px; text-align: center; } #nav_main li.first { border-left: none; } #nav_main li.selected { z-index: 10; margin-top: 0; margin-left: -2px; background: #fff; border-width: 1px; border-bottom: 1px solid #fff; font-weight: bold; } #nav_main li.last.selected { border-right: none; } #nav_main li a { display: block; padding: 6px 0 7px; } #nav_main li.selected a { padding-top: 7px; color: #000; } #nav_sub li { float: left; width: 50%; text-align: center; font-weight: normal; } #nav_sub li a { display: block; padding: 6px 0 5px; } #nav_sub li.selected a { color: #000; font-weight: bold; } #nav_sub li.first { left: 0; } #nav_sub li.last { left: 50%; } #nav_sub li.full { left: 0; width: 100%; } #nav_main li a[selected="progress"], #nav_sub li a[selected="progress"] { background: none !important; } .iphone-layout-dissabled .hide-sub-nav { margin-top:-25px; } /* -------------------------------------------------------------------------------- */ /* Universal footer styles. */ /* -------------------------------------------------------------------------------- */ .footer { clear: both; padding: 30px 0 10px; font-size: 10px !important; color: #999; text-align: center; } .iphone-layout-dissabled .footer { padding-top:0px; } .footer p { margin-bottom: 4px; } /* New styles to match the Style Guide. */ .footer.dark { padding-bottom: 0; } .footer-top { background-color: #313136; } .footer-bottom { background-color: #27272b; } ul.footer-top, ul.footer-bottom { min-height: 29px; padding-top: 15px; padding-left: 12px; overflow: hidden; } .footer.dark ul.footer-top li, .footer.dark ul.footer-bottom li { float: left; margin-right: 12px; margin-bottom: 12px; padding: 0; min-height: 0; font-size: 12px; } .footer.dark ul.footer-top li.pin-right, .footer.dark ul.footer-bottom li.pin-right { float: right; margin-right: 8px; margin-left: 12px; } .footer.dark ul.footer-top li a, .footer.dark ul.footer-bottom li a { color: #fff; margin: 0; padding: 0; min-height: 0; background: none; } body.mob_2014 .footer.dark a.mobile-app-cta, body.mob_2014 .footer.dark a.mobile-app-cta:active { position: static; margin: -10px 0; background: #1a79ed; padding: 8px; } /* Special iOS case: hide links in some situations */ body.no-footer-links .footer-links { display: none; } /* in some cases, hide iOS logout */ #ios-logout.hidden { display: none; } /* -------------------------------------------------------------------------------- */ /* Universal contact title styles. */ /* -------------------------------------------------------------------------------- */ .contact-title { position: relative; overflow: hidden; min-height: 20px; padding: 9px 34px 5px 5px; color: #000; font-weight: bold; font-size: 14px; } .contact-title img { float: left; margin-right: 5px; margin-top: -4px; } .contact-title a { display: inline; margin: 0; padding: 0; background: none; color: #0063DC; } .contact-title a.contact-more { display: block; position: absolute; top: 5px; right: 5px; width: 24px; height: 24px; min-height: 0; margin: 0; padding: 0; background: #f3f3f3 url(https://s.yimg.com/pw/images/iphone/sprite_photo_toolbar.png.v4) no-repeat center -188px; background-size: 24px 323px; } .contact-title a.contact-more-selected { background-position: center -213px; } .contact-title a.contact-more span { display: block; position: absolute; left: -999em; } .contact-title a[selected="progress"] { background: none !important; } .contact-title a.contact-more[selected="progress"] { padding: 0 4px; background: #f3f3f3 url(https://s.yimg.com/pw/images/iphone/balls-24x12-trans.gif) no-repeat center center !important; background-size: 24px 12px; } /* -------------------------------------------------------------------------------- */ /* Home page styles. */ /* -------------------------------------------------------------------------------- */ #home > div:not(.footer) { padding: 12px; } #home #launchHead { margin-bottom: 16px; } #home #greeting h2 { margin: 0 0 3px 5px; font-size: 20px; line-height: 20px; } #home #greeting small { display: block; margin-left: 6px; font-size: 11px; font-weight: normal; color: #999; } #home p { margin-bottom: 12px; } #home .loggedout p { padding: 8px; background: #eaf2fa; font-size: 12px; } #home .launch-warning p { position: relative; padding: 8px 8px 8px 32px; background: #fffdd3; font-size: 12px; } #home .launch-warning p span.icon { position: absolute; top: 10px; left: 10px; display: block; width: 14px; height: 14px; background: url(https://s.yimg.com/pw/images/iphone/sprite_confirmation_icons.png.v2) no-repeat -20px 0; } #home .footer p { margin-bottom: 4px; } #home .last-login-date { color: #999; font-size: 10px; } #home-nav { margin-bottom: 6px; } #home-nav li { overflow: hidden; margin-bottom: 2px; background: #eaf2fa; } #home-nav li.suggestion { background: #E0FDD1; } #home-nav li span { display: block; float: left; } #home-nav li span.New { margin: 3px 0 0 4px; padding: 0 3px 1px 3px; background: #FFE28A; color: #333; font: 8px Verdana, Arial, Helvetica, sans-serif; } #home-nav li a { display: block; overflow: hidden; padding: 12px 36px 12px 12px; background: url(https://s.yimg.com/pw/images/iphone/sprite_photo_toolbar.png.v4) no-repeat right -249px; background-size: 24px 323px; color: #444; font-size: 14px; } #home-nav li a[selected="progress"] { padding-right: 30px; margin-right: 7px; background-image: url(https://s.yimg.com/pw/images/iphone/balls-24x12-trans.gif) !important; background-size: 24px 12px; background-position: right center; } #home p.note { font-size: 11px; line-height: 11px; color: #999; } #home-color-legend { width: 20px; height: 12px; float: left; margin-right: 4px; background-color: #eaf2fa; } .loggedout #featured-photo { position: relative; } .loggedout #featured-photo h2 { position: absolute; top: 0; left: 8px; z-index: 2; padding: 6px; background: #fff; color: #000; font-size: 14px; text-align: center; opacity: .8; } .loggedout #featured-photo img { vertical-align: bottom; } .loggedout #featured-photo .main-image img { width: 296px; height: 197px; } .loggedout #featured-photo cite { position: absolute; bottom: 0; left: 8px; z-index: 2; padding: 5px 10px 5px 5px; background: #000; color: #fff; font-size: 12px; font-weight: bold; opacity: .8; } .loggedout #featured-photo cite a { color: #fff; } .loggedout #home-top { overflow: hidden; background: #f3f3f3; } .loggedout #home ul.button-nav { height: 34px; margin: 20px 0 0; } .loggedout #home ul.button-nav li { float: right; width: 50%; text-align: center; } .loggedout #home ul.button-nav li a.Butt { display: block; width: 145px; padding-left: 0; padding-right: 0; float: right; } .loggedout #home ul.button-nav li.last a.Butt { float: left; } .loggedout #home a.Butt[selected="progress"] { background: #ddd url(https://s.yimg.com/pw/images/iphone/balls-24x12-trans.gif) no-repeat center center; background-size: 24px 12px; text-indent: -9999em; } .loggedout #stats-strip { overflow: hidden; width: 280px; padding: 8px; background: #f3f3f3; font-size: 12px; } .loggedout #stats-strip form { overflow: hidden; margin: 4px 0 10px; } .loggedout #stats-strip form .form-field { width: 182px; float: left; margin: 0; padding: 5px; font-size: 18px; } .loggedout #stats-strip form .form-submit { display: block; width: 92px; float: left; margin: 0 0 0 6px; padding-left: 0; padding-right: 0; text-align: center; } .loggedout #stats-strip ul li { float: left; margin-right: 3px; } .loggedout #stats-strip ul li.tour { margin-right: 0; } .loggedout[orient="landscape"] #home > div:not(.footer) { overflow: hidden; } .loggedout[orient="landscape"] #home-top { position: relative; } .loggedout[orient="landscape"] #featured-photo { float: left; width: 50%; } .loggedout[orient="landscape"] #featured-photo h2 { font-size: 11px; } .loggedout[orient="landscape"] #featured-photo .main-image img { width: 100%; height: auto; /* width: 228px; height: 152px; */ } .loggedout[orient="landscape"] #home ul.button-nav { margin: 8px 0 32px; } .loggedout[orient="landscape"] #home ul.button-nav li { width: auto; } .loggedout[orient="landscape"] #home ul.button-nav li.last { padding-right: 8px; } .loggedout[orient="landscape"] #home ul.button-nav li.last a.Butt { float: right; } .loggedout[orient="landscape"] #stats-strip { float: right; width: 50%; padding: 8px 0; } .loggedout[orient="landscape"] #stats-strip form { padding: 0 8px; } .loggedout[orient="landscape"] #stats-strip form .form-field { width: 100%; } .loggedout[orient="landscape"] #stats-strip form .form-submit { float: right; margin: 8px 0 0; } .loggedout[orient="landscape"] #stats-strip ul { position: absolute; bottom: 8px; padding-left: 8px; font-size: 10px; } /* -------------------------------------------------------------------------------- */ /* Photo page styles. */ /* -------------------------------------------------------------------------------- */ .photo-page .photo-main { min-width: 320px; } .photo-page .contact-title { border-bottom: 1px solid #E0E0E0; } .photo-page .photo_container { display: block; margin: 5px; } .photo-page .photo_meta { padding: 5px; } .photo-page .photo_meta h2 { font-weight: normal; } .photo-page .photo_meta .description { font-size: 13px; } .photo-page .photo_meta .browse { font-size: 13px; } .description { margin: 10px 0; padding: 0; } .photo-page .copyright { margin-bottom: 15px; font-size: 11px; line-height: 16px; color: #999; } .photo-page .copyright .privacy img, .photo-page .copyright .license img { vertical-align: inherit !important; margin-bottom: -4px; } .photo-page .group-invites { margin-bottom: 36px; } .photo-page .group-invites .group-invite { min-height: 48px; margin-bottom: 10px; } .photo-page .group-invites .button-container { margin-top: 10px; } .photo-page .group-invites .button-container .Butt { display: block; float: left; margin-right: 4px; } .photo-page .group-invites .button-container a[selected="progress"] > span { visibility: hidden; } .photo-page h3 { padding: 5px; color: #000; font-size: 14px; } .photo-page .photo_comments_count span { font-size: 11px; padding-left: 10px; } .photo-page .comment { overflow: hidden; margin: 0 0 8px; padding: 5px 5px 0; } .photo-page .comment p, .photo-page .comment div { font-size: 13px; } .photo-page .comment small { display: block; margin-top: 3px; color: #999; font-size: 11px; } .photo-page .comment .img_block { position: absolute; width: 48px; height: 48px; background: #eee; } .photo-page .comment .meta_block { padding-left: 55px; } .photo-page .comment .meta_block h4 { margin-bottom: 3px; font-weight: bold; font-size: 13px; } .photo-page .comment .meta_block .photo_container { background: none; } .photo-page .comment .meta_block img.notsowide { height: auto; max-width: 250px; } .photo-page .group-invite { min-height: 48px; } .photo-page .photo_comments h3 { margin-top: 20px; } .photo-page .photo_comments h3.solo { margin-top: 0; } .photo-page .pagination { position: relative; overflow: hidden; margin-bottom: 10px; padding: 5px; } .photo-page .pagination a.pagination-next { float: right; min-width: 55px; padding: 10px 15px; text-align: center; } .photo-page .pagination a.pagination-prev { float: left; min-width: 55px; padding: 10px 15px; text-align: center; } .photo-page .pagination .pagination-info { position: absolute; display: block; top: 15px; left: 50%; width: 150px; margin-left: -75px; color: #999; font-size: 11px; text-align: center; } .photo-page .pagination a[selected="progress"].Butt { background: #ddd url(https://s.yimg.com/pw/images/iphone/balls-24x12-trans.gif) no-repeat center center; background-size: 24px 12px; text-indent: -9999em; } .paging_div { padding:10px; } .paging_more_div { float: right; padding: 10px; color: #fff; -moz-border-radius: 8px; -webkit-border-radius: 8px; background-color: #0063DC; border: none; } .paging_info_div { float:left; padding:10px; } .paging_loading_div { display:none; float:right; padding:10px; } .photo_top_container { overflow: hidden; } .photo_container { position: relative; background: #eee; } .photo_container a .main_photo_overlay { display: none; } .photo_container a[selected="progress"] .main_photo_overlay { display: block; position: absolute; top: 50%; left: 50%; width: 35px; height: 26px; margin:-13px 0 0 -18px; -moz-border-radius: 6px; -webkit-border-radius: 6px; background: #fff url(https://s.yimg.com/pw/images/iphone/balls-24x12-trans.gif) no-repeat center center; background-size: 24px 12px; } .photo_container a .main_video_overlay { display: block; position: absolute; top: 50%; left: 50%; width: 66px; height: 38px; margin: -19px 0 0 -33px; background: url(https://s.yimg.com/pw/images/iphone/video_play_icon_large.png.v1); background-size: 66px 38px; } .photo_container .pc_link img { position:absolute; border:none; } .pc_iphone_list .pc_link img { bottom:0px; left:2px; width:10px; height:10px; } .pc_m .pc_link img { bottom:2px; left:4px; width:22px; height:15px; } .action-thumb .pc_link img { bottom: 5px; left: 7px; } .photo_container .video-re-encoding { position: absolute; top: 0; right: 0; bottom: 0; left: 0; padding: 85px 10px 10px; background: #000 url(https://s.yimg.com/pw/images/progress/balls-24x12-black.gif) no-repeat center 65px; background-size: 24px 12px; color: #fff; text-align: center; font-size: 11px; } /* Photo nav (next/prev). */ .pro-icon { padding: 0 10px; line-height: 12px; background: url(https://s.yimg.com/pw/images/iphone/sprite_photo_toolbar.png.v4) no-repeat center -169px; background-size: 24px 323px; } .photo_nav { float: right; width: 65px; margin-top: 5px; margin-right: 5px; } .photo_nav > a { display: block; height: 65px; margin: 0 0 5px; padding: 0; background: #eee; } .photo_nav .next_photo_overlay { display: block; width: 65px; height: 65px; position: absolute; top: 0; left: 0; background: url(https://s.yimg.com/pw/images/iphone/sprite_photo_toolbar.png.v4) no-repeat center 19px; background-size: 24px 323px; } .photo_nav .prev_photo_overlay { display: block; width: 65px; height: 65px; position: absolute; top: 0; left: 0; background: url(https://s.yimg.com/pw/images/iphone/sprite_photo_toolbar.png.v4) no-repeat center -22px; background-size: 24px 323px; } .photo_nav .next_photo_div[selected="progress"] .next_photo_overlay, .photo_nav .prev_photo_div[selected="progress"] .prev_photo_overlay { top: 20px; left: 15px; width: 35px; height: 26px; -moz-border-radius: 6px; -webkit-border-radius: 6px; background: #fff url(https://s.yimg.com/pw/images/iphone/balls-24x12-trans.gif) no-repeat center center; background-size: 24px 12px; } .photo_nav .next_photo_div { position: relative; } .photo_nav .prev_photo_div { position: relative; background-position: center -36px; } .photo_nav .next_photo_div.disabled, .photo_nav .next_photo_div.disabled[selected="progress"], .photo_nav .prev_photo_div.disabled, .photo_nav .prev_photo_div.disabled[selected="progress"] { width: 55px; height: 65px; padding: 0 5px; background: #eee; text-align: center; font-size: 12px; color: #9d9d9d; } .photo_nav .next_photo_div.disabled > span, .photo_nav .prev_photo_div.disabled > span { display: table-cell; height: 65px; vertical-align: middle; } .photo_nav .next_photo_div[selected="progress"], .photo_nav .prev_photo_div[selected="progress"] { background: url(https://s.yimg.com/pw/images/iphone/balls-24x12-trans.gif) no-repeat center center; background-size: 24px 12px; } .photo_nav .fave_photo_div { height: 20px; padding: 10px 0; background: #eee url(https://s.yimg.com/pw/images/iphone/sprite_photo_toolbar.png.v4) no-repeat 22px -87px; background-size: 24px 323px; } .photo_nav .fave_photo_div.favd { background-position: 22px -126px; } /* Comments. */ .photo_comments form { overflow: hidden; margin-top: -1px; padding: 0 5px 0; } .photo_comments form p { padding: 16px 0 10px; font-size: 12px; } .photo-page .message { width: 100%; height: 88px; font-size: 18px; } .photo_comments .comment-buttons { overflow: hidden; } .photo_comments .comment-buttons a, .photo_comments .comment-buttons span { display: block; float: left; } .photo_comments .comment-buttons .some-html-link { display: block; float: left; margin-top: -10px; padding: 0 0 0 9px; background: url(https://s.yimg.com/pw/images/iphone/sprite_photo_toolbar.png.v4) no-repeat -1px -314px; font-size: 11px; } .photo_comments .comment-buttons .some-html-link.open { background-position: -11px -303px; } .photo_comments .comment-buttons .some-html-link a { display: inline; float: none; } .photo_comments .comment-buttons .preview-comment, .photo_comments .comment-buttons .post-comment { min-width: 100px; margin-top: -10px; margin-left: 12px; text-align: center; } .photo_comments .comment-buttons .post-comment { float: right; } .photo_comments .comment-buttons .preview-comment[selected="progress"], .photo_comments .comment-buttons .post-comment[selected="progress"] { background: #ddd url(https://s.yimg.com/pw/images/iphone/balls-24x12-trans.gif) no-repeat center center; background-size: 24px 12px; text-indent: -9999em; } /* Some HTML is OK section. */ .photo_comments .some-html { display: none; float: left; padding: 8px 5px 3px; border: 1px solid #ccc; -moz-border-radius: 6px; -webkit-border-radius: 6px; color: #000; font-size: 13px; } .photo_comments .some-html h3 { margin-top: 0; padding-left: 0; } .photo_comments .some-html p { padding: 0 0 4px; } .photo_comments .taglist { border-collapse: collapse; font-size: 12px; } .photo_comments .taglist th { text-align: left; padding: 5px 8px; font-weight: bold; } .photo_comments .taglist td { padding: 4px 8px; border-top: 1px solid #ccc; background: #fff; } .photo_comments .taglist td.tag { padding-right: 5em; } .photo_comments .taglist_example_div { background-color: #eee; } .photo_comments .taglist_copy_div, .photo_comments .taglist_example_div { display: block; color: #666; margin: 0 0 10px 0; padding: 0; } .photo_comments .taglist_example_div { color: #000; padding: 4px; background: #fff; font-size: 11px; } /* Third-party image blocking */ img.blocked-image { /* placeholder for blocked third-party inline images in comments */ width: 25px; height: 21px; background: transparent url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAVCAMAAACE9bUqAAAAM1BMVEUAAABtbnB3d3mAgYOKi4yxsrPi4uKUlJbFxcaenp/19fVjZGb////Oz8/s7OzY2NmnqKkpyC42AAAAAXRSTlMAQObYZgAAAIBJREFUeF6V0UkOAjEMRcF4ytwN9z8tJjZBJCDgbUvyXziE9r4Je78IiVZgk3R2K+Or5D6r7GJQBVtjd3pKin6e611OmHIoOI2t60OIDeZgdKFDLFJJY8lFuicq+EGQbYgZF6HarUiLNIwGsO9ANBhSLl5pRgomS5Dh+3/+fXe4AXN5FQqb3kk5AAAAAElFTkSuQmCC) no-repeat 0px 0px; cursor: pointer; /* cheap collapse hack (for images inside links, eliminate blue hover bleed) */ vertical-align: bottom; opacity: 0.33; /* hack: nice spacing avoiding BG color, without using margin/padding */ border-right: 1px solid #fff; border-bottom: 1px solid #fff; } a:hover img.blocked-image, img.blocked-image:hover { opacity: 1; } img.blocked-loading { /* effect applied while loading remote image */ background: transparent url(https://s.yimg.com/pw/images/progress/balls-16x8-trans.gif) no-repeat 50% 50%; filter: none; opacity: 1; /* while image is loading, make sure it's at least big enough to show the balls. */ min-width: 16px; min-height: 16px; } img.blocked-loaded { /* reset background, once loaded */ background: transparent; } /* Photo zoom. */ body > div.photo-page-large { min-height: 417px; margin-top: -81px; } body[orient="landscape"] > div.photo-page-large { min-height: 313px; } .photo-page-large .large-photo-title { margin: 0 5px; padding: 10px 0; border-bottom: 5px solid #eee; font-size: 13px; } .photo-page-large .available-sizes { overflow: hidden; margin: 6px 0 4px 5px; padding-bottom: 1px; } .photo-page-large .available-sizes li { display: block; float: left; text-align: center; border-left: solid 1px #eee; } .photo-page-large .available-sizes li.last { border-right: solid 1px #eee; } .photo-page-large .available-sizes li.selected { background-color: #f6f6f6; } .photo-page-large .available-sizes li a { display: block; padding: 0 10px 3px; } .photo-page-large .available-sizes li a[selected="progress"] { background: #ddd url(https://s.yimg.com/pw/images/iphone/balls-24x12-trans.gif) no-repeat center center; background-size: 24px 12px; } .photo-page-large .available-sizes li a[selected="progress"] > span { visibility: hidden; } .photo-page-large .available-sizes li a strong { font-size: 13px; font-weight: normal; } .photo-page-large .available-sizes li.selected a { color: #000; } .photo-page-large .available-sizes li.selected a strong { font-weight: bold; } .photo-page-large .available-sizes li a .Dimensions { display: block; margin-top: 1px; color: #999; font-size: 11px; } .photo-page-large .photo_meta { font-size: 13px; } .photo-page-large .photo_meta .license { margin-top: 6px; color: #999; font-size: 11px; line-height: 16px; } .photo-page-large .photo_meta .license .ccIcn img { margin-bottom: -4px; vertical-align:inherit !important; } .photo-page-large .photo_meta .license a { color: #999; font-size: 11px; } /* Additional info view. */ .more-info h3 { margin-top: 3px; padding: 5px 12px; font-weight: bold; color: #000; } .more-info ul { margin: 10px 0 0 37px; } .more-info ul li { list-style-type: circle; margin-bottom: 7px; font-size: 13px; } .more-info ul li.license, .more-info ul li.privacy { list-style-type: none; margin-left: -17px; } .more-info ul li.section-end { margin-bottom: 16px; } .more-info ul li img { vertical-align: bottom; } .more-info ul li b { font-weight: normal; } /* Styles for photo action pages: Edit License, Edit Privacy, Edit Safety, Edit Title & Desc, Delete Photo, Edit Comment, Delete Comment. */ body > div.action { overflow: hidden; } .action h2 { margin: 8px 12px 12px; padding: 0; font-size: 14px; color: #000; } .action h3 { margin-bottom: 4px; padding: 0; } .action div.action-thumb { margin-bottom: 10px; margin-left: 12px; margin-right: 5px; background: none; } .action div.action-thumb img:not(.trans_png) { background: #eee; border: 5px solid #f5f5f5; } .action .action-content { margin-left: 12px; margin-right: 12px; } .action textarea { width: 296px; height: 132px; font-size: 18px; } .action input.text { width: 296px; margin: 0; padding: 0; font-size: 18px; } .action .indent { margin-left: 20px; } .action .action-button { overflow: hidden; margin-top: -10px; padding-top: 10px; } .action .comment-author { margin-top: 10px; } .action .safety-options, .action .privacy-options { margin-bottom: 28px; } .action .safety-options li, .action .privacy-options li { margin-bottom: 4px; } .action .safety-options li .desc, .action .privacy-options li .note { font-size: 11px; color: #999; } .action .safety-options li { margin-bottom: 8px; padding-left: 18px; } .action .safety-options li input{ margin-left: -18px; } body[orient="landscape"] .action .action-thumb { float: left; margin-right: 0; } body[orient="landscape"] .action .action-content { float: left; width: 334px; } body[orient="landscape"] .action textarea { width: 334px; height: 88px; } body[orient="landscape"] .action input.text { width: 334px; } body[orient="landscape"] .action .action-button { float: left; } body[orient="landscape"] .action .return-link { float: right; } .action .photo_container { padding: 0; margin: 0; } .action .action-content p, .action .action-content table { margin-bottom: 20px; font-size: 13px; } .action .action-content table td{ padding: 4px; } .action .action-content .comment{ margin-bottom: 21px; padding: 5px; background: #eee; } .action .action-content .comment p { margin-bottom: 0; } .action .action-button .Butt { float: left; min-width: 100px; margin-top: -10px; text-align: center; } .action .action-button .Butt[selected="progress"] { background: #ddd url(https://s.yimg.com/pw/images/iphone/balls-24x12-trans.gif) no-repeat center center; background-size: 24px 12px; text-indent: -9999em; } .action .footer { clear: both; } .restricted-downloads { font-style: italic; color: #666; } /* Interstitial */ .Interst { text-align: center; margin-top: -6px; padding: 0 0 8px; width: auto; } .Interst h3 { margin-bottom: 12px; } .Interst .confirmation_button { padding: 18px 0 16px; } .Interst .confirmation_button a.Butt { display: block; width: 130px; margin: 0 auto; } .Interst .confirmation_button a.Butt[selected="progress"] { background: #ddd url(https://s.yimg.com/pw/images/iphone/balls-24x12-trans.gif) no-repeat center center; background-size: 24px 12px; text-indent: -9999em; } .InterstFoot { margin: 20px 0 0; padding: 17px; text-align: left; vertical-align: middle; background: #f1f6fb; } .InterstFoot h3 { margin: 0 0 12px; padding: 0 0 0 19px; background: url(https://s.yimg.com/pw/images/iphone/icon_info_12.png.v2) no-repeat 0 1px; background-size: 14px 14px; font-weight: bold; } .InterstFoot p { margin: 0; color: #000; font-size: 13px; } /* -------------------------------------------------------------------------------- */ /* Photo list styles. */ /* -------------------------------------------------------------------------------- */ ul.photo-list li { min-height: 50px; padding: 5px 0 5px 5px; font-size: 14px; font-weight: normal; } ul.photo-list li.contact-title { position: relative; overflow: hidden; min-height: 0; padding: 9px 34px 5px 5px; color: #000; font-weight: bold; font-size: 14px; } ul.photo-list li.contact-title img { float: left; margin-right: 5px; margin-top: -4px; } ul.photo-list li.contact-title a { display: inline; margin: 0; padding: 0; background: none; color: #0063DC; } ul.photo-list li.contact-title a.contact-more { display: block; position: absolute; top: 5px; right: 5px; width: 24px; height: 24px; min-height: 0; margin: 0; padding: 0; background: #f3f3f3 url(https://s.yimg.com/pw/images/iphone/sprite_photo_toolbar.png.v4) no-repeat center -188px; background-size: 24px 323px; } ul.photo-list li.contact-title a.contact-more span { display: block; position: absolute; left: -999em; } ul.photo-list li.contact-title a.contact-more-selected { background-position: center -213px; } ul.photo-list li.contact-title a[selected="progress"] { background: none !important; } ul.photo-list li.contact-title a.contact-more[selected="progress"] { padding: 0 4px; background: #f3f3f3 url(https://s.yimg.com/pw/images/iphone/balls-24x12-trans.gif) no-repeat center center !important; background-size: 24px 12px !important; } ul.photo-list li.title a { display: inline; background: none; color: #0063DC; } ul.photo-list li.title .subtitle { font-size: 11px; color: #999; font-weight: normal; } ul.photo-list li.attribution, ul.photo-list li.description { min-height: 0; font-size: 13px; color: #000; font-weight: normal; } ul.photo-list li.attribution a, ul.photo-list li.description a { display: inline; margin: 0; padding: 0; background: none; color: #0063DC; } ul.photo-list li.search-title { min-height: 0; padding: 5px; } ul.photo-list li.search-title-not-found { min-height: 0; padding: 9px 5px 5px; } ul.photo-list li.search-title .subtitle { font-weight: normal; } ul.photo-list li.search-title .not-found-subtitle { display: block; margin: 8px -5px 0; padding: 12px 24px; border-top: 1px solid #E0E0E0; font-size: 13px; text-align: center; } ul.photo-list li.search-title .queryterm { color: #333; background: #ffffd3; font-weight: bold; } ul.photo-list li.not-found { min-height: 0; padding: 12px 24px; text-align: center; color: #999; font-size: 13px; } ul.photo-list li.geo-not-found { min-height: 0; padding: 0 6px; font-size: 12px; } ul.photo-list li.geo-not-found p { margin-bottom: 16px; } ul.photo-list li.geo-not-found p.first { margin-top: 8px; } ul.photo-list li.geo-not-found p.last { margin-bottom: 8px; } ul.photo-list li a { min-height: 50px; overflow: hidden; margin: -5px 0 -5px -5px; padding: 5px 32px 5px 5px; background-position: right -239px; } ul.photo-list li a.Butt { margin: 0; padding: 10px; } ul.photo-list li .img_block { display: block; position: absolute; width: 50px; height: 50px; background: #eee; } ul.photo-list li .set_block, ul.photo-list li .gallery_block { width: 63px; height: 62px; margin-right: 0; padding: 6px 0 0 6px; background: url(https://s.yimg.com/pw/images/iphone/set_case.gif) no-repeat 0 0; background-size: 64px 68px; } ul.photo-list li .gallery_block { background-image: url(https://s.yimg.com/pw/images/iphone/gallery_case.gif.v2); background-size: 64px 68px; } ul.photo-list li .set_block img, ul.photo-list li .gallery_block img { border: 1px solid #000; } ul.photo-list li .set_block .pc_link, ul.photo-list li .gallery_block .pc_link { display: none; } ul.photo-list li .collection_block { width: 91px; height: 68px; } ul.photo-list li a.photo_container .main_video_overlay { display: block; position: absolute; top: 50%; left: 50%; width: 66px; height: 38px; margin: -19px 0 0 -33px; background: url(https://s.yimg.com/pw/images/iphone/video_play_icon_large.png.v1); background-size: 66px 38px; } ul.photo-list li .meta_block { width: 207px; margin-right: 8px; padding-left: 55px; } body[orient="landscape"] ul.photo-list li .meta_block { width: 367px; } ul.photo-list li .meta_block_set, body[orient="landscape"] ul.photo-list li .meta_block_set { width: auto; padding-left: 69px; } ul.photo-list li .meta_block_collection, body[orient="landscape"] ul.photo-list li .meta_block_collection { width: auto; padding-left: 96px; } ul.photo-list li .meta_block p { margin-bottom: 3px; } ul.photo-list li .meta_block .privacy, ul.photo-list li .meta_block .from, ul.photo-list li .meta_block .uploaded, ul.photo-list li .meta_block .comments { color: #999; font-size: 11px; } /* Thumbnail-only view. */ ul.photo-list.thumb-view { padding: 0 0 4px 0; } ul.photo-list.thumb-view li { float: left; min-height: none; margin: 4px 0 0 4px; padding: 0; border: 0; } ul.photo-list.thumb-view li.title, ul.photo-list.thumb-view li.contact-title { float: none; min-height: 0; margin: 0; padding: 9px 35px 5px 5px; } ul.photo-list.thumb-view li.attribution, ul.photo-list.thumb-view li.description { float: none; margin: 0; padding: 9px 5px 5px; } ul.photo-list.thumb-view li.pagination { float: none; clear: both; margin: 0; padding: 5px 4px; } ul.photo-list.thumb-view li.not-found { float: none; clear: both; margin: 0; padding: 12px 24px; border: 1px solid #E0E0E0; border-width: 1px 0; } ul.photo-list.thumb-view .footer { float: none; clear: both; } ul.photo-list.thumb-view li a { margin: 0; padding: 0; } ul.photo-list.thumb-view li a.Butt { padding: 10px; background: #0063DC; } ul.photo-list.thumb-view li .img_block { position: relative; width: 75px; height: 75px; margin: 0; background: #eee; } ul.photo-list.thumb-view li a .img_block .loading-overlay { position: absolute; top: 25px; left: 20px; z-index: 10; width: 35px; height: 26px; -moz-border-radius: 6px; -webkit-border-radius: 6px; } ul.photo-list.thumb-view li a[selected="progress"] .img_block .loading-overlay { background: #fff url(https://s.yimg.com/pw/images/iphone/balls-24x12-trans.gif) no-repeat center center; background-size: 24px 12px; } /* Gallery view. */ ul.photo-list.gallery-view { padding: 0 0 4px 0; } ul.photo-list.gallery-view li { padding-bottom: 10px; border: 0; } ul.photo-list.gallery-view li.title, ul.photo-list.gallery-view li.contact-title { float: none; min-height: 0; margin: 0; padding: 9px 35px 5px 5px; } ul.photo-list.gallery-view li.attribution, ul.photo-list.gallery-view li.description { float: none; margin: 0; padding: 9px 5px 5px; } ul.photo-list.gallery-view li.pagination { float: none; clear: both; margin: 0; padding: 5px 4px; } ul.photo-list.gallery-view li.not-found { float: none; clear: both; margin: 0; padding: 12px 24px; border: 1px solid #E0E0E0; border-width: 1px 0; } ul.photo-list.gallery-view .footer { float: none; clear: both; } ul.photo-list.gallery-view li a:not(.Butt) { display: inline; margin: 0; padding: 0; } ul.photo-list.gallery-view li a.img_block { display: block; position: relative; width: auto; height: auto; overflow: hidden; margin: 0; padding: 0; background: #eee; } ul.photo-list.gallery-view li a.img_block .loading-overlay { position: absolute; top: 50%; left: 50%; z-index: 10; width: 35px; height: 26px; margin: -13px 0 0 -17px; -moz-border-radius: 6px; -webkit-border-radius: 6px; } ul.photo-list.gallery-view li a[selected="progress"].img_block .loading-overlay { background: #fff url(https://s.yimg.com/pw/images/iphone/balls-24x12-trans.gif) no-repeat center center; background-size: 24px 12px; } ul.photo-list.gallery-view li .meta_block { width: 310px; margin-top: 4px; padding-left: 0; } body[orient="landscape"] ul.photo-list.gallery-view li .meta_block { width: 469px; } ul.photo-list.gallery-view li .gallery_comment { margin-bottom: 12px; font-size: 13px; } ul.photo-list.gallery-view li .gallery_comment a { display: inline; margin: 0; padding: 0; } ul.photo-list.gallery-view li .meta_block .photo-title { position: relative; padding: 4px 0 2px 28px; color: #000; font-size: 11px; } ul.photo-list.gallery-view li .meta_block .photo-title .buddy-icon { display: block; position: absolute; top: 6px; left: 0; } ul.photo-list.gallery-view li .meta_block .photo-title .title { font-size: 13px; } ul.photo-list.gallery-view li.comments .comment .img_block { position: absolute; width: 48px; height: 48px; background: #eee; } ul.photo-list.gallery-view li.comments .comment .meta_block { width: 250px; margin-top: 0; padding-left: 55px; } body[orient="landscape"] ul.photo-list.gallery-view li.comments .comment .meta_block { width: 409px; } ul.photo-list.gallery-view li.comments a:not(.Butt) { margin: 0; padding: 0; min-height: 0; } ul.photo-list.gallery-view li.comments a.pro-icon { padding: 0 10px; } ul.photo-list.gallery-view li.comments a.Butt { min-height: 0; } ul.photo-list li.code-message { width: 100%; padding: 5px; background: #fffdd3; color: #000; } ul.set-list > li > a, ul.collection-list > li > a { background-position: right -230px; min-height: 68px; } /* -------------------------------------------------------------------------------- */ /* Contact list styles. */ /* -------------------------------------------------------------------------------- */ ul.contact-list li { position: relative; min-height: 48px; padding: 5px 0 5px 5px; font-size: 14px; font-weight: normal; } ul.contact-list li.sub-bar { min-height: 0; padding: 5px; } ul.contact-list li.sub-bar a { display: none; } ul.contact-list li.search-title { min-height: 0; padding: 5px; } ul.contact-list li.search-title-not-found { padding: 9px 5px 5px; } ul.contact-list li.search-title .subtitle { color: #999; font-size: 11px; font-weight: normal; } ul.contact-list li.search-title .queryterm { color: #333; background: #ffffd3; font-weight: bold; } ul.contact-list li.search-title .not-found-subtitle { display: block; margin: 8px -5px 0; padding: 12px 24px; border-top: 1px solid #E0E0E0; font-size: 13px; text-align: center; } ul.contact-list li.not-found { min-height: 0; padding: 12px 24px; text-align: center; color: #999; font-size: 13px; } ul.contact-list li a { min-height: 48px; overflow: hidden; margin: -5px 0 -5px -5px; padding: 5px 32px 5px 5px; background-position: right -240px; } ul.contact-list li a.Butt { margin: 0; padding: 10px; } ul.contact-list li .img_block { display: block; position: absolute; width: 48px; height: 48px; background: #eee; } ul.contact-list li .meta_block { margin: 0 8px 0 55px; } ul.contact-list li p { font-size: 11px; color: #999; } ul.contact-list li p.contact-username { margin-bottom: 0; font-size: 20px; font-weight: normal; color: #000; } ul.contact-list li p.contact-name { margin-bottom: 2px; color: #333; font-weight: bold; } .contact-list-filter { width: 100%; margin: 0; padding: 4px; font-size: 14px; } body.scrumjax-search ul.contact-list li.sub-bar a.Butt { display: block; float: left; width: 18%; min-height: 0; padding: 7px 10px 6px; text-align: center; } body.scrumjax-search ul.contact-list li.sub-bar a.Butt[selected="progress"] { background: #ddd url(https://s.yimg.com/pw/images/iphone/balls-24x12-trans.gif) no-repeat center center; background-size: 24px 12px; text-indent: -9999em; } body.scrumjax-search ul.contact-list li.sub-bar { overflow: hidden; } body.scrumjax-search ul.contact-list li.sub-bar .contact-list-filter { float: left; width: 74%; margin: 0 4px 0 0; } ul.contact-list li.no-results { display: none; min-height: 0; padding: 12px 24px 6px; color: #444; text-align: center; } ul.contact-list li.no-results p { margin-bottom: 6px; font-size: 13px; } .searchable b, .contact-search-term { color: #333; font-weight: bold; background: #ffffd3; } ul.contact-list li a { background: none; } ul.contact-list li a::after { content: ""; display: block; width: 10px; height: 15px; position: absolute; right: 12px; top: 22px; background: url(https://s.yimg.com/pw/images/iphone/sprite_photo_toolbar.png.v4) no-repeat -7px -6px; background-size: 24px 323px; } ul:not(.contact-list) li a::after, ul.contact-list li.title a::after, ul.contact-list li.pagination a::after, ul.contact-list li a[selected="progress"]::after{ display: none; } /* -------------------------------------------------------------------------------- */ /* Relationship (Add as a contact) page styles. */ /* -------------------------------------------------------------------------------- */ .relationship > div { padding: 12px; font-size: 13px; } .relationship h3 { margin-bottom: 16px; font-size: 14px; } .relationship h4 { font-weight: bold; margin-bottom: 14px; } .relationship p { margin-bottom: 16px; } .relationship .footer p { margin-bottom: 4px; } .relationship p.button-container { overflow: hidden; } .relationship .Butt { float: left; } .relationship .Butt[selected="progress"] { padding: 10px 18px; background: #ddd url(https://s.yimg.com/pw/images/iphone/balls-24x12-trans.gif) no-repeat center center; background-size: 24px 12px; text-indent: -9999em; } .relationship label { display: block; margin-bottom: 3px; } .relationship label.sub { margin-left: 20px; } .relationship span.note { font-size: 11px; color: #999; } .relationship .contact-remove-button, .relationship .contact-ok-button{ min-width: 120px; text-align: center; } .relationship .contact-remove-button { display: none; } .relationship .contact-remove-button[selected="progress"], .relationship .contact-ok-button[selected="progress"] { padding: 10px; } /* -------------------------------------------------------------------------------- */ /* Activity list styles. */ /* -------------------------------------------------------------------------------- */ ul.activity-list { padding-top: 2px; } ul.activity-list li { overflow: hidden; padding: 5px 0 5px 5px; font-size: 14px; font-weight: normal; } ul.activity-list li.tt-noactivity { padding: 12px 24px; text-align: center; color: #999; font-size: 13px; } ul.activity-list li .img_block { display: block; position: absolute; width: 48px; height: 48px; background: #eee; } ul.activity-list li .img_block .set_block, ul.activity-list li .img_block .gallery_block { display: block; width: 48px; height: 51px; margin-right: 0; padding: 5px 0 0 5px; background: url(https://s.yimg.com/pw/images/iphone/set_case_small.gif.v3) no-repeat 0 0; background-size: 48px 51px; } ul.activity-list li .img_block .gallery_block { background-image: url(https://s.yimg.com/pw/images/iphone/gallery_case_small.gif.v2); } ul.activity-list li .img_block .set_block img, ul.activity-list li .img_block .gallery_block img { border: 1px solid #000; } ul.activity-list li .img_block .set_block .pc_link, ul.activity-list li .img_block .set_block .pc_link { display: none; } ul.activity-list li .meta_block { min-height: 50px; padding-left: 55px; } ul.activity-list li .meta_block img.notsowide { height: auto; max-width: 200px; } ul.activity-list li small { font-weight: normal; color: #999; font-size: 11px; } ul.activity-list li .comment-count { margin: 6px 0 2px; font-size: 13px; } ul.activity-list li .testimonial-body { padding: 0.5em 0px; } ul.activity-list li.pagination { padding-right: 5px; } ul.activity-list li a.Butt { margin: 0; } ul.ra-items li { position: relative; min-height: 24px; padding: 5px 5px 5px 51px; background: #fff; border: 0; font-size: 13px; } ul.ra-items li span.ra-icon-container { display: block; width: 20px; height: 20px; position: absolute; top: 8px; left: 0; background: #fff url(https://s.yimg.com/pw/images/iphone/sprite_activity_icons.png.v6) no-repeat 0 0; background-size: 2911px 15px; } ul.ra-items li.ra-item-mail, ul.ra-items li.ra-item-contact, ul.ra-items li.ra-item-contact-multi { padding-left: 22px; } ul.ra-items li.ra-item-comment span.ra-icon-container, ul.ra-items li.ra-item-set-comment span.ra-icon-container, ul.ra-items li.ra-item-group-invite span.ra-icon-container, ul.ra-items li.ra-item-comment-multi span.ra-icon-container, ul.ra-items li.ra-item-testimonial span.ra-icon-container, { background-position: 1px 1px; } ul.ra-items li.ra-item-note span.ra-icon-container { background-position: -412px 1px; } ul.ra-items li.ra-item-fav span.ra-icon-container { background-position: -1242px 0; } ul.ra-items li.ra-item-tag span.ra-icon-container { background-position: -826px 1px; } ul.ra-items li.ra-item-mail span.ra-icon-container { top: 7px; background-position: -1657px 1px; } ul.ra-items li.ra-item-share span.ra-icon-container { background-position: -1657px 1px; } ul.ra-items li.ra-item-gallery span.ra-icon-container { background-position: -2071px 1px; } ul.ra-items li.ra-item-contact span.ra-icon-container { background-position: -2896px 0; } ul.ra-items li.ra-item-person span.ra-icon-container { background-position: -2484px 1px; } ul.ra-items li.ra-item-more span.ra-icon-container { background-image: none; } ul.ra-items li .YouSaid, ul.ra-items li .YouSaid strong, ul.ra-items li .YouSaid small { color: #999; font-style: italic; } ul.ra-items li.ra-item-person .YouSaid a { font-weight: normal; font-style: normal; } ul.ra-items li .ra-item-buddy-icon { position: absolute; display: block; left: 22px; width: 24px; height: 24px; background: #eee; } ul.ra-items li.ra-item-comment .ra-item-desc strong, ul.ra-items li.ra-item-set-comment .ra-item-desc strong, ul.ra-items li.ra-item-note .ra-item-desc strong { display: block; } ul.ra-items li.ra-item-more .read-all { font-weight: bold; text-align: right; } ul.ra-items li.ra-item-testimonial { padding-left: 22px; } /* no ra-item-buddy-icon for this type */ /* -------------------------------------------------------------------------------- */ /* Search page styles. */ /* -------------------------------------------------------------------------------- */ #search > form { padding: 12px; } #search > form.people { margin-bottom: 35px; } #search h3 { color: #000; } #search h4 { margin: 16px 0 3px; font-weight: bold; } #search .search-field { width: 100%; margin: 4px 0; padding: 2px; font-size: 18px; } #search .who { width: 100%; margin-bottom: 6px; font-size: 15px; } #search #search-submit { float: right; min-width: 80px; margin-top: -35px; background: #0063DC url(https://s.yimg.com/pw/images/iphone/balls-24x12-trans.gif) no-repeat -100px -100px; background-size: 24px 12px; text-align: center; } #search #search-submit.solo { margin-top: 0; } #search #search-submit[selected="progress"] { background: #ddd url(https://s.yimg.com/pw/images/iphone/balls-24x12-trans.gif) no-repeat center center; background-size: 24px 12px; text-indent: -9999em; } #adv-search-options { display: none; font-size: 13px; } #adv-search-toggle { display: block; margin: 0 0 20px; padding-left: 9px; background: url(https://s.yimg.com/pw/images/iphone/sprite_photo_toolbar.png.v4) no-repeat -1px -312px; font-size: 13px; } ul.photo-list li.search-title .subtitle strong { font-weight: normal; } ul.photo-list li .search-sort { display: block; margin-top: 8px; font-size: 11px; font-weight: normal; color: #999; } ul.contact-list li.search-title a, ul.photo-list li.search-title a { display: inline; margin: 0; padding: 0; background: none; color: #0063DC; } ul.photo-list li.search-title a[selected="progress"] { background: none !important; } ul.photo-list li .search-sort a.selected { color: inherit; } /* -------------------------------------------------------------------------------- */ /* Upload page styles. */ /* -------------------------------------------------------------------------------- */ #upload-form { overflow: hidden; padding-bottom: 24px; } #upload #upload-submit { float: left; clear: both; min-width: 80px; margin-top: -4px; background: #0063DC url(https://s.yimg.com/pw/images/iphone/balls-24x12-trans.gif) no-repeat -100px -100px; background-size: 24px 12px; text-align: center; } #upload #upload-submit[selected="progress"] { background: #ddd url(https://s.yimg.com/pw/images/iphone/balls-24x12-trans.gif) no-repeat center center; background-size: 24px 12px; text-indent: -9999em; } #upload dl dd a span { color: #088307; } #upload dl dd { margin-bottom: 1em; } #upload table { width: 100%; margin-bottom: 12px; } #upload table th { border-bottom: 1px solid #fff; padding: 1px 1em 1px 0; vertical-align: top; font-size: 13px; } #upload table td { border-bottom: 1px solid #fff; padding: 1px 2px; background: #f3f3f3; vertical-align: top; font-size: 13px; } #upload table td span { color: #088307; } #upload .app-buttons a { text-transform: uppercase; display:inline-block; width: 275px; text-align: center; font-size: 15px; white-space: normal;} /* -------------------------------------------------------------------------------- */ /* Nearby page styles. */ /* -------------------------------------------------------------------------------- */ body > ul.photo-list.thumb-view > li.nearby-title { padding-bottom: 0; } .nearby-map { position: relative; } .nearby-map-overlay { position: absolute; top: 0; left: 0; width: 312px; height: 154px; background: url(https://s.yimg.com/pw/images/dot_main.png) no-repeat 145px 66px; } /* -------------------------------------------------------------------------------- */ /* Content page styles. */ /* -------------------------------------------------------------------------------- */ .content > div { padding: 12px; font-size: 13px; } .content h2 { margin-bottom: 16px; font-size: 14px; } .content h3 { margin-bottom: 8px; font-size: 12px; } .content p { margin-bottom: 16px; } .content p.Problem { padding: 6px 0 6px 33px; background: url(https://s.yimg.com/pw/images/icon_alert_big.png) no-repeat left top; font-size: 14px; } .content .footer p { margin-bottom: 4px; } .content ul { list-style: circle; padding-left: 20px; } .content .help-item { margin: 20px 0 24px; } .content .help-item h4 { margin-bottom: 10px; font-weight: bold; } .mob-404 p { font-size: 12px; } .page-not-found p.first, .dont-have-permission p.first { margin: 40px 0 28px; padding: 10px 6px; background: #fffef0; text-align: center; } ul.photo-list li.warn { float: none; min-height: 0; margin: 20px 0 0; padding: 10px 6px; background: #fffef0; } ul.photo-list li.warn-details { float: none; min-height: 0; margin: 0; padding: 0 27px 10px; background: #fffef0; } ul.photo-list li.warn .warning-icon, .page-not-found p.first .warning-icon, .dont-have-permission p.first .warning-icon { padding: 0 10px 0 7px; background: url(https://s.yimg.com/pw/images/iphone/sprite_confirmation_icons.png.v2) no-repeat -20px 0; } /* -------------------------------------------------------------------------------- */ /* Service auth page styles. */ /* -------------------------------------------------------------------------------- */ .authDetails h4 { margin-bottom: 16px; font-weight: bold; } div.content p.auth-shortcode-container { margin-top: -16px; padding: 16px 16px 28px; background: #effad7; text-align: center; } .auth-shortcode { padding: 10px; background: #000; border: 2px solid #fff; color: #fff; font-weight: bold; font-family: courier new, courier, monospace; font-size: 20px; } .content.auth-done { padding-top: 16px; } .content.auth-done p { padding: 0 16px; } .content.auth-done p.auth-success { background: #effad7 url(https://s.yimg.com/pw/images/icon_check_small.png) no-repeat scroll 18px 19px; margin-top: -16px; padding: 16px 10px 16px 38px; } .content .authHead { background: #ffffcc url(https://s.yimg.com/pw/images/icon_key_small.png) no-repeat 17px 18px; padding: 16px 10px 16px 48px; } .content .authHead h2 { font-weight: bold; font-size: 14px; margin: 0; } .content .authHead p { margin: 12px 0 0 -30px; color: #C21010; } .content .authHead p.authPartner { border-top: 1px solid #fff; margin: 16px -10px -16px -48px; padding: 16px 10px 16px 48px; background: #e7fbcb url(https://s.yimg.com/pw/images/icon_trusted_partner.png) no-repeat 19px 15px; color: #000; } .content .authHead p.authPartner em {color: #30a91c; font-style: normal; } .content .authHead p.authYahoo { background-image: url(https://s.yimg.com/pw/images/icon_ides_yahoo_small.png); background-position: 15px 11px; } .content .authHead p.authFlickr { background-image: url(https://s.yimg.com/pw/images/icon_ides_flickr_dots_small.png); background-position: 15px 11px; } .content .authHead p.authThirdParty { border-top: 1px solid #fff; margin: 16px -10px -16px -48px; padding: 16px 10px 16px 18px; background: #ffffcc; color: #C21010; } .content .authDetails { margin-top: 8px; } .content .authPerms ul { list-style: none; } .content .authPerms ul li { margin-left: 4px; margin-bottom: 16px; padding-left: 22px; } .content .authPerms ul.allowed-perms li { background: url(https://s.yimg.com/pw/images/icon_check_small.png) no-repeat 2px 2px; } .content .authPerms ul.disallowed-perms li { background: url(https://s.yimg.com/pw/images/icon_error_x_smaller.png) no-repeat 2px 2px; } .authError { background: #ffffcc url(https://s.yimg.com/pw/images/icon_alert.png) no-repeat 18px 16px; margin: -20px -12px 16px; padding: 16px 10px 16px 38px; } .authError p.first { margin-top: 0; } .authError p.last { margin-bottom: 0; } .authErrorDetails { padding: 10px; background: #000; color: #00ff00; font-family: courier new, courier, monospace; font-weight: bold; } .content .authAbout { background: #f1f6fb; margin: 16px -12px 0; padding: 16px 18px 8px; } .content .authAbout h4.info-header { background: url(https://s.yimg.com/pw/images/icon_info.gif) no-repeat 0 0; padding-left: 20px; } .content .authAbout h5 { margin-bottom: 16px; font-size: 13px; font-weight: bold; } #auth-allow-container { padding: 2px 0 9px; text-align: center; line-height: 42px; } #auth-allow { display: inline-block; padding: 0 10px; margin-right: 3px; line-height: 34px; } .button-container .Butt span { padding: 10px; } .button-container .Butt[selected="progress"] { background: #ddd url(https://s.yimg.com/pw/images/iphone/balls-24x12-trans.gif) no-repeat center center; background-size: 24px 12px; } .button-container .Butt[selected="progress"] span { visibility: hidden; } form.button-container { padding: 20px 0; text-align: center; } #request-from-unknown, #request-from-source { padding: 10px 10px 0; background: #f1f6fb; } #request-or { margin-top: 3px; margin-bottom: 4px; text-align: center; } #request-from-unknown p, #request-from-source p { margin: 0; } .sso-user { margin: 18px 0 26px; } .sso-user span { padding: 9px 5px; background: #edf3f9; } .sso-user span img { vertical-align: middle; } .sso .confirmation_button_sso { padding-top: 0; } #sso-toggle-submit { display: block; min-width: 80px; margin: 0 auto; background: #0063DC url(https://s.yimg.com/pw/images/iphone/balls-24x12-trans.gif) no-repeat -100px -100px; background-size: 24px 12px; text-align: center; } .content .signup p { margin-bottom:10px; } .content .signup p.centered { text-align:center; } .content .signup p.big { font-size:14px; } .content .signup p.subdue { color:#aaa; font-size:11px; } .content .signup div.feature { background-color:#f7f7f7; text-align:left; padding:10px; margin:16px 0 16px 0; } .content .signup div.feature.warning { background-color:#ffffd4; } .content .signup div.feature ul { margin:0; list-style:none; margin-top:15px; } .content .signup div.feature li { margin:0; padding:0 8px 5px 0; position:relative; } .content .signup div.feature li:last-of-type { margin:0; padding-left:25px; position:relative; } .content .signup div.feature input { padding:6px; } .content .signup div.feature.warning .suggestions p { background:url('http://flickr.comhttps://s.yimg.com/pw/images/icon_alert.png') transparent top left no-repeat; padding-left:19px; } .content .signup div.feature .suggestions label span { margin-left:10px; } .content .signup div.feature .suggestions input[type=radio] { position:absolute; top:0; left:0; } .content .signup div.feature .suggestions label input[type=radio] { position:static; } .feature .suggestions input[name=screen_name] { width:100%; margin:0; margin-right:25px; } .feature .suggestions input[name=screen_name].error { border:solid 1px #f00; } /* -------------------------------------------------------------------------------- */ /* Report Abuse page styles. */ /* -------------------------------------------------------------------------------- */ .abuse ul li { margin-bottom: 6px; } .abuse input.text { width: 296px; margin: 0; padding: 0; font-size: 18px; } .abuse textarea { width: 296px; height: 132px; font-size: 18px; } .abuse span.required { font-size: 11px; color: #999; } .abuse label { display: block; margin-bottom: 4px; } .abuse .form-submit { float: left; min-width: 80px; margin: 0px 18px 0 0; background: #0063DC url(https://s.yimg.com/pw/images/iphone/balls-24x12-trans.gif) no-repeat -100px -100px; background-size: 24px 12px; text-align: center; } .abuse .form-submit[selected="progress"] { background: #ddd url(https://s.yimg.com/pw/images/iphone/balls-24x12-trans.gif) no-repeat center center; background-size: 24px 12px; text-indent: -9999em; } /* -------------------------------------------------------------------------------- */ /* Android upsell modal. */ /* -------------------------------------------------------------------------------- */ /* pure css bab */ a.sbab { display:inline-block;display:-moz-inline-box;text-decoration:none !important;} a.sbab { min-height:30px;width:200px;} a.sbab strong { font-size:16px;font-weight:bold;color:#fe63bb;padding:10px 10px 10px;text-align:center;display:block;font-weight:bold;text-shadow:#fff 0px 1px 0px;} a.sbab { background-color:#ccc;background:-webkit-gradient(linear,0% 0%,0% 100%,from(#F5F5F3),to(#D6D6D6));border:1px solid #ccc;border-radius:5px;-webkit-border-radius:5px;-webkit-box-shadow:0px 2px 3px rgba(0,0,0,0.6);box-shadow:0px 2px 3px rgba(0,0,0,0.6);} #modal-wrap { display:block;background:rgba(0,0,0,0.5);position:absolute;z-index:20;height:800px;top:0px;left:0px;right:0px;text-align:center;} #modal-wrap, #modal-wrap h2, #modal-wrap p { color:#454545;font-family:'Droid Sans',verdana,arial,sans-serif;} #modal-wrap .modal h3 { font-size:18px;margin-bottom:5px;color:#454545;} #modal-wrap .modal .dismiss-x { display:block;position:absolute;top:0px;right:-6px;color:#ccc;text-decoration:none;font-size:24px;font-weight:bold;height:100px;width:50px;} #modal-wrap .modal p { font-size:15px;line-height:1.4em;} #modal-wrap h2 { font-size:18px;min-height:50px;font-weight:bold;padding:2px 0 0 0;margin-left:2px;text-align:left;} #modal-wrap h2 .new { font-size:10px;text-transform:uppercase;color:#ff0085;vertical-align:super;} #modal-wrap h2 img { padding:2px 5px 0 0;vertical-align:middle;} #modal-wrap .modal { width:275px;min-height:385px;margin-top:30px;text-align:center;display:inline-block;position:relative;background:#fff;border-radius:4px;-webkit-box-shadow:0px 0px 5px #000;box-shadow:0px 0px 5px #000;} #modal-wrap .modal .copy { padding:10px;} #modal-wrap .modal p, #modal-wrap .modal h3 { text-align:left;} #modal-wrap .modal p.button { text-align:center;margin:15px 0;} #modal-wrap .modal .sbab { font-family:'Droid Sans',verdana,arial,sans-serif;} #modal-wrap .modal .sbab strong { font-size:14px;} /* -------------------------------------------------------------------------------- */ /* Application help */ /* -------------------------------------------------------------------------------- */ #app-help { display: block; top: 0; font-family: "Helvetica Neue", helvetica, sans-serif; text-rendering: optimizeLegibility; color: #2e2e2e; word-wrap: break-word; } #app-help h1 { margin-bottom: 16px; font-size: 18px; } #app-help h2, #app-help h3 { color: inherit; } #app-help ul, #app-help ol { margin-bottom: 16px; } /* -------------------------------------------------------------------------------- */ /* 2014 */ /* -------------------------------------------------------------------------------- */ body.mob_2014 { } body.mob_2014 a.mobile-app-cta, body.mob_2014 a.mobile-app-cta:active { background: #1a79ed; color: #fff; display: inline-block; padding: 8px; text-align: center; border-radius: 0.3em; font-size: 14px; position: absolute; top: 8px; right: 8px; } body.mob_2014 a.mobile-app-cta.hidden { display: none; } .mobile-social, .mobile-app-social { position: relative; margin: 0 0 12px; } .mobile-app-social { line-height: 26px; font-weight: 500; } .mobile-social .photo_faves_count { margin: 0 5px 0 0; } .mobile-social span { display: inline-block; padding: 4px 7px; background: #e5e5e5; border-radius: 0.2em; font-size: 12px; color: #000; } .mobile-social i { display: inline-block; line-height: 13px; margin: 0 5px 0 0; position: relative; top: 1px; } .mobile-social .photo_comments_count i { background-image: url('https://s.yimg.com/pw/images/mob/icons-1x/comment_small.png.v1'); width: 13px; height: 11px; } .mobile-social .photo_faves_count i { background-image: url('https://s.yimg.com/pw/images/mob/icons-1x/fav_small.png.v1'); width: 14px; height: 12px; } .mobile-social .mobile-toggles, .mobile-app-social .mobile-toggles { position: absolute; right: 0; top: 0; } .mobile-toggles a { display: inline-block; color: #212124; } .mobile-app-social .mobile-toggles a { line-height: 20px; } .mobile-app-social .mobile-toggles a, .mobile-app-social .photo_faves_count { max-width: 96px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .mobile-app-social .mobile-toggles i { display: inline-block; margin-right: 8px; line-height: 20px; vertical-align: bottom; } .mobile-social .mobile-toggles .fave_photo_div { margin: 0 20px 0 0; } .mobile-app-social .mobile-toggles .fave_photo_div { margin: 0 20px 0 0; } .mobile-app-social .mobile-toggles .fave_photo_div i, .mobile-app-social .mobile-toggles .fave_photo_div.favd i, .mobile-app-social .mobile-toggles .comment_div i, .photo_container.mob_2014 .prev i, .photo_container.mob_2014 .next i { background-image:url('https://s.yimg.com/pw/images/mob/sprite.png.v3'); background-repeat:no-repeat; /*background-size: 113px 80px;*/ } .mobile-app-social .mobile-toggles .fave_photo_div i { background-position: -78px -42px; width: 24px; height: 22px; } .mobile-app-social .mobile-toggles .fave_photo_div.favd i { background-position: -103px -42px; } .mobile-app-social .mobile-toggles .comment_div i { background-position: -128px -44px; width: 24px; height: 20px; } .photo-owner { font-size: 14px; margin: 12px 8px 6px; color: #212124; font-weight: 500; } .photo-owner img { border-radius: 50%; position: relative; top: -3px; margin: 0 4px 0 0; vertical-align: middle; } .photo-page .photo_container.mob_2014 {background-position: -65px -42px; margin: 0; text-align: center; background: #212124; color: #fff; } .photo_container.mob_2014 .photo_img { vertical-align: middle; } .photo_container.mob_2014.hidden { display: none; } .photo_container.mob_2014 .prev, .photo_container.mob_2014 .next { position: absolute; top: 0; display: block; width: 40%; height: 100%; } .photo_container.mob_2014 .prev:active, .photo_container.mob_2014 .next:active { background: transparent; } .photo_container.mob_2014 .prev { right: 0; } .photo_container.mob_2014 .prev i, .photo_container.mob_2014 .next i { position: absolute; top: 50%; display: block; width: 25px; height: 40px; margin-top: -20px; } .photo_container.mob_2014 .prev i { right: 0; background-position: -128px 0; } .photo_container.mob_2014 .next i { left: 0; background-position: -102px 0; } .photo-page .photo_meta.mob_2014 { padding: 8px; } .photo-page .photo_meta.mob_2014 h2 { color: #212124; font-weight: 500; } .photo-page .photo_meta.mob_2014 .description { color: #636363; margin: 8px 0 12px; } .photo-page .photo_meta.mob_2014 .copyright { margin-bottom: 0; } .photo-page .photo_comments.mob_2014 { margin: 0px 8px; } .photo_comments.mob_2014 .comment { padding: 0px; position: relative; border-top: 1px solid #e8e8e8; margin: 0; } .photo_comments.mob_2014 div.comment:last-of-type { border-bottom: 1px solid #e8e8e8; } .photo_comments.mob_2014 .comment p, .photo_comments.mob_2014 .comment div { color: #212124; font-size: 14px; } .photo_comments.mob_2014 .comment .img_block { width: 24px; height: 24px; background: transparent; top: 14px; } .photo_comments.mob_2014 .comment .img_block img { border-radius: 50%; position: relative; top: -5px; } .photo_comments.mob_2014 .comment .meta_block { padding: 12px 0 12px 36px; } .photo_comments.mob_2014 .comment .meta_block h4 { margin-bottom: 8px; font-weight: 500; font-size: 14px; line-height: 12px; } .photo_comments.mob_2014 .comment small.comment-actions { } .photo_comments.mob_2014 .comment small.comment-timestamp { position: absolute; margin-top: 0; top: 11px; right: 0; color: #636363; font-size: 12px; line-height: 16px; text-align: right; } .photo_comments.mob_2014 .message { box-sizing: border-box; padding: 4px 8px; font-size: 14px; background: #e8e8e8; border: none; border-radius: 0.3em; outline: none; color: #212124; } .photo_comments.mob_2014 .message::-webkit-input-placeholder, .photo_comments.mob_2014 .message:-moz-placeholder, .photo_comments.mob_2014 .message::-moz-placeholder, .photo_comments.mob_2014 .message:-ms-input-placeholder { color: #636363; opacity: 1; } .photo_comments.mob_2014 form { margin-top: 12px; padding: 0; } .photo_comments.mob_2014 form p { padding: 21px 0 10px; } .photo_comments.mob_2014 .pagination { padding: 5px 0; } .photo_comments.mob_2014 .pagination .pagination-info { top: 12px; color: #636363; font-size: 12px; } #header.mob_2014 #header-top { background: #212124; margin-bottom: 0; line-height: 44px; } #header.mob_2014 #nav_main { float: right; height: 44px; line-height: 44px; } #header.mob_2014 #nav_main li { display: inline-block; margin: 0; background: transparent; border: none; float: none; width: inherit; } #header.mob_2014 #nav_main a { display: inline-block; padding: 0 4px; color: #fff; font-size: 14px; max-width: 50px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; height: 44px; } /* Cheating for the word "Following" */ #header.mob_2014 #nav_main a#iphone_contacts_link { max-width: 64px; } body.mob_2014[orient="landscape"] #header.mob_2014 #nav_main a { max-width: 100px; } #header.mob_2014 #nav_main li:last-of-type a { padding-right: 8px; } #header.mob_2014 #nav_main li:first-of-type a { padding-left: 0px; } #header.mob_2014.show-sub-nav { border-bottom: none; } #header.mob_2014 #signedin { color: #fff; padding: 8px 8px 0 0; } #header.mob_2014 #logo { padding: 0; height: 44px; } #header.mob_2014 #logo h1 { display: inline-block; vertical-align: middle; } #header.mob_2014 #logo-link { background: url('https://s.yimg.com/pw/images/flickr_logo_small_white.png') no-repeat 0 0; background-size: 48px 15px; width: 48px; height: 15px; margin-left: 8px; position: relative; top: -3px; } body.mob_2014 > .toolbar { height: 73px; } body.mob_2014 > div.photo-page-large { margin-top: -73px; } body.mob_2014 > *:not(.toolbar) { top: 69px; } .photo_comments.mob_2014 .pagination .Butt, .photo_comments.mob_2014 .comment-buttons .Butt { padding: 5px; font-weight: normal; } body.mob_2014 .Butt { background: #1a79ed; } body.mob_2014 #signedin { float: none; padding: 0; margin-bottom: 4px; } body.mob_2014 ul.photo-list li .meta_block .privacy, body.mob_2014 ul.photo-list li .meta_block .from, body.mob_2014 ul.photo-list li .meta_block .uploaded, body.mob_2014 ul.photo-list li .meta_block .comments { color: #636363; font-size: 13px; } body.mob_2014 .photo-page .copyright { font-size: 12px; } body.mob_2014 ul.photo-list li .meta_block { padding-left: 62px; width: auto; } body.mob_2014 ul.photo-list.set-list li .meta_block { padding-left: 69px; } body.mob_2014 ul.photo-list.collection-list li .meta_block { padding-left: 96px; } body.mob_2014 ul.photo-list li a { background: transparent; } body.mob_2014 ul.photo-list li a[selected="progress"].photo-list-item, body.mob_2014 ul.collection-list li a[selected="progress"].photo-list-item, body.mob_2014 ul.set-list li a[selected="progress"].photo-list-item { background-image: none !important; margin-right: 0; } body.mob_2014 ul.photo-list li a[selected="progress"].Butt { } body.mob_2014 ul.photo-list li a.Butt { background-color: #1a79ed; } body.mob_2014 ul.photo-list li a[selected="progress"].Butt { background-color: #ddd; } body.mob_2014 .photo-list .goto { background: url(https://s.yimg.com/pw/images/iphone/sprite_photo_toolbar.png.v4) no-repeat -2px -263px; height: 15px; width: 10px; display: block; position: absolute; top: 50%; margin-top: -7px; right: 12px; } body.mob_2014 ul.photo-list li a[selected="progress"] .goto { background-image: url(https://s.yimg.com/pw/images/iphone/balls-24x12-trans.gif) !important; background-size: 24px 12px; background-position: right center; background-repeat: no-repeat; width: 24px; height: 12px; margin-right: -6px; } body.mob_2014 .photo-list li.contact-title img { border-radius: 50%; } body.mob_2014 #nav_sub li a { padding: 12px 0; } body.mob_2014 > .photo-list, body.mob_2014 > .contact-list { top: 81px; } body.mob_2014 ul.contact-list li p.contact-username, body.mob_2014 ul.contact-list li p.contact-name { font-size: 14px; font-weight: 500; line-height: 14px; color: #212121; margin: 0 0 4px; } body.mob_2014 ul.contact-list li p { color: #636363; font-size: 13px; } body.mob_2014 ul.contact-list .img_block { width: 28px; height: 28px; display: inline-block; position: relative; line-height: 28px; background: transparent; } body.mob_2014 ul.contact-list li.contact-orig, body.mob_2014 ul.contact-list li.contact-orig a { line-height: 48px; } body.mob_2014 ul.contact-list li a::after { top: 50%; margin-top: -7px; } body.mob_2014 ul.contact-list .img_block img { border-radius: 50%; vertical-align: middle; } body.mob_2014 ul.contact-list li .meta_block { display: inline-block; margin: 0 8px 0 12px; vertical-align: middle; line-height: 14px; } body.mob_2014.scrumjax-search ul.contact-list li.sub-bar a.Butt::after { display: none; } body.mob_2014 ul.contact-list li.sub-bar { padding: 12px 8px; } body.mob_2014 > ul > li.pagination a.pagination-prev, body.mob_2014 > ul > li.pagination a.pagination-next { padding: 5px; font-weight: normal; } .photo-contextstrip { margin: 0 4px 12px; text-align: center; } .photo-contextstrip h3 { padding: 8px 0; display: inline-block; } .photo-contextstrip-wrapper { display: inline-block; text-align: left; width: 320px; overflow: hidden; } .photostrip li, .photostrip a, .photostrip .photo_container { width: 75px; height: 75px; overflow: hidden; margin: 0px; display: inline; background: transparent; } body.mob_2014 #home #greeting small, body.mob_2014 ul.photo-list li.title .subtitle, body.mob_2014 > ul > li.pagination .pagination-info, body.mob_2014 #signedin, body.mob_2014 .footer { font-size: 12px; color: #636363; } body.mob_2014 .footer { font-size: 12px !important; } body.mob_2014 #launchHead img, body.mob_2014 .contact-title .BuddyIconX, body.mob_2014 .ra-item-buddy-icon img { border-radius: 50%; } body.mob_2014 ul.ra-items li .ra-item-buddy-icon { background-color: transparent; } body.mob_2014 ul.photo-list.thumb-view { position: relative; top: inherit; margin: -25px auto 0 auto; } body.mob_2014[orient="profile"] ul.photo-list.thumb-view { width: 320px; } body.mob_2014[orient="landscape"] ul.photo-list.thumb-view { width: 480px; } @media only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 2dppx) { .mobile-app-social .mobile-toggles .fave_photo_div i, .mobile-app-social .mobile-toggles .fave_photo_div.favd i, .mobile-app-social .mobile-toggles .comment_div i, .photo_container.mob_2014 .prev i, .photo_container.mob_2014 .next i { background-image:url('https://s.yimg.com/pw/images/mob/sprite-2x.png.v3'); background-size: 153px 64px; } #header.mob_2014 #logo-link { background: url('https://s.yimg.com/pw/images/flickr_logo_large_white.png') no-repeat 0 0; background-size: 48px 15px; } body.mob_2014 > ul > li.pagination a[selected="progress"].Butt { background-image: none; } .mobile-app-social .mobile-toggles .comment_div i { background-position: -127px -44px; } } pre.dev-log.dev-log-dumper { display: block; } @-webkit-keyframes bounce { 0% { left: 0px; z-index: 3; } 5% { left: 0px; z-index: 3; } 25% { left:6px; z-index:3; } 50% { left: 13px; z-index: 3; } 75% { left: 6px; z-index:2; } 95% { left: 0px; } 100% { left: 0px; z-index:2; } } @-webkit-keyframes bounce-left { 0% { left: 13px; } 5% { left: 13px; } 25% { left:6px; } 50% { left: 0px; } 75% { left: 6px; } 95% { left: 13px; } 100% { left: 13px; } } @-moz-keyframes bounce { 0% { left: 0px; z-index: 3; } 5% { left: 0px; z-index: 3; } 25% { left:6px; z-index:3; } 50% { left: 13px; z-index: 3; } 75% { left: 6px; z-index:2; } 95% { left: 0px; } 100% { left: 0px; z-index:2; } } @-moz-keyframes bounce-left { 0% { left: 13px; } 5% { left: 13px; } 25% { left:6px; } 50% { left: 0px; } 75% { left: 6px; } 95% { left: 13px; } 100% { left: 13px; } } @-ms-keyframes bounce { 0% { left: 0px; z-index: 3; } 5% { left: 0px; z-index: 3; } 25% { left:6px; z-index:3; } 50% { left: 13px; z-index: 3; } 75% { left: 6px; z-index:2; } 95% { left: 0px; } 100% { left: 0px; z-index:2; } } @-ms-keyframes bounce-left { 0% { left: 13px; } 5% { left: 13px; } 25% { left:6px; } 50% { left: 0px; } 75% { left: 6px; } 95% { left: 13px; } 100% { left: 13px; } } @keyframes bounce { 0% { left: 0px; z-index: 3; } 5% { left: 0px; z-index: 3; } 25% { left:6px; z-index:3; } 50% { left: 13px; z-index: 3; } 75% { left: 6px; z-index:2; } 95% { left: 0px; } 100% { left: 0px; z-index:2; } } @keyframes bounce-left { 0% { left: 13px; } 5% { left: 13px; } 25% { left:6px; } 50% { left: 0px; } 75% { left: 6px; } 95% { left: 13px; } 100% { left: 13px; } } .html5-balls { display: block; height:12px; width:24px; position: relative; } .html5-balls .blueball, .html5-balls .pinkball { display: block; width:12px; height:12px; position: absolute; top:0px; left:0px; border-radius: 30px; background: #ff0085; -webkit-animation: bounce 1.2s infinite; -webkit-animation-timing-function: linear; -moz-animation: bounce 1.2s infinite; -moz-animation-timing-function: linear; -ms-animation: bounce 1.2s infinite; -ms-animation-timing-function: linear; animation: bounce 1.2s infinite; animation-timing-function: linear; z-index:3; } .html5-balls .blueball{ left: 13px; background: #0063dd; -webkit-animation: bounce-left 1.2s infinite; -webkit-animation-timing-function: linear; -moz-animation: bounce-left 1.2s infinite; -moz-animation-timing-function: linear; -ms-animation: bounce 1.2s infinite; -ms-animation-timing-function: linear; animation: bounce-left 1.2s infinite; animation-timing-function: linear; } .loading-balls { position: absolute; height: 100%; width: 100%; top: 0; left: 0; } .loading-balls .html5-balls { top: 50%; left: 50%; margin-top: -6px; margin-left: -12px; } .balls-shim { background: #fff; position: absolute; height: 100%; width: 100%; top: 0; left: 0; opacity: 0.5; } .loading-balls.hidden { display: none; }