body { 
    background: #FAF7EF; 
    font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}

.row { padding: 144px 0;}

/* default  type */
h2 {font-family: "Inter", sans-serif; font-weight: 600; letter-spacing: -1px; line-height: 1em; font-size:2.5em; color:#2a2a2a; margin-bottom: 8px; text-align: center; }
h3 {font-family: "Inter", sans-serif; font-weight: 600; letter-spacing: -1px; font-size:2.25em; color:#2a2a2a; margin-bottom:0px; }
h4 { font-family: "Inter", sans-serif; font-weight: 500; letter-spacing: -0.5px; font-size:1.5em; color:#355C63; text-align: center; margin-bottom:40px; font-style: italic;  }
h5 { font-family: "Inter", sans-serif; font-weight: 700; letter-spacing: -0.5px; font-size:1.1em; color:#2a2a2a; margin-bottom: 16px; }
p { font-family: "Inter", sans-serif; color:#2a2a2a;  font-size: 1em; }

#header { margin:0; background-image: url(../img/hero.jpg); background-position: bottom center;  background-size: cover; padding-bottom:30%; padding-top:0; }
#triangle { margin:0 auto 48px auto; padding-top:24px;  background-image: url(../img/triangle.svg); background-size: contain; background-repeat: no-repeat; background-position: top center; }

h1 { width:120px; margin:0 auto; }
#triangle h3 { margin:0; font-size: .8em; display: block; padding:18px 0 72px 0; text-align: center; color:#999; }
#header h2 { font-size:2.5em; text-align: center; font-style: italic; color:#355C63;  }
h4 em { border-bottom: 2px solid #D9B166; }

#weed { background-image: url(../img/weed.svg); background-position: bottom center; background-repeat: no-repeat; }
#root { background-image: url(../img/root.svg); background-position: top center; background-repeat: no-repeat; }

#jake-intro { background: url(../img/jake.png) bottom center no-repeat; border-bottom: 1px solid #2a2a2a;  }
.round { border-radius: 100%;}

.gold { background: #D9B166; }

ul {
  list-style-image: url('../img/check.svg');
}
ul li { margin-bottom: 8px; font-size: 1em; }

.intro { margin: 0 5% 48px 5%; text-align: center; }

.item { text-align: center; }
.item h5 { margin-bottom: 8px; }
.item p { font-size: .8em; }

.icon { height:90px; width:90px; background:#355C63;  border-radius: 100%; margin:0 auto 16px auto; padding:24px; text-align: center;}
.icon img { }

p.value { color:#D9B166; font-size: 1em; font-weight: 700;}

#what { text-align: center; }
h4.price { margin-bottom:8px;}
#what .button { margin-right:0;}
#price { margin: 32px auto 0 auto; }

#quotes { margin-top:48px; }
.quote { font-size: .8em; text-align: left;}

#footer { background:#355C63; text-align: center;}
#footer p {font-size:.8em; color:#FAF7EF;}

.cta { padding:auto 0; width: 100%; text-align: center; }
.cta p { padding:3%; font-size: 1em; }
.cta a { color: #2a2a2a; border-bottom: 1px solid #2a2a2a; font-weight: 500; }
a.button { color:#fff; background:#2a2a2a; margin-right:24px; margin-top: 12px;  border-radius: 100px; padding:12px 20px; font-size: 1.2em; font-weight: 700;}
a.button:hover { background:#000; }

#how .cta, #what .cta { display: block; margin-top:24px;  }

#register { background:#fff; }
#register iframe {margin:0 auto;}

svg { color:#D9B166; }

.grid-container.fluid {margin:0; padding:0; }

.small-12 { margin:0 12px; }

/* mobile styles */
@media screen and (max-width: 40em) {
    .row { margin: 0 !important; padding: 72px 16px 72px 0; }
    h2 { font-size: 2.2em; }
    #header { width:100%; padding-bottom:40%; }
    #header h2 { color:#fff; }
    #triangle { margin:0 0 32px 0; }
    h4 { font-size: 1.2em; }
}

@media screen and (min-width: 600px)  {
        .mobile-break { display: none; }
    }