body {background-color: white;margin:0px; }
#header {width:100%;height:150px; background-image: url(http://www.davidrossdesign.hk/img/background.png);background-repeat:repeat-x;margin:0px;}
#headerred {width:100%;height:150px; background-image: url(http://www.davidrossdesign.hk/img/background-red.png);background-repeat:repeat-x;margin:0px;}
#wrapper {width:960px;margin-left: auto; margin-right: auto; margin-top: 0px;}

#contentleft { height:100%; width:390px; float:left; margin: 50px 0px 20px 34px;clear: left; }
#contentright { width: 350px; float: right; margin: 50px 80px 20px 0px; clear: right;}

#contentleft p { font-family: Verdana,sans-serif; font-size: 11px; line-height: 21px; color: #555; }
#contentright p { font-family: Verdana,sans-serif; font-size: 11px; line-height: 21px; color: #555; }


#id {  width: 600px; height: 150px; background-image: url(http://www.davidrossdesign.hk/img/id.png); margin-top:-180px;z-index:3;}
#idred {  width: 600px; height: 150px; background-image: url(http://www.davidrossdesign.hk/img/id-red.png); margin-top:-180px;z-index:3;}
#footer {width:100%;height:150px;margin-top:0px;margin-bottom:0px;background-image: url(http://www.davidrossdesign.hk/img/bottom2.png);background-repeat: repeat-x; margin-left:0px;margin-right:0px; }
#navigation { height: 30px;z-index:5;}


.service_example {

   display: block;
   float:right;
   margin-right: -425px;
}

#service_id { }	
	#service_id ul, #service_id li{
		margin:0;
		padding:0;
		list-style:none;
		}
	#service_id li{ 
		/* 
			define width and height of list item (slide)
			entire slider area will adjust according to the parameters provided here
		*/ 
		width:384px;
		height:125px;
		overflow:hidden; 
		}

#static {
	height: 425px;
}
#static p {
	   font: 11px/18px Lucida Grande, Helvetica, sans-serif;
		color: #787f84;
}

#staticleft {
	width:385px;
	float:left;
	margin-left: 40px;
	margin-top: 50px;
}

#staticright {
	width:560px;
	float:right;
}



#s3slider { 
   width: 960px; /* important to be same as image width */ 
   height: 425px; /* important to be same as image height */
   position: relative; /* important */
   overflow: hidden; /* important */
}

#s3sliderContent {
   width: 960px; /* important to be same as image width or wider */
   position: absolute; /* important */
   top: 0; /* important */
   margin-left: 0; /* important */
}

.s3sliderImage {
   float: left; /* important */
   position: relative; /* important */
   display: none; /* important */
}

.s3sliderImage span {
   position: absolute; /* important */
   left: 180;
   font: 11px/18px Lucida Grande, Helvetica, sans-serif;
   padding: 80px 13px 0px 30px;
   width: 180px;
   background-color: #ffffff;
   filter: alpha(opacity=100); /* here you can set the opacity of box with text */
   -moz-opacity: 0.99; /* here you can set the opacity of box with text */
   -khtml-opacity: 0.99; /* here you can set the opacity of box with text */
   opacity: 0.99; /* here you can set the opacity of box with text */
   color: #787f84;
   display: none; /* important */
   top: 0;

   /*
       if you put
       top: 0; -> the box with text will be shown at the top of the image 
       if you put
       bottom: 0; -> the box with text will be shown at the bottom of the image
   */
}

.bottomnav {

display: block;
text-align: center;
font-family: verdana,sans-serif;
font-size: 12px;
padding-top: 60px;
}

.clear {
   clear: both;
}
.serviceitem {
	font-variant: small-caps;
	color: red;
	margin-top:18px;
	margin-bottom: 8px;
	letter-spacing: 1px;
	display: block;
	border-bottom: #ccc 1px solid;
	
}
.top {
	top: 0;
	left: 0;
}
.bottom {
	bottom: 0;
    left: 0;
}
.left {
	top: 20;
    left: 80;
	width: 210px !important;
	height: 280px;
}
.right {
	right: 0;
	bottom: 0;
	width: 90px !important;
	height: 290px;
}

a {
color: red;
text-decoration: none;
border-bottom: dotted 1px #333;
margin-bottom: 1px;
}
a:hover {
color: black;
text-decoration:none;
border-bottom: solid 1px #000;
margin-bottom: 1px;
}

     .desc { color:#000;}
        .desc a {color:#fff;}
        .dropdown {font-family:verdana,sans-serif;font-size:11px; color:#ffffff;}
        .dropdown dd, .dropdown dt, .dropdown ul { margin:0px; padding:0px; }
        .dropdown dd { position:relative; }
        .dropdown a, .dropdown a:visited { color:#787f7e; text-decoration:none; outline:none;}
        .dropdown a:hover { color:#fff;}
        .dropdown dt a:hover, .dropdown dt a:focus { color:#f00; border: 1px solid #787f7e;}
        .dropdown dt a {background:#fff url(arrow.png) no-repeat scroll right center; display:block; padding-right:20px;
                        border:1px solid #787f7e; width:150px;}
        .dropdown dt a span {cursor:pointer; display:block; padding:5px;}
        .dropdown dd ul { background:#000 none repeat scroll 0 0; border:1px solid #787f7e; color:#787f7e; display:none;
                          left:0px; padding:5px 0px; position:absolute; top:2px; width:auto; min-width:170px; list-style:none;}
        .dropdown span.value { display:none;}
        .dropdown dd ul li a { padding:5px; display:block;}
        .dropdown dd ul li a:hover { background-color:#f00;}
        
        .dropdown img.flag { border:none; vertical-align:middle; margin-left:10px; }
        .flagvisibility { display:none;}