
:root {
    --dark-green: #173C45;
    --orange: #EE9022;
    --dark-grey: #404040;

}

/* ----- General ----- */
::selection {
background: var(--dark-green) !important;
color:white;
}

/* General Utilities */
.hover {
	-webkit-transition:all .3s ease;
	-o-transition:all .3s ease;
	transition:all .3s ease;
}
.hidden {
    display:none !important;
}
.invisible {
    opacity:0;
}
.divider {
    display:block;
    height:2px;
    background-color:var(--dark-grey);
    width:100%;
    float:left;
}
.mobile {
    display:none !important;
}
@media(max-width:768px) {
    .mobile {
        display:inherit !important;
    }
}

html {
    font-family: "Open Sans", sans-serif;
    -ms-text-size-adjust:100%;
    -webkit-text-size-adjust:100%;
    height:100%;
    line-height:0;
}
body, div {
    font-family: "Open Sans", sans-serif;
}




/* --- Headings --- */
.display-2xl {
    font-size:4.5rem !important;
    /* font size:72px */
    line-height:5rem !important;
}
.display-xl {
    font-size:3.25rem !important;
    /* font size:60px */
    line-height:4rem !important;
    font-weight:700;
}
.display-lg {
    font-size:2.5rem !important;
    /* font size:48px */
    line-height:3rem !important;
    font-weight:700;
}
.display-md {
    font-size:2.25rem !important;
    /* font size:36px */
    line-height:2.75rem !important;
    font-weight:700;
}
.display-sm {
    font-size:1.875rem !important;
    /* font size:30px */
    line-height:2.375rem !important;
}
.display-xs {
    font-size:1.5rem !important;
    /* font size:24px */
    line-height:2rem !important;
}

.underline {
    text-decoration:underline;
    -webkit-text-decoration-color:var(--orange);
            text-decoration-color:var(--orange);
    text-underline-offset:5px;
    text-decoration-thickness:2px !important;
}
.underline:hover {
    text-decoration:underline !important;
    -webkit-text-decoration-color:var(--dark-green) !important;
    text-decoration-color:var(--dark-green) !important;
    text-underline-offset:5px;
    text-decoration-thickness:2px !important;
}
a {-webkit-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;}
p a {
    text-underline-offset:1px;
    text-decoration-thickness:2px;
    -webkit-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
}
p a:hover,
div a:hover {
    color:var(--orange);
}

@media(max-width:768px) {
    /* --- Headings --- */
    .display-2xl {
        font-size:3.25rem !important;
        line-height:3.5rem !important;
    }
    .display-xl {
        font-size:2.5rem !important;
        line-height:3.15rem !important;
    }
    .display-lg {
        font-size:2rem !important;
        line-height:2.5rem !important;
    }
    .display-md {
        font-size:1.75rem !important;
        line-height:2.25rem !important;
    }
    .display-sm {
        font-size:1.5rem !important;
        /* font size:30px */
        line-height:2rem !important;
    }
    .display-xs {
        font-size:1.375rem !important;
        /* font size:24px */
        line-height:1.75rem !important;
    }
}

/* --- Body Text --- */
.text-2xl {
    font-size:1.375rem !important;
    /* font size:20px */
    line-height:1.5 !important;
}
.text-xl {
    font-size:1.2rem !important;
    /* font size:20px */
    line-height:1.6 !important;
}
.text-rg {
    font-size:1.1rem !important;
    /* font size:20px */
    line-height:1.8 !important;
}
.text-lg {
    font-size:1rem !important;
    /* font size:18px */
    line-height:1.8 !important;
}

.text-md {
    font-size:0.925rem !important;
    /* font size:16px */
    line-height:1.54rem !important;
}
.text-sm {
    font-size:0.9rem !important;
    /* font size:14px */
    line-height:1.65rem !important;
}
.text-xs {
    font-size:0.75rem !important;
    /* font size:12px */
    line-height:1.5rem !important;
}

@media(max-width:768px) {
    /* --- Body Text --- */
    .text-2xl {
        font-size:1.125rem !important;
        /* font size:20px */
        line-height:1.5 !important;
    }
    .text-xl {
        font-size:1.05rem !important;
        /* font size:20px */
        line-height:1.65 !important;
    }
    .text-lg {
        font-size:1.125rem !important;
        /* font size:18px */
        line-height:1.65 !important;
    }
    .text-md {
        font-size:1rem !important;
        /* font size:16px */
        line-height:1.65rem !important;
    }
    .text-sm {
        font-size:1rem !important;
        /* font size:14px */
        line-height:1.5rem !important;
    }
    .text-xs {
        font-size:0.85rem !important;
        /* font size:12px */
        line-height:1.5rem !important;
    }
}

/* --- Text Styles --- */

.no-margin {
    margin-bottom:0 !important;
}
.pre-subheading {
    color:var(--cobalt);
    font-weight:600;
    font-size:15px;
    margin-bottom:10px;
}

.weight-light,
.light {
    font-weight:300;
}
.weight-regular,
.regular {
    font-weight:400;
}
.weight-medium,
.medium {
    font-weight:500;
}
.weight-semibold,
.semibold {
    font-weight:600;
}
.weight-bold,
strong,
.bold {
    font-weight:700;
}
.weight-black {
	font-weight:800;
}
.text-left {
    text-align:left;
}
.text-right {
    text-align:right;
}
.text-center {
    text-align:center;
}

/* Lists */
.post-body ul {
    padding-left:22px;
    float:left;
    margin:0;
    width:100%;
    margin-bottom:12px;
    list-style-type:disc;
}
.post-body ol {
    float:left;
    margin:0;
    width:100%;
}
.post-body ul li, .post-body ol li {
    font-size:1rem;
    line-height:1.54rem;
    margin-bottom:8px;
}
.post-body ul li::marker,
.post-body ol li::marker {
    color:var(--orange);
    font-weight:700;
}
.post-body ul li:last-child,
.post-body ol li:last-child {
    margin-bottom:0;
}
@media(max-width:768px) {
    .post-body ul {
        padding-left:18px;
    }
}

/* --- Brand Colors --- */
.dark-grey {color:var(--dark-grey)};
.bg-dark-grey {background-color:var(--dark-grey)};
.white {color:white;}



/* ----- Containers ----- */

.container-outer {
    text-align:center;
    display:inline-block;
    width:100%;
}
.container-inner {
    display:inline-block;
    max-width:90%;
    width:1310px;
    float:none;
    margin-left:auto;
    margin-right:auto;
}
.container-inner_small {
    display:inline-block;
    max-width:95%;
    width:1200px;
    float:none;
    margin-left:auto;
    margin-right:auto;
}
.container-inner__rounded {
    border-radius:15px;
    overflow:hidden;
}
.block {
    display:block;
    float:left;
}




/* --- Flexbox --- */
.width-100 {
    width:100% !important;
}
.flex {
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
    width:100%;
    max-width:100%;
}
.inline-flex {
	display:-webkit-inline-box;
	display:-ms-inline-flexbox;
	display:inline-flex;
}
.flex-row {
	-webkit-box-orient:horizontal;
	-webkit-box-direction:normal;
	    -ms-flex-direction:row;
	        flex-direction:row;
}
.flex-row-reverse {
	-webkit-box-orient:horizontal;
	-webkit-box-direction:reverse;
	    -ms-flex-direction:row-reverse;
	        flex-direction:row-reverse;
}
.flex-column {
	-webkit-box-orient:vertical;
	-webkit-box-direction:normal;
	    -ms-flex-direction:column;
	        flex-direction:column;
}
.flex-column-reverse {
	-webkit-box-orient:vertical;
	-webkit-box-direction:reverse;
	    -ms-flex-direction:column-reverse;
	        flex-direction:column-reverse;
}
.flex-start {
	-webkit-box-align:start;
	    -ms-flex-align:start;
	        align-items:flex-start;
}
.flex-center {
	-webkit-box-align:center;
	    -ms-flex-align:center;
	        align-items:center;
}
.flex-end {
	-webkit-box-align:end;
	    -ms-flex-align:end;
	        align-items:flex-end;
}
.flex-distribute {
	-webkit-box-pack:justify;
	    -ms-flex-pack:justify;
	        justify-content:space-between;
}

/* Containers */
.container,
.container-1300,
.container-900 {
    max-width:calc(100% - 32px)
}
.container-1300 {width:1400px;}
.container-900 {width:900px;}

@media(max-width:810px) {
    .container-1300 {
        padding-left:5vw !important;
        padding-right:5vw !important;
        border-radius:0;
        max-width:100vw;
        width:100vw;
    }
    .container-900 {
        width:100%;
    }
}

/* --- Grid --- */
.grid-2 {
    display:-ms-grid;
    display:grid;
    -ms-grid-columns:1fr 16px 1fr;
    grid-template-columns:1fr 1fr;
    -ms-grid-rows:auto;
    grid-template-rows:auto;
    -webkit-column-gap:16px;
       -moz-column-gap:16px;
            column-gap:16px;
    row-gap:16px;
    clear:both;
}
.grid-2 > *:nth-child(1) {
	-ms-grid-row: 1;
	-ms-grid-column: 1;
}
.grid-2 > *:nth-child(2) {
	-ms-grid-row: 1;
	-ms-grid-column: 3;
}
.grid-3 {
    display:-ms-grid;
    display:grid;
    -ms-grid-columns:1fr 16px 1fr 16px 1fr;
    grid-template-columns:1fr 1fr 1fr;
    -ms-grid-rows:auto;
    grid-template-rows:auto;
    -webkit-column-gap:16px;
       -moz-column-gap:16px;
            column-gap:16px;
    row-gap:16px;
    clear:both;
}
.grid-3 > *:nth-child(1) {
	-ms-grid-row: 1;
	-ms-grid-column: 1;
}
.grid-3 > *:nth-child(2) {
	-ms-grid-row: 1;
	-ms-grid-column: 3;
}
.grid-3 > *:nth-child(3) {
	-ms-grid-row: 1;
	-ms-grid-column: 5;
}

.grid-4 {
    display:grid;
    grid-template-columns:1fr 1fr 1fr 1fr;
}
@media(max-width:1200px) {
    .grid-3 {
        -ms-grid-columns:1fr 1fr;
        grid-template-columns:1fr 1fr;
    }
}
@media(max-width:768px) {
    .grid-2,
    .grid-3 {
        -ms-grid-columns:1fr;
        grid-template-columns:1fr;
        row-gap:8px;
    }
}
.inline-grid {display:inline-grid;}

.grid-3 .post-card {min-width:100%;}

/* Gap */
.gap-y-4 {
    row-gap:12px;
}


.post-card p,
.post-card h3 {
margin:0;
}

/***** Spacing *****/

.pt-4 {padding-top:4px;}
.pt-8 {padding-top:8px;}
.pt-12 {padding-top:12px;}
.pt-16 {padding-top:16px;}
.pt-24 {padding-top:24px;}
.pt-32 {padding-top:32px;}
.pt-48 {padding-top:48px;}
.pt-64 {padding-top:64px;}
.pt-96 {padding-top:96px;}
.pt-128 {padding-top:128px;}

.pb-4 {padding-bottom:4px;}
.pb-8 {padding-bottom:8px;}
.pb-12 {padding-bottom:12px;}
.pb-16 {padding-bottom:16px;}
.pb-24 {padding-bottom:24px;}
.pb-32 {padding-bottom:32px;}
.pb-48 {padding-bottom:48px;}
.pb-64 {padding-bottom:64px;}
.pb-96 {padding-bottom:96px;}
.pb-128 {padding-bottom:128px;}

.mb-4 {margin-bottom:4px !important;}
.mb-8 {margin-bottom:8px !important;}
.mb-12 {margin-bottom:12px !important;}
.mb-16 {margin-bottom:16px !important;}
.mb-24 {margin-bottom:24px !important;}
.mb-32 {margin-bottom:32px !important;}
.mb-48 {margin-bottom:48px !important;}
.mb-64 {margin-bottom:64px !important;}
.mb-96 {margin-bottom:96px !important;}
.mb-128 {margin-bottom:128px !important;}

.mt-4 {margin-top:4px !important;}
.mt-8 {margin-top:8px !important;}
.mt-12 {margin-top:12px !important;}
.mt-16 {margin-top:16px !important;}
.mt-24 {margin-top:24px !important;}
.mt-32 {margin-top:32px !important;}
.mt-48 {margin-top:48px !important;}
.mt-64 {margin-top:64px !important;}
.mt-96 {margin-top:96px !important;}
.mt-128 {margin-top:128px !important;}

/* Spacing */
.row-gap-8 {row-gap:8px;}
.column-gap-8 {column-gap:8px;}
.row-gap-16 {row-gap:16px;}
.column-gap-16 {column-gap:16px;}
.grid-gap-16 {grid-gap:16px;}
.row-gap-24 {row-gap:24px;}
.column-gap-24 {column-gap:24px;}
.grid-gap-24 {row-gap:24px;column-gap:24px;}
.row-gap-32 {row-gap:32px;}
.column-gap-32 {column-gap:32px;}
.grid-gap-32 {row-gap:32px;column-gap:32px;}
.row-gap-48 {row-gap:48px;}
.column-gap-48 {column-gap:48px;}
.row-gap-64 {row-gap:64px;}
.column-gap-64 {column-gap:64px;}
.column-gap-96 {column-gap:96px;}

@media(max-width:767px) {
    .mt-12 {margin-top:8px !important;}
    .mt-16 {margin-top:12px !important;}
    .mt-24 {margin-top:16px !important;}
    .mt-32 {margin-top:24px !important;}
    .mt-48 {margin-top:32px !important;}
    .mt-64 {margin-top:48px !important;}
    .mt-96 {margin-top:64px !important;}
    .mt-128 {margin-top:96px !important;}


    .row-gap-8 {row-gap:4px;}
    .column-gap-8 {column-gap:4px;}
    .row-gap-16 {row-gap:8px;}
    .column-gap-16 {column-gap:8px;}
    .grid-gap-16 {grid-gap:8px;}
    .row-gap-24 {row-gap:16px;}
    .column-gap-24 {column-gap:16px;row-gap:16px;}
    .grid-gap-24 {row-gap:16px;column-gap:16px;}
    .row-gap-32 {row-gap:24px;}
    .column-gap-32 {column-gap:24px;}
    .grid-gap-32 {row-gap:24px;column-gap:24px;}
    .row-gap-48 {row-gap:32px;}
    .column-gap-48 {column-gap:32px;}
    .row-gap-64 {row-gap:48px;}
    .column-gap-64 {column-gap:48px;}
    .column-gap-96 {column-gap:64px;}
}




.post-card {
    padding:24px;
    text-decoration:none;
    border:2px solid rgba(64,64,64,0.1);
    border-radius:1rem;
    position:relative;
}

.post-card.featured {
    /*border:2px solid rgba(238,144,34,0.5);*/
}

.post-card:hover {
    border:2px solid var(--orange);
}
.post-card * {text-decoration:none;}

.post-card h3 span {font-weight:400;}

.post-card .video-tag {
    border-radius:100px;
    padding:0px 6px;
    background-color:white;
    position:absolute;
    top:32px;
    left:32px;
    column-gap:4px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
}

.post-card .video-tag svg {fill:var(--orange)}

.post-card .post-thumbnail {
    width: 100%;
    aspect-ratio: 16/9;
    object-fit: cover;
    border-radius: 8px;
    overflow: hidden;
}

.orange {
    color: var(--orange)
}

.dark-green {
    color: var(--dark-green)
}

.pt-72 {
    padding-top: 72px;
}

.mt-72 {
    margin-top: 72px;
}

.post-card .text-2xl {font-size:24px !important}
.post-card .text-xl {font-size:19px !important;}
.post-card .text-lg {font-size:17px !important;}

.read-more {
    display:inline-flex;
    flex-direction:row;
    align-items:center;
    justify-content:space-between;
    column-gap:8px;
}
.read-more p {
    font-weight:700;
    font-size:16px;
}
.read-more img {
    margin-top:2px;
}


.placeholder {
    width: 100%;
    aspect-ratio: 16/9;
    background-color: #f7f7f7;
    border-radius: 8px;
}

.post-card.featured {
    display: flex;
    flex-direction: row;
    align-items: center;
    column-gap: 32px;
}

.post-card.featured .post-thumbnail {
    width: 400px;
}

@media(max-width:800px) {

    .post-card {
        padding:16px;
    }
    .post-card.featured {
        flex-direction: column;
        row-gap:12px;
    }
    .post-card.featured .post-thumbnail {
        width: 100%;
    }
    .post-card .display-sm {
        font-size:22px !important;
    }
    .post-card .text-2xl {font-size:22px !important}
    .post-card .text-xl {font-size:16px !important;}
    .post-card .text-lg {font-size:16px !important;}
}


