@import "../../../../libraries/bootstrap/less/mixins.less";

@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    src: url('../../../../resources/fonts/OpenSans-Regular-webfont.eot');
    src: url('../../../../resources/fonts/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../../../../resources/fonts/OpenSans-Regular-webfont.woff') format('woff'),
         url('../../../../resources/fonts/OpenSans-Regular-webfont.ttf') format('truetype'),
         url('../../../../resources/fonts/OpenSans-Regular-webfont.svg#open_sansregular') format('svg');
}

// Body Stylings

body {
	width: 100%;
	font-family : 'Open Sans',@baseFontFamily !important;
	font-size : @baseFontSize !important;//
	background: @bodyColor;
	color: darken(@baseFontColor,10%);
}
hr{
		margin: 8px 0;
		border-bottom: 1px solid @lightColorBorder;
}

//***********************************************************//
//----------------- Top Menu bar stylings--------------------//
//***********************************************************//
.navbar.navbar-fixed-top {
	.marginbottomZero;
	#topMenus{
		.marginbottomZero;
		.navbar-inner{
			height: 40px;
			.gradientBar(@menubarColor,@menubarColor);
			.menuBar{
				.nav.modulesList{
					li.tabs{
						a{
							color: @menubarLink;
						}
						&:first-child > a{
							padding: 10px 12px 9px;
						}
						a.selected{
							background: @menubarLinkBackground;
							color: @menubarLinkSelected;
							font-weight: bold;
						}
						&:hover a{
							background: lighten(@menubarLinkBackground,10%);
							color: @menubarLinkSelected;
						}
					}
				}
				#commonMoreMenu{
					.moreMenus{
						div a#menubar_item_moduleManager{
							color: @moreMenulinks;
						}
						.moduleNames{
							margin-bottom: 2px;
							a{
								font-size: 0.9em;
								padding : 3% !important;
								color: @moreMenulinks !important;
								&:hover{
									text-decoration : none;
									background: @menubarColor;
									color: @menubarLinkSelected !important;
								}
							}
						}
					}
					li a{
						color: @menubarLink;
					}
					li.open{
						background: @menubarLinkBackground;
						font-weight: bold;
						a{
							color: @menubarLinkSelected;
						}
					}
				}
			}
		}
	}
}
// All dropdown stylings
#collapsedMenu{
	display: block;
	position: relative;
	a{
		color: @menubarLink;
	}
	.dropdown-menu{
		.shortDropdown{
			max-height: 300px;
			overflow-y: scroll;
			padding: 10px;
			position: relative;
			z-index: 10000;
			-webkit-overflow-scrolling: touch;
			-webkit-transform: translateZ(0);
			.moduleNames{
				margin-bottom: 2px;
				a{
					font-size: 0.9em;
					padding : 3% !important;
					color: @moreMenulinks !important;
					&:hover{
						text-decoration : none;
						background: @menubarColor;
						color: @menubarLinkSelected !important;
					}
				}
			}
		}

	}
}

.moreMenus{
    &.leftAligned{
        &:after,&:before{
            left : 21px !important;
        }
    }
    strong{
        font-size: 1.1em;
		color: @moreMenulinks;
    }
    &:after,&:before{
            left : 292px !important;
    }
    width: 52em;
    padding: 24%;
    left: -270px;
    border-radius : 2px;
}
// Announcement
.announcement{
        .marStyle{
            width:100%;
         }
	.hide;
	background: @notificationBackground;
	padding: 2px 0;
	border-bottom: 1px solid @notificationborder;
	max-height: 24px;
    width:100%;
}
// Right Header links
#headerLinks{
	 padding: 10px 0 7px;
	 min-width: 240px;
	 float: right !important;
	 .headerLinksContainer{
		margin-right: 10px;
		&>[class*="span"] {
			float: left;
			margin-left: 15px;
		}
		.dropdown.open .dropdown-toggle{
			background: transparent;
		}
		ul.dropdown-menu{
			top: 30px;
			&:after, &:before{
				right:15px;
				left: auto;
			}
		}
		.settingIcons ul.dropdown-menu{
			left: -132px;
			top: 30px;
			&:after, &:before{
				right:15px;
				left: auto;
			}
		}
		&> span a img, &> span a.userName{
            color: @menubarLink;
			.cursorPointer;
			.caret {
					border-top: 4px solid @menubarLink;
			 }
		}
	}
}

.dropdown-menu.pull-right {
    right: 0;
    left: auto;
    cursor: pointer;
}

.navbar .dropdown-menu, .dropdown-menu{
	border-radius: 2px !important;
	li a{
		padding: 7px 15px;
	}
	li a:hover{
		background :@menubarColor;
		text-shadow: none;
	}
}

// Change Theme dropdown stylings //
.themeMenuContainer{
	min-width:110px;
	width: 110px;
	left: -84px !important;
	padding: 10px 0;
	.themeMenu{
		padding: 0 10px;
		.boxSizingBorderBox;
		.themeElement{
			cursor: pointer;
			margin: 5px;
			height: 20px;
			width: 20px;
			.boxSizingBorderBox;
			&:hover{
				.themeSelected;
			}
		}
		.themeSelected{
			border: 1px solid #000;
			background-image: url("../../../../libraries/bootstrap/img/glyphicons-halflings-white.png") !important;
			background-position: -286px 2px;
		}
	}
}

// Media queries for responsive menu bar
@media screen and (min-width: 1161px) {
	#mediumNav, #shortNav, #headerLinksCompact{
		display: none;
	}
	#largeNav{
		margin-left: 10px;
		margin-right: 0;
	}
	.commonActionsButtonContainer{
		margin-right: 10px;
	}
}
@media screen and (max-width: 1160px) and  (min-width: 960px){
	#largeNav, #shortNav,#headerLinksCompact, .adv-search, .notificationMessageHolder {
		display: none;
	}
	.companyLogo{
		width: 100%;
	}
	.customFilterMainSpan .select2-container{
		width:300px !important;
	}
	.commonActionsButtonContainer{
		margin-top: 4px;
	}
	*{
		zoom:1 !important;
	}
}
@media screen and (max-width: 960px){
	#mediumNav, #largeNav,#headerLinksBig, #commonMoreMenu,.nav.quickActions, #leftPanel, #toggleButton,.companyLogo,.notificationMessageHolder, .adv-search, .select-search .chzn-container.chzn-container-single{
		display: none !important;
	}
	.bodyContents{
		margin: 0 !important;
	}
	#rightPanel{
		width: 100% !important;
	}
	.actionsContainer {
		&> .span2{
			display: none !important;
		}
		.span10{
			padding: 0 12px;
			.boxSizingBorderBox;
		}
	}
	.span3#headerLinks{
		padding: 5px 5px 0;
	}
	.menuBar .span9, .span3#headerLinks{
		.boxSizingBorderBox;
		min-width:80px;
		.qCreate{
			display: inline-block;
			margin: 0px;
			img{
				margin-bottom: 3px;
				margin-right: 5px;
			}
			ul li.title{
				padding: 5px 0 0 15px;
			}
		}
		li.tabs{
			&:first-child > a{
				padding: 10px 12px 9px;
			}
		}
	}

	.customFilterMainSpan .select2-container{
		width:300px !important;
	}
	#quickCreateModules{
		width: 100% !important;
		padding: 0 !important;
	}
	.CompactQC{
			max-height: 300px;
			overflow-y: scroll;
			overflow-x: hidden;
			a:hover{
				text-decoration: none;
			}
	}
	#headerLinksCompact{
		 display: inline-block;
		 float: right;
		.btn-navbar{
			background: @menubarLinkBackground;
			display: inline-block;
			margin-right: 3px;
			margin-top: 2px;
			float: none;
		}
		ul.dropdown-menu{
			left: -115px;
			&:after, &:before{
				right:15px;
				left: auto;
			}
		}
		ul.dropdownStyles{
			left: -130px;
		}
		#compactquickCreate{
			&:hover{
				background: none;
			}
			.quickCreateModule:hover{
				text-decoration: none;
				color: @themeLinkColorInverse !important;
			}
		}
	}
	.searchElement{
		min-width:440px;
		padding-left:10px;
	}
}

// common Actions container
.commonActionsContainer{
	//Company Logo
	.companyLogo{
		display: inline-block;
		height : 3.5em;
		margin-top: 0.3em;
		margin-left: 20px;
		img{
			height: 98%;
			max-width: 100%;
			.boxSizingBorderBox;
		}
	}
	.marginbottomZero;
	.actionsContainer{
		background: @actionsContainerBackground;
		border-bottom: 1px solid @actionsContainerBorder;
		box-shadow: 0 1px 3px 0 @actionsContainerShadow;
		height:50px;
        .boxSizingBorderBox;
		&>.span10 > .row-fluid{
			margin-top: 9px;
		}
		&>.span2{
			height:50px;
		}
	}
	// Top Searchbar Stylings
	.searchElement{
		margin-top:2px;
		.searchBar,.select-search{
			display: inline-block;
			vertical-align: top;
			input{
				margin-bottom: 0;
			}
			.adv-search{
				margin: 4px 0 0 10px;
				a{
					color: @advSearch;
					.cursorPointer;
				}
			}
			.search-icon{
				border-radius: 2px !important;
                margin-left: 4px;
                padding: 4px 20px;
                cursor: pointer;
				background: @searchButton;
				border: 1px solid @themeBorder;
			}
			.chzn-container-single{
				.chzn-results{
						max-height: 450px;
					}
				.chzn-single{
					border-radius: 2px 0 0 2px;
					border: 1px solid @searchChznBorder;
					border-right: 0;
					background: @searchChzn;
						div{
							border-radius: 2px;
							background: @searchChzn;
							border-left: 0px !important;
						}
					}
				}
				.chzn-single.chzn-single-with-drop{
					div b{
						box-shadow: 0 1px 0 @white inset;
					}
				}
				#globalSearchValue{
					border-radius: 0;
				}
		}
	}

	.dropdown-menu.dropdownStyles.commonActionsButtonDropDown{
		left: -371px !important;
		min-width: 400px;
		top: 28px;
		li.title{
			padding: 5px 0 0 15px;
		}
		a{
			.cursorPointer;
		}
		#quickCreateModules{
			padding:  0 5px;
			div a:hover{
				color: @menubarLinkSelected;
			}
		}
	}
}

// Main container
.mainContainer{
	min-height: 500px;
    margin-top: 90px;
	background: @mainContainer;
	min-width:1200px;
	&> .span2{
		padding: 0 1.06383%;
		height: auto !important;
		min-width: 174px;
	}
	.contentsDiv{
		min-height: 500px;
		background: lighten(@bodyBackgroundColor,4%);
		.boxSizingBorderBox;
		border-left: 1px solid darken(@actionsContainerBorder,10%);
		position: relative;
	}
	#leftPanel{
		.gradientBar(@mainContainer,@mainContainer);
	}
}
// CSS for toggle button
.toggleButton {
    background: @mainContainer;
    font-weight: bold;
    padding: 5px 2px !important;
    position: absolute;
    top: 20px;
	left: -1px;
    cursor: pointer;
    width: 10px;
	z-index:100;
	border: 1px solid @lightColorBorder;
	border-left:0;
	display: inline-block;
}

.toggleButton .icon-chevron-left {
    background-position: -434px -72px !important;
    .icon-inverted;
}

.toggleButton .icon-chevron-right {
    background-position: -460px -72px !important;
    .icon-inverted;
}
// SideBar Stylings
.quickLinksDiv{
	margin: 10px 0;
	p{
		font-size: 1.2em;
		padding: 5% 0 0 11%;
		height: 28px;
		cursor: pointer;
		box-shadow: 0 0 0 1px @lightColorBorder;
		border-top: 1px solid @white !important;
		.gradientBar(lighten(@dashboardWidgetHeader,1%),@dashboardWidgetHeader);
		position: relative;
		border-radius: 2px;
		a{
			color: darken(@baseFontColor,10%);
		}
		a:hover{
			text-decoration: none;
		}
	}
	p.selectedQuickLink{
		.gradientBar(lighten(@menubarLinkBackground,10%),lighten(@menubarLinkBackground,10%));
		background-image: none;
		position: relative;
		border: 1px solid @menubarLinkSelected;
		box-shadow: 4px 0 3px -4px darken(@menubarLinkBackground,30%) inset;
		a{
			color: @menubarLinkSelected;
		}
	}

	p.selectedQuickLink a:after{
		border-bottom: 19px solid rgba(0, 0, 0, 0);
		border-left: 10px solid lighten(@menubarLinkBackground,10%);
		border-top: 19px solid rgba(0, 0, 0, 0);
		content: " ";
		display: inline-block;
		position: absolute;
		left: 100%;
		top:0;
	}
}
.quickWidgetContainer {
    li{
		a{
			overflow: hidden;
			white-space: normal;
			padding: 5px;
			margin: 0;
			width : 100%;
			.boxSizingBorderBox;
		}
    }
	.quickWidget{
		margin-bottom:10px;
		border: 1px solid @lightColorBorder;
		.box-shadow(0 0 3px -1px @lightColorBorder);
		.quickWidgetHeader {
			.gradientBar(lighten(@dashboardWidgetHeader,1%),@dashboardWidgetHeader);
			 text-shadow: 0px 1px @white;
			 border-top: 1px solid @white;
			 border-bottom: 1px solid @lightColorBorder;
			.cursorPointer;
			padding: 8px;
			h5{
				color: darken(@baseFontColor,10%);
				margin-left: 15px;
				float: left !important; // to Avoid pull-right
			}
		}
		.widgetContainer {
			 background-color : @contentsBackground;
			 &>div{
				.boxSizingBorderBox;
				padding: 7px 0;
			 }
		}
	}
}

.sidebarTitleBlock{
	padding: 12px 0;
	a{
		color: darken(@baseFontColor,5%) !important;
		&:hover{
			text-decoration: none;
		}
	}
}
#selectAllMsgDiv, #deSelectAllMsgDiv{
	.hide;
	background-color: @selectAllMsgDivColor;
	padding: 0.01%;
	.textAlignCenter;
}

//-- Modal Stylings --//
/** Advance Search **/

#advanceSearchContainer {
    background-color : @contentsBackground;
    position: relative;
	.filterElements{
		margin: 10px;
	}
    .filterContainer{
        padding: 0 15x;
		.deleteCondition{
			vertical-align: middle;
			margin: 6px;
		}
    }
	form{
		margin-bottom: 0;
		&>div{
			margin-bottom: 0;
		}
	}
	.modal-footer{
		padding-bottom: 5px;
	}
}

/** Global Search **/
.blockUI, #globalmodal{
	width: 100%;
	form{
		margin:0 0 0;
	}
}
.globalSearchResults{
	 .contentsBackground;
	 border: 1px solid darken(@lightColorBorder,10%);
	.box-shadow(0 0 3px -1px @lightColorBorder);
	 min-width: 280px;
	 min-height:500px;
    .highlightedHeader{
           .gradientBar(lighten(@dashboardWidgetHeader,1%),@dashboardWidgetHeader);
		    text-shadow: 0px 1px @white;
			border-bottom: 1px solid @lightColorBorder;
			color: @baseFontColor;
			padding:8px 5px;
    }
    #showFilter{
           color : @themeLinkColor;
    }
    //Search results popup
    .contents{
		.boxSizingBorderBox;
        padding: 5% 5% 10% 3%;
		max-height:500px;
		min-width: 280px;
		&> label{
			padding: 5px;
			border-bottom: 1px solid @lightColorBorder;
		}
        ul{
            li {
                a{
					margin: 5px 0;
					padding: 7px;
					span{
						color: @themeLinkColor;
						opacity: 0.5;
						font-size: 0.8em;
						p{margin:0 !important;}
					}
                }
            }
        }
    }
}
//-- Module Level Dashboards --//
.dashboardHeading{
	h2{
		padding-bottom:8px;
	}
	hr{
		border-bottom: 1px solid @lightColorBorder;
	}
	.dropdown-menu{
		left: -70px;
	    right: 0;
	}
}

//--- Dashboard Stylings ---//
.dashboardContainer{
	padding:0;
	.dashboardHeading{
		padding: 10px 0 0;
		background: @dashboardHeader;
		h2{
			padding: 0 0 8px 20px;
		}
		.btn-toolbar{
			padding: 3px 20px 0 0;
		}
		hr{
			border-bottom: 1px solid @lightColorBorder;
		}
		.dropdown-menu {
			 left: -82px;
		}
	}
}
.widgetsList{
	max-height: 400px;
	overflow-y: auto;
	overflow-x : hidden;
	li{
		display: block;
		a{
			white-space: normal;
			word-wrap: break-word;
		}
	}
}

.dashboard_notebookWidget_view .row-fluid{
	margin-bottom: 5px;
}
.gridster{
	margin-left: 0;
	width: 100%;
	.boxSizingBorderBox;
	ul{
		width: auto;
		display: block;
		.boxSizingBorderBox;
		min-height: 460px;
	}
}
.gridster ul{
	list-style: none;
	li.dashboardWidget{
		background: @contentsBackground;
		border-radius: 1px;
		border: 1px solid @lightColorBorder;
		.box-shadow(0 0 3px -1px @lightColorBorder);
		.dashboardWidgetHeader{
			.gradientBar(lighten(@dashboardWidgetHeader,1%),@dashboardWidgetHeader);
			text-shadow: 0px 1px @white;
			border-top: 1px solid @white;
			border-bottom: 1px solid @lightColorBorder;
			color: @baseFontColor;
			cursor: move;
			table{
				height: 28px;
			}
			padding : 5px;
			.dashboardTitle{
				text-align: left;
				padding-left : 10px;
			}
			.widgeticons{
				opacity: 0.5;
				padding-right: 6px;
			}
		}
		.filterContainer{
				position : absolute;
				border: 1px solid @lightColorBorder;
				background: @contentsBackground;
				margin-left: -7px;
				margin-right : 3px;
				margin-top : 4px;
				padding: 8px 0;
				border-radius: 0 0 5px 5px;
				box-shadow: 0 5px 8px -5px @grey;
				div	span{
					margin-top: 6px;
				}
				.span5{
					margin-top: 3px;
				}
			}
		.dashboardWidgetContent{
			padding: 10px 0;
			line-height: 20px;
		}
		.widgeticons {
			min-width: 50px;
			height:30px;
			margin-right:30px;
			visibility: hidden;
			a {
				cursor: pointer;
				text-decoration: none;
				i{
					.icon-inverted;
				}
			}
		}
	}

    .widgetChartContainer{
            margin-left:10px;
    }
}

//--ListView stylings--//

.listViewPageDiv{
    margin: 11px 0;
	#listViewEntriesMainCheckBox{
		//margin-left: 8px;
	}
}
.customFilterMainSpan{
	width: 100%;
	.select2-container{
		width: 95% !important;
	}
}

// Select2 overwrites
.select2-container .select2-choice{
		border-radius: 2px;
		background:  @contentsBackground;
		border-color: @lightColorBorder;
		font-size: 14px;
		letter-spacing: 0.01em;
		color: darken(@baseFontColor,10%);
		div{
			border-radius: 0;
			border-left: 0;
			background:  @contentsBackground;
		}
}
.select2-drop{
	border-color: @lightColorBorder;
	.select2-no-results{
		padding: 1px 10px;
	}
	ul.filterActions{
		list-style: none !important;
		li{
			cursor: pointer;
		}
	}
}
.ui-autocomplete .ui-menu-item{
	#ui-active-menuitem{
		background:  @baseThemeColor;
		border-radius: 0;
	}
}
li.ui-timepicker-selected,
.ui-timepicker-list li:hover,
.ui-timepicker-list:hover .ui-timepicker-selected:hover{
	background:  @baseThemeColor;
}

/*Do not shrink select2 input box in layout editor*/
#relatedTabOrder .select2-input{
	min-width: 200px;
}

.alphabetSorting{
	.alphabetSearch{
		a{
			vertical-align: middle;
			display: inline-block;
			margin-bottom: 2px;
		}
		&:hover{
			background: @bodyBackgroundColor;
		}
	}
}

.listViewActions{
	.settingsIcon{
		display: inline-block;
		margin-left: 5px;
	}
	&>.btn-group{
		min-width:105px;
	}
}

 // Pagination dropdown //
#listViewPageJumpDropDown, #relatedListPageJumpDropDown{
	 left: -60px;
}

.pageNumbers{
    display: inline-block;
    margin-right: 5px;
    margin-top: 6px;
    vertical-align: top;
    .totalNumberOfRecords{
		margin: 0 5px;
    }
}

.listSearchContributor{
	min-width: 100px;
	margin-bottom: 0 !important;
}

//Horizontal top scroll
.contents-topscroll, #reportDetails{
    overflow-x: auto !important;
    overflow-y: visible;
}
.contents-bottomscroll{
	overflow-x: auto !important;
}
.bottomscroll-div,.topscroll-div {
	display: table;
	min-width: 100%;
}
.listViewLoadingImageBlock{
	background: none;
	border-radius: 0px;
	box-shadow: none;
	text-align: center;

}

//--Detail view stylings--//
.detailViewContainer{
	padding: 0 20px;
}
.userPreferences{
	.contents{
		padding-left: 0 !important;
	}
	.details{
		border-right: 0 !important;
	}
}
.detailViewTitle{
	padding: 1.5% 0 0 1%;
	.boxSizingBorderBox;
	.recordLabel{
		font-size: 16px;
		font-weight: bold;
		width: 20em;
	}
	.detailViewButtoncontainer{
		margin-top: 8px;
	}
	.detailViewPagingButton{
		margin-top: 8px;
		padding-right: 10px;
		.boxSizingBorderBox;
	}
	.btn-toolbar{
		margin: 0;
	}
}
.detailview-table{
	th, td{
		vertical-align: middle;
		label{
			margin-bottom: 3px;
		}
	}
}
.detailViewInfo{
	box-shadow: 0 -4px 4px -4px lighten(@actionsContainerShadow,5%);
	margin-top : 10px;
	.contents{
		padding: 2.2% 0 0 2.2%;
		min-height:450px;
	}
	.details{
		min-height: 600px;
		padding-right: 1.5%;
		border-right: 4px solid @baseThemeColor;
		padding-bottom: 10px;
	}
	.related{
		.nav-stacked{
			//position: fixed;
			//width: 11%;
		}
		.nav-pills .active > a, .nav-pills .active > a:hover{
			background: @baseThemeColor;
			border-radius: 1px;
			margin-top:0;
			margin-bottom: 2px;
		}
	}
}
.fieldLabel {
    width: 20%;
	background: lighten(@editViewLabel,3%);
}

//-- Summary View--//
.summaryView {
	border: 1px solid lighten(@lightColorBorder,5%);
	.box-shadow(1px 1px 3px @lightColorBorder);
	border-radius: 2px;
	background: @contentsBackground;
	margin-bottom:10px;
	padding: 25px 20px 5px;
	.boxSizingBorderBox;
	.summary-table tr.summaryViewEntries:last-child{
		.fieldValue,.fieldLabel{
			border-bottom: 1px solid @lightColorBorder;
		}
	}
	.summaryViewEntries{
		.fieldLabel{
			vertical-align: top;
			padding: 5px 0 5px 5%;
			border-top: 1px solid @lightColorBorder;
			border-right: 1px solid @lightColorBorder;
		}
		.fieldValue{
			vertical-align: top;
			padding: 5px 0 5px 5%;
			border-top: 1px solid @lightColorBorder;
		}
		&:hover{
			.summaryViewEdit {
				.fullOpacity;
			}
		}
		.summaryViewEdit{
			.zeroOpacity;
		}
	}
	.toggleViewByMode{
		margin: 8px 0;
	}
}
.summaryWidgetContainer{
		border-radius: 2px;
		.box-shadow(1px 1px 3px @lightColorBorder);
		border: 1px solid lighten(@lightColorBorder,5%);
		background: @contentsBackground;
		margin-bottom:10px;
		padding: 15px;
		.widget_header{
			padding-bottom: 10px;
			padding-top: 0;
			border-bottom: 1px solid @lightColorBorder;
			button, &>.span8, &>.span9{
				margin:0;
			}
			h4{
				padding-top: 7px;
			}
		}
		.widget_contents{
			padding-top:10px;
			.span4{
				width: 40.4255%;
			}
		}
}
.commentContainer{
	.commentTitle{
		.boxSizingBorderBox;
		margin-bottom: 10px;
		textarea{
			width:100%;
			.boxSizingBorderBox;
		}
	}
}
// Project summary view styles //
.recordDetails{
	.squeezedWell{
		padding: 3% 2%;
		min-height: 105px;
		.boxSizingBorderBox;
	}
}
//--Edit View Stylings--//
/*#EditView{
	input[type="radio"]{
		margin: -2px 3px 0 0 !important;
	}
}*/
.recordEditView{
	.contentHeader{
		padding: 1.5% 0;
	}
	.table{
		.fieldLabel, .fieldValue{
			vertical-align: middle;
		}
	}
	.table tbody tr:hover td, .table tbody tr:hover th {
		background: lighten(@editViewLabel,3%);
	}
}

//-- Comment stylings --//
// Comments block
.commentContainer{
	//padding: 10px 10px 10px 20px ;
	border-radius: 2px;
	hr{
		margin: 0 !important;
    }
	.addCommentBlock .commentsControls{
		display: inline-block;
	}
	.commentsList > .liStyleNone > .commentDetails{
		.commentDiv{
			width:100%;
		}
	}
	.commentDetails{
		background:@bodyColor;
		border: 1px solid @lightColorBorder;
		margin-bottom: 5px;
		border-radius: 2px;
		padding: 10px 10px 5px;
		display: inline-block;
		min-width: 400px;
		.boxSizingBorderBox;
		.commentDiv{
			width: 380px;
		}

	}
	.commentorInfo{
		p{
			margin-bottom: 0;
		}
		.commentorName{
			//color: @generalLinkColor;
			&:hover{
				//color: @linkColorHover;
			}
		}
	}
	.addCommentBlock {
		.gradientBar(@bodyBackgroundColor,@bodyBackgroundColor);
		border: 1px solid @lightColorBorder;
		padding: 12px 12px 5px;
		min-height: 115px;
        margin-top: 15px;
		display: block;
		.commentcontent{
			//box-shadow: inset 0px 0px 8px -5px @boxShadowColor !important;
			padding : 8px !important;
			.boxSizingBorderBox;
			width: 100%;
			resize: none;
		}
    }
    .commentInfoContent{
		padding: 1px 0;
		word-wrap : break-word;
	}
}

.commentTitle {
	.span1 {
		.boxSizingBorderBox;
		img{
			min-width:32px;
			min-height:32px;
		}
	}
}

.commentsList > ul{
	margin-left: 0;
}
.singleComment{
	.editedStatus{
		.boxSizingBorderBox;
		padding: 5px 0 5px 32px;
		p{
			margin-bottom: 0;
		}
	}
	.commentActionsDiv{
		display: none;
		p{
			margin-bottom: 0;
		}
	}
	&:hover{
		.commentActionsDiv{
			display: block;
			margin-bottom: 3px;
		}
	}
}


// Recent Comments block
.recentComments{
	margin: 0;
	padding: 0;
	.boxSizingBorderBox;
	.commentDiv{
		min-width: 100%;
	}
	.addCommentBlock{
		border: 0;
		margin-top:0;
		display: block;
	}
	.commentDetails{
		display: block;
	}
}

.singleComment:hover .commentActions .replyComment{
	display: inline-block;
}

.commentActionsContainer{
	a{
		&:hover{
			text-decoration : none;
		}
	}
	.editStatus{
		padding:5px 2px;
		.boxSizingBorderBox;
		p{
			margin-bottom: 0;
		}
	}
}
//-------------------------
//************* TABLE STYLINGS *****************//
.table{
	background: @contentsBackground;
}
.table-bordered{
		border-radius: 1px;
		margin-bottom: 0;
		th{
			border-top: 1px solid @white !important;
		}
}
.table th{
	.gradientBar(lighten(@dashboardWidgetHeader,1%),@dashboardWidgetHeader);
	text-shadow: 0px 1px @white;
	//border-bottom: 1px solid @lightColorBorder;
	color: @baseFontColor;
}

.listViewEntriesTable.table-bordered th + th, .listViewEntriesTable.table-bordered td + td,
.listViewEntriesTable.table-bordered th + td, .listViewEntriesTable.table-bordered td + th{
	border-left: 0;
}
/*
.table-bordered th + th, .table-bordered td + td, .table-bordered th + td, .table-bordered td + th{
	border-left-color: @lightColorBorder;
}
.listViewEntriesTable tbody tr td{
	border-left: 1px solid @lightColorBorder;
}
.listViewEntriesTable tbody tr td:first-child{
	border-left: 0 none;
}
.listViewEntriesTable tbody td:last-child{
	border-left: 0;
}*/

.table-bordered thead:first-child tr:first-child th:first-child, .table-bordered tbody:first-child tr:first-child td:first-child{
	border-radius: 1px 0 0;
}
.equalSplit{
	td:nth-child(odd){
		width:20%;
	}
	td:nth-child(even){
		width:30%;
	}
}
td.fieldValue input, td.fieldValue .input-append{
	margin-bottom:0;
}
// List view stylings //
.actionImage, .actionImages{
	.zeroOpacity;
}
.listViewHeaders a{
	color: @dashboardWidgetHeaderText;
}
.listViewEntriesDiv .listViewHeaders th{
	.gradientBar(lighten(@dashboardWidgetHeader,1%),@dashboardWidgetHeader);
	border-bottom: 1px solid @lightColorBorder;
}
.listViewEntriesDiv, .listViewEntriesDiv td{
	overflow: visible;
}

.listViewEntriesTable .listViewHeaders a.listViewHeaderValues{
	color: @dashboardWidgetHeaderText;
	&:hover{
		text-decoration: none;
	}
	.icon-chevron-down.icon-white,.icon-chevron-up.icon-white{
		background-image: url("../../../../libraries/bootstrap/img/glyphicons-halflings.png");
		opacity: 0.7;
		margin-top: 1px;
	}
}
.listViewEntriesTable td.listViewEntryValue, .listViewEntries td{
	vertical-align: middle;
	cursor: pointer;
	overflow: visible;
        padding:5px;
	&:hover{
		.actionImages, .actions{
			.fullOpacity;
		}
	}
}
/*opacity applied for summary view edit, comment actions, activity widget edit*/
.summaryViewEntries .summaryViewEdit, .activityStatus .editStatus, .addedCalendars .actionImage{
	.zeroOpacity;
}

.summaryViewEntries:hover .fieldValue .summaryViewEdit, .activityStatus:hover .editStatus, .addedCalendars:hover .actionImage{
	.fullOpacity;
}
.listViewEntriesTable tr:hover td .actions .actionImages{
	.fullOpacity;
}

.listViewBasicAction.dropdown-menu {
	width:100%;
	input{
		border-radius: 2px;
		height: 24px;
		margin-bottom: 0;
		margin-top: -2px;
		width: 100%;
		.boxSizingBorderBox;
	}
}
.emptyRecordsDiv{
	width: 100%;
	border: 1px solid @lightColorBorder;
	.boxSizingBorderBox;
	text-align: center;
	font-size: 16px;
	padding: 5% 0;
	td{
		.boxSizingBorderBox;
		text-align: center;
		font-size: 16px;
		padding: 5% 0;
	}
}

// Styles for custom filter creation
.CustomFilterViewTitle{
	padding-top: 1%;
}
#CustomView .filterActions{
	padding-bottom: 20px;
	overflow: hidden;
}
.select2-container.select2-container-multi.columnsSelect{
	width: 100% !important;
}
.filterConditionsDiv{
	padding-bottom: 0;
}
.conditionGroup{
	.header{
		margin-bottom: 20px;
		font-size: 1.2em;
	}
	.contents{
		.conditionRow{
			margin-bottom: 10px;
            select, input{
				width: 90%;
			}
			.chzn-results li{
				line-height: 20px;
			}
		}
	}
	.deleteCondition{
		vertical-align: bottom;
	}
}

//Import
.searchUIBasic{
	border-collapse: separate !important;
	border-spacing: 10px !important;
        margin: 0 10%;
	.importContents{
        border: 1px solid lighten(@lightColorBorder,5%);
        .box-shadow(1px 1px 3px @lightColorBorder);
        border-radius: 2px;
        background: @contentsBackground;
        margin-bottom:10px;
        padding: 25px 20px 5px;
        .boxSizingBorderBox;
	}
	.listRow{
		.listViewHeaders > td{
			color: @themeLinkColor;
		}
		.defaultInputTextContainer{
			max-width: 87% !important;
			margin-bottom : 0 !important;
		}
	}
}

// Inventory Popups Styles //
//Line Items
// fix for line item taxmode, currency background header block
#lineItemTab.table{
	tr:first-child{
	    &:hover th~td{
			.gradientBar(@dashboardWidgetHeader,@dashboardWidgetHeader);
	    }
	}
	tr:nth-child(2){
	    &:hover td{
			background : none;
	    }
	}

}
.lineItemTable tr td {
    width: 0%;
	div.finalDiscountUI,
	div.discountUI,
	div#shipping_handling_div,
	div.taxUI,
	div.finalTaxUI{
		border: 2px solid darken(@lightColorBorder,10%);
		border-radius: 2px;
		table tr td, table tr th{
			border-left: 0;
		}
	}
}

.lineItemTable tr:hover td {
    width: 0%;
    div.finalDiscountUI table tr td {
		background: none !important;
    }
    div.discountUI table tr td{
		background: none !important;
    }
    div#shipping_handling_div table tr td{
		background: none !important;
    }
    span.taxDivContainer div table tr td{
		background: none !important;
    }
	div.finalTaxUI table tr td{
		background: none !important;
    }
}

// Fix complete

.lineItemResult{
	width: 70.5% !important;
	a:hover{
		color: @themeLinkColor;
	}
}

.lineItemInputBox{
    width: 45%;
    float: right;
    text-align: right;
}

.smallInputBox{
    width: 45%;
    height: 12px;
}

.lineItemCommentBox{
    width: 70%;
    height: 40px;
}

.inventoryLineItemHeader{
	float:left;
	margin: 7px;
	//.textShadow(@headerTextColor,0,0,1px,@headerTextShadowColor);
}

//Clean up the below css
.discountUI, .taxUI, .finalDiscountUI , .finalTaxUI, #shipping_handling_div{
    position: absolute;
    left: 46%;
    width: 27%;
	z-index: 500;
	box-shadow : 1px 0px 7px @lightColorBorder;
	border-radius : 6px;
	table.table{
		margin-bottom: 0;
	}
	.table tbody tr:first-child th:first-child{
		border-radius : 4px 0 0 0 !important;
	}
	.table tbody tr:first-child th:last-child{
		border-radius : 0 4px 0 0 !important;
	}
}
.LineItemDirectPriceReduction{
	width: 65% !important;
}

// Labels Editor //
th.htColHeader, .handsontable thead th{
	.gradientBar(lighten(@dashboardWidgetHeader,1%),@dashboardWidgetHeader);
	border-bottom: 1px solid @lightColorBorder;
	padding: 6px 2px;
}

//************************************************//
//-- Settings --//
//***********************************************//
.contentHeader {
    padding: 15px;
    padding-left: 5px;
    line-height: 20px;
}
.contentsDiv > div{
	padding: 0 20px;
}
#settingsQuickWidgetContainer{
	.widgetContainer.accordion-body{
		border-bottom: none !important;
		&>div:hover{
			background: @mainContainer;
		}
		.selectedMenuItem {
			background-color : @mainContainer;
			border-bottom : 1px solid @lightColorBorder !important;
			border-top : 1px solid @lightColorBorder !important;
			font-weight: bold;
			a{
				color : @baseFontColor;
				}
		}
		border-bottom : 3px solid @lightColorBorder;
		.menuItem{
			a{
				color : @baseFontColor;
				&:hover{
					text-decoration : none;
				}
			}
			&:hover{
				.pinUnpinShortCut{
					.displayInlineBlock;
					margin-top: 3px;
					opacity : 0.8;
					&:hover {
						opacity : 1;
					}
				}
			}
		}
	}
}
#settingsShortCutsContainer{
	.boxSizingBorderBox;
	min-height : 350px;
	padding: 1% 3%;
	.moduleBlock{
		min-height: 60px;
	}
	.span3.moduleBlock:hover{
		.unpin{
			display: inline-block;
			opacity : 0.4;
			&:hover {
				opacity : 0.8;
			}
		}
	}
}

.widget_header{
	padding: 12px 0 3px;
	h3, button{
		margin-top: 5px;
		&.btn-success{
			margin-top: 0;
		}
	}
}

.settingsIndexPage{
	.settingsSummary{
		text-align: center;
		margin-top: 10px;
		a{
			display: inline-block;
			background: @dashboardWidgetHeader;
			color: @baseFontColor;
			border-radius: 2px;
			min-width: 200px;
			padding: 20px 0 10px;
			border: 1px solid @lightColorBorder;
			.summaryText{
				display: inline-block;
				margin-top :20px;
				font-size: 15px;
			}
			&:hover{
			.summaryText, .summaryCount{
				color :@themeLinkColor;
			}
		}
	}
}
	.moduleBlock{
		h5{
			font-size: 1.2em;
			margin-bottom: 5px;
		}
		&:hover{
			background: @dashboardWidgetHeader;
		}
	}
}
#userPageHeader{
	padding: 8px 0 0;
	//border-bottom: 1px solid @lightColorBorder;
	#userHeading h3{
		margin-top: 10px;
	}
}
.treeView {
	li{
		border-left: 4px solid @lightColorBorder;
		list-style: none;
		padding-top: 15px;
		.toolbar-handle{
			.btn{
				margin:0px;
			}
			margin-left: 10px;
			position: relative;
		}
		.toolbar-handle a:before{
			background: none repeat scroll 0 0 #DDDDDD;
			content: " ";
			display: inline-block;
			height: 4px;
			left: -10px;
			position: absolute;
			top: 12px;
			width: 10px;
		}
	}
	.btn{
		margin-bottom: 10px;
	}
}
// Profiles
.profilesEditView{
	tr.blockHeader th{
		text-align: center;
		&:first-child{
			text-align: left;
		}
	}
	input{
		margin-right: 5px;
	}
	tr td.row-fluid{
		table.table{
			border-left: none;
			margin-bottom: 20px;
		}
	}
	tr:hover td.row-fluid{
		background: none;
		table.table tr td{
			background: none;
		}
		table.table tr:hover td{
			background: none;
		}
		table.table td{
			background: @dashboardWidgetHeader;
		}
	}
}

// Settings > Groups //

#s2id_memberList, .groupMembersColors{
   li > div{
		margin-left: 10px;
	}
  .Users{
		background-color : @users !important;
		padding: 5px;
		margin-bottom: 2px;
		.backgroundImageNone;
   }
   .Groups {
		background-color : @groups !important;
		.backgroundImageNone;
		padding: 5px;
		margin-bottom: 2px;
   }
	.Roles{
		background-color : @roles !important;
		.backgroundImageNone;
		padding: 5px;
		margin-bottom: 2px;
   }
   .RoleAndSubordinates{
		background-color : @rolesAndSubordinates !important;
		.backgroundImageNone;
		padding: 5px;
		margin-bottom: 2px;
   }
}
.collectiveGroupMembers{
	border : 1px solid @lightColorBorder;
	border-top : 0;
	ul{
		padding: 0;
		margin: 0;
		li{
			padding: 4px 0;
			.boxSizingBorderBox;
			a{
				display: inline-block;
				.boxSizingBorderBox;
				width:100%;
				margin: 0;
			}
		}
		li.groupLabel{
			background-color : @dashboardWidgetHeader;
			border-bottom : 1px solid @lightColorBorder;
			border-top : 1px solid @lightColorBorder;
			padding: 10px 5px;
			margin:0;
			color: @baseFontColor;
		}
	}
}


// Slider control
.mini-slider-control{
	width: 50px;
}

.mini-slider-control + div{
	margin-left: 15px;
}

.mini-slider-control .ui-slider-handle {
	border: 0;
	border-radius: 50%;
	height: 16px;
    top: -2px;
    width: 16px;
	cursor: pointer;
	&:focus{
		outline: none;
	}
}
.ui-widget-content{
	border-radius: 6px;
    border-color: @white;
    box-shadow: 0 0 3px -1px inset;
    margin-top: 2px;
	margin-left: 5px;
	height: 12px;
}
.ui-slider-disabled{
	opacity: 0.5;
	border-color: @lightColorBorder;
	box-shadow: none;
	cursor: not-allowed;
	.ui-slider-handle{
		cursor: not-allowed;
	}
	&+div{
		opacity: 0.5;
		cursor: not-allowed;
	}
}
.mini-slider-control[data-value="0"] .ui-slider-handle {
	background: #7d7e7d; /* Old browsers */
	background: -moz-linear-gradient(top,  #7d7e7d 0%, #0e0e0e 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7d7e7d), color-stop(100%,#0e0e0e)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #7d7e7d 0%,#0e0e0e 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #7d7e7d 0%,#0e0e0e 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #7d7e7d 0%,#0e0e0e 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #7d7e7d 0%,#0e0e0e 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7d7e7d', endColorstr='#0e0e0e',GradientType=0 ); /* IE6-9 */
}

.mini-slider-control[data-value="1"] .ui-slider-handle {
	background: #ffb76b; /* Old browsers */
	background: -moz-linear-gradient(top,  #ffb76b 0%, #ffa73d 0%, #ff7c00 49%, #ff7f04 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffb76b), color-stop(0%,#ffa73d), color-stop(49%,#ff7c00), color-stop(100%,#ff7f04)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #ffb76b 0%,#ffa73d 0%,#ff7c00 49%,#ff7f04 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #ffb76b 0%,#ffa73d 0%,#ff7c00 49%,#ff7f04 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #ffb76b 0%,#ffa73d 0%,#ff7c00 49%,#ff7f04 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #ffb76b 0%,#ffa73d 0%,#ff7c00 49%,#ff7f04 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffb76b', endColorstr='#ff7f04',GradientType=0 ); /* IE6-9 */
}

.mini-slider-control[data-value="2"] .ui-slider-handle {
	background: #bfd255; /* Old browsers */
	background: -moz-linear-gradient(top, #bfd255 0%, #8eb92a 79%, #72aa00 100%, #9ecb2d 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#bfd255), color-stop(79%,#8eb92a), color-stop(100%,#72aa00), color-stop(100%,#9ecb2d)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #bfd255 0%,#8eb92a 79%,#72aa00 100%,#9ecb2d 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #bfd255 0%,#8eb92a 79%,#72aa00 100%,#9ecb2d 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #bfd255 0%,#8eb92a 79%,#72aa00 100%,#9ecb2d 100%); /* IE10+ */
	background: linear-gradient(to bottom, #bfd255 0%,#8eb92a 79%,#72aa00 100%,#9ecb2d 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bfd255', endColorstr='#9ecb2d',GradientType=0 ); /* IE6-9 */
}

// Module Manager
#moduleManagerContents{
	padding-bottom: 10px;
	.moduleManagerBlock{
		.moduleName{
			margin-top: 4px;
		}
		.btn-group.open .dropdown-menu{
			left: -144%;
		}
	}
	.modulesTable{
		td{
			width: 50%;
		}
	}
}
#importModules .contents .row-fluid{
	margin-bottom: 2.2%;
}
.extensionWidgetContainer{
	background-color: @white;
	border: 1px solid @lightColorBorder;
	min-height: 200px;
	padding: 2%;
	.extension_contents{
		margin-top: 2%;
		.contentsBackground;
		border: 1px solid @lightColorBorder;
		padding: 10px;
                min-height: 230px;
		.slimScrollDiv{
			padding-right: 10px;
		}
	}
        .extension_contents:hover {
            border-radius: 4px;
        }
	.extension_header .font-x-x-large{
		font-size: 1.5em;
		padding-left:3px;
		font-weight: bold;
		color: @themeLinkColor;
	}
	.extensionDescription {
		line-height: 20px;
	}
	.extensionInfo{
		padding-top: 5%;
	}
        .thumbnailImage {
            height: 130px;
            width: 130px;
            float: right;
        }
}

.extensionWidgetContainer:hover{
    background: #fafafa;
    box-shadow: 1px 1px 14px 0px #ccc;
}
//Module Manager - general class to apply opacity to actions
.opacity .actions{
	.zeroOpacity;
}
.opacity:hover .actions{
	.fullOpacity;
}

// Sharing Access
.sharingAccessDetails{
	margin-bottom: 30px;
	td,th{
		text-align: center;
		vertical-align: middle !important;
	}
	tr td:first-child, tr th:first-child{
		text-align: left;
	}
	td.row-fluid > div{
		display: block;
	}
	.customRuleContainer:hover{
		background: none;
	}
	hr{
		border-bottom: 1px solid darken(@lightColorBorder,13%);
	}
	.title{
		padding: 1%;
		.boxSizingBorderBox;
		.rulehead{
			padding-top: 5px;
		}
	}
	.customRuleEntries:hover .actionImages{
		.fullOpacity;
	}
}
// Layout Editor
.layoutContent{
	border-top: 4px solid @baseThemeColor;
	#moduleBlocks .editFieldsTable{
		margin-bottom:20px;
		.fieldLabel{
			background: none;
		}
		.layoutBlockHeader{
			.gradientBar(lighten(@dashboardWidgetHeader,1%),@dashboardWidgetHeader);
			text-shadow: 0px 1px @white;
			border-top: 1px solid @white;
			border-bottom: 1px solid @lightColorBorder;
			.blockLabel{
				padding-top: 13px;
			}
			.blockActions .btn-group{
				margin-top: 5px;
				.dropdown-menu{
					left: -100%;
				}
			}
		}
	}
	.relatedTabModulesList{
		padding: 2% 1%;
	}
}
.fieldDetailsForm{
	.search-choice-close{
		padding: 0;
	}
}
.border1px {
	border: 1px solid @lightColorBorder;
}

.blockFieldsList {
	.opacity {
		margin-left : 0.5% !important;
		.dropdown-menu a {
			padding : 0px !important;

		}
		a.dropdown-toggle.editFieldDetails{
			box-shadow: none;
		}
	}
	.editFields{
		.dropdown-menu{
				z-index: 1000003;
				padding:0;
				left: -215px;
				position: absolute;
				.modal-header{
					border-width: 0;
					border-bottom-width: 1px;
					.cancel{
						padding-right: 0;
						font-weight: bold;
					}
				}
				.modal-footer .cancel{
					padding: 0 8px 0 3px;
				}
			}
		&:hover{
			background: @dashboardWidgetHeader !important;
		}
	}
}

//-- Picklist Editor --//
#modulePickListValuesContainer .layoutContent{
	padding-left: 2%;
	.selectedCell, .selectedListItem{
		background: lighten(@baseThemeColor,40%);
		white-space: nowrap;
	}
	.pickListValue{
		cursor : pointer;

	}
}

.nonEditableValuesDiv .nonEditablePicklistValues{
	margin-left: 0;
	li{
		padding: 3px 15px;
		margin-bottom: 2px;
		background: #E0F2FF;
	}
}
//-- Popover Content --//
.popover {
	z-index : 1000023 !important;
}
.popover-content{
	.fieldLabel{
		width:35%;
		white-space: normal;
	}
}
//Picklist dependencyGraph//
#dependencyGraph{
	.tableHeading{
		text-align: center;
		padding-top: 30px;
		font-size: 1.2em;
		font-weight: bold;
	}
	.depandencyTable{
		border: 1px solid @lightColorBorder;
		background: @dashboardWidgetHeader;
		.blockHeader{
				border-bottom: 1px solid @lightColorBorder;
		}
		.picklistValueMapping{
			border-bottom: 1px solid @lightColorBorder;
		}
	}
	.dependencyMapping{
		text-align: center;
		border-left: 1px solid @lightColorBorder;
		border-right: 1px solid @lightColorBorder;
		background: @contentsBackground;
		.mCSB_container{
			margin-bottom: 16px !important;
		}
		.pickListDependencyTable{
			border: 0;
			.blockHeader th{
				background: @dashboardWidgetHeader;
				border-bottom: 1px solid @lightColorBorder;
			}
			.selectedCell{
				background: lighten(@baseThemeColor,40%);
			}
		}
	}
}
//-- WebForms --/
.webformFieldInfo{
	margin-bottom: 250px;
}
.targetFieldsTableContainer{
	input[type="text"]{
		min-width: 100px;
	}
}
//--Customize record numbering--//
#customRecordNumbering.table thead th{
	vertical-align: middle;
}
//Mail Converter Styles//
.addMailBoxBlock {
    margin-left: 83px;
	padding: 0 !important;
	font-size: 12px;
}

.addMailBoxStep{
	background: @contentsBackground;
	padding: 30px 0;
	border: 1px solid @lightColorBorder;
	border-radius: 1px;
	min-height: 170px;
}

.mailConveterDesc {
    height:350px;
    width:96%;
    border: 1.5px solid;
    border-radius:2px;
    border-color:#dddddd;
    font-size:11pt;
    margin-top: 55px;
    margin-left: 20px;
    background: @contentsBackground;
}

#mailBoxLabel {
    margin-top:15px;
    margin-left: -18px;
    font-size: 12pt;
    width: 75px;
}

.mailBoxDropdownWrapper {
    height: 49px;
    width: 70%;
    background: url('../images/mailbox-icon.png') no-repeat 5px 5px;
    overflow: hidden;
    border: 1px solid #dddddd;
}

.mailBoxDropdown {
    background: transparent url('../images/downArrowBlue.png') no-repeat 236px 13px;
    width: 110%;
    height: 50px;
    font-size: 14pt;
    color: #0065a6;
    padding: 10px 55px;
    padding-right: 0;
}

#mailConverterDragIcon {
    margin-top: 12px;
}

#mailConverterBody {
    padding-top: 20px;
    margin-left: 0px;
}

.ruleHead{
    padding: 6px 0;
    background: darken(@dashboardWidgetHeader,10%);
}

.mailConverterRuleBlock {
    font-size:14px;
    line-height: 30px;
    border: 1.5px solid;
    border-color:#dddddd;
}

.mailConverterRuleLegend {
    font-size: 14px;
    color: #0065a6;
    margin-bottom:10px;
    background: @dashboardWidgetHeader;
}

#mailConverterStats {
    font-size: 10pt;
    margin-top: 5px;
    margin-left: -10px;
}

.addMailBoxBlock {
    border-color: #dddddd;
    margin-left: 83px;
    margin-top: 20px;
    padding-top: 30px;
    padding-left: 200px;
    padding-bottom: 20px;
    padding-right: 30px;
    font-size: 11pt;
}

//--Workflows stylings--//
.taskTypeUi{
	&>.row-fluid{
		margin: 10px 0;
	}
}

#taskListContainer .listViewEntriesTable tr td:last-child{
	border-left: 1px solid @lightColorBorder;
}

#workflow_step2 > .row-fluid{
	padding: 20px;
	.boxSizingBorderBox;
	min-height: 400px;
}

// Mail Manager //

#open_email_con{
    .detailViewTitle{
        padding: 0;
        .detailViewPagingButton{
            margin-top: 0;
            padding-right: 0;
        }
    }
}

#foldersList .nav-list{
    padding-right: 0;
}

// Mass Edit table //
.massEditTable th + th, .massEditTable td + td, .massEditTable th + td, .massEditTable td + th{
	border-left: 0;
}

.nav.massEditTabs{
	margin-bottom: 0;
	border-bottom: 0;
	li.active{
		a{
			background : @menubarColor;
			color : @menubarLinkSelected;
			margin-left: 10px;
		}
	}
	li a:hover{
		border-bottom: 1px solid @menubarColor;
	}
}

.massEditContent{
	border-top:3px solid @menubarColor;
}

//-- Calendar OverWrites--//
//Calendar Settings

.calendarSettingsContainer{
	width : 700px;
	.control-label{
		width : 26%;
	}
}

#calendarSettings{
    margin: 1px 0 3px;
}

.calendarMassEdit{
	min-width:400px;
}
.fc-state-default .fc-button-effect {
    top: 100% !important;
}
//-- Calender events Colors--//
.fc-event-style1,.fc-event-style1 .fc-event-skin { background: @fc-style1; border-color: @fc-style1; font-weight: normal; text-shadow: none; }
.fc-event-style2,.fc-event-style2 .fc-event-skin { background: @fc-style2; border-color: @fc-style2; font-weight: normal; text-shadow: none; }
.fc-event-style3,.fc-event-style3 .fc-event-skin { background: @fc-style3; border-color: @fc-style3; font-weight: normal; text-shadow: none; }
.fc-event-style4,.fc-event-style4 .fc-event-skin { background: @fc-style4; border-color: @fc-style4; font-weight: normal; text-shadow: none; }
.fc-event-style5,.fc-event-style5 .fc-event-skin { background: @fc-style5; border-color: @fc-style5; font-weight: normal; text-shadow: none; }
.fc-event-style6,.fc-event-style6 .fc-event-skin { background: @fc-style6; border-color: @fc-style6; font-weight: normal; text-shadow: none; }
.fc-event-style7,.fc-event-style7 .fc-event-calendarMassEditskin { background: @fc-style7; border-color: @fc-style7; font-weight: normal; text-shadow: none; }
.fc-event-style8,.fc-event-style8 .fc-event-skin { background: @fc-style8; border-color: @fc-style8; font-weight: normal; text-shadow: none; }
#calendarview th {
    color : @black;
}

.fc-agenda-divider + div{
	overflow-y: visible !important;
}

.fc-button{
	border-radius :0 !important;
	padding: 5px 10px !important;
	&:active .fc-button-inner{
		background: transparent;
		.fc-button-content{
			color: @white;
		}
	}
	&.fc-state-active .fc-button-inner .fc-button-content,
	&:active .fc-button-inner .fc-button-content{
		color: @black !important;
		background: transparent;
		background-image: none;
	}
}

.fc-header-title h2{
	font-size: 15px;
	line-height: 20px;
}

.fc-widget-header {
	padding: 7px 0px !important;
	color: #666;
	background: #eee;
	border-color: #ccc;
}

.fc-content {
	background: #fff;
	margin-top: 15px;
}

.fc-content td:hover{
	background: #f3f3f3;
}


//---Button stylings---//
// Listview setting button dropdown
.listViewSetting.dropdown-menu{
	left: -150px;
}
button{

}

.btn{
	font-weight: bold;
    background-color: none ;
    background-image: none;
    border-radius: 0 !important;
    &:focus{
        outline: 0;
    }
}

.btn-primary{
	background: @primarybtnColor;
	&:hover{
		background: darken(@primarybtnColor, 15%);
	}
}

.addButton{
    background: @addButton;
    text-shadow: none;
    border-radius: 0 !important;
    &:hover{
        border-radius: 0 !important;
        background-position: 0 0;
        background: @addButton;
    }
    .caret{
    }
    i{
      .icon-inverted;
    }
	i.caret{
		background-size:0;
	}
}

.saveButton, .btn-success{
	margin-right: 5px;
}

.cancelLink{
	.cursorPointer;
        color :	@deleteButton;
        margin: 6px 8px;
        font-size : @baseFontSize !important;
	&:hover{
        color : @deleteButton !important;
	 }
}

.addCustomRule{
	float: right;
}

.importMore{
	background: @addButton;
	//.textShadow(@textColor,1px,1px,1px,@textShadowColor);
	&:hover{
	    //box-shadow: 1px 1px 3px @boxShadowColor !important;
	   // border-style: solid;
	    //border-color: @darkColorBorder !important;
	}
}

.lastImport{
	background: @addButton;
	//.textShadow(@textColor,1px,1px,1px,@textShadowColor);
	&:hover{
		//box-shadow: 1px 1px 3px @boxShadowColor !important;
		//border-style: solid;
		//border-color: @darkColorBorder !important;
	}
}

.undoImport{
	background: @importUndoLastImport;
	//.textShadow(@textColor,1px,1px,1px,@textShadowColor);
	&:hover{
		//box-shadow: 1px 1px 3px @boxShadowColor !important;
		//border-style: solid;
		//border-color: @darkColorBorder !important;
	}
}

.close{
	border : none;
	background: none repeat scroll 0 0 transparent;
    border: 0 none;
    cursor: pointer;
}

.resetButton{
	margin-top:0 !important;
}

.vtGlyph {
  display: inline-block;
  width: 14px;
  height: 14px;
  line-height: 14px;
  vertical-align: text-top;
  background-image: url("../images/vtGlyph.png");
  background-position: 0 0;
  background-repeat: no-repeat;
  *margin-right: .3em;
}

.vticon-pageJump{
      background-position: 0 0;
}

.vticon-call-inbound{
      background-position: -14px 0;
}

.vticon-call-outbound{
      background-position: -28px 0;
}
#massEdit .cancelLinkContainer{
	padding: 5px 0;
	margin-left: 0.5em;
}

.ui-pnotify{
	z-index: 1000023;
}
/*Feedback UI*/
.feedback {
	z-index: 10002;
}

.feedback .handle {
	z-index: 10003;
	display: block;
	position: fixed;
	bottom: 50px;
	left: -30px;
        left: 0\9;
        bottom: 100px\9;
	background: #2C2C2C;
	color: white;
	padding: 7px 15px;
	border:1px solid gray;
	text-decoration: none;
	outline: none;
	// http://scottgale.com/blog/css-vertical-text/2010/03/01/
	-webkit-transform:rotate(270deg);
	-moz-transform:rotate(270deg);
	-o-transform: rotate(270deg);
	-ms-transform: rotate(270deg);
	transform: rotate(270deg);
        // IE8 Rotate
        // http://www.boogdesign.com/examples/transforms/matrix-calculator.html
        -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.00000000, M12=1.00000000, M21=-1.00000000, M22=0.00000000,sizingMethod='auto expand')";
        filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.00000000, M12=1.00000000, M21=-1.00000000, M22=0.00000000,sizingMethod='auto expand');
}

.feedback .handle:hover {
	text-decoration: none;
}

/* Footer */
.vtFooter {
    text-align: center;
    p{
        background: @footerBackground;
		color: @themeLinkColorInverse;
		border-top: 1px solid @lightColorBorder;
        padding: 1px 0;
        font-size: 0.9em;
        margin-bottom:0;
		a{
			color: @menubarLinkSelected;
		}
    }
}

/* Footer */

/*****Loading message **********/
.imageHolder{
	background: url('../images/loadback.png') repeat-y;
	background-position: center;
	padding: 10px 0;
}
//-- BreadCrumbs -- //

.breadcrumbContainer{
	padding:2% 2% 0 2%;
	.boxSizingBorderBox;
	height: auto;
}

.breadcrumb{
	display: inline-block;
	height: auto;
	height: 40px;
}

.crumbs{
	height: 40px;
	margin: 0;
	padding: 0 20px 0 0;
	display: inline-block;
	font-family: sans-serif;
}

.crumbs li:after{
	content: '\0000a0';
	width:0;
	height:0;
	border-left:19px solid #ECECEC;
	border-top:20px solid transparent;
	border-bottom:20px solid transparent;
	display: inline-block;
	position: relative;
	top: -20px;
	left: 18px;
	zoom: 1;
}

.crumbs li{
	height:0;
	border-top:20px solid #ECECEC;
	border-bottom:20px solid #ECECEC;
	border-left:20px solid transparent;
	display: inline-block;
	cursor: pointer;
	box-shadow: 0 1px #ddd;
	margin-right: 5px;
}

.crumbs li a{
	display: inline-block;
	float: left;
	margin-top: -13px;
	font-size: 14px;
	font-weight: bold;
	color: #666;
	text-decoration: none;
}

.crumbs li:hover{
	height:0;
	border-top:20px solid lighten(@baseThemeColor,5%);
	border-bottom:20px solid lighten(@baseThemeColor,5%);
	box-shadow: 0 1px lighten(@baseThemeColor,5%);
	a{
		color: @white;
	}
}

.crumbs li:hover:after {
	border-left:20px solid lighten(@baseThemeColor,5%) !important;
}

.crumbs li.active{
	height:0;
	border-top:20px solid @baseThemeColor;
	border-bottom:20px solid @baseThemeColor;
	box-shadow: 0 1px @baseThemeColor;
}

.crumbs li.active:after{
	border-left: 18px solid @baseThemeColor !important;
}

.stepText{
	display: inline-block;
	white-space: nowrap;
	overflow: hidden;
	font-size: 13px;
	vertical-align: bottom;
}

.active .stepText,
.active .stepNum{
	color: #fff;
}

.stepNum{
	display: inline-block;
	padding: 0 5px;
	overflow: hidden;
	font-size: 20px;
	vertical-align: top;
	margin-top: 5px;
}

//css used for engagement level in contacts and leads

.greyStar {
    background-image: url("../images/stars.png");
    background-position: 20px 20px;
    height: 20px;
    width: 20px;
    display: inline-block;
}

.yellowStar {
    background-image: url('../images/stars.png');
    background-position: 0 20px;
    width: 20px;
    height: 20px;
    display: inline-block;
}


//--JavaScript overwrites--//
.blockUI{
	border-radius: 2px !important;
	border: 0 !important;
}
textarea.span11{
	width :100% !important;
	.boxSizingBorderBox;
}

// Listview Popover //
.popover {
	.popover-inner{
		border-radius: 2px;
		font-size:0.8em;
		box-shadow: 0;
		.popover-title{
			color: @baseFontColor;
			font-size: 15px;
		}
		.close{
			color: @black !important;
			margin-top: 3px;
			opacity: 0.5 !important;
			&:hover{
				opacity: 1 !important;
			}
		}
		td{
			padding: 3px 5px;
			overflow-wrap: break-word;
		}
		.detailViewInfo{
			margin-top:0;
			box-shadow: 0;
			.fieldLabel label{
				font-size:1em;
			}
		}
	}
}

// Find Duplicates Popup //
#findDuplicate{
	&>.control-group{
		margin-bottom: 0;
		width: 400px;
	}
}

#moveReports .modal-body {
    padding: 20px 40px;
}

//Compose Email Popup//
#composeEmailContainer{
	padding: 0 20px;
	.MultiFile-wrap{
		display: inline-block;
	}
	.MultiFile-intercepted .ui-wrapper{
		min-height: 400px;
	}
}

// Tranfer Ownership popup //
#transferOwnershipContainer .select2-container.select2-container-multi{
	max-width: 220px;
}

//Convert Lead

.fieldInfo.in{
	overflow:visible !important;
	height: auto !important;
}

.moduleSelection{
	border-radius: 2px 2px 0 0 !important;
    border: 1px solid @lightColorBorder !important;
	.gradientBar(lighten(@dashboardWidgetHeader,1%),@dashboardWidgetHeader);
	color: @dashboardWidgetHeaderText;
}

.convertLeadModules{
	margin-bottom: 2%;
    border: 1px none;
}

.moduleBlock{
	border-radius: 0px !important;
}

.overflowVisible{
	overflow:visible !important;
}

.convertLeadError{
	border: 3px solid rgb(153, 153, 153);
	background-color: rgb(255, 255, 255);
	width: 55%;
	position: relative;
	z-index: 10000000;
	table td{
		border-bottom: 1px solid rgb(204, 204, 204);
		nowrap: nowrap;
		width:70%;
	}
}

.bootbox, .alert{
	z-index: 1000023;
}

// Chozen Overwrites //
.chzn-container{
    vertical-align: middle;
}
.chzn-container .chzn-results {
	li{
		margin-right: 7px;
	}
	.highlighted{
		background :@menubarColor;
	}
}

// Select2 overwrites //
.select2-results{
	.select2-highlighted{
		background :@menubarColor;
	}
}

.select2-result-label{
	.filterActionImgs{
		margin-top: 3px;
	}
	i{
		background-image: url("../../../../libraries/bootstrap/img/glyphicons-halflings-white.png");
	}
}

// Select2 Plugin customization
.select2-container-multi .select2-choices .select2-search-choice {
	cursor: move;
}

.select2-search-field{
	display: block;
	width:100%;
}

//Auto Complete Reference Field

.ui-autocomplete-loading {
	background: url('../images/load.gif') no-repeat right center;
}

.ui-autocomplete{
	height: auto !important;
	border-radius: 1px !important;
}

.dropdown-menu.pull-right{
	&:after,&:before{
		right : 3px;
		left : auto;
        top: -5px;
        border-bottom-width: 6px;
	}
}
// Bootstrap overwrites //


a{
	color: darken(@themeLinkColor,5%);
	&:hover{
		color: darken(@themeLinkColor,15%);
		text-decoration: none;
		cursor: pointer;
	}
	&:active, &:focus{
        outline: 0;
    }
}

.well{
	border-radius: 2px;
	padding: 15px;
}

.verticalBottomSpacing{
	margin-bottom: 10px;
}

.mergeTables {
	margin-bottom: 0px;
}

.font-x-x-large{
	font-size: 18px;
	line-height: 28px;
}

img{
	//-- Hack/Fix for overflowing actions container searchbar next line for Arial font --//
	max-width: 95%;
}

form{
	margin: 0;
}

.input-prepend .add-on, .input-append .add-on,.input-prepend.input-append .add-on:first-child, .input-prepend.input-append .btn:first-child{
	line-height: 22px;
	border-radius: 1px !important;
}

input, textarea, select,
.uneditable-input, input[type="text"], input[type="password"],
.ui-autocomplete-input, textarea, .uneditable-input,
.chzn-container-single .chzn-single, .chzn-container-single .chzn-single div,
.input-prepend .add-on, .input-append .add-on{
	border-radius : 1px;
}

.fc-state-default .fc-button-effect span{
	background: none;
}

.input-prepend.input-append input,
.input-prepend.input-append select,
.input-prepend.input-append .uneditable-input {
  -webkit-border-radius: 0;
     -moz-border-radius: 0;
          border-radius: 0;
}

.input-prepend.input-append .add-on:first-child,
.input-prepend.input-append .btn:first-child {
  margin-right: -1px;
  -webkit-border-radius: 3px 0 0 3px;
     -moz-border-radius: 3px 0 0 3px;
          border-radius: 3px 0 0 3px;
}

.input-prepend.input-append .add-on:last-child,
.input-prepend.input-append .btn:last-child {
  margin-left: -1px;
  -webkit-border-radius: 0 3px 3px 0;
     -moz-border-radius: 0 3px 3px 0;
          border-radius: 0 3px 3px 0;
}

.dateField{
	width: 183px;
}
// To make align addon icons vertically middle
.form-horizontal{
	[class^="icon-"], [class*=" icon-"]{
		vertical-align: baseline;
	}
}

// Other over writes

//Time picker styles
.timePicker{
	width: 8.5em !important;
	//layout editor drop down should show
	z-index: 1000029 !important;
}

.datepicker {
	//layout editor drop down should show
	z-index: 1000029 !important;
}

//Color picker styles
.colorpicker {
	//color picker should highlight than full calendar view
	z-index: 1029 !important;

	//color picker input override by bootstrap
	input {
		width : 30px !important;
	}

	//color picker input color overriding by editview inputs
	input[type="text"], input {
		color : #898989 !important;
	}
}

//color picker input override by bootstrap
.colorpicker_hex input {
	width : 45px !important;
}

//Fix for background scroll when modal is open
  .modal-body.accordion{
	  margin-bottom: 0;
	  .boxSizingBorderBox;
  }
.modal-open {
	overflow : hidden;
	/** modal will be having z-index as 10001 **/
	.datepicker, .timePicker{
		z-index : 1000008 !important;
	}
	.chzn-drop{
		z-index : 1000008 !important;
	}
}
.modal-open .massEditContent, .tab-content, .overflowVisible{
	overflow: visible;
}
// Select2 Plugin customization
.select2-container-multi .select2-choices .select2-search-choice {
	cursor: move;
}

//Fix for no file chosen issue with mutlifile plugin.
.removeNoFileChosen{
	color: transparent !important;
}

.modelContainer{
    .modal-header {
        border-radius: 2px 2px 0 0;
    }
    form{
        border-radius: 0 0 2px 2px;
    }
}

// Css Classes used here
.hide{
	display: none;
}
i{
    .cursorPointer;
}
.marginbottomZero{
	margin-bottom: 0 !important;
}
.marginLeftZero{
	margin-left: 0 !important;
}
.clearfix{
	clear: both !important;
}
textarea{
	.boxSizingBorderBox;
	width:100%;
}
//Mixin for textoverflow ellipsis
.textOverflowEllipsisMixin(@width,@textOverflow : ellipsis){
	overflow : hidden;
	text-overflow : @textOverflow;
	white-space : nowrap;
	width : @width;
}
.textOverflowEllipsis{
	.textOverflowEllipsisMixin(9em,ellipsis);
}

.margin0px{
	margin: 0 !important;
}
.padding10{
	padding: 10px;
	padding-bottom: 0;
}
.padding20{
	padding: 20px;
}
.pushDown{
	margin-top: 5px;
}
.boxSizingBorderBox{
        -webkit-box-sizing: border-box;
        -moz-box-sizing : border-box;
        box-sizing : border-box;
        word-wrap : break-word;
}
.boxSizingContentBox{
	-webkit-box-sizing: content-box;
    -moz-box-sizing : content-box;
    box-sizing : content-box;
}
.cursorPointer {
    cursor: pointer;
	text-decoration: none !important;
}
.zeroOpacity {
    opacity : 0;
    /*for IE*/
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
}

.dullOpacity{
    opacity: 0.8;
    /*for IE*/
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
    filter: alpha(opacity=80);
}

.fullOpacity{
    opacity : 1;
    /*for IE*/
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
}
.redColor{
	color: red;
}
.highlightBackgroundColor{
	background: @mainContainer;
}
.contentsBackground{
	background: @contentsBackground;
	border: 1px solid @lightColorBorder;
}
.textAlignCenter{
	text-align: center;
}
.textAlignRight{
	text-align: right;
}
.alignMiddle{
	vertical-align: middle;
}
.alignTop{
	vertical-align: top;
}
.padding1per{
	padding: 1%;
}
.paddingTop20{
	padding-top: 20px;
}
.padding20px{
	padding: 20px;
}
.padding-bottom1per{
	padding-bottom: 1%;
}
.marginBottom10px{
	margin-bottom:10px;
}
.displayInlineBlock{
	display: inline-block;
}
.backgroundImageNone{
	background-image : none;
}
.liStyleNone{
	list-style: none outside none;
}
.fontBold {
	font-weight: bold !important;
}

.icon-inverted{
	 //background-image: url("../../../../libraries/bootstrap/img/glyphicons-halflings-white.png") !important;
}
.icon-plus.icon-white{
	background-image: url("../../../../libraries/bootstrap/img/glyphicons-halflings.png") !important;
	opacity :0.8;
}

// Feedback and support hidden temporarily ///
.livesupport_tab,#userfeedback {
	display: none !important;
}

// Reports //
#reportDetails table tr td.summary{
    border-bottom: 0;
    border-top: 0;
}

#portalDetailViewHttpError {
    padding-bottom: 7px;
    margin-top: 50px;
    color: red;
    text-align: center;
}

.wide, 
.table td.wide, 
.listViewEntries td.wide, 
td.listViewEntryValue.wide { 
     padding: 8px!important; 
} 
.medium, 
.table td.medium, 
.listViewEntries td.medium, 
td.listViewEntryValue.medium { 
    padding: 5px 6px!important; 
} 
.narrow, 
.table td.narrow, 
.listViewEntries td.narrow, 
td.listViewEntryValue.narrow { 
    padding: 2px 4px!important; 
} 
.table thead th.narrow { 
    vertical-align: middle; 
} 
td.listViewEntryValue .row-fluid input { 
    padding: 0; 
    margin-bottom: 0; 
} 
.listViewContentDiv { 
    position: relative; 
} 
.deleteCustomMapping .icon-trash { 
    vertical-align: middle !important; 
} 
