/*
/ --------------------------------------
/	The Hydro
/	Frame Digital
/ --------------------------------------

	-	html reset
	-	font-face
	-	sitewide
	-	buttons
	-	slider
	-	highlighted events on homepage
	-	register box (homepage)
	-	event list page
	-	about the hydro

*/

/* --------------
* html reset
-----------------*/


html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, font, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, dl, dt, dd, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td
{
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-weight: inherit;
    font-style: inherit;
    font-size: 100%;
    font-family: inherit;
    vertical-align: baseline;
}

:focus
{
    outline: 0;
}

html
{
    overflow-x: hidden;
}

body
{
    color: black;
    background: white;
    font-size: 16px;
}

table
{
    border-collapse: separate;
    border-spacing: 0;
}

table td
{
    vertical-align: top;
}

caption, th, td
{
    text-align: left;
    font-weight: normal;
}


ul, ol
{
    margin: 5px 0 15px 0;
    padding: 0 0 0 40px;
}

li
{
    margin: 5px 0;
    padding: 0;
    color: #000;
}

img
{
    border: 0;
    vertical-align: middle;
}

.clear
{
    clear: both;
    font-size: 1px;
    line-height: 0;
}

a
{
    text-decoration: underline;
    color: #4a8722;
}

a:hover
{
    text-decoration: none;
    color: #4a8722;
}

.black .callout a
{
    text-decoration: none;
}

.black .callout a:hover
{
    color: #92E44E;
}

.black .callout h1, .black .callout h2, .black .callout h3
{
    color: #fff;
}

a.blue
{
    color: #095A97;
}

a.blue:hover
{
    color: #096EBA;
}

a.button:hover
{
    color: #FFF !important;
}

.highlight
{
    color: #76ba43;
}

/* --------------
* font-face
-----------------*/

@font-face
{
    font-family: 'FSAlbertBold';
    src: url('../fonts/fsalbbol-webfont.eot');
    src: url('../fonts/fsalbbol-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/fsalbbol-webfont.woff') format('woff'), url('../fonts/fsalbbol-webfont.ttf') format('truetype'), url('../fonts/fsalbbol-webfont.svg#FSAlbertBold') format('svg');
    font-weight: normal;
    font-style: normal;
}


@font-face
{
    font-family: 'FSAlbertRegular';
    src: url('../fonts/fsalbreg-webfont.eot');
    src: url('../fonts/fsalbreg-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/fsalbreg-webfont.woff') format('woff'), url('../fonts/fsalbreg-webfont.ttf') format('truetype'), url('../fonts/fsalbreg-webfont.svg#FSAlbertRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face
{
    font-family: 'Museo Sans';
    src: url('../fonts/museosans-500-webfont.eot');
    src: url('../fonts/museosans-500-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/museosans-500-webfont.woff') format('woff'), url('../fonts/museosans-500-webfont.ttf') format('truetype'), url('../fonts/museosans-500-webfont.svg#museo_sans500') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face
{
    font-family: 'Museo Sans Semibold';
    src: url('../fonts/museosans-700-webfont.eot');
    src: url('../fonts/museosans-700-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/museosans-700-webfont.woff') format('woff'), url('../fonts/museosans-700-webfont.ttf') format('truetype'), url('../fonts/museosans-700-webfont.svg#museo_sans500') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* --------------
* sitewide
-----------------*/

body
{
    height: 100%;
}

body
{
    background-color: #241707;
}

body, p, td
{
    font-family: 'FSAlbertRegular' , Arial, Helvetica, sans-serif;
    color: #2f2f2f;
    font-size: 15px;
    line-height: 22px;
}

h1, h2, h3, h4, h5
{
    margin: 0;
    padding: 0 0 20px 0;
    color: #2f2f2f;
    font-family: 'Museo Sans Semibold' , Arial, Helvetica, sans-serif;
}

.black h3
{
    color: #FFF;
    font-size: 24px;
}

h1
{
    font-size: 32px;
    line-height: 34px;
}

h2
{
    font-size: 24px;
}

h3
{
    font-size: 18px;
}

h4
{
    font-size: 24px;
}

p
{
    margin: 0 0 20px 0;
}

p.large-body-text
{
    font-size: 22px;
}

p.small, span.small
{
    font-size: 12px !important;
}

.container
{
    width: 940px;
    margin: 0 auto;
    position: relative;
}

.container.reward .box.content
{
    text-align: center;
    padding: 50px 150px;
}

.container.reward .box.content p
{
    font-size: 24px;
    line-height: 28px;
}

header
{
    position: relative;
    z-index: 10;
    background-color: #fff;
}

#main
{
    position: relative;
    z-index: 1;
	background-image: url(../images/backgrounds/DisneyOnIce_1920x1411_HPTO.jpg);
    background-repeat: no-repeat;
    background-position: top center;
	background-color: white;
}

#main.altMain
{
background-image: url(../images/backgrounds/BLACK-FRIDAY_WEBSITE_TAKEOVER.jpg);
	    background-color: #1e3543;
}


.altMain body, .altMain p, .altMain td {
    color: #ffffff;
}

.altMain .box.content{
    background-color: #000000;
}

.row:before, .row:after
{
    content: "";
    display: table;
}

.row:after
{
    clear: both;
}




.box
{
    border: 1px solid #d0d0d0;
    background-color: #fff;
    padding: 4px; /*margin-top: -1px;*/
}

.box.content
{
    padding: 50px;
    margin: -1px 0 25px 0;
}

#main .last
{
    margin: 0;
}

.clearfix:after
{
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}

* html .clearfix
{
    zoom: 1;
}
/* IE6 */
*:first-child + html .clearfix
{
    zoom: 1;
}
/* IE7 */


/*standard table formatting*/
#main table.standard
{
    width: 100%;
}

#main table.standard td
{
    background-color: #f2f2f2;
    font-family: 'FSAlbertBold' , Arial, Helvetica, sans-serif;
    padding: 13px;
    border: 1px solid #fff;
    font-size: 18px;
}

#main table.standard td span.label
{
    color: #095a97;
}

/*two third boxes*/

#main .two-thirds
{
    background-color: #FFF;
    border: 1px solid #D0D0D0;
    margin: -1px 0 25px 0;
    padding: 50px;
}

#main #partners .partner .two-thirds
{
    padding: 10px 50px;
}

#main #partners .partner.first .two-thirds
{
    padding-top: 50px;
}

#main #partners .partner.last .two-thirds
{
    padding-bottom: 50px;
}

#main .two-thirds.no-margin
{
    border: 0;
    margin: 0;
}

.main-inner .two-thirds.no-margin a
{
    color: #095a97;
}

#main .two-thirds.vip-treatment
{
    padding-top: 0;
    padding-bottom: 0;
}

#main .two-thirds.vip-treatment .left
{
    padding: 20px 0;
}

#main .two-thirds .left
{
    float: left;
    width: 390px;
    height: 100%;
    background-color: #fff;
}

#main .two-thirds.narrow .left
{
    width: 300px;
}

#main .two-thirds .right
{
    float: right;
    width: 390px;
    height: 100%;
}

#main .two-thirds.narrow .right
{
    width: 485px;
}

#main .two-thirds .right.black .box
{
    margin: 0 0 25px 0;
    float: none;
}

#main .two-thirds .right.black .box a.button
{
    margin-top: 0;
}

#main .two-thirds .black .callout
{
    background-image: url(../images/core/bk_box-pattern.png);
    padding: 33px;
}

#main .two-thirds .black p
{
    color: #fff;
    font-size: 16px;
    line-height: 22px;
}

#main .two-thirds .black h4
{
    color: #fff;
}

#main .two-thirds-whitespace
{
    background: url(../images/core/leaf.png) #fff no-repeat 705px 70px;
}


#main .two-thirds-whitespace .left
{
    float: left;
    width: 590px;
}

#main .two-thirds-whitespace .right
{
    float: right;
    width: 245px;
}

#main .right.black .box.last
{
    margin-top: 25px;
}

#main .two-thirds .black .directions .callout
{
    padding: 35px 33px 15px 33px;
    min-height: 225px;
    width: 315px;
}


h4.road
{
    background: url(../images/icons/by-road.png) no-repeat;
    text-indent: 50px;
    padding-top: 8px;
}

h4.rail
{
    background: url(../images/icons/by-rail.png) no-repeat;
    text-indent: 45px;
    padding-top: 8px;
}

h4.air
{
    background: url(../images/icons/by-air.png) no-repeat;
    text-indent: 50px;
    padding-top: 8px;
}

h4.bike
{
    background: url(../images/icons/by-bike.png) no-repeat;
    text-indent: 60px;
    padding-top: 8px;
}

.left ul
{
    padding-left: 17px;
    font-size: 18px;
    line-height: 22px;
}


.left ul li
{
    padding-bottom: 10px;
}

.left ul li span
{
    color: #2F2F2F;
}

.Benefits .left ul li
{
    list-style-image: url(/assets/images/core/green-tick.png);
    border-top: 1px #dbdbdb solid;
    padding: 10px 0;
}


/*
 * Stay Connected sub-footer strip
*/


.inner-footer
{
    position: relative;
    float: left;
    width: 100%;
    margin: 0;
    padding: 40px 0 110px 0;
    background-image: url(../images/core/footer_eq.png);
    background-position: center bottom;
    background-repeat: no-repeat;
}

.inner-footer h2
{
    font-family: 'Museo Sans' , Arial, Helvetica, sans-serif;
    text-align: center;
    text-transform: uppercase;
}

.inner-footer .bottom-social-link
{
    margin: 0 auto;
    text-align: center;
}

.inner-footer .bottom-social-link a
{
    background-repeat: no-repeat;
    background-position: 0 0;
    display: inline-block;
    height: 34px;
    margin-right: 5px;
}

.inner-footer .bottom-social-link a.facebook
{
    background: url(../images/buttons/facebook_btn.png);
    width: 122px;
}

.inner-footer .bottom-social-link a.twitter
{
    background: url(../images/buttons/twitter_btn.png);
    width: 111px;
}


/* ===== | Header | ========================================================= */
/*
/* ========================================================================== */

header .top
{
    height: 94px;
}

header .top .logo
{
    float: left;
    margin: 13px 0 0;
}

header .nav
{
    background-color: #095a97;
    height: 40px;
    margin: 0;
}


/* ===== | Footer | ========================================================= */
/*      
/* ========================================================================== */
footer
{
    background-color: #fff;
    border-top: 1px solid #d0d0d0;
    clear: both;
    position: relative;
    padding: 3em 0;
    font-size: .875em;
    color: #8f8f8f;
}

footer a
{
    color: #63b02f;
    text-decoration: underline;
}

footer a:hover
{
    text-decoration: none;
}

footer .address
{
    text-transform: uppercase;
    float: left;
}

footer .links
{
    float: right;
}

footer .links a
{
    padding: 0 0 0 20px;
    text-transform: uppercase;
}

footer .divider
{
    border-top: 1px solid #d0d0d0;
    margin: 2em 0;
}

footer .logo-strip a
{
    display: inline-block;
    height: 85px;
    margin: 0 36px 0 0;
    text-decoration: none;
    background-repeat: no-repeat;
    background-position: 0 0;
}

footer .logo-strip a:hover
{
    background-position: 0 -85px;
}

footer .logo-strip a.hydro
{
    width: 173px;
    background: url("/assets/images/core/logo_scottish-hydro.png") 0 -85px no-repeat;
    margin-right: 36px;
}

footer .logo-strip a.hydro:hover
{
    background-position: 0 0;
}

footer .logo-strip a.coke
{
    width: 179px;
    background: url("/assets/images/core/logo_coke.png") no-repeat;
    margin-right: 36px;
}

footer .logo-strip a.coke:hover
{
    background-position: 0 -85px;
}

/*footer .logo-strip a.kettlecrisps
{
    width: 179px;
    background: url("/assets/images/core/logo_kettle_hydro.png") no-repeat;
    margin-right: 36px;
}

footer .logo-strip a.kettlecrisps:hover
{
    background-position: 0 -85px;
} */

footer .logo-strip a.scotrail
{
    background: url("/assets/images/core/logo_scotrail.png") no-repeat scroll 0 0 transparent;
    width: 200px;
    margin-right: 36px;
}

footer .logo-strip a.thomson:hover
{
    background-position: 0 -77px;
}

footer .logo-strip a.thomson
{
    width: 173px;
    background: url("/assets/images/core/logo_thomson.png") no-repeat;
    margin-right: 53px;
}

footer .logo-strip a.scotrail:hover
{
    background-position: 0 -85px;
}

footer .logo-strip a.fosters
{
    background: url("/assets/images/core/logo_fosters.png") no-repeat scroll 0 -15px transparent;
    width: 173px;
    margin-right: 36px;
    height: 70px;
}

footer .logo-strip a.fosters:hover
{
    background-position: 0 -86px;
}

footer .logo-strip a.heineken
{
    background: url("/assets/images/core/logo_heineken.png") no-repeat scroll 0 0 transparent;
    width: 173px;
    margin-right: 36px;
}

footer .logo-strip a.heineken:hover
{
    background-position: 0 -85px;
}

footer .logo-strip a.clydesdalebank
{
    background: url("/assets/images/core/logo_cb.png") no-repeat scroll 0 -85px transparent;
    width: 173px;
    margin-right: 36px;
    height: 85px;
}

footer .logo-strip a.clydesdalebank:hover
{
    background-position: 0 0;
}

footer .logo-strip a.raymond
{
    background: url("/assets/images/core/logo_raymond.png") no-repeat scroll transparent;
    width: 173px;
    margin-right: 36px;
    height: 85px;
}

footer .logo-strip a.raymond:hover
{
    background-position: 0 -80px;
}

footer .logo-strip a.nordoff
{
    background: url("/assets/images/core/logo_nordoff.png") no-repeat scroll 0 -35px transparent;
    width: 173px;
    height: 60px;
}

footer .logo-strip a.nordoff:hover
{
    background-position: 0 -101px;
}

footer .logo-strip a.parks
{
    background: url("/assets/images/core/ParksOfHamilton_HydroFooter.jpg") no-repeat scroll 0 -35px transparent;
    width: 173px;
    height: 60px;
}

footer .logo-strip a.parks:hover
{
    background-position: 0 -101px;
}

footer .logo-strip a.capital
{
    background: url("/assets/images/core/CapitalLogo.png") no-repeat scroll transparent;
    width: 173px;
    height: 85px;
	margin-right:36px;
}

footer .logo-strip a.capital:hover
{
    background-position: 0 -85px;
}

footer .logo-strip a.sony
{
    background: url("/assets/images/core/logo_sony.png") no-repeat scroll transparent;
    width: 173px;
    margin-right: 36px;
    height: 65px;
	margin-left: 25px;
}

footer .logo-strip a.sony:hover
{
    background-position: 0 -66px;
}


footer .logo-strip a.enjoyLife
{
    background: url("/assets/images/core/EnjoyLifeBTG_Hydro_WebFooter.png") no-repeat scroll transparent;
    width: 173px;
    height: 85px;
	
}

footer .logo-strip a.enjoyLife:hover
{
    background-position: 0 -80px;
}

footer .logo-strip a.last
{
    margin: 0;
}

/* --------------
* buttons & fields
-----------------*/
#btnSignUp.button
{
    width: 297px;
}

input[type=button].button
{
    border-right: none;
    border-bottom: none;
}

.button
{
    display: inline-block;
    text-decoration: none;
    padding: 0 15px;
    margin-bottom: 0;
    font-family: 'Museo Sans Semibold' , sans-serif;
    font-size: 1.125em;
    color: #FFF;
    cursor: pointer;
    position: relative;
    -webkit-appearance: none;
    border-radius: 0;
    min-height: 43px;
    line-height: 40px;
    text-align: center;
    text-transform: uppercase;
    -webkit-text-shadow: 1px -1px 1px rgba(0, 0, 0, 0.3);
    text-shadow: 1px -1px 1px rgba(0, 0, 0, 0.3);
    background-repeat: repeat-x;
    background-position: 0 -7px;
}

.button:hover
{
    background-position: 0 -58px;
}


.btn_blue
{
    background-image: url(../images/buttons/btn_blue.gif);
    border-left: 1px solid #0e87cb;
    border-top: 1px solid #0e87cb;
}

.btn_green
{
    background-image: url(../images/buttons/btn_green.gif);
    border-left: 1px solid #bae163;
    border-top: 1px solid #bae163;
}

.btn_red
{
    background-image: url(../images/buttons/btn_red.gif);
    border-left: 1px solid #e16363;
    border-top: 1px solid #e16363;
}

.field
{
    border: 1px solid #d0d0d0;
    padding: 6px 6px 6px 20px;
    font-size: 1.25em;
}

/*------------
*SSE Style Button
----------------*/

.btn-sse
{
    color: #ffffff;
    text-decoration: none;
    text-transform: uppercase;
    font-family: 'Museo Sans Semibold' , sans-serif;
    font-size: 0.875em;
    background-color: #7cc242;
    background-image: -o-linear-gradient(bottom, rgb(63,164,33) 0%, rgb(124,194,66) 50%);
    background-image: -moz-linear-gradient(bottom, rgb(63,164,33) 0%, rgb(124,194,66) 50%);
    background-image: -webkit-linear-gradient(bottom, rgb(63,164,33) 0%, rgb(124,194,66) 50%);
    background-image: -ms-linear-gradient(bottom, rgb(63,164,33) 0%, rgb(124,194,66) 50%);
    background-image: linear-gradient(bottom, rgb(63,164,33) 0%, rgb(124,194,66) 50%);
    border-radius: 3px 3px 3px 3px;
    -webkit-box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, .4);
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, .4);
    border: 1px solid #7cc242;
    padding: 10px 50px;
    font-size: 24px;
    -webkit-text-shadow: 1px 1px 2px #000000;
    text-shadow: 1px 1px 2px #000000;
    color: #ffffff;
    min-width: 190px;
    line-height: 24px;
}


.btn-sse:hover
{
    color: #ffffff;
    background-color: #3fa421;
    background-image: -o-linear-gradient(top, rgb(63,164,33) 0%, rgb(124,194,66) 50%);
    background-image: -moz-linear-gradient(top, rgb(63,164,33) 0%, rgb(124,194,66) 50%);
    background-image: -webkit-linear-gradient(top, rgb(63,164,33) 0%, rgb(124,194,66) 50%);
    background-image: -ms-linear-gradient(top, rgb(63,164,33) 0%, rgb(124,194,66) 50%);
    background-image: linear-gradient(top, rgb(63,164,33) 0%, rgb(124,194,66) 50%);
}


/* --------------
* socal block on page footer
-----------------*/

.social
{
    padding: 25px 50px 50px 50px;
    text-align: center;
}

.social h5
{
    font-size: 34px;
    line-height: 34px;
    font-family: 'FSAlbertRegular' , Arial, Helvetica, sans-serif;
    padding: 0;
    margin: 0;
}

.social p
{
    padding: 0;
    margin: 0;
}
/* --------------
* homepage slider (slider) & event detail page image formatting (spotlight) 
	& large header spotlights on additional pages
-----------------*/

.slider, .spotlight
{
    position: relative;
    width: 610px;
    margin: 0 0 25px 0;
    background-color: #FFFFFF;
    border: 1px solid #D0D0D0;
    padding: 4px;
    height: 281px;
}

.slider .img, .spotlight img
{
    height: 233px;
    overflow: hidden;
    width: 610px;
}

.slider .img img, .spotlight .img img
{
    max-width: 100%;
    vertical-align: middle;
}

.slider .info, .spotlight .info
{
    height: 48px;
    padding-left: 1em;
    background-color: #000;
    color: #ffffff;
    font-family: 'Museo Sans Semibold' , sans-serif;
    font-size: 0.875em;
    line-height: 48px;
    text-transform: uppercase;
}

.slider .info a, .spotlight .info a
{
    color: #ffffff;
    text-decoration: underline;
}

.slider .info a:hover, .spotlight .info a:hover
{
    text-decoration: none;
}

.promotional-panel{margin-top:20px;}

.promotional-panel .box
{
    width: 290px;
    float: right;
    margin-right: 0;
}

.box.spotlight-large
{
    position: relative;
    margin: 0 0 25px 0;
    background-color: #FFFFFF;
    border: 1px solid #D0D0D0;
    padding: 4px;
    height: 410px;
    float: none;
}

.box.spotlight-large .img
{
    height: 355px;
    overflow: hidden;
    position: relative;
    width: 930px;
    z-index: 5;
}

.box.spotlight-large .img img
{
    width: 930px;
}


.box.spotlight-large .info
{
    background-color: #000000;
    width: 930px;
}

.box.spotlight-large .info .text
{
    background-color: #000000;
    color: #FFFFFF;
    float: left;
    font-family: 'FSAlbertRegular' ,Arial,Helvetica,sans-serif;
    font-size: 19px;
    text-transform: uppercase;
}





/* 1 */

.slider .btn-prev, .slider .btn-next
{
    height: 30px;
    width: 30px;
    position: absolute;
    top: 110px;
    z-index: 20;
    cursor: pointer;
}

.slider .btn-prev
{
    left: -15px;
}

.slider .btn-next
{
    left: 600px;
}

.slider .pager
{
    text-align: right;
    width: 200px;
    height: 5px;
    position: absolute;
    z-index: 21;
    left: 410px;
    top: 215px; /*font-size: 0.1em; 	word-spacing: -1em;*/
}

.slider .pager a
{
    display: inline-block;
    background-color: #F2F2F2;
    width: 5px;
    height: 5px;
    margin: 0 5px 0 0;
    line-height: 0;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}

.slider .pager a.activeSlide
{
    background-color: #7cc242;
}

.slider .panels
{
    background-color: #000;
    overflow: hidden;
    width: 610px;
}


/* --------------
* main events list (including homepage)
-----------------*/

/*
 * Event Promo Boxes
*/

.box
{
    position: relative;
    float: left;
    margin: 0 20px 25px 0;
    padding: 4px;
    border: 1px solid #cacaca;
    background-color: #fff;
}

.box.last
{
    margin-right: 0;
}


.box .button
{
    display: block;
}


.box.content
{
    padding: 50px;
    margin: 0 0 25px 0; /*width: 890px;*/
}

.box .img
{
    height: 182px;
    overflow: hidden;
}

.box .img img
{
    width: 100%;
}

.box .info
{
    font-size: 0.875em;
    line-height: 1.286em;
    text-transform: uppercase;
    text-align: center;
    height: 55px;
    padding: 0 20px;
    background-color: #000;
    color: #ffffff;
    display: table-cell;
    width: 250px;
    vertical-align: middle;
}

.box .info a
{
    color: #fff;
    text-decoration: none;
}

.box .message
{
    position: absolute;
    top: 4px;
    left: 4px;
    background-image: url(../images/core/bk_fifty-percent.png);
    background-repeat: repeat;
    text-transform: uppercase;
    font-size: 0.875em;
    line-height: 1.286em;
    color: #fff;
    padding: 10px 0;
    vertical-align: middle;
    text-align: center;
    width: 289px;
}


.primary .box /* Declare width for 3 column layout */
{
    width: 290px;
}

/*
 * homepage secondary scroller
*/

.secondary
{
    margin: 0 0 25px;
    padding: 35px 35px 0;
    position: relative;
    width: 868px;
}

.secondary .btn-prev, .secondary .btn-next
{
    height: 30px;
    width: 30px;
    position: absolute;
    top: 140px;
    z-index: 10;
    cursor: pointer;
}

.secondary .btn-prev
{
    left: -15px;
}

.secondary .btn-next
{
    left: 922px;
}

.jcarousel-container-horizontal
{
    overflow: hidden;
    width: 868px;
    display: block;
    position: relative;
}

.jcarousel-clip-horizontal
{
    height: 260px;
    width: 868px;
}

.jcarousel-clip
{
    overflow: hidden;
}

.secondary ul.scroller
{
    width: 900px;
    height: 260px;
    padding: 0;
}

.secondary ul.scroller li
{
    float: left;
    list-style: none;
    margin: 0 .75em;
    background-image: url(../images/core/bk_box-reflection.jpg);
    background-repeat: no-repeat;
    background-position: 0 206px;
    width: 192px;
    height: 260px;
}

.secondary ul.scroller li.findout-more
{
    background-image: url('../images/core/bk_box-reflection-findoutmore.jpg');
}

.secondary ul.scroller li.pre-register
{
    background-image: url('../images/core/bk_box-reflection_pre-register.png');
}

.secondary ul.scroller li .box
{
    width: 180px;
}

.secondary ul.scroller li .box .img
{
    height: 109px;
    overflow: hidden;
}

.secondary ul.scroller li .box .info
{
    background-color: #000;
    height: 35px;
    width: 170px;
    padding: 5px;
    vertical-align: top;
    text-align: center;
    font-size: 12px;
    text-transform: uppercase;
    line-height: 18px;
    color: #fff;
}

.secondary ul.scroller li .box .action .btn_blue
{
    margin: 0;
    text-align: center;
    font-size: 14px;
    height: 41px;
    line-height: 41px;
}





/* ===== | events list page | ================================================ */
/*  events list page    
/* ========================================================================== */

.primary.events-list .box
{
    margin: 0 19px 20px 0;
}

.primary.events-list .box.first
{
    clear: left;
}

.primary.events-list .box .month-divider
{
    height: 282px;
    background-image: url(../images/core/bk_box-pattern.png);
    background-repeat: repeat;
}

.primary.events-list .box .month-divider .date
{
    padding: 120px 0 0 0;
    text-align: center;
    color: #fff;
    font-size: 32px;
    font-family: 'FSAlbertBold' , Arial, Helvetica, sans-serif;
    text-transform: uppercase;
}

.primary.events-list .box .month-divider .date .year
{
    font-size: 18px;
}



/* --------------
* register box (bottom of homepage)
-----------------*/


.register
{
    padding: 30px;
    margin: 0 0 25px 0;
    width: 878px;
}

.register p
{
    font-size: 16px;
    font-family: 'FSAlbertRegular' , Arial, Helvetica, sans-serif;
    margin: 0 0 20px 0;
}

.register .left
{
    float: left;
    width: 560px;
}

.register .left h4
{
    font-size: 38px;
    line-height: 40px;
    text-transform: uppercase;
    margin: 0;
    padding: 10px 0 0 0;
}

.register .left h4 span
{
    color: #095a97;
    font-style: italic;
}

.register .right
{
    float: right;
    width: 300px;
}

.register .right .field
{
    color: #7cc242;
    font-size: 20px;
    width: 268px;
}

.register .right .button
{
    height: 45px;
    line-height: 45px;
    margin: 0;
    width: 269px;
}




/* --------------
* FAQs
-----------------*/

.faqs dl
{
    border: 1px solid #D0D0D0;
    border-top: 0;
    margin-bottom: 35px;
}

.faqs dt
{
    padding: 10px 40px 10px 10px;
    border-top: 1px solid #D0D0D0;
    background: #F5F5F5 url("../images/buttons/btn_blue_down_off.png") no-repeat 800px center;
}

.faqs dt:hover
{
    background-image: url(../images/buttons/btn_blue_down_on.png);
}


.faqs dt.open, .faqs dt.alt.open
{
    background: #FFF url(../images/buttons/btn_green_up_off.png) no-repeat 800px center;
}

.faqs dt.open:hover, .faqs dt.alt.open:hover
{
    background-image: url(../images/buttons/btn_green_up_on.png);
}


.faqs dt.alt
{
    background-color: #EBEBEB;
}

.faqs dd
{
    padding: 10px;
}

.faqs dd span.answer, .faqs dt span.question
{
    float: left;
    font-weight: bold;
    margin-right: 5px;
}

.faqs p.info
{
    margin: 0 auto;
    text-align: center;
    width: 600px;
}

/* --------------
* tab strip used on event list and timeline pages
-----------------*/

.tab-strip
{
    margin: 0 0 25px 0;
    width: 930px; /* wierd fix for safari?? The tab strip collapses otherwise */
}

.tab-strip table
{
    width: 100%;
    table-layout: fixed;
}

.tab-strip table a
{
    display: block;
    padding: 15px 0;
    background-color: #2b2b2b;
    font-size: 18px;
    line-height: 15px;
    font-family: 'FSAlbertBold' , Arial, Helvetica, sans-serif;
    color: #525252;
    border-right: 1px solid #000;
    border-bottom: 1px solid #000;
    text-align: center;
    text-decoration: none;
    -webkit-transition: background-color 0.4s;
    -moz-transition: background-color 0.4s;
    -o-transition: background-color 0.4s;
    -ms-transition: background-color 0.4s;
    transition: background-color 0.4s;
}

.tab-strip table a:hover, .tab-strip table a.selected
{
    background-color: #7cc242;
    border-bottom: 1px solid #7cc242;
    color: #fff;
}

/* --------------
* event detail page
-----------------*/

.spotlight .social-link
{
    position: absolute;
    top: 200px;
    left: 20px;
    z-index: 10;
}

.spotlight .info .social-link
{
    text-align: right;
    float: right;
    margin: 15px 20px 0 0;
    width: 90px;
}

.promotional-panel .spotlight
{
    float: left;
}

.promotional-panel .event-details
{
    background-image: url(../images/core/bk_box-pattern.png);
    background-repeat: repeat;
    margin-bottom: 0;
    padding: 10px 20px 0px 20px;
    height: 271px;
}

.promotional-panel table
{
    background-color: none;
    border: none;
    color: #ffffff;
}

.promotional-panel table tr th, .promotional-panel table tr td
{
    padding-top: .7em;
    padding-bottom: .7em;
    vertical-align: middle;
    line-height: 12px;
}

.promotional-panel table tr th
{
    padding-right: 12px;
    font-size: .875em;
}

.promotional-panel table tr td
{
    font-family: 'Museo Sans Semibold' , sans-serif;
    color: #fff;
}

.promotional-panel table .admin
{
    font-family: 'Museo Sans' , sans-serif;
    font-size: .875em;
}

.promotional-panel .event-details .action
{
    margin: 15px 0 0 0;
}



.bottom-social-link
{
    text-align: center;
    margin: 0 auto;
}

.bottom-social-link span
{
    color: #2f2f2f;
    font: 16px 'FSAlbert' ,Arial, Helvetica, sans-serif;
}

.bottom-social-link a.facebook
{
    background: url("/assets/images/buttons/facebook_btn.png");
    display: inline-block;
    width: 122px;
    height: 34px;
}

.bottom-social-link a.twitter
{
    background: url("/assets/images/buttons/twitter_btn.png");
    display: inline-block;
    width: 111px;
    height: 34px;
}

p.quote
{
    color: #2f2f2f;
    font-size: 18px;
    line-height: 24px;
    margin-top: -17px;
}

.top-quote
{
    background: url(../images/core/quotes.png) 0 0 no-repeat;
    width: 77px;
    height: 58px;
    margin-left: -10px;
}

.btm-quote
{
    background: url(../images/core/quotes.png) 0 -58px no-repeat;
    width: 77px;
    height: 58px;
    float: right;
    margin-top: -57px;
}

.event-details
{
    margin: 0 0 25px 0;
}

.event-details .left
{
    float: left;
    width: 630px;
    height: 144px;
}

.event-details .right
{
    float: right;
    width: 295px;
    height: 144px;
    background-image: url(../images/core/bk_box-pattern.png);
    background-repeat: repeat;
}

.event-details .right .action
{
    padding: 45px 0 0 0;
    text-align: center;
}

/*event description*/

.event-description
{
    margin: 0 0 25px 0;
}

.event-description .left.box
{
    float: left;
    width: 578px;
    padding: 20px;
    min-height: 538px;
    margin-bottom: 0;
    margin-right: 0;
}

.event-description .right
{
    float: right;
    width: 300px;
}

.event-description .right .box
{
    margin: 0 !important;
    float: none;
}

.event-description .right p
{
    margin: 0;
    font-size: 14px;
}

.event-description .right .social .buttons
{
    float: right;
    width: 120px;
    text-align: right;
}

.event-description .right .social .buttons .facebook
{
    margin: 0 10px 0 0;
}

.event-description .right .box.social
{
    margin: 25px 0 25px !important;
    line-height: 16px;
    padding: 20px;
    text-align: left;
    width: 257px;
}

.event-description .right .btn_blue
{
    text-align: center;
    width: 269px;
}

.relatedVideo
{
    margin-top: 10px;
}

/*
related / other events
all the styles for this are coming from the homepage....
*/

#main .secondary.event-other
{
    height: 320px;
}

.secondary.event-other .btn-prev, .secondary.event-other .btn-next
{
    top: 160px;
}

.event-other h2
{
    font-size: 34px;
    text-transform: uppercase;
    text-align: center;
}

/* --------------
* Social page
-----------------*/

.social-details .fb-stream
{
    float: right;
    background-color: #fff;
    width: 292px;
    padding: 4px;
    border: 1px solid #c0c0c0;
    margin: 0 6px 16px 5px;
}

.social-details .box
{
    width: 292px;
    margin: 0 6px 16px 5px;
    display: inline-block;
    float: right;
}

.social-details .box .tweet
{
    background-image: url("../images/core/bk_box-pattern.png");
    background-repeat: repeat;
    height: 282px;
}

.social-details .box .tweet .icon
{
    background-image: url("../images/icons/icon_twitter.png");
    background-repeat: no-repeat;
    background-position: center center;
    height: 16px;
    padding: 45px 0 20px 0;
}

.social-details .box .tweet .text
{
    color: #fff;
    text-align: center;
    padding: 0 20px;
}

.social-details .box .tweet .text a
{
    color: #7cc242;
    text-decoration: none;
}

.social-details .box .tweet .text a:hover
{
    text-decoration: underline;
}


/* --------------
* about the hydro
-----------------*/

/*facts carousel  */
.contentslider-std
{
    height: 140px;
    position: relative;
}
/* Panel */
.contentslider-std .sliderkit-panels
{
    width: 314px;
    height: 140px;
}

.contentslider-std .sliderkit-panel
{
    width: 314px;
    height: 140px;
    position: absolute;
}

/* Nav */
.contentslider-std .sliderkit-nav
{
    position: relative;
    width: 375px;
    height: 28px;
    text-align: left;
    margin: 15px 0 0 -33px;
}

.contentslider-std .sliderkit-nav-clip
{
    margin: 0;
}

.contentslider-std .sliderkit-nav-clip ul
{
    margin: 0px;
    padding: 0;
    height: 18px;
    width: 380px;
}

.contentslider-std .sliderkit-nav-clip ul li
{
    float: left;
    list-style: none;
    display: inline-block;
    background-color: #312d2d;
    width: 76px;
    height: 18px;
    padding: 0px;
    margin: 0 1px 0 0;
}

.contentslider-std .sliderkit-nav-clip ul li.no-margin
{
    margin-right: 0;
    width: 72px;
    _width: 70px;
}

.contentslider-std .sliderkit-nav-clip ul li a
{
    color: #fff;
    text-decoration: none;
    display: block;
    height: 18px;
}

.contentslider-std .sliderkit-nav-clip ul li a:hover
{
    background: #7cc242;
}

.contentslider-std .sliderkit-nav-clip ul li.sliderkit-selected
{
    background: #7cc242;
}

.contentslider-std .sliderkit-nav-clip ul li.sliderkit-selected a
{
    color: #000;
    background: #7cc242;
}

/*gallery*/

.gallery
{
    width: 180px;
    height: 195px;
    position: relative;
    float: left;
    margin: 0 19px 30px 0;
}

.gallery a
{
    margin: 0;
    padding: 0;
    border: none 0;
}

.gallery .button
{
    position: absolute;
    bottom: 4px;
    left: 4px;
    width: 150px;
}


/* --------------
* Timeline
* -----------------*/

#timeline
{
    height: 100%;
    position: relative;
}

#timeline .box
{
    background-image: url(../images/core/bk_timeline.png);
    background-position: 0 100px;
    background-repeat: repeat-y;
    margin: 0 0 25px 0;
    clear: both;
    float: none;
    padding: 45px 70px 10px 80px;
}

#timeline h2.year
{
    clear: left;
    font: 36px 'FSAlbertBold' ,Arial, Helvetica, sans-serif;
    padding-bottom: 25px;
    text-transform: none;
}


#timeline section
{
    display: block;
}

#timeline .timestamp
{
    height: 100%;
    padding-bottom: 35px;
}

#timeline .year-detail
{
    padding: 0 0 0 90px;
}

#timeline .info-timeline
{
    background-image: url(../images/core/bk_box-pattern.png);
    height: 100%;
    margin: 0;
    padding: 20px 20px 8px;
    width: 360px;
}

#timeline h3, #timeline p
{
    margin: 0;
    padding: 0 0 12px;
}

#timeline h3
{
    color: #B0D136;
    font: 24px/24px 'FSAlbertRegular' ,Arial, Helvetica, sans-serif;
}

#timeline p, #timeline li
{
    font: 18px/26px 'FSAlbertRegular' ,Arial, Helvetica, sans-serif;
    color: #fff;
}

#timeline .info-timeline-box
{
    background-color: #FFFFFF;
    border: 1px solid #CACACA;
    padding: 4px;
    position: relative;
    float: left;
}

#timeline .info-bullet-sml, #timeline .info-bullet-big
{
    margin: 4px 15px 0 0;
    position: relative;
    float: left;
}

#timeline .info-bullet-sml
{
    width: 95px;
}

#timeline .info-bullet-big
{
    width: 220px;
}

#timeline .info-bullet-big, #timeline .info-bullet-sml
{
    height: 19px;
    background: transparent url(../images/core/timeline-bullet.png) no-repeat scroll 0 0;
    background-position: right;
}

#timeline .timestamp:after
{
    clear: both;
    content: " ";
    display: block;
    height: 0;
    visibility: hidden;
    width: 0;
}

.sign-up-form
{
    /*background: url(../images/core/sign-up-tickets.png) no-repeat left 185px;*/
}

.sign-up-form .left
{
    background-color: transparent;
}

p.intro
{
    font-size: 24px;
    line-height: 28px;
}

p.info
{
    font-size: 14px;
    line-height: 18px;
}

.google-map
{
    width: 930px;
    height: 440px;
    margin: 0;
    padding: 0px;
}

.google-map-wrapper
{
    margin: 0 0 50px 0;
}

.sticky #timeline-sub-nav
{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 10000;
}

.sticky #timeline-sub-nav #timeline-nav
{
    margin: 0 auto;
    width: 930px;
    float: none;
}

#preRegisterForm
{
    padding: 35px 40px 0;
}

.form h1
{
    line-height: 38px;
    text-transform: uppercase;
}

.form h1 span
{
    color: #095a97;
}

.form ul
{
    list-style: none;
    padding: 0;
}

.form ul li
{
    margin-bottom: 20px;
}

.form fieldset label
{
    display: block;
    font-family: 'FSAlbertBold' , Arial, Helvetica, sans-serif;
    font-size: 20px;
    color: #2F2F2F;
    margin-bottom: 5px;
    width: 100%;
    text-transform: uppercase;
}

.form fieldset label.terms
{
    display: inline;
    font-family: 'FSAlbertBold' , Arial, Helvetica, sans-serif;
    font-size: 16px;
    color: #2F2F2F;
    text-transform: none;
}

.form fieldset input[type=text]
{
    width: 330px;
    height: 40px;
    border: 1px solid #DCDCDC;
    line-height: 40px;
    padding: 0 5px;
    font-size: 19px;
    color: #5B5B5B;
}

#preRegisterForm.form fieldset input[type=text]
{
    height: 34px;
}

.form fieldset input[type=text]:focus
{
    border: 1px solid #095A97;
}

.form fieldset input[type=text].short
{
    width: 110px;
}

.form #form-error
{
    color: #C24242;
    padding: 10px 0;
}

.form fieldset input[type=text].error, .form fieldset input[type=text].error-short
{
    border-color: #C24242;
}

.form .input-validate-message
{
    color: #C24242;
    font-size: 28px;
    padding-left: 10px;
}

.form .input-validate-message.small
{
    font-size: 13px; /*required for the email validation*/
}

.form input.button
{
    cursor: pointer;
}








/* --------------
* "Your Hydro" promotion styles
-----------------*/

/*new "your hydro" box on homepage*/
.register-yourhydro
{
    padding: 10px 30px 30px 30px;
    margin: 25px 0 40px 0;
    background-image: url(../images/promos/golden-ticket/bk_win-golden-ticket-left.jpg);
    background-repeat: no-repeat;
    background-position: 0px 0px;
}

.register-yourhydro .left
{
    float: left;
    width: 300px;
}

.register-yourhydro .right
{
    float: right;
    width: 550px;
}

.register-yourhydro .right h4
{
    font-size: 25px;
    line-height: 32px;
    text-transform: uppercase;
    padding: 10px 0 0 0;
}

.register-yourhydro .right h4 span
{
    color: #095a97;
    font-style: italic;
}

.register-yourhydro .right p.small
{
    font-size: 13px;
    padding: 10px 0 0 0;
    margin: 0;
}

.register-yourhydro .right .action
{
    float: right;
    margin: -25px 0 0 0;
}


/*intro panel*/

.sign-up-form.your-hydro
{
    background-image: url(../images/promos/golden-ticket/bk_win-golden-ticket-right.jpg);
    background-repeat: no-repeat;
    background-position: top right;
}

.sign-up-form.your-hydro .right
{
    text-align: center;
    padding: 80px 0 0 0;
}

.sign-up-form.your-hydro .right h4
{
    font-size: 26px;
    line-height: 32px;
    text-transform: uppercase;
    padding: 0 0 10px 0;
}

.sign-up-form.your-hydro .right h4 span
{
    color: #095a97;
    font-style: italic;
}

.sign-up-form.your-hydro .right p.small
{
    font-size: 12px;
    margin: 0 0 10px 0;
}


/*survey panel*/

#main .survey.your-hydro
{
    background-image: url(../images/promos/golden-ticket/bk_survey.jpg);
    background-repeat: no-repeat;
    background-position: top left;
    padding: 170px 50px 0px 30px;
}

#surveyMonkeyInfo iframe
{
    overflow: hidden;
    overflow-y: hidden;
}


/*Organise An Event*/

#main .container .flexable .right
{
    width: 400px;
}

#main .two-thirds .capacity-container
{
    margin-bottom: 25px;
    margin-top: 15px;
}

#main .two-thirds .left .capacity-container.left
{
    float: left;
    margin-right: 55px;
    width: 180px;
}

#main .two-thirds .left .capacity-container.right
{
    float: right;
    width: 155px;
}


#main .two-thirds .left .capacity-container .title
{
    font-size: 16px;
    color: #000;
    display: block;
}


#main .two-thirds .left .capacity-container .capacity
{
    font-size: 32px;
    line-height: 32px;
    color: #000;
}


#main .two-thirds .grey
{
    font-size: 18px;
    line-height: 18px;
    color: #bcbcbc;
}

#main .two-thirds .right a#full-spec
{
    color: #095a97;
    font-size: 16px;
    text-decoration: none;
    background-image: url(/assets/images/core/plus.png);
    background-position: center right;
    background-repeat: no-repeat;
    padding-right: 25px;
    display: inline-block;
    height: 22px;
}

#main .two-thirds .right a#full-spec.minus
{
    background-image: url(/assets/images/core/minus.png);
}

#main .two-thirds .right #specification .row
{
    border-bottom: 1px solid #dbdbdb;
    font-size: 16px;
    padding: 15px 40px 15px 0;
}

#main .two-thirds .right #specification .row .title
{
    float: left;
    display: inline-block;
    width: 150px;
}

#main .two-thirds .right #specification .row .value
{
    float: left;
    display: inline-block;
    width: 210px;
}

#main .two-thirds.levels .left
{
    width: 280px;
}

#main .two-thirds.levels .left h1
{
    margin-bottom: 25px;
}

#main .two-thirds.levels .left h3:hover
{
    text-decoration: underline;
}

#main .two-thirds.levels .right
{
    width: 500px;
}

#main .two-thirds.levels .right #stage-container
{
    background-image: url('/assets/images/core/stage.png');
    width: 505px;
    height: 388px;
    position: relative;
    margin-top: 20px;
}

#main .two-thirds.levels .right #stage-container .overlay
{
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 505px;
    height: 388px;
    opacity: 0;
}

#main .two-thirds.levels .right #stage-container .overlay.blue-1
{
    background-image: url('/assets/images/core/stage-parts/blue.png');
}

#main .two-thirds.levels .right #stage-container .overlay.blue-2
{
    background-image: url('/assets/images/core/stage-parts/blue2.png');
}

#main .two-thirds.levels .right #stage-container .overlay.turquoise-1
{
    background-image: url('/assets/images/core/stage-parts/turquoise.png');
}

#main .two-thirds.levels .right #stage-container .overlay.turquoise-2
{
    background-image: url('/assets/images/core/stage-parts/turquoise2.png');
}

#main .two-thirds.levels .right #stage-container .overlay.green-1
{
    background-image: url('/assets/images/core/stage-parts/green.png');
}

#main .two-thirds.levels .right #stage-container .overlay.green-2
{
    background-image: url('/assets/images/core/stage-parts/green2.png');
}

#main .two-thirds.levels .right #stage-container .overlay.lime
{
    background-image: url('/assets/images/core/stage-parts/lime.png');
}

#main .two-thirds.levels .right #stage-container .overlay.show
{
    opacity: 1;
    transition: opacity .4s ease-in-out;
}

#main .two-thirds.levels .right #stage-container .overlay.hide
{
    opacity: 0;
    transition: opacity .4s ease-in-out;
}

#main .two-thirds.levels .level
{
    cursor: pointer;
}

#main .two-thirds.levels .level span
{
    width: 15px;
    height: 15px;
    display: block;
    float: left;
    margin: 2px 10px 0 0;
}

#main .two-thirds.levels h3
{
    padding-bottom: 10px;
}

#main .two-thirds.levels .level span.blue-1
{
    background-color: #023d71;
}

#main .two-thirds.levels .level span.blue-2
{
    background-color: #2b69a0;
}

#main .two-thirds.levels .level span.turquoise-1
{
    background-color: #58ac96;
}

#main .two-thirds.levels .level span.turquoise-2
{
    background-color: #488676;
}

#main .two-thirds.levels .level span.green-1
{
    background-color: #4a851d;
}

#main .two-thirds.levels .level span.green-2
{
    background-color: #76ba43;
}

#main .two-thirds.levels .level span.lime
{
    background-color: #abe381;
}



/* ===| Countdown Timer |======================================================
 *
 * ============================================================================ */

#countdown
{
    width: 289px;
    position: relative;
}

#countdown, #countdown *
{
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

#countdown .state
{
    position: absolute;
    text-align: center;
    text-transform: uppercase;
    top: 0;
    left: 0;
    right: 0;
    color: #fff;
    padding: 24px 8px 0;
    font-size: 22px;
    white-space: nowrap;
}

#countdown .time
{
    font-family: "FSAlbertBold" , arial, serif;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    color: #fff;
    padding: 16px 8px 0;
}

#countdown .time.no-time
{
    background-image: url(/assets/images/core/raymond-weil.png);
    background-repeat: no-repeat;
    background-position: center center;
    height: 110px;
}

#countdown .countdown-row:before, #countdown .countdown-row:after
{
    content: "";
    display: table;
}

#countdown .countdown-row:after
{
    clear: both;
}

#countdown .countdown-row > span
{
    float: left;
    display: block;
    padding: 4px;
}

#countdown .countdown-row > span:first-child
{
    color: #c62c30;
}

#countdown .countdown-row > span + span
{
    padding-left: 20px;
    position: relative;
}

#countdown .countdown-row > span + span + span:before
{
    content: ":";
    font-size: 36px;
    position: absolute;
    left: 2px;
}

#countdown .countdown-row.countdown-show4 > span
{
    width: 25%;
}

#countdown .countdown-row.countdown-show3 > span
{
    width: 33.334%;
}

#countdown .countdown-amount
{
    font-size: 36px;
}

#countdown .countdown-period
{
    display: block;
    font-size: 12px;
    text-transform: uppercase;
}

/* ===| Scotrail Booking |=====================================================
 *
 * ============================================================================ */

.journey-planner
{
    background-image: url(/assets/images/core/journey-planner.png);
    font-family: Arial, Helvetica, sans-serif;
	
}

.journey-planner h1
{
    font-family: "Museo Sans" , Arial, Helvetica, sans-serif;
    color: #002663;
    margin: 0 12px;
    padding: 32px 0;
    width: 100%;
}

.journey-planner h1 span
{
    color: #84888b;
    font-weight: bold;
}

.journey-planner form
{
    background-color: #e3edef;
    border: solid 1px #d8d8d8;
    padding: 16px 6px;
}

.journey-planner .form-column
{
    float: left;
    min-height: 1px;
    width: 22%;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.journey-planner .sub-column
{
    float: left;
}

.journey-planner fieldset
{
    padding-left: 8px;
}

.journey-planner legend
{
    padding: 3px 0 10px;
}

.journey-planner label
{
    cursor: pointer;
    display: inline-block;
    vertical-align: baseline;
}

.journey-planner label.option
{
    width: 48%;
    text-align: right;
}

.journey-planner input[type="text"], .journey-planner select
{
    max-width: 100%;
    min-width: 36px;
    margin-bottom: 12px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

/* Everything is being a total dick so I'm gonna do some pretty specific styles here*/
.journey-planner .travellers
{
    width: 12%;
}

#railcard-name
{
    width: 150px;
}

.journey-planner label.text-right
{
    min-width: 40px;
    text-align: right;
    margin-bottom: 12px;
}

.journey-planner .travellers label.text-right
{
    min-width: 55px;
}

.journey-planner .departing select, .journey-planner .returning select
{
    min-width: 42px;
}

.journey-planner .departing input[type="text"], .journey-planner .returning input[type="text"]
{
    max-width: 134px;
}

.journey-planner button[type="submit"]
{
    background: transparent url(/assets/images/buttons/btn-find-tickets.png);
    width: 108px;
    height: 30px;
    border: 0;
    padding: 0;
    display: block;
    overflow: hidden;
    text-indent: -9999px;
}

.journey-planner button[type="submit"]:before
{
    content: "";
    display: block;
    width: 0;
    height: 150%;
}

.journey-planner [disabled]
{
    cursor: not-allowed;
    background-color: #d0d0d0;
    border: 2px solid #d0d0d0;
}

.journey-planner select[disabled]
{
    border-width: 1px;
}

/*
 * Validation  
 */

.form-error
{
    outline: 1px solid red;
}

.form-error-container.on
{
    margin-top: 1em;
    border: 1px solid red;
    padding: 12px;
    background-color: #FFE5E5;
}

/* end */
