/* Styling GoFriendo 26.08.2020 */

	/* ALLGEMEIN */

	html {
		display: flex;
		justify-content: center;
	}


	body { 
		/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#4ddc87+0,1abe5c+100 */
		background: #4ddc87; /* Old browsers */
		background: -moz-linear-gradient(top, #4ddc87 0%, #1abe5c 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top, #4ddc87 0%,#1abe5c 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom, #4ddc87 0%,#1abe5c 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4ddc87', endColorstr='#1abe5c',GradientType=0 ); /* IE6-9 */
		font-family: Arial Rounded MT Bold, Helvetica Rounded;
		font-family: ArialRoundedMTBold, "Arial Rounded MT Bold", Arial, Helvetica, sans-serif;

		display:flex;
		justify-content:center;
		align-items:center;
		/*
		background-color: #fff !important; 
		margin: 0px; 
		padding: 0px;
		//background-image: url("media/green-bg.jpg");
		background-repeat: repeat-x;
		//font-family: Arial Rounded MT Bold, Helvetica Rounded;
		font-family: ArialRoundedMTBold, "Arial Rounded MT Bold", Arial, Helvetica, sans-serif;
		*/
		}
	
	a {
		text-decoration: none !important; 
		color: #0C9F47 !important; 
	}
	
	.container {
		max-width: 70%;
	}
	
	.footer a { 
		color: #000;
	}
	
	h1 {
		margin-bottom: 40px;
	}
	
	h2 {
		color: #91d441;
		margin-bottom:20px !important;
		font-size: 20px !important;
		text-align: center;
	}
	
	p {
		color: #222222;
		font-size: 14px;
		margin-bottom: 5px;
	}
	
	select {
		width: 100%;
		padding: 10px;
		background-color: lightgray;
		border-radius: 4px;
		color: #fff;
		border: none;
		font-weight: bold;
	}
	
	textarea {
		width: 100%;
		padding: 10px;
		background-color: lightgray;
		border-radius: 4px;
		color: #fff;
		border: none;
		font-weight: bold;
	}
	
	.content h2 {
		color: #91d441;
		text-align: left;
	}
		
	
	.login {
		background-color: #fff;
		padding: 20px;
		border: solid;
		border-width: 1px;
		border-color: #8CC744;
		border-radius: 4px;
	}
	
	.login a {
		color: #000 !important;
	}
	
	a.green-btn {
		background-color: #91D441;
		color: #fff;
		padding: 7px;
		border-radius: 20px;
		width: max-content;
		padding-left: 10px;
		padding-right: 14px;

	}
	
	a.green-btn:hover {
		background-color: #393737;
	}
	
	.padtop {
		padding-top: 8%;
		
	}

	
	input {
		background-color: #fff;
		color: #7EC12C;
		padding: 10px;
		border: 0px;
		margin-bottom: 10px !important;
			border-top-color: currentcolor;
			border-top-style: none;
			border-top-width: 0px;
			border-right-color: currentcolor;
			border-right-style: none;
			border-right-width: 0px;
			border-bottom-color: currentcolor;
			border-bottom-style: none;
			border-bottom-width: 0px;
			border-left-color: currentcolor;
			border-left-style: none;
			border-left-width: 0px;
		font-size: 18px;
		border-color: #20212a;
		border-style: solid;
		border-width: 0px;
		width: 100%;
		border-bottom: solid;
		border-bottom-width: 1px;
		border-bottom-color: #7EC12C;
	}
	
	.logo {

		display: block;
		align-items: center;
		justify-content: center;
		text-align: center;

	}
	
	.logo img {
		width: 235px;
		margin-top: 20px;
	}
	
	.grey1 {
		border: solid;
		border-width: 1px;
		border-color: #7EC12C;
		border-radius: 4px;
		color: #fff;
		background-color: #91D441;
	}
	
	ul.navigation {
		margin: 0px;
		padding: 0px;
	}
	
	ul.navigation li {
		margin: 0px;
		padding: 0px;

		list-style: none;
		padding: 10px;
		color: #000;
		margin-bottom: 1px;
	}
	
	ul.navigation li a {
		color: #000 !important;
	}
	
	ul.navigation li:hover { 
		background-color: #fff;
	}
	
	ul.navigation li a {
		display: block;
	}
	
	ul.navigation li ul li {
		margin-left: 15px;
	}
	
	.nav-container {
		padding:20px 0 20px 0;
		background-color: #fff;
		background: rgba(255, 255, 255, 0.3);
		border-right: solid;
		border-right-width: 1px;
		border-right-color: #7EC12C;
	}
	
	.content {
		padding-top:20px;
	}
	
	.table-striped {
		margin-top: 20px;
	}
	
	.free-register-btn {
		color: #fff;
		font-size: 13px;
	}
	
	.footer {
		margin-top: 10px;
		font-size: 13px;
	}
	
	.footer a {
		color: #000 !important;
	}
	
	.topnav {
		background-color: #91D441;
		height: 50px;
		border-bottom: solid;
		border-bottom-width: 1px;
		border-bottom-color: #7EC12C;
		padding-top: 10px;
	}
	
	.topnav select {
		border-radius: 4px;
		border-width: 1px;
		border-color: #8CC744;
		border-radius: 4px;
	}
	
		
	
	.topnav input {
		float: right;
		height:30px;
		width: 20%;
		margin-right: 10px;
	}
	
	.left-logo {
		float: left;
		width: 50%;
	}
	
	.right-col {
		float: right;
		width: 50%;
		text-align: right;
	}
	
	.active .bs-stepper-circle {
		background-color: #fff;
		color: #91D441;
	}
	
	.btn-primary {
		border: solid;
		border-width: 1px;
		border-color: #7EC12C;
		border-radius: 4px;
		color: #fff;
		background-color: #91D441;
	}
	
	.btn-primary:hover {
		background-color: #8de736;
		border: solid;
		border-width: 1px;
		border-color: #7EC12C;
		border-radius: 4px;
	}
	
	.btn-primary:focus {
		background-color: #8de736;
		border: solid;
		border-width: 1px;
		border-color: #7EC12C;
		border-radius: 4px;
	}
	
	.btn-primary:not(:disabled):not(.disabled).active {
		background-color: #8de736;
		border: solid;
		border-width: 1px;
		border-color: #7EC12C;
		border-radius: 4px;
	}
	
	.bs-stepper .step-trigger {
		color: #fff;
	}
	
	.bs-stepper .line {
		background-color: #fff;
	}
	
	.bs-stepper-circle {
		background-color: #fff;
		color: #91D441;
	}
	
	.country-input {
		width: 100%;
		padding: 15px;
	}
	
	.statusopen {
		border-radius: 4px;
		background-color: #dd9200;
		padding: 3px;
		text-align: center;
		color: #fff;
		font-size: 14px;
	}
	
	
/******************/


* {
	margin: 0;
	padding: 0
}

html {
	height: 100%
}

h2{
	color: #2F8D46;
}
#form {
	position: relative;
	margin-top: 20px
}

#form fieldset {
	border: 0 none;
	border-radius: 0.5rem;
	box-sizing: border-box;
	width: 100%;
	margin: 0;
	padding-bottom: 20px;
	position: relative
}

.finish {
	text-align: center
}

#form fieldset:not(:first-of-type) {
	display: none
}

#form .previous-step, .next-step {
	width: 100px;
	font-weight: bold;
	color: white;
	border: 0 none;
	cursor: pointer;
	padding: 10px 5px;
	margin: 10px 0px 10px 0px;
	float: right;
	border-radius: 4px;
}

.form, .previous-step {
	background: #616161;
}

.form, .next-step {
	background: #91d441;
}

#form .previous-step:hover,
#form .previous-step:focus {
	background-color: #000000
}

#form .next-step:hover,
#form .next-step:focus {
	background-color: #91d441;
}

.text {
	color: #2F8D46;
	font-weight: normal
}

#progressbar {
	margin-bottom: 30px;
	overflow: hidden;
	color: lightgrey;
	text-align: center;
}

#progressbar .active {
	color: #
}

#progressbar li {
	list-style-type: none;
	font-size: 15px;
	width: 25%;
	float: left;
	position: relative;
	font-weight: 400
}

#progressbar #step1:before {
	content: "1"
}

#progressbar #step2:before {
	content: "2"
}

#progressbar #step3:before {
	content: "3"
}

#progressbar #step4:before {
	content: "4"
}

#progressbar li:before {
	width: 50px;
	height: 50px;
	line-height: 45px;
	display: block;
	font-size: 20px;
	color: #ffffff;
	background: lightgray;
	border-radius: 4px;
	margin: 0 auto 10px auto;
	padding: 2px
}

#progressbar li:after {
	content: '';
	width: 100%;
	height: 2px;
	background: lightgray;
	position: absolute;
	left: 0;
	top: 25px;
	z-index: -1
}

#progressbar li.active:before,
#progressbar li.active:after {
	background: #91d441
}

.progress {
	height: 20px
}

.progress-bar {
	background-color: #91d441
}

.content {
	width: 100%;
	float: left;
	color: #0C9F47;
	text-align: center;
	font-size: 12px;

}