:root {
    /* COLOR */
    --xyz-grey: #c3c3c3;
    --xyz-beige: #f8f5f5;
    --xyz-purple: #821c7d;
    --xyz-green: #37822B;
    --xyz-lt-green: #e2ead3;
    --xyz-mid-green: #587619;
}

.honeycomb-container.* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    border: none;
}

.honeycomb-container {
    font-family: 'Lato', sans-serif;
    font-weight: 300;
    font-size: 16px;
    color: #000000;
    letter-spacing: 0em;
    line-height: 1.65;
}

.honeycomb-container h1,
.honeycomb-container .h1,
.honeycomb-container h2,
.honeycomb-container .h2,
.honeycomb-container h3,
.honeycomb-container .h3,
.honeycomb-container h4,
.honeycomb-container .h4,
.honeycomb-container h5,
.honeycomb-container .h5 {
    line-height: 1.33;
    margin-bottom: 2rem;
}

.honeycomb-container h1,
.honeycomb-container .h1 {
    font-weight: bold;
    font-size: 3.8125rem;
}

.honeycomb-container h2,
.honeycomb-container .h2 {
    font-weight: 100;
    font-size: 3.0625rem;
}

.honeycomb-container h3,
.honeycomb-container .h3 {
    font-weight: bold;
    font-size: 2.4375rem;
}

.honeycomb-container h4,
.honeycomb-container .h4 {
    font-weight: bold;
    font-size: 1.9375rem;
    letter-spacing: 0em;
}

.honeycomb-container h5,
.honeycomb-container .h5 {
    font-weight: 300;
    font-size: 1.5625rem;
    line-height: 1.65;
}

.honeycomb-container h6,
.honeycomb-container .h6 {
    font-style: 'Lato', sans-serif;
    font-weight: 300;
    font: 1.25rem;
    line-height: 1.65;
}

.honeycomb-container.company img {max-width: 100%;}

.honeycomb-container a {
    text-decoration: none;
}

.honeycomb-container nav ul {
    font-weight: bold;
    font-size: 0.875rem;
    color: #ffffff;
}

.honeycomb-container .intro-copy {
    color: var(--xyz-green);
    font-weight: normal;
    font-size: 1.25rem;
}

.honeycomb-container a.arrow-links,
.honeycomb-container a.arrow-links:visited,
.honeycomb-container a.arrow-links:link,
.honeycomb-container a,
.honeycomb-container a:visited,
.honeycomb-container a:link  {
    color: #000000;
    font-weight: 700;
    font-size: 1rem;
    text-transform: uppercase;
    margin-left: .5rem;
}

.honeycomb-container a.arrow-links:hover, .honeycomb-container a:hover {
    color: var(--xyz-purple);
     font-size: 1rem;
    text-transform: uppercase;
    margin-left: .5rem;
    text-decoration: none;
}

.xyz-honeycomb-override-angle {
    display: inline-block;
    margin: 4px 4px 0 10px;
    color: #821c7d;
    font-size: 1.2rem;
}

/*
.honeycomb-container a.arrow-links::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f105";
    margin-right: .5rem;
    color: var(--xyz-purple);
}

*/

/*
.honeycomb-container .quotes-purple::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f10d";
    font-size: 2.8125rem;
    color: var(--xyz-purple);
    line-height: 0.587;
    display: block;
    margin-top: 2rem;
}
*/

.xyz-honeycomb-override-purple-1 {
	font-size: 2.2rem;
	color:#821c7d;
	line-height:0.587;
	margin-top: 2rem;
	text-align:center;
}

/*
.honeycomb-container .quotes-green::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f10d";
    font-size: 2.8125rem;
    color: var(--xyz-green);
    line-height: 0.587;
    display: block;
    margin-top: 2rem;
    margin-bottom: 2rem;
}
*/
.xyz-honeycomb-override-green-1 {
	font-size: 2.2rem;
	color:#37822B;
	line-height:0.587;
	margin-top: 1rem;
	margin-bottom: 2rem;
	text-align:center;
}

.honeycomb-container .quotes {
    font-weight: bold;
    font-size: 1.9375rem;
    color: #000000;
}

.honeycomb-container .quotes-caption {
    font-weight: bold;
    color: #000000;
    text-transform: uppercase;
    line-height: 1.65;
}

.honeycomb-container .quotes-our-story {
    font-weight: normal;
    font-size: 1.25rem;
    line-height: 1.33;
}

.honeycomb-container a.button-green, .honeycomb-container a.button-purple {
    color: #ffffff;
    background-color: var(--xyz-green);
   padding: 1rem 2rem;
    margin-top: 2rem;
    text-align: center;
}

.honeycomb-container a.button-purple {
    background-color: var(--xyz-purple);
}

.honeycomb-container a:hover.button-green, .honeycomb-container a:hover.button-purple {
    color: #ffffff;
    background-color: var(--xyz-purple);
}

.honeycomb-container a.button-white, .honeycomb-container a.button-white:link, .honeycomb-container a.button-white:visited {
    background-color: #ffffff;
    color: #000000;
    margin-top: 2rem;
    padding: 1rem;
    text-align: center;
}

.honeycomb-container a.button-white:hover {
	background-color: #000000;
	color: #ffffff;
}

.honeycomb-container .flag-background {
    background-image: url("/assets/honeycomb/images/purple-flag.svg");
    background-position: top left;
    background-size: contain;
    background-repeat: no-repeat;
}

.honeycomb-container .all-access-pass-digital::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f109";
    font-size: 3.125rem;
    color: var(--xyz-purple);
}

.honeycomb-container .all-access-pass-digital-print::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f109 + f02d";
    font-size: 3.125rem;
    color: var(--xyz-purple);
}

.honeycomb-container .price {
    font-weight: bold;
    font-size: 1.9375rem;
    color: var(--xyz-mid-green);
}

.honeycomb-container .overline {
    font-weight: bold;
    color: var(--xyz-purple);
    line-height: 1.65;
    text-align: center;
}

.honeycomb-container .overline::before {
    content: "";
    display: block;
    width: 5.625rem;
    padding-bottom: 3px;
    border-top: thick solid #000000;
    position: relative;
    left: calc( 50% - 5.625rem/2 );
}

.honeycomb-container .overline2 {
    position: relative;
    flex-grow: 1;
    margin: 0;
}

.honeycomb-container .overline2:before {
   content: "";
   display: block;
  border-top: thick solid #000000;
   width: 5.625rem;
   height: 1px;
     padding-bottom: 3px;
    margin: 0 auto;
   position: absolute;
   top: 50%;
   z-index: 1;
 }
.honeycomb-container .overline2 span {
   background: #fff;
   left: 12%;
   padding: 0 15px;
   position: relative;
   z-index: 5;
 }


.honeycomb-container .value-props-our-story {
    font-weight: black;
    font-size: 2.4375rem;
    color: var(--xyz-green);
}

.xyz-justified {
  text-align: justify;
  text-justify: inter-word;
}

.honeycomb-container.benefits .xyz-purple-head {
	color: var(--xyz-purple);
    font-family: 'Lato', sans-serif;
    font-weight: 800;
    font-size: 2.4rem;
    letter-spacing: 0em;
    line-height: 1.65;

}

.honeycomb-container .benefits-quote-text,
.honeycomb-container .all-access-text {
    /* NOTE TO STEPHEN
    Copy in the all access boxes and to the right of "I wish more math classes would use this." */

    font-weight: normal;
    font-size: 1.5625rem;
    line-height: 1.33;
}

.honeycomb-container footer nav ul:first-child {
    font-weight: Regular;
    font-size: 1rem;
    color: #ffffff;
    line-height: 1.65;
}

.honeycomb-container footer a,
.honeycomb-container footer a:visited,
.honeycomb-container footer a:link {
    color: #ffffff;
}

.honeycomb-container footer nav a:hover {
    color: var(--xyz-green);
}

.honeycomb-container .bg-green {
    background-color: var(--xyz-green);
    color: #ffffff!important;
}

.honeycomb-container .bg-lt-green, .honeycomb-container.bg-lt-green {
    background-color: var(--xyz-lt-green);
    color: #000000;
}

.honeycomb-container .bg-beige {
    background-color: var(--xyz-beige);
    color: #000000;
}

.honeycomb-container .bg-white {
    background-color: #ffffff;
    color: #000000;
}

.honeycomb-container .green {
color: var(--xyz-green);
}

.honeycomb-container .purple {
color: var(--xyz-purple);
}

/* ======= NOTE TO STEPHEN  

The icon code for the value props on the our story page are as follows: 

https://fontawesome.com/search?m=free

<i class="fa-solid fa-display"></i>

<i class="fa-solid fa-video"></i>

<i class="fa-regular fa-thumbs-up"></i>

======= */

.honeycomb-container.homepage header.container-fluid {
background-image: url("/assets/honeycomb/images/math-icons.svg"), url("/assets/honeycomb/images/graph-paper.jpg");
background-repeat: no-repeat, repeat;
background-position: bottom right;  
background-size: 40%, 75%;      
min-height: 742px;
}


@media only screen and (max-width: 768px) {
.honeycomb-container.homepage header.container-fluid{
background-image: url("/assets/honeycomb/images/graph-paper.jpg");
background-repeat:  repeat;  
background-size: 100%;     
  }
}
.honeycomb-container section, section.container.homepage {
    padding: 5rem 0;
    min-height: 611px;
}

.honeycomb-container #cards > div, .honeycomb-container #quote-cards > div {
    margin-bottom: 2rem;
}

.honeycomb-container #cards > div > h4 {
    color: var(--xyz-green);
    font-weight: 700;
}


/* OVEARRIDE LEGACY STYLES */
.slider-area {
    background: #FFFFFF;
    padding-top: 0;
}