body {
font-family: 'Karla', sans-serif;
font-size: 13px;
color: #707070;
background-color: #ffffff;
text-align: left;
line-height: 160%;
word-wrap: break-word;
letter-spacing: 0.04em;
margin: 0;
padding: 0;
-webkit-transition: 2s opacity;
-moz-transition: 2s opacity;
-ms-transition: 2s opacity;
-o-transition: 2s opacity;
transition: 2s opacity;
}

body.load-in {
opacity: 0;
-webkit-transition: none;
-moz-transition: none;
-ms-transition: none;
-o-transition: none;
transition: none;
}

a {
color: #4c4c4c; 
text-decoration: none;
cursor: pointer;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
}

a:hover {
color: #da8da9;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
}

p a, li a, #description a {border-bottom: 2px solid rgba(218,141,169, 0.6);}
p a:hover, li a:hover, #description a:hover {border-bottom: 2px solid rgba(218,141,169, 1.0);}

blockquote {
padding: 0 0 0 1.25em;
border-left: 1px solid #e0e0e0;
margin: 1.25em 0 1.25em 1.25em;
}

h1, h2, h3, h4, h5, .title {
color: #212121;
letter-spacing: 0.06em;
line-height: 130%;
font-weight: bold;
font-family: 'Playfair Display', serif;
font-style: italic;
}

h1 a, h2 a, h3 a, h4 a, h5 a, .title a {color: #212121;}
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, .title a:hover {color: #da8da9;}
h1, .title {font-size: 1.75em;}
h2 {font-size: 1.5em;}
h3 {font-size: 1.35em;}
h4 {font-size: 1.25em;}
h5 {font-size: 1.15em;}

small {font-size: 0.9em;}
big {font-size: 1.1em;}
b, bold, strong {color: #212121;}
b a:hover, bold a:hover, strong a:hover {color: #da8da9;}

hr {
height: 1px;
border: none;
background-color: #e0e0e0;
}

ul {list-style-type: circle;}
ol {list-style-type: decimal;}
li {max-width: 100%;}

.tippy-tooltip.custom-theme {
background-color: #212121;
color: #ffffff;
text-align: center;
font-family: inherit;
font-weight: normal;
text-transform: uppercase;
letter-spacing: 0.1em;
font-style: normal;
padding: 0.25em;
margin: 20px auto auto 10px;
font-size: 0.8em;
box-shadow: 0px 0px 5px #e0e0e0;
border-radius: 6px;

}

::-webkit-scrollbar {
width: 12px; 
height: 20px;
background-color: #ffffff;
}
 
::-webkit-scrollbar-track {background-color: #ffffff; border-radius: 20px;}
 
::-webkit-scrollbar-thumb {
background-color: #212121;
min-height: 50px;
min-width: 35px;
border-radius: 10px;
}

.tmblr-iframe-compact .tmblr-iframe--unified-controls {
z-index: 999999999!important;
opacity: 0.75;
transform: scale(0.9);
transform-origin: 100% 0;
-webkit-transform: scale(0.9);
-webkit-transform-origin: 100% 0;
-o-transform: scale(0.9);
-o-transform-origin: 100% 0;
-moz-transform: scale(0.9);
-moz-transform-origin: 100% 0;
-ms-transform: scale(0.9);
-ms-transform-origin: 100% 0;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s;
}
 
.tmblr-iframe-compact .tmblr-iframe--unified-controls:hover {
opacity: 1.0;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s;
}
 
.iframe-controls--phone-mobile {display: none!important;}
.tmblr-iframe-pushdown {padding-top: 0!important;} 
.tmblr-iframe--app-cta-button {display: none!important;}

/*----- COMMON STYLES -----*/

img {
margin: 0;
display: block;
height: auto;
max-width: 100%;
}

.subtitle {
font-weight: bold;
color: #212121;
font-size: 1.15em;
font-family: 'Playfair Display', serif;
font-style: italic;
}

.subtitle a {color: #212121;}
.subtitle a:hover {color: #da8da9;}

.upper {
font-size: 0.9em;
text-transform: uppercase;
letter-spacing: 0.1em;
}

.icon {
display: inline-block;
border-radius: 50%;
vertical-align: middle;
}

svg {
display: inline-block;
vertical-align: middle;
}

a svg {
color: #da8da9;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
}

a svg:hover {
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
}

.align-flex {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
}

.padding {padding: 1.5em; box-sizing: border-box;}

.dots {margin: 1.5em 0;}

.dots span {
display: inline-block;
width: 0.5em;
height: 0.5em;
border-radius: 50%;
margin: 0 0.25em;
background-color: #da8da9;
}

#drop-links a, .bottom-info a {color: #4c4c4c;}
#drop-links a:hover, .bottom-info a:hover {color: #da8da9;}

.tags a::after, #drop-links a::after {
content: '';
width: 5px;
height: 5px;
background-color: #da8da9;
border-radius: 50%;
margin: 0 0.75em 0.15em 0.75em;
display: inline-block;
vertical-align: middle;
}
 
.tags a:last-of-type::after, #drop-links a:last-of-type::after {display: none;}

/*----- SIDEBAR -----*/

#sidebar {
width: 250px;
height: auto;
position: fixed;
text-align: center;
top: 50px;
}

#sidebar .icon {
width: 100px;
height: 100px;
z-index: 2;
background-color: #fff;
padding: 10px;
box-shadow: 0px 0px 5px #e0e0e0;
border: 1px solid #fff;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s;
}

#sidebar:hover .icon {
border: 1px solid #da8da9;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s;
}

#main-sidebar {
background-color: #fff;
box-shadow: 0px 0px 5px #e0e0e0;
border-radius: 15px;

overflow: hidden;
}

#title-wrap {

padding: 1em;
border-bottom: 1px solid #e0e0e0;
}

#blog-url {
background-color: #f7f7f7;
color: #4c4c4c;
padding: 0.25em 0.75em;
border-radius: 2em;
display: inline-block;
margin-top: 0.75em;
}

#description {padding: 1.5em;}

#sidebar #nav-wrap {
margin: auto;
text-align: center;
background-color: #f7f7f7;
border-top: 1px solid #e0e0e0;
padding: 1em;
}

#main-nav {
display: flex;
flex-direction: row;
justify-content: space-around;
}

#main-nav a {display: inline-block;}
#main-nav a svg {width: 1.5em; height: 1.5em;}
#main-nav a:hover svg {color: #212121;}

#main-nav a::after {
content: '';
display: inline-block;
position: absolute;
width: 0.5em;
height: 0.5em;
background-color: #da8da9;
border-radius: 50%;
margin: 1.15em 0 0 -0.45em;
opacity: 0;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
}

#main-nav a:hover::after {
opacity: 1.0;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
}

#drop-links {margin-top: 0.5em; display: none;}
#drop-links a {display: inline-block;}

a.menu-button.drop-clicked svg {color: #212121;}
#main-nav a.menu-button.drop-clicked::after {opacity: 1.0;}

.find {
background-color: inherit;
width: 100%;
margin-top: 0.25em;
}

.find svg {
width: 1.25em;
height: 1.25em;
color: #da8da9;
margin-right: 0.25em;
}
 
.find input {
border: none;
outline: none;
display: inline-block;
background: inherit;
margin: 0;
padding: 0;
color: #4c4c4c;
width: calc(100% - 3em);
font-family: inherit;
font-size: inherit;
box-sizing: border-box;
}
 
.find input[type=text] {color: #4c4c4c;}    
input::-webkit-input-placeholder {color: #4c4c4c;}
input::-moz-placeholder {color: #4c4c4c;}
input:-moz-placeholder {color: #4c4c4c;}
input:-ms-input-placeholder {color: #4c4c4c;}

/*----- POSTS -----*/

#container {
position: relative;

width: 90vw;
margin: 50px auto;
}

#posts-container {
position: relative;
display: block;


width: calc(100% - 350px);
margin-left: 350px;

}

article {

margin: 0 auto 150px auto;
position: relative;
background-color: #fff;
box-shadow: 0 0 5px #e0e0e0;
border-radius: 15px;
overflow: hidden;

width: calc(50% - 50px);
display: inline-block;
opacity: 1.0;
z-index: 1;
-webkit-transition: 0.5s opacity;
-moz-transition: 0.5s opacity;
-ms-transition: 0.5s opacity;
-o-transition: 0.5s opacity;
transition: 0.5s opacity;

}

/*--- grid ---*/


.gutter-sizer {width: 100px;}

.masonry-load {
opacity: 0;
z-index: -1;
-webkit-transition: 0.5s opacity;
-moz-transition: 0.5s opacity;
-ms-transition: 0.5s opacity;
-o-transition: 0.5s opacity;
transition: 0.5s opacity;
}

#posts-container:after {
  content: '';
  display: block;
  clear: both;
}



.main-content {
box-sizing: border-box;
padding: 1em;
}

.tumblr_video_container {max-height: 570px !important; overflow: hidden !important;
}
.posts li, .posts blockquote, figure, video, iframe, .video, .video iframe, figure.tmblr-embed.tmblr-full, figure.tmblr-embed.tmblr-full iframe {max-width: 100%;}
.postsource {display: none;}

/*----- CAPTION -----*/

.caption {
margin: 0; 
list-style-type: none;
padding: 0 1.5em;
}

.caption p {margin: 1em 0;}
.caption p:last-of-type {margin-bottom: 1.5em;}
.caption:first-of-type p:first-of-type {margin-top: 1.5em;}
.caption.rbcap:first-of-type {margin-top: 1.5em;}
.caption iframe, .caption img {max-width: 100%;}

.capicon {
width: 2em;
height: 2em;
}

.username {
display: inline-block;
vertical-align: middle;
}

.user-wrap a svg {
width: 0.75em;
height: 0.75em;
color: #fff;
background-color: #da8da9;
padding: 0.35em;
border-radius: 50%;
margin-right: 0.75em;
opacity: 0.8;
}

.user-wrap:hover a svg {opacity: 1.0;}

.username a, .username a:hover {border-bottom: none;}

.deactive::after {
content: '(deactivated)';
margin-left: 1em;
opacity: 0.75;
color: #707070;
}

p.tmblr-attribution {margin-top: 1em !important;}



/*----- TEXT -----*/

h1.post-title {margin: 0; padding: 1em 1em 0 1em;}

pre {
line-height: inherit;
font-size: inherit;
white-space: pre-wrap;
white-space: -moz-pre-wrap;
white-space: -pre-wrap;
white-space: -o-pre-wrap;
word-wrap: break-word;
}

a.read_more, a.more_notes_link {
font-weight: bold;
text-transform: uppercase;
letter-spacing: 0.1em;
font-family: 'Playfair Display', serif;
color: #212121;
}

a.read_more:hover, a.more_notes_link:hover {color: #da8da9;}
a.read_more, a.more_notes_link, a.read_more:hover, a.more_notes_link:hover {border-bottom: none;}
p.read_more_container {text-align: center;}

@font-face {
font-family: Calluna;
src: url("https://assets.tumblr.com/fonts/calluna/Calluna-BoldIt-webfont.eot?3=&v=f685dc881c60c298ea22a73fe505b88a");
src: url("https://assets.tumblr.com/fonts/calluna/Calluna-BoldIt-webfont.eot?3%3F=&v=f685dc881c60c298ea22a73fe505b88a#iefix") format("embedded-opentype"),url("https://assets.tumblr.com/fonts/calluna/Calluna-BoldIt-webfont.woff?3=&v=760a50f4d098e59aebaf0f0e58ae2cc8") format("woff"),url("https://assets.tumblr.com/fonts/calluna/Calluna-BoldIt-webfont.ttf?3=&v=5ace789439bff3b27f8d4112725531da") format("truetype"),url("https://assets.tumblr.com/fonts/calluna/Calluna-BoldIt-webfont.svg?3=&v=5b95c481dd7411c6e112143d6646bd9b#_.regular") format("svg");
font-weight: 700;
font-style: italic
}

@font-face {
font-family: Fairwater;
src: url("https://assets.tumblr.com/fonts/fairwater/fairwater_script_regular-webfont.woff2?v=b7ab7a58cded3365889a447bfd9e9c45") format("woff2"),url("https://assets.tumblr.com/fonts/fairwater/fairwater_script_regular-webfont.woff?v=96e975b7468359e6f67086305577e43e") format("woff");
font-weight: 400;
font-style: normal
}

p.npf_quirky {font-family: Fairwater; font-size: 1.75em;}

.npf_color_joey {color: #e57373;}
.npf_color_monica {color: #ff8a65;}
.npf_color_phoebe {color: #ffee58;}
.npf_color_ross {color: #81c784;}
.npf_color_rachel {color: #4fc3f7;}
.npf_color_chandler {color: #9575cd;}
.npf_color_niles {color: #f06292;}

#k {
position: fixed;
bottom: 20px;
right: 20px;
font-size: 15px;
background-color: #ffffff;
padding: 5px 8px;
border-radius: 3px;
}

#k:hover {background-color: #da8da9; color: #ffffff;}

/*----- LINK -----*/

a.link-wrap {
display: block;
color: #4c4c4c;
border: 1px solid #e0e0e0;
background-color: #f7f7f7;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s;
}

a.link-wrap .title {color: #212121;}

a.link-wrap:hover, .npf-link-block:hover {
background-color: rgba(218,141,169, 0.25);
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s;
}

.thumbnail {max-width: 100%; border-bottom: 1px solid #e0e0e0;}
.link {padding: 1.5em;}
.link-txt {margin-top: 1.5em;}

.link-host {
border-top: 1px solid #e0e0e0; 
background-color: #fff;
padding: 1.5em;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s;
}

.link-host svg {
margin-right: 0.75em;
width: 1.25em;
height: 1.25em;
}

.npf-link-block {
margin-top: 1.5em;
border-radius: 0px;
border: 1px solid #e0e0e0;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s;
}
 
.npf-link-block .poster .title {background-color: initial; padding: 1.5em;}
.npf-link-block.no-poster .title {padding: 1.5em 1.5em 0 1.5em;}
.npf-link-block .title {font-size: 1.25em; border-bottom: none;}
.npf-link-block .bottom {padding: 1.5em !important; color: #707070;}
 
.npf-link-block .bottom .site-name {
font-size: 0.9em;
color: #707070;
font-weight: normal;
letter-spacing: 0.1em;
}

/*----- PHOTO -----*/
 
.photo img {width: 100%;}
.vignette, #vignette {opacity: 0;}
.tmblr-lightbox, #tumblr_lightbox {background-color: rgba(60, 60, 60, 0.75) !important;}
 
.lightbox-image, #tumblr_lightbox img {
box-shadow: none !important;
border-radius: 0 !important;
max-width: none;
}

/*----- PHOTOSET -----*/

.captext figure {margin: 1em 0;}
.captext figure .tmblr-full {margin-top: 4px;}
.tmblr-full:hover {cursor: pointer;}
.npf_image, .tmblr-full {border: none; outline: none;}

.npf_photoset {margin: 1em -1.5em 2em -1.5em;}

figure.tmblr-full a, figure.tmblr-full a:hover {border-bottom: none;}

/*----- QUOTE -----*/

.quote, p.npf_quote {
color: #212121;
font-style: italic;
font-size: 1.5em;
line-height: 160%;
font-family: 'Playfair Display', serif;
font-weight: bold;
}

.quote p:first-of-type {margin-top: 0;}
.quote p:last-of-type {margin-bottom: 0;}
p.npf_quote {font-family: inherit; margin-bottom: 1em;}

/*----- CHAT -----*/

.chat {padding: 0; margin: 0;}
.chat li {list-style-type: none;}
.line {padding: 1em 0;}
.line:first-of-type {padding: 0 0 1em 0;}
.line:last-of-type {padding: 1em 0 0 0;}

p.npf_chat {font-family: inherit; margin-top: 1em;}
 
p.npf_chat b {
color: #212121;
text-transform: uppercase;
letter-spacing: 0.1em;
font-family: inherit;
font-size: 0.9em;
}

/*----- ANSWER -----*/

.askpost {border: 1px solid #e0e0e0; margin-bottom: 2em;}

.ask-details {
border-bottom: 1px solid #e0e0e0; 
padding: 1.5em;
background-color: #f7f7f7;
}

.ask-details .icon {
width: 2em; 
height: 2em; 
background-color: #fff; 
padding: 6px;
}

.askpost .subtitle {display: inline-block; margin-left: 0.75em;}
.askpost .subtitle, .askpost .subtitle a {color: #212121;}
.askpost .subtitle a:hover {color: #da8da9;}
.question {padding: 1.5em;}
.question p:first-of-type {margin-top: 0;}
.question p:last-of-type {margin-bottom: 0;}

/*----- AUDIO -----*/
 
.audio-wrap {border: 1px solid #e0e0e0; text-align: left;}

.album-art {
float: left;
display: inline-block;
width: 150px;
height: 150px;
}
 
.album-art img {
z-index: 1;
width: 150px;
height: 150px;
box-sizing: border-box;
padding: 1em;
border-right: 1px solid #e0e0e0;
}

.audioinfo {
position: relative;
height: 150px;
width: calc(100% - 150px);
text-align: center;
display: flex;
justify-content: center;
flex-direction: column;
box-sizing: border-box;
padding: 0 1.5em;
background-color: #f7f7f7;
color: #4c4c4c;
overflow: auto;
}
 
.button {
width: 30px;
height: 30px;
overflow: hidden;
position: relative;
z-index: 2;
margin: calc(60px - 1em);
}
 
.audiobox {
background-color: #f2f2f2;
z-index: 3;
position: absolute;
display: inline-block;
margin: 1em 0 0 1em;
padding: 0;
border: 1px solid #e0e0e0;
width: calc(150px - 2em - 2px);
height: calc(150px - 2em - 2px);
opacity: 0.2;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s;
}

.audio-wrap:hover .audiobox {
opacity: 0.9;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s;
}
 
.audioinfo li {list-style-type: none;}
.audioinfo .subtitle {font-size: 1.1em; margin-bottom: 0.25em; color: #212121;}

/*---- TOP INFO -----*/

.info {
background-color: #f7f7f7;
color: #4c4c4c;
padding: 1.5em;
box-sizing: border-box;
}

.top-info {
border-bottom: 1px solid #e0e0e0;
}

.top-info .info-left {
display: inline-block;
vertical-align: middle;
line-height: 145%;
flex-shrink: 0;
max-width: calc(100% - 6em - 3em);
white-space: nowrap;
overflow: hidden;
text-overflow: hidden;
}

.top-info .top-details {
display: inline-block;
vertical-align: middle;
}

.top-info .icon {
width: 2em;
height: 2em;
margin-right: 0.75em;
background-color: #fff;
padding: 6px;
display: inline-block;
border: 1px solid #fff;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s;
}

.posts:hover .top-info .icon {
border: 1px solid #da8da9;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s;
}

.top-info .title {font-size: 1.25em;}
.top-info .title a {color: #212121;}
.top-info .title a:hover {color: #da8da9;}

.info-controls {
min-width: 6em;

flex-shrink: 0;
}
 
.info-controls a {margin-left: 0.75em; display: inline-block;}
.info-controls a svg {width: 1.25em; height: 1.25em; color: #da8da9;}
.info-controls a:hover svg {color: #212121;}
 
.like-b {
position: relative;
display: inline-block;
height: 1em;
margin-bottom: -1px;
cursor: pointer;
}
 
.like-b .like_button iframe {
   position: absolute;
   top: 0;
   left: 0;
   bottom: 0;
   right: 0;
   z-index: 2;
   opacity: 0.000001;
}
 
.like_button iframe {width: 100% !important; height: 100% !important;}
.like-b .liked + .b {color: #d32f2f;}
.like-b .liked + .b svg {fill: #d32f2f; color: #d32f2f;}

/*----- INFO -----*/

.bottom-info {border-top: 1px solid #e0e0e0;}
.perma-info li {list-style-type: none;}
.perma-info li:first-of-type {font-weight: bold; color: #212121; font-size: 1.1em;}


.tags {display: none;}


.pin-post svg {
width: 1em;
height: 1em;
color: #fff;
background-color: #da8da9;
padding: 0.35em;
border-radius: 50%;
margin-right: 0.25em;
}

.pin-post:hover svg {background-color: #212121;}

.td-page {padding: 1.5em; box-sizing: border-box;}

.td-page span {
font-weight: bold;
color: #212121;
font-size: 1.15em;
font-family: 'Playfair Display', serif;
font-style: italic;
}

/*---- POST NOTES -----*/

.post-notes .title {
background-color: #f7f7f7;
padding: 1em;
box-sizing: border-box;
border-bottom: 1px solid #e0e0e0;
color: #212121;
}

ol.notes {
list-style-type: none;
max-width: 100%;
padding: 1.5em;
margin: 0;
}

ol.notes li.note {padding: 0.25em; display: block;}
ol.notes li.note a {text-transform: uppercase; letter-spacing: 0.1em; font-size: 0.9em;}
ol.notes li.note a.avatar_frame {border-bottom: none;}

ol.notes li.note img.avatar {
border-radius: 50%;
margin-right: 1em;
vertical-align: middle;
display: inline-block;
width: 1.25em;
height: 1.25em;
}

/*---- PAGINATION -----*/

#pg {text-align: center; margin: 100px auto;}
#pg a {margin: auto 0.75em; display: inline-block;}

#pg a svg {
width: 2em;
height: 2em;
display: inline-block;
vertical-align: middle;
background-color: #fff;
box-shadow: 0 0 5px #e0e0e0;
padding: 0.5em;
border-radius: 50%;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
}

#pg a:hover svg {
color: #ffffff;
background-color: #da8da9;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
}

.slash {
color: #da8da9;
margin: auto 0.75em;
font-size: 1.5em;
display: inline-block;
vertical-align: middle;
}

#pg .upper {margin-top: 1em;}
#pg .upper b {font-family: 'Playfair Display', serif; font-style: italic;}

#btop a svg {
position: fixed;
left: 20px;
bottom: 20px;
width: 1.5em;
height: 1.5em;
}

#btop a:hover svg {color: #212121;}

/*----- MOBILE CONTROLS -----*/
 
.mobile-controls {
top: 15px;
right: 15px;
z-index: 9999999;
position: fixed;
display: none;
}
 
.mobile-controls a {margin-left: 1em;}
.mobile-controls a svg {width: 1.5em; height: 1.5em;}

/*---- MEDIA QUERIES -----*/


@media only screen and (min-width: 1600px) {
#container {width: 85vw;}
}

@media only screen and (max-width: 1367px) {
#container {width: 94vw;}
.gutter-sizer {width: 50px;}
#posts-container {width: calc(100% - 300px); margin-left: 300px;}
article {width: calc(50% - 25px);}
}

@media only screen and (max-width: 1100px) {
#container {width: 85vw;}
.gutter-sizer {width: 0px;}
article {width: 100%;}

}


@media only screen and (max-width: 1024px) {
#container, #posts-container {width: 570px;}
#posts-container {margin-left: auto;}
article {width: 100%;}

#sidebar {
    position: relative;
    width: 100%;
    margin: auto auto 150px auto;
}

.mobile-controls {display: block;}
.tmblr-iframe-compact .tmblr-iframe--unified-controls {display: none;}
}

@media only screen and (max-width: 650px) {
#container, #posts-container {width: 100vw;}   
}
