html,body {
    margin: 0;
    padding: 0;
    font-family: 'Open Sans', sans-serif;
}

a {
    color: #000;
}

/* Header */
header {
    box-shadow: 0px 4px 10px rgba(0,0,0,0.20);
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background: #f1f1f1;
}

.grid-container {
    background: #f1f1f1;
    display: grid;
    grid-template-columns: 0fr 1fr;
    grid-template-rows: 1fr;
    gap: 0px 0px;
    grid-template-areas: "logo menu";
}

.logo { grid-area: logo; }
.menu { grid-area: menu; }

/* Logo */
header .logo {
    background: #f1f1f1;
    text-align: center;
    padding: 14px 15px 0 15px;
    font-weight: 800;
}

header .logo a {
    color: #539cbf;
    text-decoration: none;
}

/* Navigation */
header .main-nav {
    overflow-x: scroll;
    background: #539cbf;
}

.main-nav ul {
    list-style: none;
    padding: 0 0 0 5px;
    margin: 0;
    white-space: nowrap;
}

.main-nav ul li {
    display: inline;
}

.main-nav ul li a {
    display: inline-block;
    text-decoration: none;
    padding: 14px 10px;
    color: #ffffff;
    font-size: 15px;
}

.main-nav ul li a .fas {
    padding-right: 3px;
}

.main-nav ul li a:hover {
    background: #276584;
}

/* Main Wrapper */
main {
    margin: 70px auto 30px auto;
    padding: 0 15px;
}

h1.page-title {
    font-weight: 800;
    color: #539cbf;
}

/* Inside Menu */
.mini-menu {
    list-style: none;
    margin: 0;
    padding: 0;
}

.mini-menu li {
    display: inline-block;
}

.mini-menu li a {
    background: #539cbf;
    color: #fff;
    text-decoration: none;
    padding: 7px 10px;
    border-radius: 5px;
}

.mini-menu li a:hover {
    cursor: pointer;
    background: #306279;
}

/* Footer */
footer {
    background: #f1f1f1;
    padding: 15px 15px;
    font-size: 12px;
    color: #4c4c4c;
}

/* Fields Layout */
table thead {
    background: #f1f1f1;
}

table thead th {
    padding: 10px 10px;
}

.table-fields tr {
    vertical-align: top;
}

.table-fields tr td {
    padding: 5px 20px 10px 0;
}

.table-fields select, .table-fields input {
    margin-bottom: 5px;
}

.table-fields .faSpace {
    width: 25px;
}

.table-fields .form {
    background: rgb(241, 241, 241);
    margin: 0 0;
    padding: 15px;
    border-radius: 5px;
    box-sizing: border-box;
}

.table-fields a {
    text-decoration: none;
    color: #292929;
    cursor: pointer;
}

.table-fields a:hover {
    background: #EDEDED;
}

.table-fields a.edit-btn {
    font-size: 13px;
}

.table-fields .add_field_form {
    display: none;
}

.table-fields .past-event {
    opacity: 0.5;
}

/* Form */
.table-form tr td {
    padding: 5px 20px 10px 0;
}

form.form input[type=text],
form.form input[type=email],
form.form input[type=password],
form.form textarea.standard, 
form.form select, 
form.form input[type=date],
form.form textarea { 
   background-color:#EDEDED;
   border: 0;
   border:solid 2px #539CBF;
   font-size:13px;
   color:#2B2B2B;
   -moz-border-radius:0px;
   -webkit-border-radius:0px;
   border-radius:0px;
   padding: 9px 10px;
   width: 100%;
   max-width: 185px;
   border-radius: 5px;
   box-sizing: border-box;
}

form.form input[type=submit],
form.form button {
   background-color:#539CBF;
   border: 0;
   border-bottom:solid 0px #A9A9A9;
   font-size:16px;
   color:#FFFFFF;
   font-weight:normal;
   padding: 9px 10px;
   -moz-border-radius:0px;
   -webkit-border-radius:0px;
   border-radius:0px;
   cursor: pointer;
   border-radius: 5px;
}

form.form input[type=submit]:hover, form.form button:hover {
    background-color:#2c7191;
}

/* Search */
.search {
    display: none;
    background: rgb(241, 241, 241);
    width: 100%;
    margin: 5px 10px 5px 0px;
    padding: 15px;
    border-radius: 5px;
    box-sizing: border-box;
}