@charset "utf-8";

:root {
    scroll-behavior: auto;
}

.js-loading *,
.js-loading *:before,
.js-loading *:after {
  animation-play-state: paused !important;
}


/* CSS Document */

/*
Regular
font-family:"linotype-sabon", sans-serif;
font-weight:400;
font-style:normal;

Italic
font-family:"linotype-sabon", sans-serif;
font-weight:400;
font-style:italic;

Bold
font-family:"linotype-sabon", sans-serif;
font-weight:700;
font-style:normal;

Bold Italic
font-family:"linotype-sabon", sans-serif;
font-weight:700;
font-style:italic;

*/

html {-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; font-family:"linotype-sabon", sans-serif; font-weight:400; font-size:15px;}
*, *:before, *:after {-webkit-box-sizing:inherit; -moz-box-sizing:inherit; box-sizing:inherit;}

body, html {min-height:100%; width:100%; margin:0; -webkit-font-smoothing:antialiased; text-rendering: optimizeLegibility; -moz-osx-font-smoothing: grayscale;}
body {background:#150000; font-family:"linotype-sabon", sans-serif; font-weight:400; position:relative; min-height:100vh;}
body, p, h1, h2, h3 {margin:0; padding:0;}

#holder {position:relative; z-index:1; overflow-x:hidden; width:100%;}

#page {position:relative; z-index:1; overflow:hidden; width:100%; max-width:3008px; margin:0 auto; min-height:752px; background:url("../images/homepage/bigtree_homepage_320-480.webp") top center no-repeat; background-size:auto 752px; padding:0 0 150px 0;
transition: opacity 0.3s;
opacity: 1;
}
.js-loading #page {opacity:0;}
.js-loading #stars {opacity:0;}
.js-loading #paths_holder {opacity:0;}

.no-webp #page {background-image: url("../images/homepage/bigtree_homepage_320-480.jpg");}

#top_bar {position:fixed; top:0; left:0; right:0; z-index:999; background-color:transparent;

    -webkit-transition: background-color 500ms linear;
    -ms-transition: background-color 500ms linear;
    transition: background-color 500ms linear;
}

#top_bar.sticky {}

#nav_holder {max-width:1150px; margin:0 auto; display:none; position:fixed; top:0; bottom:0; left:0; right:0; background-color:#fff; padding:85px 10px 10px 10px;}

body.nav_opened #nav_holder {overflow-y:auto;}

body.nav_opened #nav_holder {
  scrollbar-color: #999 rgba(0, 0, 0, 0);
  scrollbar-width: thin;
}
body.nav_opened #nav_holder::-webkit-scrollbar {
  width:10px;
}

body.nav_opened #nav_holder::-webkit-scrollbar-track {
  background: rgba(0, 0, 0, 0);
}
body.nav_opened #nav_holder::-webkit-scrollbar-thumb {  
    background-color:#999;
    border:3px solid transparent;
    border-radius: 9px;
    background-clip:content-box;
}


#top_nav {}
#top_nav ul {list-style:none; margin:0; padding:0; text-align:center;}
#top_nav ul li {display:block;margin:0; padding:0 0 6px 0;}
#top_nav ul li a {display:block; font-family:"linotype-sabon", sans-serif; font-weight:700; text-decoration:none; font-size:24px; line-height:1.15; letter-spacing:0.35px; color:#676767; text-align:center;}
#top_nav ul li a:hover {text-decoration:underline;}

#top_nav ul #nav_home a {color:#fcb517;}

#top_nav ul li a:after {content:" "; display:block; width:39px; height:39px; margin:0 auto;}

#nav_home a:after {background: url("../images/homepage/leaf1.png") center center no-repeat; background-size:contain;}
#nav_background a:after {background: url("../images/homepage/leaf2.png") center center no-repeat; background-size:contain;}
#nav_spielberg-meledandri a:after {background: url("../images/homepage/leaf3.png") center center no-repeat; background-size:contain;}
#nav_merwin-louise a:after {background: url("../images/homepage/leaf4.png") center center no-repeat; background-size:contain;}
#nav_science a:after {background: url("../images/homepage/leaf5.png") center center no-repeat; background-size:contain;}
#nav_inspirations a:after {background: url("../images/homepage/leaf1.png") center center no-repeat; background-size:contain; -webkit-transform: scaleX(-1); transform: scaleX(-1);}
#nav_audiobook a:after {background: url("../images/homepage/leaf6.png") center center no-repeat; background-size:contain;}
#nav_more a:after {display:none;}

#nav_close {display:block; width:44px; position:fixed; right:22px; top:22px; z-index:999999; outline:none; border:none; cursor:pointer; background-color:transparent; padding:0;}
#nav_close img {width:100%; heiught:auto;}

#nav_open {display:block; width:48px; height:38px; position:absolute; right:18px; top:30px; line-height:38px; z-index:999999; outline:none; border:none; background-color:transparent; cursor:pointer;}

body.nav_opened #nav_open {display:none;}


#nav_open span {display:block; width:48px; height:6px; background:#fff; position:absolute; left:0; top:16px;}
#nav_open:before {
content: "";
position: absolute;
left:0;
top:0;
width:48px;
height:6px;
background:#fff;
}
#nav_open:after {
content: "";
position: absolute;
left:0;
bottom:0;
width:48px;
height:6px;
background:#fff;
}


/* Start Stars */
#stars {height:200px; position:absolute; overflow:hidden; width:800vw; left:0; top:0;}

.star {
  box-shadow: 0px 0px 2px 2px rgba(255, 255, 255, 0.4);
  position: absolute;
  width: 2px;
  height: 2px;
  border-radius: 2px;
  background-color: white;
}
/* End Stars */

.page_section {position:relative; z-index:1;}
.page_content {position:relative; z-index:1; max-width:1024px; padding:0 20px; margin:0 auto;}

#grammy_nom {
display:none;
position:absolute;
top: 85px;
left: 0;
right: 0;
margin: auto;
text-align: center;
color: #eee059;
font-size: 17px;
line-height: 24px;
font-weight: 700;
max-width: 90%;
}

#grammy_nom a {color:#eee059;}

#nytimes_named {
display:none;
position: absolute;
top: 85px;
left: 0;
right: 0;
margin: auto;
text-align: center;
color: #eee059;
font-size: 17px;
line-height: 24px;
font-weight: 700;
max-width: 90%;  
}

#nytimes_named a {color:#eee059;}


  
  

#page_hero {height:420px; position:relative;}
#page_hero .page_content {height:420px; position:relative; max-width:1524px; padding:0;}


#hero_title {position:absolute; top:170px; width:295px; left:50%; transform:translateX(-50%); opacity:0;}
#hero_title img {display:block; width:100%; height:auto;}
#hero_title #title1 {position:absolute; left:0; right:0; top:0; bottom:0;}

.fade-in-text1 {  
    animation:fadeIn 3s 1;
    -webkit-animation:fadeIn 3s 1;
    animation-fill-mode: forwards;
    animation-delay:4.5s;
    -webkit-animation-delay:4.5s; 
    -webkit-animation-fill-mode: forwards;
}

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



:root {
    --slide-sprite: -4595px;
}

#hero_sprout {
  height:91px;
  width:102px;
  background: url("../images/homepage/sprout_sprite_strip_new.png");
  background-size:auto 91px;
  animation: sprite 4s steps(45) 1, sprite2 20s steps(3) infinite;
  background-position: 0 0;
  -webkit-animation-fill-mode: forwards, forwards;
  animation-fill-mode: forwards, forwards;
  animation-delay:1s, 8s;
  -webkit-animation-delay:1s, 8s; 
  position:absolute;
  bottom:78px;
  left:50%;
  transform:translateX(-40%);
}

@keyframes sprite {
  to { background-position:var(--slide-sprite) 0;}
}

@keyframes sprite2 { 
  0% {background-position:-4595px 0;}
  3% {background-position:-4289px 0;}
  50% {background-position:-4289px 0;}
  53% {background-position:-4595px 0;} 
}


#hero_name {position:absolute; bottom:18px; width:248px; left:50%; transform:translateX(-49.5%);}
#hero_name img {width:100%; height:auto;}

#page_bottom {}
#page_bottom .page_content {max-width:420px;}

#bottom_text {padding:20px 0 0 0}
#bottom_text p {
font-family:"linotype-sabon", sans-serif;
font-size:18px;
font-weight:700;
line-height: 1.56;
/*! letter-spacing: 0.26px; */
color:#fff;
margin:0 0 20px 0;
text-align: justify;
}

.firstcharacter {
float:left;
font-size:60px;
line-height:54px;
margin-top:2px;
padding-right:8px;
}

#bottom_text p a {color:#fff; text-decoration:underline;}

#bottom_messengers {width:220px; margin:0 auto; position:absolute; bottom:0; z-index:1;
  left: 50%;
  transform: translateX(-50%);
transition: opacity 0.3s;
opacity: 1;
}
.js-loading #bottom_messengers {opacity:0;}

#mt_credit {position:absolute; bottom:8px; right: 18px; padding: 20px; color: #fff; font-style: italic; font-size: 18px; display: none;}
#mt_credit a {color: #fff;}
#mt_credit a:hover {color: #fcb517; }

#mt_credit_mobile {margin: 50px auto 0; font-style: italic; font-size: 14px; color: #fff; text-align: center;}
#mt_credit_mobile a {color: #fff;}
#mt_credit_mobile a:hover {color: #fcb517; }

body.nav_opened #bottom_messengers {z-index:0;}
#bottom_messengers img {width:100%; height:auto;}

/* Media Queries */
@media only screen and (min-width: 480px) {

#page {min-height:812px; background:url("../images/homepage/bigtree_homepage_480-960.webp") top center no-repeat; background-size:auto 812px;}
.no-webp #page {background-image: url("../images/homepage/bigtree_homepage_480-960.jpg");}

#stars {height:300px;}

#page_hero {height:505px; position:relative;}
#page_hero .page_content {height:505px; position:relative;}

#grammy_nom {position:absolute; top:90px;}
#nytimes_named {position:absolute; top:90px;} 

#hero_title {top:144px; width:448px;}
#hero_sprout {bottom:108px;}
#hero_name { bottom:40px; width:314px;}

#page_bottom .page_content {}

}

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

}

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

#hero_title {top:140px; width:560px;}
#mt_credit {display: block; font-size: 14px;}
#mt_credit_mobile {display: none;}
}

@media only screen and (min-width: 720px) {
#mt_credit {font-size: 16px;}
}

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



#hero_title {top:100px; width:672px;}

}

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

/* #top_nav ul li a {font-size:16px;}*/

}



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

#page {min-height:1028px; background:url("../images/homepage/bigtree_homepage_960-1080.webp") top center no-repeat; background-size:auto 1028px;  padding:0 0 250px 0;}
.no-webp #page {background-image: url("../images/homepage/bigtree_homepage_960-1080.jpg");}

#mt_credit {display: block; font-size: 18px;}

#stars {height:440px;}

#page_hero {height:640px; position:relative;}
#page_hero .page_content {height:640px; position:relative;}
#hero_title {top:144px; width:910px;}
#hero_name {bottom:0; width:414px;}

#grammy_nom {position: absolute;
  top: 100px;
  font-size: 21px;
  line-height: 21px;
}

#nytimes_named {position: absolute;
  top: 100px;
  font-size: 21px;
  line-height: 21px;
} 
  
  
#hero_sprout {bottom:81.75px;}

#bottom_text {padding:50px 0 0 0}

#bottom_text p {
font-size:21px;
line-height:1.5;
margin:0 0 20px 0;
}

.firstcharacter {
font-size:80px;
line-height:60px;
margin-top:3px;
padding-right:8px;    
}

#page_bottom .page_content {max-width:600px;}  
  
#bottom_messengers {width:342px;}



}

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

}

@media only screen and (min-width: 1044px) {
#top_nav ul li a {font-size:17px;}
}


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

#page {min-height:1410px; background:url("../images/homepage/bigtree_homepage.webp") top center no-repeat; background-size:auto 1410px; padding:0 0 250px 0;}
.no-webp #page {background-image: url("../images/homepage/bigtree_homepage.jpg");}

#stars {height:600px; width:100%;}

#page_hero {height:900px; position:relative;}
#page_hero .page_content {height:900px; position:relative;}

#hero_title {top:230px; width:1020px;}
#hero_name {bottom:32px; width:512px;}

#grammy_nom {position: absolute;
  top: 150px;
  font-size: 24px;
  line-height: 21px;
} 

#nytimes_named {position: absolute;
  top: 150px;
  font-size: 24px;
  line-height: 21px;
}
    
  
:root {
    --slide-sprite: -6660px;
}

@keyframes sprite2 { 
  0% {background-position:-6660px 0;}
  3% {background-position:-6216px 0;}
  50% {background-position:-6216px 0;}
  53% {background-position:-6660px 0;} 
}

#hero_sprout {
  height: 132px;
  width: 148px;
  background-size:6808px 132px;
  bottom:123px;
  left:50%;
  transform:translateX(-40%);
}

#page_bottom .page_content {max-width:760px;}

#bottom_text {padding:50px 0 0 0}

#bottom_text p {
font-size:32px;
line-height:1.48;
margin:0 0 20px 0;
}

.firstcharacter {
font-size:96px;
line-height:86px;
margin-top:8px;
padding-right:14px;    
}

#bottom_messengers {width:342px;}


@media (max-height:899px) {

#page {background-position:center -100px;}
#page_hero {height:800px;}
#page_hero .page_content {height:800px;}
#hero_name {bottom:48px;}

}

  
  
}



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

#top_bar {height:80px;}
#top_bar.sticky {background-color:#242424;}

#nav_holder {height:80px; display:block; max-width:1150px; margin:0 auto; position:relative; top:0; bottom:auto; left:0; right:auto; background-color:transparent; padding:0;}
#top_nav {}
#top_nav ul {height:80px; display:flex; justify-content:center;}
#top_nav ul li {display:inline-flex; height:80px; margin:0; padding:0;}
#top_nav ul li a {height:80px; font-size:16px; line-height:80px; letter-spacing:0.24px; color:#fff; padding:0px 15px; position:relative; }
#top_nav ul li a:after {width:22px; height:22px; margin:0; position:absolute; right:-11px; top:27px;}

#top_nav ul #nav_home a {color:#fff;}
#top_nav ul #nav_audiobook a {}
#nav_home span {display:none;}

#nav_more {padding-right:0;}

body.nav_opened #nav_holder {overflow-y:hidden;}

#nav_open {display:none;}
#nav_close {display:none;}


}







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

#nav_holder {max-width:1220px;}

#top_nav ul li a {font-size:17px;}


#hero_title {top:220px; width:1120px;}

#grammy_nom {position: absolute;
  top: 140px;
  font-size: 27px;
}
#nytimes_named {position: absolute;
  top: 140px;
  font-size: 27px;
}

}

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



#top_nav ul li a {font-size:17.75px; letter-spacing:0px; padding:0 20px 0 20px;}
#top_nav ul li a:after {width:30px; height:30px; margin:0; position:absolute; right:-13px; top:21px;}





}

@media only screen and (min-width: 1320px) {
#page_bottom .page_content {max-width:960px;}

#nav_holder {max-width:1320px;}
#top_nav ul li a {font-size:19px; letter-spacing:0px; padding:0 22px 0 22px;}

}

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

#hero_title {top:180px; width:1520px;}

#grammy_nom {position: absolute;
  top: 100px;
  font-size: 26px;
}
#nytimes_named {position: absolute;
  top: 100px;
  font-size: 26px;
}

#nav_holder {max-width:1550px;}
#top_nav ul li a {font-size:22.25px; letter-spacing:0px; padding:0 26.5px 0 26.5px;}
#top_nav ul li a:after {width:35px; height:35px; margin:0; position:absolute; right:-17px; top:19px;}
  
}

@media only screen and (min-width: 1720px) {  
#page {background-position:center top;}
#page_hero {height:900px;}
#page_hero .page_content {height:900px;}
#hero_name {bottom:32px;}
#nav_holder {max-width:1680px;}
#top_nav ul li a {
        font-size: 24px;
        letter-spacing: 0px;
        padding: 0 30px 0 30px;
    
    }
#top_nav ul li a:after {width:39px; height:39px; margin:0; position:absolute; right:-20px; top:19px;}

}

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

}

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

#page {min-height:1692px; background:url("../images/homepage/bigtree_homepage.webp") top center no-repeat; background-size:auto 1692px;}
.no-webp #page {background-image: url("../images/homepage/bigtree_homepage.jpg");}

#page_hero {height:1080px; position:relative;}
#page_hero .page_content {height:1080px; position:relative;}

#hero_sprout {bottom:147px;}
  
#nav_holder {max-width:2080px;}
#top_nav ul li a {
        font-size: 28px;
        letter-spacing: 0px;
        padding: 0 36px 0 36px;
    
    }  

}