body{
		background-color: #f8da6d;
	
}

.main-container{
	margin:5% 5%;
	text-align: center;
	font-family: 'Open Sans', sans-serif;

}


.streak-wrapper{
	width:100%;
	font-size: 0;
	}
	
.day{
	display:inline-block;
	width:1em;
	height:1em;
	background-color: #333;
	margin:0;
	padding:10px;
	}
	
.day.good{
	background-color: lime;
	}
	
.day.bad{
	background-color: red;
	}
	
.happy-bit{
	display:block;
	border-radius: 50%;
	width:10em;
	height:10em;
	background-color: silver;
	color:#fff;
	text-align: center;
	margin:0 auto;
	}
	
.happy-bit p{
	position: relative;
  	top: 50%;
  	transform: translateY(-50%);
	}
	
.thing-image{
	width:70%;
	height:70%;
	margin:0 auto;
	border-radius: 50%;
	display:block;
}
	

input[type="checkbox"] {
	margin:0 .3em 0 0;
}

input[type="file"] {
	display:none;
}


label{
	display:block;
}

input .good{
	background-color: #333;
	}
	
input .good:before{
	content:"+";
	}
	
h1{
	font-weight: 700;
	
}

p{
	font-size: 1.3em;
	
}


.button{
	display: inline-block;
  height: 38px;
  padding: 0 30px;
  color: #555;
  text-align: center;
  font-size: 11px;
  font-weight: 600;
  line-height: 38px;
  letter-spacing: .1rem;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  background-color: transparent;
  border-radius: 4px;
  border: 1px solid #bbb;
  cursor: pointer;
  box-sizing: border-box; }
  
.button:hover,
.button:focus,
 {
  color: #333;
  border-color: #888;
  outline: 0; }