/* 
  BLUE/LIGHT BLUE   ::  css properties
  ORANGE/YELLOW/RED ::  css selectors
  GREEN/LIGHT GREEN ::  css values
  */
  
 .npf_quirky, .npf_quote {font-size:calc(20px + 5px);line-height:1em;} 
 
/*--------------------TOOLTIPS-------------------- 
    #s-m-t-tooltip {
    padding: 5px 10px;
    margin: 26px 9px 0 15px;
    background-color:#FFFFFF;
    border-radius:5px;
    font-family:'montserrat';
    font-size:8px;
    letter-spacing:1px;
    text-transform:uppercase;
    color:#000000;
    z-index:99999999999999999999999999998;
    max-width:40vw;} */
 
/*--------------------SCROLLBAR-------------------
::-webkit-scrollbar {
    background-color:#f8f8f8;
    height:13px;
    width:13px;
    }
 
::-webkit-scrollbar-thumb {
    background-color:{color:scrollbar};
    border:6px solid {color:scrollbar background};
}
 
::-webkit-scrollbar-track {background-color:{color:scrollbar background};} */
 
 /*--------------------BASICS--------------------*/

@font-face {
  font-family: Tangerine;
  src: url('https://redstringraven.neocities.org/fonts/Tangerine-Regular.ttf');
  }

@font-face {
  font-family: Tangerine;
  src: url('https://redstringraven.neocities.org/fonts/Tangerine-Bold.ttf');
  font-weight: bold;
  }
 
body{ 
  color:#000000;
  cursor:'normal';
  font-family: 'nunito', sans-serif;
  margin:0;
  font-size: 13px;
  text-align: left;
  background-color:#EDEFF0;
}

b, strong {
  color: #3D4C80;
  }

i, em, .em {
  color: #8A4CA1;
  }

hr {
    width:70%;
    border-width:0;
    height:1px;
    background-color:#FFFFFF;
    }
 
/*--------------------LINKS--------------------*/
 
img {opacity:1;text-decoration:none;}
 
h1 {
  font-size:15px;
  font-family:'tangerine', bold;
  text-transform:uppercase;
  letter-spacing:3px;
  color:#8D65A3;
  text-align:center;
  }
h2 {
  font-size:14px;
  font-family:'tangerine';
  text-decoration:underline;
  letter-spacing:2px;
  color:#A265A3;
  text-align:center;
  }
h3, 
h4, h5, h6 {
    font-size:11px;
    font-family: 'playfair display';
    text-transform: uppercase;
    letter-spacing: 2px;
    color:#000000;
    text-align:center;
    }

.pp p:first-child {margin-top:0;}

/*-----------------CONT-----------------*/

/* width:calc({text:post width}px + ({text:post padding}px * 2) + {text:sidebar 1 width}px + {text:sidebar 1 right margin}px + {text:sidebar 2 width}px + {text:sidebar 2 right margin}px); */
#container {
    position:absolute;
    margin:0 auto;
    margin-top:0;
    top:0;
    left:-550px;
    right:0;
    max-width:calc(500px + (2px * 2) + 300px + 20px + 300px + 20px);
    height:100vh;
    }
    
#container a {
  color: #8A4CA1;
  font-weight: bold;
  text-decoration: none;
  }

/* (sidebar1 width + sidebar1 right margin + sidebar2 width +sidebar2 right margin) */  
#nudge {
  margin-left:calc(300px + 1px + 300px + 1px);
  }

/*#pressdown {
    margin-top:100px;
}8*/

main {
  position:absolute;
  width:550px;
  height:100vh;
  background-color:#E3E5E6;
  flex: 1;
}

#header {
  position:relative;
  left:300px;
  width:101%;
  background-color:#5A507A;
  height:100px;
}

/*-----------------SIDEBAR 1-----------------*/
#james {
    position:absolute;
    left:300px;
    background-color:#E3E5E6;
    /*top:50%;transform:translateY(-50%);*/
    width:300px;
    height:100vh;
    }

.square {
    padding:20px;
    background-color:#F2F2F2;
    border:.5px dashed #000000;
    font-family:'montserrat';
    line-height:1em;
    text-transform:lowercase;
    letter-spacing:1.5px;
    font-size:12px;
    color:#1F2121;
    text-align:left;
    }

/*.nuts {
    display:flex;
    background-color:#FFFFFF;
    border-bottom:4px solid #548062;
    }

.uta {
    width:100%;
    padding:10px;
    font-family:'Inconsolata';
    line-height:1.7em;
    letter-spacing:-0.1px;
    font-size:10px;
    color:#546680;
    text-align:left;
    }

.orion {
    align-self:center;
    padding:20px;
    background-color:#FFFFFF;
    font-family:'source code pro';
    line-height:0;
    font-size:40px;
    color:#9AC97F;
    }

.parsley {
    margin-top:10px;
    text-align:center;
    width:calc(100% + 8px);
    margin-left:-4px;
    }

.parsley a {
    display:inline-block;
    margin:1px 2px;
    width:calc((200px / 4) - 23px);
    padding:8px 8.5px 7px 8.5px;
    background-color:#FFFFFF;
    font-family:'montserrat';
    text-transform:uppercase;
    letter-spacing:1px;
    line-height:1em;
    font-size:calc(12px - 3px);
    color:#9AC97F;
    }

.parsley a:hover {
    background-color:#FFFFFF;
    color:#7BDE43;
    }

.parsley a:first-child {margin-left:0px;}
.parsley a:last-child {margin-right:0px;}*/

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

#laura {
    position:absolute;
    left:853px;
    background-color:#E3E5E6;
    /*top:50%;transform:translateY(-50%);*/
    margin-left:calc(300px + 1px);
    width:300px;
    height: 100vh;
    text-align:center;
    }

.drawing {
    font-family:'playfair display';
    text-transform:uppercase;
    line-height:1.2em;
    font-size:10px;
    color:#548062;
    }

/*.fruit {
    display:flex;
    margin-top:10px;
    }

.cherry {
    margin-top:calc(0.5em - 0.1em);
    margin-left:13.5px;
    width:100%;
    height:1px;
    background-color:#FFFFFF;
    }

.olive {
    width:100%;
    font-family:'montserrat';
    text-transform:uppercase;
    line-height:1em;
    letter-spacing:1px;
    font-size:16px;
    color:#715480;
    }

.blossom {
    margin-top:15px;
    width:calc(100% + 6px);
    }

.blossom a {
    display:inline-block;
    margin:3px 2px;
    padding:5px;
    width:calc((100% / 2) - (9px * 4));
    background-color:#FFFFFF;
    font-family:'montserrat';
    text-transform:uppercase;
    line-height:1em;
    letter-spacing:1px;
    font-size:calc(16px - 1px);
    color:#80546C;
    }

.blossom a:hover {
  background-color:#FFFFFF;
  color:#C97FA8;
  }*/

/*--------------------TOP SECT--------------------*/
#bloom {
    display:flex;
    width:100%;
    margin-bottom:40px;
    font-family:'Inconsolata';
    }

.lavender {
    background-color:#5A507A;
    margin-top:0.5em;
    line-height:1.7em;
    letter-spacing:-0.1px;
    font-size:calc(20px + 0.5px);
    color:#82BA9A;
    }
    
    
/*.ico {
    margin-right:10px;
    width:55px;
    height:55px;
    padding:7px;
    border-radius:4px;
    border:1px solid #C97FA8;
    }
    
.feather {
    margin:8px 1px;
    padding:1px 10px;
    }

.feather highlight {
    padding:4px 9px;
    background-color:#FFFFFF;
    font-family:'Inconsolata';
    letter-spacing:0.4px;
    line-height:1em;
    font-size:16px;
    color:#9AC97F;
    }*/
  
/* ----------------navigation section!!------------- */
#navbar {
  height: 40px;
  background-color: #13092D;
  width: 100%;
  }

#navbar ul {
  display: flex;
  padding: 0;
  margin: 0;
  list-style-type: none;
  justify-content: space-evenly;
  }

#navbar li {
  padding-top: 10px;
  }

/* navigation links*/
#navbar li a {
  color: #ED64F5;
  font-weight: 800;
  text-decoration: none;
  }

 /* navigation link when a link is hovered over */
#navbar li a:hover {
  color: #a49cba;
  }