/*--------------------------------------------------------------------------- Browser reset ---*/ 
html{overflow-y:scroll;}
html,body,div,iframe,ul,ol,li,dl,dt,dd,blockquote,table,caption,tbody,tfoot,thead,tr,th,td,p,h1,h2,h3,h4,h5,h6,form,fieldset,label,legend,img,object,embed{padding:0;margin:0;border:0;font-size:100%;}
ul,ol{list-style:none;}
img{-ms-interpolation-mode:bicubic;}
table{border-collapse:collapse;}
caption,th,td{text-align:left;}
input,select,textarea{margin:0;font-family:inherit;font-size:100%;}
textarea{overflow-y:auto;}
blockquote:before,blockquote:after,q:before,q:after{content:"";}
blockquote,q{quotes:"" "";}
a:active{outline:0;}
body{background:#fff;color:#000;}
@font-face { 
	font-family:"crackingfont"; 
	src: url("fonts/CrackingFontGromit.eot"); 
	src: local("CrackingFontGromit"), 
		url("fonts/CrackingFontGromit.ttf") format("truetype");
}
.customfont {font-family:crackingfont;}

/*--------------------------------------------------------------------------- Utilities ---*/ 
.tr{text-align:right;}
.tc{text-align:center;}
.tl{text-align:left;}
.fl{float:left;}
.fr{float:right;}
.void{display:none;visibility:hidden;}
.hide{position:absolute !important;left:-999em;height:0;width:0;overflow:hidden;}

.cf:after, .li-cf li:after, .clearfix:after, #wallpaper-inner:after {content:'.';display:block;font-size:0;height:0;clear:both;visibility:hidden;} 
.cf, .clearfix, .li-cf li, #wallpaper-inner  {zoom:1;}

/*--------------------------------------------------------------------------- Base styles ---*/ 
body {font:13px/1.2 arial,sans-serif;
	background:#c5d1cc url(http://images.wallaceandgromit.com/2009/skin/bg/wallpaper.r1.jpg);color:#014B6A;} 
a {text-decoration:underline;}
input[type=submit], button {text-transform:capitalize;}
input[type=radio] {margin:0 .2em 0;vertical-align:middle;}
input[type=text],input[type=password],textarea,select { background-color:rgba(255, 255, 255, 0.3);}

h1,h2,h3 {/*text-shadow:.07em .07em .1em rgba(0, 0, 0, .2);*/padding:0 0 .3em;}
h1, h2 {font-family:crackingfont,georgia,serif;font-weight:normal;line-height:1;}
h1 {font-size:32px;}
h2 {font-size:34px; text-transform: uppercase;}
.no-fontface h1, 
.no-fontface h2 {line-height:1.1;word-spacing:0;font-family:georgia,serif;font-weight:bold;}
.no-fontface h1 {font-size:24px;}
.no-fontface h2 {font-size:22px;}

.clear {clear:both;}
.offScreen {position:absolute;left:-9999em;padding:0;margin:0;}

/*-------------------------------------------------------------------- Persistent elements ---*/
#wallpaper-outer {background:url(http://images.wallaceandgromit.com/2009/skin/bg/bg-tile-middle.jpg) repeat-y;width:1000px;}
#wallpaper-trim-1 {background:url(http://images.wallaceandgromit.com/2009/skin/bg/bg-tile-top.jpg) no-repeat;zoom:1;}
#wallpaper-inner {background:url(http://images.wallaceandgromit.com/2009/skin/bg/bg-tile-bottom.jpg) left bottom no-repeat;position:relative;zoom:1;}

#nav-related {position:absolute;right:-4px;top:26px;width:47px;height:217px;background:url(http://images.wallaceandgromit.com/2009/skin/tabs-new.png) no-repeat;}
	#nav-related a {position:absolute;text-indent:-999em;overflow:hidden;width:47px;height:40px;}
	#nav-related-1 a {top:4px;left:0px;}
	#nav-related-2 a {top:45px;left:4px;}
    #nav-related-3 a {top:81px;left:4px;}
    #nav-related-4 a {top:123px;left:8px;}
    #nav-related-5 a {top:162px;left:9px;}
		
#skip-links {font-size:0;}
	#skip-links a {position:absolute;text-decoration:none;}
	#skip-links a:focus,
	#skip-links a:active {position:fixed;z-index:100;font:bold 14px arial,sans-serif;
		color:#fff;background:#333;border:1px solid yellow;padding:.5em 1em;outline:0;}
		
#header {background-repeat:no-repeat;height:232px;position:relative;}

	
#nav-1 {height:590px;position:absolute;top:139px;}
	#nav-1 a {position:absolute;width:176px;height:46px;background:url(http://images.wallaceandgromit.com/2009/skin/bg/nav-new.png) -999em 0 no-repeat;
		text-indent:-999em;overflow:hidden;left:0;}

	#nav-1-films a {top:0px;left:0;}
	.Films #nav-1-films a,
	#nav-1-films a:hover {background-position:-196px 0;}

	#nav-1-characters a {top:46px;height:44px;}
	.Characters #nav-1-characters a,
	#nav-1-characters a:hover {background-position:-196px -46px;}
	
	#nav-1-about a {top:90px;height:34px;}
	.About #nav-1-about a,
	#nav-1-about a:hover {background-position:-196px -90px;}
	
	#nav-1-news a {top:90px;height:45px;}
	.calendar #nav-1-news a,
	#nav-1-news a:hover {background-position:-196px -90px;}
	
	#nav-1-download a {top:207px;height:44px;}
	.Download #nav-1-download a,
	#nav-1-download a:hover {background-position:-196px -207px;}
	
	#nav-1-game a {top:164px;height:44px;}
	.Games #nav-1-game a,
	#nav-1-game a:hover {background-position:-196px -164px;}
	
	#nav-1-ecards a {top:259px;height:38px;}
	.ECards #nav-1-ecards a,
	#nav-1-ecards a:hover {background-position:-196px -259px;}

	#nav-1-forum a {top:274px;height:48px;}
	.Forum #nav-1-forum a,
	#nav-1-forum a:hover {background-position:-196px -274px;}
	
	#nav-1-community a {top:350px;height:33px;}
	.Community #nav-1-community a,
	#nav-1-community a:hover {background-position:-196px -350px;}
	
	#nav-1-creations a {top:322px;height:40px;}
	.Creations #nav-1-creations a, 
	#nav-1-creations a:hover {background-position:-196px -322px;}
	
	#nav-1-shop a {top:377px;height:65px;}
	.Shop #nav-1-shop a,
	#nav-1-shop a:hover {background-position:-196px -377px;}
	
	#nav-1-schools a {top:495px;height:33px;}
	.Schools #nav-1-schools a,
	#nav-1-schools a:hover {background-position:-196px -495px;}

	#nav-1-charity a {top:441px;height:47px;}
	.Charity #nav-1-charity a,
	#nav-1-charity a:hover {background-position:-196px -441px;}

#nav-social {position:absolute;top:775px;}
	#nav-social a {position:absolute;height:35px;width:35px;text-indent:-99em;
		overflow:hidden;}
	#nav-social-facebook a {left:11px;}
	#nav-social-bebo a {left:55px;}
	#nav-social-myspace a {left:98px;}
	
#binder {position:absolute;top:0;bottom:60px;left:155px;width:58px;
	background:url(http://images.wallaceandgromit.com/2009/skin/bg/binder.png) 0 15px repeat-y;}

#column-1 {	float:left;width:178px;background:url(http://images.wallaceandgromit.com/2009/skin/bg/nav-new.png) 0 139px no-repeat;
	min-height:1139px;_height:1139px;}

.content {min-height:317px;_height:317px;position:relative;line-height:1.6;
	padding-bottom:125px;}
	.content a {}

#column-2 {width:810px;float:right;}

.bg-trim {background-color:#949866;width:770px;min-height:500px;_height:500px;}
.bg-trim h1,
.bg-trim h1 a,
.bg-trim h2,
.bg-trim h2 a,
.bg-trim h3,
.bg-trim h3 a,
.bg-trim-pad h1,
.bg-trim-pad h1 a,
.bg-trim-pad h2,
.bg-trim-pad h2 a,
.bg-trim-pad h3,
.bg-trim-pad h3 a {color:#027798;}

.content a,
.bg-trim a,
.bg-trim {color:#014B6A;}
.content a:hover,
.bg-trim a:hover {color:#014B6A;}

.ECards .bg-trim {min-height:804px;_height:804px;}
.Films .bg-trim {min-height:552px;_height:552px;}
.User .bg-trim {min-height:200px;_height:200px;}

.bg-trim {background:0;}
.bg-trim[class] {/*background:url(http://images.wallaceandgromit.com/2009/skin/bg/trans-white.png);*/
background:0;
	padding-top:10px;}
	
.bg-trim-pad {padding:20px 30px 30px 42px;width:698px;background:0;}
.bg-trim-pad[class] {/*background:url(http://images.wallaceandgromit.com/2009/skin/bg/trans-white.png);*/
background:0;
}

.Green .content,
.Green .bg-trim {color:#fff;overflow:hidden;}
.Green .bg-trim {background:#949866;color:#fff;}

.Green .content {}
.Green .content a,
.Green .content a:hover,
.Green .content h1,
.Green .content h2,
.Green .content h3 {color:#fff;}

#nav-footer {font-family:arial,sans-serif;position:absolute;bottom:50px;left:327px;
	zoom:1;padding:16px 0 16px 0;text-align:center;color:#014b6a;}
	#nav-footer li {display:inline;font-size:10px;line-height:1;padding:0 5px 0;border-left:1px solid;}
	#nav-footer li.first {background:0;border:0;}
	#nav-footer li a {color:#014b6a;white-space:nowrap;text-transform:uppercase;text-decoration:none;}
	#nav-footer li a:hover {text-decoration:underline;}

.flow-area {background:#949866;
	line-height:1.5;min-height:675px;_height:675px;}
	.flow-area p,
	.flow-area ul {padding:0 0 1em;}
	.flow-area ul {list-style:outside disc;padding-left:40px;}
	.flow-area li {padding-left:3px;}
	.flow-area a {}
	.flow-area a:hover {text-decoration:none;}
	.flow-area .pager {text-align:right;padding:10px 0 0;font-size:115%}
	.flow-area h1,
	.flow-area h2 {padding:0 0 .5em;}

.About .flow-area {color:#014B6A;padding-top:25px;}
	.About .flow-area h1 {color:#027798;}
	.About .flow-area a {color:#014B6A;}
	
	
	
#ticker {position:absolute;top:10px;left:80px;visibility:hidden;}
	#ticker a {width:465px;color:#027798;text-decoration:none;}
	#ticker a:hover {text-decoration:underline;}
	#ticker:before {font-weight:bold;content:'NEWS:';padding-right:5px;color:#014B6A;}
	
.Green #ticker {left:292px;width:300px;top:16px;}
.Green #ticker:before {content:'';}
.Green #ticker a {color:#fff;}
	
/*-------------------------------------------------------------------- Reusable styles ---*/
.alt-links a {text-decoration:none;}
.alt-links a:hover {text-decoration:underline;}

/*-------------------------------------------------------------------- Homepage ---*/
.Home .content {background:url(http://images.wallaceandgromit.com/2009/skin/bg/sketches.jpg) 34px 210px no-repeat;min-height:781px;_height:781px;font-family:arial,sans-serif;line-height:1.2;}
.Home #header {height: 353px;}
.Home .content h2,
.Home .content h3 {text-shadow:none;}

#home-calendar,
#home-promo-2,
#home-shop,
#home-news,
#home-community,
#home-competition {position:absolute;}


/* login */

#login {
    width: 675px;
    height: 35px;
    color: #014b6a;
    padding: 0 0 0 75px;
    font-size:12px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 100;
}

#login p {display:inline;}
#login a {color:#014b6a;}
#login a:hover {color:#000;}
#login input {vertical-align:middle;}
#login label  {padding-left:15px;}
#login input.text {width:120px;background:#faf6ec;border:1px solid #90a598;}
#login-register {position:absolute;right:62px;top:4px;}
#login #loggedIn {margin:0;padding:7px 0 0 20px;display:block;}

.buddy-requests, .buddies-online, .logout {
    background: url("http://images.wallaceandgromit.com/profile/message-icon.png") no-repeat scroll 0 7px transparent;
    float: right;
    height: 35px;
    padding: 0 0 0 26px;
    width: 126px;
    text-decoration: none;
}

.buddies-online { background-image: url("http://images.wallaceandgromit.com/profile/buddies-icon.png"); }

.logout { background-image: url("http://images.wallaceandgromit.com/profile/logout-icon.png"); }

.icon-text {
    float: left;
    font-weight: bold;
    margin-left: 2px;
    margin-top: 8px;
    text-decoration: underline;
}
.logout { width: 60px;}
.logout span { margin-left: 8px; }

.count-icon {
    background: url("http://images.wallaceandgromit.com/profile/notification-icon.png") no-repeat scroll 0 2px transparent;
    color: #FFFFFF;
    font-weight: bold;
    height: 19px;
    padding: 7px 0 0;
    text-align: center;
    width: 24px;
    font-size: 10px;
    float: left;
}
.login-meta {
    font-weight: bold;
    line-height: 32px;
}
/* end login */

.title {
    bottom: 112px;
    left: 33px;
    position: absolute;
    z-index: 2;
}


.Home #flashcontent
{
  margin-left: 27px;
}

#home-calendar
{
  left:31px;
  top:0;
  display: block;
  background: transparent url(http://images.wallaceandgromit.com/2010/home/calendar-home.png) scroll 190px 8px no-repeat;
  padding-left: 210px;
  padding-top: 17px;
  padding-right: 35px;
  width: 205px;
  height: 234px;
  text-align: center;
  color: #1f456d;
  text-decoration: none;
  font-family: Arial, Helvetica, sans-serif;
}
#home-calendar .diary-header
{
  padding: 13px 0;
  display: block;
  height: 14px;
  color: #fff;
  font-size: 0.6em;
  padding-left: 5px;
  letter-spacing: 2px;
}
#home-calendar .diary-years
{
  padding-right: 40px;
}
#home-calendar .event-date
{
  display: block;
  padding: 18px 0 2px;
  background: transparent url(http://images.wallaceandgromit.com/2010/home/calendar-home-divider.png) scroll center bottom no-repeat;
  font-family: crackingfont,georgia,serif;
  font-size: 2em;
  line-height: 0.9em;
  word-spacing: -0.0em;
}
#home-calendar .event-date sup
{
  vertical-align: middle;
  position: relative;
  font-size: 0.45em;
  top: -7px;
  left: 1px;
}
#home-calendar .event-short-desc
{
  display: block;
  font: 12px Helvetica, sans-serif;
  word-spacing: normal;
  padding: 12px 15px 0;
}
#home-calendar .calendar-CTA
{
  position: absolute;
  top: 0;
  left: 0;
}
#home-promo-2 {left:247px;top:546px;}
#home-competition {left:46px;top:262px;}

.home-dynamic .cta a {text-indent:-9999em;overflow:hidden;position:absolute;width:116px;height:38px;}
.home-dynamic .thumb {position:absolute;}

#home-shop {left:481px;top:-6px;width:282px;height:255px;background:url(http://images.wallaceandgromit.com/2010/home/shop-background.png) no-repeat;padding: 58px 0 0 0;}
	#home-shop .trim {padding:57px 30px 0 127px;color:#1f456d;}
	#home-shop h3 {color:#e92100;padding:0 0 .2em;}
	#home-shop .thumb {top:64px;left:7px;}
	#home-shop .price  {position:absolute;width:100px;font-size:18px;top:193px;
		left:10px;text-align:center;}
	#home-shop .cta  a {top:182px;left:127px;}

.shop-item {
    width: 282px;
    height: 100px;
    overflow: hidden;   
}    
    
.shop-thumb {
    width: 85px;
    height: 95px;
    padding: 5px 0 0 7px;
    overflow: hidden;
    float: left;
    background: url('http://images.wallaceandgromit.com/2010/home/shop-thumb-background.png') no-repeat;
}
.shop-detail {
    width: 190px;
    height: 100px;
    overflow: hidden;
    float: left;
    position: relative;
}
.shop-detail h3 { padding: 7px 47px 0 15px !important; }

.shop-price {
    width: 90px;
    height: 46px;
    overflow: hidden;
    display: block;
    background: url('http://images.wallaceandgromit.com/2010/home/shop-price-background.png') no-repeat;
    position: absolute;
    z-index: 1;
    bottom: 10px;
    left: -2px;
    text-align: center;
    font-weight: bold;
    font-size: 18px;
    line-height: 46px;    
}

.shop-buy {
    width: 102px;
    height: 39px;
    overflow: hidden;
    display: block;
    background: url('http://images.wallaceandgromit.com/2010/home/shop-buy-background.png') no-repeat;
    z-index: 1;
    text-indent: -9999px;
    bottom: 10px;
    right: 0;
    position: absolute;
}
	
#home-community {left:570px;top:264px;width:189px;height:274px;background:url(http://images.wallaceandgromit.com/2010/home/home-community.gif) no-repeat;}
	#home-community .trim {padding:179px 25px 0;color:#1f456d;text-align:center;}
	#home-community .desc {color:#ac2814;}
	#home-community .thumb {top:92px;left:46px;}
	#home-community .cta  a {top:236px;left:37px;}
	#home-community .user {color:#5c5d2a;}
	#home-community .user a {color:#5c5d2a;}
	#home-community .user a:hover {color:#000;}

#home-news {left:280px;top:260px;width:270px;height:242px;background:url(http://images.wallaceandgromit.com/2009/home/home-news.jpg) no-repeat;}
	#home-news h2 {padding:59px 30px 0 35px;text-align:center;font-family:arial,sans-serif;font-weight:bold;word-spacing:0;}
		#home-news h2  a {text-transform:uppercase;font-size:14px;color:#7f1b1b;text-decoration:none;
			display:block;height:62px;}
		#home-news h2  a:hover {color:#000;}
	#home-news h3 {padding:10px 30px 0;}
		#home-news h3  a {display:block;height:100px;text-indent:-9999em;overflow:hidden;}
		
/*-------------------------------------------------------------------- About W&G ---*/
.About #header {background-image:url(http://images.wallaceandgromit.com/2009/headers/about.jpg);
	background-position:0 0;height:241px;}
	
/*-------------------------------------------------------------------- Creations ---*/

#nav-creations {
    height: 57px;
    left: 28px;
    position: relative;
    top: 0;
    width: 387px;
}

#nav-creations ul {
    padding: 0;
    margin: 0;
}

#nav-creations ul li {
    padding: 0;
    margin: 0;
    float: left;
    display: block;
}

li.nav-current {
    width: 129px;
    height: 57px;
    background: url('http://images.wallaceandgromit.com/wip/creations/activeArrow.png') no-repeat bottom center;    
}

#nav-creations ul li a {
    width: 129px;
    height: 41px;
    display: block;
    background: url('http://images.wallaceandgromit.com/creation-button-sprite.png') no-repeat;
    text-indent: -9999px;
}

#nav-creations ul .nav-winners a {
    background-position: -129px 0;
}

#nav-creations ul .nav-runners a {
    background-position: -258px 0;
}


.no-fontface #nav-creations-links { font-size: 20px; word-spacing: normal;}

h2#blueSticker { position: relative; background: url(http://images.wallaceandgromit.com/wip/creations/sticker-blue.png) no-repeat; width: 201px;}
h2#blueSticker span { padding-top: 2px; width: 201px; display: block; color: #fff; line-height: 52px; font-size: 28px; text-align: center;}

.no-fontface h2#blueSticker span { display: block; font-family: georgia, serif; font-size: 16px; line-height: 52px; word-spacing: normal; width: 12.5em;}

h2#purple-sticker {background: url(http://images.wallaceandgromit.com/wip/creations/sticker-purple-left.png) no-repeat; padding-left: 15px;}
h2#purple-sticker span{background:transparent url(http://images.wallaceandgromit.com/wip/creations/sticker-purple-right.png) no-repeat scroll 100% 0;color:#FFFFFF;display:block;font-size:28px;line-height:52px;padding-left:5px;padding-right:20px;padding-top:2px;text-align:center;width:8em;}

.no-fontface h2#purple-sticker span { display: block; font-family: georgia, serif; font-size: 17px; line-height: 52px; word-spacing: normal; width: 12.5em;}

.Creations .intro_text {margin:0;padding:0;position:relative;left:20px; 
	top:-3px;font-size:18px;}
	.Creations  .content {line-height:1.2;}
.CreationsView .content {line-height:1.6;}

textarea#message { width: 510px; }
	
/*-------------------------------------------------------------------- Forum ---*/
.Forum .bg-trim,
.News .bg-trim {padding-top:0;padding-bottom:3em;} 
	
/*-------------------------------------------------------------------- Misc. legacy ---*/
div.clear {clear:both;line-height:0;font-size:0;}
hr {display:block;clear:both;border:0;width:770px;height:10px;
	background:url(http://images.wallaceandgromit.com/hr.gif) left top repeat-x;margin:15px 0;}
#home_skyscraper_adframe {	width:134px; height:627px;	background:url(http://images.wallaceandgromit.com/skyscraper_adframe.gif) no-repeat 0 0;	margin: 0 auto 0 auto;
	position:relative; top:20px;}
#home_skyscraper_internal {	width:120px; height:600px;	position:relative; top:19px; left:7px;}
#home_skyscraper_right_adframe {	width:134px; height:627px;	background:url(http://images.wallaceandgromit.com/skyscraper_adframe.gif) no-repeat 0 0;
	position:absolute; top:20px; left:1000px;}
#footer_leader_adframe {	width:751px; height:99px;	background:url(http://images.wallaceandgromit.com/ad_frame_leader_black.gif) no-repeat 0 0;
	position:relative; left:10px; top:5px;}
#footer_leader_internal {	width:728px; height:90px;	position:relative; left:17px; top:5px;}



/* christmas */

.christmas {
    background: url('http://images.wallaceandgromit.com/2010/home/christmas-repeat.jpg') repeat top left;
}

.christmas #wallpaper-inner {
    background-image: url('http://images.wallaceandgromit.com/2010/home/bg-tile-bottom-christmas.jpg');
}

.christmas #wallpaper-outer {
    background-image: url('http://images.wallaceandgromit.com/2010/home/book-repeat-christmas.png');
}

.christmas #wallpaper-outer {
    background-position: 0 0;
    position: relative;
}

.decoration { display: none; }

.christmas .decoration {
    position: absolute;
    z-index: 1000;
    background-image: url('http://images.wallaceandgromit.com/2010/home/christmas-objects.png'); 
    overflow: hidden;
    display: block;
}

.hat {
    width: 504px;    
    height: 154px;
    left: 0;
    bottom: 0;
}

.mince-pie {
    width: 85px;
    height: 140px;
    left: 0;
    top: 907px;
    background-position: -167px 180px;    
}

.large-ball {
    width: 57px;
    height: 102px;
    left: 0;
    top: 814px;
    background-position: -285px -154px;    
}

.cracker {
    width: 167px;
    height: 140px;
    left: 0;
    top: 600px;
    background-position: 0 -154px;    
}

.orange {
    width: 32px;
    height: 84px;
    left: 0;
    top: 487px;
    background-position: -380px -154px;      
}

.candy-cane {
    width: 38px;
    height: 180px;
    left: 0;
    top: 229px;
    background-position: -342px -154px;      
}

.small-ball {
    width: 33px;
    height: 84px;
    left: 0;
    top: 83px;
    background-position: -250px -154px;    
}

.holly {
    width: 203px;
    height: 124px;
    left: 0;
    top: 0;
    background-position: -412px -154px;    
}

/* fixes link inside div that is blocking the logo link */
.holly a {
    width: 203px;
    height: 124px;
    display: block;
}

.container-404 {
    width: 745px;
    height: 225px;
    background: url('http://images.wallaceandgromit.com/404-bg.png') no-repeat;
    margin: 20px 0 0 23px;
    position: relative;    
}

.container-404 p {
    color: #5D5231;
    font-family: crackingfont,georgia,serif;
    font-size: 35px;
    padding: 50px 46px 0 195px;
}

.container-404 a {
    bottom: 16px;
    display: block;
    height: 37px;
    position: absolute;
    right: 32px;
    text-indent: -9999px;
    width: 112px;
    z-index: 10;    
}

#f-login p { font-size: 12px; }
