/*===============
Slipstream Studio
James Tetley
Developer
================*/

body{
	text-align: center;
	font-family:Helvetica, 'Helvetica Neue', Arial, sans-serif;
	font-size:12px;
    color:#333333;
    background:url("/assets/images/body.jpg") repeat-x 0 0;
    font-size:100%;
    font-size:12px;
}

.wrapper{
	clear:both;
}

.subwrapper{
	margin: 0 auto;
	text-align:left;
	width:960px;
	position:relative;
}

.content .subwrapper{
    background:url("/assets/images/wrapper.png") no-repeat 0 0;
    height:639px;
    z-index:2;
	margin:31px auto 284px;    
}

.footer{
    height:224px;
    background:url("/assets/images/footer.jpg") no-repeat 50% 0;
    z-index:1;
    position:fixed;
    bottom:0;
    width:100%;
}

.footer .subwrapper{
    height:224px;
    overflow:hidden;
}

.footer ul{
    position:absolute;
    bottom:13px;
    left:244px;
}

.footer li{
    float:left;
    margin:0 13px 0 0;
    font-size:11px;
    font-weight:bold;
    color:#747474;
}

.footer li a{
    color:#747474;
    text-decoration:underline;
}

.footer li a:hover{
    color:#e58232;
}

html:first-child .footer a.replacement{left:90px;}

@media screen and (-webkit-min-device-pixel-ratio:0){
    .footer a.replacement{left:690px;}
}

.footer a.replacement{
    bottom:13px;
    height:15px;
    position:absolute;
    right:220px;
    width:70px;
    background:url("/assets/images/sprite.png") no-repeat 0 0;
}

.footer a:hover{
    bottom:12px;
}

.item,
.item2,
.item3{
    overflow:hidden;
    position:absolute;    
}

.item,
.item3{
    height:426px;
    top:62px;
}

.item{
    left:5px;
    padding:39px 0 20px 25px;
    width:240px;   
}

.item2{
    height:612px;
    left:284px;
    top:6px;
    width:390px;
}

.item3{
    right:5px;
    padding:39px 13px 20px 6px;
    right:5px;
    width:239px;    
}

.the-item,
.the-item img{
    -webkit-border-top-left-radius: 4px;
    -webkit-border-top-right-radius: 4px;
    -moz-border-radius-topleft: 4px;
    -moz-border-radius-topright: 4px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

.the-item{
    width:390px;
    height:260px;
    overflow:hidden;
    display:block;
    margin-bottom:12px;
}

.link1,
.link2{
    height:61px;
    position:absolute;
    top:62px;
    width:62px;
    z-index:99;    
}

.link1{
    left:5px;
    background:url("/assets/images/sprite.png") no-repeat 0 -50px;
}

.link1:hover{
    background:url("/assets/images/sprite.png") no-repeat -62px -50px;    
}

.link2{
    right:5px;
    background:url("/assets/images/sprite.png") no-repeat -124px -50px;
}

.link2:hover{
    background:url("/assets/images/sprite.png") no-repeat -186px -50px;
}

.link3{
    background:url("/assets/images/sprite.png") no-repeat scroll 0 -151px transparent;
    height:96px;
    margin:20px 0 30px 44px;
    width:141px; 
}

.link4{
    height:59px;
    margin:52px 0 35px 20px;
    width:232px;
    background:url("/assets/images/sprite.png") no-repeat 0 -700px;
}

.link5{
    height:24px;
    width:132px;
    background:url("/assets/images/sprite.png") no-repeat 0 -794px;
    position:absolute;
    top:74px;
    left:100px;
    z-index:99;
}

.link6{
    height: 24px;
    width: 340px;
    background:url("/assets/images/sprite.png") no-repeat 0 -851px;
    z-index:99;
}

.link6:hover,
.link5:hover{
    filter:alpha(opacity=70);
	-moz-opacity:0.7;
	-khtml-opacity: 0.7;
	opacity: 0.7;	
}

.subwrapper .pos2{
	left:724px;
}

.title{
    background:url("/assets/images/sprite.png") no-repeat 0 -300px;
    width:263px;
    height:123px;
    margin:0 auto 20px;   
}

label{
    color:#747474;
    font-size:12px;
    padding:0 0 10px;
    font-weight:bold;
    display:block;
}

form{
    position:relative;
}

.text-field{
    width:239px;
    height:41px;
    background:url("/assets/images/sprite.png") no-repeat 0 -600px;
    position:relative;
    margin-left:-6px;    
}

.text-field input{
    border:0 none;
    left:7px;
    padding:6px 0 0 6px;
    position:absolute;
    top: 7px;
    width: 140px;
    font-family:Helvetica, 'Helvetica Neue', Arial, sans-serif;
    color:#747474;
    font-size:12px;
}

.submit input{
    background:url("/assets/images/sprite.png") no-repeat 0 -650px;    
    border:0 none;
    color:#4E6173;
    font-family:Helvetica, 'Helvetica Neue', Arial, sans-serif;
    font-size:12px;
    height:23px;
    padding:0;
    position:absolute;
    right:14px;
    top:33px;
    width:66px;
}

.submit input:hover{
    background:url("/assets/images/sprite.png") no-repeat -66px -650px;
}

.bd{
    padding:0 10px 20px 30px;
}

.book-link li,
.links li{
    margin:0 0 5px;
}

.book-link{
    bottom:10px;
    position:absolute;
    left:26px;    
}

.book-link img{
    margin:0 auto;
}

ul.links{
    bottom:10px;
    position:absolute;
    right:26px;
}

a.link{
    color:#4E6173;
    display:block;
    font-size:12px;
    font-weight:bold;
    padding:5px 0 4px 12px;
    width: 328px;
    background:url("/assets/images/sprite.png") no-repeat 0 -450px;
}

a.link:hover{
    background:url("/assets/images/sprite.png") no-repeat 0 -473px;
}

.controls{
    margin-left:10px;
}

.controls li a{
    display:block;
    padding:3px;
    border:1px solid #fff;
}

.controls li a.selected,
.controls li a:hover{
    border:1px solid #b1d1de;
}

.form {
    bottom:49px;
    left:25px;
    position:absolute;
}

.item3 .form{
    left:10px;
}

/* Typology
=========*/

h2{
    text-align:center;
}

h2,
h3{
    color:#6b8094;
    line-height:22px;
    font-size:14px;
    font-weight:bold;
    padding:0 0 12px;
}

p{
    font-size:12px;
    line-height:20px;
    padding:0 0 10px;
}

h2{
    color:#777777;
}

.item h4 a{
    left:27px;
}

h4 a{
    color:#e58232;
    font-size:12px;
    text-decoration:underline;
    bottom:23px;
    left:10px;
    position:absolute;    
}

h4 a:hover{
    bottom:22px;
    text-decoration:underline;    
}

/*
    ColorBox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}

/* 
    User Style:
    Change the following styles to modify the appearance of ColorBox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:url(/assets/images/cb/overlay.png) repeat 0 0;}
#colorbox{}
    #cboxTopLeft{width:21px; height:21px; background:url(/assets/images/cb/controls.png) no-repeat -101px 0;}
    #cboxTopRight{width:21px; height:21px; background:url(/assets/images/cb/controls.png) no-repeat -130px 0;}
    #cboxBottomLeft{width:21px; height:21px; background:url(/assets/images/cb/controls.png) no-repeat -101px -29px;}
    #cboxBottomRight{width:21px; height:21px; background:url(/assets/images/cb/controls.png) no-repeat -130px -29px;}
    #cboxMiddleLeft{width:21px; background:url(/assets/images/cb/controls.png) left top repeat-y;}
    #cboxMiddleRight{width:21px; background:url(/assets/images/cb/controls.png) right top repeat-y;}
    #cboxTopCenter{height:21px; background:url(/assets/images/cb/border.png) 0 0 repeat-x;}
    #cboxBottomCenter{height:21px; background:url(/assets/images/cb/border.png) 0 -29px repeat-x;}
    #cboxContent{background:#fff; overflow:hidden;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{margin-bottom:28px;}
        #cboxTitle{position:absolute; bottom:4px; left:0; text-align:center; width:100%; color:#949494;}
        #cboxCurrent{position:absolute; bottom:4px; left:58px; color:#949494;}
        #cboxSlideshow{position:absolute; bottom:4px; right:30px; color:#0092ef;}
        #cboxPrevious{position:absolute; bottom:0; left:0; background:url(/assets/images/cb/controls.png) no-repeat -75px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxPrevious:hover{background-position:-75px -25px;}
        #cboxNext{position:absolute; bottom:0; left:27px; background:url(/assets/images/cb/controls.png) no-repeat -50px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxNext:hover{background-position:-50px -25px;}
        #cboxLoadingOverlay{background:url(/assets/images/cb/loading_background.png) no-repeat center center;}
        #cboxLoadingGraphic{background:url(/assets/images/cb/loading.gif) no-repeat center center;}
        #cboxClose{position:absolute; bottom:0; right:0; background:url(/assets/images/cb/controls.png) no-repeat -25px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxClose:hover{background-position:-25px -25px;}

/*
  The following fixes a problem where IE7 and IE8 replace a PNG's alpha transparency with a black fill
  when an alpha filter (opacity change) is set on the element or ancestor element.  This style is not applied to or needed in IE9.
  See: http://jacklmoore.com/notes/ie-transparency-problems/
*/
.cboxIE #cboxTopLeft,
.cboxIE #cboxTopCenter,
.cboxIE #cboxTopRight,
.cboxIE #cboxBottomLeft,
.cboxIE #cboxBottomCenter,
.cboxIE #cboxBottomRight,
.cboxIE #cboxMiddleLeft,
.cboxIE #cboxMiddleRight {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);
}

/*
  The following provides PNG transparency support for IE6
  Feel free to remove this and the /ie6/ directory if you have dropped IE6 support.
*/
.cboxIE6 #cboxTopLeft{background:url(/assets/images/cb/ie6/borderTopLeft.png);}
.cboxIE6 #cboxTopCenter{background:url(/assets/images/cb/ie6/borderTopCenter.png);}
.cboxIE6 #cboxTopRight{background:url(/assets/images/cb/ie6/borderTopRight.png);}
.cboxIE6 #cboxBottomLeft{background:url(/assets/images/cb/ie6/borderBottomLeft.png);}
.cboxIE6 #cboxBottomCenter{background:url(/assets/images/cb/ie6/borderBottomCenter.png);}
.cboxIE6 #cboxBottomRight{background:url(/assets/images/cb/ie6/borderBottomRight.png);}
.cboxIE6 #cboxMiddleLeft{background:url(/assets/images/cb/ie6/borderMiddleLeft.png);}
.cboxIE6 #cboxMiddleRight{background:url(/assets/images/cb/ie6/borderMiddleRight.png);}

.cboxIE6 #cboxTopLeft,
.cboxIE6 #cboxTopCenter,
.cboxIE6 #cboxTopRight,
.cboxIE6 #cboxBottomLeft,
.cboxIE6 #cboxBottomCenter,
.cboxIE6 #cboxBottomRight,
.cboxIE6 #cboxMiddleLeft,
.cboxIE6 #cboxMiddleRight {
    _behavior: expression(this.src = this.src ? this.src : this.currentStyle.backgroundImage.split('"')[1], this.style.background = "none", this.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=" + this.src + ", sizingMethod='scale')");
}
