/* === stysml.css ==========
Main stylesheet - mobile first
===========================
modification history:
2016-11-16 General layout: float right instead of left to allow menu to start left then drop to bottom, add a bit of right padding
2016-10-16 creation
=========================== */
* { 
box-sizing: border-box;
}
html {
font-family: "Lucida Sans",arial,helvetica,verdana,sans-serif;
}
.row::after {
content: "";
clear: both;
display: block;
}
body {
margin: 0 0.5em;
padding: 0;
background-color: #fff;
font-size: 100%;
font-weight: normal;
color: #333;
}
p, h1, h2, h3, h4, h5, h6 {
margin: 0;
padding: 0.3em;
line-height: 1.3em;
font-weight: normal;
}
td, p, li {
font-size: 0.75em;
}
h1 {
font-size: 1.4em;
color: #000;
}
h2 {
font-size: 1em;
color: #000;
}
h3 {
font-size: 0.8em;
color: #000;
}
img {
border: none;
padding: 0.3em;
}
/* ====================================
general layout 
======================================= */
[class*="col-"] {
float: right;
padding-right: 10px;
width: 100%;
}
#header {
background-color: #69c;
}
#nav {
}
#content {
padding-top: 5px;
}
#footer {
background-color: #69c;
font-style: italic;
text-align: center;
padding: 5px;
}
.center {
text-align: center;
}
/* ====================================
top menu - for small screens 
======================================= */
ul.topmenu {
list-style-type: none;
margin: 0;
padding: 0 0 0 0.3em;  /* menu indent from left of page */
overflow: hidden;
background-color: #69c;
}
ul.topmenu li {
float: left;
}
ul.topmenu li a {
display: inline-block;
margin: 0 0 0 2px;  /* menu item separation */
padding: 8px 10px;  /* padding within each item tab */
text-decoration: none;
transition: 0.3s;
color: #fff;
border: 1px solid #fff;
border-bottom: none;
-moz-border-radius-topleft: 5px;
border-top-left-radius: 5px;
-moz-border-radius-topright: 5px;
border-top-right-radius: 5px;
}
ul.topmenu li a.current,
ul.topmenu li a:hover,
ul.topmenu li a:focus {background-color: #fff; color: #69c;}
/* ====================================
log in/out menu 
======================================= */
ul.loginout {
float: right;
list-style-type: none;
margin: 0;
padding: 0.3em;
overflow: hidden;
background-color: #69c;
}
ul.loginout li {
float: right;
}
ul.loginout li a {
display: inline-block;
margin: 0 3px 0 0;
padding: 5px 10px;
text-decoration: none;
transition: 0.3s;
color: #fff;
border: 1px solid #fff;
-moz-border-radius-topleft: 5px; border-top-left-radius: 5px;
-moz-border-radius-topright: 5px; border-top-right-radius: 5px;
-moz-border-radius-bottomleft: 5px; border-bottom-left-radius: 5px;
-moz-border-radius-bottomright: 5px; border-bottom-right-radius: 5px;
}
ul.loginout li a:hover,
ul.loginout li a:focus {background-color: #fff; color: #69c;}
/* ====================================
boxmenu 
======================================= */
.boxmenu {
border: 1px solid #69c;
margin: 0.3em 0;
}
.boxmenu h2 {
margin: 0;
padding: 3px 5px;
background-color: #69c;
color: #000;
border-bottom: 1px solid #fff;
}
.boxmenu ul {
list-style-type: none;
padding: 0;
margin: 0;
}
.boxmenu ul li {
}
.boxmenu ul li a {
display: block;
width: 100%;
padding: 3px 5px;
background-color: #fff;
color: #69c;
text-decoration: none;
}
.boxmenu li a:hover,
.boxmenu li a:focus { background-color: #ccf; color: #fff;}
/* ====================================
event diary category color settings
======================================= */
.gen {background-color: #fc6;}
.hol {background-color: #cf3;}
.sal {background-color: #9ff;}
.adm {background-color: #cfc;}
.man {background-color: #f9f;}
.edi {background-color: #ff9;}
.mkt {background-color: #fcc;}  /* 90f  c66  f93  603  */ 
.acc {background-color: #ccc;}
/* colour key needs padding */
.boxmenu ul li span {display: block; width: 50%; padding: 3px 5px; }
/* ====================================
table styles for Notes-generated documents
======================================= */
#content p.libcode { width: 100%;}
#content p.fright { text-align: right; }
#content table.libcode { 
border: 1px solid #ccf; 
margin: 10px 0;
width: 100%;
}
#content table.libcode tr.tablehead,
#content table.libcode th { 
background-color: #69c; 
color: #fff;
padding: 3px 20px 3px 3px;
text-align: left;
}
#content table.libcode tr.tablesubhead { background-color: #ccf; }
#content table.libcode td { 
vertical-align: top;
padding: 3px;
}
/* ====================================
form entry settings
======================================= */
input.txt1, select.txt1{
width:80%;
font-size: 1em;
font-family: arial,helvetica,verdana,sans-serif;
}
textarea.txtbox1{
width:80%; 
font-size: 1em;
height: 9em;
font-family: arial,helvetica,verdana,sans-serif;
}
/* ====================================
screenbutton
======================================= */
input.screenbutton {
margin: 0 3px 0 0;
padding: 5px 10px;
text-decoration: none;
transition: 0.3s;
color: #69c;
background-color: #fff;
border: 1px solid #69c;
cursor: pointer;
-moz-border-radius-topleft: 5px; border-top-left-radius: 5px;
-moz-border-radius-topright: 5px; border-top-right-radius: 5px;
-moz-border-radius-bottomleft: 5px; border-bottom-left-radius: 5px;
-moz-border-radius-bottomright: 5px; border-bottom-right-radius: 5px;
}
input.screenbutton:hover,
input.screenbutton:focus {
background-color: #ccf; /* #69c; */
color: #fff;
}
/* ====================================
return screen settings
======================================= */
#rtnscrn {
margin: 5% auto;
padding: 2%;
width: 60%;
max-width: 600px;
height: auto;
border: 1px solid #69c;
}
/* ====================================
view body layout
======================================= */
.viewbody {
padding: 0.5em 0;
}
.viewbody ul {
list-style-type: none;
padding: 0;
margin: 0;
}
.viewbody ul li {
}
.viewbody ul li a {
display: block;
width: 100%;
padding: 3px 5px;
background-color: #fff;
color: #03f; /* #69c; */
text-decoration: none;
}
.viewbody li a:hover,
.viewbody li a:focus { background-color: #ccf; color: #fff;}
/* ====================================
general text options
======================================= */
.fggrey {color: #999;}
/* ====================================
standard link colours
======================================= */
a:link {text-decoration: none; color: #03f;}
a:visited {text-decoration: none; color: #99f;}
a:active {text-decoration: underline; color: #69f;}
a:hover {text-decoration: underline; color: #69f;}
/* === end stysml.css === */
