/*
* HTML5 Boilerplate
*
* What follows is the result of much research on cross-browser styling.
* Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
* Kroc Camen, and the H5BP dev community and team.
*
* Detailed information about this CSS: h5bp.com/css
*
* ==|== normalize ==========================================================
*/
/* =============================================================================
HTML5 display definitions
========================================================================== */
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }f
/* =============================================================================
Base
========================================================================== */
/*
* 1. Correct text resizing oddly in IE6/7 when body font-size is set using em units
* 2. Prevent iOS text size adjust on device orientation change, without disabling user zoom: h5bp.com/g
*/
html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
html, button, input, select, textarea { font-family: sans-serif; color: #222; }
body { margin: 0; font-size: 12px; color: #363636; background: #f0f0f0 url("../images/bmx/site/bg.png") no-repeat center top; text-align: center;}
iframe {border: none;}
/*
* Remove text-shadow in selection highlight: h5bp.com/i
* These selection declarations have to be separate
* Also: hot pink! (or customize the background color to match your design)
*/
::-moz-selection { background: #fe57a1; color: #fff; text-shadow: none; }
::selection { background: #fe57a1; color: #fff; text-shadow: none; }
/* =============================================================================
Links
========================================================================== */
a { color: #00e; outline: 0; }
a:visited { color: #551a8b; }
a:hover { color: #06e; }
a:focus { outline: thin dotted; }
/* Improve readability when focused and hovered in all browsers: h5bp.com/h */
a:hover, a:active { outline: 0; }
/* =============================================================================
Typography
========================================================================== */
abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
blockquote { margin: 1em 40px; }
dfn { font-style: italic; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
ins { background: #ff9; color: #000; text-decoration: none; }
mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
/* Redeclare monospace font family: h5bp.com/j */
pre, code, kbd, samp { font-family: monospace, serif; _font-family: 'courier new', monospace; font-size: 1em; }
/* Improve readability of pre-formatted text in all browsers */
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
q { quotes: none; }
q:before, q:after { content: ""; content: none; }
small { font-size: 85%; }
/* Position subscript and superscript content without affecting line-height: h5bp.com/k */
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }
/* =============================================================================
Lists
========================================================================== */
ul, ol { margin: 1em 0; padding: 0 0 0 40px; }
dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }
/* =============================================================================
jQuery Tabs
========================================================================== */
.ui-tabs .ui-tabs-nav,
.faux-tabs ul.faux-tabs-navigation {padding: 0px !important;}
.ui-tabs .ui-tabs-nav li,
.faux-tabs ul.faux-tabs-navigation li {margin: 0px 2px 0px 0px !important;}
.faux-tabs ul.faux-tabs-navigation li {float: left;}
.ui-tabs .ui-tabs-nav li a,
.faux-tabs ul.faux-tabs-navigation li a {background: #000000; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; filter: alpha(opacity=80); -moz-opacity: 0.80; -khtml-opacity: 0.80; opacity: 0.80; color: #ffff00; font-size: 11px !important; font-weight: bold; -moz-border-radius: 5px 5px 0 0; -webkit-border-radius: 5px 5px 0 0; border-radius: 5px 5px 0 0;}
.faux-tabs ul.faux-tabs-navigation li a {padding: 0.5em 1em; display: block;}
.ui-tabs .ui-tabs-nav li.ui-state-hover a,
.ui-tabs .ui-tabs-nav li.ui-state-active a,
.faux-tabs ul.faux-tabs-navigation li a:hover,
.faux-tabs ul.faux-tabs-navigation li.selected a {background: #ffffff; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); -moz-opacity: 1.0; -khtml-opacity: 1.0; opacity: 1.0; color: #000000;}
.ui-tabs .ui-tabs-panel,
.faux-tabs .faux-tabs-content {background: #ffffff !important; padding: 10px !important;}
/* =============================================================================
jQuery Accordion
========================================================================== */
.ui-accordion .ui-accordion-header {font-style: normal !important; margin-top: 8px !important; text-transform: none !important;}
.ui-accordion .ui-accordion-header.ui-state-active a {-moz-border-radius: 5px 5px 0 0; -webkit-border-radius: 5px 5px 0 0; border-radius: 5px 5px 0 0; color: #aaa;}
.ui-accordion .ui-accordion-header a {background: #000000; color: #ffff00; font-weight: bold; font-family: 'Helvetica', 'Arial', sans-serif; font-size: 14px !important; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;}
.ui-accordion .ui-accordion-content {background: #ffffff; -moz-border-radius: 0 0 5px 5px; -webkit-border-radius: 0 0 5px 5px; border-radius: 0 0 5px 5px;}
.ui-accordion .ui-accordion-content p {margin: 0px;}
.ui-accordion .ui-accordion-content img {background: #ffffff; margin: 0px 10px 10px 0px;}
.ui-accordion .ui-accordion-content .accordion_content_bg {background: #ffffff; padding: 10px;}
/* =============================================================================
jQuery Tooltip
========================================================================== */
#tooltip {
position: absolute;
z-index: 3000;
-moz-box-shadow: 0px 0px 4px #666;
-webkit-box-shadow: 0px 0px 4px #666;
box-shadow: 0px 0px 4px #666;
background-color: #fff;
width: 222px;
}
.tooltip_body {display: none;}
/* =============================================================================
jQuery Moving Boxes
========================================================================== */
.mb-wrapper {
border: solid 10px #ebebeb !important;
background: #ebebeb !important;
margin: 0 auto;
position: relative;
left: 0;
top: 0;
border-radius: 0px !important;
-moz-border-radius: 0px !important;
-webkit-border-radius: 0px !important;
box-shadow: none !important;
-moz-box-shadow: none !important;
-webkit-box-shadow: none !important;
}
.mb-scroll {
border-radius: 5px !important;
-moz-border-radius: 5px !important;
-webkit-border-radius: 5px !important;
background: url("../images/bmx/site/moving_boxes_bg.gif") repeat-x top left;
margin: 10px 0px;
}
.mb-slider .mb-panel {width: 250px; padding: 20px 5px !important;}
.mb-slider .mb-panel .mb-inside {background: #ffffff; border: solid 2px #efefef !important;}
.mb-slider .mb-panel .mb-inside img {margin-bottom: 15px; display: block;}
.mb-slider .mb-panel p {margin: 0px; font-size: 12px;}
a.mb-scrollButtons.mb-left {
background-image: url("../images/bmx/site/moving_boxes_left_arrow.png") !important;
background-position: right center !important;
}
a.mb-scrollButtons.mb-right {
background-image: url("../images/bmx/site/moving_boxes_right_arrow.png") !important;
background-position: left center !important;
}
.mb-left-shadow {
background-image: url("../images/bmx/site/leftshadow.png") !important;
-moz-border-radius: 5px 0 0 5px;
-webkit-border-radius: 5px 0 0 5px;
border-radius: 5px 0 0 5px;
}
.mb-right-shadow {
background-image: url("../images/bmx/site/rightshadow.png") !important;
-moz-border-radius: 0 5px 5px 0;
-webkit-border-radius: 0 5px 5px 0;
border-radius: 0 5px 5px 0;
}
/* =============================================================================
jQuery Map
========================================================================== */
#map_container {width:665px; height:550px; overflow:hidden; position:relative; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; background: #999;}
#map-ca {position:absolute; top:-725px; left:-156px;}
#map-usa {position:absolute; bottom: 0px;}
/* =============================================================================
jQuery Sticky Nav
========================================================================== */
#main_nav_wrap {position: relative; z-index: 5;}
#main_nav_wrap #main_nav {width: 980px; z-index: 6;}
#main_nav_wrap #main_nav.sticky {-moz-box-shadow: 0px 0px 4px #666; -webkit-box-shadow: 0px 0px 4px #666; box-shadow: 0px 0px 4px #666;}
#main_nav_wrap #main_nav.sticky {padding-left: 80px; width: 900px;}
#main_nav_wrap #main_nav.sticky form#search_form {margin-left: 5px;}
#main_nav_wrap #main_nav.sticky form#search_form input[type="text"] {width: 105px;}
#main_nav_wrap #nav_flag {position: fixed; top: -60px; padding-left: 5px; z-index: 10;}
/* =============================================================================
jQuery UI Dialog
========================================================================== */
.ui-dialog-content form label {float: left; padding-top: 6px;}
.ui-dialog-content ul {text-align: left;}
.ui-dialog-content ul li {margin-bottom: 10px;}
.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button {font-size: 11px !important;}
/* =============================================================================
Embedded content
========================================================================== */
/*
* 1. Improve image quality when scaled in IE7: h5bp.com/d
* 2. Remove the gap between images and borders on image containers: h5bp.com/i/440
*/
img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }
/*
* Correct overflow not hidden in IE9
*/
svg:not(:root) { overflow: hidden; }
/* =============================================================================
Figures
========================================================================== */
figure { margin: 0; }
/* =============================================================================
Forms
========================================================================== */
form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }
/* Indicate that 'label' will shift focus to the associated form element */
label { cursor: pointer; }
/*
* 1. Correct color not inheriting in IE6/7/8/9
* 2. Correct alignment displayed oddly in IE6/7
*/
legend { border: 0; *margin-left: -7px; padding: 0; white-space: normal; }
/*
* 1. Correct font-size not inheriting in all browsers
* 2. Remove margins in FF3/4 S5 Chrome
* 3. Define consistent vertical alignment display in all browsers
*/
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
/*
* 1. Define line-height as normal to match FF3/4 (set using !important in the UA stylesheet)
*/
button, input { line-height: normal; }
/*
* 1. Display hand cursor for clickable form elements
* 2. Allow styling of clickable form elements in iOS
* 3. Correct inner spacing displayed oddly in IE7 (doesn't effect IE6)
*/
button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; *overflow: visible; }
/*
* Re-set default cursor for disabled elements
*/
button[disabled], input[disabled] { cursor: default; }
/*
* Consistent box sizing and appearance
*/
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; *width: 13px; *height: 13px; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }
/*
* Remove inner padding and border in FF3/4: h5bp.com/l
*/
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
/*
* 1. Remove default vertical scrollbar in IE6/7/8/9
* 2. Allow only vertical resizing
*/
textarea { overflow: auto; vertical-align: top; resize: vertical; }
/* Colors for form validity */
input:valid, textarea:valid { }
input:invalid, textarea:invalid { background-color: #f0dddd; }
/* =============================================================================
Tables
========================================================================== */
table { border-collapse: collapse; border-spacing: 0; margin-bottom: 20px; width: 100%;}
td { vertical-align: middle; }
table th {background: #dbdbdb; padding: 10px; color: #666; font-weight: bold; border-right: solid 1px #ffffff;}
table th:last-child {border: none;}
table tr td {border-right: solid 1px #ffffff;}
table:not(.calendar_month) tr td:last-child {border-right: none;}
table:not(.calendar_month) tr:nth-child(even) td {background: #efefef;}
table tr td {background: #ffffff; padding: 5px 10px 5px 10px;}
/* =============================================================================
Chrome Frame Prompt
========================================================================== */
.chromeframe { margin: 0.2em 0; background: #ccc; color: black; padding: 0.2em 0; }
/* ==|== primary styles =====================================================
Author:
========================================================================== */
/* ----------------------------------------------
HTML ELEMENTS
-----------------------------------------------*/
/* Links */
a {color: #006699; text-decoration: none; outline: 0;}
a:hover {color: #006699; text-decoration: underline; outline: 0;}
a:visited {color: #006699; outline: 0;}
a:focus {outline: 0;}
/* Fonts */
@font-face {
font-family: 'Grotesque-SemiBold';
src: url('../fonts/grotesque_semibold.eot');
src: url('../fonts/grotesque_semibold.eot?#iefix') format('embedded-opentype'),
url('../fonts/grotesque_semibold.woff') format('woff'),
url('../fonts/grotesque_semibold.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Grotesque-Light';
src: url('../fonts/grotesque_light.eot');
src: url('../fonts/grotesque_light.eot?#iefix') format('embedded-opentype'),
url('../fonts/grotesque_light.woff') format('woff'),
url('../fonts/grotesque_light.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Calgary';
src: url('../fonts/calgary.eot');
src: url('../fonts/calgary.eot?#iefix') format('embedded-opentype'),
url('../fonts/calgary.woff') format('woff'),
url('../fonts/calgary.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
/* Text */
h1 { font-size: 28px; margin: 0px 0px 20px 0px;}
h2 { font-size: 23px; margin: 0px 0px 15px 0px;}
h3 { font-size: 20px; margin: 0px 0px 10px 0px;}
h4 { font-size: 18px; margin: 0px 0px 10px 0px;}
h5 { font-size: 15px; margin: 0px 0px 10px 0px;}
h6 { font-size: 14px; margin: 0px 0px 10px 0px;}
blockquote, blockquote p {color: #666; margin: 0px 40px 40px 40px; line-height: 20px;}
p {margin-bottom: 15px;}
input {}
small {}
.grey {color: #999;}
.red {color: #C9202C !important;}
/* Buttons */
.button {display: inline-block; padding: 10px 12px; color: #fff; background: #a9a9a9; font-weight: bold; border: none; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;}
.button:hover {color: #ffffff;}
.button.blue {background: #006699;}
.add {display: block; width: 20px; height: 20px; background: url("../images/bmx/site/icon_add_plus.png") no-repeat left top;}
.no_add {display: block; width: 20px; height: 20px; background: url("../images/bmx/site/icon_add_plus_off.png") no-repeat left top;}
.remove {margin: 0 auto; display: block; width: 20px; height: 20px; background: url("../images/bmx/site/icon_remove_minus.png") no-repeat left top;}
/* Forms */
div.form_column {width: 48%; float: left;}
label {display: block; font-weight: bold; margin-bottom: 5px; text-transform: uppercase; color: #999; font-size: 11px;}
input[type="text"], input[type="password"], input[type="email"], input[type="file"] {background: #ffffff; border: none; padding: 8px; font-size: 12px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -moz-box-shadow: 2px 2px 0px #ccc; -webkit-box-shadow: 2px 2px 0px #ccc; box-shadow: 2px 2px 0px #ccc; margin-bottom: 10px;}
select {margin-bottom: 10px; padding: 3px;}
textarea {background: #ffffff; border: none; padding: 8px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -moz-box-shadow: 2px 2px 0px #ccc; -webkit-box-shadow: 2px 2px 0px #ccc; box-shadow: 2px 2px 0px #ccc; margin-bottom: 10px;}
.blue, .green, .red-btn, .btn {padding: 5px 10px 3px 10px; border: none; color: #ffffff !important; text-transform: uppercase; font-weight: bold; -moz-border-radius: 3px; border-radius: 3px;}
.btn.grey {background: #a9a9a9;}
.blue {background: #069;}
.green {background: #39b54a;}
.red-btn {background: #c00;}
a.blue, a.green, a.red-btn {text-decoration: none}
input[type="text"]:disabled,
input[type="password"]:disabled,
input[type="email"]:disabled,
input[type="file"]:disabled
textarea:disabled {
background: #dddddd;
}
.form-or-form form {
width: 290px; /* (670 - 90) / 2 */
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.form-or-form #register_or {
width: 50px;
text-align: center;
}
input[type="text"].simple,
input[type="password"].simple,
input[type="email"].simple,
input[type="file"].simple {
border: solid 1px #999;
width: auto;
padding: 5px;
border-radius: 0px;
box-shadow: none;
}
/* Miscellaneous */
.clear {clear: both;}
.left {float: left;}
.right {float: right;}
.align-center {margin: 0 auto; display: block;}
.text-left {text-align: left !important;}
.text-right {text-align: right !important;}
.text-center {text-align: center !important;}
.hide {display: none;}
.no-style {margin: 0px; padding: 0px; list-style: none;}
.alert-box {
padding: 1em;
margin-bottom: 2em;
font-weight: bold;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
color: #ffffff;
}
.alert-box.error {
border: 1px solid #800;
background-color: #c00;
text-shadow: 1px 1px 0px #700;
}
.alert-box.info {
border: 1px solid #006699;
background-color: #0093dd;
text-shadow: 1px 1px 0px #a00;
}
.alert-box.success {
border: 1px solid #080;
background-color: #0a0;
text-shadow: 1px 1px 0px #070;
}
.grey_wrap {background: #f6f6f6; padding: 15px; margin-bottom: 20px;}
.grey_wrap h2 {padding-bottom: 15px; border-bottom: solid 1px #aaa;}
.white_wrap {background: #ffffff; padding: 15px; margin: 10px 0; border-radius: 5px;}
.rounded_corners {-moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;}
.boxed-item {
background: #eee;
border-bottom: 1px solid #ccc;
-moz-border-radius: 5px;
border-radius: 5px;
color: #444;
display: inline-block;
padding: 5px 10px;
}
a.boxed-item:hover {
background: #ddd;
color: inherit;
text-decoration: none;
}
a.boxed-item:visited {
color: inherit;
}
.btn {
display: inline-block;
line-height: 14px;
background: #069;
}
#main_content .btn-big {
display: inline-block;
font-size: 1.2em !important;
font-weight: normal;
padding: 10px 15px;
}
.inline-block {
display: inline-block;
}
.margin-top {margin-top: 10px;}
.margin-right {margin-right: 10px;}
.margin-bottom {margin-bottom: 10px;}
.margin-left {margin-left: 10px;}
ul.striped li:nth-child(even), ol.striped li:nth-child(even) {background: #efefef;}
span.grotesque_light {font-family: 'Grotesque-Light', 'Helvetica', 'Arial', sans-serif !important;}
span.grotesque_semibold {font-family: 'Grotesque-SemiBold', 'Helvetica', 'Arial', sans-serif !important;}
span.calgary {font-family: 'Calgary', 'Helvetica', 'Arial', sans-serif !important;}
div#video_player_container, div#video_player_container_wrapper {margin-bottom: 20px !important;}
div.flow_textfield{color:#000000; text-align:center; font-family:Arial Rounded MT Bold;}
.flow_textfield h1{font-size:13px; line-height:21px;}
.flow_textfield h2{font-size:11px;}
.three-columns {
overflow: hidden;
}
.three-columns > div {
-moz-box-sizing: border-box;
box-sizing: border-box;
float: left;
padding-right: 20px;
width: 33%;
}
.divided-list li {
border-bottom: 1px solid #ddd;
margin-bottom: 5px;
padding-bottom: 5px;
}
/*------------------------------------------
LAYOUT
-------------------------------------------*/
.center {width: 980px; margin: 0 auto; text-align: left;}
#header #pencil_ad {width: 980px; position: relative; z-index: 100;}
#header #pencil_ad #hover_image_wrap {display: none;}
#header #header_inner {background: url("../images/bmx/site/header_bg.png") repeat-y left top; position: relative; -moz-box-shadow: 0px 0px 4px #dedede; -webkit-box-shadow: 0px 0px 4px #dedede; box-shadow: 0px 0px 4px #dedede; padding: 0px 0px 20px 0px;}
#header #header-nav-bar {background: url("../images/bmx/site/membership/CarbonFiberBackground.png"); height: 30px; margin-bottom: 14px;}
#header {position: relative;}
#header h1 {margin: 0px;}
#header h1.us_logo a#logo {width: 535px; height: 49px; display: block; margin: 0 auto; background: url("../images/bmx/site/usabmx_2018_long.png") no-repeat left top; background-size: cover; text-indent: -9999px;}
#header h1.ca_logo a#logo {width: 572px; height: 53px; display: block; margin: 0 auto; background: url("../images/bmx/site/logo_ca.png") no-repeat left top; text-indent: -9999px;}
#header #user_nav {position: absolute; top: 5px; left: 20px; color: #999;}
#header #user_nav a {color: #999; text-decoration: underline; font-weight: bold; font-size: 11px;}
#header #user_nav a:hover {text-decoration: none;}
#header #social_nav {float: left; padding-left: 20px; padding-top: 5px;}
#header #social_nav a {display: block; float: left; text-indent: -9999px; margin-right: 5px;}
#header #social_nav a#newsletter {width: 72px; height: 18px; background: url("../images/bmx/site/icon_header_newsletter.png") no-repeat left top;}
#header #social_nav a#facebook {width: 19px; height: 18px; background: url("../images/bmx/site/membership/facebook-icon.png") no-repeat left top;}
#header #social_nav a#twitter {width: 19px; height: 18px; background: url("../images/bmx/site/membership/twitter-icon.png") no-repeat left top;}
#header #social_nav a#rss {width: 19px; height: 18px; background: url("../images/bmx/site/membership/rss-icon.png") no-repeat left top;}
#header #social_nav a#instagram {width: 19px; height: 18px; background: url("../images/bmx/site/membership/instagram-icon.png") no-repeat left top;}
#header-nav-bar .header-right-divs {
height: 100%;
float: right;
}
#header-nav-bar #header-get-membership {
text-align: center;
width: 188px;
display: inline-block;
height: 100%;
background: var(--neon-red);
padding: 0px 15px;
-webkit-transform-origin: 100% 0;
-ms-transform-origin: 100% 0;
transform-origin: 100% 0;
-webkit-transform: skew(-45deg);
-ms-transform: skew(-45deg);
transform: skew(-45deg);
}
#header-nav-bar #header-get-membership a, #header-get-membership a:visited, #header-account-container a, #header-account-container a:visited {
color: white;
text-decoration: none;
padding-top: 3px;
padding-right: 6px;
}
#header-nav-bar #header-get-membership #get-membership {
color: white;
font-family: industry, sans-serif;
font-weight: bold;
font-size: 14px;
padding-top: 6px;
letter-spacing: 0.2px;
vertical-align: middle;
-webkit-transform: skew(45deg);
-ms-transform: skew(45deg);
transform: skew(45deg);
/* padding-right: 22px;*/
}
#header-nav-bar #header-account-container {
display: inline-block;
height: 100%;
width: 178px;
position: relative;
background: var(--marine-blue);
z-index: 200;
text-align: center;
}
#header-nav-bar #header-account-container:after {
content: " ";
position: absolute;
display: block;
width: 100%;
height: 100%;
top: 0;
left: -35px;
z-index: -1;
background: var(--marine-blue);
transform-origin:bottom left;
-ms-transform: skew(-45deg,0deg);
-webkit-transform: skew(-45deg,0deg);
transform: skew(-45deg,0deg);
}
#header-nav-bar #header-account {
color: white;
font-family: industry, sans-serif;
font-weight: bold;
font-size: 14px;
z-index: 999;
padding-top: 6px;
letter-spacing: 0.2px;
}
#header-account-logged-in {
cursor: pointer;
}
#account-icon-logged-out {
position: absolute;
top: 5px;
left: 12px;
}
#account-icon-logged-in {
position: absolute;
top: 7px;
left: 31px;
padding-right: 5px;
}
#account-dropdown {
display: none;
background: #255c97;;
padding: 0px;
width: 213px;
margin: 0px;
border-radius: 0px;
z-index: 1000;
position: absolute;
top: 30px;
left: -35px;
opacity: 100%;
box-shadow: 2px 2px 4px 1px rgba(0, 0, 0, 0.4);
}
.account-dropdown-arrow {
padding-left: 4px;
}
#account-dropdown li {
font-weight: bold;
background: #255c97;
text-align: left;
padding: 11px 40px;
position: relative;
border-top: 1px solid rgba(216, 216, 216, 0.2);
}
#account-dropdown li a {
font-weight: bold;
padding: 0px;
letter-spacing: 0.2px;
}
#account-dropdown li a:hover {
background: #255c97;
color: rgba(216, 216, 216, 0.2);
}
#dropdown-arrow-up {
display: none;
}
/* #header #header-get-membership:after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: var(--neon-red);
-webkit-transform-origin: 100% 0;
-ms-transform-origin: 100% 0;
transform-origin: 100% 0;
-webkit-transform: skew(-45deg);
-ms-transform: skew(-45deg);
transform: skew(-45deg);
z-index: -1;
}*/
nav#main_nav_wrap {position: relative; z-index: 10;}
ul#main_nav {list-style: none; background: url("../images/bmx/site/main_nav_bg.png") repeat-y left top; -moz-border-radius: 0 0 4px 4px; -webkit-border-radius: 0 0 4px 4px; border-radius: 0 0 4px 4px; -moz-box-shadow: 0px 0px 4px #dedede; -webkit-box-shadow: 0px 0px 4px #dedede; box-shadow: 0px 0px 4px #dedede;}
ul#main_nav li {float: left; margin: 0px;}
ul#main_nav li:first-child {margin-left: 10px;}
ul#main_nav li a {display: block; padding: 12px 10px 10px 10px; color: #ffffff; font-size: 15px; font-family: 'Grotesque-SemiBold'; text-transform: uppercase;}
ul#main_nav li a:hover,
ul#main_nav li.current a {color: #e31b22; text-decoration: none; background: #363636;}
ul#main_nav li:hover div.sub_menu {display: block;}
ul#main_nav div.sub_menu {display: none; position: absolute; top: 37px; left: 0px; background: url("../images/bmx/site/main_nav_bg.png") repeat-y left top; z-index: 500; width: 940px; height: 130px; border-top: solid 2px #333; padding: 20px; -moz-border-radius: 0 0 4px 4px; -webkit-border-radius: 0 0 4px 4px; border-radius: 0 0 4px 4px;}
ul#main_nav div.sub_menu h6 {color: #ffff00; margin-bottom: 10px; text-transform: uppercase; font-weight: normal; font-size: 16px;}
ul#main_nav div.sub_menu div.drop_down_ads {position: absolute; top: 15px; right: 20px; zoom: 1;}
ul#main_nav div.sub_menu div.drop_down_ads div.ddnil {float: left;}
ul#main_nav div.sub_menu div.drop_down_ads a img {border: solid 3px #363636;}
ul#main_nav div.sub_menu div.drop_down_ads a:hover {background: none;}
ul#main_nav div.sub_menu div.drop_down_ads a:hover img {border: solid 3px #bbb;}
ul#main_nav div.sub_menu div.drop_down_ads div.ddnil:last-child {margin-right: 0px;}
ul#main_nav div.sub_menu ul {display: block; float: left; border-right: solid 1px #363636; margin-right: 15px;}
ul#main_nav div.sub_menu ul li {float: none; width: 175px;}
ul#main_nav div.sub_menu ul li:first-child {margin: 0;}
ul#main_nav div.sub_menu ul li a {font-family: "Helvetica", "Arial", sans-serif; color: #bbb; font-weight: bold; font-size: 12px; padding: 3px; text-transform: none;}
ul#main_nav div.sub_menu ul li a:hover {color: #fff; background: none;}
ul#main_nav li.current div.sub_menu ul li a {background: none;}
/* Search */
nav#main_nav_wrap form#search_form {padding-top: 7px; margin-left: 10px;}
nav#main_nav_wrap form#search_form input[type="text"] {width: 175px; height: 14px; padding: 4px 8px; color: #999; font-weight: bold; font-size: 12px; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; background: url("../images/bmx/site/search_bg.gif") repeat-x top left; font-size: 10px; margin: 0px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; border: solid 2px #333333;}
div#breadcrumbs ul {margin: 0px; padding: 8px 0px 8px 10px; list-style: none;}
div#breadcrumbs ul li {float: left; margin: 0px; padding-right: 5px;}
div#breadcrumbs ul li:before {content: "/"; color: #888;}
div#breadcrumbs ul li:first-child:before {content: "";}
div#breadcrumbs ul li a {font-weight: bold; font-size: 11px; padding-left: 5px; text-shadow: 0px 0px 12px #ffffff;}
div#breadcrumbs ul li:first-child a {padding-left: 0px;}
div#breadcrumbs ul li a.active {font-weight: normal; color: #888;}
#main {/*margin: 25px 0px 35px 0px;*/ margin:0px 0px 35px 0px; background-color:#fff; /*<---my changes -tavo*/ -moz-border-radius: 0px 0px 5px 5px; -webkit-border-radius: 0px 0px 5px 5px; border-radius: 0px 0px 5px 5px;}
#main.fullwidth {}
#main.left_sidebar_present {background: url("../images/bmx/site/twocol_left_sidebar_bg.gif") repeat-y left top;}
#main.right_sidebar_present {background: url("../images/bmx/site/twocol_right_sidebar_bg.gif") repeat-y left top;}
#main.two_column #main_content {width: 700px; padding: 35px 20px; overflow: hidden; float: left;}
#main.two_column #left_sidebar {width: 240px; float: left;}
#main.two_column #right_sidebar {width: 240px; float: right;}
#main.three_column {background: url("../images/bmx/site/threecol_bg.gif") repeat-y left top;}
#main.three_column #main_content {width: 460px; padding: 35px 20px; float: left;}
#main.three_column #left_sidebar {width: 240px; float: left;}
#main.three_column #right_sidebar {width: 240px; float: left;}
#main_content {min-height: 600px;}
#main_content.home {background: transparent;}
#main_content h1 {font-family: 'Grotesque-SemiBold', 'Helvetica', 'Arial', sans-serif; font-weight: normal; text-transform: uppercase;}
#main_content h2 {font-family: 'Grotesque-SemiBold', 'Helvetica', 'Arial', sans-serif; font-weight: normal; text-transform: uppercase;}
#main_content h3 {font-family: 'Grotesque-SemiBold', 'Helvetica', 'Arial', sans-serif; font-weight: normal; text-transform: uppercase;}
#main_content h4 {font-family: 'Grotesque-Light', 'Helvetica', 'Arial', sans-serif; font-weight: normal; text-transform: uppercase;}
#main_content h5 {font-family: 'Grotesque-Light', 'Helvetica', 'Arial', sans-serif; font-weight: normal; font-style: italic; text-transform: uppercase;}
#main_content h6 {font-family: 'Grotesque-SemiBold', 'Helvetica', 'Arial', sans-serif; font-weight: normal; text-transform: uppercase;}
#main_content p {line-height: 18px;}
#main_content ul, ol {line-height: 18px;}
#main_content ul li, ol li {margin-bottom: 8px;}
/* Inner Pages */
#main_content_header {height: 88px; border-bottom: solid 1px #ffffff;}
#main_content_header #section_title {width: 240px; height: 88px; background: url("../images/bmx/site/section_title_bg.png") no-repeat left top; float: left; -moz-border-radius: 5px 0px 0px 0px; -webkit-border-radius: 5px 0px 0px 0px; border-radius: 5px 0px 0px 0px;}
#main_content_header #section_title h4 {margin: 55px 0px 0px 20px; color: #ffffff; font-size: 26px; font-weight: normal; text-transform: uppercase;}
#main_content_header #content_header_ad {width: 740px; height: 88px; float: left; -moz-border-radius: 0px 5px 0px 0px; -webkit-border-radius: 0px 5px 0px 0px; border-radius: 0px 5px 0px 0px;}
#left_sidebar ul#left_sub_nav {list-style: none; margin: 0px; padding: 20px 10px; background: #f6f6f6; border-bottom: solid 1px #ffffff;}
#left_sidebar ul#left_sub_nav li {border-bottom: solid 1px #e3e3e3; margin: 0px; padding: 0px;}
#left_sidebar ul#left_sub_nav li a, .profiles #left_sidebar ul#left_sub_nav li button {padding: 10px 0px 7px 5px; font-weight: bold; display: block;}
#left_sidebar ul#left_sub_nav li ul {list-style: none; margin: 0px 0px 12px 10px; padding: 0px;}
#left_sidebar ul#left_sub_nav li ul li {border: none;}
#left_sidebar ul#left_sub_nav li ul li a {font-size: 11px; color: #999999; padding: 6px 0px 3px 0px;}
#left_sidebar ul#left_sub_nav li ul li a:hover, #left_sidebar ul#left_sub_nav li ul li.active a {color: #000000; text-decoration: none;}
#right_sidebar #quicklinks {padding: 20px 10px; background: #046296; border-bottom: solid 1px #ffffff; color: #ffffff;}
#right_sidebar #quicklinks h5 {font-family: 'Calgary'; margin: 0px 0px 10px 0px; font-size: 24px; font-weight: normal; text-transform: uppercase;}
#right_sidebar #quicklinks #quicklinks-list {list-style: none; margin: 0px; padding: 0px;}
#right_sidebar #quicklinks #quicklinks-list .callout-text-link {background: url("../images/bmx/site/icon_arrow_right.gif") no-repeat center left; padding: 10px 0px 10px 25px; border-top: solid 1px #5191b5;}
#right_sidebar #quicklinks #quicklinks-list .callout-text-link a {font-weight: bold; color: #ffffff;}
.sidebar_advertisement {padding: 0px 0px 0px 10px;}
.sidebar_advertisement p {color: #999; font-weight: bold; margin-bottom: 10px; font-size: 11px;}
.sidebar_advertisement img {max-width: 220px; margin-bottom: 10px;}
#single_ad .callout-image-link {border-bottom: solid 1px #fff;}
#single_ad .callout-image-link img {width: 240px;}
.right_black_list {background: #000000 url("../images/bmx/site/right_list_bg.png") repeat-x center right; padding: 10px; font-size: 11px; border-bottom: solid 1px #ffffff;}
.right_black_list h3 {color: #ffffff; font-size: 22px; text-transform: uppercase; font-weight: normal; padding-left: 5px; margin: 5px 0px;}
.right_black_list h3 .calgary {letter-spacing: 1px; margin-right: 5px;}
.right_black_list span.yellow {display: inline-block; color: #ffff00; font-size: 18px; text-transform: uppercase; padding: 5px 0px 0px 0px;}
.right_black_list a.view_all {display: inline-block; margin-bottom: 5px;padding: 6px 12px; background: #1c1c1c; color: #6ab4b4;}
.right_black_list .ui-tabs .ui-tabs-nav li {margin-right: 2px;}
.right_black_list .ui-tabs .ui-tabs-nav li a {padding: 6px 8px; font-size: 12px; background: #999999; color: #000000; font-weight: normal !important;}
.right_black_list .ui-tabs .ui-tabs-nav li.ui-state-hover a,
.right_black_list .ui-tabs .ui-tabs-nav li.ui-state-active a {background: #ffffff;}
.right_black_list .ui-tabs .ui-tabs-panel {padding: 5px !important; -moz-border-radius: 0px 5px 5px 5px; -webkit-border-radius: 0px 5px 5px 5px; border-radius: 0px 5px 5px 5px;}
.right_black_list .ui-tabs .ui-tabs-panel ol.striped {background: transparent; padding: 0px; margin: 0px; list-style-position: inside;}
.right_black_list .ui-tabs .ui-tabs-panel ol.striped li {padding: 3px;}
.right_black_list .table_wrap {padding: 5px; background: #ffffff; margin-bottom: 10px;}
.right_black_list .table_wrap table {margin: 0px;}
.right_black_list .table_wrap table tr td {padding: 5px;}
.right_black_list .table_wrap table .grey {color: #555 !important;}
.right_black_list.daily_media h3 {font-size: 19px !important; float: left; padding-top: 10px;}
.right_black_list.daily_media span.yellow {font-size: 15px;}
.right_black_list .daily_media_presenter {background: rgba(255,255,255,0.2); float: right; padding: 5px; margin-bottom: 10px;}
.right_black_list .daily_media_presenter p {margin: 0 0 2px 0; color: #ffffff; text-align: center; font-size: 10px; font-weight: bold;}
.right_black_list .daily_media_preview {padding: 5px; background: #ddd;}
.content-tabs .ui-tabs-nav {position: relative; top: 1px;}
.content-tabs .ui-tabs-nav li.ui-tabs-selected a {border-top: solid 1px #999; border-left: solid 1px #999; border-right: solid 1px #999;}
.content-tabs .ui-tabs-panel {border: solid 1px #999 !important; padding: 3em 2em !important;}
/* DAILY MEDIAS */
a.thumbnail {display: block; position: relative;}
a.thumbnail img.play-icon {position: absolute; left: 45%; top: 45%; border: none; opacity: .8;}
a.thumbnail:hover img.play-icon {opacity: 1;}
.blocks {margin-bottom: 10px;}
.blocks .block {width: 215px; float: left;}
.blocks .block h6 {font-family: 'Helvetica', 'Arial', sans-serif !important; font-weight: bold !important; text-transform: none !important;}
.blocks .block:first-child {margin-right: 20px;}
ul li .image_wrap {float: left; margin-right: 20px;}
ul li .detail {width: auto; overflow: hidden;}
ul li .detail h5, ul li .detail h4 {font-family: 'Helvetica', 'Arial', sans-serif !important; font-weight: bold !important; text-transform: none !important; font-style: normal !important;}
ul li .meta {font-size: 11px; color: #999999;}
ul.pagination {list-style: none; padding: 20px 0px 0px 0px; margin: 0px;}
ul.pagination li {float: left; padding: 0px 2px;}
ul.pagination li a {font-size: 14px; color: #666; padding: 0px 3px;}
ul.pagination li.current a {font-weight: bold; color: #336699;}
/* ul.pagination {padding: 10px 5px; text-align: center;}
ul.pagination .disabled {color: #aaa;}
ul.pagination .current {padding: 3px 5px 2px 5px; background: #006699; color: #fff; font-weight: bold; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;}
ul.pagination .prev_page {float: left;}
ul.pagination .next_page {float: right;}*/
#marketing_tabs {padding: 3px; background: #fff; -moz-box-shadow: 0px 0px 3px #ccc; -webkit-box-shadow: 0px 0px 3px #ccc; box-shadow: 0px 0px 3px #ccc;}
#marketing_tabs .ui-tabs {padding: 0px; background: #efefef url("../images/bmx/site/marketing_overview_panel_bg.gif") repeat-y left top !important;}
#marketing_tabs .ui-tabs .ui-tabs-nav {background: #efefef url("../images/bmx/site/marketing_overview_tabs_bg.gif") repeat-x left bottom; border-bottom: solid 3px #fff;}
#marketing_tabs .ui-tabs .ui-tabs-nav li {margin: 0px !important; border-right: solid 1px #fff; padding: 0px !important;}
#marketing_tabs .ui-tabs .ui-tabs-nav li a {padding: 6px 12px; font-size: 16px !important; text-transform: uppercase; color: #535353; font-weight: normal; background: transparent; -moz-border-radius: 0px; -webkit-border-radius: 0px; border-radius: 0px;}
#marketing_tabs .ui-tabs .ui-tabs-nav li.ui-state-hover a,
#marketing_tabs .ui-tabs .ui-tabs-nav li.ui-state-active a {background: #ffffff;}
#marketing_tabs .ui-tabs .ui-tabs-panel {padding: 0px !important; position: relative;}
#marketing_tabs .ui-tabs .ui-tabs-panel div#presented_by {position: absolute; left: 145px; top: 80px;}
#marketing_tabs .ui-tabs .ui-tabs-panel div#presented_by #presented_by_o {display: none;}
#marketing_tabs .ui-tabs #thesport {padding: 0px 0px 260px 0px !important; background: url("../images/bmx/site/marketing_tabs_sport_bg2.png") no-repeat left bottom !important;}
#marketing_tabs .ui-tabs #thesport_content {background: url("../images/bmx/site/marketing_tabs_sport_title.gif") no-repeat left top; padding: 0px 40px 0px 250px; margin: 20px 0px 0px 0px;}
#marketing_tabs .ui-tabs p {margin: 0px; line-height: 20px;}
#marketing_tabs .ui-tabs #thetrack {padding: 20px 0px 245px 0px !important; background: url("../images/bmx/site/marketing_tabs_track_bg.png") no-repeat left bottom !important;}
#marketing_tabs .ui-tabs #thetrack p {padding: 0px 40px 0px 250px; margin: 0px; background: url("../images/bmx/site/marketing_tabs_track_title.gif") no-repeat left top;}
#marketing_tabs .ui-tabs #thebike {padding: 20px 0px 305px 0px !important; background: url("../images/bmx/site/marketing_tabs_bike_bg.png") no-repeat left bottom !important;}
#marketing_tabs .ui-tabs #thebike p {padding: 0px 40px 0px 250px; margin: 0px; background: url("../images/bmx/site/marketing_tabs_bike_title.gif") no-repeat left top;}
#marketing_tabs .ui-tabs #thegear {padding: 20px 0px 50px 0px !important; background: url("../images/bmx/site/marketing_tabs_gear_bg.png") no-repeat left bottom !important;}
#marketing_tabs .ui-tabs #thegear p {padding: 0px 175px 0px 250px; margin: 0px; background: url("../images/bmx/site/marketing_tabs_gear_title.gif") no-repeat left top;}
#presented_by span#presenter {font-family: 'Helvetica', 'Arial', sans-serif; font-size: 11px; line-height: 14px; text-transform: none; text-align: right; display: inline-block;}
#presented_by img {margin: 0px 0px 0px 10px;}
/* End Inner Pages */
#footer_callouts_container {background: url("../images/bmx/site/footer_callouts_bg.gif") repeat left top; box-shadow: inset 0px 2px 2px #ddd;}
#footer_callouts {padding: 20px 0px;}
#footer_callouts div {display: inline; }
#footer_callouts img {display: inline-block; margin: 0px 10px;}
#sponsors_container {background: url("../images/bmx/site/sponsors_bg.gif") repeat left top;}
#sponsors {width: 980px; margin: 0 auto; padding: 50px 0px 0px 0px; background: url("../images/bmx/site/sponsors_logo.gif") no-repeat left top;}
#sponsors #sponsors-list {margin: 0px; padding: 0px; list-style: none;}
#sponsors #sponsors-list .callout-image-link {float: left; margin: 0px 20px 0px 0px; padding: 0px;}
#footer_container {background: #000000;}
#footer {width: 980px; margin: 0 auto; padding: 20px 0px; color: #898989;}
#footer a {color: #898989; text-decoration: underline;}
#footer a:hover {text-decoration: none;}
#footer p {margin: 0px; font-size: 11px;}
#footer #site_by_link {padding-left: 10px; background: url("../images/bmx/site/icon_footer_clock_off.png") no-repeat left center;}
#footer #site_by_link:hover {color: #ffffff; background: url("../images/bmx/site/icon_footer_clock_on.png") no-repeat left center;}
#footer ul#footer_nav {padding: 0px; margin: 0px; list-style: none;}
#footer ul#footer_nav li {float: left; margin: 0px 8px 0px 0px; padding: 0px;}
#footer ul#footer_nav li a {font-weight: bold; text-decoration: none; font-size: 11px;}
#footer ul#footer_nav li a:hover {text-decoration: underline;}
/*------------------------------------------
PAGE SPECIFIC
-------------------------------------------*/
/* HOME */
#home_content {width: 620px; /*margin-right: 60px;*/ margin:0px 40px 0px 10px; /*<--my changes*/ float: left;}
#home_right_sidebar {width: 300px; float: left;}
#home_right_sidebar .right_black_list {margin-bottom: 20px; border: none;}
#home_right_sidebar .callout-image-link {margin-bottom: 20px;}
/* HOME SLIDER */
#home_slider{ /*<----- I styled this whole slider, it had no styles before -Tavo*/
background-color:#fff;
width:980px !important;
margin:0 auto;
padding:20px 0px 20px 0px;
}
#home_slider ul {width: 100%;}
#home_slider ul li {width: 774px; height: 300px;}
#home_slider .mb-wrapper {
border: none !important;
background: transparent !important;
margin: 0 auto;
position: relative;
left: 0;
top: 0;
border-radius: 0px !important;
-moz-border-radius: 0px !important;
-webkit-border-radius: 0px !important;
box-shadow: none !important;
-moz-box-shadow: none !important;
-webkit-box-shadow: none !important;
}
#home_slider .mb-scroll {
border-radius: 0px !important;
-moz-border-radius: 0px !important;
-webkit-border-radius: 0px !important;
background-image: none !important;
background-color: transparent;
margin: 0px;
}
#home_slider .mb-slider .mb-panel {padding: 10px 0px;}
#home_slider .mb-slider .mb-panel {/*padding: 30px 40px 20px 5px !important;*/ padding:20px 40px 30px 5px !important;/*<----my changes -Tavo*/ }
#home_slider .mb-slider .mb-panel .mb-inside {/*background: #ffffff;*/ background: #ddd;/*<---my changes -Tavo*/ padding: 3px !important; border: none !important; -moz-box-shadow: 0px 1px 5px #666; -webkit-box-shadow: 0px 2px 5px #666 box-shadow: 0px 2px 5px #666;}
#home_slider .mb-slider .mb-panel .mb-inside img {margin: 0px;}
#home_slider .mb-slider .mb-panel p {margin: 0px; font-size: 12px;}
#home_slider a.mb-scrollButtons {
height: 350px;
position: absolute !important;
background-image: none !important;
background: rgb(227,27,34);
background: rgba(227,27,34,0.75);
}
#home_slider a.mb-scrollButtons.mb-left {
-moz-border-radius: 0px 5px 5px 0px;
-webkit-border-radius: 0px 5px 5px 0px;
border-radius: 0px 5px 5px 0px;
background-image: url("../images/bmx/site/home_slider_left_arrow.png") !important;
background-repeat: no-repeat !important;
background-position: center center !important;
/*z-index: 9999;*/
z-index: 4;/*<---- my changes -tavo---->*/
left: 0px;
top: 0px;
}
#home_slider a.mb-scrollButtons.mb-right {
-moz-border-radius: 5px 0px 0px 5px;
-webkit-border-radius: 5px 0px 0px 5px;
border-radius: 5px 0px 0px 5px;
background-image: url("../images/bmx/site/home_slider_right_arrow.png") !important;
background-repeat: no-repeat !important;
background-position: center center !important;
/*z-index: 9998;*/
z-index: 4;/*<----- my changes -tavo---->*/
right: 0px !important;
top: 0px;
}
#home_slider a.mb-scrollButtons:hover {background: rgb(227,27,34);}
#home_slider .mb-left-shadow {background-image: none !important; -moz-border-radius: 5px 0 0 5px; -webkit-border-radius: 5px 0 0 5px; border-radius: 5px 0 0 5px;}
#home_slider .mb-right-shadow {background-image: none !important; -moz-border-radius: 0px; -webkit-border-radius: 0px; border-radius: 0px;}
#home_features #features_controls {margin-bottom: 15px;}
#home_features #features_controls h3 {font-size: 20px; font-weight: normal; text-transform: uppercase; float: left; margin: 0px;}
#home_features #features_controls h3 span.calgary {color: #e31b22;}
#home_features #features_controls #features_controls_tags {float: right; padding: 0px; margin: 0px;}
#home_features #features_controls #features_controls_tags li {display: inline-block; margin-right: 10px;}
#home_features #features_controls #features_controls_tags li a {font-weight: bold;}
#home_features #features_controls #features_controls_tags li:last-child {margin-right: 0px;}
#home_features .features .feature {width: 135px; float: left; margin: 0px 10px 10px 10px;}
#home_features .features .feature a.feature_image_link {display: block; margin-bottom: 5px; border: solid 3px #dddddd; background-color: white;}
#home_features .features .feature a.feature_image_link:hover {border: solid 3px #777;}
#home_features .features .feature a.feature_image_link img {width: 129px; height: 129px;}
#home_features .features .feature h5 {margin: 0px 0px 5px 0px; font-size: 12px; font-family: 'Helvetica', 'Arial', sans-serif; text-transform: none; font-weight: bold; font-style: normal; line-height: 14px;}
#home_features .features .feature p {margin: 0px 0px 5px 0px;}
#home_features .features .feature p.meta {font-size: 11px; color: #777777;}
/* Events */
div#events_tabs .ui-tabs-panel {background: #ebebeb !important; padding: 10px !important;}
div#events_tabs .ui-tabs-nav li a {background: #ffffff;}
div#events_tabs .ui-tabs-nav li.ui-state-hover a, div#events_tabs .ui-tabs-nav li.ui-state-active a {background: #ebebeb;}
ul.events {margin: 0px; padding: 0px; list-style: none;}
ul.events li {border-bottom: solid 1px #ccc; background: #ffffff; padding: 15px 10px;}
ul.events li .event_image_wrap {width: 75px; float: left; margin-right: 10px;}
ul.events li .event_image_wrap img {width: 75px;}
ul.events li .event_details {width: auto; overflow: hidden;}
ul.events li .event_details h5.event_title {font-size: 12px; font-style: normal !important; font-family: 'Helvetica', 'Arial', sans-serif !important; font-weight: bold !important; margin: 0px; text-transform: none !important;}
ul.events li .event_details p {font-size: 11px; margin: 0px 0px 5px 0px;}
ul.events li .event_details p.event_date {color: #666; margin: 0px 0px 10px 0px; font-weight: bold;}
ul.events li .event_details p.event_location {font-size: 11px; color: #363636;}
ul.events li .event_details p.event_location a {color: #363636; text-decoration: underline;}
ul.events li .event_details p.event_location a:hover {text-decoration: none;}
ul.events li .event_details a.presign,
ul.events li .event_details a.results,
#event_detail a.presign,
#event_detail a.results {background: #e31b22; display: inline-block; padding: 3px 10px; color: #fff; text-transform: uppercase;}
#event_detail {padding-bottom: 20px; margin-bottom: 20px; border-bottom: solid 1px #CCC;}
#event_detail h2#event_title {margin: 0px 0px 5px 0px;}
#event_detail p#event_date {color: #666; margin: 0px 0px 20px 0px;}
#event_detail #event_image_wrap {margin-bottom: 30px;}
#event_detail #event_resources {float: right; width: 150px; padding: 15px 0px 15px 15px; border-left: solid 1px #CCC;}
#event_detail #event_resources h5 {font-weight: bold; text-transform: none; font-family: 'Helvetica', 'Arial', sans-serif; font-style: normal; font-size: 12px;}
#event_detail #event_resources .race_resources ul li a {font-weight: bold; font-size: 11px;}
#event_detail #event_description {float: left; width: 275px; overflow: hidden;}
#event_detail img.main_event_flyer {width: 460px;}
#venue_detail h2#venue_title {margin: 0px 0px 5px 0px;}
#venue_detail #venue_address {color: #666; margin: 0px 0px 20px 0px;}
#venue_detail #venue_map {display:inline-block; padding: 3px; background: #CCC;}
#venue_detail #venue_map a { display:block; }
/* Races */
select#races_state_select {font-size: 11px; margin-right: 10px;}
/* Race Calendar */
#month-switcher {
font-size: 2em;
font-weight: bold;
margin: 1em 0;
text-align: center;
}
#month-switcher a {
font-family: 'Courier New', Courier, sans-serif;
font-size: 1.2em; /* Relative to 2em */
padding: 0 5px;
text-decoration: none;
}
.calendar th {
background: none;
border: none;
}
.calendar .calendar_day_title {
float: none;
width: auto;
height: auto;
text-align: left;
border: none;
background: none;
top: 2px;
right: 2px;
}
.calendar .calendar_day_inner {
padding: 20px 8px 8px;
min-height: 80px;
}
.calendar .calendar-event {
padding-bottom: 5px;
margin-bottom: 5px;
border-bottom: dashed 1px #d0d0d0;
}
.calendar .calendar-event.national,
.calendar .calendar-event.gold_cup {
border-bottom: none;
-moz-border-radius: 3px;
border-radius: 3px;
color: #fff;
padding: 4px;
}
.calendar .calendar-event.national a,
.calendar .calendar-event.gold_cup a {
color: #fff;
}
.calendar .calendar-event.gold_cup { background: #00A6FC; }
.calendar .calendar-event.national.usa { background: #000; }
.calendar .calendar-event.national.can { background: #E91C21; }
/* Race Results */
.race-result-list {list-style: none; padding-left: 20px; margin-bottom: 20px;}
.race-result-list li {margin-bottom: 20px;}
.race-result-list li span.race-result-finish {
width: 20px;
height: 19px;
padding-top: 1px;
margin-right: 10px;
display: block;
float: left;
text-align: center;
background: #e31b22;
color: #fff;
font-weight: bold;
border-radius: 50%;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
}
/* Sponsors */
#sponsors_list li {padding: 10px 0px; border-bottom: solid 1px #efefef;}
#sponsors_list li .detail h4 a.sponsor_link {font-size: 12px; font-weight: normal;}
/* Riders */
div.hoverscroll {background: url("../images/bmx/site/pros_timeline_bg.gif") repeat-y left top; -moz-border-radius: 25px; -webkit-border-radius: 25px; border-radius: 25px; margin-bottom: 30px;}
div.hoverscroll div.arrow.left, div.hoverscroll div.fixed-arrow.left {background: transparent url("../images/bmx/site/pros_timeline_minus.png") no-repeat center right !important;}
div.hoverscroll div.arrow.right, div.hoverscroll div.fixed-arrow.right {background: transparent url("../images/bmx/site/pros_timeline_plus.png") no-repeat center left !important;}
div.hoverscroll div.fixed-listcontainer {background: url("../images/bmx/site/pros_timeline_line.gif") repeat-x center left;}
div.hoverscroll div.fixed-listcontainer ul li {margin: 18px 20px 0px 20px;}
div.hoverscroll div.fixed-listcontainer ul li a {background: #b6060a; border: solid 1px #ffffff; padding: 6px 12px 2px 12px; font-size: 14px; font-family: 'Calgary'; color: #ffffff;}
div#pros_tabs .ui-tabs-nav li a {background: transparent !important; color: #999999;}
div#pros_tabs .ui-tabs-nav li.ui-state-active a {background: #ffffff !important; color: #333333 !important;}
div#pros_tabs .ui-tabs-nav li.ui-state-hover a {background: #ffffff !important;}
div.champs_nav {background: url("../images/bmx/site/pros_timeline_bg.gif") repeat-y left top; padding: 20px 20px 10px 20px; margin-bottom: 30px;}
div.champs_nav ul {margin: 0px; padding: 0px 0px 0px 150px; list-style: none; background: url("../images/bmx/site/champs_nav_bg.png") no-repeat center left;}
div.champs_nav ul li {width: 125px; margin-bottom: 10px; float: left;}
div.champs_nav ul li a {color: #ffffff; font-weight: bold;}
/* Points */
ul#points_regions li {border-top: solid 1px #efefef; padding: 15px 0px; margin: 0px;}
ul#points_regions li h3 {margin: 0px 0px 10px 0px; font-family: 'Helvetica', 'Arial', sans-serif; font-weight: bold; font-size: 16px; text-transform: none;}
ul#points_regions li .detail p {margin-top: 0px;}
ul#points_regions li a.blue {background: #006699; padding: 5px 6px 4px 6px; color: #fff; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; font-weight: bold;}
ul#points_regions form#points_region_find select {width: 150px; margin-right: 10px;}
/* Points Results */
form#points_filter_form select {margin: 0px 10px 0px 0px;}
table#points_results {font-size: 11px;}
table#points_results td {}
/* Marketing Pages */
#marketing_intro {background: url("../images/bmx/site/marketing_intro_bg.gif") repeat-y left top; margin-bottom: 20px;}
#marketing_intro p {margin: 0px;}
#marketing_intro > h1 {background: #e71319 url("../images/bmx/site/marketing_header_bg.gif") no-repeat right top; margin: 0px; padding: 10px 15px 0px 15px; height: 38px; color: #ffffff; font-size: 30px; font-family: 'Calgary', 'Helvetica', 'Arial', sans-serif;}
#marketing_intro a {color: #ffffff;}
#marketing_intro #marketing_intro_content {padding: 20px;}
/* The Bike */
.bike_intro #marketing_intro_content {background: url("../images/bmx/site/bike_feature_bg.png") no-repeat left bottom; padding-bottom: 280px !important;}
.bike_intro #marketing_intro_content h1 {line-height: 24px;}
.bike_intro #marketing_intro_content h1 span.red {color: #e71319; font-size: 40px;}
.bike_intro #marketing_intro_content p {width: 330px;}
#about_the_bike {background: url("../images/bmx/site/footer_callouts_bg.gif") repeat left top; padding: 15px; margin-bottom: 20px;}
#about_the_bike #bmx_bike {padding: 10px; background: #ffffff; position: relative;}
#about_the_bike #bmx_bike a.tooltip {position: absolute; display: block; width: 20px; height: 20px; text-indent: -9999px;}
.bike_tooltip_body img {margin-bottom: 10px;}
.bike_tooltip_body p {padding: 0px 15px 15px 15px; font-size: 11px; line-height: 15px; margin: 0px; text-align: left;}
.bike_tooltip_body ul {padding: 0px 15px; margin-bottom: 5px !important;}
.bike_tooltip_body ul li {text-align: left;}
.bike_tooltip_body ul li.one {background: url("../images/bmx/site/icon_one.gif") no-repeat left top; padding: 3px 0px 5px 25px;}
.bike_tooltip_body ul li.two {background: url("../images/bmx/site/icon_two.gif") no-repeat left top; padding: 3px 0px 5px 25px;}
#about_the_bike #bmx_bike a#steering_link {top: 44px; right: 135px;}
#about_the_bike #bmx_bike a#brake_link {top: 136px; left: 126px;}
#about_the_bike #bmx_bike a#crank_link {bottom: 80px; left: 187px;}
#about_the_bike #bmx_bike a#fork_link {bottom: 112px; right: 73px;}
#about_the_bike #bmx_bike a#saddle_link {top: 82px; left: 160px;}
#about_the_bike #bmx_bike a#hub_link {bottom: 102px; left: 53px;}
/* The Track */
.track_intro #marketing_intro_content {background: url("../images/bmx/site/track_feature_bg.png") no-repeat left bottom; padding-bottom: 220px !important;}
#track_terms {background: url("../images/bmx/site/footer_callouts_bg.gif") repeat left top;}
#track_terms h2 {border-bottom: solid 2px #aaa;}
#track_terms img {margin: 5px 15px 5px 0px; float: left;}
#track_terms .ui-tabs .ui-tabs-panel {padding-top: 20px !important;}
#track_terms .red_eight {display: block; padding: 8px 12px 4px 8px; color: #ffffff; background: #e31b22; margin-right: 5px; font-size: 20px;}
/*The Sport */
.sport_intro #marketing_intro_content h1 {font-size: 68px; margin: 0px;}
.sport_intro #marketing_intro_content h2 {background: #ffffff; padding: 10px 10px 5px 10px; display: inline-block; line-height: 20px; margin-bottom: 15px;}
.sport_intro #marketing_intro_content p {margin: 0px;}
.sport_intro #marketing_intro_content {background: url("../images/bmx/site/sport_feature_bg.png") no-repeat left bottom; padding-bottom: 250px !important;}
.sport_ad {width: 220px; height: 193px; display: block; float: left; text-indent: -9999px;}
#sport_history_ad {background: url("../images/bmx/site/sport_history_ad.jpg") no-repeat left top; margin-right: 20px;}
#sport_history_ad:hover {background-position: bottom left;}
#sport_halloffame_ad {background: url("../images/bmx/site/sport_halloffame_ad.jpg") no-repeat left top;}
#sport_halloffame_ad:hover {background-position: bottom left;}
#sport_sponsors_ad {background: url("../images/bmx/site/sport_sponsors_ad.jpg") no-repeat left top; margin-right: 20px;}
#sport_sponsors_ad:hover {background-position: bottom left;}
#sport_award_ad {background: url("../images/bmx/site/sport_award_ad.jpg") no-repeat left top;}
#sport_award_ad:hover {background-position: bottom left;}
#track_terms #series_list li {margin-bottom: 5px; line-height: 18px;}
/* The Gear */
.gear_intro #marketing_intro_content {background: url("../images/bmx/site/gear_feature_bg.png") no-repeat right bottom; padding-bottom: 20px !important;}
.gear_intro #marketing_intro_content h1 {line-height: 30px; font-size: 30px;}
.gear_intro #marketing_intro_content h2 {font-family: 'Grotesque-Light', 'Helvetica', 'Arial', sans-serif !important;}
.gear_intro #marketing_intro_content p {padding-right: 215px; margin-bottom: 20px !important;}
#about_the_gear {background: url("../images/bmx/site/footer_callouts_bg.gif") repeat left top; padding: 15px; margin-bottom: 20px;}
#about_the_gear #bmx_gear {padding: 10px; background: #ffffff; position: relative;}
#about_the_gear #bmx_gear a.tooltip {position: absolute; display: block; width: 20px; height: 20px; text-indent: -9999px;}
.gear_tooltip_body p {padding: 15px; font-size: 11px; line-height: 15px; margin: 0px; text-align: left;}
#about_the_gear #bmx_gear a#helmet_link {top: 36px; left: 169px;}
#about_the_gear #bmx_gear a#goggles_link {top: 85px; left: 131px;}
#about_the_gear #bmx_gear a#jersey_link {top: 189px; left: 203px;}
#about_the_gear #bmx_gear a#gloves_link {top: 360px; left: 111px;}
#about_the_gear #bmx_gear a#pants_link {bottom: 339px; left: 241px;}
#about_the_gear #bmx_gear a#shoes_link {bottom: 67px; right: 155px;}
#marketing_post_content {padding: 15px;}
#marketing_post_content h1 {margin-bottom: 20px !important;}
#marketing_post_content #featured_image {width: 430px; margin-bottom: 20px;}
#marketing_post_content #vimeo {margin-bottom: 20px;}
#marketing_post_gallery {background: url("../images/bmx/site/footer_callouts_bg.gif") repeat left top; padding: 15px;}
#marketing_post_gallery h2 {border-bottom: solid 2px #aaa; padding-bottom: 10px; margin-bottom: 10px;}
#marketing_post_gallery ul li {float: left; margin: 0px 11px 20px 11px;}
#marketing_post_gallery ul li a img {border: solid 2px #aaa;}
#marketing_post_gallery ul li a:hover img {border: solid 2px #ddd;}
#marketing_features #features_controls {}
#marketing_features #features_controls ul li {margin: 0px 5px 0px 0px !important; float: left;}
#marketing_features #features_controls ul li:before {content: "•";}
#marketing_features #features_controls ul li:first-child:before {content: "";}
#marketing_features #features_controls ul li a {font-weight: bold; padding-left: 5px;}
#marketing_features #features_controls ul li:first-child a {padding: 0px;}
/* Tracks */
#tracks_search {margin-bottom: 20px;}
form#track_search_form {margin-bottom: 20px;}
form#track_search_form input[type="text"] {width: 300px !important; margin-right: 10px;}
form#track_search_form input[type="submit"] {padding: 10px 12px 8px 12px;}
#track_results {background: #ffffff; padding: 10px;}
#track_results ul li {margin: 0px !important; padding: 15px 5px; border-top: solid 1px #ccc;}
#track_results ul li .track_image {float: left; margin-right: 20px;}
#track_results ul li .track_details {float: left; width: auto; overflow: hidden;}
#track_results ul li h5.track_title {font-family: 'Helvetica', 'Arial', sans-serif; font-style: normal; text-transform: none; font-weight: bold;}
#track_results p#results {font-size: 16px; font-weight: bold;}
#tracks_blocks.blocks .block {width: 335px; float: left;}
h1 span#track_district {display: block; color: #999; font-size: 14px; font-family: 'Helvetica', 'Arial', sans-serif; text-transform: none;}
#track_detail #track_contact {float: left; width: 240px;}
#track_detail #track_location {float: left; width: 200px; font-size: 11px; margin-right: 20px;}
#track_detail #track_location img {padding: 15px 0px; border-top: solid 1px #efefef; border-bottom: solid 1px #efefef; margin-bottom: 15px;}
#track_detail #track_location h6 {margin-bottom: 5px;}
#track_detail #track_location p {margin: 0px 0px 10px 0px;}
/* ADDING PUERTO RICO TO THE MAP */
.usa52 .s1 {height:.6em;left:7.5em;top:9.3em;width:1.2em}
.m660 .usa52 a {left:335px;top:396px;}
.m660 .usa52:hover .bg,
.m660 .usa52.focus .bg,
.m660 .usa52.active-region .bg{height:20px;left:305px;top:379px;width:50px}
.m660 .usa52:hover .bg,
.m660 .usa52.focus .bg{background-position:-832px -427px}
.m660 .usa52.active-region .bg{background-position:-472px -727px}
/* Riders */
form#search_riders input[type="text"] {width: 100px; font-size: 11px; margin-right: 8px;}
form#search_riders input#first_initial {width: 50px;}
form#search_riders input#serial_number {margin-left: 8px;}
form#search_riders input[type="submit"] {padding: 8px 12px 6px 12px;}
/* Contact Us */
#contact_address {width: 130px; float: left; font-size: 11px;}
#contact_address h5 {font-family: 'Helvetica', 'Arial', sans-serif; font-weight: bold !important; font-style: normal !important; color: #006699 !important;}
#contact_form_wrap {width: 300px; float: left;}
#contact_form_wrap input[type="text"], #contact_form_wrap textarea {width: 90%;}
/* XChange */
#xchange_search {}
#xchange_search form#shops_search_form {margin-bottom: 20px;}
#xchange_search form#shops_search_form input[type="text"] {width: 300px !important; margin-right: 10px;}
#xchange_search form#shops_search_form input[type="submit"] {padding: 10px 12px 8px 12px;}
/* XChange Search Results */
#xchange_search_results {background: #ffffff; padding: 10px;}
#xchange_search_results ul li {border-top: solid 1px #efefef; padding: 20px 0px;}
/* Force proper image size */
#post_list li .image_wrap img, #news_list li .image_wrap img, #images_list li .image_wrap img {width: 125px;}
/* Image Listing */
#images_list li {border-top: solid 1px #efefef; padding: 20px 0px;}
#images_list li .image_wrap {width: 125px;}
#images_list li .detail h4 .sponsor_link {font-size: 12px !important; font-weight: normal; text-decoration: underline;}
/* Hall of Fame */
#halloffame_list li {border-top: solid 1px #efefef; padding: 20px 0px;}
#halloffame_list li h4 {font-family: 'Helvetica', 'Arial', sans-serif !important; font-size: 16px; text-transform: none !important; font-style: normal !important; color: #999;}
#halloffame_list li h4 a {font-weight: bold;}
/* Teams */
#standings_link {width: 220px; height: 100px; display: inline-block; background: url("../images/bmx/site/standings_link_bg.png") no-repeat left top; text-indent: -9999px;}
#rosters_link {width: 220px; height: 100px; display: inline-block; background: url("../images/bmx/site/rosters_link_bg.png") no-repeat left top; text-indent: -9999px;}
/* News */
#postings_tag_navigation {padding: 8px 12px; background: #efefef; margin-bottom: 15px;}
#postings_tag_navigation li {margin: 0px 5px 0px 0px !important; float: left;}
#postings_tag_navigation li:before {content: "•";}
#postings_tag_navigation li:first-child:before {content: "";}
#postings_tag_navigation li a {font-weight: bold; padding-left: 5px;}
#postings_tag_navigation li:first-child a {padding: 0px;}
#post_list li {border-top: solid 1px #efefef; padding: 20px 0px;}
#post_detail h1 {margin-bottom: 3px !important;}
#post_detail .post_vimeo_video {padding: 10px; background: #efefef; border-bottom: solid 1px #ddd;}
#post_detail .post_vimeo_gallery {padding: 10px; background: #efefef; margin-bottom: 20px;}
#post_detail .post_vimeo_gallery ul {list-style: none; margin: 0px; padding: 0px;}
#post_detail .post_vimeo_gallery ul li {float: left; margin: 0px 5px 10px 5px;}
#post_detail #featured_image {width: 460px; margin-bottom: 20px;}
#post_detail p.meta, #marketing_post_detail p.meta {font-size: 11px; color: #999999; margin: 0px 0px 20px 0px;}
/* Shop Landing */
#shop_official_link {width: 460px; height: 208px; display: inline-block; background: url("../images/bmx/site/shop_official_callout.jpg") no-repeat left top; text-indent: -9999px; margin-bottom: 10px;}
#xchange_link {width: 460px; height: 208px; display: inline-block; background: url("../images/bmx/site/xchange_callout.jpg") no-repeat left top; text-indent: -9999px;}
/* Search Results */
#search_results li {padding: 15px; border-top: solid 1px #efefef; margin: 0px !important;}
#search_results li h4 {font-family: 'Helvetica', 'Arial', sans-serif; font-size: 12px; font-weight: bold; margin: 0px; text-transform: none;}
/* Simple Outer Frame Layout */
#main_wrap_sof #main_content {padding: 30px 0px;}
/* Daily Media */
#daily-media-content {margin: 0 auto 20px auto; border: solid 4px #ccc;}
#daily-media-content iframe {display: block;}
/* Motoboards (old) */
#motoboard_navigation a {}
#motoboard_navigation a.prev {}
#motoboard .rider-transfers { background-color: #f3f315; }
#motoboard .rider-transfers td { background-color: #f3f315; !important }
/* Motoboards (new) */
#motoboard {}
#motoselector .control {float: left; display: block; margin-right: 10px; margin-bottom: 15px;}
.table-moto-number-wrap {display: inline-block; background: #000000; color: #ffffff; padding: 3px 12px;}
#motoboard .rider-transfers { background-color: #f3f315; }
#motoboard .rider-transfers td { background-color: #f3f315; !important }
#motoboard #gate-view {
width: 100%;
}
#motoboard #finish-view {
width: 100%;
}
/* ==|== media queries ======================================================
EXAMPLE Media Query for Responsive Design.
This example overrides the primary ('mobile first') styles
Modify as content requires.
========================================================================== */
@media only screen and (min-width: 35em) {
/* Style adjustments for viewports that meet the condition */
}
/* ==|== non-semantic helper classes ========================================
Please define your styles before this section.
========================================================================== */
/* For image replacement */
.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; *line-height: 0; }
.ir br { display: none; }
/* Hide from both screenreaders and browsers: h5bp.com/u */
.hidden { display: none !important; visibility: hidden; }
/* Hide only visually, but have it available for screenreaders: h5bp.com/v */
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }
/* Contain floats: h5bp.com/q */
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }
/* Nickelodeon Map */
.map-track-info .map-track-header {
background-image: url(/images/bmx/site/trackmarker.png);
background-repeat: no-repeat;
background-position: top left;
padding-left: 30px;
padding-bottom: 10px;
padding-top: 10px;
border-bottom: 1px dotted #333333;
}
.map-track-info a {
color: #666666;
text-decoration: none;
}
.map-track-info .map-track-title {
color: #666666;
font-weight: bold !important;
font-size: 16px !important;
}
.map-track-info .map-track-location {
color: #666666;
padding-bottom: 20px;
}
.map-track-info .map-track-more-info {
color: #666666;
border-bottom: 1px dotted black;
}
#track-map-search {
width: 300px;
}
/* ==|== print styles =======================================================
Print styles.
Inlined to avoid required HTTP connection: h5bp.com/r
========================================================================== */
@media print {
* { background: transparent !important; color: black !important; box-shadow:none !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */
a, a:visited { text-decoration: underline; }
a[href]:after { content: " (" attr(href) ")"; }
abbr[title]:after { content: " (" attr(title) ")"; }
.ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } /* Don't show links for images, or javascript/internal links */
pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
thead { display: table-header-group; } /* h5bp.com/t */
tr, img { page-break-inside: avoid; }
img { max-width: 100% !important; }
@page { margin: 0.5cm; }
p, h2, h3 { orphans: 3; widows: 3; }
h2, h3 { page-break-after: avoid; }
}
/* Membership List styles */
.membership-display {
clear: left;
padding-top: 20px;
}
.membership-card-column, .membership-details-column, .membership-agreements-column, .membership-autorenew-column {
float: left;
padding-right: 20px;
}
.membership-card-column {
width: 16%;
}
.membership-details-column {
width: 40%;
}
.membership-agreements-column {
width: 16%;
}
.membership-autorenew-column {
width: 16%;
}
.membership-card-column img {
width: 100%;
}
html .member-manager table.membership-details th {
background-color: transparent;
border: none;
border-bottom: 1px solid black;
padding: 2px !important;
color: rgb(102,102,102);
font-family: sans-serif;
font-size: 12px;
font-weight: bold;
}
.member-manager table.membership-details td {
background-color: transparent !important;
border: none;
border-bottom: 1px solid black;
padding: 2px;
color: black;
}
.member-manager h2 {
clear: left;
padding-top: 20px;
}
.member-manager .membership-list h3 {
padding: 0px;
padding-bottom: 10px;
margin: 0px;
}
.membership-card-column label {
color: black;
padding-top: 10px;
}
.button-signed, .button-signature-required, .button-membership-card, .button-renew {
background-color: gray;
color: white !important;
border-radius: 3px;
display: inline-block;
padding: 6px 6px 3px 6px;
text-decoration: none !important;
}
.button-signature-required {
background-color: red;
}
form {
text-align: left;
}
#left_sub_nav input[type=text] {
width: 110px;
font-size: 12px;
}
#left_sub_nav .blue {
margin-left: 5px;
padding-top: 1px;
}
.filter-column {
float: left;
margin-right: 20px;
}
.filter-column input[type=submit] {
margin-top: 23px;
}
.select-team {
text-transform: uppercase;
font-family: Grotesque-SemiBold, Helvetica, Aria, sans-serif;
font-size: 20px;
font-weight: normal;
padding-left: 10px;
padding-right: 10px;
position: relative;
top: 3px;
}
.team-selector {
padding-right: 20px;
padding-left: 10px;
}
label.extras-question-header {
font-weight: bold;
text-transform: none;
color: #333333;
margin-top: 15px;
}
span.required-asterisk {
color: red;
}
p.extras-post-question-description {
margin: -5px 0px 10px 0px;
}
#custom-questions-answered-container {
display: none;
}
#edit-custom-question-answers {
padding-left: 15px;
}
#edit-custom-question-answers:hover {
cursor: pointer;
}
.numerical-length-label, .numerical-length-input {
display: none;
}
#microsite_event_description {
float: left;
width: 60%;
}
#microsite_event_resources a {
display: inline-block;
}
#microsite_event_resources {
float: right;
width: 34%;
padding: 15px 0px 15px 15px;
border-left: solid 1px #CCC;
}
.confirmation-code-form, .confirmation-code-accepted {
float: right;
margin-bottom: 22px;
}
.confirmation-code-accepted {
color: #39b54a;
}
.confirmation-code-accepted input {
border: 1px solid #39b54a;
}
.apply-discount-btn {
margin-left: 10px;
}
.label-rainedout {
background-color: #4ADDEF;
}
.presign-code-message {
color: red !important;
font-weight: bold;
}
#presign-waiver-form {
width: 57%;
text-align: center;
margin: 0px auto;
}
.presign-waiver-container {
background-color: white;
padding-bottom: 25px;
border-top: 1px solid #aaa;
border-bottom: 1px solid #aaa;
}
#presign-waiver-link, #presign-waiver-link-covid {
font-size: 16px;
font-family: Arial;
color: var(--dusk-blue);
}
.presign-med-text {
font-size: 16px;
margin: 15px 120px;
}
#presign-signature-label {
margin-right: 0px;
}
.presign-pdf-icon {
background: url(../images/bmx/site/membership/pdf-icon@3x.png) no-repeat center;
background-size: contain;
height: 41px;
width: 50px;
}
.green-text {
color: #4FB32A !important;
}
.red-text {
color: #FB0800 !important;
}
#races_state_select {
width: 306px;
}
.spot-ad {
text-align: center;
}
.spot-ad img {
margin-top: 30px;
}
#login-wrapper {
width: 100%;
display: flex;
}
#sign-in-form-container, #create-account-container {
display: inline-block;
padding: 35px;
background-color: #ECECEC;
}
#sign-in-form-container {
float: left;
margin-right: 10px;
}
#create-account-container {
float: right;
margin-left: 10px;
}
/*~~~~~~~~~ New Profile Dashboard ~~~~~~~~~~*/
#dashboard-page-title {
width: 100%;
font-family: Industry;
font-size: 21px;
font-weight: bold;
font-stretch: normal;
font-style: normal;
line-height: normal;
letter-spacing: normal;
color: var(--black);
text-transform: uppercase;
border-bottom: 1px solid var(--black);
padding-bottom: 10px;
}
#dashboard-container {
padding: 30px 90px;
text-align: center;
}
.dashboard-btn-row {
display: flex;
align-items: center;
margin: 10px 0px 30px 0px;
}
.dashboard-title {
font-family: Industry;
font-size: 20px;
font-weight: bold;
font-stretch: normal;
font-style: normal;
line-height: normal;
letter-spacing: normal;
text-align: center;
color: var(--black);
}
.dashboard-square {
width: 110px;
height: 87px;
box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.25);
background-image: linear-gradient(to right, #528aa6, #255c97);
padding: 23px;
margin: 10px;
align-items: center;
}
.dashboard-rectangle {
display: flex;
align-items: center;
width: 220px;
height: 69px;
border-radius: 3px;
box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.25);
background-image: linear-gradient(to right, #528aa6, #255c97);
font-family: industry, sans-serif;
font-size: 16px;
font-weight: 700;
font-stretch: normal;
font-style: normal;
letter-spacing: 1.89px;
color: var(--white);
text-align: center;
vertical-align: middle;
margin: 15px auto;
cursor: pointer;
}
#profile-photo-icon {
height: 50px;
background: url("../images/bmx/site/membership/profile-photo-icon@2x.png") no-repeat center;
background-size: contain;
margin: 0px auto;
}
#blog-icon {
height: 50px;
background: url("../images/bmx/site/membership/blog-icon@2x.png") no-repeat center;
background-size: contain;
margin: 0px auto;
margin-bottom: 20px;
}
#photo-video-icon {
height: 50px;
background: url("../images/bmx/site/membership/photo-video-icon@2x.png") no-repeat center;
background-size: contain;
margin: 0px auto;
}
#marked-map-icon {
height: 50px;
background: url("../images/bmx/site/membership/marked-map-icon@2x.png") no-repeat center;
background-size: contain;
margin: 0px auto;
}
#bike-icon {
height: 50px;
background: url("../images/bmx/site/membership/bike-icon@2x.png") no-repeat center;
background-size: contain;
margin: 0px auto;
}
#events-icon {
height: 50px;
background: url("../images/bmx/site/membership/events-icon@2x.png") no-repeat center;
background-size: contain;
margin: 0px auto;
}
.dashboard-square-text {
margin-top: 10px;
color: var(--white);
}
/*~~~~~~~~~~~~New Membership Page~~~~~~~~~~~~*/
#new-membership-container {
margin-bottom: 20px;
}
#new-membership-header {
font-family: industry, sans-serif;
font-size: 28px;
font-weight: bold;
font-stretch: normal;
font-style: normal;
line-height: normal;
letter-spacing: normal;
color: var(--black);
text-transform: uppercase;
margin-bottom: 20px;
}
.new-membership-secondary-header {
font-family: industry, sans-serif;
font-size: 23px;
font-weight: bold;
font-stretch: normal;
font-style: normal;
line-height: normal;
letter-spacing: normal;
text-align: center;
color: var(--black);
width: 100%;
text-align: center;
text-transform: uppercase;
margin-bottom: 15px;
}
.new-membership-icons-container {
display: flex;
justify-content: center;
width: 100%;
margin-bottom: 15px;
}
.new-membership-icon-text {
text-align: center;
padding-top: 10px;
font-family: industry, sans-serif;
font-size: 14px;
font-weight: 500;
font-stretch: normal;
font-style: normal;
line-height: normal;
letter-spacing: normal;
text-align: center;
color: var(--black);
}
.new-membership-icon {
width: 160px;
padding: 10px;
}
.new-membership-section {
text-align: center;
width: 100%;
padding: 40px 0px;
}
.new-membership-section-background {
padding: 35px 60px;
background-image: url("/images/bmx/site/membership/LightGridPattern.jpg");
background-repeat: repeat;
background-size: 5px;
}
#below-ready-to-race {
margin-bottom: 0px;
}
.new-membership-small-copy {
font-family: Arial;
font-size: 12px;
font-weight: normal;
font-stretch: normal;
font-style: normal;
line-height: 1.5;
letter-spacing: normal;
color: var(--black);
padding: 0px 20px;
margin-bottom: 25px;
}
.new-membership-medium-copy {
font-family: industry, sans-serif;
font-size: 20px;
font-weight: bold;
font-stretch: normal;
font-style: normal;
line-height: normal;
letter-spacing: normal;
text-align: center;
color: var(--black);
}
#new-membership-get-started-btn {
width: 230px;
height: 60px;
border-radius: 3px;
box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.5);
background-color: var(--neon-red);
font-family: industry, sans-serif;
font-size: 24px;
font-weight: bold;
font-stretch: normal;
font-style: normal;
line-height: 1.08;
letter-spacing: 0.28px;
text-align: center;
color: var(--white);
margin: 20px auto;
display: block;
text-transform: uppercase;
}
.new-membership-plans-icon {
padding: 0px 20px;
}
.new-membership-plans-title {
font-family: industry, sans-serif;
font-size: 20px;
font-weight: bold;
font-stretch: normal;
font-style: normal;
line-height: normal;
letter-spacing: normal;
text-align: center;
color: var(--black);
padding-top: 10px;
}
.new-membership-plans-small-copy {
font-family: Arial;
font-size: 12px;
font-weight: normal;
font-stretch: normal;
font-style: normal;
line-height: 1.5;
letter-spacing: normal;
text-align: center;
color: var(--black);
margin: 10px 0px;
}
.new-membership-plans-price {
font-family: industry, sans-serif;
font-size: 18px;
font-weight: 300;
font-stretch: normal;
font-style: normal;
line-height: normal;
letter-spacing: normal;
text-align: center;
color: var(--black);
}
.new-membership-split {
display: flex;
}
.new-membership-half {
padding: 20px;
width: 100%;
}
.new-membership-margin-bottom {
margin-bottom: 20px;
}
.new-membership-half:first-child {
border-right: 1px solid black;
}
.new-membership-half:second-child {
border-left: 1px solid black;
}
#find-track-container {
width: 100%;
text-align: center;
margin-top: 35px;
}
#find-your-track-btn {
width: 250px;
height: 60px;
border-radius: 3px;
box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.25);
background-image: linear-gradient(to right, #6490bf, #255c97);
font-family: industry, sans-serif;
font-size: 24px;
font-weight: bold;
font-stretch: normal;
font-style: normal;
letter-spacing: 0.28px;
text-align: center;
color: var(--white);
margin: 0 auto;
}
#family-oriented-icon {
height: 50px;
background: url("../images/bmx/site/membership/family-icon-mobile@2x.png") no-repeat center;
background-size: contain;
margin: 0px auto;
}
#self-esteem-icon {
height: 50px;
background: url("../images/bmx/site/membership/self-esteem-icon-mobile@2x.png") no-repeat center;
background-size: contain;
margin: 0px auto;
}
#fitness-icon {
height: 50px;
background: url("../images/bmx/site/membership/heartbeat-icon-mobile@2x.png") no-repeat center;
background-size: contain;
margin: 0px auto;
}
#balance-icon {
height: 50px;
background: url("../images/bmx/site/membership/balance-icon-mobile@2x.png") no-repeat center;
background-size: contain;
margin: 0px auto;
}
#stopwatch-icon {
height: 50px;
background: url("../images/bmx/site/membership/stopwatch-icon-mobile@2x.png") no-repeat center;
background-size: contain;
margin: 0px auto;
}
#balance-bike-icon {
height: 70px;
background: url("../images/bmx/site/membership/balance-bike-icon@2x.png") no-repeat center;
background-size: contain;
margin: 0px auto;
}
#standard-icon {
height: 70px;
background: url("../images/bmx/site/membership/standard-icon@2x.png") no-repeat center;
background-size: contain;
margin: 0px auto;
}
#gold-icon {
height: 70px;
background: url("../images/bmx/site/membership/gold-icon@2x.png") no-repeat center;
background-size: contain;
margin: 0px auto;
}