/* Theme Name: AMP - Accelerated Mobile Pages Description: This is an Accelerated Mobile Pages Theme for WordPress, but it is also a complete environment for using all the functions of WP with AMP. Author: Sniuk Tags: blog, two-columns, left-sidebar, flexible-header, custom-background, custom-header, translation-ready, custom-menu, custom-logo, accessibility-ready Version: 1.2.0 Author URI: https://profiles.wordpress.org/sniuk License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Text Domain: amp-accelerated-mobile-pages */ .wp-caption-text, .gallery-caption { font-family: Arial, Tahoma, sans-serif; } .sticky .posted-on { display: none; } .screen-reader-text { clip: rect(1px, 1px, 1px, 1px); height: 1px; overflow: hidden; position: absolute; width: 1px; } .bypostauthor > article .fn:after { right: 3px; left: auto; } header.entry-header { background-color: transparent; } a code { hyphens: manual; overflow-wrap: normal; white-space: nowrap; word-break: normal; word-wrap: normal; } a { font-size: 14px; font-weight: 400; letter-spacing: .56px; line-height: 16px; text-transform: uppercase; } body { font-size: 20px; line-height: 28px; font-weight: 300; text-transform: none } .small, .post-content { color: #333; font-size: 16px; line-height: 26px } @media only screen and (max-width: 956px) { a { font-size: 12px } body { font-size: 16px; line-height: 26px } .small, .post-content { font-size: 14px } } .smaller { color: #333; font-size: 14px; line-height: 26px } .post-content a { font-size: inherit; font-weight: inherit; letter-spacing: inherit; line-height: inherit; text-transform: none } @keyframes cta-line { 0% { transform-origin: 100% 50%; transform: scaleX(1) } 45% { transform-origin: 100% 50%; transform: scaleX(0) } 55% { transform-origin: 0% 50%; transform: scaleX(0) } 100% { transform-origin: 0% 50%; transform: scaleX(1) } } html, body, blockquote, pre, hr, dl, dd, ol, ul, figure { margin: 0; padding: 0 } html, body { box-sizing: border-box; overflow-x: hidden } body { color: #000; font-family: "Roboto", sans-serif; padding-top: 80px } @media only screen and (max-width: 956px) { body { padding-top: 120px } } img { border: 0; max-width: 100% } dl { margin: 0 0 1.75em; } dt { font-weight: 700; } dd { margin: 0 0 1.75em; } h1, h2, h3, h4, h5 { color: #000; font-weight: 300; margin: 0.25em 0 } h1, h2.h1 { font-size: 50px; font-weight: 100; line-height: 65px } h2 { font-size: 40px; line-height: 50px; font-weight: 100 } h3 { font-size: 30px; line-height: 40px } h4 { font-size: 24px; line-height: 32px } @media only screen and (max-width: 956px) { h1, h2.h1 { font-size: 35px; line-height: 44px } h2 { font-size: 26px; line-height: 40px; font-weight: 300 } h3 { font-size: 20px; line-height: 28px } h4 { font-size: 18px; line-height: 26px } } a { color: #1c79c0; position: relative; text-decoration: none } a:hover { color: #888888; } a code::before { background: linear-gradient(to right, #0389ff, #0dd3ff); bottom: -3px; content: ''; left: 0; height: 1px; position: absolute; right: 0 } a code.cta { overflow: hidden } a code.cta::before { bottom: -5px; height: 2px } a code.cta:hover::before { animation: 0.5s 1 cta-line } @media only screen and (max-width: 956px) { a { font-size: 14px } } .button { background-color: #0389ff; display: inline-block; color: #fff; padding: 15px 20px; position: relative; transition: background-color 0.3s } .button span { position: relative; z-index: 1 } .button::before { background: linear-gradient(to right, #0389ff, #0dd3ff); bottom: -2px; content: ''; left: 0; height: 2px; position: absolute; right: 0 } .button::after { background: linear-gradient(36deg, #0dd3ff, #0389ff); content: ''; z-index: -1; position: absolute; top: 0; left: 0; right: 0; bottom: 0 } .button:hover { background-color: transparent } blockquote { color: #797c82; border-left: 4px solid #f9f9f9; padding-left: 15px; font-size: 18px; letter-spacing: -1px; } blockquote>:last-child { margin-bottom: 0 } p:last-child { margin-bottom: 0 } figure { -webkit-margin-before: 0; -webkit-margin-after: 0; -webkit-margin-start: 0; -webkit-margin-end: 0 } amp-youtube, amp-vimeo { box-shadow: 0px 3px 20px 0 rgba(0, 0, 0, 0.1) } .container { box-sizing: border-box; margin: 0 auto; max-width: 3000px; padding: 0 22px } .container.sm { max-width: 800px } .container.md { max-width: 925px } .container.lg { max-width: 1200px } .container.xl { max-width: 1440px } .wrap { margin: 0 auto; overflow: hidden; min-height: calc(100vh - 171px); } :target::before { content: ''; display: block; height: 110px; margin-top: -110px; visibility: hidden } @media only screen and (max-width: 956px) { :target::before { height: 70px; margin-top: -70px } } /* CSS to primary menu */ #main-nav { justify-content: center; margin-left: 60px; align-items: stretch; display: flex; } #main-nav ul { margin: 0; padding: 0; /* only needed if you have not done a CSS reset */ } #main-nav li { display: block; float: left; line-height: 30px; /* this should be the same as your #main-nav height */ height: 80px; /* this should be the same as your #main-nav height */ margin: 0; padding: 0; /* only needed if you don't have a reset */ position: relative; /* this is needed in order to position sub menus */ color: #333; font-weight: 400; margin: 0 4px; padding: 0px 20px; position: relative; transition: .1s ease color; } #main-nav li:hover { color: #1c79c0; box-shadow: 0 0 40px 0 rgba(0,0,0,.1); } #main-nav li a { color: inherit; position: relative; top: 19px; line-height: 28px; text-transform: none; } #main-nav li a:hover { /* target all sub menu item links */ color: inherit; background:inherit; } #main-nav .current-menu-item a, #main-nav .current_page_item a, #main-nav a:hover { color: #1c79c0; } #main-nav ul ul { /* this targets all sub menus */ display: none; position: absolute; top: 80px; background-color: white; box-shadow: 0 0 40px 0 rgba(0,0,0,.1); left: 0; } #main-nav ul ul li { /* this targets all submenu items */ float: none; /* overwriting our float up above */ width: 250px; /* set to the width you want your sub menus to be. This needs to match the value we set below */ height: 30px; margin:0px; padding: 0px; } #main-nav ul ul li:hover { /* this targets all submenu items */ background: #f8f8f8; box-shadow:none; } #main-nav ul ul li a { /* target all sub menu item links */ padding: 5px 10px; /* give our sub menu links a nice button feel */ line-height: 28px; top: 0px; text-transform: none; } #main-nav ul ul li a:hover { /* target all sub menu item links */ color: inherit; background:inherit; } #main-nav ul li:hover > ul { display: block; /* show sub menus when hovering over a parent */ } #main-nav ul ul li ul { /* target all second, third, and deeper level sub menus */ left: 150px; /* this needs to match the sub menu width set above -- width + padding + borders */ top: 0; /* this ensures the sub menu starts in line with its parent item */ } .header { backface-visibility: hidden; background-color: #fff; box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.1); font-size: 14px; font-weight: 300; transform: translateZ(0) } .header.fixed { left: 0; position: fixed; top: 0px; transform: translateY(0%); transition: all .4s ease; width: 100%; z-index: 1000 } .header.fixed-admin { left: 0; position: fixed; top: 32px; transform: translateY(0%); transition: all .4s ease; width: 100%; z-index: 1000 } .header .nav-container, .header .left-nav, .header .alt { display: flex } .header .nav-container { justify-content: space-between; position: relative } .header .left-nav, .header .alt { justify-content: flex-start } .header .left-nav { align-items: center; font-size: 20px; font-weight: 300; margin-left: 0 } .header .left-nav .header-title { padding: 40px 40px 40px 100px; color: #0379c4; margin: 0; text-transform: none; white-space: nowrap; width: auto } .header .left-nav .header-title-h1 { color: #0379c4; margin: 0; text-transform: none; white-space: nowrap; width: auto } .header .left-nav .header-title-h1 h1 { font-size: 30px; } .header .left-nav .header-title::after, .header .left-nav .header-title::before { display: none } .header .alt align-items: stretch } .header .alt { padding: 0 } .header .alt.right { font-size: 15px } .header .tab.hamburger { align-self: center; background: url("assets/images/hamburger.svg") no-repeat center/30px 24px transparent; border: 0; cursor: pointer; display: none; height: 40px; margin: 0; padding: 0; width: 40px } @media only screen and (max-width: 956px) { .header .container { padding-right: 18px } .header .left-nav { flex: 1 1 auto; width: auto } .header .left-nav .header-title { margin: 0; padding: 30px 30px 30px 50px; width: auto } .header #main-nav, .header .desktop { display: none } .header .tab.hamburger { display: inline-block } } .container .content { margin: 0 auto; min-width: 0; padding: 100px 0; transition: all .25s ease; width: 100%; word-break: break-word; overflow-wrap: break-word; word-wrap: break-word; word-break: break-word } .main { align-items: stretch; display: flex; margin-left: 300px; /* min-height:calc(100vh - 274px) */ } .main h1 { font-size: 40px; font-weight: 100; line-height: 50px; margin-top: 0 } .main h2 { font-size: 30px; line-height: 40px; margin-top: 30px } .main h3 { font-size: 24px; line-height: 32px; margin-top: 30px } .main h4 { font-size: 20px; line-height: 24px; margin-top: 30px } .main h5 { font-size: 18px; font-weight: 400; margin-top: 30px } .main h6 { font-size: 16px; font-weight: 400; margin-top: 30px } .main a { font-size: 16px } .main aside a { font-size: 14px } .main .content { flex-grow: 1; -webkit-flex-grow: 1; max-width: 1000px; padding-bottom: 10px; padding-top: 70px; } .main .content ul, .main .content ol { margin-left: 40px } .main amp-youtube, .main amp-iframe { margin: 1em 0 } @media only screen and (max-width: 956px) { .container .content { max-width: 100%; padding: 70px 0 } .main { flex-direction: column; margin-left: 0 } .main h1 { font-size: 26px; line-height: 40px; font-weight: 300 } .main h2 { font-size: 20px; line-height: 28px } .main h3 { font-size: 18px; line-height: 26px } .main a { font-size: 14px } } .post-title { margin: 0 0 20px 0; text-align: left; } @media only screen and (max-width: 956px) { .post-title { text-align: left } } @media only screen and (max-width: 956px) { nav li, nav a { font-size: 10px } } .doc-sidebar { bottom: 0; display: flex; flex-direction: column; left: 0; position: fixed; top: calc(80px); border-right: solid 1px #ededed; min-width: 300px; max-width: 400px; width: 20vw; z-index: 1; background: rgba(255, 255, 255, 0.7) } .doc-sidebar-admin { top: calc(112px); } .doc-sidebar .current-header { background: linear-gradient(36deg, #1573ca, #0389ff); padding: 28px 30px 5px } .doc-sidebar .current-header h1 { color: #fff } .doc-sidebar .current-header h1 { font-size: 40px } .doc-sidebar .current-sections { flex: 1 1 auto; height: 0; overflow: auto; padding-left: 10px } .doc-sidebar .current-sections>ul { border-right: 3px solid #ededed; padding: 20px 0; min-height: calc(100vh - 213px) } .doc-sidebar .current-sections h5 { padding-left: 20px; color: #3085c5; margin: 0; margin-top: 10px; font-size: 16px } .doc-sidebar .current-sections h5:first-of-type { margin-top: 0 } .doc-sidebar ul, .doc-sidebar ol, .doc-sidebar li { list-style-type: none; } .doc-sidebar li { background: none; border: none; position: relative; padding: 0; border-bottom: solid 1px #ededed; } .doc-sidebar li a { padding: 15px 0 } .doc-sidebar li .open { color: #1c79c0 } .doc-sidebar li .open::before { background: linear-gradient(to right, #1c79c0, #0389ff, #0dd3ff); bottom: 0; content: ''; right: -13px; position: absolute; top: 0; width: 3px } @media only screen and (max-width: 956px) { .doc-sidebar { border: none; border-bottom: 3px solid #ededed; display: block; margin: 0 -22px; padding: 0 22px; position: static; width: 100%; min-width: auto; max-width: none } .doc-sidebar .current-header { background: white; padding: 0px 30px } .doc-sidebar .current-header h1 { color: #333; margin-bottom: 0 } .doc-sidebar .current-sections { height: auto; padding: 5px 20px 30px } .doc-sidebar .current-sections>ul { min-height: auto; border-right: 0 } .doc-sidebar .current-sections h5 { padding-left: 15px } } .doc-footer { align-items: stretch; display: flex; margin-left: 300px; box-sizing: border-box; padding: 0 22px; border-top: solid 1px #ededed; margin-top: 0; padding: 30px 0 30px; background-color: #f4f4f4; max-width: 3000px; } .doc-footer footer { background: transparent; padding: 0 22px; flex-grow: 1; -webkit-flex-grow: 1; max-width: 1000px; margin: 0 auto; } .doc-footer footer a { text-transform: none; } .doc-footer footer ul { list-style: none; } .doc-footer footer ul li { display: block; float: left; line-height: 30px; margin: 0 4px; padding: 0 20px; } @media only screen and (max-width: 956px) { .doc-footer { border: 0; margin-left: 0 } } pre, code, kbd, samp, tt { font-family: "Roboto Mono", Menlo, Monaco, Consolas, "Courier New", monospace; font-size: 14px; color: #333; background: #f5f5f5; box-shadow: inset 0px 1px 4px #d6d6d6; border-radius: 2px } code { padding: 2px 5px; margin: 0 2px } a code { color: #333; white-space: nowrap } a:hover code { color: #1c79be } h1 code, h2 code, h3 code, h4 code, h5 code { background: none; border: 0; font-size: 0.9em } pre { border: 1px solid #d1d1d1; font-size: 16px; font-size: 1rem; line-height: 1.3125; margin: 0 0 1.75em; max-width: 100%; overflow: auto; padding: 1.75em; white-space: pre; white-space: pre-wrap; word-wrap: break-word; } pre>code { white-space: pre; word-wrap: initial; display: block } pre>code td { border: 0 } @media only screen and (max-width: 956px) { .code pre { margin: 0 -25px } code { font-size: 13px } table a code { line-height: 2; white-space: normal } } aside { background: #fafafa; display: block; font-size: 14px; line-height: 24px; margin: 16px 0; padding: 24px 24px 24px 30px; position: relative; clear: both; } aside strong { color: #0389ff; text-transform: uppercase } aside code { font-size: 13px } aside::before { float: left; word-wrap: normal; white-space: nowrap; margin-left: -36px; content: ''; height: 70px; left: 44px; position: absolute; top: 50%; transform: translateY(-50%); width: 70px } .card-container { box-sizing: border-box; display: flex; justify-content: space-between; padding: 20px 5px } .card-container.grid { flex-wrap: wrap } .card-container.grid::after { content: ''; display: block; flex: 0 0 31%; flex: 0 0 calc(33% - 30px); flex-basis: calc(33% - 30px); margin: 10px 5px; visibility: hidden } amp-accordion section { border-bottom: 2px solid #ededed } @media only screen and (max-width: 956px) { amp-accordion section { border-bottom: 1px solid #ededed } } amp-sidebar { background: #fff; width: 100vw } amp-sidebar input[type="checkbox"] { position: absolute; visibility: hidden } .mobile-menu-ul { display: none; } amp-sidebar .mobile-menu-ul li { border-bottom: solid 1px #ededed; color: #000; display: block; position: relative; text-transform: none } amp-sidebar .close-button { background: url("assets/images/close.svg") no-repeat center/18px transparent; border: 0; height: 58px; position: absolute; right: 13px; top: 0; width: 68px; cursor: pointer; } footer { background-color: #fff; padding: 20px 0; position: relative } footer a { line-height: 0px; } footer .footer-image { margin: 0 10px } .nav-links a { background-color: #0389ff; display: inline-block; color: #fff; padding: 15px 20px; position: relative; transition: background-color 0.3s } .nav-links a span { position: relative; z-index: 1 } .nav-links a::before { background: linear-gradient(to right, #0389ff, #0dd3ff); bottom: -2px; content: ''; left: 0; height: 2px; position: absolute; right: 0; } .nav-links a::after { background: linear-gradient(36deg, #0dd3ff, #0389ff); content: ''; z-index: -1; position: absolute; top: 0; left: 0; right: 0; bottom: 0 } .nav-links a:hover { background-color: transparent } .nav-links .current { background-color: #30628d; display: inline-block; color: #fff; padding: 10px 20px; position: relative; transition: background-color 0.3s; line-height: 23px; height: 28px; } .post-item { border-bottom: solid 1px #ededed; padding: 30px 0 40px 0; width: 100%; } #comments { border-top: 1px solid #ededed; flex-grow: 1; -webkit-flex-grow: 1; max-width: 1000px; min-width: 0; transition: all .25s ease; width: 100%; word-break: break-word; overflow-wrap: break-word; word-wrap: break-word; word-break: break-word; margin: 0 auto; } .comment-list { list-style: none; margin: 0; } .comments-area { border: 0; padding: 7.6923% 0 0; } .comment-meta { position: relative; padding: 0px; padding-top: 10px; } .comment-content { -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; word-wrap: break-word; } .comment-content h1 { font-size: 26px; font-size: 2.6rem; line-height: 1.1538; margin-top: 1.8462em; margin-bottom: 0.9231em; } .comment-content h2 { font-size: 22px; font-size: 2.2rem; line-height: 1.3636; margin-top: 2.1818em; margin-bottom: 1.0909em; } .comment-content h3 { font-size: 18px; font-size: 1.8rem; line-height: 1.3333; margin-top: 2.6667em; margin-bottom: 1.3333em; } .comment-content h4, .comment-content h5, .comment-content h6 { font-size: 15px; font-size: 1.5rem; line-height: 1.2; margin-top: 3.2em; margin-bottom: 1.6em; } .comment-content > h1:first-child, .comment-content > h2:first-child, .comment-content > h3:first-child, .comment-content > h4:first-child, .comment-content > h5:first-child, .comment-content > h6:first-child { margin-top: 0; } .comment-content a, .pingback .comment-body > a { border-bottom: 1px solid #333; } .comment-content a:hover, .comment-content a:focus, .pingback .comment-body > a:hover, .pingback .comment-body > a:focus { border-bottom: 0; } .comment-content a img { display: block; } .comments-link:before { content: "\f300"; } .comments-area { background-color: #fff; border-top: 1px solid #eaeaea; border-top: 1px solid rgba(51, 51, 51, 0.1); padding: 7.6923%; } .comment-list + .comment-respond { border-top: 1px solid #eaeaea; border-top: 1px solid rgba(51, 51, 51, 0.1); } .comment-list + .comment-respond, .comment-navigation + .comment-respond { padding-top: 1.6em; } .comment-list article, .comment-list .pingback, .comment-list .trackback { border-top: 1px solid #eaeaea; border-top: 1px solid rgba(51, 51, 51, 0.1); /* padding: 1.6em 0; */ } .comment-list .children { list-style: none; margin: 0; } .comment-list .children > li { padding-left: 0.8em; } .comment-author { color: #707070; color: rgba(51, 51, 51, 0.7); margin-bottom: 0.4em; } .comment-author a:hover { border-bottom: 1px solid #707070; border-bottom: 1px solid rgba(51, 51, 51, 0.7); } .comment-author .avatar { float: left; /* height: 24px; */ margin-right: 0.8em; /* width: 24px; */ margin-top: .3em; } .comment-metadata, .pingback .edit-link { color: #707070; color: rgba(51, 51, 51, 0.7); font-family: "Noto Sans", sans-serif; font-size: 12px; font-size: 1.2rem; line-height: 1.5; } .comment-metadata a, .pingback .edit-link a { color: #707070; color: rgba(51, 51, 51, 0.7); text-transform: none; } .comment-metadata a:hover, .pingback .edit-link a:hover { border-bottom: 1px solid #333; } .comment-metadata a:hover, .comment-metadata a:focus, .pingback .edit-link a:hover, .pingback .edit-link a:focus { color: #333; } .comment-metadata { margin-bottom: 1.6em; } .comment-metadata .edit-link { margin-left: 1em; } .pingback .edit-link { margin-left: 1em; } .pingback .edit-link:before { top: 5px; } .comment-content ul, .comment-content ol { margin: 0 0 1.6em 1.3333em; } .comment-content li > ul, .comment-content li > ol { margin-bottom: 0; } .comment-content >:last-child { margin-bottom: 0; } .comment-list .reply { font-size: 12px; font-size: 1.2rem; } .comment-list .reply a { border: 1px solid #eaeaea; border: 1px solid rgba(51, 51, 51, 0.1); color: #707070; color: rgba(51, 51, 51, 0.7); display: inline-block; font-family: "Noto Sans", sans-serif; font-weight: 700; line-height: 1; margin-top: 2em; padding: 0.4167em 0.8333em; } .comment-list .reply a:hover, .comment-list .reply a:focus { border-color: #333; color: #333; outline: 0; } .comment-form label { color: #707070; color: rgba(51, 51, 51, 0.7); font-family: "Noto Sans", sans-serif; font-size: 12px; font-size: 1.2rem; font-weight: 700; display: block; letter-spacing: 0.04em; line-height: 1.5; } .comment-form input[type="text"], .comment-form input[type="email"], .comment-form input[type="url"] { width: 100%; } .comment-notes, .comment-awaiting-moderation, .logged-in-as, .form-allowed-tags { color: #707070; color: rgba(51, 51, 51, 0.7); font-family: "Noto Sans", sans-serif; font-size: 12px; font-size: 1.2rem; line-height: 1.5; margin-bottom: 2em; } .logged-in-as a:hover { border-bottom: 1px solid #333; } .no-comments { border-top: 1px solid #eaeaea; border-top: 1px solid rgba(51, 51, 51, 0.1); color: #707070; color: rgba(51, 51, 51, 0.7); font-family: "Noto Sans", sans-serif; font-weight: 700; padding-top: 1.6em; } .comment-navigation + .no-comments { border-top: 0; } .form-allowed-tags code { font-family: Inconsolata, monospace; } .form-submit { margin-bottom: 0; } .required { color: #c0392b; } .comment-reply-title small { font-size: 100%; } .comment-reply-title small a { border: 0; float: right; height: 32px; overflow: hidden; width: 26px; } .comment-reply-title small a:before { content: "\f405"; font-size: 32px; position: relative; top: -3px; } #comments input, textarea { background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0)); border: 1px solid #eaeaea; border: 1px solid rgba(51, 51, 51, 0.1); color: #707070; color: rgba(51, 51, 51, 0.7); background-color: #f7f7f7; border-radius: 0; font-size: 16px; font-size: 1.6rem; line-height: 1.5; margin: 0; max-width: 100%; } #comments textarea { width: 100%; height: 70px; } #comments input[type="submit"] { width: 100%; -webkit-appearance: button; background: linear-gradient(to right, #0389ff, #0dd3ff); background-color: #0389ff; border: 0; color: #fff; cursor: pointer; font-family: "Noto Sans", sans-serif; font-size: 12px; font-size: 1.2rem; font-weight: 700; padding: 0.7917em 1.5em; transition: background-color 0.3s; } #comments input[type="submit"]:hover, #comments input[type="submit"]:focus { background: linear-gradient(36deg, #0dd3ff, #0389ff); background-color: #1f5e95; outline: 0; } a.post-thumbnail { float: left; margin-right: 20px; } a.post-thumbnail amp-img { margin-top: 22px; } .entry-footer a { display: block; text-transform:none; font-weight: 300; line-height: 20px; } .entry-footer a time { margin-right: 10px; } .entry-footer amp-img { float: left; margin: 0px 5px 5px 5px; } .post-list-meta time { margin-right: 10px; } amp-sidebar .mobile-menu-ul { margin-top: 57px; margin-left: 10px; } amp-sidebar .mobile-menu-ul li ul li { margin-left: 20px; } amp-sidebar .mobile-menu-ul li ul li:first-child { border-top: solid 1px #ededed; } amp-sidebar .mobile-menu-ul li ul li:last-child { border-bottom: 0px; } .search-form { position: relative; } input[type="search"] { color: #666; background: #fff; background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0)); border: 1px solid #bbb; -webkit-border-radius: 3px; border-radius: 3px; display: block; padding: 0.7em; width: 100%; -webkit-appearance: textfield; outline-offset: -2px; font-size: 1rem; line-height: 1.2; } .search-form .search-submit { bottom: 3px; padding: 0.5em 1em; position: absolute; right: 3px; top: 3px; background: linear-gradient(to right, #0389ff, #0dd3ff); background-color: #0389ff; border: 0; color: #fff; cursor: pointer; font-family: "Noto Sans", sans-serif; font-size: 12px; font-weight: 700; transition: background-color 0.3s; border-radius: 2px; } .search-form .search-submit:hover { background: linear-gradient(36deg, #0dd3ff, #0389ff); background-color: #1f5e95; } .search-icon { background: url("assets/images/search.svg") center/cover no-repeat; padding: .5em 1em; } .tags-links { display: block; font-size: 16px; } .tags-links:before { content: "# "; color: #1c79c0; } .tags-links a { display: inline; font-size: 16px; letter-spacing: 0.1818em; } .post-list-meta a { color: #333; } .post-list-meta a:hover { color: #888888; } .updated:not(.published) { display: none; } .wp-caption.alignright, .alignright { float: right; margin: 0.375em 0 1.75em 1.75em; } .alignleft { float: left; margin: 0.375em 1.75em 1.75em 0; } .aligncenter { clear: both; display: block; margin: 0 auto 1.75em; } blockquote.alignleft { margin: 0.3157894737em 1.4736842105em 1.473684211em 0; } blockquote.alignright { margin: 0.3157894737em 0 1.473684211em 1.4736842105em; } blockquote.aligncenter { margin-bottom: 1.473684211em; } .post-navigation { font-weight: 800; margin: 3em 0; } .post-navigation .nav-links { padding: 1em 0; } .nav-subtitle { background: transparent; display: block; font-size: 11px; font-size: 0.6875rem; letter-spacing: 0.1818em; margin-bottom: 1em; text-transform: uppercase; } .nav-title { font-size: 15px; font-size: 0.9375rem; } .post-navigation .nav-next { margin-top: 1.5em; } .nav-links .nav-previous .nav-title .nav-title-icon-wrapper { margin-right: 0.5em; } .nav-links .nav-next .nav-title .nav-title-icon-wrapper { margin-left: 0.5em; } .nav-links a span.screen-reader-text { position: absolute; } .post-item .more-link:before { content: ""; display: block; margin-top: 1.5em; }