@charset "utf-8";
/* CSS Document */

* {
	vertical-align: text-top;
	font-weight: inherit;
	font-family: inherit;
	font-style: inherit;
	font-size: 100%;
	border: 0 none;
	outline: 0;
	padding: 0;
	margin: 0;
}
body{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10pt;
	color: #777;
	behavior: url("../csshover3.htc"); 
}

	@font-face {  
	  font-family: "Sergoe Script";  
	  src: url( http://www.smileelements.ca/newsite/2/fonts/segoesc.eot ); /* IE */  
	  src: local("Sergoe Script"), url( ../fonts/segoesc.ttf ) format("truetype"); /* non-IE */  
	} 

h1{
	font-family: "Sergoe Script", Garamond, Georgia, "Times New Roman", Times, serif;
	font-size: 24pt;
	color: #990000;
	margin-bottom: 25px;
	margin-top:25px;
}
h2{
	font-family: Garamond, Georgia, "Times New Roman", Times, serif;
	font-size: 22pt;
	color: #00559a;
	margin-top: 50px;
	padding-bottom: 10px;
	/*border-bottom: 1px dashed #ddd;*/

}
h3{
font-size: 11pt;
font-weight:bold;
margin-top: 50px;
}
#rightColContent h2{
	font-family: "Sergoe Script", Garamond, Georgia, "Times New Roman", Times, serif;
	border-bottom: 1px solid #ccc;
	margin: 10px 0 0.5em;
	padding-bottom: 0.5em;
	font-size: 14pt;
	color: #000;
	text-align: left;
}
#leftColContent{
font-size: 11pt;
line-height: 16pt;
}
p{
margin-bottom: 1em;
}
strong{
font-weight: bold;
}
em{
color: #990000;
font-style:italic;
line-height: 16pt;
}
.small{
font-size: 9pt;
}
.right{
text-align: right;
}
.left{
text-align: left;
}
.center{
text-align: center;
}
.clear{
clear: both;
}
.bSpacer{
margin-bottom: 20px;
font-size: 8pt;
height: 275px;
overflow: hidden;
}
.uline{
text-decoration:underline;
}
.red{
color: #990000;
}
a, a:visited, a:active{
color:#3399FF;
}
a:hover{
text-decoration: none;
}
/* ////////////////////////////////////////////////////////////////////////////////////////// CLEARFIX ////////////////////////////////////////// */
.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

.clearfix {
    display: inline-block;
}

html[xmlns] .clearfix {
    display: block;
}

* html .clearfix {
    height: 1%;
}
/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* ////////////////////////////////////////////////////////////////////////////////////////// ON PAGE ////////////////////////////////////////// */

body#index a#indexNav,
body#about a#aboutNav,
body#products a#productsNav,
body#contact a#contactNav{
color: #fff;

}
body#index a#indexNavFooter,
body#about a#aboutNavFooter,
body#products a#productsNavFooter,
body#projects a#projectsNavFooter,
body#services a#servicesNavFooter,
body#distributors a#distributorsNavFooter,
body#contact a#contactNavFooter{
font-weight: bold;
/*color: #0072bc;*/
color: #fff;
font-style:normal;
}


/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* ////////////////////////////////////////////////////////////////////////////////////////// GRID ////////////////////////////////////////// */
.grid{
margin: 50px 0 25px; 
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
padding-bottom: 10px;
}
.leftGrid{
float: left;
width: 250px;
margin-right: 50px;
text-align: justify;

}
.rightGrid{
float: left;
width: 250px;
}
/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
ul.list, ol.list{
margin-bottom: 1em;
}
ul.list li, ol.list li{
margin: 0 0 5px 2em;
}


a.bookApt{
position: absolute;
top: 235px;
cursor: pointer;
margin-left: 410px;
background-image:url(../images/bookAppt_btn_off.png);
background-repeat: no-repeat;
width: 200px;
height: 60px;
}
a.bookApt:hover{
position: absolute;
top: 235px;
cursor: pointer;
margin-left: 410px;
background-image:url(../images/bookAppt_btn_on.png);
background-repeat: no-repeat;
width: 200px;
height: 60px;
}
.topMsg{
margin: 95px 0 32px 20px; width: 300px; color: #fff; font-size: 9pt; text-align:center;
}

ol.faqList{
font-size: 9pt;
text-align: left;
}
ol.faqList li{
padding: 5px 0;
}
.faq dt{
text-transform: uppercase;
}
.faq dd.back{
border-top: 1px dashed #ddd;
text-align: right;
margin-top: 0.25em;
margin-bottom: 2em;
}
/* ////////////////////////////////////////////////////////////////////////////////////////// CONTACT FORM ////////////////////////////////////////// */
#contact-wrapper {  
/*width:430px;  
border:1px solid #e2e2e2;  
background:#f1f1f1;  
padding:20px;  */
}  
#contact-wrapper div {  
clear:both;  
margin:1em 0;  
}  
#contact-wrapper label {  
display:block;  
float:none;  
font-size:16px;  
width:auto;  
}  
form#contactForm input {  
border-color:#B7B7B7 #E8E8E8 #E8E8E8 #B7B7B7;  
border-style:solid;  
border-width:1px;  
padding:5px;  
font-size:16px;  
color:#333;  
}  
form#contactForm textarea {  
font-family:Arial, Tahoma, Helvetica, sans-serif;  
font-size:100%;  
padding:0.6em 0.5em 0.7em;  
border-color:#B7B7B7 #E8E8E8 #E8E8E8 #B7B7B7;  
border-style:solid;  
border-width:1px;  
}  
.error{
color: #990000;
padding: 5px;
background-color: #efefef;
}
/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
.leftGrid .testimonials{
width: 230px;
}
.testimonials{
font-size: 9pt; line-height: 16pt; border-bottom: 1px dashed #ddd; padding-bottom: 15px; margin-bottom: 50px; color: #777;
}
.testimonials h2{
margin-top: 1em;
}
.testimonials p{
border-left: 3px solid #efefef;
padding : 0 0 15px 10px;
color: #00559a;
font-style: italic;
}
.testimonials p:first-letter{
font-size: 24pt;
}
.end{
margin-top: 30px;
display: block;
font-family: "Sergoe Script", Garamond, Georgia, "Times New Roman", Times, serif;
	font-size: 16pt;
	color: #990000;
	line-height: 24pt;
}
.back{
border-top: 1px dashed #ddd;
text-align: right;
margin-top: 0.25em;
margin-bottom: 2em;
background-color: #efefef;
padding: 0 10px 5px 0;
}

/* ////////////////////////////////////////////////////////////////////////////////////////// THE MAIN NEWS ////////////////////////////////////////// */

.newsItem{
margin-bottom: 25px;
padding-top: 10px;

}
.date {
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border: 2px solid #dbdbdb;
background-color: #efefef;
text-align: center;
padding: 10px 10px 5px;
color: #990000;
width: 30px;
float: left; 
margin-right: 15px;
}
.month {
font-size: 8pt; 
font-weight: bold;
}
.day { 
font-size: 20pt;
font-weight: bold;
}
.newsEntry{
float: left; 
width:  180px;
font-size: 9pt;
line-height: 16px;

color: #00559a;
}
.readNews p a:visited, .readNews p a:active{
text-align: right;
float: right;
}
/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
dl.news{
margin: 2em 0 1em;
}
dl.news dt{
font-weight: bold;
color: #00559a;
border-left: 3px solid #00559a;
padding: 0 0 0 10px;
background-color: #efefef;
}
dl.news dd{
margin-bottom: 3em;
font-size: 9pt;
}

table.footerNav{
border: none;
width: 100%;
}
table.footerNav td{
padding: 5px 0;
}

.rightColFooter a, .rightColFooter a:visited, .rightColFooter a:active, .leftColFooter a, .leftColFooter a:visited, .leftColFooter a:active{
color: #ccc;
}
#screenshot{
	position:absolute;
	border:2px solid #dbdbdb;
	background:#fff;
	padding:5px;
	display:none;
	color:#777;
	margin-top: -250px;
	}
	 /*
  USAGE:
  Copy and paste this one line into your site's CSS stylesheet.
  Add comma-separated CSS selectors / element names that have transparent PNGs.
  Remember that the path is RELATIVE TO THIS HTML FILE, not the CSS file.
  See below for another method of activating the script without adding CSS here.
 */

 img, div, input { behavior: url("../iepngfix.htc") }


 /*
  Here's an example you might use in practice:
  img, div.menu, .pngfix, input { behavior: url("/css/iepngfix.htc") }
 */
 
 .breadCrumbs{
 list-style: none;
 line-height:	1.0;
 margin: 25px 0 0;
 font-size: 8pt;
 padding-left: -1em;
 border-top: 1px dashed #990000;
 border-bottom: 1px dashed #990000;
 }
 .breadCrumbs li{
 float: left;
 padding: .75em 0.25em;
 }
 .breadCrumbs a{
 display: block;
 
 }
 dl.staffInfo {
 clear:both;
 margin-bottom: 25px;
 padding-bottom: 25px;
 border-bottom: 1px solid #ddd;
 }
 dl.staffInfo dt{
 float: left;
 width: 200px;
 }
 dl.staffInfo dd{
margin-left:25px;
float: left;
width: 325px;
 }