@charset "utf-8";
/* CSS Document */


html, body {
	margin: 0px;
	font-size:100%;
	line-height:1.125em;
	color: #333333;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	background-image: url(images/main-strip-backing.jpg);
	background-repeat: repeat-x;
	background-position: top;
}
p {
	font-size: 0.6875em;
	line-height: 1.6em;
	padding: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 20px;
	margin-left: 0px;
}
.graphic-strip-content p {
	font-size: 0.875em;
	color: #FFFFFF;
	width: 310px;
	display: block;
	font-weight: bold;
}

.quote {
}
.sub-text {
	margin-top: -8px;
}
.sub-text strong {
	color: #666666;
}
.quote-marks {
	font-size: 1em;
	color: #FF3366;
	padding-right: 1px;
	padding-left: 1px;
}
.highlight {
	color: #FF0066;
	font-weight: bold;
}

.address-text {
	font-size: 1em;
	line-height: 2.5em;
}
.address-text a {
	text-decoration: none;
}




h1 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 2.5em;
	color: #FFFFFF;
	font-weight: normal;
	line-height: 0.8em;
	padding: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 5px;
	margin-left: 0px;
	display: block;
	width: 320px;
	letter-spacing: -0.02em;
}
h2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.4em;
	font-weight: normal;
	color: #999999;
	line-height: 1.1em;
	padding: 0px;
	margin: 0px;
}
.content h2 {
	color: #666666;
	margin-bottom: 10px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.2em;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #FF3366;
	font-weight: bold;
	line-height: 0.9em;
	padding-bottom: 3px;
}

.content .feature-box h2 {
	padding: 0px;
	font-size: 1.6em;
	line-height: 1.3em;
	font-weight: normal;
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #FF0066;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 8px;
	margin-left: 0px;
	border-top-color: #CCCCCC;
	border-right-color: #CCCCCC;
	border-bottom-color: #CCCCCC;
	border-left-color: #CCCCCC;
}
#feedback h2 {
	color: #666666;
}
#latest h2 {
	color: #333333;
}

h3 {
	color: #666666;
	font-size: 0.875em;
	font-weight: bold;
	padding: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 6px;
	margin-left: 0px;
}
h4 {
	font-size: 0.8125em;
	padding: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 5px;
	margin-left: 0px;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-weight: bold;
	color: #993333;
}



a {
	color: #FF0066;
}
a:hover {
	color: #FF0000;
}
.clearing {
	clear: both;
	height: 1px;
}
#float-right {
	float: right;
	background-image: none;
}

#container {
	margin-right: auto;
	margin-left: auto;
}
.header-row {
}
.graphic-row {
	width: 100%;
	background-image: url(images/graphic-strip-backing.jpg);
	background-repeat: repeat-x;
	background-position: center top;
}
.content-row {
	background-image: url(images/content-row-backing.jpg);
	background-repeat: repeat-x;
	background-position: top;
}


.header {
	height: 160px;
	width: 800px;
	padding-bottom: 6px;
	margin-right: auto;
	margin-left: auto;
}
#logo {
	height: 127px;
	width: 250px;
	float: right;
	background-image: url(images/crackle-logo.jpg);
	background-repeat: no-repeat;
	background-position: center center;
	margin-top: 39px;
}
.logo-small {
	height: 99px;
	width: 190px;
	float: right;
}

#graphic-home {
	background-image: url(images/graphic-strip-home.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}



.graphic-strip {
	width: 800px;
	margin-right: auto;
	margin-left: auto;
	background-image: url(images/graphic-strip.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}
.graphic-strip-content {
	padding-top: 35px;
	padding-bottom: 30px;
	padding-left: 30px;
	width: 400px;
}

.content {
	background-image: url(images/content-backing.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	padding: 35px;
	width: 730px;
	margin-right: auto;
	margin-left: auto;
}
.content ul {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 20px;
	margin-left: 0px;
	padding: 0px;
}
.content li {
	display: block;
	font-size: 0.6875em;
	list-style-type: none;
	background-image: url(images/arrow.gif);
	background-repeat: no-repeat;
	background-position: left top;
	padding-left: 19px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 3px;
	margin-left: 0px;
}

.content .feature-box li {
	display: block;
	background-image: none;
	padding-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 3px;
	margin-left: 0px;
}

.content li a {
	display: block;
	background-image: url(images/arrow.gif);
	background-repeat: no-repeat;
	background-position: left top;
	padding-left: 19px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	text-decoration: none;
	color: #333333;
}
.content li a:hover {
	background-image: url(images/arrow-over.gif);
	background-repeat: no-repeat;
	background-position: left top;
	color: #FF0000;
}



.feature-box {
	width: 205px;
	float: left;
	background-image: url(images/feature-div-top.jpg);
	background-repeat: no-repeat;
	background-position: right top;
	padding-right: 15px;
	margin-right: 28px;
}
.feature-box-latest {
	width: 242px;
	height: 139px;
	float: left;
	margin-left: -10px;
}

.feature-box-latest a {
	width: 202px;
	height: 130px;
	background-image: url(images/latest-work-feature.jpg);
	background-repeat: no-repeat;
	background-position: left top;
	display: block;
	color: #FFFFFF;
	font-size: 0.75em;
	text-decoration: none;
	padding-top: 9px;
	padding-left: 40px;
}

.feature-box-latest a:hover {
	background-image: url(images/latest-work-feature-over.jpg);
	background-repeat: no-repeat;
	background-position: left top;
}
.footer {
	background-image: url(images/footer-top.gif);
	background-repeat: repeat-x;
	background-position: top;
	padding-top: 15px;
	padding-left: 10px;
	margin-right: -20px;
	margin-left: -20px;
	font-size: 0.9em;
	color: #999999;
	margin-top: 30px;
}
.portfolio-info-box {
	width: 180px;
	background-image: url(images/feature-div-top.jpg);
	background-repeat: no-repeat;
	background-position: right top;
	margin-right: 10px;
	padding-right: 15px;
}

.portolio-window {
	height: 370px;
	width: 542px;
	float: right;
	margin-right: -20px;
}

#portfolio-dsm {
	background-image: url(images/portfolio-dsm.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}

#portfolio-stonebank {
	background-image: url(images/portfolio-stonebank.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}

#portfolio-unwrapped {
	background-image: url(images/portfolio-unwrapped.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	padding-top: 385px;
	height: 0px;
}
#portfolio-unwrapped-xtra {
	background-image: url(images/portfolio-unwrapped-xtra.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}
#portfolio-heathcoat {
	background-image: url(images/portfolio-heathcoat.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	padding-top: 385px;
	height: 0px;
}
#portfolio-heathcoat-xtra {
	background-image: url(images/portfolio-heathcoat-xtra.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}


#portfolio-dkit-web {
	background-image: url(images/portfolio-dkit-web.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}

#portfolio-tomit-web {
	background-image: url(images/portfolio-tomit-web.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}
#portfolio-seddons-web {
	background-image: url(images/portfolio-seddons-web.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}
#portfolio-nad-web {
	background-image: url(images/portfolio-nad-web.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}
#portfolio-pennys-web {
	background-image: url(images/portfolio-pennys-web.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}
#portfolio-twomoors-web {
	background-image: url(images/portfolio-twomoors-web.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}
#portfolio-prisonstudy-web {
	background-image: url(images/portfolio-prisonstudy-web.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}
.portfolio-xtra {
	height: 217px;
	width: 542px;

}
.content-lower {
	margin-top: 30px;
	padding-top: 50px;
}










/******************************************************** THUMBNAILS ***************************************************/









.portfolio-box {
	border: 1px solid #FFFFFF;
	margin-bottom: 30px;
	padding-top: 10px;
	padding-right: 6px;
	padding-bottom: 6px;
	padding-left: 0px;
}
.portfolio-box ul {
	margin: 0px;
	padding: 0px;
	list-style-type: none;
}
.portfolio-box ul li {
	padding: 8px;
	list-style-type: none;
	float: left;
	margin-top: 0px;
	margin-right: 14px;
	margin-bottom: 14px;
	margin-left: 0px;
	background-image: url(images/thumb-backing.jpg);
	background-repeat: no-repeat;
	background-position: left top;
}
.portfolio-box ul li .thumb {
	display: block;
	height: 120px;
	width: 150px;
	border-bottom-width: 4px;
	border-left-width: 4px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	border-top-color: #666666;
	border-right-color: #666666;
	border-bottom-color: #666666;
	border-left-color: #666666;
	margin: 0px;
	padding: 0px;
}
.portfolio-xtra {
}










#thumb-dsm {
	background-image: url(images/thumb-dsm.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}


#thumb-stonebank {
	background-image: url(images/thumb-stonebank.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}


#thumb-unwrapped {
	background-image: url(images/thumb-unwrapped.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}


#thumb-heathcoat {
	background-image: url(images/thumb-heathcoat.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}


#thumb-art {
	background-image: url(images/thumb-art.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}

#thumb-art-print {
	background-image: url(images/thumb-art-print.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}

#thumb-planted {
	background-image: url(images/thumb-planted.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}

#thumb-prison {
	background-image: url(images/thumb-prison.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}

#thumb-seddons {
	background-image: url(images/thumb-seddons.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}

#thumb-dyslexikit {
	background-image: url(images/thumb-dyslexikit.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}
#thumb-two-moors {
	background-image: url(images/thumb-two-moors.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}


#thumb-pennys {
	background-image: url(images/thumb-pennys.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}

#thumb-tom {
	background-image: url(images/thumb-tom.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}








#thumb-art:hover {
	background-image: url(images/thumb-art-over.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}

#thumb-art-print:hover {
	background-image: url(images/thumb-art-print-over.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}

#thumb-planted:hover {
	background-image: url(images/thumb-planted-over.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}


#thumb-prison:hover {
	background-image: url(images/thumb-prison-over.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}

#thumb-seddons:hover {
	background-image: url(images/thumb-seddons-over.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}

#thumb-dyslexikit:hover {
	background-image: url(images/thumb-dyslexikit-over.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}
#thumb-two-moors:hover {
	background-image: url(images/thumb-two-moors-over.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}
#thumb-pennys:hover {
	background-image: url(images/thumb-pennys-over.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}

#thumb-tom:hover {
	background-image: url(images/thumb-tom-over.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}
#thumb-heathcoat:hover {
	background-image: url(images/thumb-heathcoat-over.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}
#thumb-unwrapped:hover {
	background-image: url(images/thumb-unwrapped-over.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}
#thumb-tfa:hover {
	background-image: url(images/thumb-tfa-over.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}
#thumb-dsm:hover {
	background-image: url(images/thumb-dsm-over.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}
#thumb-stonebank:hover {
	background-image: url(images/thumb-stonebank-over.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}



.content-box1 {
	width: 400px;
}
.latest-work-box {
	padding-top: 127px;
}
#latest-heathcoat {
	background-image: url(images/latest-heathcoat.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}
#latest-unwrapped {
	background-image: url(images/latest-unwrapped.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}
#latest {
	margin-right: 0px;
}
.newsletter-link {
	width: 204px;
	background-image: url(images/newsletter-link.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	display: block;
	padding-top: 130px;
	font-size: 0.6875em;
	margin-top: 30px;
}
