@charset "UTF-8"; /* Normalize -------------------------------------------------------------- */ *, *:before, *:after { box-sizing: border-box; } html,body { margin: 0; padding: 0; } article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section { display: block; } html { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; } table { border-collapse: collapse; border-spacing: 0; } caption, th, td { font-weight: normal; } blockquote:before, blockquote:after, q:before, q:after { content: none; } blockquote, q { quotes: none; margin: 0; } a:focus { outline: none; text-decoration: underline; text-underline-offset: 1px; } a:hover, a:active { outline: 0; } a img { border: 0; } img { max-width: 100%; height: auto; } select { max-width: 100%; } /* General -------------------------------------------------------------- */ :root { --pt-site-width: 1400px; --pt-accent-color: #216be9; --pt-accent-40-color: #7aa7f2; --pt-accent-80-color: #d3e2fb; --pt-accent-color-alt: #fff; --pt-second-color: #13b16f; --pt-second-color-alt: #fff; --pt-button-bg: var(--pt-accent-color); --pt-button-bg-hover: #282424; --pt-body-color: #282424; --pt-body-bg-color: #faf8ff; --pt-headings-color: #29294b; --pt-shadow-soft: 0 4px 25px #25252e1f; --pt-soft-radius: 12px; --pt-btn-radius: 50px; --pt-body-line-height: 1.6; --pt-card-bg: #fff; --pt-border-color: #e9e8ff; } html { overflow-x: hidden; } body { text-rendering: optimizeLegibility; } ::-moz-selection { background-color: #4b5767; color: white; text-shadow: none; -webkit-text-fill-color: #fff; } ::selection { background-color: #4b5767; color: white; text-shadow: none; -webkit-text-fill-color: #fff; } iframe { max-width: 100%; } img { height: auto; max-width: 100%; vertical-align: middle; } em, i { font-style: italic; } strong, b, cite { font-weight: 600; } abbr, acronym { border-bottom: 1px dotted; cursor: help; text-decoration: none; } mark, ins { text-decoration: none; background-color: #fff9c0; } sup, sub { font-size: 75%; height: 0; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -6px; } sub { bottom: -3px; } small { font-size: 75%; } big { font-size: 125%; } address { font-style: italic; margin: 0 0 20px; } code, kbd, tt, var { font-family: monospace; font-size: 14px; } pre { margin: 15px 0; padding: 15px; background-color: #e9e9e9; overflow-x: auto; font-family: monospace; -webkit-hyphens: none; hyphens: none; border-radius: 0; height: auto; } hr { background-color: #e9e9e9; border: 0; height: 1px; margin-bottom: 20px; } blockquote { padding-left: 1em; border-left: 4px solid #000; margin-bottom: 20px; font-style: italic; } blockquote p:last-of-type { margin: 0; } .card-layout, .card-layout.e-con, .card-layout-w, .card-layout-w.e-con { --border-radius: var(--pt-soft-radius); background: var(--pt-card-bg); padding: 16px; border-radius: var(--border-radius); box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.03); border: 1px solid var(--pt-border-color); } @media (min-width: 768px) { .card-layout, .card-layout.e-con, .card-layout-w, .card-layout-w.e-con { padding: 20px; } } .nothing-show { margin-bottom: 40px; } .nothing-show h2 { margin-bottom: 1.5rem; } .nothing-show p { margin: 0; } /* List */ ul, ol { padding: 0 0 0 30px; margin: 0 0 20px 0; } ul { list-style: disc; } ul ul { list-style-type: circle; } ol { list-style: decimal; } li > ul, li > ol { margin-bottom: 0; } dd { margin: 0 0 20px 20px; } dt { font-weight: bold; } del { opacity: 0.5; } /* Table */ table, th, td { border: 1px solid #e4e5ea; } table { border-collapse: collapse; border-spacing: 0; margin: 0 0 20px; width: 100%; max-width: 100%; } th { font-weight: bold; } th, td { padding: 0.5em; } .pt-shape--sharp { --pt-btn-radius: 0; } .pt-shape--circle { --pt-btn-radius: 50px; } .pt-shape--smooth { --pt-btn-radius: 8px; } .pt-shape--round { --pt-btn-radius: 10px; } /* Accessibility - Text meant only for screen readers */ .screen-reader-text { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0; overflow: hidden; text-decoration: none; border-radius: 8px; clip-path: inset(50%); word-wrap: normal !important; } .screen-reader-text:focus { width: auto; height: auto; top: 7px; left: 7px; margin: 0; display: block; overflow: visible; clip-path: none; background-color: #fff; color: #21759b; font-weight: 500; padding: 14px 22px; z-index: 100000; line-height: normal; text-underline-offset: 0.3rem; text-decoration-skip-ink: none; text-decoration: underline 0.1rem dotted currentColor; box-shadow: 0 0 3px 3px rgba(0, 0, 0, 0.2); } /* Site Preload -------------------------------------------------------------- */ .site-preloader { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 9999999; transition: 0.6s; background: var(--pt-body-bg-color); display: flex; align-items: center; justify-content: center; } body.site-loaded .site-preloader { opacity: 0; visibility: hidden; } .site-preloader .preloader-inner { width: 65px; height: 65px; position: relative; } .preloader-cssload { position: absolute; width: 100%; height: 100%; box-sizing: border-box; border-radius: 50% } .preloader-cssload.cssload-one { left: 0%; top: 0%; animation: cssload-rotate-one 1.15s linear infinite; border-bottom: 5px solid var(--pt-accent-color); } .preloader-cssload.cssload-two { right: 0%; top: 0%; animation: cssload-rotate-two 1.15s linear infinite; border-right: 5px solid var(--pt-accent-color); } .preloader-cssload.cssload-three { right: 0%; bottom: 0%; animation: cssload-rotate-three 1.15s linear infinite; border-top: 5px solid var(--pt-accent-color); } @keyframes cssload-rotate-one { 0% { transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg); } 100% { transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg); } } @keyframes cssload-rotate-two { 0% { transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg); } 100% { transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg); } } @keyframes cssload-rotate-three { 0% { transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg); } 100% { transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg); } } /* Forms -------------------------------------------------------------- */ button, input { line-height: normal; transition: 0.3s; } button, input, select, textarea { font-size: 100%; line-height: inherit; vertical-align: baseline; } input, textarea { font-size: 1.5rem; max-width: 100%; background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0)); /* Removing the inner shadow on iOS inputs */ } input[type="checkbox"] { display: inline; } button, input[type="button"], input[type="reset"], input[type="submit"] { line-height: 1; cursor: pointer; -webkit-appearance: button; border: 0; outline: 0; } input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-results-button, input[type="search"]::-webkit-search-results-decoration { display: none; } button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } /* Remove chrome yellow autofill */ input:-webkit-autofill { -webkit-box-shadow: 0 0 0px 1000px #e9e9e9 inset; } /* Reset Search Styling */ input[type="search"] { outline: 0; } input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-results-button, input[type="search"]::-webkit-search-results-decoration { display: none; } /* Input Normal */ select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"] { font-family: inherit; line-height: 1.186; background: #fff; color: var(--pt-body-color); font-size: 1.4rem; min-width: 150px; padding: 12px 22px; border-radius: var(--pt-btn-radius); border: 1px solid #d9dfe7; text-shadow: none; box-shadow: none; box-sizing: border-box; transition: 0.3s; } textarea { border-radius: 12px; } select { -webkit-appearance: none; background: #fff url("data:image/svg+xml;utf8,") no-repeat; background-size: 10px; background-position: calc(100% - 8px) calc(50% + 3px); outline: 0; } #adminbarsearch input.adminbar-input { min-width: auto; } /* Input Focus */ select:focus, textarea:focus, input[type="text"]:focus, input[type="password"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="time"]:focus, input[type="week"]:focus, input[type="number"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="color"]:focus { border-color: #84858a; outline: 0; -webkit-box-shadow: none; box-shadow: none; } /* Button */ body .elementor-button, .button, button, input[type="button"], input[type="reset"], input[type="submit"] { font-family: inherit; line-height: 1.2; font-weight: 600; color: var(--pt-accent-color-alt); background-color: var(--pt-button-bg); padding: 1.042rem 1.8rem; border-radius: var(--pt-btn-radius); display: inline-block; font-size: 1.5rem; letter-spacing: -0.25px; -webkit-appearance: none; transition: 0.3s; white-space: nowrap; text-decoration: none; } body .elementor-button:focus, .button:focus, button:focus, input[type="button"]:focus, input[type="reset"]:focus, input[type="submit"]:focus { outline: 1px dashed; outline-offset: -3px; text-decoration: none; } .button .blogsy-svg-icon { margin-right: 0.4rem; transform: translateY(-1px); } .button-text { display: inline-block; font-weight: 500; color: var(--pt-headings-color); } .button-text:focus, .button-text:hover { color: var(--pt-accent-color); } .button-text .blogsy-svg-icon { font-size: 95%; margin-left: 0.4rem; transform: translateY(-1px); } body .elementor-button.elementor-size-xs { font-size: 1.4rem; padding: 8px 22px; border-radius: var(--pt-btn-radius); } body .elementor-button.elementor-size-md { font-size: 1.4rem; padding: 10px 34px; border-radius: var(--pt-btn-radius); } body .elementor-button.elementor-size-lg { font-size: 1.5rem; padding: 9px 50px; border-radius: var(--pt-btn-radius); } body .elementor-button.elementor-size-xl { font-size: 1.5rem; padding: 11px 70px; border-radius: var(--pt-btn-radius); } .elementor-button-icon { line-height: 1; } .elementor-button-content-wrapper { align-items: center; } /* Button hover */ body .elementor-button:hover, .button:hover, button:hover, input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover { outline: 0; background: var(--pt-button-bg-hover); color: #fff; } .btn-white { color: var(--pt-body-color); background-color: var(--pt-card-bg); } .btn-white:hover, .btn-white:focus { color: #fff; background-color: var(--pt-accent-color); } /* Button loading spinner */ .button .btn-loading-bar { width: 1em; height: 1em; border: 2px solid currentColor; border-bottom-color: transparent; border-radius: 50%; display: none; vertical-align: middle; box-sizing: border-box; animation: btn-loading-bar 500ms linear infinite; } .button.loading .btn-loading-bar { display: inline-block; } @keyframes btn-loading-bar { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } /* Select2 */ body .select2-container--default .select2-selection--single { background-color: #fff; border-radius: 6px; border: 1px solid #e9edf2; height: auto; } body .select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 1.6; font-size: 1.4rem; padding: 12px 20px; color: #4f535e; } body .select2-container--default .select2-selection--single .select2-selection__arrow { top: 52%; transform: translateY(-50%); } body .select2-results__option { font-size: 1.4rem; } /* Placeholder */ ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */ color: rgba(33, 37, 41, 0.5); opacity: 1; /* Firefox */ } :-ms-input-placeholder { /* Internet Explorer 10-11 */ color: rgba(33, 37, 41, 0.5); } ::-ms-input-placeholder { /* Microsoft Edge */ color: rgba(33, 37, 41, 0.5); } /* Links */ a { color: var(--pt-accent-color); outline: 0; text-decoration: none; transition: all ease 0.3s; } a:hover, a:focus, a:active { outline: 0; } a:hover { color: inherit; text-decoration: none; } li a { color: inherit; } li a:focus, li a:hover { color: var(--pt-accent-color); } /* Typography -------------------------------------------------------------- */ html{ scroll-behavior: smooth; } body { font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"; font-weight: 400; line-height: var(--pt-body-line-height); letter-spacing: normal; color: var(--pt-body-color); background: var(--pt-body-bg-color); } h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-family: "Instrument Sans",sans-serif; line-height: 1.4; margin-bottom: 1.5rem; margin-top: 0; font-weight: 600; color: var(--pt-headings-color); } p { margin: 0 0 2rem; } h1, .h1 { font-size: 2.7rem; } h2, .h2 { font-size: 2.4rem; } h3, .h3 { font-size: 2.2rem; } h4, .h4 { font-size: 1.8rem; } h5, .h5 { font-size: 1.7rem; } h6, .h6 { font-size: 1.6rem; } @media screen and (max-width: 1024px) { h1, .h1 { font-size: 2.4rem; } h2, .h2 { font-size: 2.2rem; } h3, .h3 { font-size: 2rem; } h4, .h4 { font-size: 1.8rem; } h5, .h5 { font-size: 1.7rem; } h6, .h6 { font-size: 1.5rem; } } /* Grid Helper -------------------------------------------------------------- */ /* width and padding base on Elementor */ body .e-con { --container-max-width: var(--pt-site-width); } .pt-container, .pt-container-fluid { width: 100%; padding-right: 1.5rem; padding-left: 1.5rem; } .pt-container { max-width: var(--pt-site-width); margin: 0 auto; } .pt-container-fluid { max-width: 100%; } .pt-row { display: flex; flex-wrap: wrap; --pt-gutter-x: 2.4rem; --pt-gutter-y: 0; margin-top: calc(var(--pt-gutter-y) * -1); margin-right: calc(var(--pt-gutter-x) / -2); margin-left: calc(var(--pt-gutter-x) / -2); } [class*="pt-col-"] { width: 100%; flex: 0 0 auto; max-width: 100%; padding-right: calc(var(--pt-gutter-x) / 2); padding-left: calc(var(--pt-gutter-x) / 2); margin-top: var(--pt-gutter-y); } .pt-col-1 { flex-basis: 8.33333%; max-width: 8.33333%; } .pt-col-2 { flex-basis: 16.66667%; max-width: 16.66667%; } .pt-col-3 { flex-basis: 25%; max-width: 25%; } .pt-col-4 { flex-basis: 33.33333%; max-width: 33.33333%; } .pt-col-5 { flex-basis: 41.66667%; max-width: 41.66667%; } .pt-col-6 { flex-basis: 50%; max-width: 50%; } .pt-col-7 { flex-basis: 58.33333%; max-width: 58.33333%; } .pt-col-8 { flex-basis: 66.66667%; max-width: 66.66667%; } .pt-col-9 { flex-basis: 75%; max-width: 75%; } .pt-col-10 { flex-basis: 83.33333%; max-width: 83.33333%; } .pt-col-11 { flex-basis: 91.66667%; max-width: 91.66667%; } .pt-col-12 { flex-basis: 100%; max-width: 100%; } .pt-d-flex { display: flex; } .pt-d-inline-flex { display: inline-flex; } .pt-d-none { display: none; } .pt-justify-content-start { justify-content: flex-start; } .pt-justify-content-end { justify-content: flex-end; } .pt-justify-content-center { justify-content: center; } .pt-align-items-start { align-items: flex-start; } .pt-align-items-end { align-items: flex-end; } .pt-align-items-center { align-items: center; } .pt-g-0 { gap: 0 } .pt-g-1 { gap: 1.5rem } .pt-g-2 { gap: 2.5rem } .pt-g-3 { gap: 3.2rem } .pt-p-0 { padding: 0; } .pt-p-1 { padding: 1.5rem; } .pt-p-2 { padding: 2.5rem; } .pt-p-3 { padding: 3.2rem; } .pt-pl-0 { padding-left: 0; } .pt-pl-1 { padding-left: 1.5rem; } .pt-pl-2 { padding-left: 2.5rem; } .pt-pl-3 { padding-left: 3.2rem; } .pt-pr-0 { padding-right: 0; } .pt-pr-1 { padding-right: 1.5rem; } .pt-pr-2 { padding-right: 2.5rem; } .pt-pr-3 { padding-right: 3.2rem; } .pt-pt-0 { padding-top: 0; } .pt-pt-1 { padding-top: 1.5rem; } .pt-pt-2 { padding-top: 2.5rem; } .pt-pt-3 { padding-top: 3.2rem; } .pt-pb-0 { padding-bottom: 0; } .pt-pb-1 { padding-bottom: 1.5rem; } .pt-pb-2 { padding-bottom: 2.5rem; } .pt-pb-3 { padding-bottom: 3.2rem; } .pt-ml-0 { margin-left: 0; } .pt-ml-1 { margin-left: 1.5rem; } .pt-ml-2 { margin-left: 2.5rem; } .pt-ml-3 { margin-left: 3.2rem; } .pt-mr-0 { margin-right: 0; } .pt-mr-1 { margin-right: 1.5rem; } .pt-mr-2 { margin-right: 2.5rem; } .pt-mr-3 { margin-right: 3.2rem; } .pt-mt-0 { margin-top: 0; } .pt-mt-1 { margin-top: 1.5rem; } .pt-mt-2 { margin-top: 2.5rem; } .pt-mt-3 { margin-top: 3.2rem; } .pt-mb-0 { margin-bottom: 0; } .pt-mb-1 { margin-bottom: 1.5rem; } .pt-mb-2 { margin-bottom: 2.5rem; } .pt-mb-3 { margin-bottom: 3.2rem; } .center-text { text-align: center; } .center-text .blogsy-divider-heading { justify-content: center; } @media (min-width: 768px) { .pt-col-md-1 { flex-basis: 8.33333%; max-width: 8.33333%; } .pt-col-md-2 { flex-basis: 16.66667%; max-width: 16.66667%; } .pt-col-md-3 { flex-basis: 25%; max-width: 25%; } .pt-col-md-4 { flex-basis: 33.33333%; max-width: 33.33333%; } .pt-col-md-5 { flex-basis: 41.66667%; max-width: 41.66667%; } .pt-col-md-6 { flex-basis: 50%; max-width: 50%; } .pt-col-md-7 { flex-basis: 58.33333%; max-width: 58.33333%; } .pt-col-md-8 { flex-basis: 66.66667%; max-width: 66.66667%; } .pt-col-md-9 { flex-basis: 75%; max-width: 75%; } .pt-col-md-10 { flex-basis: 83.33333%; max-width: 83.33333%; } .pt-col-md-11 { flex-basis: 91.66667%; max-width: 91.66667%; } .pt-col-md-12 { flex-basis: 100%; max-width: 100%; } .pt-d-md-flex { display: flex; } .pt-d-inline-md-flex { display: inline-flex; } .pt-d-md-none { display: none; } .pt-justify-content-md-start { justify-content: flex-start; } .pt-justify-content-md-end { justify-content: flex-end; } .pt-justify-content-md-center { justify-content: center; } .pt-align-items-md-start { align-items: flex-start; } .pt-align-items-md-end { align-items: flex-end; } .pt-align-items-md-center { align-items: center; } .pt-g-md-0 { gap: 0 } .pt-g-md-1 { gap: 1.5rem } .pt-g-md-2 { gap: 2.5rem } .pt-g-md-3 { gap: 3.2rem } .pt-p-md-0 { padding: 0; } .pt-p-md-1 { padding: 1.5rem; } .pt-p-md-2 { padding: 2.5rem; } .pt-p-md-3 { padding: 3.2rem; } .pt-pl-md-0 { padding-left: 0; } .pt-pl-md-1 { padding-left: 1.5rem; } .pt-pl-md-2 { padding-left: 2.5rem; } .pt-pl-md-3 { padding-left: 3.2rem; } .pt-pr-md-0 { padding-right: 0; } .pt-pr-md-1 { padding-right: 1.5rem; } .pt-pr-md-2 { padding-right: 2.5rem; } .pt-pr-md-3 { padding-right: 3.2rem; } .pt-pt-md-0 { padding-top: 0; } .pt-pt-md-1 { padding-top: 1.5rem; } .pt-pt-md-2 { padding-top: 2.5rem; } .pt-pt-md-3 { padding-top: 3.2rem; } .pt-pb-md-0 { padding-bottom: 0; } .pt-pb-md-1 { padding-bottom: 1.5rem; } .pt-pb-md-2 { padding-bottom: 2.5rem; } .pt-pb-md-3 { padding-bottom: 3.2rem; } .pt-ml-md-0 { margin-left: 0; } .pt-ml-md-1 { margin-left: 1.5rem; } .pt-ml-md-2 { margin-left: 2.5rem; } .pt-ml-md-3 { margin-left: 3.2rem; } .pt-mr-md-0 { margin-right: 0; } .pt-mr-md-1 { margin-right: 1.5rem; } .pt-mr-md-2 { margin-right: 2.5rem; } .pt-mr-md-3 { margin-right: 3.2rem; } .pt-mt-md-0 { margin-top: 0; } .pt-mt-md-1 { margin-top: 1.5rem; } .pt-mt-md-2 { margin-top: 2.5rem; } .pt-mt-md-3 { margin-top: 3.2rem; } .pt-mb-md-0 { margin-bottom: 0; } .pt-mb-md-1 { margin-bottom: 1.5rem; } .pt-mb-md-2 { margin-bottom: 2.5rem; } .pt-mb-md-3 { margin-bottom: 3.2rem; } } .clear { clear: both; } /* Content Wrapper Page */ .page-content-wrapper { --pt-gutter-x: 2.4rem; --sidebar-width: 390px; } .page-content-wrapper > .sidebar-container, .page-content-wrapper > .content-container { width: 100%; max-width: 100%; flex: 0 0 auto; padding-right: calc(var(--pt-gutter-x) / 2); padding-left: calc(var(--pt-gutter-x) / 2); margin-top: var(--pt-gutter-y); } .page-content-wrapper > .sidebar-container { flex-basis: var(--sidebar-width); max-width: var(--sidebar-width); margin-bottom: 40px; } .page-content-wrapper.sidebar-left { flex-direction: row-reverse; } .page-content-wrapper.sidebar-left > .content-container, .page-content-wrapper.sidebar-right > .content-container { flex-basis: calc(100% - var(--sidebar-width)); max-width: calc(100% - var(--sidebar-width)); } .page-content-wrapper.sidebar-none > .content-container { flex-basis: 100%; max-width: 100%; margin: 0 auto; } .page-content-wrapper.sidebar-none-narrow > .content-container { flex-basis: 840px; max-width: 840px; margin: 0 auto; } /*.page-content-wrapper > .content-container.archive-content-container, .woocommerce-page .page-content-wrapper > .content-container { flex-basis: 100%; max-width: 100%; }*/ @media screen and (max-width: 1200px) { .page-content-wrapper { --sidebar-width: 350px; } } @media screen and (max-width: 1024px) { .page-content-wrapper.sidebar-none > .content-container, .page-content-wrapper.sidebar-none-narrow > .content-container, .page-content-wrapper > .sidebar-container, .page-content-wrapper.sidebar-left > .content-container, .page-content-wrapper.sidebar-right > .content-container { flex-basis: 100%; max-width: 100%; } } /* Sidebar -------------------------------------------------------------- */ .sidebar-container.sticky .sidebar-container-inner { position: sticky; top: 10px; transition: 0.6s top; } .sidebar-container-inner .widget { margin-bottom: 20px; } /* wp widgets ( Advertisements ) -------------------------------------------------------------- */ #site-inner > .blogsy-banner-widget { padding: 12px 0; } #site-inner > .blogsy-banner-widget + #blogsy-ticker .blogsy-ticker { padding-top: 0; } #site-inner .main-wrapper > .content-wrapper > .pt-container > .blogsy-banner-widget { padding-bottom: 12px; } #site-inner .main-wrapper + .blogsy-banner-widget { padding-top: 0; } /* Breadcrumb -------------------------------------------------------------- */ .breadcrumb-wrapper.sidebar-none-narrow { max-width: 840px; margin: auto; } @media screen and (max-width: 1024px) { .breadcrumb-wrapper.sidebar-none, .breadcrumb-wrapper.sidebar-none-narrow { max-width: 100%; } } .blogsy-breadcrumb { font-size: 1.4rem; margin-bottom: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #898897; position: relative; } .blogsy-breadcrumb a { font-weight: 500; color: inherit; transition: 0.3s; text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 2px; text-decoration-thickness: 2px; } .blogsy-breadcrumb a:focus, .blogsy-breadcrumb a:hover { text-decoration-color: currentColor; } .blogsy-breadcrumb .delimiter { margin: 0 7px; font-size: 1.05rem; } .blogsy-breadcrumb .current { opacity: 0.8; } /* Footer -------------------------------------------------------------- */ #site-footer { margin-top: 50px; } /* Stick Footer to Bottom */ #site-inner { display: flex; flex-direction: column; position: relative; min-height: 100vh; } .admin-bar #site-inner { min-height: calc(100vh - 32px); } .main-wrapper { flex-grow: 1; } /* Back to Top Button */ #back-to-top { opacity: 0; visibility: hidden; transform: translateY(15px); position: fixed; bottom: 1rem; right: 1rem; z-index: 9; display: flex; justify-content: center; align-items: center; border-radius: 50%; background: 0 0; box-shadow: 0px 5px 20px 0px var(--pt-accent-80-color); color: var(--pt-body-color); transition: .25s; animation: fade .5s; width: 48px; height: 48px; padding: 0; } @keyframes fade { 0% { opacity: 0 } 100% { opacity: 1 } } #back-to-top.show { opacity: 1; visibility: visible; transform: translateY(0); } #back-to-top:after { content: ""; position: absolute; top: 2px; left: 2px; z-index: -1; width: 45px; height: 45px; border-radius: 50%; background: var(--pt-card-bg); transition: .25s; } #back-to-top:hover { background: inherit; color: var(--pt-accent-color); box-shadow: var(--pt-shadow-soft); } #back-to-top .blogsy-svg-icon { transition: .25s; } #back-to-top:hover .blogsy-svg-icon { opacity: .8; } .scroll-top-border, .scroll-top-progress { position: absolute; top: 0; left: 0; } .scroll-top-border path, .scroll-top-progress path { stroke-width: 2; fill: none; stroke-dasharray: 141.37px,141.37px; stroke-dashoffset: 0; transition: stroke-dashoffset .5s linear } .scroll-top-border path { stroke: var(--pt-card-bg); } .scroll-top-progress path { stroke: var(--pt-accent-color) } @media (min-width: 992px) { #back-to-top { bottom: 3.2rem; right: 3.2rem; } } @media screen and (max-width: 1024px) { #back-to-top { display: none; } } /* Default Footer -------------------------------------------------------------- */ .site-default-footer { position: relative; border-width: 0; overflow: hidden; background: var(--pt-card-bg); } .site-default-footer .default-footer-copyright { text-align: center; border-top: 1px solid var(--pt-border-color); padding-top: 20px; padding-bottom: 20px; } .site-default-footer a { color: inherit; } .site-default-footer a:focus, .site-default-footer a:hover { color: var(--pt-accent-color); } .default-footer-main { width: 100%; padding-top: 55px; padding-bottom: 55px; } .default-footer-main { --pt-gutter-y: 1.5rem; } .default-footer-main .blogsy-footer-column .widget_block + .widget_block { margin-top: 20px; } .default-footer-main .blogsy-no-widget .no-widget-text { margin-bottom: 0; margin-top: 5px; } /* Cursor Effect -------------------------------------------------------------- */ .blogsy-mouse-cursor { position: fixed; left: 0; top: 0; pointer-events: none; border-radius: 50%; transform: translateZ(0); z-index: 99999999999; visibility: hidden; opacity: 0; transition: transform 0s ease-out, opacity 0.3s; } .blogsy-mouse-cursor.outer { transition: transform 0.2s ease-out, opacity 0.3s; } .blogsy-mouse-cursor.visible { visibility: visible; opacity: 1; } .blogsy-mouse-cursor::before { content: ''; position: absolute; left: 0; top: 0; transform: translate(-50%, -50%); border-radius: 50%; transition: 0.3s; } .blogsy-mouse-cursor.outer::before { width: 30px; height: 30px; border: 2px solid #4b4e5d; } .blogsy-mouse-cursor.inner::before { width: 6px; height: 6px; background: #4b4e5d; } .blogsy-mouse-cursor.outer.hovered::before { opacity: 0; } .blogsy-mouse-cursor.inner.hovered::before { transform: translate(-50%, -50%) scale(12); opacity: 0.2; } @media (max-width: 1024px) { .blogsy-mouse-cursor { display: none; } } /* Helper -------------------------------------------------------------- */ .noTransition, .noTransition * { transition: none !important; } /* Title Animation */ .title-animation-default, .title-animation-middle-underline, .title-animation-under-cover { transition: 0.5s cubic-bezier(0.25, 0.8, 0.25, 1); box-decoration-break: clone; -webkit-box-decoration-break: clone; } .title-animation-middle-underline, .title-animation-underline, .title-animation-underline-in-out, .title-animation-under-cover { --underline-position: bottom; --underline-size: 2px; background-image: linear-gradient(90deg, currentColor, currentColor); background-repeat: no-repeat; background-size: 0% var(--underline-size); background-position: 0% var(--underline-position); transition: 0.5s cubic-bezier(0.25, 0.8, 0.25, 1); display: inline; } h5 a[class*="title-animation"], h6 a[class*="title-animation"] { --underline-size: 1px; } .title-animation-middle-underline { background-position: 50% var(--underline-position); } .title-animation-middle-underline:focus, .title-animation-middle-underline:hover, .title-animation-underline:focus, .title-animation-underline:hover { background-size: 100% var(--underline-size); text-decoration: none; } .title-animation-under-cover { --underline-size: 10px; background-size: 100% 0; transition: 0.25s ease-in-out; } .title-animation-under-cover:hover { background-size: 100% var(--underline-size); } .title-animation-underline-in-out { background-position: right 0% var(--underline-position); transition: 0.6s cubic-bezier(0.25, 0.8, 0.25, 1), background-position 0s; } .title-animation-underline-in-out:hover { background-size: 100% var(--underline-size); background-position: left 0% var(--underline-position); } .title-animation-underline-fix { text-decoration: underline !important; } .title-animation-middle-fix { text-decoration: line-through !important; } .title-animation-underline-fix, .title-animation-middle-fix { box-decoration-break: clone; -webkit-box-decoration-break: clone; transition: 0.6s cubic-bezier(0.25, 0.8, 0.25, 1); display: inline; padding: 2px 0; text-decoration-thickness: 0.13em !important; text-decoration-color: transparent !important; } .title-animation-underline-fix:hover, .title-animation-middle-fix:hover { text-decoration-color: currentColor !important; } /* Position */ .blogsy-position-absolute { position: absolute; } .blogsy-position-relative { position: relative; } .blogsy-position-cover { position: absolute; top: 0; bottom: 0; left: 0; right: 0; } .blogsy-position-default { top: 40px; right: 20px; position: absolute; } .blogsy-position-top { top: 0; left: 0; right: 0; position: absolute; } .blogsy-position-bottom { bottom: 0; left: 0; right: 0; position: absolute; } .blogsy-position-left { top: 0; bottom: 0; left: 0; position: absolute; } .blogsy-position-right { top: 0; bottom: 0; right: 0; position: absolute; } .blogsy-position-center { top: 50%; right: 0; left: 0; transform: translateY(-50%); position: absolute; } .blogsy-position-top-left { top: 0; left: 0; position: absolute; } .blogsy-position-top-center { top: 0; left: 50%; transform: translateX(-50%); position: absolute; } .blogsy-position-top-right { top: 0; right: 0; position: absolute; } .blogsy-position-bottom-left { bottom: 0; left: 0; position: absolute; } .blogsy-position-bottom-center { bottom: 0; left: 50%; transform: translateX(-50%); position: absolute; } .blogsy-position-bottom-right { bottom: 0; right: 0; position: absolute; } .blogsy-position-center-left { top: 50%; left: 0; transform: translateY(-50%); position: absolute; } .blogsy-position-center-center { top: 50%; left: 50%; transform: translate(-50%, -50%); position: absolute; } .blogsy-position-center-right { top: 50%; right: 0; transform: translateY(-50%); position: absolute; } /* Gutenberg -------------------------------------------------------------- */ body .alignleft { display: inline-block; float: left; margin-right: 1.5em; } body .alignright { display: inline-block; float: right; margin-left: 1.5em; } body .aligncenter { display: block; margin-left: auto; margin-right: auto; clear: both; } body .alignwide { width: 100%; } .blogsy-disable-page-card-style .pt-container .alignfull, body .pt-container .alignfull { margin-left: calc(-50vw + 50%); margin-right: calc(-50vw + 50%); max-width: 100vw; width: 100vw; clear: both; } body:not(.blogsy-disable-page-card-style) .pt-container .alignwide .alignfull, body:not(.blogsy-disable-page-card-style) .card-layout-w .alignwide { width: unset; max-width: unset; } body .card-layout-w .alignfull { max-width: unset; width: unset; margin-left: -4rem; margin-right: -4rem; } @media (max-width: 767px) { body .card-layout-w .alignfull { margin-left: -2rem; margin-right: -2rem; } } body .pt-container .alignwide .alignfull, body .card-layout-w .alignfull .alignfull, body .card-layout-w .alignwide .alignfull { margin-left: 0; margin-right: 0; } .wp-caption { margin: 0 0 30px; max-width: 100%; } .wp-caption.aligncenter { margin: 0 auto 30px; } .wp-caption.alignleft { margin: 0 30px 30px 0; } .wp-caption.alignright { margin: 0 0 30px 30px; } .wp-caption-text { text-align: center; padding: 5px 0; } .gallery { display: grid; gap: 20px; } .elementor-image-gallery .gallery { display: block; } @media screen and (min-width: 600px) { .gallery.gallery-columns-2 { grid-template-columns: repeat(2, 1fr); } .gallery.gallery-columns-3 { grid-template-columns: repeat(3, 1fr); } .gallery.gallery-columns-4 { grid-template-columns: repeat(4, 1fr); } .gallery.gallery-columns-5 { grid-template-columns: repeat(5, 1fr); } .gallery.gallery-columns-6 { grid-template-columns: repeat(6, 1fr); } .gallery.gallery-columns-7 { grid-template-columns: repeat(7, 1fr); } .gallery.gallery-columns-8 { grid-template-columns: repeat(8, 1fr); } .gallery.gallery-columns-9 { grid-template-columns: repeat(9, 1fr); } } .gallery img { width: 100%; } .gallery-caption { display: block; } .wp-block-image figcaption a { width: auto !important; } .wp-block-image.size-full > img { width: 100%; } .wp-block-gallery { --wp--style--gallery-gap-default: 20px; } .wp-block-gallery.alignleft { margin-right: 1.5em; } .wp-block-gallery.alignright { margin-left: 1.5em; } .wp-block-search .wp-block-search__input { margin: 0; } .wp-block-latest-posts__list { padding: 0; } .wp-block-pullquote blockquote { border: none; margin-bottom: 0; } .wp-block-pullquote { border-left: none; border-right: none; } .wp-block-pullquote p { font-size: 1.45em; } .wp-block-quote.is-large:not(.is-style-plain) cite, .wp-block-quote.is-large:not(.is-style-plain) footer, .wp-block-quote.is-style-large:not(.is-style-plain) cite, .wp-block-quote.is-style-large:not(.is-style-plain) footer { font-size: 1.125em; text-align: right; } .wp-block-quote.is-style-plain { padding-left: 1em; border-left: 4px solid var(--pt-headings-color); font-style: italic; } .wp-block-quote:not(.is-style-plain) { background: #f5f7f9; border-color: var(--pt-accent-color); border-radius: 6px; padding: 30px; position: relative; } .wp-block-quote:not(.is-style-plain)::before { content: ""; -webkit-mask-image: url("data:image/svg+xml; utf8, "); mask-image: url("data:image/svg+xml; utf8, "); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100%; mask-size: 100%; line-height: 1; width: 1em; height: 1em; font-size: 3.75rem; background-color: currentColor; margin-bottom: 2.25rem; display: block; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .wp-block-cover .wp-block-cover__inner-container a, .wp-block-cover .wp-block-cover__inner-container a:focus, .wp-block-cover .wp-block-cover__inner-container a:hover { color: inherit; } .wp-block-code { background: transparent; border: 1px solid #ccc; border-radius: 4px; font-family: monospace; padding: 0.8em 1em; } .wp-block-code>code { background: transparent; } .wp-block-cover { margin-bottom: 2.25rem; } .wp-block-archives-list { list-style: none; padding: 0; } .wp-block-categories-list, .wp-block-categories__list { list-style: none; padding: 0; } .wp-block-categories-list ul, .wp-block-categories__list ul { list-style: none; padding: 0 0 0 20px; margin: 0; } .wp-block-page-list { list-style: none; padding: 0; } .wp-block-page-list ul { list-style: none; padding: 0 0 0 20px; } .wp-block-post-template { padding: 0; margin: 0; } .wp-block-rss { padding: 0; } .wc-block-product-categories-list { padding: 0; list-style: none; } .wc-block-product-categories-list ul { padding: 0 0 0 20px; } .wc-block-product-categories-list--has-images ul { padding: 0; } .wc-block-product-categories-list--has-images ul .wc-block-product-categories-list-item { margin: 4px 0; } .widget_archive ul { list-style: none; padding: 0; } .widget_product_categories ul { list-style: none; padding: 0; } .widget_product_categories ul ul { padding: 0 0 0 20px; } .wp-block-loginout label { display: block; } .widget_categories ul { list-style: none; padding: 0; } .widget_categories ul ul { padding: 0 0 0 20px; } .widget_pages ul { list-style: none; padding: 0; } .widget_pages ul ul { padding: 0 0 0 20px; } .widget_meta ul { list-style: none; padding: 0; } .widget_nav_menu ul { list-style: none; padding: 0; } .widget_nav_menu ul ul { padding: 0 0 0 20px; } .widget_recent_comments ul { list-style: none; padding: 0; } .widget_recent_entries ul { list-style: none; padding: 0; } .widget_rss ul { list-style: none; padding: 0; } .wp-block-latest-comments__comment-meta a { font-weight: 600; } .wp-block-calendar td, .wp-block-calendar th { text-align: center; } .wp-block-latest-posts a, .widget_recent_entries a, .wp-block-rss__item-title a, .widget_rss a { font-weight: 600; } .wp-calendar-table td, .wp-calendar-table th { text-align: center; } .wp-calendar-nav { text-align: center; } .tagcloud a, .wp-block-tag-cloud a { color: inherit; } .tagcloud a:focus, .tagcloud a:hover, .wp-block-tag-cloud a:focus, .wp-block-tag-cloud a:hover { color: var(--pt-accent-color); } .wp-block-latest-comments { padding: 0; } .wp-block-group.has-background { padding: 1.25em 2.375em; } .wp-block-cover { color: #fff; } .wp-block-separator:not(.is-style-wide):not(.is-style-dots) { margin-left: auto; margin-right: auto; } .single-content-inner p:not([class*="wp-elements"]) a:not(.button, .post-page-numbers), .wp-block-list li a { position: relative; color: var(--pt-accent-color); background-image: linear-gradient(90deg, currentColor, currentColor); background-repeat: no-repeat; background-size: 0% 1px; background-position: 0% bottom; transition: 0.5s cubic-bezier(0.25, 0.8, 0.25, 1); display: inline; padding: 2px 0; text-decoration: none; } .single-content-inner p:not([class*="wp-elements"]) a:not(.button, .post-page-numbers):focus, .single-content-inner p:not([class*="wp-elements"]) a:not(.button, .post-page-numbers):hover, .wp-block-list li a:focus, .wp-block-list li a:hover { background-size: 100% 1px; } .single-content-inner > .single-page-title.screen-reader-text+[class*="wp-block"], .single-content-inner > [class*="wp-block"]:first-child { margin-top: -4rem; } .single-content-inner > [class*="wp-block"]:last-child { margin-bottom: -4rem; } .sidebar-container .sidebar-container-inner > *+* { margin-top: 2.4rem; } .widget_block p:last-child { margin-bottom: 0; } .widget_nav_menu .menu .blogsy-svg-icon { display: none; } .widget_nav_menu .menu .menu-item-has-children > a { display: inline-block; margin-bottom: 10px; } .wp-block-tag-cloud a { display: inline-flex; gap: 2px; font-weight: 500; white-space: nowrap; font-size: 1.4rem; position: relative; color: var(--pt-body-color) !important; padding-left: 1.5rem; transition: all 0.35s cubic-bezier(0.645, 0.045, 0.355, 1); } .wp-block-tag-cloud a::after { content: ''; position: absolute; left: 0; bottom: 0; width: 100%; transform: translateY(3px); height: 1px; opacity: 0; transition: 0.3s; background: var(--pt-accent-color); } .wp-block-tag-cloud a:focus::after, .wp-block-tag-cloud a:hover::after { transform: translateY(0) !important; opacity: 1 !important; } .blogsy-sidebar-widget ol, .blogsy-sidebar-widget ul { line-height: 1.5; } .blogsy-sidebar-widget ol:last-child, .blogsy-sidebar-widget ul:last-child { margin-bottom: 0; } .blogsy-sidebar-widget ol li, .blogsy-sidebar-widget ul:not(.wp-block-social-links) li { margin-bottom: 1rem; } .blogsy-sidebar-widget ol li:last-child, .blogsy-sidebar-widget ul:not(.wp-block-social-links) li:last-child { margin-bottom: 0; } .blogsy-sidebar-widget ol li.current_page_item>a, .blogsy-sidebar-widget ul li.current_page_item>a { font-weight: 600; } .blogsy-sidebar-widget .wp-block-archives li, .blogsy-sidebar-widget .wp-block-categories li, .blogsy-sidebar-widget.widget_archive li, .blogsy-sidebar-widget.widget_categories li { display: block; position: relative; } .widget_block li a, .blogsy-sidebar-widget.widget_meta li a, .blogsy-sidebar-widget.widget_pages li a, .blogsy-sidebar-widget.widget_nav_menu li a, .blogsy-sidebar-widget.widget_archive li a, .blogsy-sidebar-widget.widget_categories li a { position: relative; z-index: 0; } .widget_block ul:not(.submenu-container, .wp-block-social-links, .wp-block-latest-posts__list) > li > a::before, .blogsy-sidebar-widget.widget_archive ul:not(.children) > li > a::before, .blogsy-sidebar-widget.widget_categories ul:not(.children) > li > a::before, .blogsy-sidebar-widget.widget.widget_pages ul:not(.sub-menu) > li > a::before, .blogsy-sidebar-widget.widget_nav_menu ul:not(.sub-menu) > li > a::before { content: '-'; display: inline-block; vertical-align: middle; margin-top: -.4rem; opacity: 0; visibility: hidden; color: inherit; transform: translateX(-1.6rem); transition: all .35s cubic-bezier(.645,.045,.355,1); } .widget_block ul:not(.submenu-container, .wp-block-social-links, .wp-block-latest-posts__list) > li > a:focus::before, .widget_block ul:not(.submenu-container, .wp-block-social-links, .wp-block-latest-posts__list) > li > a:hover::before, .blogsy-sidebar-widget.widget_archive ul:not(.children) > li > a:focus::before, .blogsy-sidebar-widget.widget_archive ul:not(.children) > li > a:hover::before, .blogsy-sidebar-widget.widget_categories ul:not(.children) > li > a:focus::before, .blogsy-sidebar-widget.widget_categories ul:not(.children) > li > a:hover::before, .blogsy-sidebar-widget.widget_pages ul:not(.sub-menu) > li > a:focus::before, .blogsy-sidebar-widget.widget_pages ul:not(.sub-menu) > li > a:hover::before, .blogsy-sidebar-widget.widget_nav_menu ul:not(.sub-menu) > li > a:focus::before, .blogsy-sidebar-widget.widget_nav_menu ul:not(.sub-menu) > li > a:hover::before { opacity: 1; visibility: visible; margin-right: 0.6rem; transform: translateX(0); } .blogsy-sidebar-widget .wp-block-archives ul.children>li>a::before, .blogsy-sidebar-widget .wp-block-categories ul.children>li>a::before { display: none; } .sidebar-container .blogsy-sidebar-widget ul:not(.blogsy-socials-menu, .wp-block-social-links, .wp-block-latest-posts)>li:not(:first-child) { padding-top: 1rem; border-top: .1rem solid rgba(185, 185, 185, 0.4); } .sidebar-container .blogsy-sidebar-widget ul>:not(.blogsy-socials-menu, .children, .submenu-container) li, .sidebar-container .blogsy-sidebar-widget ul>:not(.blogsy-socials-menu, .sub-menu, .submenu-container) li { padding: 0; border: 0; } .widget_block .wp-block-cover, .blogsy-divider-heading+.blogsy-sidebar-widget .menu, .wp-block-heading+.blogsy-sidebar-widget .menu { margin-top: 0; } .wp-block-social-link:focus-within { outline: 1px dotted; outline-offset: -3px; transform: scale(1.1); } .wp-block-search__button.has-icon { padding: 0.375em .799em; } .wp-block-search__button:not(.has-icon) { font-weight: 500; padding: 0.375em 1.75em; } .wp-block-search.wp-block-search__button-only .wp-block-search__inside-wrapper { gap: 10px; } .wp-block-search.wp-block-search__button-only .wp-block-search__button { font-weight: 500; line-height: 2.5; } html :where(.wp-block-search__button-inside .wp-block-search__inside-wrapper) { padding: 2px; border-color: #d9dfe7; border-radius: 50rem; } html :where(.wp-block-search__button-inside .wp-block-search__inside-wrapper) .wp-block-search__input { border-color: transparent; } html :where(.wp-block-search__button-inside .wp-block-search__inside-wrapper) .wp-block-search__button { margin-left: 5px; } .is-style-checkmark-list { list-style-type: "\2713"; } .is-style-arrow-list, .is-style-checkmark-list { padding-left: 23px; } .is-style-arrow-list { list-style-type: "\2192"; } .is-style-arrow-list > li, .is-style-checkmark-list > li { padding-inline-start: 1ch; } /* Page Elements -------------------------------------------------------------- */ .single-page-outside { margin-top: 50px; } #site-header + #main .single-page-outside { margin-top: 20px; } .single-page-title { margin: -20px 0 35px; border-bottom: 1px solid var(--pt-border-color); padding: 0 0 1.5rem; word-wrap: break-word; word-break: break-word; } .single-page-title.screen-reader-text { border-bottom: 0; padding: 0; margin: 0; } @media (max-width: 767px) { .single-page-title { margin: -10px 0 30px; } } /* Comments list -------------------------------------------------------------- */ .comments-container { margin: 50px 0; } .comments-title { margin-bottom: 3rem; } .comment-list { padding: 0; margin: 0; list-style: none; margin-bottom: 50px; } .bypostauthor { display: block; } .comment-list .children { margin: 0; padding: 0; padding-left: 50px; list-style: none; } .comment-list .comment-body { margin-bottom: 30px; } .comment-list .comment-author img { display: inline-block; margin-right: 15px; border-radius: 50px; width: 45px; height: 45px; } .comment-list .comment-author .says { display: none; } .comment-list .comment-author .fn, .comment-list .comment-author a { font-weight: 600; font-size: 1.4rem; color: inherit; display: inline-block; } .comment-list .comment-metadata { line-height: 1; font-size: 1.2rem; border-left: 1px solid #97a6b3; padding-left: 10px; } .comment-list .comment-metadata a { color: #97a6b3; } .comment-list .comment-content { font-size: 1.4rem; background: rgba(160, 163, 180, 0.1); padding: 20px; border-radius: var(--pt-soft-radius); margin-top: 10px; } .comment-list .comment-awaiting-moderation { font-size: 1.4rem; padding: 5px; width: 100%; } .comment-list .trackback .comment-content, .comment-list .pingback .comment-content { margin-left: 0; margin-top: 15px; } .comment-list .comment-content p { margin-bottom: 1.5rem; } .comment-list .comment-meta { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; } .comment-list .comment-meta .comment-author { display: flex; align-items: center; } .comment-list .reply { margin-top: 10px; } .comment-list .reply a { display: inline-block; color: #606c8a; padding: 2px 14px; font-weight: 500; font-size: 1.4rem; } .comment-reply-title { font-size: 1.7rem; margin-bottom: 0.75rem; } .comment-notes { font-size: 1.4rem; color: #8790a4; } .comment-form-cookies-consent { font-size: 1.4rem; } .comment-form .form-textarea { width: 100%; height: 200px; margin-bottom: 20px; } .comment-form .form-author, .comment-form .form-email, .comment-form .form-website { margin-bottom: 20px; } .comment-form .form-author { float: left; width: 49%; margin-right: 1%; } .comment-form .form-email { width: 49%; margin-left: 1%; float: right; } .comment-form .form-website { width: 100%; } #cancel-comment-reply-link { margin-left: 10px; } @media screen and (max-width: 767px) { .comment-list .children { padding-left: 0; } .comment-list .comment-metadata { border: none; } .comment-form .form-author, .comment-form .form-email { width: 100%; margin-right: 0; margin-left: 0; } } .comment-list-wrapper.compact { position: relative; height: 500px; overflow: hidden; margin-bottom: 50px; } .comment-list-wrapper.compact::after { content: ''; position: absolute; left: 0; width: 100%; bottom: 0; height: 100%; background: linear-gradient(0deg, var(--pt-card-bg), transparent); } .comment-list-wrapper.compact .comment-list { height: 500px; overflow: hidden; margin: 0; } .comments-compact-btn { display: inline-block; position: absolute; left: 50%; bottom: 20px; transform: translateX(-50%); z-index: 10; background: #131314; color: #fff; padding: 3px 16px; border-radius: 50px; cursor: pointer; white-space: nowrap; box-shadow: 0 2px 10px #17171d4d; font-size: 1.425rem; transition: 0.3s; } .comments-compact-btn:hover { background: var(--pt-accent-color); box-shadow: 0 4px 15px var(--pt-accent-color); } .comments-pagination { margin-top: 1.5rem; margin-bottom: 3rem; } .comments-pagination .nav-links { display: flex; flex-wrap: wrap; gap: 15px; } /* Blog Archive Header -------------------------------------------------------------- */ .home.blog .main-wrapper > .content-wrapper { margin-top: 40px; } #site-header + #main .blog-archive-title { margin-top: 20px; } .blog-archive-title { margin: 60px 0 30px; text-align: center; } .blog-archive-title .title-wrap { display: inline-block; } .blog-archive-title .title { margin: 0; font-size: 3rem; display: inline-block; gap: 5px; } @media screen and (max-width: 1024px) { .blog-archive-title .title { font-size: 2.4rem; } } .blog-archive-title .title::before { margin: 0 5px; color: var(--term-color, var(--pt-accent-color)); } .blog-archive-title .sub-title { font-size: 1.4rem; display: block; position: relative; } .blog-archive-title .sub-title:after, .blog-archive-title .sub-title:before { content: ""; width: 1.4rem; height: 2px; margin: 5px; display: inline-block; background-color: currentColor; vertical-align: middle; opacity: 0.5; } .blog-archive-title .post-count { width: 100%; margin-top: 25px; } .blog-archive-title .post-count span { background: #3234400a; padding: 4px 16px; display: inline-block; font-size: 1.2rem; border-radius: 50px; font-weight: 500; } .blog-archive-title .description { margin-top: 25px; max-width: 900px; margin-left: auto; margin-right: auto; } .blog-archive-title .description p { margin: 0; } .blog-archive-title .blogsy-search-form { max-width: 650px; margin-top: 25px; margin-left: auto; margin-right: auto; position: relative; } .blog-archive-title .blogsy-search-form .search-field { width: 100%; margin: 0; } .blog-archive-title .blogsy-search-form .submit { position: absolute; right: 5px; top: 50%; transform: translateY(-50%); padding: 12px; margin: 0; font-size: 16px; line-height: 1; } .blog-archive-title .blogsy-search-form .submit i { display: block; } .blog-archive-title .avatar-wrap { display: inline-flex; align-items: center; justify-content: center; gap: 25px; flex-wrap: wrap; } .blog-archive-title .avatar img { border-radius: 50%; border: 4px solid #D8D8E6; width: 120px; height: 120px; } .blog-archive-title .author-social-links { margin-top: 25px; } @media screen and (max-width: 767px) { .blog-archive-author-box { flex-direction: column; text-align: center; } .blog-archive-author-box div.avatar { margin: 0; } .blog-archive-title .blog-archive-author-box .post-count, .blog-archive-title .blog-archive-search .post-count { text-align: center; margin-top: 15px; } } /* Blog Archive List Default -------------------------------------------------------------- */ .default-archive-wrap { display: grid; grid-template-columns: repeat(2, 1fr); row-gap: 2.4rem; column-gap: 2.4rem; } .default-archive-wrap:not(.blog-masonry) .default-post-list-item { display: inline-flex; flex-direction: column; justify-content: space-between; } .page-content-wrapper.sidebar-right .default-archive-wrap, .page-content-wrapper.sidebar-left .default-archive-wrap { grid-template-columns: repeat(1, 1fr); } .default-archive-wrap.column-layout-1:not(.blog-masonry) { grid-template-columns: repeat(1, 1fr); } .default-archive-wrap.column-layout-2:not(.blog-masonry) { grid-template-columns: repeat(2, 1fr); } .default-archive-wrap.column-layout-3:not(.blog-masonry) { grid-template-columns: repeat(3, 1fr); } .default-archive-wrap.column-layout-4:not(.blog-masonry) { grid-template-columns: repeat(4, 1fr); } @media (max-width: 1024px) { .default-archive-wrap { grid-template-columns: repeat(1, 1fr); } .default-archive-wrap.column-layout-2:not(.blog-masonry), .default-archive-wrap.column-layout-3:not(.blog-masonry), .default-archive-wrap.column-layout-4:not(.blog-masonry) { grid-template-columns: repeat(2, 1fr); } } .default-post-list-item .post-wrapper-inner { display: flex; align-items: center; gap: 25px; } @media (max-width: 767px) { .default-post-list-item .post-wrapper-inner { gap: 16px; flex-direction: column; text-align: center; } .default-archive-wrap.column-layout-2:not(.blog-masonry), .default-archive-wrap.column-layout-3:not(.blog-masonry), .default-archive-wrap.column-layout-4:not(.blog-masonry) { grid-template-columns: repeat(1, 1fr); } } .default-post-list-item.sticky { outline-offset: 1px; outline: 2px solid var(--pt-accent-color); } .default-post-list-item.sticky .title { position: relative; } .default-post-list-item.sticky .title::before { content: ""; mask-image: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22m15.297%201-.594.81-4.243%205.785c-2.274-.396-4.68.246-6.433%202l-.622.594L8%2014.784l-7%207V23h1.216l7-7%204.595%204.595.594-.622c1.754-1.753%202.396-4.159%202-6.432l5.784-4.244.811-.594L15.297%201Zm.216%202.649%204.838%204.837-5.378%203.946-.487.352.163.567c.415%201.585-.037%203.237-1.027%204.622l-7.595-7.595c1.385-.99%203.037-1.442%204.622-1.027l.567.163.352-.487%203.946-5.378Z%22%2F%3E%3C%2Fsvg%3E'); -webkit-mask-image: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22m15.297%201-.594.81-4.243%205.785c-2.274-.396-4.68.246-6.433%202l-.622.594L8%2014.784l-7%207V23h1.216l7-7%204.595%204.595.594-.622c1.754-1.753%202.396-4.159%202-6.432l5.784-4.244.811-.594L15.297%201Zm.216%202.649%204.838%204.837-5.378%203.946-.487.352.163.567c.415%201.585-.037%203.237-1.027%204.622l-7.595-7.595c1.385-.99%203.037-1.442%204.622-1.027l.567.163.352-.487%203.946-5.378Z%22%2F%3E%3C%2Fsvg%3E'); mask-size: contain; -webkit-mask-size: contain; mask-repeat: no-repeat; -webkit-mask-repeat: no-repeat; display: inline-block; display: inline-block; width: 1em; height: 1em; font-size: 75%; margin-right: 5px; background-color: currentColor; } .default-post-list-item .image-container { position: relative; overflow: hidden; transform: translate(0, 0); border-radius: var(--pt-soft-radius); flex-basis: 40%; flex-shrink: 0; } .default-post-list-item .image-container img { width: 100%; height: 100%; object-fit: cover; transition: 0.8s; } .default-post-list-item .image-container:not(.has-animation):focus-within > img, .default-post-list-item .image-container:not(.has-animation):hover > img { transform: scale(1.15); } .default-post-list-item .image-container.has-animation img { transform-origin: right; } .default-post-list-item .image-container.has-animation:focus-within > img, .default-post-list-item .image-container.has-animation:hover > img { filter: blur(8px); opacity: 0; transform: scaleX(1.5); } .default-post-list-item .has-animation .image-animation { position: absolute; left: 0; top: 0; width: 100%; height: 100%; border-radius: inherit; } .default-post-list-item .has-animation .image-animation img { transform-origin: left; filter: blur(8px); opacity: 0; transform: scaleX(1.5); } .default-post-list-item .image-container.has-animation:focus-within .image-animation > img, .default-post-list-item .image-container.has-animation:hover .image-animation > img { filter: blur(0); opacity: 1; transform: scaleX(1); } .default-post-list-item .image-container a { border-radius: inherit; z-index: 10; } .default-post-list-item .image-container:focus-within { outline: 1px dashed; outline-offset: 3px; } .default-post-list-item .content-container { width: 100%; } .default-post-list-item .title a { color: inherit; word-break: break-word; } .default-post-list-item .title a:focus, .default-post-list-item .title a:hover { color: var(--pt-accent-color); } .default-post-list-item .meta-details { display: flex; flex-wrap: wrap; align-items: center; column-gap: 1.5rem; row-gap: 1rem; font-size: 1.4rem; font-weight: 500; line-height: 1.2; text-transform: capitalize; } @media (max-width: 767px) { .default-post-list-item .meta-details { justify-content: center; } } .default-post-list-item .meta-details .comments > span:not(.blogsy-svg-icon), .default-post-list-item .meta-details a { font-weight: 600; } .default-post-list-item .meta-details .comments > span:not(.blogsy-svg-icon), .default-post-list-item .meta-details a, .default-post-list-item .meta-details .author-by { vertical-align: middle; } .meta-wrapper a, .default-post-list-item .meta-details a { color: inherit; position: relative; text-decoration: none; } .meta-wrapper a:focus, .meta-wrapper a:hover, .default-post-list-item .meta-details a:focus, .default-post-list-item .meta-details a:hover { color: var(--pt-accent-color); } .meta-wrapper a::after, .meta-wrapper a::after, .default-post-list-item .meta-details a::after, .default-post-list-item .meta-details a::after { background: currentColor; } .meta-wrapper a::after, .meta-wrapper a::after, .default-post-list-item .meta-details a::after, .default-post-list-item .meta-details a::after { content: ''; position: absolute; left: 0; bottom: 0; width: 0%; height: 1px; transition: 0.3s; } .meta-wrapper a:focus::after, .meta-wrapper a:hover::after, .default-post-list-item .meta-details a:focus::after, .default-post-list-item .meta-details a:hover::after { width: 100%; } .default-post-list-item.product .meta-details { display: none; } .default-post-list-item.post-wrapper .footer-wrap { margin-top: 20px; } @media (max-width: 1024px) { .default-post-list-item.post-wrapper .footer-wrap { margin-top: 16px; } } /* Default Post Verticle */ .blog-vertical .default-post-list-item .post-wrapper-inner { gap: 20px; flex-wrap: wrap; } .blog-vertical.center .default-post-list-item .post-wrapper-inner { text-align: center; } .blog-vertical .default-post-list-item .content-container, .blog-vertical.blog-vertical .default-post-list-item .image-container { width: 100%; flex: 0 0 100%; } .blog-vertical.center .default-post-list-item .meta-details { justify-content: center; } .blog-vertical .default-post-list-item.post-wrapper .footer-wrap { margin-top: 20px; } @media (max-width: 1024px) { .blog-vertical .default-post-list-item .post-wrapper-inner { gap: 16px; } .blog-vertical .default-post-list-item.post-wrapper .footer-wrap { margin-top: 16px; } } /* Default Post Pagination */ .default-post-list-pagination { text-align: center; margin-top: 70px; } .page-content-wrapper .post-nav-links .post-page-numbers, .woocommerce nav.woocommerce-pagination ul li a, .woocommerce nav.woocommerce-pagination ul li span, .default-post-list-pagination .page-numbers { display: inline-block; min-width: 40px; min-height: 40px; padding: 10px 15px; line-height: 18px; border-radius: 8px; color: var(--pt-body-color); transition: 0.3s; font-weight: 500; margin: 3px; text-decoration: none; background-color: var(--pt-card-bg); box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.03); border: 1px solid var(--pt-border-color); } .page-content-wrapper .post-nav-links .post-page-numbers:focus, .page-content-wrapper .post-nav-links .post-page-numbers:hover, .page-content-wrapper .post-nav-links .post-page-numbers.current, .woocommerce nav.woocommerce-pagination ul li a:focus, .woocommerce nav.woocommerce-pagination ul li a:hover, .woocommerce nav.woocommerce-pagination ul li span.current, .default-post-list-pagination .page-numbers:focus, .default-post-list-pagination .page-numbers:hover, .default-post-list-pagination .page-numbers.current { color: #fff; background-color: var(--pt-accent-color); } /* Default Post Masonry */ .default-archive-wrap.blog-masonry { display: block; column-gap: 30px; } .default-archive-wrap.blog-masonry.column-layout-1 { column-count: 1; } .default-archive-wrap.blog-masonry.column-layout-2 { column-count: 2; } .default-archive-wrap.blog-masonry.column-layout-3 { column-count: 3; } .default-archive-wrap.blog-masonry.column-layout-4 { column-count: 4; } .default-archive-wrap.blog-masonry .post-wrapper { break-inside: avoid; margin-bottom: 30px; } @media (max-width: 1024px) { .default-archive-wrap.blog-masonry.column-layout-2, .default-archive-wrap.blog-masonry.column-layout-3, .default-archive-wrap.blog-masonry.column-layout-4 { column-count: 2; } } @media (max-width: 767px) { .default-archive-wrap.blog-masonry.column-layout-2, .default-archive-wrap.blog-masonry.column-layout-3, .default-archive-wrap.blog-masonry.column-layout-4 { column-count: 1; } } /* Single Post -------------------------------------------------------------- */ /* General */ .single-content::after { clear: both; display: table; line-height: 0; content: ""; } .single-content-inner { padding: 20px; font-size: 1.62rem; word-wrap: break-word; } @media (max-width: 767px) { .single-content-inner { padding: 16px 0; } } /* Post Break Pages Pagination */ .page-content-wrapper .post-nav-links { clear: both; padding: 2.25rem 0; margin: 0; } .page-content-wrapper .post-nav-links .post-page-numbers::after { display: none; } /* Author Social Links */ .author-social-links ul { margin: 0; padding: 0; list-style: none; display: inline-flex; flex-wrap: wrap; gap: 8px; align-items: center; } .author-social-links a { position: relative; font-size: 1.8rem; line-height: 0.75; color: var(--pt-body-color); display: block; padding: 10px; border-radius: 6px; } .author-social-links a:focus, .author-social-links a:hover { background: var(--pt-accent-color); color: #fff; box-shadow: 0 4px 15px var(--pt-accent-color); transform: translateY(-3px); } .author-social-links a::before { content: attr(data-title); display: inline-block; position: absolute; left: 50%; transform: translateX(-50%); bottom: 130%; padding: 8px; background: var(--pt-second-color); color: var(--pt-second-color-alt); border-radius: 4px; font-size: 11px; white-space: nowrap; transition: 0.3s; opacity: 0; visibility: hidden; } .author-social-links a:focus::before, .author-social-links a:hover::before { opacity: 1; visibility: visible; } @media (max-width: 767px) { .author-social-links a::before { display: none; } } /* Page 404 -------------------------------------------------------------- */ .page-404 { text-align: center; padding: 100px 0; } .page-404 h1 { font-size: 12rem; margin-bottom: 0; } .page-404 a { color: var(--pt-headings-color); border-bottom: 1px solid; font-weight: 600; } /* Elementor Animations -------------------------------------------------------------- */ @media (prefers-reduced-motion:reduce) { body .animated { animation-duration: 1.25s; } } body .animated { animation-duration: 1.25s; } body .animated.animated-slow { animation-duration: 2s; } body .animated.animated-fast { animation-duration: .75s; } body .animated.infinite { animation-iteration-count: infinite; } body .animated.reverse { animation-direction: reverse; animation-fill-mode: forwards; } /* Elementor Widgets -------------------------------------------------------------- */ /* Image Carousel */ .elementor-image-carousel-wrapper { opacity: 0; transition: 0.3s; } .elementor-image-carousel-wrapper.swiper-initialized { opacity: 1; } /* Sticky Column -------------------------------------------------------------- */ @media (min-width: 1025px) { .e-con.blogsy-sticky-column { --align-self: start; position: sticky; top: 10px; transition: 0.6s top; } } @media (max-width: 1024px) { .e-con.blogsy-sticky-column { top: 0 !important; } } /* Popup Search -------------------------------------------------------------- */ .popup-search-opener-wrapper { display: flex; } .popup-search-opener { cursor: pointer; display: block; line-height: 1; font-size: 21px; transition: 0.3s; } .popup-search-opener:focus { outline: 1px dashed; outline-offset: 5px; border-radius: 50%; } .popup-search-opener .blogsy-svg-icon { display: block; line-height: 1; } /* Popup Search Container */ .popup-search-close { position: absolute; width: 40px; height: 40px; top: 35px; left: 50%; transform: translateX(-50%); cursor: pointer; color: var(--pt-headings-color); } .popup-search-close:focus { outline: 1px dashed; outline-offset: 5px; border-radius: 50%; } .popup-search-close:after { content: ""; display: block; position: absolute; width: 70%; height: 2px; margin: auto; top: 0; bottom: 0; left: 0; right: 0; background-color: currentColor; transform: scale(0, 1); transition: all 0.25s cubic-bezier(0.3, 0, 0.2, 1); } .popup-search-close .cross-line { position: absolute; width: 100%; height: 2px; border-radius: 6px; margin: auto; top: 0; bottom: 0; left: 0; right: 0; overflow: hidden; } .popup-search-close .cross-line.top-left { transform: rotate(45deg); } .popup-search-close .cross-line.top-right { transform: rotate(135deg); } .popup-search-close .cross-line.bottom-left { transform: rotate(-45deg); } .popup-search-close .cross-line.bottom-right { transform: rotate(-135deg); } .popup-search-close .cross-line:before { content: ""; display: block; position: absolute; top: 0; left: 0; width: 50%; height: 100%; border-radius: 6px; background-color: currentColor; transition: all 0.4s cubic-bezier(0.3, 0, 0.2, 1); } .popup-search-close:hover:after { transition: all 0.4s cubic-bezier(0.3, 0, 0.2, 1); transform: scale(1, 1); } .popup-search-close:hover .cross-line:before { transform: translate(-101%, 0); } .popup-search-close .close-text { position: absolute; top: 40px; left: 50%; transform: translateX(-50%); letter-spacing: 1px; font-size: 1.425rem; font-weight: 500; opacity: 0; transition: 0.4s; } .popup-search-close:hover .close-text { opacity: 1; } .popup-search::before { content: ''; position: fixed; top: 0; left: 0; height: 100vh; width: 100vw; background: #18181eb3; z-index: 99999; opacity: 0; visibility: hidden; transition: opacity 0.6s; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); } .popup-search.open::before { opacity: 1; visibility: visible; } .popup-search .popup-search-container { position: fixed; top: 0; left: 0; width: 100vw; height: 50vh; padding: 20px; z-index: 99999; background: #fff; transform: translateY(-110%); opacity: 0; visibility: hidden; transition: transform 0.6s cubic-bezier(0.86, 0, 0.07, 1); } body.admin-bar .popup-search .popup-search-container { top: 30px; } .popup-search.open .popup-search-container { opacity: 1; visibility: visible; transform: translateY(0); } .popup-search-wrapper.style-2 .popup-search .popup-search-container { height: auto; width: auto; left: 50px; right: 50px; bottom: 50px; top: 50px; transform: scale(0.85); opacity: 0; visibility: hidden; transition: 0.2s; } .popup-search-wrapper.style-2 .popup-search.open .popup-search-container { transform: scale(1); opacity: 1; visibility: visible; } .popup-search-wrapper.style-2 .popup-search::before { transition: 0.2s; } @media (min-width: 1025px) { .pt-header-inner .blogsy-header-nav-wrapper+.popup-search-wrapper.style-3, .popup-search-wrapper.style-3 .popup-search::before { display: none; } .popup-search-wrapper.style-3 .popup-search .popup-search-container { position: relative; top: 0; left: 0; right: 0; width: 100%; height: 48px; padding: 0 15px; transform: none; display: flex; flex-direction: row-reverse; align-items: center; gap: 1rem; background: transparent; } .popup-search-wrapper.style-3 .popup-search .popup-search-container .popup-search-close { position: relative; width: 30px; height: 30px; top: 0; left: 0; right: 0; transform: none; background-color: inherit; } .popup-search-wrapper.style-3 .popup-search .popup-search-container .popup-search-close .close-text { display: none; } .popup-search-wrapper.style-3 .popup-search .popup-search-container .popup-search-content { flex: auto; max-width: 100%; flex-direction: row; flex-wrap: wrap; position: relative; } .popup-search-wrapper.style-3 .popup-search .popup-search-container .popup-search-content .popular-search-wrap { position: absolute; top: 55px; right: 0; z-index: 9; width: 100%; height: auto; --border-radius: var(--pt-soft-radius); background: var(--pt-card-bg); padding: 16px; border-radius: var(--border-radius); box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.03); border: 1px solid var(--pt-border-color); overflow: hidden; overflow-y: scroll; -ms-overflow-style: none; scrollbar-width: none; -webkit-overflow-scrolling: touch; } .popup-search-wrapper.style-3 .popup-search .popup-search-container .popup-search-content .popular-search-wrap .popular-search { margin-top: 0; } } .popup-search-content { display: flex; flex-direction: column; height: 100%; max-width: 700px; margin: 0 auto; justify-content: center; align-items: center; } .popup-search-form { width: 100%; } .blogsy-search-form .title:empty { display: none; } /* Search Form */ .blogsy-search-form { position: relative; margin: auto; width: 100%; } .blogsy-search-form .search-field { width: 100%; margin: 0; padding: 14px 20px; } .blogsy-search-form .submit { position: absolute; right: 3px; top: 50%; transform: translateY(-50%); padding: 12px; margin: 0; font-size: 16px; line-height: 1; display: flex; align-items: center; gap: 10px; } /* Popular Keywords */ .popular-search { display: inline-flex; row-gap: 5px; column-gap: 15px; flex-wrap: wrap; justify-content: center; margin-top: 20px; } .popular-search-title { white-space: nowrap; font-size: 1.425rem; font-weight: 600; } .popular-search-keywords { display: flex; row-gap: 5px; column-gap: 15px; flex-wrap: wrap; flex-direction: column; } .popular-search-keyword { --pt-keyword-color: var(--pt-accent-color); display: flex; gap: 2px; font-weight: 500; white-space: nowrap; font-size: 1.425rem; position: relative; color: var(--pt-body-color); padding-left: 2.4rem; transition: all 0.35s cubic-bezier(0.645, 0.045, 0.355, 1); } .popular-search-keywords .popular-search-keyword::before { content: ''; position: absolute; top: 50%; left: 0; margin-top: -0.3px; width: 1em; height: 0.8em; font-size: 1.7rem; -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='20' viewBox='0 0 24 20'%3E%3Cpath fill='currentColor' d='M21.552 1.046a1.12 1.12 0 0 1 .996.184 1.14 1.14 0 0 1 .452.917l-.001 6.365c0 .213-.06.422-.17.603-.11.18-.269.327-.457.422a1.12 1.12 0 0 1-1.185-.107l-1.806-1.377-4.598 6.205c-.268.362-.658.61-1.096.698-.437.088-.891.01-1.275-.22l-.165-.112-3.671-2.794-4.86 6.559a1.496 1.496 0 0 1-1.955.41l-.158-.106a1.546 1.546 0 0 1-.405-1.98l.104-.16 5.585-7.536c.268-.361.658-.61 1.096-.698a1.8 1.8 0 0 1 1.276.221l.164.112 3.67 2.793 3.874-5.227-1.811-1.379a1.15 1.15 0 0 1-.445-1.042 1.16 1.16 0 0 1 .658-.92l.15-.055 6.034-1.778z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='20' viewBox='0 0 24 20'%3E%3Cpath fill='currentColor' d='M21.552 1.046a1.12 1.12 0 0 1 .996.184 1.14 1.14 0 0 1 .452.917l-.001 6.365c0 .213-.06.422-.17.603-.11.18-.269.327-.457.422a1.12 1.12 0 0 1-1.185-.107l-1.806-1.377-4.598 6.205c-.268.362-.658.61-1.096.698-.437.088-.891.01-1.275-.22l-.165-.112-3.671-2.794-4.86 6.559a1.496 1.496 0 0 1-1.955.41l-.158-.106a1.546 1.546 0 0 1-.405-1.98l.104-.16 5.585-7.536c.268-.361.658-.61 1.096-.698a1.8 1.8 0 0 1 1.276.221l.164.112 3.67 2.793 3.874-5.227-1.811-1.379a1.15 1.15 0 0 1-.445-1.042 1.16 1.16 0 0 1 .658-.92l.15-.055 6.034-1.778z'/%3E%3C/svg%3E"); -webkit-mask-size: cover; mask-size: cover; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; background: rgba(185, 185, 185, 0.6); transform: translateY(-50%); transition: all 300ms ease; } .popular-search-keyword:focus, .popular-search-keyword:hover { color: var(--pt-keyword-color); } /* Header Navigation -------------------------------------------------------------- */ .blogsy-svg-icon { display: inline-block; fill: currentColor; line-height: 0.75; width: auto; } .blogsy-svg-icon svg { width: 1em; height: 1em; display: inline-block; vertical-align: middle; } .blogsy-mobile-toggle { display: none; } .blogsy-header-nav { display: flex; flex-wrap: wrap; gap: 5px; padding: 0; margin: 0; max-width: 100%; list-style: none; position: relative; } .blogsy-header-nav li { position: relative; } .blogsy-header-nav > li::before { content: ''; position: absolute; left: 0; top: 100%; width: 100%; height: 1rem; display: none; } .blogsy-header-nav > li.hovered::before, .blogsy-header-nav > li:hover::before { display: block; } .blogsy-header-nav > li a { position: relative; color: #29294b; text-decoration: none; transition: 0.3s; } .blogsy-header-nav > li > a { display: flex; gap: 2px; align-items: center; padding: 0; margin: 0 0.5em; } .blogsy-header-nav li > a > span { position: relative; } .blogsy-header-nav > li > a:hover, .blogsy-header-nav > li.hovered > a, .blogsy-header-nav > li.current_page_item > a, .blogsy-header-nav > li.current-menu-item > a, .blogsy-header-nav > li.current-menu-ancestor > a { color: var(--pt-accent-color); } .blogsy-header-nav .menu-item-has-children:not(.menu-item-custom-more) > a > .blogsy-svg-icon, .blogsy-header-nav .page_item_has_children:not(.menu-item-custom-more) > a > .blogsy-svg-icon { font-size: 75%; margin-left: .4rem; margin-right: 0; transform: translateY(-0.05rem); } .blogsy-header-nav .children .page_item_has_children > a > .blogsy-svg-icon, .blogsy-header-nav .sub-menu .menu-item-has-children > a > .blogsy-svg-icon { position: absolute; right: 1rem; top: 50%; margin-left: 0; -webkit-transform: translateY(-50%) rotate(-90deg); -ms-transform: translateY(-50%) rotate(-90deg); transform: translateY(-50%) rotate(-90deg); } .blogsy-header-nav .children, .blogsy-header-nav .sub-menu { margin: 0; list-style: none; visibility: hidden; opacity: 0; position: absolute; top: calc(100% + 1rem); left: -10px; min-width: 260px; max-width: 100%; z-index: 999; background: var(--pt-card-bg); border-radius: var(--pt-soft-radius); border: 1px solid var(--pt-border-color); box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.03); padding: 1.45rem 2.2rem 1.45rem 1.2rem; transition: 0.42s ease-out; transition-delay: 0.1s; transform: translateY(15px); pointer-events: none; } .blogsy-header-nav .children .children, .blogsy-header-nav .sub-menu .sub-menu { left: 100%; top: 0; transform-origin: left; } .blogsy-header-nav>li.opens-left>.children, .blogsy-header-nav>li.opens-left>.sub-menu { left: auto; right: -10px; } .blogsy-header-nav>li.opens-right>.children, .blogsy-header-nav>li.opens-right>.sub-menu { right: auto; left: -10px; } .blogsy-header-nav .children li.opens-left .children, .blogsy-header-nav .children li.opens-left .sub-menu, .blogsy-header-nav .sub-menu li.opens-left .children, .blogsy-header-nav .sub-menu li.opens-left .sub-menu { left: auto; right: 100%; margin-left: 0; margin-right: .5rem; } .blogsy-header-nav .children li.opens-left .children:before, .blogsy-header-nav .children li.opens-left .sub-menu:before, .blogsy-header-nav .sub-menu li.opens-left .children:before, .blogsy-header-nav .sub-menu li.opens-left .sub-menu:before { left: auto; right: -.5rem; } .blogsy-header-nav .children li.opens-right .children, .blogsy-header-nav .children li.opens-right .sub-menu, .blogsy-header-nav .sub-menu li.opens-right .children, .blogsy-header-nav .sub-menu li.opens-right .sub-menu { right: auto; left: 100%; margin-right: 0; margin-left: .5rem; } .blogsy-header-nav .children li.opens-right .children:before, .blogsy-header-nav .children li.opens-right .sub-menu:before, .blogsy-header-nav .sub-menu li.opens-right .children:before, .blogsy-header-nav .sub-menu li.opens-right .sub-menu:before { left: auto; right: -.5rem; } .blogsy-header-nav li.hovered > .children, .blogsy-header-nav li:hover > .children, .blogsy-header-nav li.hovered > .sub-menu, .blogsy-header-nav li:hover > .sub-menu { visibility: visible; transform: translateY(0); opacity: 1; transition-delay: 0s; pointer-events: all; } .blogsy-header-nav .children>li, .blogsy-header-nav .sub-menu>li { transition: .25s; } .blogsy-header-nav .children>li:not(:first-child), .blogsy-header-nav .sub-menu>li:not(:first-child) { margin-top: 0.6rem; } .blogsy-header-nav .children>li.hovered, .blogsy-header-nav .children>li:hover, .blogsy-header-nav .sub-menu>li.hovered, .blogsy-header-nav .sub-menu>li:hover { transform: translateX(1rem); } .blogsy-header-nav .children li > a, .blogsy-header-nav .sub-menu li > a { color: var(--pt-headings-color); padding: 0.532rem 1.6rem; display: block; } .blogsy-header-nav .children li > a::before, .blogsy-header-nav .sub-menu li > a::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 100%; opacity: 0; background: rgba(160, 163, 180, 0.2); border-radius: 8px; transition: 0.3s; } .blogsy-header-nav .children li > a span, .blogsy-header-nav .sub-menu li > a span { display: inline-block; } .blogsy-header-nav .children li.hovered > a::before, .blogsy-header-nav .children li > a:hover::before, .blogsy-header-nav .children li.current_page_item > a::before, .blogsy-header-nav .sub-menu li.hovered > a::before, .blogsy-header-nav .sub-menu li > a:hover::before, .blogsy-header-nav .sub-menu li.current_page_item > a::before, .blogsy-header-nav .sub-menu li.current-menu-item > a::before, .blogsy-header-nav .sub-menu li.current-menu-ancestor > a::before { opacity: 1; } /* Header Navigation Hover Shapes */ .blogsy-header-nav > li > a { --menu-shape-color: var(--pt-accent-color); } .blogsy-header-nav-wrapper[class*="hover-style-"] > ul > li > a::before { content: ''; position: absolute; bottom: 0; left: 0; height: 2px; width: 100%; background: var(--menu-shape-color); transition: 0.3s; transform: scaleX(0); } .blogsy-header-nav-wrapper.hover-style-4 > ul > li > a::before { opacity: 0; transform: scaleX(1) translateX(-30%); } .blogsy-header-nav-wrapper.hover-style-5 > ul > li > a::before { bottom: 15%; height: 7px; } .blogsy-header-nav-wrapper.hover-style-5 .blogsy-header-nav > li.hovered > a, .blogsy-header-nav-wrapper.hover-style-5 .blogsy-header-nav > li > a:hover, .blogsy-header-nav-wrapper.hover-style-5 .blogsy-header-nav > li.current_page_item > a, .blogsy-header-nav-wrapper.hover-style-5 .blogsy-header-nav > li.current-menu-item > a, .blogsy-header-nav-wrapper.hover-style-5 .blogsy-header-nav > li.current-menu-ancestor > a { color: unset; } .blogsy-header-nav-wrapper.hover-style-2 > ul > li > a::before { transform-origin: left; } .blogsy-header-nav-wrapper.hover-style-3 > ul > li > a::before { transform-origin: right center; transition: transform 0.3s; } .blogsy-header-nav-wrapper.hover-style-3 > ul > li > a:focus::before, .blogsy-header-nav-wrapper.hover-style-3 > ul > li > a:hover::before { transform-origin: left center; } .blogsy-header-nav-wrapper.hover-style-6 > ul > li > a, .blogsy-header-nav-wrapper.hover-style-7 > ul > li > a, .blogsy-header-nav-wrapper.hover-style-8 > ul > li > a, .blogsy-header-nav-wrapper.hover-style-9 > ul > li > a { padding: 0.255em 0.8em; margin: 0 0; } .blogsy-header-nav-wrapper:is(.hover-style-6, .hover-style-7, .hover-style-8, .hover-style-9) > ul > li > a::before { height: 100%; border-radius: 4px; } .blogsy-header-nav-wrapper.hover-style-6 > ul > li > a::before { transform: scale(0.9); opacity: 0; } .blogsy-header-nav-wrapper.hover-style-8 > ul > li > a::before { transform: scale(1, 0); } .blogsy-header-nav-wrapper:is(.hover-style-6, .hover-style-7, .hover-style-8) > ul > li.hovered > a, .blogsy-header-nav-wrapper:is(.hover-style-6, .hover-style-7, .hover-style-8) > ul > li > a:hover, .blogsy-header-nav-wrapper:is(.hover-style-6, .hover-style-7, .hover-style-8) > ul > li.current_page_item > a, .blogsy-header-nav-wrapper:is(.hover-style-6, .hover-style-7, .hover-style-8) > ul > li.current-menu-item > a, .blogsy-header-nav-wrapper:is(.hover-style-6, .hover-style-7, .hover-style-8) > ul > li.current-menu-ancestor > a { color: #fff; } .blogsy-header-nav-wrapper.hover-style-9 > ul > li > a::before { --menu-shape-color: rgba(160, 163, 180, 0.2); } .blogsy-header-nav-wrapper.hover-style-9 > ul > li.hovered > a, .blogsy-header-nav-wrapper.hover-style-9 > ul > li > a:hover, .blogsy-header-nav-wrapper.hover-style-9 > ul > li.current_page_item > a, .blogsy-header-nav-wrapper.hover-style-9 > ul > li.current-menu-item > a, .blogsy-header-nav-wrapper.hover-style-9 > ul > li.current-menu-ancestor > a { color: inherit; } .blogsy-header-nav-wrapper[class*="hover-style-"] > ul > li.hovered > a::before, .blogsy-header-nav-wrapper[class*="hover-style-"] > ul > li > a:hover::before, .blogsy-header-nav-wrapper[class*="hover-style-"] > ul > li.current_page_item > a::before, .blogsy-header-nav-wrapper[class*="hover-style-"] > ul > li.current-menu-item > a::before, .blogsy-header-nav-wrapper[class*="hover-style-"] > ul > li.current-menu-ancestor > a::before { transform: scale(1) translate(0, 0); opacity: 1; } /* Header Vertical Navigation */ .blogsy-header-v-nav-wrapper ul { padding: 0; margin: 0; list-style: none; } .blogsy-header-v-nav .children, .blogsy-header-v-nav .sub-menu { margin: 5px 0; padding-left: 20px; border-left: 1px solid #ffffff52; } .blogsy-header-v-nav li a { color: #454955; line-height: 2.6; font-weight: 500; display: block; position: relative; } .blogsy-header-v-nav li.hovered > a, .blogsy-header-v-nav li > a:hover, .blogsy-header-v-nav li.current_page_item > a, .blogsy-header-v-nav li.current-menu-item > a { color: var(--pt-accent-color); } .blogsy-header-v-nav li.page_item_has_children > a, .blogsy-header-v-nav li.menu-item-has-children > a { display: inline-flex; width: 100%; max-width: calc(100% - 34px); } .blogsy-header-v-nav li.page_item_has_children > .blogsy-mobile-toggle, .blogsy-header-v-nav li.menu-item-has-children > .blogsy-mobile-toggle { display: inline-flex; align-items: center; justify-content: center; vertical-align: middle; width: 34px; height: 34px; background: none; border: none; cursor: pointer; padding: 0; color: inherit; position: relative; background-color: var(--menu-shape-color, rgba(160, 163, 180, 0.2)); border-radius: 4px; } .blogsy-header-v-nav li.page_item_has_children > .blogsy-mobile-toggle:focus, .blogsy-header-v-nav li.menu-item-has-children > .blogsy-mobile-toggle:focus { background-color: #a0a3b456; outline: thin dotted; outline-offset: 0.2rem; } .blogsy-header-v-nav li.page_item_has_children > .blogsy-mobile-toggle .blogsy-svg-icon, .blogsy-header-v-nav li.menu-item-has-children > .blogsy-mobile-toggle .blogsy-svg-icon { line-height: 0.9; pointer-events: none; transform: none; transition: 0.3s; } .blogsy-header-v-nav li.page_item_has_children.open > .blogsy-mobile-toggle .blogsy-svg-icon, .blogsy-header-v-nav li.menu-item-has-children.open > .blogsy-mobile-toggle .blogsy-svg-icon { transform: rotate(180deg); } .blogsy-header-v-nav li.page_item_has_children > a .blogsy-svg-icon, .blogsy-header-v-nav li.menu-item-has-children > a .blogsy-svg-icon, .blogsy-header-v-nav .children, .blogsy-header-v-nav .sub-menu { display: none; } .pt-header .blogsy-offcanvas .offcanvas-content { display: flex; flex-direction: column; gap: 50px; padding: 60px 60px; } /* Header Widgets -------------------------------------------------------------- */ .pt-header-widgets, .pt-header-widget, .pt-header-element { display: flex; flex-wrap: wrap; align-items: center; } .pt-header-element { z-index: 99; } .pt-header-element > .pt-header-widget:first-child { margin-left: 1.8rem; } .pt-header-widgets .pt-header-widget { height: 100%; max-height: 9.2rem; position: relative; padding-left: .8rem; padding-right: .8rem; } .pt-header-widgets .pt-header-widget:has(.rounded-border, .rounded-fill) { padding-left: 0.4rem; padding-right: 0.4rem; } .pt-header-widgets .pt-header-widget.pt-header-widget__button { padding-left: 1.6rem; padding-right: 1.6rem; } .pt-header-widgets .pt-header-widget:last-of-type { padding-right: 0; } /* Header Default -------------------------------------------------------------- */ .pt-flex-row { display: flex; flex: 0 1 auto; flex-direction: row; flex-wrap: wrap; gap: 1rem; } .pt-flex-row div[class^='col-'], .pt-flex-row div[class*='col-'] { box-sizing: border-box; flex: 0 0 auto; width: 100%; } .pt-flex-row > div:not(.col-xs-12), .pt-flex-row > iframe { width: 100%; } @media (min-width: 768px) { .pt-flex-row { gap: 2.4rem; } .pt-flex-row.start-sm, .pt-flex-row .start-sm { justify-content: flex-start; text-align: start; } .pt-flex-row.end-sm, .pt-flex-row .end-sm { justify-content: flex-end; text-align: end; margin-left: auto; } .pt-flex-row .col-md { flex-grow: 1; flex-shrink: 1; max-width: 100%; flex-basis: 0; } .pt-flex-row .col-md.flex-basis-auto { flex-basis: auto; } } .pt-header-container { display: flex; flex-wrap: wrap; align-items: stretch; } .blogsy-topbar>.pt-container>.pt-flex-row { width: 100%; position: relative; padding-top: 10px; padding-bottom: 10px; min-height: 5rem; align-items: stretch; } .blogsy-topbar>.pt-container>.pt-flex-row:empty { padding-top: 4px; padding-bottom: 4px; min-height: unset; } .blogsy-topbar>.pt-container>.pt-flex-row>.col-md { width: auto; max-width: 100%; display: flex; flex-wrap: wrap; align-items: center; } .blogsy-topbar>.pt-container>.pt-flex-row>.col-md:empty { display: none; } .blogsy-topbar>.pt-container .pt-flex-row.center-text .col-md { flex: auto; justify-content: center; } .blogsy-topbar .blogsy-topbar-widget { display: flex; align-items: center; flex-wrap: wrap; padding-left: 1rem; padding-right: 1rem; position: relative; z-index: 5; } .blogsy-topbar .blogsy-topbar-widget:first-child { padding-left: 0; border-left: 0; } .blogsy-topbar .blogsy-topbar-widget:last-child { padding-right: 0; border-right: 0 !important; } .blogsy-topbar .blogsy-topbar-widget:last-child:after { display: none !important; } .blogsy-topbar .blogsy-topbar-widget>ul { padding-left: 0; margin-bottom: 0; list-style: none; } .blogsy-topbar .blogsy-topbar-widget__text .blogsy-svg-icon { margin: 0 .6rem 0 0; font-size: 130%; position: relative; vertical-align: 1px; } .blogsy-topbar .blogsy-social-icons>ul>li>a svg { height: 1.4rem; } .blogsy-topbar .blogsy-header-nav > li.menu-item > a { font-size: inherit; } .pt-header { position: relative; } .blogsy-topbar { background: linear-gradient(45deg, #216be9 0%, #f84d57 100%); color: #fff; font-size: 1.425rem; border-width: 0; position: relative; } .blogsy-topbar p { margin: 0; } .pt-header #site-logo { font-size: 3.45rem; font-weight: 600; line-height: 1; text-transform: capitalize; color: #000; } .pt-header-inner { padding: 20px 0; background: #fff; box-shadow: 0px 2px 5px rgba(14, 14, 19, 0.05); } .pt-header-inner .pt-logo .site-description, .pt-header-inner .pt-logo .site-title { margin-bottom: 0; } .pt-header-inner .pt-logo .site-title a { color: inherit; } .pt-header-inner .blogsy-header-nav { justify-content: center; } .pt-mobile-nav { display: none; order: 1; margin-left: 1.6rem; z-index: 999; } @media screen and (max-width: 1024px) { .pt-mobile-nav { display: inline-flex; } .pt-header-inner .blogsy-header-nav-wrapper { display: none !important; } } .pt-header-sticky { position: relative; } .pt-header-sticky .pt-header-inner { border-bottom: 1px solid var(--pt-border-color); box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.03); } /* Header Layout 1 -------------------------------------------------------------- */ @media screen and (min-width: 1025px) { .pt-header-layout-1 .pt-header .pt-header-inner { padding: 0; background-color: transparent; box-shadow: none; } .pt-header-layout-1 .pt-header .pt-header-inner .pt-header-container { position: relative; margin-top: 8px; margin-bottom: 8px; min-height: 64px; border-radius: var(--pt-soft-radius); transition: .25s; } .pt-header-layout-1 .pt-header .pt-header-inner .pt-header-container:hover { box-shadow: 0 16px 40px 0 rgba(10,37,64,.07); } .pt-header-layout-1 .pt-header .pt-header-inner .pt-header-container::after { content: ""; display: block; position: absolute; top: 0; left: 0; z-index: -1; width: 100%; height: 100%; border-radius: var(--pt-soft-radius); background: #fff; opacity: 0; visibility: hidden; } .pt-header-layout-1 .pt-header .pt-header-inner .pt-header-container:focus-within:after, .pt-header-layout-1 .pt-header .pt-header-inner .pt-header-container:hover:after { opacity: 1; visibility: visible; } } /* Header Layout 2 / 3 -------------------------------------------------------------- */ .pt-header-layout-3 .pt-header .blogsy-offcanvas .offcanvas-content, .pt-header-layout-2 .pt-header .blogsy-offcanvas .offcanvas-content, .pt-header-layout-1 .pt-header .blogsy-offcanvas .offcanvas-content { padding: 60px 25px; } .pt-header-layout-3 .pt-header-container .pt-logo, .pt-header-layout-2 .pt-header-container .pt-logo, .pt-header-layout-1 .pt-header-container .pt-logo { margin-right: auto; } .pt-header-layout-3 .pt-header-container .blogsy-header-nav-wrapper, .pt-header-layout-2 .pt-header-container .blogsy-header-nav-wrapper, .pt-header-layout-1 .pt-header-container .blogsy-header-nav-wrapper { flex-basis: auto; flex-shrink: 0; flex-grow: 1; max-width: 100%; } .pt-header-layout-3 .pt-header-container .blogsy-header-nav-wrapper>ul, .pt-header-layout-2 .pt-header-container .blogsy-header-nav-wrapper>ul, .pt-header-layout-1 .pt-header-container .blogsy-header-nav-wrapper>ul { width: 100%; height: 100%; justify-content: end; align-items: center; } /* Header Layout 3 -------------------------------------------------------------- */ .pt-header-layout-3 #site-header .pt-header-inner { padding: 0 20px; margin-top: 20px; margin-bottom: 5px; background: transparent; box-shadow: none; } .pt-header-layout-3 #site-header .pt-header-inner > .pt-header-container { padding: 20px 35px; background: #fff; border-radius: 100px; border: 1px solid var(--pt-border-color); box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.03); } /* Header -------------------------------------------------------------- */ #site-header { position: relative; z-index: 999; } #site-header::before { content: ''; position: absolute; left: 0; width: 100%; top: 0; height: 100%; } /* Sticky Header -------------------------------------------------------------- */ body.admin-bar #site-sticky-header { margin-top: 32px; } @media screen and (max-width: 782px) { body.admin-bar #site-sticky-header { margin-top: 46px; } } @media screen and (max-width: 600px) { body.admin-bar #site-sticky-header { margin-top: 0; } } #site-sticky-header { position: fixed; left: 0; z-index: 998; width: 100%; top: -200px; opacity: 0; transition: 0.6s top, 0.6s opacity; } #site-sticky-header.fixed { top: 0; opacity: 1; } #site-sticky-header::before { content: ''; position: absolute; left: 0; width: 100%; top: 0; height: 100%; } /* Offcanvas -------------------------------------------------------------- */ .offcanvas-wrapper::before { content: ''; position: fixed; top: 0; left: 0; height: 100vh; width: 100%; background: #18181eb3; z-index: 99999; opacity: 0; visibility: hidden; transition: opacity 0.6s; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); } .offcanvas-wrapper.open::before { opacity: 1; visibility: visible; } .offcanvas-wrapper .offcanvas-container { position: fixed; top: 0; width: 450px; max-width: 100%; height: 100vh; overflow-y: auto; z-index: 99999; background: #fff; visibility: hidden; opacity: 0; transition: all 0.6s cubic-bezier(0.86, 0, 0.07, 1); } body.admin-bar .offcanvas-wrapper .offcanvas-container { top: 30px; height: calc(100vh - 30px); } @media screen and (max-width: 782px) { body.admin-bar .offcanvas-wrapper .offcanvas-container { top: 45px; height: calc(100vh - 45px); } } .offcanvas-wrapper.position-left .offcanvas-container { left: 0; transform: translateX(-100%); } .offcanvas-wrapper.position-right .offcanvas-container { right: 0; transform: translateX(100%); } .offcanvas-wrapper.position-left.open .offcanvas-container, .offcanvas-wrapper.position-right.open .offcanvas-container { transform: translateX(0); visibility: visible; opacity: 1; } .offcanvas-close { position: absolute; width: 30px; height: 30px; top: 15px; right: 15px; cursor: pointer; color: var(--pt-headings-color); z-index: 9999; } .offcanvas-close:focus { outline: 1px dashed; outline-offset: 5px; } .offcanvas-close:after { content: ""; display: block; position: absolute; width: 70%; height: 2px; margin: auto; top: 0; bottom: 0; left: 0; right: 0; background-color: currentColor; transform: scale(0, 1); transition: all 0.25s cubic-bezier(0.3, 0, 0.2, 1); } .offcanvas-close .cross-line { position: absolute; width: 100%; height: 2px; border-radius: 6px; margin: auto; top: 0; bottom: 0; left: 0; right: 0; overflow: hidden; } .offcanvas-close .cross-line.top-left { transform: rotate(45deg); } .offcanvas-close .cross-line.top-right { transform: rotate(135deg); } .offcanvas-close .cross-line.bottom-left { transform: rotate(-45deg); } .offcanvas-close .cross-line.bottom-right { transform: rotate(-135deg); } .offcanvas-close .cross-line:before { content: ""; display: block; position: absolute; top: 0; left: 0; width: 50%; height: 100%; border-radius: 6px; background-color: currentColor; transition: all 0.4s cubic-bezier(0.3, 0, 0.2, 1); } .offcanvas-close:hover:after { transition: all 0.4s cubic-bezier(0.3, 0, 0.2, 1); transform: scale(1, 1); } .offcanvas-close:hover .cross-line:before { transform: translate(-101%, 0); } /* Offcanvas Opener */ .offcanvas-opener { display: inline-block; vertical-align: middle; cursor: pointer; position: relative; text-align: left; box-sizing: content-box !important; transition: 0.3s; } .offcanvas-opener:focus { outline: 1px dashed; outline-offset: 5px; } .offcanvas-opener .custom-text { display: flex; align-items: center; gap: 5px; } .offcanvas-opener .custom-text .icon svg { width: 1em; height: 1em; fill: currentColor; display: block; } .offcanvas-opener .hamburger { display: flex; flex-direction: column; justify-content: space-between; width: 30px; height: 20px; } .offcanvas-opener .hamburger span{ display: block; width: 100%; transform: translateY(-50%); height: 2px; overflow: hidden; position: relative; } .offcanvas-opener .hamburger span:before, .offcanvas-opener .hamburger span:after{ content: ""; position: absolute; width: 100%; height: 100%; background-color: currentColor; transform: translateX(-200%); transition: ease 300ms; } .offcanvas-opener .hamburger span:after{ transform: translateX(0); } .offcanvas-opener .hamburger span:nth-child(2):before, .offcanvas-opener .hamburger span:nth-child(2):after{ transition-delay: 75ms; } .offcanvas-opener .hamburger span:last-child:before, .offcanvas-opener .hamburger span:last-child:after{ transition-delay: 150ms; } .offcanvas-opener:hover .hamburger span:before{ transform: translateX(0); } .offcanvas-opener:hover .hamburger span:after{ transform: translateX(200%); } /* blogsy Logo -------------------------------------------------------------- */ .pt-header-inner .pt-logo img { width: auto; height: auto; max-width: 100%; } .blogsy-logo-image:not(.dark-logo), img.blogsy-logo-image:not(.dark-logo) { display: block; } .blogsy-logo-image.dark-logo, img.blogsy-logo-image.dark-logo { display: none; } .blogsy-logo-title, .blogsy-logo-description { margin: 0; } .blogsy-logo-title { font-size: 4.5rem; font-weight: 600; line-height: 1; text-transform: capitalize; } .blogsy-logo-title a { color: inherit; } .blogsy-logo-title a:focus, .blogsy-logo-title a:hover { color: var(--pt-accent-color); } /* Divider Heading -------------------------------------------------------------- */ .blogsy-section-heading { display: flex; flex-wrap: wrap; position: relative; justify-content: space-between; align-items: center; gap: 20px; } .blogsy-divider-heading { display: flex; flex-wrap: nowrap; gap: 5px; position: relative; --divider-color: var(--pt-accent-color); --divider-color-2: #e7e7f1; } .blogsy-divider-heading .divider { background: var(--divider-color); } .blogsy-divider-heading .divider-1 { order: 1; } .blogsy-divider-heading .divider-2 { order: 5; } .blogsy-divider-heading .divider-3 { order: 15; } .blogsy-divider-heading .divider-4 { order: 20; } .blogsy-divider-heading .title { margin: 0; padding: 0; order: 10; flex-shrink: 0; position: relative; } .blogsy-divider-heading .title .title-inner { display: inline-flex; position: relative; gap: 8px; transition: 0.3s; } .blogsy-divider-heading .title .title-text .icon { display: inline-block; line-height: 1; vertical-align: middle; } .blogsy-divider-heading .title-text .icon svg { width: 1em; height: 1em; fill: currentColor; } .blogsy-divider-heading .title .subtitle-text-wrap { display: inline-flex; } /* Style 0 Default */ .blogsy-divider-heading.divider-style-0 { align-items: center; gap: 10px; } .blogsy-divider-heading.divider-style-0 .divider-2, .blogsy-divider-heading.divider-style-0 .divider-3, .blogsy-divider-heading.divider-style-0 .divider-4 { display: none; } .blogsy-divider-heading.divider-style-0 .divider-1 { display: block; position: relative; flex-shrink: 0; width: 1em; height: 1em; -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='24' viewBox='0 0 20 24'%3E%3Cpath fill='currentColor' d='M8.354 3.574a.93.93 0 0 1 1.629-.102l.053.103.951 2.108a9.938 9.938 0 0 0 3.953 4.437l.294.17 1.687.935a.904.904 0 0 1 .099 1.522l-.097.062-1.689.937a9.951 9.951 0 0 0-4.104 4.301l-.143.305-.95 2.108a.929.929 0 0 1-1.629.103l-.054-.103-.95-2.108a9.939 9.939 0 0 0-3.954-4.437l-.294-.168-1.687-.938a.916.916 0 0 1-.467-.734.899.899 0 0 1 .369-.787l.097-.062 1.688-.936A9.951 9.951 0 0 0 7.26 5.988l.143-.305.951-2.11Zm8.335-.444a5.183 5.183 0 0 0 2.202 2.406.21.21 0 0 1 0 .37 5.183 5.183 0 0 0-2.2 2.404.217.217 0 0 1-.202.131.221.221 0 0 1-.2-.13 5.183 5.183 0 0 0-2.202-2.406.214.214 0 0 1-.11-.184.21.21 0 0 1 .11-.185 5.18 5.18 0 0 0 2.2-2.405.217.217 0 0 1 .201-.131.22.22 0 0 1 .201.13Z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='24' viewBox='0 0 20 24'%3E%3Cpath fill='currentColor' d='M8.354 3.574a.93.93 0 0 1 1.629-.102l.053.103.951 2.108a9.938 9.938 0 0 0 3.953 4.437l.294.17 1.687.935a.904.904 0 0 1 .099 1.522l-.097.062-1.689.937a9.951 9.951 0 0 0-4.104 4.301l-.143.305-.95 2.108a.929.929 0 0 1-1.629.103l-.054-.103-.95-2.108a9.939 9.939 0 0 0-3.954-4.437l-.294-.168-1.687-.938a.916.916 0 0 1-.467-.734.899.899 0 0 1 .369-.787l.097-.062 1.688-.936A9.951 9.951 0 0 0 7.26 5.988l.143-.305.951-2.11Zm8.335-.444a5.183 5.183 0 0 0 2.202 2.406.21.21 0 0 1 0 .37 5.183 5.183 0 0 0-2.2 2.404.217.217 0 0 1-.202.131.221.221 0 0 1-.2-.13 5.183 5.183 0 0 0-2.202-2.406.214.214 0 0 1-.11-.184.21.21 0 0 1 .11-.185 5.18 5.18 0 0 0 2.2-2.405.217.217 0 0 1 .201-.131.22.22 0 0 1 .201.13Z'/%3E%3C/svg%3E"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100%; mask-size: 100%; -webkit-mask-position: center; mask-position: center; color: var(--divider-color); background-color: currentColor; } /* Style 1 */ .blogsy-divider-heading.divider-style-1 { flex-wrap: wrap; } .blogsy-divider-heading.divider-style-1 .title { width: 100%; } .blogsy-divider-heading.divider-style-1 .divider-1 { order: 11; } .blogsy-divider-heading.divider-style-1 .divider-2 { order: 12; } .blogsy-divider-heading.divider-style-1 .divider { width: 3px; height: 3px; border-radius: 50px; } .blogsy-divider-heading.divider-style-1 .divider-1 { width: 30px; } /* Style 4 */ .blogsy-divider-heading.divider-style-4 { align-items: center; gap: 12px; } .blogsy-divider-heading.divider-style-4 .divider-2, .blogsy-divider-heading.divider-style-4 .divider-3, .blogsy-divider-heading.divider-style-4 .divider-4 { display: none; } .blogsy-divider-heading.divider-style-4 .divider-1 { display: block; position: relative; border-radius: 50%; height: 7px; width: 7px; flex-shrink: 0; color: var(--divider-color); background-color: currentColor; } .blogsy-divider-heading.divider-style-4 .divider-1::after, .blogsy-divider-heading.divider-style-4 .divider-1::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 50%; border: 1px solid currentColor; animation: divider-heading-pulse 2s ease-in-out infinite; } .blogsy-divider-heading.divider-style-4 .divider-1::after { animation-delay: 1s; } @keyframes divider-heading-pulse { 0% { transform: scale(1); opacity: 1; } 100% { transform: scale(3); opacity: 0; } } .blogsy-divider-heading-widget.blogsy-align-left .blogsy-divider-heading.divider-style-26 .divider-1::before { left: 0; transform: translate(0, -50%) rotate(45deg); } .blogsy-divider-heading-widget.blogsy-align-center .blogsy-divider-heading.divider-style-26 .divider-1::before { left: 50%; transform: translate(-50%, -50%) rotate(45deg); } .blogsy-divider-heading-widget.blogsy-align-right .blogsy-divider-heading.divider-style-26 .divider-1::before { right: 0; transform: translate(0, -50%) rotate(45deg); } /* News Ticker -------------------------------------------------------------- */ .blogsy-news-ticker-wrapper { --ticker-wrapper-bg : var(--pt-body-bg-color); display: flex; align-items: stretch; background-color: var(--ticker-wrapper-bg); } .blogsy-news-ticker-title-wrapper { display: flex; flex-shrink: 0; gap: 5px; align-items: center; overflow: hidden; position: relative; padding: 10px; } .blogsy-news-ticker-title-text { white-space: nowrap; } .blogsy-news-ticker-title-icon { display: flex; } .blogsy-news-ticker-title-icon svg{ width: 1em; height: 1em; fill: currentColor; } .blogsy-news-ticker-title-pulse { display: block; position: relative; border-radius: 50%; height: 10px; width: 10px; color: #fff; background-color: currentColor; } .blogsy-news-ticker-title-pulse::after, .blogsy-news-ticker-title-pulse::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 50%; border: 1px solid currentColor; animation: news-ticker-pulse 2s ease-in-out infinite; } .blogsy-news-ticker-title-pulse::after { animation-delay: 1s; } @keyframes news-ticker-pulse { 0% { transform: scale(1); opacity: 1; } 100% { transform: scale(3); opacity: 0; } } .blogsy-news-ticker-content-wrapper { flex-grow: 1; display: flex; align-items: center; overflow: hidden; } .blogsy-news-ticker-content { display: flex; flex-grow: 1; overflow: hidden; position: relative; } .blogsy-news-ticker-item { display: flex; flex-shrink: 0; white-space: nowrap; gap: 5px; align-items: center; } .blogsy-news-ticker-item .item-icon i { vertical-align: center; display: block; } .blogsy-news-ticker-item .item-icon svg { width: 1em; height: 1em; fill: currentColor; display: block; } .blogsy-news-ticker-item .item-thumbnail { width: 45px; height: 45px; flex-shrink: 0; } .blogsy-news-ticker-item .item-thumbnail img { width: 100%; height: 100%; object-fit: cover; transition: 0.6s; } .blogsy-news-ticker-item .item-date { flex-shrink: 0; } .blogsy-news-ticker-item .item-title { flex-grow: 1; width: 100%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; position: relative; } .blogsy-news-ticker-item .item-title a { color: inherit; } .blogsy-news-ticker-item .item-title a:focus, .blogsy-news-ticker-item .item-title a:hover { color: var(--pt-accent-color); } .blogsy-news-ticker-content.side-fading-left { -webkit-mask-image: linear-gradient(to right, transparent, black 10%); mask-image: linear-gradient(to right, transparent, black 10%); } .blogsy-news-ticker-content.side-fading-right { -webkit-mask-image: linear-gradient(to right, black 90%, transparent); mask-image: linear-gradient(to right, black 90%, transparent); } .blogsy-news-ticker-content.side-fading-both { -webkit-mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent); mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent); } .blogsy-news-ticker-items { display: flex; } .blogsy-news-ticker-arrows { display: flex; } .blogsy-news-ticker-arrows .carousel-nav-prev, .blogsy-news-ticker-arrows .carousel-nav-next { position: relative; transform: none; } .blogsy-news-ticker-content-wrapper.animation-type .blogsy-news-ticker-item .item-title::before { content: ''; position: absolute; height: 100%; width: 100%; background: var(--ticker-wrapper-bg); top: 0; right: 0; transition: var(--typing-speed, 3000ms) linear; } .blogsy-news-ticker-content-wrapper.animation-type .blogsy-news-ticker-item.swiper-slide-active .item-title::before { width: 0; } .blogsy-news-ticker-content-wrapper.animation-marquee .blogsy-news-ticker-items { gap: 20px; --marquee-time: 30s; animation: news-ticker-marquee var(--marquee-time) linear infinite; padding-left: 100%; flex-shrink: 0; } .blogsy-news-ticker-content-wrapper.animation-marquee.pause-hover:hover .blogsy-news-ticker-items { animation-play-state: paused; } @keyframes news-ticker-marquee { 0% { transform: translateX(0); } 100% { transform: translateX(-100%); } } /* Category Box -------------------------------------------------------------- */ .blogsy-category-box-widget { width: 100%; } .blogsy-categories-box { display: grid; grid-template-columns: repeat(4, 1fr); row-gap: 20px; column-gap: 20px; } .blogsy-categories-box .cat-item { position: relative; display: flex; flex-direction: column; align-items: center; gap: 10px; transition: 0.3s ease-out; } .blogsy-categories-box .image-wrapper { border-radius: var(--pt-soft-radius); position: relative; width: 100%; flex-shrink: 0; transform: translate(0, 0); overflow: hidden; transition: 0.8s; } .blogsy-categories-box .image-wrapper::before { content: ''; display: block; padding-top: 100%; border-radius: inherit; } .blogsy-categories-box .img-link { z-index: 5; border-radius: inherit; } .blogsy-categories-box .image-wrapper img { width: 100%; height: 100%; object-fit: cover; position: absolute; top: 0; left: 0; border-radius: inherit; transition: 0.8s; } .blogsy-categories-box .image-wrapper:hover > img, .blogsy-category-box-widget.content-position-inside .cat-item:hover .image-wrapper > img { transform: scale(1.15); } .blogsy-categories-box .image-wrapper.has-animation > img { transform-origin: right; } .blogsy-categories-box .image-wrapper.has-animation:hover > img, .blogsy-category-box-widget.content-position-inside .cat-item:hover .image-wrapper.has-animation > img { filter: blur(8px); opacity: 0; transform: scaleX(1.5); } .blogsy-categories-box .image-animation { position: absolute; left: 0; top: 0; width: 100%; height: 100%; border-radius: inherit; } .blogsy-categories-box .image-animation img { transform-origin: left; filter: blur(8px); opacity: 0; transform: scaleX(1.5); } .blogsy-categories-box .image-wrapper.has-animation:hover .image-animation > img, .blogsy-categories-box .image-wrapper.has-animation:focus-within .image-animation > img, .blogsy-category-box-widget.content-position-inside .cat-item:hover .image-wrapper.has-animation .image-animation > img, .blogsy-category-box-widget.content-position-inside .cat-item:focus-within .image-wrapper.has-animation .image-animation > img { filter: blur(0); opacity: 1; transform: scaleX(1); } .blogsy-categories-box .image-wrapper::after { content: ''; display: block; position: absolute; width: 100%; height: 100%; background: linear-gradient(0deg, var(--term-color, var(--pt-accent-color)), transparent); bottom: 0; left: 0; z-index: 2; border-radius: inherit; transition: 0.8s; } .blogsy-categories-box .content-wrapper { padding: 0 10px; width: 100%; } .blogsy-category-box-widget.content-position-inside .content-wrapper { position: absolute; bottom: 0; right: 0; left: 0; z-index: 2; padding: 20px; } .blogsy-category-box-widget.content-position-inside .card-layout .content-wrapper { padding: 30px; } .blogsy-category-box-widget.content-position-beside .cat-item { flex-direction: row; gap: 20px; } .blogsy-category-box-widget.content-position-beside .image-wrapper { width: 90px; } .blogsy-category-box-widget.content-position-beside .content-wrapper { padding: 0; } .blogsy-categories-box .title a { position: relative; display: inline-flex; gap: 3px; white-space: nowrap; align-items: center; color: var(--pt-body-color); font-size: 1.6rem; font-weight: 600; line-height: 1.4; letter-spacing: 0.5px; text-transform: capitalize; padding-left: 15px; text-decoration: none; transition: 0.3s; } .blogsy-category-box-widget.content-position-inside .title a { --pt-body-color: #fff; } .blogsy-category-box-widget.content-position-inside .title a:focus, .blogsy-category-box-widget.content-position-inside .title a:hover { color: #fff; } .blogsy-categories-box .title a:focus, .blogsy-categories-box .title a:hover { color: var(--term-color, var(--pt-accent-color)); } .blogsy-category-box-widget.content-position-inside .title a::before { color: #fff; } .blogsy-categories-box .count { font-size: 1.3rem; } .blogsy-category-box-widget.content-position-inside .count { color: #fff; } /* Category Accordion -------------------------------------------------------------- */ .blogsy-category-accordion-widget { width: 100%; } .blogsy-categories-accordion { display: flex; gap: 20px; } .blogsy-categories-accordion .cat-item { position: relative; flex-grow: 1; border-radius: var(--pt-soft-radius); border-color: var(--term-color, var(--pt-accent-color)); overflow: hidden; transition: 0.6s; } .blogsy-categories-accordion.layout-vertical { height: 400px; flex-direction: column; } .blogsy-categories-accordion.layout-horizontal .image-wrapper { height: 350px; } .blogsy-categories-accordion.layout-horizontal .cat-item { flex-basis: 200px; } .blogsy-categories-accordion.layout-horizontal .cat-item:hover { flex-grow: 1.5; flex-basis: 280px; } @media screen and (max-width: 1024px) { .blogsy-categories-accordion.layout-horizontal { flex-wrap: wrap; } .blogsy-categories-accordion.layout-horizontal .cat-item:hover { flex-basis: 200px; flex-grow: 3; } } .blogsy-categories-accordion .image-wrapper { position: relative; width: 100%; height: 100%; transform: translate(0, 0); overflow: hidden; transition: 0.8s; } .blogsy-categories-accordion .image-wrapper img { width: 100%; height: 100%; object-fit: cover; position: absolute; top: 0; left: 0; border-radius: inherit; transition: 0.8s; } .blogsy-categories-accordion .image-wrapper.has-animation > img { transform-origin: right; } .blogsy-categories-accordion .cat-item:hover .image-wrapper.has-animation > img { filter: blur(8px); opacity: 0; transform: scaleX(1.5); } .blogsy-categories-accordion .image-animation { position: absolute; left: 0; top: 0; width: 100%; height: 100%; border-radius: inherit; } .blogsy-categories-accordion .image-animation img { transform-origin: left; filter: blur(8px); opacity: 0; transform: scaleX(1.5); } .blogsy-categories-accordion .cat-item:hover .image-animation > img { filter: blur(0); opacity: 1; transform: scaleX(1); } .blogsy-categories-accordion .image-wrapper::after { content: ''; display: block; position: absolute; width: 100%; height: 100%; bottom: 0; left: 0; z-index: 2; border-radius: inherit; background: linear-gradient(0deg, var(--term-color, var(--pt-accent-color)), transparent); transition: 0.8s; } .blogsy-categories-accordion .img-link { z-index: 5; border-radius: inherit; } .blogsy-categories-accordion .content-wrapper { padding: 15px; position: absolute; bottom: 0; color: #fff; transition: 0.5s; } .blogsy-categories-accordion .title-wrapper h5 { color: inherit; margin: 0; font-size: 2rem; letter-spacing: 1px; } .blogsy-categories-accordion .count { font-size: 1.4rem; } .blogsy-categories-accordion.layout-horizontal .content-wrapper:not(.x2) { left: 0; transform: translate(-100%, 0); } .blogsy-categories-accordion.layout-horizontal .cat-item:hover .content-wrapper:not(.x2) { transform: translate(0, 0); } .blogsy-categories-accordion.layout-horizontal .content-wrapper.x2 { right: 0; transform: rotate(-90deg) translate(100%, 0); transform-origin: right bottom; } .blogsy-categories-accordion.layout-horizontal .cat-item:hover .content-wrapper.x2 { transform: rotate(-90deg) translate(100%, 100%); } .blogsy-categories-accordion.layout-vertical .cat-item:hover { flex-grow: 1.2; } .blogsy-categories-accordion.layout-vertical .content-wrapper { left: 0; } .blogsy-categories-accordion.layout-vertical .content-wrapper.x2 { transform: translate(-100%, 0); opacity: 0; } .blogsy-categories-accordion.layout-vertical .cat-item:hover .content-wrapper { transform: translate(100%, 0); opacity: 0; } .blogsy-categories-accordion.layout-vertical .cat-item:hover .content-wrapper.x2 { transform: translate(0, 0); opacity: 1; } /* Social Icons -------------------------------------------------------------- */ .blogsy-social-icons-widget ul>li>a>span, .blogsy-social-icons .social-item { --social-color: var(--pt-accent-color); } .blogsy-social-icons-widget ul>li>a>span.facebook, .blogsy-social-icons .social-item[class*="facebook"] { --social-color: #175beb; } .blogsy-social-icons-widget ul>li>a>span.twitter, .blogsy-social-icons .social-item[class*="twitter"] { --social-color: #3b3e4b; } .blogsy-social-icons-widget ul>li>a>span.linkedin, .blogsy-social-icons .social-item[class*="linkedin"] { --social-color: #29b4ff; } .blogsy-social-icons-widget ul>li>a>span.whatsapp, .blogsy-social-icons .social-item[class*="whatsapp"] { --social-color: #38cca7; } .blogsy-social-icons-widget ul>li>a>span.instagram, .blogsy-social-icons .social-item[class*="instagram"] { --social-color: #9e7cf7; } .blogsy-social-icons-widget ul>li>a>span.pinterest, .blogsy-social-icons .social-item[class*="pinterest"] { --social-color: #fc3a6a; } .blogsy-social-icons-widget ul>li>a>span.dribbble, .blogsy-social-icons .social-item[class*="dribbble"] { --social-color: #ff71a8; } .blogsy-social-icons-widget ul>li>a>span.telegram, .blogsy-social-icons .social-item[class*="telegram"] { --social-color: #08c; } .blogsy-social-icons-widget ul>li>a>span.youtube, .blogsy-social-icons .social-item[class*="youtube"] { --social-color: #f44f54; } .blogsy-social-icons-widget ul>li>a>span.vimeo, .blogsy-social-icons .social-item[class*="vimeo"] { --social-color: #55b0ff; } .blogsy-social-icons-widget ul>li>a>span.github, .blogsy-social-icons .social-item[class*="github"] { --social-color: #53566a; } .blogsy-social-icons-widget ul>li>a>span.behance, .blogsy-social-icons .social-item[class*="behance"] { --social-color: #03a9f4; } .blogsy-social-icons-widget ul>li>a>span.soundcloud, .blogsy-social-icons .social-item[class*="soundcloud"] { --social-color: #ff885d; } .blogsy-social-icons-widget ul>li>a>span.tumblr, .blogsy-social-icons .social-item[class*="tumblr"] { --social-color: #7b63fc; } .blogsy-social-icons-widget ul>li>a>span.stack-overflow, .blogsy-social-icons .social-item[class*="stack-overflow"] { --social-color: #ff983c; } .blogsy-social-icons-widget ul>li>a>span.tiktok, .blogsy-social-icons .social-item[class*="tiktok"] { --social-color: #424250; } .blogsy-social-icons { display: grid; grid-template-columns: repeat(2, 1fr); row-gap: 10px; column-gap: 10px; } .blogsy-social-icons-widget ul { padding: 0; margin: 0; list-style: none; display: flex; flex-wrap: wrap; row-gap: 8px; column-gap: 8px; } .blogsy-social-icons-widget ul>li { position: relative; align-items: center; display: flex; flex-wrap: wrap; flex-shrink: 0; height: 100%; } .blogsy-social-icons-widget ul>li>a { display: block; } .blogsy-social-icons-widget ul>li>a>span:not(.screen-reader-text) { display: flex; align-items: center; justify-content: center; position: relative; transition: all .35s cubic-bezier(.645,.045,.355,1); } .blogsy-social-icons-widget ul>li>a:focus>span:not(.screen-reader-text), .blogsy-social-icons-widget ul>li>a:hover>span:not(.screen-reader-text) { transform: translateY(-3px); } .blogsy-social-icons-widget.rounded-fill ul>li>a:focus>span:not(.screen-reader-text), .blogsy-social-icons-widget.rounded-fill ul>li>a:hover>span:not(.screen-reader-text) { box-shadow: 0 4px 15px var(--social-color); } .blogsy-social-icons-widget ul>li>a:focus>span:not(.screen-reader-text) { outline: 1px dashed #000; outline-offset: 2px; border-radius: 50%; } .blogsy-social-icons-widget.minimal-fill ul>li>a>span:not(.screen-reader-text) { color: var(--social-color); } .blogsy-social-icons-widget.minimal ul>li>a .blogsy-svg-icon svg, .blogsy-social-icons-widget.minimal-fill ul>li>a .blogsy-svg-icon svg { filter: drop-shadow(3px 2px 1px #00000020); } .blogsy-social-icons-widget.rounded-fill ul>li>a>span:not(.screen-reader-text), .blogsy-social-icons-widget.rounded-border ul>li>a>span:not(.screen-reader-text) { width: 36px; height: 36px; border-radius: 50%; } .blogsy-social-icons-widget.rounded-border ul>li>a>span:not(.screen-reader-text) { border: 1px solid rgba(185, 185, 185, 0.4); } .blogsy-social-icons-widget.rounded-fill ul>li>a>span:not(.screen-reader-text) { color: #fff; background-color: var(--social-color); } .blogsy-social-icons-widget ul>li>a .blogsy-svg-icon { display: inline-flex; align-items: center; justify-content: center; font-size: 16px; } .blogsy-social-icons-widget.blogsy-small.rounded-border>ul>li>a>span:not(.screen-reader-text), .blogsy-social-icons-widget.blogsy-small.rounded-fill>ul>li>a>span:not(.screen-reader-text) { width: 32px; height: 32px; } .blogsy-social-icons-widget.blogsy-small ul>li>a .blogsy-svg-icon { font-size: 14px; } .blogsy-social-icons-widget.minimal-fill ul, .blogsy-social-icons-widget.minimal ul { column-gap: 12px; row-gap: 12px; } .blogsy-social-icons-widget.blogsy-large.minimal-fill ul, .blogsy-social-icons-widget.blogsy-large.minimal ul { column-gap: 20px; row-gap: 12px; } .blogsy-social-icons-widget.blogsy-large.rounded-border>ul>li>a>span:not(.screen-reader-text), .blogsy-social-icons-widget.blogsy-large.rounded-fill>ul>li>a>span:not(.screen-reader-text), .blogsy-social-icons-widget.blogsy-large.rounded>ul>li>a>span:not(.screen-reader-text) { width: 40px; height: 40px; } .blogsy-social-icons-widget.blogsy-large ul>li>a .blogsy-svg-icon { font-size: 20px; } .blogsy-social-icons-widget.blogsy-xlarge.rounded-border>ul>li>a>span:not(.screen-reader-text), .blogsy-social-icons-widget.blogsy-xlarge.rounded-fill>ul>li>a>span:not(.screen-reader-text), .blogsy-social-icons-widget.blogsy-xlarge.rounded>ul>li>a>span:not(.screen-reader-text) { width: 48px; height: 48px; } .blogsy-social-icons-widget.blogsy-xlarge ul>li>a .blogsy-svg-icon { font-size: 26px; } .blogsy-social-icons-widget.social-layout-inline .blogsy-social-icons { display: flex; flex-wrap: wrap; } .blogsy-social-icons .social-item { display: flex; gap: 3px; padding: 6px; align-items: center; position: relative; border: 1px solid #e1e3ea; border-radius: 6px; } .blogsy-social-icons .social-item a { border-radius: inherit; } .blogsy-social-icons .social-content { display: flex; flex-grow: 1; align-items: center; justify-content: space-between; } .blogsy-social-icons .subtitle, .blogsy-social-icons .title { display: block; line-height: 1; padding: 3px; } .blogsy-social-icons .subtitle { font-size: 1.275rem; } .blogsy-social-icons .social-icon, .blogsy-social-icons .icon { display: flex; align-items: center; justify-content: center; } .blogsy-social-icons .icon { font-size: 26px; padding: 8px; border-radius: 6px; } .blogsy-social-icons .icon i { line-height: 1; text-shadow: 3px 2px 1px #00000020; } .blogsy-social-icons .icon svg { width: 1em; height: 1em; fill: currentColor; filter: drop-shadow(3px 2px 1px #00000020); } .blogsy-social-icons-widget.social-subtitle-bottom .social-content { flex-direction: column; align-items: flex-start; } .blogsy-social-icons-widget.social-icon-top .social-item { flex-direction: column; justify-content: center; text-align: center; } .blogsy-social-icons-widget.social-icon-top .social-content { align-items: center; } .blogsy-social-icons .social-item, .blogsy-social-icons .icon, .blogsy-social-icons .title, .blogsy-social-icons .subtitle { transition: 0.3s ease-out; } .blogsy-social-icons-widget.social-move-up-icon .social-item:hover .icon { transform: translateY(-4px); } .blogsy-social-icons-widget.social-move-up-item .social-item:hover { transform: translateY(-4px); } .blogsy-social-icons-widget.official-icon-color-yes .social-item .icon { color: var(--social-color); } .blogsy-social-icons-widget.official-icon-bg-yes .social-item .icon { background: var(--social-color); color: #fff; } .blogsy-social-icons-widget.official-icon-shadow-yes .social-item .icon { box-shadow: 0 5px 15px -3px var(--social-color); border-color: var(--social-color); } .blogsy-social-icons-widget.official-icon-hover-color-yes .social-item:hover .icon { color: var(--social-color); } .blogsy-social-icons-widget.official-icon-hover-bg-yes .social-item:hover .icon { background: var(--social-color); border-color: var(--social-color); color: #fff; } .blogsy-social-icons-widget.official-icon-hover-shadow-yes .social-item:hover .icon { box-shadow: 0 5px 15px -3px var(--social-color); border-color: var(--social-color); } .blogsy-social-icons-widget.official-item-color-yes .social-item { border-color: var(--social-color); color: var(--social-color); } .blogsy-social-icons-widget.official-item-bg-yes .social-item { background: var(--social-color); color: #fff; } .blogsy-social-icons-widget.official-item-shadow-yes .social-item { box-shadow: 0 5px 15px -3px var(--social-color); border-color: var(--social-color); } .blogsy-social-icons-widget.official-item-hover-color-yes .social-item:hover { border-color: var(--social-color); color: var(--social-color); } .blogsy-social-icons-widget.official-item-hover-bg-yes .social-item:hover { background: var(--social-color); border-color: var(--social-color); color: #fff; } .blogsy-social-icons-widget.official-item-hover-shadow-yes .social-item:hover { box-shadow: 0 5px 15px -3px var(--social-color); border-color: var(--social-color); } /* Pagination -------------------------------------------------------------- */ .blogsy-posts-pagination { display: inline-flex; flex-wrap: wrap; column-gap: 10px; row-gap: 10px; } .blogsy-posts-pagination .page-numbers { display: inline-flex; justify-content: center; align-items: center; line-height: 1; min-width: max-content; min-height: max-content; } .load-more-pagination { display: inline-block; position: relative; } .blogsy-post-load-more { background: var(--pt-accent-color); } .blogsy-post-load-more-loader { display: none; position: absolute; bottom: 0; left: 50%; transform-origin: left; transform: translateX(-50%); width: 50px; height: 50px; border-radius: 100%; background-color: var(--pt-accent-color); animation: load-more-loader-anim 1.2s ease-in-out infinite; } @keyframes load-more-loader-anim { 0% { transform: scale(0) translateX(-50%); opacity: 0.8;} 100% { transform: scale(1) translateX(-50%); opacity: 0;} } .blogsy-post-load-more { transition: 0.3s; } .blogsy-post-load-more.hide { opacity: 0; visibility: hidden; } .blogsy-post-load-more-loader.show { display: inline-block; } /* Carousel -------------------------------------------------------------- */ .blogsy-posts-carousel-wrapper { position: relative; } .carousel-nav-wrapper { z-index: 10; min-width: 2em; font-size: 28px; } .carousel-nav-prev, .carousel-nav-next { position: absolute; top: 0; transform: translateY(-50%); display: flex; align-items: center; justify-content: center; gap: 5px; transition: 0.3s; } .carousel-nav-prev { left: 0; } .carousel-nav-next { right: 0; } .carousel-nav-prev-label, .carousel-nav-next-label { font-size: 90%; } .carousel-nav-wrapper.show-on-hover .carousel-nav-prev { transform: translate(-20px, -50%); opacity: 0; visibility: hidden; } .carousel-nav-wrapper.show-on-hover .carousel-nav-next { transform: translate(20px, -50%); opacity: 0; visibility: hidden; } .blogsy-posts-carousel-wrapper:hover .carousel-nav-wrapper.show-on-hover .carousel-nav-prev, .blogsy-posts-carousel-wrapper:hover .carousel-nav-wrapper.show-on-hover .carousel-nav-next { transform: translate(0, -50%); opacity: 1; visibility: visible; } .carousel-nav-prev i, .carousel-nav-next i { display: block; line-height: 1; } .carousel-nav-prev .blogsy-svg-icon, .carousel-nav-prev i { transform: scaleX(-1); } .carousel-pagination-wrapper { z-index: 10; } .carousel-pagination-wrapper.type-bullets .carousel-pagination { display: flex; align-items: center; gap: 15px; position: relative; } .carousel-pagination-wrapper.type-bullets.style-default .carousel-pagination { gap: 10px; } .carousel-pagination-wrapper.type-fraction .carousel-pagination { bottom: auto; position: relative; } .carousel-pagination-wrapper.type-bullets.blogsy-position-center-left .carousel-pagination, .carousel-pagination-wrapper.type-bullets.blogsy-position-center-right .carousel-pagination{ flex-direction: column; } .carousel-pagination-wrapper.type-bullets.blogsy-position-center-left .carousel-pagination { align-items: flex-start; } .carousel-pagination-wrapper.type-bullets.blogsy-position-center-right .carousel-pagination { align-items: flex-end; } .carousel-pagination-wrapper.type-bullets .carousel-pagination.swiper-pagination-bullets-dynamic { display: block; transform: none; left: 0; } .carousel-pagination-wrapper .swiper-pagination-bullet { transition: 0.3s; opacity: 1; margin: 0 !important; color: #8c8f9d; background: currentColor; position: relative; width: 8px; height: 8px; } .carousel-pagination-wrapper .swiper-pagination-bullet-active { color: var(--pt-accent-color); } .carousel-pagination-wrapper.type-bullets .swiper-pagination-bullets-dynamic .swiper-pagination-bullet { margin: 0 4px !important; } .carousel-pagination-wrapper.style-1 .swiper-pagination-bullet-active::after { content: ""; position: absolute; border: 1px solid; left: -6px; right: -6px; top: -6px; bottom: -6px; border-radius: 50px; border-left: none; border-right: none; animation: bullet-style-1 1s linear 0s infinite; } @keyframes bullet-style-1 { 0% { transform: rotate(0deg) } 100% { transform: rotate(360deg) } } .carousel-pagination-wrapper.style-2 .swiper-pagination-bullet::after { content: ""; position: absolute; border: 2px solid; left: -1px; right: -1px; top: -1px; bottom: -1px; border-radius: inherit; transition: 0.2s; } .carousel-pagination-wrapper.style-2 .swiper-pagination-bullet-active { background: transparent; } .carousel-pagination-wrapper.style-3 .swiper-pagination-bullet::after, .carousel-pagination-wrapper.style-4 .swiper-pagination-bullet::after { content: ""; position: absolute; border: 1px solid; left: -6px; right: -6px; top: -6px; bottom: -6px; border-radius: inherit; transition: transform 0.4s; } .carousel-pagination-wrapper.style-3 .swiper-pagination-bullet::after { transform: scale(0); } .carousel-pagination-wrapper.style-3 .swiper-pagination-bullet-active::after { transform: scale(1); } .carousel-pagination-wrapper.style-4 .swiper-pagination-bullet::after { border: 3px solid; transition: 0s; transform: scale(0); } .carousel-pagination-wrapper.style-4 .swiper-pagination-bullet-active::after { transition: 1s; transform: scale(2); opacity: 0; } .carousel-pagination-wrapper.style-5 .carousel-pagination { gap: 10px; } .carousel-pagination-wrapper.style-5 .swiper-pagination-bullet::after { content: ""; position: absolute; border: 2px solid; left: 0; right: 0; top: 0; bottom: 0; border-radius: inherit; } .carousel-pagination-wrapper.style-5 .swiper-pagination-bullet { background: transparent; } .carousel-pagination-wrapper.style-5 .swiper-pagination-bullet-active::after { background: currentColor; } .blogsy-posts-wrapper .swiper-vertical .post-item { width: 100% !important; margin-right: 0 !important; margin-left: 0 !important; } .blogsy-posts-wrapper .swiper-vertical .post-item .post-wrapper { height: 100%; } /* Posts Layout -------------------------------------------------------------- */ .blogsy-posts-wrapper.layout-grid { display: grid; grid-template-columns: repeat(2, 1fr); row-gap: 30px; column-gap: 30px; } .blogsy-posts-wrapper.layout-masonry { display: flex; flex-wrap: wrap; margin-left: calc(20px * -.5); margin-right: calc(20px * -.5); } .blogsy-posts-wrapper.layout-masonry > .post-item { width: 50%; margin-bottom: 20px; padding-left: calc(20px * .5); padding-right: calc(20px * .5); } .blogsy-posts-wrapper .swiper, .blogsy-posts-wrapper .carousel-nav-wrapper { opacity: 0; transition: 0.4s; } .blogsy-posts-wrapper .swiper.swiper-initialized, .blogsy-posts-wrapper .swiper.swiper-initialized + .carousel-nav-wrapper { opacity: 1; } .blogsy-posts-wrapper .swiper-wrapper { align-items: stretch; } .blogsy-posts-wrapper .post-item { display: flex; flex-wrap: wrap; } .elementor-edit-mode .blogsy-posts-wrapper.layout-masonry { /* Fix masonry in elementor editor */ height: auto !important; align-items: flex-start; } /* Posts Grid Tiles Layout -------------------------------------------------------------- */ .blogsy-posts-wrapper.layout-grid.tiles-layout-1 { grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(2, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-1 .post-item:nth-child(10n+1), .blogsy-posts-wrapper.layout-grid.tiles-layout-1 .post-item:nth-child(10n+8) { grid-row: span 2; grid-column: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-2 { grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(2, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-2 .post-item:nth-child(4n+1) { grid-row: span 2; grid-column: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-2 .post-item:nth-child(4n+2) { grid-row: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-3 { grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(2, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-3 .post-item:nth-child(4n+1) { grid-row: span 2; grid-column: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-3 .post-item:nth-child(4n+3) { grid-row: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-4 { grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(2, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-4 .post-item:nth-child(4n+1) { grid-row: span 2; grid-column: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-4 .post-item:nth-child(4n+2) { grid-column: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-5 { grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(2, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-5 .post-item:nth-child(4n+1) { grid-row: span 2; grid-column: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-5 .post-item:nth-child(4n+4) { grid-column: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-6 { grid-template-columns: repeat(4, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-6 .post-item:nth-child(6n+1), .blogsy-posts-wrapper.layout-grid.tiles-layout-6 .post-item:nth-child(6n+6) { grid-column: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-7 { grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(2, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-7 .post-item:nth-child(5n+2) { grid-row: span 2; grid-column: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-8 { grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(2, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-8 .post-item:nth-child(5n+1) { grid-row: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-8 .post-item:nth-child(5n+3), .blogsy-posts-wrapper.layout-grid.tiles-layout-8 .post-item:nth-child(5n+4) { grid-column: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-9 { grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(2, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-9 .post-item:nth-child(5n+2), .blogsy-posts-wrapper.layout-grid.tiles-layout-9 .post-item:nth-child(5n+4), .blogsy-posts-wrapper.layout-grid.tiles-layout-9 .post-item:nth-child(5n+5) { grid-column: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-10 { grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(2, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-10 .post-item:nth-child(6n+1), .blogsy-posts-wrapper.layout-grid.tiles-layout-10 .post-item:nth-child(6n+5) { grid-row: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-11 { grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(2, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-11 .post-item:nth-child(6n+1), .blogsy-posts-wrapper.layout-grid.tiles-layout-11 .post-item:nth-child(6n+5) { grid-column: span 2; grid-row: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-12 { grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(2, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-12 .post-item:nth-child(4n+1) { grid-column: span 3; } .blogsy-posts-wrapper.layout-grid.tiles-layout-13 { grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(2, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-13 .post-item:nth-child(6n+1) { grid-column: span 2; grid-row: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-14 { grid-template-columns: repeat(6, 1fr); grid-template-rows: repeat(2, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-14 .post-item { grid-column: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-14 .post-item:nth-child(5n+1), .blogsy-posts-wrapper.layout-grid.tiles-layout-14 .post-item:nth-child(5n+2) { grid-column: span 3; } .blogsy-posts-wrapper.layout-grid.tiles-layout-15 { grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(2, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-15 .post-item:nth-child(4n+1), .blogsy-posts-wrapper.layout-grid.tiles-layout-15 .post-item:nth-child(4n+2) { grid-row: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-16 { grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(2, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-16 .post-item:nth-child(5n+2) { grid-row: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-17 { grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(2, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-17 .post-item:nth-child(5n+1) { grid-row: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-18 { grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(2, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-18 .post-item:nth-child(5n+3) { grid-row: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-19 { grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(2, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-19 .post-item:nth-child(4n+1), .blogsy-posts-wrapper.layout-grid.tiles-layout-19 .post-item:nth-child(4n+4) { grid-column: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-20 { grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(2, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-20 .post-item:nth-child(5n+3) { grid-column: span 2; grid-row: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-21 { grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(2, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-21 .post-item:nth-child(4n+1) { grid-column: span 2; grid-row: span 3; } .blogsy-posts-wrapper.layout-grid.tiles-layout-22 { grid-template-columns: repeat(5, 1fr); grid-template-rows: repeat(2, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-22 .post-item:nth-child(n) { grid-column: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-22 .post-item:nth-child(3n+1) { grid-column: span 3; grid-row: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-23 { grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(2, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-23 .post-item:nth-child(6n+5) { grid-column: span 2; grid-row: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-24 { grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(2, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-24 .post-item:nth-child(4n+1) { grid-row: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-24 .post-item:nth-child(4n+2) { grid-column: span 2; grid-row: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-25 { grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-25 .post-item:nth-child(5n+1), .blogsy-posts-wrapper.layout-grid.tiles-layout-25 .post-item:nth-child(5n+4){ grid-row: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-25 .post-item:nth-child(5n+2), .blogsy-posts-wrapper.layout-grid.tiles-layout-25 .post-item:nth-child(5n+5) { grid-column: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-26 { grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(3, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-26 .post-item:nth-child(6n+1), .blogsy-posts-wrapper.layout-grid.tiles-layout-26 .post-item:nth-child(6n+2){ grid-column: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-26 .post-item:nth-child(6n+4) { grid-row: span 2; grid-column: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-26 .post-item:nth-child(6n+5) { grid-row: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-27 { grid-template-columns: repeat(4, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-27 .post-item:nth-child(3n+2) { grid-column: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-28 { grid-template-columns: repeat(3, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-28 .post-item:nth-child(4n+1), .blogsy-posts-wrapper.layout-grid.tiles-layout-28 .post-item:nth-child(4n+4) { grid-column: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-29 { grid-template-columns: repeat(3, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-29 .post-item:nth-child(2n) { grid-column: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-30 { grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(3, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-30 .post-item:nth-child(4n+2), .blogsy-posts-wrapper.layout-grid.tiles-layout-30 .post-item:nth-child(4n+3) { grid-row: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-31 { grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(2, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-31 .post-item:nth-child(4n+1) { grid-column: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-31 .post-item:nth-child(4n+2) { grid-column: span 2; grid-row: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-32 { grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-32 .post-item:nth-child(3n+1) { grid-column: span 2; grid-row: span 3; } .blogsy-posts-wrapper.layout-grid.tiles-layout-32 .post-item:nth-child(3n+2) { grid-row: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-33 { grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-33 .post-item:nth-child(3n+1) { grid-column: span 2; grid-row: span 3; } .blogsy-posts-wrapper.layout-grid.tiles-layout-33 .post-item:nth-child(3n+3) { grid-row: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-34 { grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(3, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-34 .post-item:nth-child(5n+1) { grid-column: span 2; grid-row: span 3; } .blogsy-posts-wrapper.layout-grid.tiles-layout-34 .post-item:nth-child(5n+3), .blogsy-posts-wrapper.layout-grid.tiles-layout-34 .post-item:nth-child(5n+4) { grid-row: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-35 { grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(3, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-35 .post-item:nth-child(5n+1) { grid-column: span 2; grid-row: span 3; } .blogsy-posts-wrapper.layout-grid.tiles-layout-35 .post-item:nth-child(5n+2), .blogsy-posts-wrapper.layout-grid.tiles-layout-35 .post-item:nth-child(5n+4) { grid-row: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-36 { grid-template-columns: repeat(3, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-36 .post-item:nth-child(7n+1), .blogsy-posts-wrapper.layout-grid.tiles-layout-36 .post-item:nth-child(7n+7) { grid-column: span 2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-37 { grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(5, 1fr); } .blogsy-posts-wrapper.layout-grid.tiles-layout-37 .post-item { grid-row: span 3; } .blogsy-posts-wrapper.layout-grid.tiles-layout-37 .post-item:nth-child(6n+1), .blogsy-posts-wrapper.layout-grid.tiles-layout-37 .post-item:nth-child(6n+6) { grid-column: span 2; grid-row: span 2; } @media screen and (min-width: 1025px) { .blogsy-posts-wrapper.layout-grid[class*="tiles-layout-"] .post-wrapper .title { --sm-tiles-font-size: 2rem; --sm-tiles-line-height: 1.2; } .blogsy-posts-wrapper.layout-grid.tiles-layout-1 .post-item:not(:nth-child(10n+1)):not(:nth-child(10n+8)) .post-wrapper .title { font-size: var(--sm-tiles-font-size); line-height: var(--sm-tiles-line-height); } .blogsy-posts-wrapper.layout-grid.tiles-layout-2 .post-item:not(:nth-child(4n+1)) .post-wrapper .title { font-size: var(--sm-tiles-font-size); line-height: var(--sm-tiles-line-height); } .blogsy-posts-wrapper.layout-grid.tiles-layout-3 .post-item:not(:nth-child(4n+1)) .post-wrapper .title { font-size: var(--sm-tiles-font-size); line-height: var(--sm-tiles-line-height); } .blogsy-posts-wrapper.layout-grid.tiles-layout-4 .post-item:not(:nth-child(4n+1)) .post-wrapper .title { font-size: var(--sm-tiles-font-size); line-height: var(--sm-tiles-line-height); } .blogsy-posts-wrapper.layout-grid.tiles-layout-5 .post-item:not(:nth-child(4n+1)) .post-wrapper .title { font-size: var(--sm-tiles-font-size); line-height: var(--sm-tiles-line-height); } .blogsy-posts-wrapper.layout-grid.tiles-layout-6 .post-item:not(:nth-child(6n+1)):not(:nth-child(6n+6)) .post-wrapper .title { font-size: var(--sm-tiles-font-size); line-height: var(--sm-tiles-line-height); } .blogsy-posts-wrapper.layout-grid.tiles-layout-7 .post-item:not(:nth-child(5n+2)) .post-wrapper .title { font-size: var(--sm-tiles-font-size); line-height: var(--sm-tiles-line-height); } .blogsy-posts-wrapper.layout-grid.tiles-layout-9 .post-item:nth-child(5n+1) .post-wrapper .title, .blogsy-posts-wrapper.layout-grid.tiles-layout-9 .post-item:nth-child(5n+3) .post-wrapper .title { font-size: var(--sm-tiles-font-size); line-height: var(--sm-tiles-line-height); } .blogsy-posts-wrapper.layout-grid.tiles-layout-11 .post-item:not(:nth-child(6n+1)):not(:nth-child(6n+5)) .post-wrapper .title { font-size: var(--sm-tiles-font-size); line-height: var(--sm-tiles-line-height); } .blogsy-posts-wrapper.layout-grid.tiles-layout-13 .post-item:not(:nth-child(6n+1)) .post-wrapper .title { font-size: var(--sm-tiles-font-size); line-height: var(--sm-tiles-line-height); } .blogsy-posts-wrapper.layout-grid.tiles-layout-15 .post-item:nth-child(4n+3) .post-wrapper .title, .blogsy-posts-wrapper.layout-grid.tiles-layout-15 .post-item:nth-child(4n+4) .post-wrapper .title { font-size: var(--sm-tiles-font-size); line-height: var(--sm-tiles-line-height); } .blogsy-posts-wrapper.layout-grid.tiles-layout-16 .post-item:not(:nth-child(5n+2)) .post-wrapper .title { font-size: var(--sm-tiles-font-size); line-height: var(--sm-tiles-line-height); } .blogsy-posts-wrapper.layout-grid.tiles-layout-17 .post-item:not(:nth-child(5n+1)) .post-wrapper .title { font-size: var(--sm-tiles-font-size); line-height: var(--sm-tiles-line-height); } .blogsy-posts-wrapper.layout-grid.tiles-layout-18 .post-item:not(:nth-child(5n+3)) .post-wrapper .title { font-size: var(--sm-tiles-font-size); line-height: var(--sm-tiles-line-height); } .blogsy-posts-wrapper.layout-grid.tiles-layout-20 .post-item:not(:nth-child(5n+3)) .post-wrapper .title { font-size: var(--sm-tiles-font-size); line-height: var(--sm-tiles-line-height); } .blogsy-posts-wrapper.layout-grid.tiles-layout-21 .post-item:not(:nth-child(4n+1)) .post-wrapper .title { font-size: var(--sm-tiles-font-size); line-height: var(--sm-tiles-line-height); } .blogsy-posts-wrapper.layout-grid.tiles-layout-22 .post-item:not(:nth-child(3n+1)) .post-wrapper .title { font-size: var(--sm-tiles-font-size); line-height: var(--sm-tiles-line-height); } .blogsy-posts-wrapper.layout-grid.tiles-layout-23 .post-item:not(:nth-child(6n+5)) .post-wrapper .title { font-size: var(--sm-tiles-font-size); line-height: var(--sm-tiles-line-height); } .blogsy-posts-wrapper.layout-grid.tiles-layout-24 .post-item:not(:nth-child(4n+2)) .post-wrapper .title { font-size: var(--sm-tiles-font-size); line-height: var(--sm-tiles-line-height); } .blogsy-posts-wrapper.layout-grid.tiles-layout-26 .post-item:nth-child(6n+3) .post-wrapper .title, .blogsy-posts-wrapper.layout-grid.tiles-layout-26 .post-item:nth-child(6n+5) .post-wrapper .title, .blogsy-posts-wrapper.layout-grid.tiles-layout-26 .post-item:nth-child(6n+6) .post-wrapper .title { font-size: var(--sm-tiles-font-size); line-height: var(--sm-tiles-line-height); } .blogsy-posts-wrapper.layout-grid.tiles-layout-27 .post-item:not(:nth-child(3n+2)) .post-wrapper .title { font-size: var(--sm-tiles-font-size); line-height: var(--sm-tiles-line-height); } .blogsy-posts-wrapper.layout-grid.tiles-layout-31 .post-item:not(:nth-child(4n+2)) .post-wrapper .title { font-size: var(--sm-tiles-font-size); line-height: var(--sm-tiles-line-height); } .blogsy-posts-wrapper.layout-grid.tiles-layout-32 .post-item:not(:nth-child(3n+1)) .post-wrapper .title { font-size: var(--sm-tiles-font-size); line-height: var(--sm-tiles-line-height); } .blogsy-posts-wrapper.layout-grid.tiles-layout-33 .post-item:not(:nth-child(3n+1)) .post-wrapper .title { font-size: var(--sm-tiles-font-size); line-height: var(--sm-tiles-line-height); } .blogsy-posts-wrapper.layout-grid.tiles-layout-34 .post-item:not(:nth-child(5n+1)) .post-wrapper .title { font-size: var(--sm-tiles-font-size); line-height: var(--sm-tiles-line-height); } .blogsy-posts-wrapper.layout-grid.tiles-layout-35 .post-item:not(:nth-child(5n+1)) .post-wrapper .title { font-size: var(--sm-tiles-font-size); line-height: var(--sm-tiles-line-height); } .blogsy-posts-wrapper.layout-grid.tiles-layout-37 .post-item:not(:nth-child(6n+1)):not(:nth-child(6n+6)) .post-wrapper .title { font-size: var(--sm-tiles-font-size); line-height: var(--sm-tiles-line-height); } } @media screen and (min-width: 1025px) { .blogsy-posts-wrapper.layout-grid[class*="tiles-layout-"] .post-wrapper { height: auto !important; } } @media screen and (max-width: 1024px){ .blogsy-posts-wrapper.layout-grid[class*="tiles-layout-"] { grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(1, 1fr); } .blogsy-posts-wrapper.layout-grid[class*="tiles-layout-"] .post-item:nth-child(1) { grid-row: span 1; grid-column: span 2; } .blogsy-posts-wrapper.layout-grid[class*="tiles-layout-"] .post-item:nth-child(n+2) { grid-row: span 1; grid-column: span 1; } } @media screen and (max-width: 767px){ .blogsy-posts-wrapper.layout-grid[class*="tiles-layout-"] { grid-template-columns: repeat(1, 1fr); grid-template-rows: repeat(1, 1fr); } .blogsy-posts-wrapper.layout-grid[class*="tiles-layout-"] .post-item:nth-child(n) { grid-row: span 1; grid-column: span 1; } } /* Global Post Items -------------------------------------------------------------- */ /* Sticky Post */ .blogsy-posts-wrapper .post-wrapper.sticky .title a::before { content: "\e908"; font-family: "blogsy-icon" !important; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 85%; } /* Term Meta */ .post-wrapper .terms-wrapper { display: flex; justify-content: inherit; flex-wrap: wrap; gap: 1.5rem; flex-grow: 1; } .post-wrapper .term-item { position: relative; display: inline-flex; gap: 3px; white-space: nowrap; align-items: center; color: var(--pt-body-color); padding-left: 1.5rem; transition: all 0.35s cubic-bezier( 0.645, 0.045, 0.355, 1 ); } .post-wrapper .term-item:focus, .post-wrapper .term-item:hover { color: var(--term-color, var(--pt-accent-color)); } .single-post-tags a::before, .wp-block-tag-cloud a::before, .blogsy-categories-box .title a::before, .post-wrapper .term-item::before { content: ''; width: 6px; height: 6px; border-radius: 10px; margin-top: -0.3px; background: var(--term-color, var(--pt-accent-color)); position: absolute; left: 0; top: 50%; transform: translateY(-50%); transition: all 300ms ease; } .single-post-tags a:focus:before, .single-post-tags a:hover:before, .wp-block-tag-cloud a:focus:before, .wp-block-tag-cloud a:hover:before, .blogsy-categories-box .title a:focus:before, .blogsy-categories-box .title a:hover:before, .post-wrapper .term-item:focus:before, .post-wrapper .term-item:hover:before { width: 9px; } /* Big Date */ .post-wrapper .date-in-out-image { display: inline-flex; justify-content: center; align-items: center; flex-direction: column; padding: 7px; z-index: 10; border-color: var(--term-color, var(--pt-accent-color)); } .post-wrapper .date-in-out-image.date-inside-image { background: white; color: #000; } .post-wrapper .date-in-out-image span { line-height: 1; } .post-wrapper .date-in-out-image .day { margin-bottom: 5px; font-size: 2.25rem; font-weight: 600; } /* Title */ .post-wrapper .title { line-height: 1.2em; word-wrap: break-word; } .post-wrapper .title a { color: inherit; word-break: break-word; } .post-wrapper .title a:focus, .post-wrapper .title a:hover { color: var(--pt-accent-color); } /* Post Format Icon */ .post-format-icon { width: 4.5rem; height: 4.5rem; border-radius: 50%; background-color: rgb(255, 255, 255, 0.3); color: #ffffff; margin: 1.8rem; font-size: 2.4rem; display: inline-flex; justify-content: center; align-items: center; backdrop-filter: blur(10px); z-index: 30; } .post-wrapper .post-format-icon .blogsy-svg-icon { margin-right: 0; font-size: 100%; } .post-format-icon svg { filter: drop-shadow(0 0 15px rgba(41, 42, 48, 0.35)); } .post-format-icon i { line-height: 1; display: block; text-shadow: 0 0 15px rgba(41, 42, 48, 0.35); } /* Post Author */ .post-author-wrapper { display: flex; align-items: center; position: relative; } .default-post-list-item .meta-details .avatar, .post-author-wrapper .author-image img { margin-right: 8px; width: 30px; height: 30px; border-radius: 50%; outline: 1px solid rgba(185, 185, 185, 0.4); } .post-author-wrapper .author-wrapper { text-align: start; } .meta-wrapper a { font-weight: 600; } /* Post Counter */ .post-counter-wrap.counter-inside-image { z-index: 3; } .post-counter { position: relative; display: flex; justify-content: center; align-items: center; font-size: 2.7rem; padding: 15px; border-color: var(--term-color, var(--pt-accent-color)); } .post-counter::before { counter-increment: post-num; content: counter(post-num, decimal); line-height: 1; } .post-counter::after { line-height: 1; } /* Post Wrapper Spacing */ .post-wrapper .content-container > *:not(:last-child), .post-wrapper .content-wrapper-inner > *:not(:last-child) { margin-bottom: 1.5rem; } @media screen and (max-width: 767px){ .post-wrapper .content-container > *:not(:last-child), .post-wrapper .content-wrapper-inner > *:not(:last-child) { margin-bottom: 1.4rem; } } .post-wrapper .content-container > *:last-child, .post-wrapper .content-wrapper-inner > *:last-child { margin-bottom: 0; } /* Footer */ .post-wrapper .footer-wrap { border-top: 1px dashed var(--pt-border-color); padding-top: 16px; margin-top: 50px; display: flex; gap: 10px; flex-wrap: wrap; align-items: center; } @media (min-width: 768px) { .post-wrapper .footer-wrap { padding-top: 20px; } } .post-wrapper .footer-meta { display: flex; gap: 10px; font-size: 1.4rem; font-weight: 600; line-height: 1.2; text-transform: capitalize; } .post-wrapper .blogsy-svg-icon { font-size: 105%; margin-right: 0.3rem; } .post-wrapper .reading-time .blogsy-svg-icon svg, .post-wrapper .footer-meta .blogsy-svg-icon svg { transform: translateY(-0.1rem); } /* Meta */ .post-wrapper .meta-wrapper { display: flex; flex-wrap: wrap; align-items: center; justify-content: inherit; column-gap: 1.5rem; row-gap: 1rem; font-size: 1.4rem; font-weight: 500; text-transform: capitalize; } /* Post Nexo -------------------------------------------------------------- */ .blogsy-post-nexo-widget { width: 100%; } .blogsy-post-nexo-widget .post-wrapper { display: flex; position: relative; border-radius: var(--pt-soft-radius); width: 100%; transition: 0.3s; overflow: hidden; } .blogsy-post-nexo-widget .post-wrapper::before { content: ''; display: block; position: absolute; width: 100%; height: 100%; bottom: 0; left: 0; z-index: 2; border-radius: inherit; background: linear-gradient(0deg, #1c1d25d6, transparent 70%); transition: 0.8s; } .blogsy-post-nexo-widget .post-wrapper.overlay-2::before { background: rgba(0, 0, 0, 0.35); transition: .25s; } .blogsy-post-nexo-widget .post-wrapper.overlay-2:focus-within::before, .blogsy-post-nexo-widget .post-wrapper.overlay-2:hover::before { background: rgba(0, 0, 0, 0.4); } .blogsy-post-nexo-widget .post-wrapper.overlay-2:focus-within .image-wrapper > img, .blogsy-post-nexo-widget .post-wrapper.overlay-2:hover .image-wrapper > img { transform: scale(1.05); } .blogsy-post-nexo-widget .post-wrapper .item-link { z-index: 5; border-radius: inherit; } .blogsy-post-nexo-widget .post-wrapper .image-wrapper { overflow: hidden; display: flex; transform: translate(0, 0); width: 100%; min-height: 45rem; background-color: rgba(25, 25, 29, 0.45); border-radius: inherit; transition: 0.8s; } .blogsy-post-nexo-widget .post-wrapper .image-wrapper img { width: 100%; height: 100%; object-fit: cover; transition: 0.8s; } .blogsy-post-nexo-widget .post-wrapper:hover .image-wrapper > img { transform: scale(1.15); } .blogsy-post-nexo-widget .post-wrapper.has-animation .image-wrapper > img { transform-origin: right; } .blogsy-post-nexo-widget .post-wrapper.has-animation:hover .image-wrapper > img { filter: blur(8px); opacity: 0; transform: scaleX(1.5); } .blogsy-post-nexo-widget .post-wrapper .image-animation { position: absolute; left: 0; top: 0; width: 100%; height: 100%; border-radius: inherit; } .blogsy-post-nexo-widget .post-wrapper .image-animation img { transform-origin: left; filter: blur(8px); opacity: 0; transform: scaleX(1.5); } .blogsy-post-nexo-widget .post-wrapper:hover .image-animation > img { filter: blur(0); opacity: 1; transform: scaleX(1); } .blogsy-post-nexo-widget .terms-wrapper, .peony-slider .terms-wrapper { gap: 1rem; } .blogsy-post-nexo-widget .term-item, .peony-slider .term-item { --pt-body-color: #fff; padding: 6px 12px; border-radius: var(--pt-btn-radius); color: var(--term-color, #fff); background-color: var(--term-80-color, rgba(255,255,255,.22)); backdrop-filter: blur(10px); } .blogsy-post-nexo-widget .term-item::before, .peony-slider .term-item::before { display: none; } .blogsy-post-nexo-widget .term-item:focus, .blogsy-post-nexo-widget .term-item:hover, .peony-slider .term-item:focus, .peony-slider .term-item:hover { color: #fff; background-color: var(--term-color, rgba(255,255,255,.3)); } .blogsy-post-nexo-widget .meta-wrapper a:focus, .blogsy-post-nexo-widget .meta-wrapper a:hover, .peony-slider .meta-wrapper a:focus, .peony-slider .meta-wrapper a:hover, .blogsy-post-nexo-widget .post-wrapper .title, .blogsy-post-nexo-widget .post-wrapper .title a, .blogsy-post-nexo-widget .post-wrapper .title a:focus, .blogsy-post-nexo-widget .post-wrapper .title a:hover { color: #fff; } .blogsy-post-nexo-widget .post-wrapper .meta-wrapper { color: #fff; transition: inherit; } .blogsy-post-nexo-widget .post-wrapper .meta-wrapper .date-on { margin-right: 0.3rem; } .blogsy-post-nexo-widget .excerpt { color: #fff; margin: 0; transition: 0.4s cubic-bezier(.17,.73,.66,.99); } .blogsy-post-nexo-widget .post-wrapper .top-content-wrapper { display: flex; align-items: center; padding: 20px; z-index: 10; } .blogsy-post-nexo-widget .post-wrapper .top-content-wrapper .terms-wrapper { margin-bottom: 0; } .blogsy-post-nexo-widget .post-wrapper .top-content-wrapper .reading-time { flex-shrink: 0; font-size: 1.4rem; padding: 3.563px 12px; font-weight: 600; letter-spacing: 0.1px; border-radius: var(--pt-btn-radius); color: #fff; background-color: rgba(255, 255, 255, .22); backdrop-filter: blur(10px); opacity: 0; visibility: hidden; transition: all 0.35s cubic-bezier(0.645, 0.045, 0.355, 1); } .blogsy-post-nexo-widget .post-wrapper:focus-within .top-content-wrapper .reading-time, .blogsy-post-nexo-widget .post-wrapper:hover .top-content-wrapper .reading-time { opacity: 1; visibility: visible; } .blogsy-post-nexo-widget .post-wrapper .top-content-wrapper .post-author-wrapper { font-size: 1.275rem; color: #fff; text-transform: capitalize; } .blogsy-post-nexo-widget .post-wrapper .top-content-wrapper .post-author-wrapper i { font-size: 110%; vertical-align: middle; } .blogsy-post-nexo-widget .post-wrapper .content-wrapper { position: absolute; width: 100%; z-index: 10; transition: 0.4s cubic-bezier(.17,.73,.66,.99); } .blogsy-post-nexo-widget .post-wrapper .content-wrapper.style-3 { z-index: 4; } .blogsy-post-nexo-widget .post-wrapper .content-wrapper-inner { padding: 20px; transition: 0.4s cubic-bezier(.17,.73,.66,.99); } .blogsy-post-nexo-widget .post-wrapper .content-wrapper.style-0 .content-wrapper-inner { padding: 3rem } .blogsy-post-nexo-widget .post-wrapper .content-wrapper.style-0 .content-wrapper-inner .meta-wrapper { margin-bottom: 1rem; gap: 0.6rem; } .blogsy-post-nexo-widget .post-wrapper .content-wrapper.style-0 .content-wrapper-inner .meta-wrapper .date-wrapper { opacity: 0.7; } .blogsy-post-nexo-widget .post-wrapper .content-wrapper.style-0 .content-wrapper-inner .excerpt { opacity: 0.8; } .blogsy-post-nexo-widget .post-wrapper .content-wrapper.style-0 .content-wrapper-inner .blogsy-btn { color: #fff; background-color: rgba(255, 255, 255, .22); } .blogsy-post-nexo-widget .post-wrapper .content-wrapper.style-0 .content-wrapper-inner .blogsy-btn:focus, .blogsy-post-nexo-widget .post-wrapper .content-wrapper.style-0 .content-wrapper-inner .blogsy-btn:hover { color: var(--pt-body-color); background-color: var(--pt-card-bg); } .blogsy-post-nexo-widget .post-wrapper .content-wrapper.style-2 .content-wrapper-inner { transform: translateY(40px); } .blogsy-post-nexo-widget .post-wrapper .content-wrapper.style-2 .content-wrapper-inner .meta-wrapper { opacity: 0; } .blogsy-post-nexo-widget .post-wrapper:focus-within .content-wrapper.style-2 .content-wrapper-inner, .blogsy-post-nexo-widget .post-wrapper:hover .content-wrapper.style-2 .content-wrapper-inner { transform: translateY(0); } .blogsy-post-nexo-widget .post-wrapper:focus-within .content-wrapper.style-2 .meta-wrapper, .blogsy-post-nexo-widget .post-wrapper:hover .content-wrapper.style-2 .meta-wrapper { opacity: 1; } .blogsy-post-nexo-widget .post-wrapper .read-more { display: inline-block; color: #EDF2F4; text-decoration: none; text-transform: capitalize; } .blogsy-post-nexo-widget .post-wrapper .read-more-wrap { opacity: 0; margin-top: -30px; transform: translateY(40px); } .blogsy-post-nexo-widget .post-wrapper .content-wrapper.style-3 .title, .blogsy-post-nexo-widget .post-wrapper .content-wrapper.style-3 .terms-wrapper, .blogsy-post-nexo-widget .post-wrapper .content-wrapper.style-3 .meta-wrapper, .blogsy-post-nexo-widget .post-wrapper .content-wrapper.style-3 .excerpt, .blogsy-post-nexo-widget .post-wrapper .content-wrapper.style-3 .read-more-wrap { transition: 0.6s cubic-bezier(.17,.73,.66,.99) 0s,opacity 0.4s; } .blogsy-post-nexo-widget .post-wrapper:focus-within .content-wrapper.style-3 .title, .blogsy-post-nexo-widget .post-wrapper:hover .content-wrapper.style-3 .title, .blogsy-post-nexo-widget .post-wrapper:focus-within .content-wrapper.style-3 .terms-wrapper, .blogsy-post-nexo-widget .post-wrapper:hover .content-wrapper.style-3 .terms-wrapper, .blogsy-post-nexo-widget .post-wrapper:focus-within .content-wrapper.style-3 .meta-wrapper, .blogsy-post-nexo-widget .post-wrapper:hover .content-wrapper.style-3 .meta-wrapper, .blogsy-post-nexo-widget .post-wrapper:focus-within .content-wrapper.style-3 .excerpt, .blogsy-post-nexo-widget .post-wrapper:hover .content-wrapper.style-3 .excerpt { transform: translateY(-40px); opacity: 0; } .blogsy-post-nexo-widget .post-wrapper:focus-within .content-wrapper.style-3 .read-more-wrap, .blogsy-post-nexo-widget .post-wrapper:hover .content-wrapper.style-3 .read-more-wrap { transform: translateY(0); opacity: 1; } .blogsy-post-nexo-widget .post-wrapper:focus-within .content-wrapper.style-4 .content-wrapper-inner, .blogsy-post-nexo-widget .post-wrapper:hover .content-wrapper.style-4 .content-wrapper-inner { transform: translateY(50%); opacity: 0; transition: 0.3s; } .blogsy-post-nexo-widget .post-wrapper:focus-within .content-wrapper.style-5 .content-wrapper-inner, .blogsy-post-nexo-widget .post-wrapper:hover .content-wrapper.style-5 .content-wrapper-inner { transform: translateY(-20px); } .blogsy-post-nexo-widget .post-wrapper .content-wrapper.style-6 .content-wrapper-inner { transform: translateY(50%); opacity: 0; transition: 0.4s ease-out; } .blogsy-post-nexo-widget .post-wrapper:focus-within .content-wrapper.style-6 .content-wrapper-inner, .blogsy-post-nexo-widget .post-wrapper:hover .content-wrapper.style-6 .content-wrapper-inner { transform: translateY(0); opacity: 1; } /* Peony Slider -------------------------------------------------------------- */ .peony-slider .blogsy-posts-wrapper { --thumbs-size: 260px; position: relative; } .peony-slider .main-slider { border-radius: var(--pt-soft-radius); box-shadow: 0 2px 20px #0e0e1321; } .peony-slider .post-wrapper .content-wrapper-outer { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 30px; } .peony-slider .post-wrapper .content-wrapper { max-width: calc(var(--container-max-width) - 20px); position: relative; margin: auto; height: 100%; display: flex; align-items: center; } .peony-slider .post-wrapper .content-wrapper-inner { max-width: 100%; width: 700px; justify-content: inherit; } .peony-slider.vertical .post-wrapper .content-wrapper-inner { max-width: calc(100% - 150px); } .peony-slider .post-wrapper { display: flex; position: relative; overflow: hidden; width: 100%; height: 640px; } .peony-slider .image-wrapper { display: flex; width: 100%; height: 100%; position: relative; } .peony-slider .image-wrapper img { width: 100%; height: 100%; object-fit: cover; } .peony-slider .main-slider .image-wrapper::before { content: ''; display: block; position: absolute; width: 100%; height: 100%; bottom: 0; left: 0; z-index: 2; background-color: rgba(25, 25, 29, 0.45); } .peony-slider .post-wrapper .title a, .peony-slider .post-wrapper .meta-wrapper, .peony-slider .post-wrapper .excerpt { color: #fff; } .peony-slider .post-wrapper .meta-wrapper { column-gap: 0.5rem; row-gap: 0.5rem; } .peony-slider .thumbs-slider-wrapper { position: absolute; left: 0; bottom: 0; width: 100%; height: 100%; padding: 30px; } .peony-slider .post-wrapper .meta-wrapper .comments a { color: inherit } .peony-slider .post-wrapper .meta-wrapper .comments a:focus, .peony-slider .post-wrapper .meta-wrapper .comments a:hover { text-decoration: underline; } .peony-slider.horizontal .thumbs-slider-wrapper { height: auto; z-index: 10; } .peony-slider.horizontal .thumbs-slider { width: var(--thumbs-size); } .peony-slider .thumbs-slider-inner { max-width: calc(var(--container-max-width) - 20px); height: 100%; display: flex; align-items: center; margin: auto; } .peony-slider.vertical .thumbs-slider { height: var(--thumbs-size); width: auto; margin: 0 auto; margin-right: 0; } .peony-slider .thumb-wrapper { --th-color: #fff6; --th-active-color: #fff; transition: all 0.3s, width 0s, height 0s, margin 0s; border-radius: 100px; position: relative; overflow: hidden; cursor: pointer; } .peony-slider .thumb-wrapper[class*="-active"] { opacity: 1 !important; } .peony-slider .thumb-wrapper::after { content: ''; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; border-radius: inherit; transition: 0.3s; } .peony-slider .thumb-wrapper .image-wrapper { border-radius: inherit; overflow: hidden; transition: 0.3s; } .peony-slider .thumb-wrapper .image-wrapper .image { width: 80px; height: 80px; position: relative; display: inline-block; } .peony-slider .thumb-style-3 { --thumbs-size: 236px; } .peony-slider .thumb-style-3 .image-wrapper .image { width: 72px; height: 72px; } .peony-slider .thumb-wrapper .image-wrapper .image::before { content: ""; position: absolute; inset: 0; border-radius: inherit; background-color: rgba(25, 25, 29, 0.45); } .peony-slider .thumb-wrapper[class*=-active] .image-wrapper .image::before { opacity: 0.5; } .peony-slider .thumb-wrapper .image-wrapper .image, .peony-slider .thumb-wrapper .image-wrapper img { border-radius: inherit; } @media (max-width: 767px) { .peony-slider.vertical .post-wrapper .content-wrapper-inner { max-width: 100%; } .peony-slider.vertical .thumbs-slider { height: auto; width: var(--thumbs-size); margin: 0 auto; } .peony-slider.vertical .thumbs-slider-wrapper { height: auto; } } .peony-slider .thumb-style-1 .thumb-wrapper::after { border: 4px solid var(--th-color); } .peony-slider .thumb-style-1 .thumb-wrapper[class*="-active"]::after { border-color: var(--th-active-color); } .peony-slider .thumb-style-2 .thumb-wrapper { border: 2px solid var(--th-color); opacity: 0.6; } .peony-slider .thumb-style-4 .image-wrapper .image::before, .peony-slider .thumb-style-2 .image-wrapper { transform: scale(0.8); } .peony-slider .thumb-style-2 .thumb-wrapper[class*="-active"] { border-color: var(--th-active-color); } .peony-slider .thumb-style-2 .thumb-wrapper[class*="-active"] .image-wrapper { transform: scale(1); } .peony-slider .thumb-style-3 .thumb-wrapper::after { border: 3px solid var(--th-color); } .peony-slider .thumb-style-4 .image-wrapper .image::before, .peony-slider .thumb-style-4 .image-wrapper img { transform: scale(0.75); } .peony-slider .thumb-style-4 .thumb-wrapper::after { border: 3px solid var(--th-color); } .peony-slider .thumb-style-3 .image-wrapper svg, .peony-slider .thumb-style-4 .image-wrapper svg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 10; } .peony-slider .thumb-style-3 .image-wrapper rect, .peony-slider .thumb-style-4 .image-wrapper rect, .peony-slider .thumb-style-3 .image-wrapper circle, .peony-slider .thumb-style-4 .image-wrapper circle { fill: transparent; stroke: var(--th-active-color); stroke-width: 6px; stroke-dasharray: 350; stroke-dashoffset: 350; transform-origin: center; } .peony-slider .thumb-style-4 .image-wrapper rect, .peony-slider .thumb-style-4 .image-wrapper circle { stroke-width: 4px; } .peony-slider .thumb-style-3 .thumb-wrapper[class*="-active"] .image-wrapper rect, .peony-slider .thumb-style-4 .thumb-wrapper[class*="-active"] .image-wrapper rect, .peony-slider .thumb-style-3 .thumb-wrapper[class*="-active"] .image-wrapper circle, .peony-slider .thumb-style-4 .thumb-wrapper[class*="-active"] .image-wrapper circle { transition: var(--bar-time) linear 1s; stroke-dashoffset: 0; } .peony-slider .nav-style-1 .carousel-nav-prev, .peony-slider .nav-style-1 .carousel-nav-next { opacity: 0; visibility: hidden; } .peony-slider .nav-style-1 .carousel-nav-next { right: 15px; transform: translate(-10px, -50%); } .peony-slider .nav-style-1 .carousel-nav-prev { left: 15px; transform: translate(10px, -50%); } @media (min-width: 1440px) { .peony-slider .nav-style-1 .carousel-nav-next { right: -25px; } .peony-slider .nav-style-1 .carousel-nav-prev { left: -25px; } } .peony-slider:hover .nav-style-1 .carousel-nav-prev, .peony-slider:hover .nav-style-1 .carousel-nav-next { opacity: 1; visibility: visible; transform: translate(0px, -50%); } /* Hero Slider */ #blogsy-stories, #blogsy-pyml, #blogsy-featured-links, #blogsy-featured-category { margin-top: 3.5rem; } #blogsy-stories, #blogsy-pyml, #blogsy-featured-links, #blogsy-featured-category, #blogsy-hero, #blogsy-ticker { position: relative; } .pt-hero-slider .terms-wrapper { position: absolute; top: 0; left: -8px; } .pt-hero-slider .thumbs-slider-wrapper { width: auto; padding: 24px; } .pt-hero-slider .thumb-wrapper { border-radius: var(--pt-soft-radius); } .pt-hero-slider .post-wrapper .content-wrapper-outer { max-width: 100%; padding: 24px 24px calc(48px + 40px) 24px; } @media (min-width: 1025px) { #site-header + #blogsy-ticker + #blogsy-hero { margin-top: 1.6rem; } #blogsy-hero { margin-top: 0.4rem; } .pt-hero-slider .thumbs-slider-wrapper { left: unset; right: 0; width: auto; } .pt-hero-slider .post-wrapper .content-wrapper-outer { max-width: calc(558px + 80px); padding: 24px 40px 40px; } } @media (max-width: 1024px) { #blogsy-hero .pt-hero-slider { overflow: hidden; } #blogsy-hero .pt-container { max-width: 100%; padding: 0; } .pt-hero-slider .main-slider { border-radius: 0; } .pt-hero-slider .thumb-style-3 { --thumbs-size: 140px; } .pt-hero-slider .thumbs-slider-wrapper .image-wrapper .image { width: 40px; height: 40px; } .peony-slider .thumb-style-3 .image-wrapper rect { stroke-width: 3px; } .pt-hero-slider .thumb-style-3 .thumb-wrapper::after { border-width: 1px; } } .pt-hero-slider .post-wrapper .content-wrapper { align-items: end; } .pt-hero-slider .post-wrapper .excerpt { opacity: 0.85; display: none; } @media (min-width: 768px) { .pt-hero-slider .post-wrapper .excerpt { display: block; } } .pt-hero-slider .carousel-pagination-wrapper.type-bullets .carousel-pagination { gap: 18px; bottom: 29px; } .pt-hero-slider .swiper-pagination-bullet { color: #FFFFFF57; width: 10px; height: 10px; } .pt-hero-slider .swiper-pagination-bullet-active { color: #fff; } /* Featured Category */ .featured-category-two .blogsy-categories-box .cat-item { padding: 10px; } .featured-category-two .blogsy-categories-box .content-wrapper { text-align: center; } .featured-category-three .blogsy-categories-box .content-wrapper { display: flex; flex-wrap: wrap; justify-content: space-between; padding: 1.142rem 1.7rem; } .featured-category-three .blogsy-categories-box .cat-item { gap: 0; padding: 0; background-color: var(--pt-accent-color); } .featured-category-three .blogsy-categories-box .image-wrapper { border-bottom-right-radius: 0; border-bottom-left-radius: 0; max-height: 22rem; } .featured-category-three .blogsy-categories-box .image-wrapper:last-child { height: 100%; max-height: 100%; border-bottom-right-radius: var(--pt-soft-radius); border-bottom-left-radius: var(--pt-soft-radius); } .featured-category-three .blogsy-categories-box .image-wrapper::after { background: linear-gradient(0deg, rgba(0, 0, 0, 0.6), transparent); } .featured-category-three .blogsy-categories-box .title a::before { display: none; } .featured-category-three .blogsy-categories-box .title a { padding-left: 0; } .featured-category-three .blogsy-categories-box .title a, .featured-category-three .blogsy-categories-box .count { color: #fff; } .featured-category-three .blogsy-categories-box .count { border: 1px solid rgb(255, 255, 255, 0.6); padding: 3px 9px; border-radius: 10rem; font-weight: 500; } /* Featured Links */ .featured-links-three .blogsy-categories-box .content-wrapper, .featured-links-two .content-wrapper, .featured-links-one .content-wrapper { text-align: center; } .featured-links-one .blogsy-categories-box .cat-item { gap: 2rem; } .featured-links-two .blogsy-categories-box .image-wrapper, .featured-links-one .blogsy-categories-box .image-wrapper { max-width: 20rem; max-height: 20rem; --pt-soft-radius: 20rem; box-shadow: 0px 0px 0px 4px var(--pt-accent-80-color); } .featured-links-two .blogsy-categories-box .image-wrapper:focus-within, .featured-links-one .blogsy-categories-box .image-wrapper:hover { box-shadow: 0px 0px 0px 6px var(--pt-accent-40-color), 0px 0px 0px 14px var(--pt-accent-80-color); } .featured-links-two .blogsy-categories-box .title a, .featured-links-one .blogsy-categories-box .title a { padding-left: 0; } .featured-links-two .blogsy-categories-box .image-wrapper::after, .featured-links-two .blogsy-categories-box .title a::before, .featured-links-one .blogsy-categories-box .image-wrapper::after, .featured-links-one .blogsy-categories-box .title a::before { display: none; } .featured-links-three .content-wrapper { position: absolute; bottom: 0; right: 0; left: 0; z-index: 2; padding: 20px; text-align: center; } .featured-links-three .content-wrapper .title a::before { display: none; } .featured-links-three .content-wrapper .title a { padding-left: 0; } .featured-links-three .content-wrapper .title { display: inline-flex; padding: 8px 18px; border-radius: 100px; background-color: var(--pt-body-bg-color); } /* Ticker */ .blogsy-ticker { padding: 10px 0; --pt-body-bg-color: transparent; border-bottom: 1px solid var(--pt-border-color); } .blogsy-ticker .blogsy-news-ticker-wrapper .blogsy-news-ticker-title-wrapper { font-size: 1.5rem; padding: 4px 12px 4px 12px; gap: 14px; background-color: var(--pt-headings-color); color: #fff; border-radius: calc(var(--pt-soft-radius) + 23px); outline: 1px solid var(--pt-border-color); } .blogsy-ticker .blogsy-news-ticker-content-wrapper.animation-marquee .blogsy-news-ticker-items { padding-left: 40px; --marquee-time: 80s; gap: 40px; } .blogsy-ticker .blogsy-news-ticker-item { gap: 13px; } .blogsy-ticker .blogsy-news-ticker-item .item-thumbnail { width: 35px; height: 35px; } .blogsy-ticker .blogsy-news-ticker-item .item-thumbnail img { border: 1px solid; border-radius: 100px; } .blogsy-ticker .blogsy-news-ticker-item .item-date { font-weight: 700; /*color: var(--pt-accent-color);*/ } /* PYML */ .blogsy-pyml { border-top: 1px solid var(--pt-border-color); padding-top: 35px; padding-bottom: 70px; } .pt-hero-slider .carousel-nav-prev, .pt-hero-slider .carousel-nav-next, .blogsy-pyml .carousel-nav-prev, .blogsy-pyml .carousel-nav-next { color: var(--pt-body-color); background-color: var(--pt-card-bg); border-radius: 100px; width: 45px; height: 45px; font-size: 1.7rem; text-decoration: none; border: 1px solid var(--pt-border-color); box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.03); transition: .25s; } .blogsy-pyml .carousel-nav-prev, .blogsy-pyml .carousel-nav-next { top: -42px; } .blogsy-pyml .carousel-nav-prev { left: -125px; } .blogsy-pyml .carousel-nav-next { right: 80px; } .blogsy-pyml .swiper-pagination-fraction { background-color: var(--pt-card-bg); top: 70px; font-size: 1.6rem; font-weight: 500; border-radius: 8px; line-height: 1.2; padding: 1.042rem 1.8rem; border: 1px solid var(--pt-border-color); box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.03); } /* Stories Popup */ .blogsy-stories-box.swiper:not(.swiper-initialized) .swiper-wrapper { display: grid; } @media (max-width: 767px) { .blogsy-stories-box.swiper:not(.swiper-initialized) .swiper-wrapper { display: flex; overflow-x: auto; } .blogsy-stories-box.swiper:not(.swiper-initialized) .swiper-wrapper::-webkit-scrollbar { display: none; } .blogsy-stories-box.swiper:not(.swiper-initialized) .swiper-wrapper .stories-popup__slide { flex: 0 0 auto; width: 32rem; } } .blogsy-stories.blogsy-post-nexo-widget .post-wrapper::before { background: linear-gradient(transparent -25%, rgba(0, 0, 0, 0.85) 100%); } .blogsy-stories .post-wrapper .content-container > *:not(:first-child, .stories-popup__indicators), .blogsy-stories .post-wrapper .content-wrapper-inner > *:not(:first-child, .stories-popup__indicators) { margin-top: 1.5rem; } .blogsy-stories .post-wrapper .content-container > *:not(:last-child), .blogsy-stories .post-wrapper .content-wrapper-inner > *:not(:last-child) { margin-bottom: 0; } @media screen and (max-width: 767px){ .blogsy-stories .post-wrapper .content-container > *:not(:first-child, .stories-popup__indicators), .blogsy-stories .post-wrapper .content-wrapper-inner > *:not(:first-child, .stories-popup__indicators) { margin-top: 1.4rem; } .blogsy-stories .post-wrapper .content-container > *:not(:last-child), .blogsy-stories .post-wrapper .content-wrapper-inner > *:not(:last-child) { margin-bottom: 0; } } /* Stories indicators */ .blogsy-stories .post-wrapper .stories-popup__indicators { position: absolute; top: 0; z-index: 9999; display: flex; padding: 20px; width: 100%; gap: 10px; cursor: pointer; } .blogsy-stories .post-wrapper .stories-popup__indicators .stories-popup__indicator { display: block; width: 100%; height: 4px; border-radius: 50px; background-color: rgba(255, 255, 255, 0.35); } .stories--open { overflow: hidden; } .blogsy-stories .stories-popup.open .stories-popup__backdrop { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background-repeat: no-repeat; background-size: cover; filter: blur(10px); z-index: -1; display: none; } .blogsy-stories.ambient .stories-popup.open .stories-popup__backdrop { display: block; } .blogsy-stories .stories-popup.open { position: fixed; z-index: 10000; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0); align-items: center; height: 100%; padding: 20px; } .admin-bar .blogsy-stories .stories-popup.open { top: 32px; height: calc(100vh - 32px); } .blogsy-stories .stories-popup__inner { display: flex; justify-content: center; height: 100%; } .blogsy-stories .stories-popup__story { position: relative; } .blogsy-stories .stories-popup:not(.open), .blogsy-stories .stories-popup__inner .stories-popup__story-wrap .swiper:not(.swiper-initialized) { display: none; } .blogsy-stories .stories-popup__inner .swiper-wrapper { width: 54rem; height: 100%; border-radius: 8px; } /* Stories no thumb */ .blogsy-stories .stories-popup__inner .no-thumb .swiper { border-radius: 8px; box-shadow: 0 0 36px 6px rgba(255, 255, 255, 0.2); } .blogsy-stories .stories-popup .no-thumb .content-wrapper { top: 50%; left: 50%; bottom: initial; transform: translate(-50%, -50%); text-align: center; } .blogsy-stories .stories-popup .no-thumb .content-wrapper .meta-wrapper, .blogsy-stories .stories-popup .no-thumb .content-wrapper .terms-wrapper { justify-content: center; } .blogsy-stories .no-thumb .stories-popup__story-wrap .stories-popup__pagination .swiper-pagination-bullet { background: rgba(162, 162, 162, 0.2); } @media (max-width: 610px) { .blogsy-stories .stories-popup__inner .swiper-wrapper { width: 42rem; } } .blogsy-stories .stories-popup__inner .stories-popup__story-wrap, .blogsy-stories .stories-popup__inner .stories-popup__story-wrap > .swiper, .blogsy-stories .post-wrapper, .blogsy-stories .post-wrapper .image-wrapper { height: 100%; } .blogsy-stories .post-wrapper .image-wrapper img { animation: none; } .blogsy-stories .swiper-slide-active .post-wrapper .image-wrapper img { animation: zoomIn 5s ease-in-out; animation-fill-mode: forwards; will-change: transform; } @keyframes zoomIn { from { transform: scale(1); } to { transform: scale(1.2); } } .blogsy-stories .stories-popup .content-wrapper a { text-decoration: none; color: #fff; } .blogsy-stories .stories-popup .content-wrapper .terms-wrapper { margin-bottom: 12px; animation: none; } .blogsy-stories .stories-popup .content-wrapper .title { font-size: 22px; font-weight: 500; margin: 0; animation: none; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .blogsy-stories .stories-popup .swiper-slide-active .content-wrapper .title { animation: moveIn .3s linear forwards; animation-fill-mode: forwards; will-change: transform; } @keyframes moveIn { 0% { transform: translateX(50px); opacity: 0; } 100% { transform: translateX(0); opacity: 1; } } .blogsy-stories .stories-popup .content-wrapper .meta-wrapper { animation: none; } .blogsy-stories .stories-popup .swiper-slide-active .content-wrapper .meta-wrapper, .blogsy-stories .stories-popup .swiper-slide-active .content-wrapper .terms-wrapper { animation: slide-in .3s linear forwards; animation-fill-mode: forwards; will-change: transform; } @keyframes slide-in { 0% { transform: translateX(-50px); opacity: 0; } 100% { transform: translateX(0); opacity: 1; } } /* Stories Pagination */ .blogsy-stories .stories-popup__story-wrap .stories-popup__pagination { display: flex; position: absolute; top: 0; padding: 3%; width: 100%; gap: 10px; margin: 0; } .blogsy-stories .stories-popup__story-wrap .stories-popup__pagination .swiper-pagination-bullet { display: block; width: 100%; height: 4px; background: rgba(0, 0, 0, 0.2); border-radius: 50px; overflow: hidden; position: relative; opacity: 1; } .blogsy-stories .stories-popup__story-wrap .stories-popup__pagination .swiper-pagination-bullet:only-child { display: block !important; } .blogsy-stories .stories-popup__story-wrap .stories-popup__pagination .swiper-pagination-bullet.swiper-pagination-bullet-active:before { content: ''; position: absolute; width: 20%; top: 0; bottom: 0; left: 0; background: #fff; border-radius: inherit; animation: expandWidth var(--expandWidth-timer) ease forwards; } @keyframes expandWidth { from { width: 0; } to { width: 100%; } } /* Stories Action Buttons */ .blogsy-stories .stories-popup__actions { position: absolute; top: 30px; right: 12px; z-index: 1; display: none; } .blogsy-stories .stories-popup.open .stories-popup__actions { display: block; } .blogsy-stories .stories-popup__actions .stories-popup__button { cursor: pointer; color: #fff; font-size: 20px; line-height: 20px; background: rgba(0, 0, 0, 0.3); width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; border-radius: 50%; transition: all 0.3s ease-in-out; border: none; } .blogsy-stories .stories-popup__actions .stories-popup__button.close { margin-bottom: 10px; } .blogsy-stories .stories-popup__actions .stories-popup__button.pause.paused .blogsy-svg-icon--pause, .blogsy-stories .stories-popup__actions .stories-popup__button.pause .blogsy-svg-icon--play { display: none; } .blogsy-stories .stories-popup__actions .stories-popup__button.pause.paused .blogsy-svg-icon--play { display: inline-block; } /* Stories Arrow */ .blogsy-stories .stories-popup .stories-popup__arrow { width: 45px; height: 45px; line-height: 45px; text-align: center; border-radius: 50%; --swiper-navigation-size: 18px; font-size: var(--swiper-navigation-size); background-color: #fff; color: #000; position: absolute; top: 50%; z-index: 10; border: none; cursor: pointer; display: none; padding: 0; } .blogsy-stories .stories-popup.open .stories-popup__arrow { display: block; color: #5b5b5b; } .blogsy-stories .stories-popup.open .stories-popup__story-wrap .stories-popup__arrow.swiper-button-disabled, .blogsy-stories .stories-popup.open .stories-popup__arrow.disabled { opacity: .2; pointer-events: none; } .blogsy-stories .stories-popup .stories-popup__arrows .swiper-button-prev { left: -75px; } .blogsy-stories .stories-popup .stories-popup__arrows .swiper-button-next { right: -75px; } /* Stories Arrow Second */ .blogsy-stories .stories-popup__story .stories-popup__story-wrap .stories-popup__arrow { border-radius: 0; transform: translateY(-50%); height: 250px; line-height: 250px; --swiper-navigation-size: 18px; background: #ffffff14; color: #fff; opacity: 0; visibility: hidden; transition: all 0.3s ease-in-out; } .blogsy-stories .stories-popup__story:hover .stories-popup__story-wrap .stories-popup__arrow { opacity: 1; visibility: visible; } .blogsy-stories .stories-popup .stories-popup__story .stories-popup__arrow { display: none; } .blogsy-stories .stories-popup.open .stories-popup__story .stories-popup__arrow { display: block; } .blogsy-stories .stories-popup__story .swiper-button-prev { left: 0; } .blogsy-stories .stories-popup__story .swiper-button-next { right: 0; } /* Disable Card Style */ .blogsy-disable-page-card-style #site-header + #main .single-page-outside { margin-top: 25px; } .blogsy-disable-page-card-style .single-content.card-layout-w { padding: 0; background: transparent; box-shadow: none; border: none; border-radius: 0; } .blogsy-disable-page-card-style .single-content-inner { padding: 0; } .blogsy-disable-page-card-style .single-page-title { margin-top: 0; } /* Device Hide//Show */ .blogsy-hide-all { display: none !important; } /* Mobile First (max-width: 600px) */ @media (max-width: 600px) { .blogsy-hide-mobile { display: none !important; } } /* Tablet only (601px to 1024px) */ @media screen and (min-width: 601px) and (max-width: 1024px) { .blogsy-hide-tablet { display: none !important; } } /* Mobile + Tablet (up to 1024px) */ @media (max-width: 1024px) { .blogsy-hide-mobile-tablet { display: none !important; } } /* Desktop (up to 1025px) */ @media (min-width: 1025px) { .blogsy-hide-desktop { display: none !important; } } /* Grid Columns */ [class*='pt-grid-col-'] { display: grid; --pd-grid-column: repeat(4, 1fr); --pd-grid-gap: 15px; column-gap: var(--pd-grid-gap); row-gap: var(--pd-grid-gap); grid-template-columns: var(--pd-grid-column); } .pt-grid-col-1 { --pd-grid-column: repeat(1, 1fr); } .pt-grid-col-2 { --pd-grid-column: repeat(2, 1fr); } .pt-grid-col-3 { --pd-grid-column: repeat(3, 1fr); } .pt-grid-col-4 { --pd-grid-column: repeat(4, 1fr); } .pt-grid-col-5 { --pd-grid-column: repeat(5, 1fr); } .pt-grid-col-6 { --pd-grid-column: repeat(6, 1fr); } @media (max-width: 767px) { [class*='pt-grid-col-']:not(.pt-grid-col-1, .pt-grid-col-2) { --pd-grid-column: repeat(2, 1fr); } [class*='pt-grid-col-'].pt-grid-col-2 { --pd-grid-column: repeat(1, 1fr); } [class*='pt-grid-col-'] { --pd-grid-gap: 10px; } } @media (max-width: 414px) { [class*='pt-grid-col-']:not(.pt-grid-col-1, .pt-grid-col-2) { --pd-grid-column: repeat(1, 1fr); } }