._column[content="tipgoals"] {
    width: 100%;
    height: auto;
}

body:not([hasTIPGOALS="1"]) ._column[content="tipgoals"],

body[goldshow-status="countdown_started"] ._column[content="tipgoals"],
body[goldshow-status="countdown_complete"] ._column[content="tipgoals"],
body[goldshow-status="show_started"] ._column[content="tipgoals"],
body[goldshow-status="finished"] ._column[content="tipgoals"],

._column[content="tipgoals"][active="0"]
{
    display: none;
}

._column[content="tipgoals"] ._column-header-row {
    font-size: 0;
}

._column[content="tipgoals"] ._column-header-row ._column-title {
    width: calc(100% - 70px);
    overflow: hidden;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

._column[content="tipgoals"] .tipgoals-header-row {
    display: block;
    height: 26px;
    margin-bottom: 4px;
    font-size: 0;
}

._column[content="tipgoals"] .tipgoals-header-row .tipgoals-title {
    display: inline-block;
    width: 100%;
    height: 20px;
    font-size: 16px;
    color: #d8d8d8;
    font-family: 'Segoe UI', 'Arial';
    font-weight: 600;
    text-transform: uppercase;
    vertical-align: top;
}

._column[content="tipgoals"] .tipgoals-header-row[content="value"] .tipgoals-title {
    width: auto;
    margin-right: 8px;
}

._column[content="tipgoals"] .tipgoals-header-row[content="value"],
._column[content="tipgoals"] .tipgoals-header-row[content="lastgoal"]
{
    margin-right: 6px;
    margin-left: 6px;
    text-align: center;
}

._column[content="tipgoals"] label {
    display: block;
    margin: 0;
}

@media only screen and (min-width: 801px) and (max-width: 1000px)
{

    ._column[content="tipgoals"] .tipgoals-header-row[content="value"]
    {
        text-align: left;
    }
    ._column[content="tipgoals"] .tipgoals-header-row[content="lastgoal"]
    {
        text-align: right;
    }

}


/****************************************************************************************************
    the update table
****************************************************************************************************/
/* credits */
._column[content="tipgoals"] table input[type="number"],
._column[content="tipgoals"] table tr td:nth-child(1),
._column[content="tipgoals"] table tr td:nth-child(3) {
    width: 70px;
}



section[name="tipgoal-edit"],
section[name="tipgoal-addnew"],
body[clientID="589"] section[name="tipgoal-edit"]:not([goals="0"]) section[name="tipgoal-addnew-button"]
{
    display: none;
}



/****************************************************************************************************
    the update table
****************************************************************************************************/

:root {
	--tipGoalsCurrentTarget: 1;
	--tipGoalsTargets: 5;
	--tipGoalsHeight: 120px;
	--tipGoalsTargetWidth: 40%;
	--tipGoalsTitleHeight: 40px;
	--tipGoalsStageHeight: 30px;
	--tipGoalsColour: #DAA520;
	--tippingPageColour: #171717;
	--tippingPercentBackgroundPageColour: #ffffff20;
}


.tip-goals-beta {
	display: none;
	margin-bottom: 8px;
	color: #999999;
	font-size: 10px;
	text-transform: uppercase;


}


/************************************************************************************************************/

section[name="tipgoal-chart"] {
	position: relative;
	width: 100%;
	margin: 0 auto;
	text-align: left;
	font-size: 0;
	vertical-align: top;
}

.tipgoals-text {
    color: var(--tipGoalsColour);
}

.tip-goals:hover {
	cursor: pointer;
}

.tip-goals-target,
.tip-goals-target .tip-goals-container
{
	font-size: 0;
}

.tip-goals-target {
	display: inline-block;
	width: calc((100% - var(--tipGoalsTargetWidth)) / (var(--tipGoalsTargets) - 1));
	height: var(--tipGoalsHeight);
    background: #00000015;
	overflow: hidden;
	vertical-align: top;

	transition-property: width;
	transition-duration: 0.4s;
	transition-timing-function: ease-out;
}

section[name="tipgoal-chart"] .tip-goals-target .tip-goals-target-column[align="left"] {
	height: var(--tipGoalsHeight);
	vertical-align: bottom;
}

.tip-goals-target .tip-goals-target-column[align="right"] {
	display: none;
}

section[name="tipgoal-chart"] .tip-goals-stage {
	display: inline-block;
	height: 12px;
	padding: 8px;
	color: #ffffff;
	font-size: 10px;
	line-height: 1;
	text-transform: uppercase;
	text-align: center;
}

section[name="tipgoal-chart"] .tip-goals-headers {
	position: relative;
	height: 30px;
	margin-top: calc(0px - (var(--tipGoalsHeight)));
	margin-bottom: calc(var(--tipGoalsHeight) - 30px);
}

section[name="tipgoal-chart"] .tip-goals-headers .tip-goals-stage {
	font-weight: bold;
}

section[name="tipgoal-chart"] .tip-goals-headers .tip-goals-stage:nth-child(1) {
	opacity: .3;
}

section[name="tipgoal-chart"] .tip-goals-headers .tip-goals-stage:nth-child(2) {
	margin-left: var(--tipGoalsTargetWidth);
	opacity: .6;
}

.tip-goals-target .tip-goals-title {
	display: flex;
	max-width: 80%;
	height: 24px;
	margin: 8px auto;
	color: #ffffff;
	justify-content: center;
	/* align horizontal */
	align-items: center;
	/* align vertical */
	font-size: 10px;
	line-height: 1;
	text-transform: uppercase;
	text-align: center;
}

.tip-goals-target .tip-goals-content
{
	display: flex;
	width: 100%;
	height: 100%;
	align-items: center;
	/* align vertical */
}

.tip-goals-target .tip-goals-target-column[align="right"] .tip-goals-title
{
	display: block;
	width: 100%;
	max-width: none;
	height: auto;
	margin: 0 0 10px 0;
	font-size: 12px;
	line-height: 1;
	text-align: left;
	font-size: 24px;
}

.tip-goals-target .tip-goals-target-column[align="right"] .tip-goals-title small
{
	line-height: 2;
	font-size: 12px;
	opacity: .6;
}

.tip-goals-target .tip-goals-container {
	display: block;
	width: 100%;
	width: 60%;
	height: calc(var(--tipGoalsHeight) - (var(--tipGoalsTitleHeight) + var(--tipGoalsStageHeight)));
	margin-left: 20%;
}

.tip-goals-container .tip-goals-percentage-holder {
	position: relative;
	display: block;
	width: 100%;
	height: calc(var(--tipGoalsHeight) - (var(--tipGoalsTitleHeight) + var(--tipGoalsStageHeight)));
	margin-top: calc(0px - (var(--tipGoalsHeight) - (var(--tipGoalsTitleHeight) + var(--tipGoalsStageHeight))));
}

.tip-goals-container .tip-goals-percentage-holder:nth-child(1) {
	margin-top: 0;
}

.tip-goals-target .tip-goals-percentage {
	stroke: var(--tipGoalsColour);
	fill: none;
	stroke-width: 2.8;
	stroke-linecap: round;
	animation: progress 1s ease-out forwards;
	vertical-align: top;
}

.tip-goals-target .tip-goals-percentage-back {
	stroke: var(--tippingPercentBackgroundPageColour);
	fill: none;
	stroke-width: 2.8;
	stroke-linecap: round;
}

.tip-goals-target .tip-goals-credits-needed-holder {
	position: relative;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	margin-top: -100%;
	margin-top: -80px;
	margin-top: calc(0px - var(--tipGoalsHeight));
	color: var(--tipGoalsColour);
	text-align: center;
	justify-content: center;
	/* align horizontal */
	align-items: center;
	/* align vertical */
}

.tip-goals-target .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text
{
	display: block;
	width: 100%;
	max-width: none;
	height: auto;
	font-size: 2rem;
	line-height: .3em;
	text-align: center;
}

.tip-goals-target .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text small
{
    display: block;
    opacity: .6;
    margin: 10px 0 -10px 0;
	font-size: 8px;
    line-height: 8px;
	text-transform: uppercase;
}

.tip-goals-target .tip-goals-container .material-icons
{
	display: none;
	width: 100%;
	height: 100%;
	margin-top: calc(0px - (var(--tipGoalsHeight) - (var(--tipGoalsTitleHeight) + var(--tipGoalsStageHeight))));
	color: var(--tipGoalsColour);
	font-size: 1.4rem;
	justify-content: center;
	/* align horizontal */
	align-items: center;
	/* align vertical */
	text-align: center;
	vertical-align: middle;
	overflow: hidden;
}

/********************************************************************************************************************************************************************************************************
	current goal
********************************************************************************************************************************************************************************************************/

section[name="tipgoal-chart"][goals="1"]
{
	--tipGoalsTargetWidth: 100%;
}

section[name="tipgoal-chart"][goals="2"]
{
	--tipGoalsTargetWidth: 80%;
}

section[name="tipgoal-chart"][goals="3"]
{
	--tipGoalsTargetWidth: 60%;
}

section[name="tipgoal-chart"][current="1"] .tip-goals-target:nth-child(1),
section[name="tipgoal-chart"][current="2"] .tip-goals-target:nth-child(2),
section[name="tipgoal-chart"][current="3"] .tip-goals-target:nth-child(3),
section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(4),
section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(5)
{
	width: var(--tipGoalsTargetWidth);
	height: var(--tipGoalsHeight);
	display: inline-block;
	background: #333333;
	background: #00000025;
}

section[name="tipgoal-chart"][current="1"] .tip-goals-target:nth-child(1) .tip-goals-target-column[align="left"],
section[name="tipgoal-chart"][current="2"] .tip-goals-target:nth-child(2) .tip-goals-target-column[align="left"],
section[name="tipgoal-chart"][current="3"] .tip-goals-target:nth-child(3) .tip-goals-target-column[align="left"],
section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(4) .tip-goals-target-column[align="left"],
section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(5) .tip-goals-target-column[align="left"]
{
	display: inline-block;
	width: 40%;
	vertical-align: top;
	height: 100%;
	height: var(--tipGoalsHeight);
}

section[name="tipgoal-chart"][current="1"] .tip-goals-target:nth-child(1) .tip-goals-container,
section[name="tipgoal-chart"][current="2"] .tip-goals-target:nth-child(2) .tip-goals-container,
section[name="tipgoal-chart"][current="3"] .tip-goals-target:nth-child(3) .tip-goals-container,
section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(4) .tip-goals-container,
section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(5) .tip-goals-container
{
	width: calc(100% - 20px);
	margin-top: 10px;
	margin-left: 10px;
	height: calc(var(--tipGoalsHeight) - 20px);
}

section[name="tipgoal-chart"][current="1"] .tip-goals-target:nth-child(1) .tip-goals-container .tip-goals-percentage-holder,
section[name="tipgoal-chart"][current="2"] .tip-goals-target:nth-child(2) .tip-goals-container .tip-goals-percentage-holder,
section[name="tipgoal-chart"][current="3"] .tip-goals-target:nth-child(3) .tip-goals-container .tip-goals-percentage-holder,
section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(4) .tip-goals-container .tip-goals-percentage-holder,
section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(5) .tip-goals-container .tip-goals-percentage-holder
{
	height: calc(var(--tipGoalsHeight) - 20px);
	margin-top: calc(0px - (var(--tipGoalsHeight) - 20px));
}

section[name="tipgoal-chart"][current="1"] .tip-goals-target:nth-child(1) .tip-goals-container .tip-goals-credits-needed-holder,
section[name="tipgoal-chart"][current="2"] .tip-goals-target:nth-child(2) .tip-goals-container .tip-goals-credits-needed-holder,
section[name="tipgoal-chart"][current="3"] .tip-goals-target:nth-child(3) .tip-goals-container .tip-goals-credits-needed-holder,
section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(4) .tip-goals-container .tip-goals-credits-needed-holder,
section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(5) .tip-goals-container .tip-goals-credits-needed-holder
{
	height: calc(var(--tipGoalsHeight) - 20px);
	margin-top: calc(0px - (var(--tipGoalsHeight) - 20px));
}

section[name="tipgoal-chart"][current="1"] .tip-goals-target:nth-child(1) .tip-goals-container .tip-goals-percentage-holder:nth-child(1),
section[name="tipgoal-chart"][current="2"] .tip-goals-target:nth-child(2) .tip-goals-container .tip-goals-percentage-holder:nth-child(1),
section[name="tipgoal-chart"][current="3"] .tip-goals-target:nth-child(3) .tip-goals-container .tip-goals-percentage-holder:nth-child(1),
section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(4) .tip-goals-container .tip-goals-percentage-holder:nth-child(1),
section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(5) .tip-goals-container .tip-goals-percentage-holder:nth-child(1)
{
	margin-top: 0;
}

section[name="tipgoal-chart"][current="1"] .tip-goals-target:nth-child(1) .tip-goals-target-column[align="right"],
section[name="tipgoal-chart"][current="2"] .tip-goals-target:nth-child(2) .tip-goals-target-column[align="right"],
section[name="tipgoal-chart"][current="3"] .tip-goals-target:nth-child(3) .tip-goals-target-column[align="right"],
section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(4) .tip-goals-target-column[align="right"],
section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(5) .tip-goals-target-column[align="right"]
{
	display: inline-block;
	width: 60%;
	height: 100%;
}

section[name="tipgoal-chart"][current="1"] .tip-goals-target:nth-child(1) .tip-goals-target-column[align="left"] .tip-goals-title,
section[name="tipgoal-chart"][current="2"] .tip-goals-target:nth-child(2) .tip-goals-target-column[align="left"] .tip-goals-title,
section[name="tipgoal-chart"][current="3"] .tip-goals-target:nth-child(3) .tip-goals-target-column[align="left"] .tip-goals-title,
section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(4) .tip-goals-target-column[align="left"] .tip-goals-title,
section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(5) .tip-goals-target-column[align="left"] .tip-goals-title,

section[name="tipgoal-chart"][current="1"] .tip-goals-target:nth-child(1) .tip-goals-target-column[align="left"] .tip-goals-stage,
section[name="tipgoal-chart"][current="2"] .tip-goals-target:nth-child(2) .tip-goals-target-column[align="left"] .tip-goals-stage,
section[name="tipgoal-chart"][current="3"] .tip-goals-target:nth-child(3) .tip-goals-target-column[align="left"] .tip-goals-stage,
section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(4) .tip-goals-target-column[align="left"] .tip-goals-stage,
section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(5) .tip-goals-target-column[align="left"] .tip-goals-stage
{
	display: none;
}

section[name="tipgoal-chart"][current="1"] .tip-goals-target[percentage="0"]:nth-child(1) .tip-goals-percentage,
section[name="tipgoal-chart"][current="2"] .tip-goals-target[percentage="0"]:nth-child(2) .tip-goals-percentage,
section[name="tipgoal-chart"][current="3"] .tip-goals-target[percentage="0"]:nth-child(3) .tip-goals-percentage,
section[name="tipgoal-chart"][current="4"] .tip-goals-target[percentage="0"]:nth-child(4) .tip-goals-percentage,
section[name="tipgoal-chart"][current="5"] .tip-goals-target[percentage="0"]:nth-child(5) .tip-goals-percentage
{
	display: none;
}

/*
*/

section[name="tipgoal-chart"][current="1"] .tip-goals-target:nth-child(1):hover .tip-goals-container,
section[name="tipgoal-chart"][current="2"] .tip-goals-target:nth-child(2):hover .tip-goals-container,
section[name="tipgoal-chart"][current="3"] .tip-goals-target:nth-child(3):hover .tip-goals-container,
section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(4):hover .tip-goals-container,
section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(5):hover .tip-goals-container
{
	width: 90%;
	margin-top: 0;
	margin-left: 5%;
	height: var(--tipGoalsHeight);

	transition-property: all;
	transition-duration: 0.2s;
	transition-timing-function: ease-out;
}

section[name="tipgoal-chart"][current="1"] .tip-goals-target:nth-child(1):hover .tip-goals-container .tip-goals-percentage-holder,
section[name="tipgoal-chart"][current="2"] .tip-goals-target:nth-child(2):hover .tip-goals-container .tip-goals-percentage-holder,
section[name="tipgoal-chart"][current="3"] .tip-goals-target:nth-child(3):hover .tip-goals-container .tip-goals-percentage-holder,
section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(4):hover .tip-goals-container .tip-goals-percentage-holder,
section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(5):hover .tip-goals-container .tip-goals-percentage-holder
{
	height: var(--tipGoalsHeight);
	margin-top: calc(0px - var(--tipGoalsHeight));

	transition-property: all;
	transition-duration: 0.2s;
	transition-timing-function: ease-out;
}

section[name="tipgoal-chart"][current="1"] .tip-goals-target:nth-child(1):hover .tip-goals-container .tip-goals-percentage-holder:nth-child(1),
section[name="tipgoal-chart"][current="2"] .tip-goals-target:nth-child(2):hover .tip-goals-container .tip-goals-percentage-holder:nth-child(1),
section[name="tipgoal-chart"][current="3"] .tip-goals-target:nth-child(3):hover .tip-goals-container .tip-goals-percentage-holder:nth-child(1),
section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(4):hover .tip-goals-container .tip-goals-percentage-holder:nth-child(1),
section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(5):hover .tip-goals-container .tip-goals-percentage-holder:nth-child(1)
{
	margin-top: 0;
}

section[name="tipgoal-chart"][current="1"] .tip-goals-target:nth-child(1):hover .tip-goals-container .tip-goals-credits-needed-holder,
section[name="tipgoal-chart"][current="2"] .tip-goals-target:nth-child(2):hover .tip-goals-container .tip-goals-credits-needed-holder,
section[name="tipgoal-chart"][current="3"] .tip-goals-target:nth-child(3):hover .tip-goals-container .tip-goals-credits-needed-holder,
section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(4):hover .tip-goals-container .tip-goals-credits-needed-holder,
section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(5):hover .tip-goals-container .tip-goals-credits-needed-holder
{
	height: var(--tipGoalsHeight);
	margin-top: calc(0px - (var(--tipGoalsHeight)));

	transition-property: all;
	transition-duration: 0.2s;
	transition-timing-function: ease-out;
}

section[name="tipgoal-chart"][current="1"] .tip-goals-target:nth-child(1):hover .tip-goals-container .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text,
section[name="tipgoal-chart"][current="2"] .tip-goals-target:nth-child(2):hover .tip-goals-container .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text,
section[name="tipgoal-chart"][current="3"] .tip-goals-target:nth-child(3):hover .tip-goals-container .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text,
section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(4):hover .tip-goals-container .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text,
section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(5):hover .tip-goals-container .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text
{
	font-size: 3.2rem;
	line-height: .18em;

	transition-property: all;
	transition-duration: 0.2s;
	transition-timing-function: ease-out;
}

section[name="tipgoal-chart"][current="1"] .tip-goals-target:nth-child(1):hover .tip-goals-container .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text small,
section[name="tipgoal-chart"][current="2"] .tip-goals-target:nth-child(2):hover .tip-goals-container .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text small,
section[name="tipgoal-chart"][current="3"] .tip-goals-target:nth-child(3):hover .tip-goals-container .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text small,
section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(4):hover .tip-goals-container .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text small,
section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(5):hover .tip-goals-container .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text small
{
	margin: 18px 0 -18px 0;

	transition-property: all;
	transition-duration: 0.2s;
	transition-timing-function: ease-out;
}

section[name="tipgoal-chart"][current="1"] .tip-goals-target:nth-child(1):hover .tip-goals-target-column[align="right"],
section[name="tipgoal-chart"][current="2"] .tip-goals-target:nth-child(2):hover .tip-goals-target-column[align="right"],
section[name="tipgoal-chart"][current="3"] .tip-goals-target:nth-child(3):hover .tip-goals-target-column[align="right"],
section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(4):hover .tip-goals-target-column[align="right"],
section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(5):hover .tip-goals-target-column[align="right"]
{
	padding-left: 10px;

	transition-property: all;
	transition-duration: 0.3s;
	transition-timing-function: ease-out;
}

/********************************************************************************************************************************************************************************************************
	completed goal
********************************************************************************************************************************************************************************************************/

section[name="tipgoal-chart"] .tip-goals-target[percentage="100"] .tip-goals-container .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text
{
	animation-name: fadeout;
	animation-delay: 0.5s;
    animation-duration: 0.5s;
    animation-timing-function: linear;
    animation-iteration-count: 1;
	animation-fill-mode: forwards;
}

section[name="tipgoal-chart"][current="1"] .tip-goals-target[percentage="100"]:nth-child(1) .tip-goals-container .material-icons,
section[name="tipgoal-chart"][current="2"] .tip-goals-target[percentage="100"]:nth-child(2) .tip-goals-container .material-icons,
section[name="tipgoal-chart"][current="3"] .tip-goals-target[percentage="100"]:nth-child(3) .tip-goals-container .material-icons,
section[name="tipgoal-chart"][current="4"] .tip-goals-target[percentage="100"]:nth-child(4) .tip-goals-container .material-icons,
section[name="tipgoal-chart"][current="5"] .tip-goals-target[percentage="100"]:nth-child(5) .tip-goals-container .material-icons
{
	display: flex;
	height: calc(var(--tipGoalsHeight) - 20px);
    margin-top: calc(0px - (var(--tipGoalsHeight) - 20px));
	font-size: 2.3rem;
	opacity: 0;

	animation-name: fadein;
    animation-delay: 1s;
    animation-duration: 0.5s;
    animation-timing-function: linear;
    animation-iteration-count: 1;
	animation-fill-mode: forwards;
}

@keyframes fadeout {
	0% {
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}

@keyframes fadein {
	0% {
        opacity: 0;
	}
	100% {
        opacity: 1;
	}
}


section[name="tipgoal-chart"][current="2"] .tip-goals-target:nth-child(1) .tip-goals-target-column[align="left"] .tip-goals-title,

section[name="tipgoal-chart"][current="3"] .tip-goals-target:nth-child(1) .tip-goals-target-column[align="left"] .tip-goals-title,
section[name="tipgoal-chart"][current="3"] .tip-goals-target:nth-child(2) .tip-goals-target-column[align="left"] .tip-goals-title,

section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(1) .tip-goals-target-column[align="left"] .tip-goals-title,
section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(2) .tip-goals-target-column[align="left"] .tip-goals-title,
section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(3) .tip-goals-target-column[align="left"] .tip-goals-title,

section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(1) .tip-goals-target-column[align="left"] .tip-goals-title,
section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(2) .tip-goals-target-column[align="left"] .tip-goals-title,
section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(3) .tip-goals-target-column[align="left"] .tip-goals-title,
section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(4) .tip-goals-target-column[align="left"] .tip-goals-title
{
	opacity: .3;
}

section[name="tipgoal-chart"][current="2"] .tip-goals-target:nth-child(1) .tip-goals-container,

section[name="tipgoal-chart"][current="3"] .tip-goals-target:nth-child(1) .tip-goals-container,
section[name="tipgoal-chart"][current="3"] .tip-goals-target:nth-child(2) .tip-goals-container,

section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(1) .tip-goals-container,
section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(2) .tip-goals-container,
section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(3) .tip-goals-container,

section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(1) .tip-goals-container,
section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(2) .tip-goals-container,
section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(3) .tip-goals-container,
section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(4) .tip-goals-container
{
	opacity: .3;
}

section[name="tipgoal-chart"][current="2"] .tip-goals-target:nth-child(1) .tip-goals-container .material-icons,

section[name="tipgoal-chart"][current="3"] .tip-goals-target:nth-child(1) .tip-goals-container .material-icons,
section[name="tipgoal-chart"][current="3"] .tip-goals-target:nth-child(2) .tip-goals-container .material-icons,

section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(1) .tip-goals-container .material-icons,
section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(2) .tip-goals-container .material-icons,
section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(3) .tip-goals-container .material-icons,

section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(1) .tip-goals-container .material-icons,
section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(2) .tip-goals-container .material-icons,
section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(3) .tip-goals-container .material-icons,
section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(4) .tip-goals-container .material-icons
{
	display: flex;
}

section[name="tipgoal-chart"][current="2"] .tip-goals-target:nth-child(1) .tip-goals-container .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text,

section[name="tipgoal-chart"][current="3"] .tip-goals-target:nth-child(1) .tip-goals-container .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text,
section[name="tipgoal-chart"][current="3"] .tip-goals-target:nth-child(2) .tip-goals-container .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text,

section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(1) .tip-goals-container .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text,
section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(2) .tip-goals-container .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text,
section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(3) .tip-goals-container .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text,

section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(1) .tip-goals-container .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text,
section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(2) .tip-goals-container .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text,
section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(3) .tip-goals-container .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text,
section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(4) .tip-goals-container .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text
{
	display: none;
}

section[name="tipgoal-chart"][current="2"] .tip-goals-target:nth-child(1) .tip-goals-percentage,

section[name="tipgoal-chart"][current="3"] .tip-goals-target:nth-child(1) .tip-goals-percentage,
section[name="tipgoal-chart"][current="3"] .tip-goals-target:nth-child(2) .tip-goals-percentage,

section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(1) .tip-goals-percentage,
section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(2) .tip-goals-percentage,
section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(3) .tip-goals-percentage,

section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(1) .tip-goals-percentage,
section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(2) .tip-goals-percentage,
section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(3) .tip-goals-percentage,
section[name="tipgoal-chart"][current="5"] .tip-goals-target:nth-child(4) .tip-goals-percentage
{
	animation: none;
}

/********************************************************************************************************************************************************************************************************
	upcoming goal
********************************************************************************************************************************************************************************************************/

section[name="tipgoal-chart"][current="1"] .tip-goals-target:nth-child(2) .tip-goals-target-column[align="left"] .tip-goals-title,
section[name="tipgoal-chart"][current="1"] .tip-goals-target:nth-child(3) .tip-goals-target-column[align="left"] .tip-goals-title,
section[name="tipgoal-chart"][current="1"] .tip-goals-target:nth-child(4) .tip-goals-target-column[align="left"] .tip-goals-title,
section[name="tipgoal-chart"][current="1"] .tip-goals-target:nth-child(5) .tip-goals-target-column[align="left"] .tip-goals-title,

section[name="tipgoal-chart"][current="2"] .tip-goals-target:nth-child(3) .tip-goals-target-column[align="left"] .tip-goals-title,
section[name="tipgoal-chart"][current="2"] .tip-goals-target:nth-child(4) .tip-goals-target-column[align="left"] .tip-goals-title,
section[name="tipgoal-chart"][current="2"] .tip-goals-target:nth-child(5) .tip-goals-target-column[align="left"] .tip-goals-title,

section[name="tipgoal-chart"][current="3"] .tip-goals-target:nth-child(4) .tip-goals-target-column[align="left"] .tip-goals-title,
section[name="tipgoal-chart"][current="3"] .tip-goals-target:nth-child(5) .tip-goals-target-column[align="left"] .tip-goals-title,

section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(5) .tip-goals-target-column[align="left"] .tip-goals-title
{
	opacity: .6;
}

section[name="tipgoal-chart"][current="1"] .tip-goals-target:nth-child(2) .tip-goals-container .tip-goals-percentage,
section[name="tipgoal-chart"][current="1"] .tip-goals-target:nth-child(3) .tip-goals-container .tip-goals-percentage,
section[name="tipgoal-chart"][current="1"] .tip-goals-target:nth-child(4) .tip-goals-container .tip-goals-percentage,
section[name="tipgoal-chart"][current="1"] .tip-goals-target:nth-child(5) .tip-goals-container .tip-goals-percentage,

section[name="tipgoal-chart"][current="2"] .tip-goals-target:nth-child(3) .tip-goals-container .tip-goals-percentage,
section[name="tipgoal-chart"][current="2"] .tip-goals-target:nth-child(4) .tip-goals-container .tip-goals-percentage,
section[name="tipgoal-chart"][current="2"] .tip-goals-target:nth-child(5) .tip-goals-container .tip-goals-percentage,

section[name="tipgoal-chart"][current="3"] .tip-goals-target:nth-child(4) .tip-goals-container .tip-goals-percentage,
section[name="tipgoal-chart"][current="3"] .tip-goals-target:nth-child(5) .tip-goals-container .tip-goals-percentage,

section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(5) .tip-goals-container .tip-goals-percentage
{
	display: none;
}

section[name="tipgoal-chart"][current="1"] .tip-goals-target:nth-child(2) .tip-goals-container .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text,
section[name="tipgoal-chart"][current="1"] .tip-goals-target:nth-child(3) .tip-goals-container .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text,
section[name="tipgoal-chart"][current="1"] .tip-goals-target:nth-child(4) .tip-goals-container .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text,
section[name="tipgoal-chart"][current="1"] .tip-goals-target:nth-child(5) .tip-goals-container .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text,

section[name="tipgoal-chart"][current="2"] .tip-goals-target:nth-child(3) .tip-goals-container .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text,
section[name="tipgoal-chart"][current="2"] .tip-goals-target:nth-child(4) .tip-goals-container .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text,
section[name="tipgoal-chart"][current="2"] .tip-goals-target:nth-child(5) .tip-goals-container .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text,

section[name="tipgoal-chart"][current="3"] .tip-goals-target:nth-child(4) .tip-goals-container .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text,
section[name="tipgoal-chart"][current="3"] .tip-goals-target:nth-child(5) .tip-goals-container .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text,

section[name="tipgoal-chart"][current="4"] .tip-goals-target:nth-child(5) .tip-goals-container .tip-goals-credits-needed-holder .tip-goals-content .tip-goals-text
{
	display: none;
}

/********************************************************************************************************************************************************************************************************
	percentage animations
********************************************************************************************************************************************************************************************************/

section[name="tipgoal-chart"][current="1"] .tip-goals-headers .tip-goals-stage:nth-child(1),
section[name="tipgoal-chart"][goals="1"][current="1"] .tip-goals-headers .tip-goals-stage:nth-child(2),
section[name="tipgoal-chart"][goals="2"][current="2"] .tip-goals-headers .tip-goals-stage:nth-child(2),
section[name="tipgoal-chart"][goals="3"][current="3"] .tip-goals-headers .tip-goals-stage:nth-child(2),
section[name="tipgoal-chart"][goals="4"][current="4"] .tip-goals-headers .tip-goals-stage:nth-child(2),
section[name="tipgoal-chart"][goals="5"][current="5"] .tip-goals-headers .tip-goals-stage:nth-child(2)
{
	display: none;
}

section[name="tipgoal-chart"] .tip-goals-headers .tip-goals-stage:nth-child(1)
{
	--targetWidth: calc((100% - var(--tipGoalsTargetWidth)) / (var(--tipGoalsTargets) - 1));
	width: calc(
		(var(--tipGoalsCurrentTarget) - 1) * var(--targetWidth)
	);
}

section[name="tipgoal-chart"] .tip-goals-headers .tip-goals-stage:nth-child(2)
{
	--targetWidth: calc((100% - var(--tipGoalsTargetWidth)) / (var(--tipGoalsTargets) - 1));
	width: calc(
		(var(--tipGoalsTargets) - var(--tipGoalsCurrentTarget)) * var(--targetWidth)
	);
}

/********************************************************************************************************************************************************************************************************
	screen sizes and max sizings
********************************************************************************************************************************************************************************************************/

@media only screen and (max-width : 1000px) {

	.tip-goals-target .tip-goals-target-column[align="right"] .tip-goals-title
	{
		font-size: 18px;
	}

	.tip-goals-target .tip-goals-target-column[align="right"] .tip-goals-title small
	{
		font-size: 10px;
	}

}

/********************************************************************************************************************************************************************************************************
	percentage animations
********************************************************************************************************************************************************************************************************/

@keyframes progress {
  0% {
    stroke-dasharray: 0 100;
  }
}
@keyframes progress0 { 0% { stroke-dasharray: 0 100; }}
@keyframes progress1 { 0% { stroke-dasharray: 1 100; }}
@keyframes progress2 { 0% { stroke-dasharray: 2 100; }}
@keyframes progress3 { 0% { stroke-dasharray: 3 100; }}
@keyframes progress4 { 0% { stroke-dasharray: 4 100; }}
@keyframes progress5 { 0% { stroke-dasharray: 5 100; }}
@keyframes progress6 { 0% { stroke-dasharray: 6 100; }}
@keyframes progress7 { 0% { stroke-dasharray: 7 100; }}
@keyframes progress8 { 0% { stroke-dasharray: 8 100; }}
@keyframes progress9 { 0% { stroke-dasharray: 9 100; }}
@keyframes progress10 { 0% { stroke-dasharray: 10 100; }}
@keyframes progress11 { 0% { stroke-dasharray: 11 100; }}
@keyframes progress12 { 0% { stroke-dasharray: 12 100; }}
@keyframes progress13 { 0% { stroke-dasharray: 13 100; }}
@keyframes progress14 { 0% { stroke-dasharray: 14 100; }}
@keyframes progress15 { 0% { stroke-dasharray: 15 100; }}
@keyframes progress16 { 0% { stroke-dasharray: 16 100; }}
@keyframes progress17 { 0% { stroke-dasharray: 17 100; }}
@keyframes progress18 { 0% { stroke-dasharray: 18 100; }}
@keyframes progress19 { 0% { stroke-dasharray: 19 100; }}
@keyframes progress20 { 0% { stroke-dasharray: 20 100; }}
@keyframes progress21 { 0% { stroke-dasharray: 21 100; }}
@keyframes progress22 { 0% { stroke-dasharray: 22 100; }}
@keyframes progress23 { 0% { stroke-dasharray: 23 100; }}
@keyframes progress24 { 0% { stroke-dasharray: 24 100; }}
@keyframes progress25 { 0% { stroke-dasharray: 25 100; }}
@keyframes progress26 { 0% { stroke-dasharray: 26 100; }}
@keyframes progress27 { 0% { stroke-dasharray: 27 100; }}
@keyframes progress28 { 0% { stroke-dasharray: 28 100; }}
@keyframes progress29 { 0% { stroke-dasharray: 29 100; }}
@keyframes progress30 { 0% { stroke-dasharray: 30 100; }}
@keyframes progress31 { 0% { stroke-dasharray: 31 100; }}
@keyframes progress32 { 0% { stroke-dasharray: 32 100; }}
@keyframes progress33 { 0% { stroke-dasharray: 33 100; }}
@keyframes progress34 { 0% { stroke-dasharray: 34 100; }}
@keyframes progress35 { 0% { stroke-dasharray: 35 100; }}
@keyframes progress36 { 0% { stroke-dasharray: 36 100; }}
@keyframes progress37 { 0% { stroke-dasharray: 37 100; }}
@keyframes progress38 { 0% { stroke-dasharray: 38 100; }}
@keyframes progress39 { 0% { stroke-dasharray: 39 100; }}
@keyframes progress40 { 0% { stroke-dasharray: 40 100; }}
@keyframes progress41 { 0% { stroke-dasharray: 41 100; }}
@keyframes progress42 { 0% { stroke-dasharray: 42 100; }}
@keyframes progress43 { 0% { stroke-dasharray: 43 100; }}
@keyframes progress44 { 0% { stroke-dasharray: 44 100; }}
@keyframes progress45 { 0% { stroke-dasharray: 45 100; }}
@keyframes progress46 { 0% { stroke-dasharray: 46 100; }}
@keyframes progress47 { 0% { stroke-dasharray: 47 100; }}
@keyframes progress48 { 0% { stroke-dasharray: 48 100; }}
@keyframes progress49 { 0% { stroke-dasharray: 49 100; }}
@keyframes progress50 { 0% { stroke-dasharray: 50 100; }}
@keyframes progress51 { 0% { stroke-dasharray: 51 100; }}
@keyframes progress52 { 0% { stroke-dasharray: 52 100; }}
@keyframes progress53 { 0% { stroke-dasharray: 53 100; }}
@keyframes progress54 { 0% { stroke-dasharray: 54 100; }}
@keyframes progress55 { 0% { stroke-dasharray: 55 100; }}
@keyframes progress56 { 0% { stroke-dasharray: 56 100; }}
@keyframes progress57 { 0% { stroke-dasharray: 57 100; }}
@keyframes progress58 { 0% { stroke-dasharray: 58 100; }}
@keyframes progress59 { 0% { stroke-dasharray: 59 100; }}
@keyframes progress60 { 0% { stroke-dasharray: 60 100; }}
@keyframes progress61 { 0% { stroke-dasharray: 61 100; }}
@keyframes progress62 { 0% { stroke-dasharray: 62 100; }}
@keyframes progress63 { 0% { stroke-dasharray: 63 100; }}
@keyframes progress64 { 0% { stroke-dasharray: 64 100; }}
@keyframes progress65 { 0% { stroke-dasharray: 65 100; }}
@keyframes progress66 { 0% { stroke-dasharray: 66 100; }}
@keyframes progress67 { 0% { stroke-dasharray: 67 100; }}
@keyframes progress68 { 0% { stroke-dasharray: 68 100; }}
@keyframes progress69 { 0% { stroke-dasharray: 69 100; }}
@keyframes progress70 { 0% { stroke-dasharray: 70 100; }}
@keyframes progress71 { 0% { stroke-dasharray: 71 100; }}
@keyframes progress72 { 0% { stroke-dasharray: 72 100; }}
@keyframes progress73 { 0% { stroke-dasharray: 73 100; }}
@keyframes progress74 { 0% { stroke-dasharray: 74 100; }}
@keyframes progress75 { 0% { stroke-dasharray: 75 100; }}
@keyframes progress76 { 0% { stroke-dasharray: 76 100; }}
@keyframes progress77 { 0% { stroke-dasharray: 77 100; }}
@keyframes progress78 { 0% { stroke-dasharray: 78 100; }}
@keyframes progress79 { 0% { stroke-dasharray: 79 100; }}
@keyframes progress80 { 0% { stroke-dasharray: 80 100; }}
@keyframes progress81 { 0% { stroke-dasharray: 81 100; }}
@keyframes progress82 { 0% { stroke-dasharray: 82 100; }}
@keyframes progress83 { 0% { stroke-dasharray: 83 100; }}
@keyframes progress84 { 0% { stroke-dasharray: 84 100; }}
@keyframes progress85 { 0% { stroke-dasharray: 85 100; }}
@keyframes progress86 { 0% { stroke-dasharray: 86 100; }}
@keyframes progress87 { 0% { stroke-dasharray: 87 100; }}
@keyframes progress88 { 0% { stroke-dasharray: 88 100; }}
@keyframes progress89 { 0% { stroke-dasharray: 89 100; }}
@keyframes progress90 { 0% { stroke-dasharray: 90 100; }}
@keyframes progress91 { 0% { stroke-dasharray: 91 100; }}
@keyframes progress92 { 0% { stroke-dasharray: 92 100; }}
@keyframes progress93 { 0% { stroke-dasharray: 93 100; }}
@keyframes progress94 { 0% { stroke-dasharray: 94 100; }}
@keyframes progress95 { 0% { stroke-dasharray: 95 100; }}
@keyframes progress96 { 0% { stroke-dasharray: 96 100; }}
@keyframes progress97 { 0% { stroke-dasharray: 97 100; }}
@keyframes progress98 { 0% { stroke-dasharray: 98 100; }}
@keyframes progress99 { 0% { stroke-dasharray: 99 100; }}
@keyframes progress100 { 0% { stroke-dasharray: 100 100; }}