* { margin: 0px; padding: 0px; box-sizing: border-box; }
body { background-color: #eaeaea; }
.body-forgot, .body-reset, .body-error { background-color:#fff; }
body, table, td, p, input, select, textarea {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#333;
}
a { color: #333; }

h1 { margin:35px 0 15px; font-size: 18px; width:100%; text-align:center; text-transform:uppercase; }
h2 { text-transform:uppercase;}

input[type=text], input[type=password], textarea, select {
	width:100%; padding: 12px; border: 1px solid #ccc; color:#666; border-radius: 5px; background:#fff; font-size:18px;
	box-sizing: border-box;
}

input[type=submit], input[type=button] {
	width:100%; background:#9ecb18; color:#fff; font-weight:bold; font-size:18px; border:1px solid #809d27; 
	padding:12px; border-radius: 5px; cursor:pointer; text-transform:uppercase; 
}
input[type=submit]:disabled, input[type=button]:disabled {
  background: #f2f2f2;
  color: #ccc;
  border:1px solid #ccc;
  cursor:default;
}

select { 
	background: #fff url(data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0Ljk1IDEwIj48ZGVmcz48c3R5bGU+LmNscy0xe2ZpbGw6I2ZmZjt9LmNscy0ye2ZpbGw6IzQ0NDt9PC9zdHlsZT48L2RlZnM+PHRpdGxlPmFycm93czwvdGl0bGU+PHJlY3QgY2xhc3M9ImNscy0xIiB3aWR0aD0iNC45NSIgaGVpZ2h0PSIxMCIvPjxwb2x5Z29uIGNsYXNzPSJjbHMtMiIgcG9pbnRzPSIxLjQxIDQuNjcgMi40OCAzLjE4IDMuNTQgNC42NyAxLjQxIDQuNjciLz48cG9seWdvbiBjbGFzcz0iY2xzLTIiIHBvaW50cz0iMy41NCA1LjMzIDIuNDggNi44MiAxLjQxIDUuMzMgMy41NCA1LjMzIi8+PC9zdmc+) no-repeat 99% 50%;
	-moz-appearance: none; 
	-webkit-appearance: none; 
	appearance: none;
}

input[type=submit], input[type=button] {
	-moz-appearance: none; 
	-webkit-appearance: none; 
	appearance: none;
}

.flexbox { 
	display: -ms-flexbox; display: -webkit-flex; display: flex;
	-ms-flex-align: center; -webkit-align-items: center; -webkit-box-align: center; align-items: center; 
}
.clear { clear:both; }
.row { display:block; width:100%; clear:both; }
.col { display:inline-block; }
.error { color: #990000; font-weight:bold; margin: 7px 0; }
.wrapper-error .error { text-align:center; }

.fieldset.validate-error input, .fieldset.validate-error select, .fieldset.validate-error textarea {
	border:1px solid red !important;
}
.fieldset.required.validate-error .error-highlight, .fieldset.required.validate-error .error-highlight a { color: red !important; }

.header { 
	width:100%; text-align:center; background-color:#fff;
	border-bottom:5px solid #ccc; padding: 5px 0;
}

.wrapper { position:relative; }
.wrapper, .wrapper-forgot, .wrapper-reset, .wrapper-error { 
	width: 470px; margin: 0 auto;
}
.wrapper-forgot, .wrapper-reset, .wrapper-error { margin: 25px auto; }

form .row, .fieldset { margin: 0 0 7px; }
.forgot { margin-left: 30px; padding-top:10px; }

.wrapper-forgot .listings { margin: 15px 0; }
.wrapper-forgot .listings p { margin: 0 0 5px; }
.wrapper-forgot .listings input { margin:0 3px 0 0; }

iframe { border:0px; overflow:hidden; width:100%; height:100%; }

.support { position:absolute; top:0px; left:0px; width: 470px; height:280px; background:#fff; /*border:1px solid #ccc;*/ }
.support .row { margin:0 0 10px; }
.support .label { margin:0 0 5px; }

.new-user { text-align:center; margin:20px 0; }
.new-user input { 
	font-size: 1.2em; margin:0 0 10px; width:430px; max-width:100%; 
	
}
.new-user a { text-decoration:none; }

.lang-select { margin-top:20px; }

.error-message { 
	font-weight:bold; color: #be0e26; font-size: 1.3em; text-align:center; margin: 0 0 15px; 
	transform: scaleY(0);    
	transform-origin: top;
	transition: transform 0.26s ease;
}
.error-message.on { 
	transform: scaleY(1);    
}


.main { position:relative; border:1px solid #ccc;  border-radius:5px; width: 470px; height:340px; top:0; left:0px; }
.main > .section { position:absolute; z-index:1; width:100%; background: #eaeaea;  height:100% !important; padding:20px; }
/*.main > .section.on { z-index: 2; } */
/** list sections so we know what they are **/
body.view-index .returning-user { z-index: 2; }
body.view-tfa .tfa { z-index: 2; }
body.view-forgot .forgot-password { z-index: 2; }
body.view-reset .reset { z-index: 2; }

.main > .section h2 { text-align:center; margin:10px 0; text-transform:uppercase }
.section p { margin: 0 0 15px 0; }

.tfa .submits { width:100%; max-width:100%; column-gap: 5px; -webkit-justify-content: space-between; justify-content:space-between; }
.tfa .submits > div { flex: 1; }
.tfa .submits input { width:100%; font-size: 1.2em; }

.tfa2 h2 { text-align:center; margin:0 0 15px; text-transform:uppercase }
.tfa2 p, .tfa2 .flexbox { margin: 0 0 15px 0; }
.tfa2 { margin: 30px 0; }
.tfa2 .step { display:none; }
.theme1.tfa2 input[type=text] { width:175px; }
.theme1.tfa2 select { width:110px; margin-right:2px; }
.tfa2 .tfa-country, .tfa .tfa-mobile { font-weight:bold; }

.forgot-password .submits { width:100%; max-width:100%; column-gap: 5px; -webkit-justify-content: space-between; justify-content:space-between; }
.forgot-password .submits > div { flex: 1; }
.forgot-password .submits input { width:100%; font-size: 1.2em; }

body.view-reset h1, body.view-reset .new-user { display:none; }
body.view-reset .wrapper { margin-top: 30px; }



/************************
TABLET 
************************/

@media only screen and (min-width: 600px) and (max-width : 1024px) {

}

/***************
MOBILE 
****************/

@media only screen and (max-width: 600px) {

	.wrapper, .wrapper-forgot, .wrapper-reset, .wrapper-error, h1 { width: 95%; }
	.main { width:100%; }
	.returning-user { border:0px; }
	.returning-user form { margin:0px; }
	input[type="text"], input[type="password"], textarea, select { width: 100%; }
	input[type="submit"], input[type="button"] { width:100%; }
	.col { width:100%; }
	.tfa { width: 100%; padding:0px; border:0px; }

}
