/* @override 
	http://www.hookup.uncleleron.com/wp-content/themes/default-hookup/style.css
	http://hookup.dev/wp-content/themes/default-hookup/style.css
*/

@import url( <?php bloginfo('TEMPLATEPATH') ?>reset-fonts-grids.css );
body, div {
  text-align: left;
  margin: 0px;
  padding: 0px;

}

a:link, a:visited{
  color: #c9d0db;
}

a:hover, a:active {
color: white
}

a:focus, 
ul.mainNav li a:focus,
ul.location li a:focus {
outline-style: auto;
outline-color: rgba(255,0,0,.5);
outline-width: auto;
outline-offset: 1px;

}

ul.mainNav li a:focus {
outline-offset: 4px;
}

body.hasJs {
  overflow-x: auto;
  overflow-y: scroll;
  width: 100%;
  height: 100%;
}
.processed {
  border: 1px dotted red
}
body {
  background: black url(images/updated/bg-repeat-x.jpg) repeat-x scroll 0px 0px;
  color: #c9d0db;
  overflow-x: auto;
  overflow-y: scroll;
}


#bd {
  background: transparent url(images/updated/bg_only_sprite.jpg) no-repeat scroll -1024px 0px; 
  background-position: -1024px 0px;
  position: absolute;
  width: 1024px;
  left: 50%;
  margin-left: -512px;
  top: 0px;
  bottom: 0px;
  height: 800px;
  -webkit-transition-property: background-position, background-position-x;
  -webkit-transition-duration: 1s;
  -webkit-transition-timing-function: ease-in-out; 
/*   -webkit-transition: background-position-x 1s linear; */
}

body.dumbo #bd {
  background-position: 0px 0px;
 }

body #header {
  overflow: hidden;
  width: 750px;
  height: 302px;
  top: 0px;
  left: -284px;
  margin-left: 50%;
  position: absolute;
  background: transparent url(images/updated/header_sprite.png) no-repeat scroll 0px 0px
  
}

body.dumbo #header {
  background-position: -750px 0px
}

#bubble {
  position: absolute;
  right: 18px;
  font-size: 18px;
  font-weight: bold;
  font-style: oblique;
  width: 212px;
  height: 98px;
  top: 42px;
  color: #232323;
  text-align: center;
}

#bubble table {
height: 100%;
width: 100%;
}

#bubble table tr td {
	vertical-align: middle;
}

  #bubble-cell {
    height: 98px;
    width: 212px;
    overflow: hidden;
    position: relative;
  }
  #bubble-cell[id] {
    display: table;
    position: static;
  }
  
  body.msie #bubble-middle {
 	border: 1px solid red;
  	position: absolute ! important;
  	top: 50%;
  	display: block;
  }
  
  #bubble-middle {
    position: absolute;
    top: 50%;
  }
  /* for explorer only*/
  #bubble-middle[id] {
    display: table-cell;
    vertical-align: middle;
    position: static;
  }
  

  
  #bubble-inner {
    position: relative;
    top: -50%;
    text-align: center;
  }
  /* for explorer only */
  #inner[id] {
    position: static;
  }
  
  #bubble-inner p {
    padding: 4px;
  }


div.hide {
  display: none;
}

a, a:active, a:hover, a:visited {
  text-decoration: none;
  color: inherit;
}


/** MAIN NAV */

ul.mainNav {
  position: relative;
  background-color: #21242b;
  background-color: rgb(33, 36, 43);
  border-bottom: 1px solid black;
  padding-left: 232px;
  margin-top: 302px;
  }

ul.mainNav li {
  color: #bdc5ca;
  display: inline;
  display: inline-block;
  margin: 0px 1em 0px 0px ;
  height: 35px;
}

.msie ul.mainNav li {
  display: inline;
  
  margin: 0px 1.5em 0px 0px ;
}

ul.mainNav li.navlink a {
  font-size: 15px;
  display: inline;
  height: 13px;
  line-height: 35px;
  font-weight: bold;

  cursor: pointer;
}


ul.mainNav li:hover, ul.mainNav li a:hover {
  color: white;
}

ul.mainNav li.sel {
  color: white;
  height: 32px;
  border-bottom: 3px solid red;
}

ul.mainNav li.navlink.sel a, ul.mainNav li.navlink.sel a:link, ul.mainNav li.navlink.sel a:visited {
  color: white;
}

ul.location li.navlink a {
  font-size: 22px;
  height: 13px;
  font-weight: bold;

  cursor: pointer;
}



ul.location {
  color: #ccc;
  padding: 0px 10px 0px 10px;
  margin: 20px 10px;
}

ul.location.focus {
  color: white;
  padding-left: 7px;
  border-left: 3px solid red;
}
ul.location li {
  text-shadow: rgba(0,0,0,.75) 0px 5px 8px;
  font-size: 15px;
  font-weight: bold;
  line-height: 15px;
  text-transform: uppercase;
}

ul.location li a.mail {
  font-weight: normal;
  text-transform: none;
}

#header span.hidden {
margin-left: -10000px;
}


#middle {
  margin-left: 220px;
  margin-right: 0px;
  margin-top: 0px;
  position: absolute;
  width: 525px;
}


.contentContainer {
  margin-right: 0px;
  overflow: auto;
  padding: 14px 10px 20px;
}

body.hasJs .contentContainer {
display: none;
width: 520px;
position: absolute;
top: 0px;
}



.contentContainer p {
  text-align: left;
  font-family: "Georgia", "Times", "Times New Roman", "Serif";
  font-size: 15px;
  line-height: 21px;
  padding-bottom: .8em;
  z-index: 2;
  position: relative;
  color: white;
}


/*h1 {
  font-size: 1.5em;
  font-weight: bold;
  text-shadow: rgba(255,255,255,.5) 0px 1px 0px;
}*/

.contentContainer h1 {
  font-size: 44px;
  position: absolute;
  margin-top: -14px;
  margin-left: -10px;
  color: black;
  z-index: 0;
  text-transform: uppercase;
  opacity: .25;
  -moz-opacity: .25;
  width: 500px;
}

body.msie .contentContainer h1 {
  visibility: hidden;
} 

img.center {
text-align: center
}


.boxshadow {
  -webkit-box-shadow: rgba(0,0,0,.75) 0px 0px 15px;
}

/****** Table ***/

#left {
  position: absolute;
  padding: 0px;
  width: 220px;
  text-align: left;
}


#right {
margin-top: 10px;
position: absolute;
right: 15px;
text-align: center;
width: 220px;
}


img.post-image, img.post-image-right, .aligntwo, img.alignright {
  float: right;
  margin: 0px 0px 2px 10px;
}

img.post-image-left, .alignnone, img.alignleft {
  float: left;
  margin: 0px 10px 2px 0px;
}

li#the-mythBtn {
  opacity: 0;
  
  filter: alpha(opacity=0.01);
}

li#the-mythBtn.sel {
  opacity: 1;
  
  filter: alpha(opacity=100);
}

body.burg a#plasma {
display: none}

body.dumbo a#plasma {
display: block}

a#plasma {
height: 83px;
left: 339px;
position: absolute;
top: 10px;
width: 153px;
z-index: 10;
}

a#plasma img {
}

/*BLOG STUFS */

/*.blogContainer {
	background-color: rgba(255,255,255,0.17);
}*/

.ie .blogContainer .post {
	font-size: 13px;
	margin:  0px 0px 0px;
	padding:  20px 30px 0;
	background: url(images/sprite-blog-all.png) repeat-y -539px;
	
}



.blogContainer  a,
.blogContainer  a:link {
	color: #ea2d2e;
}

.blogContainer  a:active,
.blogContainer  a:hover {
	color: #c82629;
	text-decoration: underline;
}

.blogContainer .post.one-liners h2 {
	font-size: 18px;
	font-style: italic;
	text-align: center;
	color: #68696b;
	padding: 15px;
	font-weight: normal;
}

.blogContainer .post .postmetadata {
	text-align: left;
	float:  left;
	font-size: 12px;
	color: #a5a5a5;
	padding: 0px;
}
.blogContainer .post .date {
	text-align: right;
	font-size:  12px;
	color:  #a5a5a5;
	font-style: oblique;
	margin-left:  -21px;
	margin-right:  -20px;
	padding:  0px 20px 10px;
	border-bottom: 1px solid rgba(125,125,125,.25);
}

.post a.permalink {
	margin-left: 8px;
	color: #8aa5dc !important;
	width:  4px;
}

.blogContainer div.navigation {
	padding: 18px 8px 8px;
	margin: 0px 10px;
}

.blogContainer div.navigation.top{
	border-bottom: 1px solid #ddd;
}

.blogContainer div.navigation.bottom{
	padding-top: 4px;
	margin-top: 10px;
}

.blogContainer div.navigation div.alignleft{
	float:  left;
}

.blogContainer div.navigation div.alignright{
	text-align: right;
	height: 18px;
}

.blogContainer h2 {
	font-size: 18px;
	color: #464646;
	line-height: 23px;
	padding: 0px;
	font-weight: bold;
}
.blogContainer .post.one-liners .postmetadata,
.blogContainer .post.one-liners .entry {
	display: none;
}

.blogContainer .entry {
	margin-bottom:  10px;
	padding-bottom:  5px;
	border-bottom: 1px solid rgba(153,153,158,.3)
}

.blogContainer .entry p {
	color: #68696b;
	font-size:  15px;
	padding-bottom:  0px;
	margin:  4px 0px;
}

/* Single Post*/

/*.blogContainer .post-navigation{ 
background-color: white;
}*/
div.alignleft {
	float:  left;
}
div.alignright {
	text-align: right;
}

p.nocomments {
	padding:  0px;
	color:  #68696b;
	font-size:  13px;
}

#right ul {
	font-size: 13px;
	
	line-height: 15px;

	text-align: left;
}



#whats-new li.blog-header {
	background: transparent;	
	text-indent:-1000px;
	overflow:hidden;
	margin:  0px;
	padding: 0px;
	border:  none;
	height:  52px;
}

#whats-new li.blog-top h3 {
	font-size: 15px;
	font-weight: bold;
	font-style: oblique;
	text-align: center;
}

.ie #whats-new li.blog-header {
	background: url(images/sprite-blog-all.png) no-repeat -1617px 0;
	height: 65px;
	}

#whats-new li.blog-header a{
	background:transparent url(images/blog-header.png) no-repeat;
	height:  52px;
	display:  block;
	width:  220px;
	
	position: absolute;
}

#whats-new {
	width: 220px; 
	margin-left: 0px;
	padding-top: 0px;
	padding-bottom: 0px;
}
	
	#whats-new li .whats-new-date {

	font-size: 11px;
	line-height: 26px;
	color: #cdd5df;
	position: relative;
	text-align: right;
	font-style: italic;
	border-bottom: 1px dotted #ededed;
	margin-bottom:  8px;
	
	font-family: Georgia;
	}
#whats-new li a {
	position: relative;
	line-height:18px;
}
#whats-new li div.link {
    text-align: center;
}

#whats-new li div.link a {
	position: relative;
	font-size: 13px;
	font-weight: bold;
	color: #9ca9b8;
	font-style: italic;
	
}

#whats-new li div.link a:hover {
	text-decoration: underline;	
}


.ie #whats-new li {
	background: url(images/sprite-blog-all.png) repeat-y -1878px;
	margin:  0px;
	padding: 0px 20px 0px 10px;
	position: relative;
	padding-bottom: 10px;
}
#whats-new h3 {
    font-family: Georgia, Times, serif;
}

#whats-new li {
	border-left:  2px solid #fff;
	border-right:  2px solid #fff; 
	padding: 4px 12px;
	background-color: #fff;
}

#whats-new li.blog-top {
	border-top:  2px solid #fff;
	-webkit-border-top-left-radius: 12px;
	-webkit-border-top-right-radius: 12px;
	
	-moz-border-radius-topleft: 12px;
	-moz-border-radius-topright: 12px;
	padding-top:  12px;
	
	
}

#whats-new li.blog-footer{
	background-repeat: no-repeat;
	background-position: right bottom;
	border-bottom: 2px solid white;
	padding:  0px;
	-webkit-border-bottom-left-radius: 12px;
	-webkit-border-bottom-right-radius: 12px;
	
	-moz-border-radius-bottomleft: 12px;
	-moz-border-radius-bottomright: 12px;
}

.ie #blogTab, .ie #blog {
	background: url(images/sprite-blog-all.png) no-repeat scroll -1078px bottom;
	
}

#blogTab, #blog {
	margin-left: 0px;
	margin-top:  10px;
	z-index: 10;
	
	width: 539px;
	padding: 0;
	padding-bottom: 22px;
}

.ie #blogTab a.blogheaderimg, .ie #blog a.blogheaderimg {
	display: block;
	z-index: 11;
	text-indent: -1000px;
	overflow: hidden;
	width: 539px;
	background: url(images/sprite-blog-all.png) no-repeat;
	height: 65px;
}



.blogContainer {
	
	padding-top:  11px;
}

#blogTab, #blog {
	overflow: hidden;
	margin-left: -10px;
}

#blogTab a.blogheaderimg, #blog a.blogheaderimg {
	background:transparent url(images/blog-header.png) no-repeat;
	height: 52px;
	width: 215px;
	display: block;
	margin-left: 12px;
	text-indent: -1000px;
	overflow: hidden;
	position: relative;
	z-index: 8;
}

#blogWrapper {
	position: relative;
	z-index: 6;
	background-color: white;
	margin-left:  10px;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	-webkit-box-shadow: rgba(0,0,0,.3) 0px 1px 8px;
	-moz-box-shadow: rgba(0,0,0,.3) 0px 1px 8px;
    min-height: 320px;
}

 .blogContainer .post {
	font-size: 13px;
	margin:  0px 0px 0px;
	padding:  20px 30px 0;
	
}

#loadingBox {
	font-style: oblique;
	position: absolute;
	right: 10px;
	text-align: right;
	text-shadow: rgba(0, 0, 0, 0.492188) 0px 1px 3px;
	top: 32px;
}

#blogWrapper .post {
    -webkit-transition: opacity linear .2s .1s;
}

#blogWrapper.loading .post {
    opacity: .5;
    -webkit-transition-delay: 0s;
}

#blogWrapper img.alignnone {
    float: none;
}

/* this item will contain the logo divs below. */

#logobox {

	width:480px;
}

/* this is a class that'll be inserted manually into the "what we offer" page to contain the logos. Having manual control at the WP-page level will make it easier to add/subtract 'em as necessary */

.logo {
	width:80px;
	height:90px;
	padding-bottom:10px;
	float:left;
}