/* TabContainer 
 * 
 * Styling TabContainer means styling the TabList and Its content container  (dijitTitlePane)
 * 
 * Tab List: (including 4 kinds of tab location)
 * 		.dijitTabContainerTop-tabs     - tablist container at top
 * 		.dijitTabContainerBottom-tabs  - tablist container at bottom
 * 		.dijitTabContainerLeft-tabs    - tablist container at left
 * 		.dijitTabContainerRight-tabs   - tablist container at right
 * 
 * Tab Strip Button:
 * 		.dijitTabStripIcon - tab strip button icon
 * 		.dijitTabStripMenuIcon - down arrow icon position
 * 		.dijitTabStripSlideLeftIcon - left arrow icon position
 * 		.dijitTabStripSlideRightIcon - right arrow icon position
 * 
 * 		.tabStripButtonDisabled - styles for disabled tab strip buttons
 * 
 * Tab Button:
 * 		.dijitTabContainerTop-tabs .dijitTab     - styles for top tab button container
 * 		.dijitTabContainerBottom-tabs .dijitTab  - styles for bottom tab button container
 * 		.dijitTabContainerLeft-tabs .dijitTab    - styles for left tab button container
 * 		.dijitTabContainerRight-tabs .dijitTab   - styles for right tab button container
 * 
 * 		.dijitTabContainerTop-tabs .dijitTabChecked .dijitTab
 * 				- styles for selected status of top tab button
 * 		same to Bottom, Left, Right Tabs
 * 
 * 		.dijitTabHover .dijitTab   - styles when mouse hover on tab buttons
 * 		.dijitTabActive .dijitTab  - styles when mouse down on tab buttons
 * 		.dijitTabChecked .dijitTab  - styles when on buttons of selected tab
 * 
 * 		.dijitTabCloseButton - the close action buttons lie at the right top of each tab button on closable tabs
 * 		.dijitTabCloseButtonHover - styles when mouse hover on close action button
 * 		.dijitTabCloseButtonActive - styles when mouse down on close action button
 * 
 * Tab Button: (checked status)
 * 
 * Tab Content Container:
 * 		.dijitTabContainerTop-dijitContentPane
 * 		.dijitTabContainerBottom-dijitContentPane
 * 		.dijitTabContainerLeft-dijitContentPane
 * 		.dijitTabContainerRight-dijitContentPane - for background and padding
 * 
 * Nested Tabs:
 * 		.dijitTabContainerNested - Container for nested tabs
 * 		.dijitTabContainerTabListNested - tab list container for nested tabs
 */
/************ common styles *************/
.dijitTabContainer {
  border-radius: 2px;
}
.dijitTabPaneWrapper {
  background: #fff;
  border: 1px solid #d0d0d0;
  margin: 0;
  padding: 0;
  border-radius: 0 0 2px 2px;
}
.dijitTabContainerTop-tabs,
.dijitTabContainerBottom-tabs,
.dijitTabContainerLeft-tabs,
.dijitTabContainerRight-tabs {
  border: 0;
}
.dijitTabSpacer {
  display: none;
}
/* tabs */
.dijitTab {
  border: 1px solid #d0d0d0;
  background: #fff;
  text-align: center;
  border-radius: none;
  transition-property: background, padding, margin;
  transition-duration: 0.2s;
  transition-timing-function: ease;
  position: relative;
  z-index: 0;
}
.dijitTab:before {
  content: "";
  display: block;
  position: absolute;
}
/* tabs: hover */
.dijitTabHover {
  background: #f5f5f5;
}
/* tabs: active */
.dijitTabActive {
  background: #eee;
}
/* tabs: checked */
.dijitTabChecked {
  z-index: 1;
}
.dijitTabChecked.dijitTabHover,
.dijitTabChecked.dijitTabActive {
  border: 1px solid #d0d0d0;
  background: #fff;
  color: #2b2e34;
}
/* tabs: disabled */
.dijitTabDisabled {
  opacity: 0.65;
}
/* tabs: strip button */
.tabStripButton {
  background-color: transparent;
  border: none;
}
/* tabs: close button */
.dijitTabCloseButton {
  font-family: FontAwesome;
  font-style: normal;
  font-weight: normal;
  font-size: 14px;
  text-decoration: inherit;
  vertical-align: bottom;
  width: 14px;
  height: 14px;
  line-height: 14px;
  vertical-align: middle;
  margin-left: 4px;
  border-radius: 2px;
  opacity: 0.35;
}
.dijitTabCloseButton:before {
  content: "\f00d";
}
.dijitTabCloseButtonHover {
  opacity: 0.75;
}
.dijitTabCloseButtonActive {
  opacity: 1;
}
/************* end common **************/
/*************** top tabs ***************/
.dijitTabContainerTop-tabs .dijitTab {
  top: 1px;
  margin-right: -1px;
  padding: 4px 16px;
  vertical-align: bottom;
}
.dijitTabContainerTop-tabs .dijitTabHover,
.dijitTabContainerTop-tabs .dijitTabActive,
.dijitTabContainerTop-tabs .dijitTabChecked {
  padding-bottom: 8px;
}
.dijitTabContainerTop-tabs .dijitTabChecked:before {
  height: 2px;
  background: #007ac2;
  top: -1px;
  left: -1px;
  right: -1px;
}
.dijitTabContainerTop-tabs .dijitTabChecked {
  border-bottom: 1px solid #fff;
}
.dijitTabListContainer-top {
  margin-top: 1px;
}
.dijitTabListContainer-top .dijitTab {
  top: 0;
}
/*************** end top tabs **************/
/*************** bottom tabs ***************/
.dijitTabPaneWrapper.dijitTabContainerBottom-container {
  border-radius: 2px 2px 0 0;
}
.dijitTabContainerBottom-tabs .dijitTab {
  top: -1px;
  margin-right: -1px;
  padding: 4px 16px;
  vertical-align: top;
}
.dijitTabContainerBottom-tabs .dijitTabHover,
.dijitTabContainerBottom-tabs .dijitTabActive,
.dijitTabContainerBottom-tabs .dijitTabChecked {
  padding-top: 8px;
}
.dijitTabContainerBottom-tabs .dijitTabChecked:before {
  height: 2px;
  background: #007ac2;
  bottom: -1px;
  left: -1px;
  right: -1px;
}
.dijitTabContainerBottom-tabs .dijitTabChecked {
  border-top: 1px solid #fff;
}
.dijitTabListContainer-bottom {
  margin-top: -1px;
}
.dijitTabListContainer-bottom .dijitTab {
  top: 0;
}
/************ end bottom tabs ************/
/*************** left tabs ***************/
.dijitTabPaneWrapper.dijitTabContainerLeft-container {
  border-radius: 0 2px 2px 0;
}
.dijitTabContainerLeft-tabs .dijitTab {
  margin-bottom: -1px;
  margin-left: 4px;
  padding: 8px 12px;
  vertical-align: middle;
}
.dijitTabContainerLeft-tabs .dijitTabHover,
.dijitTabContainerLeft-tabs .dijitTabActive,
.dijitTabContainerLeft-tabs .dijitTabChecked {
  margin-left: 0;
  padding-right: 16px;
}
.dijitTabContainerLeft-tabs .dijitTabChecked:before {
  width: 2px;
  background: #007ac2;
  bottom: -1px;
  left: -1px;
  top: -1px;
}
.dijitTabContainerLeft-tabs .dijitTabChecked {
  border-right: 1px solid #fff;
}
/************** end left tabs *************/
/*************** right tabs ***************/
.dijitTabPaneWrapper.dijitTabContainerRight-container {
  border-radius: 2px 0 0 2px;
}
.dijitTabContainerRight-tabs .dijitTab {
  margin-bottom: -1px;
  margin-right: 4px;
  padding: 8px 12px;
  text-align: center;
  vertical-align: middle;
}
.dijitTabContainerRight-tabs .dijitTabHover,
.dijitTabContainerRight-tabs .dijitTabActive,
.dijitTabContainerRight-tabs .dijitTabChecked {
  margin-right: 0;
  padding-left: 16px;
}
.dijitTabContainerRight-tabs .dijitTabChecked:before {
  width: 2px;
  background: #007ac2;
  bottom: -1px;
  right: -1px;
  top: -1px;
}
.dijitTabContainerRight-tabs .dijitTabChecked {
  border-left: 1px solid #fff;
}
/************* end right tabs *************/
/************ left/right scroll buttons + menu button ***********/
.tabStripButton {
  background-color: transparent;
  border: 0;
  transition-property: background-color;
}
.dijitTabListContainer-top .tabStripButton,
.dijitTabListContainer-bottom .tabStripButton {
  padding: 4px 8px;
  margin-left: -1px;
  margin-right: -1px;
}
.dijitTabListContainer-top .tabStripButton {
  margin-bottom: 1px;
}
.dijitTabListContainer-bottom .tabStripButton {
  margin-top: 1px;
}
.tabStripButtonHover {
  background: #f5f5f5;
}
.tabStripButtonActive {
  background: #eee;
}
.dijitTabStripIcon {
  font-family: FontAwesome;
  font-style: normal;
  font-weight: normal;
  font-size: 14px;
  text-decoration: inherit;
  vertical-align: bottom;
  color: #007ac2;
  vertical-align: middle;
}
.dijitTabStripIcon:before {
  content: "\f0d9";
}
.dijitTabStripSlideRightIcon:before {
  content: "\f0da";
}
.dijitTabStripMenuIcon:before {
  content: "\f0d7";
}
/* disabled */
.dijitTabListContainer-top .tabStripButtonDisabled,
.dijitTabListContainer-bottom .tabStripButtonDisabled {
  opacity: 0.65;
}
/*********** end left/right scroll buttons + menu button *********/
/*************** nested tabs ***************/
.dijitTabContainerNested .dijitTabListWrapper {
  height: auto;
}
.dijitTabContainerTabListNested .dijitTab {
  color: #007ac2;
  margin: 4px;
  padding: 4px 8px;
  border: 0 none;
  border-radius: 4px;
  transition-property: background-color, border-color;
  transition-duration: 0.3s;
}
.dijitTabContainerTabListNested .dijitTabHover {
  background: $nestedtab-background;
}
.dijitTabContainerTabListNested .dijitTabActive {
  color: #007ac2;
  background-color: $nestedtab-background;
}
.dijitTabContainerTabListNested .dijitTabChecked,
.dijitTabContainerTabListNested .dijitTabChecked.dijitTabHover,
.dijitTabContainerTabListNested .dijitTabChecked.dijitTabActive {
  color: #fff;
  background: #007ac2;
}
.dijitTabContainerTabListNested .dijitTabChecked:before,
.dijitTabContainerTabListNested .dijitTabChecked.dijitTabHover:before,
.dijitTabContainerTabListNested .dijitTabChecked.dijitTabActive:before {
  display: none;
}
/************* nested top tabs *************/
.dijitTabContainerTabListNested.dijitTabContainerTop-tabs .dijitTab {
  margin-right: 4px;
}
/************* nested bottom tabs *************/
.dijitTabContainerTabListNested.dijitTabContainerBottom-tabs .dijitTab {
  margin-right: 4px;
}
/************* nested left tabs *************/
.dijitTabContainerTabListNested.dijitTabContainerLeft-tabs .dijitTab {
  margin-bottom: 4px;
}
/************* nested right tabs *************/
.dijitTabContainerTabListNested.dijitTabContainerRight-tabs .dijitTab {
  margin-bottom: 4px;
}
.dijitTabPaneWrapperNested {
  border: none;
/* prevent double border */
  box-shadow: none;
}