﻿  body {color: black;}
  header, footer, nav, section, article, main 
          {display:block}
  header  {width:970px; background-color:yellow; text-align:center}
  main    {width:970px; background-color:red; display:table }
  nav     {width:230px; background-color:Orange; text-align:left; float:left; }
  section {width:740px; height:auto;  background-color:SpringGreen; float:left;}
  article {width:720px; display:table; float:left;  margin-left:10px; margin-top:10px;  margin-bottom:10px }
  footer  {width:970px; background-color:Pink; text-align:center; clear:both;} 


a:link.nav {  
text-decoration: none;
color: #fff; 
font-family: 'Trajan Pro', Georgia, 'Times New Roman', Times, serif; 
-moz-text-shadow: 1px 1px 0px #000;
-webkit-text-shadow: 1px 1px 0px #000;
text-shadow: 1px 1px 0px #000;
font-size: 12px;  
 }
a:visited.nav { 
text-decoration: none;
color: #fff; 
font-family: 'Trajan Pro', Georgia, 'Times New Roman', Times, serif; 
-moz-text-shadow: 1px 1px 0px #000;
-webkit-text-shadow: 1px 1px 0px #000;
text-shadow: 1px 1px 0px #000;
font-size: 12px;  
 }
a:hover.nav { 
text-decoration: underline; 
color: #c5e6f7; 
font-family: 'Trajan Pro', Georgia, 'Times New Roman', Times, serif; 
-moz-text-shadow: 1px 1px 0px #000;
-webkit-text-shadow: 1px 1px 0px #000;
text-shadow: 1px 1px 0px #000;
font-size: 12px;   }



a:link.nav2 {  
text-decoration: none;
color: #fff; 
font-family: 'Trajan Pro', Georgia, 'Times New Roman', Times, serif; 
-moz-text-shadow: 1px 1px 0px #000;
-webkit-text-shadow: 1px 1px 0px #000;
text-shadow: 1px 1px 0px #000;
font-size: 12px;  
	text-transform: uppercase;

 }
a:visited.nav2 { 
text-decoration: none;
color: #fff; 
font-family: 'Trajan Pro', Georgia, 'Times New Roman', Times, serif; 
-moz-text-shadow: 1px 1px 0px #000;
-webkit-text-shadow: 1px 1px 0px #000;
text-shadow: 1px 1px 0px #000;
font-size: 12px;  
	text-transform: uppercase;

 }
a:hover.nav2 { 
text-decoration: underline; 
color: #c5e6f7; 
font-family: 'Trajan Pro', Georgia, 'Times New Roman', Times, serif; 
-moz-text-shadow: 1px 1px 0px #000;
-webkit-text-shadow: 1px 1px 0px #000;
text-shadow: 1px 1px 0px #000;
font-size: 12px;
  	text-transform: uppercase;
 }




a:link { text-decoration: none; color: #000; font-family: Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold }
a:visited { text-decoration: none; color: #000; font-family: Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold }
a:hover { text-decoration: underline; color: #000; font-family: Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold }


#top-ad{ margin-left:auto; margin-right:auto;    text-decoration: none;
color: #000; 
font-family:  Georgia, 'Times New Roman', Times, serif; 
-moz-text-shadow: 1px 1px 0px #fff;
-webkit-text-shadow: 1px 1px 0px #fff;
text-shadow: 1px 1px 0px #fff;
font-size: 13px; font-weight:bold;
 }

#top-header{ margin-left:auto; margin-right:auto; padding-top:10px; width: 1000px; height:128px; background-image:url(/style/images/logo-png.webp); background-repeat: no-repeat;}

#top-bg{ margin:0px; padding:0px; height:129px; width: 100%;}
#buttons{ 
	background-image:url(/style/images/hr-nav.webp);
	background-repeat: repeat;
	height:39px;
	padding-top:7px;
	width: 1000px;
	margin: 0px auto 0px auto;
}
#hr_nav {
	background-image:url(/style/images/hr-nav.webp);
	background-repeat: repeat;
	line-height:46px;
	padding:0px;
	width: 1000px;
	margin: 0px auto 0px auto;
	}

#appointment{ float:right; width:507px; height:101px; }

#address{  width:320px;  	text-transform: uppercase;
 color: #000; font-family: 'Trajan Pro', Georgia, 'Times New Roman', Times, serif; -moz-text-shadow: 1px 1px 0px #fff; -webkit-text-shadow: 1px 1px 0px #fff; text-shadow: 1px 1px 0px #fff; font-size: 22px;}

.white{color:#FFFFFF}

#social {  margin-bottom:2px; padding:5px 5px 5px 5px; margin:0px 0px 0px 0px;   width:230px; border-radius:5px;background-color: #037bba; color:#FFFFFF; text-align:center;
   background-repeat: repeat-x;

  /* Safari 4-5, Chrome 1-9 */
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#0099e9), to(#037bba));

  /* Safari 5.1, Chrome 10+ */
  background: -webkit-linear-gradient(top, #0099e9, #037bba);

  /* Firefox 3.6+ */
  background: -moz-linear-gradient(top, #0099e9, #037bba);

  /* IE 10 */
  background: -ms-linear-gradient(top, #0099e9, #037bba);

  /* Opera 11.10+ */
  background: -o-linear-gradient(top, #0099e9, #037bba);}
  
  #social td { text-align:left; color:#FFFFFF;}


#middle-header{ margin:0px; padding:0px;  background-image:url(/style/images/middle-bg.webp); background-repeat: repeat-x;}

#likeus { width:160px; height:35px; padding-top:20px; padding-left:80px; margin-top:2px; margin-bottom:2px; background-image:url(/style/images/right-button9.webp);}

#faces{ margin-left:auto; margin-right:auto; height:309px; width:1000px;}

#video{ width:231px; height:267px;}

#content-wrapper{ margin-left:auto; margin-right:auto; width:1000px; padding-top:15px;  background-image:url(/style/images/c-gradient.webp); background-color:#E9F4FA; background-repeat: repeat-x;}

#content-wrapper-inner{ margin-left:auto; margin-right:auto; width:1000px; padding-top:15px;  background-image:url(/style/images/c-gradient-inner.webp); background-color:#E9F4FA; background-repeat: repeat-x;}

#content{ width:1000px;  }

#content-text{ width: 710px; padding-top:10px;  margin-left:18px;}

#content-bg{ background-image:url(/style/images/bg_content-png.webp); background-repeat:repeat-y;}

#right-side{ float:right; width:240px; margin-right:17px;}

#patient-box{ background-image:url(/style/images/offer-bg.webp); width:220px; padding-left:10px; padding-right:10px; padding-top:20px; padding-bottom:20px; background-repeat: repeat-x;}

#left-navigation{ background-image:url(/style/images/left_navi_bg-png.webp); width:232px; }

#footer { margin-left:auto; margin-right:auto; width:1000px; background-image:url(/style/images/footer.webp); background-repeat:repeat-x; padding-bottom:20px; padding-top:20px;  }

.spacer{
	clear:both; 
	font-size:0; 
	line-height:0;
}

.Title {
	margin-top: 0px;
	color: #fff;
	font-size: 24px;
	line-height: 22px;
	font-family: 'Trajan Pro', Georgia, 'Times New Roman', Times, serif;
	text-transform: uppercase;
	-moz-text-shadow: 1px 1px 0px #000; -webkit-text-shadow: 1px 1px 0px #000; text-shadow: 1px 1px 0px #000;

}


#floating-box-wrapper{
 width:800px;
 margin:0 auto 0 auto;
 height: auto;
 position: fixed;
}
  
#floating-box-container{
 float:right;
 top:0px;
 left:50px;
 position:fixed;
 width:60px;
}
  
#floating-box-container .fixed{
 position:fixed;
 top:0;
}

#floating-box-vertical{
 border:2px solid #ddd;
 background-color:white;
 padding:.8em 0 .8em .8em;
 margin-top:10px;
 z-index:10000;
 -webkit-border-top-left-radius:6px;
 -webkit-border-bottom-left-radius:6px;
 -moz-border-radius-topleft:6px;
 -moz-border-radius-bottomleft:6px;
 border-top-left-radius:6px;
 border-bottom-left-radius:6px;
 -webkit-border-top-right-radius:6px;
 -webkit-border-bottom-right-radius:6px;
 -moz-border-radius-topright:6px;
 -moz-border-radius-bottomright:6px;
 border-top-right-radius:6px;
 border-bottom-right-radius:6px;

 width:60px;
 }
  
#floating-box-horizontal{
 border:2px solid #ddd;
 border-top:0;
 border-right:2px solid #ddd;
 background-color:white;
 padding:.8em 0 .8em .8em;
 margin-top:0px;
 z-index:10000;
 -webkit-border-bottom-right-radius:6px;
 -webkit-border-bottom-left-radius:6px;
 -moz-border-radius-topright:0px;
 -moz-border-radius-bottomright:6px;
 border-top-left-radius:0px;
 border-bottom-left-radius:6px;
 -moz-column-count: 4;
 -moz-column-gap: 3px;
 -webkit-column-count: 4;
 -webkit-column-gap: 3px;
 column-count: 4;
 column-gap: 3px;
 width:300px;
 height:70px;
 }
#floating-box .vr{
margin-left:-2px;
display: inline;
background-color:1px solid #cccccc;
width: 1px;
height: 100px;
}  
#floating-box .hr{
 margin-left: -2px;
 height:1px;
 border-bottom:1px solid #cccccc;
 margin:.6em 0;
 width:55px;
} 
#floating-box .fb_like {
 margin-top:.5em;
 margin-bottom:.5em;
 margin-left: 2px;
 width: 60px;
 height: 60px;
}
#floating-box .fb_like {
 margin-top:.5em;
 margin-bottom:.5em;
 margin-left: 2px; 
 width: 60px;
 height: 60px;
}
#floating-box .twit {
 margin-top:.5em;
 margin-bottom:.5em;
 margin-left: 2px;
 width: 60px;
 height: 60px;
}
#floating-box .pluss {
 margin-top:.5em;
 margin-bottom:.5em;
 width: 60px;
 height:60px;
 margin-left:-2px;
}
You will need to play around with some of the margins to make the floating bar appear correctly on your site. We use

.PageTitle {
	font-family: Arial, Helvetica, sans-serif; 
	font-size:15px; 
	color:#ffffff; 
	text-decoration:none; 
	font-weight: bold;}

.MainTable {
	background-color: #FFFFFF;
	}

body {
	background-image: url("/style/images/bg.webp");
	background-attachment:fixed;
	background-position: center top;
	background-color: #C7ECFF;
	margin: 0px;
	padding: 0px;
}

body, td, p, ul, ol, li,  div, span, blockquote {
  font-size : 14.0px ;
  color:#4C718B;
  font-family: Arial, Helvetica, sans-serif;
}

div #javascriptmsg
{
background-image: url('//style/images/scrolling_text.webp'); background-repeat: no-repeat; background-position: left top;
}

/* services menu */

.serv:before	{
				content: "\2022""\0020";
				display: inline;
}
.serv a:link	{
				color: #000080;
				font-weight: bold;
				font-size: 10pt;
				text-decoration: none;
}
.serv a:hover	{
				color: #000000;
				font-weight: bold;
				font-size: 10pt;
				text-decoration: underline;
}
.serv a:visited	{
				color: #000080;
				font-weight: bold;
				font-size: 10pt;
				text-decoration: underline;
}
/* box with rounded corners for services menu */
.serv-container { 
				background-color: #e6e6e6;
				border: 2px #000080 solid;
				-moz-border-radius: 10px;
				-webkit-border-radius: 10px;
				border-radius: 10px;
				padding: 5px;
}
.serv-txt		{
				font-size: 10pt;
				font-weight: normal;
				margin: 6px 10px 6px; 
}

/* end services menu */

/* Horizontal rule styles - for page copy and menu separation; Change style in dental-services-menu.asp */
/* Type 1: Gradient transparent - color - transparent */	
hr.t-1 {
    border: 0;
    height: 2px;
    background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0)); 
    background-image: -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0)); 
    background-image: -ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0)); 
    background-image: -o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0)); 
}
/* Type 2: Inset */		
hr.t-2 {
    border: 0;
    height: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}
/* Type 3: Double-color dashed line */
hr.t-3 {
    border: 0;
    border-bottom: 1px dashed #ccc;
    background: #999;
}
.dental	{
				font-family: Arial, Helvetica, sans-serif;
				font-size: 9pt;
				text-align: center;
				font-weight: 500;
				color: #000000;
				margin-top: 2px;
}

.cn	{
				text-align: center;
}
.reg	{
				font-size: 6pt;
				vertical-align: text-top;
}
 
h1 {
				font-size: 19px;
				font-family:Arial, Helvetica, sans-serif;
				font-style:oblique;
				font-weight:bold;
				padding: 0px;
}
h2 {
				font-family: 'Trajan Pro', Georgia, 'Times New Roman', Times, serif;
	font-size: 16px;
}
h3 {
				color:#000;
				font-weight: bold;
				font-size: 14px;
}
h4 {
				font-weight: normal;
				font-size: 12px;
}
h5 {
				text-align: center;
				font-family: Arial, Helvetica, sans-serif;
				font-size: 11pt;
				font-weight: 500;
				color: black;
				margin-bottom: 3px;
				margin-top: -5px;
}


/* Navigation */
#hr_nav {
	width:100%;
	overflow:hidden;
	position:relative;
/*	background: url(/images/Navi_bg.webp);  */
}
/*#hr_nav ul {
	clear:left;
	float:left;
	list-style:none;
	margin:0;
	padding:0;
	position:relative;
	left:50%;
	text-align:center;
}
#hr_nav ul li {
	display:block;
	float:left;
	list-style:none;
	margin:0 0 -2px;
	padding:0 0 0 12px;
	position:relative;
	right:50%;
}*/
/* Navigation */


#button_nav {
	width:100%;
	overflow:hidden;
	position:relative;
	margin:-5px 0 0 0;
/*	background: url(/images/Navi_bg.webp);  */
}
#button_nav ul {
	clear:left;
	float:left;
	list-style:none;
	margin:0;
	padding:0;
	position:relative;
	left:50%;
	text-align:center;
}
#button_nav ul li {
	display:block;
	float:left;
	list-style:none;
	margin:0 0 -2px;
	padding:0;
	position:relative;
	right:50%;
}

/* servicesmenu */

#servicesmenu {
    width: 97%;
	text-align: left;
	margin: 0;
	padding:15px 0 15px 15px;
	border: 2px solid #000080;
	background-color:#E6E6E6;
	border-radius: 10px;
	float:left;
}
#servicesmenu ul {
	width:207px;
	list-style:none;
	margin:0;
	padding:0 10px 0 0;
	text-align:left;
	float:left;
}
#servicesmenu ul li {
	display:block;
	list-style:none;
	margin:0 0 4px 0;
	padding:0;
	position:relative;
}
#servicesmenu ul li a {
    color: #000080;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 10pt;
    font-weight: bold;
    text-decoration: none;
	display:block;
	margin:0;
	padding:0;
/*  background:#ddd;  */
}
#servicesmenu ul li a:hover, 
#servicesmenu ul li a:active {
	color:#000000;
	text-decoration:underline;
}

/* servicesmenu */

#right-side-menu {
	padding:0;
	margin:0;
	text-align: center;
	list-style:none;
}
#right-side-menu ul {
	list-style:none;
	margin:0;
	padding:0;
    text-align: center;
    display: inline-block;
}
#right-side-menu ul li {
	margin:0;
	padding:0;
	list-style:none;
	float:right;
}
#servicesmenu ul li a {
	margin:0;
	padding:0;
}

/* start top navigation menu --- */

#mainMenuContainer ul.mainMenu{
	width: 100%;
	padding:0 0 0 0px;
	text-align: center;
	margin: 1px auto 1px 0px;
}
#mainMenuContainer ul.mainMenu li{
	margin: 1px 4px 1px 4px;
    text-align: center;
    display:inline;
}
#mainMenuContainer ul.mainMenu li a{
text-decoration: none;
color: #fff; 
/* -moz-text-shadow: 1px 1px 0px #000;
-webkit-text-shadow: 1px 1px 0px #000;
text-shadow: 1px 1px 0px #000;*/
font-size: 12px;  
font-family: 'Trajan Pro',Georgia,'Times New Roman',Times,serif;
 }
#mainMenuContainer ul.mainMenu li a:visited {
text-decoration: none;
color: #fff; 
/* -moz-text-shadow: 1px 1px 0px #000;
-webkit-text-shadow: 1px 1px 0px #000;
text-shadow: 1px 1px 0px #000;*/
font-size: 12px;  
font-family: 'Trajan Pro',Georgia,'Times New Roman',Times,serif;
 }

#mainMenuContainer ul.mainMenu li a:hover {
text-decoration: underline; 
color: #b0966f; 
/*-moz-text-shadow: 1px 1px 0px #000;
-webkit-text-shadow: 1px 1px 0px #000;
text-shadow: 1px 1px 0px #000;*/
font-size: 12px;  
font-family: 'Trajan Pro',Georgia,'Times New Roman',Times,serif;
 }

/* --- end top navigation menu */


.DWSReview	{
				padding: 10px;
				border: 1px #c1c1c1 solid;
				margin: 10px auto 10px auto;
				-webkit-border-radius: 5px 5px 5px 5px;
				border-radius: 5px 5px 5px 5px;
}


.revName	{
				font-weight: 700;
				font-style: italic;
			}
.revName:before	{
				/* content: "\2022""\0020"; */
				content: " - ";
				display: inline;

}

/**
.DWSReview	{
				width: 97%;
				margin-bottom: 20px;
				padding:10px;
				border:1px solid #c2d8ea;
				background-color:#e7f4ff;
}
.revName	{
				margin-top: 5px;
}


.reviewBox	{
				width: 98%;
				margin-left: auto;
				margin-right: auto;
				background-color: #D3E1FE;
				-webkit-border-radius: 10px;
				border-radius: 10px;
				padding: 10px;
}
.revBox	{
		width: 180px;
		height: 30px;
		margin: auto;
		background-color: #045FAC;
		-moz-border-radius: 10px;
		-webkit-border-radius: 10px;
		border-radius: 10px;
		text-align: center;
}
.revTxt	{
				margin: 5px auto 0px auto;
				padding-top: 4px;
				color: #FFFFFF;
}
a:link.rev	{
				text-decoration: none;
				color: #fff;
				font-size: 12pt;
				font-family: Trebuchet MS, Trebuchet MS, sans-serif;
}
a:visited.rev	{
				text-decoration: none;
				color: #fff;
				font-size: 12pt;
				font-family: Trebuchet MS, Trebuchet MS, sans-serif;
}
a:hover.rev	{
				text-decoration: underline;
				color: #fff;
				font-size: 12pt;
				font-family: Trebuchet MS, Trebuchet MS, sans-serif;
}
**/


/* servicesmenu */

#bottom-flash {
    width: 97%;
	text-align: left;
	margin: 0;
	padding:0;
/*	padding:15px 0 15px 15px; */
	border: 1px solid #000000;
	border-radius: 10px;
	float:left;
}
#bottom-flash ul {
	width:97%;
	list-style:none;
	margin:0;
	padding:10px;
	text-align:center;
	float:left;
}
#bottom-flash ul li {
    font-family:"Monotype Corsiva";
    font-size:25px;
    font-weight:bold;
	color:#000000;
	display:block;
	list-style:none;
	margin:0 0 4px 0;
	padding:0;
	position:relative;
}