.budget-period-card { background-color: #fff; border-radius: 5px; border: 1px solid #ccc; margin: 1em; width: 400px; .card-header { height: 3em; background-color: #ccc; position: relative; .lock { width: 2em; height: 2em; top: .5em; right: .5em; position: absolute; display: inline-block; img { width: 100%; height: 100%; } } } .card-body { padding: 1em; .dates { text-align: center; font-weight: 500; margin-bottom: 1em; } .bank-current { margin-left: auto; margin-right: auto; width: 80%; .bank-current-label { /*font-size: 18px; font-weight: 700;*/ } .bank-current-value { float: right; /*font-size: 40px;*/ } } .bank-projected { margin-left: auto; margin-right: auto; width: 80%; margin-bottom: 2em; .bank-projected-label {} .bank-projected-value { float: right; } } } }