﻿body {
 margin: 1em;
 padding: 0;
 background-color: #99ccff;
 font-family: Arial, Verdana, Helvetica;
}

/************************************************/
/* header bar                                   */
/************************************************/

div#header {

}

.bl1 {
 background: url(../imgs/bl1.gif) 0 100% no-repeat #253E82;
 width: 100%;
}

.br1 {
 background: url(../imgs/br1.gif) 100% 100% no-repeat;
} 

.tl1 {
 background: url(../imgs/tl1.gif) 0 0 no-repeat;
}

.tr1 {
 background: url(../imgs/tr1.gif) 100% 0 no-repeat;
 padding: 5px 0 65px 0;
}

div#header h1 {
 margin: 0;
 padding: 0;
 text-align: center;
 font-size: 1.2em;
 font-weight: bold;
 letter-spacing: 2px;
 color: #f00;
}

div#header h2 {
 margin: 5px;
 padding: 0;
 text-align: center;
 font-size: 1.0em;
 color: #fff;
}

div#header p.left {
 float: left;
 width: 27%;
 margin: 0;
 padding: 20px 0 20px 0;
 text-align: center;
 font-size: 0.9em;
 color: White;
}

div#header #middle {
 float: left;
 width: 42%;
 margin: 0;
 padding: 0;
}

div#header p.right {
 float: right;
 width: 27%;
 margin: 0;
 padding: 20px 0 20px 0;
 text-align: center;
 color: White;
 font-size: 0.9em;
}

div#header a {
 color: White;
}

/************************************************/
/* end of header bar                            */
/************************************************/

/************************************************/
/* Main Navigation Bar                          */
/************************************************/

#MainNavBar {
 clear: both;
 width: 50%;
 margin: 10px auto;
 padding: 0;
 color: White;
 text-align: center;
}

.bl2 {
 background: url(../imgs/bl2.gif) 0 100% no-repeat #f30;
 width: 100%;
}

.br2 {
 background: url(../imgs/br2.gif) 100% 100% no-repeat;
} 

.tl2 {
 background: url(../imgs/tl2.gif) 0 0 no-repeat;
}

.tr2 {
 background: url(../imgs/tr2.gif) 100% 0 no-repeat;
 margin: 0;
 padding: 0 0 3px 0;
}

#MainNavBar a {
 margin: 0;
 padding: 0;
 color: White;
 font-size: 0.8em;
 font-weight: bold;
 text-decoration: none;
}

#MainNavBar a:hover {
 text-decoration: underline;
}

/**************************************************/
/* end of Main Navigation Bar                     */
/**************************************************/

div#content {
 width: 98%;
 margin: 0 auto;
}

div#websites {
 width: 90%;
 margin: 20px auto;
 padding: 0;
 border: 0px solid red;
}

div.website {
 float: left;
 width: 45%;
 margin: 10px 0 10px 10px;
 padding: 10px;
 border: 1px solid red;
}

div.website .pic {
 float: left;
 margin: 0;
 padding: 0 5px 0 0;
 border: 0px solid #3366cc;
}

div.website h1 {
 margin: 0;
 padding: 0;
 font-size: 1.2em;
}

div.website p {
 margin: 4px 0 10px 0;
 padding: 0;
 text-align: justify;
}

div.website p.centre {
 text-align: center;
}

div#branches {
 clear: both;
 width: 664px;
 margin: 0 auto;
 padding: 0;
}

div#branches div.address {
 float: left;
 width: 214px;
 margin: 0 2px 0 2px;
 padding: 0;
}

div#branches div.address p {
 margin: 0;
 padding: 0;
 text-align: center;
}

p.centre {
 text-align: center;
}

/**************************************************/
/* feedback form on Contact page                  */
/**************************************************/

.msg {
 margin: 10px auto;
 padding: 4px;
 text-align: center;
 color: Red;
}

fieldset {
 clear: both;
 width: 55%;
 margin: 0 auto;
}

label {
 clear: both;
 float: left;
 width: 8em;
 margin: 6px 2px 1px 0;
 text-align: right;
}

input, textarea {
 width: 12em;
 margin: 4px 0px 1px 0px;
 color: #000;
 font-size: 0.9em;
 background: White;
 border: #26a solid 1px;
}

textarea {
 width: 22em;
}

/**************************************************/
/* end of feedback form                           */
/**************************************************/
