/**
 * Filename:	web.css
 * Description:	CSS file used for displays in web browsers
 */

/**
 * Define initial HTML tags
 */

html, body {
    background-color:#009;
    font:normal 10pt verdana, arial, serif;
    margin:5px 0;
    padding:0;
}

body { min-width:750px; }

/**
 * Define containers <div>'s
 */

/* Outer wrap div */
#wrap {
    background-color:#6699FF;
    margin:0 auto;
    width:750px;
}

/* Header div at the top of each page */
#header {
    /*bgcolor was #669*/
    background:#fff url(/img/top_logo_3.jpg) no-repeat center;
    border-bottom:3px solid #000099;
    height:115px;
    margin:0;
    padding:0;
}

/* Menu div, contains list item markup below, e.g. <ul>, <li> */
#menu {
    background-color:#6699FF;
    float:left;
    margin:0;
    padding:0;
    width:150px;
}

/* Main div where all the content for that page is displayed */
#main {
    background-color:#ffffff;
    color:#000099;
    float:right;
    margin:0;
    padding:0;
    width:600px;
}

/* Footer div at the bottom of each page */
#footer {
    background-color:#6699FF;
    font-size:8pt;
    border-top:3px solid #000099;
    clear:both;
    margin:0;
    padding:0;
}

/**
 * Set defaults for certain HTML tags
 */

/* Heading tags */
h1, h2, h3, h4 {
    font-size:14pt;
    color:#000099;
    margin:0;
    padding:6px;
}

/* Paragraphs */
p {
    margin:0;
    padding:8px 5px;
}

/* Links, :hover for when the mouse hovers over it */
a {
    text-decoration:none;
}
a:hover {

}

/* Control the layout of forms and input types */
form {
    margin:0;
    padding:0;
}

input, select, textarea {
    border:1px solid #000;
    font-size:8pt;
    padding:1px 2px;
}

textarea {
    /*display:block;*/
}

img.center {
    display:block;
    margin:0 auto 2px auto;
    border:2px solid #009;

}



/**
 * Specific markup from here, might relate to certain tags on certain pages, for example */

/* Control positioning of header images */
#img-left  { position: relative; left:10px; }
#img-right { position: relative; right:10px; }

/* Paragrpahs within the main div */
#main p {
    text-align:justify;
}

/* Controls size of the GMap output */
#main div#map {
    height:500px;
    width:100%;
}

/* Controls display of marker within GMaps */
div#gmaps {
    text-align:center;
    font-size:10pt; font-weight:bold;
    width:100px;
    height:50px;
}

/* Controls the layout of the menu, which uses a list to display the links */
#menu ul {
    background-color:#999999;
    color:#999999;
    font-size:8pt; font-weight:bold;
    list-style-type:none;
    margin:0;
    padding:0;
}

#menu li {
    border:1px solid #f0f0f0;
    /*border-width:0.5px 1px;*/
    margin:0;
    padding:0;
    text-align:center;
}

#menu a {
    background-color:#6699FF;
    color:#fff;
    display:block;
    padding:.25em .35em;
}

#menu a:hover {
    display:block;
    background-color:#000099;
}

/* Controls the layout of the opening times panel */
table#opening {
    background-color:#6699FF;
    font-size:7pt;
    border:1px solid #000;
    margin:10px auto;
}

/* Controls the layout of tags in the footer */
#footer p {
    color:#f0f0f0;
    text-align:center;
}

#footer a {
    color:#000;
}

#footer a:hover {
    color:#f0f0f0;
}

p#marlowes { font-size:10pt; font-weight:bold }
p#digiphi  { font-size:7pt; text-align:right } 

/* .var & .val are used to give a table-esque look to a form */
.var {
    float:left;
    width:80px;
    padding:2px;
    font-weight:bold;
    background-color:#ccc;
}

.val {
    margin:0 2px 2px 85px;
    padding:0px;
}