/* icons */

i.dataTableDeletedIcon, i.dataTableBlockedIcon {
	color: red;
}

i.dataTableCheckedIcon {
	color: green;
}

/* end icons */
#hcms {
	padding-left: 10px;
	padding-right: 10px;
}	
 	
.ui-multiselect {
	max-width: 100%;
}

.ui-multiselect-checkboxes input[type='radio'] { 
	display: none;
}
	
input[type='checkbox'] {
	margin-top: 8px;
}	
	
.hcmsCenter {
	background: transparent;
}

.hcmsFormRowResponsive label:empty {
	display: none;
}



input.error, select.error ~ button, input.error ~ span {
	background-color: #fce4e4;
  	border: 1px solid #cc0033;
  	outline: none;
}


.hcmsFormRowInput  {
	position: relative;
}

label.error  {
	left: 0px !important;
	background: transparent! important;
	
}




table.datePickerTimeResponsive, table.datePickerTimeResponsive tbody {
	border:none;
	background: transparent;	
	padding: 0;
	width: 100%;
}

table.datePickerTimeResponsive td {
	padding-left: 2px;
	padding-right: 2px;
}

.datePickerTimeResponsive td.datePickerTD {
	width: 115px;	
}



.datePickerTimeResponsive td.hourMinuteTD {
	width: 60px;
}

.datePickerTimeResponsiveDiv input {
	max-width: 50px;
   	float:left;
   	margin-right:10px !important;
}
   
.datePickerTimeResponsiveDiv span {
   	float:left;
   	margin-right:10px !important;
   	padding-top: 10px;
}

.datePickerTimeResponsive td {
	display:inline-block;
}


.startEndDateButtonsResponsive div {
	display: inline;
}

.hcmsDisplayInline {
	display: inline;
}

.hcmsDisplayInlineBlock {
	display: inline-block;
}

.hcmsFormSubmit input[type='button'] {
	font-size: 12px;
} 

.mainTabsIcons {
	font-size: 16px;
}

.mainTabsIconsIcoFont {
	font-size: 25px;
}

#hcmsHelpButton {
	padding-left: 8px;
	padding-right: 8px;
	padding-top: 4px;
	padding-bottom: 4px; 
	font-size: 20px;
}

.dataTableDeleteIcon, .dataTableBlockedIcon {
	color: #B81900;
	font-size: 16px;
	text-align: center;
}

.dataTableCheckedIcon {
	color: #5D8C38;
	font-size: 16px;
	text-align: center;
}

i.joyrideTooltipIcon {
	font-size:22px;
	color: #008000;
}

i.joyrideTooltipIconNoHelpText {
	color: #BBBBBB !important;
}

i.joyrideTooltipIconHelpTextFromMainServer {
	color: #426F9A !important;
}

i.joyrideTooltipIconHelpTextFromMainAccount {
	color: #FF9900 !important;
}

div.joyride a.close {
	color: #FFFFFF;
	font-size: 25px;
}

div.ttsBox {
	text-align:center;
}

#btnHcmsHelpJoyrideStartTour, #btnHcmsHelpJoyrideEditClose {
	position: absolute; top: 45px;
	right: 15px;
	min-width: 180px;
}

#btnHcmsHelpJoyrideClose {
	position: absolute; top: 90px;
	right: 15px;
	min-width: 180px;
}

#btnHcmsHelpJoyrideEdit {
	position: absolute; top: 155px;
	right: 15px;
	min-width: 180px;
}

button.addMoreRightForContentSchema {
	padding-top:0;
	padding-bottom: 0;
	height: 25px;
}

.wt-popover .wt-content figure, .wt-popover .wt-content img, .wt-popover .wt-content figure img  {
	max-width: 100% !important;
	width: 100% !important;
}

#hcmsHelpJoyRideModal {
	z-index: 10041 !important;	
	/* padding-left: 4vw;
	padding-right: 4vw;
	padding-top: 2vw; */	
}


#hcmsHelpJoyRideModal .helpCenterExpandContent, #hcmsHelpJoyRideModal .wt-btns {
	display: none !important;	
}

.wt-popover {
	min-width: 315px !important;
}

.wt-content {
	position: relative;
}

.wt-content .helpCenterExpandContent {
	position: absolute;
	bottom: -44px;
	left: 0px;
}

/* 
 .hcmsFormSubmit {
	position: fixed;
	bottom: -15px !important;
	left: 0px !important;
	background-color: white;
	padding: 30px 0px 30px 0px;
	display: inline;
	z-index: 99999999;
	text-align: center;
	border-top: 1px solid #CCCCCC;
	-webkit-overflow-scrolling: touch;
}  */

/************************************************************/
/************************************************************/
/************************************************************/
/* medium-up */
@media screen and (min-width: 40em) {
	
	h1 {
		font-size: 2.5rem;
	}
	
	h2 {
		font-size: 1.75rem;
	}
	
	h3 {
		font-size: 1.4rem;
	}
	
	h4 {
		font-size: 1.3rem;
	}
	
	h5{
		font-size: 1.15rem;
	}
	
	h6 {
		font-size: 1rem;
	}
	
	
	#multiDisplayOpenButton {
		top: 8px;
	
	}
	
	.mainCompanyLogoChild {
		/* width: 240px; */
	}
	
}

/* only small */
@media screen and (max-width: 39.9375em) {
	
	
	#mainTabs  {
		border: none;
	}
	
	/* top-bar-setting */
	.menu li {
		border-bottom: 1px solid #FFFFFF;
	}
	
	.menu li:last-child {
		border-bottom: none;
	}
	
	.top-bar .row {
		width: 100% !important;
	}
	
	.menu-icon-hcms {
		padding-top: 5px;
	}
	/* end top-bar-setting */


	.hcmsForm div {
		max-width: 100%;
	}

	.hcmsFormRowResponsive label  {
		text-align: left;
	}
	
	
	.hcmsFormRowResponsiveCheckbox label, .hcmsFormRowCheckbox label {
		text-align: left;
		width: auto;
	}
	
	.hcmsFormRowInput input, .ui-multiselect {
		width: 100% !important;
	}

	.hcmsTreeClass {
		max-height: 150px;
		max-width: 100%;
	}
	
	
	
	input[type='checkbox'] {
	  	float: left;
	  	margin-bottom: 20px;
	  
	}
	
	input[type='checkbox'] + label {
		padding-left: 10px;
		margin-bottom: 20px;
	  	display: block;
	  	
	}
	
 	input[type='button'] {
		position: relative;
		display: block;
		
	}
	
	
	td, .grid-x {
		margin : 0 !important;
		padding: 0 !important;
	} 
	
	
	#multiDisplayOpenDisplay2ButtonBox, #multiDisplayOpenDisplay2Button {
		display: none;
	}
	
	#hcmsHelpButton  {
		position: absolute;
		right: 0px;
		top: -10px !important;
	}
	
	#hcmsHelpButtonBox {
		position: absolute;
		right: -50px;
		top: 0 px;
	}	

 	.hcmsFormSubmit input[type='button'] {
		position: relative;
		display: inline-block;
	} 
		
	.ui-dialog {
		max-width: 100%;
	}
	
	.displayInlineOnSmall {
		display: inline;
	}
	
	.displayInlineBlockOnSmall {
		display: inline-block;
	}
	
}