/*
Theme Name: Great Vegan Athletes
Theme URI: https://www.greatveganathletes.com
Description: Theme for Great Vegan Athletes website
Version: 1.0.0
Author: Erik Gorton
Author URI: http://www.faircode.com.au

	Theme for Great Vegan Athletes website
	www.greatveganathletes.com
	site by www.faircode.com.au

------------------------------
*/



/* 
------------------------------
 @GLOBAL 
*/

* { 
	margin: 0;
	font-family: "Open Sans", sans-serif;
    font-weight: normal;
}

:root {
    --color-text: #111;
    --color-link: #008972; /*#0e6a5b;*/
    --color-link-hover: #000;
    --color-black-link: var(--color-text);
    --color-black-link-hover: var(--color-link);
    --color-hilight: var(--color-link);
    --color-hilight-invert: #ff768d; /* #c9838e; */
    --color-light: #e6f3f2;  /* #e0e9e8 */
    
    --filter-green: invert(36%) sepia(88%) saturate(612%) hue-rotate(126deg) brightness(92%) contrast(102%);
    
    --maxpagewidth: 1000px;
    --maxpagewidth_pad: 0;
    --maxpagewidth_pad_half: 0;
    --maxcontentwidth: 600px;
    --maxcontentwidth_pad: 0;
    --maxcontentwidth_pad_half: 0;
    
    --scrollbarwidth: 0px; /* system scrollbar widths - this gets updated by javascript in global.js */
    --scrollbarwidthhalf: 0px;
    --fullpagewidth: calc( 100vw - var(--scrollbarwidth) ); /* 100vw with scrollbar width removed */
}

html { 
	background: #fff;
}
	
body { 
	margin: 0;
    font-size: 10px; 
    line-height: 1.7em;
    color: var(--color-text); 
	background: #fff; 
	-webkit-text-size-adjust: none;
    overflow-y: scroll;
}

/* make footer stick to bottom */

body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

#maincontent { /* make footer stick to bottom */
    flex: 1 0 auto;
    margin: 0 auto;
    width: var(--maxpagewidth);
    max-width: 100%;
}

#bottomcontent {
    flex-shrink: 1;
}



/* ------ */


h1,h2,h3,h4,h5,h6,p,td,ul,ol { 
	margin: 0 0 1em 0;
	font-size: 1em;
    line-height: 1.8em;
    font-style: inherit; 
    font-weight: inherit;
    color: inherit;
}

	
h1 {
    font-family: "Anton", sans-serif;
    text-transform: uppercase;
	font-size: 5em; 
    line-height: 1.2em;
    letter-spacing: .025em;
    font-weight: normal !important;
}
	
h2 {
    font-family: "Anton", sans-serif;
    text-transform: uppercase;
	font-size: 2.4em; 
    line-height: 1.2em;
    letter-spacing: .025em;
    font-weight: normal !important;
}
	
h3 {
    font-size: 2em; 
    line-height: 1.6em;
}

p, 
li,
td {
	font-size: 1.6em; 
    line-height: 1.8em;
	}
	
a { 
	color: var(--color-link); 
    text-decoration: none;
    font-style: inherit;
    font-weight: inherit;
    transition: color .3s ease;
	}
	
a:hover { 
	color: var(--color-link-hover);
    transition: color 0s ease;
	}
	
a:active, a:focus { /* remove firefox dotted outline on links */
	outline:0;
	}

a.blacklink {
    color: var(--color-black-link); 
}

a.blacklink:hover {
    color: var(--color-black-link-hover); 
}

img { 
	border: none;
	}

span {
    font: inherit;
    font-weight: inherit;
    font-style: inherit;
    font-size: inherit;
    }

.unselectable {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

#debug_window_size { z-index:10000; position:fixed; bottom:10px; left:10px; min-width: 5em; padding:5px 10px; opacity: .9;
			color:#000; background:#eee; text-align:left; font-size:12px; line-height:1em; font-family:Arial, Helvetica, sans-serif; }

#admin_toolbar { 
    position:fixed; right:1.6em; bottom:0; z-index:9999;
	padding:.7em 1.3em;
	color:#fff; font-size:1.2em; line-height:1.2em; font-weight: normal;
	background: var(--color-link); text-transform: uppercase;
    border-radius: .5em; border-bottom-left-radius: 0; border-bottom-right-radius: 0;
	}

#admin_toolbar:hover { 
    color:#fff;
    background:#333;  
}


/* 
------------------------------
 @PADDING & WRAP
*/

.padV {
    padding-top: 3rem;
    padding-bottom: 3rem;
}

.padVtop {
    padding-top: 3rem;
}

.padVbot {
    padding-bottom: 3rem;
}

.padH {
    padding-left: var(--maxcontentwidth_pad);
    padding-right: var(--maxcontentwidth_pad);
}

.padhead {
    position: relative;
    display: block;
    height: 2em;
}

.wrap {
    position: relative;
    display: block;
    width: var(--maxcontentwidth);
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--maxcontentwidth_pad);
    padding-right: var(--maxcontentwidth_pad);
    box-sizing: border-box;
    background: none; /* #f8f8f8; */
}

#page .maxpad {
    padding-left: var(maxpagewidth_pad);
    padding-right: var(maxpagewidth_pad);
}

@media screen and (max-width: 1040px){
    
    :root {
        --maxpagewidth_pad: 1rem;
        --maxpagewidth_pad_half: .5rem;
    }
}

@media screen and ( max-width: 820px ){
    
    .padV {
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .padVtop {
        padding-top: 2rem;
    }

    .padVbot {
        padding-bottom: 2rem;
    }

}


@media screen and ( max-width: 650px ){ /* sadly css variables dont work with @media queries */
    
    :root {
        --maxcontentwidth_pad: 1rem;
        --maxcontentwidth_pad_half: .5rem;
    }
    
    body {
        font-size: 8px;
    }
    
    .styles img.size-large,
    .styles img.size-wider,
    .styles img.size-full,
    .styles img.size-fullscreen {
        width: var(--fullpagewidth) !important;
        max-width: none !important;
        margin-left: calc( var(--scrollbarwidthhalf) + 50% - 50vw) !important;
        margin-right: 0 !important;
    }
}



/* 
------------------------------
 @STYLES 
*/


.styles { }

.styles h1 {
	font-weight: normal;
	margin: 0 0 .5em 0;
    text-align: left;
	}

.styles h1 .smaller { /* used for search results and news results */
	display: inline-block;
	padding: 1em 0 0 0;
	font-size: .4em; 
    line-height: 1em; 
    vertical-align: top;
	}
	
.styles h2 {
	font-weight: normal;
	margin: 1.5em 0 .5em 0;
	}

.styles h3 {
	font-weight: 600;
	margin: 0 0 1em 0;
	}
	
.styles p,
.styles td
{
    margin: 0 0 1em 0;
}

.styles em,
.styles i
{
    font-weight: inherit;
}

.styles strong,
.styles p strong,
.styles td strong,
.styles b,
.styles p b,
.styles td b
{
    font-weight: bold;
}

.styles h1 strong,
.styles h1 b
{
    font-weight: normal;
}

.styles h2 strong,
.styles h2 b 
{
    font-weight: normal;
}

.styles h3 strong,
.styles h3 b 
{
    font-weight: bold;
}

.styles a {
    font-family: inherit;
    font-size: 1em;
    -ms-word-break: break-all;
    word-break: break-all;
    word-break: break-word;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    hyphens: auto;
	}
	
.styles ul,
.styles ol
	{
	margin: 0 0 2em 0;
	}

.styles li {
	margin: 0 0 1em 0;
	}

.styles .separator { 
	position:relative; float:none; clear:both; 
	width:100%; height:1px;
	margin:1em 0 1em 0;
	background: #999;
	}


.styles h1:first-child,
.styles h2:first-child,
.styles h3:first-child,
.styles p:first-child,
.styles ul:first-child,
.styles ol:first-child 
{
	margin-top: 0;
}

.styles .small { font-size: 12px; }

.styles .smalltext { font-size: 14px; }


.styles blockquote, 
.styles .fc_format_attention 
{
	position: relative;
	display: block;
	color: var(--color-link);
	margin: 3em 0 3em 0; 
    padding: 1em 0 1em 4em;
	border-left: solid 4px var(--color-link);
}

.styles .fc_format_attention,
.styles blockquote p,
.styles .fc_format_attention p,
.styles blockquote h1,
.styles .fc_format_attention h1,
.styles blockquote h2,
.styles .fc_format_attention h2,
.styles blockquote h3,
.styles .fc_format_attention h3 
{
	margin:0; padding:0;
	font-size:2.4em; line-height:1.5em;
	font-weight: normal;
	font-style: italic;
	text-align: left;
	font-family: Georgia, "Times New Roman", Times, serif;
}

.styles .fc_format_attention {
	border: none;
	margin: 0 0 2em 0; 
    padding: 0 2em 0 2em;
	text-align: center;
}


/* style intro date on news articles */

.styles .intro_date {
    position: relative;
    display: block;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 1.4em;
}


/* auto-icons for file types */

.styles a[href$='.pdf']:before,
.styles a[href$='.doc']:before,
.styles a[href$='.docx']:before,
.styles a[href$='.ppt']:before,
.styles a[href$='.pptx']:before,
.styles a[href$='.xls']:before,
.styles a[href$='.xlsx']:before
{
	content: ""; 
    opacity: .8;
	position: relative; 
    display: inline-block; 
    vertical-align: middle;
	width: 32px; 
    height: 30px;
	margin: 0 8px 5px 0; 
	background: transparent url(images/global/sprite_doc_icons.png) 0 0 no-repeat ;
}

.styles a[href$='.pdf']:hover:before,
.styles a[href$='.doc']:hover:before,
.styles a[href$='.docx']:hover:before,
.styles a[href$='.ppt']:hover:before,
.styles a[href$='.pptx']:hover:before,
.styles a[href$='.xls']:hover:before,
.styles a[href$='.xlsx']:hover:before
{
	opacity: 1;
}


/* pdf */

.styles a[href$='.pdf']:before {
    background-position: 0 0;
}

/* word docs and docx */

.styles a[href$='.doc']:before,
.styles a[href$='.docx']:before 
{
    background-position: 0 -40px;
}

/* powerpoint (ppt & pptx) */

.styles a[href$='.ppt']:before,
.styles a[href$='.pptx']:before
{
    background-position: 0 -120px;
}

/* xcel and xlsx */

.styles a[href$='.xls']:before,
.styles a[href$='.xlsx']:before
{
    background-position: 0 -160px;
}



/* circle_image */
/* by default: block, 100% width, no margin, zoom on hover */

.styles .circle_image {
    position: relative;
    display: block;
    width: 100%;
    height: 0;
    margin: 0 0 1.8em 0;
    font-size: 1.6em;
    padding: 100% 0 0 0;
    border-radius: 50%;
    overflow: hidden;
    background: #fff !important;
}

.styles .circle_image .img {
    position: absolute;
    display: block;
    top: 0; right: 0; bottom: 0; left: 0;
    background-size: cover !important;
    overflow: hidden;
    transition: transform 1s ease;
    transform: scale(1.000);
}

.styles .circle_image.hoverzoom:hover .img {
    transform: scale(1.05);
    transition: transform .5s ease;
}




/* 
------------------------------
 @RESULTS
*/

/* Search input - used on search results page */

.styles .input_search {
	position: relative; 
    display: block;
	text-align: left;
    font-size: .7rem;
	}

.styles .input_flex {
    position: relative;
    display: flex;
    margin: 0 0 1em 0;
}

.styles .input_search .input_text {
	display: inline-block;
    vertical-align: middle;
    flex-grow: 1;
    margin: 0 .5em 0 0;
    max-width: 100%;
    box-sizing: border-box;
	}

.styles .input_search .input_submit {
	display: inline-block;
    vertical-align: middle;
    flex-grow: 0;
    margin: 0;
	font-size: 1.3em !important;
    border-radius: .3em;
    box-sizing: border-box;
    
	}

.styles .input_search .search_info {
	width: 100%; 
    max-width: 100%;
	text-align: left;
	margin: 0 auto 3em 1.2em;
	font-size: 1.2em;
    box-sizing: border-box; 
	}

/* No results for search */

.styles .search_noresults {
	position: relative;
	text-align: center;
	margin: 6em 0 10em 0;
	}

.styles .search_noresults h2 {
	margin: 0 0 1em 0;
	}
	
.styles .search_noresults h3 {
	font-size: 1.8em;
	}
	

/* Results Box - used for lists like news and search results ------------ */

.styles .results_box_title {
	text-align: center;
	margin: 0 0 1.4em 0;
	}

.styles .results_box_more {
	display: block;
	margin: 0 0 0 0;
	text-align: center;
	}

.styles hr.results_box_line {
    border: 0;
    height: 1px;
    background: #ccc;
}
		
.styles ul.results_box {
	position: relative; 
    display: block;
	max-width: 100%;
	list-style-type: none;
	margin: 0 0 1em 0; 
    padding: 0;
	text-align: center;
	}

.styles .results_box li {
	list-style-type: none;
	margin: 0; 
    padding: 0;
	vertical-align: top;
	}

.styles .results_box .line {
	list-style-type: none;
	vertical-align: top;
	margin: -1em 0 2em 0; 
    padding: 0;
	border-top: solid 1px #ddd;
	}

.styles .results_box .line.lastline {
	margin-top: 1em;
	margin-bottom: 3em;
	}

.styles .results_box span.hilighted { 
	background-color: #FF9;
	}


/* FEATURED results - 3 large images */

.styles .results_box .item {
    position: relative;
    display: block;
    font-size: inherit;
}

.styles .results_box .item.featured {
	display: inline-block;
	list-style-type: none;
	vertical-align: top;
	width: calc( (100% - 4em) / 3 ); /* remove total margins from 100% then divide by 3 to get 3 equal parts */
	margin: 0 1em 2em 1em;
    padding: 0;
    font-size: inherit;
	color: #333;
	text-align: center;
	}

.styles .results_box .item.featured:first-child {
	margin-left: 0 !important;
	}

.styles .results_box .item.featured:last-child {
	margin-right: 0 !important;
	}

.styles .results_box .item.featured a {
	color: var(--color-text);
	display: block;
	}

.styles .results_box .item.featured a:hover {
	color: var(--color-text);
	}

.styles .results_box .item.featured .image {
    --top-right: 20%; /* sets the notch size */
	position:relative; 
    display:block; 
    overflow:hidden;
	width: 100%;
    height: 0;
    margin: 0 0 1em 0;
    padding-top: 50%;
	background: #fff;
	}

.styles .results_box .item.featured .image img {
	display:block;
	width:100%; height:auto;
	transition: transform 1.5s ease, opacity 1.5s ease;
	transform: translate3d(0, 0, 0);
	}

.styles .results_box .item.featured:hover .image img {
	transform: perspective(100px) translate3d(0, 0, 5px);
	opacity:.8;
	transition: transform .5s ease, opacity .5s ease;
	}

.styles .results_box .item.featured .image .img {
	position: absolute;
    display:block;
	top:0; right:0; bottom:0; left:0;
    background-size: cover !important;
	transition: transform 1.5s ease, opacity 1.5s ease;
	transform: translate3d(0, 0, 0);
	}

.styles .results_box .item.featured:hover .image .img {
	transform: perspective(100px) translate3d(0, 0, 5px);
	opacity:.8;
	transition: transform .5s ease, opacity .5s ease;
	}
	
.styles .results_box .item.featured .text {
	position: relative;
	display: block;
	vertical-align: top;
	overflow: hidden;
	height: auto; max-height:14em;
	}

.styles .results_box .item.featured .text.minheight {
	min-height: 0;
	}
	
.styles .results_box .item.featured h3 {
	position: relative;
	margin: 0 0 1em 0;
	font-size: 1.4em; 
    line-height: 1.5em;
	font-weight: bold;
	text-align: left;
	}

.styles .results_box .item.featured:hover h3 {
	color: var(--color-link);
	}

.styles .results_box .item.featured p {
	position:relative;
	margin:0;
	font-size:1.4em; 
    line-height:1.5em;
	font-weight:normal;
	text-align:left;
	}


/* NORMAL Results ---------------- */
	
.styles .results_box .item.normal {
	display: block;
	vertical-align: top;
	width:auto; 
    max-width: 100%;
	margin: 0 auto 5em auto;
	font-size: inherit;
	clear:both; 
    float:none;
    overflow: hidden;
	}

.styles .results_box .item.normal a {
	color: var(--color-text);
	display:block;
	}

.styles .results_box .item.normal a:hover {
	color: var(--color-text);
	}
	
.styles .results_box .item.normal .image {
    --top-right: 20%; /* sets the notch size */
    position: relative;
	display:block; 
    float:left; 
    overflow:hidden;
	width: 18em; height: 14em;
	margin:.3em 2em 0 0;
    padding: 0;
	background:#fff;
	}

.styles .results_box .item.normal .image img {
    position: absolute;
    display: block;
    top: 0; left: 0;
	width:100%; height:auto;
	
	transition: all 1.5s ease;
	transform: translate3d(0, 0, 0);
	}

.styles .results_box .item.normal:hover .image img {
	transform: perspective(100px) translate3d(0, 0, 5px);
	opacity:.8;
    
	transition: all .5s ease;
	}

.styles .results_box .item.normal .image .img {
	position: absolute;
    display:block;
	top:0; right:0; bottom:0; left:0;
    background-size: cover !important;
	transition: all 1.5s ease;
	transform: translate3d(0, 0, 0);
	}

.styles .results_box .item.normal:hover .image .img {
	transform: perspective(100px) translate3d(0, 0, 5px);
	opacity:.8;
	transition: all .5s ease;
	}
	
.styles .results_box .item.normal .text {
	display:block;
	vertical-align:top;
	height:auto;
	}

.styles .results_box .item.normal .text.minheight {
	height:15em; /* added to items with photos in case text is too short */
	}

.styles .results_box .item.normal h3 {
    display: block;
    text-align: left;
	vertical-align: top;
    margin: 0 0 0em 0;
    font-size: 1.8em;
    line-height: 1.5em;
    font-weight: bold;
    color: var(--color-text);
}

.styles .results_box .item.normal:hover h3 {
	color: var(--color-link);
	}

.styles .results_box .item.normal p {
    position:relative;
    display: block;
    text-align: left;
    margin: 0;
    padding: 0.5em 0 0 0;
    font-size: 1.6em;
    line-height: 1.8em;
    font-weight: normal;
    color: var(--color-text);
}

.styles .results_box .item .text.ellipsis:after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    height: 2.4em;
    width: 25%;
    background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
}

.styles .results_box .item a {
    word-break: normal;
    cursor: pointer;
}


/* athletes results */

.styles .results_box .item.athletes.featured .text {
    max-height: none;
    margin: 0;
}

.styles .results_box .item.athletes.featured .text.ellipsis:after {
    display: none;
}

.styles .results_box .item.athletes.featured .text h3 {
    margin: 0;
    text-align: center;
    font-size: 1.6em;
}

.styles .results_box .item.athletes.featured .text p {
    margin: 0;
    text-align: center;
    font-size: 1.2em;
    text-transform: capitalize;
}




/* 
------------------------------
 @GLOBALS
*/


.clear { 
	float: none; 
    clear: both; 
}


.validatetooltip {
    z-index:2000; 
    position: absolute; 
    left: 0; 
    top: 0; 
    margin: 1px 0 0 2px; 
    padding: 4px 10px;
    color: #ECC9C4; 
    font-size: 10px;
    background: #c34342; 
    border: solid 1px #ECC9C4;
    border-radius: 4px;
}

	

/** BUTTONS **/

.button {
    position: relative;
    display: inline-block;
    cursor: pointer;
    margin: 0 0 0 0;
    padding: .9em 1em .9em 1em;
    color: var(--color-link);
    background: #fff;
    border: solid .1em var(--color-link);;
    font-size: .7rem !important;
    line-height: 1em;
    font-weight: bold;
    transition: background .2s ease, color .2s ease, border-color .2s ease;
}

.button:hover {
    color: var(--color-link-hover);
    border-color: var(--color-link-hover);
    background: transparent;
}

.button.outline {
    color: var(--color-link);
    background: transparent;
    border: solid .13em var(--color-link);
}

.button.outline:hover {
    color: var(--color-link-hover);
    border-color: var(--color-link-hover);
    background: rgba(255,255,255, .3);
}

.button.solid {
    color: #fff;
    background: var(--color-link);
    border: none;
    border-radius: .2em;
}

.button.solid:hover {
    color: #fff;
    background: var(--color-link-hover);
}

.button.black {
    color: #fff;
    background: #222;
    border: none;
}

.button.black:hover {
    color: #fff;
    background: var(--color-link);
}

.button.pill {
    color: #222;
    background: transparent;
    border: solid .15em #222;
    border-radius: 2em;
}

.button.pill:hover {
    color: #fff;
    background: #222;
}

.button.uppercase {
    text-transform: uppercase;
    font-size: .8em;
}

.button.arrow:after {
    content: '';
    position: relative;
    display: inline-block;
    vertical-align: baseline;
    width: 1em;
    height: 1em;
    padding: 0;
    margin: 0 0 0 .5em;
    font-size: .8em;
    line-height: 1em;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='370.81' height='370.81'%3E%3Cpath fill='none' d='M-1-1h582v402H-1z'/%3E%3Cg%3E%3Cpath d='M77.9 345.96l24.14 24.85 190.89-185.4L102.03.01 77.9 24.84l165.28 160.56z'/%3E%3C/g%3E%3C/svg%3E");
    transition: transform .3s ease;
    filter: var(--filter-green);
}

.button.arrow:hover:after {
    transform: translateX(.3em);
    filter: none;
}

.green_filter {
    /*filter: invert(29%) sepia(95%) saturate(383%) hue-rotate(121deg) brightness(92%) contrast(93%);*/
    filter: var(--filter-green);
}


/** input styling */

.input_text,
.input_textarea {
    position: relative; 
    display: inline-block;
    width: 100%; 
    max-width: 100%;
    margin: 0; 
    padding: .6em 1em .6em 1em;
    color: #666; 
    font-size: 1.4em; 
    line-height: 1em;
    background: none;
    border: solid 1px #bfc3c4;
    box-shadow: inset 0px 2px 0px 0px #f5f5f5;
    box-sizing: border-box;
    border-radius: .3em;
}

.input_textarea {
    padding: 1.5em 2em 1.5em 2em;
    color: #333; 
    line-height: 1.5em;
}

.input_text.search {
    color: #222;
    border: solid 1px #222;
    background: #fff;
}

.input_text.search:focus {
    background: #ffc;
}



/* CORNERBOX */

.cornerbox {
    --border: 0em;
	--bordercol: transparent;
	--bgcolor: var(--color-light);
	--top-right: 2rem;
  
	display: block;
  	width: auto;
  	height: auto;
  	margin: 3em 0 3em 0;
	padding: 3em 1em 4em 1em; /* padding: 2em 1em 2em 1em; */
	font-size: 1em;
  	border: var(--border) solid var(--bordercol);
  	background: linear-gradient(-135deg, var(--bordercol) 0 calc( var(--top-right) + var(--border) ),transparent 0) top right,
     var(--bgcolor);
  	background-origin: border-box;
  	background-repeat: no-repeat;
  	-webkit-mask:
     linear-gradient( 0deg, transparent 0 0, white 0) bottom left,
     linear-gradient( 0deg, transparent 0 0, white 0) bottom right,
     linear-gradient( 0deg,transparent 0 0, white 0) top left,
     linear-gradient(-135deg, transparent 0 var(--top-right), white 0) top right;
   -webkit-mask-size: 50.5% 50.5%;
   -webkit-mask-repeat: no-repeat;
	box-sizing: border-box;
}

.cornerbox.outline {
	--border: .3rem;
	--bordercol: #111;
	--bgcolor: transparent;
}


/* for use with IMG tags */

.img_cornerbox {
	--top-right: 2rem;
  
	display: block;
	font-size: 1em;
  	background: linear-gradient(-135deg, transparent 0 var(--top-right), transparent 0) top right, transparent;
  	background-origin: border-box;
  	background-repeat: no-repeat;
  	-webkit-mask:
     linear-gradient( 0deg, transparent 0 0, white 0) bottom left,
     linear-gradient( 0deg, transparent 0 0, white 0) bottom right,
     linear-gradient( 0deg,transparent 0 0, white 0) top left,
     linear-gradient(-135deg, transparent 0 var(--top-right), white 0) top right;
   -webkit-mask-size: 50.5% 50.5%;
   -webkit-mask-repeat: no-repeat;
	box-sizing: border-box;
}



/* LINKSBOX */

.linksbox {
    /* cornerbox class creates the box now */
	text-align: center;
    margin-bottom: 4em;
}

.linksbox p {
    margin: 0 0 .7em 0;
    font-weight: bold;
}

.linksbox p:last-child {
    margin-bottom: 0;
}

.linksbox .button_box {
    margin: 1.3em 0 1.5em 0;
}

.linksbox .socmedia {
    position: relative;
    display: block;
    margin: 0 0 2em 0;
    text-align: center;
    font-size: .9em;
}

.linksbox .socmedia a {
    position: relative;
    display: inline-block;
    margin: 0 1.5em 0 0;
}

.linksbox .socmedia a:last-child {
    margin-right: 0;
}


.linksbox .socmedia i {
    display: block;
    font-size: 4em;
    margin: 0 auto;
    background-color: var(--color-hilight-invert);
    filter: invert();
    transition: background-color .2s ease;
}

.linksbox .socmedia a:hover i {
    background-color: #fff;
}



/* 
------------------------------
 @WORDPRESS STYLES
*/
	
a.more-link { 
	color: var(--color-link); 
    font-size: 1em; 
    font-weight: bold; 
}

a.more-link:hover { 
	color: var(--color-link-hover); 
    font-weight: bold; 
}



/* 
------------------------------
 @SHORTCODE STYLES
*/

.shortcode_cornerbox.cornerbox {
	/* cornerbox class creates the box now */
    padding: 3em 3em 2em 3em;
    
}

.shortcode_cornerbox.cornerbox ul {
    list-style-type: square;
    margin: 2em 0 0 1.7em;
    padding: 0;
}

.shortcode_cornerbox.cornerbox > ul:first-child {
    margin-top: 0;
}

.shortcode_cornerbox.cornerbox ul li {
    font-weight: bold;
}

.shortcode_cornerbox.cornerbox::first-child {
    margin-top: 0 !important;
}

.shortcode_cornerbox.cornerbox::last-child {
    margin-bottom: 0 !important;
}


/* 
------------------------------
 @HEADER
*/

#header_spacer {
    position: relative;
    display: block;
    height: 3rem;
}


#header {
    z-index: 999;
	position: fixed; 
    display: block;
    width: 100%;
    height: 3rem;
    top: 0;
    left: 0;
	margin: 0;
    color: var(--color-text);
    background: #fff;
    box-sizing: border-box;
    /*box-shadow: 0px 1px 4px 0px rgba(0,0,0,0.1);*/
 }

#header.hidden { 
	display: none;
}

#header .content { 
	position: relative; 
    display: flex;
    justify-content: space-between;
    align-content: flex-start;
    width: var(--maxpagewidth);
    max-width: 100%;
    margin: 0 auto;
	padding: 0;
    text-align: left;
    box-sizing: border-box;
}

#header.nav_overflow .content { 
    justify-content: space-between;
}

@media screen and (max-width: 1040px){
    
    #header .content { 
        padding: 0 2em 0 2em;
    }
}

#header .column_menu:hover {
    opacity: .7;
    transition: opacity 0s ease;
}

#header .logo {
    position: relative;
    display: inline-block;
    width: auto;
    height: auto;
    margin: 0 3em 0 0;
    padding: .7rem 0 .75rem 0;
    font-size: 1rem;
    background: none;
    flex-shrink: 0;
    transition: transform .5s ease, opacity .5s ease;
    opacity; 1;
    transform: scale(1.000);
}

#header .logo:hover {
    transform: scale(1.025);
    opacity: 1;
}

#header .logo img {
    display: inline-block;
    vertical-align: middle;
    border: none;
    padding: 0;
}

#header .logo .logo_logo {
    width: 3em;
    padding: 0 .7em .1em 0;
}

#header .logo .logo_text {
    width: 12em;
}

#header .column_nav {
    position: relative;
    display: inline-block;
    margin: 0 2em 0 0;
    padding: 0;
    overflow: hidden;
    white-space: nowrap;
    flex-grow: 1;
}

#header.nav_overflow .column_nav {
    display: none;
}

#header .column_nav a {
    position: relative;
    display: inline-block;
    vertical-align: top;
    color: inherit;
    font-size: .7rem;
    line-height: 0em;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
    margin: 1em 1em 0 0;
    padding: .8rem 1rem 0 0;
}

#header .column_nav a:last-child {
    margin-right: 0;
}

#header .column_nav a:hover {
    color: var(--color-link);
}

#header .right_panel {
    position: relative;
    display: inline-block;
    white-space: nowrap;
    text-align: right;
    flex-shrink: 0;
}



#header .search_button {
    position: relative;
    display: inline-block;
    vertical-align: top;
    width: auto;
    height: auto;
    margin: 0;
    padding: .9rem 0 0 0;
    font-size: 1.1rem;
    white-space: nowrap;
    flex-shrink: 0;
    flex-grow: 0;
    background: none;
    text-decoration: none;
    border: none;
    cursor: pointer;
    opacity: 1;
    transition: opacity .3s ease;
}

#header .search_button:hover {
    opacity: .7;
    transition: opacity 0s ease;
}

/*
#header.nav_overflow .content .search_button { 
    margin-right: 2em;
}
*/

#header .donate_button,
#header .challenge_button {
    position: relative;
    display: inline-block;
    vertical-align: top;
    width: auto;
    height: auto;
    margin: .9em 0 0 2em;
    padding: 1em .7em;
    
    color: var(--color-link);
    font-size: .7rem;
    line-height: 0em;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    
    text-decoration: none;
    border: solid 2px var(--color-link);
    cursor: pointer;
    opacity: 1;
    transition: opacity .3s ease, background-color .3s ease, border-color .3s ease, color .3s ease;
}

#header .challenge_button {
    color: #fff;
    background: var(--color-link);
}

#header .donate_button:hover,
#header .challenge_button:hover {
    color: #fff;
    background: #111;
    border-color: #111;
}

#header .column_menu {
    position: relative;
    display: none;
    margin: 0 0 0 1em;
    padding: .85rem 0 0 0;
    font-size: 1.3rem;
    white-space: nowrap;
    opacity: 1;
    flex-shrink: 0;
    flex-grow: 0;
    transition: opacity .3s ease;
    cursor: pointer;
}

#header.nav_overflow .column_menu {
    display: inline-block;
}

@media screen and (max-width: 700px){
    
    #header .donate_button {
        display: none;
    }
}

@media screen and (max-width: 580px){
    
    #header .challenge_button {
        display: none;
    }
    
    #header .column_menu {
        margin-left: 1.5em;   
    }
}

@media screen and (max-width: 500px){
    
    #header .search_button {
        display: none;
    }
    
    #header .logo {
        margin-right: 0;
    }
}

@media screen and (max-width: 330px){
    
    #header .logo .logo_text {
        width: 9em;
    }
}



/* 
------------------------------
 @NAV
*/

#nav {
    z-index: 1000;
    position: fixed;
    display: block;
    top: 0;
    right: 0;
    bottom: 0;
    width: 30em;
    max-width: 100%;
    height: auto;
    padding: 0 0 2em 0;
    background: #eeeeee;
    overflow: hidden;
    overflow-y: auto;
    box-sizing: border-box;
}

#nav {
    opacity: 0;
    right: -31em;
    transition: right .5s ease, opacity 0s ease 1s; /* opacity with delay prevents menu being seen when resizing page */
}

#nav.on {
    opacity: 1;
    right: 0;
    transition: right .5s ease, opacity 0s ease;
}

#nav .featured {
    position: relative;
    display: block;
    padding: 0;
    color: #fff;
    font-weight: bold;
    text-transform: uppercase;
    background: #f8f8f8;
    box-sizing: border-box;
}

#nav .normal {
    position: relative;
    display: block;
    padding: 0;
    background: none;
    box-sizing: border-box;
}

#nav a {
    position: relative;
    display: block;
    padding: 1em 2em 1em 2em;
    margin: 0;
    color: var(--color-text);
    font-size: 2em;
    line-height: 1em;
    white-space: nowrap;
    overflow: hidden;
    /*transition: background-color .3s ease;*/
}

#nav a span {
    display: inline-block;
    transform: translateX(0);
    transition: transform .3s ease;
}

#nav a:hover {
    background-color: var(--color-light); /* #c4f8f0; */
}

#nav .featured a:hover {
    background-color: var(--color-light);
}

#nav a:hover span {
    transform: translateX(1em);
}

#nav a:before {
    content: "";
    position: absolute;
    display: inline-block;
    top: 1em;
    left: 2em;
    width: 1em;
    height: 1em;
    font-size: 1em;
    background-image: url("data:image/svg+xml,%3Csvg width='1792' height='1792' fill='rgba(0,0,0,1)' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1171 960q0 13-10 23l-466 466q-10 10-23 10t-23-10l-50-50q-10-10-10-23t10-23l393-393-393-393q-10-10-10-23t10-23l50-50q10-10 23-10t23 10l466 466q10 10 10 23z'/%3E%3C/svg%3E");
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-size: contain !important;
    opacity: 0;
    transition: opacity .3s ease;
}

#nav a:hover:before {
    opacity: 1;
}

#nav a:first-child {
    padding-top: 2em;
}

#nav a:first-child:before {
    top: 2em;
}

/*#nav a:last-child {
    padding-bottom: 2em;
}*/

#nav .close {
    position: absolute;
    display: inline-block;
    top: 0;
    right: 0;
    padding: 1em;
    margin: 0;
    font-size: 2em;
    cursor: pointer;
    opacity: .3;
    transition: opacity .3s ease;
}

#nav .close:hover {
    opacity: 1;
}

#nav .donate_button,
#nav .challenge_button {
    position: relative;
    display: inline-block;
    vertical-align: top;
    width: auto;
    height: auto;
    padding: .4em .5em;
    margin: .8em 2em 0 2em;
    color: var(--color-link);
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    
    text-decoration: none;
    border: solid 2px var(--color-link);
    cursor: pointer;
    opacity: 1;
    transition: opacity .3s ease, background-color .3s ease, color .3s ease, border-color .3s ease;
}

#nav .challenge_button {
    margin-bottom: .8em;
    color: #fff;
    background: var(--color-link);
}

#nav .donate_button:before,
#nav .challenge_button:before {
    display: none;
}

#nav .donate_button span,
#nav .challenge_button span {
    font-size: .8em;
}

#nav .donate_button:hover,
#nav .challenge_button:hover {
    color: #fff;
    background: #111;
    border-color: #111;
}

#nav .donate_button:hover span,
#nav .challenge_button:hover span {
    transform: none;
}



/* 
------------------------------
 @FOOTER
*/

#footer { 
	position: relative; 
    display: block;
	text-align: center;
	color: #fff;
    background: #979797;
    overflow: hidden;
    box-sizing: border-box;
}

#footer .content { 
	position: relative; 
    display: flex;
    flex-flow: row nowrap;
    align-content: stretch;
    width: var(--maxpagewidth);
    max-width: 100%;
    margin: 0 auto;
    padding: 2em 0 2em 0;
    overflow: hidden;
    box-sizing: border-box;
}

@media screen and (max-width: 1040px){
    
    #footer .content { 
        padding: 2em;
    }
}

#footer .leftbox {
    position: relative;
    display: block;
    vertical-align: top;
    flex-grow: 0;
    text-align: left;
    box-sizing: border-box;
}

#footer .rightbox {
    position: relative;
    display: block;
    vertical-align: top;
    flex-grow: 2;
    align-self: flex-end;
    text-align: right;
    box-sizing: border-box;
    white-space: nowrap;
}

#footer .logo {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    width: 7em;
    margin: 0 1em 0 0;
    filter: invert() brightness(100);
    opacity: .8;
}

#footer a.credits {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    color: inherit;
    font-size: 1.2em;
    line-height: 1.2em;
    margin: 0;
    opacity: .6;
    transition: opacity;
    white-space: nowrap;
}

#footer .socmedia {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    font-size: 2rem;
    line-height: 2rem;
    padding: 0;
    margin: 0;
}

#footer .socmedia a {
    position: relative;
    display: inline-block;
    width: 1em;
    height: 1em;
    margin: 0 0 0 .5em;
    opacity: .6;
    transition: opacity .3s ease;
    background: #fff;
    border-radius: 50%;
}

#footer .socmedia a i {
    background-color: transparent;
    filter: contrast(10%);
}

#footer .subscribe {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    font-size: 1.2em;
    padding-top: .7em;
    padding-bottom: .7em;
    margin: 0 0 .3em 2em;
    color: #fff;
    border-color: #fff;
    opacity: .8;
}

#footer .subscribe:hover {
    background: none;
}

#footer a {
    transition: opacity .2s ease;
}

#footer a:hover {
    opacity: 1;
}


@media screen and (max-width: 520px){
    
    #footer a.credits { 
        position: absolute;
        left: 0;
        bottom: -1.5em;
    }
    
    #footer .content { 
        padding-bottom: 4em;
    }
}

@media screen and (max-width: 350px){
    
    #footer .subscribe { 
        display: none;
    }
}


/* 
------------------------------
 @PAGE
*/

#page {
    position: relative;
    display: block;
    margin: 0;
    padding: 0;
}


#page .article {
    position: relative;
    display: block;
    margin: 0;
    padding: 0;
    /*overflow: hidden;*/
}


#page .article .intro_panel {
    position: relative;
    display: block;
    box-sizing: border-box;
}

#page .article .intro_panel_content {
    position: relative;
    display: block;
    box-sizing: border-box;
}



/* 
------------------------------
 @TOOLTIP
*/

.fc_tooltip {
    z-index: 1000;
	position: absolute;
    display: none;
    margin: 0;
	padding: 10px;
	color: #fff;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	background-color: #161616;
    border: 1px solid #161616;
	border-radius: 5px;
	
}

.fc_tooltip:after {
	content: '◄';
	position: absolute;
	left: -17px; 
    top: 50%; 
    margin-top: -10px;
	color: #161616;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 20px; line-height: 1em;
	vertical-align: middle;
}



/* 
------------------------------
 @FCTOOLBOX
 All CSS required for fc-toolbox plugin
*/


/* IMAGES */

/* wordpress styles */

.alignleft { 
	float: left; 
	margin:.7em 2em 1em 0 !important; 
}
	
.alignright { 
	float: right; 
	margin: .7em 0 1em 2em !important; 
}

.aligncenter { 
	display: block; 
	margin-left: auto !important; 
    margin-right: auto !important;
}


/* captions */

/* captions: wordpress settings */

.wp-caption {
	width: auto !important; 
    height: auto !important;
	margin: 4em 0 4em 0; 
    padding: 0;
	text-align: left; 
	background-color: none; 
	}

.wp-caption:first-child {
    margin-top: 0;
}
			 
.wp-caption img {
    display: block;
	margin: 0 auto; 
    padding: 0; 
	border: none; 
	}

/* captions: styles */

.styles .caption_fullscreen,
.styles .caption_normal {
	position: relative; 
    display: block;
	margin: 0; 
    padding: 0 3em 0 3em;
	background: none;
}

.styles .caption_fullscreen {
	margin-top: -1em;
	}

.styles .caption_normal {
	margin-top: 1.4em;
	}

.styles .caption_fullscreen .text,
.styles .caption_normal .text,
.styles .caption_fullscreen .credit,
.styles .caption_normal .credit {
	position: relative; 
    display: inline;
    padding: 0 .5em .7em 0;
	color: #666; 
    font-size: 1.4em; 
    line-height: 1.6em; 
    font-weight: normal;
	background: none;
}

.styles .caption_fullscreen .text::before,
.styles .caption_normal .text::before {
    content: '\25b4 ';
    font-size: 1.8em;
    vertical-align: bottom;
    margin-left: -.9em;
    color: #ccc
}

.styles .caption_fullscreen .credit,
.styles .caption_normal .credit {
    color: #999; 
    font-style: normal;
}




/* images */

.styles img,
.styles img.size-thumbnail,
.styles img.size-medium,
.styles img.size-large,
.styles img.size-wider,
.styles img.size-full 
{
	max-width: 100%; 
    height: auto;
}

.styles img.size-large,
.styles img.size-wider,
.styles img.size-full,
.styles img.size-fullscreen 
{
	width: 100%; 
    max-width: 100%; 
    height: auto;
}

.styles img.size-wider {
    z-index: 1; /* to cover the share buttons */
    position: relative;
    width: 800px !important;
    height: auto !important;
    max-width: none !important;
    max-height: none !important;
    border: none !important;
    margin-left: calc( var(--scrollbarwidthhalf) + 50% - 50vw + (var(--fullpagewidth) - 800px)/2 ) !important;
    margin-right: 0
}

@media screen and (max-width: 817px){ /* add assumed scrollbar width of 17px to 800px */
    
    .styles img.size-wider {
        width: var(--fullpagewidth) !important;
        max-width: none !important;
        margin-left: calc( var(--scrollbarwidthhalf) + 50% - 50vw) !important;
        margin-right: 0 !important;
    }
    
    .wp-video-wrapper {
        width: var(--fullpagewidth) !important;
        padding-bottom: calc( var(--fullpagewidth) * .55 ) !important; /* make the height a percentage of width */
        margin-left: calc( var(--scrollbarwidthhalf) + 50% - 50vw) !important;
        margin-right: 0 !important;
    }
}

.styles img.size-fullwidth {
    position: relative;
    width: var(--fullpagewidth) !important;
    height: auto !important;
    max-width: none !important;
    max-height: none !important;
    border: none !important;
    margin-left: calc( var(--scrollbarwidthhalf) + 50% - 50vw) !important;
    margin-right: 0 !important;
}



/* article */

/* fullscreen - fixed position image */

.article .fullscreen {
	position: relative;
	display: block;
	background: #f2f2f2 center top no-repeat;
	background-size: cover !important;
    will-change: transform; /* this is required to make chrome display fixed attachment images */
    background-attachment: fixed !important;
	width: 100%; 
    height: 800px; /* height gets reset by jquery */
}

.article .intro_panel.fullscreen {
	width: 100%;
	height: 0; 
    padding-bottom: 400px;
}


/* bleed - image is contained and horizontal edges should bleed into background colour */

.article .intro_panel.bleed {
    position: relative;
    display: block;
    overflow: hidden;
    width: 100%;
    height: auto !important;
    padding: 0 !important;
	margin: 0;
    text-align: center;
    color: #fff;
}

.article .intro_panel.bleed .image {
    position: relative;
    display: block;
    overflow: hidden;
    width: 100%;
    max-width: 1200px;
    height: auto !important;
    padding: 0 !important;
	margin: 0 auto !important;
    border: none;
}


/* full - image is full width (not fixed, shows whole image) */

.article .intro_panel.full {
    position: relative;
    display: block;
    overflow: hidden;
    width: 100%;
    height: auto !important;
    padding:0;
	margin:0;
    text-align: center;
    color: #fff;
}

.article .intro_panel.full .image {
    position: relative;
    display: block;
    overflow: hidden;
    width: 100%;
    height: auto !important;
    padding: 0;
	margin: 0;
}




@media screen and (max-width: 971px){
	
	.article .intro_panel.fullscreen {
		height: 0; 
        padding-bottom: 50%;
        }
	
	.article .fullscreen {
		/*height and padding get set using jquery*/
		background-size: cover !important;
		background-attachment: scroll !important;
        }
       
}

@media screen and (max-width: 540px){
	
	.styles .caption_fullscreen { 
        margin-top: -2em; 
        }
    
}



/* FI-RESPONSIVE-VIDEO */

.wp-video-wrapper {
	position: relative;
	margin: 4em 0 4em 0; 
	width: 800px;
	height: 0;
	padding-top: 1px;
	padding-bottom: calc( 800px * .55 );
    margin-left: calc( var(--scrollbarwidthhalf) + 50% - 50vw + (var(--fullpagewidth) - 800px)/2 );
    margin-right: 0
}
	
.wp-video-wrapper iframe { 
	position: absolute; /* needs to be absolute to override the padding-bottom in wp-video-wrapper */
	width: 100%;
	height: 100%;
}



/* SC-COMPARE */

.fcbox_sc_compare {
    /* defaults - change these values to change how the element fits into the page
    width: 100%;
    max-width: 100%;
    margin: 0em auto 3em auto;
    */
}

.fcbox_sc_compare .cd-handle {
    /* change color of svg handle in default state - usually same as default link colour */
    background-color: #1a94df !important;

}

.fcbox_sc_compare .cd-handle.draggable {
    /* change handle color when element is active */
    background-color: #445b7c !important;
}



/* FN-PAGINATION */

/* fn-pagination: wordpress settings */

.pagenavigation {
    position: relative;
	display: block;
    margin: 0;
    padding: 0;
}

.pagenavigation .fcbox_pagination {
    padding: 0 0 3em 0;
}


/* fn-pagination: fcbox_pagination */

.fcbox_pagination {
    position: relative;
    display: block;
    font-family: 'Arial', sans-serif;
    font-size: 1rem;
    line-height: 1em;
    text-align: center;
    color: var(--color-text);
    cursor: default;
    -webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.fcbox_pagination a,
.fcbox_pagination .current,
.fcbox_pagination .elipsis,
.fcbox_pagination .next {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    padding: .3em .5em .3em .5em;
    margin: 0 .2em .4em .2em;
    font-family: inherit;
    text-align: center;
    color: inherit;
    border: solid 1px;
    border-radius: .2em;
    transition: background-color .1s ease, border-color .1s ease, color .1s ease;
}

.fcbox_pagination a:hover {
    color: #fff;
    background: var(--color-link);
    border-color: var(--color-link);
    transition: background-color 0s ease, border-color 0s ease, color 0s ease;
}

.fcbox_pagination .current {
    color: #fff;
    background: var(--color-text);
    border-color: var(--color-text);
}

.fcbox_pagination .elipsis {
    padding: 0;
    color: inherit;
    border: none;
}

.fcbox_pagination .next,
.fcbox_pagination .next.disabled:hover {
    min-width: 3.5em;
    color: #fff;
    background: var(--color-link);
    border-color: var(--color-link);
    margin-left: 1em;
    margin-right: 1em;
    padding-right: 1.2em;
    text-transform: lowercase;
    font-weight: 500;
}

.fcbox_pagination .next:hover {
    background: var(--color-text);
    border-color: var(--color-text);
}

.fcbox_pagination .next.disabled {
    opacity: .2;
}

.fcbox_pagination .next:after,
.fcbox_pagination .next.disabled:hover:after {
    content: '>';
    position: absolute;
    margin: 0 0 0 .5em;
    transition: margin .3s ease;
    transform: scaleX(.7);
}

.fcbox_pagination .next:hover:after {
    margin: 0 0 0 1em;
}

.fcbox_pagination .pre_label {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    margin: 0 .5em .4em .5em;
    padding: 0;
    color: inherit;
    font-family: inherit;
    font-size: 1em;
    font-weight: normal;
}


/* SC-FOOTNOTE */

.fcbox_sc_footnote {
    position: relative;
    overflow: visible;
    display: inline-block;
    padding: 0;
    font-family: sans-serif;
    font-size: .8em;
    font-weight: normal;
    color: var(--color-link);
    cursor: pointer;
    word-break: keep-all;
    -webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
    transform: background-color .3s ease;
}

.fcbox_sc_footnote input {
   display: none;
}

.fcbox_sc_footnote .title {
    position: relative;
    display: inline;
    margin: 0;
    padding: .3em .5em .3em .5em;
    font-weight: normal;
    box-shadow: inset 0px 0px 0px 1px #c8e9f9;
}

.fcbox_sc_footnote:hover .title,
.fcbox_sc_footnote input:checked ~ .title
{
    color: #fff;
    background: var(--color-link);
    box-shadow: inset 0px 0px 0px 1px #1aa1e8;
}

.fcbox_sc_footnote .note {
    z-index: 10;
    position: relative;
    display: none;
    margin: 0 .5em 0 0;
    padding: .3em 0 .3em 1em;
    font-weight: normal;
    color: var(--color-text);
    background: #ffd800;
    cursor: default;
}

.fcbox_sc_footnote .note a {
    color: #fff;
    background: var(--color-text);
    padding: .3em .5em;
    cursor: pointer;
}

.fcbox_sc_footnote input:checked ~ .note {
    display: inline;
}

.fcbox_sc_footnote .note:before {
    content: attr(data-text);
    position: relative;
    display: inline;
    margin-right: 1em;
}


/* SC INSERT BUTTON */

.fcbox_sc_insert_button {
    position: relative;
    display: inline-block;
    padding: .8em 1.5em .8em 1.5em;
    margin: 0 0 1em 0;
    color: #fff;
    font-size: inherit !important;
    font-weight: bold;
    border-radius: .2em;
    background: var(--color-link);
    transition: background-color .2s ease;
}

.fcbox_sc_insert_button:hover {
    color: #fff;
    background: var(--color-link-hover);
}


/* --------------------- */
/* FCTB_THICKBOX Styles */


#fctb_thickbox .close:hover:after,
#fctb_thickbox .arrow:hover:after {
	color: var(--color-link) !important;
}

   
/* 
------------------------------
*/



i[class^="icon-"] {
    position: relative;
    display: inline-block;
    vertical-align: inherit;
    width: 1em;
    height: 1em;
    padding: 0;
    margin: 0;
    font-size: 1em;
    line-height: 1em;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-size: contain !important;
}

i[class^="icon-circle-"] {
    font-size: 1em;
    background-color: #fff;
    border-radius: 50%;
    background-size: 50% 50% !important;
    overflow: hidden;
}




i.icon-search {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 250.313 250.313'%3E%3Cpath d='M244.186 214.604l-54.379-54.378c-.289-.289-.628-.491-.93-.76 10.7-16.231 16.945-35.66 16.945-56.554C205.822 46.075 159.747 0 102.911 0S0 46.075 0 102.911c0 56.835 46.074 102.911 102.91 102.911 20.895 0 40.323-6.245 56.554-16.945.269.301.47.64.759.929l54.38 54.38c8.169 8.168 21.413 8.168 29.583 0 8.168-8.169 8.168-21.413 0-29.582zm-141.275-44.458c-37.134 0-67.236-30.102-67.236-67.235 0-37.134 30.103-67.236 67.236-67.236 37.132 0 67.235 30.103 67.235 67.236s-30.103 67.235-67.235 67.235z' fill='rgba(0,0,0,1)' fill-rule='evenodd' clip-rule='evenodd'/%3E%3C/svg%3E");
}

i.icon-arrow-right {
    font-size: 1.4em;
    padding-top: .02em;
    background-image: url("data:image/svg+xml,%3Csvg width='1792' height='1792' fill='rgba(0,0,0,1)' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1171 960q0 13-10 23l-466 466q-10 10-23 10t-23-10l-50-50q-10-10-10-23t10-23l393-393-393-393q-10-10-10-23t10-23l50-50q10-10 23-10t23 10l466 466q10 10 10 23z'/%3E%3C/svg%3E");
}

i.icon-arrow-down {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="rgba(0,0,0,.5)" d="M 3.71875 7.78125 L 2.28125 9.21875 L 11.28125 18.21875 L 12 18.90625 L 12.71875 18.21875 L 21.71875 9.21875 L 20.28125 7.78125 L 12 16.0625 L 3.71875 7.78125 z" /></svg>');
}


i.icon-menu {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='110 110 840 715'%3E%3Cpath d='M142 115h776a33 33 0 0 1 33 33v80c0 8-2 15-7 21-6 9-16 14-27 14H162l-18-1a33 33 0 0 1-29-34v-71c0-7 0-14 2-20 4-11 14-20 25-22ZM484 394h21l412-1c6 1 13 2 18 5 10 6 16 17 16 28v78c0 6 0 12-3 17-4 11-15 19-26 20H493c-6 0-13-1-18-5-10-6-16-17-16-28v-73c0-7 0-15 3-21 4-10 12-17 22-20ZM257 672h661a33 33 0 0 1 33 33v80c0 8-2 15-7 21-6 9-16 14-27 14H263c-6 0-12-2-18-5-9-6-16-17-15-28l-1-80c0-6 1-12 4-18 5-9 14-15 24-17Z'/%3E%3C/svg%3E");
}


i.icon-close {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 1000'%3E%3Cpath d='M33.2 53.3l15.5-15.5H33.2l7.7 7.7 908.9 908.9 7.7 7.7v-15.5L942 962.1h15.5l-7.7-7.7L40.9 45.6l-7.7-7.7v15.4zM17.7 37.8L10 45.6l7.7 7.7 7.7 7.7 908.9 908.9 7.7 7.7 7.7 7.7 7.7-7.7 15.5-15.5 7.7-7.7-7.7-7.7-7.7-7.7L56.4 30.1l-7.7-7.7-7.7-7.7-7.7 7.7-15.6 15.4zm933.7 0l15.5 15.5V37.8l-7.7 7.7-909 908.9-7.7 7.7H58l-15.5-15.5v15.5l7.7-7.7L959.1 45.6l7.7-7.7h-15.4v-.1zm15.4-15.4l-7.7-7.7-7.7 7.7-7.7 7.7L34.7 939l-7.7 7.7-7.7 7.7 7.7 7.7 15.5 15.5 7.7 7.7 7.7-7.7 7.7-7.7L974.5 61l7.7-7.7 7.7-7.7-7.7-7.7-15.4-15.5z'/%3E%3C/svg%3E");
}


i.icon-chevron-left {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='370.81' height='370.81'%3E%3Cpath d='M292.92 24.85L268.78 0 77.89 185.4l190.89 185.41 24.14-24.85L127.64 185.4z'/%3E%3C/svg%3E");
}

i.icon-chevron-right {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='370.81' height='370.81'%3E%3Cpath fill='none' d='M-1-1h582v402H-1z'/%3E%3Cg%3E%3Cpath d='M77.9 345.96l24.14 24.85 190.89-185.4L102.03.01 77.9 24.84l165.28 160.56z'/%3E%3C/g%3E%3C/svg%3E");
}

i.icon-facebook-circle { 
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3C!--  --%3E%3Csvg   xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 167.657 167.657' style='enable-background:new 0 0 167.657 167.657;' xml:space='preserve'%3E%3Cg%3E%3Cpath style='fill:%23010002;' d='M83.829,0.349C37.532,0.349,0,37.881,0,84.178c0,41.523,30.222,75.911,69.848,82.57v-65.081H49.626 v-23.42h20.222V60.978c0-20.037,12.238-30.956,30.115-30.956c8.562,0,15.92,0.638,18.056,0.919v20.944l-12.399,0.006 c-9.72,0-11.594,4.618-11.594,11.397v14.947h23.193l-3.025,23.42H94.026v65.653c41.476-5.048,73.631-40.312,73.631-83.154 C167.657,37.881,130.125,0.349,83.829,0.349z'/%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3C/svg%3E");
}

i.icon-instagram-circle {
    background-image: url("data:image/svg+xml,%3Csvg height='512pt' viewBox='0 0 512 512' width='512pt' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m305 256c0 27.0625-21.9375 49-49 49s-49-21.9375-49-49 21.9375-49 49-49 49 21.9375 49 49zm0 0'/%3E%3Cpath d='m370.59375 169.304688c-2.355469-6.382813-6.113281-12.160157-10.996094-16.902344-4.742187-4.882813-10.515625-8.640625-16.902344-10.996094-5.179687-2.011719-12.960937-4.40625-27.292968-5.058594-15.503906-.707031-20.152344-.859375-59.402344-.859375-39.253906 0-43.902344.148438-59.402344.855469-14.332031.65625-22.117187 3.050781-27.292968 5.0625-6.386719 2.355469-12.164063 6.113281-16.902344 10.996094-4.882813 4.742187-8.640625 10.515625-11 16.902344-2.011719 5.179687-4.40625 12.964843-5.058594 27.296874-.707031 15.5-.859375 20.148438-.859375 59.402344 0 39.25.152344 43.898438.859375 59.402344.652344 14.332031 3.046875 22.113281 5.058594 27.292969 2.359375 6.386719 6.113281 12.160156 10.996094 16.902343 4.742187 4.882813 10.515624 8.640626 16.902343 10.996094 5.179688 2.015625 12.964844 4.410156 27.296875 5.0625 15.5.707032 20.144532.855469 59.398438.855469 39.257812 0 43.90625-.148437 59.402344-.855469 14.332031-.652344 22.117187-3.046875 27.296874-5.0625 12.820313-4.945312 22.953126-15.078125 27.898438-27.898437 2.011719-5.179688 4.40625-12.960938 5.0625-27.292969.707031-15.503906.855469-20.152344.855469-59.402344 0-39.253906-.148438-43.902344-.855469-59.402344-.652344-14.332031-3.046875-22.117187-5.0625-27.296874zm-114.59375 162.179687c-41.691406 0-75.488281-33.792969-75.488281-75.484375s33.796875-75.484375 75.488281-75.484375c41.6875 0 75.484375 33.792969 75.484375 75.484375s-33.796875 75.484375-75.484375 75.484375zm78.46875-136.3125c-9.742188 0-17.640625-7.898437-17.640625-17.640625s7.898437-17.640625 17.640625-17.640625 17.640625 7.898437 17.640625 17.640625c-.003906 9.742188-7.898437 17.640625-17.640625 17.640625zm0 0'/%3E%3Cpath d='m256 0c-141.363281 0-256 114.636719-256 256s114.636719 256 256 256 256-114.636719 256-256-114.636719-256-256-256zm146.113281 316.605469c-.710937 15.648437-3.199219 26.332031-6.832031 35.683593-7.636719 19.746094-23.246094 35.355469-42.992188 42.992188-9.347656 3.632812-20.035156 6.117188-35.679687 6.832031-15.675781.714844-20.683594.886719-60.605469.886719-39.925781 0-44.929687-.171875-60.609375-.886719-15.644531-.714843-26.332031-3.199219-35.679687-6.832031-9.8125-3.691406-18.695313-9.476562-26.039063-16.957031-7.476562-7.339844-13.261719-16.226563-16.953125-26.035157-3.632812-9.347656-6.121094-20.035156-6.832031-35.679687-.722656-15.679687-.890625-20.6875-.890625-60.609375s.167969-44.929688.886719-60.605469c.710937-15.648437 3.195312-26.332031 6.828125-35.683593 3.691406-9.808594 9.480468-18.695313 16.960937-26.035157 7.339844-7.480469 16.226563-13.265625 26.035157-16.957031 9.351562-3.632812 20.035156-6.117188 35.683593-6.832031 15.675781-.714844 20.683594-.886719 60.605469-.886719s44.929688.171875 60.605469.890625c15.648437.710937 26.332031 3.195313 35.683593 6.824219 9.808594 3.691406 18.695313 9.480468 26.039063 16.960937 7.476563 7.34375 13.265625 16.226563 16.953125 26.035157 3.636719 9.351562 6.121094 20.035156 6.835938 35.683593.714843 15.675781.882812 20.683594.882812 60.605469s-.167969 44.929688-.886719 60.605469zm0 0'/%3E%3C/svg%3E");
}


i.icon-user {
    background-image: url("data:image/svg+xml,%3Csvg width='1792' height='1792' fill='%23000000' viewBox='0 0 1792 1792' xmlns='http://www.w3.org/2000/svg'><path d='M1600 1405q0 120-73 189.5t-194 69.5h-874q-121 0-194-69.5t-73-189.5q0-53 3.5-103.5t14-109 26.5-108.5 43-97.5 62-81 85.5-53.5 111.5-20q9 0 42 21.5t74.5 48 108 48 133.5 21.5 133.5-21.5 108-48 74.5-48 42-21.5q61 0 111.5 20t85.5 53.5 62 81 43 97.5 26.5 108.5 14 109 3.5 103.5zm-320-893q0 159-112.5 271.5t-271.5 112.5-271.5-112.5-112.5-271.5 112.5-271.5 271.5-112.5 271.5 112.5 112.5 271.5z'/%3E%3C/svg%3E");
}

i.icon-spinner {
 background-image: url("data:image/svg+xml,%3Csvg width='1792' height='1792' fill='%23000000' viewBox='0 0 1792 1792' xmlns='http://www.w3.org/2000/svg'><path d='M526 1394q0 53-37.5 90.5t-90.5 37.5q-52 0-90-38t-38-90q0-53 37.5-90.5t90.5-37.5 90.5 37.5 37.5 90.5zm498 206q0 53-37.5 90.5t-90.5 37.5-90.5-37.5-37.5-90.5 37.5-90.5 90.5-37.5 90.5 37.5 37.5 90.5zm-704-704q0 53-37.5 90.5t-90.5 37.5-90.5-37.5-37.5-90.5 37.5-90.5 90.5-37.5 90.5 37.5 37.5 90.5zm1202 498q0 52-38 90t-90 38q-53 0-90.5-37.5t-37.5-90.5 37.5-90.5 90.5-37.5 90.5 37.5 37.5 90.5zm-964-996q0 66-47 113t-113 47-113-47-47-113 47-113 113-47 113 47 47 113zm1170 498q0 53-37.5 90.5t-90.5 37.5-90.5-37.5-37.5-90.5 37.5-90.5 90.5-37.5 90.5 37.5 37.5 90.5zm-640-704q0 80-56 136t-136 56-136-56-56-136 56-136 136-56 136 56 56 136zm530 206q0 93-66 158.5t-158 65.5q-93 0-158.5-65.5t-65.5-158.5q0-92 65.5-158t158.5-66q92 0 158 66t66 158z'/%3E%3C/svg%3E");   
}


i.icon-circle-facebook {
    background-image: url('images/global/socmedia/socmedia_facebook.svg');
}
i.icon-circle-instagram {
    background-image: url('images/global/socmedia/socmedia_instagram.svg');
}
i.icon-circle-snapchat {
    background-image: url('images/global/socmedia/socmedia_snapchat.svg');
}
i.icon-circle-tiktok {
    background-image: url('images/global/socmedia/socmedia_tiktok.svg');
}
i.icon-circle-twitter {
    background-image: url('images/global/socmedia/socmedia_twitter.svg');
}
i.icon-circle-vimeo {
    background-image: url('images/global/socmedia/socmedia_twitter.svg');
}
i.icon-circle-youtube {
    background-image: url('images/global/socmedia/socmedia_youtube.svg');
}
i.icon-circle-pinterest {
    background-image: url('images/global/socmedia/socmedia_pinterest.svg');
}

/* ------------------------ */
/* @GRID */

/* 
to calculate width of each item use:
( 100% - ( ((columns x 2) -2) * space em ) ) / columns

max widths for sizes:
breakpoint3: 1000px;
breakpoint2: 800px;
breakpoint1: 500px;
*/


.fcgrid4 {
    --grid-space: 2em;
}

.fcgrid4 .column {
    width: calc( (100% - ( 6 * var(--grid-space) ) ) /4  );
    margin-left: var(--grid-space);
    margin-right: var(--grid-space);
    /*background:rgba(0,0,0,.03);*/
}

@media screen and (min-width: 1460px){ /* 4 columns */
    
    .fcgrid4 .column:nth-child(4n+1) { margin-left: 0; }
    .fcgrid4 .column:nth-child(4n+0) { margin-right: 0; }
    
}


@media screen and (min-width: 1100px) and (max-width: 1460px){ /* 3 columns */
    
    .fcgrid4 .column {
        width: calc( (100% - ( 4 * var(--grid-space) ) ) /3  );
    }
    
    .fcgrid4 .column:nth-child(3n+1) { margin-left: 0; }
    .fcgrid4 .column:nth-child(3n+0) { margin-right: 0; }
}

@media screen and (min-width: 600px) and (max-width: 1100px){ /* 2 columns */
    
    .fcgrid4 .column {
        width: calc( (100% - ( 2 * var(--grid-space) ) ) /2  );
    }
    
    .fcgrid4 .column:nth-child(2n+1) { margin-left: 0; }
    .fcgrid4 .column:nth-child(2n+0) { margin-right: 0; }
}

@media screen and (max-width: 600px){ /* 1 column */
    
    .fcgrid4 .column {
        width: 100%;
        margin-left: 0;
        margin-right: 0;
    }
}



/* ----------------------------------- */
/* @PAGINATE - Load More version */

.fc_paginate {
    --color-paginate-regular: #aaa;
    position: relative;
    display: block;
    font-size: 5.7px;
}

.fc_paginate .numbers {
    position: relative;
    display: block;
    margin: 0 0 1rem 0;
    padding: 0;
    text-align: center;
    overflow: hidden;
    overflow-x: scroll;
}


/* width */
.fc_paginate .numbers::-webkit-scrollbar {
	width: 15px;
}

.fc_paginate .numbers:hover::-webkit-scrollbar {
	width: 15px;
}

/* Track */
.fc_paginate .numbers::-webkit-scrollbar-track {
	background: rgba(0,0,0, 0);
}

.fc_paginate .numbers:hover::-webkit-scrollbar-track {
	background: rgba(0,0,0, 0);
}

/* Handle */
.fc_paginate .numbers::-webkit-scrollbar-thumb {
  	background: rgba(0,0,0, 0);
	border-radius: .2em;
	border: solid 5px #fff;
    border-right: none;
    border-left: none;
}

.fc_paginate .numbers:hover::-webkit-scrollbar-thumb {
  	background: rgba(0,0,0, .3);
}

/* Handle on hover */
.fc_paginate .numbers::-webkit-scrollbar-thumb:hover {
  background: rgba(0,0,0, .5);
}


.fc_paginate .numbers .scrollbox {
    position: relative;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    flex-flow: row nowrap;
    margin: 0 auto 0 auto;
    padding: 0;
    cursor: grab;
}

.fc_paginate .numbers a {
    position: relative;
    display: block;
    width: 3em;
    margin: 0 .5em .1em 0;
    padding: 0;
    font-size: 3em;
    line-height: 3em;
    text-align: center;
    color: var(--color-paginate-regular);
    border: solid 1px var(--color-paginate-regular);
    border-radius: .3em;
    transition: background-color .2s ease, border-color .2s ease;
    cursor: grab;
}

.fc_paginate .numbers a:last-child {
    margin-right: 0;
}

.fc_paginate .numbers a:hover {
    color: #fff;
    background: var(--color-link);
    border-color: var(--color-link);
}

.fc_paginate .numbers a.current {
    color: #fff;
    background: var(--color-text);
    border-color: var(--color-text);
    pointer-events: none;
}

.fc_paginate .loadmore {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 2.5em 0 2.5em 0;
    margin: 0 0 1rem 0;
    text-align: center;
    color: #fff;
    font-weight: bold;
    font-size: 2.5em;
    text-transform: uppercase;
    background: var(--color-link);
    border-radius: .3em;
    transition: filter .3s ease;
}

.fc_paginate .loadmore:hover {
    filter:brightness(1.3);
}

.fc_paginate .loadmore.disabled,
.fc_paginate .loadmore.disabled:hover {
    padding-top: 0;
    font-size: 1rem;
    color: #ccc;
    background: none;
    filter: none;
}


@media screen and ( min-width: 650px ){ /* sadly css variables dont work with @media queries */
    
    .fc_paginate {
        font-size: 5.7px;
    }
}



/* ----------------------------------- */
/* @FCSB_SHAREBUTTONS */

.fcsb_sharebuttons.mobile {
    position: relative;
    display: block;
    margin: 0 0 2em 0;
    text-align: left;
}

.fcsb_sharebuttons.mobile.center {
    text-align: center;
}

.fcsb_sharebuttons .box {
    position: relative;
    display: inline-grid;
    grid-gap: 1em;
    grid-template-columns: 0fr 1fr 1fr 1fr;
    align-items: center;
    justify-items: center;
    width: auto;
    font-size: .8rem;
    line-height: 1em;
    text-align: left;
    padding: .5em .7em .3em 1.5em;
    background: var(--color-light);
    border-radius: 20em;
    box-sizing: border-box;
    
    -webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.fcsb_sharebuttons .title {
    position: relative;
    display: inline-block;
    margin: -.3em -.2em 0 0;
    color: var(--color-link);
    font-family: "Anton", sans-serif;
    font-size: .8em;
    text-transform: uppercase;
    letter-spacing: .02em;
    opacity: .7;
}

.fcsb_sharebuttons a {
    position: relative;
    display: inline-block;
    font-size: 2.2em;
    line-height: 1em;
    transform: scale(1);
    transition: transform .2s ease;
    will-change: transform;
}

.fcsb_sharebuttons a:hover {
    transform: scale(1.1);
}

.fcsb_sharebuttons a i {
    background-color: var(--color-hilight-invert);
    filter: invert();
    transition: background-color .2s ease;
}

.fcsb_sharebuttons a:hover i {
    background-color: #fff;
}

/* desktop */

.fcsb_sharebuttons.desktop {
    z-index: 0;
    position: absolute;
    display: none;
    top: 0;
    bottom: 0;
    right: calc( var(--scrollbarwidthhalf) + 50% - 50vw + (var(--fullpagewidth) - 800px)/2 );
    margin: 0 0 2em 0;
}

.fcsb_sharebuttons.desktop .box {
    position: -webkit-sticky;
    position: sticky;
    top: 4em;
    display: inline-grid;
    grid-gap: .8em;
    grid-template-columns: 0fr;
    grid-template-rows: 0fr 1fr 1fr 1fr;
    padding: 1.5em .5em .5em .5em;
}

.fcsb_sharebuttons.desktop .title {
    transform: rotate(90deg);
    padding: .6em 0 .7em 0;
    margin: 0 .1em 0 0;
    font-size: .9em;
}

/* desktop_pad - use for padding that only shows on desktop version. ie. when mobile sharebuttons aren't visible */

.desktop_pad {
    display: none;
}


@media screen and ( min-width: 820px ){
    
    .fcsb_sharebuttons.desktop {
        display: inline-block;
    }
    
    .fcsb_sharebuttons.mobile {
        display: none;
    }
    
    .desktop_pad {
        display: block;
    }
}



