@import "style.css";
@import "msg.css";

/* Allgeimein */
*{
   box-sizing: border-box;
   color: #fff;
   text-decoration: none;
}
body{
   margin: 0;
   padding: 0;
   min-height: 100vh;
   height: auto;
   background: #333;
}
#wrapper{
   width: 100%;
}
#bills-box{
   border: 0.1rem solid #09e;
   border-radius: 0.3rem;
   margin-bottom: 0.7rem;
}
#bills-box section{
   padding: 0.4rem;
}

/* Buttons */
.btn{
   border: 0.1rem solid transparent;
   border-radius: 0.2rem;
   padding: 0.8rem;
   background: transparent;
   cursor: pointer;
   transition: all 0.3s linear;
}
.btn-primary{
   border-color: #09e;
}
.btn-primary:hover{
   background: #09e;
}
.btn-danger{
   border-color: #cd3545;
}
.btn-danger:hover{
   background: #cd3545;
}
.btn-success{
   border-color: #28a745;
}
.btn-success:hover{
   background: #28a745;
}

/* Login */
#login-box{
   position: absolute;
   width: 50%;
   top: 50%;
   left: 50%;
   box-shadow: 0.4rem 0.4rem 0.5rem #e74c3c;
   transform: translate(-50%,-50%);
}
#login-box section{
   padding: 0.9rem;
}
#login-box h2{
   text-align: center;
   font-size: 2rem;
}

/* Forms */
.input-normal{
   border: 0.1rem solid #999;
   border-radius: 0.2rem;
   background: transparent;
   outline: none;
   padding: 0.5rem;
}
.input-number{
   border: 0.1rem solid #999;
   border-radius: 0.2rem;
   background: transparent;
   outline: none;
   padding: 0.5rem;
   text-align: right;
}
.input-long{
   border: 0.1rem solid #999;
   border-radius: 0.2rem;
   background: transparent;
   outline: none;
   padding: 0.5rem;
   width: 100%;
}

.form-select{
   border: 0.1rem solid #999;
   border-radius: 0.2rem;
   background: transparent;
   outline: none;
   padding: 0.7rem;
   cursor: pointer;
}
.form-select > option{
   color: #000;
   cursor: pointer;
}