/**
 * Handsome Hank Style CSS
 *
 * @author Open Interactive GmbH (SHO)
 */


/**
* DEFAULT DEFINITIONS
*/
.hidden {
	display: none;
}


/**
* EXTERNAL FONTS
*/
@font-face {
    font-family: 'Bebas';
    src: url('../font/Bebas/BebasNeue-webfont.eot');
    src: url('../font/Bebas/BebasNeue-webfont.eot?iefix') format('eot'),
         url('../font/Bebas/BebasNeue-webfont.woff') format('woff'),
         url('../font/Bebas/BebasNeue-webfont.ttf') format('truetype'),
         url('../font/Bebas/BebasNeue-webfont.svg#webfontylsBz5LV') format('svg');
    font-weight: small;
    font-style: normal;
}

@font-face {
    font-family: TeXGyre;
    src: url('../font/TeXGyreSchola-Regular/texgyreschola-regular.eot');
    src: url('../font/TeXGyreSchola-Regular/texgyreschola-regular.eot?iefix') format('eot'),
         url('../font/TeXGyreSchola-Regular/texgyreschola-regular.ttf') format('truetype');
}

/**
* PAGE HEADER (TOP NAVIGATION, BLUEBAR)  
*/
.pageWrapper {
    /* Positioning */
    position: relative;
    top: 0px;
    min-width: 1275px;
    
    /* Look & Feel */
    padding: 0 30px 0 30px;   
}

.navbar {
    /* Positioning */
    position: fixed;
    width: 100%;
    top: 0px;
    left: 0px;

    /* Typo & Font */
    text-align: center;
    
    /* Look & Feel */
    background-color: #ffffff;
    padding: 20px 0px 0px 0px;
    z-index: 100;
}

.navbar .link {
    /* Typo & Font */
    color: #8A7717;
    font-size: 32px;
    font-family: Bebas;
    letter-spacing: 0.02em;      
    
    /* Look & Feel */
    display: inline;
    text-decoration:none;
    cursor: pointer;
}
		
.bluebar {
    /* Positioning */
    position: relative;
    border: 1px solid #000000;
    width: 100%;
    top: 25px;
    min-width:1024px;
    left: 0px;
    height: 40px;
    
    /* Look & Feel */
    background-color: #161A43;
}

/**
* EXTERNAL SUB NAVIGATION BIG
*/
.externalNavbarBig {
    /* Positioning */
    position: relative;
    width: 100%;
    top: 25px;
    min-width:1275px;
    left: 0px;
    height: 186px;
    
    /* Typo & Font */
    color: #ffffff;
    
    /* Look & Feel */
    background-color: #000000;
    margin: 10px 0px 10px 0px;
}

.externalNavbarBig .columnContainer {
    /* Positioning */
    position: absolute;
    height: 186px;
    width: 100%;
    
    /* Typo & Font */
    color: #ffffff;
}

.externalNavbarBig .columnContainer .column {
    /* Positioning */
    position: absolute;
    height: 128px;
    
    /* Typo & Font */
    color: #ffffff;
    font-family: Bebas;
    letter-spacing: 0.02em;    
    
    /* Look & Feel */
    margin: 30px 10px 30px 10px;
    background-color: #000000;
    cursor: pointer;

}

.externalNavbarBig .columnContainer .column .columnBorder {
    /* Positioning */
	width: 290px;
    height: 128px;

    /* Look & Feel */
    padding: 0px 10px 0px 10px;
    background-color: #000000;
    cursor: pointer;
    border: 1px solid #000000;
    
    /* CSS3 & Engine Specific */
    border-left-color:#ffffff;
 
}

.externalNavbarBig .columnContainer .column .columnBorderRight {
    /* Positioning */
    position: absolute;
    left: 319px;
    top: 0px;
	width: 1px;
    height: 128px;
	
    /* Look & Feel */
    background-color: #000000;
    cursor: pointer;
	border: 1px solid #000000;
    
    /* CSS3 & Engine Specific */
    border-left-color: #ffffff;    
}

.externalNavbarBig .columnContainer .column .row_1Box p {
    /* Positioning */
    position: relative;
    width: 100%;
    
    /* Typo & Font */
    font-family: Bebas;
    letter-spacing: 0.02em;    
    font-size: 30px;
    
    /* Look & Feel */
    margin: -5px 0px 0px 0px;
    padding: 0px;
}

.externalNavbarBig .columnContainer .column .row_2Box p {
    /* Positioning */
    position: relative;
    width: 100%;
    
    /* Typo & Font */
    font-family: Bebas;
    letter-spacing: 0.02em;    
    font-size: 70px;
    
    /* Look & Feel */
    margin: -13px 0px 5px 0px;
    padding: 0px;    
}

.externalNavbarBig .columnContainer .column .row_3Box p {
    /* Positioning */
    position: relative;
    width: 100%;
    
    /* Typo & Font */
    font-family: Bebas;
    letter-spacing: 0.02em;    
    font-size: 40px;
    line-height: 1; 

    /* Look & Feel */
    margin: -3px 0px 12px 0px;
    padding: 0px;
}

.externalNavbarBig .columnContainer .column .row_imgBox p {
    /* Positioning */
    position: absolute;
    max-width: 40%;
    max-height: 128px;
    
    /* Typo & Font */
    font-family: Bebas;
    letter-spacing: 0.02em;    
    font-size: 30px;
    line-height: 1;
    
    /* Look & Feel */
    margin: 0px -10px 0px 0px;
    padding: 0px;
}

.externalNavbarBig .columnContainer .column .row_imgBox img {
    /* Positioning */
    position: relative;
    max-width: 60%;
    max-height: 128px;
    top: 0px;
    max-height: 128px;
    
    /* Look & Feel */
    float: right;
    padding: 0px;
    margin: 0px -5px 0px 0px;
}

.externalNavbarBig .scrollerLeft {    
    /* Positioning */
    position: relative;
    height: 100px;
    width: 120px;
    
    /* Typo & Font */
    text-align: center;
    
    /* Look & Feel */
    margin: 30px;
    padding: 28px 0px 0px 0px;
    float: left;
    cursor: pointer;
}

.externalNavbarBig .scrollerRight {
    /* Positioning */
    position: relative;
    height: 100px;
    width: 120px;
    
    /* Typo & Font */
    text-align: center;
    
    /* Look & Feel */
    margin: 30px;
    padding: 28px 0px 0px 0px;
    float: right;
    cursor: pointer;
}

.externalNavbarBig .scrollIndicator {
    /* Positioning */
    position: absolute;
    height: 12px;
    width: 100%;
    top: 186px;
    
    /* Typo & Font */
    
    /* Look & Feel */
    margin: 8px;
	z-index: 99;
}

.externalNavbarBig .scrollIndicator .blackBox {
    /* Positioning */
    position: relative;
    height: 12px;
    width: 12px;
    
    /* Look & Feel */
    margin: 0px 5px 0px 0px;
	background-color: #000000;
	float: left;
}

.externalNavbarBig .scrollIndicator .whiteBox{
    /* Positioning */
    position: relative;
    height: 12px;
    width: 12px;
    
    /* Look & Feel */
    margin: 0px 5px 0px 0px;
	background-color: #ffffff;
	float: left;
}

/**
* CONTENT
*/
.content {
    /* Positioning */
    position: relative;
    width: 100%;
    top: 15px;
    min-width:1275px;
    left: 0px;
    height: auto;
    
    /* Look & Feel */
    margin: 0px 0px 50px 0px;
}

.content .background {
    position: relative;
    left: -2px;
}

.content .theband {
    /* Positioning */
    position: absolute;
    width: 951px;
    top: 425px;
}

.content .theband a:link {
    /* Typo & Font */
    color: #000000;
	cursor: pointer;
}

.content .theband a:visited {
    /* Typo & Font */
    color: #000000;
	cursor: pointer;
}

.content .theband a:active {
    /* Typo & Font */
    color: #000000;
	cursor: pointer;
}

.content .theband a:hover {
    /* Typo & Font */
    color: #000000;
	cursor: pointer;
}

.content .theband .textblock{
    /* Positioning */
    position: relative;
    width: 859px;
    
    /* Look & Feel */
    background-color: #ffffff;
    padding: 46px 46px 31px 46px;
    margin: 10px 0px 0px 0px;
}

.content .theband .textblock p{
    /* Positioning */
    position: relative;
    width: 859px;
    
    /* Typo & Font */
    font-family: TeXGyre;
    font-size: 14px;
    line-height: 1.5;
    
	/* Look & Feel */    
    margin: 0px 0px 15px 0px;
}

.content .discography {
    /* Positioning */
    position: absolute;
    width: 879px;
    top: 46px;

    /* Typo & Font */
    font-family: TeXGyre;
    font-size: 14px;
    
    /* Look & Feel */
    background-color: #000000;
    padding: 36px;
}

.content .discography .album {
    /* Positioning */
    position: relative;
    width: 199px;
    height: 450px;
    
    /* Typo & Font */
    font-family: TeXGyre;
    font-size: 14px;
    
    /* Look & Feel */
    padding: 10px;
    float: left;
}

.content .discography img {
    /* Positioning */
    position: relative;
    width: 200px;
    height: 184px;
}

.content .discography h1 {
    /* Positioning */
    position: relative;
    
    /* Typo & Font */
    color: #ffffff;
    font-family: Bebas;
    letter-spacing: 0.02em;    
    font-size: 22px;
    
    /* Look & Feel */
    margin: 20px 0px 20px 0px;
}

.content .discography p {
    /* Positioning */
    position: relative;
    
    /* Typo & Font */
    color: #ffffff;
    font-family: TeXGyre;
    font-size: 14px;
    
    /* Look & Feel */
    margin: 0px 0px 20px 0px;
}

.content .discography p a:link {
    /* Typo & Font */
    color: #ffffff;
	cursor: pointer;
}

.content .discography p a:visited {
    /* Typo & Font */
    color: #ffffff;
	cursor: pointer;
}

.content .discography p a:active {
    /* Typo & Font */
    color: #ffffff;
	cursor: pointer;
}

.content .discography p a:hover {
    /* Typo & Font */
    color: #ffffff;
	cursor: pointer;
}

.content .discography .soldout {
    /* Positioning */
    position: relative;
    
    /* Typo & Font */
    color: #8B0000;
    font-family: TeXGyre;
    font-size: 14px;
    
    /* Look & Feel */
    margin: 0px 0px 20px 0px;
}

.content .discography .buyLink {
    /* Positioning */
    position: relative;
    
    /* Typo & Font */
    color: #8A7717;
    font-family: TeXGyre;
    font-size: 14px;
    
    /* Look & Feel */
    display:block; 
    margin: 0px 0px 10px 0px;
}

.content .contactBackground {
    /* Positioning */
    position: absolute;
    width: 951px;
    height: 475px;
    
    /* Look & Feel */
    background-color: #BC8C17;
    
    /* CSS3 & Engine Specific */
    opacity: 0.75;
}

.content .contact {
    /* Positioning */
    position: absolute;
    width: 905px;
    height: 475px;
    
    /* Look & Feel */
    padding: 46px;
}

.content .contact .contactColumn {
    /* Positioning */
    position: relative;
    width: 300px;
    
    /* Look & Feel */
    float: left;
}

.content .contact .contactColumn h1 {
    /* Positioning */
    position: relative;
    
    /* Typo & Font */
    color: #ffffff;
    font-family: Bebas;
    letter-spacing: 0.02em;    
    font-size: 22px;
    
    /* Look & Feel */
    margin: 0px 0px 20px 0px;
}

.content .contact .contactColumn p {
    /* Positioning */
    position: relative;
    
    /* Typo & Font */
    color: #ffffff;
    font-family: TeXGyre;
    font-size: 14px;
    
    /* Look & Feel */
    margin: 0px 0px 5px 0px;
}

.content .contact .contactColumn a {
    /* Typo & Font */
    color: #ffffff;
}

.content .download {
    /* Positioning */
    position: absolute;
    width: 859px;
    top: 20px;

    /* Typo & Font */
    font-family: TeXGyre;
    font-size: 14px;
    
    /* Look & Feel */
    background-color: #ffffff;
    padding: 40px 45px 40px 45px;
}

.content .download a {
    /* Positioning */
    position: relative;

    /* Typo & Font */
    font-family: Bebas;
    letter-spacing: 0.02em;    
    font-size: 22px;
    text-decoration:none;
    color: #000000;
    
    /* Look & Feel */
    margin: 5px 0px 5px 0px;
    cursor: pointer;
}

.content .footer {
    /* Positioning */
    position: absolute;
    width: 905px;

    /* Typo & Font */
    text-align: center;
    color: #000000;
    font-family: Bebas;
    letter-spacing: 0.02em;    
    font-size: 16px;
}

.content .footer a:link {
    /* Typo & Font */
    color: #000000;
	cursor: pointer;
}

.content .footer a:visited {
    /* Typo & Font */
    color: #000000;
	cursor: pointer;
}

.content .footer a:active {
    /* Typo & Font */
    color: #000000;
	cursor: pointer;
}

.content .footer a:hover {
    /* Typo & Font */
    color: #000000;
	cursor: pointer;
}

/**
* PAGE FOOTER, EXT NAVBAR SMALL
*/		
.externalNavbarSmall {
    /* Positioning */
    position: fixed;
    width: 100%;
    left: 0px;
    height: 70px;
    
    /* Typo & Font */
    color: #ffffff;
    
    /* Look & Feel */
    background-color: #000000;
    z-index: 100;
    opacity: 0;
}

.externalNavbarSmall .miniScrollerLeft {
    /* Positioning */
    position: relative;
    height: 70px;
    width: 40px;
    
    /* Typo & Font */
    text-align: center;
    
    /* Look & Feel */
    background-color: #000000;
    z-index: 100;
    float: left;
    cursor: pointer;
}

.externalNavbarSmall .miniScrollerLeft img {
    /* Positioning */
    position: relative;
    top: 20px;
}

.externalNavbarSmall .miniScrollerRight {
    /* Positioning */
    position: relative;
    height: 70px;
    width: 40px;
    
    /* Typo & Font */
    text-align: center;
    
    /* Look & Feel */
    background-color: #000000;
    z-index: 100;
    float: right;
    cursor: pointer;
}

.externalNavbarSmall .miniScrollerRight img {
    /* Positioning */
    position: relative;
    top: 20px;
}

.externalNavbarSmall .scroller {
    /* Positioning */
    position: relative;
    height: 70px;
    width: 100%;

    margin-left: auto;
    margin-right: auto;
    
    /* Look & Feel */
    overfloww: visible;
}

.externalNavbarSmall .scroller .miniColumn {
    /* Positioning */
    position: relative;
    height: 48px;
    max-width:200px;
    
    /* Look & Feel */
    margin: 10px 5px 10px 5px;
    padding: 0px 10px 0px 10px;
    cursor: pointer;
    float: left;
    
    /* CSS3 & Engine Specific */
    border-left: 1px solid #fff;
    border-right: 1px solid #fff;
}

.externalNavbarSmall .scroller .miniColumn p {
    /* Positioning */
    position: relative;

    /* Typo & Font */
    font-family: Bebas;
    letter-spacing: 0.02em;    
    font-size: 16px;
    
    /* Look & Feel */
    margin: -2px 0px 1px 0px;
}