@import 'screen/reset.css'; /*Resets browser default settings to give all browsers same starting point*/

/*--General Styles--*/
html { min-height: 100%; }
body { background: #fff; font-size: 62.5%; background: #fff url(../images/footer-tile.gif) repeat-x left bottom; font-family: Arial, Helvetica, sans-serif; color: #000; min-height: 100%; }
/*--Image Replacement=--*/
.ir { display: block; text-indent: -5000px;}
/*--Holder - should be the total width--*/
.holder { width: 933px; margin: 0 auto 0; position: relative; z-index: 1; padding: 0 0 115px;  }

button { cursor: pointer; border: 0; }
strong { font-weight: bold; }
em { font-style: italic; }
.float_l { float: left;}
.float_r { float: right;}

.hide { display: none; }

.txt_align_l { text-align: left;}
.txt_align_c { text-align: center;}
.txt_align_r { text-align: right;}

.clear_both { clear: both; }
.clear { clear: both; margin: 0; padding: 0; visibility: hidden; height: 0;}
.clear_after:after { content: ""; display: block; height: 0; clear: both; }

.bold { font-weight: 700; }

a:focus, a:hover { color: #338ec9; }
a { color: #b82530; text-decoration: underline; overflow: hidden; }

body { font-size: 62.5%; }


/*--Typography--*/   
h1,h2,h3,h4,h5,h6 { font-family: "Trebuchet MS", Verdana, Helvetica, Arial, sans-serif; font-weight: 400; }

h1 { clear: both; margin: 20px 0 15px 0; color: #338ec9; padding: 30px 0 10px; font-size: 2.7em; line-height: 1.2; font-weight: 700; }
h2 { font-size: 2.1em; margin-bottom: 0.4em; clear: both; line-height: 1.25; }
h3 { font-size: 1.5em; line-height: 1.25; margin-bottom: 0.5em; font-weight: bold; }
h4 { font-size: 1em; line-height: 1.25; margin-bottom: 1.25em; }
p { margin: 0 0 1.5em; }
ul, ol { margin:0 1.5em 1.5em 1.5em; }
ul { list-style-type: disc; }
ol { list-style-type: decimal; }
dl { margin: 0 0 1.5em 0; }
dl dt { font-weight: bold; }
dd { margin-left: 0;}
p, ul, ol, dl { font-size: 1.3em; }

/*--General Layout--*/
.page-bg { background: url(../images/bg-tile.gif) repeat-x; }
.header-bg  { background: url(../images/header-bg.jpg) no-repeat center top; }
.header-bg2 { background: url(../images/background-line.gif) repeat-x left 79px; }
.logo { position: absolute; top: 13px; }
#login-button { position: absolute; right: 0; top: 0; font-weight: 700; color: #b82530; }
#login-form p { font-weight: 700; color: #b82530; font-size: 1.2em; }
#login-button a { background: url(../images/login-button.gif) no-repeat; width: 74px; height: 28px; display: inline-block; text-indent: -5000px; position: relative; top: 8px; }
#login-button a:hover, .btn-enter-site a:hover, .btn-register-card a:hover { background-position: left bottom; }
#close-login { margin: 0; }
#close-login a { width: 74px; height: 28px; display: inline-block; margin: 1px 0 0 150px; text-indent: -5000px; }
#login-panel { background: url(../images/login-panel.png) no-repeat; width: 224px; height: 177px; position: absolute; right: 0; top: 8px;}
#login-panel form { padding: 5px 20px; }
#login-panel form p { margin: 0 0 10px; }
#login-panel form p a { color: #fff; }
#login-panel form p a:hover { text-decoration: none; }
#login-panel label { display: block; color: #fff; }
#login-panel input.text { width: 184px; }
.header { padding: 62px 455px 20px 0; height: 255px; background: url(../images/card.jpg) no-repeat 465px 23px; }
.header p { color: #fff; font-size: 1.5em; line-height: 1.2; margin: 0 0 7px; }
.btn-enter-site a { background: url(../images/btn-enter-site.png) no-repeat; width: 298px; height: 44px; position: absolute; top: 264px; left: 0; }
.btn-register-card a { background: url(../images/btn-register-card.png) no-repeat; width: 228px; height: 44px; position: absolute; top: 264px; left: 305px; }
.information-top { background: url(../images/information-top.png) no-repeat; }
.information-bottom { background: url(../images/information-bottom.png) no-repeat; height: 22px; }
.column { width: 259px; float: left; margin: 0 18px 0 0; padding: 17px 20px; }
.column.last { margin: 0; }
.column p a { color: #000; text-decoration:underline; }
.column p a:hover { color: #666; }

.splash-h1 { font-size: 2.7em; line-height: 1.2; margin:0 0 0.2em; padding:0; color: #fff; font-weight: 700; }

.flashes, .social { margin: 0; }
.social { padding-bottom: 20px; }
.flashes li, .social li { list-style: none; margin: 0 0 15px; padding: 0; }
.flashes a { display: block; height: 54px; text-indent: -5000px; }
.social a { display: block; text-indent: -5000px; }
.advice { background: url(../images/flash-advice.gif) no-repeat center top; }
.active { background: url(../images/flash-active.gif) no-repeat center top; }
.health { background: url(../images/flash-health.gif) no-repeat center top; }
.local { background: url(../images/flash-local.gif) no-repeat center top; }
.studio { background: url(../images/flash-studio.gif) no-repeat center top; }
.thrill { background: url(../images/flash-thrill.gif) no-repeat center top; }
.connect { background: url(../images/flash-connect.gif) no-repeat center top; }
.btn_bebo { background: url(../images/logo-bebo.gif) no-repeat center top; height: 52px; }
.btn_facebook { background: url(../images/logo-facebook.gif) no-repeat center top; height: 64px; }
.logo_badhealth a { background: url(../images/logo-badhealth.gif) no-repeat center center; height: 45px; margin: 0 0 15px; }
.logo_ypf a { background: url(../images/logo-ypf.gif) no-repeat; width: 110px; height: 103px; float: left; margin-left: 10px; }
.logo_splash a { background: url(../images/logo-get-wet.gif) no-repeat; width: 110px; height: 103px; float: left; margin-left: 19px; }
.logo_yfu a { background: url(../images/logo-youth4us.gif) no-repeat center bottom; height: 97px; clear: both; }

.tabs { margin: 0; padding: 50px 0 0 0; }
.tabs li { list-style: none; background: url(../images/tab-right.gif) no-repeat right bottom; height: 29px; float: left; margin: 0 2px 0 0; }
.tabs li a { display: inline-block; color: #fff; background: url(../images/tab-left.gif) no-repeat left bottom; height: 19px; padding: 5px 15px; text-decoration: none; }
.tabs li a:hover { text-decoration: underline; }
.tabs li.on { background-position: right top; }
.tabs li.on a { background-position: left top; }

.logout { position: absolute; right: 0; top: 0; }
.logout a.btn-logout { background: url(../images/btn-logout.gif) no-repeat; width: 65px; height: 30px; display: inline-block; text-indent: -5000px; position: relative; top: 8px; margin: 0 0 0 10px; }
.logout a.btn-logout:hover { background-position: left bottom; }

.members-left { width: 560px; float: left; padding: 0; clear: left; }
.members-right { width: 359px; float: right; padding: 35px 0 0 0; }

.connect-left { width: 526px; float: left; padding: 0; clear: left; }
.connect-right { width: 368px; float: right; padding: 105px 0 0 0; }

.paypoint-logo { margin:10px 0; }

.previous a { color: #666; text-decoration: none; }
.news { border-left: 3px solid #ec1d24; padding: 5px 0 5px 10px; margin: 0 0 20px; background: url(../images/small-flash-active.gif) no-repeat left bottom; }
.news h3 { font-size: 1.8em; color: #666; }
.news-date { margin: 0; color: #666; text-align: right; }
.news-active { background-image: url(../images/small-flash-active.gif); border-color: #ec1d24; }
.news-advice { background-image: url(../images/small-flash-advice.gif); border-color: #00ab4e; }
.news-health { background-image: url(../images/small-flash-health.gif); border-color: #47a6dc; }
.news-local { background-image: url(../images/small-flash-local.gif); border-color: #939598; }
.news-studio { background-image: url(../images/small-flash-studio.gif); border-color: #f8a51a; }
.news-thrill { background-image: url(../images/small-flash-thrill.gif); border-color: #6f2a8d; }
.news-connect { background-image: url(../images/small-flash-connect.gif); border-color: #0072bc; }
.news-streetbase { background-image: url(../images/small-flash-streetbase.gif); border-color: #333; }
.news a { color: #000; text-decoration: none; }
.read-more { float:right; margin-left:10px; padding-left:10px; clear:left; border-left:1px #000 solid; }
.read-more a:hover { text-decoration:underline; }

.members-right h2 { margin-bottom: 15px; }
.balance-top { background: url(../images/balance-top.gif) no-repeat; padding: 20px;position: relative; }
.balance-top h3 { color: #666; font-size: 2.1em;  }
.balance-bottom { background: url(../images/balance-bottom.gif) no-repeat left bottom; margin: 0 0 15px; }
.balance { background: url(../images/balance.gif) no-repeat; width: 125px; height: 75px; display: table-cell; vertical-align: middle; text-align: center; color: #fff; font-size: 3.3em; }
.balance a { color: #fff; text-decoration: none; }
.balance a:hover { text-decoration: underline; }
.card-hand { background: url(../images/card-hand.png) no-repeat; width: 218px; height: 149px; position: absolute; right: -12px; bottom: 2px; }
.school-dinners { background: url(../images/school-dinners.png) no-repeat; width: 163px; height: 114px; position: absolute; right: 3px; bottom: 2px; }
.answer { font-weight: 700; }
.edit { font-size: 0.6em; color: #333; }
.edit a, .change-password { color: #666; }
.points-intro { font-size: 1.8em; margin: 0 0 10px; }
.points-figure { color: #b82530; font-weight: 700; }
.rewards-table td, .rewards-table th { border: 2px solid #ccc; border-left: 0; border-top: 0; padding: 5px; font-size: 1.3em; vertical-align: middle;}
.rewards-table { border: 2px solid #ccc; border-right: 0; border-bottom: 0; } 
.rewards-table a { text-decoration: none; color: #000; }
.rewards-summary { font-size: 1.3em; margin: 0 0 15px; display: block; }
.col-reward { width: 325px; }
.col-claim, .col-points { width: 115px; text-align: center; }
.can-get td.col-points { font-weight: 700; background: #338ec9; color: #fff; }
.cant-get td, .rewards-table .cant-get td a { color: #666; }
.cant-get td.col-points { font-weight: 700; background: #e6e6e6; color: #666; }
.rewards-table th { background: #e6e6e6; }
.rewards-table tr:hover td { background: #f1f1f1; }
.rewards-table tr.can-get:hover td.col-points { background: #338ec9; }
.col-claim a { background: url(../images/tick.gif) no-repeat; padding: 0 0 0 18px; font-weight: 700; color: #000; text-decoration: none;  }
.col-claim a:hover { text-decoration: underline; }

.reminder-form, .details-form { width: 400px; margin: 0 auto; }
.reminder-form legend { font-size: 1.3em; margin: 0 0 7px; }
.reminder-form fieldset { margin: 0 0 10px; }
.reminder-form fieldset input { position: relative; top: 1px; }
.reminder-form fieldset p { margin: 0; }
.reminder-form p, .details-form p { margin: 0 0 10px; }
.reminder-form label, .details-form label { display: block; margin: 0 0 4px; }
.reminder-form input.text, .details-form input.text { padding: 4px; width: 390px; }
.details-form select { width: 230px; padding: 4px; }
.reminder-form select { width: 398px; padding: 4px; }
.details-form select.narrow { width: 120px; }
.details-form fieldset { margin: 0 0 20px; }
.details-form legend { font-size: 1.8em; color: #338ec9; font-weight: 700; margin: 0 0 10px; }
.details-form .date_of_birth label { float: left; margin-right: 15px; }
.details-form .date_of_birth select { width: 80px; }
.message_label { font-size: 1.3em; }
.message { font-family: Arial, Helvetica, sans-serif; font-size: 1.3em; padding: 4px; width: 390px; height: 100px; margin: 0 0 10px; }
.details-form .explanation { font-size: 0.8em; }

#set1 label { font-weight: 700; }
p.active { background:url(../images/small-flash-active.gif) no-repeat; padding: 34px 0 0 7px; border-left: 3px solid #ec1d24; }
p.advice { background:url(../images/small-flash-advice.gif) no-repeat; padding: 34px 0 0 7px; border-left: 3px solid #00ab4e; }
p.health { background:url(../images/small-flash-health.gif) no-repeat; padding: 34px 0 0 7px; border-left: 3px solid #47a6dc; }
p.local { background:url(../images/small-flash-local.gif) no-repeat; padding: 34px 0 0 7px; border-left: 3px solid #939598; }
p.studio { background:url(../images/small-flash-studio.gif) no-repeat; padding: 34px 0 0 7px; border-left: 3px solid #f8a51a; }
p.thrill { background:url(../images/small-flash-thrill.gif) no-repeat; padding: 34px 0 0 7px; border-left: 3px solid #6f2a8d; }
p.connect { background:url(../images/small-flash-connect.gif) no-repeat; padding: 34px 0 0 7px; border-left: 3px solid #0072bc; }

.reward-overlay { position: absolute; top: 520px; left: 267px; width: 400px; height: auto; margin: 0; background: #fff; border: 5px solid #338ec9; padding: 20px; display: none; }
.apply-promo { display: block; text-indent: -5000px; width: 358px; height: 96px; background: url(../images/promo_apply_card.gif) no-repeat; margin: 0 0 20px; }
.why-apply-bottom { background: url(../images/why-use-bottom.gif) no-repeat left bottom; width: 358px; margin: 0 0 20px; }
.why-apply-top, .archive { background: url(../images/why-use-top.gif) no-repeat left top; padding: 20px; }
.why-apply-top ul { margin: 0; padding: 10px 0 0 0; }
.archive ul { margin: 0 0 10px 15px; }
.archive ul a { color: #000; text-decoration: none; }
.archive ul a:hover { color: #000; text-decoration: underline; }
.why-apply-top ul li { list-style: none; padding: 0 0 15px 30px; background: url(../images/why-use-tick.gif) no-repeat left top; font-size: 1.4em; color: #333; margin: 0; line-height: 1; }

.safety-heading { padding-top: 40px; }
.safety { margin: 0; padding: 0; }
.safety li { list-style: none; padding: margin: 0; float: left; }
.thinkuknow a { display: block; text-indent: -5000px; background: url(../images/logo-thinkuknow.gif) no-repeat; width: 100px; height: 78px; }
.ceop { padding: 16px 0; margin: 0 0 0 20px; }
.ceop a { display: block; text-indent: -5000px; background: url(../images/logo-ceop.gif) no-repeat; width: 127px; height: 45px; }

/*Events*/
.event_text { padding:0 0 50px; width: 320px;  margin:20px 0 0 0; float: right; }
.event_video { padding:0; width: 270px; margin:20px 0 50px 0; float:left; display:block; }
.event-holder { float:left; width: 600px; padding: 0 0 130px; margin:40px 0 0 20px; }
.event-brand-col { float:right; width: 260px; margin:160px 0 0 0; padding:0; }
.h2_advice, .h2_active, .h2_health, .h2_local, .h2_studio, .h2_thrill, .h2_connect { height: 53px; text-indent: -5000px; margin-left: -15px; margin-bottom:0; padding-bottom:0; }
.h2_advice { background: url(../images/flash-advice.gif) no-repeat left top; }
.h2_active { background: url(../images/flash-active.gif) no-repeat left top; }
.h2_health { background: url(../images/flash-health.gif) no-repeat left top; }
.h2_local { background: url(../images/flash-local.gif) no-repeat left top; }
.h2_studio { background: url(../images/flash-studio.gif) no-repeat left top; }
.h2_thrill { background: url(../images/flash-thrill.gif) no-repeat left top; }
.h2_connect { background: url(../images/flash-connect.gif) no-repeat left top; }
.number_of_events { font-size: 1.5em; border-bottom: 1px dotted #666; padding: 0 0 10px; margin: 0 0 20px;  }
.number_of_events strong { font-size: 1.3em; color: #338EC9;  }
.event_image {width: 108px; float: left; }
.event_details { width: 430px; float: right; }
.event_details a { color: #000; font-weight: 700; }
.image-holder img { border: 5px solid #ccc; margin: 0; }
.event_div { border-bottom: 1px dotted #666; margin: 0 0 15px; padding: 0 0 15px; }
.organisation { font-size: 0.8em; color: #666; }
p.event_date { background: url(../images/icon_calendar.gif) no-repeat; padding: 0 0 3px 30px; width: 190px; float: left; font-size: 1.3em; color: #B82530; margin: 0 0 10px;}
p.event_time { background: url(../images/icon_clock.gif) no-repeat; padding: 0 0 3px 30px; width: 120px; float: right; font-size: 1.3em; color: #B82530; margin: 0 0 10px;}
p.event_address { background: url(../images/icon_address.gif) no-repeat; clear: both; padding: 0 0 0 30px;  margin: 0 0 10px;}
p.event_email { background: url(../images/icon_post.gif) no-repeat 0 3px; clear: both; padding: 0 0 0 30px;  margin: 0 0 10px;}
p.event_web { background: url(../images/icon_web.gif) no-repeat 7px 0; clear: both; padding: 0 0 0 30px;  margin: 0 0 10px;}
p.event_contact { background: url(../images/icon_contact.gif) no-repeat; clear: both; padding: 0 0 0 30px;  margin: 0 0 10px;}
p.event_phone { background: url(../images/icon_phone.gif) no-repeat 0 2px; clear: both; padding: 0 0 0 30px;  margin: 0 0 10px;}
.image_holder { height: 108px; margin: 0 0 10px;  }
.event_image p { margin: 0 0 7px 3px; font-weight: 700; }
p.event_who { color: #999; font-style: italic; }
p.book_info { font-weight: 400; }
.members-left .tabs { height: 29px; border-bottom: 2px solid #B82530; }
.events-intro { padding: 30px 0 10px; }
.events { border-left: 3px solid #ec1d24; padding: 5px 0 40px 10px; margin: 0 0 20px; background: url(../images/small-flash-active.gif) no-repeat left bottom; }
.events strong { font-size: 1.5em; }
.events p { margin: 0 0 5px; }
.news-active { background-image: url(../images/small-flash-active.gif); border-color: #ec1d24; }
.news-advice { background-image: url(../images/small-flash-advice.gif); border-color: #00ab4e; }
.news-health { background-image: url(../images/small-flash-health.gif); border-color: #47a6dc; }
.news-local { background-image: url(../images/small-flash-local.gif); border-color: #939598; }
.news-studio { background-image: url(../images/small-flash-studio.gif); border-color: #f8a51a; }
.news-thrill { background-image: url(../images/small-flash-thrill.gif); border-color: #6f2a8d; }
.news-connect { background-image: url(../images/small-flash-connect.gif); border-color: #0072bc; }
.news-streetbase { background-image: url(../images/small-flash-streetbase.gif); border-color: #333; }
.events a { color: #000; }
.events a:hover { text-decoration: none; }

.subnav { background: #B82530; clear: both; margin: 0; }
.subnav li { list-style: none; margin: 0; padding: 0; display: inline-block; }
.subnav li a { display: inline-block; padding: 10px 10px 5px; color: #fff; text-decoration: none; }
.subnav li a:hover, .subnav li.on a { text-decoration: underline; }

.content-left { float: left; width: 505px; margin: 0; }
.connect-card { float: left; margin: 0 20px 10px 0; }
.rewards { background: url(../images/rewards-bottom.gif) no-repeat left bottom; width: 409px; float: right; margin: 110px 0 40px; }
.rewards-top { background: url(../images/rewards-top.gif) no-repeat; padding: 15px; }
.rewards-top p, .rewards-top h2, .rewards-top ul, .rewards-top li { color: #fff; }

.action-promos { clear: both; margin: 0; height: 200px; padding: 20px 0 0 0;}
.action-promos li { list-style: none; float: left; margin: 0 16px 0 0; }
.action-promos li.last { margin-right: 0; }

.single-column { min-height: 400px; }
.form-intro { width: 440px; float: left; }
.form-column { float: right; width: 416px; border: 2px solid #B82530; padding: 15px; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; margin: 110px 10px 0 0; }
.register, .search { text-align: right; }
.register button, .search button { padding: 10px; background: #B82530; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; color: #fff; }

.form-column p { margin: 0 0 10px; clear: both; border: 1px solid #ccc; background: #f1f1f1; padding: 8px; }
.form-column div { margin: 0 0 10px; clear: both; border: 1px solid #ccc; background: #f1f1f1; padding: 8px; min-height:55px; }
.form-column div p { border:none; margin:0; padding:0; }
.form-column div label { display: inline-block; width: 150px; text-align:left; margin-bottom:3px; }
.form-column p.register { background: none; border: none; padding: 0; padding: 10px 0 0 0; }
.register_form label, .activate_form label { display: inline-block; width: 150px;}
.activate_form input.text { width: 210px; padding: 3px; }
label {font-weight: bold; text-align: right; margin: 0 5px 0 0;}
.register_form legend, .activate_form legend { font-size: 1.2em; padding: 10px 0 0;}
.date_of_birth label { margin: 0 10px 0 0; width: auto; }
legend { font-size: 1.4em; margin: 0 0 10px;}

.bottom-margin { margin-bottom:150px; }

.stages { margin: 5px 0 20px; height: 22px; }
.stages li { width: 25%; float: left; list-style: none; margin: 0; padding: 0; font-weight: 700; text-align: center; height: 22px; background: url(../images/steps.png) no-repeat center top; color: #fff; }
.stages li.stage-on { background-position: center bottom; }
.data_protection p { border: none; background: none; padding: 0; }
.data_protection label { padding: 0; width: auto; text-align: left; }
.event-types { float:left; width: 860px; padding: 0 0 130px; margin-left:38px; }
.event-search { float: left; width: 151px; border: 2px solid #B82530; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; padding: 10px; background: #f1f1f1; margin: 75px 0 0; }
.event-search select { width: 150px; }
.event-search p { margin: 0 0 8px; }
.event-types div { background-position: 5px 5px !important; padding: 80px 15px 50px;  -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; margin: 0 10px 10px 0; width: 245px; float: left; min-height: 190px; position: relative; }
.event-types div img, .form-column div img { border:1px solid #333; margin:4px 10px 0 0; }
.event-types div.last { margin-right: 0; }
.event-types h2 { display: none; }
.event-types .active { border: 2px solid #EC1C24; }
.event-types .studio { border: 2px solid #F9A51B; }
.event-types .advice { border: 2px solid #00AB4E; }
.event-types .local { border: 2px solid #939598; }
.event-types .thrill { border: 2px solid #6F2A8D; }
.event-types .health { border: 2px solid #47A6DC; }
.event-types .connect { border: 2px solid #0072BC; }
.activities_link { font-weight: 700; display: block; padding: 5px; background: #333; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; position: absolute; left: 15px; bottom: 15px; width: 233px; color: #fff; text-decoration: none; text-align: center; }
.activities_link:hover { background: #ccc; }
.info_small_btn { display: inline-block; background: url(../images/info-btn.png) no-repeat; width: 14px; height: 14px; text-indent: -5000px; text-align: left; }

.copyright_info { font-size:1.1em; width:925px; padding:11px 4px 4px; border-top:solid 1px #ccc; margin-top:50px; color:#666; }
.copyright_info a { color:#666; text-decoration:none; }
.copyright_info a:hover { color:#333; text-decoration:underline; }
.credit { float:right; text-align:right; }