html { line-height: 1.15; -webkit-text-size-adjust: 100%; } body { margin: 0; overflow-x: hidden } body.dark { background: #191b1d; color: #fff } main { display: block; } h1 { font-size: 2em; margin: 0.67em 0; } hr { -webkit-box-sizing: content-box; box-sizing: content-box; height: 0; overflow: visible; } pre { font-family: monospace, monospace; font-size: 1em; } a { background-color: transparent; } abbr[title] { border-bottom: none; text-decoration: underline; -webkit-text-decoration: underline dotted; text-decoration: underline dotted; } b, strong { font-weight: bolder; } code, kbd, samp { font-family: monospace, monospace; font-size: 1em; } small { font-size: 80%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } img { border-style: none; } form > div { width: 100%; display: block; margin-bottom: 20px; position: relative; float: left; -webkit-box-sizing: border-box; box-sizing: border-box; } button, input, optgroup, select, textarea { font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0; } button, input { overflow: visible; } button, select { text-transform: none; } button, [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; } .post.alioth-post a.wp-block-button__link { background-color: #191b1d; font-size: 1em; padding: 15px 45px; margin-bottom: 15px; color: #fff; } .post.alioth-post .is-style-outline > a.wp-block-button__link:not(.has-background) { background-color: transparent; border: 2px solid #191b1d; color: #191b1d; } button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0; } button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; } fieldset { padding: 0.35em 0.75em 0.625em; } legend { -webkit-box-sizing: border-box; box-sizing: border-box; color: inherit; display: table; max-width: 100%; padding: 0; white-space: normal; } progress { vertical-align: baseline; } textarea { overflow: auto; } [type="checkbox"], [type="radio"] { -webkit-box-sizing: border-box; box-sizing: border-box; padding: 0; } [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; } [type="search"] { -webkit-appearance: textfield; outline-offset: -2px; } [type="search"]::-webkit-search-decoration { -webkit-appearance: none; } ::-webkit-file-upload-button { -webkit-appearance: button; font: inherit; } details { display: block; } summary { display: list-item; } template { display: none; } [hidden] { display: none; } *, *::before, *::after { -webkit-box-sizing: inherit; box-sizing: inherit; } html { -webkit-box-sizing: border-box; box-sizing: border-box; } body, button, input, select, optgroup, textarea { color: #191b1d; font-family: 'Inter', sans-serif; font-size: 14px; line-height: 1.5; } h1, h2, h3, h4 { color: #191b1d; margin-bottom: 1em; } body.dark h1, body.dark h2, body.dark h3, body.dark h4, body.dark h5, body.dark h6, body.dark p { color: #fff } h1.big-title { font-size: 90px; font-style: normal; font-weight: 700; line-height: 100px; margin-left: -7px; margin-top: 20px; margin-bottom: 69px; padding-right: 10px; } h1 { font-size: 48px; line-height: 65px; font-weight: 700; letter-spacing: -0.06em; } h2 { font-size: 36px; line-height: 50px; font-weight: 700; letter-spacing: -0.06em; } h3 { font-size: 30px; line-height: 40px; margin-left: -1px; font-weight: 700; letter-spacing: -0.05em; } h4 { font-size: 24px; line-height: 35px; margin-left: -1px; font-weight: 700; letter-spacing: -0.05em; } h5 { font-size: 18px; line-height: 35px; margin-left: -1px; font-weight: normal; margin-bottom: 1em; } h6 { font-size: 12px; line-height: 18px; margin: 0; } p { line-height: 28px; margin-bottom: 15px } dfn, cite, em, i { font-style: italic; } blockquote { margin: 0 1.5em; display: inline-block; position: relative; margin: 0; padding-left: 20px; } blockquote::before { content: ""; display: block; width: 2px; height: 100%; background: #191b1d; position: absolute; left: 0; } address { margin: 0 0 1.5em; } pre { background: #eee; font-family: "Courier 10 Pitch", courier, monospace; line-height: 1.6; margin-bottom: 1.6em; max-width: 100%; overflow: auto; padding: 1.6em; } code, kbd, tt, var { font-family: monaco, consolas, "Andale Mono", "DejaVu Sans Mono", monospace; } abbr, acronym { border-bottom: 1px dotted #666; cursor: help; } mark, ins { background: #fff9c0; text-decoration: none; } big { font-size: 125%; } body { background: #fff; } hr { background-color: #ccc; border: 0; height: 1px; margin-bottom: 1.5em; } ul, ol { margin: 0; padding: 0; list-style-position: inside } ol { list-style: decimal; list-style-position: inside } li > ul, li > ol { margin-bottom: 0; margin-left: 1.5em; list-style: none } ul a { text-decoration: none; } dt { font-weight: 700; } dd { margin: 0 1.5em 1.5em; } embed, iframe, object { max-width: 100%; } img { height: auto; max-width: 100%; } figure { margin: 1em 0; } table { margin: 0 0 1.5em; width: 100%; border-spacing: 0 } table th, table td { padding: 10px; text-align: center; border: 1px solid rgba(25, 27, 29, .1); vertical-align: top; } table th a, table td a { color: #191b1d; font-weight: 600; text-decoration: none; } table caption { margin-bottom: 15px; } span.wp-calendar-nav-prev a { text-decoration: none; color: #191b1d; font-weight: 500; } a { color: #4169e1; } a:visited { color: #800080; } a:hover, a:focus, a:active { color: #191970; } a:focus { outline: thin dotted; } a:hover, a:active { outline: 0; } a.hov-underline { display: inline-block; position: relative; font-size: 15px; font-weight: 600; letter-spacing: -0.04em; line-height: 16px; } a.hov-underline::after { content: ""; position: absolute; display: inline-block; bottom: 0; right: 0; width: 100%; background: #191b1d; height: 1.5px; -webkit-transition: width .3s ease; -o-transition: width .3s ease; transition: width .3s ease; } a.hov-underline:hover::after { width: 0% } button, input[type="button"], input[type="reset"], input[type="submit"] { border: none; background: #ebebeb; color: rgba(0, 0, 0, 0.8); line-height: 1; padding: 20px 50px; } button:hover, input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover { border-color: #ccc #bbb #aaa; } button:active, button:focus, input[type="button"]:active, input[type="button"]:focus, input[type="reset"]:active, input[type="reset"]:focus, input[type="submit"]:active, input[type="submit"]:focus { border-color: #aaa #bbb #bbb; } input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="number"], input[type="tel"], input[type="range"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="datetime"], input[type="datetime-local"], input[type="color"], textarea { display: block; width: 100%; padding: 30px; border: none; background: #ebebeb; -webkit-box-sizing: border-box; box-sizing: border-box; } body.dark form button, body.dark form input, body.dark form textarea { background: #131313; color: #fff !important; } body.dark form > div::before { background: #fff; } .entry-content label input { margin-bottom: 10px; } input[type="search"] { padding: 15px } form > div > label { position: absolute; top: 50%; left: 30px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); color: #8f8d8d; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; z-index: 1; pointer-events: none; } form > div.half-field { width: 49%; } .field-wrap.half-field.mail-field { float: right; } .message-wrap label { top: 30px; -webkit-transform: none; -ms-transform: none; transform: none; } form > div::before { content: ""; position: absolute; bottom: 0; height: 1px; background: #191b1d; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; width: 0; z-index: 1 } body.dark form > div::before { background: #fff } form > div.focus::before { width: 100%; } form > div.focus label { top: 0; font-size: 12px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%) } input[type="text"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="number"]:focus, input[type="tel"]:focus, input[type="range"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="week"]:focus, input[type="time"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="color"]:focus, textarea:focus { color: #111; border: none !important; outline: none !important } select { width: 100%; padding: 15px 20px; border: none; background: #ebebeb; } textarea { width: 100%; } .site-main .comment-navigation, .site-main .posts-navigation, .site-main .post-navigation { margin: 0 0 1.5em; } .comment-navigation .nav-links, .posts-navigation .nav-links, .post-navigation .nav-links { display: -webkit-box; display: -ms-flexbox; display: flex; } .comment-navigation .nav-previous, .posts-navigation .nav-previous, .post-navigation .nav-previous { -webkit-box-flex: 1; -ms-flex: 1 0 50%; flex: 1 0 50%; } .comment-navigation .nav-next, .posts-navigation .nav-next, { text-align: end; -webkit-box-flex: 1; -ms-flex: 1 0 50%; flex: 1 0 50%; } .nav-previous { display: none; } .post-navigation .nav-next { display: block; float: left; -webkit-box-flex: 0; -ms-flex: none; flex: none; width: 50%; } .post-navigation .nav-next a { text-decoration: none } h5.nav-subtitle { color: rgba(25, 27, 29, .6); margin: 0; margin-bottom: 10px; } h2.nav-title { margin: 0; } nav.navigation.post-navigation::after, nav.navigation.post-navigation::before { content: ""; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 1px; background: rgba(25, 27, 29, .2); } nav.navigation.post-navigation::after { top: unset; bottom: 0; } nav.navigation.post-navigation { position: relative; padding-top: 35px; float: left; clear: both; width: 100%; padding-bottom: 35px; } .sticky { display: block; } .post, .page {} .updated:not(.published) { display: none; } .alioth-post.right-sidebar .c-col-9.entry-col { padding-right: 30px } .alioth-post.left-sidebar .c-col-9.entry-col { padding-left: 30px } .post .entry-content { float: left; clear: both; margin-bottom: 35px } .post.alioth-post .entry-content a { font-weight: 500; } .page-links { clear: both; margin: 0 0 1.5em; } .post-tags { display: block; float: left; width: 100%; margin-bottom: 35px; text-transform: uppercase; color: #10101087; font-size: 12px; } .post-tags a { font-weight: 500; text-decoration: underline !important; } .not-found { position: relative; display: block; width: 100%; height: 100vh; } .not-found-header { text-align: center; } .not-found-wrap { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .not-found-header h1:first-child { font-size: 170px; line-height: 170px; margin-bottom: 0; margin-top: 0 } .not-found-text { font-size: 18px; line-height: 30px; color: rgba(25, 27, 29, .6); margin-bottom: 30px; text-align: center } body.dark .not-found-text { color: hsla(0, 0%, 100%, .2) } .page-header { display: block; width: 100%; position: relative; padding-top: 115px; background: #EBEBEB; margin-bottom: 150px; z-index: 2; } .page-header-wrap.wrapper-small { margin-bottom: 0; position: relative; -webkit-transform: translateY(50%); -ms-transform: translateY(50%); transform: translateY(50%); } .page-title { display: block; float: left; padding: 0 15px; } .page-subtitle { display: block; float: left; clear: both; } .page-title h1.big-title { margin-bottom: 20px; margin-top: 0; line-height: 130px; font-size: 110px } .page-title .pt-char { -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%) } .page-title .pt-word { overflow: hidden; padding-right: 5px } div#comments { float: left; width: 100%; } p.logged-in-as a { color: #191b1d; font-weight: 500; } .comment-content a { word-wrap: break-word; } .bypostauthor { display: block; } p.comment-form-cookies-consent { display: block; float: left; width: 100%; } .post.alioth-post a.comment-reply-link { font-weight: 600; color: rgba(25, 27, 29, .6); text-decoration: underline; font-size: 12px; } .comment .comment-respond { display: block; float: left; width: 100%; border-top: 1px solid rgba(25, 27, 29, .2); margin-top: 10px; } h3#reply-title { font-size: 20px; } h3#reply-title small { font-weight: 500; margin-left: 10px; font-size: 13px; letter-spacing: -0.03em; text-decoration: underline; } .comment input#submit:hover { background: #f7f6f6; } form.comment-form textarea, form.comment-form input[type="text"], form.comment-form input[type="email"], form.comment-form input[type="submit"] { background: #f0f0f0; } body.dark form.comment-form textarea, body.dark form.comment-form input[type="text"], body.dark form.comment-form input[type="email"], body.dark form.comment-form input[type="submit"] { background: #131313; color: #fff !important; } .widget { margin: 0 0 1.5em; margin-bottom: 40px } .widget select { max-width: 100%; -webkit-appearance: none; -moz-appearance: none; appearance: none } .widget-title { display: block; font-size: 20px; letter-spacing: -0.05em; font-weight: 700; margin-bottom: 25px; } .widget ul { list-style: none; } .widget ul li { line-height: 28px; letter-spacing: -0.01em; margin-bottom: 5px; font-weight: 400; color: #191b1d } .widget ul li a { text-decoration: none; color: #191b1d; display: inline-block; position: relative; -webkit-transition: color .4s ease; -o-transition: color .4s ease; transition: color .4s ease; } .widget ul li a::after { content: ""; position: absolute; bottom: 0; left: 0; background: #191b1d; width: 0%; height: 1px; z-index: 2; -webkit-transition: width .4s ease; -o-transition: width .4s ease; transition: width .4s ease; } .widget ul li a:hover { color: #191b1d } .widget ul li a:hover::after { width: 100%; } ul#recentcomments { list-style: disc; list-style-position: inside; } .widget_rss ul li { margin-bottom: 30px; } .widget_rss ul { list-style: square; list-style-position: inside; } a.rsswidget { font-weight: 600; } .rssSummary { color: rgba(25, 27, 29, .6); } .rss-date { font-style: italic; font-size: 12px; margin-left: 10px; } .tagcloud a { color: #191b1d; font-weight: 700; letter-spacing: -0.05em; margin: 10px; display: block; float: left; } footer.wp-block-latest-comments__comment-meta a { color: #191b1d; font-weight: 600; } .footer-widget .widget div.caption { font-size: 20px; font-weight: 700; letter-spacing: -0.04em; display: block; margin-bottom: 35px; } .footer-widget input[type="search"], .footer-widget select { background: #e0e0e0; } .page-content .wp-smiley, .entry-content .wp-smiley, .comment-content .wp-smiley { border: none; margin-bottom: 0; margin-top: 0; padding: 0; } .custom-logo-link { display: inline-block; } .wp-caption { margin-bottom: 1.5em; max-width: 100%; } .wp-caption img[class*="wp-image-"] { display: block; margin-left: auto; margin-right: auto; } .wp-caption .wp-caption-text { margin: 0.8075em 0; } .wp-caption-text { text-align: center; } .gallery { margin-bottom: 1.5em; display: -ms-grid; display: grid; grid-gap: 1.5em; } .gallery-item { display: inline-block; text-align: center; width: 100%; } .gallery-columns-2 { -ms-grid-columns: (1fr)[2]; grid-template-columns: repeat(2, 1fr); } .gallery-columns-3 { -ms-grid-columns: (1fr)[3]; grid-template-columns: repeat(3, 1fr); } .gallery-columns-4 { -ms-grid-columns: (1fr)[4]; grid-template-columns: repeat(4, 1fr); } .gallery-columns-5 { -ms-grid-columns: (1fr)[5]; grid-template-columns: repeat(5, 1fr); } .gallery-columns-6 { -ms-grid-columns: (1fr)[6]; grid-template-columns: repeat(6, 1fr); } .gallery-columns-7 { -ms-grid-columns: (1fr)[7]; grid-template-columns: repeat(7, 1fr); } .gallery-columns-8 { -ms-grid-columns: (1fr)[8]; grid-template-columns: repeat(8, 1fr); } .gallery-columns-9 { -ms-grid-columns: (1fr)[9]; grid-template-columns: repeat(9, 1fr); } .gallery-caption { display: block; } .infinite-scroll .posts-navigation, .infinite-scroll.neverending .site-footer { display: none; } .infinity-end.neverending .site-footer { display: block; } .screen-reader-text { border: 0; clip: rect(1px, 1px, 1px, 1px); -webkit-clip-path: inset(50%); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important; } .screen-reader-text:focus { background-color: #f1f1f1; border-radius: 3px; -webkit-box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); clip: auto !important; -webkit-clip-path: none; clip-path: none; color: #21759b; display: block; font-size: 0.875rem; font-weight: 700; height: auto; left: 5px; line-height: normal; padding: 15px 23px 14px; text-decoration: none; top: 5px; width: auto; z-index: 100000; } #primary[tabindex="-1"]:focus { outline: 0; } .alignleft { float: left; margin-right: 1.5em; margin-bottom: 1.5em; } .alignright { float: right; margin-left: 1.5em; margin-bottom: 1.5em; } .aligncenter { clear: both; display: block; margin-left: auto; margin-right: auto; margin-bottom: 1.5em; } #mouseCursor { width: 50px; height: 50px; display: block; position: fixed; z-index: 9999999; pointer-events: none; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) } #cursor { width: 100%; height: 100%; display: block; position: absolute; border-radius: 50%; -webkit-box-sizing: border-box; box-sizing: border-box; border-width: 2px; border-style: solid } #dot { display: block; position: absolute; width: 5px; height: 5px; border-radius: 50%; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } div#mouseCursor i { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%) scale(0); -ms-transform: translate(-50%, -50%) scale(0); transform: translate(-50%, -50%) scale(0); font-size: 35px; } body.loading { pointer-events: none; } .alioth-page-loader { position: fixed; width: 100vw; height: 100vh; top: 0; left: 0; z-index: 99999; } .loader-animate-header .alioth-page-loader { z-index: 888 } .alioth-page-loader .apl-wrapper { position: fixed; bottom: 10%; left: 8.5%; width: 100%; height: 200px; z-index: 9999999; } span.apl-background { position: fixed; top: 0; left: 0; background: #191b1d; width: 100%; height: 100%; z-index: -15; } .alioth-page-loader.light span.apl-background { background: #ebebeb } .apl-count { position: fixed; bottom: 0; left: -4%; } .apl-loading > span { display: inline-block; overflow: hidden; } .apl-load-word { -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%) } .apl-text { font-size: 65px; line-height: 75px; font-weight: 700; letter-spacing: -0.06em; white-space: nowrap; color: #191b1d; z-index: 3; visibility: hidden; display: block; position: fixed; top: 50%; left: 0; -webkit-transform: translateY(-50%) translateX(500px); -ms-transform: translateY(-50%) translateX(500px); transform: translateY(-50%) translateX(500px) } .apl-count { position: absolute; font-size: 250px; color: #fff; font-weight: 700; text-align: center } .alioth-page-loader.light .apl-count { color: rgba(25, 27, 29, .05) } .apl-count .apl-num { display: block; overflow: hidden; float: left; height: 250px; line-height: 250px } .apl-num-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .apl-num-1 .apl-num-wrapper { -webkit-transform: translateY(10%); -ms-transform: translateY(10%); transform: translateY(10%); text-align: right } .apl-num-2 .apl-num-wrapper { -webkit-transform: translateY(5%); -ms-transform: translateY(5%); transform: translateY(5%); text-align: left } .apl-num-3 .apl-num-wrapper { -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%); } .apl-num-3 span { display: block } .apl-num.apl-num-3 { margin-left: -25px; } .alioth-page-loader.dark .apl-text { color: #fff } .alioth-page-loader.dark .apl-count { color: hsla(0, 0%, 100%, .05) } .alioth-page-transitions { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 99999; visibility: hidden } .apt-image { position: fixed; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 999; width: 200px; height: auto; opacity: 0 } .apt-image img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .apt-bg { position: fixed; bottom: 0; left: 0; width: 100%; height: 00%; background: #131313; z-index: 99; } .alioth-page-transitions.light .apt-bg { background: #ebebeb; } .trans-text { position: fixed; bottom: 10%; left: 8.5%; color: hsla(0, 0%, 100%, .2); z-index: 999; font-size: 60px; white-space: nowrap; font-weight: 700; letter-spacing: -0.07em; overflow: hidden; line-height: 115px; padding-right: 10px; } .alioth-page-transitions.light .trans-text { color: rgba(25, 27, 29, .6) } .trans-image { position: fixed; top: 0; left: 0; pointer-events: none; } .trans-image-wrap, .trans-image-wrap img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center; } .site-header { display: block; position: absolute; width: 100%; height: 150px; z-index: 9999; margin-bottom: 100px; background-color: transparent; -webkit-transition: background-color .6s ease .5s; -o-transition: background-color .6s ease .5s; transition: background-color .6s ease .5s; } .site-header.light.sticked { background-color: rgba(19, 19, 19, 1); } .site-header.dark.sticked { background-color: #fff } .site-header.fullscreen_menu::before { content: ""; display: block; position: fixed; top: 0; left: 0; background: #f1f1f1; width: 100%; height: 0%; -webkit-transition: all .75s cubic-bezier(.25, .74, .22, .99); -o-transition: all .75s cubic-bezier(.25, .74, .22, .99); transition: all .75s cubic-bezier(.25, .74, .22, .99); } .site-header.anim_start .site-header.fullscreen_menu::before { height: 100%; } .site-header.fullscreen_menu.menu-has-open::before { height: 75%; } .site-header.fullscreen_menu::after { display: block; position: fixed; bottom: 0; width: 100%; height: 100%; content: ""; background-color: #00000063; z-index: -2; left: 0; opacity: 0; visibility: hidden; -webkit-transition: opacity .4s ease, visibility .4s ease; -o-transition: opacity .4s ease, visibility .4s ease; transition: opacity .4s ease, visibility .4s ease; pointer-events: none } .site-header.fullscreen_menu.menu-has-open::after { opacity: 1; visibility: visible; } .header-wrapper { position: absolute; left: 50%; top: 60%; width: 100%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } @media only screen and (max-width: 992px) { .header-wrapper { max-width: 90% !important; } } @media only screen and (min-width: 992px) { .header-wrapper { max-width: 950px !important; } } @media only screen and (min-width: 1200px) { .header-wrapper { max-width: 1174px !important; } } @media only screen and (min-width: 1450px) { .header-wrapper { max-width: 1274px !important; } } @media only screen and (min-width: 1600px) { .header-wrapper { max-width: 1500px !important; } } .header-wrapper.menu-opened { -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); height: 84vh; } .site-header.header_sticked { position: fixed; top: 0; -webkit-transform: translateY(-100%); -ms-transform: translateY(-100%); transform: translateY(-100%); height: 100px; background: #ededed } .site-header.header_sticked .header-wrapper { top: 45% } .site-branding, .menu-toggle, .header-widgets { display: block; z-index: 999; position: absolute; } .site-branding { left: 5px; overflow: hidden } .site-desc { display: block; position: static; left: 0; transform: translateY(-10px); float: left; } .menu-toggle { left: 25%; } @media only screen and (max-width: 900px) { .menu-toggle { left: unset; right: 0 } } .header-widgets { right: 5px; } .header-widget { display: block; float: left; margin: 0 30px; } .header-widget:last-child { margin-right: 0; } .loader-animate-header .header-widget { -webkit-transform: translateX(-20px); -ms-transform: translateX(-20px); transform: translateX(-20px); opacity: 0; } .site-logo { width: 90px; display: block; overflow: hidden; } .site-logo img { width: 100%; height: auto } .loader-animate-header .site-logo { -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%) } .site-header.light a.cart-contents, .site-header.light h2.site-title a, .site-header.light p.site-description { color: #fff } h2.site-title { margin: 0; } h2.site-title a { color: #191b1d; text-decoration: none } p.site-description { margin: 0 } .site-header.classic_menu .menu-toggle, .site-header.classic_menu .sub-back { display: none } .site-navigation.classic { display: block; float: left; position: static; z-index: 999; margin-left: 150px } .menu a { text-decoration: none; color: #191b1d; display: block; } .site-header.light .menu a { color: #fff } .site-navigation.classic .menu.main-menu { list-style: none; padding: 0 } .site-navigation.classic .menu.main-menu li { display: inline-block; font-size: 16px; line-height: 28px; position: relative; font-weight: 700; padding-bottom: 0; letter-spacing: -0.045em; } .site-navigation.classic .menu.main-menu li .menu-tit-char::before { content: attr(data-hover); display: block; position: absolute; left: 0; transform: translateY(10px); opacity: 0; color: yellow; transition: all .4s ease; } .site-navigation.classic .menu.main-menu li .menu-tit-char.on-hover::before { opacity: 1 } .site-navigation.classic .menu.main-menu > li > a { display: block; padding-left: 20px; padding-right: 20px; color: rgba(25, 27, 29, .6); } .site-header.light .site-navigation.classic .menu.main-menu > li > a { color: hsla(0, 0%, 100%, .4) } .site-navigation.classic .menu.main-menu > li.menu-item-active > a { color: #191b1d } .site-navigation.classic .menu.main-menu > li:first-child a { padding-left: 0 } .site-navigation.classic .sub-menu { position: absolute; display: block; z-index: -1; opacity: 0; visibility: hidden; padding: 40px 0px 40px 50px; background: #e0e0e0; left: -25px; white-space: nowrap; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; margin-left: 0 } .site-header.light .site-navigation.classic .sub-menu { background: #101010 } .site-navigation.classic .menu.main-menu > li.menu-item.menu-item-has-children:hover > .sub-menu { visibility: visible; opacity: 1; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); } .site-navigation.classic .sub-menu::before { content: ""; position: absolute; top: -20px; background: transparent; width: 100%; height: 20px; left: 0; } .site-navigation.classic .sub-menu li.menu-item { display: block; -webkit-transform: translateY(10px); -ms-transform: translateY(10px); transform: translateY(10px); opacity: 0; visibility: hidden; -webkit-transition: all .6s ease; -o-transition: all .6s ease; transition: all .6s ease; font-weight: normal; font-size: 16px; letter-spacing: -0, 045em; line-height: 26px; padding-bottom: 10px; font-weight: 700; padding-right: 150px; } .site-navigation.classic .sub-menu li.menu-item a { -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease } .site-navigation.classic .sub-menu li.menu-item:hover a { -webkit-transform: translateX(5px); -ms-transform: translateX(5px); transform: translateX(5px) } .site-navigation.classic .sub-menu li.menu-item.menu-item-has-children::after { content: "\ea5d"; position: absolute; top: 0; right: 25px; font-weight: normal; font-family: IcoFont; } .site-navigation.classic .sub-menu .sub-menu { position: absolute; top: 0; left: -25px; -webkit-transform: translateX(87%) translateY(-30px); -ms-transform: translateX(87%) translateY(-30px); transform: translateX(87%) translateY(-30px); border-left: 1px solid rgba(25, 27, 29, .3); } .site-navigation.classic .sub-menu li.menu-item.menu-item-has-children:hover .sub-menu { opacity: 1; visibility: visible; -webkit-transform: translateX(87%) translateY(-40px); -ms-transform: translateX(87%) translateY(-40px); transform: translateX(87%) translateY(-40px) } .site-navigation.classic .menu.main-menu > li.menu-item.menu-item-has-children:hover a::before { -webkit-transform: translateY(10px); -ms-transform: translateY(10px); transform: translateY(10px); opacity: 0; } .site-navigation.classic .menu.main-menu > li.menu-item.menu-item-has-children:hover > .sub-menu::after { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0) } .site-navigation.classic .menu.main-menu > li.menu-item.menu-item-has-children:hover > .sub-menu li.menu-item { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); opacity: 1; visibility: visible; } .site-navigation.fullscreen { position: fixed; width: 100%; height: 85%; top: 0; left: 0; z-index: 888; } .site-navigation.fullscreen .fs-menu-wrapper { display: block; width: 100%; position: fixed; height: 85%; top: 0; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .site-navigation.fullscreen .fs-menu-wrapper { display: none } .site-navigation.fullscreen .menu.main-menu > li.menu-item { font-size: 50px; line-height: 80px; font-weight: 700; letter-spacing: -0.06em; display: block; overflow: hidden; padding-bottom: 0 } .site-navigation.fullscreen .menu.main-menu > li.menu-item a { position: relative; display: inline-block; -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%); color: rgba(25, 27, 29, .6); padding-right: 5px } .site-navigation.fullscreen .menu.main-menu > li.menu-item a::before { content: attr(data-hover); position: absolute; left: 0; width: 100%; overflow: hidden; color: #191b1d; -webkit-transition: width .75s cubic-bezier(0.63, 0.03, 0.21, 1); -o-transition: width .75s cubic-bezier(0.63, 0.03, 0.21, 1); transition: width .75s cubic-bezier(0.63, 0.03, 0.21, 1); white-space: nowrap } .site-navigation.fullscreen .menu.main-menu.hovered > li.menu-item a::before { width: 0% } .site-navigation.fullscreen .menu.main-menu.hovered > li.menu-item a.hovered::before { width: 100%; } .site-navigation.fullscreen .menu.main-menu { position: fixed; left: 25%; right: 0; bottom: 15%; padding: 0 } .site-navigation.fullscreen ul.ulcol { -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; } .sub-toggle { display: inline-block; position: relative; width: 20px; height: 20px; margin-left: 20px; top: -5px; cursor: pointer } .sub-togg-line { position: absolute; width: 0%; height: 1px; background: #000; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-transition: width .4s ease, -webkit-transform .5s ease .4s; transition: width .4s ease, -webkit-transform .5s ease .4s; -o-transition: width .4s ease, transform .5s ease .4s; transition: width .4s ease, transform .5s ease .4s; transition: width .4s ease, transform .5s ease .4s, -webkit-transform .5s ease .4s } .has-sub-in .sub-togg-line { width: 100% } .has-sub-in .sub-togg-line:nth-child(2) { -webkit-transform: translate(-50%, -50%) rotate(-90deg); -ms-transform: translate(-50%, -50%) rotate(-90deg); transform: translate(-50%, -50%) rotate(-90deg); } .menu-item.menu-item-has-children > a:hover > .sub-toggle { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg) } .sub-back { cursor: pointer; overflow: hidden; display: block; position: absolute; opacity: 0; left: 0; visibility: hidden; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; font-size: 30px; top: 20% } .sub-back.is-active { opacity: .4; visibility: visible; } .site-header.menu_dark .sub-back { color: #fff } .sb-arrow-left { display: inline-block; border: solid #000; border-width: 1px 0 0 1px; padding: 5px; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); margin-left: 4px; } .sb-arrow-line { display: inline-block; width: 50px; height: 1px; background: #000; vertical-align: middle; margin-top: -3px; margin-left: -12px; -webkit-transition: width .3s ease; -o-transition: width .3s ease; transition: width .3s ease } .sb-back-text { font-size: 10px; font-weight: 600; letter-spacing: 2px; margin-left: 10px; display: inline-block; opacity: 0; -webkit-transform: translateY(-1px) translateX(20%); -ms-transform: translateY(-1px) translateX(20%); transform: translateY(-1px) translateX(20%); -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease } .sub-back:hover .sb-arrow-line { width: 25px; } .sub-back:hover .sb-back-text { opacity: 1; -webkit-transform: translateY(-1px) translateX(0); -ms-transform: translateY(-1px) translateX(0); transform: translateY(-1px) translateX(0); } .site-navigation.fullscreen ul ul { position: absolute; top: 0; left: 0; visibility: hidden; padding: 0; margin: 0 } .site-navigation.fullscreen ul ul li { overflow: hidden; font-size: 40px; line-height: 70px; letter-spacing: -0.06em; padding: 0; padding-right: 18px; white-space: nowrap; } .site-navigation.fullscreen ul ul li a { -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%) } .site-navigation.fullscreen ul.hidden > li, .site-navigation.fullscreen ul.hidden { visibility: hidden; } .site-navigation.fullscreen ul.opened > li, .site-navigation.fullscreen ul.opened { visibility: visible; } .menu-widget { position: fixed; display: block } .site-navigation.classic .menu-widget { display: none } .menu-widget-left { left: 0; bottom: 17%; } .menu-widget-right { right: 0; bottom: 8%; } .menu-toggle { height: 25px; cursor: pointer; } .menu-toggle.hidden { display: none; } .toggle-line { width: 50px; height: 1px; display: block; background: #191b1d; -webkit-transition: all .3s cubic-bezier(.475, .425, 0, .995); -o-transition: all .3s cubic-bezier(.475, .425, 0, .995); transition: all .3s cubic-bezier(.475, .425, 0, .995); left: 0 } .loader-animate-header .toggle-line { width: 0px; } span.toggle-line:nth-child(2) { margin-top: 10px; -webkit-transition-delay: .1s; -o-transition-delay: .1s; transition-delay: .1s } span.toggle-line:nth-child(1) { margin-top: 5px; } body.loading span.toggle-line { -webkit-transition: none !important; -o-transition: none !important; transition: none !important } .menu-toggle.is-active .toggle-line:nth-child(1) { -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .menu-toggle.is-active .toggle-line:nth-child(2) { -webkit-transform: rotate(-135deg); -ms-transform: rotate(-135deg); transform: rotate(-135deg); margin-top: 0; } .menu-toggle.is-active .toggle-line { width: 35px } .site-navigation.fullscreen.menu-opened .fs-menu-wrapper { display: block } .site-navigation.menu-opened { display: block } .site-header.dark .light-logo, .site-header.light .dark-logo { display: none; } .site-header.light .toggle-line { background: #fff } .site-header.menu_dark.fullscreen_menu::before { background: #191b1d } .site-header.menu_dark .site-navigation.fullscreen .menu.main-menu > li.menu-item a { color: hsla(0, 0%, 100%, .2) } .site-header.menu_dark .site-navigation.fullscreen .menu.main-menu > li.menu-item a::before { color: #fff } .site-header.menu_dark .sub-togg-line { background: #fff } .header-cta-but { display: block; } .header-cta-but a { text-decoration: none; color: rgba(25, 27, 29, .6); font-size: 16px; font-weight: 700; letter-spacing: -0.05em; line-height: 20px; display: block; position: relative; } .header-cta-but a::before { content: ""; display: block; position: absolute; left: -25px; z-index: -1; width: 50px; height: 50px; background: #dedede; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); border-radius: 50px; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .header-cta-but a::after { content: attr(data-hover); display: block; position: absolute; left: 0; top: 0; width: 0%; overflow: hidden; white-space: nowrap; color: #191b1d; -webkit-transition: width .4s ease; -o-transition: width .4s ease; transition: width .4s ease; } .header-cta-but a:hover::after { width: 100%; } .header-cta-but a:hover::before { width: calc(100% + 50px); } .site-header.light .header-cta-but a { color: hsla(0, 0%, 100%, .4) } .site-header.light .header-cta-but a::before { background: #2b2e31 } .site-header.light .header-cta-but a::after { color: #fff } .social-list { list-style: none; padding: 0 } .social-list li { font-size: 18px; line-height: 32px; padding: 0; margin-bottom: 10px; } .social-list li:last-child { margin-bottom: 0; } .social-list li a { text-decoration: none; color: rgba(25, 27, 29, .6); display: block; -webkit-transform-origin: 0 0; -ms-transform-origin: 0 0; transform-origin: 0 0; opacity: 0; } .site-header.menu_dark .social-list li a { color: hsla(0, 0%, 100%, .4) } .git-button a { text-decoration: none; color: #ebebeb; font-size: 50px; font-weight: 700; letter-spacing: -3px; } .git-button { -webkit-transform: rotate(90deg) translateY(50%) translateX(50%); -ms-transform: rotate(90deg) translateY(50%) translateX(50%); transform: rotate(90deg) translateY(50%) translateX(50%); display: block; -webkit-transform-origin: right; -ms-transform-origin: right; transform-origin: right; opacity: 0; } .site-header.menu_dark .git-button a { color: hsla(0, 0%, 100%, .2); } #footer { clear: both; background: #ebebeb; margin-bottom: 0; padding: 100px 0 15px 0; z-index: 999; } #footer.dark { background: #131313 } .copyright-text { font-size: 12px; color: rgba(25, 27, 29, .6); } #footer.dark .copyright-text { color: hsla(0, 0%, 100%, .2); } .social-list-widget ul { list-style: none; margin: 0; padding: 0 } .social-list-widget ul li a { color: #191b1d; text-decoration: none; } #footer.dark .social-list-widget ul li a { color: #fff } .social-list-widget li { font-size: 14px; padding-bottom: 16px; } .footer-logo { margin-bottom: 20px; width: 150px } .footer-menu ul { margin: 0; padding: 0 } .footer-menu ul ul { display: none; } .footer-menu ul li { list-style: none; display: inline-block; } .footer-menu ul li a { color: rgba(25, 27, 29, .6); text-decoration: none; } #footer.dark .footer-menu ul li a { color: hsla(0, 0%, 100%, .4) } .footer-menu ul li { padding-right: 30px; font-size: 14px; } #page { visibility: visible } .hide_desktop { display: none } .wrapper-small { width: 100%; margin-right: auto; margin-left: auto; margin-bottom: 100px; } .wrapper { width: 100%; margin-right: auto; margin-left: auto; margin-bottom: 100px; } .wrapper-full { width: 100%; margin-bottom: 100px; } .section { width: 100%; margin-bottom: 100px; position: relative; background-size: cover; background-position: center; } .section.fullscreen { height: 100%; margin-bottom: 0; } .section.has-bg { margin-bottom: 350px; padding-top: 100px; margin-top: 350px; } .page-content .section:last-child { margin-bottom: 0 } .send-back { z-index: -2 } .section.send-back { z-index: -9 } .sec-bg-ov { position: absolute; width: 25%; top: 0; z-index: -2; } .sec-bg-ov:nth-child(1) { left: 0; height: calc(100% + 100px); -webkit-transform: translateY(-50px); -ms-transform: translateY(-50px); transform: translateY(-50px); } .sec-bg-ov:nth-child(2) { left: 25%; height: calc(100% + 200px); -webkit-transform: translateY(-100px); -ms-transform: translateY(-100px); transform: translateY(-100px); } .sec-bg-ov:nth-child(3) { left: 50%; height: calc(100% + 300px); -webkit-transform: translateY(-150px); -ms-transform: translateY(-150px); transform: translateY(-150px); } .sec-bg-ov:nth-child(4) { left: 75%; height: calc(100% + 200px); -webkit-transform: translateY(-100px); -ms-transform: translateY(-100px); transform: translateY(-100px); } .wrapper:after, .wrapper-small:after, .wrapper-full:after, section:after { display: table; clear: both; content: ''; } .c-col-1, .c-col-2, .c-col-3, .c-col-4, .c-col-5, .c-col-6, .c-col-7, .c-col-8, .c-col-9, .c-col-10, .c-col-11, .c-col-12 { float: left; padding-left: 15px; padding-right: 15px; margin-bottom: 30px; -webkit-box-sizing: border-box; box-sizing: border-box } .no-gap { padding-left: 0; padding-right: 0; } .c-col-6 { width: 50%; } .c-col-4 { width: 33.333333% } .c-col-8 { width: 66.666666% } .c-col-3 { width: 25%; } .c-col-2 { width: 16.6666666% } .c-col-5 { width: 41.666666% } .c-col-10 { width: 83.333333% } .c-col-9 { width: 75% } .c-col-12 { width: 100%; } .no-margin { margin-bottom: 0 !important } .align-center { text-align: center } @media only screen and (max-width: 576px) { .wrapper { max-width: 90%; margin-bottom: 25px; } .wrapper-small { max-width: 90%; margin-bottom: 25px; } .wrapper-full { margin-bottom: 100px; } .c-col-1, .c-col-2, .c-col-3, .c-col-4, .c-col-5, .c-col-6, .c-col-7, .c-col-8, .c-col-9, .c-col-10, .c-col-11, .c-col-12 { width: 100%; margin-bottom: 35px; } .fit-col { margin: 0; } } @media only screen and (min-width: 576px) { .wrapper { max-width: 90%; } .wrapper-small { max-width: 90%; } } @media only screen and (min-width: 768px) { .wrapper { max-width: 90%; } .wrapper-small { max-width: 88%; } } @media only screen and (min-width: 992px) { .wrapper { max-width: 1014px; } .wrapper-small { max-width: 790px; } } @media only screen and (min-width: 1200px) { .wrapper { max-width: 1274px; } .wrapper-small { max-width: 950px; } } @media only screen and (min-width: 1600px) { .wrapper { max-width: 1500px; } .wrapper-small { max-width: 1200px; } } .section.parallax-bg { width: 100%; z-index: -1; background-size: cover; background-position: 50% 0%; background-repeat: no-repeat; overflow: hidden; } .a-empty-space { display: block; width: 100%; float: revert; clear: both } .post.alioth-post { display: block; overflow: hidden; position: relative; } .post.alioth-post a { text-decoration: none; color: #191b1d } .posts-navigation { display: block; float: left; } .posts-navigation ul li { display: inline-block; font-size: 20px; font-weight: 700; margin: 0 15px; } .posts-navigation ul li a { color: rgba(25, 27, 29, .6); -webkit-transition: color .3s ease; -o-transition: color .3s ease; transition: color .3s ease; letter-spacing: -0.03em; } .posts-navigation ul li.active a { color: #191b1d; } .posts-navigation ul li a:hover { color: #191b1d; } ul.comment-list { list-style: none; padding: 0; margin: 0; } .comment { background: #ebebeb; padding: 30px; margin-bottom: 30px; overflow: hidden; } .comment .comment-meta .image { display: block; float: left; } .comment-meta h4.name { margin: 0; } .comment-meta h4.name a { color: #191b1d } .comment-usr { display: block; float: left; padding-top: 10px; padding-left: 20px; } .comment .text_holder { display: block; float: left; } .comment-meta { display: block; float: left; width: 100%; } a.comment-reply-link { display: block; float: left; clear: both; } .comment-meta::after { content: ""; display: block; position: absolute; left: 0; bottom: -20px; width: 100%; background: rgba(25, 27, 29, .2); height: 1px; } .post-header { width: 100%; position: relative; } .post-image, .post-image img { width: 100%; height: 50vh; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center; } .post-image { position: relative; } .post-metas { display: block; width: 100%; float: left; margin-bottom: 30px; } .post-header.no-thumb .post-metas { margin-bottom: 10px } .post-header.no-thumb .post-details-wrapper { margin-top: 80px } .post-metas a { text-decoration: none; color: rgba(25, 27, 29, .6); -webkit-transition: color .3s ease; -o-transition: color .3s ease; transition: color .3s ease } .post-metas a:hover { color: #191b1d } .post-date, .post-cat { display: inline-block; font-size: 14px; font-weight: normal; color: rgba(25, 27, 29, .6); } body.light .post-cat a, body.light .post-date a, body.light .post-category a, body.light .post-cat, body.light .post-date, body.light .post-category { color: rgba(25, 27, 29, .6) } .post-details-wrapper { margin-top: 35px; } .post-category::before { content: ""; display: inline-block; width: 30px; height: 1px; background: rgba(25, 27, 29, .6); vertical-align: middle; margin: -1px 10px 0 10px; } body.light .post-category::before { background: rgba(25, 27, 29, .6) } .post-details-wrapper { margin-top: 35px; margin-bottom: 35px; position: relative; overflow: hidden } .post-details-wrapper::after { content: ""; display: block; position: absolute; bottom: 20px; width: 100%; height: 1px; background: rgba(25, 27, 29, .2); } body.light .post-details-wrapper::after { background: rgba(25, 27, 29, .1) } .next-post { display: block; position: relative; width: 100%; float: left; padding-top: 30px; } .next-post a { text-decoration: none; } .next-post::before { content: ""; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 1px; background: hsla(0, 0%, 100%, .2); } body.light .next-post::before { background: rgba(25, 27, 29, .6) } h5.np-text { color: rgba(25, 27, 29, .6) } body.dark h5.np-text { color: hsla(0, 0%, 100%, .2); } h3.next-post-title { max-width: 60%; } .blog-archive .post-image, .blog-archive .post-image img { height: auto } .post-header.no-thumb { display: block; width: 100%; position: relative; padding-top: 200px; background: #EBEBEB; margin-bottom: 50px; z-index: 2; } .post-header.no-thumb .post-details-wrapper::after { display: none } .page-header.archive-header { padding-top: 200px; } .blog-classic .post.alioth-post { width: 45%; float: left; margin: 0 2.5%; margin-bottom: 100px; } .posts-col { padding: 0 50px } .sidebar-col.sidebar-left { padding-left: 0; padding-right: 30px; border-right: 1px solid rgba(25, 27, 29, .1); } .sidebar-col.sidebar-right { border-left: 1px solid rgba(25, 27, 29, .1); padding-right: 0; padding-left: 30px; } .blog-classic .post-image { width: 100%; height: 100%; } .blog-classic .post-image img { width: 100%; -o-object-fit: cover; object-fit: cover; height: 100%; display: block } .alioth-blog.blog-classic { display: block; overflow: hidden; } .blog-classic .post.alioth-post.sticky { width: 100%; margin: 0 auto; float: none; clear: both; margin-bottom: 100px; } .blog-classic .post.alioth-post.sticky .post-image { width: 60%; display: block; float: left } .blog-classic .post.alioth-post.sticky .post-meta { width: 100% } .blog-classic .post.alioth-post .post-title { margin-bottom: 10px; margin-top: 0 } .blog-classic .post-date { display: block; float: left } .blog-classic h5.post-date::after { content: ""; display: inline-block; width: 20px; height: 1px; background: rgba(25, 27, 29, .6); vertical-align: middle; margin-top: -1px; margin-left: 10px; margin-right: 10px; } .blog-classic .post-meta { display: block; float: left; overflow: hidden; width: 100%; padding: 20px; -webkit-box-sizing: border-box; box-sizing: border-box; } .alioth-blog.blog-classic .post.alioth-post .post-title h2 { margin-bottom: 0; margin-top: 0 } .blog-classic .post-date, .blog-classic .post-cat { color: rgba(25, 27, 29, .6); margin-top: 0; font-size: 16px } .blog-classic .post-date a, .blog-classic .post-cat a { color: rgba(25, 27, 29, .6); } body.dark .blog-classic .post-date a, body.dark .blog-classic .post-cat a { color: hsla(0, 0%, 100%, .4); } body.dark .blog-classic .post-date, .blog-classic.dark .post-date, body.dark .blog-classic .post-cat, .blog-classic.dark .post-cat { color: hsla(0, 0%, 100%, .4); } body.dark h5.post-date::after, .blog-classic.dark h5.post-date::after { background: hsla(0, 0%, 100%, .4); } body.dark .page-header { background: #131517 } body.dark .page-title h1 { color: #fff; } .post.alioth-post .post-title h3, .post.alioth-post .post-title h2 { margin-bottom: 10px; margin-top: 0 } .post.alioth-post.no_thumb, .blog-archive .post.alioth-post, .blog-list .post.alioth-post { margin-bottom: 45px; padding-bottom: 30px; } .post.alioth-post.no_thumb .post-date, .blog-list .post-date, .alioth-post .post-category { font-size: 14px; color: rgba(25, 27, 29, .6); margin-left: 0.3em; margin-top: 0; display: inline-block; } .alioth-blog.blog-list { margin-top: 50px; } .post.alioth-post.no_thumb .post-summary, .blog-list .post-summary { font-size: 16px; color: rgba(25, 27, 29, .6); display: block; float: left; line-height: 32px; margin-top: 0 } .post.alioth-post.no_thumb .post-cat, .blog-list .post-cat, .blog-archive .post-cat { font-size: 14px; display: inline-block; margin-top: 0; margin-bottom: 0; } .blog-archive .post-cat::before { content: ""; display: inline-block; width: 30px; height: 1px; background: rgba(25, 27, 29, .3); vertical-align: middle; margin: 0 10px; } .post-read { display: block; float: left; overflow: hidden; clear: both } body.light .blog-list .post-cat::before { background: #191b1d } .blog-archive .post.alioth-post::after, .blog-list .post.alioth-post::after { content: ""; display: block; position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; background: rgba(25, 27, 29, .2); } .blog-archive .post.alioth-post.sticky::after, .blog-list .post.alioth-post.sticky::after { background: #191b1d; } body.dark .blog-list .post.alioth-post::after, .blog-list.dark .post.alioth-post::after { background: hsla(0, 0%, 100%, .4) } .blog-list .post.alioth-post .post-image { display: none } .blog-list .post-images { position: fixed; width: 30%; -webkit-transform: translateY(50px) translateX(50px); -ms-transform: translateY(50px) translateX(50px); transform: translateY(50px) translateX(50px) } .blog-list .post-images .post-image { display: block; width: 100%; position: absolute; top: 0; left: 0; overflow: hidden } .blog-list .post-images .post-image img { width: 100%; -o-object-fit: cover; object-fit: cover; max-width: unset; } body.dark .blog-list .post-cat a, .blog-list.dark .post-cat, body.dark .blog-list .post-summary, .blog-list.dark .post-summary, body.dark .blog-list .post-date a, .blog-list.dark .post-date { color: hsla(0, 0%, 100%, .4) } .blog-list .post-date, .blog-list .post-cat { font-size: 14px; margin-bottom: 20px; } .blog-list .post-date::after { content: ""; display: inline-block; width: 20px; height: 1px; background: rgba(25, 27, 29, .6); vertical-align: middle; margin: 0 15px; } body.dark .blog-list .post-date::after { background: hsla(0, 0%, 100%, .4) } .portfolio-showcase.showcase-video { position: relative } .portfolio-showcase video { height: 100%; object-fit: cover } .portfolio-showcase .plyr__controls { display: none } .plyr--full-ui input[type="range"] { color: #000 } .portfolio-showcase .plyr--video .plyr__control.plyr__tab-focus, .portfolio-showcase .plyr--video .plyr__control:hover, .portfolio-showcase .plyr--video .plyr__control[aria-expanded="true"] { background: #000 } .portfolio-showcase .plyr__control--overlaid { background: #000; } .portfolio-showcase .plyr__video-embed iframe { top: 0%; height: 100%; width: 100%; } .portfolio-showcase .plyr--full-ui.plyr--video .plyr__control--overlaid { display: none; } .portfolio-showcase .plyr { width: 100%; height: 100%; pointer-events: none } .portfolio-showcase .plyr__video-wrapper { width: calc((75vh - 2rem) * 1.77777778); min-width: 100%; height: 100%; position: absolute; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .showcase-video { width: 100%; height: 100%; } .showcase-video video { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -o-object-position: top; object-position: top } .portfolio-showcase .plyr__video-embed__container { height: 100% !important } .showcase-footer { position: absolute; bottom: 7.5%; width: 83%; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); pointer-events: none; z-index: 1 } .showcase-footer-left, .showcase-footer-right { display: block; float: left; width: 50%; height: 100%; pointer-events: all } .showcase-footer-right { text-align: right; float: right; pointer-events: all } .a-plus-button { position: relative; display: inline-block; cursor: pointer; width: 50px; height: 50px; } .a-plus-button::before { content: ""; display: block; position: absolute; width: 100%; height: 1px; background: #191b1d; left: 0; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .a-plus-button::after { content: ""; display: block; position: absolute; width: 1px; height: 50px; background: #191b1d; left: 50%; top: 0; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); -webkit-transition: -webkit-transform .6s ease; transition: -webkit-transform .6s ease; -o-transition: transform .6s ease; transition: transform .6s ease; transition: transform .6s ease, -webkit-transform .6s ease } body.dark .a-plus-button::before, body.dark .a-plus-button::after, .a-plus-button.light::after, .a-plus-button.light::before { background: #fff } .a-plus-button a { display: block; width: 100%; height: 100%; white-space: nowrap; color: #191b1d; font-size: 12px; overflow: hidden; font-weight: 600; } body.dark .a-plus-button a, .a-plus-button.light a { color: #fff } .a-plus-button a > span { display: inline-block; position: absolute; top: 30%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); left: 50%; overflow: hidden; } .a-plus-button a > span > span { display: block; -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%); -webkit-transition: -webkit-transform .3s ease .3s; transition: -webkit-transform .3s ease .3s; -o-transition: transform .3s ease .3s; transition: transform .3s ease .3s; transition: transform .3s ease .3s, -webkit-transform .3s ease .3s; } .a-plus-button:hover a > span > span { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0) } .a-plus-button:hover::after { -webkit-transform: translateX(-50%) rotate(270deg); -ms-transform: translateX(-50%) rotate(270deg); transform: translateX(-50%) rotate(270deg); } .fullscreen-slider-showcase { display: block; position: relative; width: 100%; height: 100vh; } @supports (-webkit-touch-callout: none) { .fullscreen-slider-showcase { height: -webkit-fill-available; } } .fullscreen-slider-showcase .slide-bgimg, .fullscreen-slider-showcase .swiper-wrapper { -webkit-transition-timing-function: cubic-bezier(0.87, 0, 0.13, 1) !important; -o-transition-timing-function: cubic-bezier(0.87, 0, 0.13, 1) !important; transition-timing-function: cubic-bezier(0.87, 0, 0.13, 1) !important; } .slide-bgimg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-position: center; background-size: cover; } .fs-project.swiper-slide .fs-project-image { display: none } .fs-project { position: absolute; top: 0; left: 0; width: 100%; height: 100%; visibility: hidden; z-index: 2; pointer-events: none } .fs-project.active { visibility: visible } .fs-project-dets { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); display: block; width: 35%; left: 15%; } .fs-title { font-size: 110px; font-weight: 700; letter-spacing: -0.06em; margin-bottom: 100px; line-height: 115px; width: 100%; display: block; overflow: hidden } .fullscreen-slider-showcase.dark .fs-title, body.dark .fullscreen-slider-showcase .fs-title { color: #fff } .fs-meta { display: inline-block; margin-left: 5px; } .fs-meta span { font-size: 20px; font-weight: 700; letter-spacing: -0.06em; color: rgba(25, 27, 29, .6); line-height: 25px; } .fs-cat > span { display: inline-block; } .fs-cat > span::after { content: "-"; display: inline-block; vertical-align: middle; margin: 0 5px; } .fs-cat > span:last-child::after { display: none; } .fullscreen-slider-showcase.dark .fs-meta span, body.dark .fullscreen-slider-showcase .fs-meta span { color: hsla(0, 0%, 100%, .5) } span.fs-year::before { content: "/"; margin: 0 5px; } .fs-nav { display: block; } .fs-nav span { font-size: 16px; font-weight: 700; letter-spacing: -0.06em; display: inline-block; color: rgba(25, 27, 29, .6); cursor: pointer } .fs-nav span.swiper-pagination-progressbar-fill { background: #191b1d } .fullscreen-slider-showcase.dark .fs-nav span, body.dark .fullscreen-slider-showcase .fs-nav span { color: hsla(0, 0%, 100%, .6) } span.fs-prog { width: 100px; height: 1px; background: rgba(25, 27, 29, .3); vertical-align: middle; margin-top: -1px; margin-left: 15px; margin-right: 15px; position: relative; } .fullscreen-slider-showcase.dark span.fs-prog, body.dark .fullscreen-slider-showcase span.fs-prog { background: hsla(0, 0%, 100%, .2) } .fullscreen-slider-showcase.dark .swiper-pagination-progressbar.fs-prog .swiper-pagination-progressbar-fill, body.dark .fullscreen-slider-showcase .swiper-pagination-progressbar.fs-prog .swiper-pagination-progressbar-fill { background: #fff } span.fs-prog-bar { background: #191b1d; width: 50%; height: 1px; position: absolute; left: 0; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .fullscreen-slider-showcase.dark span.fs-prog-bar, body.dark .fullscreen-slider-showcase span.fs-prog-bar { background: #fff } .fullscreen-slider-showcase.dark .swiper-pagination-progressbar.fs-prog .swiper-pagination-progressbar-fill, body.dark .fullscreen-slider-showcase .swiper-pagination-progressbar.fs-prog .swiper-pagination-progressbar-fill { color: #fff } .fs-button { position: absolute; right: 20%; top: 32%; display: block; pointer-events: all } .fs-button a { text-decoration: none; color: #191b1d; font-size: 16px; font-weight: 700; letter-spacing: -0.05em; position: relative; display: block; } .fullscreen-slider-showcase.dark .fs-button a::after, body.dark .fs-button a::after, .fullscreen-slider-showcase.dark .fs-button a, body.dark .fs-button a { color: #fff } .fs-button a::after { content: "\ea5d"; font-family: IcoFont; font-size: 20px; vertical-align: middle; margin-left: 10px; margin-top: -1px; display: inline-block; } .fs-button, .fs-meta, .fs-fraction { overflow: hidden } .fs-tit-char { overflow: hidden; padding-right: 3px; margin-right: -3px } .fs-tit-char > span, .fs-button > span, .fs-meta > span, .fs-fraction > span { display: block } .fs-images { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 0 } .fs-images .fs-project-image .fs-im-wrap { position: absolute; width: 100%; height: 100% } .fs-images .fs-project-image img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; transition: all 1s ease; } .fs-fraction { display: block; position: absolute; left: 8.5%; top: 29.5%; overflow: hidden; z-index: 2 } .fs-fraction span { font-size: 20px; font-weight: 700; letter-spacing: -0.06em; font-size: 15px; color: rgba(25, 27, 29, .6); display: block } .fullscreen-slider-showcase.dark .fs-fraction span, body.dark .fs-fraction span { color: hsla(0, 0%, 100%, .4) } span.fs-tot::before { content: "/"; margin-right: 5px; } .fs-img-wrap { position: absolute; width: 100%; height: 100%; overflow: hidden } .portfolio-showcase.showcase-slideshow { position: relative; width: 100%; height: 100vh; z-index: 1 } @supports (-webkit-touch-callout: none) { .portfolio-showcase.showcase-slideshow { height: -webkit-fill-available; } } .showcase-slideshow-wrapper { position: absolute; top: 50%; right: 10%; -webkit-transform: translatey(-50%); -ms-transform: translatey(-50%); transform: translatey(-50%); width: 35%; height: 68%; } .ss-project { width: 100%; height: 100%; display: block; position: absolute; visibility: hidden; } .ss-project.active { visibility: visible } .ss-project .ss1-image { display: none } .ss1-image img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .ss1-details { position: relative; top: 40%; left: 0; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); width: 100%; overflow: hidden } .ss1-met-wrap { display: block; float: right; width: 60%; } .ss1-title { font-size: 100px; font-weight: 700; letter-spacing: -0.06em; float: left; width: 100%; display: block; line-height: 120px; white-space: pre-line } .ss1-title .st-line { display: block; } .ss1-summary { float: left; width: 100%; margin-top: 50px; font-size: 14px; line-height: 25px; } .ss1-date { position: absolute; top: 0; right: 0; } .ss1-cat { display: block; font-size: 30px; line-height: 35px; font-weight: 700; letter-spacing: -0.05em; color: rgba(25, 27, 29, .6); margin-left: 100px; margin-bottom: 30px; float: left; overflow: hidden; } .ss1-cat span { display: inline-block; } .ss1-cat span::after { content: "/"; display: inline-block; vertical-align: middle; margin: 0 10px; } .ss1-cat span:last-child::after { display: none; } .showcase-slideshow.dark .ss1-title, .showcase-slideshow.dark .ss1-dots.swiper-pagination-bullets span, .showcase-slideshow.dark .ss1-date, body.dark .ss1-title, body.dark .ss1-dots.swiper-pagination-bullets span, body.dark .ss1-date { color: #fff } .showcase-slideshow.dark .ss1-cat, body.dark .ss1-cat, .showcase-slideshow.dark .ss1-summary, body.dark .ss1-summary { color: hsla(0, 0%, 100%, .4) } .ss1-images { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; overflow: hidden } .ss1-images .swiper-wrapper { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column } .ss1-images .ss1-image-wrap img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .ss1-image-wrap { width: 100%; height: 100%; } .ss1-image-wrap.active { width: 100% } .ss1-image-wrapper { position: absolute; top: 0; left: 0; } .ss1-sl-image { -webkit-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease } .ss1-sl-image { position: absolute; top: 50%; left: 15%; -webkit-transform: translatey(-50%); -ms-transform: translatey(-50%); transform: translatey(-50%); width: 50%; height: 62%; overflow: hidden; } .ss1-sl-image .plyr__video-wrapper { width: calc((75vh) * 1.77777778) !important } .ss1-sl-image img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .ss1-images .swiper-wrapper { -webkit-transition-timing-function: cubic-bezier(0.51, 0.51, 0, 1.01); -o-transition-timing-function: cubic-bezier(0.51, 0.51, 0, 1.01); transition-timing-function: cubic-bezier(0.51, 0.51, 0, 1.01); } .ss1-dots.swiper-pagination-bullets { position: absolute; top: 50%; left: 8%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); z-index: 3 } .ss1-dots.swiper-pagination-bullets span { width: auto; height: auto; background: none !important; display: block; margin-bottom: 40px; font-size: 12px; font-weight: 600; letter-spacing: -0.04em; cursor: pointer; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); } .ss1-dots.swiper-pagination-bullets span:last-child { margin-bottom: 0; } .ss1-fraction { position: absolute; right: 8%; bottom: 5%; } .ss1-fraction div { font-size: 14px; font-weight: 500; letter-spacing: -0.05em; } .ss1-curr::after { content: ""; display: block; width: 1px; height: 30px; background: rgba(25, 27, 29, .6); margin: 10px auto; } .showcase-slideshow.dark .ss1-fraction div, body.dark .ss1-fraction div { color: #fff } .showcase-slideshow.dark .ss1-curr::after, body.dark .ss1-curr::after { background: hsla(0, 0%, 100%, .2) } .ss1-button { display: block; border-radius: 50px; background: #ebebeb; display: inline-block; position: absolute; right: 20%; bottom: 20%; overflow: hidden; white-space: nowrap } .ss1-button a { display: block; text-decoration: none; color: #191b1d; padding: 20px 40px; } body.dark .ss1-button { background: hsla(0, 0%, 100%, .2) } body.dark .ss1-button a { color: #fff } .ss1-button a::after { content: "\ea94"; font-family: IcoFont; font-size: 20px; display: inline-block; vertical-align: middle; } .ss1-nav { position: absolute; bottom: 5%; left: 8%; } .ss1-nav i { font-size: 25px; } .ss1-prev::after { content: ""; display: block; width: 1px; height: 20px; background: #191b1d; margin: 0 auto; margin-top: -16px; } .ss1-next::before { content: ""; display: block; width: 1px; height: 20px; background: #191b1d; margin: 0 auto; margin-bottom: -16px; } .ss1-nav div { padding: 10px 0; cursor: pointer; } .showcase-slideshow.dark .ss1-nav div, body.dark .ss1-nav div { color: #fff } .showcase-slideshow.dark .ss1-prev::after, .showcase-slideshow.dark .ss1-next::before, body.dark .ss1-prev::after, body.dark .ss1-next::before { background: #fff; color: #fff } .tl-wrap, .ssum-line { display: block; overflow: hidden; } .fs-right-custom { position: absolute; bottom: 5%; right: 8%; } .fs-left-custom { position: absolute; bottom: 5%; left: 8%; } .fullscreen-wall-showcase { position: relative; width: 100%; height: 100vh; } .fw-projects { position: absolute; top: 50%; left: 7.5%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); display: block; width: 70%; z-index: 66; } body.smooth-scroll-enabled .fw-projects { position: absolute } .fw-projects .fwt-line { overflow: hidden } .fw-images { position: absolute; top: 0; right: 0; width: 50%; height: 100%; pointer-events: none; z-index: 55; } .portfolio-showcase .fw-images .plyr__video-wrapper { width: calc((100vh) * 1.77777778) } .fw-images .fw-project-image, .fw-images .fw-project-image img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -o-object-position: top; object-position: top; } .fw-images .fw-project-image { position: absolute; top: 0; right: 0; } .fw-project { display: inline-block; padding: 0px 5px 0px; cursor: pointer; overflow: hidden; padding-right: 5px } .fw-project a { text-decoration: none; color: #191b1d; display: inline-block; } body.dark .fw-project a, .fullscreen-wall-showcase.dark .fw-project a { color: #fff } .fw-projects .fw-project-image { display: none } .fw-project .fw-project-category { display: none } .fw-project-title { font-size: 60px; font-weight: 700; letter-spacing: -0.06em; display: inline-block; -webkit-transition: opacity .3s ease; -o-transition: opacity .3s ease; transition: opacity .3s ease; } .fw-project.opdown .fw-project-title { opacity: .2 } .fw-project.active.opdown .fw-project-title { opacity: 1; } .fw-project-image-wrap { position: absolute; top: 0; right: 0; width: 0%; height: 100%; overflow: hidden; } .fw-project::after { content: "/"; display: inline-block; font-size: 60px; margin: 0 20px; font-weight: 700; color: rgba(25, 27, 29, .2); } .fwt-line .fw-project:last-child::after { display: none } .fw-cat { font-size: 20px; font-weight: 700; letter-spacing: -0.05em; color: rgba(25, 27, 29, .6); overflow: hidden } .fw-cat span { display: inline-block; } .fw-cat span::after { content: "/"; display: inline-block; vertical-align: middle; margin: 0 5px; } .fw-cat span:last-child::after { display: none; } body.dark .fw-cat, .fullscreen-wall-showcase.dark .fw-cat, body.dark .fw-project::after, .fullscreen-wall-showcase.dark .fw-project::after { color: hsla(0, 0%, 100%, .6) } .ss2-project { position: absolute; width: 100%; height: 100%; } .portfolio-showcase.showcase-slideshow-v2 { position: relative; width: 100%; height: 100vh; } .portfolio-showcase.showcase-slideshow-v2::before { content: ""; display: block; position: absolute; top: 0; left: 0; background: #191b1d; width: 100%; height: 100%; z-index: 3; opacity: 0; pointer-events: none; } .showcase-slideshow-2-wrapper { display: block; position: relative; max-width: 35%; height: 70%; top: 50%; left: 16%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .ss2-project-meta { position: absolute; top: 50%; left: 0; width: 100%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .ss2-project-image { width: 100%; height: 100%; overflow: hidden; position: absolute } .ss2-project-image img { width: 100%; -o-object-fit: cover; object-fit: cover; height: 100% !important; } .ss2-project .ss2-project-image { display: none } .ss2-images { position: absolute !important; right: 8.5%; top: 50%; width: 35%; height: 70%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .slide-bgimg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-position: center; background-size: cover; } .ss2-project-title { font-size: 100px; font-weight: 700; letter-spacing: -0.06em; display: block; margin-bottom: 30px; line-height: 120px; } body.dark .ss2-button a, .showcase-slideshow-v2.dark .ss2-button a, .showcase-slideshow-v2.dark .ss2-dots span.ss2-dot, body.dark .ss2-dots span.ss2-dot, body.dark .ss2-project-cat, .showcase-slideshow-v2.dark .ss2-project-cat, body.dark .ss2-project-title, .showcase-slideshow-v2.dark { color: #fff } body.dark .ss2-overlay, .showcase-slideshow-v2.dark .ss2-overlay { color: #131313 } .ss2-project-cat { display: inline-block; margin-bottom: 25px; overflow: hidden; line-height: 35px; font-size: 25px; font-weight: 700; letter-spacing: -0.06em; color: rgba(25, 27, 29, .6) } body.dark .ss2-project-excerpt, .showcase-slideshow-v2.dark .ss2-project-excerpt, body.dark .ss2-project-cat, .showcase-slideshow-v2.dark .ss2-project-cat { color: hsla(0, 0%, 100%, .4) } body.dark .ss2-back-texts, .showcase-slideshow-v2.dark .ss2-back-texts { color: hsla(0, 0%, 100%, .01) } .ss2-project-cat span { display: block; } .ss2-project-cat span > span { display: inline-block; } .ss2-project-cat span > span::after { content: "/"; display: inline-block; margin: 0 10px; } .ss2-project-cat span > span:last-child::after { display: none; } .ss2-project-excerpt { width: 60%; font-size: 14px; line-height: 28px; margin-left: 7px; color: rgba(25, 27, 29, .4); } .ss2-project-excerpt > div { display: block; overflow: hidden } .ss2-project-excerpt > div > span { display: block } .ss2-overlay { position: absolute; right: 0; top: 0; width: 25%; height: 100%; background: #ebebeb; z-index: -2; } body.dark .ss2-button, .showcase-slideshow-v2.dark .ss2-button, body.dark .ss2-overlay, .showcase-slideshow-v2.dark .ss2-back-texts { background: #131313 } .fullscreen-footer.ss2-footer { position: absolute; bottom: 8%; left: 7.5%; display: block; right: 7.5%; } .ss2-footer-left { position: absolute; left: 0; bottom: 30px; pointer-events: all } .ss2-footer-right { position: absolute; right: 0; } .ss2-dots { position: absolute; left: 8.5%; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .ss2-dots span.ss2-dot { display: block; cursor: pointer; margin-left: 25px; opacity: .3; font-size: 12px; font-weight: 700; letter-spacing: -0.05em; padding: 15px 0; background: none; width: 0; height: 0; border-radius: 0; -webkit-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; margin-bottom: 20px; } .ss2-dot::after { content: ""; display: inline-block; width: 0; height: 1px; background: #191b1d; vertical-align: middle; margin-top: -40px; margin-left: 20px; -webkit-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; } .ss2-dots span.ss2-dot:hover { opacity: .6 } .ss2-dots span.ss2-dot.swiper-pagination-bullet-active { opacity: 1; margin-left: 0; } .ss2-dot.swiper-pagination-bullet-active::after { width: 20px; } .ss2-project .title-line { overflow: hidden } .ss2-project { visibility: hidden } .ss2-project.active { visibility: visible } .ss2-nav { position: absolute; bottom: 8%; right: 25%; -webkit-transform: translateX(-30%); -ms-transform: translateX(-30%); transform: translateX(-30%); } .ss2-nav div { display: inline-block; cursor: pointer; vertical-align: middle } .ss2-nav i { font-size: 25px; display: inline-block; vertical-align: middle; } .ss2-prev::after { content: ""; display: inline-block; width: 15px; height: 1px; background: #191b1d; vertical-align: middle; margin-left: -15px; } .ss2-nav div.ss2-prev { margin-right: 15px; } .ss2-next::before { content: ""; display: inline-block; width: 15px; height: 1px; background: #191b1d; vertical-align: middle; margin-right: -15px; } .ss2-nav div.ss2-next { margin-left: 15px; } .ss2-fract div { display: inline-block; font-size: 12px; } .ss2-fract .ss2-curr::after { content: '/'; display: inline-block; margin-left: 4px; } .ss2-back-texts { position: absolute; top: 22%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); font-size: 220px; font-weight: 700; white-space: nowrap; color: rgba(25, 27, 29, .02); width: 100%; height: auto; } .ss2-back-text { position: absolute; top: 0; left: 0; visibility: hidden; } .ss2-back-text.active { visibility: visible } .ss2-back-text .bt-char { overflow: hidden } .ss2-back-text .bt-char span { display: block } .ss2-button { position: absolute; width: 150px; height: 150px; background: #ebebeb; border-radius: 50%; bottom: 20%; left: 50%; -webkit-transform: translateX(-80%); -ms-transform: translateX(-80%); transform: translateX(-80%); z-index: 2; } .ss2-button a { text-decoration: none; color: #191b1d; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: auto; white-space: nowrap; display: block; } .ss2-button a::after { content: "\eac7"; display: block; text-align: center; font-family: IcoFont; margin-top: 10px; font-size: 20px; } .scroll-notice { position: relative; display: inline-block; width: auto; cursor: pointer; } .scroll-notice span:last-child { display: block; position: relative; width: auto; white-space: nowrap; font-size: 12px; font-weight: 600; color: rgba(25, 27, 29, .6); writing-mode: vertical-lr } body.dark .scroll-notice span { color: hsla(0, 0%, 100%, .4) } span.sn_bef { position: absolute; width: 1px; height: 40px; background: rgba(25, 27, 29, .6); bottom: 140%; left: 10px; } body.dark .scroll-notice span.sn_bef { background: hsla(0, 0%, 100%, .4) } .portfolio-showcase.carousel-showcase { width: 100%; height: 100vh } .cas-project-wrapper { display: -webkit-inline-box; display: inline-flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); position: absolute; top: 50%; } .cas-project { display: block; margin-right: 300px; width: 50vw; position: relative; height: 50vh; } .cas-project .cs-cat { display: none } .cas-project:last-child { margin-right: 0 } .cas-headline { position: absolute; top: 50%; left: 8.5%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); max-width: 80vw; font-size: 60px; font-weight: 700; letter-spacing: -0.06em; line-height: 75px; padding-left: 5%; -webkit-box-sizing: border-box; box-sizing: border-box; } .cas-line-wrap { display: block; overflow: hidden } .cas-headline .cas-line { overflow: hidden; padding-right: 6px } .cas-headline .cas-line span { display: block; } .cs-image { width: 100%; overflow: hidden; height: 100%; } .cs-image img { width: 100%; -o-object-fit: cover; object-fit: cover; height: 100% !important; } .cas-progress.swiper-pagination-progressbar { position: absolute; bottom: 5%; top: unset; width: 60%; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); height: 1px; } .cas-progress.swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background: #191b1d; } .cas-titles { position: fixed; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); text-align: center; height: 250px; overflow: hidden; } .cas-titles .cas-titles-wrap { display: block; position: relative; overflow: hidden; -webkit-transform: translateY(250px); -ms-transform: translateY(250px); transform: translateY(250px) } .cas-titles .cs-title { font-size: 150px; font-weight: 700; letter-spacing: -0.06em; white-space: nowrap; padding: 50px 0; line-height: 150px } .cas-titles .cs-title a { text-decoration: none; color: #191b1d; display: block; overflow: hidden } .cas-progress { display: block; position: fixed; bottom: 7.5%; width: 50%; height: 1px; background: rgba(25, 27, 29, .2); left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .cas-progress span { position: absolute; left: 0; background: #191b1d; height: 100%; width: 0%; } .carousel-showcase.dark .cas-progress, body.dark .cas-progress { background: hsla(0, 0%, 100%, .2) } .carousel-showcase.dark .cas-progressspan, body.dark .cas-progress span { background: #fff } .cas-bg-text { font-size: 200px; font-weight: 700; letter-spacing: -0.07em; position: fixed; top: 10%; left: 0; white-space: nowrap; opacity: .02; } .carousel-showcase.dark .cas-titles .cs-title a, body.dark .cas-titles .cs-title a, .carousel-showcase.dark .cas-headline, body.dark .cas-headline { color: #fff } .portfolio-showcase.showcase-list { position: relative; width: 100%; height: 100%; overflow: hidden } .showcase-list-wrapper { position: relative; left: 25%; width: 100%; height: 100%; margin-top: 250px; } .portfolio-showcase.showcase-list .plyr { min-height: 500px } .sl-project { display: block; padding: 40px 0; cursor: pointer; z-index: auto; -webkit-transition: opacity .3s ease, -webkit-transform .3s ease; transition: opacity .3s ease, -webkit-transform .3s ease; -o-transition: transform .3s ease, opacity .3s ease; transition: transform .3s ease, opacity .3s ease; transition: transform .3s ease, opacity .3s ease, -webkit-transform .3s ease; position: relative; } .sl-project a { text-decoration: none; color: #191b1d; display: block; overflow: hidden } .showcase-list.dark .sl-project a, body.dark .sl-project a { color: #fff } .sl-project.opdown { opacity: .1 } .sl-project:hover { -webkit-transform: translateX(30px); -ms-transform: translateX(30px); transform: translateX(30px) } .sl-images { position: fixed; z-index: -1 } .sl-images .sl-project-image { width: 50vw; position: absolute; top: 0; overflow: hidden; pointer-events: none; -webkit-transform: translateY(-50%) translateX(-50%); -ms-transform: translateY(-50%) translateX(-50%); transform: translateY(-50%) translateX(-50%); visibility: hidden } .sl-images .sl-project-image .sl-hover-wrap { width: 100%; height: 100%; -webkit-transform: scale(.7); -ms-transform: scale(.7); transform: scale(.7); overflow: hidden; -webkit-transition: -webkit-transform .6s cubic-bezier(0, 0.55, 0.45, 1); transition: -webkit-transform .6s cubic-bezier(0, 0.55, 0.45, 1); -o-transition: transform .6s cubic-bezier(0, 0.55, 0.45, 1); transition: transform .6s cubic-bezier(0, 0.55, 0.45, 1); transition: transform .6s cubic-bezier(0, 0.55, 0.45, 1), -webkit-transform .6s cubic-bezier(0, 0.55, 0.45, 1); } .sl-images .sl-project-image img { width: 100%; height: 100%; -webkit-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2); -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center; -webkit-transition: -webkit-transform .6s cubic-bezier(0, 0.55, 0.45, 1); transition: -webkit-transform .6s cubic-bezier(0, 0.55, 0.45, 1); -o-transition: transform .6s cubic-bezier(0, 0.55, 0.45, 1); transition: transform .6s cubic-bezier(0, 0.55, 0.45, 1); transition: transform .6s cubic-bezier(0, 0.55, 0.45, 1), -webkit-transform .6s cubic-bezier(0, 0.55, 0.45, 1); } .sl-images .sl-project-image.active .sl-hover-wrap { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1) } .sl-images .sl-project-image.active img { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1) } .sl-project-title { font-size: 100px; font-weight: 700; letter-spacing: -0.06em; position: relative; z-index: -1; } .sl-project::before { content: attr(data-index); position: absolute; left: 0; top: 20px; font-size: 16px; letter-spacing: 0; font-weight: 500; -webkit-transform: translateX(-150%); -ms-transform: translateX(-150%); transform: translateX(-150%); color: rgba(25, 27, 29, .6); opacity: 1 } .no-numbers .sl-project::before { display: none } .sl-project-meta div { display: inline-block; font-size: 20px; font-weight: 700; letter-spacing: -0.05em; color: rgba(25, 27, 29, .6); } .showcase-list.dark .sl-project::before, body.dark .sl-project::before, .showcase-list.dark .sl-project-meta div, body.dark .sl-project-meta div { color: hsla(0, 0%, 100%, .4) } .sl-project-cat::after { content: "/"; display: inline-block; margin-left: 10px; opacity: .5; margin-right: 10px; } .sl-project-cat span { display: inline-block; } .sl-project-cat span::after { content: "-"; display: inline-block; margin: 0 5px; } .sl-project-cat span:last-child::after { display: none; } .sl-project-meta { display: block; margin-top: 10px; margin-left: 5px; position: relative; z-index: -1 } .sl-project:hover .sl-project-title, .sl-project:hover .sl-project-meta { z-index: 5 } .sl-scroll { display: block; position: relative; width: 100%; overflow: hidden } .portfolio-showcase.showcase-list .showcase-footer { position: fixed } .project-image { display: none } .portfolio-showcase.showcase-wall { position: relative; width: 100%; height: 100vh; } .wall-projects { position: absolute; top: 57%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); width: 100%; } .wall-projects-top, .wall-projects-bottom { white-space: nowrap; display: inline-block; width: auto; } .wall-projects-top { margin-bottom: 30px; -webkit-transform: translateX(10%); -ms-transform: translateX(10%); transform: translateX(10%) } .wall-projects-bottom { float: right; -webkit-transform: translateX(-10%); -ms-transform: translateX(-10%); transform: translateX(-10%) } .wall-project { display: inline-block; } .wall-project a { text-decoration: none; color: #191b1d; display: block; } .showcase-wall.dark .wall-project a, body.dark .wall-project a { color: #fff } .wall-project .project-title { font-size: 125px; font-weight: 700; letter-spacing: -0.07em; line-height: 125px; overflow: visible } .wall-project .project-title::after { content: "/"; opacity: .3; margin: 0 30px; } .wall-project .project-title::before { content: attr(data-index); position: absolute; top: 0; left: 0; font-size: 20px; display: inline-block; line-height: 20px; width: 20px; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); font-size: 15px; font-weight: 500; letter-spacing: 0; color: rgba(25, 27, 29, .6); } .no-numbers .wall-project .project-title::before { display: none } .showcase-wall.dark .wall-project .project-title::before, body.dark .wall-project .project-title::before { color: hsla(0, 0%, 100%, .2) } .wall-project:last-child .project-title::after { display: none } #images-canvas { position: absolute; top: 0; left: 0; bottom: 0; width: 100%; height: 100%; } .wall-projects.on-hover .wall-project { opacity: .2; } .wall-projects.on-hover .wall-project.hovered { opacity: 1; } .wall-images { position: fixed; top: 50%; left: 50%; width: 30%; height: 70%; z-index: -2; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); display: block } .wall-image-fix { width: 100%; height: 100%; position: absolute; overflow: hidden; left: 0; visibility: hidden; } .wall-images img { height: 100% !important; -o-object-fit: cover; object-fit: cover; -o-object-position: top; object-position: top } .showcase-wall .circular-button { position: relative; -webkit-transform: none; -ms-transform: none; transform: none; display: block; left: 0; bottom: 0; } .wall-drag { position: absolute; width: 50%; height: 1px; bottom: 10%; background: rgba(25, 27, 29, .3); left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } body.dark .wall-drag, .showcase-wall.dark .wall-drag { background: hsla(0, 0%, 100%, .2) } span.wall-prog { position: absolute; left: 0; width: 0%; height: 1px; background: #191b1d; z-index: 6; } body.dark span.wall-prog, .showcase-wall.dark span.wall-prog { background: #fff } .line-holder { overflow: hidden; display: block } .word-holder, .char-holder { overflow: hidden; display: inline-block; vertical-align: middle } .has-anim { display: block; width: 100% } .img-anim-wrapper { display: block; position: relative; width: 100%; overflow: hidden; } .img-anim-ov { position: absolute; display: block; pointer-events: none; top: 0; left: 0; bottom: 0; right: 0; width: 100%; height: 100%; z-index: 1 } .img-anim-wrapper img { -webkit-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2) } .single-image span { display: block; position: absolute; } .anim_line { display: block; overflow: hidden } .single-image { width: 100%; display: block; position: relative; float: left } .single-image.align-left { float: left } .single-image.align-right { float: right } .single-image.align-center { float: none; margin: 0 auto; } .single-image.lightbox { cursor: pointer } .single-image img { width: 100%; max-width: unset !important } .single-image.parallax_wrapper { width: 100%; background-size: cover; background-position: 50% 0%; background-repeat: no-repeat; overflow: hidden; } .text-wrapper { display: block; float: left; width: 100% } .align-right { text-align: right } .alioth-single-project { display: block; width: 100%; position: relative; margin-bottom: 50px; } .alioth-single-project a { text-decoration: none; color: #191b1d; } body.dark .alioth-single-project a, .alioth-single-project.dark a { color: #fff } .sw-image { width: 100%; display: block; overflow: hidden; } .sw-image img { width: 100%; -o-object-fit: cover; object-fit: cover; -webkit-transform: scale(1.1) translateY(-4%); -ms-transform: scale(1.1) translateY(-4%); transform: scale(1.1) translateY(-4%); } .sw-detail { position: relative; padding-top: 30px; padding-left: 30px; display: block; } .sw-title { font-size: 35px; font-weight: 700; letter-spacing: -0.06em; display: block; margin-bottom: 5px; } .sw-cat { font-size: 20px; font-weight: 700; letter-spacing: -0.05em; color: rgb(25 27 29 / 50%); } .sw-cat span { display: inline-block; } .sw-cat span::after { content: "/"; display: inline-block; margin: 0 7px; } .sw-cat span:last-child::after { display: none; } body.dark .alioth-single-project .sw-cat, .alioth-single-project.dark .sw-cat { color: hsla(0, 0%, 100%, .4) } .alioth-page-nav { display: block; width: 100%; overflow: hidden; background-color: #f1f1f1 } .alioth-page-nav.dark { background: #101010 } .alioth-page-nav a { text-decoration: none; display: block; width: 100%; padding: 50px 0; overflow: hidden; color: #191b1d } .alioth-page-nav .page-title { font-size: 150px; font-weight: 700; letter-spacing: -0.06em; color: rgba(25, 27, 29, .6); display: block; margin-right: 50px; width: 100%; overflow: hidden; -webkit-transition: color .5s ease; -o-transition: color .5s ease; transition: color .5s ease } .alioth-page-nav.dark .page-title, body.dark .page-title { color: hsla(0, 0%, 100%, .1) } .alioth-page-nav a:hover .page-title { color: #191b1d } .alioth-page-nav.dark .page-sub-title, body.dark .page-sub-title, .alioth-page-nav.dark a:hover .page-title, body.dark a:hover .page-title { color: #fff } .page-sub-title { position: absolute; bottom: 15%; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); color: #191b1d } .page-sub-title::after { content: "\ea5d"; font-family: IcoFont; position: absolute; top: 0; -webkit-transform: translateY(-65%) translateX(65%) rotate(-45deg); -ms-transform: translateY(-65%) translateX(65%) rotate(-45deg); transform: translateY(-65%) translateX(65%) rotate(-45deg); right: 0; } .alioth-page-nav.dark .page-sub-title::after, body.dark .page-sub-title::after { color: #fff } .alioth-list { display: block; width: 100%; } .alioth-list ul { list-style: none; margin: 0; padding: 0; } .alioth-list ul li a { text-decoration: none; color: rgba(25, 27, 29, .6); display: inline-block; position: relative; -webkit-transition: color .4s ease; -o-transition: color .4s ease; transition: color .4s ease } body.dark .alioth-list ul li, .alioth-list.dark ul li, body.dark .alioth-list ul li a, .alioth-list.dark ul li a { color: hsla(0, 0%, 100%, .4) } .alioth-list ul li { font-size: 12px; line-height: 24px; text-transform: uppercase; letter-spacing: -0.01em; padding: 0; margin-bottom: 25px; } .alioth-list ul li a::before { content: ""; position: absolute; bottom: 0; left: 0; background: rgba(25, 27, 29, .2); width: 100%; height: 1px; } body.dark .alioth-list ul li a::before, .alioth-list.dark ul li a::before { background: hsla(0, 0%, 100%, .4) } .alioth-list ul li a::after { content: ""; position: absolute; bottom: 0; left: 0; background: #191b1d; width: 0%; height: 1px; z-index: 2; -webkit-transition: width .4s ease; -o-transition: width .4s ease; transition: width .4s ease; } body.dark .alioth-list ul li a::after { background: #fff } .alioth-list ul li a:hover { color: #191b1d } .alioth-list ul li a:hover::after { width: 100%; } .a-number-counter { position: relative; display: block; } .ac-number { font-size: 100px; font-weight: 700; letter-spacing: -7.5px; height: 100px; position: relative; display: inline-block; overflow-y: hidden; line-height: 100px } .ac-number span { display: block; } .numbers-wrapper { -webkit-transform: translateY(28%); -ms-transform: translateY(28%); transform: translateY(28%) } .ac-number span:last-child::after { content: attr(data-sign); display: inline-block; margin-left: 5px; -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%); -webkit-transition: all .6s ease; -o-transition: all .6s ease; transition: all .6s ease; } .count_anim_end .ac-number span:last-child::after { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0) } span.ac-sign { font-size: 100px; font-weight: 700; letter-spacing: -7.5px; display: inline-block; padding-bottom: 20px; vertical-align: top; overflow: hidden; line-height: 100px } .a-number-counter.dark span.ac-sign { color: #fff } .ac-title { display: block; font-size: 16px; margin-top: -1px; overflow: hidden; color: rgba(25, 27, 29, .6) } .ac-title span { display: block; -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%); -webkit-transition: -webkit-transform .5s ease 1s; transition: -webkit-transform .5s ease 1s; -o-transition: transform .5s ease 1s; transition: transform .5s ease 1s; transition: transform .5s ease 1s, -webkit-transform .5s ease 1s; } .a-number-counter.count_inview .ac-title span { -webkit-transform: translateY(0%); -ms-transform: translateY(0%); transform: translateY(0%) } .ac-title::before { content: ""; display: block; background: rgba(25, 27, 29, .2); width: 0%; height: 1px; margin-bottom: 30px; -webkit-transition: all .7s ease; -o-transition: all .7s ease; transition: all .7s ease } body.dark .ac-title::before { background: hsla(0, 0%, 100%, .2) } .a-number-counter.count_inview .ac-title::before { width: 80% } .a-number-counter.dark .ac-number, body.dark .ac-number { color: #fff; } .a-number-counter.dark .ac-title, body.dark .ac-title { color: hsla(0, 0%, 100%, .4) } .alioth-embed-video { position: relative; } .alioth-embed-video .plyr--full-ui input[type="range"] { color: #000 } .alioth-embed-video .plyr--video .plyr__control.plyr__tab-focus, .alioth-embed-video .plyr--video .plyr__control:hover, ..alioth-embed-video plyr--video .plyr__control[aria-expanded="true"] { background: #000 } .alioth-embed-video .plyr__control--overlaid { background: #000; } .alioth-embed-video .plyr__video-embed iframe { top: -50%; height: 200%; } .alioth-embed-video .plyr--full-ui.plyr--video .plyr__control--overlaid { display: none; } .alioth-embed-video .video-overlay { position: absolute; top: 50%; left: 50%; width: 123px; height: 123px; background: rgba(0, 0, 0, 0.49); z-index: 1; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); border-radius: 50%; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; cursor: pointer; } .alioth-embed-video .video-overlay:hover { width: 130px; height: 130px; } .alioth-embed-video .play-button { position: absolute; top: 50%; left: 53%; z-index: 2; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); color: #fff; font-size: 40px; width: 0; height: 0; border-top: 20px solid transparent; border-bottom: 20px solid transparent; border-left: 30px solid #fff; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .alioth-embed-video .plyr__controls { opacity: 0; } .alioth-embed-video.video-play .plyr__controls { opacity: 1; } .alioth-embed-video.video-play .video-overlay { opacity: 0; pointer-events: none; } .alioth-embed-video.no-interaction .video-overlay { display: none } .plyr__video-embed, .plyr__video-wrapper--fixed-ratio { height: 0 } .alioth-image-carousel { position: relative; display: block; overflow: hidden; margin: 50px 0; } .ai-wrapper { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; width: auto; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding-left: 30px } .ai-image { display: block; margin-right: 30px; -ms-flex-preferred-size: 40vw; flex-basis: 40vw; min-width: 40vw; position: relative; } .ai-image img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .alioth-seperator { display: block; width: 0%; height: 1px; background: rgba(25, 27, 29, .6); float: left; } .alioth-seperator.align-center { float: none; margin: 0 auto; } .alioth-seperator.align-right { float: right } .linked-text { display: block; float: left; pointer-events: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .linked-text.loaded { pointer-events: all } .linked-text a { text-decoration: none; color: #191b1d; position: relative; display: inline-block } .linked-text a > div { background-repeat: repeat; -webkit-background-clip: text; background-repeat: repeat; -webkit-background-clip: text; padding-right: 4px; margin-right: -4px; } .linked-text a::before { content: ""; position: absolute; width: 0%; height: 12px; background: #191b1d; bottom: 0; left: 0; border-top: 2px solid #fff; -webkit-box-sizing: content-box; box-sizing: content-box; z-index: 1; -webkit-transition: all .7s ease; -o-transition: all .7s ease; transition: all .7s ease } .linked-text.loaded a:hover::before { width: 0% } .linked-text.loaded a::before { width: 100%; } .linked-line { overflow: hidden; padding-right: 5px; } .linked-text .link-target { display: block; color: rgba(25, 27, 29, .6) } body.dark .linked-text a::before, .linked-text.light a::before { background: #fff; border-top: 2px solid #191b1d } body.dark .link-target, .linked-text.light .link-target { color: hsla(0, 0%, 100%, .2) } body.dark .linked-text a, .linked-text.light a { color: #fff } .alioth-services { overflow: hidden; margin-top: 0 } .alioth-services .services { display: block; width: 100%; float: left; } .alioth-services .service-title { font-size: 80px; line-height: 100px; font-weight: 700; letter-spacing: -0.07em; cursor: pointer; display: block; float: left; padding: 60px 0; overflow: hidden; } .alioth-services .service-title .ser_tit_line { overflow: hidden; padding-right: 10px } .alioth-services .service-wrap { overflow: hidden; margin-left: 10px; display: block; float: left; position: relative; } .alioth-services .service-wrap::before { content: ""; display: block; position: absolute; top: 0; width: 100%; height: 1px; background: #191b1d; } .alioth-services .service { display: block; position: relative; float: left; width: 100% } .alioth-services .service::after { content: ""; display: block; width: 100%; height: 1px; background: rgba(25, 27, 29, .2); position: absolute; bottom: 0 } .alioth-services .service-toggle { display: block; float: right; padding: 60px 0 } .alioth-services .service-toggle i { float: right; font-size: 50px; vertical-align: middle; display: block; } .alioth-services .service-cont { display: block; float: right; width: 65%; padding-right: 50px; -webkit-box-sizing: border-box; box-sizing: border-box; opacity: 0; padding-top: 60px; padding-bottom: 60px; } .alioth-services.dark .service-toggle, body.dark .alioth-services .service-toggle, body.dark .alioth-services .service-title, .alioth-services.dark .service-title { color: #fff; } body.dark .alioth-services .service::after, .alioth-services.dark .service::after { background: hsla(0, 0%, 100%, .2); } body.dark .alioth-services .service-wrap::before, .alioth-services.dark .service-wrap::before { background: #fff; } .alioth-services.light .service-toggle, .alioth-services.light .service-title { color: #191b1d !important; } .alioth-services.light .service::after { background: rgba(25, 27, 29, .6) !important } .alioth-services.light .service-wrap::before { background: #191b1d !important; } .a-testimonials { display: block; width: 100%; } .a-testimonial { position: absolute; visibility: hidden } .a-testimonial.active { visibility: visible } .testimonial-text { font-weight: 700; font-size: 36px; letter-spacing: -0.05em; line-height: 48px; margin-bottom: 40px; } .testimonial-meta { display: inline-block; } .testimonial-name, .testimonial-brand { font-size: 16px; font-weight: 400; letter-spacing: -0.05em; line-height: 25px } .testimonial-name { margin-bottom: 10px; } .a-testimonials.dark .testimonial-brand { font-weight: 400; color: #9d9d9d; } .testimonial-name, .testimonial-brand { font-weight: 500; } .a-testimonals-control { display: block; margin-bottom: 30px } .a-testimonials-wrapper { display: block; width: 100%; position: relative; } .a-test-prev, .a-test-next { display: inline-block; font-size: 18px; cursor: pointer; } .a-test-prev { margin-right: 10px; } .a-test-next { margin-left: 10px; } .a-test-frac { display: inline-block; } span.a-test-current, span.a-test-total { font-size: 14px; font-weight: 600; color: #191b1d; opacity: .7; letter-spacing: -0.05em; } .a-test-prev::after, .a-test-next::before { content: ""; width: 10px; height: 1px; display: inline-block; background: #000; vertical-align: middle; margin-top: -2.4px; } .a-test-next::before { margin-right: -11px; } .a-test-prev::after { margin-left: -11px; } .cakomako { display: block; } .testimonial-meta div, .testimonial-text div { display: block; overflow: hidden; } .testimonial-meta div span, .testimonial-text div span { display: block } .a-testimonials-count { display: inline-block; width: 30px; height: 1px; background: #191b1d; vertical-align: middle; margin-top: -3px; margin-left: 10px; margin-right: 10px; position: relative; } .a-testimonials.autoplay .a-testimonials-count { width: 100px; background: rgba(25, 27, 29, .2); } .a-testimonials-count span { position: absolute; left: 0; width: 0%; height: 100%; background: #191b1d; } body.dark .a-testimonials.autoplay .a-testimonials-count { background: hsla(0, 0%, 100%, .2) } body.dark .a-testimonials-count span { background: #fff } body.dark span.a-test-current, body.dark span.a-test-total, body.dark .a-test-prev, body.dark .a-test-next, body.dark .testimonial-text, body.dark .testimonial-name, .a-testimonials.light span.a-test-current, .a-testimonials.light span.a-test-total, .a-testimonials.light .a-test-prev, .a-testimonials.light .testimonial-text, .a-testimonials.light .a-test-next { color: #fff; } .a-testimonials.light .testimonial-brand, .a-testimonials.light .testimonial-name { color: hsla(0, 0%, 100%, .4); } body.light span.a-test-current, body.light span.a-test-total, body.light .a-test-prev, body.light .a-test-next, body.light .testimonial-text, body.light .testimonial-name, .a-testimonials.dark span.a-test-current, .a-testimonials.dark span.a-test-total, .a-testimonials.dark .a-test-prev, .a-testimonials.dark .a-test-next, .a-testimonials.dark .testimonial-text, .a-testimonials.dark .testimonial-name { color: #191b1d; } .a-testimonials.light .a-testimonials-count { background: hsla(0, 0%, 100%, .4); } .a-testimonials.light .a-testimonials-count span { background: #fff; } .alioth-clients { display: block; width: 100%; float: left; } .a-client { display: block; float: left; margin-bottom: 50px; } .a-client a { margin: 0 auto; display: inline-block; width: 100%; height: 100%; text-align: center; } .alioth-clients.column-5 .a-client { width: 20%; } .alioth-clients.column-4 .a-client { width: 25%; } .alioth-clients.column-3 .a-client { width: 33.3333333%; } .alioth-clients.column-2 .a-client { width: 50%; } .alioth-clients.column-1 .a-client { width: 100%; } .a-client img { width: 100%; } .alioth-awards { display: block; position: relative; overflow: hidden; float: left; width: 100% } .a-award { display: block; width: 100%; float: left; padding-bottom: 20px; margin-bottom: 30px; position: relative; } .a-award a { text-decoration: none; display: block; overflow: hidden; } .award-dets { display: block; float: left; } .award-date { display: block; float: right; margin-top: 0.4em; } .award-title, .award-date { color: #fff; font-size: 25px; font-weight: 700; letter-spacing: -0.04em; display: block; overflow: hidden } .award-title span, .award-date span, .award-loc span { display: block; } .award-loc { color: hsla(0, 0%, 100%, .4); font-size: 20px; margin-top: 10px; font-weight: 600; letter-spacing: -0.05em; display: block; overflow: hidden } .a-award::after { content: ""; display: block; position: absolute; bottom: 0; left: 0; width: 0%; background: hsla(0, 0%, 100%, .2); height: 1px; -webkit-transition: width .7s ease .4s; -o-transition: width .7s ease .4s; transition: width .7s ease .4s; } .a-award.is_inview::after { width: 100%; } .award-date { color: hsla(0, 0%, 100%, .4); } .alioth-awards.light .award-title, .alioth-awards.light .award-date { color: #191b1d; } .alioth-awards.light .award-loc { color: rgb(25 27 29 / 69%); } .alioth-awards.light .a-award::after { background: rgba(25, 27, 29, .2); } .a-recent-works { display: block; padding-top: 10%; padding-bottom: 0; } .recent-works-wrapper { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; width: auto; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .ar-work { display: block; margin-right: 100px; -ms-flex-preferred-size: 40vw; flex-basis: 40vw; min-width: 40vw; position: relative; } .ar-work a { text-decoration: none; display: block; overflow: hidden; } .ar-work-image, .ar-work-image img { width: 100%; height: 100% !important; -o-object-fit: cover; object-fit: cover; } .ar-work-title { font-size: 45px; font-weight: 700; letter-spacing: -0.05em; padding: 20px 20px 0 20px; color: #191b1d } body.dark .ar-work-title, .a-recent-works.dark .ar-work-title { color: #fff } .ar-work-cat { font-size: 25px; font-weight: 700; letter-spacing: -0.02em; padding-left: 20px; color: rgba(25, 27, 29, .6); } .project-cat span > span, .ar-work-cat span { display: inline-block; position: relative; } .project-cat span > span::before, .ar-work-cat span::before { content: "/"; display: inline-block; margin: 0 5px; } .project-cat span > span:first-child::before, .ar-work-cat span:first-child::before { display: none; } body.dark .ar-work-cat, .a-recent-works.dark .ar-work-cat { color: hsla(0, 0%, 100%, .4) } .recent-works-bg-text { position: absolute; top: 0; -webkit-transform: translateX(50%); -ms-transform: translateX(50%); transform: translateX(50%); font-size: 200px; white-space: nowrap; font-weight: 700; letter-spacing: -0.06em; color: rgba(25, 27, 29, 0.2); pointer-events: none; } body.dark .recent-works-bg-text { color: rgba(255, 255, 255, 0.2) } .recent-works-button { text-align: center; margin-top: 75px; display: block; } .a-recent-works-nav { position: relative; display: block; margin-bottom: 50px; } .a-recent-works .a-button.style_1 { left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); margin-top: 100px; } .a-recent-works.navby-scroll .a-recent-works-nav { display: none } .a-recent-works-nav div { display: block; float: left; cursor: pointer; } .a-recent-works-nav div i { font-size: 25px; } .a-recent-works.dark .recent-works-bg-text, .a-recent-works.dark .ar-work-cat { color: hsla(0, 0%, 100%, .2); } .a-recent-works.dark .a-recent-works-nav div, .a-recent-works.dark .ar-work-title { color: #fff } .a-recent-works.dark .a-button.style_1 { background-color: hsla(0, 0%, 100%, .2); } .alioth-heading { position: relative; display: block; } .heading-bg-text { position: absolute; bottom: 0; left: 0; -webkit-transform: translatex(-30%) translateY(50%); -ms-transform: translatex(-30%) translateY(50%); transform: translatex(-30%) translateY(50%); z-index: -1; font-size: 250px; white-space: nowrap; display: block; font-weight: 700; letter-spacing: -0.06em; color: hsl(0deg 0% 0% / 3%); z-index: 0; } .alioth-heading.dark .heading-bg-text, body.dark .heading-bg-text { color: hsla(0, 0%, 100%, .01) } .alioth-heading .ah-title { z-index: 1 } .alioth-heading.no-image .ah-image { display: none } .alioth-heading.will_anim.with_image .ah-title { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100%; text-align: center; } .alioth-heading.will_anim.with_image .ah-image { display: block; max-width: 60%; margin: 0 auto } .alioth-heading.will_anim.with_image .ah-image img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover } .alioth-team-member { display: block; width: 100%; position: relative; } .elementor-widget-aliothteammeber { margin-bottom: 0 !important; } .member-image, .member-image img { display: block; width: 100%; -o-object-fit: cover; object-fit: cover; } .member-meta { position: absolute; left: 10%; bottom: 10%; } .member-name { font-size: 30px; font-weight: 700; color: #fff; letter-spacing: -0.04em; line-height: 39px; } .member-title { color: hsla(0, 0%, 100%, .4); font-size: 20px; font-weight: 700; letter-spacing: -0.03em; } .member-socials li { font-size: 20px; font-weight: 700; letter-spacing: -0.04em; line-height: 30px; display: block; overflow: hidden; padding: 0; } .member-socials li a { text-decoration: none; display: block; color: hsla(0, 0%, 100%, .4); -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%); -webkit-transition: all .6s cubic-bezier(0.22, 1, 0.36, 1); -o-transition: all .6s cubic-bezier(0.22, 1, 0.36, 1); transition: all .6s cubic-bezier(0.22, 1, 0.36, 1); } .member-socials li a:hover { color: hsla(0, 0%, 100%, 1); } .member-socials { position: absolute; top: 10%; left: 10%; } .alioth-team-member:hover .member-socials a { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0) } .member-socials ul { padding: 0; list-style: none; } .scrollable-text { white-space: nowrap; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; } .alioth-personal-head { display: block; position: relative; width: 100%; height: 100vh; overflow: hidden; background-position: center; background-repeat: no-repeat; background-size: cover; background: -o-radial-gradient(circle, rgba(255, 255, 255, 1) 0%, rgba(200, 200, 200, 1) 100%); background: radial-gradient(circle, rgba(255, 255, 255, 1) 0%, rgba(200, 200, 200, 1) 100%) } .aph-image { position: absolute; bottom: 0; width: 35%; left: 50%; -webkit-transform: translatex(-50%); -ms-transform: translatex(-50%); transform: translatex(-50%); z-index: 5; -webkit-transform-origin: bottom; -ms-transform-origin: bottom; transform-origin: bottom } .aph-image img { width: 100%; display: block } .aph-details { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 84%; height: 200px } .aph-name { font-size: 200px; font-weight: 700; letter-spacing: -0.07em; text-align: center; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100%; z-index: 6; pointer-events: none; overflow: hidden } .alioth-personal-header.dark .aph-name, body.dark .aph-name { color: #fff } .aph-name.back { z-index: 4 } .aph-name .name-back { opacity: 0; visibility: hidden } .aph-name.back .name-front { opacity: 0; visibility: hidden; } .aph-name.back .name-back { opacity: 1; visibility: visible } .aph-welc { position: absolute; top: 0; left: 15%; font-size: 40px; font-weight: 700; letter-spacing: -0.06em; -webkit-transform: translateY(-100%); -ms-transform: translateY(-100%); transform: translateY(-100%); color: rgba(25, 27, 29, .6); overflow: hidden } .aph-sub-text { position: absolute; right: 0; max-width: 30%; -webkit-transform: translateY(200px); -ms-transform: translateY(200px); transform: translateY(200px); font-size: 20px; font-weight: 600; letter-spacing: -0.06em; line-height: 30px; color: rgba(25, 27, 29, .6); bottom: 0; } .aph_sub_line { overflow: hidden } .aph_sub_line span { display: block } body.dark .aph-sub-text, .alioth-personal-header.dark .aph-sub-text, .alioth-personal-header.dark .aph-welc, body.dark .aph-welc { color: hsla(0, 0%, 100%, .4) } .circular-button { position: absolute; bottom: 10%; left: 20%; background: #191b1d; border-radius: 50%; width: 150px; height: 150px; text-decoration: none; color: #fff; } .circular-button.dark, body.dark .circular-button { color: #fff; background: #101010 } .circular-button span { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100%; text-align: center; z-index: 2; opacity: 0 } a.circular-button::after { content: ""; position: absolute; width: 0%; height: 0%; background: #ebebeb; border-radius: 50%; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-transition: all .6s ease; -o-transition: all .6s ease; transition: all .6s ease; z-index: 1 } a.circular-button.dark::after, body.dark a.circular-button::after { background: #fff } a.circular-button:hover::after { width: 100%; height: 100%; } a.circular-button:hover { color: #191b1d } a.circular-button.dark:hover, body.dark a.circular-button:hover { color: #191b1d } .circular-button span i { display: block; margin-top: 10px } .a-button.light a, .a-button a { color: #fff; text-decoration: none; position: relative; z-index: 1; -webkit-transition: color .5s ease; -o-transition: color .5s ease; transition: color .5s ease; padding: 20px 30px 20px 40px; display: block; float: left; } .a-button i { display: inline-block; vertical-align: middle; margin-left: 20px; } .a-button.style_1.light, .a-button.style_1 { display: inline-block; background-color: #191b1d; margin: 25px 0; border-radius: 30px; position: relative; overflow: hidden } .a-button.style_1.dark, body.dark .a-button.style_1 { background-color: hsla(0, 0%, 100%, .2) } .a-button.style_1.light { background-color: #191b1d } .a-button.light::before, .a-button.style_1::before { content: ""; display: block; position: absolute; top: 0; left: 0; background: #b7babe; border-radius: 0px; height: 100%; width: 0%; -webkit-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease; } .a-button.style_1:hover::before { width: 100%; border-radius: 25px; } .a-button.light:hover i, .a-button.light:hover a, .a-button.style_1:hover i, .a-button.style_1:hover a { color: #191b1d } a.inner-button { font-size: 20px; font-weight: 700; letter-spacing: -0.06em; text-decoration: none; color: hsla(0, 0%, 100%, .4); -webkit-transition: color .3s ease; -o-transition: color .3s ease; transition: color .3s ease; } a.inner-button:hover { color: #fff; } a.inner-button.dark { color: rgba(25, 27, 29, .6) } a.inner-button.dark:hover { color: #191b1d; } .alioth-button { display: block; } .alioth-button.align-right a.button { float: right } .alioth-button.align-center { text-align: center } .alioth-button.button-text a.button { background: none !important; } .alioth-button.button-text .a-button { background: none !important; } .alioth-button.button-text .a-button a { color: rgba(25, 27, 29, .6); font-size: 20px; font-weight: 700; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; padding: 0; letter-spacing: -0.06em; } .alioth-button.button-text .a-button a:hover { color: #191b1d; } .alioth-button.button-text .a-button a::before { display: none; } .alioth-button.button-text .a-button .button-overlay { display: none !important; } .alioth-button.button-text .a-button::before { display: none !important; } .project-page-header { display: block; width: 100%; overflow: hidden } .project-featured-image img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .project-featured-video, .project-featured-video .plyr { width: 100%; height: 100%; } .project-featured-video video { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover } .project-featured-video .plyr--video .plyr__control.plyr__tab-focus, .project-featured-video .plyr--video .plyr__control:hover, .project-featured-video .plyr--video .plyr__control[aria-expanded="true"] { background: #000 } .project-featured-video .plyr__control--overlaid { background: #000; } .project-featured-video .plyr__video-embed iframe { top: 0%; height: 100%; width: 100%; } .portfolio-showcase .plyr--full-ui.plyr--video .plyr__control--overlaid { display: none; } .project-title { -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); overflow: hidden; display: block } .project-title h1.big-title { margin: 0; display: block; font-size: 110px; line-height: 127px } .project-title h1 .tit_word { overflow: hidden; margin-top: -30px; padding-right: 10px } .project-title h1 .tit_word span { display: block } .project-details { display: block; width: 100%; } .project-details { display: block; width: 75%; margin: auto; overflow: hidden } .project-page-header.style_1 .project-details { overflow: visible } .project-meta { display: block; float: left; padding-left: 9px; -webkit-box-sizing: border-box; box-sizing: border-box; } .project-metas { margin-top: -30px; overflow: hidden } .project-meta.project-cats { width: 35%; } .project-meta.meta-summary { width: 65%; } .project-cat { font-size: 30px; font-weight: 700; letter-spacing: -0.06em; margin-bottom: 25px; line-height: 40px } .project-meta.meta-summary h5, .project-other h5, .project-cat { color: rgba(25, 27, 29, .6); } body.dark .project-meta.meta-summary h5, .project-page-header.dark .project-meta.meta-summary h5, body.dark .project-other h5, .project-page-header.dark .project-other h5, body.dark .project-cat, .project-page-header.dark .project-cat { color: hsla(0, 0%, 100%, .4) } .project-page-header.style_1 { margin-bottom: 100px } .project-page-header.style_1 .project-featured-image { height: 55vh; width: 100%; } .project-page-header.style_1 .project-featured-image img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center; } .project-page-header.style_2 .project-featured-image { height: 100vh; margin-bottom: 50px; overflow: hidden } .project-page-header.style_2::before { display: none } .project-page-header.style_2 .project-head { position: absolute; top: 50vh; left: 12.5%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .project-page-header.style_2 .project-title { -webkit-transform: none; -ms-transform: none; transform: none; margin-bottom: 0; display: block; overflow: hidden } .project-page-header.style_2 .project-cat .cat-char, .project-page-header.style_2 .project-title .tt-char { -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%) } .tt-line { overflow: hidden; padding-right: 5px } .project-page-header.style_2 .project-cat { font-size: 50px; margin-left: 6px; display: block; overflow: hidden; line-height: 60px } .project-page-header.style_2 { margin-bottom: 100px } .project-page-header.style_2 .project-metas { margin-top: 0 } .project-page-header.style_2 .project-meta.project-other { width: 35% } .project-page-header.style_2 .project-meta.project-summary { width: 65% } .project-page-header.style_3 { display: block; margin-bottom: 100px } .project-page-header.style_3 .project-title { -webkit-transform: none; -ms-transform: none; transform: none; margin-bottom: 35px; display: block; overflow: hidden } .project-page-header.style_3 .project-head { display: block; background: #ebebeb; padding: 15% 8.5% 20px 8.5%; } body.dark .project-page-header.style_3 .project-head, .project-page-header.dark.style_3 .project-head { background: #131313 } .project-page-header.style_3 .big-title { font-size: 100px; margin-bottom: 20px; overflow: hidden; display: block } .project-page-header .project-other span, .project-page-header .summ_line span, .project-page-header .project-cat .cat-char, .project-page-header .big-title .tt-char { -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%) } .project-page-header.style_3 .project-details { width: 84%; margin-top: 40px; } .project-page-header.style_3 .project-metas { margin-top: 0 } .project-page-header.style_3 .project-meta.project-other { width: 40% } .project-page-header.style_3 .project-meta.meta-summary { width: 60% } .project-page-header.style_3 .project-cat { font-size: 50px; margin-top: -30px; line-height: 60px } .project-title .tit_word, .project-cat, .summ_line, .project-other h5 { overflow: hidden } .project-cat span, .summ_line span, .project-other span, .project-title .tit_word span { display: block; } .project-other h5 > span span { display: inline-block; } .project-other h5 > span span:last-child::before { content: ""; display: inline-block; width: 20px; height: 1px; background: rgba(25, 27, 29, .6); vertical-align: middle; margin: 0 10px; } body.dark .project-other h5 > span span:last-child::before { background: hsla(0, 0%, 100%, .2); } s .next-project-section { overflow: hidden; margin-bottom: 0; position: relative } .next-project-section a { display: block; width: 100%; height: 100%; overflow: hidden; padding-top: 150px; padding-bottom: 40px; } .next-project-section::after { content: ""; display: block; position: absolute; top: 0; left: 0; background: #f1f1f1; z-index: -1; width: 100%; height: 100%; -webkit-transition: height .8s cubic-bezier(.25, .74, .22, .99); -o-transition: height .8s cubic-bezier(.25, .74, .22, .99); transition: height .8s cubic-bezier(.25, .74, .22, .99) } body.dark .next-project-section::after { background: #101010; } .next-project-section:hover::after { height: 0% } .next-project-wrap, .next-project-wrap h1 { color: #191b1d; display: block; float: left; width: 100%; position: relative; -webkit-transition: color .1s ease .1s; -o-transition: color .1s ease .1s; transition: color .1s ease .1s } body.dark .next-project-wrap, body.dark .next-project-wrap h1 { color: #fff !important } .next-project-section:hover .next-project-wrap h1::before { background: #191b1d } .next-project-wrap span { display: block; margin-bottom: 20px; font-size: 16px; opacity: .6; } .next-project-wrap h1::after { content: "\eab8"; font-family: 'IcoFont'; display: block; float: right; text-align: right; font-weight: normal; font-size: 60px; -webkit-transition: 0; -o-transition: 0; transition: 0; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease } .next-project-section:hover .next-project-wrap h1::after { -webkit-transform: translateX(10px); -ms-transform: translateX(10px); transform: translateX(10px); opacity: 0 } .next-project-image { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -2 } .next-project-image img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center; } .alioth-works { display: block; width: 100%; overflow: hidden; } .aw-project { display: block; margin-bottom: 200px; overflow: hidden; height: 500px } .aw-project-image, .aw-project img { height: 100% } .aw-project a { text-decoration: none; color: #191b1d } .aw-project-wrap { position: relative; overflow: hidden; height: 100% } .aw-project .aw-project-wrap::before { content: ""; display: block; position: absolute; right: 0; top: 0; width: 100%; height: 100%; background: #ebebeb; z-index: 1; -webkit-transition: width .8s cubic-bezier(0.54, 0.54, 0.14, 0.99); -o-transition: width .8s cubic-bezier(0.54, 0.54, 0.14, 0.99); transition: width .8s cubic-bezier(0.54, 0.54, 0.14, 0.99) } body.dark .aw-project .aw-project-wrap::before { background: #101010 } .aw-project.is_inview .aw-project-wrap::before { width: 0; } .alioth-works.column_2 .aw-works-sizer, .alioth-works.column_2 .aw-project { width: 45% } .alioth-works.column_3 .aw-works-sizer, .alioth-works.column_3 .aw-project { width: 30% } .alioth-works.column_3 .aw-project { margin-bottom: 100px } .alioth-works.column_3 .aw-works-gutter { width: 3% } .alioth-works.column_3 .aw-works-stamp { display: none } .aw-works-gutter { width: 10% } .alioth-works.no-gutter .aw-works-gutter { width: 0 } .alioth-works.no-gutter .aw-project { margin-bottom: 0 } .aw-works-stamp { position: absolute; right: 0; width: 10px; height: 100px; } .aw-project img { width: 100%; -o-object-fit: cover; object-fit: cover; height: 100% !important } .aw-project-meta { position: absolute; bottom: 40px; left: 40px; } .aw-project-title { font-size: 30px; font-weight: 700; letter-spacing: -0.06em; margin-bottom: 5px; } .aw-project-cat { font-size: 20px; font-weight: 600; font-weight: 700; letter-spacing: -0.05em; color: rgba(25, 27, 29, .6); } .aw-project-cat span { display: inline-block; } .aw-project-cat span::after { content: "/"; display: inline-block; vertical-align: middle; margin: 0 5px; color: hsla(0, 0%, 100%, .2); } .aw-project-cat span:last-child::after { display: none; } body.dark .aw-project-cat { color: hsla(0, 0%, 100%, .4) } body.dark .aw-project-title { color: #fff } .aw-categories { display: block; margin-bottom: 50px; } ul.aw-cats { padding: 0; list-style: none; } nav.alioth-works-pagination a { display: inline-block; font-size: 50px; opacity: .4; transition: opacity .4s ease; } nav.alioth-works-pagination a:hover { opacity: 1 } nav.alioth-works-pagination { display: block; text-align: center; } nav.alioth-works-pagination > div { display: inline-block; margin: 0 25px; } ul.aw-cats li { display: inline-block; text-decoration: none; color: rgba(25, 27, 29, .6); font-size: 30px; font-weight: 700; letter-spacing: -0.06em; cursor: pointer } ul.aw-cats li.active { color: #191b1d } ul.aw-cats li.active::after { color: #dbdbdb } ul.aw-cats li::after { content: "/"; margin: 0 10px; } ul.aw-cats li:last-child::after { display: none; } body.dark ul.aw-cats li { color: hsla(0, 0%, 100%, .2) } body.dark ul.aw-cats li.active { color: #fff } .alioth-products { display: block; } .alioth-products-wrapper { display: block; float: left; width: 100%; } .products-met { display: block; width: 100%; float: left; margin-bottom: 30px; } .products-met div { display: block; color: rgba(25, 27, 29, .6) } body.dark .products-met div { color: hsla(0, 0%, 100%, .2) } .products-count { float: left; } .products-sorting { float: left; } .alioth-products .product { position: relative; margin-bottom: 40px !important } .alioth-products.column_1 .product, .alioth-products.column_1 .grid-sizer { width: 100% } .alioth-products.column_2 .product, .alioth-products.column_2 .grid-sizer { width: 47.5% } .related-products .alioth-products.column_2 .product, .related-products .alioth-products.column_2 .grid-sizer { width: 30% } .related-products .alioth-products .product { height: 500px; } section.related-products { margin-top: 50px; border-top: 1px solid rgba(25, 27, 29, .1); } .alioth-products.column_3 .product, .alioth-products.column_3 .grid-sizer { width: 30% } .alioth-products.column_1 .gutter { width: 0 } .alioth-products.column_2 .gutter { width: 4.5% } .gutter { width: 40px } .alioth-products .product a { text-decoration: none; color: #191b1d } .alioth-products .product .product-image { width: 100%; height: 100%; overflow: hidden } .alioth-products .product .product-image img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -webkit-transition: all .7s ease; -o-transition: all .7s ease; transition: all .7s ease; -webkit-transform: scale(1.1) translateX(30px); -ms-transform: scale(1.1) translateX(30px); transform: scale(1.1) translateX(30px) } .alioth-products .product.is_inview .product-image img { -webkit-transform: scale(1) translateX(0); -ms-transform: scale(1) translateX(0); transform: scale(1) translateX(0) } .alioth-products .product:hover .product-image img { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1) } .product-details { position: absolute; top: 7%; left: 7%; z-index: 1 } .product-title { font-size: 30px; font-weight: 700; letter-spacing: -0.05em; margin-bottom: 11px; } .product-title h1 { margin-top: 0; margin-bottom: 0 } body.dark .product-acts a:hover, body.dark .product-title { color: #fff !important } .product-price { font-weight: 700; font-size: 20px; letter-spacing: -0.05em; color: rgba(25, 27, 29, .6); } .product-price ins { background: none; color: #191b1d; font-size: 22px; margin-left: 10px; } .product-price del { text-decoration-color: #191b1d; text-decoration-thickness: 2px; } body.dark .product-price { color: hsla(0, 0%, 100%, .4) } .widget-title { display: block; font-size: 20px; letter-spacing: -0.05em; font-weight: 700; margin-bottom: 30px; } .product-categories { display: block; width: 100%; } ul.product-cats { margin: 0; padding: 0; list-style: none } ul.product-cats li a { text-decoration: none; color: #191b1d } body.dark ul.product-cats li a { color: hsla(0, 0%, 100%, .2) } .product-acts { display: block; position: absolute; bottom: 7%; left: 7%; overflow: hidden } .product-acts a { display: block !important; font-size: 30px !important; font-weight: 700 !important; letter-spacing: -0.06em !important; color: rgba(25, 27, 29, .6) !important; -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%); -webkit-transition: color .1s ease, -webkit-transform .4s cubic-bezier(0.42, 0.39, 0.06, 0.99); transition: color .1s ease, -webkit-transform .4s cubic-bezier(0.42, 0.39, 0.06, 0.99); -o-transition: transform .4s cubic-bezier(0.42, 0.39, 0.06, 0.99), color .1s ease; transition: transform .4s cubic-bezier(0.42, 0.39, 0.06, 0.99), color .1s ease; transition: transform .4s cubic-bezier(0.42, 0.39, 0.06, 0.99), color .1s ease, -webkit-transform .4s cubic-bezier(0.42, 0.39, 0.06, 0.99); background: none !important; padding: 0 !important; } body.dark .product-acts a { color: hsla(0, 0%, 100%, .2) !important } .product-acts a:hover { color: #191b1d !important } .alioth-products .product:hover .product-acts a { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0) } .alioth-products .product::before { content: ""; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #ebebeb; z-index: 2; -webkit-transition: width 1s cubic-bezier(0.54, 0.54, 0.14, 0.99); -o-transition: width 1s cubic-bezier(0.54, 0.54, 0.14, 0.99); transition: width 1s cubic-bezier(0.54, 0.54, 0.14, 0.99); } body.dark .alioth-products .product::before { background: #101010; } .alioth-products .product.is_inview::before { width: 0%; } .woocommerce nav.woocommerce-pagination { display: block; float: left; width: 100%; text-align: left; padding-left: 0; } .woocommerce nav.woocommerce-pagination ul { border: none; } .woocommerce nav.woocommerce-pagination ul li { border: none; font-size: 24px; font-weight: 600; line-height: 24px; } .woocommerce nav.woocommerce-pagination ul li a:focus, .woocommerce nav.woocommerce-pagination ul li a:hover, .woocommerce nav.woocommerce-pagination ul li span.current { background: none; color: #191b1d; } .woocommerce nav.woocommerce-pagination ul li a, .woocommerce nav.woocommerce-pagination ul li span { color: rgba(25, 27, 29, .4); font-weight: 700; } .product-page { padding-top: 200px; display: block; overflow: hidden; } .product-page::before { content: ""; display: block; width: 100%; height: 330px; background: #ebebeb; position: absolute; top: 0; z-index: -1; } .logged-in.admin-bar .product-page::before { height: 360px; } body.dark .product-page::before { background: #131313 } .single-product-wrap { display: block; width: 83%; margin: 0 auto; overflow: hidden } .single-product-slider { width: 50%; display: block; float: left; padding-left: 5%; position: relative; } .single-product-slider img { width: 100%; -o-object-fit: cover; object-fit: cover; height: 100%; } .single-product-slider .swiper-wrapper { flex-direction: column } .single-product-image { width: 50%; display: block; float: left; padding-left: 0; position: relative; } .single-product-details { display: block; width: 45%; float: left; padding-left: 60px; -webkit-box-sizing: border-box; box-sizing: border-box; } .product-review { display: block; width: 100%; margin-bottom: 10px; } ul.rate-proudct { list-style: none; padding: 0; display: inline-block; } ul.rate-proudct li { display: inline-block; font-size: 12px; } .product-review > span { display: inline-block; margin-left: 10px; font-size: 12px; } .product-review > span::before { content: "("; } .product-review > span::after { content: ")"; } .product-page .product-title { font-size: 28px !important; } .single-product-meta { display: block; width: 50%; float: left; margin-top: 50px; clear: both } ul.single-product-mets { list-style: none; padding: 0; text-align: center; } ul.single-product-mets li { display: inline-block; } ul.single-product-mets li a { font-size: 25px; font-weight: 700; letter-spacing: -0.05em; color: rgba(25, 27, 29, .6); text-decoration: none; } ul.single-product-mets li a.active { color: #191b1d } body.dark ul.single-product-mets li a { color: hsla(0, 0%, 100%, .4) } body.dark ul.single-product-mets li a.active { color: #fff } ul.single-product-mets li::after { content: "/"; margin-left: 7px; font-size: 25px; font-weight: 700; letter-spacing: -0.05em; color: rgba(25, 27, 29, .6); } body.dark ul.single-product-mets li::after { color: hsla(0, 0%, 100%, .2) } ul.single-product-mets li:last-child::after { display: none; } ul.single-product-mets li a:hover { color: #191b1d; } body.dark ul.single-product-mets li a:hover { color: #fff } .product-summary { display: block; margin-top: 25px; } .add-to-cart { display: inline-block; margin-top: 20px; margin-bottom: 20px; } .add-to-cart button { background: #ebebeb; border-radius: 40px; padding: 20px 40px; border: none } body.dark .add-to-cart button { background: #131313; color: #fff } .cart-add-quant { display: inline-block; margin-left: 20px; } span.caq-red, span.caq-inc { color: rgba(25, 27, 29, .6); cursor: pointer; } body.dark span.caq-red, body.dark span.caq-inc { color: hsla(0, 0%, 100%, .2) } .cart-add-quant span { font-weight: 700; } span.caq-tot { font-size: 25px; vertical-align: middle; display: inline-block; margin: 0 5px; } body.dark span.caq-tot { color: #fff } .product-dets { display: block; margin-top: 20px; } body.dark .product-dets .posted_in a, body.dark .product-dets .sku_wrapper span { color: #fff; } .product-dets div { display: block; margin-bottom: 20px; } .product-dets .sku_wrapper, .product-dets .posted_in { display: block; margin-bottom: 15px; } .product-dets .sku_wrapper { font-weight: 400; color: #929292; } .product-dets .sku_wrapper span { color: #191b1d; } .product-dets .posted_in, .product-dets .tagged_as { font-weight: normal; color: #929292; } .product-dets .posted_in a, .product-dets .tagged_as a { color: #191b1d; text-decoration: none; } .sp-dots.swiper-pagination-bullets { position: absolute; bottom: 0; left: 0; } .sp-dots .swiper-pagination-bullet { display: block; margin-bottom: 30px; background: none; font-size: 12px; font-weight: 700; color: #191b1d; opacity: .3; } .sp-dots .swiper-pagination-bullet.swiper-pagination-bullet-active { opacity: 1 } body.dark .sp-dots .swiper-pagination-bullet { color: #fff } .sp-arrows { position: absolute; left: 12%; bottom: 3%; z-index: 1; pointer-events: none } .sp-arrows div { font-size: 30px; display: inline-block; cursor: pointer; font-weight: bold; -webkit-transition: -webkit-transform .4s ease; transition: -webkit-transform .4s ease; -o-transition: transform .4s ease; transition: transform .4s ease; transition: transform .4s ease, -webkit-transform .4s ease; pointer-events: all } .sp-arrows div.sp-next:hover { -webkit-transform: translateY(-5px); -ms-transform: translateY(-5px); transform: translateY(-5px) } .sp-arrows div.sp-prev:hover { -webkit-transform: translateY(5px); -ms-transform: translateY(5px); transform: translateY(5px) } ul.single-product-mets .desc { display: block; position: fixed; right: 0; bottom: 0; z-index: 1; width: 46%; background: #ebebeb; padding: 40px 40px 80px 40px; -webkit-box-sizing: border-box; box-sizing: border-box; text-align: left; display: none; z-index: 2 } ul.single-product-mets .desc .desc-close { position: absolute; right: 40px; top: 40px; font-size: 30px; cursor: pointer; } body.dark ul.single-product-mets .desc { background: #131313 } .desc-self { margin: 0; } .related-products.alioth-products.column_3 { width: 84%; margin: 100px auto; } .related-products.alioth-products.column_3 .product, .related-products.alioth-products.column_3 .grid-sizer { width: 31%; } .alioth-products .product .sale-badge { position: absolute; top: 7%; z-index: 1; right: 7%; display: block; padding: 10px 15px; background: #191b1d; color: #fff; font-weight: 600; } body.darkc.alioth-products .product .sale-badge { background: #fff; color: #191b1d } .related-products.alioth-products.column_3 .product { height: 500px } .wrapper.related-wrap { max-width: 83%; } .related-products h3 { margin-left: 30px } td.woocommerce-grouped-product-list-item__price ins { background: none; } td.woocommerce-grouped-product-list-item__price del { opacity: .5; margin-right: 10px; } .alioth_add_to_cart .dcrs, .alioth_add_to_cart .incrs, .alioth_add_to_cart .quantity { display: inline-block; width: auto; margin: 0; } button.single_add_to_cart_button.button.alt { display: block; float: left; background: transparent; color: #191b1d; padding: 8px; font-weight: 400; margin-right: 15px; } .cart.grouped_form button.single_add_to_cart_button.button.alt { padding: 20px 30px; background: #ebebeb; border-radius: 35px; } .cart.grouped_form button.single_add_to_cart_button.button.alt:hover { background: #ebebeb !important; } .alioth_add_to_cart { display: block; overflow: hidden; background: #ebebeb; border-radius: 40px; padding: 20px 30px; } body.dark .alioth_add_to_cart { background: #101010; } body.dark button.single_add_to_cart_button.button.alt { color: #fff; } table.variations th.label { padding: 0; display: block; float: left; border: none; line-height: 4em } table.variations td { border: none; } table.variations select { padding: 12px; margin: 0; } form.variations_form.cart { position: relative; } a.reset_variations { position: absolute; right: 0; bottom: 10px; -webkit-transform: translateX(120%); -ms-transform: translateX(120%); transform: translateX(120%); color: #191b1d; font-weight: 600; } button.single_add_to_cart_button.button.alt.disabled.wc-variation-selection-needed { background: none; color: #191b1d; } .wc-proceed-to-checkout.a-button.style_1 { width: auto; padding: 0; float: right; margin-right: 20px; ; } #add_payment_method .wc-proceed-to-checkout a.checkout-button, .woocommerce-cart .wc-proceed-to-checkout a.checkout-button, .woocommerce-checkout .wc-proceed-to-checkout a.checkout-button { padding: 20px 30px; background: none; margin: 0; border: none; font-size: 1em; } .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: none !important; color: #191b1d } .woocommerce .cart .button, .woocommerce .cart input.button { float: none; padding: 0; border: none; } button.button.update_cart { padding: 0 } .actions { display: block; width: 100%; border-bottom: 1px solid rgba(25, 27, 29, .2); overflow: hidden; margin-bottom: 35px; } .woocommerce a.remove { color: #191b1d !important; font-weight: 400; font-size: 20px; border: 1px solid #191b1d; height: 30px; width: 30px; line-height: 27px; } .woocommerce a.remove:hover { background: #191b1d !important } input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } .quantity input[type="number"] { background: none !important; display: block; float: left; font-weight: 700; margin: 0 10px; font-size: 25px; width: 50px !important; line-height: 1 } .quantity { display: inline-block; } .coupon { display: block; float: left; } .coupon > div { display: block; float: left; } input#coupon_code { padding: 0; background: none; border: 1px solid rgba(25, 27, 29, .2); padding: 20px; } input#coupon_code:focus { border: 1px solid rgba(25, 27, 29, .2) !important; } .a-update-cart { display: block; float: right; } .incrs, .dcrs { cursor: pointer; color: rgba(25, 27, 29, .6); -webkit-transition: color .3s ease; -o-transition: color .3s ease; transition: color .3s ease; font-size: 20px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; display: inline-block; vertical-align: top; } .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button { background: none; border: 1px solid #191b1d; border-radius: 20px; padding: 20px; border-radius: 0; } p.return-to-shop { text-align: center; } .alioth-products a.button { border: none !important } #add_payment_method .wc-proceed-to-checkout, .woocommerce-cart .wc-proceed-to-checkout, .woocommerce-checkout .wc-proceed-to-checkout { display: block; float: left } form.woocommerce-cart-form { width: 70%; float: left; } .woocommerce .cart-collaterals, .woocommerce-page .cart-collaterals { width: 30%; float: left; } .woocommerce .cart-collaterals .cart_totals, .woocommerce-page .cart-collaterals .cart_totals { float: left; width: 100%; background: none } .woocommerce .quantity .qty { padding: 0 } .cart_totals a { color: #191b1d; font-weight: 600; } .item-vars { display: block; width: 100%; float: left; margin-bottom: 10px } .variation.cart-product-quants { display: block; overflow: hidden; } .cart-toggle { position: relative; width: 30px; height: 30px; cursor: pointer } .shopping-cart i { font-size: 35px; color: #191b1d; } .cart-wrapper { display: block; float: left; padding-right: 30px } .cart-wrapper input#coupon_code { padding: 0; border: none; border-right: 1px solid rgba(25, 27, 29, .2); } .cart-wrapper input#coupon_code:focus { border: none !important; } .cart-wrapper .coupon-code { margin-right: 15px; } .cart-wrapper .coupon button.button { font-weight: 600; } .cart-wrapper .coupon button.button:hover { background: none; color: #191b1d; } .cart-wrapper button.button.update_cart { padding: 0.618em 1em; } .cart-produtcs { display: block; width: 100%; padding: 0 70px; margin-top: 100px } .cart-product { display: block; width: 100%; float: left; margin-bottom: 50px; position: relative } .cart-product-image { display: block; width: 30%; float: left; height: 100%; } .cart-product-image img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .cart-product-details { display: block; float: left; width: 70%; position: relative; margin-top: 30px; padding-left: 30px; -webkit-box-sizing: border-box; box-sizing: border-box; } .woocommerce-form-coupon-toggle .woocommerce-info { background: none; color: #191b1d; padding-left: 2.5em; border-bottom: 1px solid rgba(25, 27, 29, .2); border-radius: 0; padding-top: 0; padding-bottom: 0; } .woocommerce-form-coupon-toggle .woocommerce-info a { color: #191b1d; font-weight: 600 } .woocommerce-form-coupon-toggle .woocommerce-info::before { color: #191b1d; left: 0; } .cart-product-title { display: block; margin-bottom: 30px; margin-top: 0; } .cart-product-title a { text-decoration: none; color: #191b1d; } .cart-product-quants .cpq { display: block; margin-bottom: 10px; font-size: 12px; float: left; line-height: 1 } .woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea { padding: 21px 15px; } .select2-container--default .select2-selection--single { padding: 15px; height: auto; background: #ebebeb; border: none; border-radius: 0; } .select2-container--default .select2-selection--single .select2-selection__arrow { top: 50%; transform: translateY(-50%); right: 20px; } .product-quantity { float: left; } .cpq.cpq-cont { margin-left: 5px; color: rgba(25, 27, 29, .6) } .cart-product-quants .cpq p { margin: 0; line-height: 1 } .cart-product-quants .cpq span { color: #9a9a9a; } .cart-product-remove { position: absolute; top: 30px; right: 0; cursor: pointer; z-index: 99 } .cpq-acts { display: block; width: 100%; margin-top: 15px; } .cpq-number, .cpq-price { display: block; } .cpq-number { float: left; } .cpq-price { float: right; font-size: 25px; font-weight: 700; letter-spacing: -0.06em; } .cart-acts { display: block; float: left; width: 100%; position: relative; } .cart-button { display: block; float: left; border: 1px solid #191b1d; border-radius: 35px; padding: 20px 35px; font-weight: 700; letter-spacing: -0.05em; width: 48%; -webkit-box-sizing: border-box; box-sizing: border-box; text-align: center; margin: 1%; cursor: pointer; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } body.dark .cart-button { border: 1px solid #fff; } .cart-button:hover { color: #fff; border: 1px solid #fff; background: #191b1d } body.dark .cart-button:hover { color: #191b1d; border: 1px solid #191b1d; background: #fff } .cart-totals { display: block; float: left; width: 100%; padding-left: 25px; } .cart-totals .cart-product-details { margin-top: 0 } .cart-totals .cart-product-title { margin-bottom: 15px } .ct-title { display: block; padding-bottom: 20px; position: relative; margin-bottom: 20px; padding-left: 20px; } .ct-title::before { content: ""; display: block; position: absolute; left: 0; bottom: 0; background: rgba(25, 27, 29, .2); width: 100%; height: 1px; } body.dark .ct-total::before, body.dark .ct-title::before { background: hsla(0, 0%, 100%, .2) } .ct-title h4 { margin: 0; } .ct-prices { display: block; float: left; width: 100%; } .ct-prices > div, .ct-total { display: block; float: left; width: 100%; padding: 0 20px; -webkit-box-sizing: border-box; box-sizing: border-box; color: rgba(25, 27, 29, .6); margin: 15px 0; } body.dark .ct-prices > div, body.dark .ct-total { color: hsla(0, 0%, 100%, .4) } .ct-prices > div span, .ct-total span { font-weight: 700; letter-spacing: -0.06em; font-size: 20px; float: right; color: #191b1d; } body.dark .ct-prices > div span, body.dark .ct-total span { color: #fff; } .ct-coupon { display: block; float: left; margin-top: 30px; width: 100%; margin-bottom: 30px; } .ct-total::before { content: ""; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 1px; background: rgba(25, 27, 29, .2); } .ct-total { position: relative !important; margin-top: 10px !important; padding-top: 15px !important; } .cpq-number span { font-size: 20px; display: inline-block; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } span.cpq-num { font-weight: 700; margin: 0 10px; font-size: 25px; } .cpq-increase, .cpq-reduce { cursor: pointer; color: rgba(25, 27, 29, .6); -webkit-transition: color .3s ease; -o-transition: color .3s ease; transition: color .3s ease; } body.dark .cpq-increase, body.dark .cpq-reduce { color: hsla(0, 0%, 100%, .2); } .cpq-increase:hover, .cpq-reduce:hover { color: #191b1d } body.dark .cpq-increase:hover, body.dark .cpq-reduce:hover { color: #fff } ul.check-payments { margin: 0; padding: 0; list-style: none; margin-left: 8px; } ul.check-payments li { display: inline-block; font-size: 25px; font-weight: 700; letter-spacing: -0.06em; cursor: pointer; color: rgba(25, 27, 29, .6); -webkit-transition: color .3s ease; -o-transition: color .3s ease; transition: color .3s ease; } body.dark ul.check-payments li { color: hsla(0, 0%, 100%, .4) } ul.check-payments li::after { content: "/"; display: inline-block; margin: 0 10px; } ul.check-payments li:last-child::after { display: none; } ul.check-payments li:hover { color: #191b1d; } body.dark ul.check-payments li:hover { color: hsla(0, 0%, 100%, .2) } .woocommerce #reviews #comments ol.commentlist { display: block; width: 100%; } .woocommerce #reviews #comments ol.commentlist li { display: block; width: 100%; } .woocommerce #reviews #comments ol.commentlist li::after { display: none; } #review_form span#reply-title { margin-bottom: 15px; display: block; } p.stars { display: block; float: left; } .comment-form-rating label { display: block; position: static; float: left; left: unset; top: unset; -webkit-transform: none; -ms-transform: none; transform: none; margin-right: 20px; } div#order_review { display: block; float: left; width: 33%; } .woocommerce #reviews #comments h2 { font-size: 25px; margin: 0; } ul.single-product-mets .reviews_tab .desc { padding-bottom: 40px; } .woocommerce-noreviews { font-size: 12px; font-style: italic; opacity: .5; margin-top: 0; } .reviews_tab div#comments { display: block; border-bottom: 1px solid rgba(25, 27, 29, .3); margin-bottom: 30px; } .comment-form-rating { margin-bottom: 0; } div#customer_details { display: block; float: left; } div#customer_details.col2-set { width: 66%; } div#customer_details .col-1, div#customer_details .col-2 { width: 98%; float: left } #add_payment_method #payment, .woocommerce-cart #payment, .woocommerce-checkout #payment { background: none; } .comment-form-rating { margin-top: 30px; } .woocommerce p.stars a::before { font-size: 20px } .woocommerce #payment #place_order, .woocommerce-page #payment #place_order { float: left; background: #000; display: block; width: 100%; padding: 20px 15px; border-radius: 35px; transition: all .4s ease; } body.dark .woocommerce #payment #place_order:hover, body.dark .woocommerce-page #payment #place_order:hover { background: #ebebeb !important; color: #191b1d !important } #add_payment_method #payment, .woocommerce-cart #payment, .woocommerce-checkout #payment { padding-left: 25px; margin-top: 35px; display: block; overflow: hidden; } .woocommerce p.stars a { position: relative; height: auto; width: 0.8em; text-indent: -999em; display: inline-block; text-decoration: none; } body.dark #reviews #comments ol.commentlist li .comment-text { border: 1px solid hsla(0, 0%, 100%, .2) !important } body.dark .reviews_tab div#comments { border-bottom: 1px solid hsla(0, 0%, 100%, .2); } body.dark #review_form #respond textarea { border: 1px solid hsla(0, 0%, 100%, .2); } body.dark #review_form #respond textarea:focus { border: 1px solid hsla(0, 0%, 100%, .2) !important; } .woocommerce #reviews #comments ol.commentlist li img.avatar { border: none } p.woocommerce-review-link { margin: 0; font-size: 12px; } .woocommerce .woocommerce-product-rating .star-rating { margin-right: 15px; } .woocommerce #reviews #comments ol.commentlist li img.avatar { top: 50%; transform: translateY(-50%); } h2.woocommerce-Reviews-title span { text-decoration: underline; } .woocommerce #review_form #respond textarea { height: unset; } .woocommerce form.checkout_coupon { margin-top: 0; border: none; padding-top: 0; padding-left: 2.5em; overflow: hidden; display: block; float: left; width: 100%; border-bottom: 1px solid rgba(25, 27, 29, .2); } .woocommerce-form-coupon-toggle { margin-bottom: 35px; } .woocommerce form.checkout_coupon p { margin: 0; font-size: 14px; color: rgba(25, 27, 29, .6); float: left; } .woocommerce form.checkout_coupon p:first-child { display: block; width: 100%; } .woocommerce form.checkout_coupon p.form-row { display: inline-block; padding: 20px; padding-left: 0; } .woocommerce form.checkout_coupon button.button { border-color: rgba(25, 27, 29, .6); background: none; font-weight: 600; } .woocommerce form.checkout_coupon .clear { margin-bottom: 0; } body.dark .cart-product-title a { color: #fff; } body.dark .incrs, body.dark .dcrs { color: hsla(0, 0%, 100%, .2); } body.dark .woocommerce .quantity .qty { color: #fff; } body.dark .woocommerce a.remove { color: #fff !important; border-color: #fff; } body.dark nav.woocommerce-MyAccount-navigation ul li.is-active a { color: #fff; } body.dark nav.woocommerce-MyAccount-navigation ul li a { color: hsla(0, 0%, 100%, .2); } body.dark .woocommerce-form-coupon-toggle .woocommerce-info { background: none; color: #fff; border-color: hsla(0, 0%, 100%, .2); } body.dark .woocommerce-form-coupon-toggle .woocommerce-info a { color: #fff; } body.dark .woocommerce-form-coupon-toggle .woocommerce-info::before { color: #fff; } body.dark .woocommerce form.checkout_coupon p { color: hsla(0, 0%, 100%, .4); } body.dark input#coupon_code { border-color: hsla(0, 0%, 100%, .2); } body.dark input#coupon_code:focus { border-color: hsla(0, 0%, 100%, .2) !important; } body.dark .woocommerce form.checkout_coupon { border-color: hsla(0, 0%, 100%, .2); } body.dark .woocommerce form.checkout_coupon button.button { border-color: hsla(0, 0%, 100%, .5); } body.dark .select2-container--default .select2-selection--single { background: #131313; } span.select2-results { color: #191b1d; } body.dark .select2-container--default .select2-selection--single .select2-selection__rendered { color: hsla(0, 0%, 100%, .4); } body.dark .actions { border-color: hsla(0, 0%, 100%, .2); } .woocommerce .woocommerce-ordering select { vertical-align: top; -webkit-appearance: none; background-image: linear-gradient(45deg, transparent 50%, gray 50%), linear-gradient(135deg, gray 50%, transparent 50%); background-position: calc(100% - 20px) calc(1em + 2px), calc(100% - 15px) calc(1em + 2px), calc(100% - 2.5em) 0.5em; background-size: 5px 5px, 5px 5px, 1px 1.5em; background-repeat: no-repeat; padding: 8px 20px; margin-left: -7px; font-size: 12px; } .woocommerce-billing-fields .form-row label { color: rgba(25, 27, 29, .6); margin-bottom: 10px; font-size: 12px; } body.dark .woocommerce-billing-fields .form-row label { color: hsla(0, 0%, 100%, .4); } nav.woocommerce-MyAccount-navigation ul { list-style: none; } nav.woocommerce-MyAccount-navigation ul li { font-size: 25px; line-height: 50px; font-weight: 700; letter-spacing: -0.05em; } nav.woocommerce-MyAccount-navigation ul li a { color: rgba(25, 27, 29, .6); -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } nav.woocommerce-MyAccount-navigation ul li.is-active a { color: #191b1d; } nav.woocommerce-MyAccount-navigation ul li a:hover { color: #191b1d; } .woocommerce-error, .woocommerce-info, .woocommerce-message { border: none; margin: 0; background: #191b1d; color: #fff; font-size: 14px; padding-left: 4.5em; padding-right: 40px; padding-top: 15px; padding-bottom: 15px; border-radius: 40px; line-height: 3em; } .woocommerce-error::before, .woocommerce-info::before, .woocommerce-message::before { font-family: WooCommerce; display: inline-block; position: absolute; left: 1.5em; color: hsla(0, 0%, 100%, .2); top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); font-size: 20px; } .woocommerce-info::before { color: #fff } .woocommerce-notices-wrapper { position: fixed; bottom: 20px; left: 20px; z-index: 99; } .woocommerce .woocommerce-message a.button { color: #fff; margin-left: 30px; font-size: 14px; font-weight: normal; border: 1px solid #fff; padding: 10px 30px; border-radius: 20px; } .woocommerce .woocommerce-message a.button:hover { color: #191b1d; } a.cart-contents { position: relative; color: #191b1d; text-decoration: none; width: 30px; height: 40px; display: block; } a.cart-contents span { display: block; position: absolute; bottom: 0; right: 0; font-size: 10px; line-height: 10px; color: #191b1d; background: #ebebeb; padding: 4px; border-radius: 50%; width: 19px; height: 19px; text-align: center; -webkit-transform: translateX(50%); -ms-transform: translateX(50%); transform: translateX(50%); } .cart-icon, .cart-icon img { width: 100%; } .site-header.light .cart-icon-dark { display: none; } .site-header.dark .cart-icon-light { display: none; } .alioth-atc-ic { display: block; margin-top: -0.5em; } .site-header.dark a.cart-contents span { background: #191b1d; color: #fff; } .alioth-products-carousel { display: block; } .apc-cats { display: block; float: left; width: 100%; clear: both; margin-left: 7.5%; margin-bottom: 30px } .apc-cats ul { padding: 0; list-style: none; display: inline-block; overflow: hidden } .apc-cats ul li { font-size: 35px; font-weight: 700; letter-spacing: -0.06em; opacity: .3; display: inline-block; cursor: pointer; padding: 0; overflow: hidden } .apc-cats ul li span { display: inline-block } .apc-cats ul.locked { pointer-events: none; } .apc-cats ul li.active { opacity: 1; } .apc-cats ul li::after { content: "/"; display: inline-block; margin: 0 15px; } .will-anim .apc-cats ul li::after { content: "/"; display: inline-block; margin: 0 15px; transform: translateY(100%); transition: transform .5s ease; } .will-anim.done .apc-cats ul li::after { transform: translateY(0%) } .apc-cats ul li.active::after { opacity: .35; } .apc-cats ul li:last-child::after { display: none; } .apc-product-wrapper { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; width: auto; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; height: 600px; } .apc-product { display: block; height: 100%; margin-right: 30px; position: relative; width: 31.3vw; -ms-flex-preferred-size: 100%; flex-basis: 100%; } .apc-product:hover img { -webkit-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05); } .apc-product.hide { display: none } .apc-product-image { width: 100%; height: 100%; overflow: hidden } .apc-product-image img { width: 100%; height: 100% !important; -o-object-fit: cover; object-fit: cover; -webkit-transition: -webkit-transform .6s ease; transition: -webkit-transform .6s ease; -o-transition: transform .6s ease; transition: transform .6s ease; transition: transform .6s ease, -webkit-transform .6s ease; } .apc-product-det { position: absolute; bottom: 30px; left: 30px; } h3.apc-product-title { margin-bottom: 5px; } h4.apc-product-price { color: rgba(25, 27, 29, .6) !important } body.dark h4.apc-product-price { color: hsla(0, 0%, 100%, .2) !important } span.product-ov { position: absolute; top: 0; right: 0; width: 00%; height: 100%; background: #ebebeb; } body.dark span.product-ov { background: #101010 } .alioth-products-cta { display: block; width: 100%; position: relative; } .ap-cta-image { width: 100%; display: block } .ap-cta-image img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; display: block } .ap-cta-det { position: absolute; bottom: 70px; left: 70px; } .ap-cta-sub-title { font-size: 18px; } .ap-cta-title { font-size: 40px; font-weight: 700; letter-spacing: -0.06em; margin: 25px 0; line-height: 45px; } .ap-cta-button { display: block; } .ap-cta-button a { text-decoration: none; color: rgba(25, 27, 29, .6); font-size: 18px; font-weight: 600; letter-spacing: -0.05em; } .alioth-products-cta.pos-top .ap-cta-det { top: 70px; bottom: unset; } .alioth-products-cta.light .ap-cta-sub-title, .alioth-products-cta.light .ap-cta-title { color: #fff; } .alioth-products-cta.light .ap-cta-button a { color: hsla(0, 0%, 100%, .4); } .elementor-widget-aliothimagebox { margin-bottom: 0 !important } .alioth-product-categories { display: block; width: 100%; float: left; } .apcats-cat { display: block; width: 100%; float: left; padding: 40px 0; position: relative; } .apcats-cat a { text-decoration: none; color: #191b1d } body.dark .apcats-cat a { color: #fff } .apc-cat-title { font-size: 75px; font-weight: 700; letter-spacing: -0.06em; display: inline-block; -webkit-transition: -webkit-transform .4s ease; transition: -webkit-transform .4s ease; -o-transition: transform .4s ease; transition: transform .4s ease; transition: transform .4s ease, -webkit-transform .4s ease } .apc-cat-quant { display: inline-block; vertical-align: middle; font-size: 20px; font-weight: 700; letter-spacing: -0.06em; margin-left: 50px; } .apc-cat-quant::before { content: "/"; display: inline-block; margin-right: 3px; } .apcats-cat::before { content: ""; display: block; position: absolute; bottom: 0; width: 100%; height: 1px; background: rgba(25, 27, 29, .2); } body.dark .apcats-cat::before { background: hsla(0, 0%, 100%, .2) } .apcats-cat::after { content: ""; display: block; position: absolute; bottom: 0; width: 0%; height: 1px; background: #191b1d; -webkit-transition: width .4s ease; -o-transition: width .4s ease; transition: width .4s ease } body.dark .apcats-cat::after { background: #fff } .apc-cat-mark { position: absolute; right: 0; top: 50%; -webkit-transform: translate(-25%, -50%); -ms-transform: translate(-25%, -50%); transform: translate(-25%, -50%); font-size: 50px; } .apcats-cat:hover .apc-cat-title { -webkit-transform: translateX(20px); -ms-transform: translateX(20px); transform: translateX(20px) } .apcats-cat:hover::after { width: 100% } .alioth-single-product { display: block; width: 100%; position: relative; } .alioth-single-product a { text-decoration: none; color: #191b1d; } body.dark .alioth-single-product a { color: #fff; } .asp-image, .asp-image img { width: 100%; -o-object-fit: cover; object-fit: cover; height: 100%; display: block; float: left; } .asp-det { display: block; float: left; padding: 30px; width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; } .asp-product-title { font-size: 30px; font-weight: 700; letter-spacing: -0.05em; margin-bottom: 15px; display: block; width: 100%; float: left; } .asp-product-price { display: block; float: left; font-size: 18px; font-weight: 700; letter-spacing: -0.05em; color: rgba(25, 27, 29, .6) } body.dark .asp-product-price { color: hsla(0, 0%, 100%, .4) } .asp-add-to-cart { display: block; float: right; font-size: 30px; margin-top: -10px; } .asp-add-to-cart i { color: rgba(25, 27, 29, .6); } body.dark .asp-add-to-cart i { color: hsla(0, 0%, 100%, .4); } .asp-product-rate { display: block; float: left; margin-bottom: 10px; position: relative } ul.asp-rate { list-style: none; padding: 0; } ul.asp-rate li { display: inline-block; font-size: 12px; color: transparent; -webkit-text-stroke-width: 1px; -webkit-text-stroke-color: #191b1d; } ul.asp-rate.fill li { color: #191b1d; } ul.asp-rate.fill { position: absolute; top: 0; white-space: nowrap; width: 0%; overflow: hidden; } body.dark .woocommerce-error, body.dark .woocommerce-info, body.dark .woocommerce-message { background: #ebebeb; color: #191b1d; } body.dark .woocommerce-message a.button { border-color: #191b1d; color: #191b1d; } body.dark .woocommerce-body.dark error::before, body.dark .woocommerce-info::before, body.dark .woocommerce-message::before { color: #101010; } body.dark ul.asp-rate li { -webkit-text-stroke-color: #fff; } body.dark ul.asp-rate.fill li { color: #fff; } td.woocommerce-grouped-product-list-item__label a { color: #191b1d; font-weight: 700; } td.woocommerce-grouped-product-list-item__label { padding: 20px 25px; } .big-button a { color: #191b1d; text-decoration: none; font-size: 47px; font-weight: 700; letter-spacing: -3.5px; position: relative; } .big-button a::after { content: "\ea5d"; font-family: IcoFont; position: absolute; font-size: 40px; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); top: -15px; } #footer.dark .big-button a { color: #fff } @media only screen and (max-width: 450px) { .page-header-wrap.wrapper-small { max-width: 100%; } .posts-col { padding: 0 } .elementor-inner-section .elementor-container { margin-left: 0 !important; margin-right: 0 !important; } .big-button a::after { top: -20px; font-size: 30px; right: -10px; } html, body { overflow-x: hidden } .site-branding { left: 0 } .hide_mobile { display: none } .hide_desktop { display: block } .page-header { padding-top: 100px; margin-bottom: 100px; } .page-title h1.big-title { padding-right: 5px; font-size: 55px; line-height: 60px } .cart-page .page-title h1.big-title { font-size: 45px } #mouseCursor { display: none } .alioth-page-loader { width: 100%; height: 100%; } .apl-count { font-size: 100px; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); width: 100%; } .apl-count .apl-num { height: 100px; line-height: 100px } .apl-num.apl-num-3 { margin-left: -8px } .site-header { height: 100px !important } .header-widgets { display: none } .site-navigation.fullscreen ul ul li { font-size: 25px; line-height: 40px; } .site-navigation.fullscreen ul.ulcol { -webkit-column-count: 1; -moz-column-count: 1; column-count: 1; } .site-navigation.fullscreen .menu.main-menu { left: 0; bottom: unset; top: 20%; -webkit-transform: none; -ms-transform: none; transform: none; } .site-navigation.fullscreen .menu.main-menu > li.menu-item { font-size: 35px; line-height: 60px; } .site-navigation.fullscreen .fs-menu-wrapper { height: 100% } .site-navigation.fullscreen { height: 100% } .menu-widget-right, .menu-widget-left { bottom: 0 } .social-list li { display: inline-block; font-size: 15px; line-height: 20px; display: block } .sub-toggle { width: 15px; height: 15px; margin-left: 10px; top: 0; } .sub-back { left: unset; top: 18%; transform: none; right: 0 } .site-navigation.fullscreen .menu.main-menu.hovered > li.menu-item a::before { width: 100% } .c-col-6.footer-widget { margin-bottom: 60px } .c-col-3.footer-widget { width: 100%; } .footer-widget .big-button a { font-size: 30px; letter-spacing: -0.06em; } .footer-widget.footer_menu { margin-bottom: 20px } h1.big-title { font-size: 50px; line-height: 65px; margin-bottom: 0; margin-bottom: 10px; padding-right: 0; margin-left: 0; } .heading-bg-text { font-size: 100px; -webkit-transform: translatex(-30%) translateY(30%); -ms-transform: translatex(-30%) translateY(30%); transform: translatex(-30%) translateY(30%); } .ar-work { -ms-flex-preferred-size: 100vw; flex-basis: 100vw; min-width: 100vw; } .ar-work-title { font-size: 30px } .ar-work-cat { font-size: 20px } .ar-work a { width: 100%; height: 100%; } .ar-work-image { height: 65vh !important } .a-recent-works .a-button.style_1 { margin-top: 50px } .recent-works-bg-text { top: 0; font-size: 100px } .alioth-latest-posts .post { width: 100%; margin-left: 0 !important; margin-right: 0 !important; margin-bottom: 50px } .alioth-latest-posts h2 { font-size: 25px; line-height: 35px; } .project-page-header.style_1 .project-featured-image { height: 65vh; } .project-page-header.style_1 .project-details { width: 84% } .project-page-header.style_1 .project-meta.project-cats { width: 100%; } .project-page-header.style_1 .project-meta.project-cats .project-cat { display: inline-block; margin-right: 15px; font-size: 25px } .project-page-header.style_1 .project-metas .project-meta { margin-bottom: 30px; padding-left: 3px; width: 100% } .project-page-header.style_1 .project-metas div.project-other, .project-page-header.style_1 .project-metas div.meta-summary { padding-left: 8px; } .project-page-header.style_1 .project-title { margin-bottom: 15px } .project-page-header.style_2 h1.big-title, .project-page-header.style_1 h1.big-title { font-size: 45px; line-height: 55px; } .project-page-header.style_2 .project-cat { font-size: 30px; margin-left: 2px; line-height: 35px; } .project-page-header.style_2 .project-featured-image { height: 100vh } .project-page-header.style_2 .project-head { left: 8.5%; right: 8.5%; top: unset; bottom: 10%; -webkit-transform: none; -ms-transform: none; transform: none; } .project-page-header.style_2 .project-title { max-width: 100% } .project-page-header.style_2 .project-meta.project-other { width: 100% } .project-page-header.style_3 .project-head { padding-top: 40%; } .project-page-header.style_3 .big-title { font-size: 45px; line-height: 55px } .project-page-header.style_3 .project-title { margin-bottom: 0 } .project-page-header.style_3 .project-cat { font-size: 25px; margin-top: 0; margin-left: 6px; line-height: 35px } .project-page-header.style_2 .project-details { width: 84% } .project-page-header.style_3 .project-meta.project-other, .project-page-header.style_3 .project-meta.meta-summary { width: 100% } .project-metas .project-meta { width: 33%; } .project-metas div.meta-summary { width: 100%; } .project-title { -webkit-transform: translateY(-35%); -ms-transform: translateY(-35%); transform: translateY(-35%); display: block; width: 100%; margin-bottom: 50px; white-space: normal } .next-project-section a { padding-top: 70px } .next-project-wrap span { margin-bottom: 0 } .next-project-wrap h1::after { font-size: 40px } .next-project-wrap h1::before { width: 20px; height: 6px; right: 17px } .next-project-wrap h1 { font-size: 30px } .next-project-section .c-col-12, .next-project-section .wrapper-small { margin-bottom: 0 } .showcase-footer { bottom: 3.5% } .cas-headline { font-size: 30px; line-height: 45px; max-width: 70vw; padding-left: 0 } .cas-project { width: 80vw; height: 60vh; margin-right: 50px } .cas-titles .cs-title { font-size: 40px; padding: 20px 0; line-height: 40px } .cas-titles { height: 80px } .cas-titles .cas-titles-wrap { -webkit-transform: translateY(80px); -ms-transform: translateY(80px); transform: translateY(80px) } .cas-progress { display: none } .fs-project-dets { width: 90%; left: 8.5%; } .fs-title { font-size: 65px; line-height: 70px; margin-bottom: 20px } span.fs-prog { width: 50px } .fs-button { position: absolute; left: 8.5%; top: 29.5%; display: block; } .fs-fraction { top: 22.5% } .sl-project-title { font-size: 40px } .showcase-list-wrapper { left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); margin-top: 150px; text-align: center } .sl-project { padding: 20px 0 } .sl-project-meta div { font-size: 15px } .sl-project-title::before { display: none } .sl-project:hover { -webkit-transform: none; -ms-transform: none; transform: none } .sl-images .sl-project-image { width: 90vw; } .alioth-services .service-title { font-size: 35px; line-height: 45px; padding: 30px 0 } .alioth-services .service-toggle { padding: 30px 0 } .alioth-services .service-cont { width: 100%; padding-right: 0; padding-top: 30px; padding-bottom: 30px; } .alioth-services .service-wrap { margin-left: 0 } .alioth-services .service-toggle i { font-size: 35px } .alioth-clients.column-5 .a-client, .alioth-clients.column-4 .a-client, .alioth-clients.column-3 .a-client, .alioth-clients.column-2 .a-client, .alioth-clients.column-1 .a-client { width: 100%; } .testimonial-text { font-size: 25px; line-height: 34px } .a-testimonials.autoplay .a-testimonials-count { width: 50px } .page-sub-title { width: 100%; text-align: center } .page-sub-title::after { -webkit-transform: translateY(-150%) translateX(-50%) rotate(-45deg); -ms-transform: translateY(-150%) translateX(-50%) rotate(-45deg); transform: translateY(-150%) translateX(-50%) rotate(-45deg); right: unset; left: 50%; } .ai-image { min-width: 100vw } .linked-text a::before { height: 2px } .award-title, .award-date { font-size: 20px } .trans-text { font-size: 30px; line-height: 35px } .blog-classic .post.alioth-post, .blog-classic .post.alioth-post.sticky .post-meta, .blog-classic .post.alioth-post.sticky .post-image, .blog-classic .post.alioth-post.sticky { width: 100% } .blog-classic .post.alioth-post .post-title h3 { font-size: 20px; letter-spacing: -0.03em; } .blog-classic .post-meta { margin-top: 25px; padding-left: 20px; padding-right: 20px; } .blog-classic .post.sticky .post-meta { padding-top: 20px } .blog-classic .post.alioth-post { margin-bottom: 60px } .blog-list .post-images { width: 60% } .cart-product-details { margin-top: 0px; padding-left: 15px; } .a-plus-button { width: 30px; height: 30px; } .a-plus-button::after { height: 30px; } .cart-product-title { margin-bottom: 10px; font-size: 20px } .cpq-acts { margin-top: 20px } .cart-totals { padding-left: 0 } ul.check-payments li { font-size: 20px } ul.check-payments { margin-bottom: 15px } form > div.half-field { width: 100% } ul.single-product-mets { text-align: left } .alioth-products.column_2 .product, .alioth-products.column_2 .grid-sizer { width: 100%; } ul.single-product-mets { margin-left: 10px } ul.single-product-mets li { display: block; } h3.next-post-title { max-width: 100%; } .post-title h1 { font-size: 30px; line-height: 40px; } .single-product-wrap { width: 95%; margin-top: 50px } .single-product-image { width: 100% } .wrapper.related-wrap { width: 90%; max-width: 90%; } .related-products .alioth-products.column_2 .product, .related-products .alioth-products.column_2 .grid-sizer { width: 100%; } .single-product-slider { width: 100%; padding-left: 0; margin-bottom: 50px  } .sp-arrows { left: 3% } .single-product-details { width: 100%; padding-left: 10px } .single-product-meta { width: 100%; margin-left: 0 } ul.single-product-mets li::after { display: none } ul.single-product-mets .desc { width: 100% } .related-products.alioth-products.column_3 .product, .related-products.alioth-products.column_3 .grid-sizer { width: 100% } .related-products.alioth-products.column_3 .product { height: 400px } .product-page { padding-top: 130px } .ss1-sl-image { position: absolute; top: 0; left: 0; -webkit-transform: none; -ms-transform: none; transform: none; width: 100%; height: 100%; overflow: hidden; } .showcase-slideshow-wrapper { position: absolute; top: 50%; right: unset; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100%; height: 100%; left: 50%; pointer-events: none } .ss1-cat { margin-left: 0; font-size: 20px; float: unset; margin-bottom: 0; } .ss1-met-wrap { display: none } .ss1-title { font-size: 50px; line-height: 70px } .ss1-details { position: absolute; top: 30%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); width: 80%; left: 10%; text-align: center; } .ss1-nav { display: none } .ss1-dots.swiper-pagination-bullets { bottom: 5%; left: 8%; -webkit-transform: none; -ms-transform: none; transform: none; top: unset } .ss1-button { right: unset; left: 50%; bottom: 10%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .ss1-sl-image .plyr__video-wrapper { width: calc((100vh) * 1.77777778) !important; } .project-featured-video .plyr__video-embed, .project-featured-video .plyr__video-wrapper--fixed-ratio { height: 100%; width: calc((100vh) * 1.77777778) !important } .fw-projects { width: 100%; left: 10%; } .fw-project-title { font-size: 30px } .fw-project { padding: 10px 0; display: block } .fw-project::after { font-size: 30px } .aph-name { font-size: 60px; left: 0; -webkit-transform: none; -ms-transform: none; transform: none; text-align: center; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .aph-image { width: 100% } .aph-name.back { display: none } .aph-welc { display: none } .aph-name .name-back { opacity: 1; visibility: visible } .aph-details { top: unset; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); bottom: 0; z-index: 99 } .aph-sub-text { max-width: 100%; -webkit-transform: translateY(-100px); -ms-transform: translateY(-100px); transform: translateY(-100px); text-align: center } .alioth-personal-head .circular-button { display: none } .asp-image img { height: 100%; } .apc-product { height: 100%; width: 93vw } .apc-cats ul li { font-size: 20px; margin-bottom: 15px; display: inline-block; } .apc-cats ul { text-align: center } .apc-cats { margin-left: 0 } .apc-cats ul li::after { visibility: hidden; margin: 0 !important; } .apc-cats ul li { margin: 5px 10px; } .apc-cat-title { font-size: 30px } .apc-cat-quant { font-size: 12px; margin-left: 10px } .apc-cat-mark { font-size: 35px } .apcats-cat { padding: 25px 0 } .ap-cta-det { left: 35px; top: 50% !important; bottom: unset !important; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .ap-cta-title { font-size: 25px; margin: 10px 0 } .showcase-slideshow-2-wrapper { max-width: 100%; width: 100%; left: 0; height: 100%; } .ss2-images { right: 0; width: 100%; height: 100%; -webkit-transform: none; -ms-transform: none; transform: none; top: 0; z-index: -1 !important } .ss2-project-title { font-size: 50px; line-height: 60px; } .ss2-project-meta { left: 10%; width: 80% } .ss2-back-texts { display: none } .ss2-dots { display: none } .ss2-project-excerpt { display: none } .ss2-nav { position: absolute; bottom: 5%; right: 5%; -webkit-transform: none; -ms-transform: none; transform: none; } .ss2-button { bottom: unset; opacity: 1; width: auto; height: auto; background: none; top: 70%; left: 25%; font-weight: 600; } .ss2-button a::after { display: inline-block; margin-left: 15px; vertical-align: sub; } .portfolio-showcase.showcase-slideshow-v2 .plyr__video-wrapper { width: calc((100vh) * 1.77777778) } .fw-images { width: 100% } .wall-project .project-title { font-size: 60px; line-height: 60px } .wall-projects-top { margin-bottom: 0 } .alioth-works.column_2 .aw-works-sizer, .alioth-works.column_2 .aw-project { width: 100% } .aw-project { margin-bottom: 50px; height: 300px } .aw-project-title { font-size: 25px; letter-spacing: -0.05em } ul.aw-cats li { font-size: 20px; letter-spacing: -0.05em; padding-bottom: 10px } .aw-categories { margin-bottom: 0 } .aw-works-stamp { height: 35px } .alioth-embed-video .video-overlay { width: 80px; height: 80px } .alioth-embed-video .play-button { border-top: 10px solid transparent; border-bottom: 10px solid transparent; border-left: 15px solid #fff; } .wall-images { width: 84% } .sw-title { font-size: 25px; letter-spacing: -0.04em; } .sw-cat { font-size: 16px; letter-spacing: -0.02em; } form.woocommerce-cart-form, .woocommerce .cart-collaterals, .woocommerce-page .cart-collaterals { width: 100%; } .cart-wrapper { padding: 0; } .coupon { width: 100%; } .a-update-cart { width: 100%; text-align: center; margin: 15px 0; } .cart-product-remove { top: 0; } .woocommerce a.remove { font-size: 20px; border: none; } .coupon > div { margin-right: 0 !important; width: 50%; text-align: center; } div#customer_details.col2-set { width: 100%; } div#order_review { width: 100%; } #add_payment_method #payment, .woocommerce-cart #payment, .woocommerce-checkout #payment { padding-left: 1px; } #add_payment_method #payment ul.payment_methods, .woocommerce-cart #payment ul.payment_methods, .woocommerce-checkout #payment ul.payment_methods { padding: 0; border-bottom: none; margin-top: 20px; } textarea#order_comments { padding: 15px; } .cart-wrapper .coupon { width: 50%; float: left; } .a-update-cart { width: 50%; text-align: right; } .cart-wrapper .coupon-code { width: 100%; } .cart-wrapper .coupon-submit { width: 100%; text-align: left; margin-top: 10px; } .cart-wrapper input#coupon_code { border: none; } } @media (min-width: 450px) and (max-width: 900px) { body, html { overflow-x: hidden; width: 100%; } .hide_tablet { display: none } #mouseCursor { display: none } .c-col-4, .c-col-8, .c-col-9, .c-col-10 { width: 100% } .site-navigation.fullscreen .fs-menu-wrapper { height: 100% } .header-wrapper.menu-opened { height: 100vh } .site-navigation.fullscreen .menu.main-menu { bottom: unset; top: 20%; left: 0; width: 100%; } .site-navigation.fullscreen ul ul li { font-size: 30px; line-height: 55px; letter-spacing: -0.05em } .aph-image { width: 75% } .aph-name { font-size: 100px; left: 0; -webkit-transform: none; -ms-transform: none; transform: none; text-align: center; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .aph-name.back { display: none } .aph-welc { display: none } .aph-name .name-back { opacity: 1; visibility: visible } .aph-details { top: unset; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); bottom: 15%; z-index: 99; width: 50% } .aph-sub-text { max-width: 100%; -webkit-transform: translateY(-100px); -ms-transform: translateY(-100px); transform: translateY(-100px); text-align: center } .alioth-personal-head .circular-button { z-index: 10; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); bottom: 5%; left: 50%; } .ai-image { min-width: 70vw; -ms-flex-preferred-size: 70vw; flex-basis: 70vw } .showcase-slideshow-2-wrapper { max-width: 100%; width: 100%; left: 0; height: 100%; } .ss2-images { right: 0; width: 100%; height: 100%; -webkit-transform: none; -ms-transform: none; transform: none; top: 0; z-index: -1 } .ss2-project-title { font-size: 100px; line-height: 120px; } .ss2-project-meta { left: 10%; width: 80% } .ss2-back-texts { display: none } .ss2-dots { display: none } .ss2-project-excerpt { display: none } .ss2-nav { position: absolute; bottom: 5%; right: 5%; -webkit-transform: none; -ms-transform: none; transform: none; } .ss2-button { bottom: 5%; opacity: .6 } .portfolio-showcase.showcase-slideshow-v2 .plyr__video-wrapper { width: calc((100vh) * 1.77777778) } .fs-title { font-size: 80px; line-height: 95px } .fs-project-dets { width: 80%; } .fs-button { right: 10%; top: 30% } .showcase-slideshow-wrapper { width: 50% } .c-col-6.footer-widget.footer_cta { width: 100%; margin-bottom: 35px; } .ar-work-image { height: 65vh; } .ar-work { flex-basis: 60vw; min-width: 60vw; } .cas-project { width: 75vw; height: 70vh; } .cas-titles .cs-title { font-size: 100px } .sl-project-title { font-size: 70px } .showcase-list-wrapper { left: 15% } .ss1-sl-image { width: 70%; height: 70%; } .showcase-slideshow-wrapper { width: 50%; right: 50%; transform: translateX(50%) translateY(-50%); } .ss1-met-wrap { width: 100%; text-align: center } .ss1-title { text-align: center; } .ss1-button { right: 50%; transform: translateX(50%); } .linked-text a::before { height: 5px; } }