*,
*:before,
*:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

/* ============================================================
  COMMON
============================================================ */

.settings {
  display: table;
  width: 100%;
}
.settings .row {
  display: table-row;
}
.settings .question,
.settings .switch {
  display: table-cell;
  vertical-align: middle;
  padding: 10px;
}
.settings .question {
  font-size: 18px;
}

/* ============================================================
  COMMON
============================================================ */
.cmn-toggle {
  position: absolute;
  margin-left: -9999px;
  visibility: hidden;
}
.cmn-toggle + label {
  display: block;
  position: relative;
  cursor: pointer;
  outline: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* ============================================================
  SWITCH 1 - ROUND
============================================================ */
input.cmn-toggle-round + label {
  padding: 2px;
  width: 60px;
  height: 30px;
  background-color: #dddddd;
  -webkit-border-radius: 60px;
  -moz-border-radius: 60px;
  -ms-border-radius: 60px;
  -o-border-radius: 60px;
  border-radius: 60px;
}
input.cmn-toggle-round + label:before, input.cmn-toggle-round + label:after {
  display: block;
  position: absolute;
  top: 1px;
  left: 1px;
  bottom: 1px;
  content: "";
}
input.cmn-toggle-round + label:before {
  right: 1px;
  background-color: #f1f1f1;
  -webkit-border-radius: 60px;
  -moz-border-radius: 60px;
  -ms-border-radius: 60px;
  -o-border-radius: 60px;
  border-radius: 60px;
  -webkit-transition: background 0.4s;
  -moz-transition: background 0.4s;
  -o-transition: background 0.4s;
  transition: background 0.4s;
}
input.cmn-toggle-round + label:after {
  width: 29px;
  background-color: #ffffff;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  -ms-border-radius: 100%;
  -o-border-radius: 100%;
  border-radius: 100%;
  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
  -webkit-transition: margin 0.4s;
  -moz-transition: margin 0.4s;
  -o-transition: margin 0.4s;
  transition: margin 0.4s;
}
input.cmn-toggle-round:checked + label:before {
	background-color:#26CD55;
}
input.cmn-toggle-round:checked + label:after {
  margin-left: 30px;
}




/* Form */
.fs-form {
	position: relative;
	text-align: left;
	width: 100%;
	color: #FFFFFF;
	line-height:1.2em;
	height: auto;
}


.fs-form-wrap input:focus,
.fs-form-wrap button:focus {
	outline: none;
}


.fs-fields, #list-fields, #list-fields-improve {
	position: relative;
	margin: 0 auto;
	padding: 0;
	top: 0;
	list-style: none;
}


.fs-fields > li, #list-fields > li, #list-fields-improve > li {
	position: relative;
	z-index: 1;
	margin: 0;
	padding: 0;
	border: none;
}

.fs-fields > li:hover, #list-fields >li:hover, #list-fields-improve >li:hover {
	z-index: 999;
}




/* Labels & info */
.fs-fields > li label, #list-fields > li label, #list-fields-improve > li label {
	position: relative;
	color:#FFFFFF;
	font-size:1.2em;
}

.fs-fields > li label.fs-field-label, #list-fields > li label.fs-field-label {
	display: inline-block;
	padding: 0 0 0.5em 0;
	pointer-events: none;
	margin: 0 0 2em 0;
}
#list-fields-improve > li label.fs-field-label {
	display: inline-block;
	padding: 0 0 0.5em 0;
	pointer-events: none;
	margin: 0.5em 0 0 0;
}

/* Inputs */
.fs-fields input, #list-fields input, #list-fields-improve input {
	display: block;
	margin: 0.75em 0;
	padding: 0.25em 0 0.5em 0;
	width: 100%;
	border: none;
	border-bottom: 2px solid rgba(0,0,0,0.2);
	background-color: transparent;
	color: #EAEAEA;
	text-overflow: ellipsis;
	font-weight: bold;
	font-size: 1.2em;
	border-radius: 0;
}

.fs-fields input:invalid, #list-fields input:invalid, #list-fields-improve input:invalid {
	box-shadow: none; /* removes red shadow in FF*/
}

.fs-fields [required], #list-fields [required], #list-fields-improve [required] {
	background-position: top right;
	background-size: 18px;
	background-repeat: no-repeat;
}

.fs-fields input:focus, #list-fields input:focus, #list-fields-improve input:focus {
	background-color: transparent; /* Fixes chrome bug with placeholder */
}

.fs-form .fs-fields input:focus, .fs-form #list-fields input:focus, .fs-form #list-fields-improve input:focus {
	background-color: transparent; /* Fixes chrome bug with placeholder */
}

.fs-fields input::-webkit-input-placeholder,
.fs-fields textarea::-webkit-input-placeholder {
	color: rgba(19,70,82,0.6);
}


.fs-fields input:-moz-placeholder,
.fs-fields textarea:-moz-placeholder {
	color: rgba(19,70,82,0.6);
}

.fs-fields input::-moz-placeholder,
.fs-fields textarea::-moz-placeholder {
	color: rgba(19,70,82,0.6);
}

.fs-fields input:-ms-input-placeholder,
.fs-fields textarea:-ms-input-placeholder {
	color: rgba(19,70,82,0.6);
}

.fs-fields input:focus::-webkit-input-placeholder {
	color: transparent;
}

button.fs-submit {
	padding: 0.9em 1.5em;
	border-radius: 5px;
	cursor:pointer;
}

.fs-form .fs-submit  {
	display: block;
	background: #232529;
	color: #FFFFFF;
 	font-size:1.2em;
	margin: 30px 0 0 0;
  	padding:15px 50px;
	width:100%;
	text-transform:uppercase;
}


button.fs-submit:hover,
button.fs-submit:focus {
	background: #000000;
	color: #FFFFFF;
}

 

