Subversion Repositories computer_asset_manager_v2

html, body {
   height: 100%;
   margin: 0;
}

h2 {
    color: darkslategrey;
  }


p {
    color: white;
  }


a:link {
    color: white;
  }

a:visited {
   color: white;
}

a:hover {
   color: grey;
}


/* 
 * never done this before, but using grid containers.
 * https://www.w3schools.com/Css/css_grid.asp
 */
.grid-container {
   display: grid;
   grid-template-columns: 150px auto;
   grid-template-rows: 105px auto;
   background: rgb(84,84,72);
   color: #000000;
   font-family: Arial;
/*   
   margin: 0;
   padding: 0;
*/
   align-content: start;
   width: 100vw;
   height: 100vh;
}


.titleimage {
   grid-row-start: 1;
   grid-row-end: 1;
   grid-column-start: 1;
   grid-column-end: 3;
   background: #003b6f;
   color: white;
  }


.menu {
   grid-column: 1;
   grid-row: 2;
   color: white;
   height: auto;
/*    position: absolute;
    left: 5px;
    padding: 0px;
    width: 150px;
    height: 100%;
    border-right: groove rgb(64,64,64);
*/    
    background: #33bbff;
  }
  
.boxtitle {
    background: olivedrab;
    color: white;
    border: double rgb(204,204,204);
    text-align: center;
  }


.box {
    background: rgb(224,224,230);
    border: ridge rgb(128,128,128);
  }


.content {
   grid-column-start: 2;
   grid-column-end: 2;
   grid-row-start: 2;
   grid-row-end: 2;
   background: #003b6f;
   color: white;
   /*
    text-align: center;
    position: absolute;
    background: #FFFFFF;
    margin-top: 4px;
    margin-left: 160px;
    margin-right: 5px;
    padding: 0px;
   margin-left: auto;
   margin-right: auto;
   */
  }

.content table {
   margin-left: auto;
   margin-right: auto;
}

.content td {
   color: white;
}

.content th {
   color: white;
}

.content p {
   text-align: center;
   color: white;
}

.motd {
   text-align: center;
   width: 100%;
   margin-top: 0px;
   position: static;
   border: 1px solid black;
}

.motd h3 {
        color: white;
        font-size: 24px;
        padding: 0px 0 0px 0;
   valign: top;
}

.motd p {
        text-align: center;
        color: lightgrey;
        font-size: 12px;
        padding: 0px 0 0px 0;
}


.stats {
   display: inline-block;
   text-align: center;
   position: static;
   /*margin-top: 4px; */
   padding: 0px;
   width: 150px;
   height: 150px;
   box-sizing: border-box;
   border: 1px solid black;
}

.stats h3 {
        color: white;
        font-size: 24px;
        padding: 0px 0 0px 0;
   valign: top;
}

.stats p {
        text-align: center;
        color: lightgrey;
        font-size: 12px;
        padding: 0px 0 0px 0;
}

/*
 * the login form
 */

.login {
        width: 400px;
        background-color: #ffffff;
        box-shadow: 0 0 9px 0 rgba(0, 0, 0, 0.3);
        margin: 100px auto;
}

.login h1 {
        text-align: center;
        color: #5b6574;
        font-size: 24px;
        padding: 20px 0 20px 0;
        border-bottom: 1px solid #dee0e4;
}

.login p {
   justify-content: left;
   padding-top: 0px;
}

.login form {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        padding-top: 20px;
}
.login form label {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 50px;
        height: 50px;
        background-color: #3274d6;
        color: #ffffff;
}
.login form input[type="password"], .login form input[type="text"] {
        width: 310px;
        height: 50px;
        border: 1px solid #dee0e4;
        margin-bottom: 20px;
        padding: 0 15px;
}

.login form input[type="submit"] {
        width: 100%;
        padding: 15px;
        margin-top: 20px;
        background-color: #3274d6;
        border: 0;
        cursor: pointer;
        font-weight: bold;
        color: #ffffff;
        transition: background-color 0.2s;
}
.login form input[type="submit"]:hover {
        background-color: #2868c7;
        transition: background-color 0.2s;
}

.login_errors {
   background-color: red;
}

.content form input[type="submit"] {
   color: white;
        background-color: #3274d6;
        transition: background-color 0.2s;
}

.content form input[type="submit"]:hover {
        background-color: #2868c7;
        transition: background-color 0.2s;
}

/*
 * The permissions boxes when editing a user
 */

fieldset.login_permissions_group {
   margin: 0;
   padding: 0;
   margin-bottom: 1.25em;
}

fieldset.login_permissions_group legend {
   margin: 0;
   padding: 0;
   font-weight: bold;
   margin-left: 20px;
   font-size: 100%;
   color: white;
}

ul.login_permissions {
   margin: 0;
   padding: 0;
   margin-left: 20px;
   list-style: none;
}

ul.login_permissions li input {
   margin-right: .25em;
}


ul.login_permissions li label {
   margin-left: 0px;
}


ul.login_permissions li {
   border: 2px transperent solid;
   display: inline-block;
   width: 10em;
}

ul.login_permissions li:hover,
ul.login_permissions li:focus {
   background-color: 1px;
   border: 1px grey solid;
}

.login_errors p {
        text-align: center;
}

.category {
   border-style: solid;
   border-width: thin;
   border-color: black;
}

.category h3 {
   margin-top: 0;
   margin: 0;
}