.detail-form /* root form class */
{
	width: 100%;
}

.detail-form .row
{
	padding-top: 1px;
	padding-bottom: 1px;
	width: 100%;
	
	xoverflow: hidden; /*becasue of durationpicker*/
	min-height: 23px;
	clear:both;
}

.detail-form .row > .row 
{
    float:none;
    clear:none;
}

.detail-form .row > .conditionalDiv 
{
    float:none;
} 

.detail-form label
{
	float: left;
	width: 200px;
	padding-left: 15px;
}

.detail-form .group
{
	margin: 5px;
	border: none;
}

.detail-form .group .title
{
	font-size: smaller;
	padding: 2px;
	border-bottom: 1px solid gray;
    margin-bottom: 5px;
    font-weight: bold;	
    clear: both;
}

.detail-form input
{
	width: 200px;
	padding: 0pt;	
}

.detail-form input[type=file] 
{
    width: 260px;   
}


.detail-form .conditionalDiv .disabled input, .detail-form .conditionalDiv .disabled select, .detail-form .conditionalDiv .disabled textarea
{
    background-color: #eee;
}

.detail-form select
{
	width: 204px;/* The real size is smaller the standard input control */
}

.detail-form textarea
{
	width: 400px;
}

.detail-form .dateTime input.time
{
	width: 55px;
	padding: 0pt;	
}

.detail-form .dateTime input.date, .detail-form .dateTime input.dateCS
{
	width: 100px;
	padding: 0pt;	
}

.detail-form .dateTime label
{
	padding: 3pt;	
	float: none;
}

.detail-form input[disabled]
{
	background-color: #EEEEEE;
}

.detail-form input[type='checkbox']
{
	width: 15px;
	padding: 0pt;
}

.detail-form span.required
{
	color: Red;
}

.detail-form .multiItem
{
    padding-right: 10px;
    margin-right: 5px;
}

.detail-form .multiGroupTitle
{
    font-style: italic;
    font-weight: bold;
    padding-top:5px;
}

.detail-form .multiCheckBox 
{
    margin-left: 30px;
}

.detail-form .multiCheckBox > div 
{
    margin-bottom:5px;
}

.detail-form .DistanceField .digits
{
	width: 40px;
}

.detail-form .DistanceField .centimeter
{
	width: 40px;
}

.detail-form .TimeFieldContainer
{
    width: 230px;
    display: inline-block;
}

.detail-form .TimeField
{
	width: 100%;
}

.detail-form .TimeField .digits
{
	width: 25px;
}

.detail-form .TimeField .second
{
	width: 50px;
}

.detail-form .PointField .digits
{
	width: 65px;
}

.detail-form .MeasureUnit
{
	font-size: 70%;
	margin-right: 10px;
	margin-left: 3px;
}

.detail-form .formatInfo, .groupSingleOnly
{
	font-size: 70%;
	color: Gray;
	margin-left: 5px;
}

.detail-form .group .title .formatInfo {
	font-size: 100%;
	margin-left: 15px;
	font-weight: normal;
}

.detail-form .formatInfo.imageFileField {
	margin-left: 330px;
}

.formatInfoContainer,
.errorValidationInfoContainer {
	position: relative;
	display: inline-block;
}

.formatInfoContainer .fa-question-circle,
.errorValidationInfoContainer .fa-exclamation-circle {
	margin-left: 10px;
	font-size: 20px;
}

.errorValidationInfoContainer .fa-exclamation-circle {
	color: #ff5555;
}

.formatInfoContainer .formatInfo {
	background-color: black;
}

.formatInfoContainer .formatInfo,
.errorValidationInfoContainer .errorInfo{
	visibility: hidden;
	width: max-content;
    max-width: 250px;
	color: #fff;
	text-align: center;
	border-radius: 6px;
	padding: 5px 5px;
	position: absolute;
	z-index: 1;
	top: -5px;
	left: 105%;
}

.formatInfoContainer .formatInfo::after,
.errorValidationInfoContainer .errorInfo::after {
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -5px;
	border-width: 5px;
	border-style: solid;
	border-color: black transparent transparent transparent;
	opacity: 0;
	transition: opacity 1s;
}

.formatInfoContainer:hover .formatInfo,
.errorValidationInfoContainer:hover .errorInfo {
	visibility: visible;
	opacity: 1;
}

.detail-form .oneToManyField
{
    padding: 2px;
    border: 1px solid #ccc;
}

.detail-form .oneToManyField th, .detail-form tr.action
{
    font-weight: bold;
}
.detail-form .oneToManyField td, .detail-form .oneToManyField th
{
    padding: 3px;
}
.detail-form .oneToManyField tr.action
{
    text-align:right;
    padding-right: 20px;
}

.detail-form .oneToManyField select, .detail-form .oneToManyField input[type=text]
{
    width: 150px;
}

.detail-form .oneToManyField select[data-property='UserGrantsPackage'] {
	width: 300px;
}

.ie .detail-form .oneToManyField select 
{
    /*overflow bug in IE*/
    width: auto;
}

.detail-form .oneToManyField .template
{
    display: none;
}

.detail-form .oneToManyField label
{
    padding: 3px;
    padding-top: 0;
    width: auto;
    text-align: left;
}

.detail-form .oneToManyField table, .detail-form .group .oneToManyField table
{
    margin: 0;
    padding: 0;
}

.detail-form .ui-tabs .ui-tabs-panel
{
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 12px;
    padding-bottom: 12px;
}

.errorCount
{
    color: Red;
    font-size: 10px;
}

/* DataRangeSelectorField */
#DateRangeSelector
{
    margin-left: 20px;
    border: 1px solid #D6D6D6;
    padding: 2px; 
    width: 620px;  
}


#DateRangeSelectorCalendarControll
{
    min-width: 255px;   
}

#DateRangeSelectorCalendarControll table
{
    background-color: #EEEEEE;
}

#DateRangeSelectorCalendarControll table thead
{
    background-color: #CCCCCC;
    border: 1px solid black;
}

#DateRangeSelectorCalendarControll table th
{
    text-align: center;
}

#DateRangeSelectorCalendarControll td
{
    padding: 2px;
    border: 1px solid black;
    cursor: pointer; 
    cursor: hand;
}

span .accreditationValidityDayChecked
{
    font-weight: bold;
}

td.accreditationValidityDayChecked
{
    background-color: #297DD3;
    color: #FFFFFF;
}

td.accreditationValidityDayDisabled
{
    background-color: #667FA8;    
    color: #FFFFFF;
}

#DateRangeSelectorRangeListControll
{
    width: 300px;
    margin-top: 5px;
    margin-left: 25px;
}

.fileRemoveEnabled
{
    font-weight: bold;  
}

/******************** HINTTEXT *************************/
div.hintText
{
    display: none;
    
    border: 1px solid #999; /* TODO: defaultBorderColor*/
    padding: 3px;
    margin: 3px;
    color: #999; /*TODO: Less*/
    float:none !important;
}

.hintTextIcon 
{
    width: 20px;
    height: 20px;
    background: url('/europeanaquatics/cassette.axd/file/scripts/jquery.ui.custom.stso/img/hintTextIcon-2fdaa89e8309ec62c45f3b59076d586de5fa8573.png') no-repeat;
    float: right !important;
    cursor:hand; cursor:pointer;
}

div.hintText .closeIcon 
{
    width: 20px;
    height: 20px;
    background: url('/europeanaquatics/cassette.axd/file/scripts/jquery.ui.custom.stso/img/closeIcon-fae58140aa2279f3d2f07898b34c6f7ddf6b94f1.png') no-repeat;
    float: right;
    cursor:hand; cursor:pointer;
    margin: 5px;
}



/********************** MOVE SOMEPLACE ELSE **********************/
.accreditationList 
{
  display:block;
  margin-left:20px;
  padding-bottom:5px;
}

.accreditationInfo .item 
{
    display: inline-block; 
    min-width: 100px; 
    clear: left;
}

.accreditationInfo .item input {
    margin-left:10px;margin-right:5px;
}

.tabHeader, .detail-form .tabHeader
{
    font-weight:bold;
    xmargin-left: 15px;
    text-align:left;
}


/********************* CustomData Group in Person ****************/
.detail-form .group.oneline .row 
{
    display:inline-block;
    clear:none;
    width:auto;
}

.detail-form .group.oneline .row label 
{
    width:auto;
    min-width: 50px;    
}

.detail-form .group.oneline input, .detail-form .group.oneline select 
{
    width: 190px;
}