#header
{
	position: absolute;
	width: 200%;
	left: -50%;
	top: 0;
}

#promo
{
	position: absolute;
	top: 248px;
	width: 200%;
	left: -50%;
}

#subnav
{
	position: absolute;
	top: 248px;
	width: 200%;
	left: -50%;
}

#bg
{
	position: absolute;
	top: 548px;
	width: 200%;
	left: -50%;
	z-index: -10;
}

#footer
{
	position: relative;
	top: 350px;
	width: 200%;
	left: -50%;
	height:800px;
}


#footertxt
{
	position:absolute;
	top:25px;
	left:50%;
	margin-left:-425px;
	color:#377fad;
	font-size:smaller;
}

#footertxt.blue{color:#377fad; }
#footertxt.red{color:#9f1a15; }

#footertxt a{color:#b7b7b7; text-decoration:none; font-size:smaller; }
#footertxt a.blue{color:#b7b7b7; text-decoration:none; font-size:smaller; }
#footertxt a.red{color:#ffe9e7; text-decoration:none; font-size:smaller; }

#content
{
	position:relative;
	top:285px;
	left: 50%;
	margin-left: -425px;
	width:875px;	
	height:auto;
	border:5px solid #1c5286;
	padding:10px;
}

#content.blue
{
	color: #cccccc;
	background-color:#226299;
}

#content.red
{
	color: #3f3f3f;
	background-color:#f5f5f5;
}



#langform
{
	position:absolute;
	top:95px;
	left:50%;
	margin-left:290px;
	width:172px;
	overflow:hidden;
	height:20px;
}

#langform.blue
{
	background:url(/images/dropdown.jpg) no-repeat right #003f6f;
	border: 1px solid #3493db;
}

#langform.red
{
	background:url(/sp-images/dropdown.jpg) no-repeat right #791411;
	border: 1px solid #d94242;
}


#langMenu
{
	-webkit-appearance: none;
	width:200px;
	background:transparent;
}

#langMenu.blue
{
	color: #3493db;
	border: 1px solid #3493db;
}
#langMenu.blue option {background-color:#003f6f; }

#langMenu.red
{
	color: #ffffff;
	border: 1px solid #d94242;
}
#langMenu.red option {background-color:#791411; }



A:link {
 COLOR: #ff3333; /*The color of the link*/
}

A.blue:link {
 COLOR: #F1B814; /*The color of the link*/
}

A.red:link {
 COLOR: #c63229; /*The color of the link*/
}

A:hover {
 COLOR: #ff3333; /*The color of the mouseover or 'hover' link*/
}

A.blue:hover {
 COLOR: #F1B814; /*The color of the mouseover or 'hover' link*/
}

A.red:hover {
 COLOR: #c63229; /*The color of the mouseover or 'hover' link*/
}

A:visited {
 COLOR: #cccccc; /*The color of the visited link*/
}

A.blue:visited {
 COLOR: #cccccc; /*The color of the visited link*/
}

A.red:visited {
 COLOR: #3f3f3f; /*The color of the visited link*/
}

li {
margin-top: .2em;
margin-bottom: .2em;
}

body 
{
	font-family: Arial, Helvetica, sans-serif;

}

body.blue
{
	background: #2977af;
}

body.red
{
	background: #efefef;
}


td
{
	font-family: Arial, Helvetica, sans-serif;
	color: #cccccc;
}
td.blue {color: #cccccc; }
td.red {color: #3f3f3f; }

th
{
	font-family: Arial, Helvetica, sans-serif;
	color: #cccccc;
}
th.blue {color: #cccccc; }
th.red {color: #3f3f3f; }


/* ******Payment element styles below****** */

.hidden {
  display: none;
}

.form-center {
  display: flex;
  justify-content: center;
  align-content: center;
}

form.stripe {
  width: 30vw;
  min-width: 500px;
  align-self: center;
  box-shadow: 0px 0px 0px 0.5px rgba(50, 50, 93, 0.1),
    0px 2px 5px 0px rgba(50, 50, 93, 0.1), 0px 1px 1.5px 0px rgba(0, 0, 0, 0.07);
  border-radius: 7px;
  padding: 40px;
}


#payment-message {
  color: red;
  font-size: 20px;
  line-height: 20px;
  padding-top: 12px;
  text-align: center;
}

#payment-element {
  margin-bottom: 24px;
}

/* Buttons and links */
button.stripe {
  background: #5469d4;
  font-family: Arial, sans-serif;
  color: #ffffff;
  border-radius: 4px;
  border: 0;
  padding: 12px 16px;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  display: block;
  transition: all 0.2s ease;
  box-shadow: 0px 4px 5.5px 0px rgba(0, 0, 0, 0.07);
  width: 100%;
}
button.stripe:hover {
  filter: contrast(115%);
}
button.stripe:disabled {
  opacity: 0.5;
  cursor: default;
}

/* spinner/processing state, errors */
.spinner,
.spinner:before,
.spinner:after {
  border-radius: 50%;
}
.spinner {
  color: #ffffff;
  font-size: 22px;
  text-indent: -99999px;
  margin: 0px auto;
  position: relative;
  width: 20px;
  height: 20px;
  box-shadow: inset 0 0 0 2px;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
}
.spinner:before,
.spinner:after {
  position: absolute;
  content: "";
}
.spinner:before {
  width: 10.4px;
  height: 20.4px;
  background: #5469d4;
  border-radius: 20.4px 0 0 20.4px;
  top: -0.2px;
  left: -0.2px;
  -webkit-transform-origin: 10.4px 10.2px;
  transform-origin: 10.4px 10.2px;
  -webkit-animation: loading 2s infinite ease 1.5s;
  animation: loading 2s infinite ease 1.5s;
}
.spinner:after {
  width: 10.4px;
  height: 10.2px;
  background: #5469d4;
  border-radius: 0 10.2px 10.2px 0;
  top: -0.1px;
  left: 10.2px;
  -webkit-transform-origin: 0px 10.2px;
  transform-origin: 0px 10.2px;
  -webkit-animation: loading 2s infinite ease;
  animation: loading 2s infinite ease;
}

@-webkit-keyframes loading {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes loading {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

/* ******Address form styles below****** */

form.address {
  border-bottom: 1px solid #ccc;
  margin: 0 0 20px 0;
  padding: 0 0 50px 0;
}

input.address {
  border: 1px solid #ccc;
  font-size: 22px; /* fallback */
  font-size: var(--large-mobile-font-size);
  padding: 12px;
  width: 90%; /* fallback */
  width: calc(100% - 30px); /* full width minus padding */
}

input.address:not(:focus):invalid {
  color: red;
  outline-color: red;
}

label {
  display: block;
  font-size: 20px;
  font-size: var(--large-mobile-font-size);
  font-weight: 400;
  margin: 0 0 1px 0;
}

select.address {
  background-color: white;
  border: 1px solid #ccc;
  display: inline-block;
  font-size: var(--mobile-font-size);
  padding: 12px 12px 12px 11px;
  width: 100%;
}

textarea.address {
  border: 1px solid#ccc;
  font-family: sans-serif;
  font-size: 22px; /* fallback */
  font-size: var(--small-mobile-font-size);
  height: 5.5em;
  line-height: 1.4em;
  padding: 12px;
  width: 90%; /* fallback */
  width: calc(100% - 30px); /* full width minus padding */
}