@import url('https://fonts.googleapis.com/css?family=Playfair+Display+SC|Raleway:400,500|Playfair+Display');

/* 
This is v3 of of the many incarnations of my online presence. 
Intentioanlly and meticiously hand crafted in the many cafes of Toronto, 
but most especilaly at Voodoo Child on College Street. 
*/

/* general */
h1ml {
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}

.section.header {
    z-index: 2;
    position: relative;
    z-index: 2;
}

.section.header .container .row {
    padding-top: 0;
    padding-bottom: 0;
}

.section.header .name {
    display: block;
    margin-top: 20px;
    margin-bottom: 20px;
    font-family: "Playfair Display SC", Serif;
    text-transform: lowercase;
    text-align: center;
    font-size: 18px;
    padding: 0;
    color: #000;
    letter-spacing: 2px;
    font-weight: 300;
}

.section.header .name a {
    text-decoration: none;
    color: #000;
    padding: 4px;
}

.section.header .name a:hover {
    color: #000;
}

.navigation {
    z-index: 3;
    position: relative;
}

.nav {
    list-style: none;
    margin: 0;
    padding: 0;
    font-family: Raleway, "Gill Sans", Arial, sans-serif;
}

.nav li {
    padding: 10px 0;
    margin: 8px 0;
    font-size: 12px;
    font-weight: 600;
    margin-bottom: 0;
    letter-spacing: 1px;
    text-transform: uppercase;
    text-align: center;
    float: left;
    width: 33.3%;
}

.nav li a {
    text-decoration: none;
    color: #000;
    -webkit-transition: color ease-in-out .4s;
    transition: color ease-in-out .4s;
}

.nav li.active a {
    color: #fff;
}

.nav li a:hover {
    -webkit-transition: color ease-in-out .4s;
    transition: color ease-in-out .4s;
}

.social {
    position: relative;
    text-align: center;
    margin-bottom: 20px;
    margin-top: 10px;
}

.social a {
    width: 20px;
    height : 20px;
    display: inline-block;
    text-indent: -9999px;
    overflow: hidden;
    margin-right: 8px;
    opacity: 0.3;
}

.social a:hover {
    opacity: 1;
}

.social a.medium {
    background: url(/images/icon-medium.png) no-repeat 50% 50%;
}

.social a.twitter {
    background: url(/images/icon-twitter.png) no-repeat 50% 50%;
}

.social a.linkedin {
    background: url(/images/icon-linkedin.png) no-repeat 50% 50%;
}

.social a.spotify {
    background: url(/images/icon-spotify.png) no-repeat 50% 50%;
}

.social a.messenger {
    background: url(/images/icon-messenger.png) no-repeat 50% 50%;
}

.social a.facebook {
    background: url(/images/icon-facebook.png) no-repeat 50% 50%;
}

/* inisde pages */
.page .nav {
    text-align: right;
}

.page .nav li {}

.page .nav li a {
    padding-left: 10px;
    padding-right: 10px;
    opacity: 0.7;
}

.page .nav li a:hover {
    opacity: 1;
}

/*.page .nav li a { opacity: 0.5; }
.page .nav li a.active { opacity: 5; }*/


/* utility */
.text-center {
    text-align: center;
}

.text-right {
    text-align: right;
}

.text-left {
    text-align: left;
}

.unsplash-credit {
    position: absolute;
    bottom: 10px;
    right: 10px;
}

/* garden */
.garden {
    background: url(/images/hero.png) no-repeat 50% 50%;
    background-size: cover;
    background-repeat: no-repeat;
    height: -webkit-fill-available;
}

.garden .section.header {
    transition: opacity .2s ease-in-out;
    -webkit-transition: opacity .2s ease-in-out;
    transition: opacity .2s ease-in-out;
    -webkit-transition: opacity .2s ease-in-out;
    z-index: 2;
    position: relative;
    z-index: 2;
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
    animation-delay: .2s;
    animation-duration: 4s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

@-webkit-keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.garden .section.header:hover {
    opacity: 1;
    transition: opacity .2s ease-in-out;
    -webkit-transition: opacity .2s ease-in-out;
}

.garden .navigation {
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
    animation-delay: .6s;
    animation-duration: 4s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

.garden .navigation .nav li a {
    opacity: 0.2;
}

.garden .navigation .nav li a.active {
    opacity: 0.9 !important;
}

.garden .navigation .nav li a:hover {
    opacity: 1;
}

.garden .section.hero {
    text-align: center;
}

.garden .section.hero h1 {
    padding-top: 0;
    font-family: "Playfair Display", Serif;
    font-weight: 600;
    font-size: 26px;
    color: #fff;
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
    animation-delay: 1.5s;
    animation-duration: 4s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

.garden .section.hero h2 {
    font-size: 14px;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: rgba(255, 255, 255, .6);
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
    animation-delay: 2.5s;
    animation-duration: 6s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

.garden .section.hero .container {
    padding-top: 30vh;
}

.garden .section.hero .tweleve {}

/* musings */
/*.subpage.musings { }
.subpage.musings .section.header,
.subpage.musings .section.hero { background: #fafafa; } 
.subpage.musings h2 { color: #000; }
.subpage.musings .subtitle { color: rgba(0,0,0,.6); }
.subpage.musings .section.posts .row {  }*/

/* soundbath */
.page.listen {}

.page.listen .section.header .name a {
    color: #000;
}

.page.listen .nav a {
    color: #000;
}

.page.listen .nav a:hover {
    opacity: 1;
}

.page.listen .section.content {}

.page.listen .section.header,
.page.listen .section.hero {
    background: #FFD800;
}

.page.listen .section.hero {
    min-height: 40vh;
    padding-top: 6vh;
    padding-bottom: 6vh;
}

.page.listen .hero .title {
    font-family: Raleway, "Gill Sans", Arial, sans-serif;
    font-size: 22px;
    color: #000;
}

.page.listen .hero .description {
    color: #000;
    text-align: center;
    font-size: 13px;
}

.page.listen .icon-headphones {
    background: url(/images/icon-headphones.png) no-repeat 50% 50%;
    background-size: contain;
    height: 80px;
    width: 80px;
    margin: 20px auto;
    font-size: 14px;
}

.form-listenwithfaramarz {
    text-align: center;
}

.form-listenwithfaramarz input[type=email] {
    border-color: rgba(0, 0, 0, .8);
}

.form-listenwithfaramarz .button {
    border-color: rgba(0, 0, 0, .9);
    color: #000;
    margin-left: 5px;
}

.form-listenwithfaramarz .button:hover {
    border-color: #000;
    color: #fff;
    background: #000;
}

/*
.subpage.soundbath h2 {  }
.subpage.soundbath .subtitle { color: rgba(0,0,0,.6); } 
.subpage.soundbath .post-content { font-family: Georgia, "times new roman", Serif; font-size: 18px; line-height: 1.58; letter-spacing: -.004em; color:#333; }
.subpage.soundbath .post-spotifylink i { margin-right: 8px; float: left; display: inline-block; width: 20px; height: 20px; background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxNjcuNSAxNjcuNSI+PHBhdGggc3R5bGU9ImZpbGw6IzFFRDc2MCIgZD0iTTgzLjcgMEMzNy41IDAgMCAzNy41IDAgODMuN2MwIDQ2LjMgMzcuNSA4My43IDgzLjcgODMuNyA0Ni4zIDAgODMuNy0zNy41IDgzLjctODMuN1MxMzAgMCA4My43IDB6TTEyMiAxMjAuOGMtMS40IDIuNS00LjYgMy4yLTcgMS43LTE5LjgtMTItNDQuNS0xNC43LTczLjctOC0yLjguNS01LjYtMS4yLTYuMi00LS4yLTIuOCAxLjUtNS42IDQtNi4yIDMyLTcuMyA1OS42LTQuMiA4MS42IDkuMyAyLjYgMS41IDMuNCA0LjcgMS44IDcuMnpNMTMyLjUgOThjLTIgMy02IDQtOSAyLjItMjIuNS0xNC01Ni44LTE4LTgzLjQtOS44LTMuMiAxLTctMS04LTQuM3MxLTcgNC42LThjMzAuNC05IDY4LjItNC41IDk0IDExIDMgMiA0IDYgMiA5em0xLTIzLjhjLTI3LTE2LTcxLjYtMTcuNS05Ny40LTkuNy00IDEuMy04LjItMS05LjUtNS4yLTEuMy00IDEtOC41IDUuMi05LjggMjkuNi05IDc4LjgtNy4yIDEwOS44IDExLjIgMy43IDIuMiA1IDcgMi43IDEwLjctMiAzLjgtNyA1LTEwLjYgMi44eiIvPjwvc3ZnPg==);}
.subpage.soundbath .playlist-cover { height: 200px; width: 100%;background-image:url(//web.archive.org/web/20190126204115im_/http://u.scdn.co/images/pl/default/3d8ad9220b6c4dc84cef8cebe24f2afd7657121c), linear-gradient(transparent,rgba(0,0,0,0.5)); background-color: #777777; background-size: cover; margin-bottom: 20px; }*/
/* booksehlf */
/*.subpage.bookshelf {  } 
.subpage.bookshelf .section.header,
.subpage.bookshelf .section.hero { background: #4ECDC4; }
.subpage.bookshelf h2 {  }
.subpage.bookshelf .subtitle { color: rgba(0,0,0,.6); }
*/

/* Larger than mobile */
@media (min-width: 400px) {}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {
    /*.section.hero .container { background-position: right bottom; padding: 60px 0; text-align: left; }*/

}

/* Larger than tablet */
@media (min-width: 750px) {
    .garden {
        /* background-position: 7vw -20px; width: 100vw; height: 100vh; background-attachment: fixed; background-repeat: no-repeat;*/
    }

    .garden .section.hero h1 {
        font-size: 36px;
    }

    .garden .section.hero .container {
        padding-top: 46vh;
    }

    .section.header .container .row {
        padding-bottom: 20px;
        padding-top: 20px;
    }

    .section.header .name {
        text-align: center;
        margin-top: 20px;
        margin-bottom: 0;
        font-size: 24px;
    }

    .navigation {
        padding: 0;
    }

    .navigation .nav {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-pack: distribute;
        justify-content: space-around;
    }

    .navigation .nav li {
        padding: 5px;
        margin-left: 10px;
        float: left;
        text-align: left;
        width: auto;
    }

    .navigation .nav li a {
        display: block;
        padding: 4px 4px;
    }

    .social {
        text-align: left;
    }

    .page .section.header .name {
        text-align: left;
    }

    .page .nav {
        margin-top: 20px;
    }

    .page .nav li {
        width: 33%;
    }

    .page.listen .icon-headphones {
        margin: 0 auto 20px auto;
        background-size: contain;
        height: 120px;
        width: 120px;
    }

    .page .section.hero .container {
        padding-top: 10vh;
        padding-bottom: 10vh;
    }

    .page.listen .hero .description {
        font-size: 16px;
    }

    .form-listenwithfaramarz input[type=email] {
        width: 260px;
    }
}

/* Larger than desktop */
@media (min-width: 1000px) {

}

/* Larger than Desktop HD */
@media (min-width: 1200px) {}

/*
     FILE ARCHIVED ON 20:41:15 Jan 26, 2019 AND RETRIEVED FROM THE
     INTERNET ARCHIVE ON 02:47:50 Aug 08, 2019.
     JAVASCRIPT APPENDED BY WAYBACK MACHINE, COPYRIGHT INTERNET ARCHIVE.

     ALL OTHER CONTENT MAY ALSO BE PROTECTED BY COPYRIGHT (17 U.S.C.
     SECTION 108(a)(3)).
*/
/*
playback timings (ms):
  LoadShardBlock: 244.217 (3)
  esindex: 0.009
  captures_list: 286.53
  CDXLines.iter: 10.545 (3)
  PetaboxLoader3.datanode: 153.41 (5)
  exclusion.robots: 0.217
  exclusion.robots.policy: 0.185
  RedisCDXSource: 2.409
  PetaboxLoader3.resolve: 144.165 (2)
  load_resource: 313.462
*/