/* ------------------------------------------------------------------- */
/* ELEMENTS */

html { background: #282c15 url("/gfx/bg-body2.jpg") repeat-x top center; }

body { 
    color: #fff;
    font-size: 75%;
    font-family: Georgia, Times New Roman, Serif;
}

img, a, object { outline: none; border: none; }
input { outline: none; }

h1 { font-size: 1.6em; font-family: Arial, Sans-Serif; }
h2 { font-size: 1.5em;  }
h3 { font-size: 1.3em; font-weight: bold; }
p { font-size: 1.2em; line-height: 1.3em; padding-bottom: 20px; }
a { font-size: 1.2em; color: #fff; font-weight: bold; }
a:hover { color: #898a73; }

p a { font-size: 1em; }

em { font-style: italic; }

strong { font-weight: bold; }

/* ------------------------------------------------------------------- */
/* HEADER / LAYOUT */

#container { width: 990px; margin: 0 auto; }

#header { 
    height: 132px; 
    position: relative;
    background: #282c15 url("/gfx/bg-header2.jpg") no-repeat top left;
}


   #login, #loggedin {
        width: 203px;
        height: 54px;
        background: transparent url("/gfx/bg-login.jpg") no-repeat top left;
        position: absolute; 
        top: 0; 
        right: 12px;
     }
     
     #loggedin { background-image: url("/gfx/bg-loggedin2.jpg") !important; }
     
     #member-name { position: absolute; top: 0; right: 50px; width: 150px; font-size: 1.2em; font-weight: bold; overflow: hidden; }
     
    #login-link, #edit-profile-link { position: absolute; bottom: 8px; left: 15px; width: 80px; }
    #register-link, #logout-link { position: absolute; bottom: 8px; right: 15px; width: 80px; }
     
    #logo { position: absolute; bottom: 0; left: 24px; }
    
    #nav {
	position: absolute;
	top: 61px;
	right: 15px;

	
}
    
        #nav ul li { display: block; float: left; }
        
        #nav img { background-color:#282c15; background-image: url("/gfx/nav-main-sprite.jpg"); background-repeat: no-repeat; }
        
        #nav-ads a img { background-position: 0 -122px; }
        #nav-ads a:hover img { background-position: 0 -61px; }
        #nav-ads a.on img { background-position: 0 0; }
        
        #nav-fun a img { background-position: -121px -122px; }
        #nav-fun a:hover img { background-position: -121px -61px; }
        #nav-fun a.on img { background-position: -121px -0; }
        
        #nav-merchandise a img { background-position: -229px -122px; }
        #nav-merchandise a:hover img { background-position: -229px -61px; }
        #nav-merchandise a.on img { background-position: -229px -0; }
        
        #nav-ale a img { background-position: -360px -122px; }
        #nav-ale a:hover img { background-position: -360px -61px; }
        #nav-ale a.on img { background-position: -360px -0; }
        
		#nav-partners { margin-left:115px; }
        #nav-partners a img { background-position: -483px -122px; }
        #nav-partners a:hover img { background-position: -483px -61px; }
        #nav-partners a.on img { background-position: -483px -0; }
        
		
                                          



#content { position: relative; background: #282c15 url("/gfx/bg-content-shim-1.jpg") repeat-y top left; }
body.landing #content { padding-left: 48px; }
body.grid #content { padding-left: 39px; }
body.make #content { padding-left: 48px; }
body.no-pad #content { padding-left: 0 !important; }

#content-inner { width: 890px; background: #282c15 url("/gfx/bg-content-inner-shim.gif") repeat-y top left; }
div.content-inner-top img { width: 890px; background: #282c15 url("/gfx/bg-content-screws-sprite-1.jpg") no-repeat 0 -32px; }
div.content-inner-bottom img { width: 890px; background: #282c15 url("/gfx/bg-content-screws-sprite-1.jpg") no-repeat 0 0; }

#header-title {
    height: 145px;
    /*background: #282c15 url("/gfx/bg-header-title.jpg") no-repeat 0 0;*/
    text-align: center;
}

    #header-title h1 { color: #c3c2b5; text-transform: uppercase; padding-top: 62px; }
    
    #header-title ul { padding-top: 65px; }
    #header-title li { display: inline; }

 #login-overlay {
    position: relative;
    width: 488px;
    height: 291px;
    display: none;
    background: transparent url("/gfx/bg-login.gif") no-repeat top left;
    z-index: 9999;
                padding: 10px 0 0 15px;
}
 
#login-overlay #ctl00_btnSubmit {
    position: absolute;
    right: 19px;
    top: 69px;
    width: 103px; 
    height: 160px;
    background: transparent url("/gfx/btn-login-sprite.jpg") no-repeat top left;
 }
 
#login-overlay label  {
    display: block;
    width: 254px;
    height: 31px; 
    background-image: url("/gfx/bg-labels-signup-sprite.png");
    background-color: Transparent;
    background-repeat: no-repeat;
 }
 
 #login-overlay label span { margin-left: -10000px; }

/* 
#login-overlay input.etext {
    padding-bottom: 6px;
}
*/

#login-close {
    width: 38px;
    height: 38px;
    position: absolute;
    top : 10px;
    right: 24px;
}


/* ------------------------------------------------------------------- */
/* HOMEPAGE */

body.no-title #header-title {
    background-image: url("/gfx/bg-header-notitle.jpg");    
}
   

#home-carousel {
    height: 375px;
    background: #282c15 url("/gfx/bg-home-carousel.jpg") no-repeat top left;
    position: relative;
}

    #home-carousel-shadow {
        position: absolute;
        top: 7px;
        left: 72px;
        z-index: 999;
        width: 852px;
        height: 60px;
    }
    
    #home-carousel-ads {
        width: 799px !important;
        height: 292px;
        overflow: hidden;
        position: absolute;
        top: 34px;
        left: 95px;
    }
    
    #home-carousel-prev { 
        position: absolute;
        top: 147px;
        left: 37px;
        width: 54px;
        height: 79px;
    }
    
    #home-carousel-loader { position: absolute; top: 158px; left: 480px; z-index: 999999; background-color: #3A3333; padding: 10px;}
    
    #home-carousel-prev a img { background: #282c15 url("/gfx/btn-home-carousel-sprite3.gif") no-repeat 0 0; }
    #home-carousel-prev a:hover img { background-position: 0 -79px; }
    
    #home-carousel-next { 
        position: absolute;
        top: 149px;
        right: 36px;
        width: 54px;
        height: 79px;       
    }    
    
    #home-carousel-next a img { background: #282c15 url("/gfx/btn-home-carousel-sprite3.gif") no-repeat -54px 0; }
    #home-carousel-next a:hover img { background-position: -54px -79px; }
    
    li.home-ad { width: 809px; height: 292px; }
    
#home-panels { 
    width: 486px;
    height: 470px;
    float: left;
    top: 0; 
    left: 0;
    background: #282c15 url("/gfx/bg-home-panels.jpg") no-repeat top left; 
    padding-left: 10px;
}

    #home-panels #panel-title-1 { background: transparent url("/gfx/title-home-panels-sprite.jpg") no-repeat 0 -111px; }
    #home-panels #panel-title-2 { background: transparent url("/gfx/title-home-panels-sprite.jpg") no-repeat 0 -74px; }
    #home-panels #panel-title-3 { background: transparent url("/gfx/title-home-panels-sprite.jpg") no-repeat 0 -37px; }
    #home-panels #panel-title-4 { background: transparent url("/gfx/title-home-panels-sprite.jpg") no-repeat 0 0; }

#home-tv {
    float: left;
    width: 494px;
    height: 470px;
}


/* ------------------------------------------------------------------- */
/* SIGNUP FORM */

 #terms-overlay {
    position: relative;
    width: 629px;
    height: 467px;
    display: none;
    background: transparent url("/gfx/bg-terms.gif") no-repeat top left;
    z-index: 9999;
}

#terms-overlay-text {
    width: 523px;
    height: 275px;
    position: absolute;
    top: 85px;
    left: 44px;
    overflow: auto;
    color: #000;
}

#terms-close {
    width: 35px;
    height: 35px;
    position: absolute;
    top : 10px;
    right: 10px;
}

#password-form {
    background: #333d3d url("/gfx/bg-password-form.gif") no-repeat 0 20px;
    height: 200px;
    margin: 0 10px;
    padding-left: 85px;
    padding-top: 22px;
    position: relative;
 }
 
#signup-form {
	background: #333d3d url("/gfx/bg-signup-form-op.gif") no-repeat 0 20px;
	margin: 0 10px;
	padding-left: 85px;
	padding-top: 22px;
	position: relative;
 }
 
  #signup-submit {
    position: absolute;
    bottom: -186px;
    right: 50px;
}

 #signup-submit input {
    width: 204px;
    height: 203px;
    background: #333d3d url("/gfx/btn-signup-sprite.jpg") no-repeat 0 0;
 }
 
 #signup-form div.form-label label,
 #password-form div.form-label label { 
     display: block;
     width: 254px;
     height: 31px;
    background-image: url("/gfx/bg-labels-reg-sprite.png");
    background-color: Transparent;
    background-repeat: no-repeat;
 }
 
 #signup-form div.form-label label span,
 #password-form div.form-label label span { margin-left: -10000px; }
  
 #signup-agreement {
    width: 580px;
    height: 120px;
    margin: 40px 0 0 50px;
 }

  #signup-agreement div.clearfix { padding-bottom: 8px; padding-left: 45px; }
  
  #age-dropdown {
        background: #333d3d url("/gfx/bg-form-singular.gif") no-repeat bottom right;
		padding: 17px 0 0 11px;
        height: 41px;
        width: 58px;
        
  }

/* ------------------------------------------------------------------- */
/* FUN STUFF */

#tab-funstuff li a img  { background-image: url("/gfx/bg-titlebar-funstuff-sprite.jpg"); background-color: transparent; background-repeat: no-repeat;}

#tab-makeyourownad a img { background-position: 0 0; }
#tab-youradgallery a img { background-position: -173px 0; }
#tab-traitorsgallery a img { background-position: -334px 0; }
#tab-thingswelike a img { background-position: -503px 0; }
#tab-thingswevemade a img { background-position: -658px 0; }

#tab-makeyourownad a:hover img,
#tab-makeyourownad.on img { background-position: 0 -35px; }
#tab-youradgallery a:hover img,
#tab-youradgallery.on img { background-position: -173px -35px; }
#tab-traitorsgallery a:hover img,
#tab-traitorsgallery.on img { background-position: -334px -35px; }
#tab-thingswelike a:hover img,
#tab-thingswelike.on img { background-position: -503px -35px; }
#tab-thingswevemade a:hover img,
#tab-thingswevemade.on img { background-position: -658px -35px; }

#funstuff-top {
    margin-left: 48px;
    height: 371px;
    position: relative;
}

div.funstuff-btn {
    position: absolute;
    bottom: 0;
    padding: 10px 0 0 20px;
    width: 240px;
    height: 28px;
    background: transparent url("/gfx/btn-funstuff-sprite.gif") no-repeat 0 0;
    cursor: pointer;     
}

#btn-rating {  left: 0; background-position: 0 -38px; }
#btn-user-ads { left: 270px; }
div.funstuff-btn a { text-decoration: none; }

#funstuff-top div.rating-explained {
    position: absolute;
    z-index: 10;
    top: 333px;
    left: 0;
    height: 340px;
    width: 260px;
     background: transparent url("/gfx/btn-funstuff-sprite.gif") no-repeat bottom left; 
     cursor: pointer;   
}
.rating-explained h3 { font-size: 1.2em; padding: 10px 0 0 20px; }
.rating-explained p { padding: 17px 20px; }
.rating-explained dl { position: absolute; top: 103px; left: 0; z-index: 20; }
.rating-explained dt { margin: 0 0 7px 20px; }
.rating-explained dd { font-weight: bold; margin: 0 0 20px 20px;}

#user-ads-latest {
    position: absolute;
    top: 0;
    left: 550px;
    width: 330px;
}

    #user-ads-title { padding: 8px 0 10px 35px; }
    
    .user-ad-small { padding: 10px 0 15px 0; background: #343C3E url("/gfx/bg-divider-shim.gif") repeat-x bottom left; cursor: pointer;}
    .user-ad-thumb { float: left; padding-right: 10px; }    
    .user-ad-info { float: left; }
    .hover { background-color: #ccc; }
    
    #user-ads-latest div.last { background: none; }

#panel-traitorsgallery { float: left; padding-left: 36px; /*position: relative;*/  }
#panel-traitorsgallery img { width: 256px; height: 416px; z-index: 0;}

#panel-thingswelike { 
    position: relative; 
    width: 330px; 
    height: 416px; 
    float: left; 
    background: #000 url("/gfx/gfx-panel-thingswelike.jpg") no-repeat top left;
    z-index: 0 !important;
}
#panel-thingswelike-window { 
    width: 154px; 
    height: 157px; 
    position: absolute; 
    top: 69px; 
    left: 85px; 
    overflow: hidden; 
    background-color: Transparent;
    z-index: 15;
}
#panel-thingswelike-description { 
    position: absolute;
    z-index: 5;
    bottom: 190px; 
    left: 85px; 
    width: 154px;
    height: 97px;
    background-color: #000;
}

#panel-thingswelike-description p.small { padding: 5px; text-align: center; }
    
#panel-thingswevemade { float: left; background-repeat: no-repeat; background-position: 35px 86px; }    
#frame-thingswevemade { width: 335px; height: 416px; }

/* ------------------------------------------------------------------- */
/* PRESS ADS */
#tab-adverts li a img  { background-image: url("/gfx/bg-titlebar-pressads-sprite.jpg"); background-color: transparent; background-repeat: no-repeat;}

#tab-classic a img { background-position: 0 0; }
#tab-toprated a img { background-position: -122px 0; }
#tab-football a img { background-position: -254px 0; }
#tab-rugby a img { background-position: -378px 0; }
#tab-cricket a img { background-position: -488px 0; }
#tab-other a img { background-position: -604px 0; }
#tab-tv a img { background-position: -709px 0; }
 
#tab-classic a:hover img,
#tab-classic.on img { background-position: 0 -34px; }
#tab-toprated a:hover img,
#tab-toprated.on img { background-position: -122px -34px; }
#tab-football a:hover img,
#tab-football.on img { background-position: -254px -34px; }
#tab-rugby a:hover img,
#tab-rugby.on img { background-position: -378px -34px; }
#tab-cricket a:hover img,
#tab-cricket.on img { background-position: -488px -34px; }
#tab-other a:hover img,
#tab-other.on img { background-position: -604px -34px; }
#tab-tv a:hover img,
#tab-tv.on img { background-position: -709px -34px; }


div.ad-panel { 
    float: left; 
    width: 283px; 
    height: 170px; 
    margin: 0 5px 0 8px;
    padding-bottom: 57px;
}

div.ad-panel div.frame-title { margin-left: 10px; margin-bottom: 10px;  }
div.ad-panel div.frame-title a { 
    background-color: transparent; 
    background-image: url("/gfx/bg-titlebar-261x37-sprite.jpg"); 
    background-repeat: no-repeat;
    display: inline-block;
}

div.ad-panel div.frame-title a:hover {
    background-position: 0 -37px;
}

div.ad-panel div.frame-title a span {
    display: block;
    width: 261px;
    height: 37px;
    background-color: transparent; 
    background-image: url("/gfx/title-ads-landing-sprite.png"); 
    background-repeat: no-repeat;
}
div.ad-panel div.frame-title a span span { margin-left: -10000px; }

#advert-main {
    width: 863px;
    height: 391px;
    margin: 0 0 20px 20px;
    background-position: 14px 12px;
    background-repeat: no-repeat;
    background-color: Transparent;
}

#advert-carousel-container {
    width: 848px;
    height: 258px;
    margin-left: 20px;
    background: #333d3d url("/gfx/bg-carousel-ads.gif") no-repeat top left;
    position: relative;  
}

#advert-carousel {
    overflow: hidden;
    top: 35px;
    left: 139px;
    position: absolute;  
    width: 564px;
    height: 93px;
}

#advert-carousel-prev { 
    position: absolute;
    top: 55px;
    left: 84px;
    width: 52px;
    height: 52px;
}
    
#advert-carousel-prev a img { background: #000 url("/gfx/btn-ads-carousel-sprite.gif") no-repeat 0 0; }
#advert-carousel-prev a:hover img { background-position: 0 -52px; }

#advert-carousel-next { 
    position: absolute;
    top: 55px;
    right: 87px;
    width: 52px;
    height: 52px;       
}    

#advert-carousel-next a img { background: #000 url("/gfx/btn-ads-carousel-sprite.gif") no-repeat -52px 0; }
#advert-carousel-next a:hover img { background-position: -52px -52px; }

#advert-carousel-key { 
    position: absolute; 
    top: 231px;
    left: 320px;
    width: 205px;
    text-align: center;
}
#advert-carousel-key ul { display: inline; padding-left: 20px; }
#advert-carousel-key li { display: inline; list-style: none; padding: 0 1px; }
#advert-carousel-key li.on a { color: #898a73; }


.press-ad,
.tv-ad {
    background-repeat: no-repeat;
    background-position: center center;
    background-color: Transparent;
    width: 131px;
    height: 93px;
    margin: 0 5px;
    float: left;
}

a.press-frame-link {
    display: block;
    width: 131px;
    height: 93px;
    text-decoration: none !important;
    background: transparent url("/gfx/gfx-frame-pressads-thumb.png") no-repeat top left;
}

span.press-frame {
    /*display: block;
    width: 131px;
    height: 93px;
    background: transparent url("/gfx/gfx-frame-pressads-thumb.png") no-repeat top left;*/
}

a:hover  { background-position: 0 -93px; }

#advert-info-title {
    position: absolute;
    top: 10px;
    left: 10px;
    width: 400px;
}

#advert-info-rating {
    position: absolute;
    top: 50px;
    left: 10px;
    width: 400px;
}

#advert-info #social-links {
    position: absolute;
    top: 10px;
    right: 10px;
    left: auto;
    width: 350px;
}

#advert-info-download {
    position: absolute;
    top: 50px;
    right: 10px;
    width: 350px;
}

#advert-info h3 { width: 80px; text-align: right; float: left; padding-right: 20px; }
#advert-info-title p { float: left; width: 300px; }
#advert-info-download h3 { padding-top: 2px; }
#advert-info #social-links h3 { padding-top: 2px; }
#advert-carousel-key h3 { display: inline;  padding-right: 0;  }

#advert-info div.rating { float: left; margin-top: 9px; }
#advert-info div.rating-panel { position: absolute; z-index: 20; top: 50px; left: 104px; }

/* ------------------------------------------------------------------- */
/* TV ADS */

#tv-container {
    margin-left: 75px;
    position: relative;
}

#tv-carousel-container {
    background: transparent url("/gfx/bg-tv-player-carousel.gif") no-repeat top left;
    width: 737px;
    height: 234px;
    position: relative;
}

#tv-carousel-container #advert-carousel { top: 9px; left: 87px; }
#tv-carousel-container #advert-carousel-key { top: 125px; left: 220px; }
#tv-carousel-container #advert-carousel-prev { top: 26px; left: 29px; }
#tv-carousel-container #advert-carousel-next { top: 26px; right: 32px; }

#tv-carousel-container #advert-carousel-next a img { background: transparent url("/gfx/btn-tv-carousel-sprite.gif") no-repeat -52px 0; }
#tv-carousel-container #advert-carousel-prev a img { background: transparent url("/gfx/btn-tv-carousel-sprite.gif") no-repeat 0 0; }

#social-links2 { 
    background: transparent url("/gfx/bg-social-links2.gif") no-repeat top left; 
    width: 283px;
    height: 70px;
    margin-left: 225px;
}
#social-links2 h3 { display: none; visibility: hidden; }
#social-links2 ul {
    padding: 22px 0 0 49px;
}

div.with-synopsis {
    height: 354px !important;
    background-image: url("/gfx/bg-tv-player-carousel2.gif") !important;
}
div.with-synopsis #advert-carousel-key {
    top: 240px !important;
}

#synopsis {
    width: 530px;
    height: 84px;    
    position: absolute;
    top: 133px;
    left: 100px;
}

/* ------------------------------------------------------------------- */
/* TRAITORS GALLERY */
#traitors-header {
    background: transparent url("/gfx/bg-traitors-gallery-header.jpg") no-repeat 10px 0;
    height: 410px;
    position: relative;
}

#upload-link {
    position: absolute;
    left: 40px;
    top: 212px;
    width: 449px;
    height: 203px;
}

div.traitor-photo { position: absolute; top: 0; left: 0; }
div.traitor-frame { position: absolute; top: 0; left: 0; z-index: 10; }
div.traitor-info { position: absolute; bottom: 0; left: 0; width: 100%; text-align: center; }

#traitor-main {
    position: absolute;
    right: 170px;
    top: 0;
    width: 277px;
    height: 282px;
}

#traitor-main div.traitor-photo img { width: 182px; height: 243px; margin: 6px 0 0 46px; }

#traitors-gallery { position: relative; width: 100%; }

#traitors-gallery div.traitor { float: left; position: relative; height: 240px; /* cursor: pointer */ }

#traitors-gallery div.landscape { width: 221px; margin: 0 0 15px 5px; } /* height: 216px; */
#traitors-gallery div.landscape div.traitor-photo img { width: 208px; height: 156px; margin: 28px 0 0 8px; }
#traitors-gallery div.landscape div.traitor-frame { width: 221px; height: 240px; } 

#traitors-gallery div.portrait { width: 213px; margin: 0 5px 15px 5px; } /*  height: 223px; */
#traitors-gallery div.portrait div.traitor-photo img { width: 156px; height: 208px; margin: 8px 0 0 28px; }
#traitors-gallery div.portrait div.traitor-frame { width: 213px; height: 240px; }

#tooltip  {
    display:none; 
    width: 209px;
    height: 122px;
    background: transparent url("/gfx/bg-tooltip.png") no-repeat top left;
    z-index: 100;
    text-align: center;
}
#tooltip-text {
    text-align: center;
    padding: 20px;
}

/* ------------------------------------------------------------------- */
/* TRAITORS GALLERY - UPLOAD */

#traitor-step-1 { margin-bottom: 20px; }

#traitor-step-2,
#traitor-step-3 { 
    position: relative;
    float: left; 
    width: 430px; 
    height: 266px; 
    background: transparent url("/gfx/bg-panel-small.gif") no-repeat top left; 
    text-align: center; }

#traitor-step-2 { margin: 0 15px; }

#traitor-step-4 { text-align: center; margin-top: 20px;}

#num-1, #num-2, #num-3 {
    height: 45px; background: transparent url("/gfx/gfx-upload-123-sprite.gif") no-repeat top left; vertical-align: middle;
}
#num-1 { width: 22px;  }
#num-2 { width: 37px; background-position: -22px 0; margin: 20px 0 10px 0; }
#num-3 { width: 35px; background-position: -58px 0; margin: 20px 0 10px 0; }

#title-1, #title-2, #title-3 {
    width: 254px; height: 31px; background: transparent url("/gfx/title-upload-sprite.gif") no-repeat top left; vertical-align: middle; margin: 0 10px;
}
#title-2 { background-position: 0 -31px; margin-bottom: 10px; }
#title-3 { background-position: 0 -62px; margin-bottom: 10px; }
#sign-or-register-small { 
    display: inline-block;
    vertical-align: middle;
    width: 177px; 
    height: 26px;
    line-height: 25px; 
    text-align: center; 
    background: transparent url("/gfx/bg-sign-or-register-small.gif") no-repeat top left; 
}
#sign-or-register { 
    display: inline-block;
    vertical-align: middle;
    width: 177px; 
    height: 29px; 
    text-align: center; 
    background: transparent url("/gfx/bg-sign-or-register.gif") no-repeat top left; 
    padding-top: 8px;
}
#traitor-step-2 #traitors-gallery div.landscape { margin: 10px 0 15px 95px; }
#traitor-step-2 #traitors-gallery div.portrait { margin: 10px 0 15px 95px; }

#traitor-step-4 { position: relative; height: 142px; }
#traitor-step-4 #create-push-button { margin-left: 220px; }
#ctl00_MainContent_btnTraitorSubmit { 
    background: transparent url("/gfx/btn-submit-traitor-sprite.gif") no-repeat 0 0;
    width: 100px;
    height: 117px;
    position: absolute;
    top: 19px;
    right: 48px;
}

#traitor-description {
    width: 335px;
    height: 100px;
    margin-left: 50px;
    background: transparent url("/gfx/bg-traitor-description.gif") no-repeat top left;
    position: relative;
}

#traitor-description textarea {
    background-color: Transparent;
    border: none;
    width: 292px;
    height: 66px;
    position: absolute;
    top: 15px;
    left: 18px;
}

/* ------------------------------------------------------------------- */
/* MAKE YOUR OWN AD */
#create-step-1 {
    float: left;
    width: 549px;
    height: 136px;
    background: transparent url("/gfx/bg-create-step1.gif") no-repeat top left;
    position: relative;
}

#create-step-1 p { width: 450px; margin-left: 50px; padding: 10px 0 15px 0; }

#create-step-1 div.step { padding-left: 30px; }

#create-inspiration { float: left; padding: 0 0 20px 20px; }

#create-inspiration p { padding: 0 0 10px 0; }

#create-step-4 { padding: 20px 0 10px 0; }
#create-push-button { 
    background: transparent url("/gfx/bg-push-button.jpg") no-repeat top left; 
    width: 386px; 
    height: 142px; 
    margin-top: 20px; 
    position: relative;
}
#create-step-4 #ctl00_MainContent_btnAdSubmit { 
    background: transparent url("/gfx/btn-submit-ad-sprite.gif") no-repeat 0 0;
    width: 100px;
    height: 117px;
    position: absolute;
    top: 19px;
    right: 48px;
}

#create-step-4 #ctl00_MainContent_btnAdConfirm { 
    background: transparent url("/gfx/btn-confirm-ad-sprite.gif") no-repeat 0 0;
    width: 100px;
    height: 117px;
    position: absolute;
    top: 19px;
    right: 48px;
}

#create-step-4 p { padding: 20px 0 40px 140px; }
#your-ad-preview { width: 398px; height: 226px; margin-left: 60px; }



/* ------------------------------------------------------------------- */
/* MERCHANDISE */
div.merchandise-panel { width: 438px; position: absolute; z-index: 10;}
div.merchandise-panel-text { float: left; width: 175px; height: 223px; padding-left: 20px; position: relative; }
div.merchandise-panel-text p { font-style: italic; }

div.merchandise-btn { position: absolute; bottom: 0; left: 20px; }
div.merchandise-btn a img {  background: transparent url("/gfx/btn-order-sprite.jpg") no-repeat 0 0; }
div.merchandise-btn a:hover img {  background-position: 0 -62px; }

#merchandise-panels { position: relative; height: 810px; }
#merchandise-panels #panel-title-5 { background: transparent url("/gfx/title-merchandise-panels-sprite.jpg") no-repeat 0 -148px; }
#merchandise-panels #panel-title-4 { background: transparent url("/gfx/title-merchandise-panels-sprite.jpg") no-repeat 0 -111px; }
#merchandise-panels #panel-title-3 { background: transparent url("/gfx/title-merchandise-panels-sprite.jpg") no-repeat 0 -74px; }
#merchandise-panels #panel-title-2 { background: transparent url("/gfx/title-merchandise-panels-sprite.jpg") no-repeat 0 -37px; }
#merchandise-panels #panel-title-1 { background: transparent url("/gfx/title-merchandise-panels-sprite.jpg") no-repeat 0 0; }

#merchandise-intro { position: absolute; top: 20px; left: 20px; width: 418px }
#merchandise-sn { position: absolute; top: 10px; right: 131px; width: 354px; }
#merchandise-sn p { position: absolute; bottom: 10px; left: 70px; width: 250px; z-index: 20; }

#merchandise-panel-1 {  top: 90px; left: 0;  }
#merchandise-panel-2 {  top: 335px; left: 0;  }
#merchandise-panel-3 {  bottom: 0; left: 0; }    
#merchandise-panel-4 {  top: 335px; left: 438px;  }
#merchandise-panel-5 {  bottom: 0; left: 438px;  }


/* ------------------------------------------------------------------- */
/* SPITFIRE ALE */

#tab-spitfireale li { margin: 0 4px; }

#tab-spitfireale li a img  { background-image: url("/gfx/bg-titlebar-ale-sprite.jpg"); background-color: transparent; background-repeat: no-repeat;}

#tab-beer a img { background-position: 0 0; }
#tab-tastingnotes a img { background-position: -146px 0; }
#tab-wheretobuy a img { background-position: -322px 0; }
#tab-feedback a img { background-position: -496px 0; }

#tab-beer a:hover img,
#tab-beer.on img { background-position: 0 -36px; }
#tab-tastingnotes a:hover img,
#tab-tastingnotes.on img { background-position: -146px -36px; }
#tab-wheretobuy a:hover img,
#tab-wheretobuy.on img { background-position: -322px -36px; }
#tab-feedback a:hover img,
#tab-feedback.on img { background-position: -496px -36px; }

#beer-right { float: right; margin: 0 55px 0 50px; }
#beer-left { padding: 20px 0 0 20px; }

#notes-left { float: left; margin: 0 40px 0 0; }
#notes-right { padding-right: 90px; }
#notes-right h2 img { margin: 5px 0 20px 0; }

/* ------------------------------------------------------------------- */
/* SPITFIRE PARTNERS */

div.column {
    width: 424px;
    padding: 0 10px;
    float: left;
}

div.column div.column-top img { background: transparent url("/gfx/bg-content-screws-sm-sprite.jpg") no-repeat bottom left; }
div.column div.column-bottom img { background: transparent url("/gfx/bg-content-screws-sm-sprite.jpg") no-repeat top left; }
div.column div.column-inner { background: transparent url("/gfx/bg-content-screws-sm-shim.gif") repeat-y top left; padding: 0 30px; }

#tab-spitfirepartners li { margin: 0 4px; }

#tab-spitfirepartners li a img  { background-image: url("/gfx/bg-titlebar-partners-sprite.jpg"); background-color: transparent; background-repeat: no-repeat;}

#tab-history a img { background-position: 0 0; }
#tab-raf a img { background-position: -245px 0; }
#tab-heroes a img { background-position: -420px 0; }

#tab-history a:hover img,
#tab-history.on img { background-position: 0 -35px; }
#tab-raf a:hover img,
#tab-raf.on img { background-position: -245px -35px; }
#tab-heroes a:hover img,
#tab-heroes.on img { background-position: -420px -35px; }

#history1-left {
    float: left;
    width: 365px;
    padding: 0 20px;
}

#history1-left p,
#history2-left p { padding: 0 20px 20px 5px; }

#history1-left h2 img,
#history2-title1 {
    background: transparent url("/gfx/bg-history-sprite.gif") no-repeat 0 -31px;
    margin: 5px 0 10px 0;
}

#history1-right {
    float: left;
    width: 484px;
    height: 415px;
    background: transparent url("/gfx/bg-history-screws.jpg") no-repeat top right;
    position: relative;
}

#history1-right img {
    position: absolute;
    top: 21px;
    left: 66px;
}

#history1-right dl {
    position: absolute;
    top: 293px;
    left: 43px;
}

#history1-right dt,
#battle-info dt {
    width: 90px;
    float: left;
    clear: left;
    padding-bottom: 4px;
}

#history1-right dd,
#battle-info dd { display: inline; float: left; padding-bottom: 4px;}

#history1-bottom {
    margin-top: 20px;
    width: 860px;
}

#history1-bottom a img {
    background: transparent url("/gfx/bg-history-sprite.gif") no-repeat 0 0;
}

#history2-title2 {
    background: transparent url("/gfx/bg-history-sprite.gif") no-repeat 0 -62px;
    margin: 5px 0 10px 0;
}

#battle-info { text-align: center;  }

#battle-info h2 img {
    background: transparent url("/gfx/bg-history-sprite.gif") no-repeat 0 -93px;
    margin-bottom: 10px;    
}
#battle-info dl { text-align: left; margin-left: 60px; }
#battle-info dd, #battle-info dt { padding-bottom: 6px; }
#badge-raf { background: transparent url("/gfx/bg-history-sprite.gif") no-repeat -238px -84px;  }
#badge-luftwaffe { background: transparent url("/gfx/bg-history-sprite.gif") no-repeat bottom right;  margin-left: 5px;}

    
/* ------------------------------------------------------------------- */
/* THINGS WE LIKE */

.link-panel {
    width: 226px;
    height: 316px;
    float: left;
    position: relative;
}

.link-panel-image { position: absolute; top: 43px; left: 39px; z-index: 5; }

.link-panel-overlay {
    width: 226px;
    height: 316px;
    position: absolute;   
    z-index: 10;
    top: 0;
    left: 0;
}

div.link-panel div.link-panel-button {
    width: 87px;
    height: 73px;
    position: absolute;
    bottom: 8px;
    left: 78px;
    z-index: 15;
}
.link-panel-button img { background: transparent url("/gfx/btn-link2-sprite.jpg") no-repeat top left; }
.link-panel-button a:hover img { background-position: 0 -73px; }

.link-panel-description {
    position: absolute;
    z-index: 5;
    bottom: 120px;
    left: 38px;
    width: 150px;
    height: 110px;
    background-color: #000;
}
.link-panel-description p { padding: 9px 9px 0 9px; font-size: 1em; }
.link-panel-description h4 { padding: 9px 9px 0 9px; font-size: 1.1em; font-weight: bold; }

/* ------------------------------------------------------------------- */
/* EVENTS & SPONSORSHIP */

div.event-info {
    float: left;
    width: 500px;
    padding: 5px 0 0 25px;
}

div.event-link {
    float: left;
    width: 87px;
    height: 73px;
    text-align: right;
    padding: 55px 0 0 20px;
}

div.event-link .link-panel-button img { background: transparent url("/gfx/btn-link-sprite.jpg") no-repeat top left; }

#tab-events img {  background: #282c15 url("/gfx/bg-titlebar-events-sprite.jpg") no-repeat 0 -70px; }
#tab-events a:hover img,
#tab-events.on img { background-position: 0 -105px; }

#tab-sponsorship img {  background: #282c15 url("/gfx/bg-titlebar-events-sprite.jpg") no-repeat 0 0; }
#tab-sponsorship a:hover img,
#tab-sponsorship.on img { background-position: 0 -35px; }

/* ------------------------------------------------------------------- */
/* FEEDBACK FROM */

div.feedback-image { float: left; width: 171px; height: 355px; }

#feedback-form { float: left; width: 415px; text-align: center; margin: 0 45px; }

#feedback-form h2 {
    margin: 4px 0;
}

/* ------------------------------------------------------------------- */
/* CONTACT US */
#contact-info {
    float: left;
    width: 451px;
    margin-top: 15px;
    margin-left: 15px;
}

#contact-info p {
    padding-left: 5px;
}

#contact-form {
    float: left;
    width: 415px;
    margin-top: 15px;
}

#title-contact-us {
    background: transparent url("/gfx/bg-contactus-sprite.jpg") no-repeat top right;
    width: 138px;
    height: 31px;
}

#title-email-us {
    background: transparent url("/gfx/bg-contactus-sprite.jpg") no-repeat top left;
    width: 138px;
    height: 31px;
}

#contact-submit {
    margin-left: 95px;
}

#ctl00_MainContent_frmContactSubmit {
    background: transparent url("/gfx/bg-contactus-sprite.jpg") no-repeat -2px -224px;
    width: 205px;
    height: 205px;
}

#ctl00_MainContent_txtComments {
    background: transparent url("/gfx/bg-contactus-sprite.jpg") no-repeat 0 -94px;
    border: none;
    width: 375px;
    height: 102px;
    padding: 15px 20px;
}

/* ------------------------------------------------------------------- */
/* PRIVACY & TERMS  */

div.terms-page {
    padding: 0 60px 0 20px;
}
div.terms-page p { padding-bottom: 10px; }
div.terms-page h2 { padding-bottom: 5px; }
div.terms-page ol { margin: 0 0 20px 30px; list-style: decimal none outside; }
div.terms-page ol li { padding: 3px 0; list-style: decimal none outside; }
div.terms-page ol li li { list-style: lower-roman none outside; }
div.terms-page ul { margin: 0 0 20px 30px; list-style: disc none outside; }
div.terms-page ul li { padding: 3px 0; list-style: disc none outside; }

#terms-overlay-text { text-align: left !important; }
#terms-overlay-text p { padding-bottom: 10px; }
#terms-overlay-text h2 { padding-bottom: 5px; }
#terms-overlay-text ol { margin: 0 0 20px 30px; list-style: decimal none outside; }
#terms-overlay-text ol li { padding: 3px 0; list-style: decimal none outside; }
#terms-overlay-text ol li li { list-style: lower-roman none outside; }
#terms-overlay-text ul { margin: 0 0 20px 30px; list-style: disc none outside; }
#terms-overlay-text ul li { padding: 3px 0; list-style: disc none outside; }
/* ------------------------------------------------------------------- */
/* SITEMAP */

img.sitemap-title {
    background: #333d3d url("/gfx/bg-sitemap-sprite.gif") no-repeat top left; height: 31px; width: 209px;
}

#sitemap-title-1 { background-position: 0 -155px; }
#sitemap-title-2 { background-position: 0 -124px; }
#sitemap-title-3 { background-position: 0 -93px; }
#sitemap-title-4 { background-position: 0 -62px; }
#sitemap-title-5 { background-position: 0 -31px; }

.map-section { margin-bottom: 20px; }
.map-section ul { margin: 5px 0 0 20px; }
.map-section ul li { padding-bottom: 3px; }

/* ------------------------------------------------------------------- */
/* FOOTER */

#footer { margin-bottom: 50px; }

#footer-nav { padding-left: 180px;}
#footer-nav li { display: inline; }
#footer-nav li { height: 27px; }


    #social-links { position: absolute; top: 25px; left: 132px; }
    
    ul.social-links li { display: block; float: left; width: 30px; height: 26px; }
    ul.social-links li a img { 
        background-color: Transparent; 
        background-image: url("/gfx/icon-bookmarks-sprite.gif"); 
        background-repeat: no-repeat; 
    }
    
    #advert-info ul.social-links li a img { background-image: url("/gfx/icon-bookmarks2-sprite.gif") !important; }
    
    #facebook img { background-position: 0 0; }
    #facebook a:hover img { background-position: 0 -26px; }
    
    #delicious img { background-position:  -30px  0; }
    #delicious a:hover img { background-position:  -30px -26px; }
    
    #flickr img { background-position: -60px 0; }
    #flickr a:hover img { background-position: -60px -26px; }
    
    #digg img { background-position: -90px 0; }
    #digg a:hover img { background-position: -90px -26px; }
    
    #stumbleupon img { background-position: -120px 0; }
    #stumbleupon a:hover img { background-position: -120px -26px; }
    
    #twitter img { background-position: -150px 0; }
    #twitter a:hover img { background-position: -150px -26px; }                    
    
    #footer-handle {
        height: 213px;
        background: #282c15 url("/gfx/bg-home-handle.jpg") no-repeat 0 0; 
        /*position: relative;*/
        text-align: center;
    }
    body.no-base #footer { position: relative; }
    
    body.no-base #footer div.template-base { display: none; visibility: hidden; }
    
    div.footer-badge { padding-top: 14px; }
    
    body.make #footer-handle,
    body.landing #footer-handle,
    body.grid #footer-handle {
        height: 186px;
        background: #282c15 url("/gfx/bg-handle-badge2.jpg") no-repeat 0 0; 
        /*position: relative;*/
    }    
    
    #had-a-pint { 
        position: absolute;
        left: 365px;
        top: 0;
        width: 253px;
        height: 72px;
    }
    
    #help-for-heroes { 
        position: absolute;
        left: 634px;
        top: 0;
        width: 253px;
        height: 72px;
    }
    
    #drink-aware { 
        position: absolute;
        left: 380px;
        top: 80px;
        width: 225px;
        height: 30px;
    }          



/* ------------------------------------------------------------------- */
/* GLOBAL CLASSES */

/*
a.btn-link img { background: transparent url("/gfx/btn-link-sprite.jpg") no-repeat top left; }
a.btn-link:hover img { background-position: 0 -73px; }
*/

.offscreen { margin-left: -10000px; }

div.footer-paging {
    height: 38px;
    background: transparent url("/gfx/bg-footer-paging.gif") no-repeat center 14px;
    text-align: center;
    padding-top: 22px;
    position: relative;
}

div.carousel-paging {
    height: 38px;
    text-align: center;
    position: relative;
}

div.footer-paging a,
div.carousel-paging a { text-decoration: none; }

div.page-prev { position: absolute; top: 22px; left: 334px; }
div.page-next { position: absolute; top: 22px; right: 334px; }


div.footer-paging ul,
div.footer-paging ul li { display: inline; }

div.footer-paging ul li a,
div.carousel-paging ul li a {  padding: 0 6px 4px 6px; }

div.footer-paging ul li a.on,
div.carousel-paging ul li.on a { background-color: #fff; color: #000; }

div.flash-panel { float: left; padding-left: 18px; padding-bottom: 47px; width: 225px; height: 187px; }
div.flash-title { width: 223px; height: 37px; }

#content-inner div.flash-panel { padding-bottom: 0 !important; }
        
.frame-container {
    width: inherit;
    height: inherit;  
    position: relative; 
    background-color: transparent; 
    background-position: center center;
    background-repeat: no-repeat;
}
.frame-overlay {
    width: inherit;
    height: inherit;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
}

.panel-divider { background-color: #333d3e; }
.panel-divider div.content-inner-bottom { margin-bottom: 8px; }

div.central { width: 530px; margin: 0 auto; }

/* Rating selector panel */
.rating { width: 165px; height: 8px; background: transparent url("/gfx/bg-rating-sprite.png") repeat-x top left; }
.rating img { background: transparent url("/gfx/bg-rating-sprite.png") repeat-x 0 -8px; display: block; }
.rating-panel { width: 300px; height: 279px; background: transparent url("/gfx/bg-panel-rating.gif") no-repeat top left; }
.rating-panel h3 { 
    text-align: right; 
    padding: 4px 16px 15px 0 !important; 
    width: auto !important; 
    float: none !important;
    font-size: 1.2em !important; 
}
.rating-panel dt { margin: 0 0 5px 20px; }
.rating-panel dd { font-weight: bold; margin: 0 0 20px 20px;}


/* FORM ELEMENTS */
div.form-row {}

div.form-label {
    float: left;
    width: 254px;
    margin: 12px 20px 0 0;
    background: transparent url("/gfx/bg-form-elements-sprite.gif") no-repeat 0 -114px;
}

div.form-errors { text-align: center; }

label.form-label-1 { background-position: 0 0; }
label.form-label-2 { background-position: 0 -31px; }
label.form-label-3 { background-position: 0 -62px !important; }
label.form-label-4 { background-position: 0 -93px !important; }
label.form-label-5 { background-position: 0 -124px; }
label.form-label-6 { background-position: 0 -155px; }
label.form-label-7 { background-position: 0 -186px; }
label.form-label-8 { background-position: 0 -217px; }

/*
img.form-label-1 { background-position: 0 0; }
img.form-label-2 { background-position: 0 -31px; }
img.form-label-3 { background-position: 0 -62px; }
img.form-label-4 { background-position: 0 -93px; }
img.form-label-5 { background-position: 0 -124px; }
img.form-label-6 { background-position: 0 -155px; }
img.form-label-7 { background-position: 0 -186px; }
img.form-label-8 { background-position: 0 -217px; }
*/

div.form-element {
    float: left;
    width: 415px;
}

div.checkbox { float: left; width: 40px; padding-top: 2px;}
div.checkbox-label { float: left; width: 490px; }

/* 415 */
/* 57 */
input.input-glass {
    width: 379px; 
    /*height: 57px;*/
    border: 0;
    /*padding: 0 18px 0 18px;*/
    padding: 19px 18px 21px 18px;
    vertical-align: middle;
    font-weight: bold;
    font-size: 14px;
    /*line-height: 57px;*/
    font-family: Georgia, Times New Roman, Serif;
    background: transparent url("/gfx/bg-form-elements-sprite.gif") no-repeat 0 -57px;
}

input.short {
    width: 278px; /* 314 */
    height: 18px; /* 58 */
    background: transparent url("/gfx/bg-input-short.gif") no-repeat 0 0;
}

input.error {
    background-position: 0 0 !important;
}

div.small-form h2,
#contact-info h2 { margin-bottom: 18px; }

div.small-form input,
div.small-form textarea { margin-bottom: 4px; }

div.small-form textarea { font-weight: bold; font-size: 1.2em; }

/* CUSTOM DROP-DOWNS */
.dropdown { float: left; }

.dropdown dd { position:relative; }

.dropdown a, 
.dropdown a:visited { color:#000; text-decoration: none; outline: none;}

.dropdown a:hover { color:#5d4617;}     

.dropdown dt a {
    background-color: transparent;
    display: block; 
    padding: 0 10px 0 8px;
}

.dropdown dt a:hover { color: #5d4617; }                

.dropdown dt a span { cursor: pointer; display: block;}

.dropdown dd ul { 
    background: #ededed none repeat scroll 0 0; 
    border-style: solid;
    border-color: #303a3a;
    border-width: 0 1px 1px 1px; 
    color: #C5C0B0; 
    display: none;           
    padding: 5px 0;          
    width: 75px;             
    list-style: none;            
    position: absolute; 
    top: 1px; 
    left: -4px;
    z-index: 100;
    height: 175px;
    overflow: auto;
}
                  
.dropdown span.value { display:none;}

.dropdown dd ul li a { padding: 0 5px 3px 5px; display:block;}

.dropdown dd ul li a:hover { background-color:#d0c9af;}


#message {
    background:url("/gfx/bg-contactus-sprite.jpg") no-repeat scroll 0 -94px transparent;
    position: relative;
    width: 415px;
    height: 132px;
}

#message #ctl00_MainContent_txtComments   { 
    background-image: none;
    width: 382px;
    height: 102px;
    position: absolute;
    top: 15px;
    left: 20px;
    padding: 0;
    margin: 0;
}

/* FORM: END */


.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
 
.clearfix {
	display: inline-block;
}
 
html[xmlns] .clearfix {
	display: block;
}
 
* html .clearfix {
	height: 1%;
}

.hidden { display: none; visibility: hidden; }

