html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin:0; padding:0; border:0; font-size:100%; font:inherit; vertical-align:baseline; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display:block; }
ol, ul { list-style:none; }
blockquote, q { quotes:none; }
blockquote:before, blockquote:after, q:before, q:after { content:''; content:none; }
table { border-collapse:collapse; border-spacing:0; }
body, html { -webkit-tap-highlight-color:transparent; overflow-x:hidden; }
body { font-family:'Open Sans',sans-serif; font-size:16px; line-height:1.5; -webkit-font-smoothing:antialiased; }
body.lock { overflow:hidden; }
a { text-decoration:none; color:#64b5f6; }
img { max-width:100%; }
h1, h2, h3, h4, h5, h6 { padding:0.75rem; }
h1 { font-size:2.5em; }
h2 { font-size:2.25em; }
h3 { font-size:1.5em; }
h4 { font-size:1.25rem; }

select { font-family:'Open Sans',sans-serif; }

.section.view { min-height:100vh; text-align:center; padding-top:0; }
.hidden { display:none; }
.clear { clear:both; }
.flex { display:flex; }
.ns { -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; }
.tso { -webkit-transition:opacity 0.30s ease-in-out; -moz-transition:opacity 0.30s ease-in-out; -o-transition:opacity 0.30s ease-in-out; transition:opacity 0.30s ease-in-out; }
.tsc { -webkit-transition:color 0.30s ease-in-out; -moz-transition:color 0.30s ease-in-out; -o-transition:color 0.30s ease-in-out; transition:color 0.30s ease-in-out; }
.tsb { -webkit-transition:background-color 0.30s ease-in-out; -moz-transition:background-color 0.30s ease-in-out; -o-transition:background-color 0.30s ease-in-out; transition:background-color 0.30s ease-in-out; }
.t0 { opacity:0; }
.ib { display:inline-block; }


.surfline-player video { width:100%; }
.surfline-player .date { display:inline-block; margin:0.375rem; padding:0.375rem; }
.surfline-player .date .key { font-size:0.7rem; text-transform:uppercase; }
.surfline-player .date .val { font-size:0.9rem; }

.empty-player { padding:4rem 1.5rem; }

.basic { text-align:center; }
.basic select { margin:0.375rem auto; padding:0.5rem; width:calc(100% - 1rem); font-size:12px; background:rgba(255,255,255,0.7); outline:0; border-radius:1rem; }
.basic .controls select:first-child { margin-top:0.75rem; } 
.basic .controls select:last-child { margin-bottom:0.75rem; }

@media screen and (min-width:600px){ 
	.basic select { width:auto; }
}

@media screen and (min-width:800px){ 
	.basic select { margin:0.375rem 0.1875rem; font-size:14px; }
	.basic .controls { position:fixed; top:0; right:0; left:0; z-index:10; }
}

.basic.auth { padding:0.75rem; }

.rewind-item { margin:0.375rem; }