.bs-flex {

	display:  flex;

}



.bs-flex-col {

	flex-direction: column;

}



.bs-w-100 {

	width:  100%;

}



.bs-flex-1 {

	flex:  1;

}



#bs-container {

	max-width: 720px;

	width: 100%;

}



.text-center {

	text-align: center;

}



.mb-20 {

	margin-bottom: 20px;

}



.mr-20 {

	margin-right: 20px;

}



.mx-20-auto {

	margin: 20px auto;

}



#bs-result {

	max-width: 70%;
	width: 100%;
	margin: 20px auto;
	background-color: white;
	border: 2px solid #0099A1;
	border-radius: 3px;
	display: flex;

	flex-direction: column;

	padding: 50px;

}



#bs-total {

	font-size: 3rem;

	font-weight: 700;

}

#bs-currency, .bs-value-input {
	border:  2px solid #0099A1;
	padding:  10px 20px;
	border-radius:  3px;
	width:  calc(100% - 2px);
	outline: none;
}


.bs-button {
	appearance: none;
	padding: 5px 15px;
	background-color: #F58207;
    color: white;
    border-radius:  3px;
    outline:  none;
}


.bs-button:hover, .bs-button:active, .bs-button:focus {
	border:  2px solid #F58207;
	background-color:  white;
	color:  #F58207;
}

@media screen and (max-width:  767px) {



	#bs-container {

		padding-left:  20px;

		padding-right:  20px;

	}



	#bs-result {

		max-width: 100%;

		padding:  20px;

	}



	.bs-coins-container, .bs-bills-container {

		flex-wrap: wrap;

	}



	.bs-coins-container > .bs-flex-1, .bs-bills-container > .bs-flex-1 {

		flex:  0 0 33.3333%;

	}

}