body {
font-family: Lora, serif;
font-size: 14px;
color: #000000;
background-color: #ffffff;
text-align: left;
line-height: 160%;
word-wrap: break-word;
letter-spacing: 0.2px;
margin: 0;
padding: 0;
opacity: 1.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 {
text-decoration: none;
color: #8b8b8b;
-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: #FFFFFF;
-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, .notes a {box-shadow: inset 0 -2px 0 #FFFFFF;}
p a:hover, .notes a:hover {box-shadow: inset 0 -6px 0 #FFFFFF; color: #111111;}

h1, h2, h3, h4, h5, .title {
color: #111111;
text-transform: uppercase;
letter-spacing: 2px;
line-height: 160%;
font-weight: bold;
}

h1 a, h2 a, h3 a, h4 a, h5 a, .title a {color: #111111;}
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, .title a:hover {color: #FFFFFF}
.title {font-size: 1.5em;}
h1 {font-size: 1.25em;}
h2 {font-size: 1.1em;}
h3 {font-size: 1em;}
h4 {font-size: 0.9em;}
h5 {font-size: 0.8em;}

small {font-size: 0.9em;}
big {font-size: 1.1em;}
b, strong {color: #111111; font-weight: 700;}
b a, strong a {color: #8b8b8b;}
b a:hover, strong a:hover {color: #111111;}

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

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

.tippy-tooltip.custom-theme {
background-color: #111111;
color: #ffffff;
text-align: center;
font-family: inherit;
font-weight: normal;
text-transform: uppercase;
letter-spacing: 1px;
font-style: normal;
padding: 0.25em;
margin: 20px auto auto 10px;
font-size: 0.8em;
border-radius: 0;
}

::-webkit-scrollbar {
width: 17px;
height: 17px;
background-color: #ffffff;
}
 
::-webkit-scrollbar-track {border: 8px solid #ffffff; background-color: #FFFFFF;}
 
::-webkit-scrollbar-thumb {
   border: 6px solid #ffffff;
   background-color: #111111;
   min-height: 24px;
   min-width: 24px;
}

.tmblr-iframe-compact .tmblr-iframe--unified-controls {
z-index: 999999999!important;
opacity: 0.6;
transform: scale(0.8);
transform-origin: 100% 0;
-webkit-transform: scale(0.8);
-webkit-transform-origin: 100% 0;
-o-transform: scale(0.8);
-o-transform-origin: 100% 0;
-moz-transform: scale(0.8);
-moz-transform-origin: 100% 0;
-ms-transform: scale(0.8);
-ms-transform-origin: 100% 0;
-webkit-transition: all 0.4s;
-moz-transition: all 0.4s;
-ms-transition: all 0.4s;
-o-transition: all 0.4s;
transition: all 0.4s;
}
 
.tmblr-iframe-compact .tmblr-iframe--unified-controls:hover {
opacity: 1.0;
-webkit-transition: all 0.4s;
-moz-transition: all 0.4s;
-ms-transition: all 0.4s;
-o-transition: all 0.4s;
transition: all 0.4s;
}
 
.tmblr-iframe--app-cta-button {display: none!important;}

/*----- HEADER -----*/

aside .icon {border: 8px solid #FFFFFF;}
aside .title {letter-spacing: 3px;}

aside .title::after, .source::before {
content: '';
width: 3em;
height: 4px;
background-color: #FFFFFF;
display: block;
}

#description {margin-top: 20px; font-style: italic;}
nav li {list-style-type: none; display: inline;}
nav {margin-top: 1.5em;}

/*----- HEADER -----*/



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


@media only screen and (min-width: 1024px) {
aside {
    position: fixed;
    height: auto;
    width: 250px;
    text-align: left;
    box-sizing: border-box;
    top: 80px;
    padding: 20px;
    
}

aside .icon {
    width: 60px;
    height: 60px;
    margin-bottom: 1em;
}

aside .title::after {margin: 20px 0 0 0;}
nav li {display: inline-block; width: 48%;}
}

@media only screen and (max-width: 1023px) {
aside {
margin: 50px auto auto auto;
padding: 70px 30px;
text-align: center;
border-bottom: 1px solid #FFFFFF;
}

aside .icon {
    width: 90px;
    height: 90px;
    margin-bottom: 1.5em;
}

aside .title::after {margin: 20px auto auto auto;}
nav {margin-top: 2em;}
nav a {margin: 0 0.5em;}
}


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

section {margin: auto;}

article {
position: relative;
width: 540px;

margin: 80px 0;
}




.one-col {width: calc(350px + 540px);}
.two-col {width: calc((540px * 2) + 100px + 0.25em + 350px); max-width: calc((400px * 2) + 100px + 0.25em + 350px);}
.three-col {width: calc((540px * 3) + (100px * 2) + 0.25em + 350px);}

.two-col article {min-width: 250px; max-width: 400px;}


#container {

margin: auto auto auto 350px;
}


.main {
border: 1px solid #FFFFFF;
background-color: #ffffff;
}


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

.clearfix:before, .clearfix:after{content: ''; display: table;}
.clearfix:after {clear: both;}
.clearfix {zoom: 1;}

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

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

.upper, .notes a {
text-transform: uppercase;
letter-spacing: 1px;
font-size: 0.9em;
}

.subtitle {
color: #111111;
font-weight: bold;
text-transform: uppercase;
letter-spacing: 1px;
box-shadow: inset 0 -3px 0 #FFFFFF;
}

.border a, .username a {box-shadow: inset 0 0 0 transparent;}
.border a:hover, .username a:hover {box-shadow: inset 0 -6px 0 #FFFFFF; color: #111111;}

.box {padding: 20px;}

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

.caption {
list-style-type: none;
padding: 20px;

border-bottom: 1px solid #FFFFFF;
}

.caption:last-of-type {
border-bottom: none;

}

.captop:first-of-type {border-top: 1px solid #FFFFFF;}
.caption p {margin: 1em 0;}
.caption p:last-of-type {margin-bottom: 0;}
.ogcap p:first-of-type {margin-top: 0;}
.body:first-of-type {margin: 0; }
.caption iframe {max-width: 100%;}
.username {display: inline-block; margin-left: 0.75em;}

.capicon {
width: 20px;
height: 20px;
border: 4px solid #FFFFFF;
}

.deactive {text-decoration: line-through;}





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

.post-title {

padding: 20px;
margin: 0;


border-bottom: 1px solid #FFFFFF;
}

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;
}

@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: #FFFFFF; color: #ffffff;}

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

.linkp {
color: #000000;
background-color: #ffffff;

-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
}

.linkp:hover, .npf-link-block:hover {
background-color: #ffffff;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
}

.link {padding: 20px;}
.thumbnail {max-width: 100%; border-bottom: 1px solid #FFFFFF;}
.linkhost, .linktxt {color: #000000; margin-top: 1.5em;}

.npf-link-block {
margin-top: 1.25em;
border-radius: 4px;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
}
 
.npf-link-block .poster .title {background-color: initial; padding: 30px;}
.npf-link-block .title {font-size: 1.25em; border-bottom: none;}
.npf-link-block .bottom {padding: 30px !important; color: #000000;}
 
.npf-link-block .bottom .site-name {
font-size: 0.9em;
color: #000000;
font-weight: normal;
letter-spacing: 1px;
}

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

/*----- PHOTOSET -----*/
 
[photoset-layout] {
grid-gap: 1px;
overflow: hidden;
	grid-template-columns: repeat(6, auto);
}
 
[photoset-layout] div {
padding: 0;
border: none;
cursor: pointer;
}
 
[photoset-layout] img {
border: none;
border-radius: 0;
}
 
.post-content div.npf_row, .post div.npf_row, body div.npf_row {
margin-left: 0 !important;
margin-right: 0 !important;
}
 
.captext figure {margin: 1em 0;}
.captext figure .tmblr-full {margin-top: 1px;}
.tmblr-full:hover {cursor: pointer;}
.npf_image, .tmblr-full {border: none; outline: none;}

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

.quote, p.npf_quote {
color: #111111;
font-style: italic;
font-size: 1.25em;
line-height: 160%;
}

.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;}

.source::before {margin: 1.5em 0;}

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

.chat {padding: 0; margin: 0;}
.chat li {list-style-type: none;}
.chatter {font-size: 0.9em;}

.line {
padding: 20px;

border-bottom: 1px solid #FFFFFF;
}

.line:last-of-type {border-bottom: none;}
p.npf_chat {font-family: inherit; margin-top: 1em;}
 
p.npf_chat b {
color: #111111;
text-transform: uppercase;
letter-spacing: 1px;
font-family: serif;
font-size: 0.9em;
}

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

.askpost {text-align: center;}

.question {
text-align: left; 
border-bottom: 1px solid #FFFFFF;

}

.question p:first-of-type {margin-top: 0;}
.question p:last-of-type {margin-bottom: 0;}

.askpost .icon {border: 5px solid #FFFFFF; margin-top: -23px;}
.asker-label {font-weight: bold; color: #111111;}

/*----- AUDIO -----*/
 
.audiopost {
text-align: right;
	min-height: 50px;

}
 
.albumart {
z-index: 1;
position: relative;
width: 70px;
height: 70px;
border: 8px solid #FFFFFF;
margin: 20px auto auto calc(100% / 2 - 35px);
}
 
.button {
width: 30px;
height: 30px;
overflow: hidden;
position: relative;
z-index: 10;
margin: 10px 9px 8px 9px;
}
 
.audiobox {
background-color: #f2f2f2;
z-index: 50;
float: left;
margin: 0;
border-radius: 50%;
}
 
.audioinfo {
display: inline-block;
max-width: calc(540px - 90px);
text-align: right;
}
 
.audioinfo .upper {
font-size: 1.1em;
font-weight: bold;
color: #111111;
}



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

.info {
border-top: 1px solid #FFFFFF;

}

.info a, .tags a {margin-right: 0.75em;}
.date {font-weight: bold; color: #111111;}

.lirb {
float: right;

}



.lirb .feather {width: 14px; height: 14px;}
.lirb a {margin: 0.25em 0 0 6px; display: inline-block;}
 
.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:hover {color: #FFFFFF;}
.like-b .liked + .b {color: #d50000;}

.tags {
font-style: italic;

margin-top: 1em;
padding: 0 20px;

	
text-transform: lowercase;
}

.show-tags {display: block;}
.hide-tags {display: none;}
 
.hover-tags {
opacity: 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;
}
 
.posts:hover .hover-tags {
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;
}

.pin-post {position: absolute; margin: -13px auto auto -13px;}

.pin-post svg {
width: 20px;
height: 20px;
background-color: #FFFFFF;
color: #ffffff;
padding: 6px;
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;
}

.pin-post:hover svg {
background-color: #ffffff; 
color: #FFFFFF;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
}

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

.notes {margin: 100px 0;}

ol.notes {
list-style-type: none;
max-width: 100%;
padding: 20px;

margin: 0;
}

ol.notes li.note {padding: 0.25em; display: block;}
ol.notes li.note a {border-bottom: none;}
ol.notes li.note img.avatar {display: none;}

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

#pg {text-align: center; margin: 100px auto 200px auto;}
#pg a {margin: 0 0.5em;}

#btop {
position: fixed;
right: 30px;
bottom: 50px;
}
 
#k, #btop {z-index: 500;}

/*----- MOBILE CONTROLS -----*/
 
.mobile-controls {
top: 20px;
right: 20px;
z-index: 9999999;
position: fixed;
display: none;
}
 
.mobile-controls a {margin-left: 8px;}
 
.mobile-controls a svg {
width: 24px;
height: 24px;
color: #8b8b8b;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
}
 
.mobile-controls a:hover svg {
color: #FFFFFF;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
}

/*---- RESPONSIVE -----*/

@media only screen and (min-width: 1700px) {


.three-col {width: calc((540px * 3) + (100px * 2) + 0.25em + 350px); max-width: calc((350px * 3) + (100px * 2) + 0.25em + 350px);}
.three-col article {min-width: 250px; max-width: 350px;}

}

@media only screen and (min-width: 1366px) {

}

@media only screen and (max-width: 1699px) and (min-width: 1400px) {

.three-col {width: calc(1300px + 0.25em);}
.three-col article {width: 250px;}

}

@media only screen and (max-width: 1399px) {

.three-col {width: calc((540px * 2) + 100px + 0.25em + 350px); max-width: calc((400px * 2) + 100px + 0.25em + 350px);}
.three-col article {max-width: 400px;}

}

@media only screen and (max-width: 1365px) and (min-width: 1024px) {



.two-col, .three-col {width: calc(950px + 0.25em);}
.two-col article, .three-col article {max-width: 250px;}

}

@media only screen and (max-width: 1199px) and (min-width: 1024px) {

}

@media only screen and (min-width: 1024px) {

}

@media only screen and (max-width: 1023px) {
.mobile-controls {display: block;}
.tmblr-iframe-compact .tmblr-iframe--unified-controls {display: none;}
}

@media only screen and (max-width: 1023px) and (min-width: 600px) {



.one-col, .two-col, .three-col {width: 540px;}
.two-col article, .three-col article {width: 540px; max-width: 540px;}
#container {margin: auto;}



}

@media only screen and (max-width: 599px) {
.one-col, .two-col, .three-col {width: 100vw;}
#container {width: 85vw; margin: auto;}
article {width: 85vw; margin: 80px auto;}
#k {position: static; text-align: center;}
#btop {display: none;}
}
