@charset "UTF-8"; /*-------------------------------------------------------------- >>> TABLE OF CONTENTS: ---------------------------------------------------------------- # Normalize # Typography # Elements # Forms # Navigation ## Links ## Menus # Accessibility # Alignments # Clearings # Widgets # Content ## Posts and pages ## Asides ## Comments # Infinite scroll # Media ## Captions ## Galleries --------------------------------------------------------------*/ /*-------------------------------------------------------------- # Normalize --------------------------------------------------------------*/ html, body, p, ol, ul, li, dl, dt, dd, blockquote, figure, fieldset, legend, textarea, pre, iframe, address, hr, h1, h2, h3, h4, h5, h6 { border: 0; font-size: 100%; font-style: inherit; font-weight: inherit; margin: 0; outline: 0; padding: 0; vertical-align: baseline; } html { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; } body { margin: 0; } main, nav { display: block; } progress { display: inline-block; vertical-align: baseline; } a { background-color: transparent; } a:active { outline: 0; } a, a:visited, a:hover, a:focus { text-decoration: none; } abbr[title] { border-bottom: 1px dotted; } b, strong { font-weight: bold; } dfn { font-style: italic; } mark { background: #ff0; color: #000; } small { font-size: 80%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } img { border: 0; } svg:not(:root) { overflow: hidden; } figure { margin: 0; } hr { box-sizing: content-box; height: 0; } pre { overflow: auto; } code, kbd, pre, samp { font-size: 1em; } button, input, optgroup, select, textarea { color: inherit; font: inherit; margin: 0; } button { overflow: visible; } button, select { text-transform: none; } button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; } button[disabled], html input[disabled] { cursor: default; } button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } input { line-height: normal; } input[type="checkbox"], input[type="radio"] { 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"] { -webkit-appearance: textfield; box-sizing: content-box; } .search .search-submit, #comments .submit { padding: 10px 15px; border-radius: 2px; line-height: 1.85714285714286; border: 0; } .search .site-main .ast-search-submit { display: none; } input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } fieldset { border: 1px solid #eaeaea; margin: 0 0px; padding: 0.35em 0.625em 0.75em; } legend { border: 0; padding: 0; } fieldset legend { margin-bottom: 1.5em; padding: 0 0.5em; } textarea { overflow: auto; } optgroup { font-weight: bold; } table { border-collapse: collapse; border-spacing: 0; } td, th { padding: 0; } /*-------------------------------------------------------------- # Bootstrap Grid --------------------------------------------------------------*/ /*! * Bootstrap v4.0.0-alpha.2 (https://getbootstrap.com) */ .ast-container { max-width: 100%; } .ast-container-fluid, .ast-container { margin-left: auto; margin-right: auto; padding-left: 20px; padding-right: 20px; } .ast-container-fluid::after, .ast-container::after { content: ""; display: table; clear: both; } .ast-col-xs-1, .ast-col-xs-2, .ast-col-xs-3, .ast-col-xs-4, .ast-col-xs-5, .ast-col-xs-6, .ast-col-xs-7, .ast-col-xs-8, .ast-col-xs-9, .ast-col-xs-10, .ast-col-xs-11, .ast-col-xs-12, .ast-col-sm-1, .ast-col-sm-2, .ast-col-sm-3, .ast-col-sm-4, .ast-col-sm-5, .ast-col-sm-6, .ast-col-sm-7, .ast-col-sm-8, .ast-col-sm-9, .ast-col-sm-10, .ast-col-sm-11, .ast-col-sm-12, .ast-col-md-1, .ast-col-md-2, .ast-col-md-3, .ast-col-md-4, .ast-col-md-5, .ast-col-md-6, .ast-col-md-7, .ast-col-md-8, .ast-col-md-9, .ast-col-md-10, .ast-col-md-11, .ast-col-md-12, .ast-col-lg-1, .ast-col-lg-2, .ast-col-lg-3, .ast-col-lg-4, .ast-col-lg-5, .ast-col-lg-6, .ast-col-lg-7, .ast-col-lg-8, .ast-col-lg-9, .ast-col-lg-10, .ast-col-lg-11, .ast-col-lg-12, .ast-col-xl-1, .ast-col-xl-2, .ast-col-xl-3, .ast-col-xl-4, .ast-col-xl-5, .ast-col-xl-6, .ast-col-xl-7, .ast-col-xl-8, .ast-col-xl-9, .ast-col-xl-10, .ast-col-xl-11, .ast-col-xl-12 { position: relative; min-height: 1px; padding-left: 20px; padding-right: 20px; } .ast-col-xs-1, .ast-col-xs-2, .ast-col-xs-3, .ast-col-xs-4, .ast-col-xs-5, .ast-col-xs-6, .ast-col-xs-7, .ast-col-xs-8, .ast-col-xs-9, .ast-col-xs-10, .ast-col-xs-11, .ast-col-xs-12 { float: left; } .ast-col-xs-1 { width: 8.3333333333%; } .ast-col-xs-2 { width: 16.6666666667%; } .ast-col-xs-3 { width: 25%; } .ast-col-xs-4 { width: 33.3333333333%; } .ast-col-xs-5 { width: 41.6666666667%; } .ast-col-xs-6 { width: 50%; } .ast-col-xs-7 { width: 58.3333333333%; } .ast-col-xs-8 { width: 66.6666666667%; } .ast-col-xs-9 { width: 75%; } .ast-col-xs-10 { width: 83.3333333333%; } .ast-col-xs-11 { width: 91.6666666667%; } .ast-col-xs-12 { width: 100%; } @media (min-width: 544px) { .ast-col-sm-1, .ast-col-sm-2, .ast-col-sm-3, .ast-col-sm-4, .ast-col-sm-5, .ast-col-sm-6, .ast-col-sm-7, .ast-col-sm-8, .ast-col-sm-9, .ast-col-sm-10, .ast-col-sm-11, .ast-col-sm-12 { float: left; } .ast-col-sm-1 { width: 8.3333333333%; } .ast-col-sm-2 { width: 16.6666666667%; } .ast-col-sm-3 { width: 25%; } .ast-col-sm-4 { width: 33.3333333333%; } .ast-col-sm-5 { width: 41.6666666667%; } .ast-col-sm-6 { width: 50%; } .ast-col-sm-7 { width: 58.3333333333%; } .ast-col-sm-8 { width: 66.6666666667%; } .ast-col-sm-9 { width: 75%; } .ast-col-sm-10 { width: 83.3333333333%; } .ast-col-sm-11 { width: 91.6666666667%; } .ast-col-sm-12 { width: 100%; } } @media (min-width: 768px) { .ast-col-md-1, .ast-col-md-2, .ast-col-md-3, .ast-col-md-4, .ast-col-md-5, .ast-col-md-6, .ast-col-md-7, .ast-col-md-8, .ast-col-md-9, .ast-col-md-10, .ast-col-md-11, .ast-col-md-12 { float: left; } .ast-col-md-1 { width: 8.3333333333%; } .ast-col-md-2 { width: 16.6666666667%; } .ast-col-md-3 { width: 25%; } .ast-col-md-4 { width: 33.3333333333%; } .ast-col-md-5 { width: 41.6666666667%; } .ast-col-md-6 { width: 50%; } .ast-col-md-7 { width: 58.3333333333%; } .ast-col-md-8 { width: 66.6666666667%; } .ast-col-md-9 { width: 75%; } .ast-col-md-10 { width: 83.3333333333%; } .ast-col-md-11 { width: 91.6666666667%; } .ast-col-md-12 { width: 100%; } } @media (min-width: 992px) { .ast-col-lg-1, .ast-col-lg-2, .ast-col-lg-3, .ast-col-lg-4, .ast-col-lg-5, .ast-col-lg-6, .ast-col-lg-7, .ast-col-lg-8, .ast-col-lg-9, .ast-col-lg-10, .ast-col-lg-11, .ast-col-lg-12 { float: left; } .ast-col-lg-1 { width: 8.3333333333%; } .ast-col-lg-2 { width: 16.6666666667%; } .ast-col-lg-3 { width: 25%; } .ast-col-lg-4 { width: 33.3333333333%; } .ast-col-lg-5 { width: 41.6666666667%; } .ast-col-lg-6 { width: 50%; } .ast-col-lg-7 { width: 58.3333333333%; } .ast-col-lg-8 { width: 66.6666666667%; } .ast-col-lg-9 { width: 75%; } .ast-col-lg-10 { width: 83.3333333333%; } .ast-col-lg-11 { width: 91.6666666667%; } .ast-col-lg-12 { width: 100%; } } @media (min-width: 1200px) { .ast-col-xl-1, .ast-col-xl-2, .ast-col-xl-3, .ast-col-xl-4, .ast-col-xl-5, .ast-col-xl-6, .ast-col-xl-7, .ast-col-xl-8, .ast-col-xl-9, .ast-col-xl-10, .ast-col-xl-11, .ast-col-xl-12 { float: left; } .ast-col-xl-1 { width: 8.3333333333%; } .ast-col-xl-2 { width: 16.6666666667%; } .ast-col-xl-3 { width: 25%; } .ast-col-xl-4 { width: 33.3333333333%; } .ast-col-xl-5 { width: 41.6666666667%; } .ast-col-xl-6 { width: 50%; } .ast-col-xl-7 { width: 58.3333333333%; } .ast-col-xl-8 { width: 66.6666666667%; } .ast-col-xl-9 { width: 75%; } .ast-col-xl-10 { width: 83.3333333333%; } .ast-col-xl-11 { width: 91.6666666667%; } .ast-col-xl-12 { width: 100%; } } .ast-row { margin-left: -20px; margin-right: -20px; } .ast-row::after { content: ""; display: table; clear: both; } /*-------------------------------------------------------------- # Site Variables --------------------------------------------------------------*/ /*---------- Font Size ----------*/ /*---------- Line Height ----------*/ /*---------- Site Basic Structure ----------*/ /*---------- z-index Structure ----------*/ /*-------------------------------------------------------------- # Mixins --------------------------------------------------------------*/ /*-------------------------------------------------------------- # Typography --------------------------------------------------------------*/ h1, h2, h3, h4, h5, h6 { clear: both; } h1, .entry-content h1 { color: #808285; font-size: 2em; line-height: 1.2; } h2, .entry-content h2 { color: #808285; font-size: 1.7em; line-height: 1.3; } h3, .entry-content h3 { color: #808285; font-size: 1.5em; line-height: 1.4; } h4, .entry-content h4 { color: #808285; line-height: 1.5; font-size: 1.3em; } h5, .entry-content h5 { color: #808285; line-height: 1.6; font-size: 1.2em; } h6, .entry-content h6 { color: #808285; line-height: 1.7; font-size: 1.1em; } /*-------------------------------------------------------------- # Elements --------------------------------------------------------------*/ html { box-sizing: border-box; } *, *:before, *:after { /* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see https://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */ box-sizing: inherit; } body { color: #808285; background: #ffffff; /* Fallback for when there is no custom background color defined. */ font-style: normal; } ul, ol { margin: 0 0 1.5em 3em; } ul { list-style: disc; } ol { list-style: decimal; } li > ul, li > ol { margin-bottom: 0; margin-left: 1.5em; } dt { font-weight: bold; } dd { margin: 0 1.5em 1.5em; } b, strong { font-weight: bold; } dfn, cite, em, i { font-style: italic; } blockquote, q { quotes: "" ""; } blockquote:before, blockquote:after, q:before, q:after { content: ""; } blockquote { border-left: 5px solid rgba(0, 0, 0, 0.05); padding: 20px; font-size: 1.2em; font-style: italic; margin: 0 0 1.5em; position: relative; } address { margin: 0 0 1.5em; } abbr, acronym { border-bottom: 1px dotted #666; cursor: help; } pre { background: #eee; font-family: "Courier 10 Pitch", Courier, monospace; margin-bottom: 1.6em; overflow: auto; max-width: 100%; padding: 1.6em; } code, kbd, tt, var { font: 15px Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace; } img { height: auto; /* Make sure images are scaled correctly. */ max-width: 100%; /* Adhere to container width. */ } hr { background-color: #ccc; border: 0; height: 1px; margin-bottom: 1.5em; } .ast-button, .button, button, input, select, textarea { color: #808285; font-weight: normal; font-size: 100%; /* Corrects font size not being inherited in all browsers */ margin: 0; /* Addresses margins set differently in IE6/7, F3/4, S5, Chrome */ vertical-align: baseline; /* Improves appearance and consistency in all browsers */ } button, input { line-height: normal; /* Addresses FF3/4 setting line-height using !important in the UA stylesheet */ } big { font-size: 125%; } mark, ins { background: transparent; text-decoration: none; } table, th, td { border: 1px solid rgba(0, 0, 0, 0.1); } table { border-collapse: separate; border-spacing: 0; border-width: 1px 0 0 1px; margin: 0 0 1.5em; width: 100%; } th { font-weight: bold; } th, td { padding: 8px; border-width: 0 1px 1px 0; } /*-------------------------------------------------------------- # Forms --------------------------------------------------------------*/ button, .ast-button, .button, input[type="button"], input[type="reset"], input[type="submit"] { border: 1px solid; border-color: #eaeaea; border-radius: 2px; background: #e6e6e6; padding: .6em 1em .4em; color: #fff; } button:hover, button:focus, .ast-button:hover, .ast-button:focus, .button:hover, .button:focus, input[type="button"]:hover, input[type="button"]:focus, input[type="reset"]:hover, input[type="reset"]:focus, input[type="submit"]:hover, input[type="submit"]:focus { color: #fff; border-color: #eaeaea; } button:active, button:focus, .ast-button:active, .ast-button:focus, .button:active, .button:focus, input[type="button"]:active, input[type="button"]:focus, input[type="reset"]:active, input[type="reset"]:focus, input[type="submit"]:active, input[type="submit"]:focus { border-color: #eaeaea; outline: none; } input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="tel"], textarea { color: #666; border: 1px solid #ccc; border-radius: 2px; -webkit-appearance: none; } input[type="text"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="tel"]:focus, textarea:focus { color: #111; } textarea { padding-left: 3px; width: 100%; } /*-------------------------------------------------------------- # Navigation --------------------------------------------------------------*/ /*-------------------------------------------------------------- ## Links --------------------------------------------------------------*/ a { color: royalblue; } a:hover, a:focus { color: midnightblue; } a:focus { outline: thin dotted; } a:hover { outline: 0; } /*-------------------------------------------------------------- # Accessibility --------------------------------------------------------------*/ /* Text meant only for screen readers. */ .screen-reader-text { border: 0; clip: rect(1px, 1px, 1px, 1px); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; word-wrap: normal !important; } .screen-reader-text:focus { background-color: #f1f1f1; border-radius: 2px; box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); clip: auto !important; color: #21759b; display: block; font-size: 12.25px; font-size: 0.875rem; height: auto; left: 5px; line-height: normal; padding: 15px 23px 14px; text-decoration: none; top: 5px; width: auto; z-index: 100000; /* Above WP toolbar. */ } .alignleft { display: inline; float: left; margin-right: 1.5em; } .alignright { display: inline; float: right; margin-left: 1.5em; } .aligncenter { clear: both; text-align: center; display: block; margin-left: auto; margin-right: auto; } .clear:before, .clear:after, .site-header:before, .site-header:after, .site-content:before, .site-content:after, #primary:before, #primary:after, .site-main:before, .site-main:after, #secondary:before, #secondary:after, .sidebar-main:before, .sidebar-main:after, .site-footer:before, .site-footer:after, .ast-row:before, .ast-row:after, .ast-container:before, .ast-container:after { content: ""; display: table; } .clear:after, .site-header:after, .site-content:after, #primary:after, .site-main:after, #secondary:after, .sidebar-main:after, .site-footer:after, .ast-row:after, .ast-container:after { clear: both; } /*-------------------------------------------------------------- # Media --------------------------------------------------------------*/ /* Make sure embeds and iframes fit their containers. */ embed, iframe, object { max-width: 100%; } /*-------------------------------------------------------------- ## Captions --------------------------------------------------------------*/ .wp-caption { margin-bottom: 1.5em; max-width: 100%; } .wp-caption img[class*="wp-image-"] { display: block; margin-left: auto; margin-right: auto; } .wp-caption .wp-caption-text { margin: 0.8075em 0; } .wp-caption-text { text-align: center; } /*-------------------------------------------------------------- # Content --------------------------------------------------------------*/ /*---------- Mixins ----------*/ /*---------- Site Variables ----------*/ /*---------- Media Query min-width Structure ----------*/ /*---------- Media Query max-width Structure ----------*/ /*---------- Break-point min-width Structure ----------*/ /*---------- Break-point max-width Structure ----------*/ /*---------- Site Normalize ----------*/ ::selection { color: #fff; background: #0274be; } body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } body:not(.logged-in) { position: relative; } #page { position: relative; } a, a:focus { text-decoration: none; } a, .site-header a *, .site-footer a *, .secondary a * { transition: all 0.2s linear; } .capitalize { text-transform: uppercase; } img { vertical-align: middle; } .entry-content h1, .entry-content h2, .entry-content h3, .entry-content h4, .entry-content h5, .entry-content h6 { margin-bottom: 20px; } p { margin-bottom: 1.75em; } blockquote { margin: 1.5em 1em 1.5em 3em; font-size: 1.1em; line-height: inherit; position: relative; } .ast-button, .button, input[type="button"], input[type="submit"] { border-radius: 0; padding: 18px 30px; border: 0; box-shadow: none; text-shadow: none; } .ast-button:hover, .button:hover, input[type="button"]:hover, input[type="submit"]:hover { box-shadow: none; } .ast-button:active, .ast-button:focus, .button:active, .button:focus, input[type="button"]:active, input[type="button"]:focus, input[type="submit"]:active, input[type="submit"]:focus { box-shadow: none; } .site-title { font-weight: normal; } .site-title, .site-description { margin-bottom: 0; } .site-title a, .site-title:hover a, .site-title:focus a, .site-description a, .site-description:hover a, .site-description:focus a { transition: all 0.2s linear; } .site-title a, .site-title a:focus, .site-title a:hover, .site-title a:visited { color: #222; } .site-description a, .site-description a:focus, .site-description a:hover, .site-description a:visited { color: #999; } .search-form .search-field { outline: none; } .ast-search-menu-icon { position: relative; z-index: 3; } /* must have higher specificity than alternative color schemes inline styles */ .site .skip-link { background-color: #f1f1f1; box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.2); color: #21759b; display: block; font-family: Montserrat, "Helvetica Neue", sans-serif; font-size: 14px; font-weight: 700; left: -9999em; outline: none; padding: 15px 23px 14px; text-decoration: none; text-transform: none; top: -9999em; } .site .skip-link:focus { clip: auto; height: auto; left: 6px; top: 7px; width: auto; z-index: 100000; outline: thin dotted; } .logged-in .site .skip-link { box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.2); font-family: "Open Sans", sans-serif; } select, input { line-height: 1; } body, button, input[type="button"], input[type="submit"], textarea, .ast-button, .ast-custom-button { line-height: 1.85714285714286; } .site-title a { line-height: 1.2; } .site-header .site-description { line-height: 1.5; } .ast-single-post .entry-title, .ast-single-post .entry-title a { line-height: 1.2; } .entry-title, .entry-title a { font-weight: normal; } /*---------- Media ----------*/ /* Astra Respnosive oEmbed Video container */ .ast-oembed-container { position: relative; padding-top: 56.25%; height: 0; overflow: hidden; max-width: 100%; height: auto; } .ast-oembed-container iframe, .ast-oembed-container object, .ast-oembed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } body .ast-oembed-container * { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /*---------- Basic Layout ----------*/ .ast-hidden { display: none !important; } body { background-color: #ffffff; } #page { display: block; } #primary, #secondary { display: block; position: relative; float: left; width: 100%; } #primary { margin: 4em 0; } .ast-separate-container { background-color: #f5f5f5; } .ast-separate-container #primary { padding: 4em 0; margin: 0; border: 0; } .ast-separate-container .site-main > .ast-row { margin-left: 0; margin-right: 0; } .ast-separate-container .ast-article-post, .ast-separate-container .ast-article-single:not(.ast-related-post) { background-color: #fff; } .ast-separate-container .ast-article-post, .ast-separate-container .ast-article-single { border-bottom: 1px solid #eeeeee; margin: 0; padding: 5.34em 6.67em; } .ast-separate-container .blog-layout-1 { padding: 0; border-bottom: 0; } .ast-separate-container .ast-article-single { border-bottom: 0; } @media (max-width: 1200px) { .ast-separate-container .ast-article-post, .ast-separate-container .ast-article-single { margin: 0; padding: 3.34em 2.4em; } } .ast-page-builder-template .hentry { margin: 0; } .ast-page-builder-template .site-content > .ast-container { max-width: 100%; padding: 0; } .ast-page-builder-template .site-content #primary { padding: 0; margin: 0; } .ast-page-builder-template .no-results { text-align: center; margin: 4em auto; } .ast-page-builder-template .entry-header { margin-top: 4em; margin-left: auto; margin-right: auto; padding-left: 20px; padding-right: 20px; } .ast-page-builder-template .entry-header.ast-no-title.ast-no-thumbnail { margin-top: 0; } .ast-page-builder-template .entry-header.ast-header-without-markup { margin-top: 0; margin-bottom: 0; } .ast-page-builder-template .entry-header.ast-no-title.ast-no-meta { margin-bottom: 0; } .ast-page-builder-template.single .post-navigation { padding-bottom: 2em; } .ast-page-builder-template .ast-archive-description { margin-top: 4em; margin-left: auto; margin-right: auto; padding-left: 20px; padding-right: 20px; } @media (min-width: 993px) { .ast-separate-container.ast-right-sidebar #primary, .ast-separate-container.ast-left-sidebar #primary, .ast-separate-container #primary { margin: 4em 0; padding: 0; } .ast-right-sidebar #primary { padding-right: 60px; } .ast-left-sidebar #primary { padding-left: 60px; } } @media (max-width: 992px) { .ast-separate-container.ast-right-sidebar #primary, .ast-separate-container.ast-left-sidebar #primary, .ast-separate-container #primary { padding-left: 0; padding-right: 0; } .ast-right-sidebar #primary { padding-right: 30px; } .ast-left-sidebar #primary { padding-left: 30px; } } /*---------- Navigation ----------*/ /** * Navigations * * @import * 1 - Primary Menus * 2 - Secondary Menus * 3 - Header Top Menus * * Contents * 1 - Toggle Button * */ /** * @import */ /* 1 - Primary Menus */ .ast-search-icon .astra-search-icon { font-size: 1.3em; } .main-navigation { height: 100%; -js-display: inline-flex; display: inline-flex; } .main-navigation ul { list-style: none; margin: 0; padding-left: 0; position: relative; } .main-header-menu .menu-link, .main-header-menu > a { text-decoration: none; padding: 0 1em; display: inline-block; transition: all 0.2s linear; } .main-header-menu .menu-item { position: relative; } .main-header-menu .menu-item:hover > .sub-menu, .main-header-menu .menu-item.focus > .sub-menu { right: auto; left: 0; } .main-header-menu .ast-left-align-sub-menu:hover > .sub-menu, .main-header-menu .ast-left-align-sub-menu.focus > .sub-menu { right: 0; left: auto; } @media (min-width: 769px) { .main-header-menu .ast-sub-menu-goes-outside:hover > .sub-menu, .main-header-menu .ast-sub-menu-goes-outside.focus > .sub-menu { left: -100%; } .main-header-menu .ast-left-align-sub-menu .sub-menu .menu-item:hover > .sub-menu, .main-header-menu .ast-left-align-sub-menu .sub-menu .menu-item.focus > .sub-menu { left: -100%; } } .main-header-menu .sub-menu { width: 240px; background: #ffffff; left: -999em; position: absolute; top: 100%; z-index: 99999; } @media (min-width: 769px) { .main-header-menu .sub-menu .menu-item:hover > .sub-menu, .main-header-menu .sub-menu .menu-item.focus > .sub-menu { left: 100%; right: auto; } .main-header-menu .sub-menu .ast-left-align-sub-menu:hover > .sub-menu, .main-header-menu .sub-menu .ast-left-align-sub-menu.focus > .sub-menu, .main-header-menu .sub-menu .ast-left-align-sub-menu:hover * .sub-menu, .main-header-menu .sub-menu .ast-left-align-sub-menu:focus * .sub-menu { left: -100%; } .main-header-menu .sub-menu .main-header-menu .ast-sub-menu-goes-outside:hover > .sub-menu, .main-header-menu .sub-menu .main-header-menu .ast-sub-menu-goes-outside.focus > .sub-menu { left: -100%; } } .main-header-menu .sub-menu .menu-link { padding: 0.9em 1em; display: block; word-wrap: break-word; } .main-header-menu .sub-menu .menu-item:not(.menu-item-has-children) .menu-link .icon-arrow:first-of-type { display: none; } #ast-desktop-header .main-header-menu .sub-menu .menu-item.menu-item-has-children > .menu-link .icon-arrow svg { position: absolute; right: .60em; top: 50%; transform: translate(0, -50%) rotate(270deg); } .main-header-menu .sub-menu .sub-menu { top: 0px; } .submenu-with-border .sub-menu { border-width: 1px; border-style: solid; } .submenu-with-border .sub-menu .menu-link { border-width: 0 0 1px; border-style: solid; } .submenu-with-border .sub-menu .sub-menu { top: -1px; } /* Remove the last anchor border for desktop devices */ .ast-desktop .submenu-with-border .sub-menu > .menu-item:last-child > .menu-link { border-bottom-width: 0; } .ast-header-break-point .main-navigation { padding-left: 0; } .ast-header-break-point .main-navigation ul .menu-item .menu-link { padding: 0 20px; display: inline-block; width: 100%; border: 0; border-bottom-width: 1px; border-style: solid; border-color: #eaeaea; } .ast-header-break-point .main-navigation ul .menu-item .menu-link .icon-arrow:first-of-type { margin-right: 5px; } .ast-header-break-point .main-navigation ul .sub-menu .menu-item:not(.menu-item-has-children) .menu-link .icon-arrow:first-of-type { display: inline; } .ast-header-break-point .main-navigation .sub-menu .menu-item .menu-link { padding-left: 30px; } .ast-header-break-point .main-navigation .sub-menu .menu-item .menu-item .menu-link { padding-left: 40px; } .ast-header-break-point .main-navigation .sub-menu .menu-item .menu-item .menu-item .menu-link { padding-left: 50px; } .ast-header-break-point .main-navigation .sub-menu .menu-item .menu-item .menu-item .menu-item .menu-link { padding-left: 60px; } .ast-header-break-point .main-header-menu { background-color: #f9f9f9; border-top-width: 1px; border-style: solid; border-color: #eaeaea; } .ast-header-break-point .main-header-menu .sub-menu { background-color: #f9f9f9; position: static; opacity: 1; visibility: visible; border: 0; width: auto; } .ast-header-break-point .main-header-menu .sub-menu .ast-left-align-sub-menu:hover > .sub-menu, .ast-header-break-point .main-header-menu .sub-menu .ast-left-align-sub-menu.focus > .sub-menu { left: 0; } .ast-header-break-point .main-header-menu .ast-sub-menu-goes-outside:hover > .sub-menu, .ast-header-break-point .main-header-menu .ast-sub-menu-goes-outside.focus > .sub-menu { left: 0; } .ast-header-break-point .submenu-with-border .sub-menu { border: 0; } .ast-header-break-point .dropdown-menu-toggle { display: none; } /** * Contents */ .ast-mobile-menu-buttons { display: none; } /* Toggle Button */ .ast-button-wrap { display: inline-block; } .ast-button-wrap button { box-shadow: none; border: none; } .ast-button-wrap .menu-toggle { padding: 0; width: 2.2em; height: 2.1em; font-size: 1.5em; font-weight: normal; border-radius: 2px; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; border-radius: 2px; vertical-align: middle; line-height: 1.85714285714286; } .ast-button-wrap .menu-toggle.main-header-menu-toggle { padding: 0 .5em; width: auto; text-align: center; } .ast-button-wrap .menu-toggle.main-header-menu-toggle .mobile-menu { font-size: 15px; font-size: 1rem; font-weight: 600; } .ast-button-wrap .menu-toggle .menu-toggle-icon { font-style: normal; display: inline-block; vertical-align: middle; line-height: 2.05; } .ast-button-wrap .menu-toggle .menu-toggle-icon:before { content: "\e5d2"; font-family: 'Astra'; text-decoration: inherit; } .ast-button-wrap .menu-toggle .icon-menu-bars svg:nth-child(2) { display: none; } .ast-button-wrap .menu-toggle.toggled .menu-toggle-icon:before { content: "\e5cd"; } .ast-button-wrap .menu-toggle.toggled .icon-menu-bars svg:nth-child(1) { display: none; } .ast-button-wrap .menu-toggle.toggled .icon-menu-bars svg:nth-child(2) { display: block; } .ast-button-wrap .menu-toggle .mobile-menu-wrap { display: inline-block; } .ast-button-wrap .menu-toggle:focus { outline: thin dotted; } .header-main-layout-1 .ast-main-header-bar-alignment { margin-left: auto; } .site-navigation { height: 100%; } .site-header .menu-link * { transition: none; } .ast-icon.icon-arrow svg { height: .6em; width: .6em; position: relative; margin-left: 10px; } .ast-icon.icon-search svg { height: 1em; width: 0.9em; margin-top: 3px; margin-right: 2px; } /* Responsive Screen */ .ast-header-break-point .user-select { clear: both; } .ast-header-break-point .ast-mobile-menu-buttons { display: block; align-self: center; } .ast-header-break-point .main-header-bar-navigation { flex: auto; } .ast-header-break-point .ast-main-header-bar-alignment { display: block; width: 100%; flex: auto; order: 4; } .ast-header-break-point .ast-icon.icon-arrow svg { height: .85em; width: .95em; position: relative; margin-left: 10px; } /** * Post/Page Navigation */ .site-main .comment-navigation, .site-main .posts-navigation, .site-main .post-navigation { margin: 0 0 1.5em; overflow: hidden; } .comment-navigation .nav-previous, .comment-navigation .nav-next, .posts-navigation .nav-previous, .posts-navigation .nav-next, .post-navigation .nav-previous, .post-navigation .nav-next { width: 50%; display: inline-block; } .comment-navigation .nav-next, .posts-navigation .nav-next, .post-navigation .nav-next { text-align: right; } .ast-icon svg { fill: currentColor; } .post-navigation a { background: transparent; font-size: 16px; font-size: 1.06666rem; padding: 0 1.5em; height: 2.33333em; line-height: calc(2.33333em - 3px); } /*---------- Primary ----------*/ .sticky { display: block; } .hentry { margin: 0 0 1.5em; } .byline, .updated:not(.published) { display: none; } .single .byline, .group-blog .byline { display: inline; } .page-links { clear: both; margin-top: 1em; } .page-links a { display: inline-block; } .page-links a .page-link { border-color: #eaeaea; background: transparent; } .page-links .page-link { padding: 0; margin: 0 0 .3em .3em; border: 2px solid #eaeaea; color: #000; background: transparent; font-size: 0.8em; width: 2.5em; height: 2.5em; line-height: calc( 2.5em - 4px); display: inline-block; text-align: center; transition: all 0.2s linear; } .page-links .page-link:hover, .page-links .page-link:focus { color: #000; } @media (max-width: 768px) { .page-links .page-link { margin-bottom: 6px; } } .page-content > :last-child, .entry-content > :last-child, .entry-summary > :last-child { margin-bottom: 0; } .bypostauthor { display: block; } body { overflow-x: hidden; } /*---------- Secondary ----------*/ .widget-title { font-weight: normal; margin-bottom: 1em; line-height: 1.5; } .widget { margin: 0 0 2.8em 0; } .widget:last-child { margin-bottom: 0; } .widget select { max-width: 100%; } .widget ul { margin: 0; list-style-type: none; } .no-widget-text { margin-bottom: 0; } .widget_nav_menu ul ul.sub-menu { margin-top: 0.25em; } .widget_nav_menu ul ul.sub-menu li { padding-left: 20px; } .widget_nav_menu ul ul.sub-menu a:after { left: -20px; } .widget_nav_menu ul ul.sub-menu ul a:after { left: -40px; } .widget_nav_menu ul ul.sub-menu ul ul a:after { left: -60px; } .widget_nav_menu li { transition: all 0.2s linear; } /* Search widget. */ .widget_search .search-form { position: relative; padding: 0; background: initial; color: inherit; } .widget_search .search-form > label { position: relative; } .widget_search .search-form i { color: #3a3a3a; } .widget_search .search-form button { position: absolute; top: 0; right: 15px; border: none; padding: 0; cursor: pointer; background: transparent; } .widget_search .search-form input[type="submit"], .widget_search .search-form input[type="submit"]:hover, .widget_search .search-form input[type="submit"]:focus { padding: 13px 20px; border-radius: 2px; border: none; top: 0px; right: 0px; position: absolute; color: transparent; background: transparent; max-width: 45px; z-index: 2; } .widget_search .search-form .search-field { background: #fafafa; border-width: 1px; border-color: #eaeaea; border-radius: 2px; } .widget_search .search-field, .widget_search .search-field:focus { width: 100%; padding: 16px 45px 16px 15px; } /* Widget - Archive */ /* Widget - Categories */ .widget_pages ul.children, .widget_archive ul.children, .widget_categories ul.children { position: relative; margin-top: 5px; width: 100%; } .widget_pages ul.children li, .widget_archive ul.children li, .widget_categories ul.children li { padding-left: 20px; } .widget_pages li ul.children a:after, .widget_archive li ul.children a:after, .widget_categories li ul.children a:after { left: -20px; } .widget_pages li ul.children ul a:after, .widget_archive li ul.children ul a:after, .widget_categories li ul.children ul a:after { left: -40px; } /* Tag Cloud */ .widget_tag_cloud .tagcloud { margin-top: 10px; display: inline-block; } .widget_tag_cloud .tagcloud a { border: 1px solid #e2e2e2; padding: 0.5em 0.9em; display: inline-block; margin-bottom: 4px; font-size: 14px; margin-right: 4px; line-height: 1.5; transition: all 0.2s linear; } /* Calender */ .widget_calendar table, .widget_calendar th, .widget_calendar td { padding: 0; text-align: center; } .widget_calendar table, .widget_calendar th { border: none; } .widget_calendar td { border-right: none; border-left: none; } .widget_calendar caption { line-height: 2.7em; } .widget_calendar thead { line-height: 2.5em; } .widget_calendar thead a { color: #0274be; font-size: 1rem; vertical-align: middle; } .widget_calendar thead td { vertical-align: middle; font-weight: bold; } .widget_calendar thead > tr > th { line-height: 2.5em; border-bottom: 2px solid #eaeaea; border-top: 2px solid #eaeaea; } .widget_calendar tbody { line-height: 2.10em; text-align: center; } .widget_calendar tbody > tr > td { width: 14.2857%; } .widget_calendar tbody > tr:first-child > td { padding-top: 3px; } .widget_calendar #today { background: #0274be; } /*---------- Builder ----------*/ /** * AST HF Builder - Grid related CSS. */ .ast-builder-grid-row { display: grid; grid-template-columns: auto auto; align-items: center; grid-column-gap: 20px; overflow-wrap: anywhere; } .ast-builder-grid-row > .site-header-section { flex-wrap: nowrap; } .ast-builder-footer-grid-columns { grid-column-gap: 50px; } .ast-builder-grid-row.ast-grid-center-col-layout { grid-template-columns: 1fr auto 1fr; } .ast-builder-layout-element { align-items: center; } .ast-builder-grid-row.ast-grid-center-col-layout-only { -js-display: flex; display: flex; height: 100%; justify-content: center; } .ast-builder-grid-row.ast-grid-center-col-layout-only .ast-grid-section-center { flex-grow: 1; } .site-header-section { height: 100%; min-height: 0; align-items: center; } .site-header-section .ast-main-header-bar-alignment { height: 100%; } .site-header-section > * { padding: 0 10px; } .site-header-section > div:first-child { padding-left: 0; } .site-header-section > div:last-child { padding-right: 0; } .site-header-section .ast-builder-menu { align-items: center; } .ast-builder-layout-element.ast-header-search { height: auto; } .ast-grid-right-center-section { justify-content: flex-start; flex-grow: 1; } .ast-grid-right-section { justify-content: flex-end; } .ast-grid-right-section .ast-site-identity > :first-child { text-align: right; } .ast-grid-right-section .ast-grid-right-center-section .ast-site-identity > :first-child { text-align: left; } .ast-grid-left-center-section { justify-content: flex-end; flex-grow: 1; } /** * AST HF Builder - Logo related CSS. * Align center section's Site title & Tagline center align. */ .ast-logo-title-inline .ast-site-identity { padding: 1em 0; -js-display: inline-flex; display: inline-flex; vertical-align: middle; align-items: center; transition: all 0.2s linear; } .ast-grid-section-center { justify-content: center; } .ast-grid-section-center .ast-site-identity > :first-child { text-align: center; } /** * AST HF Builder - Widgets related CSS. * Social Widget. */ .ast-builder-social-element { line-height: 1; color: #3a3a3a; background: transparent; vertical-align: middle; transition: all 0.01s; margin-left: 6px; margin-right: 6px; justify-content: center; align-items: center; } .ast-builder-social-element:hover { color: #0274be; } .ast-builder-social-element .social-item-label { padding-left: 6px; } .ast-social-stack-desktop .ast-builder-social-element, .ast-social-stack-tablet .ast-builder-social-element, .ast-social-stack-mobile .ast-builder-social-element { margin-top: 6px; margin-bottom: 6px; } .ahfb-svg-iconset { -js-display: inline-flex; display: inline-flex; align-self: center; } .ahfb-svg-iconset svg { width: 17px; height: 17px; transition: none; } .ahfb-svg-iconset svg > * { transition: none; } /** * AST HF Builder - Widgets related CSS. * Button. */ .ast-footer-copyright p { margin-bottom: 0; } .ast-builder-grid-row-container { display: grid; align-content: center; } .main-header-bar .main-header-bar-navigation { height: 100%; } .ast-nav-menu .sub-menu { line-height: 1.45; } .ast-builder-menu .main-navigation { padding: 0; } .ast-builder-menu .main-navigation > ul { align-self: center; } /** * Astra HF Builder - Footer Components Compatibility CSS. */ .site-footer-focus-item, .ast-footer-copyright, .ast-footer-social-wrap { width: 100%; } #astra-footer-menu { margin: 0; list-style: none; background: inherit; } #astra-footer-menu > ul { margin: 0; list-style: none; background: inherit; } /** * AST HF Builder - Responsive CSS. * For desktop view. */ .ast-header-break-point #ast-mobile-header { display: block; } .ast-header-break-point .main-header-bar-navigation { line-height: 3; } .ast-header-break-point .main-header-bar-navigation .menu-item-has-children > .ast-menu-toggle { display: inline-block; position: absolute; font-size: inherit; top: 0px; right: 20px; cursor: pointer; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; padding: 0 0.907em; font-weight: normal; line-height: inherit; } .ast-header-break-point .main-header-bar-navigation .menu-item-has-children .sub-menu { display: none; } .ast-header-break-point .ast-mobile-header-wrap .ast-above-header-wrap .main-header-bar-navigation .ast-submenu-expanded > .ast-menu-toggle::before, .ast-header-break-point .ast-mobile-header-wrap .ast-main-header-wrap .main-header-bar-navigation .ast-submenu-expanded > .ast-menu-toggle::before { transform: rotateX(180deg); } .ast-header-break-point .ast-nav-menu .sub-menu { line-height: 3; } .site-footer-section { justify-content: center; } .site-footer-section > * { margin-bottom: 10px; } .site-footer-section > *:last-child { margin-bottom: 0; } .site-primary-footer-wrap { padding-top: 45px; padding-bottom: 45px; } .site-above-footer-wrap, .site-below-footer-wrap { padding-top: 20px; padding-bottom: 20px; } .ast-hfb-header.ast-header-break-point .main-header-bar-navigation { width: 100%; margin: 0; } .ast-hfb-header .menu-toggle.toggled .ast-mobile-svg { display: none; } .ast-hfb-header .menu-toggle.toggled .ast-close-svg { display: block; } .menu-toggle .ast-close-svg { display: none; } .ast-mobile-header-wrap .menu-toggle .mobile-menu-toggle-icon { -js-display: inline-flex; display: inline-flex; align-self: center; } .ast-mobile-header-wrap .menu-toggle .mobile-menu-wrap { -js-display: inline-flex; display: inline-flex; align-self: center; margin-left: 0.4em; } .ast-mobile-header-wrap .ast-button-wrap .menu-toggle.main-header-menu-toggle { -js-display: flex; display: flex; align-items: center; width: auto; height: auto; } .menu-toggle .mobile-menu-toggle-icon { -js-display: inline-flex; display: inline-flex; align-self: center; } .menu-toggle .mobile-menu-wrap { -js-display: inline-flex; display: inline-flex; align-self: center; margin-left: 0.4em; } .ast-hfb-header .ast-button-wrap .menu-toggle .mobile-menu-wrap { align-items: center; -js-display: flex; display: flex; } .ast-button-wrap .menu-toggle.main-header-menu-toggle { padding: .5em; align-items: center; -js-display: flex; display: flex; } .ast-search-menu-icon.ast-inline-search .search-field { width: 100%; padding: 0.60em; padding-right: 5.5em; } /* Footer menu spacing between each menu items. */ @media (min-width: 769px) { .footer-nav-wrap .astra-footer-horizontal-menu li { margin: 0; } .footer-nav-wrap .astra-footer-horizontal-menu li:first-child a { padding-left: 0; } .footer-nav-wrap .astra-footer-horizontal-menu li:last-child a { padding-right: 0; } .footer-nav-wrap .astra-footer-horizontal-menu a { padding: 0 0.5em; } } /*---------- Header ----------*/ /** * Header * * @import * 1 - Header Layout Common * 2 - Header Main */ /* 1 - Header Common */ /** * Header Common * * Contents * 1 - Common * 4 - Main Header Container * 6 - all and (max-width: $mx-break-point) * 7 - Auto Margin */ /** * 1 - Common */ .site-header { z-index: 99; position: relative; } /** * 4 - Main Header Container */ .main-header-container { position: relative; } .main-header-bar-wrap { position: relative; } .main-header-bar { background-color: #fff; border-bottom-color: #eaeaea; border-bottom-style: solid; } /** * 6 - all and (max-width: $mx-break-point) */ .ast-header-break-point .main-header-bar { border: 0; } .ast-header-break-point .main-header-bar { border-bottom-color: #eaeaea; border-bottom-style: solid; } /** * 7 - Auto Margin */ .main-header-bar { margin-left: auto; margin-right: auto; } /** * 10 - Submenu container box shadow */ .ast-desktop .main-header-menu.ast-menu-shadow .sub-menu { box-shadow: 0 4px 10px -2px rgba(0, 0, 0, 0.1); } .ast-header-custom-item-inside .button-custom-menu-item .menu-link { display: none; } .ast-header-custom-item-inside.ast-header-break-point .button-custom-menu-item { padding-left: 0; padding-right: 0; margin-top: 0; margin-bottom: 0; } .ast-header-custom-item-inside.ast-header-break-point .button-custom-menu-item .ast-custom-button-link { display: none; } .ast-header-custom-item-inside.ast-header-break-point .button-custom-menu-item .menu-link { display: block; } /* 2 - Header Main */ /** * Header Sections * * All sections within the header. * * Contents * 1 - Common * 2 - Social Follow * 3 - Site Logo * 4 - Search Form * * # Responsive */ /** * 1 - Common */ .site-branding { line-height: 1; align-self: center; } .ast-menu-toggle { display: none; background: transparent; color: inherit; border-style: dotted; border-color: transparent; } .ast-menu-toggle:focus, .ast-menu-toggle:hover { background: transparent; border-color: inherit; color: inherit; } .ast-menu-toggle:focus { outline: thin dotted; } /** * 4 - Search Form & Main Header */ .ast-main-header-nav-open .main-header-bar { padding-bottom: 0; } .main-header-bar { z-index: 4; position: relative; } .main-header-bar .main-header-bar-navigation:empty { padding: 0; } .main-header-bar .main-header-bar-navigation .sub-menu { line-height: 1.45; } .main-header-bar .main-header-bar-navigation .menu-item-has-children > .menu-link:after { line-height: normal; } /* Hide Mobile logo. */ .custom-mobile-logo-link { display: none; } .ast-site-identity { padding: 1em 0; } .ast-header-break-point .site-header .main-header-bar-wrap .site-branding { flex: 1; align-self: center; } .ast-header-break-point .ast-site-identity { width: 100%; } .ast-header-break-point .main-header-bar { display: block; line-height: 3; } .ast-header-break-point .main-header-bar .main-header-bar-navigation { line-height: 3; } .ast-header-break-point .main-header-bar .main-header-bar-navigation .sub-menu { line-height: 3; } .ast-header-break-point .main-header-bar .main-header-bar-navigation .menu-item-has-children .sub-menu { display: none; } .ast-header-break-point .main-header-bar .main-header-bar-navigation .menu-item-has-children > .ast-menu-toggle { display: inline-block; position: absolute; font-size: inherit; top: -1px; right: 20px; cursor: pointer; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; padding: 0 0.907em; font-weight: normal; line-height: inherit; transition: all .2s; } .ast-header-break-point .main-header-bar .main-header-bar-navigation .ast-submenu-expanded > .ast-menu-toggle::before { transform: rotateX(180deg); } .ast-header-break-point .main-header-bar .main-header-bar-navigation .main-header-menu { border-top-width: 1px; border-style: solid; border-color: #eaeaea; } .ast-header-break-point .main-navigation { display: block; width: 100%; } .ast-header-break-point .main-navigation ul ul { left: auto; right: auto; } .ast-header-break-point .main-navigation .stack-on-mobile li { width: 100%; } .ast-header-break-point .main-navigation .widget { margin-bottom: 1em; } .ast-header-break-point .main-navigation .widget li { width: auto; } .ast-header-break-point .main-navigation .widget:last-child { margin-bottom: 0; } .ast-header-break-point .main-header-bar-navigation { width: calc( 100% + 40px); margin: 0 -20px; } .ast-header-break-point .main-header-menu ul ul { top: 0; } .ast-header-break-point .ast-builder-menu { width: 100%; } .ast-header-break-point .ast-mobile-header-wrap .ast-flex.stack-on-mobile { flex-wrap: wrap; } .ast-desktop .main-header-menu > .menu-item .sub-menu:before { position: absolute; content: ''; top: 0; left: 0; width: 100%; transform: translateY(-100%); } /*---------- Forms ----------*/ /** * Form Fields * * @import * 1 - All fields common scss * 2 - Field - Range * 3 - Field - Color */ /* 1 - All fields common scss */ input[type="text"], input[type="number"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type=reset], input[type=tel], select, textarea { color: #666; padding: 0.75em; height: auto; border-width: 1px; border-style: solid; border-color: #eaeaea; border-radius: 2px; background: #fafafa; box-shadow: none; box-sizing: border-box; transition: all 0.2s linear; } input[type="text"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type=reset]:focus, input[type=tel]:focus, select:focus, textarea:focus { background-color: #fff; border-color: #eaeaea; box-shadow: none; } input[type=reset], input[type=reset]:hover, input[type=reset]:focus, input[type="submit"], input[type="submit"]:hover, input[type="submit"]:focus, input[type="button"], input[type="button"]:hover, input[type="button"]:focus { box-shadow: none; } textarea { width: 100%; } input[type="search"]:focus { outline: thin dotted; } /* 2 - Field - Range */ /* Range */ input[type=range] { -webkit-appearance: none; width: 100%; margin: 5.7px 0; padding: 0; border: none; } input[type=range]:focus { outline: none; } input[type=range]::-webkit-slider-runnable-track { width: 100%; height: 8.6px; cursor: pointer; box-shadow: 2.6px 2.6px 0.4px #cccccc, 0px 0px 2.6px #d9d9d9; background: rgba(255, 255, 255, 0.2); border-radius: 13.6px; border: 0px solid #ffffff; } input[type=range]::-webkit-slider-thumb { box-shadow: 0px 0px 0px rgba(255, 221, 0, 0.37), 0px 0px 0px rgba(255, 224, 26, 0.37); border: 7.9px solid #0274be; height: 20px; width: 20px; border-radius: 50px; background: #0274be; cursor: pointer; -webkit-appearance: none; margin-top: -5.7px; } input[type=range]:focus::-webkit-slider-runnable-track { background: rgba(255, 255, 255, 0.2); } input[type=range]::-moz-range-track { width: 100%; height: 8.6px; cursor: pointer; box-shadow: 2.6px 2.6px 0.4px #cccccc, 0px 0px 2.6px #d9d9d9; background: rgba(255, 255, 255, 0.2); border-radius: 13.6px; border: 0px solid #ffffff; } input[type=range]::-moz-range-thumb { box-shadow: 0px 0px 0px rgba(255, 221, 0, 0.37), 0px 0px 0px rgba(255, 224, 26, 0.37); border: 7.9px solid #0274be; height: 20px; width: 20px; border-radius: 50px; background: #0274be; cursor: pointer; } input[type=range]::-ms-track { width: 100%; height: 8.6px; cursor: pointer; background: transparent; border-color: transparent; color: transparent; } input[type=range]::-ms-fill-lower { background: rgba(199, 199, 199, 0.2); border: 0px solid #ffffff; border-radius: 27.2px; box-shadow: 2.6px 2.6px 0.4px #cccccc, 0px 0px 2.6px #d9d9d9; } input[type=range]::-ms-fill-upper { background: rgba(255, 255, 255, 0.2); border: 0px solid #ffffff; border-radius: 27.2px; box-shadow: 2.6px 2.6px 0.4px #cccccc, 0px 0px 2.6px #d9d9d9; } input[type=range]::-ms-thumb { box-shadow: 0px 0px 0px rgba(255, 221, 0, 0.37), 0px 0px 0px rgba(255, 224, 26, 0.37); border: 7.9px solid #0274be; height: 20px; width: 20px; border-radius: 50px; background: #0274be; cursor: pointer; height: 8.6px; } input[type=range]:focus::-ms-fill-lower { background: rgba(255, 255, 255, 0.2); } input[type=range]:focus::-ms-fill-upper { background: rgba(255, 255, 255, 0.2); } /* 3 - Field - Color */ /* Color */ input[type="color"] { border: none; width: 100px; padding: 0; height: 30px; cursor: pointer; } input[type="color"]::-webkit-color-swatch-wrapper { padding: 0; border: none; } input[type="color"]::-webkit-color-swatch { border: none; } /*---------- Blog ----------*/ /*-------------------------------------------------------------- ## Blog Layouts --------------------------------------------------------------*/ /** * Blog Common */ .page .entry-header { margin-bottom: 1.5em; } .search .entry-header { margin-bottom: 1em; } .ast-single-post .entry-header.ast-header-without-markup, .ast-single-post .entry-header.ast-no-title.ast-no-thumbnail { margin-bottom: 0; } .entry-header { margin-bottom: 1em; word-wrap: break-word; } .entry-header + .ast-blog-featured-section { margin-top: 0.5em; } .entry-content { word-wrap: break-word; } .entry-content p { margin-bottom: 1.6em; } .read-more { margin-bottom: 0; } .read-more .ast-right-arrow { font-size: 1em; } .ast-no-thumb .ast-blog-featured-section { margin-bottom: 0; } .ast-no-thumb .entry-header + .ast-blog-featured-section { margin-top: 0; } .ast-blog-featured-section { margin-bottom: 1.5em; } .error404 .page-header { margin-bottom: 1.5em; } .error404 .page-header .page-title { margin-bottom: 0; } .blog .entry-title, .archive .entry-title, .search .entry-title { line-height: 1.3; } .blog .format-status .entry-title, .archive .format-status .entry-title, .blog .format-aside .entry-title, .archive .format-aside .entry-title { display: none; } .page-title { margin-bottom: 1em; font-weight: normal; } .entry-title { margin-bottom: 0.2em; } .ast-article-post { margin-bottom: 2.5em; } .ast-article-post:last-child { margin-bottom: 0; border-bottom: 0; } .search .site-content .content-area .search-form { margin-bottom: 3em; } .blog-layout-1 { /* 2 - Blog Thumbnail Styles */ } .blog-layout-1 .post-thumb { padding-left: 0; padding-right: 0; position: relative; } .blog .posted-on { z-index: 1; } .ast-blog-featured-section .posted-on { width: 5.714285714em; height: 5.714285714em; padding: 0.7em; } .ast-blog-featured-section .posted-on .date-month, .ast-blog-featured-section .posted-on .date-year { font-size: 0.8571428571em; line-height: 1em; } .ast-blog-featured-section .posted-on .date-day { font-size: 2.5em; line-height: .9em; font-weight: 900; margin: .1em 0; } /* ============================================================ Archive Blogs ============================================================ */ .ast-author-box img.avatar { border-radius: 50%; margin: 0 0 0 20px; } .ast-archive-description { margin-bottom: 2.5em; padding-bottom: 1.3333em; border-bottom: 1px solid #eeeeee; } .ast-archive-description .ast-archive-title { margin-bottom: 4px; font-size: 40px; font-size: 2.85714rem; font-weight: 300; } .ast-archive-description p { margin-bottom: 0; font-size: 20px; font-size: 1.42857rem; line-height: 1.65; font-weight: 300; } .ast-separate-container .ast-author-box, .ast-separate-container .ast-archive-description { background-color: #eee; padding-bottom: 0; border-bottom: 0; } @media (max-width: 1200px) { .ast-separate-container .ast-archive-description { margin: 0; padding: 3.34em 2.4em; } } @media (max-width: 992px) { .ast-separate-container .ast-archive-description { padding: 2.14em; } } @media (min-width: 1201px) { .ast-separate-container .ast-author-box, .ast-separate-container .ast-archive-description { margin: 0; padding: 5em 6.67em 3.33333em; } } /*-------------------------------------------------------------- ## Single Blog Post Layouts --------------------------------------------------------------*/ /*---------- Single Post Common Stylesheet ----------*/ /** * Common Stylesheet of Single Post * * Content * 1 - Single Post Navigation Styles * 2 - Single Post Article Header */ .single { /* 1 - Single Post Navigation Styles */ } .single .entry-header { margin-bottom: 2em; } .single .post-navigation { margin: 0; padding: 2em 0 0; border-top: 1px solid #eeeeee; } @media (max-width: 768px) { .single .post-navigation { padding-top: 1.5em; } } .single .post-navigation a { margin: 2px; display: inline-block; text-align: center; color: #000; } @media (min-width: 421px) { .single .post-navigation .nav-links { -js-display: flex; display: flex; } .single .post-navigation .nav-previous, .single .post-navigation .nav-next { flex: auto; } } @media (max-width: 420px) { .single .post-navigation .ast-left-arrow, .single .post-navigation .ast-right-arrow { display: none; } .single .post-navigation .nav-previous, .single .post-navigation .nav-next { width: 100%; } .single .post-navigation .nav-previous a, .single .post-navigation .nav-next a { width: 100%; } .single .post-navigation .nav-previous { margin-bottom: 1em; } } /* 2 - Single Post Article Header */ .single .entry-header .ast-single-post-order + .post-thumb img { margin-top: 2em; margin-bottom: 0; } .single .entry-header.ast-no-title .post-thumb + .ast-single-post-order { margin-top: 0; } .single .entry-header .post-thumb + .ast-single-post-order { margin-top: 2em; } .single .entry-header .post-thumb img { margin-top: 0; margin-bottom: 0; } .page .has-post-thumbnail .post-thumb img { margin-bottom: 1.5em; } .post-password-form { text-align: center; } @media (max-width: 420px) { .post-password-form input[type="password"] { display: block; margin: 10px auto; } } .post-password-form input[type="submit"] { padding: 10px 20px; border-radius: 2px; } .ast-separate-container .post-navigation { border-top: 0; padding-left: 3.33333em; padding-right: 3.33333em; } @media (max-width: 420px) { .ast-separate-container .post-navigation { padding-left: 0; padding-right: 0; } } @media (max-width: 768px) { .ast-separate-container .entry-header { margin-bottom: 1em; } } /*---------- 404 ----------*/ .ast-404-layout-1 { text-align: center; margin: 4em auto; } .ast-404-layout-1 .page-sub-title { font-size: 1.5rem; font-weight: bold; } .ast-404-layout-1 .widget_search { padding-top: 0.5em; } .ast-404-search { margin-top: 1.5em; } .ast-404-search .widget_search { max-width: 370px; margin: 0 auto; } .ast-separate-container .error-404, .ast-separate-container .no-results { background-color: #fff; } @media (max-width: 1200px) { .ast-separate-container .ast-404-layout-1, .ast-separate-container .no-results { margin: 0; padding: 3.34em 2.4em; } } @media (max-width: 768px) { .ast-separate-container .ast-404-layout-1, .ast-separate-container .no-results { padding: 1.5em 2.14em; } } @media (max-width: 544px) { .ast-separate-container .ast-404-layout-1, .ast-separate-container .no-results { padding: 1.5em 1em; } } @media (min-width: 1201px) { .ast-separate-container .ast-404-layout-1, .ast-separate-container .no-results { margin: 0; padding: 5.34em 6.67em; } } /*---------- Blog Styles ----------*/ /*---------- Media Query min-width Structure ----------*/ /*---------- Media Query max-width Structure ----------*/ /*---------- Break-point min-width Structure ----------*/ /*---------- Break-point max-width Structure ----------*/ .blog-layout-1 { width: 100%; display: inline-block; padding-bottom: 2em; vertical-align: middle; border-bottom: 1px solid #eeeeee; } .blog-layout-1 .posted-on { left: 0; } .blog-layout-1 .post-thumb, .blog-layout-1 .post-content { padding-left: 0; padding-right: 0; } /** * Flexbox Framework * * .ast - prefix * * Flex classes generated as {prefix} + {css property - css value} . * * E.g. Here '.ast' is a prefix. * * .ast-flex * .ast-flex-1 * .ast-flex-2 * .ast-flex-3 * .ast-flex-4 * .ast-flex-5 * .ast-inline-flex * .ast-flex-direction-row * .ast-flex-direction-row-reverse * .ast-flex-direction-column * .ast-flex-direction-column-reverse * .ast-flex-wrap-nowrap * .ast-flex-wrap-wrap * .ast-flex-wrap-wrap-reverse * .ast-justify-content-flex-start * .ast-justify-content-flex-end * .ast-justify-content-center * .ast-justify-content-space-between * .ast-justify-content-space-around * .ast-align-items-flex-start * .ast-align-items-flex-end * .ast-align-items-center * .ast-align-items-baseline * .ast-align-items-stretch * .ast-align-content-flex-start * .ast-align-content-flex-end * .ast-align-content-center * .ast-align-content-space-between * .ast-align-content-space-around * .ast-align-content-stretch * .ast-order-1 * .ast-order-2 * .ast-order-3 * .ast-order-4 * .ast-order-5 * .ast-flex-grow-1 * .ast-flex-grow-2 * .ast-flex-grow-3 * .ast-flex-grow-4 * .ast-flex-grow-5 * .ast-flex-shrink-grow-1 * .ast-flex-shrink-grow-2 * .ast-flex-shrink-grow-3 * .ast-flex-shrink-grow-4 * .ast-flex-shrink-grow-5 * .ast-flex-basis-grow-1 * .ast-flex-basis-grow-2 * .ast-flex-basis-grow-3 * .ast-flex-basis-grow-4 * .ast-flex-basis-grow-5 * .ast-align-self-auto * .ast-align-self-flex-start * .ast-align-self-flex-end * .ast-align-self-center * .ast-align-self-baseline * .ast-align-self-stretch */ .ast { /* # LAYOUT ———————————————- display: flex | inline-flex; ———————————————- */ /* ————————————————————————– # CONTAINER (for PARENT) ————————————————————————– # FLOW ————————————————————————– flex-flow: <‘flex-direction’> || <‘flex-wrap’> ————————————————————————– # DIRECTION ————————————————————————– flex-direction: row | row-reverse | column | column-reverse; ————————————————————————– */ /* # WRAP ————————————————————————– flex-wrap: nowrap | wrap | wrap-reverse; ————————————————————————– */ /* ————————————————————————– # JUSTIFY CONTENT ————————————————————————– justify-content: flex-start | flex-end | center | space-between | space-around; ————————————————————————– */ /* ————————————————————————– # ALIGN – ITEMS ————————————————————————– align-items: flex-start | flex-end | center | baseline | stretch; ————————————————————————– */ /* ————————————————————————– # ALIGN – CONTENT ————————————————————————– align-content: flex-start | flex-end | center | space-between | space-around | stretch; ————————————————————————– */ /* ————————————————————————– # ITEMS (for CHILDs) ————————————————————————– # FLEX ————————————————————————– flex: none | [ <‘flex-grow’> <‘flex-shrink’>? || <‘flex-basis’> ] ————————————————————————– ————————————————————————– # ORDER ————————————————————————– order: ; ————————————————————————– */ /* ————————————————————————– # GROW ————————————————————————– flex-grow: ; default 0 ————————————————————————– */ /* ————————————————————————– # SHRINK ————————————————————————– flex-shrink: ; default 1 ————————————————————————– */ /* ————————————————————————– # ALIGN SELF ————————————————————————– align-self: auto | flex-start | flex-end | center | baseline | stretch; ————————————————————————– */ /* ————————————————————————– */ } .ast-flex { -js-display: flex; display: flex; flex-wrap: wrap; } .ast-flex-1 { flex: 1; } .ast-flex-2 { flex: 2; } .ast-flex-3 { flex: 3; } .ast-flex-4 { flex: 4; } .ast-flex-5 { flex: 5; } .ast-inline-flex { -js-display: inline-flex; display: inline-flex; align-items: center; flex-wrap: wrap; align-content: center; } .ast-flex-direction-row { flex-direction: row; } .ast-flex-direction-row-reverse { flex-direction: row-reverse; } .ast-flex-direction-column { flex-direction: column; } .ast-flex-direction-column-reverse { flex-direction: column-reverse; } .ast-flex-wrap-nowrap { flex-wrap: nowrap; } .ast-flex-wrap-wrap { flex-wrap: wrap; } .ast-flex-wrap-wrap-reverse { flex-wrap: wrap-reverse; } .ast-justify-content-flex-start { justify-content: flex-start; } .ast-justify-content-flex-end { justify-content: flex-end; } .ast-justify-content-center { justify-content: center; } .ast-justify-content-space-between { justify-content: space-between; } .ast-justify-content-space-around { justify-content: space-around; } .ast-align-items-flex-start { align-items: flex-start; } .ast-align-items-flex-end { align-items: flex-end; } .ast-align-items-center { align-items: center; } .ast-align-items-baseline { align-items: baseline; } .ast-align-items-stretch { align-items: stretch; } .ast-align-content-flex-start { align-content: flex-start; } .ast-align-content-flex-end { align-content: flex-end; } .ast-align-content-center { align-content: center; } .ast-align-content-space-between { align-content: space-between; } .ast-align-content-space-around { align-content: space-around; } .ast-align-content-stretch { align-content: stretch; } .ast-order-1 { order: 1; } .ast-order-2 { order: 2; } .ast-order-3 { order: 3; } .ast-order-4 { order: 4; } .ast-order-5 { order: 5; } .ast-flex-grow-1 { flex-grow: 1; } .ast-flex-grow-2 { flex-grow: 2; } .ast-flex-grow-3 { flex-grow: 3; } .ast-flex-grow-4 { flex-grow: 4; } .ast-flex-grow-5 { flex-grow: 5; } .ast-flex-shrink-1 { flex-shrink: 1; } .ast-flex-shrink-2 { flex-shrink: 2; } .ast-flex-shrink-3 { flex-shrink: 3; } .ast-flex-shrink-4 { flex-shrink: 4; } .ast-flex-shrink-5 { flex-shrink: 5; } .ast-align-self-auto { align-self: auto; } .ast-align-self-flex-start { align-self: flex-start; } .ast-align-self-flex-end { align-self: flex-end; } .ast-align-self-center { align-self: center; } .ast-align-self-baseline { align-self: baseline; } .ast-align-self-stretch { align-self: stretch; }