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

* {	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;}
h3{font-size: 11pt; font-weight:bold; margin-top: 50px; color:#990000;}

#rightColContent h2{
	font-family: "Sergoe Script", Garamond, Georgia, "Times New Roman", Times, serif;
	border-bottom: 1px solid #ccc;
	margin: 25px 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: 210px;
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; 
padding-bottom: 10px;
}
.leftGrid{
float: left;
width: 250px;
text-align: left;

}
.rightGrid{
float: right;
margin-left: 10px;
width: 250px;
text-align: left;
}

.wideGrid{
float: none;
width: 599;
margin-top: 10px;
margin-bottom: 10px;
border-top: 1px solid #ddd;
}

.lectureMap{
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
background-image:url(../images/lectureMap.jpg);
background-repeat: no-repeat;
width: 559px;
height: 244px;
border: 1px solid #FFF;
}
.lectureText{position: relative; top: 72px;}
  .lectureText h3{font-size: 16px; color: #990000; margin-bottom: 8px;}
  .lectureText p{position: relative; float: left; margin-right: 15px; font-size: 10px; color: #000; line-height: 140%;}
.nextLecture p{position: relative; margin-bottom: 20px; font-size: 11px; color: #000;}


#focus {background-color:#F9EFD9; padding: 20px;}
  #focus h1{margin: 5px 0px 5px 0px;}
  #focus h3{margin: 0px 0px 10px 0px; text-align:left; color:#333333;}
	.focusFrame{margin: 20px 0px 10px 0px; background-color: #FFF; padding:10px;}
	.focusVideo{margin: 0px 0px 20px 0px;}
    .focusFrame p{font-size:12px; margin:8px; line-height:17px; color:#333;}

.readArticles{position:relative; display:block; overflow:hidden; left:150px; cursor:pointer; width:160px; height:32px; text-align:center; text-decoration:none; font-size:13px;}
a.readArticles      {background:url(../images/bgLearnMore.gif) no-repeat 0px 0px; color:#000000; margin:12px 5px 5px 5px; padding-top:11px;}
a.readArticles:hover{background:url(../images/bgLearnMore.gif) no-repeat 0px -45px; color:#990000; margin:12px 5px 5px 5px; padding-top:11px;}

.socialMedia img{margin-left: 30px;}


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


a.bookApt{
position: absolute;
top: 247px;
cursor: pointer;
margin-left: 395px;
background-image:url(../images/bookAppt_btn_off2.png);
background-repeat: no-repeat;
width: 230px;
height: 60px;
}
a.bookApt:hover{
position: absolute;
top: 247px;
cursor: pointer;
margin-left: 395px;
background-image:url(../images/bookAppt_btn_on2.png);
background-repeat: no-repeat;
width: 230px;
height: 60px;
}
.topMsg{
margin: 95px 0 32px 20px; width: 300px; color: #fff; font-size: 9pt; line-height:20px; 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: 0px 10px 5px 0px;
padding-top: 10px;
float: left;
width: 240px;
}
.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:  140px;
font-size: 9pt;
line-height: 16px;
color: #00559a;
padding:0px;
margin:0px;
}
.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") }
 */
 
 /* DELETE BREADCRUMBS */
.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; 
}

 /* Submenu replaces BREADCRUMBS */
.submenu{
  list-style: none;
  padding: 15px 0;
  margin: 20px 0px 35px 0px;
  border-top: 1px dotted #ccc;
  border-bottom: 1px dotted #ccc;
	width:100%;
	text-align:center;
}
.submenu span{
	border-left:1px solid #666;
	height:32px;
	padding-left:8px;
	margin-left:5px;
}
.submenu span:first-child{
	padding-left:0px;
	margin-left:0px;
	border-left:0px solid #666;
}

.submenu a{
  font: 11px/16px arial, sans-serif;
	color:#666;
	text-decoration:none;
}
.submenu a:hover{
	color:#990000;
	text-decoration:none;
}
 
 
 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;
 }
 
 
.thumbnail{padding:2px; border:1px solid #999; margin:5px;}