@charset "utf-8";
/* CSS Document */

/* page tweak */

@media (min-width: 1025px) {
#HeroContainer h1 {
    text-align: center;
}
}

html {
    overflow: hidden;
}

/*-- social container --*/

#postcontent .social-container {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    align-content: center;
    column-gap: 24px;
	row-gap: 20px;
}

#postcontent .social-container h3 {
    margin: 0px !important;
	font-size: 22px !important;
    line-height: 30px !important;
	font-weight: 500 !important;
}

#postcontent .social-container .social-links {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    column-gap: 24px;
    height: 28px;
}

#postcontent .social-container a.share-link, .social-container a.share-link svg, .social-container a.share-link svg path, #postcontent .social-container a.share-link:hover, .social-container a.share-link:hover svg {
    background: none;
}

#postcontent .social-container a.share-link:hover svg path {
	fill: var(--brandGreen);
}

#postcontent .social-container a.share-link[aria-label*="Instagram"]:hover svg path {
    fill: unset;
    stroke: var(--brandGreen);
}

.social-container a.share-link svg {
    width: 28px;
    height: 28px;
}

/*-- tab functions --*/
input[type="radio"], input[type="checkbox"] {
    outline: none;
	display: none;
}

#social-hub input ~ .feeds .feed {
    opacity: 0 !important;
	z-index: 1;
	position: absolute !important;
    top: 0;
    left: 0;
    right: 0;
}

#input0:checked ~ .feeds #feed0, #input1:checked ~ .feeds #feed1, #input2:checked ~ .feeds #feed2, #input3:checked ~ .feeds #feed3, #input4:checked ~ .feeds #feed4 {
    opacity: 1 !important;
	z-index: 2;
	position: relative !important;
}

/*-- container styles --*/
#social-hub {
	position: relative;
	opacity: 1 !important;
	width: 100%;
    margin: 80px 0 !important;
	display: flex;
	justify-content: center;
}

#social-hub .tabs {
    position: relative;
	width: 100%;
	display: flex;
	flex-direction: column;
    justify-content: flex-start;
    align-content: center;
    row-gap: 50px;
    height: 100%;
	flex-wrap: wrap;
}

#social-hub .tabs .feeds {
	width: 100vw;
    margin: 0 auto;
    position: relative;
	height: 100%;
}

#social-hub .tabs .feeds .feed {
	position: relative;
    width: 100%;
    height: auto;
	transition: opacity 200ms ease-out;
}

#social-hub .feed iframe {
	width: 100% !important;
	height: auto !important;   /* JS overrides this */
	min-height: 150px;         /* loading state */
	display: block;
}


/*-- navigation and label styles --*/
#social-hub #navigation {
	display: flex;
    flex-direction: row;
    justify-content: center;
    text-align: center;
    align-items: center;
    column-gap: 40px;
    row-gap: 20px;
    flex-wrap: wrap;
	width: 100%;
    margin: 0 auto;
}

#social-hub #navigation label {
	cursor: pointer;
    color: var(--text-grey);
    letter-spacing: .13px;
    min-height: 30px;
	min-width: 40px;
    text-transform: uppercase !important;
    border: 1px solid var(--text-grey) !important;
    font-size: 13px;
    line-height: 20px;
    border-radius: 20px;
    text-decoration: none;
    padding: 5px 14px;
    display: block;
    transition: all .15s ease-in-out;
}

#social-hub #navigation label:hover, 
#social-hub input#input0:checked ~ #navigation label[for="input0"],
#social-hub input#input1:checked ~ #navigation label[for="input1"],
#social-hub input#input2:checked ~ #navigation label[for="input2"],
#social-hub input#input3:checked ~ #navigation label[for="input3"],
#social-hub input#input4:checked ~ #navigation label[for="input4"] {
	background: var(--text-grey);
    color: #fff!important;
}