html,body{
			height: 100%;
		}
		
		label{
			font-size: 12px;
			font-weight: 500;
		}
		
		.form-control:focus{
			box-shadow: none;		
    		border-color: #ced4da;
		}
		
		#captcha{
			position: relative;
			width: 45%;
		}
		
		#captcha-img{
			border-radius: 5px;		
			width: 50%;
			position: absolute;
		    top: 0px;
		    right: 5px;
			height: 38px;
		}
		
		#form-container{
			background-color: #fff;
		    border-radius: 5px;
		    -webkit-box-shadow: 0px 3px 20px 3px rgba(0,0,0,0.1);
		    -moz-box-shadow: 0px 3px 20px 3px rgba(0,0,0,0.1);
		    box-shadow: 0px 3px 20px 3px rgba(0,0,0,0.1);
		    padding: 25px 40px 40px 40px;
		    position: relative;
		}
		
		.form-row{
			margin-bottom: 20px;
		}
		
		
		.form-header{
			border-bottom: 1px solid #ccc;
			font-size: 22px;
			font-weight: 400;
			margin-bottom: 15px;
			padding-bottom: 5px;
		}
		
		#next-button{
			width: 100%;
		}
		
		.form-group{
			margin-bottom: 1.3rem;
		}
		
		p{
			font-size: 18px;
			font-weight: 300;
		}
				
		button{
			background-color: #5b9d45;
		}
		
		.hidden{
			display: none !important;
		}
		
		.d-flex > .row{
			width: 100%;
		}
		
		.main-container{
			padding-left: 300px;
		}
		
		.mobile-logo-container{
			position: absolute;
			left: 0px;
			top: 0px;
			width: 100%;
			height: 60px;
			background: url("../img/bg.png") no-repeat 0 0;
			background-size: cover;
			-webkit-box-shadow: 0px 5px 10px 5px rgba(0,0,0,0.1);
			-moz-box-shadow: 0px 5px 10px 5px rgba(0,0,0,0.1);
			box-shadow: 0px 5px 10px 5px rgba(0,0,0,0.1);
		}
		
		.desktop-logo-container{
			position: fixed;
			left: 0px;
			top: 0px;
			width: 280px;
			height: 100%;
			background: url("../img/bg.png") no-repeat 0 0;
			background-size: cover;
			-webkit-box-shadow: 5px 0px 20px 5px rgba(0,0,0,0.1);
			-moz-box-shadow: 5px 0px 20px 5px rgba(0,0,0,0.1);
			box-shadow: 5px 0px 20px 5px rgba(0,0,0,0.1);
		}
		
		#vcloud-logo{
			position: absolute;
			bottom: 10px;
			left: 50%;
			transform: translateX(-50%);
		}
		
		#vcloud-logo-mobile{
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translateX(-50%) translateY(-50%);
		}
		
		#img-container{
			border-top: 1px solid #ccc;
			text-align: center;
    		padding: 15px 10px 10px 10px;
			width: 100%;
			margin-top: 20px;			
		}
		
		input.invalid, select.invalid{
			border: 1px solid red !important;
		}
		
		em{
			position: absolute;
		    font-size: 12px;
		    color: red;
		}
		
		.form-check-input {
		    margin-top: 8px;
		}

		.form-check-label {
		    font-size: 14px;
		    font-weight: 300;		    
    		line-height: 16px;
		}
		
		#button-container{
			text-align: center;
			width: 100%;
			margin: 30px 0px;
		}
		
		#finishregistration{
			background-color: #eeac4d;
			border: none;			
    		box-shadow: 0px 3px 20px 3px rgba(0,0,0,0.1);
			padding: 10px 30px;
			font-weight: 500;
			font-size: 16px;
		}		
		
		#finishregistration:hover{
			background-color: dda14b;
    		box-shadow: 0px 4px 24px 4px rgba(0,0,0,0.2);
		}
		
		#page-header{
		    margin-bottom: 30px;
		    font-size: 28px;
		    line-height: 32px;
		    margin-top: 30px;
		}
		
		.center {
			text-align: center;
		}
		
		#info-box {
			background: #F8F8F8 0% 0% no-repeat padding-box;
			box-shadow: 0px 1px 6px #00000029;
			border-radius: 4px;
			padding: 15px 10px 5px 10px;
			margin-bottom: 30px;
		}
		
		.info-box-rows {
			line-height: 1.1;
			margin-bottom: 10px;
			padding-left: 30px;
			position: relative;
			font-size: 14px;
		}
		
		#button-container {
			text-align: right;
			margin: 30px 0px 30px 0px;
		}
		
		.form-header {
		    border-bottom: none;
		    font-size: 22px;
		    font-weight: 400;
		    border-radius: 5px;
		    color: #fff;
		    margin-bottom: 15px;
		    padding: 10px 20px;
		    background: #20323f;
		}
		
		.form-control{
			background-color: #F8F8F8;	
		}
		
		.info-icon{
			position: absolute;
			left: 0px;
			top: 50%;
			transform: translateY(-50%);
			max-width: 20px;
		}
		
		#allowcommunication-error{
			top: 25px;
		}
		
		.hidden{
			display: none;
		}
		
		.municipality .hidden{
			display: block !important;
		}
		
		#info{
			position: absolute;
			width: 20px;
			height: 20px;
			border-radius: 20px;
			background-color: #20323f;
			color: #fff;
			line-height: 20px;
			text-align: center;
			font-weight: bold;
			cursor: pointer;
			top: 3px;
		    margin-left: 5px;
		}
		
		#cancelregistration {
		    border: none;
		    box-shadow: 0px 3px 20px 3px rgb(0 0 0 / 10%);
		    padding: 10px 30px;
		    font-weight: 500;
		    font-size: 16px;
		    margin-right: 20px;
		}
		
		#header-logo{
			max-width: 180px;
		}
		
		@media all and (max-width: 768px){

			
			#info{
				top: 15px;
			}
			
			#relativestatus{
				margin-bottom: 20px;
			}
			
			.form-header{
				font-size: 18px;
			}
			
			#relativestatus-error, #surname-error{
				top: 80px;
			}
			
			#page-header{
				font-size: 20px;
			}
			
			#allowcommunication-error{
				top: 35px;
			}
			
		}
		
		@media all and (max-width: 410px){
			.checkbox-row{
				margin-top: 20px;
			}
			
			#button-container{
				margin-top: 0px;
			}
		
			#cancelregistration, #finishregistration{
				width: 100%;
			}
			
			#finishregistration{
				margin-top: 20px;
			}
		}		

		
		@media (max-width: 991.98px){
			.align-self-center{
				align-self: auto!important;
			}
			
			.d-flex > .row{
				width: auto;
			}

		}		
		
		@media (max-width: 991.98px) and (min-width: 576px) {
			label:not(.form-check-label){
				margin-top: 15px;
			}
			
			.form-row{
				margin-bottom: 5px;
			}
		}
		
		@media (max-width: 575px){
			.d-flex > .row{
				width: auto;
			}
		
			label:not(.form-check-label){
				margin-top: 15px;
			}
			
			.form-row{
				margin-bottom: 0px;
			}
			
			#form-container{
    			padding: 40px 40px 40px 40px;
			}
			
			.form-header{
    			margin-bottom: 5px;
			}
		}
		
		@media (max-width: 1200px) {
			.main-container{
				padding: 60px 15px 15px 15px;
			}
		}