/* CSS Document */

/*********************************************
	HTML TAGS
*********************************************/
body {
	margin: 0;
	color: #FFF;
	min-width: 1000px;
	
	font-family:Tahoma, Geneva, sans-serif;
	font-family: book antiqua, palatino;
	font-size: large;

	background: #0f0f0f; /* Old browsers */
	background-color: #0f0f0f; /* Old browsers */
}

a:link, a:visited, a:active {
	color:#A3C4C9;
	text-decoration: none;
}
a:hover {
	color: #999;
	text-decoration: none;
}
/*********************************************
	DIV TAGS
*********************************************/
#Wrapper {
	margin-left: auto;
	margin-right: auto;
	height: auto;
	min-height: 600px;
	/* width: 1000px; */
	width: 100%;
	min-width: 1100px;
}

#Header {
	height: 180px;
	width: 100%;
	
	background: url('header_bg_image_dk.jpg') no-repeat center center;

	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

#Banner {
	height: 36px;
	width: auto;
	padding-top: 10px;

	text-transform: uppercase;
	
	background-color: #000;
}
#TelephoneNumber {
	position: relative;
	width: 206px;
	height: 50px;
	margin-top: -50px;
	font-size: 30px;
	color: #DF0000;
	left: 1100px;
	top: 380px;
	z-index: 1;
}
#Title {
	height: 110px;
	width: auto;
	
	padding-top: 38px;
	
	text-transform: uppercase;
}

#ContentWrapper {
	width: 100%;

	background: #111111; /* Old browsers */
	background-color: #111111; /* Old browsers */
	
	background: url(content_wrapper_gradient_bg.jpg) repeat-y;
	background-size: 100% auto;
}

#ImageSplash, #InTheMediaImageSplash, #OurPracticeSplash {
	width: auto;
	min-height: 400px;
	margin-bottom: 30px;
	
	border-bottom: solid 1px #F00;
	
	background: url(../images/Banner/01.jpg) no-repeat center center;

	-webkit-filter: grayscale(95%);
	-mos-filter: grayscale(95%);
	-ms-filter: grayscale(95%);
	-o-filter: grayscale(95%);
	filter: url(grayscale.svg);
	filter: grayscale(95%);

	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

#InTheMediaImageSplash {
	background: url(../images/Banner/02.jpg) no-repeat center center;

	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

#OurPracticeSplash {
	background: url(../images/Banner/04.jpg) no-repeat center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}


#Content {
	width: auto;
	height: auto;
	margin: 2px 20% 0px 20%;
	
	padding: 36px 6px 100px 6px;
	font-weight: none;
}

#SmileGalleryTitle {
	font-family: "Lato","Helvetica Neue",Helvetica,Arial,sans-serif;
	font-size: 16px;
	width: auto;
	height: auto;
}
#SmileGalleryItem, #SmileGalleryItemFull {
	float: left;
	width: 50%;
	font-family: "Lato","Helvetica Neue",Helvetica,Arial,sans-serif;
	font-size: 16px;
	font-weight: normal;
	min-height: 150px;
	text-align:center;
	padding:10px 0px 10px 0px;
}

#SmileGalleryItemFull {
	width: 100%;
}

#FooterWrapper {
	width: auto;
	height: auto;
	margin-bottom: 10px;
	
	border-top: #111 1px solid;
	border-top: #444 1px solid;

	background-color: #333;
	background-color: #FFF;
	
	border-bottom: solid thin #444;
	
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,7c7c7c+3,ffffff+8,ffffff+92,7c7c7c+97,000000+100 */
background: #000000; /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjMlIiBzdG9wLWNvbG9yPSIjN2M3YzdjIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iOCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSI5MiUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSI5NyUiIHN0b3AtY29sb3I9IiM3YzdjN2MiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjMDAwMDAwIiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L2xpbmVhckdyYWRpZW50PgogIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkiIC8+Cjwvc3ZnPg==);
background: -moz-linear-gradient(top,  #000000 0%, #7c7c7c 3%, #ffffff 8%, #ffffff 92%, #7c7c7c 97%, #000000 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#000000), color-stop(3%,#7c7c7c), color-stop(8%,#ffffff), color-stop(92%,#ffffff), color-stop(97%,#7c7c7c), color-stop(100%,#000000)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #000000 0%,#7c7c7c 3%,#ffffff 8%,#ffffff 92%,#7c7c7c 97%,#000000 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #000000 0%,#7c7c7c 3%,#ffffff 8%,#ffffff 92%,#7c7c7c 97%,#000000 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #000000 0%,#7c7c7c 3%,#ffffff 8%,#ffffff 92%,#7c7c7c 97%,#000000 100%); /* IE10+ */
background: linear-gradient(to bottom,  #000000 0%,#7c7c7c 3%,#ffffff 8%,#ffffff 92%,#7c7c7c 97%,#000000 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000',GradientType=0 ); /* IE6-8 */

}

#Footer {
	width:auto;
	min-width: 1000px;
	height: 170px;
	padding: 30px 4px 4px 10px;
	margin: 0px 20% 0px 20%;

	font-size: 14px;
	font-family: Verdana, Geneva;
}

#Footer_Item {
	float: left;
	width: 24%;
	height: auto;
	
	color: #000;
}

#Footer_Line_Item_L {
	float: left;
	width: 30%;
	height: auto;
}
#Footer_Line_Item_R {
	float: left;
	width: 70%;
	height: auto;
}

#Footer_About {
	margin: 30px auto 30px auto;
	width: 75%;
	min-width: 1100px;
	
	text-align:center !important;
}
/*********************************************
	NAVIGATION
*********************************************/
#Navigation {
	height: auto;
	width: 100%;
	padding-bottom: 5px;
	margin-left: -1px;
	
	position: relative;
	
	border: 1px solid #000000;
	border-bottom: none;
	background-color: #212121;
	background: #212121; /* Old browsers */
	background: -moz-linear-gradient(top, #212121 0%, #2d2d2d 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#212121), color-stop(100%,#2d2d2d)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #212121 0%,#2d2d2d 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #212121 0%,#2d2d2d 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #212121 0%,#2d2d2d 100%); /* IE10+ */
	background: linear-gradient(to bottom, #212121 0%,#2d2d2d 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#212121', endColorstr='#2d2d2d',GradientType=0 ); /* IE6-9 */

	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	-moz-background-clip: padding;
	-webkit-background-clip: padding-box;
	background-clip: padding-box;
	-webkit-box-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.1);
	-moz-box-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.1);
	box-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.1);
	z-index: 50;
}

#Navigation a:hover {
	color:#FF8080;
}

#Navigation ul {
    list-style: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
	text-align: center;
}

#Navigation ul li {
    float: left;
	padding-top: 5px;
	width: 11.1%;
}

#Navigation ul li a:link, #Navigation ul li a:visited, #Navigation ul li a:active {
    display: block;
    width: auto;
	height: 22px;
	line-height: 22px;
    font-weight: none;
    padding: 3px 7px 0px 7px;
    text-decoration: none;
	font-size: small;

	color: #efefef;
	-webkit-box-shadow: inset 1px 0px 0px 0px rgba(255, 255, 255, 0.1);
	-moz-box-shadow: inset 1px 0px 0px 0px rgba(255, 255, 255, 0.1);
	box-shadow: inset 1px 0px 0px 0px rgba(255, 255, 255, 0.1);
}

#Navigation ul li a:hover {
    background-color: #222;
	color: #F00;
	
	-webkit-box-shadow: inset 1px 0px 0px 0px rgba(255, 255, 255, 0.1);
	-moz-box-shadow: inset 1px 0px 0px 0px rgba(255, 255, 255, 0.1);
	box-shadow: inset 1px 0px 0px 0px rgba(255, 255, 255, 0.1);
}

.NavItem {
    text-align: center;
    text-transform: uppercase;
}

#Navigation ul ul {
	display: none;
}

#Navigation ul li:hover > ul {
	display: block;
}

#Navigation ul ul {
	border-radius: 0px;
	padding: 0;
	position: absolute;
	top: 80%;
	width: auto;
	text-align: left;

	background-color: #212121;
	background: #212121; /* Old browsers */
	border: 1px solid #444;
	
	-webkit-box-shadow: 5px 5px 3px 0px rgba(10, 10, 10, 0.5);
	-moz-box-shadow: 5px 5px 3px 0px rgba(10, 10, 10, 0.5);
	box-shadow: 5px 5px 3px 0px rgba(10, 10, 10, 0.5);
	
}
#Navigation ul ul li {
	float: none; 
	border-top: 1px solid #444;
	position: relative;
	width: auto;
	text-align: left;
}
#Navigation ul ul li a:link, #Navigation ul ul li a:active, #Navigation ul ul li a:visited {
	text-align: left;
	color: #fff;
}	
#Navigation ul ul li a:hover {
	text-align: left;
	background: #4b545f;
}

#Navigation ul ul ul {
	text-align: left;
	position: absolute;
	left: 100%;
	top:0;
}

/*********************************************
	TEXT
*********************************************/
.IdotFont { font-family: idot; }
.SanSerfFont {
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	color: #DF0000;
	font-size: medium;
}
.Bold { font-weight: bold; }
.Italic { font-style:italic; }

.TitleSize {font-size: 48px; }
.TitleSubSize {font-size: 42px; }

.XXLarge { font-size:xx-large; }
.XLarge { font-size:x-large; }
.Large { font-size:large; }
.Medium { font-size:medium; }
.Small { font-size: small; }
.XSmall { font-size: x-small; }

.UCwords { text-transform: uppercase; }
.Underline { text-decoration:underline; }

.Black { color: #000; }
.DkGrey { color: #333; }
.Grey { color:#666; }
.LtGrey { color: #CCC; }
.White { color: #FFF; }
.Red { color: #F00; }
.DkRed { color: #DF0000; }
.Blue { color: #00F; }
.Green { color: #090; }
.Yellow { color:#FFFF71; }
.BabyBlue { color: #1F86F8; }

/*********************************************
	FONTS
*********************************************/
@font-face {
    font-family: idot;
    src: url(idot.ttf);
}


/*********************************************
	FORMS / BUTTONS
*********************************************/

input[type=text], textarea
{
    background-color: #EEE;
    border:solid 1px #EEE;
    box-shadow: 2px 2px 0 #828181 inset;
}

/*********************************************
	EXTRAS / EFFECTS / PADDING
*********************************************/
.TextHeader {
	text-transform: uppercase;
	color: #FFFF71;
	margin-left:-35px;
}
.GreyImage {
	-webkit-filter: grayscale(20%);
	-ms-filter: grayscale(20%);
	filter: grayscale(20%);
}
.PaddingLeft20px {padding-left: 20px; }
.PaddingBottom20px {padding-bottom: 120px; }
.PaddingBottom40px {padding-bottom: 200px; }
.Padding10px { padding: 10px 0px 10px 0px; }

.BlkBorder { border: #000 solid 1px; }
.GreyBottomBorder { border-bottom: #333 solid 1px; }

.Clear { clear:both; }

#Horizontal_Stitch {
	float: left;
	width: 100%;
	height: 22px;
	
	/*background: url(Horizontal_Divider_stitch.png) center center;*/
}

.Verticle_Divider {
	max-width: 60px;
	min-height: 152px;
	
	background:url(verticle_divider.png) center center no-repeat;
}

.ImageFrame {
	float:right;
	width:255px;
	height: auto;
	padding:5px;
}

.ImageFramePadding {
	margin-bottom:10px;
}

#Signature {
	float: right;
	width: 220px;
	height: 60px;
	margin-top:-10px;
}

.Contact_Background {
	background: #111111; /* Old browsers */
	background-color: #111111; /* Old browsers */
	
	background: url(contact_us_bg.jpg) no-repeat;
	background-size: 100% auto;
}

.TransitionTopBottom {
	-webkit-transition-property: top, bottom;
	-webkit-transition-duration: 0.5s;
	
	border: #888 1px solid;
}

.DrKeenLogo {
	background: url(../images/dk_logo_bg.png) no-repeat top center fixed;
}
/*********************************************
	MOBILE CCS
*********************************************/
@media (max-device-width: 480px){
    body{
		margin: 0;
		color: #FFF;
		min-width: 1100px;
		
		font-family:Tahoma, Geneva, sans-serif;
		font-family: book antiqua,palatino;
		font-size: medium;
	
		background: #0f0f0f; /* Old browsers */
		background-color: #0f0f0f; /* Old browsers */
    }

	#Content {
		width: auto;
		height: auto;
		margin: 2px 10% 0px 10%;
		
		padding: 36px 6px 100px 6px;
		font-weight: none;
	}
	
	#Footer {
		width:auto;
		min-width: 1000px;
		height: 200px;
		padding: 30px 4px 4px 10px;
		margin: 0px 10% 0px 10%;
	
		font-size: 14px;
	}
}