/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *


 */

/* new palette:

--battleship-gray: #878e88;
--cambridge-blue: #96c0b7;
--amaranth-pink: #db93b0;
--smoky-black: #100b00;
--icterine: #fffb46;

*/

.topnav {
    background-color: white;
    overflow: hidden;
}

/* Style the links inside the navigation bar */
.topnav a {
    float: left;
    display: block;
    color: #100B00;
    text-align: center;
    /* text-decoration: none; */
    margin-right: 1em;
}

/* Change the color of links on hover */
.topnav a:hover {
    background-color: #fffb46;
    color: #100B00;
}

.cta {
    background-color: #2D3142;
    color: white;
    padding-left:0.5em;
    padding-right:0.5em;
}

/* Hide the link that should open and close the topnav on small screens */
.topnav .icon {
    display: none;
}

a:hover {
    background-color: #fffb46;
}

button {
    border-radius: 0em;
    padding: 0.5em;
    background: #2D3142;
    color: white;
    font-weight: bold;
    vertical-align: center;
    box-shadow: 0.5em 0.5em 0em #100B00;
    margin-top: 0.5em;
    margin-bottom: 0.5em;

}

button:hover {
    background: #fffb46;
    color: #100B00;
    box-shadow: -0.5em -0.5em 0em #100B00;
}

[type="submit"] {
    border-radius: 0em;
    padding: 0.5em;
    background: #2D3142;
    color: white;
    font-weight: bold;
    box-shadow: 0.5em 0.5em 0em #100B00;
    margin-top: 0.5em;
    margin-bottom: 0.5em;

}

@media only screen and (max-width:800px) {
    button {
        padding: 2%;
    }
    [type="submit"] {
        padding: 2%;
    }
    .customdate {
        display: none;
    }
}

[type="submit"]:hover {
    background: #fffb46;
    color: #100B00;
    box-shadow: -0.5em -0.5em 0em #100B00;
}

.split {
    width: 100%;
    background: #2D3142;
    color:white;
}
.split:hover {
    background: #fffb46;
}

.stop {
    width: 100%;
    background: #FF8C42 ;
    color:#100B00;
}
.stop:hover {
    background: #fffb46;
}

.delete {
    width: 100%;
    background: #EB5160;
    color:white;
}

.delete:hover {
    background: #fffb46;
    color: #100B00;
}

.start  {
    color:white;
    background: #2D3142;
    font-weight: bold;
}

.start:hover  {
    background: #fffb46;
    color: black;
}

.start:disabled {
    background: #878E88;
    color: #999;
}

.tagfilter {
    color: #100B00;
    cursor: pointer;
    text-decoration: underline;
}

.tagfilter:hover {
    background: #fffb46;
    color: #100B00;
}

.reportview table {
    border-collapse: collapse;
}

.reportview td {
    padding: 1em;
}

.reportview tr:nth-child(even) {
    background-color: #878E88;
    color: #fff;
}

.maincontent {
    width:90%;
    margin-left:5%;
    background:white;
    padding:1em;
    border-top: 1em solid #100B00;
    border-left: 1em solid #100B00;
}
@media only screen and (max-width:800px) {
    .maincontent {
        width:100%;
        margin-left:0%;
    }
}

body {
    font-family: "Open Sans", sans-serif;
    font-optical-sizing: auto;
    background: #eee;
}

#adjusttime td {
    padding: 0.25em;
}

.highlight {
    background: #eee;
}

.stopped {
    color: black;
    padding: 0.5em;
    margin-right:0.5em;
    font-weight: bold;
    background: #EB5160 ;
    border: none;
    border-bottom: 0.5em solid black;
    border-right: 0.5em solid black;
    border-top: 0.5em solid black;
}
.progress {
    color: #100B00;
    padding: 0.5em;
    margin-right:0.5em;
    font-weight: bold;
    background: #FF8C42;
    border: none;
    border-left: 0.5em solid black;
    border-top: 0.5em solid black;
    border-bottom: 0.5em solid black;
}

.history tr:nth-child(even) {
    background-color: #eee;
}
.history tr:hover {
    background-color: #fffb46;
}  

.saved tr:nth-child(even) {
    background-color: #eee;
}
.saved tr:hover {
    background-color: #fffb46;
}