/* main ----------------------------------------------------*/
html, body{
    height: 100%;
}

h1 {
    padding: 15px;
    color: white;
}

#label {
    border-bottom: 5px solid rgb(175, 33, 41);
}

.bg-black {
    background-color: rgb(40, 40, 39);
}

.container-fluid {
    min-height: 100vh;
    background-color: rgb(40, 40, 39); 
    margin: auto; 
    display: flex;
    flex-flow: column;
    border-bottom: solid 30px rgb(40, 40, 39);
}

.container {
    width: 100%; max-width: 1600px; 
    background-color: rgb(221, 222, 228); 
    flex: 1 1 auto;
}

.row { margin-bottom: 20px; }

/* "Load XML Scheme" button */
.btn-warning {
    background-color: rgb(64, 88, 119);
    border: none;
    color: white;
    opacity: unset;
    padding-top: 9px;
    padding-bottom: 9px;
}

.imp-file-name {
    color: white;
    margin-left: 20px;
    margin-top: 9px;
    vertical-align: center;
}

.btn-warning:hover, .btn-warning:focus {
    background-color: rgb(80, 99, 120);
    color: white;
}

/* Choose file  -------------------------------------------*/
.form-group-input, .form-inline {
    padding-top: 10px;
    padding-bottom: 20px;
}

#inputFile {
    border: none;
    border-radius: 5px;
    padding-left: 25px;
}

#exportFileName {
    border: none;
    border-radius: 5px;
    padding-top: 9px;
    padding-bottom: 9px;
}

.doc-link {
    vertical-align: center;
    margin-top: 10px;
    text-align: right;
    margin-bottom: -20px
}

#above_main {
    display: flex;
    justify-content: space-between;
    background-color: rgb(40, 40, 39);
    margin-bottom: 0;
}

#exportButton {
    background-color: rgb(177, 55, 41);
    border: 0;
    color: white;
    padding-top: 9px;
    padding-bottom: 9px;}

/* leftpane -------------------------------------------------*/
#leftpane {
    padding-top: 13px;
    padding-left: 25px;
}

h4.well {
    background: rgba(221, 222, 228, 0);
    border-radius: 5px;
    border: 1.5px solid rgb(180, 180, 180);
    box-shadow: 0 0 2px rgb(182, 181, 181); 
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; 
    height: 100%; max-height: 35px;
    margin-top: 15px;
    font-size: 19px;
    padding-top: 3px;
    white-space: nowrap;
    overflow: hidden;
}

/* Global menu */
.global-well {
    margin-top: 0;
    max-width: 720px;
    padding-left: 15px;
    position: relative;
    display: flex;
}
/* "Global Job Scheme" */
.global-div-left {
    flex: 1;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
/* "+ Job" button */
.global-div-right {
    float: right;
    width: 83px;
}

/* Job menu */
.job-div {
    width: 720px;
    max-width: 100%;

}
.job-well {
    margin-left: 30px;
    max-width: 100%;
    position: relative;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    display: flex;
}
/* div holding 'X' button */
.job-div-left {
    float: left;
    width: 30px;
}
/* div with "[Job]: name" */
.job-div-center {
    float: left;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    flex: 1;
}
/* div with "+ Macro" button */
.job-div-right {
    float: right;
    width: 83px;
}

/* Macro menu */
.macro-div {
    width: 720px;
    max-width: 100%;
}
.macro-well {
    max-width: 100%;
    margin-left: 60px;
    position: relative;
    text-overflow: ellipsis;
    display: flex;
}
/* div holding 'X' button */
.macro-div-left {
    float: left;
    width: 30px;
}
/* div with "[Macro]: name" */
.macro-div-center {
    float: left;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    flex: 1;
}
/* div with "+ File" button */
.macro-div-right {
    float: right;
    width: 83px;
}

.file-well {
    max-width: 630px;
    margin-left: 90px;
    text-overflow: ellipsis;
}

.smaller-text{
    font-size: 16px;
}

h4.highlight { background: aquamarine; }

button.btn-primary{
    height: 42px;
    width: 90px;
    padding: 0 10px 5px 2px;
    background-color: rgb(8, 52, 75);
    border-color: rgb(44, 109, 167);
    margin-top: -3px;
}

h4.well button.btn-primary{
    height: 33px;
    width: 82px;
    float: right;
    vertical-align: middle;
    position: absolute;
    right: 0;
}

button.btn-danger{
    margin-bottom: 5px;
    margin-left: 5px;
    padding: 0 5px 0 5px;
    color: rgb(213, 83, 79);
    background-color: rgba(221, 222, 228, 0);
    border: none;
}

/* rightpane--------------------------------------------- */
#rightpane {
    padding-left: 45px;
    padding-top: 6px;
}

#rightpane h3 {
    padding-top: 25px;
    margin-bottom: 0;
    font-size: 21px;
}
.form-group {
    display: inline-block;
    margin: 5px 15px 1px;
    text-align: center;
}
.form-group label {
    font-size: 20px;
}

/* Style for red star indicating mandatory parameter ----- */
.red-star {
    color: red;
    font-size: 25px;
}

/* Pop-up help information --------- */
.tooltip1 {
    position: relative;
    display: inline-block;
}

.tooltip1 .tooltiptext1 {
    visibility: hidden;
    font-size: 14px;
    width: 420px;
    background-color: lightblue;
    color: black;
    text-align: left;
    padding: 10px;
    border-radius: 6px;
    position: absolute;
    bottom: 130%;
    left: 50%;
    margin-left: -400px;
}

.tooltip1:hover .tooltiptext1 {
    visibility: visible;
}

/* "Advanced parameters" text ------------- */
details { font-size: 20px; }

.centered {
    text-align: center;
}

/* Individual input elements -------------- */
.inputBatchSystemGlobal { width: 200px; }

/* ---------------- */

.inputJobName { width: 150px; max-width: 95%; }
.inputBatchSystemJob { width: 150px; max-width: 95%; }

/* ---------------- */

.inputRunMode { width: 150px }
.inputCPUCount { width: 150px }
.inputConfigFilePath { width: 300px; max-width: 95%; }

.inputQueue { width: 150px }
.inputPriority { width: 150px }
.inputLogFilePath { width: 300px; max-width: 95%; }

.inputHosts { width: 660px; max-width: 95%; }

/* ----------------- */

.inputMacroPath { width: 530px; max-width: 95%; }
.inputStartEventInMacro { width: 250px; max-width: 95%; }
.inputCountEvent { width: 250px; max-width: 95%; }
.inputMacroName { width: 125px; }
.inputAddArgs { width: 370px; max-width: 95%; }

/* ----------------- */

.inputFileType { width: 160px }
.inputFilePath, .inputFileList, .inputJobDependency, .inputMacroDependency, .inputSim,
    .inputExp { width: 440px; max-width: 95%; }

.inputOutputFilePath { width: 630px; max-width: 95%; }
.inputStartEvent { width: 300px; max-width: 95%; }
.inputFileCount { width: 300px; max-width: 95%; }

.inputPutCommand, .inputGetCommand { width: 300px; max-width: 95%; }
.inputPutPath, .inputGetPath, .inputCleanPath { width: 300px; max-width: 95%; }
.inputParallelMode, .inputMergeModeParallel { width: 300px; max-width: 95%; }