@font-face {
  font-family: 'Marmelad';
  src: local('Marmelad'),
       url('/fonts/marmelad.regular.ttf') format('truetype');
}
.refOverlay{
    font-family: 'Marmelad';
    font-size:12px;
	letter-spacing:0;
    display:flex;
    flex-direction:column;
    justify-content: center;
    align-items: center;
    position: fixed;
    left: 0;
    top: 0;
    min-width:100%;
    min-height:100%;
    margin:0;
    background: #222222;
    opacity: 80%;
	z-index:99;
}
.referrer{
    font-family: 'Marmelad';
    font-size:12px;
	letter-spacing:0;
    display:flex;
    flex-direction:column;
    justify-content: center;
    align-items: center;
    position: fixed;
    left: 0;
    top: 0;
    min-width:100%;
    min-height:100%;
    margin:0;
    opacity: 100%;
	z-index:100;
}

#refInfo{
    width:500px;
    height:300px;
    text-align: center;
    background: #FFFFFF;
    opacity: 100%;
    overflow: hidden;
	border-radius: 0em 0em 1em 1em;
	border-top: 1em solid #999999;
}

#refAdd{
    width:480px;
    height:200px;
    text-align: center;
    background: #000000;
    opacity: 100%;
    overflow: hidden;
	overflow-x:hidden;
    padding: 10px 10px;
	border-radius: 1em 1em 0em 0em;
}
.toggle label {
	position: relative;
	display: inline-block;
	width: 20em;
	height: 1.8em;
    text-align: left;
    padding-left:4em;
    margin:0;
}

.toggle input {
	display: none;
}

.toggle .slider {	
	position: absolute;
	cursor: pointer;
	top: 0em;
	left: 0em;
	width: 3em;
	height: 1.5em;
	background-color: #c32e04;
	
	transition: all .3s ease-in-out;
	border-radius: 1em;
}

.toggle .slider:before {
	position: absolute;
	content: "";
	height: 1.1em;
	width: 1.1em;
	left: 0.2em;
	bottom: 0.2em;
	background-color: white;
	border-radius: 50%;
	transition: all .3s ease-in-out;
}

.toggle input:checked + .slider {
  background-color: #5a9900; 
}
 
.toggle  input:checked + .slider::before {
  transform: translateX(1.5em);
}

.toggle input:disabled + .slider {
  background-color: #AAAAAA;
  cursor: default;
}
 
.toggle  input:checked + .slider::before {
  transform: translateX(1.5em);
}

.extSubmit{
    min-width:10em;
    min-height:2em;
    font-weight: bold;
    font-size: 1.2em;
    border-radius: 0.5em;
    cursor: pointer;
    margin-top:1em;
}
.extLock{
    width:640px;
    height:360px;
    font-family: 'Marmelad';
    font-size:1em;
    color:#FFFFFF;
    background-color:#222;
    cursor: pointer;
    border:0;
}
.extLock:hover{
    
}