/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */
 
 
 
/*  SECTIONS  ============================================================================= */

.section {
	clear: both;
	padding: 0px;
	margin: 0px;
}

/*  GROUPING  ============================================================================= */


.group:before,
.group:after {
    content:"";
    display:table;
}
.group:after {
    clear:both;
}
.group {
    zoom:1; /* For IE 6/7 (trigger hasLayout) */
}

/*  GRID COLUMN SETUP   ==================================================================== */

.col {
	display: block;
	float:left;
	margin: 1% 0 1% 1.6%;
}

.col:first-child { margin-left: 0; } /* all browsers except IE6 and lower */


/*  REMOVE MARGINS AS ALL GO FULL WIDTH AT 480 PIXELS */

@media only screen and (max-width: 480px) {
	.col { 
		margin: 1% 0 1% 0%;
	}
}
 
 
/*  GRID OF FOUR   ============================================================================= */

	
.span_4_of_4 {
	width: 100%; 
}

.span_3_of_4 {
	width: 74.6%; 
}

.span_2_of_4 {
	width: 49.2%; 
}

.span_1_of_4 {
	width: 23.8%; 
}


/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */

@media only screen and (max-width: 480px) {
	.span_4_of_4 {
		width: 100%; 
	}
	.span_3_of_4 {
		width: 100%; 
	}
	.span_2_of_4 {
		width: 100%; 
	}
	.span_1_of_4 {
		width: 100%; 
	}
	.charts_ul li div{	
		line-height:25px !important;
	}
}

.chart_img{
	width:100%;
}
.chart_img img{
	width:100%;
}
.col {    
    padding:0 !important;
}
.charts_items{
	width:100%;		
}
.charts_ul{
	padding:0;
	margin:0;
	list-style:none;
}
.charts_ul li{
	width: 100%;
    float: left;
	/*background:#0a0a0a;*/
	/*background:#eee;*/
	color: rgba(29, 27, 28, .8);
	border-bottom: 1px solid rgba(167, 167, 167, 0.1);
	transition: all 400ms ease;
	font-family: 'Open Sans', sans-serif;
	display: table;
}
.charts_ul li div{
	float:left;
	height:50px;
	margin:5px 0 5px 0;
	/*line-height:50px;*/
}


.charts_ul li:hover{
    color: rgba(29, 27, 28, 1);
	cursor: pointer;	
}

.charts_ul li:hover > div{
	color: rgba(29, 27, 28, 1);
	cursor: pointer;		
}

.charts_ul li:first-child > div{
	margin:0px 5px 5px 0;
}
.charts_ul li > div.item-icons{
	float:right;
	    line-height: 50px;
}
.item_display_table{
	width:75%;
	float:left;
	display:table;
}
.item_info{
	
	font-size: 14px; 
	display: table-cell;
    vertical-align: middle;
}

.charts_ul li .item_info img{
	width:50px;
	margin-right:5px;
	height:50px;
	float:left;
}
.charts_ul li .item-img img{
	width:100%;
}
.item_info{
    font-size: 14px;   
	float:left;
}
.item_info a{
    display:block;
}
.item_info span{
    font-size: 11px;
    opacity: .7;
}
.item-icons{
    font-size: 12px;
	color: rgba(29, 27, 28, .5);
	width:20%;	
}
.item-icons i{   
	padding:0 5px;
}
.item-icons a{
	text-decoration:none;
	border-bottom:none !important;
	
}