.di_floatbox {padding: 0 15px 20px; width: 100%; margin-top: 0; margin-bottom: 20px; margin-right:auto; margin-left: auto; font-size: 14px;border-bottom: #eee 4px solid;}
.di_floatbox h3 {margin-top: 0; margin-bottom: 10px;}
.di_charitybar {height: 42px; margin-top: 15px; width: 100%; clear: left;}
.di_charitybar .bar_actual {height: 42px; float: left; padding-right: 4px; text-align: right; color: white; font: 14px/42px Roboto, Arial, Sans-serif;}
.di_barskey {margin-left: 35%; margin-bottom: 10px; height: 12px;}
.barname {font: 13px/13px Roboto, Arial, Sans-serif; margin-top: 1px; text-align: right; width: 35%; float: left; padding-right: 10px;}
.singleline {margin-top: 13px;}
.doubleline {margin-top: 7px;}
.barcontainer {width: 65%; float: left;}
/*.barlabel {margin-right: -80px; font: 14px/40px Arial, Sans-serif; width: 80px; padding-left: 5px; float: left; color: #999999;}*/
.barlabel .good_label {color: #59a6bf;/*#ADD6DC;*/}
.barlabel .very_label {color: #00759c;}
.barlabel .bad_label {color: #afafaf;}
.barlabel .awful_label {color: #CFBEBB;}
.very_bar {background-color: #00759c;}
.good_bar {background-color: #59a6bf;/*#bce8f1;*/}
.di_keyitem {font: 13px/12px Roboto, Arial, Sans-serif; float: left; margin-bottom: 10px; padding-left: 15px; padding-right: 20px;}
.di_keyitem .swatch {width: 12px; margin-left: -15px; height: 12px; float: left;}
.content-item__story {width: 70%; margin: 0 auto;}
.content-item__dl {
    border-bottom: 1px solid #eee;
    border-top: 1px solid #eee;
    float: left;
    margin: 10px 20px 10px -10%;
	padding: 10px 15px;
    width: 100%;
    max-width: 400px;
}
.content-item__dl--label {
    font-family: Roboto,Helvetica,Arial,sans-serif;
    font-weight: 600;
    margin-bottom: 10px;
    position: relative;
    text-transform: uppercase;
    top: 4px;
}
.content-item__dl--file {
    font-style: italic;
    position: relative;
    text-align: right;
    top: -2px;
    word-break: break-all;
}
.glyphicon {
    -moz-osx-font-smoothing: grayscale;
    display: inline-block;
    font-family: "Glyphicons Halflings";
    font-style: normal;
    font-weight: 400;
    line-height: 1;
    position: relative;
    top: 1px;
}
.content-item__dl--file .glyphicon {
    font-size: 24px;
    margin-left: 15px;
    top: 6px;
}
/*.di_yearbox .barname {width: 10%;text-align;right;}
.di_yearbox .barcontainer {width: 90%;}
.di_threebox .barname {width: 25%;text-align;right;}
.di_threebox .barcontainer {width: 75%; }
.di_threebox .barlabel {margin-right: -110px; width: 105px;}*/
@media(max-width: 1199px){
	.content-item__story {width: 80%;}
	.di_floatbox {width: 70%; margin-right: -5%;}
	.barname {width: 45%;}
	.di_barskey {margin-left: 45%;}
	.barcontainer {width: 55%;}
}
@media(max-width: 991px){
	.content-item__story {width: 90%;}
	.di_floatbox {float: none; width: 90%; border-left: 0px none; padding: 0 0 20px; margin: 10px auto 20px; }
	.barname {width: 36%;}
	.di_barskey {margin-left: 30%;}
	.barcontainer {width: 64%; padding-right: 40px;}
	.content-item__dl {margin-left: -5%;}
	.content-item__dl--file {clear: none; margin-top: 0;}
}
@media(max-width:768px){
	.content-item__story {width: 100%;}
	.content-item__dl {float: none; max-width: 500px; margin: 0 auto 20px;}
	
}
@media(max-width: 650px){
		.barname {width: 45%;}
		.di_barskey {margin-left: 45%;}
	.barcontainer {width: 55%;}
}/*
@media(max-width: 550px){
			.barname {width: 50%;}
		.di_barskey {margin-left: 50%;}
	.barcontainer {width: 50%; padding-right: 40px;}
	}*/
	@media(max-width: 520px){
.barname {float: none; width: 100%; text-align: left; padding-right: 0; padding-bottom: 1px;}
.barcontainer {width: 100%;padding-right: 80px; float: none; height: 30px;}
.di_charitybar .bar_actual {height: 30px;}
.di_barskey {margin-left: 0;}
.di_charitybar {height: auto;}
.singleline, .doubleline {margin-top: 1px;} 
.barlabel {line-height: 30px;}
	}
/*background-color: #f5f5f5;padding-right: 80px;padding-right: 110px;*/