/*
Styles for tiffanybbrown.com
*/
*::after, *::before {
  box-sizing: inherit; }

ins {
  text-decoration: none; }

del {
  display: none; }

body {
  color: #111;
  font: 1em/1.5 "robotoregular", "Arial", sans-serif;
  font-size: 1rem;
  padding: 0;
  margin: 0; }

.index {
  background: #023;
  color: #fff; }

body > header,
body > nav,
body > footer {
  padding: 1rem 0; }

body > header {
  background: #023;
  color: #fff; }

::selection {
  background: #9f0; }

a {
  text-decoration: none; }

a:focus, input:focus, button:focus {
  outline-color: #9f0; }

[id=sitename] {
  font-size: 8vw;
  min-width: 218px; }

[id=sitename] a {
  color: #fff; }

b,
[type=submit],
.note:before,
.update:before,
strong {
  font-family: "robotobold", "Arial Black", sans-serif;
  font-variant: initial;
  font-weight: normal; }

.access {
  text-indent: -9999px; }

em,
i,
address {
  font-style: normal; }

em, i, * > em {
  font-family: "robotoitalic", "Arial Black", sans-serif; }

@media screen and (min-width: 460px) {
  [id=sitename] {
    font-size: 1.5rem; } }
@media screen and (max-width: 330px) {
  .subtitle {
    display: none; } }
.subtitle {
  width: 80%;
  display: none; }

.published-on {
  text-align: right;
  text-transform: uppercase;
  font-size: .9rem;
  color: #666;
  letter-spacing: .05em;
  margin: 1rem 0.5rem; }

@media screen and (max-width: 600px) {
  .published-on {
    margin: 1rem 2rem 1rem 1.5rem; } }
ul {
  margin: 1.5rem 0;
  list-style-type: disc; }
  ul ul {
    list-style-type: square; }
    ul ul ul {
      list-style-type: circle; }

ol {
  margin: 1.5rem 0; }
  ol ol {
    list-style-type: lower-alpha; }

.outline {
  list-style-type: upper-roman; }
  .outline ol {
    list-style-type: upper-alpha; }
    .outline ol ol {
      list-style-type: decimal; }
      .outline ol ol ol {
        list-style-type: lower-alpha; }

.index main {
  margin: 0 auto; }
  .index main h1 {
    margin: 1rem auto;
    max-width: 600px; }

@media screen and (max-width: 600px) {
  .index main h1 {
    margin: 1rem 20px; } }
main {
  padding: 0;
  margin: 2rem auto 0; }

article h1,
article h2,
article h3,
article h4,
article h5,
article h6 {
  font-family: "robotobold", "Arial Black", sans-serif;
  font-weight: normal; }

article dt {
  margin-bottom: 0;
  font-family: "robotobold", "Arial Black", sans-serif; }

article dd {
  margin: 0.5rem 2rem 1.5rem 1.5rem; }

article a:link,
[id=next-previous] li i {
  color: inherit;
  border-bottom: 2px solid #c09; }

article a:visited,
[id=next-previous] li i {
  color: rgba(0, 34, 51, 0.7);
  border-bottom: 2px solid #c09; }

article a:hover,
article a:focus {
  color: #36f;
  border-bottom: 2px solid #c09; }

.sm {
  font-size: 0.8rem; }

blockquote {
  font-style: italic;
  font-size: .95rem;
  position: relative; }

figure {
  margin-left: 0;
  margin-right: 0; }

li figure {
  margin: 1rem -2em 2rem -56px; }

figcaption {
  color: rgba(0, 0, 0, 0.5);
  font-size: .85rem;
  margin: 0 auto 1rem;
  width: 100%; }

object {
  width: 100%;
  height: auto; }

@media screen and (max-width: 640px) {
  figcaption {
    width: 90%; } }
@media screen and (max-width: 600px) {
  li figcaption {
    margin: -1rem 2rem 1rem; } }
.db,
img,
video,
.media,
[type=submit],
[id=main-menu] li a {
  display: block; }

.dib,
[type=button],
.icon,
[id=main-menu] a,
[id=pagination] a,
.taglist a {
  display: inline-block; }

.di {
  display: inline; }

.dt {
  display: table; }

.dtr {
  display: table-row; }

.dtc {
  display: table-cell; }

.pabs,
.menu-trigger,
.icon b {
  position: absolute; }

.menu-trigger svg {
  pointer-events: none;
}

.prel,
header,
.wrapper,
.icon {
  position: relative; }

.pfix {
  position: fixed; }

.pst {
  position: sticky; }

.bt,
.menu-trigger {
  background: transparent; }

.b0,
img,
video,
.media,
.menu-trigger {
  border: 0; }

.m0 h2,
[id=site-footer] h2 {
  margin: 0; }
.m0 a,
[id=site-footer] a {
  color: #fff; }

.m10 {
  margin: 1rem; }

.nobdr th,
.nobdr td {
  border: none; }

.wrapper {
  margin-left: auto;
  margin-right: auto;
  max-width: 600px; }

@media screen and (max-width: 600px) {
  body > header .wrapper,
  [id=site-footer] .wrapper,
  [id=post-meta] .wrapper,
  [id=main-menu] .wrapper,
  article .wrapper {
    margin-left: 1rem;
    margin-right: 1rem; }

  article figure {
    margin-left: -1rem;
    margin-right: -1rem; }

  [id=sitename] {
    margin-left: 0.25rem; } }
table {
  margin: 1rem; }

table.even-cols {
  table-layout: fixed; }

@media screen and (max-width: 370px) {
  table {
    margin: 1rem 5px; } }
@media screen and (min-width: 600px) {
  table {
    margin: 0rem;
    width: 100%; } }
table,
th,
td {
  border: 1px groove #eee;
  border-collapse: collapse; }

th {
  background-color: #fff;
  background-image: -webkit-linear-gradient(#fff, #ccc);
  background-image: linear-gradient(#fff, #ccc);
  background-color: #eee;
  text-align: left;
  width: 100%; }

th,
td {
  padding: 0.4em; }

.zebra tr:nth-child(even) {
  background: #eee; }

.noblt {
  list-style-type: none;
  padding-left: 0; }

.ilist {
  display: inline;
  padding: 0; }

.ilist li {
  display: inline-block; }

.comma li:after {
  content: ", "; }

.comma li:last-child:after {
  content: ""; }

.pipe li:after {
  content: " | "; }

.pipe li:last-child:after {
  content: ""; }

.slash li:after {
  content: " / "; }

.slash li:last-child:after {
  content: ""; }

.lnklst li {
  margin: 0 0 1rem 0; }

.lnklst button, .lnklst a {
  -webkit-transition: background 150ms ease-in;
  transition: background 150ms ease-in;
  background: rgba(255, 255, 255, 0.1);
  display: block;
  padding: .5rem 1rem; }

.lnklst a:link {
  color: #fff; }

.lnklst a:hover,
.lnklst a:focus {
  background: #906; }

.lnklst a:visited {
  color: #ddd; }

[id=post-meta] {
  background: rgba(0, 34, 51, 0.1);
  margin: 5rem auto 0;
  padding: 2rem 0; }

[id=post-meta] h2,
[id=post-meta] b,
[id=post-meta] .note:before,
[id=post-meta] .update:before {
  text-shadow: #fff 1px 1px 0px; }

[id=post-meta] * + * {
  margin: auto; }

[id=post-meta] ul {
  margin-bottom: 2rem;
  line-height: 1.8; }

[id=post-meta] a {
  padding: 1px 2px 0px;
  color: #000; }

[id=post-meta] a:visited {
  border-bottom-style: dashed; }

[id=post-meta] a:hover,
[id=post-meta] a:focus {
  background: #9f0; }

[id=post-meta] ul,
[id=post-meta] ol,
[id=post-meta] li {
  list-style-type: none; }

[id=post-meta] [id=related-posts] a {
  border-bottom-color: transparent;
  background: rgba(0, 34, 51, 0.1);
  color: #000 !important;
  display: block;
  padding: 0.25rem 1rem; }

[id=post-meta] [id=related-posts] a:hover,
[id=post-meta] [id=related-posts] a:focus {
  background: #9f0;
  border-bottom-color: #c09; }

[id=page-meta] {
  margin: 5rem 0 2rem;
  font-style: italic;
  color: #666;
  font-size: 0.9rem; }

[id=post-meta] a:hover,
[id=post-meta] a:focus {
  color: #000;
  text-shadow: none; }

[id=site-footer] {
  background: #023;
  color: #fff; }

[id=site-footer] ul[id=social] {
  padding: 0;
  text-align: center; }

[id=site-footer] ul[id=social] li {
  margin: 0 0.5rem; }

.icon {
  color: #fff;
  height: 2rem;
  width: 2rem; }

.icon svg {
  -webkit-transition: fill 150ms ease-in;
  transition: fill 150ms ease-in;
  fill: #fff;
  display: block;
  width: 100%;
  height: 100%; }

.icon:hover svg,
.icon:focus svg {
  fill: #9f0; }

.icon b {
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  background: #f50;
  padding: 2px 6px;
  font-family: "robotoregular", "Arial", sans-serif;
  font-style: normal;
  font-weight: normal;
  text-align: center;
  text-transform: uppercase;
  font-size: .8rem;
  display: none;
  top: 50%;
  left: 125%;
  min-width: 4rem;
  width: auto;
  white-space: nowrap;
  z-index: 3; }

.icon:hover b,
.icon:focus b {
  display: block; }

.icon b:before {
  content: ' ';
  display: block;
  background: inherit;
  left: -4px;
  width: 8px;
  height: 8px;
  top: 50%;
  -ms-transform: translateY(-50%) rotate(45deg);
  -webkit-transform: translateY(-50%) rotate(45deg);
  transform: translateY(-50%) rotate(45deg);
  z-index: 1;
  position: absolute; }

img,
video,
.media {
  border: 0;
  margin: 1.5rem 0;
  width: 100%;
  height: auto;
  padding-bottom: 1%; }

audio {
  width: 100%; }

video,
.media {
  background: #000; }

[type=text],
[type=email],
[type=url],
[type=tel],
[type=number],
[type=datetime],
[type=date],
[type=password],
[type=datetime-local],
[type=search] {
  border: 1px solid #aaa;
  border-radius: 0;
  box-shadow: none;
  display: inline-block;
  font: inherit;
  padding: .15em;
  width: 100%; }

*::-webkit-input-placeholder {
  color: #444; }

*:-moz-placeholder {
  color: #444; }

*:-ms-input-placeholder {
  color: #444; }

*:focus::-webkit-input-placeholder {
  color: transparent; }

*:focus::-moz-placeholder {
  color: transparent; }

*:focus:-ms-input-placeholder {
  color: transparent; }

button {
  cursor: pointer; }

@media screen and (max-width: 330px) {
  .menu-trigger {
    width: 2.5rem;
    height: 2.5rem; } }
.menu-trigger {
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  -webkit-transition: 250ms ease-in-out;
  transition: 250ms ease-in-out;
  width: 3rem;
  height: 3rem;
  right: 0;
  top: 50%;
  z-index: 3; }
  .menu-trigger:hover svg, .menu-trigger:focus svg {
    fill: #f50; }
  .menu-trigger > svg {
    -webkit-transition: 250ms ease-in-out;
    transition: 250ms ease-in-out;
    fill: #9f0;
    display: block;
    height: 100%;
    width: 100%; }

.open > svg {
  fill: #f50; }

[id=main-menu] [data-triggers="#main-menu"] {
  border: 0;
  background: rgba(255, 255, 255, 0.15);
  color: #fff;
  display: block;
  font: inherit;
  height: auto;
  padding: 0.5rem;
  position: static;
  -wekbit-transform: none;
  transform: none;
  text-align: left;
  width: 100%; }
  [id=main-menu] [data-triggers="#main-menu"]:hover, [id=main-menu] [data-triggers="#main-menu"]:focus {
    background: #906; }

[type=submit] {
  -webkit-transition: all 150ms ease-in;
  transition: all 150ms ease-in;
  background: transparent;
  border: 5px solid #fff;
  border-radius: 1000px;
  color: #fff;
  font: inherit;
  margin: .5rem auto;
  max-width: 400px;
  padding: .5rem;
  text-transform: uppercase;
  width: 100%; }

[type=submit]:hover,
[type=submit]:focus {
  border-color: #f50;
  color: #f50; }

[id=search] [type=search] {
  font-size: 1.2rem;
  padding: 0.5rem; }

[id=search] [type=submit] {
  width: auto;
  padding: 0.5rem 3rem; }

[id=main-menu-transition] {
  -webkit-transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  transform: translateY(-100%);
  -webkit-transition: 500ms cubic-bezier(0.83, 0.32, 0.36, 1.39);
  transition: 500ms cubic-bezier(0.83, 0.32, 0.36, 1.39);
  background: #00131c;
  color: #fff;
  position: absolute;
  width: 100%;
  top: 0;
  z-index: 2; }

.menu-open [id=main-menu-transition] {
  -webkit-transform: translateY(0%);
  -ms-transform: translateY(0%);
  transform: translateY(0%); }

[id=main-menu] {
  padding: 4rem 0 0; }

[id=main-menu] a {
  color: #fff; }

[id=main-menu] form a {
  border-bottom: 1px solid #9c0;
  line-height: 1; }

[id=main-menu] form a:hover,
[id=main-menu] form a:focus {
  color: #9f0; }

[id=main-menu] li {
  margin-right: 0;
  margin-bottom: 0.5rem; }

[id=main-menu] li a {
  background: rgba(255, 255, 255, 0.15);
  padding: 0.5rem; }

[id=main-menu] label {
  font-size: .9em;
  font-family: "robotobold", "Arial Black", sans-serif;
  text-transform: uppercase; }

.editors-note,
.note {
  background: #fc0;
  font-size: .9rem;
  margin: 0;
  padding: 1.5rem; }

.note:before {
  content: "NOTE: "; }

.update:before {
  content: 'UPDATE: ';
  font-weight: bold; }

pre {
  background: #e8ebec;
  padding: 1rem;
  overflow: auto; }

@media screen and (min-width: 600px) {
  pre,
  table {
    resize: horizontal; } }
.turn25,
.menu-trigger.open > svg {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg); }

.turn180 {
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg); }

[id=copyright] {
  padding: 1.5rem 0 1rem;
  font-size: .9rem;
  width: 90%;
  margin: auto; }

.home-list {
  color: #fff; }

.home-list h1 {
  margin: 0; }

.home-list li {
  margin: 0;
  border-bottom: .5rem solid #023;
  font-size: 1.25rem; }

.lead a {
  font-size: 2rem; }

.lead a {
  padding: 4rem 1rem 1rem;
  color: #000; }

.lead a:link,
.lead a:visited {
  background: #fd0;
  color: #023; }

.lead a:hover,
.lead a:focus {
  background: #f80; }

[id=pagination],
.taglist {
  color: #fff;
  margin-top: 2rem; }

.taglist {
  text-align: center; }

[id=pagination] .wrapper,
.taglist .wrapper {
  max-width: 600px; }

[id=pagination] li,
.taglist li {
  background: rgba(255, 255, 255, 0.1);
  margin: .35rem;
  border-bottom: 3px solid rgba(255, 255, 255, 0); }

[id=pagination] li {
  margin: 0 .35rem 0 0; }

.taglist li {
  -webkit-transform: skew(-15deg);
  -ms-transform: skew(-15deg);
  transform: skew(-15deg); }

[id=pagination] li:hover,
[id=pagination] li:focus,
.taglist li:hover,
.taglist li:focus {
  background: #fe0;
  color: #000; }

[id=pagination] li:hover a,
[id=pagination] li:focus a,
.taglist li:hover a,
.taglist li:focus a {
  color: #000; }

[id=pagination] li.active,
.taglist li.active {
  font-weight: bold;
  border-bottom-color: #9f0; }

[id=pagination] a,
.taglist a {
  padding: .5rem 1rem;
  line-height: 1; }

.taglist a {
  -webkit-transform: skew(15deg);
  -ms-transform: skew(15deg);
  transform: skew(15deg); }

[id=pagination] a:link,
.taglist a:link {
  color: #fff; }

[id=pagination] a:visited,
.taglist a:visited {
  color: #eee; }

[id=pagination] a:hover,
[id=pagination] a:focus,
.taglist a:hover,
.taglist a:focus {
  color: #000; }

[id=next-previous] {
  margin-top: 5em; }
  [id=next-previous] ul {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: stretch;
    align-items: stretch;
    flex-grow: 1;
    -webkit-flex-grow: 1;
    padding-left: 0; }
  [id=next-previous] li {
    -webkit-flex: 0 0 50%;
    flex: 0 0 50%; }
  [id=next-previous] a {
    display: inline-block;
    border: none !important;
    background-size: auto 1.5em !important;
    padding-top: 2px !important;
    padding-bottom: 2px !important; }
  [id=next-previous] [id=post-next] {
    text-align: right; }
  [id=next-previous] a:hover,
  [id=next-previous] a:focus {
    background-color: #9f0 !important; }
  [id=next-previous] [id=post-previous] a {
    padding-left: 2em;
    background: url(//tiffanybbrown.com/images/icon/previous-arrow.svg) no-repeat;
    background-position: 2px 50%; }
  [id=next-previous] [id=post-next] a {
    padding-right: 2em;
    background: url(//tiffanybbrown.com/images/icon/next-arrow.svg) no-repeat;
    background-position: 96% 50%; }

.promo-box {
  background: #ECFFD1;
  padding: 10px;
  margin-top: 5em;
  margin-top: 5rem; }
  .promo-box::after {
    content: ' ';
    display: block;
    clear: both; }
  .promo-box h1, .promo-box h3 {
    font-size: 1.5em;
    line-height: 1;
    margin: 0; }
  .promo-box img {
    float: left;
    height: 200px;
    width: auto;
    margin: -1em 2em 0 0;
    vertical-align: middle; }
  .promo-box p {
    padding-top: 1em; }

article a.promo-button {
  display: inline-block;
  background: #f60;
  color: #fff;
  padding: .5em 1em;
  line-height: 1;
  text-decoration: none;
  border-radius: 1000px;
  border: 0;
  text-align: center; }
  article a.promo-button:hover, article a.promo-button:focus {
    background: #d30; }

@media screen and (max-width: 535px) {
  article a.promo-button {
    display: block;
    margin: auto;
    min-width: 50vw;
    text-align: center;
    font-size: 1.3em; }

  .promo-box img {
    height: 180px;
    margin: -15px 10px 0 5px; } }
@media screen and (max-width: 488px) {
  .promo-box p:last-child {
    clear: both; } }
@media screen and (max-width: 388px) {
  .promo-box p:first-of-type {
    font-size: 1em; }

  .promo-box img {
    float: none;
    margin: 0 auto 1rem auto; } }
iframe {
  display: block;
  width: 100%;
  border: 1px solid #ccc;
  min-height: 500px; }

.footer-search {
  background-color: rgba(255, 255, 255, 0.1);
  padding: .5em 1em; }

code {
  font-family: monospace;
  font-size: 110%; }

hr {
  border: 1px solid #ddd; }

.footnote {
  font-size: .9rem;
  margin-top: 5em;
  opacity: .7; }
  .footnote ol {
    padding-left: 20px; }

/*# sourceMappingURL=main.css.map */