label {
    float: left;
    color: var(--primary-color-light);
}
/*body {
    background-image: url("../images/background_login.png") !important;
    background-position: 100%;
    background-repeat: no-repeat;    
    background-attachment: fixed;
}*/
#registrationData {    
    margin: 7% auto;
}
#registrationSuccess {
    text-align: center;
    color: var(--primary-color-light);
    margin: 7% 0;
}
.rowStartsNone {
	display: none;
}
.customerOnlyData {
    display: none;
	padding-left: 30px;
}
.editable {
    position: relative;
	width: 100%;
}
.btnLine {
    margin-top: 20px;
}
.btnRegister {
    background-color: var(--secondary-color-light);
    font-weight: bold;
    text-transform: uppercase;
    color: var(--secondary-color-dark);
}
.btnRegister:hover, .btnRegister:focus {
    background-color: var(--tertiary-color) !important;
    color: var(--secondary-color-dark);
}
.rowHeader {
    background: var(--secondary-color-dark);
    font-size: 18px;
    color: var(--primary-color-light);
    font-weight: 600;
    font-style: italic;
}

.rowHeader p {
	margin: 0;
	line-height: 50px;
}

.rowUserData {
    margin-top: 30px;
}
.mainData label, .rowUserData label {
    float: left;
    min-width: 100%;
    margin-top: 10px;
    position:relative;
}

.personaRadio label {
	float: none;
	min-width: auto;
	margin: 0 10px;
}
.startsInfo {
	margin-top: 10px;
}

.editable input, input:required, select:required {
	border-bottom: 1px solid var(--primary-color-light);
    background: var(--secondary-color-dark);
    outline: none;
}

label.editable div {
	/*display: inline-block;*/
	position: relative;
	width: 100%;
}
label.editable input, label.editable select {
	width: 100%;
	margin: 0;
}
label .errorField {
	bottom: -14px;
	right: 10px;
}

.avatarPreview img {
	height: 120px;
	width: 120px;
	border-radius:50%;
}
.conditionRow {
    line-height: 20px;
    position: relative;
}
.errorField {
	position: absolute;
    right: 25px;
    bottom: -20px;
    line-height: 12px;
    font-size: 10px;
    color: red;
    text-transform: uppercase;
}
#registrationSuccess {
    padding: 15px;
}

#image-cropper, .avatarPreview, .image-cropper {
	text-align: center;
}

.cropit-preview {
	width: 120px;
	height: 120px;
	position: relative;
	margin: 0 auto;
	
	cursor: move; 
	cursor: grab;
	cursor: -moz-grab;
	cursor: -webkit-grab;
}
input.cropit-image-input {
  visibility: hidden;
}
.cropit-preview-image-container {
	border-radius: 50%;
	z-index: 10;
}
.cropit-image-zoom-input {
	position: relative;
	margin: 0 auto;
}
#image-cropper input, .image-cropper input {
	width: 120px;
}
#image-cropper img {
    max-width: initial;
}
.registrationInner {
	background-color: var(--secondary-color-dark);
	color: #999;
	z-index:0   ;
	margin-top: 80px;
	margin-bottom: 2%;
}

#backToLogin {
    color: var(--primary-color-light);
    text-transform: uppercase;
}

select {
	height: 30px;
	width: 150px;
}


@media (max-width: 767px) {
	header {
		position: static;
		height: auto;
	}
	#logo {
		float: none;
	}
}


.rowUserData input[type="radio"] {
	-webkit-appearance: none;
	appearance: none;
	background-color: var(--secondary-color-dark);
	width: 30px;
	height: 30px;
	border: 1px solid var(--primary-color-light);
	border-radius: 50%;
	text-align: center;
	vertical-align: middle;
	margin: 0 5px;
}
.rowUserData input[type="radio"]:checked {
	color: var(--secondary-color-dark);
	background-color: var(--tertiary-color);;
	border-color: var(--tertiary-color);;
	font-weight: bold;
    font-size: 14px;
}
.rowUserData input[type="radio"]:after {
	display: block;
	line-height: 28px;
	
}
.rowUserData input[type="radio"][value="1"]:after {
	content: "Sì";
}
.rowUserData input[type="radio"][value="0"]:after {
	content: "No";
}

.conditionRow span {
	vertical-align: middle;
}
.conditionRow input[type="checkbox"] {
	-webkit-appearance: none;
	appearance: none;
	background-color: var(--secondary-color-dark);
	margin: 0;
	width: 20px;
	height: 20px;
	border: 1px solid var(--primary-color-light);
	text-align: center;
	vertical-align: middle;
	line-height: 16px;
}
.conditionRow input[type="checkbox"]:checked {
	color: var(--secondary-color-dark);
	background-color: var(--tertiary-color);
	border-color:var(--tertiary-color);
}
.conditionRow input[type="checkbox"]:checked:after {
	font: normal normal normal 14px/1 "Font Awesome 5 Free";
	content: "\f00d";
}