/*///////////////////////////////////////////////////////////////////////// 
***************************************************************************
	COMMONS
***************************************************************************	
/////////////////////////////////////////////////////////////////////////*/
	
	* 			{ outline:none; background:none; color:inherit; }
	:invalid 	{ box-shadow:none; }
	
	/* animate spin */
	@-moz-keyframes spin {
		0% 		{ -moz-transform: rotate(0deg); }
		100%	{ -moz-transform: rotate(359deg); }
	}
	@-webkit-keyframes spin {
		0% 		{ -webkit-transform: rotate(0deg); }
		100%	{ -webkit-transform: rotate(359deg); }
	}
	@-o-keyframes spin {
		0%		{ -o-transform: rotate(0deg); }
		100%	{ -o-transform: rotate(359deg); }
	}
	@-ms-keyframes spin {
		0% 		{ -ms-transform: rotate(0deg); }
		100%	{ -ms-transform: rotate(359deg); }
	}
	@keyframes spin {
		0%		{ transform: rotate(0deg); }
		100% 	{ transform: rotate(359deg); }
	}

/*///////////////////////////////////////////////////////////////////////// 
***************************************************************************
	HTML/BODY/*
***************************************************************************	
/////////////////////////////////////////////////////////////////////////*/
	
	html, body {
		margin:0;
		padding:0;
		font-family:Verdana, Geneva, sans-serif;
		color:#333333;
		height:100%;
		font-size:10px;
		overflow:hidden;
		background:#ffffff;			
	}

	body {
		text-rendering: optimizeLegibility;
    	-webkit-font-smoothing: antialiased;	
		-webkit-backface-visibility: hidden; 
	}
		
/*///////////////////////////////////////////////////////////////////////// 
***************************************************************************
	HEADER
***************************************************************************	
/////////////////////////////////////////////////////////////////////////*/

	#header 			{ padding:5px; z-index:1 !important; overflow:visible !important; }
	#header h1 			{ font-size:26px; line-height:28px; float:left; margin:0 5px; padding:0; border:none; background:none; display:inline-block; box-shadow:none; }
	#reload-bo			{ float:left; display:inline-block; margin-right:5px; }
	#reload-bo .ui-icon	{ padding:0 8px; font-size:1.2em; line-height:28px; }
	#goto-fo			{ float:left; display:inline-block; margin-right:5px; }
	#goto-fo .ui-icon	{ padding:0 8px; font-size:1.2em; line-height:28px; }
	#taskbar-elfinder	{ padding:3px; float:right; }
	
/*///////////////////////////////////////////////////////////////////////// 
***************************************************************************
	CONTENT
***************************************************************************	
/////////////////////////////////////////////////////////////////////////*/
	
	#content { padding:5px; margin:0; border-radius:0; border:none; }	
	#content-tabs .ui-tabs-nav { margin-bottom:0; }
	#content-tabs .ui-tabs-nav .button	{ margin:-1px; }
	.default-content { margin:0; padding:40px 50px; font-size:110%; line-height:1.8em; }
	
/*///////////////////////////////////////////////////////////////////////// 
***************************************************************************
	FOOTER
***************************************************************************	
/////////////////////////////////////////////////////////////////////////*/	

	#footer		 	{ font-weight:normal; }
	#loader 		{ width:25%; overflow:hidden; float:right; height:14px; }
	#copyright	 	{ display:block; float:left; line-height:14px; text-decoration:none; white-space:nowrap; }
	#progress-bar 	{ height:12px; display:block; }
	#percent 		{ font-size:10px; line-height:12px; display:block; padding-left:10px; float:right; min-width:50px;  }	
	
/*///////////////////////////////////////////////////////////////////////// 
***************************************************************************
	LOGIN PAGE
***************************************************************************	
/////////////////////////////////////////////////////////////////////////*/

	.layout-loader						{ min-height: 100%; min-width:100%; width:100%; height:100%; top:0; left:0; position:absolute; z-index:999; }
	.layout-loader div					{ position:absolute; text-align:center; margin:-16px; left:50%; top:50%; transform:translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); }
	#login-wrap							{ min-height: 100%; width:100%; height:100%; top:0; position:absolute; }
	#login-form 						{ position:absolute; width:320px; top:50%; left:50%; margin-top:-101px; margin-left:-165px; text-align:left; }
	#login-form input[type=text], 
	#login-form input[type=password]	{ width:150px; }
	#login-form p 						{ margin:10px 0; }
	#login-form label 					{ width:90px; text-align:right; display:inline-block; padding-right:5px; text-transform:uppercase; font-weight:normal; }
	#login-form .ui-dialog-title 		{ font-size:20px; }
	#login-form .ui-dialog-title img	{ margin-right:5px; vertical-align:middle; }
	#login-wrap .ui-dialog-buttonset	{ overflow:visible; float:none; }
	#login-progress-bar 				{ height:24px; display:block; }
	#login-percent 						{ font-size:11px; line-height:24px; display:block; margin:-24px 5px 0 5px }	
	#login-percent span					{ font-size:11px; line-height:24px; display:inline-block; float:right }	
	#login-wrap #loader 				{ position:absolute; float:none; width:300px; top:50%; left:50%; margin-top:-13px; margin-left:-150px; height:26px; overflow:visible }
	#login-form  .icon-lock 			{ float:right; font-size:24px; padding:0; margin:0; }
	.minicon							{ margin-right:5px; vertical-align:middle; }
	
/*///////////////////////////////////////////////////////////////////////// 
***************************************************************************
	DASHBOARD PAGE
***************************************************************************	
/////////////////////////////////////////////////////////////////////////*/	

	.dashboard-column 					{ width:50%; float: left; display:block; height:100%; }
	.dashboard-column .portlet 			{ margin:0; overflow:hidden; }	
	.dashboard-column .portlet .handle 	{ cursor:move; }
	
/*///////////////////////////////////////////////////////////////////////// 
***************************************************************************
	USERS PAGE
***************************************************************************	
/////////////////////////////////////////////////////////////////////////*/	

	.progressbar-scale							{ width:180px; position:relative; }
	.progressbar-scale ul						{ list-style:none; margin:0 0 5px 0; padding:0; opacity:0.7; }		
	.progressbar-scale li						{ list-style:none; margin:0 auto; padding:0; display:block; text-align:center; overflow:hidden; }
	.progressbar-scale .scale li				{ width:20%; display:inline-block; }
	.progressbar-scale li.first					{ text-align:left; float:left; display:inline-block; width:auto; }
	.progressbar-scale li.last					{ text-align:right; float:right; display:inline-block; width:auto; }	
	.progressbar-scale .ui-progressbar small	{ position:absolute; left:100%; height:inherit; bottom:0; white-space: nowrap; margin-left: 5px; }

	.slider-scale						{ width:250px; position:relative; }
	.slider-scale ul					{ list-style:none; margin:0; padding:0; opacity:0.7; }		
	.slider-scale li					{ list-style:none; margin:0 auto; padding:0 0 5px 0; display:block; text-align:center; overflow:hidden; }
	.slider-scale .scale li				{ width:20%; display:inline-block; }
	.slider-scale li.first				{ text-align:left; float:left; display:inline-block; width:auto; }
	.slider-scale li.last				{ text-align:right; float:right; display:inline-block; width:auto; }	
	.slider-scale .ui-slider small		{ position:absolute; left:100%; height:inherit; bottom:0; font-weight:bold; white-space: nowrap; margin-left:10px; }

/*///////////////////////////////////////////////////////////////////////// 
***************************************************************************
	TEMPLATE & BLOCK
***************************************************************************	
/////////////////////////////////////////////////////////////////////////*/	

	/* column */
	.column								{ margin:0; padding:0; border:none; }
	.column .column-box					{ margin:5px; padding:5px; }	
	.col_1			 					{ width:100%; float:none; display:block; overflow:hidden; }
	.col_1-4		 					{ width:25%; float: left; display:block; }
	.col_3-4		 					{ width:75%; float: left; display:block; }
	.col_1-2		 					{ width:50%; float: left; display:block; }
	.col_1-3		 					{ width:33.3%; float: left; display:block; }
	.col_2-3		 					{ width:66.6%; float: left; display:block; }
	
	/* templates */
	.template-list	{ overflow:auto; height:400px; }
	.template-list .lib { text-transform:uppercase; }
	.template-list .ui-widget-content { padding:5px; margin:5px; background-image:none; }
	.template-list .column .column-box { background:none !important; padding:10px; margin:5px; min-height:50px; font-size:1em; font-style:normal; font-weight:bold; color:inherit; }
	.template-list .column .column-box .ui-priority-secondary { background:none !important; display:block; padding:0; margin:3px 0 0 0; font-size:0.9em; font-weight:normal; height:auto; color:inherit; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; }
	.template-list .ui-selectable { padding:0 !important; }
    .template-list li { margin:0; padding:0; overflow:hidden !important; }

	/* block*/
	.block							{ padding:0; margin:5px 0; background-image:none; }
	.block .header					{ display:block; margin:5px; overflow:hidden; cursor:move; }
	.block .header strong 			{ padding:3px 0; display:inline-block; }
	.block .header .button-holder 	{ float:right; margin:0; }
	.block .content					{ margin:5px; }
	.block .content img				{ max-width:100% !important; max-height:auto !important; }
	.block.lockedblock .header		{ cursor:default !important; }

	/* button */
	.button-holder-line		{ clear:both; overflow:hidden; text-align:left; margin:10px; } 
	.button-holder			{ clear:both; overflow:hidden; text-align:center; margin:5px 5px 0 5px; } 
	.buttonset-legend		{ position:absolute !important; right:10px; top:0; overflow:hidden; }
	.sortable				{ padding:0; min-height:10px; }
	.button.block-button	{ display:block; width:100%; text-align:left; }

	/* split button */
	.ui-splitButton .ui-buttonset .ui-button { margin:0; }
	.ui-splitButton { margin:1px; }
	.ui-splitButton .ui-menu .ui-icon { position:relative; top:inherit; left:inherit; }
	.ui-splitButton .ui-menu .ui-button { display:block; text-align:left; width:100%; }
	.ui-splitButton .ui-menu { position:absolute; z-index:9999; }
	.ui-splitButton button.menu-is-open { z-index:2; }
		
	/* object id */	
	.objid {
		padding:0;
		margin:4px 0;
		font-weight:normal;
		line-height:normal;
	}
	/* tabs columns */
	.col-tabs-panel { 
		overflow:hidden; 
		min-width:500px;
	}
	.col-box {
		width: -moz-calc(100% - 42px);
		width: -webkit-calc(100% - 42px);
		width: -o-calc(100% - 42px);
		width: calc(100% - 42px); 
	}
	.col-box.col_1-2 {
		width: -moz-calc(50% - 42px);
		width: -webkit-calc(50% - 42px);
		width: -o-calc(50% - 42px);
		width: calc(50% - 42px); 
		float:left;
	}
	.col-box.col_1-3 {
		width: -moz-calc(34% - 42px);
		width: -webkit-calc(34% - 42px);
		width: -o-calc(34% - 42px);
		width: calc(34% - 42px); 
		float:left;
	}	
	.col-box.col_2-3 {
		width: -moz-calc(66% - 42px);
		width: -webkit-calc(66% - 42px);
		width: -o-calc(66% - 42px);
		width: calc(66% - 42px); 
		float:left;
	}
	.col-box.col_1-4 {
		width: -moz-calc(25% - 42px);
		width: -webkit-calc(25% - 42px);
		width: -o-calc(25% - 42px);
		width: calc(25% - 42px); 
		float:left;
	}
	.col-box.col_1-5 {
		width: -moz-calc(205% - 42px);
		width: -webkit-calc(20% - 42px);
		width: -o-calc(20% - 42px);
		width: calc(20% - 42px); 
		float:left;
	}				
	.col-box textarea[cols="60"],
	.col-box input[size="60"] {
		width: -moz-calc(100% - 40px);
		width: -webkit-calc(100% - 40px);
		width: -o-calc(100% - 40px);
		width: calc(100% - 40px); 		
	}
	.col-box textarea.bt2,
	.col-box input.bt2 {
		width: -moz-calc(100% - 66px);
		width: -webkit-calc(100% - 66px);
		width: -o-calc(100% - 66px);
		width: calc(100% - 66px); 		
	}		
	.col-box ul.tagit {
		width: -moz-calc(100% - 30px);
		width: -webkit-calc(100% - 30px);
		width: -o-calc(100% - 30px);
		width: calc(100% - 30px); 		
	}		
	.ui-table-info					{ border:none; border-collapse:collapse; vertical-align:top; }
	.ui-table-info th				{ text-align:right; padding:2px 10px; white-space:nowrap; vertical-align:top; }
	.ui-table-info th label 		{ margin:0; }
	.ui-table-info td				{ text-align:left; padding:2px 10px; vertical-align:top; }
	.ui-table-info tr td:last-child	{ width:100%; }
	.ui-table-info tr.odd			{ background:rgba(0,0,0,0.01); }
	.ui-table-info tr.even			{ background:rgba(255,255,255,0.5); }

#contacts-tabs-filters .ui-form { padding:0; margin:0; width:100%; }
#contacts-tabs-filters .ui-form th { text-align:right; white-space:nowrap; padding:0 10px; }
#contacts-tabs-filters .ui-form th label { margin:0; }
#contacts-tabs-filters .ui-form td { width:100%; }
#contacts-tabs-filters .ui-form input:not(.ui-autocomplete-input),
#contacts-tabs-filters .ui-form .ui-selectmenu { width:calc(100% - 2px); margin:0 1px; }
#contacts-tabs-filters .ui-form ul.tagit { width:calc(100% - 4px); margin:0 1px; }	
#contacts-tabs-filters .ui-form input.date-range { width: calc(50% - 4px); margin:0 1px; }

.hbt-1 {
    width: -moz-calc(100% - 40px);
    width: -webkit-calc(100% - 40px);
    width: -o-calc(100% - 40px);
    width: calc(100% - 40px);
}

/*///////////////////////////////////////////////////////////////////////// 
***************************************************************************
	AJUSTMENT
***************************************************************************	
/////////////////////////////////////////////////////////////////////////*/

	.width-1			{ width:100%; }
	.width-2			{ width:50%; }
	.width-3			{ width:33.33333333333%; }
	.width-4			{ width:25%; }			
	.width-5			{ width:20%; }	
	#hack-overlay		{ z-index:99; } /* pseudo modal - prevent redactor + JUI modal dialog BUG */
	.textarea-fullsize	{ width:100%; height:100%; margin:0 !important; resize:none; box-sizing: border-box; }
	.full-width 		{ width:100%; }
	.full-height 		{ height:100%; }
	.hidden 			{ display:none; }
	.inline 			{ display:inline-block; vertical-align:middle; }
	p > span.inline 	{ margin-right:5px !important; display:inline-block; }	
	.p > span.inline 	{ margin-right:5px !important; display:inline-block; }
	.has-inline			{ margin-bottom:-10px; }
	.has-inline > span.inline 	{ margin-bottom:10px !important; display:inline-block; }	
	.hidden-overflow 	{ overflow:hidden !important; }
	.auto-overflow 		{ overflow:auto; }	
	.no-scroll	 		{ overflow:visible !important; }	
	.clear 				{ clear:both; overflow:hidden; }
	.color				{ color: inherit !important; }
	.no-text-transform	{ text-transform:none; }
	.absolute 			{ position:absolute; }

	.f-left		{ float:left !important; }
	.f-right 	{ float:right !important; }

	.t-center	{ text-align:center !important; }
	.t-left		{ text-align:left !important; }
	.t-right	{ text-align:right !important; }
	
	.v-top		{ vertical-align:top !important; }	
	.v-middle	{ vertical-align:middle !important; }	

	.margin-b 		{ margin-bottom:5px; }
	.margin-t 		{ margin-top:5px; }
	.margin-l 		{ margin-left:5px; }
	.margin-r 		{ margin-right:5px; }
	.margin			{ margin:5px; }
	.no-margin-b 	{ margin-bottom:0px; }
	.no-margin-t 	{ margin-top:0px; }
	.no-margin-l 	{ margin-left:0px; }
	.no-margin-r 	{ margin-right:0px; }
	.no-margin		{ margin:0px; }
	.negative-margin { margin:-5px; }
	
	.padding-b 		{ padding-bottom:5px; }
	.padding-t 		{ padding-top:5px; }
	.padding-l 		{ padding-left:5px; }
	.padding-r 		{ padding-right:5px; }
	.padding		{ padding:5px; }
	.no-padding-b 	{ padding-bottom:0px; }
	.no-padding-t 	{ padding-top:0px; }
	.no-padding-l 	{ padding-left:0px; }
	.no-padding-r 	{ padding-right:0px; }
	.no-padding		{ padding:0px; }
	
	.no-border-l 	{ border-left:0px none; }
	.no-border-r 	{ border-right:0px none; }
	.no-border-t 	{ border-top:0px none; }
	.no-border-b 	{ border-bottom:0px none; }
	.no-border	 	{ border:0px none; }

	.no-box-shadow	{ box-shadow:none !important; }
	.no-background	{ background:none !important; }	
	.move			{ cursor:move; }	
	
	.icon-over-input 	{ position:absolute; top:2px; }
	.input-has-icon 	{ text-indent:20px; }
	p, .p 				{ margin:10px 0; }	
	
	.relative	{ position:relative; }
	.blur 		{ -webkit-filter: blur(2px); }
	.ellipsis	{ text-overflow: ellipsis; white-space:nowrap; overflow:hidden; box-sizing:content-box; }
	.nowrap		{ white-space:nowrap; }	