body{
	font-size:14px;
	line-height:14px;
	font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
	color: #1c1e21;
}
a{
	text-decoration:none;
	color: #1c1e21;
}
.container{
	width:800px;
	margin: 20px auto 20px auto;
}
.left{
	float:left;
	width:48%;
}
.right{
	float:right;
	width:48%;
}
.clear{
	clear:both;
}
.field{
	border:1px solid rgb(219, 219, 219);
	border-radius:1px;
	margin-top:100px;
}
.field-inner{
	padding:10px 20px 10px 20px;
}
.join{
	border:1px solid rgb(219, 219, 219);
	border-radius:1px;
	margin-top:20px;
	text-align:center;
}
input::placeholder{
  color: rgb(142, 142, 142);
  font-weight: 300;
  opacity: 1;
}
input{
  background: rgb(250, 250, 250);
  border: 0;
  flex: 1 0 auto;
  margin: 0;
  outline: none;
  overflow: hidden;
  padding: 8px;
  text-overflow: ellipsis;
  width:100%;
  border:1px solid rgb(219, 219, 219);
  border-radius:6px;
}
input[type="submit"]{
	background: var(--color-main);
    color: #ffffff;
	display:block;
	cursor:pointer;
}
.signup-link{
	color:var(--color-main);
	font-weight:bold;
}
.center{
	text-align:center;
}
ul.menu li{
	display:inline-block;
}
ul.menu li a{
	display:block;
	margin-right:10px;
}
ul.menu li a:hover{
	text-decoration:underline;
}
.copyright{
	text-align:center;
	margin-top:100px;
}
span.language{
	display: inline-block;
	margin-right: 10px;
}
span.language select{
	border:0px;
	background:#ffffff;
}
.spinner {
  height: 10px;
  width: 10px;
  animation: rotate 0.8s infinite linear;
  border: 8px solid var(--color-main);
  border-right-color: transparent;
  border-radius: 50%;
  margin-left:auto;
  margin-right:auto;
}
@keyframes rotate {
  0%    { transform: rotate(0deg); }
  100%  { transform: rotate(360deg); }
}
#animation,#progress,#animation_2,#animation_3,#animation_4,#animation_5,#spinner,#dialog_animation,#contact-animation{
	display:none;
}
.error,.success,.warning,.information {
	background-repeat: no-repeat;
	background-position: 7px 50%;
	color: #fff;
	min-height: 46px;
	position:relative;
}
.information {
	background-image: url('../images/info.png');
	background-color: #fff;
	color: #000;
	border-left: 4px solid #04aeda;
}
.error {
	background-color: #d35351;
	background-image: url('../images/error.png');
}
.success {
	background-color: #03a84e;
	background-image:url('../images/success.png');
}
.warning {
	background-color: #FEEFB3;
	background-image: url('../images/warning.png');
}
.information p,.error p, .success p, .warning p,.validation p{
	padding: 13px 10px 10px 45px;
	font-size:14px;
}
.information p i,.error p i, .success p i, .warning p i,.validation p i{
	margin-left:10px;
}
.information a,.error a,.success a,.warning a,.validation a{
  position: absolute;
  right: 5px;
  top: 5px;
  color: #fff;
  cursor:pointer;
}
.image-container{
	width:150px;
	margin-left:auto;
	margin-right:auto;
	margin-top: 45px;
	border-top: 20px solid black;
	border-left: 8px solid black;
	border-bottom: 20px solid black;
	border-right: 8px solid black;
	border-radius: 10px;
	box-shadow: 0 0 0 10px #fff;
}
.image-container img{
	width:100%;
}
@media only screen and (max-width: 800px) {
	.wrapper{
		padding:10px;
	}
	.container {
		width: 100% ! important;
	}
	.left{
		display:none ! important;
	}
	.right{
		display:block ! important;
		width:100% ! important;
	}
}
:root {
  --color-main: #27a8e0;
  --color-white: #ffffff;
  --color-red: red;
}