/*! normalize.css v2.1.2 | MIT License | git.io/normalize */
/* ========================================================================== HTML5 display definitions ========================================================================== */
/** Correct `block` display not defined in IE 8/9. */
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { display: block; }

/** Correct `inline-block` display not defined in IE 8/9. */
audio, canvas, video { display: inline-block; }

/** Prevent modern browsers from displaying `audio` without controls. Remove excess height in iOS 5 devices. */
audio:not([controls]) { display: none; height: 0; }

/** Address `[hidden]` styling not present in IE 8/9. Hide the `template` element in IE, Safari, and Firefox < 22. */
[hidden], template { display: none; }

script { display: none !important; }

/* ========================================================================== Base ========================================================================== */
/** 1. Set default font family to sans-serif. 2. Prevent iOS text size adjust after orientation change, without disabling user zoom. */
html { font-family: sans-serif; /* 1 */ -ms-text-size-adjust: 100%; /* 2 */ -webkit-text-size-adjust: 100%; /* 2 */ }

/** Remove default margin. */
body { margin: 0; }

/* ========================================================================== Links ========================================================================== */
/** Remove the gray background color from active links in IE 10. */
a { background: transparent; }

/** Address `outline` inconsistency between Chrome and other browsers. */
a:focus { outline: thin dotted; }

/** Improve readability when focused and also mouse hovered in all browsers. */
a:active, a:hover { outline: 0; }

/* ========================================================================== Typography ========================================================================== */
/** Address variable `h1` font-size and margin within `section` and `article` contexts in Firefox 4+, Safari 5, and Chrome. */
h1 { font-size: 2em; margin: 0.67em 0; }

/** Address styling not present in IE 8/9, Safari 5, and Chrome. */
abbr[title] { border-bottom: 1px dotted; }

/** Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome. */
b, strong { font-weight: bold; }

/** Address styling not present in Safari 5 and Chrome. */
dfn { font-style: italic; }

/** Address differences between Firefox and other browsers. */
hr { -moz-box-sizing: content-box; box-sizing: content-box; height: 0; }

/** Address styling not present in IE 8/9. */
mark { background: #ff0; color: #000; }

/** Correct font family set oddly in Safari 5 and Chrome. */
code, kbd, pre, samp { font-family: monospace, serif; font-size: 1em; }

/** Improve readability of pre-formatted text in all browsers. */
pre { white-space: pre-wrap; }

/** Set consistent quote types. */
q { quotes: "\201C" "\201D" "\2018" "\2019"; }

/** Address inconsistent and variable font size in all browsers. */
small { font-size: 80%; }

/** Prevent `sub` and `sup` affecting `line-height` in all browsers. */
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }

sup { top: -0.5em; }

sub { bottom: -0.25em; }

/* ========================================================================== Embedded content ========================================================================== */
/** Remove border when inside `a` element in IE 8/9. */
img { border: 0; }

/** Correct overflow displayed oddly in IE 9. */
svg:not(:root) { overflow: hidden; }

/* ========================================================================== Figures ========================================================================== */
/** Address margin not present in IE 8/9 and Safari 5. */
figure { margin: 0; }

/* ========================================================================== Forms ========================================================================== */
/** Define consistent border, margin, and padding. */
fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; }

/** 1. Correct `color` not being inherited in IE 8/9. 2. Remove padding so people aren't caught out if they zero out fieldsets. */
legend { border: 0; /* 1 */ padding: 0; /* 2 */ }

/** 1. Correct font family not being inherited in all browsers. 2. Correct font size not being inherited in all browsers. 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome. */
button, input, select, textarea { font-family: inherit; /* 1 */ font-size: 100%; /* 2 */ margin: 0; /* 3 */ }

/** Address Firefox 4+ setting `line-height` on `input` using `!important` in the UA stylesheet. */
button, input { line-height: normal; }

/** Address inconsistent `text-transform` inheritance for `button` and `select`. All other form control elements do not inherit `text-transform` values. Correct `button` style inheritance in Chrome, Safari 5+, and IE 8+. Correct `select` style inheritance in Firefox 4+ and Opera. */
button, select { text-transform: none; }

/** 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` and `video` controls. 2. Correct inability to style clickable `input` types in iOS. 3. Improve usability and consistency of cursor style between image-type `input` and others. */
button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; /* 2 */ cursor: pointer; /* 3 */ }

/** Re-set default cursor for disabled elements. */
button[disabled], html input[disabled] { cursor: default; }

/** 1. Address box sizing set to `content-box` in IE 8/9. 2. Remove excess padding in IE 8/9. */
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ }

/** 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome. 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome (include `-moz` to future-proof). */
input[type="search"] { -webkit-appearance: textfield; /* 1 */ -moz-box-sizing: content-box; -webkit-box-sizing: content-box; /* 2 */ box-sizing: content-box; }

/** Remove inner padding and search cancel button in Safari 5 and Chrome on OS X. */
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

/** Remove inner padding and border in Firefox 4+. */
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

/** 1. Remove default vertical scrollbar in IE 8/9. 2. Improve readability and alignment in all browsers. */
textarea { overflow: auto; /* 1 */ vertical-align: top; /* 2 */ }

/* ========================================================================== Tables ========================================================================== */
/** Remove most spacing between table cells. */
table { border-collapse: collapse; border-spacing: 0; }

.mobile { display: none !important; }
@media screen and (max-width: 960px) { .mobile { display: block !important; } }

@media screen and (max-width: 960px) { .hideMobile { display: none; } }

#tumblr_controls, #iframe_controls { display: none; bottom: 50px; position: fixed; right: 5px; top: auto; }
@media screen and (max-width: 960px) { #tumblr_controls, #iframe_controls { display: none; bottom: auto; top: 5px; } }

*, *:before, *:after { box-sizing: border-box; }

body { background: #000; color: #fff; font-family: "trump-gothic"; }

h1, h2, h3, h4 { text-transform: uppercase; }

h2, h3, h4 { font-size: 28px; }

a { text-decoration: none; }

b { font-weight: bold; }

.container { width: 100%; max-width: 1170px; margin: 0 auto; }

header { position: relative; text-align: right; border-bottom: solid 5px #000; height: 100px; z-index: 9; }
@media screen and (max-width: 960px) { header { height: 75px; } }
header .logo { background: url(http://static.tumblr.com/w2sppeu/uS6njkaa3/logo.png) no-repeat left center; background-size: contain; width: 90px; height: 70px; display: block; text-indent: -99999px; position: absolute; top: 50%; margin-top: -35px; left: 30px; text-align: left; -webkit-transition: all 250ms ease-out; -moz-transition: all 250ms ease-out; transition: all 250ms ease-out; }
header .logo:hover { -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -ms-transform: scale(1.2); -o-transform: scale(1.2); transform: scale(1.2); }
@media screen and (max-width: 960px) { header .logo { height: 34px; margin-top: -17px; left: 20px; } }
header nav { display: block; height: 100%; }
@media screen and (max-width: 960px) { header nav { display: none; } }
header nav a { display: inline-block; background: #fff; height: 100%; line-height: 100px; color: #000; font-size: 32px; padding: 0px 30px; text-transform: uppercase; border-left: solid 2px #000; min-width: 140px; text-align: center; -webkit-transition: all 250ms ease-in-out; -moz-transition: all 250ms ease-in-out; transition: all 250ms ease-in-out; }
header nav a:hover { background: #000; color: #fff; }
@media screen and (max-width: 1150px) { header nav a { font-size: 28px; padding: 0px 20px; min-width: 120px; } }
@media screen and (max-width: 960px) { header nav a { line-height: 46px; font-size: 24px; width: 99%; margin: 0 auto 3px auto; display: block; clear: both; height: auto; } }
@media screen and (max-width: 960px) { header nav.open { display: block; padding-top: 75px; padding-bottom: 30px; height: auto; background: #000; } }
header .grip { position: absolute; top: 0; right: 0; width: 60px; height: 100%; background: url(../img/grip.png) no-repeat center center; background-size: 40% auto; }

.global-promo { background: white; border-bottom: 5px solid black; padding: 10px 10px 7px 10px; text-align: center; text-transform: uppercase; font-size: 1.5em; color: #000; }
.global-promo a { color: #959595; }
.global-promo a:hover { color: #000; }

nav#tags, nav#cities { clear: both; width: 100%; background: #fff; color: #000; padding: 30px 0; text-align: center; }
@media screen and (max-width: 960px) { nav#tags, nav#cities { padding: 5px 0; } }
nav#tags a, nav#cities a { display: inline-block; padding: 12px 20px 7px 20px; text-transform: uppercase; font-size: 36px; color: #000; }
nav#tags a.active, nav#tags a:hover, nav#cities a.active, nav#cities a:hover { color: #fff; background: #000; }

nav#cities { padding: 23px 0; background: #000; color: #fff; }
nav#cities a { font-size: 20px; color: #fff; background: #000; padding: 7px 10px 3px 10px; }
nav#cities a.active, nav#cities a:hover { color: #000; background: #fff; }

.featured { padding-top: 35%; position: relative; }
@media screen and (max-width: 960px) { .featured { padding: 0; height: 360px; } }
.featured .large, .featured .sidebar { width: 66.6%; height: 100%; position: absolute; left: 0; top: 0; }
@media screen and (max-width: 960px) { .featured .large, .featured .sidebar { width: 100%; height: 100%; } }
.featured .large .post, .featured .sidebar .post { height: 100%; width: 100%; z-index: 8; background: #333 url() no-repeat center center; background-size: cover; }
@media screen and (max-width: 960px) { .featured .large .post, .featured .sidebar .post { padding-top: 50%; -webkit-transform: translateX(-120%) rotate(-18deg); -moz-transform: translateX(-120%) rotate(-18deg); -ms-transform: translateX(-120%) rotate(-18deg); -o-transform: translateX(-120%) rotate(-18deg); transform: translateX(-120%) rotate(-18deg); -webkit-transition: all 500ms ease-in-out; -moz-transition: all 500ms ease-in-out; transition: all 500ms ease-in-out; }
  .featured .large .post.active, .featured .sidebar .post.active { -webkit-transform: translateX(0) rotate(0deg); -moz-transform: translateX(0) rotate(0deg); -ms-transform: translateX(0) rotate(0deg); -o-transform: translateX(0) rotate(0deg); transform: translateX(0) rotate(0deg); }
  .featured .large .post.next, .featured .sidebar .post.next { -webkit-transform: translateX(100%); -moz-transform: translateX(100%); -ms-transform: translateX(100%); -o-transform: translateX(100%); transform: translateX(100%); -webkit-transition: all 0ms linear; -moz-transition: all 0ms linear; transition: all 0ms linear; } }
.featured .large .post .caption, .featured .sidebar .post .caption { cursor: pointer; }
.featured .large .post .caption:hover, .featured .sidebar .post .caption:hover { text-decoration: underline; }
.featured .large .post img, .featured .sidebar .post img { display: none; }
@media screen and (max-width: 960px) { .featured .large .post img, .featured .sidebar .post img { display: none; } }
.featured .sidebar { width: 33.3%; left: 66.6%; top: 0; }
@media screen and (max-width: 960px) { .featured .sidebar { width: 100%; left: 0; } }
.featured .sidebar .post { height: 50%; }
@media screen and (max-width: 960px) { .featured .sidebar .post { height: 100%; position: absolute; } }
@media screen and (max-width: 960px) { .featured .post .info { background: #000; color: #fff; bottom: 0; position: absolute; top: auto; } }
@media screen and (max-width: 960px) { .featured .post .info .content a { color: #fff; } }
.featured .arrows { display: none; }
@media screen and (max-width: 960px) { .featured .arrows { display: block; } }
.featured .arrows .prev, .featured .arrows .next { display: block; position: absolute; left: 12px; top: 30%; margin-top: -20px; background: url(http://static.tumblr.com/w2sppeu/zlonjpwly/arrow.svg) no-repeat; background-size: contain; width: 35px; height: 38px; z-index: 9; }
.featured .arrows .next { left: auto; right: 12px; -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); }

.post { position: relative; color: #fff; }
.post.featured { padding: 0; }
.post:hover .info { opacity: 1; }
@media screen and (max-width: 960px) { .post { background-image: none; } }
.post h2 { text-transform: none; }
.post img { width: 100%; height: auto; display: block; }
@media screen and (max-width: 960px) { .post img { display: block; } }
.post iframe { display: none; margin: 20px 0; }
.post iframe.photoset { display: block; margin: 0; max-width: 100%; }
.post .info { opacity: 0; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(0, 0, 0, 0.5); display: table; -webkit-transition: opacity 250ms ease-in-out; -moz-transition: opacity 250ms ease-in-out; transition: opacity 250ms ease-in-out; }
@media screen and (max-width: 960px) { .post .info { display: block; background: #fff; opacity: 1; height: auto; color: #000; position: relative; padding: 25px 0; } }
.post .info .content { display: table-cell; vertical-align: middle; text-align: center; }
@media screen and (max-width: 960px) { .post .info .content { display: block; } }
.post .info .content .date { text-transform: uppercase; font-size: 25px; }
@media screen and (max-width: 960px) { .post .info .content .date { font-size: 21px; } }
.post .info .content .date:hover { text-decoration: underline; }
.post .info .content .caption { padding: 20px 0; }
.post .info .content p { font-size: 18px; font-family: "Arvo", Helvetica, sans-serif; margin: 0; }
@media screen and (max-width: 960px) { .post .info .content p { font-size: 12px; } }
.post .info .content svg { fill: #fff; }
.post .info .content svg:hover { fill: #aaa; }
@media screen and (max-width: 960px) { .post .info .content svg { fill: #000; } }
.post .info .content a, .post .info .content .like_button, .post .info .content .reblog_button, .post .info .content .hideMobile { color: #fff; display: inline-block !important; }
.post .info .content a:hover, .post .info .content .like_button:hover, .post .info .content .reblog_button:hover, .post .info .content .hideMobile:hover { color: #aaa; }
@media screen and (max-width: 960px) { .post .info .content a, .post .info .content .like_button, .post .info .content .reblog_button, .post .info .content .hideMobile { color: #000; font-size: 16px; } }
@media screen and (max-width: 960px) { .post .info .content .mobile { display: inline-block !important; } }
.post .info .content .reblog_button { margin-left: 5px; }
.post .info .content .social { padding: 25px 0 0 0; }
.post .info .content .social iframe { display: inline-block; margin: 0; }

.posts { padding-bottom: 100px; margin-bottom: 100px; }
.posts.loading { background: url(http://static.tumblr.com/fodcx0z/bdcnlqa8x/loading.gif) no-repeat center bottom; }
.posts .post { width: 33%; height: auto; overflow: hidden; }
@media screen and (max-width: 960px) { .posts .post { width: 100%; float: none; height: auto; } }
.posts .post .caption { cursor: pointer; }
.posts .post .caption:hover { text-decoration: underline; }
.posts .post .photoset { display: none; }
@media screen and (max-width: 960px) { .posts .post .photoset { display: block; } }

#permalink { width: 100%; background: #000; color: #000; text-align: center; }
@media screen and (max-width: 960px) { #permalink { position: static; min-height: 0; padding: 0; } }
#permalink .post { background: #fff; color: #000; display: block; }
@media screen and (max-width: 960px) { #permalink .post { position: static; } }
#permalink .post img { display: block; }
#permalink .post iframe { display: block; max-width: 100%; }
#permalink .post .info { opacity: 1; position: absolute; }
#permalink .post .photos, #permalink .post .info { width: 50%; top: 0; left: 0; }
@media screen and (max-width: 960px) { #permalink .post .photos, #permalink .post .info { width: 100%; position: relative; min-height: 0; } }
#permalink .post .photos { padding-bottom: 150px; min-height: 100%; background: #000; }
@media screen and (max-width: 960px) { #permalink .post .photos { padding-bottom: 0; } }
#permalink .post .photos iframe { width: 100%; }
@media screen and (max-width: 960px) { #permalink .post .photos .html_photoset { width: 100%; } }
#permalink .post .embed-container { text-align: center; }
#permalink .post .embed-container div, #permalink .post .embed-container iframe { margin: 0 auto; }
#permalink .post .info { background: #fff; left: 50%; padding: 5% 8%; padding-bottom: 200px; }
@media screen and (max-width: 960px) { #permalink .post .info { left: 0; padding-top: 50px; padding-bottom: 40px; } }
#permalink .post .info .content { display: block; }
#permalink .post .info p { line-height: 24px; padding: 10px 0; }
#permalink .post .info a { color: #000; }
#permalink .post .info a svg { fill: #000; }
#permalink .post .info a:hover { color: #aaa; }
#permalink .post .info a:hover svg { fill: #aaa; }
#permalink .post .info .date { font-size: 44px; text-transform: uppercase; }
@media screen and (max-width: 960px) { #permalink .post .info .date { font-size: 28px; } }
#permalink .post .info .caption { font-size: 28px; font-family: "Arvo", Helvetica, sans-serif; }
@media screen and (max-width: 960px) { #permalink .post .info .caption { font-size: 24px; } }
#permalink .post .info .caption a { text-decoration: underline; }
#permalink .post .info .tags a { display: inline-block; padding: 10px; font-weight: bold; color: #adadad; font-family: "Arvo", Helvetica, sans-serif; text-decoration: none; }
#permalink .post .info .tags a:hover { text-decoration: underline; }
#permalink .close { display: block; color: #000; top: 25px; left: 50%; margin-left: 20px; position: absolute; font-size: 36px; -webkit-transition: all 250ms ease-out; -moz-transition: all 250ms ease-out; transition: all 250ms ease-out; -webkit-transform-origin: 50% 50%; -moz-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; transform-origin: 50% 50%; }
#permalink .close:hover { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); }
@media screen and (max-width: 960px) { #permalink .close { left: 10px; top: 10px; font-size: 21px; margin: 0; } }
#permalink .pagination { position: fixed; bottom: 0px; left: 0; width: 100%; height: 50px; line-height: 50px; }
@media screen and (max-width: 960px) { #permalink .pagination { position: static; } }
#permalink .pagination .prev, #permalink .pagination .next { position: absolute; text-transform: uppercase; font-size: 28px; color: #000; background: #fff; width: 50%; left: 0; height: 100%; text-align: center; display: block; cursor: pointer; }
#permalink .pagination .prev:hover, #permalink .pagination .next:hover { background: #000; color: #fff; border: solid 3px #fff; }
@media screen and (max-width: 960px) { #permalink .pagination .prev, #permalink .pagination .next { height: auto; } }
#permalink .pagination .next { left: 50%; color: #fff; background: #000; }
#permalink .pagination .next:hover { color: #000; background: #fff; border: solid 3px #000; }

footer { position: fixed; bottom: 0; left: 0; width: 100%; background: #000; height: 50px; line-height: 50px; }
@media screen and (max-width: 960px) { footer { position: static; } }
footer a { line-height: 50px !important; font-size: 22px; color: #fff; margin-right: 10px; }
footer a:hover { color: #aaa; }
footer .newsletter a span { text-transform: uppercase; font-family: "trump-gothic"; display: inline-block; padding: 0 10px; }
@media screen and (max-width: 960px) { footer .newsletter a span { font-size: 16px; position: relative; top: -4px; display: none; } }
footer .social-links { float: right; }

.permalink-page footer { display: none; }

.tag-page h2 { font-size: 42px; text-align: center; }

#newsletter { position: fixed; background: rgba(0, 0, 0, 0.8); top: 0; left: 0; width: 100%; height: 100%; display: none; }

#newsletter-wrap { position: fixed; top: 50%; left: 50%; margin-left: -300px; margin-top: -212px; width: 100%; max-width: 602px; height: 435px; background: #fff; padding: 10px 0 0 0; overflow: hidden; z-index: 99; }
@media screen and (max-width: 960px) { #newsletter-wrap { left: 0; top: 0; height: 100%; margin: 0; overflow-y: scroll; } }
#newsletter-wrap .close { display: block; cursor: pointer; color: #000; top: 10px; right: 15px; margin-left: 20px; position: absolute; font-size: 24px; -webkit-transition: all 250ms ease-out; -moz-transition: all 250ms ease-out; transition: all 250ms ease-out; -webkit-transform-origin: 50% 50%; -moz-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; transform-origin: 50% 50%; }
#newsletter-wrap .close:hover { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); }
@media screen and (max-width: 960px) { #newsletter-wrap .close { left: 10px; top: 10px; font-size: 21px; margin: 0; } }