body {
    background-color: #444442;
    font-family: 'Poppins', sans-serif, 'arial';
    color: white;
}

/*General Styling*/

.container {
    position: relative;
    width: 100%;
    height: 100%;
}

.inputForm{
    min-height: 650px;

}

label{

    font-size: 20px;
}

/*Table Styling*/

.wholetable {
    height:100%;
    min-height: 650px;
    width: 100%;
    min-width: 400px;
}

.colDefRow{
    visibility: collapse;
}

.headerrow{
    height: 200px;
}

.contentcol{
    width: 45%;
}
.contentRow{
    height: 100px;
}

.contentcell{
    text-align: center;
    align-content: center;
}

.leftAlignCell{
    text-align: left;
}

.rightAlignCell{
    text-align: right;

}

.spacercol {
    width: 5%;
    background-color: yellow;
}

.spacerRow{
    height: 15px;
    background-color: green;
}

/*Button Styling*/

.submit-btn {
    float: right;
    padding: 7px 35px;
    border-radius: 4px;
    display: inline-block;
    background-color: #4b8cfb;
    color: white;
    font-size: 18px;
    cursor: pointer;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.06),
    0 2px 10px 0 rgba(0, 0, 0, 0.07);
    -webkit-transition: all 300ms ease;
    transition: all 300ms ease;
}

.submit-btn:hover {
    transform: translateY(1px);
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.10),
    0 1px 1px 0 rgba(0, 0, 0, 0.09);
}

/*Input Styling*/
/*Select container design.*/
.box {
}

.box select {
    background-color: #2d2d2d;
    color: white;
    padding: 12px;
    width: 100%;
    width: -moz-available;          /* WebKit-based browsers will ignore this. */
    width: -webkit-fill-available;  /* Mozilla-based browsers will ignore this. */
    width: fill-available;
    max-width: 100%;
    border: none;
    font-size: 20px;
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.2);
    -webkit-appearance: button;
    appearance: button;
    outline: none;
}

.textInput {
    background-color: #2d2d2d;
    color: white;
    padding: 12px;
    width: 100%;
    width: -moz-available;          /* WebKit-based browsers will ignore this. */
    width: -webkit-fill-available;  /* Mozilla-based browsers will ignore this. */
    width: fill-available;
    max-width: 100%;
    border: none;
    font-size: 20px;
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.2);
    outline: none;
}

/*Disclaimer Styling*/
#DisclaimerText{
    resize: none;
    background-color: #2d2d2d;
    color: white;
    padding: 12px;
    width: 100%;
    width: -moz-available;          /* WebKit-based browsers will ignore this. */
    width: -webkit-fill-available;  /* Mozilla-based browsers will ignore this. */
    width: fill-available;
    max-width: 100%;
    border: none;
    font-size: 24px;
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.2);
    outline: none;
}


/*Result  Table styles*/
.ResultTable {
    color: white;
    width: 100%;
    max-width: 100%;
    align-items: center;
    text-align: center;
    border: solid 1px gray;
    border-collapse: collapse;
}

.ResultTableCellAndRow{
    border: solid 1px gray;
    border-collapse: collapse;
}

#BottomRow{
    border-top: solid 4px lightgray;
}

#OutputDiv {
    min-height: 400px;
    min-width: 400px;
    max-width: 100%;
    width: 100%;
}

#CreatedBy{
    resize: none;
    background-color: #2d2d2d;
    color: white;
    padding: 12px;
    width: 100%;
    max-width: 100%;
    border: none;
    font-size: 10px;
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.2);
    outline: none;
    opacity: 0.4;
}
