html {
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
	background-color: rgba(3,30,40,1);
}

*, *:before, *:after {
	-webkit-box-sizing: inherit;
	        box-sizing: inherit;
}


body {
	background-color: rgba(3,30,40,1);
}

.cont {
  padding-top: 24px;
	width: 300px;
	margin: 0 auto;
}

h1 {
	font-family: 'Work Sans';
	font-size: 35px;
	margin: 0 0 10px 0;
	color:#ffc570;
	letter-spacing: 1.25px	
}


.form-group {
	overflow: hidden;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.form-group label, .form-group input{
	height: 30px;
	font-family: 'Work Sans';
	font-size: 15px;
	margin-bottom: 10px;

}

.form-group label {
    height: 30px;
    font-size: 1rem;
    background-color: rgba(223, 231, 232,1);;
    color: #666666;
    padding: 5px 5px 3px 5px;
    color: rgba(3,30,40,1);
    border-radius: 4px 0 0 4px ;
   }

.form-group input {
	padding-left: 10px;
	width: 125px;
  border-radius: 0 4px 4px 0;
}

.form-group #fld {
  border-radius: 4px 0 0 4px;
}

label[for="tipPct"]{
	padding-right: 8px;
}

.add {
	margin: 0px;
}


input[type="submit"] {
	background-color: rgba(27, 186, 112,1);
	color: #0E1F18;
	-webkit-box-shadow: 3px 3px 3px 0 rgba(6, 31, 18,1);
	        box-shadow: 3px 3px 3px 0 rgba(6, 31, 18,1);
	border:none;
}

input[type="submit"]:hover {
	background-color:rgba(50, 214, 138,1);
	-webkit-box-shadow: 5px 5px 3px 0 rgba(6, 31, 18,1);
	        box-shadow: 5px 5px 3px 0 rgba(6, 31, 18,1);
}
input[type="submit"]:active {
	background-color:rgba(67, 146, 109,1);
	-webkit-box-shadow: 3px 3px 3px 0 rgba(6, 31, 18,1);
	        box-shadow: 3px 3px 3px 0 rgba(6, 31, 18,1);
}


p {
	font-family: 'Work Sans';
	color: white;
}

.instruct {
	font-size: 14px;
	color: rgba(196, 241, 255,1);;
}

.breakdown, .items {
	font-size: 14px;
	border-top: 1px solid rgba(196, 241, 255,1);
	padding:0px;
	margin-top: 20px;
}

.breakdown p, .items p{
	margin-top:5px;
	margin-bottom: 8px;
	letter-spacing: 1.125px;
}

.section {
	letter-spacing: 1.5px;
	color: rgba(196, 241, 255,1);;
	text-transform: uppercase;
}

.you p{
	font-size: 30px;
	margin: 20px 0px 10px 0px;
}


#youTxt, #totalTxt, #taxTxt, #tipHTxt{
	color: #ffb95f;
}

.item {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align:   baseline;
	    -ms-flex-align:  baseline;
	        align-items: baseline;
}

.item:hover p, .item:hover .closeBtn {
	font-size: 16px;
	text-shadow: 1px 1px 4px #d72f2f;
}

.closeBtn, .you_closeBtn {
	color:rgba(255, 113, 113,1);
	font-size:13px;
	background-color: rgba(3,30,40,1);
	border: none;
	margin-left: 5px;
}

.you_closeBtn {
	font-size: 15px;
}

.closeBtn:hover, .you_closeBtn:hover {
	color: rgba(251, 170, 170, 1);
	text-shadow: 1px 1px 8px rgb(255,150,150,1);
}

.hidden {
	display: none;
}