* {
  margin: 0;
}
html {
  height: 100%;
  text-rendering: optimizeLegibility !important;
-webkit-font-smoothing: antialiased !important;
}

body
{		
	background-color: #fff;
	font-size : 13px;
	text-align: center; /* voor IE */ 
	color: #33373f;
	padding: 0px;
	margin: 0px;
	font-family: 'Open Sans', sans-serif;
	line-height: 24px;
	font-weight: 400;
	height: 100%;

}
				
	#wrapper { flex: 1; }
	
	.background_icon { float: left; width: 100%; margin-top: 150px; position: fixed; margin-left: auto; margin-right: auto; text-align: center;  }
		.background_icon img { width: 450px; opacity: 0.03; }

	/* LOGIN */
	#login_container { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; }
		#login_container #content { float: left; width: 450px;  }
			#login_container #content .left { float: left; width: 100%; }
				#login_container #content .left img.logo {width: 150px; margin-bottom: 20px; margin-top: 20px; }
				#login_container #content .left  h1 {  font-weight: normal; padding: 5%; padding-bottom: 0%;  }
				#login_container #content .left  h2 {  font-weight: lighter; padding: 5%; padding-top: 0%; margin-top: 0; opacity: 1; font-size: 16px; }
			
			#login_container #content .right { float: left; width: 100%;  }
				#login_container #content .right h1 { display: block; margin-top: 0px; padding-top: 0px; font-weight: normal; margin-top: -10px; margin-bottom: 20px; }
				#login_container #content .right h3 { font-size: 20px; margin: 0px; font-weight: normal; font-family: 'Open Sans', sans-serif;  }
				#login_container #content .right table {width: 100%; margin: 0px; padding: 0px; }
				#login_container #content .right input[type=text] { width: calc(100% - 20px); border-radius: 5px;  -moz-appearance: none;  -webkit-appearance: none;-webkit-appearance: none; font-family: 'Open Sans', sans-serif; height: 40px;  padding-left: 10px; padding-right: 10px; background-color: #fff; border: 0px; border: 1px solid #e1e1e1; margin-bottom: 10px; }
				#login_container #content .right input[type=email] { width: calc(100% - 20px); border-radius: 5px;  -moz-appearance: none;  -webkit-appearance: none;-webkit-appearance: none; font-family: 'Open Sans', sans-serif; height: 40px;  padding-left: 10px; padding-right: 10px; background-color: #fff; border: 0px; border: 1px solid #e1e1e1; margin-bottom: 10px; }
				#login_container #content .right input[type=password] {  width: calc(100% - 20px); border-radius: 5px; -moz-appearance: none;  -webkit-appearance: none; font-family: 'Open Sans', sans-serif;  height: 40px; padding-left: 10px; padding-right: 10px; background-color: #fff; border: 0px; border: 1px solid #e1e1e1;  margin-bottom: 10px;}
				#login_container #content .right input:-webkit-autofill, select:-webkit-autofill {-webkit-box-shadow: 0 0 0px 1000px white inset;  }
				#login_container #content .right input:focus, select:focus { outline: 0;-webkit-box-shadow: 7px 7px 16px -11px rgba(238,238,238,1); }
				#login_container #content .right input[type=submit] { -moz-appearance: none; border-radius: 5px; width: 100%;  -webkit-appearance: none;  font-family: 'Open Sans', sans-serif; font-weight: 600;  margin-top: 10px; height: 50px; background-color: #005df8; color: #fff; padding-left: 20px; padding-right: 20px; border: 0px; font-weight: bold;  font-size: 14px; }
				#login_container #content .right input[type=submit]:hover { opacity: 0.8; }
				#login_container #content .right select { width: calc(100%); border-radius: 5px; background: #fff url(../images/icons/icon-arrow.png) no-repeat right center; background-position: 95% 15px;  -moz-appearance: none;  -webkit-appearance: none;-webkit-appearance: none; font-family: 'Open Sans', sans-serif; height: 45px;  padding-left: 10px; padding-right: 10px; background-color: #fff; border: 0px; border: 1px solid #e1e1e1; margin-bottom: 10px; }

				#login_container #content .right tr.small { height: 20px; margin: 0px; padding: 0px; line-height: 15px; }
					#login_container #content .right tr.small td { margin: 0px; padding: 0px; }
				#login_container #content .right a { font-size: 13px; color: #8e9b9f; text-decoration: underline; }
				#login_container #content .right a:hover { color: #05212f; }
				#login_container #content .right .box a { font-size: 13px;} 
				
				/* TOGGLE SWITCH */
				.switch { position: relative; float: right !important; display: inline-block; margin-left: 15px; width: 55px; height: 28px; }
					.switch  input { opacity: 0; width: 0; height: 0; }
					.slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #dedede; -webkit-transition: .8s; transition: .8s; }
					.slider:before { position: absolute; content: ""; height: 21px; width: 21px; left: 4px; bottom: 4px; background-color: white; -webkit-transition: .8s; transition: .8s; }
					.slider.round { border-radius: 28px; }
					.slider.round:before { border-radius: 31px; }
					#login_container #content .right input:-webkit-autofill {-webkit-box-shadow: 0 0 0px 1000px white inset; }
					input:checked + .slider { background-color: #005df8; }
					input:focus + .slider { outline: none; outline-width: 0;  }
					input:checked + .slider:before { -webkit-transform: translateX(26px); -ms-transform: translateX(26px); transform: translateX(26px); }
					
				#login_container #content .right .verification { text-align: left; }
				#login_container #content .icon { vertical-align: middle; margin-top: -3px; margin-right: 5px; }
	
				
				
				#login_container #content .footer { float: left; width: 100%; text-align: center; margin-top: 15px; margin-bottom: 15px; }
					#login_container #content .footer a { color: #33373f; text-decoration: none; }
						#login_container #content .footer a:hover { color: #33373f; text-decoration: underline; }
				
				/* BUTTON */
				#login_container #content .right .button { display: inline-block; font-size: 13px; text-decoration: none; line-height:50px; border-radius: 5px; -moz-appearance: none; cursor: pointer; width: calc(100% - 40px); max-width: 400px;  -webkit-appearance: none;  font-family: 'Open Sans', sans-serif; font-weight: 600;  margin-top: 10px; height: 50px; background-color: #005df8; color: #fff; padding-left: 20px; padding-right: 20px; border: 0px; font-weight: bold;  font-size: 14px; }
				#login_container #content .right .button:hover { color: #fff; opacity: 0.8; }
				
					

				@media only screen and (max-width : 768px) {
					.background_icon { margin-top: 25px; }
					#login_container #content .left img.logo {margin-top: 25px; width: 150px; }
                    h1 { font-size: 21px; }
                    h2 { font-size: 14px;}
					#login_container { position: relative; float: left; width: 100%; height: auto; top: 25px; left: 0%; transform: none;}
					#login_container #content { float: left; width: 100%; }
					#login_container #content .left { width: 90%; margin-left: 5%; }
					#login_container #content .left h1 { margin-bottom: 0px;}
					#login_container #content input, select { border-radius: 5px; -webkit-appearance: none; }
					#login_container #content .right { width: calc(100% - 10%); margin-left: 5%; margin-right: 5%;}
					#login_container #content .right h1 { margin-top: 10px; margin-bottom: 10px; }	
					//table { text-align: center; }
				
				}	
				
	/* USER BACKEND */
	
		/* HEADER CONTAINER */
		#header_container { float: left; width: 100%; margin: auto; background-color: #fff; }
			#header_container .content { width: 100%; max-width: 1280px; height: auto;text-align: left; margin: 0px; margin-left: auto; margin-right: auto; }
			
			#header_container .content .logo { float: left; max-width: 100px; margin-top: 20px; }
			
			/* MENU */
			#header_container .content .left_menu { float: left;  margin-left: 50px;  font-weight: 600; margin-top: -5px;  }
				#header_container .content .left_menu ul li { display: block; height: 52px; }
				#header_container .content .left_menu ul li:hover { cursor: pointer; border-bottom: 2px solid #005df8; color: #005df8; }
				
			#header_container .content .right_menu { float: right;  width:auto; margin-top: -5px; }
				#header_container .content .right_menu ul li { margin-right: 15px !important; }
				#header_container .content .right_menu .messages_number { float: left; color: #fff; text-align: center; border: 2px solid #fff; margin-left: -5px; margin-top: 5px; position: relative; background-color: #005df8; padding-top: 2px; line-height: 10px; width: 15px; height: calc(15px - 2px); border-radius: 15px; z-index: 1; font-size: 10px; font-weight: bold; }
				#header_container .content .right_menu .notifications_number { float: left; color: #fff; text-align: center; border: 2px solid #fff; margin-left: -5px; margin-top: 5px; position: relative; background-color: #ffc000; padding-top: 2px; line-height: 10px; width: 15px; height: calc(15px - 2px); border-radius: 15px; z-index: 1; font-size: 10px; font-weight: bold; }
				#header_container .content .right_menu .icon-arrow { display: block; float: right; margin-left: 10px; margin-right: 10px; margin-top: 18px;  }
				#header_container .content .right_menu .messages { margin-top: 5px; }
				#header_container .content .right_menu .messages:hover { opacity: 0.6; }
				#header_container .content .right_menu .notifications { margin-top: 5px; }
				#header_container .content .right_menu .notifications:hover { opacity: 0.6; }
				
				#header_container .content .right_menu ul li.user { display: block; cursor: pointer; text-align: right; }
				#header_container .content .right_menu ul li.user ul { display: none; }
				#header_container .content .right_menu ul li.user:hover { position: relative;  z-index: 6; background-color: #fff;  border-radius: 5px;   }
				#header_container .content .right_menu ul li.user:hover ul { position: relative; margin: 0px; margin-left: -20px; padding-right: 20px; padding: 0px; height: auto; width: 100%; text-align: right; display: block;   }
					#header_container .content .right_menu ul li.user:hover ul li { float: inherit; width: 100%; display: block; margin-right: 20px;  }
					
			#header_container .content .icon { display: block; float: left; width: 15px; height: 15px; margin-top: 15px; }
			
			#header_container .content ul { float: left; margin: 0px; padding: 0px; height: 50px; line-height: 50px; margin-top: 8px;}
				#header_container .content ul li { float: left; list-style: none; margin-right:30px !important; }
					#header_container .content ul li:last-child { margin-right: 0px; }
				
			#header_container .content a { color: #33373f; text-decoration: none; }
				#header_container .content a:hover { color: #005df8; text-decoration: none; }
		
		/* CONTENT */
		.content_container { float: left; position: relative; width: 100%; min-height: calc(100% - 75px);  margin: auto; margin-top: 5px; background-color: #f3f5f8;  }
			.content_container .content { width: 100%; max-width: 1280px; padding-top: 25px; align-items: stretch; height: 100%;text-align: left; margin: 0px; margin-left: auto; margin-right: auto; }

				/* FLEX */
				.content_container .content .flex_container { float: left; width: 100%; margin-top: -35px; flex: 1; display: flex; flex-wrap: wrap;  align-items: stretch;}
				.content_container .content .box { display: block; float: left; margin-top: 50px; border-radius: 5px; width: 25%; border: 1px solid #eaecf0; }
				
				/* SEARCH */
				.content_container .content .search { float: right; position: relative; z-index: 5; margin-top: -35px; }
					.content_container .content .search ul { margin: 0px; padding: 0px; }
						.content_container .content .search ul li { float: left; list-style: none; margin-right: 15px;  }
						.content_container .content .search ul li:last-child { margin-right: 0px; }
						.content_container .content .search input[type=text] { width: calc(100% - 20px); border-radius: 5px;  -moz-appearance: none;  -webkit-appearance: none;-webkit-appearance: none; font-family: 'Open Sans', sans-serif; height: 40px;  padding-left: 10px; padding-right: 10px; background-color: #fff; border: 0px; border: 1px solid #e1e1e1; margin-bottom: 10px; }
						.content_container .content .search input:-webkit-autofill, select:-webkit-autofill {-webkit-box-shadow: 0 0 0px 1000px white inset;  }
						.content_container .content .search input:focus, select:focus { outline: 0;-webkit-box-shadow: 7px 7px 16px -11px rgba(238,238,238,1); }
						.content_container .content .search input[type=submit] { -moz-appearance: none; border-radius: 5px; width: 100%;  -webkit-appearance: none;  font-family: 'Open Sans', sans-serif; font-weight: 600;   height: 42px; background-color: #005df8; color: #fff; padding-left: 20px; padding-right: 20px; border: 0px; font-weight: bold;  font-size: 14px; }
						.content_container .content .search input[type=submit]:hover { opacity: 0.8; }
						.content_container .content .search select { width: calc(100%); border-radius: 5px; padding-right: 10px; background: #fff url(../images/icons/icon-arrow.png) no-repeat right center; background-position: 90% 15px;  -moz-appearance: none;  -webkit-appearance: none;-webkit-appearance: none; font-family: 'Open Sans', sans-serif; height: 45px;  padding-left: 10px; padding-right: 30px; background-color: #fff; border: 0px; border: 1px solid #e1e1e1; margin-bottom: 10px; }

				
				.content_container .content h1 { font-size: 18px; margin-top: 15px; }
				
				/* TABLE */
				.content_container .content table { width: 100%; padding: 0px; border-spacing: 0px; padding-bottom: 10px; margin-right: 20px; }
					.content_container .content table.users tr.head { }
					.content_container .content table.users tr.head td { border-bottom: 1px solid #eaecf0; color: #a6b0bf; font-size: 13px; font-weight:  600;}
					.content_container .content table.users td { height: 40px; padding-left: 20px; }
					/*.content_container .content table.users tr:nth-child(even) { background-color: #f1f1f1 ; } */
					.content_container .content table a { text-decoration: underline; color: #33373f; }
					.content_container .content table a:hover { color: #005df8; }
				
				
				.content_container .content .full_width { width: calc(100%) !important; }
				.content_container .content .full_width_25padding { width: calc(100% - 50px) !important; }
				.content_container .content .full_width_10padding { width: calc(100% - 20px) !important; }
				
				/* RISK ROUND */
				.content_container .content .risk_round { margin-left: auto;  word-break: break-all; font-weight: bold; margin-right: auto; width: 150px; line-height: 150px; height: 150px; border-radius: 75px; }
				.content_container .content .name_next { position: absolute; margin-left: 200px; margin-top: -35px; }
				.content_container .content ul.risk { display: block; margin: 0px; padding: 0px; text-align: left; }
					.content_container .content ul.risk li { list-style: none; }
					
				/* BUTTON */
				.content_container .content .button_small { display: block; position: relative; z-index: 10; float: left; font-size: 11px; width: auto; text-align: center; border-radius: 5px; padding-left: 10px; padding-right: 10px; }
				.content_container .content a.button_small { text-decoration: none; }
				.content_container .content a.button_small:hover { opacity: 0.8; }
				.content_container .content .button { display: block; float: left; width: auto; text-align: center; border-radius: 5px; height: 40px; line-height: 40px; padding-left: 10px; padding-right: 10px; }
				.content_container .content a.button:hover { opacity: 0.8; }
				.content_container .content .button .icon { vertical-align: middle; margin-top: -3px; margin-right: 5px; }
				.content_container .content a.button { text-decoration: none; }
				.content_container .content a.background_white { color: #33373f; }
				.content_container .content a.background_white:hover { opacity: 0.6; }
				
				/* INPUT */
				.content_container .content form.basic input[type=text] { width: calc(100% - 20px); border-radius: 5px;  -moz-appearance: none;  -webkit-appearance: none;-webkit-appearance: none; font-family: 'Open Sans', sans-serif; height: 40px;  padding-left: 10px; padding-right: 10px; background-color: #fff; border: 0px; border: 1px solid #e1e1e1; margin-bottom: 10px; }
				.content_container .content form.basic input[type=email] { width: calc(100% - 20px); border-radius: 5px;  -moz-appearance: none;  -webkit-appearance: none;-webkit-appearance: none; font-family: 'Open Sans', sans-serif; height: 40px;  padding-left: 10px; padding-right: 10px; background-color: #fff; border: 0px; border: 1px solid #e1e1e1; margin-bottom: 10px; }
				.content_container .content form.basic input[type=password] {  width: calc(100% - 20px); border-radius: 5px; -moz-appearance: none;  -webkit-appearance: none; font-family: 'Open Sans', sans-serif;  height: 40px; padding-left: 10px; padding-right: 10px; background-color: #fff; border: 0px; border: 1px solid #e1e1e1;  margin-bottom: 10px;}
				.content_container .content form.basic input:-webkit-autofill, select:-webkit-autofill {-webkit-box-shadow: 0 0 0px 1000px white inset;  }
				.content_container .content form.basic input:focus, select:focus { outline: 0;-webkit-box-shadow: 7px 7px 16px -11px rgba(238,238,238,1); }
				.content_container .content form.basic input[type=submit] { -moz-appearance: none; border-radius: 5px; width: 100%;  -webkit-appearance: none;  font-family: 'Open Sans', sans-serif; font-weight: 600;  margin-top: 10px; height: 50px; background-color: #005df8; color: #fff; padding-left: 20px; padding-right: 20px; border: 0px; font-weight: bold;  font-size: 14px; }
				.content_container .content form.basic input[type=submit]:hover { opacity: 0.8; }
				.content_container .content form.basic select { width: calc(100%); border-radius: 5px; background: #fff url(../images/icons/icon-arrow.png) no-repeat right center; background-position: 95% 15px;  -moz-appearance: none;  -webkit-appearance: none;-webkit-appearance: none; font-family: 'Open Sans', sans-serif; height: 45px;  padding-left: 10px; padding-right: 10px; background-color: #fff; border: 0px; border: 1px solid #e1e1e1; margin-bottom: 10px; }

				
				/* TOOLTIP */
				.content_container .content .tooltip .tooltiptext { visibility: hidden; position: absolute; z-index: 10; width: 120px; background-color: #33373f; color: #fff; text-align: center; padding: 5px 0; border-radius: 6px; }
				.content_container .content .tooltip:hover .tooltiptext { visibility: visible; }
				
	/* ALERT */
	.alert { display: inline-block; font-family: 'Open Sans', sans-serif; border-radius: 5px; padding-left: 20px; padding-right: 20px; font-weight: 600; width: calc(100% - 40px);  text-align: center; padding-top: 10px; padding-bottom: 10px;  margin-bottom: 15px; }
	
	/* VERIFICATION STEPS */
	/*.verification_steps { display: flex; border-top-left-radius: 5px; border-top-right-radius: 5px; border-radius: 5px; justify-content: space-evenly; border: 1px solid #e6e6e6; font-size: 12px; position: relative; text-align: center; line-height: 63px;  height: 60px; width: 100%; color: #7c7c7c; background-color: #f6f6f6; font-family: 'Open Sans', sans-serif; font-weight: 700; float: left; margin-top: 10px; margin-bottom: -1px; margin-bottom: 20px;  }
	*/.verification_steps { display: flex; justify-content: space-evenly; border-bottom: 1px solid #e6e6e6; font-size: 12px; position: relative; text-align: center; line-height: 63px;  height: 60px; width: 100%; font-family: 'Open Sans', sans-serif; font-weight: 700; float: left; margin-top: 10px; margin-bottom: -1px; padding-bottom: 10px; margin-bottom: 20px;  }
		 
			.verification_steps .step { display: inline-block; padding-left: -1px !important; height: 30px; width: 30px; line-height: 30px; border-radius: 50%;  margin-top: 16px; }
				
				
	@media only screen and (max-width : 768px) {
		.verification_steps { width: 90%; margin-left: 5%; margin-right: 5% }		
			
	}	

/* TEXT STYLING */
.opacity80 { opacity: 0.8 !important; }		
.opacity20 { opacity: 0.4 !important; }
.opacity40 { opacity: 0.4 !important; }

.space-between { justify-content: space-between; }
.space-around { justify-content: space-around; }
.flex-grow1 { flex-grow: 1; }
.flex-grow2 { flex-grow: 2; }

.noliststyle { list-style: none; }

.floatleft { float: left !important; }
.floatright { float: right !important; }


.background_red { background-color: #ffdede;}
.background_darkred { background-color: red; color: #fff;}
.background_blue { background-color: #005df8;  color: #fff; }
.background_lightgrey { background-color: #dfdfdf;   }
.background_green { background-color: #8ec63f;  color: #fff;  }
.background_orange { background-color: #ff8a00;  color: #fff;  }
.background_white { background-color: #fff; }
.background_grey { background-color: #33373f; color: #fff; }

.align_left { text-align: left !important; }
.align_center { text-align: center !important; }

.margin_bottom20 { margin-bottom: 20px !important; }
.margin_bottom50 { margin-bottom: 50px !important; }
.margin_bottom5 { margin-bottom: 5px !important; }
.margin_bottom10 { margin-bottom: 10px !important; }
.margin_top0 { margin-top: 0px !important; }
.margin_top10 { margin-top: 10px !important; }
.margin_top20 { margin-top: 20px !important; }
.margin_top50 { margin-top: 50px !important; }
.margin_top75 { margin-top: 75px !important; }
.margin_topmin20 { margin-top: -20px !important; }
.margin_topmin40 { margin-top: -40px !important; }
.nomargin { margin: 0px !important; }

.margin_right20 { margin-right: 20px !important; }
.margin_left20 { margin-left: 20px !important; }

.padding_top10 { padding-top: 10px !important; }
.padding_bottom10 { padding-bottom: 10px !important; }
.nopadding { padding: 0px; !important; }
.padding_right20 { padding-right: 20px !important; }

.padding25 { padding: 25px !important; }
.padding10 { padding: 10px !important; }

.font_red { color: red; }
.font_blue { color: #005df8; }
.font_orange { color: #ff8a00; }

.strong { font-family: 'Open Sans', sans-serif; font-weight: 700 !important; }
.medium { font-family: 'Open Sans', sans-serif; font-weight: 600 !important; } 

.border_red { border-bottom: 1px solid #ff5050 !important; }
.border_green { border-bottom: 1px solid #39cb00 !important; }
.border_bottom {  }

.width25perc { width: 23% !important; }
.width40perc { width: 38% !important; }
.width50perc { width: 48% !important; }
.width75perc { width: 73% !important; }

.width600 { width: 500px !important; }
.width500 { width: 500px !important; }
.small { font-size: 12px; }

@media only screen and (max-width : 768px) {
	.width600 { width: 100% !important; }		
}