body {
	background-color: #67C;
	color: #BDE;
	width: 80%;
	margin: auto;
	text-align: center;
	font-size: 1.4em;
}
form {
	z-index: 1;
}
a {
	color: #FD3;
}
a:hover {
	color: #FF6;
}
input[type="submit"], input[type="button"] {
	background-color: #9AF;
	border-color: #69F;
}
input[type="file"]:not(:valid) + input[type="submit"] {
	display: none;
}
#circuits {
	z-index: 1;
}
#circuits span {
	font-size: 20px;
}
#circuits img {
	width: 64px;
	border: none;
}
#options {
	visibility: hidden;
}
#options a {
	font-weight: bold;
	text-decoration: none;
}
#imageContainer {
	margin: 0;
	overflow: hidden;
	width: 690px;
	height: 80%;
}
#circuitGrand {
	max-width: 690px;
	visibility: hidden;
}
#error {
	background-color: #EF4242;
	color: #A5444C;
	font-weight: bold;
	text-align: center;
	display: inline-block;
	padding: 8px 20px;
}
#error a {
	color: #A5444C;
}
#success {
	background-color: #42EF42;
	color: #44A54C;
	font-weight: bold;
	text-align: center;
	display: inline-block;
	padding: 8px 20px;
}
#success strong {
	color: #307436;
}
#success a {
	color: #44A59C;
}
.sprite-help {
	position: relative;
	top: -0.1em;
	font-size: 0.6em;
}
.newpersoinfo {
	color: white;
}
#perso-options {
	border: solid 1px #BDE;
	display: none;
	margin-left: auto;
	margin-right: auto;
	padding: 5px;
	background-color: #7F95D6;
}
#perso-options button {
	font-size: 0.7em;
	padding: 3px 8px;
	cursor: pointer;
	margin: 0 2px;
}
#perso-options-name {
	margin-top: 5px;
	margin-bottom: 10px;
	font-weight: bold;
}
#perso-options-author {
	font-size: 0.7em;
	margin-bottom: 5px;
}
#perso-options .share-perso {
	background-color: #8AD;
	color: #6262EF;
}
#perso-options .share-perso:hover {
	background-color: #9AF;
	color: #545CB5;
}
#perso-options .collab-perso {
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-top: 0.5em;
	font-size: 0.6em;
	background-color: #A9D;
	color: #54A;
}
#perso-options .collab-perso:hover {
	background-color: #BAE;
	color: #55A;
}
.perso-options-stars {
	padding: 0px 4px;
}
.perso-options-stars img {
	width: 24px;
	cursor: pointer;
}
#perso-options-feedback {
	display: none;
	font-size: 0.7em;
	color: #AF0;
}
#perso-options .edit-perso {
	background-color: #42EF42;
	color: #409C49;
}
#perso-options .edit-perso:hover {
	background-color: #52FF52;
	color: #34953C;
}
#perso-options .suppr-perso {
	background-color: #FF5252;
	color: #9C4049;
}
#perso-options .suppr-perso:hover {
	background-color: #FF6262;
	color: #95343C;
}
.perso-mask {
	z-index: 100;
	display: none;
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,102, 0.5);
}
#perso-share-popup {
	position: absolute;
	left: 50%;
	top: 50%;
	padding: 10px 20px 10px 20px;
	border: double 4px #BDE;
	border-radius: 5px;
	-webkit-transform: translate(-50%,-50%);
	-moz-transform: translate(-50%,-50%);
	-o-transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
	background-color: #4242EF;
}
.close-perso-popup {
	position: absolute;
	right: 3px;
	top: -3px;
	color: #BDE;
	text-decoration: none;
	font-size: 1.1em;
}
.close-perso-popup:hover {
	color: #DEF;
}
#perso-share-popup form {
	margin-bottom: 8px;
}
#perso-share-popup .perso-share-restricted {
	margin: 0 0 8px 0;
	max-width: 280px;
}
#delete-share-link {
	display: none;
	margin-bottom: 3px;
}
#perso-share-popup h2 {
	margin: 0;
	margin-bottom: 10px;
}
#perso-share-popup input[type="text"] {
	width: 180px;
}
.mypersos-list {
	margin-top: 10px;
}
.mypersos-size {
	margin-top: 0;
	margin-bottom: 5px;
	font-size: 0.65em;
}
.mypersos img {
	border: solid 5px transparent;
	cursor: pointer;
	min-width: 32px;
	min-height: 32px;
}
.mypersos img:hover {
	background-color: #90AADD;
	border-color: #90AADD;
}
.mypersos img.perso-selected {
	background-color: #BDE;
	border-color: #BDE;
}
#perso-instructions.instructions-unshown {
	display: none;
}
.persos-list-container {
	margin-top: 10px;
	padding-bottom: 10px;
	border-bottom: solid 1px #BDE;
}
.persos-list {
	max-height: 100px;
	overflow-y: auto;
	display: inline-block;
	position: relative;
	top: 7px;
}
.persos-list-container h3 {
	margin: 0;
	padding: 0;
}
.persos-list > div {
	margin-left: 3px;
	margin-right: 2px;
}
.persos-list-more {
	margin: 10px;
}
.persos-list-empty + .persos-list-more {
	margin-top: 0;
}
.persos-list-more-collab {
	font-size: 0.8em;
}
.persos-list-more-collab a {
	color: #BDE;
}
.persos-sort {
	padding: 4px 0px;
	border-bottom: solid 1px #7F90EE;
}
.persos-sort a {
	border-radius: 10px;
	padding: 3px 8px;
	font-size: 0.75em;
	text-decoration: none;
	color: #BDE;
}
.persos-sort a:not(#persos-currentsort):hover {
	background-color: #545CDE;
}
.persos-sort a#persos-currentsort {
	background-color: #4242EF;
	color: white;
}
#persos-list-search {
	font-size: 0.8em;
	display: none;
}
#persos-list-search div {
	display: inline-block;
	margin: 0 6px;
}
#persos-list-search input {
	font-size: 0.8em;
	width: 100px;
	padding: 0 2px;
}
#persos-list-search input::placeholder {
	color: #AAAAAF;
}
#persos-list-search input:-ms-input-placeholder {
	color: #AAAAAF;
}
#persos-list-search input::-ms-input-placeholder {
	color: #AAAAAF;
}
#persos-list-collab {
	display: none;
}
#persos-collab-form {
	display: none;
	font-size: 0.8em;
	margin-bottom: 15px;
}
#persos-collab-form label {
	display: flex;
    flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 0.25em;
}
#persos-collab-form label a {
	position: relative;
	top: -0.5em;
	font-size: 0.7em;
}
#persos-collab-form label input[type="url"] {
	flex: 1;
}
#persos-collab-form input {
	font-size: 0.8em;
}
#original-perso-selector {
	margin-bottom: 15px;
}
#original-perso-selector > div {
	display: inline-block;
	padding: 5px;
	cursor: pointer;
}
#original-perso-selector > div:hover {
	background-color: #90AADD;
	border-color: #90AADD;
}
.readonly #original-perso-selector > div {
	cursor: default;
}
.readonly #original-perso-selector > div:hover {
	background-color: transparent;
	border-color: transparent;
}
#original-perso-selector.perso-selector-enabled > #perso-selected {
	background-color: #BDE;
	border-color: #BDE;
}
#original-perso-selector > div > div {
	position: relative;
	width: 32px;
	height: 32px;
	overflow: hidden;
}
#original-perso-selector img {
	position: absolute;
	left: -352px;
	top: 0px;
}
#youtube-perso-selector:not(.perso-selector-enabled) input {
	color: #EEE;
}
#youtube-perso-selector input {
	width: 22em;
	padding: 1px 5px;
	cursor: default;
}
form input {
	font-size: 1em;
}
.perso-preview {
	margin-left: auto;
	margin-right: auto;
}
#select-transparency {
	cursor: crosshair;
}
hr {
	border-color: #BDE;
}
#transparency-form {
	display: none;
}
#transparency-color-preview {
	display: inline-block;
	width: 60px;
	height: 25px;
	border: solid 1px #BDE;
	position: relative;
	top: 6px;
}
.perso-editsprites {
	font-size: 0.8em;
}
.perso-animate {
	position: relative;
	width: 32px;
	height: 32px;
	overflow: hidden;
}
.perso-animate img {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 768px;
	-webkit-animation: move 5s steps(21) infinite normal;
	-moz-animation: move 5s steps(21) infinite normal;
	-o-animation: move 5s steps(21) infinite normal;
	-ms-animation: move 5s steps(21) infinite normal;
	animation: move 5s steps(21) infinite normal;
}
.perso-selector.perso-animate img {
	-webkit-animation-duration: 2s;
	-moz-animation-duration: 2s;
	-o-animation-duration: 2s;
	-ms-animation-duration: 2s;
	animation-duration: 2s;
}
@-webkit-keyframes move {
    from {left:0%;}
    to   {left:-2100%;}
}
@-moz-keyframes move {
    from {left:0px;}
    to   {left:-2100%;}
}
@-o-keyframes move {
    from {left:0px;}
    to   {left:-2100%;}
}
@-ms-keyframes move {
    from {left:0px;}
    to   {left:-2100%;}
}
@keyframes move {
    from {left:0px;}
    to   {left:-2100%;}
}
.perso-form label {
	margin-right: 5px;
}
.perso-form input[type="text"] {
	padding: 0 2px;
}
.perso-form input::placeholder {
	color: #CCD;
}
.perso-form input:-ms-input-placeholder {
	color: #CCD;
}
.perso-form input::-ms-input-placeholder {
	color: #CCD;
}
.perso-form input#name {
	width: 160px;
}
.perso-form input[type="range"] {
	width: 300px;
}
.perso-selector {
	display: inline-block;
	width: 32px;
	height: 32px;
	overflow: hidden;
	cursor: pointer;
}
.perso-selector div {
	width: 32px;
	height: 32px;
	overflow: hidden;
}
.perso-selector > img {
	transform: translateY(-50%) translateY(16px);
}
.perso-selector div:not(.perso-animate) img {
	width: 32px;
	height: 32px;
}
.perso-statbar {
	background-color: #90AADD;
	border: 1px solid silver;
	height: 16px;
}
.perso-stats {
	display: inline-block;
	padding: 10px 40px;
	padding-top: 2px;
}
.perso-stats table {
	margin-left: auto;
	margin-right: auto;
}
.perso-stats table td:first-child {
	text-align: right;
}
.perso-stats input[type="range"] {
	position: relative;
	top: 4px;
}
.perso-form fieldset {
	border-color: #8BF;
}
#statstemplate {
	font-size: 0.9em;
	margin-top: 5px;
	margin-bottom: 5px;
	padding-bottom: 10px;
	border-bottom: solid 1px #7AE;
}
#statssubmit {
	margin-top: 5px;
	font-size: 0.9em;
}
#statsinfo {
	width: 500px;
	margin-left: auto;
	margin-right: auto;
	font-size: 0.8em;
	margin-top: 10px;
	padding-top: 5px;
	border-top: solid 1px #7AE;
	color: #5F5;
}
.statswrong #statsinfo, .statswrong .perso-stats {
	color: #D00;
}
.statswrong fieldset {
	border-color: #F8B;
}
#stats-template {
	color: black;
}
#stats-template option:first-child {
	color: gray;
}
.perso-stats input[type="range"]::-o-range-progress {
	background-color: #7AE;
}
.statswrong input[type="range"]::-o-range-progress {
	background-color: #D00;
}
.perso-stats input[type="range"]::-webkit-range-progress {
	background-color: #7AE;
}
.statswrong input[type="range"]::-webkit-range-progress {
	background-color: #D00;
}
.perso-stats input[type="range"]::-moz-range-progress {
	background-color: #7AE;
}
.statswrong input[type="range"]::-moz-range-progress {
	background-color: #D00;
}
.perso-stats input[type="range"]::-ms-fill-lower {
	background-color: #7AE; 
}
.statswrong input[type="range"]::-ms-fill-lower {
	background-color: #D00; 
}
h1, h2 {
	margin-bottom: 10px;
}
.perso-form input[type="submit"] {
	font-size: 1.2em;
	padding: 0 10px;
}
.advances-options {
	margin-top: 20px;
	font-size: 0.9em;
	display: inline-block;
}
.advances-options a {
	display: inline-block;
	text-decoration: none;
	border: solid 1px #99AAFF;
	padding: 3px 8px;
	color: #BDE;
	font-size: 0.8em;
	background-color: #6C7DD2;
}
.advances-options a:hover {
	background-color: #778CD3;
}
.advances-options img {
	height: 0.9em;
	margin-right: 3px;
}
.advanced-options {
	margin-right: 5px;
}
.advanced-option {
	display: inline-block;
	width: 150px;
	font-size: 0.7em;
	margin-left: 10px;
	margin-right: 10px;
	padding: 10px 12px;
	border-radius: 5px;
}
.advanced-option:hover {
	background-color: #4E6DB3;
}
.readonly .advanced-option:not(:last-child) {
    cursor: default;
    text-decoration: none;
}
.readonly .advanced-option:not(:last-child):hover {
	background-color: transparent;
}
.advanced-option .option-bg {
	position: relative;
	height: 130px;
	margin-bottom: 5px;
	overflow: hidden;
}
.advanced-option.option-map .option-bg {
	background-color: rgb(0,161,0);
}
.advanced-option.option-map .option-bg img:first-child {
	position: absolute;
	left: -390px;
	top: -231px;
}
.advanced-option.option-map .option-bg img:last-child {
	position: absolute;
	left: 62px;
	top: 62px;
	width: 16px;
}
.advanced-option.option-podium .option-bg {
	background-color: black;
}
.advanced-option.option-podium .option-bg img:first-child {
	position: absolute;
	left: 25px;
	bottom: 38px;
}
.advanced-option.option-podium .option-bg img:last-child {
	position: absolute;
	width: 24px;
	left: 61px;
	bottom: 65px;
}
.advanced-option.option-ending .option-bg > img:first-child {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
}
.advanced-option.option-ending .option-bg div {
	position: absolute;
	left: 60px;
	bottom: 15px;
	width: 24px;
	height: 24px;
	overflow: hidden;
}
.advanced-option.option-ending .option-bg div img {
	position: absolute;
	left: -264px;
	top: 0px;
	width: 576px;
}
.advanced-option.option-ending .option-bg > img:last-child {
	position: absolute;
	left: 45px;
	top: 25px;
	width: 60px;
	opacity: 0.8;
}
.current-sprite {
	position: relative;
	top: 0.1em;
	height: 1em;
}
#perso-customstats {
	position: absolute;
	background-color: #4242CC;
	left: 50%;
	top: 15%;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
}
#perso-customstats .perso-stats {
	font-size: 0.9em;
}
#perso-customstats .perso-customstats input[type="range"] {
	width: 250px;
}
#perso-customstats #statsinfo {
	width: 390px;
}
#selectcustomstats {
	font-weight: bold;
	margin-top: 5px;
	margin-bottom: 8px;
}
#selectcustomstats img {
	position: relative;
	top: 3px;
	height: 20px;
	margin-right: 2px;
}
#restorestats {
	display: none;
	margin-top: 3px;
	font-size: 0.9em;
}
#perso-info {
	position: fixed;
	display: none;
	left: 50%;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
	width: 90%;
	max-width: 360px;
	font-size: 16pt;
	color: white;
	background-color: rgba(102,119,204, 0.8);
	border: solid 1px #BDE;
	z-index: 10;
}
#perso-info-rating {
	margin-top: 2px;
}
#perso-info-rating > div {
	width: 24px;
	height: 24px;
	position: relative;
	display: inline-block;
	overflow: hidden;
	margin: 0px 2px;
}
#perso-info-rating > div > div {
	position: absolute;
	left: 0;
	top: 0;
	overflow: hidden;
}
#perso-info-rating > div img {
	width: 24px;
}
#perso-info-name {
	margin-top: 4px;
	font-weight: bold;
}
#perso-info-author {
	font-size: 0.7em;
}
#perso-info-author strong {
	color: #CDE;
}
#perso-info-nbrates {
	font-size: 0.8em;
	position: relative;
	top: -4px;
	color: #CDE;
	margin-bottom: 2px;
}
.perso-bottom {
	margin-top: 10px;
	margin-bottom: 10px;
	height: 60px;
}
.collab-popup.collab-perso {
    background-color: #4242EF;
    text-align: left;
    color: #BDE;
    font-size: 0.9em;
}
.collab-popup.collab-perso .collab-popup-close {
    background-color: #1843b9;
}
.collab-popup.collab-perso .collab-popup-close:hover {
    background-color: #133594;
}
.collab-popup.collab-perso h2 {
    font-size: 1.5em;
    color: white;
}
.collab-popup.collab-perso h3 {
    color: white;
    margin-bottom: 0.1em;
}
.collab-popup.collab-perso a:hover {
    color: #CDE;
}