
/* Stats
--------------------------------------------------------------------------------------- */

.circles-admin h1,
.circles-admin h2,
.circles-admin h3,
.circles-admin h4,
.circles-admin h5,
.circles-admin h6 { font-family: 'proxima-nova', Helvetica, sans-serif !important;}

.page-template-page-stats .small-titles { font-size: 1.3em !important; text-transform: uppercase; letter-spacing: 1px; font-weight: 600; font-family: "proxima-nova", Helvetica, Arial, sans-serif !important;}
.page-template-page-stats .header h1 { display: none;}
.page-template-page-stats .header a.button,
.circles-admin  .header a.button { display: none !important;}

.goal-wrapper .left,
.goal-wrapper .right { width: 46%; }
.goal-wrapper.comparison .left,
.goal-wrapper.comparison .right { width: 49%; }

.goal-wrapper .grid-two .panel { width: 48%; float:left; display:inline; margin-right: 4%; }
.goal-wrapper .grid-two .panel.last { margin-right: 0 !important;}
.goal-wrapper .grid-two .panel.full-panel { width: 100%; margin-right: 0%; }

.page-template-page-stats .grid-three .panel { width: 36.25%; float:left; display:inline; margin-right: 2%; }
.page-template-page-stats .grid-three .panel.last { margin-right: 0 !important;}
.page-template-page-stats .grid-three .panel.alt { clear: left;}
.page-template-page-stats .grid-three .panel.first { width: 23.5%; }
.page-template-page-stats .grid-three .panel.final-total { float: right; clear: both;}

.page-template-page-stats .grid-four .panel { width: 23.5%; float:left; display:inline; margin-right: 2%; }
.page-template-page-stats .grid-four .panel.last { margin-right: 0 !important;}
.page-template-page-stats .grid-four .panel.alt { clear: left;}

.page-template-page-stats .grid-four.budget .panel { width: 26%; }
.page-template-page-stats .grid-four.budget .panel.first { width: 16%;}

.page-template-page-stats .grid-five .panel { width: 18.4%; float:left; display:inline; margin-right: 2%; }
.page-template-page-stats .grid-five .panel.last { margin-right: 0 !important;}
.page-template-page-stats .grid-five .panel.alt { clear: left;}
.page-template-page-stats .grid-five.grid-totals .panel.last { width: 38.8%;}

.page-template-page-stats .grid-six .panel { width: 15%; float:left; display:inline; margin-right: 2%; }
.page-template-page-stats .grid-six .panel.last { margin-right: 0 !important;}
.page-template-page-stats .grid-six .panel.alt { clear: left;}

.stats-wrap { border: 1px solid #aaa; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; background: #f5f5f5;}
.stats-wrap.total-panel { border: 1px solid #000; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; background: #000; color: #fff;}
.stats-wrap.total-panel.total-panel-grey { border: 1px solid #555; background: #555; }
.stat-number { font-size: 2.4vw; font-weight: 500 !important; line-height: 1em; margin-bottom: 10px; font-family: 'mongoose', 'proxima-nova', sans-serif !important; }
.stat-currency { font-variant-numeric: tabular-nums !important; }
.stats-wrap.total-panel.negative-value { background: red !important; border-color: red !important;}
.stats-wrap.total-panel.positive-value { background: green !important; border-color: green !important; }
.stats-wrap.total-panel.negative-value .small-titles,
.stats-wrap.total-panel.positive-value .small-titles { color: #fff !important;}

.zero-transactions { color: #ccc !important;}

.monthly-transactions { max-width: 800px; margin: 0 auto;}
.monthly-transactions li { font-size: 1.6em; padding: 6px 10px; border-bottom: 1px solid #ccc;}
.monthly-transactions li.alt { background: #f5f5f5;}
.month-date { float:left; display:inline; font-weight: 700; width: 40%; text-align: left;}
.month-percent { float:left; display:inline; font-weight: 400 !important; font-variant-numeric: tabular-nums !important; width: 30%; text-align: right;}
.month-total { float:left; display:inline; font-weight: 700; font-variant-numeric: tabular-nums !important; width: 30%; text-align: right;}
.month-head { background: #000; color: #fff; font-weight: 700 !important;}
.month-head .month-percent { font-weight: 700 !important; }

.column-1,
.column-2,
.column-3,
.column-4 { float:left; width: 22%; display: block !important;}
.column-1 { width: 34%; text-align: left;}
.column-2 { text-align: center; }
.column-4,
.column-3 { text-align: right; font-variant-numeric: tabular-nums !important; }
li.alt-total { border-bottom: 0 !important;}

.loading-spinner { display: none; width: 100px; height: 100px; position: fixed !important; } 

select.minimal { color: #000 !important; font-family: 'proxima-nova', sans-serif; font-size: 20px; background-color: white;border: thin solid #ccc; margin: 0 auto; border-radius: 4px;display: block; margin: 0 auto; line-height: 1.5em;padding: 0.5em 3.5em 0.5em 1em;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;-webkit-appearance: none;-moz-appearance: none;}
select.minimal { background: #fff url(../images/select-arrow.png) no-repeat; background-size: 16px 8px !important; background-position: calc(100% - 18px) 50%;}
select.minimal:-moz-focusring {color: transparent;text-shadow: 0 0 0 #000;}

.goal-wrapper .panel { width: 30%; margin-right: 5%; float:left; display:inline;}
.goal-wrapper .panel.last { margin-right: 0 !important;}
.goal-wrapper .panel .grid-two .panel { width: 100% !important; margin-right: 0;}

@media only screen
and (max-width : 480px) {
	
	.page-template-page-stats .grid-four .panel,
	.page-template-page-stats .grid-four.budget .panel, 
	.page-template-page-stats .grid-four.budget .panel.first,
	.page-template-page-stats .grid-five .panel,
	.page-template-page-stats .grid-five.grid-totals .panel.last,
	.page-template-page-stats .grid-six .panel,
	.page-template-page-stats .grid-two .panel,
	.page-template-page-stats .grid-three .panel,
	.page-template-page-stats .grid-three .panel.first { width: 100% !important; margin-right: 0 !important; }
	.page-template-page-stats .panel.pad-40.marg-t-60,
	.page-template-page-stats .panel.pad-40.marg-t-30 { padding: 30px !important; margin-top: 10px !important;}
	.stat-number {font-size: 12vw;margin-bottom: 4px !important;}
	.page-template-page-stats .titles.tcenter.proxima.bold { margin-bottom: 10px !important;}
	.page-template-page-stats .mobile-two .panel { width: 48% !important; margin-right: 4% !important; }
	.page-template-page-stats .mobile-two .panel.second { margin-right: 0 !important; }
	.page-template-page-stats .grid-five .panel.last.alt-second { margin-right: 4% !important; }
	
	.page-template-page-stats .section { padding: 26px 0 !important;}
	.page-template-page-stats .section { width: 90% !important;}
	.page-template-page-stats .panel.pad-40 { padding-left: 10px !important; padding-right: 10px !important;}

	select.minimal { width: 100% !important; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;}
	.monthly-transactions li { font-size: 1.4em; padding: 4px 10px; border-bottom: 1px solid #ccc;}

	.goal-wrapper .left,
	.goal-wrapper .right,
	.goal-wrapper.comparison .left,
	.goal-wrapper.comparison .right { width: 100%; }
	.goal-wrapper .right { margin-top: 40px;}

	.column-1,
	.column-2,
	.column-3,
	.column-4 {width: 25%;}
	.column-1 { width: 25%; text-align: left; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
	
	.page-template-page-stats .content { padding-bottom: 80px !important;}
	.page-template-page-stats .btn-mobile-register.mobile { display: none !important;}
	.page-template-page-stats .titles.medium.proxima.marg-b-40.marg-t-60 { margin-bottom: 10px !important;}
	
	.goal-wrapper.comparison .right { margin-top: 0 !important; }
	
	.page-template-page-stats p.proxima.ta-center.marg-t-20 { margin-top: 8px !important;}

	.goal-wrapper .panel { width: 100%; margin-right: 0; margin-bottom: 0;}
	.goal-wrapper .panel.last { margin-bottom: 0;}
	.goal-wrapper .grid-two.marg-t-20 { margin-top: 10px !important;}

}