/* ----------------------------------------------------- Shoebox (shoebox.madebymn.co.uk) SCREEN style sheet author: mN -> hello@madebymn.co.uk version: 2008.07 ----------------------------------------------------- */ /*--------- Y!UI font and element normalisation ---------*/ 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;} body {font:13px arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small;}table {font-size:inherit;font:100%;}select, input, textarea {font:99% arial,helvetica,clean,sans-serif;}pre, code {font:115% monospace;*font-size:100%;}body * {line-height:1.22em;} body{ font-size:77%; text-align:center; padding-bottom:10px; } body.app, body.legals, body.iphone{ background:#FFCC00; } a:link, a:active, a:visited{ text-decoration:none; outline: none; -moz-outline: none; color:#000; } a:hover{ text-decoration:none; } .clear{ width:auto; height:0 !important; clear:both; position:relative; overflow:hidden; } #about_bt_content p a, #say_hello_content p a, #be_friends_content p a{ border-bottom: 1px dotted #000; } #about_bt_content p a:hover, #say_hello_content p a:hover, #be_friends_content p a:hover{ border-bottom: 1px solid #000; } /*---------- Layout templates ----------*/ #container{ width:960px; margin:0 auto; text-align:left; } #shoebox-app-wrap{ width:960px; height:600px; padding-bottom:1px;position:relative;overflow-x:hidden; } #shoebox-app-holder{ width:960px; height:600px; padding-bottom:1px; overflow-x:hidden; position:absolute; top:0; left:0; } #shoebox-app{ width:960px; height:600px; position:relative; top:0; left:0;z-index:1000; } #shoebox-app p{ padding:0 160px; } #shoebox-header-wrap{ height:50px; margin:0 0 1px -5px; } #shoebox-header{ width:960px; height:50px; background:url(../images/global/shoebox_header.gif); } #shoebox-header a{ display:block; padding-top:50px; height: 0 !important; height /**/:50px; overflow:hidden; } /* Introductory text */ #about_bt_content, #say_hello_content, #be_friends_content{ width:280px; z-index:999; position:absolute; top:50px; left:0; } #about_bt_content h2, #say_hello_content h2, #be_friends_content h2{ font-weight:bold; font-size: 150%; margin-bottom: 1em; } #about_bt_content p, #say_hello_content p, #be_friends_content p{ font-size: 105%;line-height:120%; margin-bottom: 1em; } /* Bottom site links panel */ #site-links{ float:left; display:inline; margin:0; text-align:left; padding:11px 0px 0px 10px; width:500px; } #site-links li{ float:left; display:inline; padding:0 20px 0 0; font-size:110%;font-weight:bold; } #site-links li a{ padding:0; color:#000; text-decoration:none; display:block; } #site-links li a:hover{ border-bottom:1px dotted #000; } /* Bottom site info panel */ #site-info{ float:right; display:inline; margin:0 auto; text-align:center; padding:3px 0 0 0; height:23px; } #site-info.iphone{ float:right; display:inline; margin:0 auto; text-align:center; padding:3px 0 0 0; width:251px; height:23px; } #site-info.iphone_press{ float:right; display:inline; margin:0 auto; text-align:center; padding:3px 0 0 0; width:220px; height:23px; } #site-info li{ float:left; display:inline; padding:0 0 0 10px; color:#000; font-size:0.9em; height:25px;} #site-info li.right_none_img{ padding-top: 10px;} #site-info a img{ vertical-align: middle; display:inline; } #site-info li a{ padding:10px 8px 0 0; color:#000; } #site-info.iphone li a, #site-info.iphone_press li a{ padding:10px 0 0 0; } #site-info li.right_none_img a:hover{ border-bottom:1px dotted #000; } /* Contact form styles */ #getInTouchForm label, #moreForm label{ font-weight:bold; font-size:120%; } input#personName, input#emailAddress, textarea#personMessage, input#more_emailAddress, input#more_Name{ margin: 2px 0 5px;width:280px; height:20px; border:1px solid #ECBD02; background-color:#ECBD02; color:#000; font-size:110%; font-weight:bold; } textarea#personMessage{ height:100px; } #getInTouchForm input#mail_submit, #moreForm input#more_submit{ display:block; margin-top:5px; padding:3px; font-weight:bold; color:#FFF; background-color: #000;border:1px solid #000; text-transform:uppercase; } /* Legal page styles */ .legals #content{ padding-bottom:40px; } .legals #content h2{ color:#000; padding:18px 0 16px 0; font-size:2.2em; font-weight:700; } .legals #content h3{ color:#000; padding:10px 0 2px 0; font-size:1.4em; font-weight:700; } .legals #content h3 a{ color:#000; } .legals #content h3 a:hover{ color:#000; text-decoration:none; border-bottom:1px dashed #666; } .legals #content p{ color:#000; margin-bottom:16px; line-height:140%; padding-right:80px; } .legals #content p a{ color:#000; font-weight:700; } .legals #content p a:hover{ text-decoration:underline;} .contact-error{ width:200px; color:#FF0000; font-weight:700; padding-left:10px; float:right; display:inline; margin:-28px 136px 0 0; } p.thanks-message{line-height:135%;} .thanks-message{ font-weight:bold; font-size:150%; } .thanks-message a{ border-bottom: 1px dotted #000; color:#000; } .thanks-message a:hover{ text-decoration:none;} .fcloser{padding-top:1.5em;} #about_bt_content p.fcloser{padding-top:0.5em;} /* iPhone page styles */ #iphone_container{ width:640px; margin:0 auto; text-align:left; padding:10px 10px 20px 10px; background-color:#FFF;} #iphone_footer{ width:660px; margin:0 auto;padding:10px 0px 20px 0px;} #iphone_container h1#logo{ display:block; width:260px; height:85px; overflow:hidden; margin:0; padding:0; background:url(../images/iphone/logo.gif) no-repeat; text-indent:-9999px;} #iphone_container p{ margin:0 0 10px 0; line-height:150%; font-size:100%; color:#666; } #iphone_container #intro{ padding-left:285px; min-height:440px; height: auto !important; height:440px;background: url(../images/iphone/iphone_top_2.jpg) no-repeat; padding-top:10px;padding-right:20px;} #iphone_container.press_and_media #intro{ padding-left:285px; min-height:440px; height: auto !important; height:440px;background: url(../images/iphone/iphone_top.jpg) no-repeat; padding-top:10px;padding-right:20px;} #iphone_container h3{color:#000; padding:5px 0; font-size:1.4em; font-weight:700;} #iphone_container #intro ul{ padding:0 0 0 20px; } #iphone_container #intro ul li{ list-style-type: disc; list-style-position: outside; margin:10px 0; color:#ffcc00;line-height:150%; font-size:100%; } #iphone_container #intro ul li span{ color:#666; } #iphone_container #intro h3{ display:block; text-indent:-9999px; width:300px; height:41px; background:url(../images/iphone/titles/biscuit_tin_magic.gif) no-repeat; } #iphone_container .bookmarks_center{ text-align:center; padding-top:30px;} #iphone_container .bookmarks{ text-align:right; } #iphone_container .app_store{ display:block; width:187px; height:61px; margin:20px auto 0 auto; } #iphone_container .app_store a{ display:block; text-indent:-9999px; width:187px; height:61px; background: url(../images/iphone/app_store_badge.gif) no-repeat; } #iphone_container #video, #iphone_container #contact,#iphone_container #screenshots{margin:20px 0;} #iphone_container #video h3{ display:block; text-indent:-9999px; width:300px; height:22px; background:url(../images/iphone/titles/shake_and_discover.gif) no-repeat; } #iphone_container #video #vid_player{ display:block; width:640px; height:480px; background:url(../images/iphone/dummy_vid.jpg) no-repeat; } #iphone_container #contact h3{ display:block; text-indent:-9999px; width:137px; height:22px; background:url(../images/iphone/titles/get_in_touch.gif) no-repeat; } #iphone_container #contact #formSpace{ overflow:auto; } #iphone_container #contact #formSpace label{ width:350px; display:block; float:left; } #iphone_container #contact #formSpace label span{ display:block; text-indent:-9999px; width:180px; height:22px; } #iphone_container #contact #formSpace label span.name{background: url(../images/iphone/titles/whats_your_name.gif) no-repeat;} #iphone_container #contact #formSpace label span.email{background: url(../images/iphone/titles/whats_your_email.gif) no-repeat;} #iphone_container #contact #formSpace label span.comment{background: url(../images/iphone/titles/watchoo_talkin_about.gif) no-repeat;} #iphone_container #contact #formSpace input, #iphone_container #contact #formSpace textarea, #iphone_container #contact #formSpace span.error { float:right;clear:right; } #iphone_container #contact #formSpace div{ clear:both;overflow:auto; padding-bottom:10px; } #iphone_container #screenshots{ overflow: auto; } #iphone_container #screenshots h3{ display:block; text-indent:-9999px; width:300px; height:22px; background:url(../images/iphone/titles/looks_beautiful.gif) no-repeat; } #iphone_container #screenshots .screens{ float:left; margin: 0 13px; } #iphone_container #screenshots .screens#first{margin-left:0;} #iphone_container #screenshots .screens#last{ margin-right:0px; } /* iPhone press page styles */ #iphone_container.press_and_media a{ color:#F05822; } #iphone_container.press_and_media strong{ font-size:105%;color:#333333;} #iphone_container #intro_second{ padding:30px 0; } #iphone_container #quotes{ padding:0 0 30px 0; } #iphone_container #about_mn{ padding:10px 0 30px 0; } #iphone_container #quotes h3{ display:block; text-indent:-9999px; width:300px; height:22px; background:url(../images/iphone/titles/quotes.gif) no-repeat; } #iphone_container #press_images h3{ display:block; text-indent:-9999px; width:300px; height:22px; background:url(../images/iphone/titles/images.gif) no-repeat; } #iphone_container #about_mn h3{ display:block; text-indent:-9999px; width:300px; height:22px; background:url(../images/iphone/titles/about_mn.gif) no-repeat; } #iphone_container #quotes .quote_contain{ margin: 0 0 20px 0;padding:0 35px; background: url(../images/iphone/quote_left.gif) no-repeat;position:relative; } #iphone_container #quotes .quote_contain span.end_quote{ background: url(../images/iphone/quote_right.gif) no-repeat;display:block; height:20px; width:25px; position:absolute; bottom:0; right:0;} #iphone_container #press_images .pr_images{ float:left; margin: 0 1px; } #iphone_container #press_images .pr_images p{ margin:5px 0 0 0;text-align:center; } #iphone_container #press_images .pr_images p a{ }