.personaEditor {
	width: 100%;
	height: 100%;
}

.personaEditor .main {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	display: none;
}

.personaEditor.main .main {
	display: block;
}

.personaEditor .privacyCheckboxes {
	width: 200px;
	margin: 10px auto 0 auto;
}

.personaEditor .privateCheckboxContainer {
	float: left;
}

.personaEditor .publicCheckboxContainer {
	float: left;
	margin: 0 0 0 5px;
}

.personaEditor .heading {
	margin: 40px 0 0 0;
	text-align: center;
}

.personaEditor .frame {
	position: relative;
	width: 210px;
	height: 210px;
	margin: 10px auto 0 auto;
}

.personaEditor .frame .generic {
	width: 210px;
	height: 210px;
	border-radius: 50%;
	background-size: 210px 210px;
	display: none;
}

.personaEditor .frame.generic .generic {
	display: block;
}

.personaEditor .generic.male {
	background-image: url(https://d1gq9jzbezk7fw.cloudfront.net/p/en_US/gv/i/generic-icon.png);
}

.personaEditor .generic.female {
	background-image: url(https://d1gq9jzbezk7fw.cloudfront.net/p/en_US/gv/i/generic-icon.png);
}

.personaEditor .generic.other {
	background-image: url(https://d1gq9jzbezk7fw.cloudfront.net/p/en_US/gv/i/generic-icon.png);
}

.personaEditor .frame .custom {
	width: 210px;
	height: 210px;
	border-radius: 50%;
	display: none;
}

.personaEditor .frame.custom .custom {
	display: block;
}

.personaEditor .add {
	position: absolute;
	left: 4px;
	top: 4px;
	width: 60px;
	height: 60px;
	border-radius: 50%;
	background-image: url(https://d1gq9jzbezk7fw.cloudfront.net/p/en_US/gv/i/add_s_v1.png);
	background-size: 60px 60px;
}

.personaEditor .uploadForm {
	display: none;
}

.personaEditor .imageEditor {
	position: absolute;
	width: 280px;
	height: 280px;
	left: 50%;
	top: 50%;
	margin: -140px 0 0 -140px;
	display: none;
}

.personaEditor.imageEditor .imageEditor {
	display: block;
}

.personaEditor .image {
	position: absolute;
	left: 0;
	top: 0;
	width: 280px;
	height: 280px;
}

.personaEditor .dimmer {
	position: absolute;
	left: 0;
	top: 0;
	width: 280px;
	height: 280px;
	background-color: #000000;
	opacity: 0.4;
}

.personaEditor .viewport {
	position: absolute;
	width: 210px;
	height: 210px;
	border-radius: 50%;
	border: 2px solid #f0f0f0;
	overflow: hidden;
}

.personaEditor .label {
	position: relative;
	width: 200px;
	margin: 10px auto 0 auto;
}

.personaEditor .value {
	width: 200px;
	margin: 0 auto;
}

.personaEditor .input {
	display: block;
	border: 1px solid #D8D8D8;
	width: 200px;
	height: 30px;
	border-radius: 5px;
	padding: 0 10px;
	margin: 0 auto;
}