@charset "UTF-8";
/*
		-----------------------------------------------------------------------
		CSS:			The Crystal Dental Clinic
		Created:		7 Oct 2010
		-----------------------------------------------------------------------
		
		Copyright (c) 2010 The Crystal Dental Clinic. All rights reserved.
		http://www.crystal-dental.com
	*/

/* Global
----------------------------------------------------------------------------------------------------*/

/*----- HTML5 structure -----*/
header, footer, article, section, nav, menu, hgroup , aside {
	display: block;
}

/*----- Special font -----*/
@font-face {
	font-family: 'HarabaraHandItalic';
	src: url('font/en/HarabaraHand-webfont.eot');
	src: local('☺'), url('font/en/HarabaraHand-webfont.woff') format('woff'), url('font/en/HarabaraHand-webfont.ttf') format('truetype'), url('font/en/HarabaraHand-webfont.svg#webfontGZBwLkjV') format('svg');
	font-weight: normal;
	font-style: normal;
}

/*----- Main -----*/
body {
	font: 81.25%/1.4 Arial, Helvetica, sans-serif;
	color: #4e4e4e;
	background: url(../images/bg.jpg) repeat-x center top;
}
h1, h2  , h3{
	font-family: HarabaraHandItalic, cursive;
	color: #a5488e;
}
h1 {
	font-size: 2.1em;
	border-bottom: 1px dotted #a5488e;
	text-transform: capitalize;
	padding-bottom: 5px;
	margin-bottom: 20px;
	font-weight: normal;
}
h2 {
	text-transform: capitalize;
	font: normal 1.846em Arial, Helvetica, sans-serif;
	margin-bottom: 15px;
	margin-top: 10px;
}
p {
	margin-bottom: 15px;
}
a:link {
	color: #a5488e;
}
a:visited {
	color: #B23C94;
}
a:hover {
	text-decoration: none;
}
header {
	margin: auto;
	height: 460px;
	width: 950px;
	position: relative;
}
#logo {
	height: 125px;
	width: 98px;
	margin-top: 35px;
	margin-left: -11px;
	float: left;
}
#lang {
	background: url(../images/bg-lang-nav.png);
	height: 46px;
	width: 81px;
	text-align: center;
	float: right;
	color: #a5488e;
	font-family: HarabaraHandItalic, cursive;
	line-height: 46px;
}
#lang a {
	color: #a5488e;
	text-decoration: none;
	text-transform: capitalize;
}
nav {
	height: 35px;
	position: absolute;
	width: 800px;
	top: 60px;
	left: 110px;
}
nav ul li {
	border-right: 1px solid #FFF;
	display: inline;
	padding: 0px 20px;
	line-height: 35px;
}
nav ul li.last {
	border-style: none;
}
nav ul li a {
	text-transform: capitalize;
	font-size: 1.1em;
	text-decoration: none;
}
nav ul li a:link , nav ul li a:visited{
	color: #FFF;
}
nav ul li a:hover {
	color: #D9E577;
}
#slogan {
	position: absolute;
	width: 435px;
	z-index: 4;
	right: 0px;
	top: 170px;
	text-align: center;
}
#slogan h1 {
	font: 2.5em HarabaraHandItalic, cursive;
	text-transform: capitalize;
	color: #a5488e;
	margin-bottom: 10px;
	padding: 0px;
	border-style: none;
}
#slogan p {
	font-size: 1.5384em;
	color: #267271;
	width: 85%;
	margin: auto;
}
#spotlight {
	height: 345px;
	width: 240px;
	background: url(../images/spotlight.png);
	position: absolute;
	z-index: 6;
	left: 265px;
	top: 147px;
}
#photo_frame {
	height: 209px;
	width: 230px;
	position: absolute;
	z-index: 5;
	left: 275px;
	top: 150px;
}
#slider {
	height: 100px;
	width: 133px;
	position: absolute;
	z-index: 3;
	top: 198px;
	left: 322px;
}
#slider li {
	width:133px;
	height:100px;
	overflow:hidden;
}	
#content_wrapper  {
	margin: auto;
	width: 890px;
	padding: 50px 30px 0px;
	position: relative;
}
.half_content {
	width: 430px;
}
#teeth {
	height: 232px;
	width: 277px;
	position: absolute;
	right: 20px;
	z-index: 1;
	top: -110px;
	background: url(../images/home/teeth.png);
}
#who_we_are {
	width: 370px;
	margin-right: 40px;
}
#who_we_are img {
	border: 4px solid #d8d8d8;
	margin-right: 20px;
	margin-bottom: 10px;
}
#promotion {
	width: 220px;
}
#promotion .promotion_price {
	font-size: 1.5384em;
	color: #F00;
	background: url(../images/home/hot.png) no-repeat 120px center;
	height: 48px;
	line-height: 48px;
	margin: 0px;
}
#promotion .promotion_name {
	font-size: 1.2307em;
}
#promotion_pic {
	background: url(../images/home/implant.png);
	height: 141px;
	width: 167px;
	position: absolute;
	top: 250px;
	right: 220px;
}
.about_list {
	margin-left: 25px;
	margin-bottom: 15px;
}
.about_list li{
	background: url(../images/bullet.png) no-repeat left center;
	padding-left: 20px;
	margin-bottom: 5px;
}
aside {
	width: 300px;
}
aside ul {
	background: url(../images/bg-side-nav.png) no-repeat;
	width: 100%;
}
aside ul li a {
	height: 40px;
	line-height: 40px;
	padding-left: 45px;
	display: block;
	text-decoration: none;
	-webkit-border-radius: 7px;
	-moz-border-radius: 7px;
	border-radius: 7px;
	font-size: 1.1em;
}
aside ul li a:link, aside ul li a:visited {
	background: url(../images/bullet.png) no-repeat 20px center;
}
aside ul li a:hover        {
	color: #FFF;
	background: #a5488e url(../images/bullet.png) no-repeat 20px center;
}
#content {
	width: 550px;
	margin-left: 40px;
}
.services_info ul, services_info ol {
	margin-bottom: 15px;
}
.services_info ul li, services_info ol li {
	margin-left: 40px;
}
.services_info ul li {
	list-style: disc;
}
services_info ol li {
	list-style: decimal;
}
.bio {
	margin-bottom: 20px;
	overflow: hidden;
	clear: both;
}
.bio img {
	border: 4px solid #eee;
}
.bio div {
	float: right;
	width: 360px;
}
.bio hgroup h3 {
	margin-bottom: 8px;
	font: normal 1.3846em Arial, Helvetica, sans-serif;
}
.bio hgroup h4 {
	color: #267271;
	font-size: 1.1em;
	font-style: italic;
	font-weight: normal;
	margin-bottom: 5px;
}
.bio ul {
	margin-left: 13px;
}
.bio ul li {
	list-style: disc;
}
.price_table {
	width: 550px;
	margin-bottom: 20px;
}
.price_table td {
	padding: 10px 20px;
}
.price_table .border {
	border-right: 1px solid #FFF;
}
.price_table thead tr td{
	background: #A5488E;
	height: 15px;
	color: #FFF;
	vertical-align: middle;
}
.price_table thead tr .procedure {
	width: 220px;
}
.price_table thead tr .price {
	width: 110px;
}
.price_table thead tr .promotion {
	width: 100px;
}
.price_table tbody tr  td{
	background: #EEE;
	min-height: 15px;
}
.price_table tbody tr td.alternate {
	background: #e6e6e6;
}
.price_table tbody tr .promotion {
	color: #F00;
}
#testimonial article {
	overflow: hidden;
	margin-bottom: 1em;
}
#testimonial img {
	border: 4px solid #eee;
	float: left;
}
#testimonial p {
	float: right;
	width: 250px;
}
#testimonial .name {
	text-align: right;
	font-size: 1.1em;
	font-style: italic;
	color: #267271;
}
#contact_info {
	width: 520px;
}
#contact_info h3 , #contact_form h3{
	font-size: 1.5384em;
	font-weight: normal;
	margin-bottom: 10px;
}
#contact_info h5 {
	margin-bottom: 5px;
}
#contact_form {
	width: 350px;
}
#contact_form form label {
	font-weight: bold;
	display: block;
	text-transform: capitalize;
	margin-bottom: 10px;
}
#contact_form form input,
#contact_form form textarea {
	margin-bottom: 10px;
	display: block;
	background: #EEE;
	padding: 2px 5px;
	border-style: none;
	font: 1em Arial, Helvetica, sans-serif;
	color: #a5488e;
	width: 340px;
}
#contact_form form input {
	height: 20px;
}
#contact_form form textarea {
	height: 180px;
	padding: 5px;
	margin-bottom: 20px;
}
#contact_form form #button {
	text-transform: capitalize;
	color: #FFF;
	background: #a5488e;
	text-decoration: none;
	padding: 5px 10px;
	margin-top: 5px;
	-webkit-border-radius: 7px;
	-moz-border-radius: 7px;
	border-radius: 7px;
	width: auto;
	height: auto;
}
#contact_form form #button:hover {
	background: #7D2A68;
}
#contact_form form .error {
	text-transform: none;
	color: #F00;
}
footer {
	border-top: 1px dotted #a5488e;
	padding-top: 10px;
	text-align: right;
	width: 890px;
	margin: 30px auto 20px;
	overflow: hidden;
}
.jyyoi {
	color: #B23C94;
}
.jyyoi a {
	color: #B23C94;
}
.jyyoi a:link, .jyyoi a:visited {
	text-decoration: none;
}
.jyyoi a:hover {
	border-bottom: 1px dotted #B23C94;
}
.read_more_btn:link, .read_more_btn:visited, .read_more_btn:hover {
	padding: 5px 10px 5px 25px;
	text-transform: capitalize;
	text-decoration: none;
	-webkit-border-radius: 7px;
	-moz-border-radius: 7px;
	border-radius: 7px;
	color: #FFF;
}
.read_more_btn:link , .read_more_btn:visited {
	background: #A33685 url(../images/arrow.png) no-repeat 10px center;
}
.read_more_btn:hover {
	background: #7D2A68 url(../images/arrow.png) no-repeat 10px center;
}
.company_name {
	color: #a5488e;
	font: 1.1em HarabaraHandItalic, cursive;
	letter-spacing: 0.1em;
}
.left {
	float: left;
}
.right {
	float: right;
}
#toTop {
	width:100px;
	background:#a5488e;
	/* [disabled]border:1px solid #ccc; */
	text-align:center;
	padding:5px;
	position:fixed;
	bottom:10px;
	right:10px;
	cursor:pointer;
	color:#FFF;
	text-decoration:none;
	-webkit-border-radius: 7px;
	-moz-border-radius: 7px;
	border-radius: 7px;
}


/* `Clear Floated Elements
----------------------------------------------------------------------------------------------------*/

/* http://sonspring.com/journal/clearing-floats */

.clear {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
}

/* http://perishablepress.com/press/2009/12/06/new-clearfix-hack */

.clearfix:after {
	clear: both;
	content: ' ';
	display: block;
	font-size: 0;
	line-height: 0;
	visibility: hidden;
	width: 0;
	height: 0;
}

/*
	The following zoom:1 rule is specifically for IE6 + IE7.
	Move to separate stylesheet if invalid CSS is a problem.
*/
* html .clearfix,
*:first-child+html .clearfix {
	zoom: 1;
}