/*  

Theme Name: Dr.Gum

Theme URI: drgum.ca

Description: Designed by Chris Georgieff for Dr.Gum.

Version: 1.0

Author: Chris Georgieff

Author URI: none

Tags: fun

*/



body{

	background:url(images/bg.png) repeat-x;

	padding:0;

	margin:0;

	border-top: 10px solid #000;

}

img{border:none;}

.clear{clear:both;}

#top{

	height:203px;

	background:#628ad4 url('images/head-bg.png') repeat-x 0 37px;

	overflow: hidden;

position:relative;

z-index:1;



}

/* *** NAV *** */ 

.nav a{height:36px; background:url(images/navtitles.png) no-repeat; text-indent:-9999px; display:block; margin:6px 0 0 0; padding:0 10px; border-right:1px solid #56554e; border-left:1px solid #050505; float:left; outline:none;}

a.home{ background-position: 0 13px;  width: 40px; border-left:none;}

a.home:hover{ background-position:0 -27px; }

a.demos{ background-position:-432px 13px; width:60px;}

a.demos:hover{ background-position:-432px -27px;}

a.test{ background-position:-50px 13px; width:95px;}

a.test:hover{background-position:-50px -27px;}

a.products{ background-position:-157px 13px; width:77px;}

a.products:hover{background-position:-157px -27px;}

a.shows{ background-position:-249px 13px; width:95px;}

a.shows:hover{background-position:-249px -27px;}

a.partners{ background-position:-356px 13px; width:66px;}

a.partners:hover{background-position:-356px -27px;}

a.client{ background-position:-508px 13px; width:102px;}

a.client:hover{background-position:-508px -27px;}

a.blog{ background-position:-616px 13px; width:47px;}

a.blog:hover{background-position:-616px -27px;}

a.contact{ background-position:-671px 13px; width:88px;}

a.contact:hover{background-position:-671px -27px;}

.last{border-left:1px solid #050505; height:36px; float:left; margin:6px 0 0 0; }

/* *************************************** END NAV ************************************** */



#top-content{

	width:990px;

	top: 0px;

	margin: 0 auto;

	position: relative;

	padding:10px 0 0 0;

}

#logo{

	background:url('images/logo-text.png') no-repeat;

	height:123px;

	width:372px;

	margin: 0 0 0 96px;

	text-indent:-999px;

	position: relative;

	z-index: 10;

}

#logo h1{ padding:0; margin:0;}

#logo h1 a{ display: block; height:100%; width:100%;}

#drlogo{

	background:url(images/logo-blue.png) no-repeat;

	width:213px;

	height:151px;

	position:absolute;

	top:1px;

	left:-26px;

	/*left:341px;*/

	z-index: 20;

}

#gum{

	background:url(images/biggum.png) no-repeat;

	height:220px;

	width:262px;

	position:absolute;

	top:-50px;

	left:-67px;

	z-index:2;

}



#tel{ background: url(images/free-demo.png) no-repeat; width:227px; height:64px; position:absolute; top:10px; left:757px;}

#tel h1{ padding:0; margin:0; text-indent:-9999px;}

#lang{ background:url(images/lang-back.png) no-repeat; width:148px; height:38px; position:absolute; top:10px; right:5px; text-align:center; line-height:34px; color:#FFF;}

#lang a{ text-decoration:none; color:#FF99FF; font:12px Arial, Helvetica, sans-serif; }

.nav{

	position:relative;

	width:980px;

	overflow:hidden;

	margin:10px 0 0 5px;

	z-index: 10;

}

#foot .nav{

	z-index:0;

	position:relative;

}



.navLeft{ background:url(images/navEnds.png) no-repeat; height:46px; width:24px; overflow:hidden; float:left;}

.navRight{ background:url(images/navEnds.png) no-repeat top right; overflow:hidden; height:46px; width:24px; float:left;}

.navMid{

	background:url(images/navMain.png) repeat-x;

	height:46px;

	float:left;

	width:930px;

	overflow:hidden;

}



#mainContent #mid{border:1px solid #333; padding:20px 20px 0 20px;}



#mid{

	background:transparent;

	overflow:hidden;

	padding: 12px 0 0 0;



}



#mainBlog #mid{

padding:0 30px; 

border:1px solid #333;

}



#foot{

	clear:both;

	padding: 0px 0 0px 0;

}

#wrapCon{

	background:url(images/mid-wrap.png);

	width:990px;

	margin:0 auto;

	margin-top: 0px;

}



#top-box{

	margin:0 auto;

	height:53px;

	width:273px;

	background:url(images/box-sprite.png) no-repeat;

}



#top-box span{

	display:block;

	padding:12px 0 0 45px;

	color:#FFF;

}

#bot-box{

	width:273px;

	height:17px;

	margin:0 auto;

	background:url(images/box-sprite.png) no-repeat 0 -61px;

}

#images{

	width:273px;

	margin:0 auto;

	overflow:hidden;

	background:url(images/box-sprite.png) repeat-y -986px 0;

}

#images a{

	width:105px;

	height:91px;

	float:left;

	background:#000;

	border:1px solid #fff;

	margin:8px 0 10px 18px;

	display:inline;

	padding:1px;

}

#images a:hover{

	padding:1px;

	background:#000;

	border:1px solid #000;

	

}





.col_1{width:290px; float:left; background:transparent;}

.col_2{width:390px;float:left;background:transparent;}

.col_3{width:310px;float:left;background:transparent;}





#video{

	width:380px;

	height:314px;

	margin: 0 auto;

	margin-bottom: 15px;

	background: url( images/drgumVideo-bg.png) no-repeat;

}

#about{

	color:#333;

	font:12px/14px Arial, Helvetica, sans-serif;

	padding:5px 15px;

	background:url(images/box-sprite.png) repeat-y -1268px 0;

	height: 139px;

}

#about p.first:first-letter{ font-size: 50px; line-height: 50px; padding-right: 5px; float: left;}

#top-about{ background:url(images/box-sprite.png) no-repeat -280px 0; height:53px; width:390px;}

#top-about span{

	display:block;

	padding:12px 0 0 45px;

	color:#FFF;

}

#bottom-about{ background:url(images/box-sprite.png) no-repeat -280px -61px; height:18px; width:390px;}

#blog{

width:293px;

background:url(images/box-sprite.png) repeat-y -1668px 0;



margin:0 auto;

}

#blog h2{ padding:0; margin:0; font-size:14px;}

#blog h2 a{ text-decoration:none; }

#blog h2 a:hover{ color:orange;}



#blog-top{

width:293px;

height:58px;

background:url(images/box-sprite.png) no-repeat -680px 0;

margin:0 auto;

}



#blog-top span{

	display:block;

	padding:12px 0 0 45px;

	color: #fff;

}

#blog-bottom{ height:22px; width:293px; background:url(images/box-sprite.png) no-repeat -680px -67px; margin:0 auto;}

.innerBlog{

	height:450px;

	overflow:auto;

	margin:0 6px 0 0;

}

#content{padding:0 0 0 20px;}

#blog .entry{ padding:0 15px 0 1px;}

#blog .entry .more-link{ margin:10px 0 0 0; display:block;}

#blog .navigation .eventCall{font:12px arial;}

.postmetadata{font-size:12px; font-family:arial;}

.entry{

	font:12px/14px Arial, Helvetica, sans-serif;

	color:#343434;

	padding:5px 20px;

}

#foot .nav a{ background:none; width:auto; color:#fff;border:none; text-indent:0px; text-decoration:none; font:12px Arial, Helvetica, sans-serif; float:none; display:inline; }

#foot #policy{ float:left;  padding:15px 0 0 0; color:#FFF; font-size:12px; z-index: 900; position:relative;}

#foot #copyright{ float:right;  padding:15px 0 0 0; color:#FFF; font:12px Arial, Helvetica, sans-serif;}



#wrap-bot{

	background:url(images/bottom-wrap.png) no-repeat;

	width:990px;

	height:8px;

	margin:0 auto;

padding:0 0 20px 0;

}



/* color box */

#colorbox, #modalBackgroundOverlay, #modalWrap{position:absolute; top:0; left:0; z-index:9999;}

#modalBackgroundOverlay{position:fixed; width:100%; height:100%;}

#colorbox{overflow:hidden; padding:1px; margin-top:-1px; margin-left:-1px;}/*padding fixes a ghosting issue in IE7, the negative margin compensates */

	#modalWrap{width:9000px; height:9000px;}

		#modalContent, #borderTopLeft, #borderTopCenter, #borderTopRight, #borderBottomLeft, #borderBottomCenter, #borderBottomRight, #borderMiddleLeft, #borderMiddleRight {float:left; height:0; width:0; overflow:hidden;}

		#borderMiddleLeft, #borderBottomLeft{clear:left;}

		#modalContent{position:relative; overflow:visible;}

			#contentTitle{margin:0;}

			#modalClose, #contentPrevious, #contentNext{outline:none; cursor:pointer; border:0; margin:0;}

			#modalLoadedContent{overflow:auto; width:0; height:0;}

			#modalLoadedContent iframe{display:block; width:100%; height:100%; border:0;}

			#modalLoadedContent img#modalPhoto{display:block; border:0; margin:auto;}

			#modalLoadedContent embed{display:block; border:0;}/* Display:block removes the line-height gap underneath images, iframes, and embedded content */

			#modalLoadingOverlay{position:absolute; width:100%; height:100%; top:0; left:0;}







/*

ColorBox example user style

These rules are ordered and tabbed in a way that represents the order/nesting of the generated HTML,

in hope that this will make the relationship easier to understand. Thanks, jack@colorpowered.com

*/

#modalBackgroundOverlay{background:url(images/stripe.png) 0 0 repeat;}

#colorbox{ }

 #borderTopLeft{width:21px; height:21px; background:url(images/borderTopLeft.png) 0 0 no-repeat;}

 #borderTopCenter{height:21px; background:url(images/borderTopCenter.png) 0 0 repeat-x;}

 #borderTopRight{width:21px; height:21px; background:url(images/borderTopRight.png) 0 0 no-repeat;}

 #borderBottomLeft{width:21px; height:21px; background:url(images/borderBottomLeft.png) 0 0 no-repeat;}

 #borderBottomCenter{height:21px; background:url(images/borderBottomCenter.png) 0 0 repeat-x;}

 #borderBottomRight{width:21px; height:21px; background:url(images/borderBottomRight.png) 0 0 no-repeat;}

 #borderMiddleLeft{width:21px; background:url(images/borderMiddleLeft.png) 0 0 repeat-y;}

 #borderMiddleRight{width:21px; background:url(images/borderMiddleRight.png) 0 0 repeat-y;}

 #modalContent{background:#fff; position:relative; z-index:200;}

 #modalLoadedContent{margin-bottom:28px;}

 #contentTitle{position:absolute; bottom:3px; left:0; text-align:center; width:100%; background:#fff; font-weight:bold; color:#949494;}

 #contentCurrent{position:absolute; bottom:3px; left:58px; font-weight:bold; color:#949494;}

 #contentPrevious{position:absolute; bottom:0; left:0px; background:url(images/controls.png) -25px 0px no-repeat; width:25px; height:25px; text-indent:-9999px;}

 #contentPrevious:hover{background-position:-25px -25px;}

 #contentNext{position:absolute; bottom:0; left:27px; background:url(images/controls.png) 0px 0px no-repeat; width:25px; height:25px; text-indent:-9999px;}

 #contentNext:hover{background-position:0px -25px;}

 #modalLoadingOverlay{background:url(images/loading.gif) center center no-repeat #fff;}

 #modalClose{position:absolute; bottom:0; right:0; background:url(images/controls.png) -50px 0px no-repeat; width:25px; height:25px; text-indent:-9999px;}

 #modalClose:hover{background-position:-50px -25px;}

/* **************************************** END COLORBOX ******************************** */


