/* ==|== primary styles ===================================================== Author: Style Hatch Otis - 1.0.0 Premium Tumblr Theme http://otis.stylehatch.co Theme by: Style Hatch - http://stylehatch.co Support: otis@stylehatch.co | @stylehatch | http://tumblr.com/theme/00000 _____ __ __ __ __ __ __ / ___// /___ __/ /__ / / / /___ _/ /______/ /_ \__ \/ __/ / / / / _ \ / /_/ / __ `/ __/ ___/ __ \ ___/ / /_/ /_/ / / __/ / __ / /_/ / /_/ /__/ / / / /____/\__/\__, /_/\___/ /_/ /_/\__,_/\__/\___/_/ /_/ /____/ ========================================================================== */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font: inherit; font-size: 100%; vertical-align: baseline; } html { line-height: 1; } ol, ul { list-style: none; } table { border-collapse: collapse; border-spacing: 0; } caption, th, td { text-align: left; font-weight: normal; vertical-align: middle; } q, blockquote { quotes: none; } q:before, q:after, blockquote:before, blockquote:after { content: ""; content: none; } a img { border: none; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary { display: block; } /* Clearfix (Use @extend .clearfix) */ .clearfix, article, nav#pagination ul, nav#infinite ul { zoom: 1; } .clearfix:before, article:before, nav#pagination ul:before, nav#infinite ul:before, .clearfix:after, article:after, nav#pagination ul:after, nav#infinite ul:after { content: "\0020"; display: block; height: 0; overflow: hidden; } .clearfix:after, article:after, nav#pagination ul:after, nav#infinite ul:after { clear: both; } .hidden { visibility: hidden; display: none; } .container { *zoom: 1; max-width: 47em; _width: 47em; padding-left: 2em; padding-right: 2em; margin-left: auto; margin-right: auto; } .container:after { content: ""; display: table; clear: both; } /* Vertical Rhythm */ * html { font-size: 112.5%; } html { font-size: 18px; line-height: 1.55556em; } /* Sizing */ h1 { font-size: 2.55556em; line-height: 1.21739em; font-family: "Raleway", "HelveticaNeue-Bold", "Helvetica Neue Bold", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; } h2 { font-size: 1.77778em; line-height: 1.75em; font-family: "Raleway", "HelveticaNeue-Bold", "Helvetica Neue Bold", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; } h3 { font-size: 1.61111em; line-height: 1.93103em; font-family: "Raleway", "HelveticaNeue-Bold", "Helvetica Neue Bold", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; } h4 { font-size: 1.16667em; line-height: 1.33333em; font-family: "Raleway", "HelveticaNeue-Bold", "Helvetica Neue Bold", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; } h5 { font-size: 1em; line-height: 1.55556em; font-family: "Raleway", "HelveticaNeue-Bold", "Helvetica Neue Bold", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; } h6 { font-size: 1em; line-height: 1.55556em; font-family: "Raleway", "HelveticaNeue-Bold", "Helvetica Neue Bold", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; } h1.giga { font-size: 4.22222em; line-height: 1.10526em; } h1, h2, h3, h4, h5, h6 { color: #333333; text-transform: uppercase; letter-spacing: 0.1em; } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: inherit; text-decoration: none; } h1, h2, ul, ol { margin-bottom: 0.77778em; } p, img, object, iframe, blockquote { margin-bottom: 1.55556em; } img, object, iframe { max-width: 100%; } *, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } body { font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; -webkit-font-smoothing: antialiased; color: #333333; background: #f3fffa; } ::selection { background: #2affba; /* Safari */ } ::-moz-selection { background: #2affba; /* Firefox */ } a { color: inherit; text-decoration: none; border-bottom: 1px solid #2affba; } a:hover { border-bottom: 1px solid #333333; } strong { font-weight: 600; } em { font-style: italic; } blockquote { padding-left: 1em; margin-left: 1em; font-style: italic; border-left: 1px solid #333333; } .button, article.photo a.highres { padding: 0.25em 0.5em; border: 1px solid #333333; text-transform: uppercase; letter-spacing: 1px; } .button:hover, article.photo a.highres:hover { background: #2affba; } .button a, article.photo a.highres a { text-decoration: none; color: inherit; border-bottom: none; } .button a:hover, article.photo a.highres a:hover { color: inherit; } .full-bleed.topbar { background: #2affba; position: absolute; top: 0; left: 0; width: 100%; height: 6em; z-index: -1; } div.frame { margin: 0.75em; border: 2px solid #333333; z-index: 100; } .page-title { text-align: center; } .page-title h1 { margin-top: .4em; } .page-title h1 img { margin-bottom: 0; } .page-title h1 a { border-bottom: none; } .page-title h1 a:hover { color: inherit; } div.page-nav nav ul { border-top: 1px solid #333333; border-bottom: 1px solid #333333; margin: 0; padding: 0; padding-top: 0.77778em; padding-bottom: 0.77778em; margin-bottom: 4.66667em; text-align: center; } div.page-nav nav ul li { font-size: 0.77778em; line-height: 2em; display: inline-block; margin-right: 1.5em; } div.page-nav nav ul a { border-bottom: none; text-transform: uppercase; letter-spacing: 0.1em; } div.page-nav nav ul a:hover { border-bottom: 1px solid #333333; } article { margin-bottom: 10.88889em; padding-top: 3em; position: relative; } article header, article footer { width: 100%; float: right; margin-right: 0; #margin-left: -1em; display: inline; } article section { margin-left: 17.02128%; width: 82.97872%; float: right; margin-right: 0; #margin-left: -1em; display: inline; } article section img, article header img, article div.author-icon img { border: 2px solid #333333; } article div.author-icon img { width: 50%; } article p { text-align: justify; } article section ul { list-style-type: circle; } article section ul li { margin-bottom: 1em; margin-left: 1.5em; } article section ul.credit, article section ul.time, article section ul.stats { list-style-type: none; } article section ul.credit li, article section ul.time li, article section ul.stats li { margin-bottom: 0; margin-left: 0; } article header { margin-bottom: 1.55556em; position: relative; } article header a:hover { border-bottom: none; } article header h2 { line-height: 1.5; margin-bottom: 0em; } article header a { color: inherit; border-bottom: none; } article header a:hover { color: inherit; } article header img { width: 100%; height: auto; margin: 0; } article header p.permalink { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; overflow: hidden; display: block; width: 36px; height: 36px; position: absolute; bottom: 0.4em; right: 0; margin: 0; padding: 0; } article header p.permalink br { display: none; } article header p.permalink a { display: block; width: 30px; height: 30px; position: absolute; bottom: -15px; right: -15px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); background: #2affba; } article header p.permalink a:hover { background: #333333; } article footer { position: absolute; left: -18em; font-size: 0.66667em; line-height: 2.33333em; text-transform: uppercase; letter-spacing: 1px; width: 12em; } article footer a { color: inherit; text-decoration: none; border-bottom: none; } article footer a:hover { border-bottom: none; } article footer ul, article footer li, article footer div.author { display: block; margin: 0; } article footer li { border-bottom: 1px solid #333333; } article footer li a { -webkit-transition-duration: 0.2s; -moz-transition-duration: 0.2s; -o-transition-duration: 0.2s; transition-duration: 0.2s; } article footer li a:hover { padding-left: 0.5em; color: inherit; } article footer ul.tags { clear: left; line-height: 1.75; padding-top: 0.6em; } article footer ul.tags li { display: inline; text-transform: lowercase; border-bottom: none; } article footer ul.tags li:after { content: ','; } article footer ul.tags li:last-child:after { content: none; } article footer ul.tags li a:hover { padding: inherit; text-decoration: underline; } article footer div.author-icon img { border: 1px solid #333333; margin: 0; width: 50%; } article footer div.author { line-height: 16px; } article footer div.author li { padding-bottom: 4px; } article ul.credit { font-size: 0.77778em; line-height: 2em; text-align: right; } article ul.time { position: absolute; right: -20em; top: 4em; text-align: center; width: 8em; text-transform: uppercase; letter-spacing: 5px; font-size: 0.77778em; line-height: 2em; background: #f3fffa; -moz-transform: rotate(-270deg); -moz-transform-origin: bottom left; -webkit-transform: rotate(-270deg); -webkit-transform-origin: bottom left; -o-transform: rotate(-270deg); -o-transform-origin: bottom left; filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1); } article ul.time a { color: inherit; border-bottom: none; } article ul.time a:hover { color: inherit; border-bottom: 1px solid #333333; } article ul.meta li.notes a { text-transform: uppercase; } article ul.meta li.notes a:before { font-family: "Batch Custom"; -webkit-font-smoothing: antialiased; font-size: 14px; vertical-align: 0; content: "\f101"; margin-right: 4px; } article ul.meta li.comments a { text-transform: uppercase; } article ul.meta li.comments a:before { font-family: "Batch Custom"; -webkit-font-smoothing: antialiased; font-size: 14px; vertical-align: 0; content: "\f104"; margin-right: 4px; } ul.tumblr-action li strong { display: inline-block; font-weight: normal; } ul.tumblr-action li.reblog a { display: block; } ul.tumblr-action li.reblog a span:before { text-transform: none; font-family: "Batch Custom"; -webkit-font-smoothing: antialiased; font-size: 14px; vertical-align: 0; content: "\f103"; margin-right: 2px; } ul.tumblr-action li.like a { display: block; } ul.tumblr-action li.like a span:before { text-transform: none; font-family: "Batch Custom"; -webkit-font-smoothing: antialiased; font-size: 14px; vertical-align: 0; content: "\f100"; margin-right: 2px; } ul.tumblr-action li.like a.tliked span:before { content: "\f101"; } body.permalink-page ul.share { display: none; } ul.share li { text-transform: uppercase; border-bottom: none; } ul.share li a { display: block; } ul.share li a strong { display: inline-block; font-weight: normal; } ul.share li a span:before { text-transform: none; font-family: "Batch Custom"; -webkit-font-smoothing: antialiased; font-size: 14px; vertical-align: 0; content: "\f102"; margin-right: 2px; } ul.tags li:first-child:before { text-transform: none; font-family: "Batch Custom"; -webkit-font-smoothing: antialiased; font-size: 14px; vertical-align: 0; content: "\f105"; margin-right: 4px; } ul.share .share-buttons { margin-top: 4px; } ul.share .share-buttons iframe { margin-bottom: 0px; } article.quote header p, article.ask header p { font-size: 1.61111em; line-height: 1.93103em; font-style: italic; margin-bottom: 0em; } article.audio header h2.track { border: none; padding: 0; } article.audio div.album-case { width: 14.89362%; float: left; margin-right: 2.12766%; display: inline; } article.audio div.track-details { width: 82.97872%; float: right; margin-right: 0; #margin-left: -1em; display: inline; } article.audio div.spotify-embed { width: 100%; float: right; margin-right: 0; #margin-left: -1em; display: inline; } article.audio div.spotify-embed iframe[src*="spotify"] { width: 100% !important; height: auto !important; margin-bottom: -58px; } article.audio div.spotify-embed iframe[src*="soundcloud"] { width: 100% !important; } article.audio div.spotify-caption { width: 31.91489%; float: left; margin-right: 2.12766%; display: inline; } article.audio header ul li { display: inline-block; } article.photo a.highres { position: absolute; bottom: 1.15em; left: 0.5em; font-size: 0.66667em; line-height: 2.33333em; background: #f3fffa; } article.photoset .photoset-grid { border: 2px solid #333333; } article.photoset header img { border: none; } article.photoset header p.permalink { bottom: 0; } article.video header .fluid-width-video-wrapper { border: 2px solid #333333; } article.video header p.permalink { bottom: 0; } article.video .tumblr_video_iframe { background: #333333 !important; } article.chat p.odd { text-align: left; } article.chat p.even { text-align: right; } article.chat p { margin-bottom: 3.11111em; } article.chat p:last-of-type { margin-bottom: 0em; } article.ask div.asker-icon { display: inline-block; } article.ask div.asker-icon img { margin: 0; height: 3em; width: 3em; border: 1px solid #333333; } article.ask p.asker { display: inline-block; margin-bottom: 1.55556em; padding: 0 0.5em; position: relative; bottom: 1em; } article.link h2 a { border-bottom: 1px solid #2affba; } article.link h2 a:hover { border-bottom: 1px solid #333333; } .permalink-content h4 { border-bottom: 1px solid #333333; margin-bottom: 1em; } .permalink-content div.share { margin-bottom: 3em; } .permalink-content div.comments { margin-bottom: 3em; } .permalink-content div.notes { margin-bottom: 3em; } .permalink-content div.notes ol li { margin-bottom: .5em; } .permalink-content div.notes ol li a.avatar_frame { border: none; } .permalink-content div.notes ol li img { margin-bottom: 0; } .permalink-content .share-button { display: inline-block; vertical-align: top; } .permalink-content .share-button iframe { margin: 0; } .permalink-content .share-button.share-pinterest { margin-top: -4px; } .permalink-content .share-button.share-pinterest a { border: none; } nav#pagination, nav#infinite { border-top: 1px solid #333333; border-bottom: 1px solid #333333; padding-top: 2.33333em; padding-bottom: 2.33333em; margin-bottom: 3.11111em; text-align: center; } nav#pagination ul, nav#infinite ul { margin-bottom: 0; } nav#pagination ul li, nav#infinite ul li { display: inline-block; } nav#pagination li.prev, nav#infinite li.prev { float: left; } nav#pagination li.next, nav#infinite li.next { float: right; } nav#pagination li.button:first-child a, nav#pagination li.button:last-child a, nav#infinite li.button:first-child a, nav#infinite li.button:last-child a { text-decoration: line-through; opacity: .2; } nav#pagination li.button:first-child a.active, nav#pagination li.button:last-child a.active, nav#infinite li.button:first-child a.active, nav#infinite li.button:last-child a.active { text-decoration: none; opacity: 1; } nav#pagination li.current-page, nav#infinite li.current-page { background: #2affba; } nav#infinite { text-align: center; display: block !important; } nav#infinite p { margin-bottom: 0; } nav#infinite p a #infinite-spin { position: relative; display: inline-block; margin: 0px 14px 0 8px; height: 4px; top: -4px; } div.full-bleed.footer { padding-top: 1.55556em; padding-bottom: 0.77778em; width: 100%; background: #333333; color: #f3fffa; } div.full-bleed.footer h1, div.full-bleed.footer h2, div.full-bleed.footer h3, div.full-bleed.footer h4, div.full-bleed.footer h5, div.full-bleed.footer h6 { color: #f3fffa; } div.full-bleed.footer h4 { margin-bottom: 0.77778em; } div.full-bleed.footer a, div.full-bleed.footer a:hover { border-bottom: none; } div.full-bleed.footer p a, div.full-bleed.footer section.bottom a, div.full-bleed.footer section.authors a { border-bottom: 1px solid #2affba; } div.full-bleed.footer p a:hover, div.full-bleed.footer section.bottom a:hover, div.full-bleed.footer section.authors a:hover { border-bottom: 1px solid #f3fffa; } .main-foot .footer-info { font-size: 0.77778em; line-height: 2em; margin-bottom: 3.11111em; } .main-foot .footer-info ul.util { margin: 0; padding: 0; } .main-foot .footer-info ul.util li { font-size: 0.88889em; line-height: 1.75em; display: inline-block; margin-right: 1.5em; } .main-foot .footer-info ul.util a { text-transform: uppercase; letter-spacing: 0.1em; } .main-foot section { font-size: 0.77778em; line-height: 2em; margin-bottom: 3.11111em; width: 48.93617%; float: left; margin-right: 2.12766%; display: inline; } .main-foot section:nth-of-type(2n) { float: right; margin-right: 0; } .main-foot section p { margin-bottom: 0em; } .main-foot .footer-info, .main-foot .bottom { width: 100%; float: right; margin-right: 0; #margin-left: -1em; display: inline; } .main-foot .liked-posts ul#likes li { width: 48.93617%; float: left; margin-right: 2.12766%; display: inline; margin-bottom: 1.55556em; } .main-foot .liked-posts ul#likes li:nth-child(2n) { float: right; margin-right: 0; } .main-foot .liked-posts ul#likes li:last-child { margin-bottom: 3.11111em; } .main-foot .liked-posts p { display: block; clear: both; margin-bottom: 0.77778em; } .main-foot .liked-posts p .button, .main-foot .liked-posts p article.photo a.highres, article.photo .main-foot .liked-posts p a.highres { border: 1px solid #f3fffa; } .main-foot .liked-posts p .button:hover, .main-foot .liked-posts p article.photo a.highres:hover, article.photo .main-foot .liked-posts p a.highres:hover { color: #333333; } .main-foot .liked-posts p .button a, .main-foot .liked-posts p article.photo a.highres a, article.photo .main-foot .liked-posts p a.highres a { border-bottom: none; } .main-foot .liked-posts p .button a:hover, .main-foot .liked-posts p article.photo a.highres a:hover, article.photo .main-foot .liked-posts p a.highres a:hover { border-bottom: none; } .main-foot .liked-posts img { border: 1px solid #f3fffa; } .main-foot .authors li { height: 3em; margin-bottom: 1.55556em; } .main-foot .authors li:last-child { margin-bottom: 0em; } .main-foot .authors li img { display: inline; height: 3em; width: 3em; margin-right: 0.5em; border: 1px solid #f3fffa; -webkit-transition-duration: 0.2s; -moz-transition-duration: 0.2s; -o-transition-duration: 0.2s; transition-duration: 0.2s; } .main-foot .authors li a { display: inline; position: relative; bottom: 2.7em; } .main-foot .follows li { display: inline-block; margin-right: 6px; } .main-foot .follows li img { margin-bottom: 0; } .main-foot .follows p { display: block; clear: both; margin-bottom: 0.77778em; } .main-foot .follows p .button, .main-foot .follows p article.photo a.highres, article.photo .main-foot .follows p a.highres { border: 1px solid #f3fffa; } .main-foot .follows p .button:hover, .main-foot .follows p article.photo a.highres:hover, article.photo .main-foot .follows p a.highres:hover { color: #333333; } .main-foot .follows p .button a, .main-foot .follows p article.photo a.highres a, article.photo .main-foot .follows p a.highres a { border-bottom: none; } .main-foot .follows p .button a:hover, .main-foot .follows p article.photo a.highres a:hover, article.photo .main-foot .follows p a.highres a:hover { border-bottom: none; } .main-foot .tweet { margin-bottom: 1.55556em; } .main-foot .social-links li { display: inline-block; line-height: 28px; } .main-foot .social-links li a { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; display: block; width: 20px; height: 20px; margin: 0 2px; background-image: url(http://static.tumblr.com/fftf9xi/Ynkmbab4a/social_icons-white.png); background-repeat: no-repeat; opacity: .25; } .main-foot .social-links li a br { display: none; } .main-foot .social-links li a:hover { opacity: .8; } .main-foot .social-links li.social_behance a { background-position: 0 0; } .main-foot .social-links li.social_cargo a { background-position: -20px 0; } .main-foot .social-links li.social_delicious a { background-position: -40px 0; } .main-foot .social-links li.social_digg a { background-position: -60px 0; } .main-foot .social-links li.social_dribbble a { background-position: -80px 0; } .main-foot .social-links li.social_ember a { background-position: -100px 0; } .main-foot .social-links li.social_etsy a { background-position: -120px 0; } .main-foot .social-links li.social_facebook a { background-position: -140px 0; } .main-foot .social-links li.social_ffffound a { background-position: -160px 0; } .main-foot .social-links li.social_flickr a { background-position: -180px 0; } .main-foot .social-links li.social_gowalla a { background-position: -200px 0; } .main-foot .social-links li.social_lastfm a { background-position: -220px 0; } .main-foot .social-links li.social_linkedin a { background-position: -240px 0; } .main-foot .social-links li.social_skype a { background-position: -260px 0; } .main-foot .social-links li.social_slideshare a { background-position: -280px 0; } .main-foot .social-links li.social_stumbledupon a { background-position: -300px 0; } .main-foot .social-links li.social_twitter a { background-position: -320px 0; } .main-foot .social-links li.social_vimeo a { background-position: -340px 0; } .main-foot .social-links li.social_youtube a { background-position: -360px 0; } .main-foot .social-links li.social_email a { background-position: -380px 0; } .main-foot .social-links li.social_forrst a { background-position: -400px 0; } .main-foot .social-links li.social_soundcloud a { background-position: -420px 0; } .main-foot .social-links li.social_formspring a { background-position: -440px 0; } .main-foot .social-links li.social_foursquare a { background-position: -460px 0; } .main-foot .social-links li.social_deviantart a { background-position: -480px 0; } .main-foot .social-links li.social_website a { background-position: -500px 0; } .main-foot .social-links li.social_rdio a { background-position: -520px 0; } .main-foot .social-links li.social_myspace a { background-position: -540px 0; } .main-foot .social-links li.social_google a { background-position: -560px 0; } .main-foot .social-links li.social_spotify a { background-position: -580px 0; } .main-foot .social-links li.social_pinterest a { background-position: -600px 0; } .main-foot .social-links li.social_github a { background-position: -620px 0; } .main-foot .social-links li.social_quora a { background-position: -640px 0; } .main-foot .social-links li.social_instagram a { background-position: -660px 0; } .main-foot .instagram li { display: inline-block; } .main-foot .instagram img { width: 64px; height: 64px; margin: 0 .5em .5em 0; border: 1px solid #f3fffa; } .main-foot .instagram p { display: block; clear: both; margin-bottom: 0.77778em; } .main-foot .instagram p .button, .main-foot .instagram p article.photo a.highres, article.photo .main-foot .instagram p a.highres { border: 1px solid #f3fffa; } .main-foot .instagram p .button:hover, .main-foot .instagram p article.photo a.highres:hover, article.photo .main-foot .instagram p a.highres:hover { color: #333333; } .main-foot .instagram p .button a, .main-foot .instagram p article.photo a.highres a, article.photo .main-foot .instagram p a.highres a { border-bottom: none; } .main-foot .instagram p .button a:hover, .main-foot .instagram p article.photo a.highres a:hover, article.photo .main-foot .instagram p a.highres a:hover { border-bottom: none; } /* > 1700px */ @media screen and (min-width: 1600px) { * html { font-size: 131.25%; } html { font-size: 21px; line-height: 1.57143em; } } /* > 1900px */ @media screen and (min-width: 1900px) { * html { font-size: 150%; } html { font-size: 24px; line-height: 1.58333em; } } /* < 1150px */ @media screen and (max-width: 1260px) { * html { font-size: 100%; } html { font-size: 16px; line-height: 1.5625em; } } /* < 1150px */ @media screen and (max-width: 1120px) { * html { font-size: 93.75%; } html { font-size: 15px; line-height: 1.53333em; } } /* < 980px */ @media screen and (max-width: 1036px) { article footer { width: 100%; float: right; margin-right: 0; #margin-left: -1em; display: inline; margin-top: 1.53333em; position: static; margin-bottom: 1.5em; } article footer ul, article footer ul li, article footer div.author { display: inline-block; border-bottom: none; } article footer ul a:hover, article footer ul li a:hover, article footer div.author a:hover { padding: 0; border-bottom: 1px solid #333333; } article footer ul li { margin-right: 1.5em; } article footer ul.tags { display: block; } article footer ul.tags li a:hover { border-bottom: none; } article footer .share_links_wrapper { display: block; position: absolute; left: 0; bottom: -36px; } article footer .share_links_wrapper .share-button { display: inline-block; vertical-align: top; } article footer .share_links_wrapper .share-button.share-pinterest { margin-top: -1px; } article footer div.author { display: block; } article footer div.author div.author-icon { display: inline; } article footer div.author div.author-icon img { margin: 0 1.5em 0 0; height: 4em; width: 4em; border: 1px solid #333333; } article footer div.author ul li { display: inline-block; position: relative; bottom: 1.5em; } article ul.time { right: -12em; } footer a:hover { border: none !important; color: #2affba; } } /* < 767px */ @media screen and (max-width: 767px) { article ul.time { right: -8.5em; } article section { width: 100%; float: right; margin-right: 0; #margin-left: -1em; display: inline; } article { margin-bottom: 9.2em; } article.audio div.spotify-embed, article.audio div.spotify-caption { width: 100%; float: right; margin-right: 0; #margin-left: -1em; display: inline; } article.audio div.spotify-embed { text-align: center; } nav.pages { margin-top: 1.53333em; } } /* < 550px */ @media screen and (max-width: 550px) { article { margin-bottom: 6.13333em; } .main-foot div.sidebar, .main-foot section.liked-posts, .main-foot section.social-links, .main-foot section.tweets, .main-foot section.instagram, .main-foot section.follows, .main-foot section.bottom { width: 100%; float: right; margin-right: 0; #margin-left: -1em; display: inline; } .main-foot div.sidebar section { width: 48.93617%; float: left; margin-right: 2.12766%; display: inline; } .main-foot div.sidebar section:nth-child(2n) { float: right; margin-right: 0; } h3 { font-size: 1.2em; line-height: 1.27778em; } h4 { font-size: 0.93333em; line-height: 1.64286em; } h1, h2, h3, h4 { margin-bottom: 0.76667em; } article header { margin-bottom: 3.06667em; } article .button, article.photo a.highres { font-size: 0.8em; line-height: 1.91667em; } article header h2, article header p, h1, h2, h3 { line-height: 1.5; } article.quote header p, article.ask header p, article header h2, h2 { font-size: 1.4em; line-height: 2.19048em; line-height: 1.5; } article.audio div.album-case { width: 31.91489%; float: left; margin-right: 2.12766%; display: inline; } article.audio div.track-details { width: 65.95745%; float: right; margin-right: 0; #margin-left: -1em; display: inline; } nav#pagination ul li.current-page, nav#pagination ul li.jump-page { display: none; } div.container { padding-left: 1em; padding-right: 1em; } article footer ul li { margin-right: 1em; } } #infscr-loading { display: none !important; } #tumblr_controls { top: 16px !important; right: 16px !important; } #tumblr_controls { /* top: 90px !important; position: fixed !important; */ } /* ColorBox Core Style: The following CSS is consistent between example themes and should not be altered. */ #colorbox, #cboxOverlay, #cboxWrapper { position: absolute; top: 0; left: 0; z-index: 9999; overflow: hidden; } #cboxOverlay { position: fixed; width: 100%; height: 100%; } #cboxMiddleLeft, #cboxBottomLeft { clear: left; } #cboxContent { position: relative; } #cboxLoadedContent { overflow: auto; -webkit-overflow-scrolling: touch; } #cboxTitle { margin: 0; } #cboxLoadingOverlay, #cboxLoadingGraphic { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow { cursor: pointer; } .cboxPhoto { float: left; margin: auto; border: 0; display: block; max-width: none; } .cboxIframe { width: 100%; height: 100%; display: block; border: 0; } #colorbox, #cboxContent, #cboxLoadedContent { box-sizing: content-box; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; } /* User Style: Change the following styles to modify the appearance of ColorBox. They are ordered & tabbed in a way that represents the nesting of the generated HTML. */ #cboxOverlay { background: #000000; } #colorbox { outline: 0; } #cboxContent { margin-top: 32px; overflow: visible; } #cboxError { padding: 50px; border: 1px solid #ccc; } #cboxLoadedContent { background: #000000; padding: 1px; } #cboxLoadingGraphic { background: url(http://static.tumblr.com/fftf9xi/rkklqu1ni/loading.gif) no-repeat center center; } #cboxLoadingOverlay { background: #000000; } #cboxTitle { position: absolute; top: -22px; left: 0; color: #ffffff; text-shadow: none; } #cboxCurrent { position: absolute; top: -22px; right: 205px; text-indent: -9999px; } /* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */ #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose { border: 0; padding: 0; margin: 0; overflow: visible; width: auto; background: none; } /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */ #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active { outline: 0; } #cboxSlideshow, #cboxPrevious, #cboxNext, #cboxClose { text-indent: -9999px; width: 20px; height: 20px; position: absolute; top: -20px; background: url(http://static.tumblr.com/fftf9xi/1dslqu1o1/controls.png) no-repeat 0 0; } #cboxPrevious { background-position: 0px 0px; right: 44px; } #cboxPrevious.hover { background-position: 0px -25px; } #cboxNext { background-position: -25px 0px; right: 22px; } #cboxNext.hover { background-position: -25px -25px; } #cboxClose { background-position: -50px 0px; right: 0; } #cboxClose.hover { background-position: -50px -25px; } .cboxSlideshow_on #cboxPrevious, .cboxSlideshow_off #cboxPrevious { right: 66px; } .cboxSlideshow_on #cboxSlideshow { background-position: -75px -25px; right: 44px; } .cboxSlideshow_on #cboxSlideshow.hover { background-position: -100px -25px; } .cboxSlideshow_off #cboxSlideshow { background-position: -100px 0px; right: 44px; } .cboxSlideshow_off #cboxSlideshow.hover { background-position: -75px -25px; } .pull-right { float: right; } .pull-left { float: left; } .hide { display: none; } .show { display: block; } .invisible { visibility: hidden; } .visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; } .customize-embed:before { content: "Flash Disabled in Customize Mode"; height: 24px; width: 100%; display: block; text-align: center; position: absolute; top: 50%; margin-top: 0; font-weight: normal; font-size: 11px; color: #AAAAAA; font-family: "Helvetica Neue", sans-serif !important; text-shadow: 1px 2px 1px rgba(0, 0, 0, 0.4); letter-spacing: 1px; } .customize-embed { -moz-box-shadow: inset 0 1px 0px #646464; -webkit-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.7); background: #333333; background: -moz-radial-gradient(center, ellipse cover, #333333 0%, black 100%); background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, #333333), color-stop(100%, black)); background: -webkit-radial-gradient(center, ellipse cover, #333333 0%, black 100%); background: -o-radial-gradient(center, ellipse cover, #333333 0%, black 100%); background: -ms-radial-gradient(center, ellipse cover, #333333 0%, black 100%); background: radial-gradient(center, ellipse cover, #333333 0%, #000000 100%); } .customize-embed iframe, .customize-embed embed, .customize-embed object { display: none; } .customize-audio { display: block; height: 27px; width: 207px; background-image: url(http://static.tumblr.com/fftf9xi/r0blwhruz/audio-players.png); } .customize-audio.white { background-position: 0px 0px; } .customize-audio.grey { background-position: 0px -27px; } .customize-audio.black { background-position: 0px -54px; } .customize-audio embed { display: none; }