<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Casework | Design Studio</title>
<meta name="robots" content="index, follow" />
<meta http-equiv="imagetoolbar" content="no" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<!-- Basic CSS Style (other styles are included in this file) -->
<link rel="stylesheet" type="text/css" href="css/style.css" media="screen" />
<!--[if IE 8]>
<link rel="stylesheet" type="text/css" href="css/ie8.css" media="all" />
<![endif]-->
<!-- JavaScript Files -->
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="js/superfish.js"></script>
<script type="text/javascript" src="js/jquery.prettyPhoto.js"></script>
<script type="text/javascript" src="js/jquery.dimensions.js"></script>
<script type="text/javascript" src="js/jquery.tooltip.js"></script>
<script type="text/javascript" src="js/mosaic.1.0.1.js"></script>
<script type="text/javascript" src="js/custom.js"></script>
<script type="text/javascript">
$(document).ready(function(){
// Image Overlays and Captions
$('.zoom').mosaic({
opacity: 0.7
});
$('.play').mosaic({
opacity: 0.7
});
$('.link').mosaic({
opacity: 0.7
});
$('.info').mosaic({
opacity: 0.7
});
$('.plus').mosaic({
opacity: 0.7
});
$('.tooltip').mosaic({
opacity: 0.7
});
$('.fade').mosaic({
opacity: 0.7
});
if ( $.browser.msie ) {
$('.fade-black').mosaic({opacity: 0.7});
$('.fade-white').mosaic({opacity: 0.7});
} else {
$('.fade-black').mosaic();
$('.fade-white').mosaic();
}
$('.lower-panel').mosaic({
animation: 'slide'
});
$('.upper-panel').mosaic({
animation: 'slide',
anchor_y: 'top'
});
$('.lower-panel-inside').mosaic({
animation: 'slide',
hover_y: '40px'
});
$('.upper-panel-inside').mosaic({
animation: 'slide',
anchor_y: 'top',
hover_y: '40px'
});
$('.lower-panel-outside').mosaic({
animation: 'slide'
});
$('.upper-panel-outside').mosaic({
animation: 'slide',
anchor_y: 'top'
});
$('.slide-forward').mosaic({
animation: 'slide',
hover_x: '428px',
speed: 'normal'
});
$('.slide-backward').mosaic({
animation: 'slide',
hover_x: '-428px',
speed: 'normal'
});
$('.slide-downward').mosaic({
animation: 'slide',
hover_y: '-222px',
speed: 'normal'
});
$('.slide-upward').mosaic({
animation: 'slide',
hover_y: '222px',
speed: 'normal'
});
$('.slide-left-top').mosaic({
animation: 'slide',
hover_x: '-428px',
hover_y: '222px',
speed: 'normal'
});
$('.slide-right-top').mosaic({
animation: 'slide',
hover_x: '428px',
hover_y: '222px',
speed: 'normal'
});
$('.slide-left-bottom').mosaic({
animation: 'slide',
hover_x: '-428px',
hover_y: '-222px',
speed: 'normal'
});
$('.slide-right-bottom').mosaic({
animation: 'slide',
hover_x: '428px',
hover_y: '-222px',
speed: 'normal'
});
// Image Tooltip
//<![CDATA[
$(".imageTooltip a").tooltip({
showTitle: true,
track: true,
bodyHandler: function() {
return $("<img/>").attr("src", $(this).attr("rel"));
}
});
//]]>
// prettyPhoto
$(".imagebox a[rel^='prettyPhoto']").prettyPhoto({
theme:'light_square', // or "dark_square" for dark style
animation_speed: 'fast',
overlay_gallery: false
});
});
</script>
</head>
<body>
<!-- Start Wrapper -->
<div id="wrapper">
<!-- Start Header -->
<div class="top-header"></div>
<div id="header">
<div class="into-header">
<!-- Start Logo -->
<div class="logo">
<a href="index-2.html"><img src="images/logo.png" alt="Casework | Design Studio" title="Casework | Design Studio" /></a>
</div>
<!-- End Logo -->
<!-- Start Top Menu -->
<div class="topmenu">
<!-- Start Dropdown Menu -->
<ul id="menu" class="menu-nav">
<li class="parent"><a href="index-2.html">Home</a>
<ul class="child">
<li><a href="index-2.html">With Nivo Slider</a></li>
<li><a href="index_alter.html">With Thumbnail Slider</a></li>
</ul>
</li>
<li class="parent"><a href="#">Portfolio</a>
<ul class="child">
<li><a href="portfolio_full.html">Full Description Portfolio</a></li>
<li><a href="portfolio_2col.html">2-Column Portfolio</a></li>
<li><a href="portfolio_3col.html">3-Column Portfolio</a></li>
<li><a href="portfolio_4col.html">4-Column Portfolio</a></li>
<li><a href="portfolio_nav.html">Portfolio with Pagination</a></li>
<li><a href="portfolio_post.html">Portfolio Item Details</a></li>
<li><a href="quick_gallery.html">Quick Gallery</a></li>
</ul>
</li>
<li class="parent"><a href="#">Blog</a>
<ul class="child">
<li><a href="blog_overview.html">Blog Overview</a></li>
<li><a href="blog_post.html">Blog Post Page</a></li>
</ul>
</li>
<li class="parent current"><a href="#">Features</a>
<ul class="child">
<li><a href="typography_shortcodes.html">Typography & Shortcodes</a></li>
<li><a href="columns_pricing_table.html">Columns & Pricing Table</a></li>
<li><a href="javascript_additions.html">JavaScript Additions</a></li>
<li><a href="#">Page Layouts</a>
<ul class="grandchild">
<li><a href="right_sidebar.html">Page with Right Sidebar</a></li>
<li><a href="left_sidebar.html">Page with Left Sidebar</a></li>
<li><a href="full_width_page.html">Full Width Page</a></li>
<li><a href="half_width_page.html">Half Width Page</a></li>
</ul>
</li>
<li class="current"><a href="images_overview.html">Image Display Overview</a></li>
</ul>
</li>
<li><a href="contact.html">Contact</a></li>
</ul>
<!-- End Dropdown Menu -->
<!-- Start Social -->
<div class="social">
<ul>
<li><a href="#"><img src="images/social/twitter_off.png" alt="Twitter" title="Twitter" /></a></li>
<li><a href="