/* FORM */

#content {min-width:400px}
.container {
	width: 100%;
	padding-right: 15px;
	padding-left: 15px;
	margin-right: auto;
	margin-left: auto;
}

.overflow-hidden {
	overflow: hidden !important;
}
a.entry-content:link, a.entry-content:visited {color:#b0d235}
table {font-size:0.8em;}
label span {color:#b0d235; font-size:80%;}
span.badge {background:#b0d235;color:white;}
.custom-control-input:checked~.custom-control-label:before {border-color: #b0d235;background-color: #b0d235;}
input[type="text"].form-control,input[type="password"].form-control,input[type="email"].form-control { background-color:#ffffff; border-top:none;border-left:none;border-right:none;border-radius:5px;padding:5px; }
input[type="number"].form-control {background-color:#ffffff;text-align: right;}
input.form-control:read-only { background-color:#e9ecef; cursor:not-allowed; }
input[type="file"].form-control {background-color:#ffffff; cursor:pointer;}
input.form-control:disabled, input[type="file"].form-control:disabled, select.custom-select:disabled, textarea.form-control:disabled  { background-color:#e9ecef; cursor:not-allowed; }
select, .custom-select { background-color:#ffffff; cursor:pointer; }
input[type="button"], input[type="submit"], 
.btn, .btn.green:hover { background:#b0d235 !important;border: 4px #ffffff double;border-radius:10px;color:#ffffff !important;padding:10px 15px; }
.btn.green, .btn:hover { background:#ffffff !important;color:#b0d235 !important; border-color:#b0d235; }
.bg-green { background:#b0d235; }
.green, .fa-green, h1, h2, h3, a, b, strong, small span { color:#b0d235; }
.fa-green:hover {display:none;}
.fa-white {color:#ffffff;}
.fa-white:hover,  {display:none;}
.roboto {
	font-family: "roboto_condensedregular", "OpenSans", sans-serif;
}

.h3, h3 {font-size: 1.2rem}

.logo { width: 50px; }
.navbar .navbar-nav{font-family:Poppins;font-weight:500}
.skr-green,
.navbar.navbar-light .breadcrumb .nav-item .nav-link, .navbar.navbar-light .navbar-nav .nav-item .nav-link,
.navbar-nav .nav-link.active,.navbar-nav .show>.nav-link{color:#b0d235}
.welcome-header {
	padding: 0 0 0 70px;
	z-index:1;
}
.welcome-title {
	background: white;
	border-radius: 10px;
	color: #b0d235;
	margin-bottom: .5rem;
	padding: 5px 100px 5px 0;
	text-align:right;
	z-index:1;
}

.form-test_form {
	background: rgba(215,215,215,0.1);
	border-radius:10px;
	position:relative;
	min-height: 450px;
}
.form-test_group {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 0;
	opacity: 0;
	padding: 2rem;
	visibility: hidden;
}
.form-test_group.active {
	height: auto;
	opacity: 1;
	visibility: visible;
}
.form-test_group.active {
	transition-property: all;
	transition-duration: 0.3s;
	transition-timing-function: linear;
	transition-delay: 0s;
}
.form-test_group-title {
	text-align:center;
}
.form-test_group-subtitle {
	border-bottom: #b0d235 1px solid;
}
.form-test_option {
	display: none;
	opacity: 0;
	visibility: hidden;
}
.form-test_option.active {
	display: block;
	opacity: 1;
	visibility: visible;
}
.form-test_option.active {
	top: 0;
	transition-property: all;
	transition-duration: 0.8s;
	transition-timing-function: linear;
	transition-delay: 0s;
}
.form-check-input:checked {
	background-color:#b0d235;
	color:#b0d235;
}
.form-select {
	line-height:1.4;
}

.input-group .input-step {
  line-height: 1.2;
  border-radius: 5px;
}

#progressbar {
	overflow: hidden;
	/*CSS counters to number the steps*/
	counter-reset: step;
	margin: 0 auto;
	width:100%;
}
#progressbar li {
	list-style-type: none;
	color: #b0d235;
	cursor: pointer;
	text-transform: uppercase;
	font-size: 9px;
	width: 12%;
	float: left;
	position: relative;
	text-align:center;
}
#progressbar li:before {
	background: white;
	border: 2px solid #b0d235;
	border-radius: 3px;
	color: #b0d235;
	content: counter(step);
	counter-increment: step;
	display: block;
	font-size: 10px;
	line-height: 20px;
	margin: 0 auto 5px auto;
	position: relative;
	width: 20px;
	z-index: 10;
}
/*progressbar connectors*/
#progressbar li:after {
	content: '';
	width: 100%;
	height: 2px;
	background: #b0d235;
	position: absolute;
	left: -50%;
	top: 9px;
	z-index: 1; /*put it behind the numbers*/
}
#progressbar li:first-child:after {
	/*connector not needed before the first step*/
	content: none; 
}
/*marking active/completed steps green*/
/*The number of the step and the connector before it = green*/
#progressbar li.active:before,  #progressbar li.active:after{
	background: #b0d235;
	color: white;
}

/* text for disabled forms */
.form-disabled,
.form-disabled input.form-control:disabled,
.form-disabled input[type="file"].form-control:disabled,
.form-disabled select.custom-select:disabled,
.form-disabled textarea.form-control:disabled {
	font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif; 
	font-size: 11px;
	height: auto;
	line-height: 11px;
}
.button-row {
	justify-content: space-between;
}

.wp-block-group.wp-container-2, .wp-block-group.wp-container-3 {
 flex-wrap:nowrap;
 justify-content:flex-end;
}
.z-index-1 {
	z-index:1;
}
.page-footer {
	position: fixed;
	width: 100%;
}
#timer {
	background: rgba(0,0,0,0.4);
	border-radius: 5px;
	color: #b0d235;
	font-weight: bold;
	padding: 5px;
	position: fixed;
	right: 10%;
	top: 120px;
	z-index: 100;
}

/* LOGIN */
.login .btn-home,
.login .btn-toggler,
.login .btn-logOut,
.test .btn-toggler,
.test .form-test_btn-prev span,
.test .form-test_btn-next span,
.page-title span
{ display: none !important;}

.btn-logo {margin-right: 0}
.btn-username {
	position: absolute;
	right:8%;
	top:10%;
}
.toolbar {
	align-items: center;
	display:flex;
	margin-top: 10px;
	width:100%;
	}

/* MEDIA */
@media (min-width: 576px) {
	.container {
		max-width: 540px;
	}
}
@media only screen and (min-width: 720px) {
	#timer {
		top: 120px;
		right: 10%;
	}
}
@media (min-width: 768px) {
	.container { max-width: 720px }
	.logo { width: 75px }
	.page-title span {display:inline-block}
}
/* 900px */
@media only screen and (min-width: 950px) {
	#cboxContent table { font-size:0.8em;}
}
@media (min-width: 992px) {
	body {font-size: 1.5rem}
	.h3, h3 {font-size: 1.75rem}
	.container {max-width: 960px}
}
@media (min-width: 1200px) {
	.container {max-width: 1140px}
	.btn-username {right:10%}
}
@media (min-width: 1400px) {
	.container {max-width: 1340px}
	.btn-username {right:16%}
}

