@import url("/Pages/Css/default-theme-variables.css");
@import url("theme-variables.css");

body {
	font-family: var(--cg-font-family);
	font-size: 13.5px;
	color: #3e3e3e;
}

a {
	text-decoration: none;
	color: var(--cg-primary);
}

	a:hover {
		text-decoration: underline;
	}

.itemdescription {
}

.itemtitle {
	padding-top: 5px;
}

.itemtitlelink {
	color: var(--cg-primary);
	text-decoration: none;
}

	.itemtitlelink:hover {
		text-decoration: underline;
	}

.newsul {
	margin-top: 0px;
	margin-left: 0px;
	padding-left: 0px;
}

.newsli {
	margin-bottom: 5px;
}

td {
	padding: 0px;
	margin: 0px;
}

.lang {
	text-align: right;
	vertical-align: middle;
	padding: 10px;
}

.colFill {
	width: 290px;
}

.colPadding {
	width: 30px;
}

.Icon {
	margin-left: 25px;
	margin-top: 20px;
	margin-right: 5px;
}

.rowPadding {
	height: 14px;
	font-size: 1px;
}

.rowBox {
	height: 255px;
}

.if11 {
	width: 255px;
	height: 185px;
}

.if21 {
	width: 575px;
	height: 185px;
}

.if12 {
	width: 255px;
	height: 445px;
}

.if {
	position: relative;
	left: 0px;
	overflow: none;
	top: 15px;
	background-color: Transparent;
	border-bottom-style: none;
}

.c1 {
	background-color: Transparent;
	overflow: auto;
	overflow-x: hidden;
	height: 200px;
	margin-left: 25px;
	margin-top: 15px;
	margin-right: 25px;
}

.c2 {
	background-color: Transparent;
	overflow: auto;
	height: 469px;
	margin-top: 15px;
	margin-right: 25px;
	margin-left: 25px;
	overflow-x: hidden;
}

.b11 {
	text-align: left;
	vertical-align: top;
}

.b31 {
	text-align: left;
	vertical-align: top;
}

.b21 {
	text-align: left;
	vertical-align: top;
}

.b12 {
	text-align: left;
	vertical-align: top;
}

.b22 {
	text-align: left;
	vertical-align: top;
}

div.b {
	position: absolute;
	left: 0px;
	bottom: 0px;
	right: 0px;
	height: 25px;
	width: 100%;
	vertical-align: middle;
	overflow: hidden;
	border-style: solid;
	border-width: 0px 0px 0px 0px;
	background-color: Transparent;
	display: none;
}

span.inf {
	position: relative;
	top: 3px;
	left: 5px;
}

div.inf {
	position: absolute;
	left: 0px;
	right: 0px;
	top: 0px;
	width: 100%;
	overflow: hidden;
}

#divInfoIE11 {
	font-family: Verdana;
	font-size: 12px;
	display: none;
	width: 100%;
	background-color: #FFF0AB;
	border-bottom: 1px solid #F3D95F;
	padding: 4px;
}

	#divInfoIE11 .icon > div {
		width: 100px;
		white-space: nowrap;
		align-self: flex-start;
	}

	#divInfoIE11 .icon .iewarning {
		background-image: url('../../images/loginpage/warning.png');
		background-repeat: no-repeat;
		width: 12px;
		height: 12px;
		display: inline-block;
		margin-right: 4px;
	}

div.inf #divInfoPlugin {
	font-family: verdana;
	font-size: 12px;
	border-style: solid;
	border-width: 0px 0px 0px 0px;
	background-color: #f9e277;
	vertical-align: middle;
	position: relative;
	display: none;
	width: 100%;
	height: 20px;
}

div.t {
	position: relative;
	height: 141px;
	width: auto !important;
	width: 100%;
	overflow: hidden;
	border-style: solid;
	border-width: 0px 0px 0px 0px;
	background-color: Transparent;
	background-repeat: no-repeat;
	background-position: center;
	background-image: url('../../Images/LoginPage/ns.png');
}

div.t1 {
	top: 20px;
}

div.m {
	position: absolute;
	left: 0px;
	top: 141px;
	right: 0px;
	bottom: 0px;
	overflow: hidden;
	overflow-x: hidden;
	overflow-y: auto;
	border-width: 0px 0px 0px 0px;
	text-align: right;
	width: auto !important;
	width: 100%;
	min-width: 1004px;
}

div.mc1 {
	top: 50%;
	margin-top: -150px;
}

div.mb1 {
	top: 100%;
	margin-top: -285px;
}

div.mc2 {
	top: 50%;
	margin-top: -240px;
}

div.mb2 {
	top: 100%;
	margin-top: -555px;
}

body, html {
	width: 100%;
	height: 100%;
	margin: 0px;
	color: #3e3e3e;
	background-color: var(--cg-primary);
	background-repeat: no-repeat;
	background-position: top right;
	background-image: url('../../Images/LoginPage/gras.jpg');
	background-size: cover;
	background-attachment: fixed;
}

.Title {
	color: #2A8AB3;
	font-size: 17px;
	font-weight: bold;
}

.Info {
	font-size: 13px;
	font-weight: bold;
	font-style: italic;
	color: gray;
	text-align: right;
	display: none;
}

.loginTitle {
	font-family: 'Lucida Sans','Lucida Grande','Open Sans', Arial, Helvetica, Sans-serif;
	color: #3e3e3e;
	font-size: 18px;
	font-weight: bold;
	margin-top: 5px;
}

.loginTitleSmall {
	font-size: 13.5px !important;
}

.loginCaption {
	color: #3e3e3e;
	font-size: 12px;
}

#loginForm {
	position: absolute;
	left: 0px;
	top: 0px;
	right: 0px;
	bottom: 0px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	overflow: auto;
}

.loginArea {
	text-align: -moz-center !important;
	text-align: center;
	vertical-align: middle;
	padding: 0px 0px 0px 0px;
	border-width: 0px 0px 0px 0px;
	border-style: none;
}

.loginFormTable {
	text-align: -moz-left !important;
	text-align: left;
}

	.loginFormTable td {
		height: 20px;
	}

.loginFormTableConfirm td > * {
	margin-bottom: 5px;
}

.loginInputPassWord {
	color: WhitE;
	font-size: 11px;
	vertical-align: top;
	height: 20px;
	padding: 0px 0px 3px 0px;
}

.divBoxLogin table {
	width: auto;
	display: inline;
}

.divBoxLogin {
	text-align: -moz-center !important;
	text-align: center;
}

.loginTrustLabel {
	color: WhitE;
	font-size: 11px;
	vertical-align: top;
	display: none;
	height: 20px;
}

.loginInputTrustLabel {
	color: WhitE;
	font-size: 11px;
	vertical-align: top;
	display: none;
	height: 20px;
}

.loginButtons {
	vertical-align: top;
	text-align: -moz-right !important;
	text-align: right;
	height: 22px;
}

.loginAddition {
	background-color: transparent;
	border-color: #006D9C;
	border-width: 0px 0px 0px 0px;
	border-style: solid;
	color: #3e3e3e;
	font-size: 13px;
	padding: 8px 2px 1px 1px;
	height: 18px;
	display: none;
}

#txtLoginId, #txtPassword, #txtCode, #sLang {
	background-color: WhitE;
	border-color: #cccccc;
	border-width: 1px;
	border-style: solid;
	padding: 1px 8px;
	vertical-align: top;
	width: 100%;
	height: 33px;
	border-radius: 4px;
	box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
	font-family: var(--cg-font-family);
	font-size: 13.5px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

#txtLoginId {
	width: 100%;
}

#sLang {
	margin-top: 2px;
	vertical-align: top;
	height: auto;
	width: 150px;
	border: 0;
	box-shadow: none;
	padding: 2px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	height: 24px;
	margin-right: 20px;
}

.lang img {
	position: absolute;
	right: 185px;
	top: 12px;
	padding: 6px;
	background: WhitE;
	border-radius: 3px;
}

.wrongPassword {
	border-color: #FF5123 !important;
}

.wrongCode {
	border-color: #F3D95F !important;
	background-color: #FBE7ED !important;
}

.buttonLogin, .buttonLogout, .buttonConfirm {
	border: 0;
	width: 100%;
	height: 34px;
	background-color: var(--cg-primary);
	color: WhitE;
	border-radius: 4px;
	cursor: pointer;
	font-family: var(--cg-font-family);
	font-size: 13.5px;
	-webkit-appearance: none;
}

.buttonLogout {
	display: none;
}

.buttonCancel {
	border: 0;
	width: 100%;
	height: 34px;
	background-color: WhitE;
	color: var(--cg-primary);
	cursor: pointer;
	font-family: var(--cg-font-family);
	font-size: 13.5px;
	-webkit-appearance: none;
}

.buttonConfirm, .buttonCancel {
	height: 26px;
	margin-bottom: 0px !important;
}

#divCodeError {
	visibility: hidden;
	margin: 3px 0px 0px 0px;
	font-weight: bold;
	color: #FF0000;
}

#errorTD {
	visibility: hidden;
}

.errorMessage {
	color: #FF0000;
}

#errorTitle {
	font-weight: bold;
}

.pwdCheckDisplay {
	padding-top: 10px;
	text-align: -moz-right !important;
	text-align: right;
	font-size: 12px;
	color: WhitE;
	border-width: 0px 0px 0px 1px;
}

.pwdCheckImage {
	height: 20px;
	width: 20px;
	text-align: center;
}

.txtClear {
	position: absolute;
	background-image: url('../../Images/LoginPage/txtclear.png');
	background-position: center;
	background-repeat: no-repeat;
	cursor: pointer;
	height: 15px;
	width: 16px;
	top: 9px;
	right: 7px;
}

.divOverlay {
	background-image: none;
	background-repeat: repeat;
}

.placeholder {
	color: LightGray;
}

.divBoxWelcome, .divBoxInlog, .divBoxHelp, .divBoxNews, .divBoxLinks,
.divBoxCustom1, .divBoxCustom2, .divBoxCustom3, .divBoxCustom4, .divBoxCustom5, .divBoxCustom6 {
	background: white;
	border-radius: 7px;
}

	.divBoxCustom1 .loginTitle, .divBoxCustom2 .loginTitle, .divBoxCustom3 .loginTitle, .divBoxCustom4 .loginTitle, .divBoxCustom5 .loginTitle, .divBoxCustom6 .loginTitle,
	.divBoxCustom1 .Icon, .divBoxCustom2 .Icon, .divBoxCustom3 .Icon, .divBoxCustom4 .Icon, .divBoxCustom5 .Icon, .divBoxCustom6 .Icon {
		display: none;
	}

::-ms-clear {
	display: none;
}

::-ms-reveal {
	display: none;
}

/* additions */
#main-footer {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 35px;
	background: rgba(0,0,0,0.5);
	text-align: center;
}

	#main-footer > ul {
		margin: 0;
		padding: 0;
		list-style: none;
	}

		#main-footer > ul > li {
			margin: 0;
			padding: 0;
			display: inline-block;
			position: relative;
		}

			#main-footer > ul > li > a {
				color: WhitE;
				padding: 0 10px;
				line-height: 35px;
				display: inline-block;
			}

			#main-footer > ul > li > span {
				color: #a8a8a8;
				padding: 0 10px;
				line-height: 35px;
				display: inline-block;
			}

	#main-footer .caret {
		margin-left: 4px;
		margin-top: 16px;
		border-left: 4px solid rgba(0, 0, 0, 0);
		border-right: 4px solid rgba(0, 0, 0, 0);
		border-top: 0;
		border-bottom-width: 5px;
		border-bottom-style: solid;
		border-bottom-color: WhitE;
		content: "";
		display: inline-block;
		height: 0;
		vertical-align: top;
		width: 0;
		line-height: 20px;
	}

.dropdown-menu {
	display: none;
}

.dropdown-menu {
	bottom: 35px;
	position: absolute;
	right: 0px;
	background: WhitE;
	padding: 5px 0;
	border-radius: 5px;
	list-style: none;
	text-align: left;
	box-shadow: 0 2px 15px 2px rgba(0, 0, 0, 0.25);
}

	.dropdown-menu .nav-header {
		font-size: 90%;
		color: #999999;
		text-transform: uppercase;
		padding: 5px 30px 5px 20px;
		white-space: nowrap;
	}

	.dropdown-menu li a {
		padding: 5px 20px;
		white-space: nowrap;
		display: block;
	}

.sr-only {
	border: 0 none;
	clip: rect(0px, 0px, 0px, 0px);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}

#blocks {
	position: absolute;
	overflow: overlay;
}

	#blocks.centered {
		left: 50%;
	}

	#blocks.left {
		left: 20px;
	}

	#blocks.right {
		right: 20px;
	}

	#blocks.middle {
		top: 50%;
	}

	#blocks.top {
		top: 160px;
	}

	#blocks.bottom {
		bottom: 40px;
	}

.blockswidth1 #blocks {
	width: 320px;
}

.blockswidth2 #blocks {
	width: 640px;
}

.blockswidth3 #blocks {
	width: 960px;
}

.blocksheight1 #blocks {
	height: 270px;
}

.blocksheight2 #blocks {
	height: 540px;
}

.blockswidth1 #blocks.centered {
	margin-left: -150px;
}

.blockswidth2 #blocks.centered {
	margin-left: -320px;
}

.blockswidth3 #blocks.centered {
	margin-left: -470px;
}

.blocksheight1 #blocks.middle {
	margin-top: -125px;
}

.blocksheight2 #blocks.middle {
	margin-top: -250px;
}

.blockEmpty {
	visibility: hidden;
}

.boxTypeInlog h2 {
	display: inline;
}

.boxTypeInlog {
	background-image: none;
	background-repeat: no-repeat;
}

	.boxTypeInlog > div:nth-child(2) {
		margin-top: 0px;
	}

.block {
	background-color: WhitE;
	border-radius: 7px;
	width: 300px;
	height: 250px;
	margin: 0 20px 20px 0;
	float: left;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding: 17px 20px 0px 20px;
	overflow: auto;
}

.block21 {
	width: 620px;
}

.block31 {
	width: 940px;
}

.block12 {
	height: 520px;
}

.block22 {
	width: 620px;
	height: 520px;
}

.block32 {
	width: 940px;
	height: 520px;
}

.block h2 {
	font-size: 18px;
	margin: 0;
	padding: 0 0 17px;
}

h3 {
	margin: 0;
	padding: 0 0 5px;
	font-size: 90%;
	color: #999999;
	text-transform: uppercase;
	font-weight: normal;
}

p {
	margin: 0;
	padding: 0 0 20px;
}

.loginrow {
	position: relative;
	margin-bottom: 10px;
}

.block ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

	.block ul li {
		margin: 0;
		padding: 0 0 10px 20px;
		position: relative;
	}

		.block ul li:before {
			content: '';
			display: inline-block;
			width: 7px;
			height: 7px;
			background: #cccccc;
			position: absolute;
			left: 2px;
			top: 6px;
			border-radius: 1px;
		}

.warning {
	font-size: 80%;
	padding: 5px 10px;
	border-radius: 4px;
	border-width: 1px;
	border-style: solid;
	border-color: #e8e8e8;
	background: #f6f6f6;
}

	.warning h3, .warning p {
		padding: 0;
	}

	.warning h3 {
		color: #ff0054;
	}

.confirmMessage, .confirmMessage h3, .confirmMessage p, .confirmMessage td {
	font-size: 90%;
	padding: 5px 0px;
	text-align: center;
}

	.confirmMessage a {
		text-decoration: underline;
	}

#txtCode::-webkit-input-placeholder {
	font-style: italic;
	color: #CCCCCC;
}

#txtCode:-moz-placeholder {
	font-style: italic;
	color: #CCCCCC;
}

#txtCode::-moz-placeholder {
	font-style: italic;
	color: #CCCCCC;
}

#txtCode:-ms-input-placeholder {
	font-style: italic;
	color: #CCCCCC;
}

.loginminimal {
	padding: 0;
	background: transparent;
	border-radius: 0;
}

	.loginminimal h2 {
		display: none;
	}

	.loginminimal input {
		border: 0 !important;
		box-shadow: none !important;
		border-radius: 4px !important;
		height: 42px !important;
	}

		.loginminimal input[type=checkbox] {
			height: auto !important;
		}

	.loginminimal .txtClear {
		top: 14px;
	}

	.loginminimal .txtLight {
		color: White;
	}

.boxTypeCustom1 {
	background: transparent;
	background-image: url('/CMS/_MyPortalFiles/Memoblaadje.png');
	background-size: contain;
	background-repeat: no-repeat;
	padding: 17px 11px
}

	.boxTypeCustom1 h2 {
		display: none;
	}


#divBox1 {
	margin-top: 20px;
	height: 196px;
	overflow-y: auto;
}

.boxTypeCustom1 ul li:before {
	background: Black;
}

/* classes for WAYF LoginAndList layout */

.vmLoginAndList .boxTypeInlog {
	padding: 0px;
}

.loginandlistparent {
	height: 100%;
}

.loginandlistpanel {
	display: inline-block;
	width: 50%;
	vertical-align: top;
	height: calc(100% - 32px);
	box-sizing: border-box;
	padding: 20px;
}

	.loginandlistpanel:first-child {
		border-right: 1px solid #E8E8E8;
		height: 100%;
	}

	.loginandlistpanel .caption {
		margin-bottom: 8px;
		text-transform: uppercase;
	}

.loginandlistrecent {
}

.loginandlistall_lbl {
	margin-top: 8px;
	margin-bottom: 8px;
}

.loginandlistall {
	height: calc(100% - 65px);
	overflow: hidden;
	overflow-y: auto;
}

.loginandlistparent.hiderecent .loginandlistrecent {
	display: none;
}

.loginandlistparent.hiderecent .loginandlistall {
	height: 100%;
}

.loginandlistrecent .loginrow {
	margin-bottom: 12px;
}

#directLoginButton {
	background-color: #00314E;
}

.buttonWAYF {
	border: 0;
	width: 100%;
	height: 30px;
	background-color: #00314E;
	color: WhitE;
	border-radius: 4px;
	cursor: pointer;
	font-family: var(--cg-font-family);
	font-size: 14px;
	-webkit-appearance: none;
	padding-left: 12px;
	padding-right: 12px;
	text-align: left;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

	.buttonWAYF span.fa {
		margin-right: 12px;
	}


.divIdPListMobile {
	display: none;
	width: 100%;
	height: 100%;
	position: relative;
}

.loginandlistddl {
	display: none;
}

.idp-menu {
	color: WhitE;
	background-color: #00314E;
	border-radius: 4px;
	cursor: pointer;
	font-family: var(--cg-font-family);
	font-size: 14px;
	-webkit-appearance: none;
	text-align: left;
	overflow: hidden;
	height: 30px;
	text-align: center;
	line-height: 30px;
	width: 300px;
}

	.idp-menu > div {
		display: inline-block;
	}

		.idp-menu > div:first-child {
			overflow: hidden;
			white-space: nowrap;
			text-overflow: ellipsis;
			width: calc(100% - 52px);
		}

			.idp-menu > div:first-child span.fa {
				margin-right: 4px;
			}

.idp-menu-list {
	position: absolute;
	z-index: 1000;
	display: none;
	float: left;
	min-width: 10rem;
	padding: .5rem 1rem;
	margin: .125rem 0 0;
	font-size: 1rem;
	text-align: left;
	list-style: none;
	background-color: #fff;
	background-clip: padding-box;
	border: 1px solid rgba(0,0,0,.15);
	border-radius: .25rem;
	box-sizing: border-box;
	overflow-y: auto;
	overflow-x: hidden;
}

	.idp-menu-list .idp-menu-list-item {
		color: black;
		display: block;
		width: 100%;
		padding: .25rem 0;
		text-align: inherit;
		text-overflow: ellipsis;
		white-space: nowrap;
		background-color: transparent;
		border: 0;
		text-decoration: none;
		overflow: hidden;
	}

.arrow-down {
	width: 20px;
	height: 30px;
	position: relative;
	cursor: pointer;
	border-left: 1px solid rgba(0,0,0,0.15);
}

	.arrow-down > div {
		width: 0;
		height: 0;
		border-left: 10px solid transparent;
		border-right: 10px solid transparent;
		border-top: 12px solid #fff;
		position: absolute;
		top: 10px;
	}

/* classes for Email login layout */

.panelEmailLogin #txtLoginId.invalidEmail {
	border-color: #a3002e;
	color: #a3002e;
}

.panelEmailLogin #lblError {
	color: #a3002e;
}

.panelEmailLogin #pnlEmailSent .fa {
	color: var(--cg-primary);
}