@import 'include/config.less';

/* Items-Tabbed Theme : item template CSS file */


/* LESS EXAMPLE variable name: 'FCI_' + parameter name */
/* e.g. 'FCI_' + 'title_color' =>  'FCI_title_color' */
body #flexicontent .fc_item_title,
body #flexicontent .fc_item_title a {
	color: @FCI_title_color;
	background-color: @FCI_title_bg_color;
	padding-top: @FCI_title_pad_top + px ;
	padding-right: @FCI_title_pad_right + px;
	padding-left: @FCI_title_pad_left + px;
	padding-bottom: @FCI_title_pad_bottom + px;
	border-radius: @FCI_title_border_radius + px;
}

/* background item */
.fcitems {
	background-color: @FCI_item_bg_color;
	padding-top: @FCI_item_pad_top + px ;
	padding-right: @FCI_item_pad_right + px;
	padding-left: @FCI_item_pad_left + px;
	padding-bottom: @FCI_item_pad_bottom + px;
	border-radius: @FCI_item_border_radius + px;
	border: @FCI_item_border_size + px @FCI_item_border_type @FCI_item_border_color;
	color:@FCI_item_text_color;
}

/* Label styling */

body #flexicontent .flexi.label,
body #flexicontent .desc-title.label {
	background-color: @FCI_label_bg_color;
	color: @FCI_label_txt_color;
	border-radius: @FCI_label_radius*1px;
	padding-top: @FCI_label_pad_top + px ;
	padding-right: @FCI_label_pad_right + px;
	padding-left: @FCI_label_pad_left + px;
	padding-bottom: @FCI_label_pad_bottom + px;
  font-weight:bold;
}

/* TAB styling */

body #flexicontent ul.tabbernav > li a {
	/*border: 1px solid lighten(@FCI_tab_bg_color_start,50%) + !important;*/
	background-color: lighten(@FCI_tab_bg_color_start,45%);
	/*background-image: linear-gradient(to bottom, @FCI_tab_bg_color_start , @FCI_tab_bg_color_end );*/
	color: @FCI_tab_title_color;
}

body #flexicontent ul.tabbernav > li.tabberactive a::before {
	border-top: 4px solid @FCI_tab_bg_color_start;
}
body ul.tabbernav > li.tabberactive a, body ul.tabbernav > li.tabberactive a:hover, #flexicontent ul.tabbernav > li.tabberactive a, #flexicontent ul.tabbernav > li.tabberactive a:hover {
    border-bottom: 1px solid white !important;
    border-left: 1px solid #D0D0D0 !important;
    border-top: 1px solid #D0D0D0 !important;
    border-right: 1px solid #D0D0D0 !important;
}
body #flexicontent ul.tabbernav > li:hover a {
	border: 1px solid darken(@FCI_tab_bg_color_start, 20%);
	background: darken(@FCI_tab_bg_color_start, 20%);
	color: #fff;
}
body .tabbertab, #flexicontent .tabbertab {
	background-color: @FCI_tab_content_bg_color;
	border-radius : @FCI_tab_content_border_radius + px;
}
body ul.tabbernav, #flexicontent ul.tabbernav {
	border-bottom: @FCI_tab_content_border_size_top + px solid @FCI_tab_content_border_color_top !important;
}
div#fc_subtitle_tabset, div#fc_bottom_tabset  {
    margin-top: 40px !important;
    margin-bottom: 40px !important;
}


/* infoblock styling */

body .flexi.infoblock{
	padding-top: @FCI_column_pad_top + px ;
	padding-right: @FCI_column_pad_right + px;
	padding-left: @FCI_column_pad_left + px;
	padding-bottom: @FCI_column_pad_bottom + px;
}

// ***
// *** A row of content
// ***

.flexi.lineinfo {
	display: block;
	padding: 0;
	margin: 0 0 1em;
	overflow: hidden;
	clear: both;
}


// ***
// *** Allow responsive width while floating
// ***

.tabbertab .flexi.element,
.subtitle1 .flexi.element,
.subtitle2 .flexi.element,
.subtitle3 .flexi.element {
	clear: none;
	display: block;
	float: left;
	max-width: 96% !important;  /* Allow responsive width while floating */
	padding: 0% !important;  /* Allow responsive width while floating */
	margin: 0.5em 2% 0.5em 2% !important;
}


// ***
// *** POSITIONS: SubtitleN
// ***

.flexi.subtitle1 {}
.flexi.subtitle2 {}
.flexi.subtitle3 {}


// ***
// *** POSITION: Top Block
// ***

.flexi.topblock {
	overflow: hidden;
	width: 100%;
	margin-bottom: 10px;
}
.topblock .flexi.image {
	display: grid;
	/*float: left;
	max-width: 99% !important;
	padding: 0% !important;
	margin-right: 0%;
	margin-left: 0%;
	line-height: 0px;
	border: 0px solid silver;*/
}
.topblock .flexi.image a {
	outline: none;
}
.topblock .flexi.infoblock {
	overflow: hidden;
  	border-radius: @FCI_column_border_radius_top + px;
	border : @FCI_column_border_size_top + px @FCI_column_border_type_top @FCI_column_border_color_top;
  	color: @FCI_column_color_top;
	background-color: @FCI_column_bg_color_top;
}
.flexi.topblock ul { /* remove bottstrap padding */
    padding: 0;
    margin: 0;
}

.flexi.bottomblock.infoblock {
	overflow: hidden;
  	border-radius: @FCI_column_border_radius_bottom + px;
	border : @FCI_column_border_size_bottom + px @FCI_column_border_type_bottom @FCI_column_border_color_bottom;
  	color: @FCI_column_color_bottom;
	background-color: @FCI_column_bg_color_bottom;
}


/* infoblock: Field block styling */
.flexi.infoblock {
	border: 1px solid silver;
	margin: 0 0 10px;
	padding: 10px;
}
.infoblock ul.flexi {
	margin: 0 !important;
	padding: 0 !important;
}
.infoblock ul li.flexi {
	padding: 0;
	background: none;
	min-height: 10px;
	display: inline-block;
	vertical-align: top;
	margin: 0%;
	zoom: 1;
}

/* center value vs label */
div.flexi.value{
	padding-bottom: @FCI_label_pad_bottom + px!important;
	padding-top: @FCI_label_pad_top + px!important ;
	}

/* Field values into 1 column */
.onecols ul li.flexi {
	width: 100%;
}
/*.onecols .flexi.label {
	min-width: 25%;
	margin-right: 4%;
	margin-bottom: 6px;
}
/*.onecols .flexi.value {
	min-width: 74%;
	margin-right: 1%;
}*/


/* Field values into 2 columns */
.twocols ul li.flexi {
	min-width: 48%;
}
.twocols .flexi.label {
	min-width: 34%;
	margin: 2px 3% 6px 0;
	box-sizing: border-box;
}
.twocols .flexi.value {
	min-width: 59%;
	margin: 2px 4% 6px 0;
	box-sizing: border-box;
}


/*
 * clearfix, for clearing a block that contains floated elements
 * without appending an extra HTML TAG with 'clearfix' class
 */

.group {
	overflow: auto !important;
}