
/* Gravity Digital main site style sheet */
/* ------------------------------------- */

* {margin:0; padding:0;}

html
{
  height:100.1%;
}


body
{
  height: 100%;
  margin: 0 auto;
  padding: 0;
  background-image: url('images/bkg-page.jpg');
  background-repeat: repeat;
  background-attachment: scroll;
  background-position: top left;
}


.cleared
{
  float: none;
  clear: both;
  margin: 0;
  padding: 0;
  border: none;
  font-size:1px;
}


.sheet
{
  overflow: hidden;
  min-width:15px;
  min-height:15px;
  margin: 0 auto;
  position: relative;
  z-index: 0;
  width: 892px;
}

.sheet-body
{
  position: relative;
  z-index: 0;
  margin: 3px;
}

/* Sheet borders and corners */
/* ------------------------- */

.sheet-tl
{
  position: absolute;
  overflow: hidden;
  z-index: -1;
  top: 0;
  left: 0;
  width: 7px;
  height: 7px;
  background-image: url('images/cnr-sheet.png');
}

.sheet-tr
{
  position: absolute;
  overflow: hidden;
  z-index: -1;
  top: 0;
  right: 0;
  width: 7px;
  height: 7px;
}

.sheet-tr div
{
  position: absolute;
  z-index: -1;
  top: 0px;
  left: -7px;
  width: 14px;
  height: 14px;
  background-image: url('images/cnr-sheet.png');
}

.sheet-bl
{
  position: absolute;
  overflow: hidden;
  z-index: -1;
  bottom: 0;
  left: 0;
  width: 7px;
  height: 7px;
}

.sheet-bl div
{
  position: absolute;
  z-index: -1;
  top: -7px;
  left: 0;
  width: 14px;
  height: 14px;
  background-image: url('images/cnr-sheet.png');
}

.sheet-br
{
  position: absolute;
  overflow: hidden;
  z-index: -1;
  bottom: 0;
  right: 0;
  width: 7px;
  height: 7px;
}

.sheet-br div
{
  position: absolute;
  z-index: -1;
  top: -7px;
  left: -7px;
  width: 14px;
  height: 14px;
  background-image: url('images/cnr-sheet.png');
}

.sheet-tc
{
  position: absolute;
  overflow:hidden;
  z-index: -1;
  top: 0;
  left: 7px;
  right: 7px;
  height: 7px;
}

.sheet-tc div
{
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 14px;
  background-image: url('images/hbd-sheet.png');
}

.sheet-bc
{
  position: absolute;
  overflow:hidden;
  z-index: -1;
  bottom: 0;
  left: 7px;
  right: 7px;
  height: 7px;
}

.sheet-bc div
{
  position: absolute;
  z-index: -1;
  top: -7px;
  left: 0;
  width: 100%;
  height: 14px;
  background-image: url('images/hbd-sheet.png');
}

.sheet-cl
{
  position: absolute;
  overflow:hidden;
  z-index: -1;
  top: 7px;
  left: 0;
  width: 7px;
  bottom: 7px;
}

.sheet-cl div
{
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 14px;
  height: 100%;
  background-image: url('images/vbd-sheet.png');
}

.sheet-cr
{
  position: absolute;
  overflow:hidden;
  z-index: -1;
  top: 7px;
  right: 0;
  width: 7px;
  bottom: 7px;
}

.sheet-cr div
{
  position: absolute;
  z-index: -1;
  top: 0;
  left: -7px;
  width: 14px;
  height: 100%;
  background-image: url('images/vbd-sheet.png');
}

.sheet-cc
{
  position: absolute;
  overflow:hidden;
  z-index: -2;
  top: 7px;
  left: 7px;
  right: 7px;
  bottom: 7px;
  background-color: #E2E2E2;
}

.sheet
{
  margin-top: 10px !important;
}





/* Header image and nav     */
/* ------------------------- */

div.header
{
  margin: 0 auto;
  position: relative;
  z-index:0;
  width: 886px;
  height: 220px;
}


div.header-image
{
  position: absolute;
  z-index:-2;
  top: 0;
  left: 0;
  width: 886px;
  height: 230px;
  background-repeat: no-repeat;
  background-position: left top;
  background-image: url(images/header.jpg);
}



ul 
{
  margin: 10px 20px;
  padding: 0px;
} 

ul.hdr-nav
{
  list-style-type: none;
  margin:0;
  padding:0;
}



#nav-menu li.btn-about, li.btn-design, li.btn-search, li.btn-consult, li.btn-email
{
	float:left;	

	/* must set it as relative, because .hover class top and left with absolute position will be positioned according to li.	*/
	position:absolute;			
}


/* Links */
#nav-menu li.btn-about a, li.btn-design a, li.btn-search a, li.btn-consult a, li.btn-email a
{
	/* z-index must be higher than .hover class */
	z-index:20;				
		
	/* display as block and set the height according to the height of the menu to make the whole LI clickable	*/
	display:block;	
	height:31px;
	top: -10px;
  position:relative;
  -moz-outline-style: none;
  outline: none;
}


/* Hover state */
#nav-menu li.btn-about .hover, li.btn-design .hover, li.btn-search .hover, li.btn-consult .hover, li.btn-email .hover
{ 
  /* must be postion absolute     */  
  position:absolute;    

  left:0px;   
  top:0px;    
           
  /* display under the Anchor tag */  
  z-index:10;        
           
  -moz-outline-style: none;
  outline: none;

  /* hide it by default   */  
  display:none;     
}	



/* - End of common */


/* Button positions and images */

#nav-menu li.btn-about
{
	/* width and height of the menu item */
	width:87px;							
	height:21px;
	top:14px;   
  left:415px;    		

}

#nav-menu li.btn-about.active, #nav-menu li.btn-about .hover
{
  /* mouseover image	*/
  background:url(images/btn-aboutus.png) no-repeat;         
  
  /*  width, height, left and top to fill the whole LI item   */  
  width:87px;      
  height:21px;  
}	



#nav-menu li.btn-design
{
	/* width and height of the menu item */
	width:108px;							
	height:21px;
	top:14px;   
  left:518px;    		
}


#nav-menu li.btn-design.active, #nav-menu li.btn-design .hover
{

  /* mouseover image	*/
  background:url(images/btn-webdesign.png) no-repeat;         
  
  /*  width, height, left and top to fill the whole LI item   */  
  width:108px;      
  height:21px;         
}	



#nav-menu li.btn-consult
{
	/* width and height of the menu item */
	width:115px;							
	height:21px;
	top:13px;   
  left:725px;    		
}


#nav-menu li.btn-consult.active, #nav-menu li.btn-consult .hover
{

  /* mouseover image	*/
  background:url(images/btn-consultancy.png) no-repeat;         
  
  /*  width, height, left and top to fill the whole LI item   */  
  width:115px;      
  height:21px;         
}	


#nav-menu li.btn-search
{
	/* width and height of the menu item */
	width:64px;							
	height:21px;
	top:14px;   
  left:643px;    		
}


#nav-menu li.btn-search.active, #nav-menu li.btn-search .hover
{

  /* mouseover image	*/
  background:url(images/btn-search.png) no-repeat;         
  
  /*  width, height, left and top to fill the whole LI item   */  
  width:64px;      
  height:21px;         
}	



#nav-menu li.btn-email
{
	/* width and height of the menu item */
	width:238px;							
	height:21px;
	top:146px;   
  left:603px;    		
}


#nav-menu li.btn-email .hover 
{

  /* mouseover image	*/
  background:url(images/btn-email.png) no-repeat;         
  
  /*  width, height, left and top to fill the whole LI item   */  
  width:238px;      
  height:21px;         
}	




/* Content */
/* ------- */


.content
{
  margin: 0px 40px 20px 40px;
  display: inline;
  min-height: 400px;
  width: 806px;
  position: relative;
  border: 0;
  float: left;
  overflow: hidden;
}


.post
{
  overflow: hidden;
  min-width:1px;
  min-height:1px;
  margin: 40px 0 20px 0px ;
  position: relative;
  z-index: 0;
}

p
{
  margin: 10px 0 0 0 ;
}

/* Default font and colour */
body
{

  font-family: "Trebuchet MS", Helvetica, Sans-Serif;
  font-size: 90%;

  font-style: normal;
  font-weight: normal;
  letter-spacing: 0px;
  color: #101010;
}


a img
{
  border: 0;
}


a
{
  text-decoration: underline;
  color: #964608;
}

/* Adds special style to an unvisited link. */
a:link
{
  text-decoration: underline;
  color: #0006FF;
}

/* Adds special style to a visited link. */
a:visited, a.visited
{
  text-decoration: underline;
  color: #0006FF;
}

/* :hover - adds special style to an element when you mouse over it. */
a:hover, a.hover
{
  text-decoration: none;
  color: #0006FF;
}


h1
{
  padding: 23px 0 0 0;
  overflow: hidden;
  background-repeat: no-repeat;
  height: 0px !important;
  height /**/:23px;
}


h1.hdg-about
{
  background-image: url(images/hdg-aboutus.png); 
}


h1.hdg-whoweare
{
  background-image: url(images/hdg-whoweare.png); 
}

h1.hdg-webdesign
{
  background-image: url(images/hdg-webdesign.png); 
}

h1.hdg-search
{
  background-image: url(images/hdg-search.png); 
}

h1.hdg-consultancy
{
  background-image: url(images/hdg-consultancy.png); 
}

h1.hdg-privacy
{
  background-image: url(images/hdg-privacy.png); 
}

h1.hdg-siteterms
{
  background-image: url(images/hdg-siteterms.png); 
}




/* begin footer */
.footer
{
  position:relative;
  z-index:-1;
/*  overflow:hidden;*/
  width: 886px;
  height: 53px;
  background-repeat:no-repeat;
  background-image: url('images/bkg-footer.png');
  margin: 0px auto 0px auto;
}


.footer-text
{
  display:inline-block;
  color:#000000;
  font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Helvetica, Sans-Serif;
  font-size: 11px;
  width: 100%;
  text-align: center;
}

.footer-text a:link
{
  text-decoration: none;
  color: #0006FF;
  font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Helvetica, Sans-Serif;
  text-decoration: underline;
}

.footer-text a:visited
{
  text-decoration: none;
  color: #0006FF;
  font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Helvetica, Sans-Serif;
  text-decoration: underline;
}

.footer-text a:hover
{
  text-decoration: none;
  color: #000000;
  font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Helvetica, Sans-Serif;
  text-decoration: none;
}



.page-footer, .page-footer a, .page-footer a:link, .page-footer a:visited, .page-footer a:hover
{
  font-family:Arial, Helvetica, Sans-Serif;
  font-size:10px;
  letter-spacing:normal;
  word-spacing:normal;
  font-style:normal;
  font-weight:normal;
  text-decoration:underline;
  color:#9E9E9E;
}

.page-footer
{
  margin:1em;
  text-align:center;
  text-decoration:none;
  color:#9E9E9E;
}



