/* Definitions */ .at2x(@path, @w: auto, @h: auto) { background-image: url(@path); @at2x_path: ~`"@{path}".split('.').slice(0, "@{path}".split('.').length - 1).join(".") + "@2x" + "." + "@{path}".split('.')["@{path}".split('.').length - 1]`; @media all and (-webkit-min-device-pixel-ratio : 1.5) { background-image: url(@at2x_path); background-size: @w @h; } } @font-face { font-family: 'Proxima Nova Extra Bold'; src: url('/static/occipital/fonts/proximanova/proximanova-extrabold-webfont.eot'); src: url('/static/occipital/fonts/proximanova/proximanova-extrabold-webfont.eot?#iefix') format('embedded-opentype'), url('/static/occipital/fonts/proximanova/proximanova-extrabold-webfont.woff') format('woff'), url('/static/occipital/fonts/proximanova/proximanova-extrabold-webfont.ttf') format('truetype'), url('/static/occipital/fonts/proximanova/proximanova-extrabold-webfont.svg#proxima_novaextrabold') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Proxima Nova Regular'; src: url('/static/occipital/fonts/proximanova/proximanova-regular-webfont.eot'); src: url('/static/occipital/fonts/proximanova/proximanova-regular-webfont.eot?#iefix') format('embedded-opentype'), url('/static/occipital/fonts/proximanova/proximanova-regular-webfont.woff') format('woff'), url('/static/occipital/fonts/proximanova/proximanova-regular-webfont.ttf') format('truetype'), url('/static/occipital/fonts/proximanova/proximanova-regular-webfont.svg#proxima_nova_rgregular') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Proxima Nova Semibold'; src: url('/static/occipital/fonts/proximanova/proximanova-semibold-webfont.eot'); src: url('/static/occipital/fonts/proximanova/proximanova-semibold-webfont.eot?#iefix') format('embedded-opentype'), url('/static/occipital/fonts/proximanova/proximanova-semibold-webfont.woff') format('woff'), url('/static/occipital/fonts/proximanova/proximanova-semibold-webfont.ttf') format('truetype'), url('/static/occipital/fonts/proximanova/proximanova-semibold-webfont.svg#proxima_novasemibold') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Proxima Nova Regular Italic'; src: url('/static/occipital/fonts/proximanova/proximanova-regularitalic-webfont.eot'); src: url('/static/occipital/fonts/proximanova/proximanova-regularitalic-webfont.eot?#iefix') format('embedded-opentype'), url('/static/occipital/fonts/proximanova/proximanova-regularitalic-webfont.woff') format('woff'), url('/static/occipital/fonts/proximanova/proximanova-regularitalic-webfont.ttf') format('truetype'), url('/static/occipital/fonts/proximanova/proximanova-regularitalic-webfont.svg#proxima_novaregular_italic') format('svg'); font-weight: normal; font-style: normal; } @normalFont: "Proxima Nova Regular", 'Helvetica Neue', Arial, Helvetica, sans-serif; @regularitalicFont: "Proxima Nova Regular Italic", 'Helvetica Neue', Arial, Helvetica, sans-serif; @semiboldFont: "Proxima Nova Semibold", 'Helvetica Neue', Arial, Helvetica, sans-serif; @extraboldFont: "Proxima Nova Extra Bold", 'Helvetica Neue', Arial, Helvetica, sans-serif; @structureBlue: #00aad9; @structureBlueHover: #0099C4; .normalFont { font-family: @normalFont; font-size-adjust:0.488; -webkit-text-size-adjust: 0.488; font-weight:normal; font-style:normal; } .regularitalicFont { font-family: @regularitalicFont; font-size-adjust:0.488; -webkit-text-size-adjust: 0.488; font-weight:normal; font-style:normal; } .semiboldFont { font-family: @semiboldFont; font-size-adjust:0.488; -webkit-text-size-adjust: 0.488; font-weight:normal; font-style:normal; } .extraboldFont { font-family: @extraboldFont; font-size-adjust:0.488; -webkit-text-size-adjust: 0.488; font-weight:800; font-style:normal; } /* Main CSS */ body { background: #fefefe; } body.alternate { background: #1a1a1a; color: #eee; } body.alternate #footer { background: #1a1a1a; } h1, h2, h3, h4 { color: #333; } body.alternate h1, body.alternate h2, body.alternate h3, body.alternate h4 { color: #eee; } p { color: #444; } p em { .regularitalicFont; } .btn.btn-navbar { background: transparent; border: none; } .navbar .btn-navbar .icon-bar { background: #333; border: none; height: 3px; } select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input { border-radius: 2px; } body.alternate p { color: #eee; } .alternate-row { background: #202121; width: 100%; } h1,h2,h3,h4,h5, #overall-nav a.brand, strong { .semiboldFont; } p strong { .semiboldFont; } body, p, li { .normalFont; } a:hover { text-decoration: none; } h1,h2,h3,h4,h5,h6,strong,cite { font-style: normal; font-weight: normal; } .fancy { font-family:cursive; font-style:italic; } .chicklets { list-style-type: none; margin: 0; padding: 0; } .chicklets li { margin-bottom: 15px; } #world { } .btn-struct { background: @structureBlue; color: #fff !important; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.00); -webkit-font-smoothing: antialiased; padding: 7px 12px 4px 12px; text-align: center; border-radius: 2px; text-transform: uppercase; .semiboldFont; border-color: #00aad9; box-shadow: none; } .btn-struct.alt { background-color: #444 !important; background-image: none; color: #fff !important; -webkit-font-smoothing: antialiased; padding: 6px 12px 6px 12px; text-align: center; border: 0; } .btn-struct:hover { background: @structureBlueHover; } #home > div, #home-postfunc > .row, #developers > .row { padding-top: 40px; padding-bottom: 40px; } #developers > .row#dev-signup, #home > div#elevator-pitch { padding-top: 0; } .fakeimg { background: #333; } #home > div, #sensor div { } #home section > div { background: #ddd; } #slide-wrapper { opacity: 0; -webkit-transition-property: opacity; -webkit-transition-duration: 250ms; } #hardware { min-height: 500px; padding-bottom: 0; margin-top:60px; margin-bottom: 60px; } #hardware .thoughtful { margin-bottom: 40px; } #hardware .thoughtful .image { text-align: center; } /* Feature Callouts */ @-webkit-keyframes pulsate { 0% {-webkit-transform: scale(1, 1); opacity: 0.0;} 50% {opacity: 1.0;} 100% {-webkit-transform: scale(1.5, 1.5); opacity: 0.0;} } #hardware-callout { position: absolute; margin-left: -518px; left: 50%; } .marker { width: 30px; height: 30px; background: #419aff; border-radius: 20px; position: absolute; cursor: pointer; } .marker > span { height: 30px; width: 30px; position: absolute; background: transparent; border: 2px solid #4C85C9; display: block; border-radius: 5em; -webkit-animation: pulsate 1s ease-out; -webkit-animation-iteration-count: infinite; opacity: 0.0; margin: -2px 0 0 -2px; z-index: 1; } .marker#camera-marker { margin-top: 130px; margin-left: 850px; } /* Table Inversion */ .table-striped tbody > tr:nth-child(odd) > td, .table-striped tbody > tr:nth-child(odd) > th { } /* Navbar */ #overall-nav { margin-bottom: 0; min-height: 100px; } .navbar-fixed-top .navbar-inner, .navbar-static-top .navbar-inner { -webkit-box-shadow: none; box-shadow: none; border: none; } @-webkit-keyframes fadein { 0% {opacity: 0;} 100% {opacity: 1} } #overall-nav.moved { opacity: 1; } #overall-nav a { color: #555; text-transform: uppercase; font-size: 14px; .semiboldFont; } body.alternate .navbar .nav > li > a { text-shadow: none; } body.alternate #overall-nav a { color: #959ba1; } #overall-nav .navbar-inner { background: transparent; border: none; -webkit-box-shadow: none; box-shadow: none; } .navbar .nav > .active > a, .navbar .nav > .active > a:hover, .navbar .nav > .active > a:focus { background: transparent; -webkit-box-shadow: none; } #overall-nav .nav { margin-top:20px; padding-bottom: 20px; } #overall-nav a.active { border-bottom: 2px solid #000; } #overall-nav .navbar-inner .btn { margin-top:35px; } #overall-nav a.brand { height: 80px; width: 168px; background-repeat: no-repeat; background-position: 20px 10px; .at2x('/static/occipital/images/mondo/logo.png', 168px, 80px); } #overall-nav a.brand:hover { background-repeat: no-repeat; background-position: 20px 10px; .at2x('/static/occipital/images/mondo/logo.png', 168px, 80px); } body.alternate #overall-nav a.brand { background-position: 0 10px; .at2x('/static/occipital/images/mondo/developer-logo.png', 180px, 70px); height: 70px; width: 180px; padding-left: 0; margin-left: 0; } body.alternate #overall-nav a.brand:hover { background-position: 0 10px; .at2x('/static/occipital/images/mondo/developer-logo.png', 180px, 70px); } body.home #overall-nav li.home a { color: #000; } body.developer #overall-nav li.developers a { color: #fff; } body.press #overall-nav li.press a { color: #000; } #overall-nav a.brand span { display: none; text-transform: uppercase; } .navbar .nav > li > a { } #overall-nav a { line-height: 36px; } .btn { } .btn-large { padding: 11px 19px 8px 19px; } /* KS Button */ #overall-nav a { line-height: 36px; } #mondo-hero { background: #343338 url(/static/occipital/images/mondo/new-hero-bg.jpg) top center no-repeat; width: 100%; max-height: 540px; } #mondo-hero.struct-hero > .container > .row { padding-top: 20px; } #mondo-hero.struct-hero #hero-text { display: block; background: url(/static/occipital/images/mondo/hero-sensor.png) bottom right no-repeat; background-size: 630px 193px; } #mondo-hero.struct-hero #hero-text .kickstarter { margin-top: 40px; margin-bottom: 50px; padding: 10px 20px 14px 20px; background: @structureBlue; display: block; float: left; color: #fff; font-size: 16px; text-transform: uppercase; } #mondo-hero.struct-hero #hero-text .kickstarter:hover { background: @structureBlueHover; } #mondo-hero.struct-hero #hero-text .kickstarter span { padding: 0; margin: 0; font-size: 28px; display: block; .extraboldFont; letter-spacing: 1px; } #mondo-hero.struct-hero #hero-text h1 + p { font-size: 20px; margin-top: 30px; color: #ddd; } #mondo-hero.struct-hero #hero-text h1 { .extraboldFont; font-size: 80px; line-height: 90px; color: #fff; text-transform: uppercase; } #mondo-hero.struct-hero #hero-text p { color: #fff; } #mondo-hero.struct-hero #hero-text h1 span { font-size: 40px; line-height: 60px; display: block; color: @structureBlue; text-transform: none; .normalFont; } #mondo-hero.struct-hero #hero-text #kickstarter-play, #developer-hero.struct-hero #hero-text #kickstarter-play { text-align: center; } #mondo-hero.struct-hero #hero-text #kickstarter-play > a, #developer-hero.struct-hero #hero-text #kickstarter-play > a { margin-top: 150px; display: block; height: 114px; width: 114px; text-align: center; margin-left: auto; margin-right: auto; } #mondo-hero.struct-hero #hero-text #kickstarter-play > a > span, #developer-hero.struct-hero #hero-text #kickstarter-play > a > span { height: 114px; width: 114px; .at2x('/static/occipital/images/mondo/play-button-sprite.png', 228px, 114px); display: block; } #mondo-hero.struct-hero #hero-text #kickstarter-play > a:hover > span, #developer-hero.struct-hero #hero-text #kickstarter-play > a:hover > span { background-position: -114px 0; } #mondo-hero.struct-hero #hero-text #kickstarter-play > p a, #developer-hero.struct-hero #hero-text #kickstarter-play > p a { color: #fff; } #mondo-hero.struct-hero #hero-text #kickstarter-play p { .semiboldFont; } #functionality { overflow:hidden; position: absolute; left: 0; height: 550px; } /* Reference Screens */ #reference-screens .image img { width: 100%; height:intrinsic; } #reference-apps { margin-top:30px } #reference-apps h1 { margin-bottom: 30px; .normalFont; } #reference-apps ul { margin-bottom: 40px; text-align: center; } #reference-apps ul li { float: none; list-style-type: none; margin-right: 20px; display: inline; text-align: center; } #reference-apps ul li a { text-transform: uppercase; .semiboldFont; } #reference-apps ul li.active .btn-struct { background: #666 !important; } #reference-apps h1 { text-align: center; } #reference-apps h3 { .normalFont; } /* Hardware */ #hardware h2, #hardware h1 { text-align: center; } #hardware h1 { margin-bottom:30px; .normalFont; } .hardware-feature-detail { margin-top: 0; } #hardware h3 { padding: 0; margin: 0; font-size: 36px; margin-top: 40px; margin-bottom: 10px; .normalFont; } #hardware .text { margin-top:60px; } #hardware .hardware-feature-detail .detail-copy.alt { text-align: right; } #hardware .hardware-feature-detail .detail-image { height:250px; width: 250px; background-size:250px 250px; } #hardware .hardware-feature-detail .detail-image.pull-right { margin-left: 24px; } #hardware .hardware-feature-detail .detail-image.pull-left { margin-right: 24px; } #hardware .hardware-feature-detail.case .detail-image { background: url(/static/occipital/images/mondo/case-illo.png) no-repeat; background-position: center center; } #hardware .hardware-feature-detail.smaller .detail-image { background: url(/static/occipital/images/mondo/smaller-illo.png) no-repeat; background-position: center center; } #hardware .hardware-feature-detail.range .detail-image { background: url(/static/occipital/images/mondo/range-illo.png) no-repeat; background-position: center center; } #hardware .hardware-feature-detail.leds .detail-image { background: url(/static/occipital/images/mondo/sdk-illo.png) no-repeat; background-position: center center; } #hardware .feature-detail-image.leds { } #demo-apps-wrapper { background: #fafafa; border-top: none; border-bottom: 1px solid #ccc; padding-bottom: 100px; } /* Developers */ #home-developers { margin-top:60px; } #home-developers .sdk-info { background: #fafafa; border: 1px solid #ddd; border-radius: 4px; padding-top: 20px; padding-bottom: 0; } #home-developers .sdk-info p { font-size: 15px; color: #555; padding-right: 10px; } #home-developers .dev-info { margin-bottom: 40px; margin-top: 40px; } #home-developers .dev-info p { font-size: 15px; color: #555; } #home-developers h1 { text-align: center; margin-bottom: 30px; .normalFont; } #home-developers .logo { text-align: center; } #home-developers .logo span { display: block; height: 93px; width: 303px; .at2x('/static/occipital/images/mondo/sdk-logo.png', 303px, 93px); margin-top: 20px; background-repeat: no-repeat; margin-left: 20px; } /* Home Press */ #home-press { margin-top: 20px; border-bottom: 1px solid #ddd; padding-bottom: 20px; overflow: hidden; height: 50px; } #home-press ul { text-align: center; height: 55px; width: 100%; margin-left: auto; overflow: hidden; } #home-press ul li { float: none; list-style-type: none; margin-right: 20px; } #home-press ul li a { display: block; .at2x('/static/occipital/images/mondo/press-logos.png', 941px, 55px); } #home-press ul li a span { display: none; } #home-press ul li.nyt a { background-position: 0 0; height: 55px; width: 201px; } #home-press ul li.tc a { background-position: -311px 0; height: 55px; width: 158px; } #home-press ul li.mashable a { background-position: -570px 0; height: 55px; width: 122px; } #home-press ul li.cnet a { background-position: -795px 0; height: 55px; width: 146px; } #home-press .press-item h2 span { color: #666; } #hero-video { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; margin-top: 20px; } #hero-video iframe, #hero-video object, #hero-video embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; max-width: 960px; } #hero-video.active { display: block; } #pre-specs { background: url(/static/occipital/images/mocks/sensor-vertical-punched.png) center center no-repeat; height: 350px; } #applestyle { background: url(/static/occipital/images/mocks/applestyle.jpg) top center no-repeat; height:250px; background-size: 110%; } #reference-screens .tab-content { clear: both; } #privacy ol li { margin-left: 12px; } #nav-jump { } #nav-jump ul li { list-style-type: none; float:left; margin-right: 24px; } #nav-jump ul li a { background: #eee; padding: 4px 10px 4px 10px; } .syntaxhighlighter .toolbar { display: none; } /* Footer */ #footer { text-align: left; background: #666; margin-bottom: 40px; color: #fff; } #footer a { color: @structureBlue; } #footer ul li { list-style-type: none; margin-right: 10px; } #footer ul li:last-child { margin-right: 0; } #footer .footer-button { margin-top: 50px; display: block; } #footer #t-and-c ul, #footer #t-and-c p { font-size: 12px; } #footer-social { text-align: center; margin-top: 50px; } #footer-social li { float: left; margin-right: 20px; } #footer-social li a { display: block; height: 38px; width: 40px; } #footer-social li span { display: none; } #footer-social li.twitter a { background-position: 0 0; .at2x('/static/occipital/images/mondo/social-sprite.png', 585px, 38px); } #footer-social li.facebook a { background-position: -61px 0; .at2x('/static/occipital/images/mondo/social-sprite.png', 585px, 38px); } #footer-social li.youtube a { background-position: -123px 0; .at2x('/static/occipital/images/mondo/social-sprite.png', 585px, 38px); } #footer-social li.gplus a { background-position: -184px 0; .at2x('/static/occipital/images/mondo/social-sprite.png', 585px, 38px); } #footer-social li.github a { background-position: -246px 0; .at2x('/static/occipital/images/mondo/social-sprite.png', 585px, 38px); } #footer-social li.twitter a:hover { background-position: -300px 0; .at2x('/static/occipital/images/mondo/social-sprite.png', 585px, 38px); } #footer-social li.facebook a:hover { background-position: -361px 0; .at2x('/static/occipital/images/mondo/social-sprite.png', 585px, 38px); } #footer-social li.youtube a:hover { background-position: -423px 0; .at2x('/static/occipital/images/mondo/social-sprite.png', 585px, 38px); } #footer-social li.gplus a:hover { background-position: -484px 0; .at2x('/static/occipital/images/mondo/social-sprite.png', 585px, 38px); } #footer-social li.github a:hover { background-position: -546px 0; .at2x('/static/occipital/images/mondo/social-sprite.png', 585px, 38px); } /* Developers Page */ #developer-hero { background: #333337 url(/static/occipital/images/mondo/developer-hero.jpg) top center no-repeat; width: 100%; height: 400px; } body.developer .wrapper { padding-top: 60px; padding-bottom: 60px; } #developer-hero.struct-hero > .container > .row { padding-top: 20px; } #developer-hero.struct-hero #hero-text.active { display: block; } #developer-hero.struct-hero #hero-text .kickstarter { margin-top: 40px; margin-bottom: 50px; padding: 10px 20px 14px 20px; background: @structureBlue; display: block; float: left; color: #fff; font-size: 16px; text-transform: uppercase; } #developer-hero.struct-hero #hero-text .kickstarter:hover { background: @structureBlueHover; } #developer-hero.struct-hero #hero-text .kickstarter span { padding: 0; margin: 0; font-size: 28px; display: block; .extraboldFont; letter-spacing: 1px; } #developer-hero.struct-hero #hero-text h1 + p { font-size: 20px; margin-top: 30px; color: #ddd; } #developer-hero.struct-hero #hero-text h1 { .extraboldFont; font-size: 84px; line-height: 88px; color: #fff; } #developer-hero.struct-hero #hero-text p { color: #fff; } #developer-hero.struct-hero #hero-text h1 span { font-size: 49px; line-height: 60px; display: block; color: @structureBlue; .normalFont; } #developer-hero.struct-hero #hero-text #kickstarter-play { text-align: center; } #developer-hero.struct-hero #hero-text #kickstarter-play > a { margin-top: 90px; opacity: .8; display: block; } #developer-hero.struct-hero #hero-text #kickstarter-play p { .semiboldFont; } #start-developing h1 { .normalFont; } #start-developing p { font-size: 20px; color: #959ba1; margin-bottom: 40px; margin-left: 20px; } #start-developing ul li { margin-bottom: 12px; text-transform: uppercase; .semiboldFont; } #brackets h1 { text-align: center; margin-bottom: 20px; } #brackets ul li { margin-bottom: 12px; } #device-specs .table-striped tbody > tr:nth-child(odd) > td, .table-striped tbody > tr:nth-child(odd) > th { background: #202121; } #device-specs .table th, .table td { border-top: 0; } body.developer #early-access { background: @structureBlue; color: #fff; } body.developer #early-access input { padding:5px 8px; } body.developer #early-access button { .semiboldFont; } body.developer #open-ni p { padding-right: 20px; padding-top: 12px; color: #ccc; } body.developer #open-ni .logo img { padding-right: 15%; padding-top: 32px; padding-bottom: 12px; width: 70%; border-right: 1px solid #333; } #ios-developers-wrapper { } #ios-developers-wrapper #sdk-intro img { height:98px; margin-top:20px; margin-bottom:10px; } #ios-developers-wrapper #sdk-intro p { text-align: left; padding: 0 20px 0 0; } #ios-developers-wrapper h1 { text-align:center; margin-bottom: 12px; .normalFont; } #ios-developers-wrapper h1 + p { margin-bottom: 30px; font-size: 20px; color: #959ba1; margin-left: 20px; } #hackers { } #hacker-cable { background-color: @structureBlue; .at2x('/static/occipital/images/mondo/usb-cable.png', 555px, 80px); background-position: -20px 33px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid @structureBlueHover; margin-top: 20px; } #hacker-cable h2 { margin-left: 20px; margin-top: 20px; position: absolute; } #hacker-cable h3 { position: absolute; font-size: 18px; .normalFont; margin-top: 75px; margin-left: 20px; color: #ddd; } #hacker-cable p { margin-left: 570px; padding-top: 20px; padding-bottom: 15px; } #downloads h3 { margin-left: 20px; } #downloads ul li { margin-right: 20px; } body.alternate .navbar .btn-navbar .icon-bar { background: #eee; border: none; height: 3px; } body.alternate #overall-nav .btn-navbar { background: #333; border: 0; box-shadow: none; } #brackets ul { list-style-type:none; margin-left: 0; } body.alternate .navbar .btn-navbar:hover .icon-bar { background: #ddd; } #open-ni #open-ni-content { background: #1a1a1a; border-radius: 6px; padding-bottom: 20px; padding-top: 20px; } /* Mailchimp styles */ div.mce_inline_error { color: #604545; .semiboldFont; } input.mce_inline_error { border-color: red; } #mce-success-response { } /* Dedicated Press Page */ #press-header { margin-bottom: 40px; } .dev-section img { border: 1px solid #efefef; border-radius: 6px; width: 100%; } #press-logos .logo { background-color: #ddd; height: 107px; background-repeat: no-repeat; padding-top: 12px; padding-bottom: 12px; border-radius: 4px; } #press-logos .logo a { height: 100%; width: 100%; display: block; } #press-logos span { } #press-logos #black-logo { .at2x('/static/occipital/images/mondo/black-logo.png', 257px, 107px); background-position: center center; } #press-logos #white-logo { .at2x('/static/occipital/images/mondo/white-logo.png', 257px, 107px); background-position: center center; background-color: #aaa; } #press-logos #sdk-logo { .at2x('/static/occipital/images/mondo/sdk-logo.png', 303px, 93px); background-position: center center; } #press-page #photos, #press-page #press-lifestyle { margin-bottom: 40px; margin-top: 40px; text-align: center; } #press-page #press-lifestyle .photo { margin-bottom: 20px; } #press-page #press-coverage { margin-bottom: 60px; } #press-page #press-coverage .press-item { border-radius: 4px; } #press-page #press-coverage h2 { display: block; float: left; position: absolute; width: 250px; text-align: center; margin-top: -45px; } #press-page #press-coverage h2 a { display: block; .at2x('/static/occipital/images/mondo/press-logos.png', 941px, 55px); height: 55px; background-repeat: none; margin-left: auto; margin-right: auto; } #press-page #press-coverage h2 span { display: none; } #press-page #press-coverage .press-item.nyt h2 a { background-position: 0 0; height: 55px; width: 201px; } #press-page #press-coverage .press-item.tc h2 a { background-position: -311px 0; height: 55px; width: 158px; } #press-page #press-coverage .press-item.mashable h2 a { background-position: -570px 0; height: 55px; width: 122px; } #press-page #press-coverage .press-item.cnet h2 a { background-position: -795px 0; height: 55px; width: 146px; } #press-page #press-coverage .press-item p { margin-left: 250px; padding-bottom: 24px; margin-right: 12px; } #press-page #press-coverage .press-item h1 { margin-left: 250px; padding: 0; margin-bottom: 0; } #press-page #press-coverage .press-item p.date { font-size: 13px; text-transform: uppercase; .semiboldFont; padding: 12px 0 0 0; color: #999; } #press-page #press-coverage .container .row:nth-child(even) .press-item { background-color: transparent; } #press-page #press-coverage .container .row:nth-child(odd) .press-item { background-color: #eee; } #press-logos .logo + p span { display: block; } #press-photos .photo-row .photo, #press-lifestyle .photo-row .photo { float: left; width: 32%; margin-right: 1%; text-align: center; margin-bottom: 10px; } #press-photos .photo-row .photo:first-child, #press-lifestyle .photo-row .photo:first-child { margin-left: 1%; } #press-photos .photo-row .photo:last-child, #press-lifestyle .photo-row .photo:last-child { margin-right: 0; } #press-page #press-video { height: 114px; width: 114px; .at2x('/static/occipital/images/mondo/play-button-sprite.png', 228px, 114px); background-repeat: no-repeat; display: block; margin: 0 auto 0 auto; } #press-sidebar h4, #press-sidebar p { color: #fff; text-shadow: 0 0 2px #000; } #press-sidebar a { color: #fff; .semiboldFont; } /* Popular Science */ body.moreinfo #overall-nav .nav-collapse, body.moreinfo #overall-nav .btn-navbar { display: none; } body.moreinfo #footer { display: none; } #moreinfo-hero { height: 340px; background: #343338 url(/static/occipital/images/mondo/new-hero-bg.jpg) top center no-repeat; overflow: hidden; box-shadow: inset 0 0 10px 0 #333; } #moreinfo-hero h1 { color: #fff; text-align: center; .normalFont; font-weight: normal; font-size: 50px; margin-top: 20px; } #moreinfo-hero h1 strong { .normalFont; font-style:normal; } #moreinfo-hero p { color: #fff; text-align: center; font-size: 26px; } #moreinfo-hero #moreinfo-sensor { background: transparent url('/static/occipital/images/popsci/silver_ipad_straight2.png') no-repeat; background-position: center 40px; background-size: 460px 314px; height: 320px; position: relative; z-index: 100; -webkit-transition: background-position 0.25s; } #moreinfo-hero #moreinfo-play { text-align: center; } #moreinfo-hero #moreinfo-play span { background: transparent url('/static/occipital/images/popsci/play-video.png') top left no-repeat; height: 184px; width: 324px; display: block; margin: 40px auto 0 auto; } #home-nav { position: relative; z-index: 101; background: #fff; border-top: 1px solid #999; border-bottom: 1px solid #999; background: #eee; margin: 0 auto 0 auto; text-align: center; } #home-nav ul { margin: 0 auto 0 auto; } #home-nav ul li { padding: 14px 12px 12px 12px; color: #eee; text-transform: uppercase; .semiboldFont; } #home-nav ul li a { color: #666; padding: 14px 12px 12px 12px; border-left: 1px dashed #ddd; border-right: 1px dashed #ddd; } body.moreinfo #press-photos .photo:hover { background: #eee; } .alternate-row.wrapper.moreinfo h1 { color: #fff; margin-top: 20px; } .alternate-row.wrapper.moreinfo p { color: #eee; } body.moreinfo #press-photos .photo-row .photo { } body.moreinfo #download-press-kit .raptastic { background: @structureBlue; border-radius: 4px; color: #fff; text-align: center; padding: 12px 0 12px 0; margin-bottom: 40px; } body.moreinfo #download-press-kit .raptastic h1 { color: #fff; } body.moreinfo #download-press-kit .raptastic .btn-struct { background: #fff; color: @structureBlue !important; } #moreinfo-videos h3 { font-size: 20px; text-align: center; line-height: 24px; } .responsive-video { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; } .responsive-video iframe, .responsive-video object, .responsive-video embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } #moreinfo-mobile .row { margin-bottom: 40px; } #moreinfo-mobile img { border-radius: 6px; } #moreinfo-mobile img.naked { border-radius: 0; border: none; } #moreinfo-mobile h2 { border-bottom: 4px solid #000; } ul.side-by-side > li { float: left; clear: right; width: 50%; } body.moreinfo #press-photos, body.moreinfo #press-lifestyle { text-align: center; } body.moreinfo #press-photos img, body.moreinfo #press-lifestyle img { margin-left: auto; margin-right: auto; } body.moreinfo .fakt { clear: both; } body.moreinfo .fakt h2 { width: 100%; padding: 0; } body.moreinfo .fakt img { float: left; clear: left; width: 35%; } body.moreinfo .fakt .copy { float: left; clear: right; width: 60%; margin-left: 5%; } body.moreinfo .fakt.alt img { float: left; clear: left; width: 35%; } body.moreinfo .fakt.alt .copy { float: left; clear: right; width: 60%; margin-left: 5%; } #moreinfo-mobile .fakt img { margin-top: 0; } body.moreinfo #moreinfo-mobile .fakt li { margin-right: 12px; } body.moreinfo #ios-developers-wrapper p + img { text-align: center; } body.moreinfo #ios-developers-wrapper #ios-developers { .at2x('/static/occipital/images/mondo/dev-sdk-logo.png',303,93); background-size: 303px 93px; background-position: center 10px; background-repeat: no-repeat; padding-top: 113px; } body.moreinfo #ios-developers-wrapper #sdk-intro { text-align: center; } body.moreinfo #ios-developers-wrapper #sdk-intro img { margin-left: auto; margin-right: auto; height: 80px; width: 250px; text-align: center; } body.moreinfo #press-photos h1, body.moreinfo #press-lifestyle h1 { text-align: left; } body.moreinfo #press-photos .photo-row, body.moreinfo #press-lifestyle .photo-row { margin-bottom: 20px; } body.moreinfo #secret-logo a { .at2x('/static/occipital/images/popsci/grey-logo.png', 100, 21); background-size: 100px 21px; height: 21px; width: 100px; position: absolute; top: 39.5px; right: 39.5px; } body.moreinfo #ios-developers-wrapper #sdk-intro img { } /* Popsci Overrides */ @media (min-width: 1200px) { #moreinfo-hero #moreinfo-sensor { background-size: 535px 365px; } body.moreinfo .fakt.alt img { } } @media (max-width: 979px) { #moreinfo-hero h1 { font-size: 40px; } #moreinfo-hero p { font-size: 20px; } #moreinfo-hero #moreinfo-sensor { background-size: 352px 240px; } } @media (max-width: 794px) { } @media (max-width: 767px) { #moreinfo-hero h1 { font-size: 34px; } #moreinfo-hero p { font-size: 20px; } #moreinfo-hero #moreinfo-play span { width: 200px; height: 114px; background-size: 200px 114px; margin-top: 10px; } #moreinfo-hero #moreinfo-sensor { background-size: 352px 240px; } #moreinfo-mobile .shot { text-align: center; } #moreinfo-mobile .shot img { margin-left: auto; margin-right: auto; } ul.side-by-side > li { float: none; } #moreinfo-mobile ul { margin-left: 40px; } #moreinfo-mobile .fakt img { margin-top: 40px; } #moreinfo-mobile .fakt.alt img { } } @media (max-width: 667px) { body.moreinfo #secret-logo a { top: 19.5px; right: 19.5px; } } @media (max-width: 480px) { #moreinfo-hero h1 { font-size: 26px; line-height: 30px; margin-top: 10px; } #moreinfo-hero p { font-size: 16px; line-height: 22px; } #moreinfo-mobile .fakt.alt img { margin-left: 0; } ul.side-by-side > li { width: 100%; } #moreinfo-mobile ul li ul { margin-left: 20px; } #moreinfo-mobile h1, #moreinfo-mobile h2, #moreinfo-mobile p { margin-left: 0; } body.moreinfo #ios-developers-wrapper h1 + p { font-size: 16px; } } /* Overrides */ @media (min-width: 980px) { #hardware .copy p { font-size: 1.2em; line-height: 1.5em; margin-top: 70px; } #home-developers .logo span { border-right: 1px solid #ddd; padding-right: 10%; margin-top: 27px; } } /* Large desktop */ @media (min-width: 1200px) { #home-developers .logo span { border-right: 1px solid #ddd; padding-right: 20%; margin-top: 15px; } #hacker-cable p { padding-top: 45px; padding-bottom: 30px; } #developer-hero.struct-hero #hero-text #kickstarter-play > a { margin-top: 70px; } } /* Mobile sizing */ @media (max-width: 979px) { body { padding-top: 0; } .navbar .btn, .navbar .btn-group { margin-top: 20px; } #mondo-hero.struct-hero #hero-text { background-size: 415px 127px; } #mondo-hero.struct-hero #hero-text h1 { font-size: 60px; line-height: 70px; } #mondo-hero.struct-hero #hero-text h1 span { font-size: 35px; line-height: 45px; } } /* Desktop sizing */ @media (min-width: 768px) { body { font-size: 16px; background: #fefefe; } body, li { line-height: 26px; } #overall-nav a { line-height: 36px; } #home > div, #sensor div { padding-bottom: 40px; } #developers #developer-pitch { margin-top: 60px; } #home-developers .logo span { border-right: 1px solid #ddd; padding-right: 10%; } } /* Portrait tablet to landscape and desktop */ @media (min-width: 768px) and (max-width: 979px) { #overall-nav .nav-collapse a:hover { background: #eee; } body.alternate #overall-nav .nav-collapse a:hover { background: #000; } #home-developers .logo span { margin-top: 50px; width: 231px; height: 71px; background-size: 231px 71px; } #hardware .copy { margin-top:25px; font-size: 1.2em; line-height: 1.6em } #developers .logo img { margin-top: 45px; width: 90%; } #footer-social li { float: left; margin-right: 20px; margin-bottom: 10px; } #footer-social li a { display: block; height: 38px; width: 38px; background: url(/static/occipital/images/mondo/social-sprite.png) 0 0 no-repeat; } #developer-hero.struct-hero #hero-text h1 { font-size: 66px; line-height: 70px; } #developer-hero.struct-hero #hero-text h1 + p { font-size: 16px; } #start-developing h1 { font-size: 32px; } body.developer #open-ni .logo img { padding-top: 15%; padding-bottom: 15%; } #hacker-cable { background-position: -150px 33px; } #hacker-cable p { margin-left: 420px; margin-right: 12px; } /* Dedicated Press Page */ #press-logos #black-logo { background-size: 208px 87px; } #press-logos #white-logo { background-size: 208px 87px; } #press-logos #sdk-logo { background-size: 208px 64px; } #press-header img { border-radius:4px; padding-top: 5px; padding-bottom: 5px; } } @media (max-width: 767px) { body { padding-left: 0; padding-right: 0; } .dev-section img { border: 0; border-radius: 0; } #home-developers .dev-info p, #home-developers .dev-info h3 { margin-left: 10px; margin-right: 10px; } #home-developers .dev-info .dev-section { margin-bottom: 30px; } #overall-nav .nav-collapse a:hover { background: #eee; } body.alternate #overall-nav .nav-collapse a:hover { background: #000; } #home-developers .logo span { margin-top: 0; margin-left: auto; margin-right: auto; margin-bottom: 16px; } #home-developers .sdk-info { text-align: center; border-radius: 0; } #hacker-cable { background-position: -150px 33px; border-radius: 0; } #hacker-cable p { margin-left: 420px; margin-right: 12px; padding-top: 30px; } /* Press Page */ #press-logos #black-logo { .at2x('/static/occipital/images/mondo/black-logo.png', 208px, 87px); background-position: center center; } #press-logos #white-logo { .at2x('/static/occipital/images/mondo/white-logo.png', 257px, 107px); background-position: center center; background-color: #aaa; } #press-logos #sdk-logo { .at2x('/static/occipital/images/mondo/sdk-logo.png', 303px, 93px); background-position: center center; } #press-header .chicklets { margin: auto; text-align: center; width: 288px; } #press-header .chicklets li { float: left; margin-right: 15px; margin-left: auto; } #press-header #press-sidebar { text-align: center; } #press-header #press-sidebar textarea { margin: auto; width: 540px; margin-bottom: 20px; } #press-header h4 { clear: both; } #press-header h4 + p { display: none; } #press-page #press-coverage .press-item { border-radius: 0; } #press-page h1 { margin-left: 10px; } #press-logos .logo + p { margin-left: 10px; margin-bottom: 30px; text-align: center; } #press-logos .logo + p span { display: none; } #press-logos .logo { border-radius: 0; margin-bottom: 10px; } #mondo-hero.struct-hero #hero-text { height: 400px; background-size: 415px 127px; background-position: bottom center; } #mondo-hero.struct-hero #hero-text #kickstarter-play > p a, #developer-hero.struct-hero #hero-text #kickstarter-play > p a { display: none; } } @media (min-width: 662px) and (max-width: 767px) { #overall-nav { margin-bottom: 0; } #overall-nav .navbar-inner .btn { margin-top: 30px; } #mondo-hero > .container > .row { padding-top: 0; } #mondo-hero, #demo-apps-wrapper { width: 100%; } #mondo-hero.struct-hero #hero-text #big-pitch { padding-left: 20px; width: 57%; } #mondo-hero.struct-hero #hero-text #big-pitch p { line-height: 1.5em; } #mondo-hero.struct-hero #hero-text #kickstarter-play { text-align: center; margin-top: -140px; margin-left: 55%; width: 40%; } #mondo-hero.struct-hero #hero-text #kickstarter-play p { display: none; } #mondo-hero.struct-hero #hero-text #kickstarter-play > a { margin-top: 0; } #home-press, #home-press ul { height: 40px; } #home-press ul li { margin-right: 10px; } #home-press ul li a { background-size: 684px 40px; } #home-press ul li.nyt a { height: 40px; width: 146px; } #home-press ul li.tc a { background-position: -226px 0; height: 40px; width: 114px; } #home-press ul li.mashable a { background-position: -416px 0; height: 40px; width: 89px; } #home-press ul li.cnet a { background-position: -578px 0; height: 40px; width: 106px; } #developer-hero.struct-hero #hero-text h1 { font-size: 54px; line-height: 64px; text-align: center; } #developer-hero.struct-hero #hero-text h1 + p { text-align: center; position: absolute; margin-top: 200px; font-size: 16px; color: #efefef; margin-left: 15px; margin-right: 15px; line-height: 20px; } #developer-hero.struct-hero #hero-text #kickstarter-play > a { margin-top: 40px; } #hardware .thoughtful { text-align: center; } #hardware .thoughtful .copy p { font-size: 16px; } #reference-apps { margin-top:60px; margin-left:20px; } #reference-apps .copy p, #reference-apps .copy h3 { width: 90%; margin-left: 5%; } #reference-screens { } #reference-screens .image img { width: 90%; height: intrinsic; margin-left: 5%; } #home-developers .logo span { } #developers .logo img { margin-top: 0; width: 40%; margin-bottom: 20px; } #developers .sdk-info p { font-size: 16px; width: 90%; margin-left: 5%; } #developers .dev-section { margin-bottom: 40px; } /* Dev Page */ #ios-developers-wrapper { background-position: right 20px; } #ios-developers-wrapper #sdk-intro, #ios-developers-wrapper #framework-intro { margin-bottom: 40px; } #ios-developers-wrapper #sdk-intro img, #ios-developers-wrapper #framework-intro img { margin-left: 20px; } #ios-developers-wrapper #framework-intro pre { margin-left: 20px; margin-right: 20px; } #ios-developers-wrapper #sdk-intro p, #ios-developers-wrapper #framework-intro p { text-align: left; padding: 0 20px 0 20px; font-size: 16px; line-height: 22px; } #start-developing #download-flair img { display: none; } #start-developing p { font-size: 18px; line-height: 22px; padding-left: 10px; padding-right: 5px; padding-top: 400px; background: url(/static/occipital/images/mondo/ipad-for-downloads.png) center 20px no-repeat; } #hackers { background-position: right 0px; } #brackets p, #brackets h1, #brackets ul { margin-left: 10px; margin-right: 10px; } #drivers h1, #drivers h2, #drivers h3, #drivers p { margin-left: 10px; margin-right: 10px; } #drivers .btn-struct { margin-bottom: 20px; } #open-ni #open-ni-content { background: transparent; border-radius: 0; padding-bottom: 20px; padding-top: 20px; } body.developer #open-ni p { margin-right: 10px; padding-top: 12px; color: #ccc; margin-left: 10px; padding-right: 0; } body.developer #open-ni h1 { display: none; } body.developer #open-ni .logo { text-align: center; } body.developer #open-ni .logo img { padding-right: 0; padding-top: 32px; padding-bottom: 12px; width: 70%; border-right: none; } #pre-specs { background: url(/static/occipital/images/mocks/sensor-horizontal-punched.png) center center no-repeat; height: 100px; margin-top: 40px; } /* Press Page */ #footer .footer-button { width: 50%; margin-left: 25%; } #footer-social { text-align: center; } #footer-social li { display: inline-block; float: inherit; } } /* Landscape phones and down */ @media (max-width: 661px) { body { padding-left: 0; padding-right: 0; } h1 { font-size: 28.5px; } h2 { font-size: 20px; line-height: 30px; } h3 { font-size: 16px; .semiboldFont; } #overall-nav { min-height: 40px; } #overall-nav .navbar-inner { min-height: 40px; } #overall-nav a.brand { background: transparent url(/static/occipital/images/mondo/logo.png) 20px 10px no-repeat; background-size: 84px 40px; height: 40px; width: 84px; } #overall-nav a.brand:hover { background: transparent url(/static/occipital/images/mondo/logo.png) 20px 10px no-repeat; background-size: 84px 40px; } #overall-nav .navbar-inner .btn { margin-top: 15px; } #mondo-hero { height: 400px; } #mondo-hero.struct-hero #hero-text h1, #developer-hero.struct-hero #hero-text h1 { font-size: 34px; line-height: 34px; text-align: center; } #mondo-hero.struct-hero #hero-text h1 span { font-size: 24px; line-height: 28px; } #mondo-hero.struct-hero #hero-text h1 + p { text-align: center; position: absolute; margin-top: 170px; width: 100%; font-size: 16px; color: #efefef; } #mondo-hero.struct-hero > .container > .row { padding-top: 0; } #developer-hero.struct-hero #hero-text h1 { font-size: 40px; line-height: 38px; text-align: center; padding: 0; margin: 0; } #developer-hero.struct-hero #hero-text h1 + p { text-align: center; position: absolute; margin-top: 200px; font-size: 16px; color: #efefef; margin-left: 15px; margin-right: 15px; line-height: 20px; } #developer-hero.struct-hero #hero-text #kickstarter-play > a { margin-top: 40px; } #home > div, #home-postfunc > .row, #developers > .row { padding-top: 20px; padding-bottom: 20px; } #overall-nav a { line-height: 16px; } #overall-nav a:hover { background: #eee; } #overall-nav a.brand { font-size: 25px; padding-top: 10px; } .navbar .btn, .navbar .btn-group { margin-top: 5px; } #mondo-hero.struct-hero #hero-text .kickstarter { display: none; } #mondo-hero.struct-hero #hero-text #kickstarter-play { margin-top: 30px; } #mondo-hero.struct-hero #hero-text #kickstarter-play > a { margin-top: 0; } #home-press, #home-press ul { height: 23px; } #home-press ul li { margin-right: 0; } #home-press ul li a { background-size: 393px 23px; background-repeat: no-repeat; } #home-press ul li.nyt a { height: 23px; width: 84px; } #home-press ul li.tc a { background-position: -130px 0; height: 23px; width: 66px; } #home-press ul li.mashable a { background-position: -239px 0; height: 23px; width: 49px; } #home-press ul li.cnet a { background-position: -332px 0; height: 23px; width: 62px; } body.home #hardware .thoughtful .image { text-align: center; } body.home #hardware p { padding-left: 20px; padding-right: 20px; text-align: center; } body.home #hardware h3 { font-size: 30px; text-align: center; margin-top: 5px; clear: both; width: 100%; } #hardware .hardware-feature-detail .detail-image { float: none; } body.home .hardware-feature-detail { margin-top: 0; } body.home .hardware-feature-detail:nth-child(odd) { background: #eee; } #hardware .hardware-feature-detail.leds .detail-image { height: 275px; } body.alternate #overall-nav a.brand { height: 40px; width: 108px; background-size: 108px 40px; } #reference-apps, #home-developers { margin-top:20px } #reference-apps ul { width:auto; text-align:-webkit-center; margin-left: 2%; } #reference-apps ul li, #reference-apps ul li a { float: left; display:block; } #reference-apps ul li { margin-left: 0; margin-bottom: 10px; width: 48%; margin-right: 2%; } #reference-apps ul li:last-child { margin-right: 0; } #reference-apps ul li a { float: none; } body.home .demo-app-pane h3, body.home .demo-app-pane p { padding: 0 10px 0 10px; } body.home .demo-app-pane h3 { .semiboldFont; font-size: 20px; } #home-developers .sdk-info p { padding-left: 12px; } #reference-screens .image img { width: 90%; height: intrinsic; margin-left: 5%; } #home-developers h3 { font-size: 20px; .semiboldFont; } #home-developers h3, #home-developers p { padding-left: 12px; padding-right: 10px; } #home-developers .dev-section { margin-bottom: 30px; } #home-developers .logo span { margin-top: 0; width:auto; margin-bottom: 20px; } #ios-developers-wrapper { background-position: right 20px; } #ios-developers-wrapper #sdk-intro p { text-align: center; padding: 0 5px 0 5px; } #ios-developers-wrapper h1 { text-align:center; margin-bottom: 0; } #ios-developers-wrapper #sdk-intro, #ios-developers-wrapper #framework-intro { text-align: center; margin-bottom: 40px; } #ios-developers-wrapper pre { border-radius: 0; padding: 0; } #start-developing h1 { text-align: left; margin-left: 10px; } #start-developing p { font-size: 18px; line-height: 22px; padding-left: 10px; padding-right: 5px; padding-top: 400px; background: url(/static/occipital/images/mondo/ipad-for-downloads.png) center 20px no-repeat; } #start-developing h3 { font-size: 22px; margin-left: 10px; text-transform: uppercase; .semiboldFont; } #start-developing ul { margin-left: 10px; margin-right: 10px; } #start-developing ul li { } #start-developing #downloads p { font-size: 16px; color: #fff; margin-bottom: 12px; } #start-developing #downloads ul li p { padding-left: 0; } #start-developing #download-flair img { display: none; } .ghbtns-wrapper { text-align: center; } #hackers { background-position: right 0px; } #hackers h2, #hackers p { margin-left: 10px; margin-right: 10px; } #hacker-cable { .at2x('/static/occipital/images/mondo/usb-cable-vertical.png', 60px, 165px); background-size: 60px 165px; background-position: 20px -30px; border-radius: 0; } #hacker-cable p { margin-left: 120px; margin-right: 12px; padding-top: 0; } #hacker-cable h2 { position: relative; margin-left: 120px; font-size: 26px; } #hacker-cable h3 { display: none; font-size: 14px; } #downloads ul li { margin-right: 10px; } #start-developing p { margin-left: 0; } #ios-developers-wrapper h1 + p { line-height: 24px; margin-left: 10px; } #brackets p, #brackets h1, #brackets ul { margin-left: 10px; margin-right: 10px; } #drivers h1, #drivers h2, #drivers h3, #drivers p { margin-left: 10px; margin-right: 10px; } #drivers .btn-struct { margin-bottom: 20px; } #open-ni #open-ni-content { background: transparent; border-radius: 0; padding-bottom: 20px; padding-top: 20px; } body.developer #open-ni p { margin-right: 10px; padding-top: 12px; color: #ccc; margin-left: 10px; padding-right: 0; } body.developer #open-ni h1 { display: none; } body.developer #open-ni .logo { text-align: center; } body.developer #open-ni .logo img { padding-right: 0; padding-top: 32px; padding-bottom: 12px; width: 70%; border-right: none; } body.developer #pre-specs h2 { text-align: center; } #developer-cta a.btn-struct { clear: both; float: none; display: block; margin-bottom: 10px; } #functionality { height: 360px; } #hardware h1, #reference-apps h1 { font-size: 26px; } #kickstarter #kickstarter-embed { margin-left: 60px; } #hardware .hardware-feature-detail .detail-copy { padding-bottom: 20px; padding-top: 20px; } #hardware .hardware-feature-detail .detail-copy.alt .detail-image.pull-right, #hardware .hardware-feature-detail .detail-copy .detail-image.pull-left { float: none; width: 100%; margin-right: 0; margin-left: 0; } #hardware .hardware-feature-detail .detail-image, #hardware .hardware-feature-detail .detail-image.pull-right { height: 250px; width: 250px; } #demo-apps-wrapper { padding-bottom: 20px; } #pre-specs { background: url(/static/occipital/images/mocks/sensor-horizontal-punched.png) center center no-repeat; height: 100px; margin-top: 40px; } #device-specs h2 { text-transform: uppercase; margin-left: 10px; } #applestyle { height:110px; } #footer-social { text-align: center; } #footer-social li { display: inline-block; float: inherit; } #footer .footer-button { width: 50%; margin-left: 22.5%; } /* Press Page */ #press-page #press-coverage h2 { display: block; float: none; position: relative; text-align: left; margin-top: 0; } #press-page #press-coverage h2 a { background: transparent; font-size: 14px; margin-left: 10px; height: inherit; } #press-page #press-coverage .press-item.nyt h2 a { height: inherit; } #press-page #press-coverage .press-item.tc h2 a { height: inherit; } #press-page #press-coverage .press-item.cnet h2 a { height: inherit; } #press-page #press-coverage h2 a span { display:block; } #press-page #press-coverage h2 { } #press-page #press-coverage .press-item p,#press-page #press-coverage .press-item h1 { margin-left: 10px; margin-right: 10px; } } /* iPhone only */ @media (max-width: 320px) { .navbar .brand { margin-left: -20px; } body.developer .wrapper { padding-top: 30px; padding-bottom: 30px; } #mondo-hero.struct-hero #hero-text h1, #developer-hero.struct-hero #hero-text h1 { font-size: 24px; line-height: 30px; text-shadow: 0 0 2px #555; } #mondo-hero.struct-hero, #mondo-hero.struct-hero #hero-text, #developer-hero.struct-hero, #developer-hero.struct-hero #hero-text { height: 320px; } #developer-hero.struct-hero #hero-text { display: block; background: url(/static/occipital/images/mondo/hero-sensor.png) bottom right no-repeat; background-size: 630px 193px; } #mondo-hero.struct-hero #hero-text #kickstarter-play, #developer-hero.struct-hero #hero-text #kickstarter-play { margin-top: 20px; } #mondo-hero.struct-hero #hero-text #kickstarter-play > a, #mondo-hero.struct-hero #hero-text #kickstarter-play > a > span, #developer-hero.struct-hero #hero-text #kickstarter-play > a, #developer-hero.struct-hero #hero-text #kickstarter-play > a > span { height: 57px; width: 57px; } #mondo-hero.struct-hero #hero-text #kickstarter-play > a > span, #developer-hero.struct-hero #hero-text #kickstarter-play > a > span { background-size: 114px 57px; } #mondo-hero.struct-hero #hero-text #kickstarter-play > a > span:hover { background-position: -114px 0; } #mondo-hero.struct-hero #hero-text, #developer-hero.struct-hero #hero-text { background-size: 320px 98px; } #mondo-hero.struct-hero #hero-text h1 + p, #developer-hero.struct-hero #hero-text h1 + p { margin-top: 100px; } #mondo-hero.struct-hero #hero-text h1 span { color: #fff; } #ios-developers-wrapper #sdk-intro img { height: intrinsic; } #ios-developers-wrapper h1 + p { font-size: 16px; line-height: 22px; margin-right: 10px; } #mondo-hero.struct-hero #hero-text h1 + p { text-shadow: 0 0 2px #555; } #developer-hero.struct-hero > .container > .row { padding-top: 0; } #developer-hero.struct-hero #hero-text h1 + p { margin-top: 100px; font-size: 14px; margin-left: 10px; margin-right: 10px; } #developer-hero.struct-hero #hero-text #kickstarter-play > a { margin-top: -180px; } #brackets h1 { text-align: center; margin-bottom: 0; } #home-nav ul li a { color: @structureBlue; padding: 14px 12px 12px 12px; border-left: none; border-right: none; text-decoration: underline; } body.moreinfo .fakt .copy, body.moreinfo .fakt.alt .copy, body.moreinfo .fakt img, body.moreinfo .fakt.alt img { float: none; width: 100%; margin-left: 0; margin-right: 0; clear: both; border: none; border-radius: 0; } body.moreinfo #ios-developers-wrapper p { text-align: center; } body.moreinfo #download-press-kit .raptastic { border-radius: 0; } #moreinfo-mobile .fakt img { border-radius: 0; } body.moreinfo #press-photos .photo-row, body.moreinfo #press-lifestyle .photo-row { margin-bottom: 0; } }