/*                                           */
/*      SGR Engineering Ltd CSS Template.    */
/*      Unathorised use prohibited.          */
/*                                           */

*{ /*Ensure no margins or padding anywhere */
  margin: 0px auto;
  padding: 0px;
}
html {
  height: 100%;
  margin: 0 0 1px; /* top, left&right, bottom */
  padding: 0;
}

body{
  background:#eeeeee;
  text-align: center;
  font-family: "Arial";
  font-style: normal;
  font-size: 14px;
  height: 100%;
  margin: 0 0 1px;
  padding: 0;
  color: #606060;
  -webkit-text-size-adjust: none; /* stop iphone etc using larger fonts than you want */
}

img.left{
  float:left;
  margin-left:10px;
  margin-right:10px;
  margin-top:8px;
}
img.photo{
  margin-top:4px;
  margin-bottom:8px;
  display:block; 
  margin-left:auto;
  margin-right:auto;  
  -moz-box-shadow: 3px 3px 4px #999; /* Firefox */
  -webkit-box-shadow: 3px 3px 4px #999; /* Safari/Chrome */
  box-shadow: 3px 3px 4px #999; /* Opera and other CSS3 supporting browsers */
  -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#999999')";/* IE 8 */
  : progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#999999'); /* IE 5.5 - 7 */  
}
img.thumb{
  display:block; 
  margin-left:15px;
  margin-right:0px;  
  -moz-box-shadow: 3px 3px 4px #999; /* Firefox */
  -webkit-box-shadow: 3px 3px 4px #999; /* Safari/Chrome */
  box-shadow: 3px 3px 4px #999; /* Opera and other CSS3 supporting browsers */
  -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#999999')";/* IE 8 */
  : progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#999999'); /* IE 5.5 - 7 */ 
}

p{
}
p.address{
  text-align: left;
  margin-left: 280px;
}
p.right{
  text-align: right;
  margin-right: 10px;
  position:relative;
  top:-28px;
}
p.inset{
  padding: 5px 10px 0px 10px; /* top, right, bottom, left */
  text-align: justify;
}
p.menutab{ 
  font-weight: bold;
}
p.clear{
  clear: both;
}
p.center{
  text-align:center;
}
p.white{ /* not actually white of course */
  font-family: "Comic sans ms";
  font-style: italic;
  font-weight: bold;
  font-size: 30px;
  text-align:left;
  padding: 34px 10px 10px 90px; /* top, right, bottom, left, */
  color: #22a0ff;
  text-shadow: #222222 5px 5px 5px;
}

h2.inset{
  padding: 5px 10px 0px; /* top, left&right, bottom */
}

li.inset{
   margin-top: 8px;
   margin-right: 8px;
   margin-bottom: 4px;
   margin-left: 24px;
  text-align: justify;
}

table.hosting{
  border-collapse: collapse; 
  border-spacing:0px;
  border-width:1px;
  border-style:solid;
  border-color:#000000;
  margin-top:8px;
}
table.noborder{
  border-spacing:14px;
  border-width:0px;
  margin-top:8px;
}
td.blue{
  color: #808080; 
  background-color: #ddddfe;
  text-align: center;
  border-width:1px;
  border-style:solid;
}
td.green{
  color: #808080; 
  background-color: #ddfedd;
  text-align: center;
  border-width:1px;
  border-style:solid;
}
td.red{
  color: #808080; 
  background-color: #fedddd;
  font-weight: bold;
  text-align: center;
  border-width:1px;
  border-style:solid;
}
td.sm{
  color: #808080; 
  background-color: #eeeeff;
  font-size: 14px;
  padding: 1px;
  text-align: justify;
  border-width:1px;
  border-style:solid;
}

a:active {text-decoration: none; color : #0058ff; font-weight: bold;}
a:active img {border-width: 0px;}
a:link {text-decoration: none; color : #0058ff; font-weight: bold;}
a:link img {border-width: 0px;}
a:visited {text-decoration: none; color : #0058ff; font-weight: bold;}
a:visited img {border-width: 0px;}
a:hover {text-decoration: underline; color: #000000; font-weight: bold;}
a:hover img {border-width: 0px;}

#topedge
{
  margin-top: 10px;
  width: 960px;
  height: 6px;
  background-image: url(/images/shadowtop.jpg);
  overflow:hidden;
}
#mainshadow
{
  width: 980px;
  background-image: url(/images/shadow1.jpg);
  border-left: 0px;
  border-right: 0px;
  border-top: 0px;
  border-bottom: 0px;
  border-style: solid;
  border-color: #ffffff;
}
#header
{
  width: 946px;
  height: 100px;
}

#menutabs
{
  width: 946px;
  height: 28px;
  background: #ffffff;
  overflow:hidden;
}
#menutabs li {
  float: left;
  display: block;
  background-image: url(images/tab_active.jpg);
  background-repeat:no-repeat;
  text-align: center;
  color: #ffffff; /* active menu text colour */
  width: 130px; /* width and height of menu tabs */
  height: 28px;
}
#menutabs li a:link, #menutabs li a:visited, #menutabs li a:active {
  list-style-image: none;
  list-style-type: none;
  color: #888888; /* inactive menu text colour */
  width: 130px; /* width and height of menu tabs */
  height: 28px;
  padding: 4px 0px 0px 0px; /* padding in inactive menu tab, top left, right, bottom */
  float: left;
  background-image: url(images/tab_inactive.jpg);
}
#menutabs li a:hover {
  width: 130px; /* width and height of menu tabs */
  height: 28px;
  background-image: none;
  padding: 4px 0px 0px 0px; /* padding in active menu tab, top left, right, bottom */
  color: #ffffff; /* active menu text colour */
}

#menubody
{
  width: 946px;
  height: 18px;
  background-image: url(images/menubody_blue.jpg);
  padding: 2px 0px 0px 0px;
  overflow:hidden;
  color: #ffffff;
  font-style: italic;
}
#mainbody
{
  text-align: left;
  width: 946px;
  padding-bottom: 8px; 
  border-width: 0px;
  border-style: solid;
  border-color: #ffffff;
  background: #ffffff;
}
#mainbody:after
{
  content: "";
  clear: both;
  display: block;
  height: 0;
  visibility: hidden;
}
#footer
{
  width: 946px;
  height: 16px;
  font-family: "Comic Sans MS"; 
  font-size: 12px; color: #ffffff; 
  font-style: italic;
  background-image: url(/images/footer_blue.jpg);
}
#finalshadow
{
  width: 960px;
  height: 6px;
  margin-bottom: 3px;
  background-image: url(/images/shadowbottom.jpg);
  background-repeat: no-repeat;
  border-width: 0px;
  border-style: solid;
  border-color: #000000;
}

#card{
  float:right;
  clear:right;
  margin-right: 5px;
  margin-top: 5px;
  margin-left: 5px;
  width: 400px;
  height: 160px;
  background-image: url(/images/card_back.jpg);
  padding: 0px 0px 0px 0px;
  overflow:hidden;
}

.photos
{
	list-style: none;
}
.photos a
{
	position:relative;
}
.photos a .preview
{
	display: none;
}
.photos a:hover
{
	display:block;
	z-index:1;
}
.photos a:hover .preview
{
	display: block;
	position: absolute;
	top: -33px;
	left: -45px;
	z-index: 1;
}
.photos img
{
	border-width: 0px;
	vertical-align: top;
	width: 120px;
	height: 80px;
}
.photos li
{
	border-width: 0px;
	display: inline;
	float: left;
	margin: 10px;
	position: static;
}
.photos .preview
{
	width: 225px;
	height: 150px;
}