/* Minification failed. Returning unminified contents. (4985,16): run-time error CSS1036: Expected expression, found ';' (6660,6): run-time error CSS1062: Expected semicolon or closing curly-brace, found '/' (6669,6): run-time error CSS1062: Expected semicolon or closing curly-brace, found '/' (9906,1): run-time error CSS1019: Unexpected token, found '}' */ /*! normalize.css v1.1.1 | MIT License | git.io/normalize *//* ========================================================================== HTML5 display definitions ========================================================================== *//** * Correct `block` display not defined in IE 6/7/8/9 and Firefox 3. */article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary { display: block;}/** * Correct `inline-block` display not defined in IE 6/7/8/9 and Firefox 3. */audio,canvas,video { display: inline-block; *display: inline; *zoom: 1;}/** * Prevent modern browsers from displaying `audio` without controls. * Remove excess height in iOS 5 devices. */audio:not([controls]) { display: none; height: 0;}/** * Address styling not present in IE 7/8/9, Firefox 3, and Safari 4. * Known issue: no IE 6 support. */[hidden] { display: none;}/* ========================================================================== Base ========================================================================== *//** * 1. Prevent system color scheme's background color being used in Firefox, IE, * and Opera. * 2. Prevent system color scheme's text color being used in Firefox, IE, and * Opera. * 3. Correct text resizing oddly in IE 6/7 when body `font-size` is set using * `em` units. * 4. Prevent iOS text size adjust after orientation change, without disabling * user zoom. */html { background: #fff; /* 1 */ color: #000; /* 2 */ font-size: 100%; /* 3 */ -webkit-text-size-adjust: 100%; /* 4 */ -ms-text-size-adjust: 100%; /* 4 */}/** * Address `font-family` inconsistency between `textarea` and other form * elements. */html,button,input,select,textarea { font-family: sans-serif;}/** * Address margins handled incorrectly in IE 6/7. */body { margin: 0;}/* ========================================================================== Links ========================================================================== *//** * Address `outline` inconsistency between Chrome and other browsers. */a:focus { outline: thin dotted;}/** * Improve readability when focused and also mouse hovered in all browsers. */a:active,a:hover { outline: 0;}/* ========================================================================== Typography ========================================================================== *//** * Address font sizes and margins set differently in IE 6/7. * Address font sizes within `section` and `article` in Firefox 4+, Safari 5, * and Chrome. */h1 { font-size: 2em; margin: 0.67em 0;}h2 { font-size: 1.5em; margin: 0.83em 0;}h3 { font-size: 1.17em; margin: 1em 0;}h4 { font-size: 1em; margin: 1.33em 0;}h5 { font-size: 0.83em; margin: 1.67em 0;}h6 { font-size: 0.67em; margin: 2.33em 0;}/** * Address styling not present in IE 7/8/9, Safari 5, and Chrome. */abbr[title] { border-bottom: 1px dotted;}/** * Address style set to `bolder` in Firefox 3+, Safari 4/5, and Chrome. */b,strong { font-weight: bold;}blockquote { margin: 1em 40px;}/** * Address styling not present in Safari 5 and Chrome. */dfn { font-style: italic;}/** * Address differences between Firefox and other browsers. * Known issue: no IE 6/7 normalization. */hr { -moz-box-sizing: content-box; box-sizing: content-box; height: 0;}/** * Address styling not present in IE 6/7/8/9. */mark { background: #ff0; color: #000;}/** * Address margins set differently in IE 6/7. */p,pre { margin: 1em 0;}/** * Correct font family set oddly in IE 6, Safari 4/5, and Chrome. */code,kbd,pre,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;}/** * Address CSS quotes not supported in IE 6/7. */q { quotes: none;}/** * Address `quotes` property not supported in Safari 4. */q:before,q:after { content: ''; content: none;}/** * Address inconsistent and variable font size in all browsers. */small { font-size: 80%;}/** * Prevent `sub` and `sup` affecting `line-height` in all browsers. */sub,sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline;}sup { top: -0.5em;}sub { bottom: -0.25em;}/* ========================================================================== Lists ========================================================================== *//** * Address margins set differently in IE 6/7. */dl,menu,ol,ul { margin: 1em 0;}dd { margin: 0 0 0 40px;}/** * Address paddings set differently in IE 6/7. */menu,ol,ul { padding: 0 0 0 40px;}/** * Correct list images handled incorrectly in IE 7. */nav ul,nav ol { list-style: none; list-style-image: none;}/* ========================================================================== Embedded content ========================================================================== *//** * 1. Remove border when inside `a` element in IE 6/7/8/9 and Firefox 3. * 2. Improve image quality when scaled in IE 7. */img { border: 0; /* 1 */ -ms-interpolation-mode: bicubic; /* 2 */}/** * Correct overflow displayed oddly in IE 9. */svg:not(:root) { overflow: hidden;}/* ========================================================================== Figures ========================================================================== *//** * Address margin not present in IE 6/7/8/9, Safari 5, and Opera 11. */figure { margin: 0;}/* ========================================================================== Forms ========================================================================== *//** * Correct margin displayed oddly in IE 6/7. */form { margin: 0;}/** * Define consistent border, margin, and padding. */fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em;}/** * 1. Correct color not being inherited in IE 6/7/8/9. * 2. Correct text not wrapping in Firefox 3. * 3. Correct alignment displayed oddly in IE 6/7. */legend { border: 0; /* 1 */ padding: 0; white-space: normal; /* 2 */ *margin-left: -7px; /* 3 */}/** * 1. Correct font size not being inherited in all browsers. * 2. Address margins set differently in IE 6/7, Firefox 3+, Safari 5, * and Chrome. * 3. Improve appearance and consistency in all browsers. */button,input,select,textarea { font-size: 100%; /* 1 */ margin: 0; /* 2 */ vertical-align: baseline; /* 3 */ *vertical-align: middle; /* 3 */}/** * Address Firefox 3+ setting `line-height` on `input` using `!important` in * the UA stylesheet. */button,input { line-height: normal;}/** * Address inconsistent `text-transform` inheritance for `button` and `select`. * All other form control elements do not inherit `text-transform` values. * Correct `button` style inheritance in Chrome, Safari 5+, and IE 6+. * Correct `select` style inheritance in Firefox 4+ and Opera. */button,select { text-transform: none;}/** * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` * and `video` controls. * 2. Correct inability to style clickable `input` types in iOS. * 3. Improve usability and consistency of cursor style between image-type * `input` and others. * 4. Remove inner spacing in IE 7 without affecting normal text inputs. * Known issue: inner spacing remains in IE 6. */button,html input[type="button"], /* 1 */input[type="reset"],input[type="submit"] { -webkit-appearance: button; /* 2 */ cursor: pointer; /* 3 */ *overflow: visible; /* 4 */}/** * Re-set default cursor for disabled elements. */button[disabled],html input[disabled] { cursor: default;}/** * 1. Address box sizing set to content-box in IE 8/9. * 2. Remove excess padding in IE 8/9. * 3. Remove excess padding in IE 7. * Known issue: excess padding remains in IE 6. */input[type="checkbox"],input[type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ *height: 13px; /* 3 */ *width: 13px; /* 3 */}/** * 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome. * 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome * (include `-moz` to future-proof). */input[type="search"] { -webkit-appearance: textfield; /* 1 */ -moz-box-sizing: content-box; -webkit-box-sizing: content-box; /* 2 */ box-sizing: content-box;}/** * Remove inner padding and search cancel button in Safari 5 and Chrome * on OS X. */input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration { -webkit-appearance: none;}/** * Remove inner padding and border in Firefox 3+. */button::-moz-focus-inner,input::-moz-focus-inner { border: 0; padding: 0;}/** * 1. Remove default vertical scrollbar in IE 6/7/8/9. * 2. Improve readability and alignment in all browsers. */textarea { overflow: auto; /* 1 */ vertical-align: top; /* 2 */}/* ========================================================================== Tables ========================================================================== *//** * Remove most spacing between table cells. */table { border-collapse: collapse; border-spacing: 0;} /*YUI 3.11.0 (build d549e5c)Copyright 2013 Yahoo! Inc. All rights reserved.Licensed under the BSD License.http://yuilibrary.com/license/http://yuilibrary.com/yui/docs/cssgrids/*/.yui3-g { letter-spacing: -0.31em; /* Webkit: collapse white-space between units *letter-spacing: normal; /* reset IE < 8 */ *word-spacing: -0.43em; /* IE < 8: collapse white-space between units */ text-rendering: optimizespeed; /* Webkit: fixes text-rendering: optimizeLegibility */}/* Opera as of 12 on Windows needs word-spacing. The ".opera-only" selector is used to prevent actual prefocus styling and is not required in markup.*/.opera-only :-o-prefocus,.yui3-g { word-spacing: -0.43em;}.yui3-u { display: inline-block; zoom: 1; *display: inline; /* IE < 8: fake inline-block */ letter-spacing: normal; word-spacing: normal; vertical-align: top; text-rendering: auto;}.yui3-u-1,.yui3-u-1-1,.yui3-u-1-2,.yui3-u-1-3,.yui3-u-2-3,.yui3-u-1-4,.yui3-u-2-4,.yui3-u-3-4,.yui3-u-1-5,.yui3-u-2-5,.yui3-u-3-5,.yui3-u-4-5,.yui3-u-1-6,.yui3-u-5-6,.yui3-u-1-8,.yui3-u-3-8,.yui3-u-5-8,.yui3-u-7-8,.yui3-u-1-12,.yui3-u-5-12,.yui3-u-7-12,.yui3-u-11-12,.yui3-u-1-24,.yui3-u-5-24,.yui3-u-7-24,.yui3-u-11-24,.yui3-u-13-24,.yui3-u-17-24,.yui3-u-19-24,.yui3-u-23-24 { display: inline-block; zoom: 1; *display: inline; /* IE < 8: fake inline-block */ letter-spacing: normal; word-spacing: normal; vertical-align: top; text-rendering: auto;}.yui3-u-1 { display: block;}.yui3-u-1-1 { width: 100%;}.yui3-u-1-2 { width: 50%;}.yui3-u-1-3 { width: 33.33333%;}.yui3-u-2-3 { width: 66.66666%;}.yui3-u-1-4 { width: 25%;}.yui3-u-2-4 { width: 50%;}.yui3-u-3-4 { width: 75%;}.yui3-u-1-5 { width: 20%;}.yui3-u-2-5 { width: 40%;}.yui3-u-3-5 { width: 60%;}.yui3-u-4-5 { width: 80%;}.yui3-u-1-6 { width: 16.656%;}.yui3-u-5-6 { width: 83.33%;}.yui3-u-1-8 { width: 12.5%;}.yui3-u-3-8 { width: 37.5%;}.yui3-u-5-8 { width: 62.5%;}.yui3-u-7-8 { width: 87.5%;}.yui3-u-1-12 { width: 8.3333%;}.yui3-u-5-12 { width: 41.6666%;}.yui3-u-7-12 { width: 58.3333%;}.yui3-u-11-12 { width: 91.6666%;}.yui3-u-1-24 { width: 4.1666%;}.yui3-u-5-24 { width: 20.8333%;}.yui3-u-7-24 { width: 29.1666%;}.yui3-u-11-24 { width: 45.8333%;}.yui3-u-13-24 { width: 54.1666%;}.yui3-u-17-24 { width: 70.8333%;}.yui3-u-19-24 { width: 79.1666%;}.yui3-u-23-24 { width: 95.8333%;}.yui3-g-r { letter-spacing: -0.31em; *letter-spacing: normal; *word-spacing: -0.43em;}/* Opera as of 12 on Windows needs word-spacing. The ".opera-only" selector is used to prevent actual prefocus styling and is not required in markup.*/.opera-only :-o-prefocus,.yui3-g-r { word-spacing: -0.43em;}.yui3-g-r img { max-width: 100%;}@media (min-width:980px) { .yui3-visible-phone { display: none; } .yui3-visible-tablet { display: none; } .yui3-hidden-desktop { display: none; }}@media (max-width:480px) { .yui3-g-r > [class ^= "yui3-u"] { width: 100%; }}@media (max-width:700px) { .yui3-g > [class *= "yui3-u"], .yui3-g-r > [class *= "yui3-u"] { /*width: 90%; // disabling - breaking on homepage results/live/fixtures */ } .yui3-hidden-phone { display: none; } .yui3-visible-desktop { display: none; }}@media (min-width:768px) and (max-width:979px) { .yui3-hidden-tablet { display: none; } .yui3-visible-desktop { display: none; }}/* YUI CSS Detection Stamp */#yui3-css-stamp.cssgrids-responsive { display: none; }@media all and (min-width:990px){ .yui3-900-u-1 { display: block; } .yui3-900-u-1-2 { width: 50%; } .yui3-900-u-1-3 { width: 33.33333%; } .yui3-900-u-2-3 { width: 66.66666%; } .yui3-900-u-1-4 { width: 25%; } .yui3-900-u-3-4 { width: 75%; } .yui3-900-u-1-5 { width: 20%; } .yui3-900-u-2-5 { width: 40%; } .yui3-900-u-3-5 { width: 60%; } .yui3-900-u-4-5 { width: 80%; } .yui3-900-u-1-6 { width: 16.656%; } .yui3-900-u-5-6 { width: 83.33%; } .yui3-900-u-1-8 { width: 12.5%; } .yui3-900-u-3-8 { width: 37.5%; } .yui3-900-u-5-8 { width: 62.5%; } .yui3-900-u-7-8 { width: 87.5%; } .yui3-900-u-1-12 { width: 8.3333%; } .yui3-900-u-5-12 { width: 41.6666%; } .yui3-900-u-7-12 { width: 58.3333%; } .yui3-900-u-11-12 { width: 91.6666%; } .yui3-900-u-1-24 { width: 4.1666%; } .yui3-900-u-5-24 { width: 20.8333%; } .yui3-900-u-7-24 { width: 29.1666%; } .yui3-900-u-11-24 { width: 45.8333%; } .yui3-900-u-13-24 { width: 54.1666%; } .yui3-900-u-17-24 { width: 70.8333%; } .yui3-900-u-19-24 { width: 79.1666%; } .yui3-900-u-23-24 { width: 95.8333%; } .yui3-900-g-r { letter-spacing: -0.31em; *letter-spacing: normal; *word-spacing: -0.43em; }}@media all and (min-width:700px) { .yui3-700-u-1 { width: 100%; } .yui3-700-u-1-2 { width: 50%; } .yui3-700-u-1-3 { width: 33.33333%; } .yui3-700-u-2-3 { width: 66.66666%; } .yui3-700-u-1-4 { width: 25%; } .yui3-700-u-3-4 { width: 75%; } .yui3-700-u-1-5 { width: 20%; } .yui3-700-u-2-5 { width: 40%; } .yui3-700-u-3-5 { width: 60%; } .yui3-700-u-4-5 { width: 80%; } .yui3-700-u-1-6 { width: 16.656%; } .yui3-700-u-5-6 { width: 83.33%; } .yui3-700-u-1-8 { width: 12.5%; } .yui3-700-u-3-8 { width: 37.5%; } .yui3-700-u-5-8 { width: 62.5%; } .yui3-700-u-7-8 { width: 87.5%; } .yui3-700-u-1-12 { width: 8.3333%; } .yui3-700-u-5-12 { width: 41.6666%; } .yui3-700-u-7-12 { width: 58.3333%; } .yui3-700-u-11-12 { width: 91.6666%; } .yui3-700-u-1-24 { width: 4.1666%; } .yui3-700-u-5-24 { width: 20.8333%; } .yui3-700-u-7-24 { width: 29.1666%; } .yui3-700-u-11-24 { width: 45.8333%; } .yui3-700-u-13-24 { width: 54.1666%; } .yui3-700-u-17-24 { width: 70.8333%; } .yui3-700-u-19-24 { width: 79.1666%; } .yui3-700-u-23-24 { width: 95.8333%; } .yui3-700-g-r { letter-spacing: -0.31em; *letter-spacing: normal; *word-spacing: -0.43em; }}@media all and (min-width:550px) and (max-width: 699px){ .yui3-550-u-1 { width: 100%; } .yui3-550-u-1-2 { width: 50%; } .yui3-550-u-1-3 { width: 33.33333%; } .yui3-550-u-2-3 { width: 66.66666%; } .yui3-550-u-1-4 { width: 25%; } .yui3-550-u-3-4 { width: 75%; } .yui3-550-u-1-5 { width: 20%; } .yui3-550-u-2-5 { width: 40%; } .yui3-550-u-3-5 { width: 60%; } .yui3-550-u-4-5 { width: 80%; } .yui3-550-u-1-6 { width: 16.656%; } .yui3-550-u-5-6 { width: 83.33%; } .yui3-550-u-1-8 { width: 12.5%; } .yui3-550-u-3-8 { width: 37.5%; } .yui3-550-u-5-8 { width: 62.5%; } .yui3-550-u-7-8 { width: 87.5%; } .yui3-550-u-1-12 { width: 8.3333%; } .yui3-550-u-5-12 { width: 41.6666%; } .yui3-550-u-7-12 { width: 58.3333%; } .yui3-550-u-11-12 { width: 91.6666%; } .yui3-550-u-1-24 { width: 4.1666%; } .yui3-550-u-5-24 { width: 20.8333%; } .yui3-550-u-7-24 { width: 29.1666%; } .yui3-550-u-11-24 { width: 45.8333%; } .yui3-550-u-13-24 { width: 54.1666%; } .yui3-550-u-17-24 { width: 70.8333%; } .yui3-550-u-19-24 { width: 79.1666%; } .yui3-550-u-23-24 { width: 95.8333%; } .yui3-550-g-r { letter-spacing: -0.31em; *letter-spacing: normal; *word-spacing: -0.43em; }} .article__body p.opta-widget, .article__intro p.opta-widget { max-width: 100%; } .opta-widget-container { margin: 50px auto 10px auto; } .opta-widget-container .actionareas, .opta-widget-container .averageposition, .opta-widget-container .c_scorecard, .opta-widget-container .chalkboard, .opta-widget-container .commentary, .opta-widget-container .fixtures, .opta-widget-container .formation, .opta-widget-container .goalreplay, .opta-widget-container .matchstats-teamstats-container, .opta-widget-container .motorsport-liverace .tabs-content, .opta-widget-container .news-article, .opta-widget-container .opta-widget, .opta-widget-container .optafacts, .opta-widget-container .passingcombination, .opta-widget-container .profile, .opta-widget-container .rbvis, .opta-widget-container .season-standings, .opta-widget-container .squad, .opta-widget-container .standings, .opta-widget-container .standings-container, .opta-widget-container .stats, .opta-widget-container .team-container, .opta-widget-container .teamlist, .opta-widget-container .teamlist-onerow, .opta-widget-container .ticker, .opta-widget-container .timeline, .opta-widget-container .tracking-player-breakdown, .opta-widget-container .venues, .opta-widget-container .wagonwheel { -moz-border-radius: 0; -webkit-border-radius: 0; -khtml-border-radius: 0; border-radius: 0; margin-bottom: 50px; } .opta-widget-container h2 { background: #248dc1; -moz-border-radius: 0; -webkit-border-radius: 0; -khtml-border-radius: 0; border-radius: 0; font-size: 16px; height: 35px; line-height: 35px; } .opta-widget-container h2.opta-v3 { background: #248dc1; } .opta-widget-container > div { color: #222222; } .opta-widget-container > div table.canvas th.team { color: #222222; } .opta-widget-container > div tbody td { color: #222222; } .opta-widget-container > div thead th { color: #222222; } .opta-widget-container .commentary { color: #222222; } .opta-widget-container .fixtures .match { color: #222222; } .opta-widget-container .fixtures h4 { color: #222222; } .opta-widget-container .fixtures div.matches .schedule a { color: #222222; } .opta-widget-container .fixtures { color: #222222; } .opta-widget-container .fixtures-plus .tabs-active div.opta-dropdown { color: #222222; } .opta-widget-container .fixtures-plus td.standout a.external-link { color: #222222; } .opta-widget-container .fixtures-plus { color: #222222; } .opta-widget-container .fixtures-plus-grid td.standout { color: #222222; } .opta-widget-container .fixtures-plus-grid td.standout a.external-link { color: #222222; } .opta-widget-container .fixtures-plus-grid .grouping td { background-color: #222222; } .opta-widget-container .fixtures-plus-grid .fixture .fixture-content h4 { color: #222222; } .opta-widget-container .fixtures-plus-grid .fixture .fixture-content .badge span { color: #222222; } .opta-widget-container .fixtures-plus-grid .fixture .fixture-content .badge span a { color: #222222; } .opta-widget-container .fixtures-plus-grid .fixture .fixture-content .scoreline .goals { color: #222222; } .opta-widget-container .fixtures-plus-grid .fixture .fixture-content p.divider { color: #222222; } .opta-widget-container .fixtures-plus-grid { color: #222222; } .opta-widget-container .fixtures-plus-list td.standout { color: #222222; } .opta-widget-container .fixtures-plus-list td.standout a.external-link { color: #222222; } .opta-widget-container .fixtures-plus-list .grouping td { background-color: #222222; } .opta-widget-container .fixtures-plus-list { color: #222222; } .opta-widget-container .fixtures-plus-strip .fixture .scoreLine span { color: #222222; } .opta-widget-container .fixtures-plus-strip .fixture .scoreLine span a { color: #222222; } .opta-widget-container .fixtures-plus-strip { color: #222222; } .opta-widget-container .manhattanworm { color: #222222; } .opta-widget-container .matchinformation li abbr { color: #222222; } .opta-widget-container .matchinformation { color: #222222; } .opta-widget-container .c_match_summary { color: #222222; } .opta-widget-container .player-comparison .tabs-active .tabs-nav li a { color: #222222; } .opta-widget-container .player-comparison .tabs-container tbody th { color: #222222; } .opta-widget-container .player-comparison { color: #222222; } .opta-widget-container .playerranking a.external-link { color: #222222; } .opta-widget-container .playerranking { color: #222222; } .opta-widget-container .cricket-playerstats .tabs-active .tabs-nav li a { color: #222222; } .opta-widget-container .cricket-playerstats { color: #222222; } .opta-widget-container .results .match { color: #222222; } .opta-widget-container .results h4 { color: #222222; } .opta-widget-container .results div.matches .schedule a { color: #222222; } .opta-widget-container .results { color: #222222; } .opta-widget-container .c_scorecard { color: #222222; } .opta-widget-container .c_standings { color: #222222; } .opta-widget-container .teamranking a.external-link { color: #222222; } .opta-widget-container .teamranking { color: #222222; } .opta-widget-container .wagonwheel li abbr { color: #222222; } .opta-widget-container .wagonwheel .team li:not(.teamName) span { color: #222222; } .opta-widget-container .wagonwheel thead th { color: #222222; } .opta-widget-container .wagonwheel { color: #222222; } .opta-widget-container .probability h3 { color: #222222; } .opta-widget-container .probability { color: #222222; } .opta-widget-container h2 { /*font-family: "myriad-pro-n4","myriad-pro",sans-serif;*/ font-family: "adelle-n4", "adelle", serif; } .opta-widget-container > div { /*font-family: "myriad-pro-n4","myriad-pro",sans-serif;*/ font-family: "adelle-n4", "adelle", serif; } /*Wagon Wheel*/ .opta-widget-container .wagonwheel .team li.teamName { background-color: #000; -moz-border-radius: 0; -webkit-border-radius: 0; -khtml-border-radius: 0; border-radius: 0; } .opta-widget-container .wagonwheel .team li:last-child { background-color: #f6f6f6; -moz-border-radius: 0; -webkit-border-radius: 0; -khtml-border-radius: 0; border-radius: 0; } .opta-widget-container .wagonwheel p.innings a { display: inline-block; height: 3.125em; line-height: 3.125; padding: 0 1.25em; background: rgba(0,0,0,.1); color: #000; text-decoration: none; white-space: nowrap; border: none; -moz-border-radius: 0; -webkit-border-radius: 0; -khtml-border-radius: 0; border-radius: 0; } .opta-widget-container .wagonwheel p.innings a:hover { background: rgba(0,0,0,1); border: none; color: #fff; } .opta-widget-container .wagonwheel ul.team li.batter:hover { background-color: #fbfbfb; } .opta-widget-container .wagonwheel p.innings { font-size: 13px; max-width: 100%; } .opta-widget-container .wagonwheel .shots-table>div { -moz-border-radius: 0; -webkit-border-radius: 0; -khtml-border-radius: 0; border-radius: 0; } /*Match Information*/ .opta-widget-container .c_scorecard .summary dl dt { color: #248dc1; } .opta-widget-container .c_scorecard li.teamName { background-color: #000 !important; color: #fff; } .opta-widget-container .c_scorecard .summary>p { max-width: 100%; } .opta-widget-container .c_scorecard ul { padding-left: 0; } .opta-widget-container .c_scorecard ul.homeSide { width: 48%; } .opta-widget-container .c_scorecard li:nth-child(odd) { background-color: #f6f6f6; } /*Match Summary*/ .opta-widget-container .c_match_summary .innings_summary h4 span { color: #248dc1; } /*Player Compare*/ .opta-widget-container .ranking-category { height: 44px; line-height: 44px; background: #fafafa; position: relative; border-top: 1px solid #ddd; border-bottom: 1px solid #ccc; } .opta-widget-container .ranking-category select { font-size: 14px; margin-top: 5px; } .opta-widget-container .tabs-active .tabs-nav { height: 44px; line-height: 44px; background: #fafafa; position: relative; border-top: 1px solid #ddd; border-bottom: 1px solid #ccc; padding-left: 0; } .opta-widget-container .tabs-active .tabs-nav li { margin-bottom: 0; height: 45px; line-height: 45px; } .opta-widget-container .tabs-active .tabs-nav li a:hover, .opta-widget-container .tabs-active .tabs-nav li.tabs-selected a { border-left: 1px solid transparent; } .opta-widget-container .tabs-active .tabs-nav li.bowling.tabs-selected a { border-left: 1px solid #ddd; } .opta-widget-container .comparison { margin-bottom: 0; } .opta-widget-container .comparison select { font-size: 14px; } .opta-widget-container .comparison fieldset fieldset { padding: 10px 2% 3px 0%; } .opta-widget-container .tabs-active .tabs-nav li a:hover { background: #000; color: #fff; } .opta-widget-container .cricket-playerstats .tabs-container tbody th { background: #f6f6f6; border-bottom: 1px solid #fff; } /* ========================================================================== Font Imports Note: Some fonts (inc Myriad) are loaded with Typekit ========================================================================== */ @font-face { font-family: 'hurme_geometric_sans_3'; src: url('/fonts/hurmegeometricsans/hurmegeometricsans3_black-webfont.woff2') format('woff2'), url('/fonts/hurmegeometricsans/hurmegeometricsans3_black-webfont.woff') format('woff'); font-weight: 800; font-style: normal; } @font-face { font-family: 'hurme_geometric_sans_3'; src: url('/fonts/hurmegeometricsans/hurmegeometricsans3_bold-webfont.woff2') format('woff2'), url('/fonts/hurmegeometricsans/hurmegeometricsans3_bold-webfont.woff') format('woff'); font-weight: 600; font-style: normal; } @font-face { font-family: 'hurme_geometric_sans_3'; src: url('/fonts/hurmegeometricsans/hurmegeometricsans3_semibold-webfont.woff2') format('woff2'), url('/fonts/hurmegeometricsans/hurmegeometricsans3_semibold-webfont.woff') format('woff'); font-weight: 500; font-style: normal; } @font-face { font-family: 'hurme_geometric_sans_3'; src: url('/fonts/hurmegeometricsans/hurmegeometricsans3-webfont.woff2') format('woff2'), url('/fonts/hurmegeometricsans/hurmegeometricsans3-webfont.woff') format('woff'); font-weight: 400; font-style: normal; } /* ========================================================================== Base styles: opinionated defaults ========================================================================== */ /* apply a natural box layout model to all elements */ /* http://www.paulirish.com/2012/box-sizing-border-box-ftw/ */ *, *:before, *:after { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } html { overflow-x: hidden; width: 100%; } html, button, input, select, textarea { color: #222; } body { font-size: 1em; /* 16px */ line-height: 1.4; } /* @@LT-XL */ @media only screen and (max-width: 1200px) { body { font-size: .875em; /* 14px */ } } /* @@LT-M */ @media only screen and (max-width: 700px) { body { font-size: .75em; /* 12px */ } } /* * Remove text-shadow in selection highlight: h5bp.com/i * These selection rule sets have to be separate. * Customize the background color to match your design. */ ::-moz-selection { background: #b3d4fc; text-shadow: none; } ::selection { background: #b3d4fc; text-shadow: none; } /* * A better looking default horizontal rule */ hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; } /* * Remove the gap between images and the bottom of their containers: h5bp.com/i/440 */ img { vertical-align: middle; } /* * Remove default fieldset styles. */ fieldset { border: 0; margin: 0; padding: 0; } /* * Allow only vertical resizing of textareas. */ textarea { resize: vertical; } /* ========================================================================== Chrome Frame prompt ========================================================================== */ .chromeframe { margin: 0.2em 0; background: #ccc; color: #000; padding: 0.2em 0; } /* ========================================================================== Interaction adjustments ========================================================================== */ /* Disable double tap to zoom on IE10+ */ a, input, button { -ms-touch-action: pan-x pan-y; } /* ========================================================================== $typography ========================================================================== */ body { font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-weight: 400; font-style: normal; position: relative; margin: 0; padding: 0; } h1 { font-family: "myriad-pro-n3", "myriad-pro", sans-serif; margin: 0; font-weight: 700; font-size: 3.5em; line-height: 1.1; } h2, h3, h4, h5, h6 { font-family: "myriad-pro-n6", "myriad-pro", sans-serif; font-weight: 600; margin: 0; } h2 { font-size: 1.75em; line-height: 1; margin-top: 2em; margin-bottom: .75em; font-weight: 700; } h2:first-child { margin-top: 0; } h3 { font-size: 1.125em; font-family: "myriad-pro-n7", "myriad-pro", sans-serif; font-weight: 700; margin-bottom: .5em; } p { margin: 0 0 1.5em 0; } .article__body > p:first-of-type, .article__intro > p:first-of-type, .leader { font-family: "adelle-n4", "adelle", serif; font-size: 1.25em; line-height: 1.45; font-style: normal; margin-right: 1em; } a { color: #000; text-decoration: none; } /* //// doc link //// */ a[href*=".doc"], a[href*=".docx"] { display: block; text-decoration: none !important; position: relative; padding: 0 50px 10px 55px; font-size: .8em; color: #248dc1; min-height: 60px; } a[href*=".doc"]::before, a[href*=".docx"]::before { content: ' '; position: absolute; display: block; left: 0; top: 0; background: url(/img/furniture/doc-icon.png) no-repeat; height: 50px; width: 41px; } a[href*=".doc"] strong, a[href*=".docx"] strong { display: block; } /* //// pdf link //// */ a[href*=".pdf"]:not(.link--simple), a[href*="http://epublishbyus.com"] { display: block; text-decoration: none !important; position: relative; padding: 0 50px 10px 55px; font-size: .8em; color: #248dc1; min-height: 60px; } a[href*=".pdf"]:not(.link--simple)::before { content: ' '; position: absolute; display: block; left: 0; top: 0; background: url(/img/furniture/pdf-icon.png) no-repeat; height: 50px; width: 41px; } a[href*="http://epublishbyus.com"]::before { content: ' '; position: absolute; display: block; left: 0; top: 0; background: url(/img/furniture/epub-icon.jpg) no-repeat; height: 50px; width: 41px; } a[href*=".pdf"] strong, a[href*="http://epublishbyus.com"] strong { display: block; } /*styles needed for some link to PDF that should have an icon :) (grassroots skills challenge and smart resources)*/ a[href$=".pdf"].no__icon { padding: 0; } a[href$=".pdf"].no__icon:before { background: none; display: none; } ul { margin-bottom: 2em; } .table-overflow { width: 100%; overflow-x: scroll; border: 1px solid #eee; } table { min-width: 100%; } table th, table td { padding: 10px; } .module--quote img { margin-bottom: 3em; } blockquote img { margin-bottom: 2em; } blockquote { margin: 0 0 3.2em; font-family: "myriad-pro", sans-serif; padding: 0 75px; position: relative; color: #777; font-size: 1.25em; line-height: 1.45; } blockquote div { padding-bottom: 1px; margin-bottom: 1.2em; } blockquote:before { content: ' '; background: url(/img/furniture/opening-quote.png) no-repeat; position: absolute; top: 0; left: 15px; width: 38px; height: 30px; background-size: contain; } blockquote cite { font-style: normal; color: #222222; display: block; font-weight: 600; } @media (max-width: 550px) { blockquote { padding: 0; font-size: 1em; } blockquote:before { width: 25px; height: 21px; left: auto; top: auto; position: relative; display: block; float: left; margin: 0em .4em .2em 0; } } /* * Reduce main page headings on small screens * @@L */ @media only screen and (max-width: 700px) { h1 { font-size: 3em; } } .padder { position: relative; min-height: 1px; } .article__tab-menu { list-style: none; margin: 2em 0; overflow: hidden; padding: 0; } .article__tab-menu-item { display: block; float: left; margin: 0; padding: 0; } .article__tab-button { -webkit-appearance: none; background: #f5f5f5; border: 0; color: #141134; font: inherit; font-weight: bold; padding: .75em 2em; text-align: center; text-transform: uppercase; } .article__tab-button[data-selected] { background: #141134; color: #fff; } .article__tab-content-items { } .article__tab-content-item { display: none; } .article__tab-content-item[data-selected] { display: block; } .article__intro { width: 80%; max-width: 800px; } /*a*/ .link { } /*a*/ .link--simple { color: inherit; text-decoration: none; } .article__body, .article__intro { font-family: "adelle-n4", "adelle", serif; font-size: 1.25em; /* 16px x 1.25 = 20px */ line-height: 1.45; font-style: normal; } .article__body .button { font-size: .8em; } .article__body form .button { font-size: 1em; } .article__main .stream { margin-right: -6.3%; } /* @@LT-XL */ @media only screen and (max-width: 1100px) { .article__body, .article__intro { font-size: 1.4285em; /* 14px x 1.4285 = 20px */ } } .article__body em, .article__intro em { font-family: "adelle-i4", "adelle", serif; font-style: italic; } .article__body hr { width: 5em; border-top: 1px solid rgba(0, 0, 0, .2); margin: 3em 0 2em; } .article__body a, .article__intro a { text-decoration: underline; } .article__body a:hover { color: #248dc1; } .article__body img { margin-top: 2em; margin-bottom: 3em; } .article__body p img { margin-top: 2em; margin-bottom: 1em; } .article__body .image-caption { position: relative; top: -4em; width: 60%; text-align: left; padding-bottom: 1em; font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-weight: 400; font-size: .6em; color: #999; line-height: 1.5; } .article__body .image-caption:after { content: " "; position: absolute; bottom: 0; left: 0; width: 30%; border-top: 1px solid rgba(0, 0, 0, .2); } .article__body .img--small-margin { margin-top: 0; margin-bottom: 1em; } .article__body img[align=right] { box-sizing: content-box; margin: 2em 0 2em 2em; padding-left: 2em; border-left: 1px solid rgba(0, 0, 0, .1); } .article__body img[align=left] { box-sizing: content-box; margin: 2em 2em 2em 0; padding-right: 2em; border-right: 1px solid rgba(0, 0, 0, .1); } .article__body ul { XXfont-size: .875em; padding-left: 15px; } .article__body ol { padding-left: 0; } .article__body li { margin-bottom: .75em; } .article__body ol ul { padding-left: 1.5em; } .article__body ol ul li { list-style: disc; } .article__body .no_list { margin-left: 0; padding-left: 0; font-size: .75em; } .article__body .no_list li { list-style: none; margin-bottom: .5em; } .article__body .no_list a { font-family: "myriad-pro", sans-serif; display: inline-block; text-decoration: none; border: 1px solid #ddd; padding: .5em 1em; } .article__body a:hover { border-color: currentColor; } .article__body .button { text-decoration: none; font-family: "myriad-pro", sans-serif; } /** * ^Tail */ .tail { position: relative; } #scorecard-iframe { height: 300px; } .tail:after { content: " "; position: absolute; bottom: 0; left: 0; width: 3em; max-width: 100%; border-top: 1px solid rgba(0, 0, 0, .5); } .tail--before:after { bottom: auto; top: 0; } .tail--right:after { left: auto; right: 0; } .tail--light:after { border-color: rgba(255, 255, 255, .25); } .lt-ie8 .tail { border-bottom: 1px solid #eee; } .lt-ie8 .tail--light { border-color: #333; } .no-rgba .tail--light:after { border-top: 1px solid #666; } /* @@LT-M */ @media only screen and (max-width: 700px) { } .page-header__title-box h1 { font-family: "myriad-pro-n6", "myriad-pro", sans-serif; font-weight: 600; font-size: 4.25em; margin: 0; } .page-header__title-box h2 { font-family: "myriad-pro-n3", "myriad-pro", sans-serif; font-weight: 300; font-size: 1.625em; line-height: 1.4; margin: 0; max-width: 70%; } /* ========================================================================== $colour ========================================================================== */ .facebook { color: #3b5998; } .twitter { color: #00aced; } /* ========================================================================== $layout ========================================================================== */ .shrinkwrap { overflow: hidden; position: relative; } /** * ^page */ .page { position: relative; background: #fff; } /** * ^cover */ .cover { position: relative; height: 1000px; /* fix to viewport height in javascript the vh didn't have enough support */ height: 100vh; background: #000; } /* @@GT-L */ @media only screen and (min-width: 700px) { .cover { min-height: 700px; } .cover:after { content: " "; position: absolute; top: 0; right: 0; left: 0; height: 50%; background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0.4)), color-stop(100%, rgba(0, 0, 0, 0))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0) 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0) 100%); /* IE10+ */ background: linear-gradient(to bottom, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0) 100%); /* W3C */ pointer-events: none; } } .no-cssvhunit .cover { /*The modernizr test returns false for iOS safari due to an odd implementation of VH units. */ height: 1000px; } .cover__sponsors { position: absolute; z-index: 1; right: 10px; bottom: 210px; } .page-header__sponsors { position: absolute; z-index: 1; right: 15px; bottom: 20px; } @media only screen and (max-width: 700px) { .page-header__sponsors { top: 15px; bottom: auto; } } /** * ^group */ .group { position: relative; background: #fff; overflow: hidden; } /* @@GT-M */ @media only screen and (min-width: 700px) { .cover + .group { box-shadow: 0 0 10px rgba(0, 0, 0, .5); } } .group--overflow-visible { overflow: visible; } .group--grey { background-color: #f6f6f6; } .group--black { background: #111; color: #ccc; } .group--blue { background: #141134; color: #ccc; } .group__body { position: relative; width: 80%; margin: 0 auto; padding: 4em 0 4em; } .banner-ad__wrap { align-items: center; display: flex; flex-flow: row wrap; justify-content: center; overflow: hidden; } .banner-ad__wrap > * { flex: 0 0 auto; } @media (max-width: 1400px) { .group__body--match-centre { width: 90%; } } /* @@LT-XL */ @media only screen and (max-width: 1100px) { .group__body { width: 100%; padding-left: 10px; padding-right: 10px; position: relative; } .lt-ie9 .group__body { width: auto; } } @media only screen and (max-width: 700px) { .group__body { padding-top: 2em; padding-bottom: 2em; } } .group__body.yui3-g-r { /* yui3 metric adjust */ /*letter-spacing: -0.25em;*/ } .group__body--hp-news-primary { padding-top: 4em; } .group__header { } /** * ^Page */ .page-header { position: relative; height: 400px; background-color: #111; color: #fff; } .team-page-header { position: relative; height: 700px; background-color: #111; color: #fff; } .page-header--with-image { background-size: cover; -ms-behavior: url(/css/backgroundsize.htc); background-position: center center; } .page-header--with-image:after { content: " "; position: absolute; top: 0; right: 0; left: 0; height: 100%; /*http://www.colorzilla.com/gradient-editor/#000000+0,000000+75,000000+75&0.35+0,0+75;Custom*/ filter: none; /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjM1Ii8+CiAgICA8c3RvcCBvZmZzZXQ9Ijc1JSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=); background: -moz-linear-gradient(left, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 75%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(0, 0, 0, 0.35)), color-stop(75%, rgba(0, 0, 0, 0))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 75%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(left, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 75%); /* Opera 11.10+ */ background: -ms-linear-gradient(left, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 75%); /* IE10+ */ background: linear-gradient(to right, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 75%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#59000000', endColorstr='#00000000', GradientType=1); /* IE6-8 */ pointer-events: none; } .page-header__title-box { position: absolute; left: 10%; bottom: 2em; right: 20%; XXtext-shadow: 0 0 40px rgba(0, 0, 0, .7); z-index: 999; } @media only screen and (max-width: 700px) { .anzseries--pageheaderlogo { width: 120px; top: 2em; } } /* @@LT-XL */ @media only screen and (max-width: 1100px) { .page-header { height: auto; padding: 10em 10px 1em; } .team-page-header { height: auto; padding: 10em 10px 13em; } .page-header__title-box { position: relative; left: auto; bottom: auto; right: auto; } .page-header__title-box h1 { font-size: 3em; line-height: 1em; } } /* @@LT-M */ @media only screen and (max-width: 700px) { .page-header, .team-page-header { padding-top: 0; background: #000 !important; } .page-header__title-box h2 { font-size: 1.3em; } } .header__sponsor { display: none; } .slideshow__sponsor { display: none; } @media all and (min-width: 490px) { .header__sponsor { width: 180px; display: block; position: absolute; right: 1%; bottom: 1%; z-index: 100; } .header__sponsor img { max-width: 100%; max-height: 100%; } } @media all and (min-width: 700px) { .slideshow__sponsor { width: 180px; display: block; position: absolute; right: 10px; bottom: 200px; z-index: 100; } .slideshow__sponsor img { max-width: 100%; max-height: 100%; float: right; } } @media all and (min-width: 1100px) { .header__sponsor, .slideshow__sponsor { width: auto; } } /** * ^Banner */ .banner { } .banner__image { } .banner__image--full { width: 100%; } .banner__image--max1400 { display: block; max-width: 1400px; margin: 0 auto; } /** * ^Article */ .article__sidebar { padding-right: 4.166%; padding-top: 1em; } .article__sidebar__title { font-size: 1em; position: relative; padding-bottom: .75em; margin-bottom: .5em; font-family: "myriad-pro-n6", "myriad-pro", sans-serif; font-weight: 600; } .article__image-header { position: relative; margin-bottom: 3em; } .article__image-header__image { width: 100%; } .article__header { position: relative; padding-bottom: 1em; margin-bottom: 1em; } .article__subheading { font-size: 3em; } .article__main { padding-left: 4.166%; position: relative; } /* @@L*/ @media only screen and (max-width: 700px) { .article__main { padding-left: 0; } } @media only screen and (max-width: 700px) { .article__sidebar { /*border-bottom: solid 1px #ddd; margin-bottom: 2em; padding-bottom: .5em;*/ display: none; } .membership-page .article__sidebar { display: block; width: 100%; padding: 0; } .membership-page .article__sidebar .side-nav { overflow-x: scroll; overflow-y: hidden; white-space: nowrap; margin-left: -10px; margin-right: -10px; padding: 0 10px; margin-bottom: .5em; } .membership-page .article__sidebar .side-nav li { white-space: normal; display: inline-block; *display: inline; zoom: 1; padding-right: 1em; } } .article__share { /* TODO: Shift to bottom of article */ width: 50px; float: left; margin: .45em 0 0 -50px; top: 0; } .profile__share { margin-bottom: 1em; } .profile__share .share__item { display: inline-block; margin-bottom: 0; margin-right: .75em; } @media only screen and (max-width: 900px) { .profile__share { margin-top: 1em; } } @media (max-width: 700px) { .article__main { width: 100% !important; /* override the default yui3 width */ } } @media (max-width: 1400px) { .article__main { width: 75%; /* override the default yui3 width */ } } @media only screen and (max-width: 900px) { .article__share { float: none; width: auto; margin-left: 0; margin-bottom: 1em; } } .article__body { position: relative; padding-bottom: 3em; } .article__body:after { content: " "; position: absolute; bottom: 0; left: 0; width: 20%; } .article__body .sidebar { display: none; /* TODO: should we remove from content? */ } .article__body p, article__intro p { max-width: 90%; } /* @@LT-L */ @media only screen and (max-width: 900px) { .article__body { margin-left: 0; } } .article__byline { position: relative; margin-top: 1em; padding-bottom: 1em; color: #999; } .article__byline strong { font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-weight: 400; color: #000; } .article__body figure { position: relative; margin: 3em 0; } .article__body figure img { width: 100%; margin: 0; } .article__body figure figcaption, .article__image-header figcaption { position: absolute; bottom: 0; right: -30%; width: 30%; padding-left: 3em; padding-bottom: 1em; font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-weight: 400; font-size: .6em; color: #999; line-height: 1.5; } .lt-ie8 .article__body figure figcaption, .lt-ie8 .article__image-header figcaption { padding-left: 0; width: 100px; right: -120px; } .article__body figure figcaption:after, .article__image-header figcaption:after { content: " "; position: absolute; bottom: 0; left: 3em; width: 30%; border-top: 1px solid rgba(0, 0, 0, .2); } /* @@LT-L */ @media only screen and (max-width: 900px) { .article__body figure figcaption, .article__image-header figcaption { position: relative; right: auto; bottom: auto; padding-left: 0; margin-top: .5em; font-size: 1em; width: auto; } .article__body figure figcaption:after, .article__image-header figcaption:after { left: 0; } } .article__body iframe, .article__body embed { width: 100%; } .article__body .iframe-sizer { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; } .article__body .iframe-sizer iframe, .article__body .iframe-sizer embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: 0; } .article__body img { max-width: 100%; } /** * ^section * typically a section html tag */ .section { } .section__header { position: relative; margin-bottom: 1.25em; } .section__header h2 { display: inline-block; position: relative; font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-weight: 400; font-size: 1.625em; margin-bottom: 0; padding-bottom: .5em; padding-top: 0; } .section__footer { position: relative; padding-top: 1em; } .section--news-stream { margin-bottom: 2em; } /** * ^sitenav */ .site-nav { position: fixed; top: 0; right: 0; bottom: 0; width: 1000px; background: #222; z-index: 0; box-shadow: 20px 20px 30px -20px black inset; } .site-nav__header { height: 150px; } .site-nav__body { padding: 0 60px; } .site-nav__nav { position: absolute; top: 0; right: 0; } .site-nav__logo.logo { background: none; position: absolute; top: 1px; left: 21px; width: 140px; } /* ========================================================================== $objects ========================================================================== */ /** * ^header ^masthead */ .masthead { position: fixed; left: 10px; top: 10px; right: 10px; z-index: 1000; padding-left: 10.417em; font-size: .9em; } /* @@XL*/ @media only screen and (min-width: 1100px) { .masthead { font-size: 1em; } } /** * ^logo */ .masthead__logo { position: absolute; top: -10px; left: 0; overflow: visible; /*-webkit-transition: width .125s; -moz-transition: width .125s; -o-transition: width .125s; transition: width .125s;*/ box-sizing: content-box; /* border-top: solid 15px #000; */ } /* .logo { background: #000; } */ .masthead__logo a { background: #141134 url(/img/furniture/nzc-logo-2.svg) center no-repeat; background-size: 7em 2.333em; display: block; height: 5.083em; position: relative; margin-right: 10px; width: 9.75em; } .logo__img { width: 100%; } .masthead__logo .logo__img { border: 0; height: 2.333em; width: 7em; } @media only screen and (max-width: 1385px) { .masthead { padding-left: 6.5em; } .masthead__logo a { background-image: url(/img/furniture/nzc-logo-vert-2.svg); background-size: 2.851em 4.375em; height: 7.375em; width: 5.851em; } } @media screen and (max-width: 700px) { .masthead__logo { background: #000; position: relative; } .masthead__logo a { display: block; position: absolute; right: 0; } .masthead__logo .logo__img { height: 85px; width: auto; margin: 0 auto; } } .masthead__nav { float: left; opacity: .98; width: 100%; } .navitemwithdropdown { position: relative; } .navitemwithdropdown__icon { position: relative; margin-right: 2em; margin-left: .25em; vertical-align: middle; top: -.125em; width: 7em; } .navitemwithdropdown a { position: relative; z-index: 1; } .navitemdropdown { position: absolute; left: 0; right: 0; top: 3.125em; background-image: url(/img/membership/navitemdropdown.jpg); background-position: bottom center; background-size: cover; padding: 15px 10px 110px; line-height: 1.2; display: block; text-align: center; color: #fff; z-index: 1; text-shadow: none; -webkit-transition: opacity .2s ease-in-out 0s, top 0s linear 0s; -moz-transition: opacity .2s ease-in-out 0s, top 0s linear 0s; transition: opacity .2s ease-in-out 0s, top 0s linear 0s; opacity: 1; border: 2px solid #000; border-top: none; } .navitemdropdown .button { text-transform: uppercase; margin-top: .8em; padding: .5em 1em; height: auto; line-height: 1em; } .navitemdropdown--scrolled { opacity: 0; pointer-events: none; top: -1000px; -webkit-transition: opacity .2s ease-in-out 0s, top 0s linear .25s; -moz-transition: opacity .2s ease-in-out 0s, top 0s linear .25s; transition: opacity .2s ease-in-out 0s, top 0s linear .25s; } .navitemdropdown:hover .navitemdropdown { opacity: 1; top: 3.125em; -webkit-transition: opacity .2s ease-in-out 0s, top 0s linear 0s; -moz-transition: opacity .2s ease-in-out 0s, top 0s linear 0s; transition: opacity .2s ease-in-out 0s, top 0s linear 0s; } .navitemdropdown__heading { text-transform: uppercase; font-size: 18px; line-height: 1; color: #000; font-family: "myriad-pro-condensed-n9", "myriad-pro-condensed", sans-serif; font-style: normal; font-weight: 900; margin: 0 0 5px; } .navitemdropdown__heading b { color: #fff; font-family: "myriad-pro-condensed-n9", "myriad-pro-condensed", sans-serif; font-style: normal; font-weight: 900; } .navitemdropdown__description { font-size: 12px; margin: 0; } .navitemdropdown__nib { width: auto; height: 8px; position: absolute; top: -8px; left: 50%; margin: 0 0 0 -8px; } @media only screen and (max-width: 1100px) { .navitemdropdown__heading { font-size: 14px; margin: 0; } .navitemdropdown__description { display: none; } } @media only screen and (max-width: 1400px) { .navitemdropdown { display: none; } } @media screen and (max-width: 700px) { .navitemwithdropdown__icon { margin-left: 0; } .masthead__nav .nav__item.navitemwithdropdown { display: none; } } .navitemwithdropdown--brendon300 .button { background-color: #7d8e9a; } .navitemwithdropdown--brendon300 .button:hover { background-color: #7d8e9a; } .masthead__backdrop { position: fixed; top: 0; left: 0; width: 0; height: 0; z-index: 990; background: #000; opacity: 0; -webkit-transition: opacity .25s .25s, width 0 .5s, height 0 .5s; -moz-transition: opacity .25s .25s, width 0 .5s, height 0 .5s; transition: opacity .25s .25s, width 0 .5s, height 0 .5s; } .masthead__backdrop.open { -webkit-transition: opacity .25s 0, width 0 0, height 0 0; -moz-transition: opacity .25s, width 0 0, height 0 0; transition: opacity .25s, width 0 0, height 0 0; width: 100%; height: 100%; opacity: .15; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=15)"; filter: alpha(opacity=15); } /** * ^nav */ .nav { margin: 0; padding: 0; } .nav__item { position: relative; float: left; list-style: none; margin: 0 1px 1px 0; padding: 0; line-height: 0; } .nav__item.live-item a { color: #d14233; } .nav--stacked > .nav__item { float: none; margin: 0; } .nav--stacked > .nav__separator { list-style: none; height: 2em; } .nav__item--site-nav { margin-top: 0; } .nav__item--right { float: right; } /*.nav__item.lt-1400 { display:none; }*/ /* @@XXL*/ @media only screen and (max-width: 1740px) { /*formerly 1400px but the menu is wider, the myBC button needs to stay on the second line a bit longer*/ .nav__item--right { float: left; } .nav__item--separator { XXclear: left; } .nav__item.gt-1400 { display: none; } .nav__item.lt-1400 { display: inline-block; *display: inline; zoom: 1; } } /* @@XL*/ @media only screen and (max-width: 700px) { .nav__item--separator { clear: none; } } .masthead__section-nav { border-left: 1px solid transparent; border-bottom: 1px solid transparent; margin-right: 0; margin-bottom: 0; height: 3.125em; box-sizing: content-box; } .masthead__section-nav.open { z-index: 2; box-shadow: 0 0 400px rgba(0, 0, 0, .25); } .masthead__section-nav:after { content: " "; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: -1; box-shadow: 0 0 200px rgba(0, 0, 0, .2), 1px 1px 0 rgba(0, 0, 0, .05); } .masthead__section-nav > .button { position: relative; z-index: 1; box-sizing: content-box; } .masthead__section-nav.open > .button { border-bottom: 1px solid #fff; } .masthead__section-nav.open > .button:hover { border-bottom-color: #000; } .masthead__section-nav .button { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .masthead__section-nav .button img { height: 100%; vertical-align: top; } .lt-ie8 .masthead__section-nav .button i { position: relative; top: .25em; } .masthead__section-nav ul .button { overflow: hidden; text-overflow: ellipsis; } /** * ^button */ .button { display: inline-block; height: 3.125em; /* 50px at 1em = 16px */ line-height: 3.125; padding: 0 1.25em; /* 20px */ background: #fff; color: #000; text-decoration: none; white-space: nowrap; border: none; } .button:hover { background: #000; color: #fff; } .button--light { background: rgba(0, 0, 0, .6); } .button--light:hover { background: rgba(0, 0, 0, 1); } .button--extra-light { background: rgba(0, 0, 0, .1); } .button--extra-light:hover { background: rgba(0, 0, 0, 1); } .button--dark { background: #000; color: #fff; } .button--dark:hover { background: #444; color: #fff !important; } .button--blue { background: #147dc1; color: #fff; } .button--blue:hover { background: #4fa4ce; color: #fff !important; } .button--grey { background: #f3f3f3; color: #000; } .button--grey:hover { background: #000; color: #fff !important; } .button--strong { font-weight: 600; } .button:active, .button:focus { outline: none; } .button--medium { font-size: .875em; height: 3em; line-height: 3; padding-left: 1.4285em; padding-right: 1.4285em; } .button--small { font-size: .875em; XXheight: 2.3em; height: auto; line-height: 2.2; padding-left: .75em; padding-right: .75em; border: none; } .button--border { background: none; border: 1px solid; } .button--border:hover { border-color: #000; } .button--icon-left i { margin-right: .5em; } .button--icon-right i { margin-left: .5em; } .button > small { position: relative; top: -.15em; } .button--icon-only { width: 3.75em; /* 60px */ padding: 0; text-align: center; } /*.lt-ie8 .button--icon-only i{ position: relative; top: .5em; }*/ .button--simple:hover { background: none; color: #fff; } .button--grey { border-color: #ccc; color: #888; } .button--grey-nohover:hover { border-color: #ccc; color: #888; background: none; cursor: default; } .match-skysport img { height: 18px; } .match-sparksport img { height: 28px; margin-left: -8px; } .match-youtube img { height: 16px; margin: 0 2px; } .match-rova img { height: 14px; } .match-magic img { height: 16px; } .match-tvnz img { height: 30px; } .match-three-now img { height: 30px; } .match-icc-tv img { height: 30px; } .match-acc-cricket img { height: 30px; } .match-magic-rova img { height: 20px; } .match-ihr img { height: 13px; } .match-btn { padding-left: .2em; padding-right: .2em; } .match-tvnz, .match-acc-cricket, .match-icc-tv, .match-magic { padding-right: .5em; } .button--black { border-color: #ccc; color: #000; } .button--black-nohover:hover { border-color: #ccc; color: #000; background: none; cursor: default; } /** * ^side-nav */ .side-nav { margin: 0; padding: 0; list-style: none; font-size: .875em; } .side-nav ul { display: none; margin: 0 0 1em 1em; padding: 5px 0 0; } .side-nav li { margin: 0; padding: 7px 0; list-style: none; line-height: 1.2; } .side-nav ul li { padding: 5px 0; } .side-nav a { text-decoration: none; color: #777; } .side-nav li.active > a { font-family: "myriad-pro-n7", "myriad-pro", sans-serif; font-weight: 700; color: #000; } .side-nav li.active > ul { display: block; } /** * ^carousel */ .carousel { position: absolute; top: 0; right: 0; bottom: -20px; left: 0; /*-webkit-backface-visibility: hidden; -webkit-transform: translate3d(0,0,0) scale3d(1,1,1); -webkit-transform-style: preserve-3d;*/ overflow: hidden; overflow-x: scroll; -webkit-overflow-scrolling: touch; -ms-overflow-style: none; -ms-content-zooming: none; -ms-user-select: none; -ms-scroll-chaining: none; -ms-scroll-snap-type: mandatory; } .carousel__nav { position: absolute; top: -10px; left: -76px; z-index: 2; } .carousel__nav__item { position: absolute; top: 0; margin: 0; } .carousel__nav__item--prev { left: 0; } .carousel__nav__item--next { left: 0px; top: 81px; } .carousel__item:first-child .carousel__nav__item--prev, .carousel__item--first .carousel__nav__item--prev { opacity: .33; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=33)"; filter: alpha(opacity=33); } .carousel__item:last-child .carousel__nav__item--next, .carousel__item--last .carousel__nav__item--next { opacity: .33; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=33)"; filter: alpha(opacity=33); } .carousel__nav .button { width: 60px; height: 80px; line-height: 80px; font-size: 28px; background: #000; color: #fff; } .carousel__nav .button:hover { color: #000; background: #fff; } .carousel__nav .button:active { } .carousel__surface { position: absolute; height: 100%; width: 100%; margin: 0; padding: 0; white-space: nowrap; /*transform: translate3d(0%,0,0) scale3d(1,1,1); -o-transform: translate3d(0%,0,0) scale3d(1,1,1); -ms-transform: translate3d(0%,0,0) scale3d(1,1,1); -moz-transform: translate3d(0%,0,0) scale3d(1,1,1); -webkit-transform: translate3d(0%,0,0) scale3d(1,1,1); -webkit-backface-visibility: hidden; -webkit-transform-style: preserve-3d; xoverflow: hidden;*/ } .carousel__surface.animate { -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; transition: all .3s; } .carousel__item { position: relative; width: 100%; height: 100%; margin: 0; padding: 0; white-space: normal; /*-webkit-transform-style: preserve-3d; -webkit-transform: translate3d(0,0,0);*/ } /** * ^slide */ .slide { position: absolute; top: 0; left: 0; right: 0; bottom: 200px; /*-webkit-transform: translate3d(0,0,0);*/ } .slide__image { position: absolute; top: 0; right: 0; bottom: -200px; left: 0; background-position: center center; background-size: cover; } .lt-ie9 .slide__image { behavior: url(/v2/css/backgroundsize.htc); } .slide__caption { position: absolute; left: 86px; bottom: 0px; width: 25%; z-index: 2; } .lt-ie8 .slide__caption { left: 10px; padding: 10px 15px 15px; background: #000; width: 40%; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)"; filter: alpha(opacity=90); } .lt-ie8 .slide__caption--clone { display: none; } /* @@LT-XL */ @media only screen and (max-width: 1500px) { .slide__caption { width: 40%; } } /* @@LT-XL */ @media only screen and (max-width: 1100px) { .slide__caption { width: 50%; } } /* @@LT-L */ @media only screen and (max-width: 900px) { .slide__caption { width: 60%; } } .slide__caption--clone { z-index: 1; opacity: .7; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; filter: alpha(opacity=70); } .caption { font-size: 1.25em; font-family: "myriad-pro-n3", "myriad-pro", sans-serif; font-weight: 300; color: #fff; } .caption a { color: #fff; } .caption__heading { font-size: 2.5em; line-height: 1; font-weight: 600; margin: 0; } .lt-ie8 .caption { font-size: 1em; } .lt-ie8 .caption__heading { font-size: 2em; } .caption__deck { margin: .5em 0 .4em; } .caption__dateline { margin: 0; line-height: 1.6; font-size: .75em; font-weight: 400; color: #999; } .lt-ie8 .caption__dateline { font-size: 1em; } .caption__link { margin-top: .75em; } .caption__link b { display: inline-block; font-size: .6875em; border: 1px solid rgba(255, 255, 255, .25); font-weight: 400; padding: .5em 1em; } .no-rgba .caption__link b { border: 1px solid #fff; } .caption__link b i { margin-left: .5em; } .caption__link b:hover { background: #fff; color: #000; border-color: #000; } .no-rgba .caption__link b:hover { border-color: #000; } /* @@LT-M */ @media only screen and (max-width: 700px) { .cover { height: auto !important; } .carousel__nav { display: none; } .cover__sponsors { display: none; } .carousel, .carousel__surface { position: relative; top: auto; left: auto; right: auto; bottom: auto; } .carousel__item { width: 45%; } .slide { position: relative; top: auto; left: auto; right: auto; bottom: auto !important; padding-bottom: 3em; } .slide__caption { position: relative; width: auto; top: auto; left: auto; right: auto; bottom: auto; padding: 10px; z-index: auto; } .slide__caption--clone { display: none; } .caption__heading { font-size: 1.25em; font-weight: 600; } .slide__image { position: relative; top: auto; left: auto; right: auto; bottom: auto; width: auto; height: 0; padding-top: 60%; margin: 0 10px; } } /* @@LT-S */ @media only screen and (max-width: 400px) { .carousel__item { width: 90%; } } /** * ^ blockout */ /*.blockout > .line { display: block; }*/ .blockout .word { position: relative; display: inline-block; } .slide__caption--clone .blockout .word { margin: -10px -15px; padding: 10px 15px; background: #000; color: #000; border-radius: 2px; } .slide__caption--clone .blockout .word--pad-b { padding-bottom: 15px; margin-bottom: -15px; } /** * ^sponsors */ .sponsors-list { color: rgba(255, 255, 255, .75); font-size: .875em; text-shadow: 0 0 10px rgba(0, 0, 0, .5); margin: 0; padding: 0; } .no-rgba .sponsors-list { color: #fff; } .sponsors-list__item { margin: 0; padding: 0; list-style: none; } .sponsors-list__item__img { vertical-align: bottom; margin-left: .5em; } /** * ^carousel pager */ .carousel-pager { position: absolute; bottom: 235px; left: 15px; height: 1px; } .carousel-pager__link { display: block; float: left; text-indent: -9000px; line-height: 1px; height: 12px; width: 12px; margin: 0 3px 0 0; background: rgba(0, 0, 0, .8); border: solid 1px rgba(255, 255, 255, .2); -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; } .carousel-pager__link:hover, .carousel-pager__link--selected { background: rgba(255, 255, 255, .8); } .touch .carousel-pager__link { height: 20px; width: 20px; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; } /* * ^ANZ Panel */ .anz-panel { position: absolute; right: 10px; left: 86.6666%; bottom: 20px; height: 170px; border-left: 1px solid transparent; background: #004165; text-align: center; opacity: .95; } .anz-panel img { position: absolute; top: 25%; left: 12.5%; width: 75%; } /** * ^Match Slider */ .match-slider { position: absolute; left: 10px; right: 10px; bottom: 10px; height: 190px; background: #fff; box-shadow: 0 0 20px rgba(0, 0, 0, .125), 0 0 5px rgba(0, 0, 0, .2); border-radius: 1px; } .cover--haspanel .match-slider { right: 13.333%; } /* @@GT-M */ @media only screen and (min-width: 700px) { .match-slider { opacity: .95; } } @media only screen and (max-width: 700px) { .anz-panel { position: relative; bottom: auto; right: 0; left: 0; height: auto; padding: 20px 20px; } .anz-panel img { max-width: 250px; position: relative; margin: 0 auto; top: auto; left: auto; bottom: auto; right: auto; width: auto; } } .match-slider__scrollcover { position: absolute; bottom: 0; left: 40px; right: 40px; height: 17px; background: #fff; z-index: 1; } .match-slider__nav { position: absolute; top: 0; left: 0; right: 0; z-index: 2; } .match-slider__nav__item { position: absolute; top: 15px; margin: 0; } .match-slider__nav__item--prev { left: 0px; border-right: 1px solid #666; } .match-slider__nav__item--next { right: 0px; border-left: 1px solid #666; } .match-slider__nav .button { width: 60px; height: 160px; line-height: 160px; font-size: 28px; background: none; color: #000; -webkit-transition: color .25s; -moz-transition: color .25s; -o-transition: color .25s; transition: color .25s; } .match-slider__nav .button:hover { color: #999; background: none; } .match-slider__nav .button:active { background: none; color: #248dc1; text-shadow: 0 0 30px #248dc1; } .match-slider__surface { position: absolute; left: 60px; right: 60px; height: 100%; overflow: hidden; white-space: nowrap; overflow-x: scroll; -webkit-overflow-scrolling: touch; } .mspointerenabled .match-slider__surface { overflow-x: scroll; -ms-overflow-style: none; -ms-content-zooming: none; -ms-user-select: none; -ms-scroll-chaining: none; } .match-media { height: 30px; } /* * ^Match group */ .match-group { margin: 0 25px; padding-top: 10px; } .match-group__title { display: inline-block; position: relative; margin: 0 0 10px 0; padding: 0 0 5px 0; font-size: .75em; font-family: "myriad-pro-n6", "myriad-pro", sans-serif; font-weight: 600; line-height: 20px; text-transform: uppercase; letter-spacing: .2em; color: #333; } .match-group__title small { font-size: 1em; opacity: .5; } .match-group__title:after { content: " "; position: absolute; bottom: 0; left: 0; width: 40px; max-width: 100%; border-top: 1px solid rgba(0, 0, 0, .5); } .match-group__title--live { color: #e70033; } .match-group__title--live:after, .match-group--live .match-links:before { border-color: rgba(253, 0, 51, .2); } .match-group__title--clone { position: absolute; top: 10px; left: 80px; } /* * ^Match List */ .match-list { margin: 0; padding: 0; } .match-list__item { list-style: none; } /* * ^Match box */ .match-box { position: relative; margin: 0; padding: 0; max-width: 300px; padding-right: 2em; padding-left: 0; font-size: .75em; } .lt-ie8 .match-box { min-width: 200px; } .match-list--stacked .match-box { } .match-summary, .match-date { color: #777; font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-weight: 400; margin: 0; padding: 0; line-height: 1.4; } .match-summary b { padding: 0 .25em; font-family: "myriad-pro-n7", "myriad-pro", sans-serif; font-weight: 300; color: #aaa; } .match-title { font-size: 1.142em; line-height: 1.2; font-family: "myriad-pro-n7", "myriad-pro", sans-serif; font-weight: 700; margin: 0; padding: 0; color: #333; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .match-status { font-family: "myriad-pro-n6", "myriad-pro", sans-serif; font-weight: 600; margin: 0; padding: 0; display: inline-block; } .match-status strong { font-family: "myriad-pro-n6", "myriad-pro", sans-serif; font-weight: 600; } .match-links { position: relative; font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-weight: 400; z-index: 1; margin-top: .5em; } @media (max-width: 700px) { .match-links { white-space: normal; } } /*.match-links:before { content: " "; position: absolute; top: 0; left: 0; width: 40px; max-width: 100%; border-top: 1px solid rgba(0,0,0,.5); }*/ .match-links a { font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-weight: 400; color: #248dc1; margin: 0; white-space: nowrap; margin-bottom: 1px; } /*.match-links > *:after,*/ .match-status strong:after { content: "\2013"; color: currentColor; margin: 0; } .match-links > *:last-child:after, .match-status > *:last-child:after { display: none; } .match-box--live .match-links a, .match-box--live .match-status strong { color: #e70033; } .match-box--large { font-size: 1em; max-width: none; padding-right: 0; padding-bottom: 2em; padding-left: 5em; margin-top: 2em; border-bottom: 1px solid #ddd; } .match-box--large .match-title { font-size: 1.125em; font-family: "myriad-pro-n6", "myriad-pro", sans-serif; font-weight: 600; white-space: normal; } .match-box--large .match-status { margin-top: .25em; } .match-box--large .match-header { position: absolute; top: .25em; right: 0; color: #999; text-align: right; } .match-box--large .match-summary, .match-box--large .match-status, .match-box--large .match-links { line-height: 1.4; color: #333; } .match-box--large .match-links { margin-top: .75em; padding-top: 0; } .match-box--large .match-links:before { display: none; } .match-box--large .match-links > *:after { display: none; } .match-box--large .match-links .button--small { font-size: .75em; height: 2.5em; line-height: 2.4; } .match-box--large .match-links .match-skysport img { margin-bottom: 3px; } .date-badge { position: absolute; top: -.25em; left: 0; font-weight: 300; text-align: center; text-transform: uppercase; line-height: 1; color: #333; } .date-badge__day { font-size: 3em; } .date-badge__month { margin-top: .1em; font-size: .875em; letter-spacing: 0.05em; font-weight: 400; } /* @@LT-M */ @media only screen and (max-width: 700px) { .match-slider { position: relative; top: auto; left: auto; right: auto; bottom: auto; background: #fff; box-shadow: none; } .cover--haspanel .match-slider { right: auto; } .match-slider__surface { position: relative; top: auto; left: auto; right: auto; bottom: auto; } .match-slider__nav, .match-slider__scrollcover { display: none; } .match-group__title--clone { display: none; } .match-box { max-width: 200px; } .match-box--large { max-width: none; font-size: 1.25em; margin-bottom: 1em; margin-top: 1em; padding-left: 0; padding-bottom: 1em; } .match-box--large .match-title { font-size: 1em; margin-bottom: .25em; } .match-box--large .match-summary, .match-box--large .match-status, .match-box--large .match-links { line-height: 1.4; font-size: .75em; } .match-box--large .match-summary { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .date-badge { display: none; } } /** * ^teams Slider */ .teams-slider { position: absolute; left: 0px; right: 0px; bottom: 0px; height: 200px; background: #fff; box-shadow: 0 -20px 20px -20px rgba(0, 0, 0, .5); border-bottom: solid 1px #e5e5e5; z-index:1; } .teams-slider__surface { position: absolute; left: 0px; right: 0px; height: 100%; overflow: hidden; white-space: nowrap; overflow-x: hidden; overflow-x: auto; -webkit-overflow-scrolling: touch; -ms-overflow-style: none; -ms-content-zooming: none; -ms-user-select: none; -ms-scroll-chaining: none; } /* team group */ .team-group { margin: 0 25px; padding-top: 25px; } .team-group__title { display: inline-block; position: relative; margin: 0 0 10px 0; padding: 0 0 5px 0; font-size: .75em; font-family: "myriad-pro-n6", "myriad-pro", sans-serif; font-weight: 600; line-height: 20px; text-transform: uppercase; letter-spacing: .2em; color: #333; } .team-group__title:after { content: " "; position: absolute; bottom: 0; left: 0; width: 40px; max-width: 100%; border-top: 1px solid rgba(0, 0, 0, .2); } .team-list { margin: 0; padding: 0; } /* * ^Match box */ .team-box { position: relative; margin: 0; padding: 0; max-width: 300px; padding-right: 1.5em; padding-left: 1.5em; font-size: .75em; } .lt-ie8 .team-box { min-width: 200px; } .team-box:first-child { padding-left: 0; } @media only screen and (max-width: 1300px) { .team-box { padding-right: 1em; padding-left: 1em; } } /** * ^domestic tables */ .domestictables--full { } .domestictables--links { display: none; } @media only screen and (max-width: 767px) { .domestictables--full { display: none; } .domestictables--links { display: block; } } /** * ^association details */ .association-deets { } .association-deets .vcard { margin-bottom: 2em; } .association-deets .vcard .adr { margin: .75em 0 1em; } .association-deets .vcard .adr .type { color: #999; font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-weight: 400; font-size: .875em; } .association-links { margin-bottom: 2em; } /** * ^Badge */ .badge { position: absolute; color: rgba(0, 0, 0, 0.5); font-size: .625em; font-family: "myriad-pro-n6", "myriad-pro", sans-serif; font-weight: 600; bottom: -2em; } .badge__img { vertical-align: baseline; } /** * ^social */ .social-widgets { position: relative; overflow: hidden; } .social-widgets__body { padding-left: 16.666%; padding-bottom: 16.666%; border-left: 1px solid #ddd; background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.0125) 0%, rgba(0, 0, 0, 0) 15%); } .skyscrapper__image { padding-left: 16.666%; padding-bottom: 16.666%; border-left: 1px solid #ddd; background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.0125) 0%, rgba(0, 0, 0, 0) 15%); } .skyscrapper__image { text-align: center; } .skyscrapper__image img { max-width: 100%; width: auto; } .social-widgets iframe { } .social-widgets .fb_iframe_widget { margin-left: -10px; } .social-widgets .twitter-timeline { margin-left: -7px; margin-top: -7px; } @media only screen and (max-width: 767px) { .social-widgets__body { padding-left: 0; padding-bottom: 0; border-left: none; background: none; } } /** * ^separator */ /*hr*/ .separator { border: none; height: 4em; } .separator--social { height: 0; border-bottom: solid 1px #ddd; margin: 2em 0; } /** * ^share */ .share { } .share__item { display: block; text-decoration: none; font-size: 14px; margin-bottom: .75em; } /* @@LT-L */ @media only screen and (max-width: 900px) { .share__item { display: inline-block; margin-bottom: 0; margin-right: .75em; } } /** * ^flyout */ .flyout { width: 250px; position: absolute; opacity: 0; pointer-events: none; top: -4000px; box-shadow: 0 0 20px rgba(0, 0, 0, .125); z-index: 0; background: #fff; -webkit-transition: opacity .125s, -webkit-transform .125s, top 0 .25s; -moz-transition: opacity .125s, -moz-transform .125s, top 0 .25s; transition: opacity .125s, transform .125s, top 0 .25s; -webkit-transform: scale3d(.9, .9, 1); -moz-transform: scale3d(.9, .9, 1); transform: scale3d(.9, .9, 1); } .flyout .flyout { z-index: -1; } .open > .flyout { box-sizing: content-box; opacity: 1; pointer-events: all; -webkit-transform: scale3d(1, 1, 1); -moz-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); -webkit-transition: opacity .125s, -webkit-transform .125s, top 0 0; -moz-transition: opacity .125s, -moz-transform .125s, top 0 0; transition: opacity .125s, transform .125s, top 0 0; } .lt-ie9 .flyout { top: auto; display: none; } .lt-ie9 .open > .flyout { display: block; } .flyout--bottom-left { margin-top: 1px; -webkit-transform-origin: left top; -moz-transform-origin: left top; transform-origin: left top; } .open > .flyout--bottom-left { left: 0; top: 100%; } .flyout--bottom-right { margin-top: 1px; -webkit-transform-origin: right top; -moz-transform-origin: right top; transform-origin: right top; } .open > .flyout--bottom-right { right: 0; top: 100%; } .flyout--top-right { left: 100%; -webkit-transform-origin: left top; -moz-transform-origin: left top; transform-origin: left top; } .open > .flyout--top-right { top: 0; } .flyout .button { border-top: 1px solid #f3f3f3; border-right: 1px solid #f3f3f3; width: 250px; } .flyout :first-child > .button { border-top: none; } .flyout .button:hover { border-color: #000; } .flyout .button i { position: relative; top: 1em; float: right; } /** * ^News Stream */ .news-stream { } .news-stream__item { padding-right: 5.555%; } .news-stream__item.yui3-u-1-4 { padding-right: 4.1666%; } .lt-ie8 .news-stream__item { padding-right: 0; width: 300px; margin-right: 20px; } .news-stream__item > a { display: block; } /* * ^Twitter-stream */ .twitter-media-gallery, .twitter-stream { min-height: 150px; } .twitter-media-gallery .loader, .twitter-stream .loader { position: absolute; top: .5em; font-size: .8em; } .twitter-media-gallery .loader img, .twitter-stream .loader img { height: 3px; } .twitter-stream__item { } .tweet { white-space: normal; margin-bottom: 3em; font-size: .875em; overflow: hidden; } .tweet a { color: #248dc1; } .tweet a:hover { text-decoration: underline; } .tweet__header { margin-bottom: .75em; } .tweet__avatar { float: left; margin-right: .75em; width: 3em; height: 3em; border-radius: 2px; } .tweet__full-name { position: relative; font-size: 1em; line-height: 1.2; font-family: "myriad-pro-n7", "myriad-pro", sans-serif; font-weight: 700; margin: 0; padding: 0; } .tweet__full-name a { color: #000; } .tweet__profile-name { color: #999; margin-bottom: 0; } .tweet__profile-name a { color: #999; } .tweet__text { margin-bottom: 0; } .tweet__dateline { font-size: .875em; margin: 0; margin-top: 1em; padding-top: 1em; border-top: 1px solid #eee; } .tweet__dateline a { color: #999; } .section__header .tweet__header { font-size: 1.625em; overflow: hidden; padding-bottom: .5em; } .section__header .tweet__full-name { display: block; font-size: .6875em; font-weight: 700; padding: 0; margin: 0; line-height: 1.2; } .section__header .tweet__profile-name { font-size: .5em; padding: 0; margin: 0; line-height: 1.2; } .section__header .tweet__avatar { float: left; margin-right: .3em; width: 1.5em; height: 1.5em; border-radius: 2px; } /* * ^ Twitter widget */ .twitter-tweet-rendered { margin-bottom: 5em !important; } /** * ^News Summary / Video Summary */ .news-summary, .video-summary { position: relative; padding-bottom: 3em; line-height: 1.3; font-size: 14px !important; white-space: normal; font-family: "myriad-pro-n6", "myriad-pro", sans-serif; } .news-summary a, .video-summary a { outline: none !important; text-decoration: none; display: block; color: #000 !important; } /* single video items added to content page articles */ .video-highlight--single .video-summary { width: 100%; } @media (min-width: 800px) { .video-highlight--single .video-summary { width: 90%; } } .news-summary.yui3-u-1-4, .video-summary.yui3-u-1-4 { padding-right: 4.16666%; } .summary__header { position: relative; min-height: 1px; margin: 0 0 1em 0; } .news-summary__section, .video-summary__section { position: absolute; bottom: 0px; left: 0px; z-index: 1; font-size: .875em; font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-weight: 400; margin: 0; padding: .5em 1em; color: #fff; background: rgba(0, 0, 0, .75); display: inline-block; } /* news-summary__section only applicable to news items */ .private .news-summary__section { background: #147dc1; } .disabled.private .news-summary__section { display: none; } .lt-ie9 .news-summary__section { display: none; } .no-rgba .news-summary__section { background: rgb(0, 0, 0); } .news-summary__img, .video-summary__img { width: 100%; height: 0; padding-top: 75%; background-size: cover; background-position: center; background-repeat: no-repeat; -ms-behavior: url(/v2/css/backgroundsize.htc); } .lt-ie9 .news-summary__img, .lt-ie9 .video-summary__img { background-position: left bottom; } /* user not logged in */ .disabled .news-summary__img, .disabled .video-summary__img { opacity: .4; } .private.disabled .news-summary__img:before, .private .video-summary__img:before { content: ''; display: block; position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: #000; opacity: .2; } .private.disabled .news-summary__img:before, .disabled .video-summary__img:before { background: #147dc1 !important; opacity: .6; } .news-summary__vertical-center, .video-summary__vertical-center { position: absolute; top: 1em; left: 1em; right: 1em; bottom: 1em; text-align: center; } .news-summary__vertical-center:before, .video-summary__vertical-center:before { content: '.'; width: 0px; line-height: 0; font-size: 0; height: 100%; display: inline-block; zoom: 1; vertical-align: middle; } .news-summary__vertical-center .vertical-center, .video-summary__vertical-center .vertical-center { display: inline-block; zoom: 1; vertical-align: middle; width: 95%; } /* news items only display icon/thumb if user is logged out */ .disabled .news-summary__thumb, .video-summary__thumb { margin: 0 auto; cursor: pointer; height: 45px; width: 45px; display: block; background: no-repeat left top transparent; padding: 0px; background-size: contain; } .lt-ie9 .news-summary__thumb, .lt-ie9 .video-summary__thumb { background: no-repeat left top transparent; height: 45px; width: 45px; } .video-summary__thumb { background-image: url("/img/membership/thumb-play.png"); } .lt-ie9 .video-summary__thumb { background-image: url("/img/membership/thumb-play-ltie9.png"); } @media (min-width: 500px) { /*.disabled .news-summary__thumb, .disabled .video-summary__thumb { height: 55px; width: 55px; }*/ .video-highlight--single .video-summary__thumb { height: 65px; width: 65px; } } .disabled .news-summary__thumb, .disabled .video-summary__thumb { background: url("/img/membership/thumb-profile.png") no-repeat left top transparent; background-size: contain; } .lt-ie9 .disabled .news-summary__thumb, .lt-ie9 .disabled .video-summary__thumb { background: url("/img/membership//thumb-profile-ltie9.png") no-repeat left top transparent; height: 45px; width: 45px; } .news-summary__message, .video-summary__message { display: none; } .disabled .news-summary__message, .disabled .video-summary__message { font-weight: bold; color: #fff; display: block; margin: .5em auto 0; font-size: 1.1em; line-height: 1.1em; font-family: "myriad-pro-n6", "myriad-pro", sans-serif; } .video-highlight--single .video-summary__message { font-size: 1.5em; } .news-summary__heading, .video-summary__heading { position: relative; font-size: 1.2857em; line-height: 1.2; font-family: "myriad-pro-n6", "myriad-pro", sans-serif; font-weight: 600; margin: 0; margin-bottom: .5em; } .yui3-u-2-3 .news-summary__heading, .yui3-u-2-3 .video-summary__heading { font-size: 1.75em; font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-weight: 400; } .news-summary__deck, .video-summary__deck { position: relative; margin-bottom: .75em; } .news-summary__dateline, .video-summary__dateline { margin: 0; color: #999; } .news-summary a, .video-summary a { display: block; position: relative; padding-bottom: 2em; border-bottom: 1px solid transparent; transition: border-color .25s; cursor: pointer; } .news-summary a:hover, .video-summary a:hover { border-bottom: 1px solid #666; } .news-stream-slider { position: relative; } .news-stream-slider__surface { position: relative; padding-top: 20px; padding-left: 20px; margin-left: -20px; margin-top: -20px; box-sizing: content-box; overflow: hidden; overflow-x: scroll; white-space: nowrap; -webkit-overflow-scrolling: touch; -ms-overflow-style: none; -ms-content-zooming: none; -ms-user-select: none; -ms-scroll-chaining: none; /* Adjust yui3-g metrics*/ letter-spacing: -0.18em; } .news-stream-slider__scrollcover { position: absolute; bottom: 0; left: -20px; right: 1px; height: 20px; background: #fff; z-index: 1; } /* @@LT-XL */ @media only screen and (max-width: 1100px) { .news-stream-slider__surface { margin-left: -3%; padding-left: 3%; } .news-stream-slider--full-width .news-stream-slider__surface { margin-right: -3%; padding-right: 3%; } .news-stream-slider__scrollcover { left: -3%; } .news-stream-slider--full-width .news-stream-slider__scrollcover { right: -3%; } } /* @@LT-M */ @media only screen and (max-width: 700px) { .news-stream-slider__nav, .news-stream-slider__scrollcover { display: none; } .news-stream-slider__surface { padding-left: 10px; margin-left: -10px; margin-right: -10px !important; } .news-summary, .video-summary, .twitter-stream__item { width: 45%; font-size: 1em; padding: 0 !important; margin-right: 20px; margin-bottom: 20px; } .tweet { font-size: 1em; } .news-summary__img { padding-top: 60%; } .news-summary__heading { font-size: 1.25em; } } /* @@LT-M */ @media only screen and (max-width: 400px) { .news-summary, .video-summary, .twitter-stream__item { width: 90%; } } .news-stream-slider__nav { position: absolute; top: 0; right: 4.166%; z-index: 2; } .lt-ie8 .news-stream-slider__nav { display: none; } .news-stream-slider__nav__item { top: 0; margin: 0; } .news-stream-slider__nav__item--prev { border-right: 1px solid #666; } .news-stream-slider__nav__item--next { right: 0px; } .news-stream-slider__nav .button { width: 60px; height: 1em; line-height: 1; font-size: 28px; background: none; color: #000; -webkit-transition: color .25s; -moz-transition: color .25s; -o-transition: color .25s; transition: color .25s; } .news-stream-slider__nav .button i { pointer-events: none; } .news-stream-slider__nav .button i { pointer-events: none; } .news-stream-slider__nav .button:hover { color: #999; background: none; } .news-stream-slider__nav .button:active { background: none; color: #248dc1; text-shadow: 0 0 30px #248dc1; } /* * ^ Twitter Media Gallery */ .twitter-media-gallery { margin-bottom: 5em; white-space: nowrap; } .twitter-media-gallery__item { margin-right: 1em; margin-bottom: 1em; } .twitter-media-gallery__img { height: 15em; } /** * ^News Article */ .news__main { padding-top: 12em; width: 46.7%; padding-left: 0; } .news__related-news { width: 60%; } .lt-ie8 .news__related-news { width: 80%; } .lt-ie8 .news__main { min-width: 600px; } @media only screen and (max-width: 1200px) { .news__main { width: 60%; } } /* @@LT-L */ @media only screen and (max-width: 900px) { .news__main { width: 80%; } .news__related-news { width: 80%; } } /* @@LT-M */ @media only screen and (max-width: 700px) { .news__main, .news__related-news { width: auto; padding-left: 10px; padding-right: 10px; } .news__main { padding-top: 2em; } } /** * ^Blogs */ .blogs { } .blog { position: relative; padding-right: 4.1666%; } .lt-ie8 .blog { padding-right: 0; } .lt-ie8 .blog .padder { padding-right: 15%; } .blog__header { position: absolute; top: 5px; left: -3px; z-index: 2; } .blog__header h2 { font-size: .875em; font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-weight: 400; margin: 0; padding: .5em 1em; color: #fff; background: rgba(0, 0, 0, .75); display: inline-block; } .no-rgba .blog__header h2 { background: rgb(0, 0, 0); } .blog__header a { color: #fff; } .blog__header a:hover { color: #fff; } .blog-list { margin: 0; padding: 0; } .blog-list__item { position: relative; list-style: none; margin: .65em 0; padding: .65em 0 0 0; } .blog-list__item:before { content: " "; position: absolute; top: 0; left: 0; width: 20%; border-top: 1px solid rgba(0, 0, 0, .1); } .blog-list__item:first-child { padding-top: 0; margin-top: 0; } .blog-list__item:first-child:before { display: none; } .blog-summary { line-height: 1.3; } .blog-summary__img { width: 100%; height: 1px; padding: 100% 0 0; background-color: #ccc; background-size: cover; background-repeat: no-repeat; background-position: center; margin-bottom: .5em; -ms-behavior: url(/v2/css/backgroundsize.htc); } .blog-summary__heading { font-size: 1em; font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-weight: 400; margin: 0; } .blog-summary:first-child .blog-summary__heading { font-family: "myriad-pro-n6", "myriad-pro", sans-serif; font-weight: 600; } .blog-summary:first-child > a { position: relative; display: block; outline: 20px solid rgba(255, 255, 255, 0); } .blog-summary:first-child > a:hover { background: #fff; outline: 20px solid rgba(255, 255, 255, 1); z-index: 1; } .lt-ie8 .blog-summary:first-child > a { border: 15px solid #f6f6f6; margin: -15px -15px -15px -15px; } .lt-ie8 .blog-summary:first-child > a:hover { background-color: #fff; border-color: #fff; } @media only screen and (max-width: 767px) { .blog-list { margin-bottom: 3em; } } /** * ^Players */ .player-list { padding-top: 1em; } .player-list__item { } @media only screen and (max-width: 767px) { .yui3-g-r .player-list__item { width: 33.33%; } } @media only screen and (max-width: 550px) { .yui3-g-r .player-list__item { width: 50%; } } @media only screen and (max-width: 310px) { .yui3-g-r .player-list__item { width: 100%; } } .player-summary { position: relative; padding-right: 4.166%; margin-bottom: 50px; line-height: 1.3; } .player-summary__img { width: 100%; height: 0; padding-top: 100%; background-color: #222; background-size: cover; background-position: center; background-repeat: no-repeat; margin: 0; border-radius: 2px; } .player-summary__name { position: relative; text-align: left; margin: .5em 0 0; padding-bottom: .75em; font-size: .875em; line-height: 1.2; font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-weight: 400; color: #fff; } /** * ^Player */ .player { } .player__header { } .player-profile-summary { position: relative; margin: 0; padding: 0 0 1em; line-height: 1.3; } .player-profile-summary li { list-style: none; margin-bottom: .5em; } .player-profile-summary em { display: block; font-style: normal; font-family: "myriad-pro-n6", "myriad-pro", sans-serif; font-weight: 600; } .player-profile-summary strong { display: block; font-style: normal; font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-weight: 400; color: #999; } .player-profile-summary__name { position: relative; padding-bottom: 1em; margin-bottom: 1em !important; font-family: "myriad-pro-n6", "myriad-pro", sans-serif; font-weight: 600; color: #000; } .player__img { display: inline-block; width: 60%; height: 0; padding-top: 60%; background-size: cover; background-position: center; background-repeat: no-repeat; margin: 0 0 .5em; border-radius: 2px; } .team-blackcaps .player__img { padding-top: 90%; } @media (min-width: 700px) { .player { padding-top: 10em; } .player__header { margin-left: 4.166%; } .player__sidebar { text-align: right; } .player__sidebar .tail:after { left: auto; right: 0; } .player-profile-summary { font-size: .875em; } .player-stats { width: 53.33%; } } @media (max-width: 700px) { .player .buffer { display: none; } .player__sidebar { min-height: 1px; width: 100%; } .player__sidebar:after { content: ' '; clear: both; visibility: hidden; display: block; height: 0; } .player__img { width: 40%; padding-top: 40%; float: left; margin-right: 1em; } .player-profile-summary { float: left; width: 55%; } } /** * ^Site map */ .site-map { padding-top: 5%; padding-bottom: 0; font-size: .875em; line-height: 1.5; } .site-map--site-nav { font-size: 1em; padding: 0; } .site-map a { color: #aaa; text-decoration: none; } .site-map__sections, .site-map__section, .site-map__pages, .site-map__page { list-style: none; margin: 0; padding: 0; } .site-map__section:after { left: auto; } /*hx*/ .site-map__section__title { position: relative; font-size: 1em; font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-weight: 400; margin: 0; color: #fff; margin-bottom: .5em; padding-bottom: .5em; } .site-map__section__title a { color: #fff; } .site-map__section a:hover { color: #fff; } .site-map__section__title a:hover { color: #aaa; } .site-map--site-nav .site-map__section { margin-bottom: 4em; } .site-map--site-nav .site-map__section__title { font-size: 1.125em; font-weight: 300; } /* @@LT-M */ @media only screen and (max-width: 700px) { .site-map { font-size: 1em; padding-top: 3em; padding-bottom: 4em; } .site-map__section { padding-bottom: 2em; padding-right: 10px; padding-left: 10px; width: 33% !important; } } /* @@LT-S */ @media only screen and (max-width: 400px) { .site-map__section { width: 50% !important; } } /** * ^site footer */ .site-footer { margin-top: -1px; } .site-footer__social { position: relative; padding-top: 1em; margin-bottom: 0; text-align: center; } .site-footer__social .link { margin: 0; font-size: 24px; } .site-footer__social .icon-stack { background-color: currentColor; } .twitter .icon-stack { background-color: #00aced; } .facebook .icon-stack { background-color: #3b5998; } .site-footer__social .icon-stack-top { color: #fff; font-size: 1.125em; } .site-footer__banner-ad { padding-bottom: 20px; } @media (min-width: 1000px) { .site-footer__banner-ad { left: 0; padding-bottom: 0; position: absolute; right: 0; top: 0; transform: translateY(-50%); z-index: 200; } } .site-footer__logo { position: relative; left: 1.25%; width: 50%; margin: 0 auto; max-width: 600px; background: none; background:; } .site-footer__legal { position: relative; color: #999; font-size: .875em; margin-top: 1em; padding-top: .5em; text-align: center; } .site-footer__legal a { color: #999; } .site-footer__legal a:hover { color: #fff; } /** * ^Commercial Partners */ .commercial-partners { text-align: center; margin-top: 0; margin-bottom: 0; } .commercial-partners h2 { position: relative; font-size: .75em; text-transform: uppercase; letter-spacing: .1em; font-weight: normal; margin-bottom: 4em; } .commercial-partners h2 span { position: relative; background: #111; z-index: 1; padding-left: 2em; padding-right: 2em; } .commercial-partners h2:after { content: " "; position: absolute; top: .5em; left: 0; right: 0; border-top: 1px solid #333; } .commercial-partners img { margin: 0 1em; } @media all and (max-width: 600px) { .commercial-partners img { margin: 0; } } @media all and (max-width: 1100px) { .commercial-partners img { margin: 0; max-width: 140px !important; } } .commercial-partners__primary { margin-top: 1em; margin-bottom: 5em; } .commercial-partners__ford { max-width: 174px; margin: 0 0.5em; } .commercial-partners__secondary { margin-top: 1em; margin-bottom: 3em; } @media all and (min-width: 1100px) { .commercial-partners__secondary a { width: 13.5%; display: inline-block; margin-bottom: 2em; } .commercial-partners__secondary a img { max-height: 4.75em; max-width: 100%; margin: 0; } } .commercial-partners__secondary_img--accor { width: 100%; max-width: 210px !important; } .commercial-partners__tertiary { max-width: 1000px; margin: 1em auto 0 auto; } /** * ^promoted-content */ .promoted-content { border: 1px solid #ccc; display: block; margin-bottom: 3em; position: relative; min-height: 21em; } .promoted-content__image { width: 50%; height: 100%; position: absolute; top: 0; bottom: 0; left: 0; background-color: #222; background-size: cover; background-position: top center; } .promoted-content__info { margin-left: 50%; width: 40%; padding: 1em 0 4em 1em; } .promoted-content h2 { font-size: 2em; } @media (max-width: 550px) { .promoted-content__image { width: 100%; position: relative; height: auto; padding-top: 100%; } .promoted-content__info { width: 100%; margin-left: 0; } } /** * ^table */ table { max-width: 100%; background-color: transparent; } th { text-align: left; } .table { width: 100%; margin: 1em 0 2em 0; font-size: 1em; } .table thead { font-size: 9px; color: #999; text-transform: uppercase; letter-spacing: .2em; white-space: nowrap; font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-weight: 400; } .table thead > tr > th, .table tbody > tr > th, .table tfoot > tr > th, .table thead > tr > td, .table tbody > tr > td, .table tfoot > tr > td { padding: 15px 5px; line-height: 1.428571429; vertical-align: top; border-top: 1px solid #dddddd; } .table thead > tr > th { vertical-align: bottom; border-bottom: 1px solid #bbb; padding-top: 5px; padding-bottom: 5px; } @media only screen and (max-width: 800px) { .table thead > tr > th { height: 10em; min-width: 1em; position: relative; } .points-table__label { bottom: 5px; display: block; left: 15px; max-width: 9em; position: absolute; transform: rotate(-90deg); transform-origin: 0 100%; } } .table caption + thead tr:first-child th, .table colgroup + thead tr:first-child th, .table thead:first-child tr:first-child th, .table caption + thead tr:first-child td, .table colgroup + thead tr:first-child td, .table thead:first-child tr:first-child td { border-top: 0; } .table tbody + tbody { border-top: 2px solid #dddddd; } .table .table { background-color: #ffffff; } .table-condensed thead > tr > th, .table-condensed tbody > tr > th, .table-condensed tfoot > tr > th, .table-condensed thead > tr > td, .table-condensed tbody > tr > td, .table-condensed tfoot > tr > td { padding: 5px; } .table-bordered { border: 1px solid #dddddd; } .table-bordered > thead > tr > th, .table-bordered > tbody > tr > th, .table-bordered > tfoot > tr > th, .table-bordered > thead > tr > td, .table-bordered > tbody > tr > td, .table-bordered > tfoot > tr > td { border: 1px solid #dddddd; } .table-bordered > thead > tr > th, .table-bordered > thead > tr > td { border-bottom-width: 2px; } .table-striped > tbody > tr:nth-child(odd) > td, .table-striped > tbody > tr:nth-child(odd) > th { background-color: #f9f9f9; } .table-hover > tbody > tr:hover > td, .table-hover > tbody > tr:hover > th { background-color: #f5f5f5; } table col[class*="col-"] { display: table-column; float: none; } table td[class*="col-"], table th[class*="col-"] { display: table-cell; float: none; } .table > thead > tr > td.active, .table > tbody > tr > td.active, .table > tfoot > tr > td.active, .table > thead > tr > th.active, .table > tbody > tr > th.active, .table > tfoot > tr > th.active, .table > thead > tr.active > td, .table > tbody > tr.active > td, .table > tfoot > tr.active > td, .table > thead > tr.active > th, .table > tbody > tr.active > th, .table > tfoot > tr.active > th { background-color: #f5f5f5; } .table > thead > tr > td.success, .table > tbody > tr > td.success, .table > tfoot > tr > td.success, .table > thead > tr > th.success, .table > tbody > tr > th.success, .table > tfoot > tr > th.success, .table > thead > tr.success > td, .table > tbody > tr.success > td, .table > tfoot > tr.success > td, .table > thead > tr.success > th, .table > tbody > tr.success > th, .table > tfoot > tr.success > th { background-color: #dff0d8; border-color: #d6e9c6; } .table-hover > tbody > tr > td.success:hover, .table-hover > tbody > tr > th.success:hover, .table-hover > tbody > tr.success:hover > td { background-color: #d0e9c6; border-color: #c9e2b3; } .table > thead > tr > td.danger, .table > tbody > tr > td.danger, .table > tfoot > tr > td.danger, .table > thead > tr > th.danger, .table > tbody > tr > th.danger, .table > tfoot > tr > th.danger, .table > thead > tr.danger > td, .table > tbody > tr.danger > td, .table > tfoot > tr.danger > td, .table > thead > tr.danger > th, .table > tbody > tr.danger > th, .table > tfoot > tr.danger > th { background-color: #f2dede; border-color: #eed3d7; } .table-hover > tbody > tr > td.danger:hover, .table-hover > tbody > tr > th.danger:hover, .table-hover > tbody > tr.danger:hover > td { background-color: #ebcccc; border-color: #e6c1c7; } .table > thead > tr > td.warning, .table > tbody > tr > td.warning, .table > tfoot > tr > td.warning, .table > thead > tr > th.warning, .table > tbody > tr > th.warning, .table > tfoot > tr > th.warning, .table > thead > tr.warning > td, .table > tbody > tr.warning > td, .table > tfoot > tr.warning > td, .table > thead > tr.warning > th, .table > tbody > tr.warning > th, .table > tfoot > tr.warning > th { background-color: #fcf8e3; border-color: #fbeed5; } .table-hover > tbody > tr > td.warning:hover, .table-hover > tbody > tr > th.warning:hover, .table-hover > tbody > tr.warning:hover > td { background-color: #faf2cc; border-color: #f8e5be; } /** * ^competition-centre */ .content .nvp-competition_centre { margin-left: 0 !important; margin-right: 0 !important; } .nvp-points-table__head-item { line-height: 1; } @media (max-width: 1000px) { .nvp-points-table__head-item { font-size: 10px; } } @media (max-width: 1200px) { .nvp-points-table__head-item { font-size: 12px; } } .nvp-select option { font-family: sans-serif; } .nvp-page-header__title { padding-bottom: 10px; } .nvp-page-header__tools { padding-bottom: 10px; } /** * ^points-table-filters */ .points-table-filters { position: relative; z-index: 2; } .points-table-filters__filter { display: block; margin-bottom: 1em; position: relative; } @media (min-width: 800px) { .points-table-filters__filter { float: right; margin-bottom: 0; } } .points-table-filters__filter > a { display: block; } @media (max-width: 700px) { .points-table-filters__filter > a { border: 1px solid #999 !important; padding: 0 1em !important; } } .points-table-filters__filter .icon-angle-down { float: right; line-height: 2.5; } /** * ^points-table-section */ .points-table-section { left: -999em; opacity: 0; position: absolute; transition: opacity .2s, left 0 .2s; } .points-table-section--selected { left: auto; opacity: 1; position: static; transition: opacity .2s .2s; } .points-table-section__heading { font-size: 2.5em; } @media (min-width: 800px) { .points-table-section__heading { padding-right: 6em; } } /** * ^points-table */ .points-table__header { margin-bottom: 2em; } .points-table__title { font-size: 1.625em; font-family: "myriad-pro-n3", "myriad-pro", sans-serif; font-weight: 300; } .points-table__footer { margin-top: 2em; font-size: .75em; text-align: right; color: #777; } .points-table__footer strong { font-family: "myriad-pro-n6", "myriad-pro", sans-serif; font-weight: 600; margin-right: 1em; } /* still to test in ie/mobile */ .points-table__table { border-bottom: 1px solid #ddd; /*display:block; width:100%; overflow-x:auto;*/ } @media (min-width: 1100px) { .article__body .content.points-table { margin-right: -20%; } } .article__body .content.points-table { font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-size: .8em; } .article__body .content.points-table p { max-width: 100%; margin: 1em 0; } /*.article__body .content.most-tables td.name { font-weight: bold; }*/ .article__body .most-tables h2 { font-size: 1.125em; } .upWeGo, .ahhNotDown, .heresGood { padding: 0 .2em; } .upWeGo { color: #53b60b; } .ahhNotDown { color: #f10722; } .heresGood { font-weight: bold; color: #ccc; } /** * ^archive iframe */ iframe[data-spy='iframe'] { min-height: 600px; } /* ========================================================================== $Widgets ========================================================================== */ /** * ^pagination */ .pagination { font-size: .875em; } .pagination__steplink { white-space: nowrap; } .pagination__header { position: relative; padding-top: 1em; margin-bottom: 1em; } .pagination__nav { position: relative; padding-top: 1em; } .pagination .pageSeparator { padding: 0 .5em; } .pagination .pages { XXpadding: 0 1.5em; } .pagination .pages a { background: none; border: 1px solid #ddd; padding: 0 .4em; margin: 0 2px; } .pagination .pages a strong { font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-weight: 400; } .pagination .pages a.selected { border-color: #000; background: #000; color: #fff; } @media only screen and (max-width: 500px) { .pagination .pages { display: block; padding: .5em 0; } } /** * ^steps */ .steps { font-size: .875em; } .steps__steplink { white-space: nowrap; } .steps__header { position: relative; padding-top: 1em; margin-bottom: 1em; } .steps__nav { position: relative; padding-top: 1em; } .steps .pageSeparator { padding: 0 .5em; } .steps .pages { XXpadding: 0 1.5em; } .steps .pages a { background: none; border: 1px solid #ddd; padding: 0 .4em; margin: 0 2px; } .steps .pages a strong { font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-weight: 400; } .steps .pages a.selected { border-color: #000; background: #000; color: #fff; } @media only screen and (max-width: 500px) { .steps .pages { display: block; padding: .5em 0; } } /** * ^text-spinner */ .text-spinner { position: relative; height: 0; padding-bottom: 1.4em; overflow: hidden; } .text-spinner__lines { -webkit-animation: textspin 12s infinite; -webkit-animation-delay: -6s; animation: textspin 12s infinite; animation-delay: -6s; position: relative; } .text-spinner__line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .text-spinner__line:first-child, .text-spinner__line--first { -webkit-animation-delay: 0; animation-delay: 0; top: 0; margin-top: 0; } .text-spinner--static { padding-bottom: 0; height: auto; } .text-spinner--static .text-spinner__lines { -webkit-animation: none; -moz-animation: none; animation: none; } .text-spinner--static .text-spinner__line { top: 0; position: relative } .no-cssanimations .text-spinner { height: auto; padding-bottom: 0; } .no-cssanimations .text-spinner__line { top: 0; } @-webkit-keyframes textspin { 0% { -webkit-transform: translate(0, 15px); opacity: 0; } 2% { opacity: 1; -webkit-transform: translate(0, 0); } 50% { opacity: 1; -webkit-transform: translate(0, 0); } 55% { opacity: 1; -webkit-transform: translate(0, -15px); } 98% { opacity: 1; -webkit-transform: translate(0, -15px); } 100% { opacity: 0; -webkit-transform: translate(0, -15px); } } @keyframes textspin { 0% { transform: translate(0, 15px); opacity: 0; } 5% { opacity: 1; transform: translate(0, 0); } 50% { opacity: 1; transform: translate(0, 0); } 55% { opacity: 1; transform: translate(0, -15px); } 98% { opacity: 1; transform: translate(0, -15px); } 100% { opacity: 0; transform: translate(0, -15px); } } /** * ^tabs */ .tabs { position: relative; padding: 0; font-size: 1.25em; font-family: "myriad-pro-n3", "myriad-pro", sans-serif; font-weight: 300; } .tabs--large { font-size: 1em; font-weight: 400; } .tabs--large i { margin-left: .5em; position: relative; top: .1em; } .tab__item { position: relative; height: 2.5em; margin: 0; margin-right: 1.5em; padding: 0; list-style: none; } .filter a:active, .filter a:focus { outline: none; } .tabs--few .tab__item { max-width: 100%; } .filter.active:after, .filter.active:before { position: absolute; content: " "; height: 0; width: 0; bottom: -28px; left: 50%; margin-left: -14px; border: 14px solid #fff; border-color: #fff transparent transparent transparent; z-index: 2; } .filter.active:before { z-index: 1; border-color: rgba(0, 0, 0, .1) transparent transparent transparent; bottom: -29px; } .filter > a { display: inline-block; color: #333; cursor: pointer; line-height: 2.5; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .filter.active a { color: #000; font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-weight: 400; } .tab-content { } .tab-pane { display: none; } .tab-pane.active { display: block; } /* @@LT-M */ @media only screen and (max-width: 700px) { .tab__item { margin-right: 0%; max-width: 100%; width: 100%; } .tabs--few .tab__item { max-width: 100%; width: auto; margin-right: 5%; } } .tab__item.open { z-index: 1; } .toggle { list-style: none; margin: 0; padding: 0; } .toggle__item { display: block; float: left; margin: 0; padding: 0; } .toggle:after { clear: both; content: ''; display: block; } .toggle__link { border: solid #bbb; border-width: 1px 0 1px 1px; color: #333; display: block; line-height: 2.5; padding: 0 1.25em; } .toggle__link:hover { border-color: #999; opacity: 1; text-decoration: underline; } .toggle__item:first-child .toggle__link { border-radius: 10em 0 0 10em; padding: 0 1.25em 0 1.5em; } .toggle__item:last-child .toggle__link { border-right-width: 1px; border-radius: 0 10em 10em 0; padding: 0 1.5em 0 1.25em; } .toggle__item--selected .toggle__link { background: #333; border-color: #333; color: #fff; font-weight: 600; text-decoration: none !important; } .toggle__item--selected + .toggle__item .toggle__link { border-left-width: 0; } .filter .flyout { font-size: 14px; border: 1px solid #111; width: 300px; padding-bottom: 1px; } .filter .flyout:before { position: absolute; content: " "; top: -20px; left: 20px; border: 10px solid black; border-color: transparent transparent #111 transparent; } .filter .flyout--bottom-right:before { left: auto; right: 20px; } .filter .flyout .button { width: 300px; border: none; cursor: pointer; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .filter.open > .flyout--bottom-left, .filter.open > .flyout--bottom-right { top: 130%; } .lt-ie8 .filter > a { width: auto; } /** * ^Fixtures */ .fixtures__main { padding-top: 2em; } .fixtures__filters { z-index: 20; padding-top: 1.5em; padding-bottom: 1.5em; } .filter > a { border: 1px solid #999; padding: 0 1em; } /* @@LT-L */ @media only screen and (max-width: 1100px) { .fixtures__filters { padding-left: 10px; } } /* @@LT-M */ @media only screen and (max-width: 700px) { .fixtures__main { padding-top: 0; } .fixtures__main > iframe { margin-top: 2em !important; } .fixtures__filters { font-size: 1.25em; border: none; padding-left: 0; } .fixtures__filters .tab__item { border-bottom: 1px solid #eee; padding-left: 10px; } .fixtures__filters .tab__item:last-child { border: none; } .filter > a { border: none; padding: 0; } .filter.open > .flyout--bottom-left { top: 110%; } } /** * ^contactdetails */ .contactdetails { padding-top: 1em; padding-bottom: 5%; } .contactdetails__detail { padding-right: 4em; font-size: .875em; padding-bottom: 2em; } .contactdetails__detail .adr { margin: 10px 0; } .contactdetails__detail .adr .type { color: #999; } /* ========================================================================== Helper classes ========================================================================== */ /* * Image replacement */ .hideat767 { } @media only screen and (max-width: 767px) { .hideat767 { display: none; } } .ir { background-color: transparent; border: 0; overflow: hidden; /* IE 6/7 fallback */ *text-indent: -9999px; } .ir:before { content: ""; display: block; width: 0; height: 150%; } /* * 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; } /* * Clearfix: contain floats * * For modern browsers * 1. The space content is one way to avoid an Opera bug when the * `contenteditable` attribute is included anywhere else in the document. * Otherwise it causes space to appear at the top and bottom of elements * that receive the `clearfix` class. * 2. The use of `table` rather than `block` is only necessary if using * `:before` to contain the top-margins of child elements. */ .clearfix:before, .clearfix:after { content: " "; /* 1 */ display: table; /* 2 */ } .clearfix:after { clear: both; } /* * For IE 6/7 only * Include this rule to trigger hasLayout and contain floats. */ .clearfix { *zoom: 1; } /* ========================================================================== EXAMPLE Media Queries for Responsive Design. These examples override the primary ('mobile first') styles. Modify as content requires. ========================================================================== */ @media print, (-o-min-device-pixel-ratio: 5/4), (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi) { /* Style adjustments for high resolution devices */ } /* ========================================================================== Print styles. Inlined to avoid required HTTP connection: h5bp.com/r ========================================================================== */ @media print { * { background: transparent !important; color: #000 !important; /* Black prints faster: h5bp.com/s */ box-shadow: none !important; text-shadow: none !important; } a, a:visited { text-decoration: underline; } a[href]:after { content: " (" attr(href) ")"; } abbr[title]:after { content: " (" attr(title) ")"; } /* * Don't show links for images, or javascript/internal links */ .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } 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; } } .pad { } .pad--top { padding-top: 1em; } .pad--top--2 { padding-top: 2em; } .pad--bottom { padding-bottom: 1em; } .pad--bottom--2 { padding-bottom: 2em; } .pad--left { padding-left: 1em; } .pad--left--2 { padding-left: 2em; } .pad--right { padding-right: 1em; } .pad--right--2 { padding-right: 2em; } /* Mobile Menu */ .masthead__mobile-menu-button, .nav__item--back, .nav__item--home { display: none; } .mobile .masthead__nav { display: none; } /* @@LT-M */ @media only screen and (max-width: 700px) { /*.page { padding-top: 120px; }*/ .masthead { position: relative; height: auto; top: 0; left: 0; background: black; max-width: none; padding: 0; z-index: auto; } .masthead__logo { top: 0; left: 0; right: 0; width: 100%; /*height: 100px;*/ height: 85px; z-index: 1; text-align: center; padding: 0; } .masthead__logo a { height: 85px; } /* desktop */ .desktop .masthead__nav { display: none; } .mobile .masthead__nav { display: none; position: fixed; top: 0; left: 0; width: 80%; height: 100%; float: none; font-size: 1.25em; overflow: hidden; z-index: 0; background: #fff; overflow: hidden; overflow-y: scroll; -webkit-overflow-scrolling: touch; -ms-overflow-style: none; -ms-content-zooming: none; -ms-user-select: none; -ms-scroll-chaining: none; } .lt-ie10 .mobile .masthead__nav { display: none; } .mobile .masthead__nav .nav__item { width: 100%; height: auto; float: none; display: block; border: none; border-bottom: 1px solid #eee; z-index: auto; position: static; } /* Remove drop shadow from nav items */ .mobile .masthead__nav .nav__item:after { display: none; } /* Adjust default button styles */ .mobile .masthead__nav .nav__item .button { display: block; width: auto; border: none; background: none; z-index: auto; padding-right: 15px; padding-left: 15px; } .mobile .masthead__nav .nav__item .button--dark { color: #000; } .mobile .masthead__nav .nav__item .button:hover { background: none; color: #000; } .mobile .masthead__nav .button i { position: relative; float: right; top: 1em; } .mobile .masthead__nav .button--medium { font-size: 1em; height: 3.125em; line-height: 3.125; } .mobile .masthead__nav .nav__item .button--strong { } .mobile .masthead__nav .nav__item--back, .mobile .masthead__nav .nav__item--home { display: block; } .mobile .masthead__nav .nav__item--back .button { width: 100%; text-align: left; } .mobile .masthead__nav .nav__item--back .button i { float: none; top: auto; font-size: 1.5em; top: .125em; color: #000; } /* Position flyouts */ .mobile .masthead__nav .flyout { position: absolute; left: 0; top: 0 !important; bottom: 0; right: auto; width: 100%; padding: 0 0 50px; display: block; opacity: 1; box-shadow: none; margin: 0; border-left: 1px solid #ddd; background: #fff; z-index: 1; overflow: hidden; overflow-y: scroll; -webkit-overflow-scrolling: touch; -ms-overflow-style: none; -ms-content-zooming: none; -ms-user-select: none; -ms-scroll-chaining: none; -webkit-transition: all .25s; -moz-transition: all .25s; transition: all .25s; -webkit-transform: translate(100%, 0); -moz-transform: translate(100%, 0); transform: translate(100%, 0); } .no-csstransforms .mobile .masthead__nav .flyout { left: 100%; } .mobile .masthead__nav .flyout .flyout { z-index: 2; } .mobile .masthead__nav .flyout .nav__item { background: none; } .mobile .masthead__nav .open > .flyout { opacity: 1; -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); transform: translate(0, 0); box-shadow: 0 0 10px rgba(0, 0, 0, .1); } .no-csstransforms .mobile .masthead__nav .open > .flyout { left: 0; } /* Show/hide menu */ .page { -webkit-transition: -webkit-transform .25s, transform .25s; -moz-transition: -moz-transform .25s; /*transition: transform .25s;*/ z-index: 99; position: relative; left: 0; width: 100%; } .show-menu .page { -webkit-transform: translate(80%, 0); -moz-transform: translate(80%, 0); transform: translate(80%, 0); box-shadow: 0 0 10px rgba(0, 0, 0, .3); } .no-csstransforms .show-menu .page { left: 80%; } .mobile .masthead__section-nav > .button { -webkit-transition: all .25s; -moz-transition: all .25s; transition: all .25s; -webkit-transform: translate(-10%, 0); -moz-transform: translate(-10%, 0); transform: translate(-10%, 0); } .show-menu .mobile .masthead__nav { display: block; } .show-menu .mobile .masthead__section-nav > .button { -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); transform: translate(0, 0); } .masthead__mobile-toolbar { position: absolute; z-index: 1; top: 0; left: 0; right: 0; } .masthead__mobile-menu-button { display: block; position: absolute; top: 0; left: 0; z-index: 1; text-align: left; /*height: 120px; line-height: 120px;*/ height: 85px; line-height: 85px; padding-left: 20px; font-size: 20px; } .masthead__mobile-menu-button i { -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg); filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); display: inline-block; position: relative; } .masthead__mobile-menu-button:hover { background: #000; color: #fff; } .masthead__backdrop { position: absolute; } .masthead__backdrop.open { opacity: .1; } } .nav__item--buy-tickets { border-left: dashed 2px #e74655; */ margin-left: 1px; } .nav__item--buy-tickets a { background: #e74655 !important; } .nav__item--priority-ticketing { border-left: dashed 2px #0095d6; */ margin-left: 1px; } .nav__item--priority-ticketing a { background: #0095d6 !important; } .nav__item--play--cricket { background: #64dd17; } .nav__item--play--cricket a { padding: 0 0.75em; } .nav__item--buy-tickets a, .nav__item--priority-ticketing a { color: #fff !important; text-align: center; line-height: 1.1em; font-weight: normal; text-transform: uppercase; font-size: .7em; /*padding-top: 1em;*/ box-sizing: border-box !important; letter-spacing: .1em; height: 4.55em; } .nav__item--buy-tickets a:hover, .nav__item--priority-ticketing a:hover { opacity: .8; } .nav__item--buy-tickets a strong, .nav__item--priority-ticketing a strong { font-weight: bold; font-size: 1.4em; line-height: 1.1em; } /* ========================================================================== Banners ========================================================================== */ .group--banner { } .group--banner > .group__body { text-align: center; padding-top: 4em; padding-bottom: 4em; } .lt-ie8 .group--banner { text-align: center; } .banner { position: relative; } .banner img { width: 100%; } .banner a img { width: 100%; } .banner--single { padding-right: 4.1666%; } .lt-ie8 .banner--single { width: 30%; padding: 0; margin-right: 1%; margin-left: 1%; } /**banner slideshows */ .cycle-slideshow--banner { position: relative; min-height: 1px; margin: 0; padding: 0; list-style: none; background: none; } .cycle-slideshow--banner > li { position: relative; min-height: 1px; margin: 0; padding: 0; list-style: none; background: none; right: 0; } .cycle-slideshow--banner > li a { position: relative; display: block; } .pt_desktop { display: inline-block; } .pt_mobile { display: none; } /* @@LT-M */ @media only screen and (max-width: 700px) { .banner { width: auto; display: block; padding-right: 0; margin: 2em auto; } .group--banner .group__body { padding-top: 0; padding-bottom: 0; } .banner--single { max-width: 300px; } .banner--news-stream { background: #eee; } .banner--news-stream img { max-width: 300px; margin-left: auto; margin-right: auto; display: block; } .cycle-slideshow--banner { max-width: 300px; margin-left: auto; margin-right: auto; display: block; } } /* @@LT-M */ @media only screen and (max-width: 700px) { .banner--news-stream { display: inline-block; width: 45%; padding-right: 0; margin-top: 2em; margin-bottom: 2em; } } @media only screen and (max-width: 400px) { .banner--news-stream { width: 90%; } } /* ========================================================================== Article Body widgets ========================================================================== */ .commercial-partner { border-bottom: 1px solid #eee; padding-top: 2em; padding-bottom: 2em; font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-size: .8em; } .commercial-partner:first-child { padding-top: 0; } .commercial-partner img { float: left; margin: 0; padding: 0; border: none; } .commercial-partner h2 { margin-bottom: .25em; } .commercial-partner p { margin-bottom: .75em; } .commercial-partner__links { margin: 1em 0; padding: 0; } .commercial-partner__links li { margin: 0; padding: 0; list-style: none; } .commercial-partner__body { margin-left: 190px; padding-left: 1.5em; border-left: 1px solid #eee; } /* @@M*/ @media only screen and (max-width: 700px) { .pt_desktop { display: none; } .pt_mobile { max-width: 370px; } .commercial-partner { text-align: center; } .commercial-partner img { float: none; margin: 1em auto 2em; padding: 0; border: none; } .commercial-partner__body { text-align: left; margin-left: 0; padding-left: 0; border-left: none; } } /* * ^.media */ .media { } .media, .bd { overflow: hidden; _overflow: visible; zoom: 1; } .media .img { float: left; margin: 0 1em 0 0; } .media .img img { display: block; } /* @@L*/ @media only screen and (max-width: 900px) { .media .img { float: none; margin: 0 0 .5em 0; } } /* ========================================================================== Article images ========================================================================== */ .article__images { position: relative; } .article__images__nav { position: absolute; top: 1px; right: 1px; z-index: 200; background: #fff; } @media (min-width: 900px) { .article__images__nav { bottom: 1px; top: auto; } } .lt-ie8 .article__images__nav { display: none; } .article__images__nav__item { top: 0; margin: 0; } .article__images__nav__item--prev { border-right: 1px solid #666; } .article__images__nav__item--next { right: 0px; } .article__images__nav .button { width: 40px; height: 1.3em; line-height: .9; font-size: 28px; background: none; color: #000; -webkit-transition: color .25s; -moz-transition: color .25s; -o-transition: color .25s; transition: color .25s; } .article__images__nav .button:hover { color: #999; background: none; } .article__images__nav .button:active { background: none; color: #248dc1; text-shadow: 0 0 30px #248dc1; } /* ========================================================================== Live match ========================================================================== */ .series--signature { margin-bottom: 15px; display: block; } @media (min-width: 700px) { .series--signature { float: right; margin-left: 30px; } } .summary--live { padding-bottom: .3em; margin-bottom: 2.5em; } .twitter--live { } @media (min-width: 400px) { .summary--live .team, .summary--live #stats { width: 33%; } } @media (min-width: 700px) { .twitter--live { border-left: 1px solid rgba(0, 0, 0, .5); padding-left: 10px; padding-right: 10px; } .summary--live .button { font-size: .8em; } } /* ========================================================================== Forms ========================================================================== */ /* //// Fieldset //// */ @media (max-width: 700px) { fieldset { width: 100% !important; } } /* //// Label //// */ form h4 { max-width: 80%; margin-bottom: .4em; margin-top: 1em; } form p a { text-decoration: none !important; font-weight: bold; } label { display: block; text-align: left; margin-bottom: .1em; cursor: pointer; font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-weight: 400; line-height: 1.1em; } label em { font-family: "myriad-pro-n4", "myriad-pro", sans-serif !important; font-style: normal !important; font-size: .8em !important; color: #aaa; font-weight: normal; display: inline-block; } /* //// Input / Select / Textarea //// */ .field-group { XXmargin-bottom: 1.2em; } .field { position: relative; display: block; XXmargin-right: 5%; margin-bottom: 1em; } .field-group .field { display: inline-block; vertical-align: top; box-sizing: border-box; padding-right: 10px; margin-bottom: 1.2em; } .field-subheading { font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-size: .9em; margin-top: -1em; } h2 + .field-subheading { margin-top: -1em; } h3 + .field-subheading { margin-top: -.5em; } .field-group-50 .field { width: 100%; } @media (min-width: 800px) { .field-group-50 .field { width: 49%; } } .field--inline label { display: inline-block; *display: inline; zoom: 1; width: 60px; } input:focus { outline: none; } .field input[type='text'], .field input[type='password'], .field input[type='email'], .field select, .field textarea { padding: 10px 5px; border: solid 1px #ddd; background: none; color: #222; font-family: "myriad-pro-n4", "myriad-pro", sans-serif; width: 95%; box-sizing: border-box; XXfont-size: .8em; position: relative; } .webkit-appearance .field input[type='text'], .webkit-appearance .field input[type='email'], .webkit-appearance .field input[type='password'], .webkit-appearance .field select, .webkit-appearance .field textarea { -webkit-appearance: none; border-radius: 0; } .webkit-appearance .field select { background: url(/img/furniture/forms/little-down-arrow.svg) no-repeat; background-position: 97% 50%; background-size: 15px 10px; padding-right: 1.8em; zoom: 1; } .field select { width: auto; padding: 9px 10px 9px 5px; } @media (max-width: 450px) { .field-group .field, .field select { width: 100%; } } .field input.medium, .field.medium input { width: 300px; max-width: 95%; } .field input.short, .field.short input { width: 80px; max-width: 95%; } .field.medium-height textarea { height: 150px; } .field input[readonly="true"] { border-style: dashed; } .inline-group input[type='text'], .inline-group input[type='email'] { margin-bottom: .4em; } @media (min-width: 700px) { .inline-group input[type='text'], .inline-group input[type='email'] { width: 60%; } .inline-group button, .inline-group input[type='submit'] { vertical-align: top; margin-left: .8em; height: 2.9em; line-height: 2.9em; } } /* //// autocomplete /jquery-ui plugin //// */ .field .ui-autocomplete-input { border: 5px solid #ddd !important; margin-bottom: .5em; width: 97.5% !important; } .ui-autocomplete { background: #fff; border: 1px solid #ddd; list-style: none; margin: 0; padding: 1em; position: absolute !important; } .ui-autocomplete li { padding: .3em; margin: 0; } .ui-autocomplete li:hover { background: #f4f4f4; } /* //// Radio / Checkbox //// */ .radio-group, .checkbox-group { margin-bottom: 1.2em; } .checkbox-select-all { margin-bottom: .5em; } .radio-group--inline .radio, .checkbox-group--inline .checkbox, .radio-group--set-width .div, .checkbox-group--set-width .div { box-sizing: border-box; display: inline-block; zoom: 1; *display: inline; padding-right: 2em; vertical-align: top; } .radio-group--set-width .radio, .checkbox-group--set-width .checkbox, .radio-group--set-width .div, .checkbox-group--set-width .div { width: 24%; } .radio, .checkbox, .radio-group div, .checkbox-group div { position: relative; padding-bottom: .2em; } @media (max-width: 450px) { .radio, .checkbox, .radio-group div, .checkbox-group div { margin-bottom: .5em; } } .radio input, .checkbox input { position: absolute; top: .2em; left: 0; } .radio label, .checkbox label { padding-left: 20px; font-size: .9em; max-width: 700px; } .radio label em, .checkbox label em { font-size: 1em; } /* //// field validation message //// */ .field-validation { position: relative; overflow: hidden; min-height: 1.4em; } .pointerevents .field-validation:after { content: ' '; position: absolute; top: 0; left: 0; right: 0; bottom: 0; pointer-events: none; /* http://www.colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&0+90,1+100;Custom */ filter: none; background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjkwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 90%, rgba(255, 255, 255, 1) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(90%, rgba(255, 255, 255, 0)), color-stop(100%, rgba(255, 255, 255, 1))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 90%, rgba(255, 255, 255, 1) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 90%, rgba(255, 255, 255, 1) 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 90%, rgba(255, 255, 255, 1) 100%); /* IE10+ */ background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 90%, rgba(255, 255, 255, 1) 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ffffff', endColorstr='#ffffff', GradientType=1); /* IE6-8 */ } .field-validation label, .field-validation .field-validation-error, .field-validation span.error { display: inline-block; *display: inline; zoom: 1; vertical-align: top; } /* #error */ .field-validation-error, .field-validation span.error, .field-validation-message { font-size: .7em; display: inline-block; font-family: "myriad-pro-n7", "myriad-pro", sans-serif; font-weight: 700; padding-left: 1.6em; margin-bottom: .1em; position: absolute; white-space: nowrap; top: .25em; margin-left: .4em; line-height: 1em; } .field-validation-error:before, .field-validation span.error:before { content: ' '; position: absolute; left: 0; top: -.1em; height: 1.3em; width: 1.3em; background-image: url(/img/furniture/forms/error.svg); background-size: contain; background-repeat: no-repeat; background-position: top left; } .field-validation-message div { /*display: inline-block;*/ margin-left: 0.4em; } .field-validation-message div:before { content: ' '; position: absolute; left: 0.4em; top: 0em; height: 1.3em; width: 1.3em; background-image: url(/img/furniture/forms/info.svg); background-size: contain; background-repeat: no-repeat; background-position: top left; } .field-validation-message:after { background: none !important; } .checkbox .field-validation .field-validation-error, .checkbox .field-validation span.error { margin-left: 1.4em; } /* #valid */ /*.field-validation-valid { content:' '; position:absolute; left:0; top:-.1em; height:1.3em; width:1.3em; background-image:url(/img/furniture/forms/valid.svg); background-size:contain; background-repeat:no-repeat; background-position:top left; }*/ .field input.valid { border-color: #28a57e; } .field input.error, .field input.input-validation-error { border-color: #F9482B; } .school__registration .field-validation:after { display: none; } /* **custom** for media accreditation form */ .checkbox-validate-group .field-validation { overflow: visible; min-height: inherit; } .checkbox-validate-group .field-validation-error, .checkbox-validate-group .field-validation span.error, .field-validation-message { margin-left: 0; /*margin-bottom:2em;*/ position: relative; } .upload-result { display: inline-block; *display: inline; zoom: 1; vertical-align: middle; min-width: 200px; } /*.upload-result .file-selector[type='text'] { border:none !important; position:absolute; top:0; left:0; opacity:0; width:1px; padding:0; }*/ .upload-result .field-validation-message .error { position: relative; margin-top: .5em; } .upload-result .field-validation-message .error:after { content: ' '; position: absolute; left: -1.5em; top: -.1em; height: 1.3em; width: 1.3em; background-image: url(/img/furniture/forms/error.svg); background-size: contain; background-repeat: no-repeat; background-position: top left; } .field-validation-message { vertical-align: top; top: 0; } /* //// file blob upload //// */ .file-uploader-container { position: relative; margin: 15px 0; display: inline-block; *display: inline; zoom: 1; } .file-uploader { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; } .file-uploader .start-upload { display: none; } .file-uploader .file-selector, .file-uploader input[type="file"] { position: absolute; right: 0; top: 0; font-family: 'Arial'; font-size: 118px; margin: 0; padding: 0; cursor: pointer; opacity: 0; filter: alpha(opacity=0); } .upload-result { position: relative; } /* //// content transition for group of fields//// */ .content-tranz { opacity: 0; filter: alpha(opacity=0); -webkit-transition: opacity .3s ease; -moz-transition: opacity .3s ease; -o-transition: opacity .3s ease; transition: opacity .3s ease; } .content-tranz.open { opacity: 1; filter: alpha(opacity=1); } /* //// page message //// */ .page-message { margin-bottom: 2em; position: relative; padding-left: 2em; width: 95%; font-family: "myriad-pro-n4", "myriad-pro", sans-serif; } .page-message.type-info { border: 1px solid #1481c5; background-color: #eef4f8; } .page-message.type-error { border: 1px solid #f9482b; background-color: #f9f1ef; } .page-message.type-correct { border: 1px solid #28a57e; background-color: #f3fbf9; } .page-message img { width: 1.4em; position: absolute; top: 1em; left: 1em; margin: 0; } .page-message h1, .page-message p { margin: 1em; } .page-message a { text-decoration: underline; font-weight: 700; } /*.progress-bar { background:red; height:10px; } .progress-bar .progress-value { background:blue; width:0; height:100%; }*/ /* // otherblogitems */ .otherblogitems { margin: 0; padding: 0; list-style: none; } .otherblogitems li { background: none; border-bottom: solid 1px #ddd; margin: 0 0 1em; padding: 0 0 1em; line-height: 1em; } .otherblogitems li:last-child { border: none; } .otherblogitems li a { display: block; } .otherblogitems .title { font-family: "myriad-pro-n6", "myriad-pro", sans-serif; font-weight: 600; font-style: normal; display: block; color: #000; line-height: 1em; margin: 0 0 0px; } .otherblogitems .date { font-size: 12px; color: #888; } /* ========================================================================== iccwidget ========================================================================== */ .group--icc { background: #010101 url(/img/furniture/icc.jpg) no-repeat center center; background-size: cover; } .iccwidget { display: block; margin: 0 auto; width: 300px; -webkit-box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.5); box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.5); } /* ========================================================================== myblackcapswidget ========================================================================== */ .group--myblackcaps-ad { background: #010101 url(/img/membership/promo-full-width-bg-s.jpg?format=jpg&upscale=false&quality=65&width=500) no-repeat center center; background-size: cover; } .membership-page .group--myblackcaps-ad, .membership-registration-page .group--myblackcaps-ad { display: none; } .group--myblackcaps-ad > .group__body { padding-top: 4em; padding-bottom: 4em; } .myblackcaps-block { display: block; max-width: 350px; margin: 0 auto; } .myblackcaps-block .logo { max-width: 80%; margin: 0 auto; } .myblackcaps-block .button { text-transform: uppercase; font-weight: 700; margin-top: 1em; font-size: 1.5em; } @media (min-width: 900px) { .group--myblackcaps-ad { background-image: url(/img/membership/promo-full-width-bg-m.jpg?format=jpg&upscale=false&quality=65&width=1000); } .myblackcaps-block { margin: 0; } .myblackcaps-block .logo { max-width: 100%; } } @media (min-width: 1200px) { .group--myblackcaps-ad { background-image: url(/img/membership/promo-full-width-bg-l.jpg?format=jpg&upscale=false&quality=65&width=2000); } } /* ========================================================================== live streaming ========================================================================== */ .livestreaming { max-width: 400px; } @media (min-width: 700px) { .livestreaming { padding-top: 12em; } } .livestreaming__header { margin-bottom: 1em; } /* ========================================================================== Results / Forms ========================================================================== */ /*grassroots smart registration*/ #registrationform fieldset .field input[type='text'], #registrationform fieldset .field input[type='email'], #registrationform fieldset .field textarea, #registrationform fieldset .field select, #groupregistrationform fieldset .field input[type='text'], #groupregistrationform fieldset .field input[type='email'], #groupregistrationform fieldset .field textarea, #groupregistrationform fieldset .field select { width: 90%; } #ResourceBookletRequest-error { position: inherit; } #SmartRegistrationFormContent { border-top: 1px solid #999999; padding-top: 1em; } .cricket__smart_registration__content img { float: right; margin-top: 0; } [id*="_txtSchoolSearch"] { border: 8px solid #e9e9e9; max-width: 500px; padding: 10px; width: 80%; margin-bottom: 20px; vertical-align: top; } [id*="_txtSchoolSearch"]::-webkit-input-placeholder { color: #444444; font-size: 16px; } [id*="_txtSchoolSearch"]:-moz-placeholder { /* Firefox 18- */ color: #444444; font-size: 16px; } [id*="_txtSchoolSearch"]::-moz-placeholder { /* Firefox 19+ */ color: #444444; font-size: 16px; } [id*="_txtSchoolSearch"]:-ms-input-placeholder { color: #444444; font-size: 16px; } [id*="_btnSchool"] { background: #FFFFFF; border: 1px solid #999999; font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-size: 16px; padding: 18px 15px; vertical-align: top; } [id*="aceSearchSchool"] { padding: 15px !important; margin-top: -5px; z-index: 10; margin: 0; } [id*="aceSearchSchool"] li { font-size: 16px; padding: 0; margin: 0 0 10px 0; line-height: 20px; } @media all and (min-width: 1024px) { .form__column { width: 50%; float: left; padding-right: 20px; box-sizing: border-box; } } .select__school, .school__form { font-family: "myriad-pro-n4", "myriad-pro", sans-serif; } .school__form { /*border-bottom:1px solid #999999;*/ padding-bottom: 45px; margin-bottom: 45px; } .school__form h3, .select__school h3 { color: #000000; font-size: 19px; font-weight: 600; } .school__form:after { clear: both; content: "."; height: 0; display: block; visibility: hidden; } .school__form .field input[type='text'], .school__form .field input[type='email'], .school__form .field select, .school__form .field textarea { display: block; } #txtSchoolSearch { padding: 10px 15px; } .select__school label { display: inline-block; margin-left: 5px; } .locked { padding: 9px 5px; padding-bottom: 8px; border: solid 1px #999999; width: 100%; max-width: 300px; box-sizing: border-box; font-size: .8em; position: relative; } /*school ticketing promotion*/ .school__ticketing__promotion { background: #111111; padding: 25px 30px; color: #FFFFFF; font-family: "myriad-pro-n4", "myriad-pro", sans-serif; margin-top: 1em; } .school__ticketing__promotion h3 { color: #17bad8; font-size: 24px; font-weight: 700; margin: 10px 0 20px; } .school__ticketing__promotion p { width: 100%; font-weight: 300; } .school__ticketing__promotion em { font-family: "myriad-pro-n4", "myriad-pro", sans-serif; } .note em { font-weight: bold; } .school__ticketing__promotion .fixtures__table { background: #f2f2f2; color: #000000; padding: 10px; } .fixtures__table table { width: 100%; } .fixtures__table tr { border-bottom: 1px solid #bababa; } .fixtures__table tr:last-child { border-bottom: none; } .fixtures__table td, .fixtures__table th { font-size: 18px; padding: 8px 0; padding-left: 15px; border-right: 1px solid #bababa; } .fixtures__table th { font-size: 18px; } .fixtures__table td:last-child, .fixtures__table th:last-child { border-right: none; } .fixtures__table table label { font-weight: 300; } .school__registration { margin-top: 20px; } .school__registration .opt-in .field { margin-right: 15px; } .school__registration .opt-in .field > input { width: auto; padding: 0; border-radius: 0; border: none; } .school__registration .opt-in label { margin-left: 5px; font-size: 18px; } .school__name label { display: block; font-size: 16px; margin-bottom: 10px; } .school__name input[type="text"] { background: transparent; border: 1px solid; color: #FFFFFF; font-weight: 300; font-family: "myriad-pro-n4", "myriad-pro", sans-serif; } .submit-registration { background: #17bad8; border: none; color: #FFFFFF; font-size: 24px; text-transform: uppercase; padding: 10px 30px; font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-weight: 700; margin-bottom: 30px; } .school__registration__faq { display: inline-block; line-height: 1; margin-bottom: 25px; } .school__registration__faq__list { display: none; font-size: 16px; line-height: 1.35; margin-bottom: 25px; } .school__registration__faq__list a { color: #fff; } .school__registration__faq__list p { margin-bottom: 3px; } .school__registration__faq__list ul { margin: 0 0 20px 0; } .school__registration__faq__list ul li { margin-bottom: 0; } .terms-conditions { font-family: "myriad-pro-n4", "myriad-pro", sans-serif; /*padding:25px;*/ font-size: 14px; } .terms-conditions h4 { margin-bottom: 5px; } .article__body .terms-conditions ul { margin-top: 0; } .article__body .terms-conditions li { margin-bottom: 0.1em; } .opt-in label { font-size: 14px; padding-top: 2px; } .page-messages { background: #FFFFFF; box-shadow: 0px 0px 3px 3px rgba(0, 0, 0, 0.2); padding: 30px; } .page-messages .critical { line-height: 1.4em; font-size: 16px; } .image { border-top: 1px solid #999999; text-align: center; padding-top: 20px; margin-top: 20px; } .registration-terms-conditions { font-family: "myriad-pro-n4", "myriad-pro", sans-serif; padding: 25px; font-size: 14px; display: none; } .registration-terms-conditions.open { font-family: "myriad-pro-n4", "myriad-pro", sans-serif; padding: 25px; font-size: 14px; display: block; } .registration-terms-conditions ul li { } /* ========================================================================== Grass roots custom sections ========================================================================== */ /*#foundation-coaches-signup input[type="email"]{ background:#e8e8e8; border-color:#e8e8e8; padding:15px 10px; } #foundation-coaches-signup button{ text-transform:uppercase; font-weight:bold; font-size:20px; line-height:1em; height:2em; }*/ /** * ^Grass roots Summary */ .summary { position: relative; padding-bottom: 3em; line-height: 1.3; font-size: 1em; white-space: normal; } .summary.yui3-u-1-4 { padding-right: 4.16666%; } .gr__header { position: relative; min-height: 1px; margin: 0 0 1em 0; } .summary__section { position: absolute; bottom: 0px; left: 0px; z-index: 1; font-size: .875em; font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-weight: 400; margin: 0; padding: .5em 1em; color: #fff; background: rgba(0, 0, 0, .75); display: inline-block; } .summary { padding-right: 5.555%; } .lt-ie9 .summary__section { display: none; } .no-rgba .summary__section { background: rgb(0, 0, 0); } .summary__img { width: 100%; height: 0; padding-top: 75%; background-size: cover; background-position: center; background-repeat: no-repeat; -ms-behavior: url(/v2/css/backgroundsize.htc); } .lt-ie9 .summary__img { background-position: left bottom; } .summary__heading { position: relative; line-height: 1.2; font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-weight: 400; margin: 0; margin-bottom: .2em; } .summary__deck { position: relative; margin-bottom: .75em; } .summary a { display: block; position: relative; padding-bottom: 2em; border-bottom: 1px solid transparent; transition: border-color .25s; cursor: pointer; } .summary a:hover { border-bottom: 1px solid #666; } /* ========================================================================== contact-list ========================================================================== */ .group__body__contact { width: 100%; max-width: 1400px; padding: 0 20px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin: auto; } .contact__list__header { margin-bottom: 85px; } .contact__list__header h1 { margin-bottom: 30px; } .contact__list__sidebar { margin-bottom: 3em; } @media all and (min-width: 990px) { .contact__list__sidebar { width: 35%; display: inline-block; vertical-align: top; padding-right: 30px; margin-top: -210px; } .contact__list__header { margin-left: 35%; } .contact__list__content { width: 60%; display: inline-block; vertical-align: top; } } @media all and (min-width: 1300px) { .contact__list__sidebar { width: 25%; } .contact__list__header { margin-left: 25%; padding-left: 50px; } .contact__list__content { width: 70%; padding-left: 50px; } } @media all and (max-width: 1000px) { #paper { display: none; } } #paper { position: relative; width: 330px; } #paper svg { position: relative; z-index: 100; } .contact__list__sidebar h2 { font-size: 22px; border-bottom: 1px solid #222222; padding-bottom: 20px; margin-bottom: 30px; margin-top: 30px; } .contact__list__sidebar h2 span { color: #248dc1; font-size: 16px; text-transform: uppercase; display: inline-block; float: right; margin-top: 5px; cursor: pointer; } .contact__list__content .header:after { content: ''; width: 75px; border-bottom: 1px solid #000000; position: absolute; } .contact__list__content p { font-size: 20px; margin-top: 20px; padding-right: 50px; } .district-path:hover { fill: #777777; } /*sidebar filter*/ #filter input[type="checkbox"] { display: none; } #filter label { cursor: pointer; display: inline-block; font-size: 16px; margin: 3px; padding: 5px 30px 5px 40px; } @media all and (min-width: 100px) { #filter label { display: block; margin: 3px 0; } } #filter input[type="checkbox"]:checked + label { background: #ffffff url(/img/furniture/plus-background.png) no-repeat 10px center; } p.disclaimer { text-align: center; color: #248dc1; font-size: 16px; margin: 0; margin-bottom: 40px; padding: 0; text-align: center; display: none; } .district { margin-bottom: 50px; display: block; width: 100%; } .district:after { clear: both; height: 0; content: "."; display: block; visibility: hidden; } /** * ^vcard */ .vcard { width: 100%; min-height: 260px; padding: 15px; margin: 10px 6px 0 0; position: relative; display: inline-block; vertical-align: top; background: #fff; font-size: 14px; line-height: 1.2; } @media all and (min-width: 480px) { .vcard { width: 49%; } } @media all and (min-width: 1300px) { .vcard { width: 32%; } } .vcard .association-tag { position: absolute; bottom: 0; right: 0; display: inline-block; padding: 5px 15px; background: #000000; color: #FFFFFF; } .vcard.ma { background: #000000; color: #FFFFFF; } .vcard.ma .association-tag { background: #FFFFFF; color: #000000; } .vcard.ma a { color: #FFFFFF; } .vcard .org { font-size: 20px; font-weight: 600; margin: 0 0 0.5em; } .vcard .name { font-weight: 600; } .vcard .role { display: none; color: #777777; } .vcard .contact-list { margin: 1em 0 .75em 0; padding: 0; font-size: 12px; list-style: none; } .vcard .contact-list li { margin: 0; padding: 0; } .vcard .contact-list .type { width: 50px; display: inline-block; color: #999; } .vcard .avatar { width: 60px; height: 60px; border-radius: 50%; background-size: cover; background-position: center; background-repeat: no-repeat; } .vcard .physical-address, .vcard .postal-address { margin: 1em 0; display: none; } /* Start: Recommended Isotope styles */ /**** Isotope Filtering ****/ .isotope-item { z-index: 2; } .isotope-hidden.isotope-item { pointer-events: none; z-index: 1; } /**** Isotope CSS3 transitions ****/ .isotope, .isotope .isotope-item { -webkit-transition-duration: 0.8s; -moz-transition-duration: 0.8s; transition-duration: 0.8s; } .isotope { -webkit-transition-property: height; -moz-transition-property: height; transition-property: height; } .isotope .isotope-item { -webkit-transition-property: -webkit-transform, opacity; -moz-transition-property: -moz-transform, opacity; transition-property: transform, opacity; } /**** disabling Isotope CSS3 transitions ****/ .isotope.no-transition, .isotope.no-transition .isotope-item, .isotope .isotope-item.no-transition { -webkit-transition-duration: 0s; -moz-transition-duration: 0s; transition-duration: 0s; } /* End: Recommended Isotope styles */ /*.grassroot__landing__heading{ font-size:35px; margin-bottom:30px; } .grassroot__landing__introduction{ font-size:20px; position:relative; margin-bottom:100px; }*/ /*new tiles on grassroots landing page*/ .info__tiles { width: 100%; display: block; } .info__tile { width: 100%; min-height: 240px; margin-right: 60px; } .inner__tile { display: block; text-decoration: none; padding: 20px; background-size: cover; background-repeat: no-repeat; } .find__da { color: #FFFFFF; background-image: url(grassroots/gr-tile-find-da.jpg); } .find__da h3 { font-size: 23px; line-height: 24px; padding-right: 90px; } .find__da p { font-size: 12px; margin: 10px 0; padding-right: 90px; } .find__da span { background: #248dc1; display: inline-block; padding: 3px 5px; text-transform: uppercase; font-weight: bold; } .cricket__hq { background-image: url(grassroots/gr-tile-cricket-hq.jpg); } .cricket__hq h3 { color: #fe5f3c; font-size: 25px; text-transform: uppercase; padding-right: 130px; line-height: 26px; font-family: "myriad-pro-condensed"; } .cricket__hq p { font-family: "myriad-pro-condensed"; font-weight: 400; font-size: 24px; line-height: 24px; padding-right: 100px; margin-top: 15px; } @media all and (min-width: 335px) { } /*tournaments landing pages*/ .tourney-stream { font-size: 0.875em; line-height: 1.3; padding-bottom: 3em; position: relative; white-space: normal; } .tourney-summary { padding-right: 5.555%; } .tourney-stream__item a { display: block; color: #000000; text-decoration: none; } .tourney-stream__item a:hover { text-decoration: none; color: #010101; } .tourney-stream__item img { margin: 0; padding: 0; } .tourney-summary__heading { margin: 0 0 0.5em; margin-top: 30px; font-family: "myriad-pro-n6", "myriad-pro", sans-serif; font-size: 1.2857em; font-weight: 600; line-height: 1.2; position: relative; } .tourney-summary__deck { font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-size: 0.875em; } .resources { margin-bottom: 80px; } .resource__item { width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin-bottom: 15px; } .resource__item a { display: block; text-decoration: none; } .resource__item img { margin: 0; } @media all and (min-width: 600px) { .resource__item { width: 50%; float: left; padding-right: 5px; } } @media all and (min-width: 1200px) { .resource__item { width: 33%; } } .cwc-community .summary a { text-decoration: none; } .cwc-community .summary a:hover { color: #000000; } .cwc-community .summary__heading { font-size: 1.5em; } .cwc-community .summary__img img { margin: 0; } .cwc-community .summary__deck { font-size: 0.8em; font-family: "myriad-pro-n6", "myriad-pro", sans-serif; } .cricket__smart__buttons a { display: block; width: 100%; background: #238dc1; color: #FFFFFF; padding: 20px 0; font-family: "myriad-pro-n7", "myriad-pro", sans-serif; vertical-align: middle; margin: 10px 0; } .cricket__smart__start { border-top: 1px solid #ddd; padding-top: 2em; margin-top: 3em; clear: both; } .cricket__smart__start.neg-margin { margin-top: -3em; } .cricket__smart__start h2 { font-size: 40px; margin-bottom: 10px; } .cricket__smart__start h3 { font-size: 20px; font-weight: 600; color: #bbb; margin-bottom: 30px; } .cricket__smart__start p { font-size: 18px; } .cricket__smart__start a { width: 140px; text-align: center; margin-right: 10px; } #registrationform .field input.valid { border-color: #ddd; } @media all and (min-width: 1400px) { .cricket__smart__buttons a { display: block; width: 45%; float: left; margin-right: 5%; font-size: 18px; line-height: 18px; } } .cricket__smart__buttons a:hover { color: #FFFFFF; } .cricket__smart__buttons a img { margin: 0 10px 0 15px; display: inline-block; vertical-align: middle; } .cricket__smart__buttons a span { display: inline-block; vertical-align: middle; } .govtlogoimage { text-align: center; } .skills__challenge__tiles:after { clear: both; content: "."; height: 0; display: block; visibility: hidden; } .skills__challenge__tile { width: 100%; text-align: center; } .skills__challenge__tile img { margin: 0; } .skills__challenge__tile { width: 100%; } @media all and (min-width: 770px) { .skills__challenge__tile { float: left; width: 50%; padding-right: 20px; } } @media all and (min-width: 1500px) { .skills__challenge__tile { width: 35%; } } /* ========================================================================== Cricket Nation Nav ========================================================================== */ .c-cricket_nation_nav { line-height: 1; position: relative; width: 15.5em; } .c-cricket_nation_nav__button { -moz-appearance: none; -webkit-appearance: none; appearance: none; background: #ef8c1d; border: 0; color: #141134; cursor: pointer; display: block; font: inherit; font-size: 1.125em; font-weight: bold; outline: 0; padding: .8888em 0; text-align: center; text-transform: uppercase; transition: .2s; width: 100%; } .c-cricket_nation_nav__button:hover { background: #141134; color: #ef8c1d; } .c-cricket_nation_nav__button:active::before, .c-cricket_nation_nav__button:focus::before { border: 2px solid rgba(0, 178, 180, .5); border-radius: 3px; bottom: -5px; content: ''; display: block; left: -5px; position: absolute; right: -5px; top: -5px; z-index: -1; } .c-cricket_nation_nav__button::after { border-style: solid; border-width: 0 2px 2px 0; content: ''; display: inline-block; height: .625em; margin-left: .75em; transform: rotate(45deg); vertical-align: 18%; width: .625em; } .c-cricket_nation_nav__panel { background: #141134; display: none; left: 0; padding-bottom: .25em; position: absolute; right: 0; top: 100%; } .c-cricket_nation_nav--open .c-cricket_nation_nav__panel { display: block; } .c-cricket_nation_nav__panel::before { background: url(/img/cricket-nation/nav-graphic.jpg) top center no-repeat; background-size: cover; content: ''; display: block; margin-bottom: .25em; padding-top: 70%; position: relative; z-index: 3; } .c-cricket_nation_nav__panel::after { background: #141134; content: ''; display: block; height: .75em; left: 50%; position: absolute; top: 0; transform: translate(-50%, -50%) rotate(45deg); width: .75em; z-index: 2; } .c-cricket_nation_nav__link { color: #fff; display: block; font-weight: bold; padding: .5em 0; text-align: center; text-transform: uppercase; } .c-cricket_nation_nav__link--alt { color: #ef8c1d; } /* ========================================================================== Membership Center ========================================================================== */ .membership-nav { background: #000; color: #fff; border: none; margin-left: 1px; opacity: 1; } .membership-nav .face, .membership-nav .avitar { background-color: #1481c5; background-repeat: no-repeat; background-size: cover; background-position: center center; height: 100%; width: 3.125em; display: inline-block; *display: inline; zoom: 1; vertical-align: middle; /*Removed - not using facebook avitar */ display: none !important; } .membership-nav .avitar { background-size: 50%; } .membership-nav .details { display: inline-block; *display: inline; zoom: 1; vertical-align: middle; padding: .55em 1em 0 1em; } .membership-nav .details span, .membership-nav .details strong { display: block; line-height: 1em; } .membership-nav .details strong em { font-style: normal; color: #1481c5; } .membership-nav .brand { height: 1em; } .membership-nav .details .actions { font-size: .8em; padding: 3px 0; } .membership-nav .details a { color: #fff; } .membership-nav .pipe { font-style: normal; display: inline-block; *display: inline; zoom: 1; padding: 0 .3em; color: #ccc; } .mobile .membership-nav { height: 3.425em !important; margin-left: 0; } .mobile .membership-nav .avitar, .mobile .membership-nav .face { width: 3.425em; } .login-page-internal .desktop-login, .membership-nav .desktop-login { display: none; } @media (min-width: 900px) { .login-page-internal .mobile-login, .membership-nav .mobile-login { display: none; } .login-page-internal .desktop-login, .membership-nav .desktop-login { display: inline-block; } } /* membership steps */ .membership-page .steps { position: absolute; top: 0; right: 0; text-align: right; } .membership-page .steps .tail:before, .membership-page .steps .tail:after { left: auto; right: 0; } .membership-page .steps .pages a { border: 1px solid #ccc; color: #ccc; } .membership-page .steps .pages a.selected { border-color: #1481c5; background: #1481c5; color: #fff; } @media only screen and (max-width: 700px) { .membership-page .steps { display: none; } } .membership-side { border: none; } .membership-side .face, .membership-side .avitar { background-color: #1481c5; background-repeat: no-repeat; background-size: cover; background-position: center center; height: 3.125em; width: 3.125em; display: inline-block; *display: inline; zoom: 1; vertical-align: top; margin-right: .5em; margin-bottom: .6em; } .membership-side .avitar { background-size: 50%; } .membership-side .details { display: inline-block; *display: inline; zoom: 1; vertical-align: top; padding: 0 1em 0 0; } .membership-side .details span, .membership-side .details strong { display: block; line-height: 1em; } .membership-side .details strong em { font-style: normal; color: #1481c5; } .membership-side .details .actions { font-size: .8em; padding: 3px 0; } .membership-side .details a { color: #aaa; } .membership-side .pipe { font-style: normal; display: inline-block; *display: inline; zoom: 1; padding: 0 .3em; } /* //// Page //// */ .membership-page .page-header { background-color: #fff !important; background-image: url(/img/membership/header.jpg) !important; background-position: bottom center !important; background-size: cover !important; background-repeat: no-repeat !important; height: 200px; } .membership-page .page-header:after { display: none; } .membership-page .page-header__title-box { position: absolute !important; top: 0 !important; left: 0 !important; bottom: 0 !important; right: 0 !important; } .membership-page .page-header .logo { position: absolute; bottom: 2em; left: 2em; width: 70%; max-width: 400px; } .membership-page .page-header .hash { display: none; } @media (min-width: 600px) { .membership-page .page-header { height: 320px; } } @media (min-width: 1100px) { .membership-page .page-header { height: 480px; } .membership-page .page-header .logo { left: 10%; max-width: 500px; } .membership-page .page-header .hash { right: 10%; } } /* //// Join the Team Page //// */ .membership-page--join .title-box { background: #000; color: #fff; position: relative; } .membership-page--join .title-box .group__body { padding: 2em 0 2.3em; } @media (max-width: 1100px) { .membership-page--join .title-box .group__body { padding-left: 2em; padding-right: 2em; } } .membership-page--join .title-box .hash { display: none; } .membership-page--join .title-box .logo { max-width: 400px; width: 90%; } @media (min-width: 800px) { .membership-page--join .title-box .hash { display: block; position: absolute; bottom: 50%; margin-bottom: -.8em; right: 2em; color: #fff; font-size: 2em; font-weight: 700; } } .membership-page--join .yui3-g { letter-spacing: -0.31em; *letter-spacing: normal; *word-spacing: -0.43em; text-rendering: optimizespeed; display: -webkit-flex; -webkit-flex-flow: row wrap; display: -ms-flexbox; -ms-flex-flow: row wrap; } .membership-page--join .letter { background-size: cover; background-position: center center; color: #fff; } .membership-page--join .letter .article__body { padding-bottom: 0; } .membership-page--join .letter p { font-size: 1.25em; line-height: 1.45; margin-right: 1em; } .membership-page--join .letter .signature { margin: 0; height: 3em; } .membership-page--join .letter .name { font-size: 1em; line-height: 1.45; margin: 0; } .membership-page--join .letter .button { text-transform: uppercase; font-weight: 700; font-size: 1em; margin-top: 1em; } @media (max-width: 1100px) { .membership-page--join .letter section { padding-left: 2em; width: 90%; } } @media (max-width: 700px) { .membership-page--join .letter p { font-size: 1em; } } .membership-page--join .feature-list { text-align: center; background: #ededed; } .membership-page--join .feature-list h1 { margin-bottom: 1em; } .membership-page--join .feature-item { margin: 0 2%; margin-bottom: 4%; width: 45.99%; background: #fff; position: relative; padding-top: 6em; padding-bottom: 3em; } @media (max-width: 700px) { .membership-page--join .feature-item { width: 100%; margin-left: 0; margin-right: 0; } } .membership-page--join .feature-item header { background: #147dc1; line-height: 1em; margin: 0; position: absolute; top: 0; left: 0; right: 0; } .membership-page--join .feature-item header h2 { padding: .7em 1em; font-size: 1.5em; margin: 0; color: #fff; } .membership-page--join .feature-item ul { padding: 0em 1em; font-family: "adelle-n4", "adelle", serif; display: inline-block; *display: inline; zoom: 1; vertical-align: middle; width: 95%; background: #fff; margin: 0; list-style: none; } .membership-page--join .feature-item li { font-size: 1.1em; margin-bottom: .5em; } .membership-page--join .feature-item li .tick { height: .9em; margin-right: .5em; } .membership-page--join .feature-list .button { text-transform: uppercase; font-weight: 700; font-size: 1.5em; } .membership-page--join .cta { text-align: center; background: #ededed; } .membership-page--join .cta .brand { max-width: 300px; margin-bottom: 1.5em; } .membership-page--join .cta .button { text-transform: uppercase; font-weight: 700; font-size: 1.5em; } .membership-page--join .cta section { max-width: 600px; } .membership-page--join .cta .group__body { padding-top: 0; } .membership-page--join .cta h2 { font-size: 2.5em; margin-top: 0; } .membership-page--join .cta p { font-size: 1.3em; margin-top: 1.2em; } .membership-page--join .cta p a { font-weight: 700; text-decoration: underline; } .login-page-internal { text-align: center; max-width: 1000px; margin: 0 auto; background: #fff; padding: 3em; } .login-page-internal .actions { display: block; } .login-page-internal img { margin-top: 0; margin-bottom: 2em; } /* //// MyBLACKCAPS register page // login page //// */ .membership-registration-page .box-call-action { position: relative; } .membership-registration-page .page-header .button { text-transform: uppercase; font-weight: 700; font-size: 1.5em; } @media (min-width: 700px) { .membership-registration-page .page-header .button { position: absolute; left: 40%; } } .membership-registration-page .page-header { height: auto; padding: 0; } .membership-registration-page .page-header__content-box { position: relative; left: auto; bottom: auto; right: auto; z-index: 999; text-align: center; padding: 0 2em 8em; max-width: 1200px; margin: 0 auto; } .membership-registration-page .page-header__content-box .logo { height: 6em; margin-bottom: 4em; } .membership-registration-page .page-header__content-box h1 { font-family: "myriad-pro-n3", "myriad-pro", sans-serif; font-weight: 300; font-size: 3em; } .membership-registration-page .page-header__content-box .feature-list { text-align: left; margin: 4em auto 2em; max-width: 900px; } .membership-registration-page .page-header__content-box .feature-item { padding-bottom: 2em; position: relative; } .membership-registration-page .page-header__content-box h2 { width: 100%; margin: 0 0 .3em; } .membership-registration-page .page-header__content-box .feature-icon { position: absolute; top: 0; left: 0; width: 3em; } .membership-registration-page .page-header__content-box .feature-item .shift { padding-left: 4em; padding-right: 1em; } .membership-registration-page .page-header__content-box .players { display: none; } @media (min-width: 700px) { .membership-registration-page .page-header__content-box { padding: 8em 2em 0em; } .membership-registration-page .page-header__content-box .players { max-width: 90%; margin: 0 auto; display: block; margin-top: -140px; } } @media (min-width: 1000px) { .membership-registration-page .page-header__content-box .feature-icon { width: 5em } .membership-registration-page .page-header__content-box .feature-item .shift { padding-left: 6em; } } @media (max-width: 600px) { .membership-registration-page .page-header__content-box h1 { font-size: 2.2em; } .membership-registration-page .page-header__content-box .feature-item { width: 70%; margin-left: auto; margin-right: auto; display: block; text-align: center; } .membership-registration-page .page-header__content-box .feature-icon { position: relative; margin-bottom: 1em; } .membership-registration-page .page-header__content-box .feature-item .shift { padding: 0; } } .membership-registration-page .social-form, .membership-registration-page .myblackcaps-form, .membership-login-page .social-form, .membership-login-page .myblackcaps-form { text-align: center; } .membership-registration-page .social-form h2, .membership-registration-page .myblackcaps-form h2, .membership-login-page .social-form h2, .membership-login-page .myblackcaps-form h2 { margin: .5em 0 1em; font-family: "myriad-pro-n3", "myriad-pro", sans-serif; font-weight: 300; } .membership-registration-page .social-form, .membership-login-page .social-form { border-bottom: 1px solid #eee; margin-bottom: 3em; } .membership-registration-page .article__body form, .membership-login-page .article__body form { text-align: left; } @media (max-width: 700px) { .membership-registration-page .social-form h1, .membership-login-page .social-form h1 { font-size: 2em; } .membership-registration-page .social-form .button, .membership-login-page .social-form .button { margin: 0 .5em .5em; } .membership-registration-page .social-form .button .text, .membership-login-page .social-form .button .text { display: none; } .membership-registration-page .social-form .button i, .membership-login-page .social-form .button i { margin-right: 0; } } @media (min-width: 700px) { .membership-registration-page .group__page, .membership-login-page .group__page { background: #e8e9e9; padding: 4em 0; } .membership-registration-page .article__body, .membership-login-page .article__body { border: 1px solid #ddd; box-shadow: 0 .5em 1em rgba(0, 0, 0, .05); max-width: 1000px; margin: 0 auto; background: #fff; padding: 3em; } } /* //// mobile app ad //// */ .group--mobile-app-ad { background: url(/img/membership/register/mobile-app-ad.png) repeat-x; background-size: auto 100%; } .group--mobile-app-ad .group__body { text-align: left; color: #fff; } .group--mobile-app-ad .group__body .content-block { padding-right: 5%; } .group--mobile-app-ad .group__body .yui3-u-1-2 { vertical-align: middle; } .group--mobile-app-ad .group__body h2 { font-size: 3em; margin: 0 0 .3em; } .group--mobile-app-ad .group__body p { font-family: "myriad-pro-n3", "myriad-pro", sans-serif; font-weight: 300; font-size: 2em; } .group--mobile-app-ad .group__body a { display: inline-block; *display: inline; zoom: 1; min-width: 35%; max-width: 45%; margin: 0 1em 3em 0; transition: opacity .2s; -webkit-transition: opacity .2s; } .group--mobile-app-ad .group__body a:hover { opacity: .7; } @media (max-width: 700px) { .group--mobile-app-ad .group__body { padding-top: 4em; padding-bottom: 4em; } .group--mobile-app-ad .group__body .yui3-u-1-2 { width: 90%; margin: 0 auto; display: block; } .group--mobile-app-ad .group__body { text-align: center; } .group--mobile-app-ad .group__body a { width: 100%; } } /* //// Teams //// */ .checkbox-group--teams .checkbox, .radio-group--teams .radio { margin: 1em 0; opacity: 0.2; filter: alpha(opacity=20); transition: opacity .2s; -webkit-transition: opacity .2s; display: inline-block; *display: inline; zoom: 1; width: 49%; } @media (min-width: 300px) { .checkbox-group--teams .checkbox, .radio-group--teams .radio { width: 32%; } } @media (min-width: 500px) { .checkbox-group--teams .checkbox, .radio-group--teams .radio { width: 24%; } } .checkbox-group--teams .checkbox input, .radio-group--teams .radio input { opacity: 0; filter: alpha(opacity=0); } .checkbox-group--teams .checkbox label, .radio-group--teams .radio label { font-weight: 700; padding-left: 0; text-align: center; display: inline-block; } .checkbox-group--teams .checkbox.selected, .radio-group--teams .radio.selected { opacity: 1; filter: alpha(opacity=100); } .checkbox-group--teams .checkbox label span, .radio-group--teams .radio label span { display: block; } .checkbox-group--teams img, .radio-group--teams img { display: inline-block; margin: 0 auto; height: 100px; pointer-events: none; } @media (max-width: 600px) { .checkbox-group--teams img, .radio-group--teams img { height: 70px; } } .membership-page .summary-list { padding-right: 30px; } @media (max-width: 450px) { .membership-page .summary-list { width: 100%; } } .membership-summary { padding-bottom: 2em; } .membership-summary::after { content: " "; display: block; border-top: 1px solid #ccc; height: 1px; width: 20%; } .membership__passcode { margin: 40px 0 20px; padding: 40px 20px 20px; background: #eee; position: relative; max-width: 350px; } .membership__passcode.priority--ticketing { max-width: 600px; } .membership__passcode img { position: absolute; top: -20px; width: 100px; } .membership__passcode.priority--ticketing img { top: -65px; } .membership__passcode ul { margin: 0; padding: 0; } .membership__passcode li { /*display:inline-block;*/ list-style: none; margin: 0 0 1em; padding: 0 0 0 2.5em; position: relative; } .membership__passcode.priority--ticketing ul li { list-style-type: disc; margin-left: 1em; padding-left: 0.2em; } .membership__passcode li span { width: 2em; height: 2em; text-align: center; line-height: 2em; font-weight: bold; background: #fff; position: absolute; top: -.2em; left: 0; border-radius: 50%; -webkit-border-radius: 50%; display: inline-block; *display: inline; zoom: 1; color: #147dc1; } .membership__passcode.priority--ticketing .code { position: relative; background: none; background: rgba(0, 0, 0, 0) none repeat scroll 0 0; margin-left: 0.5em; position: static; } } .membership__passcode li input { border: none; font-size: 1.3em; display: inline-block; *display: inline; margin-left: 5px; color: #1481c5; background: transparent; width: 75%; font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-weight: bold; margin-top: .5em; position: relative; top: .1em; } .membership__passcode li a { font-weight: bold; color: #1481c5; } /* / international selection / */ .international-respond h4.empty { display: none; } .international-respond .radio { display: none; } .international-respond .radio.enlist, .international-respond .radio.selected { display: inline-block; } /* / App Promo / */ .app-promo { max-width: 350px; color: #1481c5; margin-bottom: 2em; } .app-promo h2 { margin: .4em 0; } .app-promo p { margin: 0; } .app-promo img.sample { width: 100%; position: relative; left: -5.5%; } .downloads::before { content: " "; display: block; padding-top: 1em; border-bottom: 1px solid #1481c5; margin-bottom: .3em; height: 1px; width: 10%; } .app-promo a { width: 49%; display: inline-block; *display: inline; zoom: 1; } .app-promo a img { width: 100%; } .social-account { margin-bottom: 3em; } .social-account .button { color: #fff !important; display: inline-block; *display: inline; zoom: 1; font-size: .85em; text-align: center; margin-bottom: 1em; margin-right: 1em; } .social-account .button i { font-size: 1.3em; position: relative; top: .15em; } .social-account .button:hover { opacity: .8; } /**/ .priority-ticketing-password { color: #FFFFFF; font-family: "myriad-pro-n4", "myriad-pro", sans-serif; width: 100%; max-width: 480px; text-align: left; } .priority-ticketing-password .row:after { clear: both; content: "."; display: block; height: 0; visibility: hidden; } .priority-ticketing-password .row { padding: 10px; } .priority-ticketing-password .description { background: #000000; } .priority-ticketing-password p { max-width: initial; } .priority-ticketing-password .password { background: #454545; } .priority-ticketing-password .row { padding-left: 20px; } .priority-ticketing-password .cell p, .priority-ticketing-password .cell img, .priority-ticketing-password .button--blue { display: inline-block; vertical-align: middle; margin: 0; } .priority-ticketing-password .description a { color: #FFFFFF; } .priority-ticketing-password .cell img { width: 80px; } .priority-ticketing-password .cell .text { text-transform: uppercase; color: #248dc1; margin: 0 15px; font-size: 0.9em; font-weight: bold; } .priority-ticketing-password .cell .passcode { font-weight: bold; font-size: 1.3em; } .priority-ticketing-password .cell .description-text { font-size: 0.9em; } .priority-ticketing-password .cell .button--blue { margin: 10px 0 5px; text-transform: uppercase; font-weight: bold; font-family: "myriad-pro-condensed", sans-serif; font-size: 20px; line-height: normal; padding: 10px 15px; height: auto; } @media all and (min-width: 450px) { .priority-ticketing-password .cell .passcode { display: inline-block; margin-right: 0; } .priority-ticketing-password .cell .button--blue { margin-left: 30px; margin-top: 5px; } } .fullwidth { width: 100%; padding-right: 0; } /**************************/ /* Cricket World Cup page */ /**************************/ .world-cup-button { background: #004b87 !important; padding: 0; padding-left: 0.8em; height: 100%; } .world-cup-button.mobile { position: relative; } .world-cup-button.mobile img { position: absolute; top: 0; right: 0; } .world-cup-button.mobile span { font-size: 15px; line-height: 1.1em; margin-bottom: 5px; padding-right: 50px; white-space: normal; } .world-cup-button span, .world-cup-button img { display: inline-block; vertical-align: middle; } .world-cup-button img { height: 100%; margin-left: 5px; } .world-cup-button span { font-weight: 400; color: #FFFFFF; font-size: 13px; line-height: 1.3em; } .world-cup-button:hover { background: #004b87; } @media all and (min-width: 1100px) { .world-cup-button { font-weight: 400; color: #FFFFFF; font-size: 15px; line-height: 1.3em; } .world-cup-button span { font-size: 1em; margin-top: 5px; } } /* banner ads on schedules page */ .schedules__adspace { width: 100%; background: #252525; } .schedules__adspace a { display: block; margin: 0 auto; width: 100%; text-align: center; } .schedules__adspace img { width: 100%; } @media all and (max-width: 700px) { .schedules__adspace { display: none; } } /**************************/ /* Superstar Cricket page */ /**************************/ .superstar-table { border-bottom: 1px solid #959595; padding-bottom: 1.5em; margin-bottom: 3em; } .superstar-table img { margin: 0; } .superstar-table-logos img { display: block; margin: 0 auto; } .superstar-table-logos img:first-child { margin-bottom: 3em; } @media all and (max-width: 500px) { .superstar-table-logos { text-align: center; } .superstar-table-logos img { display: inline-block; margin: 0 1.5em; } .superstar-table-logos img:first-child { margin-bottom: 0; } } @media all and (max-width: 860px) { .superstar-table .yui3-u-1-12 { width: 12%; } .superstar-table .yui3-u-11-12 { width: 88%; } } /**************************/ /* Superstar Cricket page */ /**************************/ .superstar-table { border-bottom: 1px solid #959595; padding-bottom: 1.5em; margin-bottom: 3em; } .superstar-table img { margin: 0; } .superstar-table-logos img { display: block; margin: 0 auto; } .superstar-table-logos img:first-child { margin-bottom: 3em; } @media all and (max-width: 500px) { .superstar-table-logos { text-align: center; } .superstar-table-logos img { display: inline-block; margin: 0 1.5em; } .superstar-table-logos img:first-child { margin-bottom: 0; } } @media all and (max-width: 860px) { .superstar-table .yui3-u-1-12 { width: 12%; } .superstar-table .yui3-u-11-12 { width: 88%; } } #ClubDetails .field { margin-bottom: 1.5em; } #ClubDetails .checkbox-inline { padding-top: 2px; } #ClubDetails .checkbox-inline input { position: relative; top: -6px; } #ClubDetails .checkbox-inline label { font-size: 16px; margin-bottom: 0; padding-left: 4px; } #ClubDetails .radio-label { font-size: 16px; margin-top: 4px; } #ClubDetails .radio-label input { margin-right: 4px; } #MajorAssociationsBox label, #DistrictAssociationsBox label, #ClubsBox label, #RegionsBox label { font-weight: bold; padding-bottom: 5px; vertical-align: middle; } #MajorAssociationsBox { display: block; } #MajorAssociationsBox a { color: #777; display: inline-block; font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-size: .75em; margin-top: -5px; margin-bottom: .125em; padding-bottom: 5px; vertical-align: middle; } #MajorAssociationsBox a:hover { color: #248dc1; } #MajorAssociationsBox a i { margin-right: .375em; } /*#DistrictAssociationsBox, #ClubsBox, #RegionsBox{ display:none; }*/ .summary a.superstar--cricket--summary { padding-bottom: 1.5em; border-bottom: none; } .summary a.superstar--cricket--summary:hover { border-bottom: none; } .summary a.superstar--cricket--btn { background: #000; display: inline-block; color: #fff; padding: 0.75em 1.5em; border-bottom: none; } .summary a.superstar--cricket--btn:hover { background: #00ADEF; } .superstar--cricket--blue { background: #373e90; } .superstar--form input[type="radio"], .superstar--form span { display: inline-block; margin-right: 5px; } .superstar--form .field-group { margin-bottom: 1.5em; } .superstar--form label { font-weight: 600; } .superstar--form .form__value { display: none; } .superstar--form .BecomeMember { overflow: hidden; margin-bottom: 2em; } .superstar--form .BecomeMember .field-validation { width: 94%; float: right; } .superstar--form .BecomeMember .field-validation:after { background: none; } .superstar--form .BecomeMember .field-validation label { font-family: "adelle-n4", "adelle", serif; font-weight: 400; line-height: 1.5; } .superstar--form .BecomeMember input { float: left; margin-top: 0.5em; } .superstar--form #CentresBox li { font-size: 0.750em; padding-left: 0.250em; } .article__body .resources-img img { margin: 0 0.5em 0.5em 0; } /************/ #get-involved { border: none; } .promoted-content__table, .nzc-programmes { width: 100%; } @media all and (min-width: 550px) { .promoted-content__table { bottom: 0; height: 100%; left: 0; position: absolute; top: 0; width: 50%; } } .nzc-programmes .row { width: 100%; } .nzc-programmes .row:after { clear: both; display: block; content: "."; height: 0; visibility: hidden; } .nzc-programmes .row:first-child { border-bottom: 1px solid #cccccc; } .nzc-programmes .row .cell { width: 50%; float: left; } .nzc-programmes .row .cell:first-child { border-right: 1px solid #cccccc; } .nzc-programmes img { margin: 0; } .article__body h2.promoted-content__title { font-size: 1.3em; } .article__body p.promoted-content__description { font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-size: 0.8em } /*community landing page*/ .community--landing--header { height: 20vh; background-repeat: no-repeat; background-size: cover; position: relative; background-position: top right; } @media all and (min-width: 1024px) { .community--landing--header { height: 30vh; } } .community--landing--header .inner { padding: 0 5%; height: 100%; } .community--landing--header h1 { color: #FFFFFF; position: absolute; bottom: 15%; left: 5%; font-size: 30px; font-weight: normal; font-family: "hurme_geometric_sans_3"; font-weight: 500; text-transform: uppercase; } @media all and (min-width: 450px) { .community--landing--header h1 { font-size: 50px; } } @media all and (min-width: 600px) { .community--landing--header h1 { font-size: 65px; } } @media all and (min-width: 900px) { .community--landing--header h1 { font-size: 75px; } } @media all and (max-width: 900px) { .community-landing--content .yui3-u-1-5, .community-landing--content .yui3-u-4-5 { width: 100%; } } .community--tiles .tile { background-size: cover; background-position: top center; background-repeat: no-repeat; font-family: "hurme_geometric_sans_3"; font-weight: 600; /*min-height:300px;*/ } /*@media all and (min-width:1024px){ .community--tiles .tile { min-height:426px; } }*/ .menu--tile { padding: 2em; } .community--tiles .tile img { width: 100%; } .community--tiles .tile--header { position: absolute; } .tile--image-wrap { position: relative; } .tile--image-wrap::before { content: ''; display: block; padding-top: 66.666%; } .tile--image-wrap img { display: block; height: 100%; left: 0; object-fit: cover; position: absolute; top: 0; width: 100%; } .tile--header p { text-transform: uppercase; font-size: 19px; line-height: 1; color: #FFFFFF; position: absolute; bottom: 20px; left: 10px; margin: 0; } .tile--header p .hashtag { display: block; margin-top: 0.7em; font-size: 12px; } @media all and (min-width: 1700px) { .tile--header p .hashtag { font-size: 20px; } } @media all and (min-width: 1100px) { .tile--header p { font-size: 24px; } } @media all and (min-width: 1700px) { .tile--header p { font-size: 32px; } } .tile--header.top p { top: 10px; left: 20px; } .community--tiles .tile--header.top p { padding-right: 120px; right: 20px; width: auto; } .tile--header.yellow p, .tile--header.bright-yellow p, .tile--header.new-yellow p, .tile--header.white p { color: #000; } .tile--header:after { -moz-border-bottom-colors: none; -moz-border-left-colors: none; -moz-border-right-colors: none; -moz-border-top-colors: none; border-image: none; border-style: solid; border-width: 15px; pointer-events: none; position: absolute; width: 0; } /*position*/ .tile--header.top { top: 0; left: 0; right: 0; height: 44%; } @media all and (min-width: 900px) { .tile--header.top { height: 35%; } } .tile--header.left { left: 0; top: 0; bottom: 0; width: 35%; } .tile--header.right { right: 0; top: 0; bottom: 0; width: 35%; } /*pointers*/ /*top*/ .community--tiles .cta { position: absolute; top: 15px; right: 15px; display: inline-block; border: 1px solid; color: #FFFFFF; padding: 10px 15px; text-transform: uppercase; font-family: "hurme_geometric_sans_3"; font-weight: 800; font-size: 16px; text-align: center; line-height: 1.1; letter-spacing: 0.05em; } .tile--header.right + .cta { max-width: 25%; } @media all and (min-width: 1100px) { .tile--header.right + .cta { max-width: none; } } @media all and (min-width: 1024px) { .community--tiles .cta { font-size: 20px; } } .community--tiles .yellow + .cta, .community--tiles .bright-yellow + .cta, .community--tiles .new-yellow + .cta, .community--tiles .white + .cta { color: #000000; } .community--footer { background: #141134; padding: 5em 0 10em; text-align: center; } .community--footer img { width: 300px; } .code-input { border: none; background: none; font-family: "myriad-pro-n4", "myriad-pro", sans-serif; font-weight: bold; } @media (min-width: 1000px) { .mobile-only { display: none !important; } } @media (max-width: 999px) { .desktop-only { display: none !important; } } /* Form layout for Boundary-Rider page */ .c-br-form__wrap h3 { font-size: 23px; line-height: 28px; } .c-br-form__wrap label.umbraco-forms-label { font-weight: normal; font-size: 20px; line-height: 24px; } .c-br-form__wrap .row-fluid { display: flex; flex-direction: row; } .c-br-form__wrap .row-fluid .col-md-6 { width: 50%; } .c-br-form__wrap .row-fluid .col-md-12 { width: 100%; } .c-br-form__wrap.umbraco-forms-form input[type="text"], .c-br-form__wrap.umbraco-forms-form input.text, .c-br-form__wrap.umbraco-forms-form select { height: 40px; margin: 0.5em 0 1em 0 !important; padding: 5px; border: 1px solid #bbb; max-width: 100% !important; padding: 5px; display: block; width: calc(100% - 20px); } .umbraco-forms-field-wrapper { position: relative; } .c-br-form__wrap.umbraco-forms-form .checkbox { width: 20px !important; height: 20px !important; } .c-br-form__wrap.umbraco-forms-form label.checkbox-label { position: absolute; top: 1px; left: 25px; font-size: 0.9em; } .c-br-form__wrap.umbraco-forms-form label.checkbox-label a { font-weight: bold; } .c-br-form__wrap.umbraco-forms-form label.checkbox-label a[href*=".pdf"]:not(.link--simple)::before { display: none; } .c-br-form__wrap.umbraco-forms-form label.checkbox-label a[href*=".pdf"]:not(.link--simple) { display: initial; padding: initial; font-size: inherit; color: inherit; min-height: initial; } .c-br-form__wrap.umbraco-forms-form input[type="dropdown"] { } .c-br-form__wrap.umbraco-forms-form input[type="submit"] { padding: 20px 32px; background: #147DC1; color: #FFF; border: none; border-radius: 0; } .article__body > p:last-of-type { margin-bottom: 0 !important; } .nvp-scorecard__batsmen .summary { padding-bottom: 0; } .nvp-scorecard__table-row--total.nv-g-flex.nvp-scorecard__table-row { align-items: flex-start !important; } .nvp-scorecard__batsmen-out-info.summary { display: inline-flex; gap: 5px; } .nvp-scorecard__batsmen-out-info.summary a { padding-bottom: 0; } .nvp-scorecard__event.nvp-scorecard__batsmen-out.summary { text-align: left; }