.form-group .cc-col-input-right .form-group .cc-btn-container, .form-group .cc-input-container  {
	-ms-flex: 0 0 100%;
	flex: 0 0 100%;
	max-width: 384px;
}
.modal-body .form-group.input-elem, .modal-body .form-group.select-elem {
	margin: 0 auto 20px;
}
.modal-body .form-group.checkbox-elem .custom-control {
    max-width: 324px;
}
input[type=text] {
    display: block;
}
.form-control:disabled ~ .cross-clear, .form-control:read-only ~ .cross-clear {
	display: none;
}
input[type=text]:focus, .form-control:focus {
	outline: none;
  	-webkit-box-shadow: none;
	box-shadow: none;
}
input[type=text]:focus {
	border-color: #54b0ff;
}
.cross-clear, .k-autocomplete.k-state-default .k-i-close {
	display: block;
	width: 30px;
	height: 31px; /*.form-group height = 41px, offset top = 5 px twice */
	background: #fff url('/gen2_ovrd_static/images/cross.svg') center center no-repeat;
	position: absolute;
	top: 5px;
	right: 7px;
	cursor: pointer;
}
.cross-clear {
	z-index: 5;
}

.form-control.is-valid {
	border-color: #dddddd !important;
}

.form-control {
	box-shadow: none !important;
}
	
.cross-clear:hover, .k-autocomplete.k-state-default .k-i-close:hover {
	background-image: url('/gen2_ovrd_static/images/cross-hover.svg');
}
.k-autocomplete.k-state-default + .cross-clear {
	display: none;
}
.cross-clear.disabled {
	opacity: .4;
}
.form-group.input-elem, .form-group.select-elem {
	position: relative;
	margin: 0 0 20px;
	max-width: 384px;
	word-wrap: normal;
}
.form-group.checkbox-elem .cc-col-input-left {
	width: auto;
	-ms-flex: none;
	flex: none;
	max-width: 100%;
}
.form-group.checkbox-elem .cc-col-input-right {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
	max-width: 100%;
	padding-left: 3.4rem;
}
.custom-checkbox .custom-control-label:before {
    border-radius: 0;
}
.custom-checkbox .custom-control-label:before, .custom-radio .custom-control-label:before {
    width: 1.25rem;
    height: 1.25rem;
	background-color: #fff;
	border: 2px solid #cacaca;
}
.custom-checkbox .custom-control-label:hover:before, .custom-radio .custom-control-label:hover:before {
    opacity: .9;
}
.custom-control-label:after {
	width: 1.25rem;
    height: 1.25rem;
}
.custom-control-input:focus~.custom-control-label:before {
    box-shadow: none;
}
.custom-control-input:checked~.custom-control-label:before, .custom-checkbox .custom-control-input:checked~.custom-control-label:before{
	background-color: #232d6e;
	border: 2px solid #232d6e;
}
.custom-radio .custom-control-input:checked~.custom-control-label:before {
	background-color: #232d6e;
	border: 2px solid #232d6e;
	box-shadow: inset 0 0 0 2px #fff;
}
.custom-radio .custom-control-input:checked~.custom-control-label::after {
    background-image: url("data:image/svg+xml;charset=utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'circle r='3' fill='%23232d6e'/></svg>");
}
.custom-radio .custom-control-label {
	padding-left: 18px;
}
.radioList .custom-control.custom-radio {
	margin: 8px 0;
}
/*
	Example
	<div class="custom-control custom-checkbox">
		<input class="custom-control-input" type="checkbox"> // the input will not be visible
		<label class="custom-control-label">text beside checkbox </label>
	</div>
*/
.custom-checkbox {
	padding-left: 2.5rem; /* the space for label:before*/
}
.custom-checkbox .custom-control-label:before, .custom-checkbox .custom-control-label:after {
	top: .22rem;
	left: -2.5rem;
}
.table .custom-checkbox .custom-control-label:before, .table .custom-checkbox .custom-control-label:after {
	left: -1.5rem;
}
.form-group label.col-form-label {
	color: #464646;
	display: block;
    font-weight: 400;
	position: absolute;
	text-align: left;
	font-size: 18px;
	font-weight: normal;
	padding: 10px 0 0 15px;
	z-index: 4;
	max-width: 384px;
	left: 0;
	white-space: nowrap;
}
.form-group.form-group-no-padding label.col-form-label {
	padding-left: 12px;
}
/* textarea overwrites */
.form-group.textarea-elem label.col-form-label {
	position: relative;
	padding: 10px 0 20px 10px;
}
.form-group.textarea-elem label.col-form-label.cc-data-required:after {
    top: 22px;
}
.form-group label.col-form-label.cc-data-required:after {
	content: "";
	display: block;
	height: 5px;
	width: 5px;
	border-radius: 50%;
	background: #e1b600;
	position: absolute;
	left: 0;
	top: 2px;
	margin-left: -5px;
}
.form-group .cc-input-container {
	position: relative;
    padding-right: 5px;
	padding-left: 5px;
	margin-left: 0;
}
.form-group.form-group-no-padding .cc-input-container {
    padding-right: 0px;
	padding-left: 0px;
}
.form-group .cc-input-container.cc-inline-out {
	display: inline-block;
}
.form-group .cc-input-container.cc-inline-out select {
}
.form-group.select-elem select.form-control {
	/* background: #e6e6e6; */
	background: #e9ecef;
	color: #27348b;
	padding: 12px 10px;
	border: none;
	height: 48px;
	-webkit-appearance: menulist-button;
}
.form-group.select-elem .col-form-label {
	pointer-events: none;
	/*padding: 7px 0 0 25px; */
}
.form-group.select-elem .col-form-label.hide {
	/*pointer-events: none;
	padding: 7px 0 0 25px; */
	z-index: 0;
}
.form-group.select-elem .col-form-label.active, .form-group.select-elem .col-form-label.active-load {
	font-size: 10px;
	padding-top: 0;
}

.form-group.select-elem .select-pointer {
	pointer-events: none;
	height: 100%;
	width: 50px;
	z-index: 5;
	top: 0;
	right: 0;
	position: absolute;
	background: #232d6e url('/gen2_ovrd_static/images/select-sort.svg') center center no-repeat;
}
.form-group.select-elem .cc-input-container:hover .select-pointer {
	background-color: #3a4697;
	cursor: pointer;
}
.form-group.input-elem .col-form-label {
	transition-property: padding, font-size;
	transition-duration: .3s;
}
.form-group.input-elem .col-form-label.active-load {
	transition: none;
}
.form-group.input-elem .col-form-label.active, .form-group.input-elem .col-form-label.active-load {
	font-size: 10px;
	padding-top: 0;
}
.cc-label.cc-data-required:before {
	display: none;
}
legend.cc-data-required:before {
	display: none;
}
fieldset legend.cc-data-required:after {
    content: "";
    display: block;
    height: 5px;
    width: 5px;
    border-radius: 50%;
    background: #e1b600;
    position: absolute;
    left: 0;
	top: 4px;
	margin-left: -11px;
}
.form-control {
	color: #464646;
	border: 2px solid #dddddd;
	padding: 9px 10px;
    font-size: 18px;
	line-height: 1.5;
	border-radius: 0;
}
.cc-data-required-key {
	display: none;
}
.form-group .gj-datepicker-bootstrap [role=right-icon] button {
    width: 50px;
	border: 1px solid #232d6e;
	background: #232d6e;
}
.form-group .gj-datepicker-bootstrap [role=right-icon] button:hover {
    width: 50px;
	border: 1px solid #3a4697;
	background: #3a4697;
}
.form-group .gj-datepicker-bootstrap [role=right-icon] button .fa-calendar {
	background: transparent url('/gen2_ovrd_static/images/calendar-white.svg') center center no-repeat;
	margin-top: 4px;
	margin-left: 2px;
	height: 20px;
    width: 20px;
}
.form-group .gj-datepicker-bootstrap [role=right-icon] button .fa-calendar:before {
    content: "";
}
.gj-unselectable input[type=text] {
	cursor: pointer;
}
fieldset legend {
	position: relative;
}
fieldset .form-group legend {
	-ms-flex: 0 0 100%;
    flex: 0 0 100%;
	max-width: 100%;
	text-align: left;
}
/* override kendo styling */
.k-autocomplete .k-input, .k-autocomplete.k-state-focused .k-input, .k-popup.k-list-container {
    border: 2px solid #dddddd;
}
.k-autocomplete .k-input {
    height: auto;
    line-height: 1.5;
    padding: 9px 10px;
	text-indent: 0;
	box-sizing: border-box;
	width: 100%;
}
.k-autocomplete .cross-clear {
	display: none;
}
.k-autocomplete.k-state-default {
    background-image: none;
    background-color: transparent;
    border: none;
}
.k-autocomplete.k-state-default .k-i-close {
	transform: none;
	right: 2px;
	margin-right: 0;
	opacity: .4;
}
.k-autocomplete.k-state-default.k-state-focused .k-i-close {
	opacity: 1;
}
.k-autocomplete, .k-colorpicker {
    display: block;
    width: 100%;
}
.k-autocomplete.k-state-hover, .k-popup, .k-autocomplete.k-state-border-down, .k-autocomplete.k-state-focused {
    -webkit-box-shadow: none;
    box-shadow: none;
}
.k-list>.k-state-hover {
    color: #464646;
    background-color: #e6e6e6;
	border-color: #e6e6e6;
	background-image: none;
    border-radius: 0;
}
.k-list-container.k-state-border-up, .k-list-container.k-state-border-down, .k-autocomplete.k-state-border-down .k-input, .k-autocomplete.k-state-border-up .k-input, .k-autocomplete .k-input {
    border-radius: 0;
}
.k-list-container {
    border-color: #dddddd;
    background-color: #fff;
}
.k-animation-container {
	max-width: 384px;
}
/* Checkbox in label > uwa-forms.css
	need keep some as 
		.custom-checkbox .custom-control-label:before
	deprecated
*/
	label.custom-checkbox, label.custom-radio {
		position: relative;
		padding-left: 2.5rem
	}
	label.custom-checkbox::before,  
	label.custom-checkbox>input[type=checkbox]:checked~span::after{
		top: .22rem;
		left: 0rem;
		width: 1.3rem;
		height: 1.3rem;
		border-radius: 0;
		content:'';    
		position: absolute;
	}
	label.custom-checkbox::before{
		background-color: #fff;
		border: 2px solid #cacaca;
	}

	label.custom-checkbox>input[type=checkbox]:checked~span:hover:after{
		opacity: .9;
	}
	label.custom-checkbox>input[type=checkbox]:checked~span::after{
		background-color: #232d6e;
		border:0px;
		background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E");
		background-repeat: no-repeat;
		background-position: center center;
		background-size: 50% 50%;
		/* image from custom-forms.scss
			.custom-checkbox .custom-control-input:checked~.custom-control-label::after
		
		*/
	}
	label.custom-checkbox>input[type=checkbox]{
		position: absolute;
		z-index: -1;
		opacity: 0;
	}
	label.custom-checkbox>input[type=checkbox]:disabled~span{
		color: #A9A9A9;
	}
	
	label.custom-radio::before,  
	label.custom-radio>input[type=radio]:checked~span::after{
		left: 0rem;
		width: 1.3rem;
		height: 1.3rem;
		border-radius: 50%;
		content:'';    
		position: absolute;
	}
	label.custom-radio::before{
		background-color: #fff;
		border: 2px solid #cacaca;
	}

	label.custom-radio>input[type=radio]:checked~span:hover:after{
		opacity: .9;
	}
	label.custom-radio>input[type=radio]:checked~span::after{
		background-color: #232d6e;
		border:0px;
		background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E");
		background-repeat: no-repeat;
		background-position: center center;
		background-size: 50% 50%;
		/* image from custom-forms.scss
			.custom-radio .custom-control-input:checked~.custom-control-label::after
		
		*/
	}
	label.custom-radio>input[type=radio]{
		position: absolute;
		z-index: -1;
		opacity: 0;
	}
	label.custom-radio>input[type=radio]:disabled~span{
		color: #A9A9A9;
	}
/* end of Checkbox in label*/
/* Checkbox and Radio in label with uwa- prifix
	So it won't be affected by changes on .custom- 
	<label class="uwa-radio">
		<input type="radio" />
		<span>label content</span>
	</label>
*/
	/* Common */
	label.uwa-checkbox, label.uwa-radio {
		position: relative;
		padding-left: 2rem
	}
	/* Checkbox */
	label.uwa-checkbox::before,  
	label.uwa-checkbox>input[type=checkbox]:checked~span::after{
		top: .22rem;
		left: 0rem;
		width: 1.25rem;
		height: 1.25rem;
		border-radius: 0;
		content:'';    
		position: absolute;
	}
	label.uwa-checkbox::before{
		background-color: #fff;
		border: 2px solid #cacaca;
	}

	label.uwa-checkbox>input[type=checkbox]:checked~span:hover:after{
		opacity: .9;
	}
	label.uwa-checkbox>input[type=checkbox]:checked~span::after{
		background-color: #232d6e;
		border:0px;
		background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E");
		background-repeat: no-repeat;
		background-position: center center;
		background-size: 50% 50%;
		/* image from custom-forms.scss
			.custom-checkbox .custom-control-input:checked~.custom-control-label::after
		
		*/
	}
	label.uwa-checkbox>input[type=checkbox]{
		position: absolute;
		z-index: -1;
		opacity: 0;
	}
	label.uwa-checkbox>input[type=checkbox]:disabled~span{
		color: #A9A9A9;
	}

	/* Radio */
	label.uwa-radio>input[type=radio]~span::before{
		top: .22rem;
		left: 0rem;
		width: 1.25rem;
		height: 1.25rem;
		border-radius: 50%;
		content:'';    
		position: absolute;

		/* transition.scss:7 */
		transition: background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;

		background-color: #fff;
		border: 2px solid #cacaca;
	}
	label.uwa-radio>input[type=radio]:checked~span::before{
		background-color: #232d6e;
		border-color: #232d6e;
		box-shadow: inset 0 0 0 2px #fff;
	}
	/* hide the input element*/
	label.uwa-radio>input[type=radio]{ 
		position: absolute;
		z-index: -1;
		opacity: 0;
	}
	/* when hover */
	label.uwa-radio>input[type=radio]:checked~span:hover:after{
		opacity: .9;
	}
	/* when input is disabled */
	label.uwa-radio>input[type=radio]:disabled~span{
		color: #A9A9A9;
	}
/* End if Checkbox and Radio in label*/
.uwa-invalid{
	border: 2px solid #dc3545 !important;
}
.uwa-invalid-msg{
	color:#dc3545 !important;
}
.form-control+.caption,
.custom-text>.caption{
	font-size: 0.778rem;
}
.outer-btn-gold-icon {
	position: relative;
	display: inline-block;
}
.outer-btn-gold-icon:before {
	position: absolute;
	top: .1em;
    right: .7em;
	font-family: "Source Sans Pro", sans-serif;
	color: #27348b;
    content: '»';
    font-weight: 400;
    font-style: normal;
    text-decoration: none;
    display: block;
    transition: transform .3s ease;
    transition: transform .3s ease, -webkit-transform .3s ease;
    font-size: 1.5em;
}
.outer-btn-gold-icon:hover:before {
    -webkit-transform: translateX(.3rem);
    -ms-transform: translateX(.3rem);
    transform: translateX(.3rem);
}
.outer-btn-gold-icon input {
    padding: 12px 40px 12px 30px;
}
.form-group .alert.alert-warning {
	border: none;
	padding: 5px 0 0;
	font-size: 80%;
	background: transparent;
	font-weight: bold
}
.form-group .alert.alert-warning:before, .form-group .invalid-feedback > span:before {
	display: inline-block;
	content: "";
	width: 15px;
	height: 15px;
	margin: 3px 3px 0 0;
	vertical-align: top;
}
.form-group .alert.alert-warning:before {
	margin-top: 3px;
	background: transparent url('/gen2_ovrd_static/images/alert-warning.svg') center center no-repeat;
	background-size: contain;
}
.form-group .invalid-feedback > span:before {
	background: transparent url('/gen2_ovrd_static/images/alert-danger.svg') center center no-repeat;
	background-size: contain;
}

.btn-link{
	color: #0E55B5;
	font: 600 18px Source Sans Pro;
	text-align: right;
	text-transform: uppercase;
	line-height: 27px;
}
.btn-group-full {
	display: flex;
}
.btn-group-full .btn{
	flex: 1;
}
.btn-group .btn-uwa:not(:disabled):not(:disabled).active{
	color: rgb(39, 52, 139);
	background-color: #F5F8FC;
}
.btn-group .btn-uwa {
	color: #FFF;
	background-color: rgb(39, 52, 139);
	transition: background 0.25s ease 0s, color 0.25s ease 0s;
}
.btn-group .btn-uwa:hover{
	background-color: rgb(14, 85, 181)
}
.btn {
	border-radius: 0;
}
.cc-footer .form-group .btn{
	font-size: 18px;
	line-height: 1.5;
	padding: 10px;
	font-weight: bold;
}
input[name=btn-save], #btn-save{     
	color: rgb(39,52,139);
	background-color: rgb(226, 182, 0)
}
input[name=btn-cancel], #btn-cancel{
	color: rgb(39,52,139);
	background-color: rgb(202, 202, 202)
}
.tmp_hack_width{
	max-width: 354px;
}
.btn-check {
	flex:1 1 auto!important;
	margin-bottom: 20px!important;
	padding: 0!important;
	min-width: 0px!important;
	margin-right:5px!important;
}
.input-bsb-elem {
	flex: 0 0 8rem;
}
.cc-invalid-feedback > span {
	display: inline-block;
	width: 100%;
}
.btn-primary.disabled, .btn-primary:disabled {
	cursor: default;
}
[data-parsley-group]+.invalid-feedback{
	
    margin-left: 0;
    padding-left: 0;
}
[data-parsley-group]+.invalid-feedback > span:before{
	display: inline-block;
    content: "";
    width: 15px;
    height: 15px;
    margin: 3px 3px 0 0;
    vertical-align: top;
	background: transparent url('/gen2_ovrd_static/images/alert-danger.svg') center center no-repeat;
	background-size: contain;
}
