@CHARSET "UTF-8";

/************************************
* General Styles
************************************/
body {
    background-color: #D9D573;
}

/************************************
* Div Styles
************************************/
div.gmemaincontent {
    margin-left: auto;
    margin-right: auto;
    width: 80%;
    min-height: 100%;
}

div.gmemenu {
    height: 40%;
    text-align: center;
    margin-top: 1%;
    padding-top: 2%;
    padding-left: 1em;
    padding-right: 0.5em;
    position: fixed;
    left: 5%;
}

div.gmesidebar {
    position: fixed;
    top: 20%;
    right: 5%;
    width: 10%;
    padding-left: 0.5em;
    padding-right: 0.5em;
    z-index: 1;
    border-color: #4d1979;
    border-style: solid;
    border-width: thin;
}

/************************************
* Header Styles
************************************/
div.gmeheader {
    height: 6em;
    width: 100%;
}

div.gmeheader div.headertext {
    float: left;
}

div.gmeheader div.headerlogo {
    float: right;
}

div.gmeheader div.headerbottom {
    clear: both;
}

div.gmeheader div.headertext img.header {
    margin-top: 0.5em;
    margin-left: 0.5em;
    height: 5em;
    width: 5em;
}

div.gmeheader div.headertext h1.header {
    font-size: 1.5em;
    font-family: cursive;
}

div.gmeheader div.headerlogo img.logo {
    margin-top: 1em;
    margin-right: 1em;
    background-color: white;
    height: 4em;
    width: 6em;
}

/************************************
* Footer Styles
************************************/
div.gmefooter {
    width: 100%;
    margin-top: 2em;
}

div.gmefooter label.footertext {
    text-align: center;
    font-size: small;
    font-weight: normal;
    font-style: italic;
}

div.gmefooter img.footerlogo {
    width: 3em;
    height: 1em;
}

div.gmefooter label.counter {
    font-weight: bold;
    font-style: italic;
    font-family: serif;
    padding-left: 0.5em;
    padding-right: 0.5em;
}

/************************************
* Webcam Styles
************************************/
div.webcam {
    text-align: center;
    border-width: thin;
    border-style: dashed;
    border-color: black;
    width: 45%;
}

div.webcam img.webcam {
    width: 20em;
    height: 18em;
    margin-left: auto;
    margin-right: auto;
}

div.camleft {
    margin-left: 1em;
    float: left;
}

div.camright {
    margin-right: 1em;
    float: right;
}

div.camnewline {
    margin-top: 3em;
}

div.cambottom {
    clear: both;
}

/************************************
* Key Fact Styles
************************************/
div.keyfactswrapper {
    width: 60%;
    padding-bottom: 1em;
    margin-top: 5em;
    margin-bottom: 2em;
    border: 1px solid #99CC00;
}

div.keyfactswrapper div.keyfacts {
    margin-right: 1em;
    margin-left: 1em;
    border: 1px solid white;
}

div.keyfactswrapper h2.keyfacts {
    color: white;
}

div.keyfactswrapper table.keyfacts {
    border: none;
    padding: 0;
    margin: 0;
}

/************************************
* Contact Feedback & Site Details Styles
************************************/
fieldset.contactfeedback {
    width: 60%;
}

form.contactfeedback {
    width: auto;
}

img.sitelayout {
    width: auto;
    height: auto;
}

div.googlemap {
    width: 500px;
    height: 300px;
    margin-left: auto;
    margin-right: auto;
    clear: both;
}

/************************************
* Activities Styles
************************************/
table.activities {
    width: auto;
    text-align: center;
    font-family: serif;
}

table.activities td {
    padding-left: 3em;
    padding-right: 3em;
}

table.activities tr.odd {
    background-color: #fde8d7;
}

table.activities tr.even {
    background-color: #d8f3c9;
}

/************************************
* Activities Pre-Work Styles
************************************/
table.prework tr.odd {
    background-color: #e8d0a9;
}

table.prework tr.even {
    background-color: #c1dad6;
}

table.qcodes {
    width: 30%;
    font-family: serif;
    border-color: black;
    border-style: groove;
    border-width: thin;
}

table.qcodes th {
    font-weight: bold;
    border-bottom-color: black;
    border-bottom-style: groove;
    border-bottom-width: thin;
}

table.qcodes td.code {
    font-weight: normal;
}

table.qcodes td.meaning {
    font-style: italic;
}

/************************************
* Programme Styles
************************************/
table.programme {
    min-width: 90%;
    font-family: serif;
    border-color: black;
    border-style: groove;
    border-width: thin;
}

table.programme thead tr {
    border-left: 0;
    border-right: 0;
}

table.programme th {
    border-left-color: black;
    border-left-style: dotted;
    border-left-width: thin;
    border-right-color: black;
    border-right-style: dotted;
    border-right-width: thin;
}

table.programme tr.day td {
    border-top-color: black;
    border-top-style: solid;
    border-top-width: thin;
    border-bottom-color: black;
    border-bottom-style: dotted;
    border-bottom-width: thin;
}

table.programme tr.day {
    background-color: #d889b8;
    text-align: center;
}

table.programme tr.odd {
    background-color: #fde8d7;
}

table.programme tr.even {
    background-color: #d8f3c9;
}

table.programme td.lecture {
    color: silver;
}

table.programme tfoot tr {
    text-align: left;
}

table.programme tfoot th {
    padding-top: 1em;
    padding-bottom: 1em;
    padding-left: 3em;
    border-left: 0;
    border-right: 0;
    border-top-color: black;
    border-top-style: double;
    border-top-width: thin;
}

/************************************
* Attendance Styles
************************************/
table.attendance {
    text-align: center;
    font-family: serif;
}

table.attendance td {
    padding-left: 3em;
    padding-right: 3em;
}

table.attendance tr.odd {
    background-color: #e8d0a9;
}

table.attendance tr.even {
    background-color: #c1dad6;
}

/************************************
* National JOTA Events Styles
************************************/
table.jota {
    text-align: center;
    font-family: serif;
}

table.jota td {
    padding-left: 3em;
    padding-right: 3em;
}

table.jota tr.odd {
    background-color: #e8d0a9;
}

table.jota tr.even {
    background-color: #c1dad6;
}

/************************************
* Feedback & Statistics Styles
************************************/
table.feedback {
    min-width: 30%;
    font-family: serif;
}

table.feedback tr.odd {
    background-color: #fde8d7;
}

table.feedback tr.even {
    background-color: #d8f3c9;
}

table.feedback tr.groupheader {
    font-weight: bold;
    text-align: center;
}

table.feedback tr.groupheader td {
    border-bottom-color: black;
    border-bottom-width: thin;
    border-bottom-style: double;
    border-top-color: silver;
    border-top-width: thin;
    border-top-style: dotted;
}

table.feedback td.itemlabel {
    font-weight: bold;
}

table.feedback td.itemvalue {
    font-style: italic;
    text-align: left;
}

/************************************
* Personal Websites Styles
************************************/
table.websites {
    min-width: 40%;
    font-family: serif;
}

table.websites tr.odd {
    background-color: #fde8d7;
}

table.websites tr.even {
    background-color: #d8f3c9;
}

/************************************
* Graph Styles
************************************/
table.graphdata {
    font-family: serif;
}

table.graphdata th {
    background-color: #009999;
}

table.graphdata tr.odd {
    background-color: #BFFFFF;
}

table.graphdata tr.even {
    background-color: #80FFFF;
}

div.graphholder {
    width: 80%;
    margin-right: auto;
    margin-left: auto;
}

div.graphholder div.graph {
    float: left;
}

div.graphholder div.data {
    float: right;
}

div.graphholder div.bottom {
    width: 95%;
    clear: both;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 2em;
    border-top-width: thin;
    border-top-color: silver;
    border-top-style: dotted;
}

img.graph {
    width: auto;
    height: auto;
}

/************************************
* Booking Form Styles
************************************/
div.bookingtitle {
    width: 100%;
}

div.bookingtitle div.text {
    text-align: left;
    float: left;
}

div.bookingtitle div.logo {
    float: right;
}

div.bookingtitle div.bottom {
    clear: both;
}

table.bookingform {
    border-style: outset;
    border-color: black;
    border-width: thin;
    width: 100%;
}

table.bookingform label.header {
    font-weight: bold;
}

table.bookingform td.instructions {
    text-align: center;
}

span.badge {
    font-weight: bold;
}

/************************************
* Gallery Styles
************************************/
div.gallery div.picture {
    text-align: center;
    border-width: thin;
    border-style: dotted;
    border-color: black;
    width: 45%;
}

div.gallery table {
    width: 100%;
}

div.gallery img {
    width: 20em;
    height: 18em;
    margin-left: auto;
    margin-right: auto;
}

div.gallery div.picleft {
    margin-left: 1em;
    float: left;
}

div.gallery div.picright {
    margin-right: 1em;
    float: right;
}

div.gallery div.picnewline {
    margin-top: 3em;
}

div.gallery div.picbottom {
    clear: both;
}