table *
{
	border-color: transparent !important;
}

.s2s *
{
	font-family: sans-serif;
}

.s2s-text--heading
{
	font-size: 3.1rem !important;
	margin-top: 0 !important;
}

.s2s-text--heading img
{
	display: inline;
	vertical-align: middle;
	margin-left: 10px;
}

.s2s-text--subheading
{
	font-size: 2.7rem !important;
	margin: 0 !important;
}

.s2s-text--primary
{
	color: #23c4f0 !important;
}

.s2s-text--text-right
{
	text-align: right !important;
}

.s2s-half--left
{
	width: 42%;
	float: left;
}

.s2s-half--right
{
	width: 56%;
	float: right;
}

.s2s-clear
{
	clear: both;
}

.s2s input[type="text"],
.s2s input[type="range"]
{
	background-color: #efefef !important;
	width: 100%;
}
.s2s input[type="range"]
{
	min-height: 20px;
}
.s2s input[type="checkbox"]
{
	background-color: #efefef !important;
	margin: 0 10px;
}

.s2s select
{
	padding: 15px 15px 14px 7rem;
	background-color: #efefef;
	border-color: #D7CFAB;
	font-size: 1.6rem;
	width: 100%;
	appearance: none;
}
.s2s select,
.s2s select option[value=""]
{
	color: #757575;
}
.s2s select option
{
	color: black;
}

input.s2-input--dollar
{
	background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="55" height="100%"><rect fill="%2323c4f0" x="0" y="0" width="100%" height="100%"/><text text-anchor="middle" fill="white" x="50%" y="55%" alignment-baseline="middle" font-size="150%" font-weight="bold">$</text></svg>') !important;
	background-repeat: no-repeat !important;
}

input.s2-input--percent
{
	background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="55" height="100%"><rect fill="%2323c4f0" x="0" y="0" width="100%" height="100%"/><text text-anchor="middle" fill="white" x="50%" y="55%" alignment-baseline="middle" font-size="130%" font-weight="bold">%</text></svg>') !important;
	background-repeat: no-repeat !important;
}

select.s2-input--chevron
{
	background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="55" height="100%"><rect fill="%2323c4f0" x="0" y="0" width="100%" height="100%"/><text text-anchor="middle" fill="white" x="50%" y="47%" alignment-baseline="middle" font-size="150%" font-weight="bold">⌄</text></svg>') !important;
	background-repeat: no-repeat !important;
}

.s2s .calculation
{
	background-color: #efefef;
	margin: auto;
	max-width: 400px;
	padding: 20px 0 10px 0;
	text-align: center;
	border-radius: 10px;
}
.s2s-calculator--rewards .calculation
{
	background-color: #23c4f0;
	color: white;
	padding: 10px 0;
	font-size: 1.2rem;
}

.s2s .calculation .amount
{
	display: block;
	font-size: 6rem;
}

.s2s .calculation .amount .cents
{
	font-size: 3.2rem;
	vertical-align: super;
}

.tooltip
{
	position: relative;
	display: inline-block;
}

.tooltip .tooltiptext
{
	visibility: hidden;
	width: 490px;
	background-color: #555;
	color: #fff;
	text-align: center;
	padding: 10px;
	border-radius: 6px;
	position: absolute;
	z-index: 1;
	bottom: 125%;
	left: 50%;
	margin-left: -150px;
	opacity: 0;
	transition: opacity 0.3s;
}

.tooltip .tooltiptext a
{
	color: #23c4f0;
}

.tooltip .tooltiptext::after
{
	content: "";
	position: absolute;
	top: 100%;
	left: 150px;
	margin-left: -5px;
	border-width: 5px;
	border-style: solid;
	border-color: #555 transparent transparent transparent;
}

.tooltip:hover .tooltiptext
{
	visibility: visible;
	opacity: 1;
}