* { -moz-box-sizing: border-box; box-sizing: border-box; } html { font-family: sans-serif; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; } body { margin: 0; } article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { display: block; } audio, canvas, progress, video { display: inline-block; vertical-align: baseline; } audio:not([controls]) { display: none; height: 0; } [hidden], template { display: none; } a { background: transparent; } a:active, a:hover { outline: 0; } abbr[title] { border-bottom: 1px dotted; } b, strong { font-weight: 700; } dfn { font-style: italic; } h1 { font-size: 2em; margin: .67em 0; } mark { color: #000; background: #ff0; } small { font-size: 80%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -.5em; } sub { bottom: -.25em; } img { border: 0; } svg:not(:root) { overflow: hidden; } figure { margin: 1em 40px; } hr { -moz-box-sizing: content-box; box-sizing: content-box; height: 0; } pre { overflow: auto; } code, kbd, pre, samp { font-family: monospace,monospace; font-size: 1em; } button, input, optgroup, select, textarea { font: inherit; margin: 0; color: inherit; } button { overflow: visible; } button, select { text-transform: none; } button, html input[type=button], input[type=reset], input[type=submit] { cursor: pointer; -webkit-appearance: button; } button[disabled], html input[disabled] { cursor: default; } button::-moz-focus-inner, input::-moz-focus-inner { padding: 0; border: 0; } input { line-height: normal; } input[type=checkbox], input[type=radio] { -moz-box-sizing: border-box; box-sizing: border-box; padding: 0; } input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { height: auto; } input[type=search] { -moz-box-sizing: content-box; box-sizing: content-box; -webkit-appearance: textfield; } input[type=search]::-webkit-search-cancel-button, input[type=search]::-webkit-search-decoration { -webkit-appearance: none; } fieldset { margin: 0 2px; padding: .35em .625em .75em; border: 1px solid silver; } legend { padding: 0; border: 0; } textarea { overflow: auto; } optgroup { font-weight: 700; } table { border-spacing: 0; border-collapse: collapse; } td, th { padding: 0; } .visually-hidden, .settings_account_info_row label { position: absolute; overflow: hidden; clip: rect(0 0 0 0); clip: rect(0,0,0,0); width: 1px; height: 1px; margin: -1px; padding: 0; } .masthead, .new-post_textarea, .new-post_input, .new-post_add, .post-filter, .posts, .post, .post_wrapper, .post_content_meta, .post_content_message, .post_content_expand, .post_content_thumbnail, .comments, .comment, .comments_reply, .posts_load-more, .settings section, .settings_account_info_row, .settings_save, .toggle, .modal_message, .modal_actions, .header, .footer, .layout { float: left; width: 100%; } html { font: 400 1em/1.5 'Proxima Nova Rg',Helvetica,Arial,sans-serif; overflow-y: scroll; min-height: 100%; } body { padding-top: 3.75em; color: #262728; font-smoothing: antialiased; } hr { border-top: 1px solid #70767f; } .caret { display: inline-block; width: 0; height: 0; margin-left: 2px; vertical-align: middle; color: #4b4f54; border-top: 4px solid; border-right: 4px solid transparent; border-left: 4px solid transparent; } svg { max-width: 100%; height: auto; } h1, h2, h3, h4, h5, h6 { font-family: Proxima Nova Rg,Helvetica,Arial,sans-serif; font-weight: 400; line-height: 1; margin: 0; color: #3f454d; text-rendering: optimizeLegibility; } .giga { font-size: 48px; font-size: 3rem; margin-bottom: 8px; margin-bottom: .5rem; } .mega { font-size: 44px; font-size: 2.75rem; margin-bottom: 9px; margin-bottom: 8px; margin-bottom: .5454545455rem; } .kilo { font-size: 40px; font-size: 2.5rem; margin-bottom: 10px; margin-bottom: 9px; margin-bottom: .6rem; } .alpha, h1 { font-size: 32px; font-size: 2rem; margin-bottom: 12px; margin-bottom: .75rem; } .beta, h2 { font-size: 28px; font-size: 1.75rem; margin-bottom: 14px; margin-bottom: 13px; margin-bottom: .8571428571rem; } .gamma, h3 { font-size: 24px; font-size: 1.5rem; margin-bottom: 16px; margin-bottom: 1rem; } .delta, h4 { font-size: 20px; font-size: 1.25rem; margin-bottom: 19px; margin-bottom: 1.2rem; } .epsilon, h5 { font-size: 16px; font-size: 1rem; margin-bottom: 24px; margin-bottom: 1.5rem; } .zeta, h6 { font-size: 16px; font-size: 1rem; margin-bottom: 24px; margin-bottom: 1.5rem; } p { margin: 0 0 12px; margin: 0 0 .75rem; } a { -webkit-transition: color .1s linear; transition: color .1s linear; text-decoration: none; color: #0c9; } a:hover { color: #00664d; } a:active, a:focus { color: #00664d; outline: none; } textarea { line-height: 1.2; overflow: auto; resize: none; -webkit-transition: .3s; transition: .3s; word-wrap: break-word; } .input-primary, input[type=text], input[type=email], input[type=password] { width: 100%; padding: .8125em .875em; -webkit-transition: all .3s ease; transition: all .3s ease; border: 1px solid #dee1e5; border-radius: .25em; background: #fff; box-shadow: none; -webkit-appearance: none; } .input-primary::-webkit-input-placeholder, input[type=text]::-webkit-input-placeholder, input[type=email]::-webkit-input-placeholder, input[type=password]::-webkit-input-placeholder { color: #bec3cc; } .input-primary::-moz-placeholder, input[type=text]::-moz-placeholder, input[type=email]::-moz-placeholder, input[type=password]::-moz-placeholder { color: #bec3cc; } .input-primary:-moz-placeholder, input[type=text]:-moz-placeholder, input[type=email]:-moz-placeholder, input[type=password]:-moz-placeholder { color: #bec3cc; } .input-primary:-ms-input-placeholder, input[type=text]:-ms-input-placeholder, input[type=email]:-ms-input-placeholder, input[type=password]:-ms-input-placeholder { color: #bec3cc; } .input-primary:focus, input[type=text]:focus, input[type=email]:focus, input[type=password]:focus { outline: none; } input[type=search] { border-radius: .25em; -webkit-appearance: none; } input[type=password] { color: #c5c7c9; } .input-secondary { border: 1px solid #bec3cc; } .input-secondary:focus { color: #0c9; border: 1px solid #0c9; } .input-has-icon { padding-left: 2.5em!important; } label { cursor: pointer; color: #70767f; } .radio:not(:checked), .radio:checked { position: absolute; left: -9999px; } .radio:not(:checked) + label, .radio:checked + label { position: relative; display: block; padding-left: 3.125em; cursor: pointer; } .radio:not(:checked) + label:before, .radio:checked + label:before { position: absolute; left: 0; width: 1.4375em; height: 1.4375em; content: ''; border: 1px solid #dee1e5; border-radius: 6.25em; } .radio:not(:checked) + label:after, .radio:checked + label:after { font-size: 1em; position: absolute; top: .3125em; left: .3125em; display: block; width: .9375em; height: .9375em; content: ''; -webkit-transition: all .3s ease; transition: all .3s ease; border-radius: 6.25em; background: #00b286; } .radio:not(:checked) + label:after { -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); opacity: 0; filter: alpha(opacity=0); } .radio:checked + label:after { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); opacity: 1; filter: alpha(opacity=100); } .radio-group { margin-bottom: .625em; } .checkbox-group { margin-bottom: 1.5625em; } .btn { line-height: 2.5em; position: relative; display: inline-block; height: 2.5em; padding: 0 1.5625em; -webkit-transition: all .3s ease; transition: all .3s ease; text-align: center; vertical-align: middle; border: none; border-radius: .25em; appearance: none; } .btn-small { font-size: .8125em; line-height: 1.75em; height: 1.75em; } .btn-primary { font-family: Proxima Nova Bd,Helvetica,Arial,sans-serif; font-weight: 700; color: #fff; background: #00b286; } .btn-primary:hover, .btn-primary:focus { color: #fff; background: #009973; } .btn-primary:active { background: #007f60; } .btn-secondary { color: #bec3cc; border: 1px solid #bec3cc; } .btn-secondary:hover, .btn-secondary:focus { color: #0c9; border: 1px solid #0c9; } .btn-fill { width: 100%; } .search { display: block; } .search_form { position: relative; } .search_trigger path { fill: #0c9; } .search_trigger svg { width: 1.25em; height: 1.25em; } .search_submit { position: absolute; top: 50%; right: .875em; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); border: none; background: none; } .search_submit:focus svg, .search_submit:hover svg { opacity: .6; filter: alpha(opacity=60); } .search_submit path { -webkit-transition: fill .3s ease; transition: fill .3s ease; fill: #44474b; } .search_submit svg { display: block; width: 1em; height: 1em; } .search_submit svg:hover path, .search_submit svg:focus path { fill: rgba(255,255,255,.4); } input[type=search] { -moz-box-sizing: border-box; box-sizing: border-box; } .search_input { -moz-box-sizing: border-box; box-sizing: border-box; width: 100%; padding: .3125em 2.5em .3125em .625em; -webkit-transition: all .3s ease; transition: all .3s ease; color: #fff; border: 1px solid #44474b; border-radius: 4px; background: none; } .search_input:focus { border: 1px solid rgba(255,255,255,.4); outline: none; } .search_input.is-focus + .search_submit path { fill: rgba(255,255,255,.4); } .search_input::-webkit-search-decoration, .search_input::-webkit-search-cancel-button, .search_input::-webkit-search-results-button, .search_input::-webkit-search-results-decoration { display: none; } .dropdown { position: absolute; right: -.75em; display: block; visibility: hidden; text-align: left; opacity: 0; border-radius: .25em; background: #f4f5f7; filter: alpha(opacity=0); } .dropdown:after { position: absolute; right: 10%; bottom: 100%; width: 0; height: 0; margin-left: -.375em; content: ' '; pointer-events: none; border: solid transparent; border-width: .375em; border-color: rgba(244,245,247,0); border-bottom-color: #f4f5f7; } .dropdown_list { margin: 0; padding: 0; list-style: none; } .dropdown_list_item { font-size: .8125em; } .dropdown_list_item a { display: block; min-width: 7.9375em; padding: .375em 1em; -webkit-transition: all .1s ease; transition: all .1s ease; color: #70767f; border-bottom: 1px solid #dee1e5; } .dropdown_list_item a:hover, .dropdown_list_item a:focus { background: #e5e8ec; } .dropdown_list_item:first-child a { border-radius: .25em .25em 0 0; } .dropdown_list_item:last-child a { border-bottom: none; border-radius: 0 0 .25em .25em; } .masthead { padding: 2.5em 0 0; background: #657980 url(../images/masthead.jpg) no-repeat center center; background-size: cover; } .new-post { display: block; float: left; width: 100%; margin-bottom: 0!important; padding: .9375em; background: rgba(0,204,153,.7); } .new-post_textarea { font-family: Proxima Nova Lt,Helvetica,Arial,sans-serif; font-size: 1.25em; font-weight: 200; line-height: 1.2; resize: none; color: #fff; border: none; background: none; } .new-post_textarea:focus { outline: none; } .new-post_textarea::-webkit-input-placeholder { color: rgba(255,255,255,.5); } .new-post_textarea::-moz-placeholder { color: rgba(255,255,255,.5); } .new-post_textarea:-moz-placeholder { color: rgba(255,255,255,.5); } .new-post_textarea:-ms-input-placeholder { color: rgba(255,255,255,.5); } .new-post_textarea.placeholder { color: rgba(255,255,255,.5); } .new-post_input { padding: .625em 0; } .new-post_add { padding: .625em 0 0; } .new-post_add_video, .new-post_add_photo { font-size: .9375em; display: inline-block; float: left; } .new-post_add_video a, .new-post_add_photo a { padding: .625em; color: rgba(255,255,255,.5); } .new-post_add_video svg, .new-post_add_photo svg { width: 1.1875em; height: .8125em; margin-right: .3125em; } .new-post_add_video path, .new-post_add_photo path { -webkit-transition: fill .3s ease; transition: fill .3s ease; fill: rgba(255,255,255,.5); } .new-post_add_video:hover a, .new-post_add_video:focus a, .new-post_add_photo:hover a, .new-post_add_photo:focus a { color: #fff; } .new-post_add_video:hover path, .new-post_add_video:focus path, .new-post_add_photo:hover path, .new-post_add_photo:focus path { fill: #fff; } .new-post_add_photo a { padding-left: 0; } .new-post_add_video { margin-left: .625em; } .post-filter { position: relative; margin-top: 1.25em; margin-bottom: 0!important; } .post-filter_list { margin: 0; padding: 0; list-style: none; } .post-filter_list_item { display: inline-block; float: left; margin-right: .9375em; } .post-filter_list_item a { font-family: Proxima Nova Bd,Helvetica,Arial,sans-serif; font-size: .625em; font-weight: 700; float: left; margin-bottom: 0; padding: .625em .5em .9375em; letter-spacing: .5px; text-transform: uppercase; color: #bec3cc; border-bottom: 4px solid transparent; } .post-filter_list_item a:hover, .post-filter_list_item a:focus { color: #fff; } .post-filter_list_item.is-active a { color: #fff; border-bottom: 4px solid #0c9; } .post-filter_list_item:last-child { margin-right: 0; } .post-filter_views { float: right; margin: 0; padding: 0; list-style: none; } .post-filter_views-item { display: inline-block; margin-left: .5em; } .post-filter_views-item a { display: block; padding: .25em; } .post-filter_views-item svg { width: .5625em; height: .5625em; } .post-filter_views-item path { fill: #fff; } .post-filter_views-item.is-active path { fill: #747c83; } .post_content_message a, .post_content_meta_actions a, .post_content_expand a, .post_content_expand .caret { color: #bec3cc; } .post_content_message a:focus, .post_content_meta_actions a:focus, .post_content_expand a:focus, .post_content_expand .caret:focus, .post_content_message a:hover, .post_content_meta_actions a:hover, .post_content_expand a:hover, .post_content_expand .caret:hover { color: #a1a9b6; } .posts { padding-top: 1.5625em; } .post { margin-bottom: .625em; border: 1px solid #dee1e5; border-radius: .25em; } .post_wrapper { padding: .625em; color: #262728; } .post_avatar { display: inline-block; float: left; width: 3.125em; } .post_avatar img { border-radius: .25em; } .post_content { display: block; float: left; width: calc(100% - 3.125em); } .post_content_meta_author { font-size: .875em; display: inline-block; overflow: hidden; max-width: 80%; white-space: nowrap; text-overflow: ellipsis; color: #3f454d; } .post_content_message { padding-top: .3125em; word-wrap: break-word; color: #70767f; } .post_content_message p { font-size: .875em; margin-bottom: 0; } .post_content_meta_author, .post_content_meta_actions { display: block; float: left; width: 50%; } .post_content_meta_actions { margin: -.0625em 0 0; padding: 0; list-style: none; text-align: right; } .post_content_meta_actions li { display: inline-block; margin-left: .625em; } .post_content_meta_actions li:first-child { margin-left: 0; } .post_content_meta_actions time { font-size: .875em; position: relative; top: -.0625em; } .post_content_expand { margin-top: .625em; } .post_content_expand a { font-size: .8125em; } .post_content_expand .is-open .caret { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } .post_content_meta_like svg, .post_content_meta_reply svg { display: block; width: .8125em; height: .8125em; } .post_content_meta_like path, .post_content_meta_reply path { fill: #bec3cc; } .post_content_meta_like path:focus, .post_content_meta_like path:hover, .post_content_meta_reply path:focus, .post_content_meta_reply path:hover { fill: #a1a9b6; } .post_content_meta_posted-at { color: #bec3cc; } .post_content_thumbnail { width: calc(100% + 1.25em); margin: .5625em -.625em -.625em; cursor: pointer; } .post_content_thumbnail img { float: left; width: 100%; border-radius: 0 0 .25em .25em; } .is-video { position: relative; } .is-video:hover:after, .is-video:focus:after { background: transparent; } .is-video:hover:before, .is-video:focus:before { opacity: .5; filter: alpha(opacity=50); } .is-video:before, .is-video:after { position: absolute; display: block; content: ''; } .is-video:before { z-index: 100; top: 50%; left: 50%; width: 2.5em; height: 2.5em; -webkit-transition: all .3s ease; transition: all .3s ease; -webkit-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); transform: translate(-50%,-50%); background: url(../images/play-video.svg); } .is-video:after { top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; content: ''; -webkit-transition: all .3s ease; transition: all .3s ease; border-radius: 0 0 .25em .25em; background: rgba(0,0,0,.3); } .comments { border-top: 1px solid #eef0f2; border-radius: 0 0 .25em .25em; background: #f4f5f7; } .comments textarea { float: left; } .comment { padding: .625em; border-bottom: 1px solid #eef0f2; } .comments_reply { padding: .625em; } .comments_reply .placeholder { color: #bec3cc; } .comments-open .post_content_thumbnail img { border-radius: 0!important; } .posts_load-more { font-family: Proxima Nova Semibold,Helvetica,Arial,sans-serif; margin-bottom: 1.25em; text-align: center; } .posts_load-more a { font-size: .711875em; display: inline-block; padding: .625em 1.25em; cursor: pointer; text-transform: uppercase; color: #bec3cc; } .posts_load-more a:focus, .posts_load-more a:hover { color: #3f454d; } .settings { padding-top: 3.125em; } .settings h1 { margin-bottom: 0; } .settings section { margin-bottom: 3.125em; padding-bottom: 3.125em; border-bottom: 1px solid #dee1e5; } .settings_title { font-family: Proxima Nova Semibold,Helvetica,Arial,sans-serif; font-size: .8125em; font-weight: 700; margin-bottom: 1.5625em; letter-spacing: .015625em; text-transform: uppercase; color: #70767f; } .settings_account { margin-top: 3.125em; } .settings_account_avatar { width: 5.3125em; margin: 0 auto 1.25em; } .settings_account_avatar .btn { margin-top: .1875em; } .settings_account_avatar img { border-radius: .25em; } .settings_account_info_row { position: relative; margin-bottom: 1.25em; } .settings_account_info_row input { padding-right: 3.125em; } .settings_account_info_row:last-child { margin-bottom: 0; } .settings_account_info_row svg { position: absolute; top: 50%; left: .8125em; width: 1em; height: 1em; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .settings_account_info_row circle, .settings_account_info_row path { -webkit-transition: all .3s ease; transition: all .3s ease; fill: #bec3cc; } .settings_account_info_row.is-focus circle, .settings_account_info_row.is-focus path { fill: #0c9; } .settings_account_info_save { font-size: .8125em; position: absolute; top: 50%; right: 1.125em; cursor: pointer; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); color: #0c9; } .settings_notifications .settings_title, .settings_privacy .settings_title { margin-bottom: 2.1875em; } .settings_privacy_tags_item.is-first { margin-top: 1.5625em; } .settings_privacy_tags_item:last-child { margin-bottom: 0; } .settings_save { margin-bottom: 1.5625em; } .toggle { margin-bottom: 1.25em; } .toggle:last-child { margin-bottom: 0; } .toggle_label { font-size: 1.0625em; display: inline-block; padding-left: 4.375em; } .toggle_input { position: absolute; visibility: hidden; margin-left: -624.9375em; } .toggle_input:checked + .toggle_handle { background: #00b286; } .toggle_input:checked + .toggle_handle:before { background: #00b286; } .toggle_input:checked + .toggle_handle:after { margin-left: 1.5625em; } .toggle_handle { position: absolute; display: inline-block; float: left; width: 3.125em; height: 1.5625em; padding: 2px; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; border-radius: 60px; outline: none; background: #dee1e5; } .toggle_handle:before, .toggle_handle:after { position: absolute; top: 1px; bottom: 1px; left: 1px; display: block; content: ''; } .toggle_handle:before { right: 1px; -webkit-transition: background .4s; transition: background .4s; border-radius: 3.75em; background-color: #dee1e5; } .toggle_handle:after { width: 1.4375em; -webkit-transition: margin .4s; transition: margin .4s; border-radius: 100%; background-color: #fff; } .modal { position: fixed; z-index: 1100; top: 50%; left: 50%; width: 100%; max-width: 35.9375em; padding: .625em; -webkit-transition: -webkit-transform .2s ease; transition: transform .2s ease; -webkit-transform: scale(.7); -ms-transform: scale(.7); transform: scale(.7); opacity: 0; filter: alpha(opacity=0); } .modal.is-open { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); opacity: 1; filter: alpha(opacity=100); } .modal_overlay { position: fixed; z-index: 1000; top: 0; left: 0; display: block; width: 100%; height: 100%; -webkit-transition: background .3s ease; transition: background .3s ease; background: transparent; } .modal_overlay.is-open { background: rgba(0,0,0,.8); } .modal_wrapper { float: left; padding: .9375em; border-radius: .1875em; background: #dee1e5; } .modal_title { font-size: 1.0625em; margin-bottom: 1.125em; color: #70767f; } .modal_message { line-height: 1em; display: block; min-height: 5.625em; margin-bottom: 1em; padding: .625em; border: none; border-radius: .25em; } .modal_message:focus { outline: none; } .modal_add { font-size: .9375em; width: 100%; } .modal_add svg { display: inline-block; width: 1.1875em; height: .8125em; margin-right: .625em; } .modal_add path { fill: rgba(112,118,127,.5); } .modal_add a { display: block; float: left; padding: .3125em .625em; color: rgba(112,118,127,.5); } .modal_add_photo, .modal_add_video { display: inline-block; } .modal_add_photo:hover a, .modal_add_photo:focus a, .modal_add_video:hover a, .modal_add_video:focus a { color: #70767f; } .modal_add_photo:hover path, .modal_add_photo:focus path, .modal_add_video:hover path, .modal_add_video:focus path { fill: #70767f; } .modal_add_photo a { padding-left: 0; } .modal_submit { width: 100%; margin-top: .625em; } .modal_submit .btn { font-size: .9375em; line-height: 2.125em; float: right; width: 100%; height: 2.125em; } .modal_close { position: absolute; top: -1.5625em; right: .625em; width: 1.3125em; height: 1.3125em; } .modal_close path { -webkit-transition: all .3s ease; transition: all .3s ease; fill: #70767f; } .modal_close:hover path, .modal_close:focus path { fill: #8a9098; } .main { -webkit-transition: .5s -webkit-filter ease,.5s filter ease; transition: .5s filter ease; } .modal-open { filter: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="filter"><feGaussianBlur stdDeviation="10"/></filter></svg>#filter'); -webkit-filter: blur(.625em); filter: blur(.625em); } .post-grid { display: block; max-width: 73.4375em; margin: 0 auto; padding: 0 .9375em; } .post-grid .post_content_thumbnail { margin-bottom: 0; } .post-grid .post_content_thumbnail img { border-radius: 0!important; } .post-grid .post_content_meta_author { width: 100%; } .post-grid .post_content_message { padding-top: .46875em; } .post-grid .is-video:after { border-radius: 0; } .post-grid .comments .post_content_meta-grid { width: 100%; } .post-grid .comments .post_content_meta_actions { float: right; width: 100%; } .post_content_meta-grid { float: right; width: calc(100% - 50px); margin-bottom: -.4375em; } .post_content_meta-grid .post_content_meta_actions, .post_content_meta-grid .post_content_expand { display: inline-block; width: 50%; } .post_content_meta-grid .post_content_meta_actions { float: right; margin-top: .6875em; margin-bottom: .375em; white-space: nowrap; } .deckgrid[deckgrid]:before { font-size: 0; visibility: hidden; content: '1 .column.column-1-1'; } .deckgrid .column { float: left; } .deckgrid .column-1-1 { width: 100%; } .spinner { text-align: center; } .spinner path { fill: #0c9; } .hide { display: none!important; } .header { position: fixed; z-index: 1000; top: 0; height: 3.75em; background: #262728; } .header_logo { display: block; float: left; width: 46.288514824%; margin-right: 7.4229703521%; padding-top: 1em; } .header_logo:last-child { margin-right: 0; } .header_logo svg { max-width: 100%; } .header_components { display: block; float: left; width: 46.288514824%; margin-right: 7.4229703521%; margin-right: 0; text-align: right; white-space: nowrap; } .header_components:last-child { margin-right: 0; } .header_components_new, .header_components_search, .header_components_profile { display: inline-block; margin-top: .875em; margin-left: .9375em; vertical-align: middle; } .header_components_profile { position: relative; } .header_components_profile.is-active .dropdown { visibility: visible; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); opacity: 1; filter: alpha(opacity=100); } .header_components_profile_avatar img { border-radius: 4px; } .header_components_profile_avatar .caret { margin-top: -1.25em; } .header_components_new { margin-left: 0; } .header_components_new path { -webkit-transition: fill .3s ease; transition: fill .3s ease; fill: #0c9; } .header_components_new svg { width: 1.75em; height: 1.375em; } .header_components_new:hover path, .header_components_new:focus path { fill: #00ffbf; } .footer { padding: 1.25em 0; border-top: 1px solid #dee1e5; } .footer_nav_list { margin: 0; padding: 0; list-style: none; text-align: center; } .footer_nav_list_item { font: 700 .75em 'Proxima Nova Semibold',Helvetica,Arial,sans-serif; display: inline-block; text-transform: uppercase; color: #70767f; } .footer_nav_list_item a { padding: .3125em; } .container { max-width: 70em; margin-right: auto; margin-left: auto; padding: 0 .9375em; } .container:after { display: table; clear: both; content: ''; } @media screen and (min-width:30em) { .masthead { padding: 3.75em 0 0; } .new-post { padding: 1.5625em; } .new-post_textarea { font-size: 1.5em; } .new-post_input { padding: .625em 0 1.25em; } .post-filter { margin-top: 3.125em; } .post-filter_list_item { margin-right: 1.875em; } .post-filter_list_item a { font-size: .8125em; padding: .625em .5em 1.25em; } .posts { padding-top: 3.125em; } .post { margin-bottom: 1.5625em; } .post_wrapper { padding: 1.5625em; } .post_avatar { width: 3.625em; } .post_content { width: calc(100% - 3.625em); } .post_content_meta_author { font-size: 1.0625em; } .post_content_message { padding-top: .625em; } .post_content_message p { font-size: 1em; } .post_content_meta_actions { margin: 0; padding: .0625em 0 0; } .post_content_meta_actions li { margin-left: 1.125em; } .post_content_meta_actions time { font-size: 1em; } .post_content_expand { margin-top: 1.25em; } .post_content_thumbnail { width: calc(100% + 3.25em); margin: 1.125em -1.625em -1.5625em; } .is-video:before { width: 3.75em; height: 3.75em; } .comment { padding: 1.5625em; } .comments_reply { padding: 1.5625em; } .settings_account_avatar { display: block; float: left; width: 5.3125em; } .settings_account_info { display: block; float: left; width: calc(100% - 5.3125em); padding-left: 3.125em; } .modal_wrapper { padding: 1.5625em 1.5625em 1.0625em; } .modal_add { display: block; float: left; width: 73.144257412%; margin-right: 7.4229703521%; } .modal_add:last-child { margin-right: 0; } .modal_submit { display: block; float: left; width: 19.432772236%; margin-top: 0; margin-right: 7.4229703521%; margin-right: 0; } .modal_submit:last-child { margin-right: 0; } .modal_submit .btn { width: auto; } .post-grid .post_content_message { padding-top: .625em; } .post_content_meta-grid { width: calc(100% - 58px); margin-bottom: -.0625em; } .post_content_meta-grid .post_content_meta_actions { margin-top: 1.2875em; margin-bottom: -.4375em; } .layout { margin-bottom: 1.5625em; } } @media screen and (min-width:48em) { .search_trigger { display: none; } .search_trigger svg { width: 1.625em; height: 1.625em; } .search_submit { right: .3125em; } .masthead { padding: 6.25em 0 0; } .new-post { padding: 1.875em; } .post-filter { margin-top: 6.875em; } .post-filter_list_item { margin-right: 2.8125em; } .is-video:before { width: 5em; height: 5em; } .modal { padding: 0; } .modal_message { font-size: 1.5em; line-height: 1; min-height: 3.75em; } .modal_close { top: -1.5625em; right: -1.5625em; } .post-grid .post_content_thumbnail { margin-bottom: -.55em; } .post_content_meta-grid { margin-top: .4375em; margin-bottom: -.4375em!important; } .post_content_meta-grid .post_content_meta_actions { margin-top: 1.225em; margin-bottom: -.0625em!important; } .deckgrid[deckgrid]:before { content: '2 .column.column-1-2'; } .deckgrid .column-1-2 { width: 50%; } .deckgrid .column-1-2:first-child { padding-right: .78125em; } .deckgrid .column-1-2:last-child { padding-left: .78125em; } .header_components_new svg { width: 1.9375em; height: 1.625em; } .header_logo { display: block; float: left; width: 22.3160022949%; margin-right: 3.5786636068%; } .header_logo:last-child { margin-right: 0; } .header_components { display: block; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; float: left; width: 74.1053340983%; margin-right: 3.5786636068%; margin-right: 0; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: end; -webkit-justify-content: flex-end; -ms-flex-pack: end; justify-content: flex-end; } .header_components:last-child { margin-right: 0; } .header_components_new { padding-top: .25em; } .header_components_search { max-width: 12.5em; margin: .4375em 0 0 1.25em; } .header_components_profile { margin-left: 1.25em; cursor: pointer; } .footer { padding: 1.875em 0; } .footer_nav_list_item a { margin: 0 .75em; } .layout { display: block; float: left; width: 74.1053340983%; margin-right: 3.5786636068%; margin-left: 12.9473329508%; } .layout:last-child { margin-right: 0; } .container { width: 48em; } } @media screen and (min-width:60em) { .masthead { padding: 7.5em 0 0; } .new-post_textarea { font-size: 2em; } .post-filter { margin-top: 6.875em; } .is-video:before { width: 6.25em; height: 6.25em; } .deckgrid[deckgrid]:before { content: '3 .column.column-1-3'; } .deckgrid .column-1-3 { width: 33.3333333333%; } .deckgrid .column-1-3:first-child { padding-right: .984375em; } .deckgrid .column-1-3:nth-child(2) { padding: 0 .53125em; } .deckgrid .column-1-3:last-child { padding-left: .984375em; } .header .container { width: 100%; max-width: 87.5em; padding: 0 1.25em; } .layout { display: block; float: left; width: 65.8807828007%; margin-right: 2.3576515979%; margin-left: 17.0596085997%; } .layout:last-child { margin-right: 0; } .container { width: 60em; padding: 0; } } @media screen and (min-width:70em) { .layout { width: 51.34%; margin-right: 0; margin-left: 24.33%; } .container { width: 70em; } } @media screen and (max-width:47.9375em) { .search_form { position: absolute; z-index: -1; top: -100%; left: 0; display: block; width: 100%; padding: .625em; -webkit-transform: translateY(-100%); -ms-transform: translateY(-100%); transform: translateY(-100%); opacity: 0; background: #262728; filter: alpha(opacity=0); } .search_form.is-active { top: 3.75em; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); opacity: 1; filter: alpha(opacity=100); } } @media screen and (max-width:29.9375em) { .header_logo svg { max-width: 7.5em; margin-top: .125em; } }