/* bmi.css                */
/* Copyright 2020 - 2023  */
/* by Helmuth Hahn-Heinze */
* {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    /* Setzen aller Abstaende auf 0 */
    padding: 0;
    margin: 0;
}

body {
    font-family: Verdana, Helvetica, "sans-serif";
    font-size: 12px; /* standard 16px; 
    /* Setzen des Abstandes auf 0 */
    padding: 0;
    margin: 0;
    background: linear-gradient(#222222, #555555);
    background-attachment: fixed;
}

.container {
    width: 520px;                
    border-color: black;
    border-width: 1px;
    border-style: solid;                
    margin-top: 50px;
    padding-top: 40px;
    padding-bottom: 30px;
     background: linear-gradient(#00496f, #00496f);
    overflow: hidden;
    box-shadow: 5px 6px 3px black;
    margin: auto;
    border-radius: 10%;
}

.h1_bmi_style {
    text-align: center; 
    color: darkgray; 
    text-shadow: 3px 3px 5px black;
}

h2 {
    text-align: center;
    text-shadow: 1px 1px 2px white;
}

.inputfieldbg {
    background-color: #b5b5b5; 
    padding: 4px;
}

form {
    padding-top: 40px;
}

table {                
    margin: auto;
     background: linear-gradient(#00496f, #00496f);
}

table, th, td {
    border: 1px solid transparent;            
    border-collapse: collapse;
}

tr, td {
    padding: 10px;
    /* background: linear-gradient(to right, #222, #999); */
    background: linear-gradient(#00496f, #00496f);
}

/* Creates a strange grey horizonzal line? */
/*
.tdR {
    background: linear-gradient(to right, black, gray);
}
*/

.firstCfcolor {
    color: lightgray;
}

input {
    max-height: 2em;
    max-width: 20em;
}

input[type="button"],
input[type="reset"] {
    color: azure;
    text-shadow: -1px 1px 2px black, 
                 2px 2px 3px black;
    background: linear-gradient(#c1c1c1, #383838);
    text-decoration: none;
    padding: 2px 10px;                
    margin: 2px 2px;
    cursor: pointer;
    border-radius: 5px;
    box-shadow: 2px 3px 3px black;
    outline: none;
}

input[type="button"]:active,
input[type="reset"]:active {
    box-shadow: 1px 1px 1px white;
}   

.cpybottom {
    position: absolute; 
    bottom: 5px; 
    width: 100%; 
    text-align: center; 
    color:darkgray;
}
