/* CSS-grid benyttes til styring af stopur og nedtællingsur. Erstatter (tildels) stopur.css*/

.navigering-forklaring {
    display: -ms-grid;
    display: grid;
    width: 100%;
    -ms-grid-columns: 1fr 222px;
    -ms-grid-rows: 40px auto;
    -ms-grid-gap: 0;
    grid-template-columns: 1fr auto;
    grid-template-rows: 40px auto;
    grid-gap: 0;
}

.navigering-instruktion {
    -ms-grid-column: 1/2;
    -ms-grid-row: 1/3;
    grid-column: 1/2;
    grid-row: 1/3;
    padding-right: 30px;
}

.stopur-container, .ur-container {
    margin-bottom: 0.3rem;
    background-color: rgb(222, 222, 222);
    align-items: center;
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-around;
    align-content: space-evenly;
    padding: 0.3rem;
}

.ur-container {
    margin-right: 1rem;
}

    .ur-container .tekst {
        text-align: left;
        padding-left: 7px;
        width: 158px;
    }

    .ur-container .tid {
        text-align: right;
        padding-right: 5px;
    }

.stopur-container .ikon {
    padding: 0 0.25rem 0 0.5rem;
}

.stopur-container .display {
    padding: 0 0.5rem;
}

.stopur-container .start,
.stopur-container .stop {
    border-radius: 0.25rem;
    border-width: 0;
    background-color: white;
    cursor: pointer;
    display: inline-block;
    font-weight: normal;
    margin-right: 0.25rem;
    /*padding: 0.3rem 0.5rem 0.5rem 0.0rem;*/
    width: 70px;
}

    .stopur-container .start:hover,
    .stopur-container .stop:hover {
        background-color: #0B58D8;
        color: white;
    }

.grid-row-1 {
    -ms-grid-row: 1;
    grid-row: 1;
}

.grid-row-2 {
    -ms-grid-row: 2;
    grid-row: 2;
}

.infoBoksDiv {
    background-color: rgb(222, 222, 222);
}

.warning-dialog {
    position: absolute;
    left: 10px;
    top: 10px;
    width: 430px;
    z-index: 9;
    background-color: #ffffff;
    border: thin solid #666666;
}

.warning-dialog.warning-dialog-resume {
    visibility: visible;
}

.warning-dialog.warning-dialog-end {
    visibility: hidden;
}
