diff --git a/.gitignore b/.gitignore index 3c3629e..ca99bfb 100755 --- a/.gitignore +++ b/.gitignore @@ -1 +1,2 @@ node_modules +www/framework7-files diff --git a/www/app.min.js b/www/app.min.js old mode 100755 new mode 100644 index 05185d4..a45656e --- a/www/app.min.js +++ b/www/app.min.js @@ -1,54 +1,26 @@ -//declarations of app root object -window.app = { - Modules: {}, - Components: {}, - Pages: {}, - Directives: {}, - Pipes: {}, - Services: {}, - Storage: {}, - Config: {} -}; +function initialize() { -app.Config.init = function() { - - app.Modules.Services = ng.core.NgModule({ - imports: [] - }).Class({ - constructor: function() {} - }); - - app.Modules.Pipes = ng.core.NgModule({ - imports: [] + var BodyComponent = ng.core.Component({ + selector: 'body', + template: '' }).Class({ constructor: function() {} }); - app.Modules.Factories = ng.core.NgModule({ - imports: [] - }).Class({ - constructor: function() {} - }); - - app.Directives.App = ng.core.Component({ - selector: "app", - template: "" - }).Class({ - constructor: function() { - - } - }); - - app.Modules.Directives = ng.core.NgModule({ - import: [app.Directives.App] - }).Class({ - constructor: function() {} - }); - - app.Modules.MainModule = ng.core.NgModule({ - imports: [ng.platformBrowser.BrowserModule, app.Modules.Services, app.Modules.Pipes, app.Modules.Factories, app.Modules.Directives], - declarations: [app.Directives.App], - bootstrap: [app.Directives.App], + var MainModule = ng.core.NgModule({ + imports: [ + ng.platformBrowser.BrowserModule, + ng.forms.FormsModule, + Router() + ], + declarations: [ + BodyComponent, + MainLayoutComponent(), + HomePageComponent(), + AboutPageComponent(), + AccordionPageComponent() + ], + bootstrap: [BodyComponent], providers: [] }) .Class({ @@ -57,30 +29,72 @@ app.Config.init = function() { ng.platformBrowserDynamic .platformBrowserDynamic() - .bootstrapModule(app.Modules.MainModule); + .bootstrapModule(MainModule); +} +document.addEventListener('DOMContentLoaded', initialize); + +function Router() { + window.location.hash = 'app'; + return ng.router.RouterModule.forRoot([{ + path: 'app', + redirectTo: 'home', + pathMatch: 'full' + }, { + path: '', + component: MainLayoutComponent(), + children: [{ + path: 'home', + component: HomePageComponent() + },{ + path: 'about', + component: AboutPageComponent() + },{ + path: 'accordion', + component: AccordionPageComponent() + }] + }], { + useHash: true + }); } -document.addEventListener('DOMContentLoaded', app.Config.init); +function MainLayoutComponent() { + return ng.core.Component({ + templateUrl: "src/layout/main-layout/main-layout.html" + }).Class({ + constructor: function() { + this.root = {}; + this.root.appName = "Framework7 Angular2"; + } + }); +} -window.framework7 = { - core: {} +function AboutPageComponent() { + return ng.core.Component({ + templateUrl: "src/pages/about/about.html" + }).Class({ + constructor: function() { + + } + }); } -framework7.NgModule = - ng.core.NgModule({ - imports: [ng.platformBrowser.BrowserModule], - declarations: [framework7.core.Views], - bootstrap: [framework7.core.Views], - providers: [] +function AccordionPageComponent() { + return ng.core.Component({ + templateUrl: "src/pages/accordion/accordion.html" }).Class({ - constructor: function() {} + constructor: function() { + + } }); +} -framework7.core.Views = - ng.core.Component({ - selector: 'views', - templateUrl: "src/framework7/core/views/views.html", - }) - .Class({ - constructor: function() {} +function HomePageComponent() { + return ng.core.Component({ + templateUrl: "src/pages/home/home.html" + }).Class({ + constructor: function() { + this.title = "Framework7 Angular2"; + this.userName = "test"; + } }); +} diff --git a/www/css/kitchen-sink.css b/www/css/kitchen-sink.css new file mode 100644 index 0000000..24b0152 --- /dev/null +++ b/www/css/kitchen-sink.css @@ -0,0 +1,349 @@ +.popover { + width: 200px; +} +.popover-music { + width: 240px; +} +.ks-grid div[class*="col-"] { + background: #fff; + text-align: center; + color: #000; + border: 1px solid #ddd; + padding: 5px; + margin-bottom: 15px; +} +.ks-preloaders { + text-align: center; +} +.ks-preloader-big { + width: 42px; + height: 42px; +} +.item-media img { + width: auto; + height: auto; + max-width: 40px; + border-radius: 50%; +} +.tabbar i.icon { + -webkit-transition: 200ms; + transition: 200ms; +} +i.ks-icon-email { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,"); +} +.tabbar i.ks-icon-email { + opacity: 0.7; +} +.active i.ks-icon-email, +.active-state i.ks-icon-email { + opacity: 1; +} +i.ks-icon-calendar { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,"); +} +.tabbar i.ks-icon-calendar { + opacity: 0.7; +} +.active i.ks-icon-calendar, +.active-state i.ks-icon-calendar { + opacity: 1; +} +i.ks-icon-upload { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,"); +} +.tabbar i.ks-icon-upload { + opacity: 0.7; +} +.active i.ks-icon-upload, +.active-state i.ks-icon-upload { + opacity: 1; +} +i.ks-icon-more { + width: 10px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,"); + background-size: 24px auto; +} +.tabbar i.ks-icon-more { + opacity: 0.7; +} +.active i.ks-icon-more, +.active-state i.ks-icon-more { + opacity: 1; +} +i.ks-icon-edit { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,"); + background-size: 24px auto; +} +.tabbar i.ks-icon-edit { + opacity: 0.7; +} +.active i.ks-icon-edit, +.active-state i.ks-icon-edit { + opacity: 1; +} +.ks-demo-slider { + width: 100%; + height: 100%; +} +.ks-demo-slider .swiper-slide, +.ks-carousel-slider .swiper-slide { + font-weight: 300; + font-size: 25px; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + background: #fff; +} +.ks-carousel-slider .swiper-slide { + box-sizing: border-box; + border: 1px solid #ccc; + background: #fff; +} +.ks-carousel-slider.ks-carousel-slider-auto .swiper-slide { + width: 85%; +} +.ks-carousel-slider.ks-carousel-slider-auto .swiper-slide:nth-child(2n) { + width: 70%; +} +.ks-carousel-slider.ks-carousel-slider-auto .swiper-slide:nth-child(3n) { + width: 30%; +} +.page[data-page="swiper-multiple"] .swiper-container { + margin: 0px 0 35px; + font-size: 18px; + height: 120px; +} +.ks-slider-custom { + height: 100%; +} +.ks-slider-custom .swiper-container { + background: #000; + height: 100%; +} +.ks-slider-custom .swiper-slide { + -webkit-background-size: cover; + background-size: cover; + background-position: center; +} +.ks-slider-custom .swiper-pagination .swiper-pagination-bullet { + cursor: pointer; + width: 10px; + height: 10px; + background: rgba(255, 255, 255, 0); + opacity: 1; + border-radius: 0; + -webkit-transition: 200ms; + -moz-transition: 200ms; + -ms-transition: 200ms; + -o-transition: 200ms; + transition: 200ms; + position: relative; + -webkit-transform: scale(0.9); + -moz-transform: scale(0.9); + transform: scale(0.9); + box-sizing: border-box; + border: 1px solid rgba(255, 255, 255, 0.8); +} +.ks-slider-custom .swiper-pagination .swiper-pagination-bullet-active { + z-index: 1; + border: 1px solid #007aff; + -webkit-transform: scale(1.4); + -moz-transform: scale(1.4); + transform: scale(1.4); +} +.ks-cube-slider { + width: 80%; + height: 70%; + top: 15%; +} +.ks-coverflow-slider { + height: 60%; + top: 20%; +} +.ks-coverflow-slider .swiper-slide { + width: 65%; +} +.ks-cube-slider .swiper-slide, +.ks-coverflow-slider .swiper-slide { + background-size: cover; + color: #fff; + -webkit-backface-visibility: hidden; +} +.ks-fade-slider .swiper-slide { + background-size: cover; + background-position: center; +} +.page[data-page="swiper-gallery"] { + background: #000; +} +.ks-swiper-gallery-top { + height: 70%; +} +.ks-swiper-gallery-thumbs { + margin-top: 10px; + height: 20%; + height: -webkit-calc(30% - 20px); + height: -moz-calc(30% - 20px); + height: -ms-calc(30% - 20px); + height: calc(30% - 20px); +} +.ks-swiper-gallery-thumbs .swiper-slide { + width: 25%; +} +.ks-swiper-gallery-thumbs .swiper-slide-pic { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + opacity: 0.35; + -webkit-transition: 300ms; +} +.ks-swiper-gallery-thumbs .swiper-slide-active .swiper-slide-pic { + opacity: 1; +} +.ks-swiper-gallery-top .swiper-slide, +.ks-swiper-gallery-thumbs .swiper-slide, +.ks-swiper-gallery-top .swiper-slide-pic, +.ks-swiper-gallery-thumbs .swiper-slide-pic { + -webkit-background-size: cover; + background-size: cover; + background-position: center; +} +.ks-parallax-slider { + height: 100%; +} +.ks-parallax-slider .swiper-parallax-bg { + position: absolute; + left: 0; + top: 0; + width: 130%; + height: 100%; + -webkit-background-size: cover; + background-size: cover; + background-position: center; +} +.ks-parallax-slider .swiper-slide { + -webkit-box-sizing: border-box; + box-sizing: border-box; + padding: 40px 60px; + color: #fff; +} +.ks-parallax-slider .swiper-slide-title { + font-size: 41px; + font-weight: 300; +} +.ks-parallax-slider .swiper-slide-subtitle { + font-size: 21px; +} +.ks-parallax-slider .swiper-slide-text { + font-size: 14px; + max-width: 400px; + line-height: 1.3; +} +.page[data-page="virtual-list"] .virtual-list li { + height: 73px; +} +#ks-picker-date-container .picker-item { + color: #999; +} +#ks-picker-date-container .picker-selected { + color: #000; +} +.layout-dark #ks-picker-date-container .picker-selected { + color: #fff; +} +@media (max-width: 767px) { + #ks-picker-date-container .picker-items { + font-size: 21px; + } + #ks-picker-date-container .picker-item { + height: 36px; + line-height: 36px; + padding: 0 6px; + } +} +img.ks-demo-lazy { + display: block; + width: 100%; + height: auto; +} +div.ks-demo-lazy { + background: #aaa; + -webkit-background-size: cover; + background-size: cover; + height: 300px; + height: 60vw; +} +.ks-layout-theme { + height: 44px; + cursor: pointer; +} +.ks-layout-theme.ks-layout-default { + background: #f3f3f3; +} +.ks-layout-theme.ks-layout-dark { + background: #000; +} +.ks-layout-theme.ks-layout-white { + background: #fff; +} +.ks-color-theme { + height: 44px; + cursor: pointer; + margin-bottom: 10px; +} +.ks-card-header-pic .card-header { + height: 40vw; + background-size: cover; + background-position: center; +} +.ks-facebook-card .card-header { + display: block; + padding: 10px; +} +.ks-facebook-card .ks-facebook-avatar { + float: left; +} +.ks-facebook-card .ks-facebook-name { + margin-left: 44px; + font-size: 14px; + font-weight: 500; +} +.ks-facebook-card .ks-facebook-date { + margin-left: 44px; + font-size: 13px; + color: #8e8e93; +} +.ks-facebook-card .card-footer { + background: #fafafa; +} +.ks-facebook-card .card-footer a { + color: #81848b; + font-weight: 500; +} +.ks-facebook-card .card-content img { + display: block; +} +.ks-facebook-card .card-content-inner { + padding: 15px 10px; +} diff --git a/www/index.html b/www/index.html index 7c042ba..a1e05bd 100755 --- a/www/index.html +++ b/www/index.html @@ -1,10 +1,12 @@ - TeamStack + Framework7 Angular2 - + + + @@ -13,20 +15,17 @@ + - + - - Loading... - - diff --git a/www/libs/framework7/about.html b/www/libs/framework7/about.html new file mode 100644 index 0000000..2fcd28c --- /dev/null +++ b/www/libs/framework7/about.html @@ -0,0 +1,28 @@ + + + + +
+ +
+ +
+
+
+

Here is About page!

+

Go back or click here to create dynamic page.

+

Mauris posuere sit amet metus id venenatis. Ut ante dolor, tempor nec commodo rutrum, varius at sem. Nullam ac nisi non neque ornare pretium. Nulla mauris mauris, consequat et elementum sit amet, egestas sed orci. In hac habitasse platea dictumst.

+

Fusce eros lectus, accumsan eget mi vel, iaculis tincidunt felis. Nulla tincidunt pharetra sagittis. Fusce in felis eros. Nulla sit amet aliquam lorem, et gravida ipsum. Mauris consectetur nisl non sollicitudin tristique. Praesent vitae metus ac quam rhoncus mattis vel et nisi. Aenean aliquet, felis quis dignissim iaculis, lectus quam tincidunt ligula, et venenatis turpis risus sed lorem. Morbi eu metus elit. Ut vel diam dolor.

+
+
+
+
+
\ No newline at end of file diff --git a/www/libs/framework7/css/framework7.ios.colors.css b/www/libs/framework7/css/framework7.ios.colors.css new file mode 100644 index 0000000..5d80287 --- /dev/null +++ b/www/libs/framework7/css/framework7.ios.colors.css @@ -0,0 +1,2147 @@ +/** + * Framework7 1.4.2 + * Full Featured Mobile HTML Framework For Building iOS & Android Apps + * + * iOS Theme + * + * http://www.idangero.us/framework7 + * + * Copyright 2016, Vladimir Kharlampidi + * The iDangero.us + * http://www.idangero.us/ + * + * Licensed under MIT + * + * Released on: June 26, 2016 + */ +/*========================== +Framework7 Color Themes +==========================*/ +.color-gray { + color: #8e8e93; +} +.list-block .item-link.list-button.color-gray, +.tabbar a.active.color-gray, +a.color-gray { + color: #8e8e93; +} +.label-switch input[type="checkbox"]:checked + .checkbox.color-gray, +.label-switch.color-gray input[type="checkbox"]:checked + .checkbox { + background-color: #8e8e93; +} +.color-gray.button:not(.button-fill), +.color-gray.buttons-row .button, +.theme-gray .button:not(.button-fill) { + border-color: #8e8e93; +} +html:not(.watch-active-state) .color-gray.button:not(.button-fill):active, +html:not(.watch-active-state) .color-gray.buttons-row .button:active, +html:not(.watch-active-state) .theme-gray .button:not(.button-fill):active, +.color-gray.button:not(.button-fill).active-state, +.color-gray.buttons-row .button.active-state, +.theme-gray .button:not(.button-fill).active-state { + background-color: rgba(142, 142, 147, 0.15); +} +.color-gray.button:not(.button-fill).active, +.color-gray.buttons-row .button.active, +.theme-gray .button:not(.button-fill).active { + background-color: #8e8e93; + color: #fff; +} +.theme-gray .button.button-fill, +.button.button-fill.color-gray { + background: #8e8e93; + color: #fff; +} +.progressbar.color-gray span, +.progressbar.theme-gray span, +.theme-gray .progressbar span, +.progressbar.bg-gray span { + background-color: #8e8e93; +} +.progressbar-infinite.color-gray:before, +.progressbar-infinite.theme-gray:before, +.theme-gray .progressbar-infinite:before, +.progressbar-infinite.bg-gray:before { + background-color: #8e8e93; +} +.color-gray i.icon, +.theme-gray i.icon, +i.icon.color-gray, +i.icon.theme-gray { + color: #8e8e93; +} +i.icon-next.color-gray, +i.icon-next.theme-gray, +.theme-gray i.icon-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%238e8e93'%20d%3D'M1%2C1.6l11.8%2C5.8L1%2C13.4V1.6%20M0%2C0v15l15-7.6L0%2C0L0%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-gray, +i.icon-prev.theme-gray, +.theme-gray i.icon-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%238e8e93'%20d%3D'M14%2C1.6v11.8L2.2%2C7.6L14%2C1.6%20M15%2C0L0%2C7.6L15%2C15V0L15%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-gray, +i.icon-back.theme-gray, +.theme-gray i.icon-back { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M10%2C0l2%2C2l-8%2C8l8%2C8l-2%2C2L0%2C10L10%2C0z'%20fill%3D'%238e8e93'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-gray, +i.icon-forward.theme-gray, +.theme-gray i.icon-forward { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M2%2C20l-2-2l8-8L0%2C2l2-2l10%2C10L2%2C20z'%20fill%3D'%238e8e93'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-bars.color-gray, +i.icon-bars.theme-gray, +.theme-gray i.icon-bars { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2021%2014'%3E%3Cpath%20fill%3D'%238e8e93'%20d%3D'M0%2C0h2v2H0V0z%20M4%2C0h17v1H4V0z%20M0%2C6h2v2H0V6z%20M4%2C6h17v1H4V6z%20M0%2C12h2v2H0V12z%20M4%2C12h17v1H4V12z'%2F%3E%3C%2Fsvg%3E"); +} +@media (-webkit-min-device-pixel-ratio: 2) { + i.icon-bars.color-gray, + i.icon-bars.theme-gray, + .theme-gray i.icon-bars { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2042%2026'%3E%3Cpath%20fill%3D'%238e8e93'%20d%3D'M0%2C0h4v4H0V0z%20M8%2C1h34v2H8V1z%20M0%2C11h4v4H0V11z%20M8%2C12h34v2H8V12z%20M0%2C22h4v4H0V22z%20M8%2C23h34v2H8V23z'%2F%3E%3C%2Fsvg%3E"); + } +} +.theme-gray a, +.theme-gray .item-link.list-button { + color: #8e8e93; +} +.theme-gray .tabbar a, +.tabbar.theme-gray a, +.theme-gray .tabbar a i, +.tabbar.theme-gray a i { + color: inherit; +} +.theme-gray .tabbar a.active, +.tabbar.theme-gray a.active, +.theme-gray .tabbar a.active i, +.tabbar.theme-gray a.active i { + color: #8e8e93; +} +.theme-gray .range-slider input[type="range"]::-webkit-slider-thumb:before, +.range-slider.theme-gray input[type="range"]::-webkit-slider-thumb:before { + background-color: #8e8e93; +} +.theme-gray .range-slider input[type="range"]::-ms-fill-lower, +.range-slider.theme-gray input[type="range"]::-ms-fill-lower { + background-color: #8e8e93; +} +.theme-gray label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +.theme-gray label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox { + background-color: #8e8e93; +} +.theme-gray label.label-radio input[type="checkbox"]:checked ~ .item-inner, +.theme-gray label.label-radio input[type="radio"]:checked ~ .item-inner { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2013%2010'%3E%3Cpolygon%20fill%3D'%238e8e93'%20points%3D'11.6%2C0%204.4%2C7.2%201.4%2C4.2%200%2C5.6%204.4%2C10%204.4%2C10%204.4%2C10%2013%2C1.4%20'%2F%3E%3C%2Fsvg%3E"); +} +.theme-gray .picker-calendar-day.picker-calendar-day-selected span { + background-color: #8e8e93 !important; +} +.swiper-pagination.color-gray .swiper-pagination-bullet-active, +.theme-gray .swiper-pagination .swiper-pagination-bullet-active { + background-color: #8e8e93; +} +.swiper-pagination.color-gray .swiper-pagination-progressbar, +.theme-gray .swiper-pagination .swiper-pagination-progressbar { + background-color: #8e8e93; +} +.swiper-pagination.swiper-pagination-progress.bg-gray { + background-color: rgba(142, 142, 147, 0.25); +} +.swiper-button-next.color-gray, +.swiper-container-rtl .swiper-button-prev.color-gray, +.theme-gray .swiper-button-next, +.theme-gray .swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%238e8e93'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-prev.color-gray, +.swiper-container-rtl .swiper-button-next.color-gray, +.theme-gray .swiper-button-prev, +.theme-gray .swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%238e8e93'%2F%3E%3C%2Fsvg%3E"); +} +.bg-gray, +.button.button-fill.bg-gray, +a.bg-gray, +.list-block .swipeout-actions-left a.bg-gray, +.list-block .swipeout-actions-right a.bg-gray { + background-color: #8e8e93; +} +.border-gray { + border-color: #8e8e93; +} +.list-block .border-gray.item-inner:after, +.list-block ul.border-gray:after, +.border-gray:after, +.list-block .border-gray.item-inner:before, +.list-block ul.border-gray:before, +.border-gray:before { + background-color: #8e8e93; +} +.badge.color-gray, +.badge.theme-gray { + background-color: #8e8e93; + color: #fff; +} +.color-white { + color: #ffffff; +} +.list-block .item-link.list-button.color-white, +.tabbar a.active.color-white, +a.color-white { + color: #ffffff; +} +.label-switch input[type="checkbox"]:checked + .checkbox.color-white, +.label-switch.color-white input[type="checkbox"]:checked + .checkbox { + background-color: #ffffff; +} +.color-white.button:not(.button-fill), +.color-white.buttons-row .button, +.theme-white .button:not(.button-fill) { + border-color: #ffffff; +} +html:not(.watch-active-state) .color-white.button:not(.button-fill):active, +html:not(.watch-active-state) .color-white.buttons-row .button:active, +html:not(.watch-active-state) .theme-white .button:not(.button-fill):active, +.color-white.button:not(.button-fill).active-state, +.color-white.buttons-row .button.active-state, +.theme-white .button:not(.button-fill).active-state { + background-color: rgba(255, 255, 255, 0.15); +} +.color-white.button:not(.button-fill).active, +.color-white.buttons-row .button.active, +.theme-white .button:not(.button-fill).active { + background-color: #ffffff; + color: #fff; +} +.theme-white .button.button-fill, +.button.button-fill.color-white { + background: #ffffff; + color: #fff; +} +.progressbar.color-white span, +.progressbar.theme-white span, +.theme-white .progressbar span, +.progressbar.bg-white span { + background-color: #ffffff; +} +.progressbar-infinite.color-white:before, +.progressbar-infinite.theme-white:before, +.theme-white .progressbar-infinite:before, +.progressbar-infinite.bg-white:before { + background-color: #ffffff; +} +.color-white i.icon, +.theme-white i.icon, +i.icon.color-white, +i.icon.theme-white { + color: #ffffff; +} +i.icon-next.color-white, +i.icon-next.theme-white, +.theme-white i.icon-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%23ffffff'%20d%3D'M1%2C1.6l11.8%2C5.8L1%2C13.4V1.6%20M0%2C0v15l15-7.6L0%2C0L0%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-white, +i.icon-prev.theme-white, +.theme-white i.icon-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%23ffffff'%20d%3D'M14%2C1.6v11.8L2.2%2C7.6L14%2C1.6%20M15%2C0L0%2C7.6L15%2C15V0L15%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-white, +i.icon-back.theme-white, +.theme-white i.icon-back { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M10%2C0l2%2C2l-8%2C8l8%2C8l-2%2C2L0%2C10L10%2C0z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-white, +i.icon-forward.theme-white, +.theme-white i.icon-forward { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M2%2C20l-2-2l8-8L0%2C2l2-2l10%2C10L2%2C20z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-bars.color-white, +i.icon-bars.theme-white, +.theme-white i.icon-bars { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2021%2014'%3E%3Cpath%20fill%3D'%23ffffff'%20d%3D'M0%2C0h2v2H0V0z%20M4%2C0h17v1H4V0z%20M0%2C6h2v2H0V6z%20M4%2C6h17v1H4V6z%20M0%2C12h2v2H0V12z%20M4%2C12h17v1H4V12z'%2F%3E%3C%2Fsvg%3E"); +} +@media (-webkit-min-device-pixel-ratio: 2) { + i.icon-bars.color-white, + i.icon-bars.theme-white, + .theme-white i.icon-bars { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2042%2026'%3E%3Cpath%20fill%3D'%23ffffff'%20d%3D'M0%2C0h4v4H0V0z%20M8%2C1h34v2H8V1z%20M0%2C11h4v4H0V11z%20M8%2C12h34v2H8V12z%20M0%2C22h4v4H0V22z%20M8%2C23h34v2H8V23z'%2F%3E%3C%2Fsvg%3E"); + } +} +.theme-white a, +.theme-white .item-link.list-button { + color: #ffffff; +} +.theme-white .tabbar a, +.tabbar.theme-white a, +.theme-white .tabbar a i, +.tabbar.theme-white a i { + color: inherit; +} +.theme-white .tabbar a.active, +.tabbar.theme-white a.active, +.theme-white .tabbar a.active i, +.tabbar.theme-white a.active i { + color: #ffffff; +} +.theme-white .range-slider input[type="range"]::-webkit-slider-thumb:before, +.range-slider.theme-white input[type="range"]::-webkit-slider-thumb:before { + background-color: #ffffff; +} +.theme-white .range-slider input[type="range"]::-ms-fill-lower, +.range-slider.theme-white input[type="range"]::-ms-fill-lower { + background-color: #ffffff; +} +.theme-white label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +.theme-white label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox { + background-color: #ffffff; +} +.theme-white label.label-radio input[type="checkbox"]:checked ~ .item-inner, +.theme-white label.label-radio input[type="radio"]:checked ~ .item-inner { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2013%2010'%3E%3Cpolygon%20fill%3D'%23ffffff'%20points%3D'11.6%2C0%204.4%2C7.2%201.4%2C4.2%200%2C5.6%204.4%2C10%204.4%2C10%204.4%2C10%2013%2C1.4%20'%2F%3E%3C%2Fsvg%3E"); +} +.theme-white .picker-calendar-day.picker-calendar-day-selected span { + background-color: #ffffff !important; +} +.swiper-pagination.color-white .swiper-pagination-bullet-active, +.theme-white .swiper-pagination .swiper-pagination-bullet-active { + background-color: #ffffff; +} +.swiper-pagination.color-white .swiper-pagination-progressbar, +.theme-white .swiper-pagination .swiper-pagination-progressbar { + background-color: #ffffff; +} +.swiper-pagination.swiper-pagination-progress.bg-white { + background-color: rgba(255, 255, 255, 0.25); +} +.swiper-button-next.color-white, +.swiper-container-rtl .swiper-button-prev.color-white, +.theme-white .swiper-button-next, +.theme-white .swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-prev.color-white, +.swiper-container-rtl .swiper-button-next.color-white, +.theme-white .swiper-button-prev, +.theme-white .swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); +} +.bg-white, +.button.button-fill.bg-white, +a.bg-white, +.list-block .swipeout-actions-left a.bg-white, +.list-block .swipeout-actions-right a.bg-white { + background-color: #ffffff; +} +.border-white { + border-color: #ffffff; +} +.list-block .border-white.item-inner:after, +.list-block ul.border-white:after, +.border-white:after, +.list-block .border-white.item-inner:before, +.list-block ul.border-white:before, +.border-white:before { + background-color: #ffffff; +} +.badge.color-white, +.badge.theme-white { + background-color: #ffffff; + color: #fff; +} +.color-black { + color: #000000; +} +.list-block .item-link.list-button.color-black, +.tabbar a.active.color-black, +a.color-black { + color: #000000; +} +.label-switch input[type="checkbox"]:checked + .checkbox.color-black, +.label-switch.color-black input[type="checkbox"]:checked + .checkbox { + background-color: #000000; +} +.color-black.button:not(.button-fill), +.color-black.buttons-row .button, +.theme-black .button:not(.button-fill) { + border-color: #000000; +} +html:not(.watch-active-state) .color-black.button:not(.button-fill):active, +html:not(.watch-active-state) .color-black.buttons-row .button:active, +html:not(.watch-active-state) .theme-black .button:not(.button-fill):active, +.color-black.button:not(.button-fill).active-state, +.color-black.buttons-row .button.active-state, +.theme-black .button:not(.button-fill).active-state { + background-color: rgba(0, 0, 0, 0.15); +} +.color-black.button:not(.button-fill).active, +.color-black.buttons-row .button.active, +.theme-black .button:not(.button-fill).active { + background-color: #000000; + color: #fff; +} +.theme-black .button.button-fill, +.button.button-fill.color-black { + background: #000000; + color: #fff; +} +.progressbar.color-black span, +.progressbar.theme-black span, +.theme-black .progressbar span, +.progressbar.bg-black span { + background-color: #000000; +} +.progressbar-infinite.color-black:before, +.progressbar-infinite.theme-black:before, +.theme-black .progressbar-infinite:before, +.progressbar-infinite.bg-black:before { + background-color: #000000; +} +.color-black i.icon, +.theme-black i.icon, +i.icon.color-black, +i.icon.theme-black { + color: #000000; +} +i.icon-next.color-black, +i.icon-next.theme-black, +.theme-black i.icon-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%23000000'%20d%3D'M1%2C1.6l11.8%2C5.8L1%2C13.4V1.6%20M0%2C0v15l15-7.6L0%2C0L0%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-black, +i.icon-prev.theme-black, +.theme-black i.icon-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%23000000'%20d%3D'M14%2C1.6v11.8L2.2%2C7.6L14%2C1.6%20M15%2C0L0%2C7.6L15%2C15V0L15%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-black, +i.icon-back.theme-black, +.theme-black i.icon-back { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M10%2C0l2%2C2l-8%2C8l8%2C8l-2%2C2L0%2C10L10%2C0z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-black, +i.icon-forward.theme-black, +.theme-black i.icon-forward { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M2%2C20l-2-2l8-8L0%2C2l2-2l10%2C10L2%2C20z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-bars.color-black, +i.icon-bars.theme-black, +.theme-black i.icon-bars { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2021%2014'%3E%3Cpath%20fill%3D'%23000000'%20d%3D'M0%2C0h2v2H0V0z%20M4%2C0h17v1H4V0z%20M0%2C6h2v2H0V6z%20M4%2C6h17v1H4V6z%20M0%2C12h2v2H0V12z%20M4%2C12h17v1H4V12z'%2F%3E%3C%2Fsvg%3E"); +} +@media (-webkit-min-device-pixel-ratio: 2) { + i.icon-bars.color-black, + i.icon-bars.theme-black, + .theme-black i.icon-bars { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2042%2026'%3E%3Cpath%20fill%3D'%23000000'%20d%3D'M0%2C0h4v4H0V0z%20M8%2C1h34v2H8V1z%20M0%2C11h4v4H0V11z%20M8%2C12h34v2H8V12z%20M0%2C22h4v4H0V22z%20M8%2C23h34v2H8V23z'%2F%3E%3C%2Fsvg%3E"); + } +} +.theme-black a, +.theme-black .item-link.list-button { + color: #000000; +} +.theme-black .tabbar a, +.tabbar.theme-black a, +.theme-black .tabbar a i, +.tabbar.theme-black a i { + color: inherit; +} +.theme-black .tabbar a.active, +.tabbar.theme-black a.active, +.theme-black .tabbar a.active i, +.tabbar.theme-black a.active i { + color: #000000; +} +.theme-black .range-slider input[type="range"]::-webkit-slider-thumb:before, +.range-slider.theme-black input[type="range"]::-webkit-slider-thumb:before { + background-color: #000000; +} +.theme-black .range-slider input[type="range"]::-ms-fill-lower, +.range-slider.theme-black input[type="range"]::-ms-fill-lower { + background-color: #000000; +} +.theme-black label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +.theme-black label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox { + background-color: #000000; +} +.theme-black label.label-radio input[type="checkbox"]:checked ~ .item-inner, +.theme-black label.label-radio input[type="radio"]:checked ~ .item-inner { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2013%2010'%3E%3Cpolygon%20fill%3D'%23000000'%20points%3D'11.6%2C0%204.4%2C7.2%201.4%2C4.2%200%2C5.6%204.4%2C10%204.4%2C10%204.4%2C10%2013%2C1.4%20'%2F%3E%3C%2Fsvg%3E"); +} +.theme-black .picker-calendar-day.picker-calendar-day-selected span { + background-color: #000000 !important; +} +.swiper-pagination.color-black .swiper-pagination-bullet-active, +.theme-black .swiper-pagination .swiper-pagination-bullet-active { + background-color: #000000; +} +.swiper-pagination.color-black .swiper-pagination-progressbar, +.theme-black .swiper-pagination .swiper-pagination-progressbar { + background-color: #000000; +} +.swiper-pagination.swiper-pagination-progress.bg-black { + background-color: rgba(0, 0, 0, 0.25); +} +.swiper-button-next.color-black, +.swiper-container-rtl .swiper-button-prev.color-black, +.theme-black .swiper-button-next, +.theme-black .swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-prev.color-black, +.swiper-container-rtl .swiper-button-next.color-black, +.theme-black .swiper-button-prev, +.theme-black .swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E"); +} +.bg-black, +.button.button-fill.bg-black, +a.bg-black, +.list-block .swipeout-actions-left a.bg-black, +.list-block .swipeout-actions-right a.bg-black { + background-color: #000000; +} +.border-black { + border-color: #000000; +} +.list-block .border-black.item-inner:after, +.list-block ul.border-black:after, +.border-black:after, +.list-block .border-black.item-inner:before, +.list-block ul.border-black:before, +.border-black:before { + background-color: #000000; +} +.badge.color-black, +.badge.theme-black { + background-color: #000000; + color: #fff; +} +.color-lightblue { + color: #5ac8fa; +} +.list-block .item-link.list-button.color-lightblue, +.tabbar a.active.color-lightblue, +a.color-lightblue { + color: #5ac8fa; +} +.label-switch input[type="checkbox"]:checked + .checkbox.color-lightblue, +.label-switch.color-lightblue input[type="checkbox"]:checked + .checkbox { + background-color: #5ac8fa; +} +.color-lightblue.button:not(.button-fill), +.color-lightblue.buttons-row .button, +.theme-lightblue .button:not(.button-fill) { + border-color: #5ac8fa; +} +html:not(.watch-active-state) .color-lightblue.button:not(.button-fill):active, +html:not(.watch-active-state) .color-lightblue.buttons-row .button:active, +html:not(.watch-active-state) .theme-lightblue .button:not(.button-fill):active, +.color-lightblue.button:not(.button-fill).active-state, +.color-lightblue.buttons-row .button.active-state, +.theme-lightblue .button:not(.button-fill).active-state { + background-color: rgba(90, 200, 250, 0.15); +} +.color-lightblue.button:not(.button-fill).active, +.color-lightblue.buttons-row .button.active, +.theme-lightblue .button:not(.button-fill).active { + background-color: #5ac8fa; + color: #fff; +} +.theme-lightblue .button.button-fill, +.button.button-fill.color-lightblue { + background: #5ac8fa; + color: #fff; +} +.progressbar.color-lightblue span, +.progressbar.theme-lightblue span, +.theme-lightblue .progressbar span, +.progressbar.bg-lightblue span { + background-color: #5ac8fa; +} +.progressbar-infinite.color-lightblue:before, +.progressbar-infinite.theme-lightblue:before, +.theme-lightblue .progressbar-infinite:before, +.progressbar-infinite.bg-lightblue:before { + background-color: #5ac8fa; +} +.color-lightblue i.icon, +.theme-lightblue i.icon, +i.icon.color-lightblue, +i.icon.theme-lightblue { + color: #5ac8fa; +} +i.icon-next.color-lightblue, +i.icon-next.theme-lightblue, +.theme-lightblue i.icon-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%235ac8fa'%20d%3D'M1%2C1.6l11.8%2C5.8L1%2C13.4V1.6%20M0%2C0v15l15-7.6L0%2C0L0%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-lightblue, +i.icon-prev.theme-lightblue, +.theme-lightblue i.icon-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%235ac8fa'%20d%3D'M14%2C1.6v11.8L2.2%2C7.6L14%2C1.6%20M15%2C0L0%2C7.6L15%2C15V0L15%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-lightblue, +i.icon-back.theme-lightblue, +.theme-lightblue i.icon-back { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M10%2C0l2%2C2l-8%2C8l8%2C8l-2%2C2L0%2C10L10%2C0z'%20fill%3D'%235ac8fa'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-lightblue, +i.icon-forward.theme-lightblue, +.theme-lightblue i.icon-forward { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M2%2C20l-2-2l8-8L0%2C2l2-2l10%2C10L2%2C20z'%20fill%3D'%235ac8fa'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-bars.color-lightblue, +i.icon-bars.theme-lightblue, +.theme-lightblue i.icon-bars { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2021%2014'%3E%3Cpath%20fill%3D'%235ac8fa'%20d%3D'M0%2C0h2v2H0V0z%20M4%2C0h17v1H4V0z%20M0%2C6h2v2H0V6z%20M4%2C6h17v1H4V6z%20M0%2C12h2v2H0V12z%20M4%2C12h17v1H4V12z'%2F%3E%3C%2Fsvg%3E"); +} +@media (-webkit-min-device-pixel-ratio: 2) { + i.icon-bars.color-lightblue, + i.icon-bars.theme-lightblue, + .theme-lightblue i.icon-bars { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2042%2026'%3E%3Cpath%20fill%3D'%235ac8fa'%20d%3D'M0%2C0h4v4H0V0z%20M8%2C1h34v2H8V1z%20M0%2C11h4v4H0V11z%20M8%2C12h34v2H8V12z%20M0%2C22h4v4H0V22z%20M8%2C23h34v2H8V23z'%2F%3E%3C%2Fsvg%3E"); + } +} +.theme-lightblue a, +.theme-lightblue .item-link.list-button { + color: #5ac8fa; +} +.theme-lightblue .tabbar a, +.tabbar.theme-lightblue a, +.theme-lightblue .tabbar a i, +.tabbar.theme-lightblue a i { + color: inherit; +} +.theme-lightblue .tabbar a.active, +.tabbar.theme-lightblue a.active, +.theme-lightblue .tabbar a.active i, +.tabbar.theme-lightblue a.active i { + color: #5ac8fa; +} +.theme-lightblue .range-slider input[type="range"]::-webkit-slider-thumb:before, +.range-slider.theme-lightblue input[type="range"]::-webkit-slider-thumb:before { + background-color: #5ac8fa; +} +.theme-lightblue .range-slider input[type="range"]::-ms-fill-lower, +.range-slider.theme-lightblue input[type="range"]::-ms-fill-lower { + background-color: #5ac8fa; +} +.theme-lightblue label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +.theme-lightblue label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox { + background-color: #5ac8fa; +} +.theme-lightblue label.label-radio input[type="checkbox"]:checked ~ .item-inner, +.theme-lightblue label.label-radio input[type="radio"]:checked ~ .item-inner { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2013%2010'%3E%3Cpolygon%20fill%3D'%235ac8fa'%20points%3D'11.6%2C0%204.4%2C7.2%201.4%2C4.2%200%2C5.6%204.4%2C10%204.4%2C10%204.4%2C10%2013%2C1.4%20'%2F%3E%3C%2Fsvg%3E"); +} +.theme-lightblue .picker-calendar-day.picker-calendar-day-selected span { + background-color: #5ac8fa !important; +} +.swiper-pagination.color-lightblue .swiper-pagination-bullet-active, +.theme-lightblue .swiper-pagination .swiper-pagination-bullet-active { + background-color: #5ac8fa; +} +.swiper-pagination.color-lightblue .swiper-pagination-progressbar, +.theme-lightblue .swiper-pagination .swiper-pagination-progressbar { + background-color: #5ac8fa; +} +.swiper-pagination.swiper-pagination-progress.bg-lightblue { + background-color: rgba(90, 200, 250, 0.25); +} +.swiper-button-next.color-lightblue, +.swiper-container-rtl .swiper-button-prev.color-lightblue, +.theme-lightblue .swiper-button-next, +.theme-lightblue .swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%235ac8fa'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-prev.color-lightblue, +.swiper-container-rtl .swiper-button-next.color-lightblue, +.theme-lightblue .swiper-button-prev, +.theme-lightblue .swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%235ac8fa'%2F%3E%3C%2Fsvg%3E"); +} +.bg-lightblue, +.button.button-fill.bg-lightblue, +a.bg-lightblue, +.list-block .swipeout-actions-left a.bg-lightblue, +.list-block .swipeout-actions-right a.bg-lightblue { + background-color: #5ac8fa; +} +.border-lightblue { + border-color: #5ac8fa; +} +.list-block .border-lightblue.item-inner:after, +.list-block ul.border-lightblue:after, +.border-lightblue:after, +.list-block .border-lightblue.item-inner:before, +.list-block ul.border-lightblue:before, +.border-lightblue:before { + background-color: #5ac8fa; +} +.badge.color-lightblue, +.badge.theme-lightblue { + background-color: #5ac8fa; + color: #fff; +} +.color-yellow { + color: #ffcc00; +} +.list-block .item-link.list-button.color-yellow, +.tabbar a.active.color-yellow, +a.color-yellow { + color: #ffcc00; +} +.label-switch input[type="checkbox"]:checked + .checkbox.color-yellow, +.label-switch.color-yellow input[type="checkbox"]:checked + .checkbox { + background-color: #ffcc00; +} +.color-yellow.button:not(.button-fill), +.color-yellow.buttons-row .button, +.theme-yellow .button:not(.button-fill) { + border-color: #ffcc00; +} +html:not(.watch-active-state) .color-yellow.button:not(.button-fill):active, +html:not(.watch-active-state) .color-yellow.buttons-row .button:active, +html:not(.watch-active-state) .theme-yellow .button:not(.button-fill):active, +.color-yellow.button:not(.button-fill).active-state, +.color-yellow.buttons-row .button.active-state, +.theme-yellow .button:not(.button-fill).active-state { + background-color: rgba(255, 204, 0, 0.15); +} +.color-yellow.button:not(.button-fill).active, +.color-yellow.buttons-row .button.active, +.theme-yellow .button:not(.button-fill).active { + background-color: #ffcc00; + color: #fff; +} +.theme-yellow .button.button-fill, +.button.button-fill.color-yellow { + background: #ffcc00; + color: #fff; +} +.progressbar.color-yellow span, +.progressbar.theme-yellow span, +.theme-yellow .progressbar span, +.progressbar.bg-yellow span { + background-color: #ffcc00; +} +.progressbar-infinite.color-yellow:before, +.progressbar-infinite.theme-yellow:before, +.theme-yellow .progressbar-infinite:before, +.progressbar-infinite.bg-yellow:before { + background-color: #ffcc00; +} +.color-yellow i.icon, +.theme-yellow i.icon, +i.icon.color-yellow, +i.icon.theme-yellow { + color: #ffcc00; +} +i.icon-next.color-yellow, +i.icon-next.theme-yellow, +.theme-yellow i.icon-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%23ffcc00'%20d%3D'M1%2C1.6l11.8%2C5.8L1%2C13.4V1.6%20M0%2C0v15l15-7.6L0%2C0L0%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-yellow, +i.icon-prev.theme-yellow, +.theme-yellow i.icon-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%23ffcc00'%20d%3D'M14%2C1.6v11.8L2.2%2C7.6L14%2C1.6%20M15%2C0L0%2C7.6L15%2C15V0L15%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-yellow, +i.icon-back.theme-yellow, +.theme-yellow i.icon-back { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M10%2C0l2%2C2l-8%2C8l8%2C8l-2%2C2L0%2C10L10%2C0z'%20fill%3D'%23ffcc00'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-yellow, +i.icon-forward.theme-yellow, +.theme-yellow i.icon-forward { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M2%2C20l-2-2l8-8L0%2C2l2-2l10%2C10L2%2C20z'%20fill%3D'%23ffcc00'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-bars.color-yellow, +i.icon-bars.theme-yellow, +.theme-yellow i.icon-bars { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2021%2014'%3E%3Cpath%20fill%3D'%23ffcc00'%20d%3D'M0%2C0h2v2H0V0z%20M4%2C0h17v1H4V0z%20M0%2C6h2v2H0V6z%20M4%2C6h17v1H4V6z%20M0%2C12h2v2H0V12z%20M4%2C12h17v1H4V12z'%2F%3E%3C%2Fsvg%3E"); +} +@media (-webkit-min-device-pixel-ratio: 2) { + i.icon-bars.color-yellow, + i.icon-bars.theme-yellow, + .theme-yellow i.icon-bars { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2042%2026'%3E%3Cpath%20fill%3D'%23ffcc00'%20d%3D'M0%2C0h4v4H0V0z%20M8%2C1h34v2H8V1z%20M0%2C11h4v4H0V11z%20M8%2C12h34v2H8V12z%20M0%2C22h4v4H0V22z%20M8%2C23h34v2H8V23z'%2F%3E%3C%2Fsvg%3E"); + } +} +.theme-yellow a, +.theme-yellow .item-link.list-button { + color: #ffcc00; +} +.theme-yellow .tabbar a, +.tabbar.theme-yellow a, +.theme-yellow .tabbar a i, +.tabbar.theme-yellow a i { + color: inherit; +} +.theme-yellow .tabbar a.active, +.tabbar.theme-yellow a.active, +.theme-yellow .tabbar a.active i, +.tabbar.theme-yellow a.active i { + color: #ffcc00; +} +.theme-yellow .range-slider input[type="range"]::-webkit-slider-thumb:before, +.range-slider.theme-yellow input[type="range"]::-webkit-slider-thumb:before { + background-color: #ffcc00; +} +.theme-yellow .range-slider input[type="range"]::-ms-fill-lower, +.range-slider.theme-yellow input[type="range"]::-ms-fill-lower { + background-color: #ffcc00; +} +.theme-yellow label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +.theme-yellow label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox { + background-color: #ffcc00; +} +.theme-yellow label.label-radio input[type="checkbox"]:checked ~ .item-inner, +.theme-yellow label.label-radio input[type="radio"]:checked ~ .item-inner { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2013%2010'%3E%3Cpolygon%20fill%3D'%23ffcc00'%20points%3D'11.6%2C0%204.4%2C7.2%201.4%2C4.2%200%2C5.6%204.4%2C10%204.4%2C10%204.4%2C10%2013%2C1.4%20'%2F%3E%3C%2Fsvg%3E"); +} +.theme-yellow .picker-calendar-day.picker-calendar-day-selected span { + background-color: #ffcc00 !important; +} +.swiper-pagination.color-yellow .swiper-pagination-bullet-active, +.theme-yellow .swiper-pagination .swiper-pagination-bullet-active { + background-color: #ffcc00; +} +.swiper-pagination.color-yellow .swiper-pagination-progressbar, +.theme-yellow .swiper-pagination .swiper-pagination-progressbar { + background-color: #ffcc00; +} +.swiper-pagination.swiper-pagination-progress.bg-yellow { + background-color: rgba(255, 204, 0, 0.25); +} +.swiper-button-next.color-yellow, +.swiper-container-rtl .swiper-button-prev.color-yellow, +.theme-yellow .swiper-button-next, +.theme-yellow .swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffcc00'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-prev.color-yellow, +.swiper-container-rtl .swiper-button-next.color-yellow, +.theme-yellow .swiper-button-prev, +.theme-yellow .swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffcc00'%2F%3E%3C%2Fsvg%3E"); +} +.bg-yellow, +.button.button-fill.bg-yellow, +a.bg-yellow, +.list-block .swipeout-actions-left a.bg-yellow, +.list-block .swipeout-actions-right a.bg-yellow { + background-color: #ffcc00; +} +.border-yellow { + border-color: #ffcc00; +} +.list-block .border-yellow.item-inner:after, +.list-block ul.border-yellow:after, +.border-yellow:after, +.list-block .border-yellow.item-inner:before, +.list-block ul.border-yellow:before, +.border-yellow:before { + background-color: #ffcc00; +} +.badge.color-yellow, +.badge.theme-yellow { + background-color: #ffcc00; + color: #fff; +} +.color-orange { + color: #ff9500; +} +.list-block .item-link.list-button.color-orange, +.tabbar a.active.color-orange, +a.color-orange { + color: #ff9500; +} +.label-switch input[type="checkbox"]:checked + .checkbox.color-orange, +.label-switch.color-orange input[type="checkbox"]:checked + .checkbox { + background-color: #ff9500; +} +.color-orange.button:not(.button-fill), +.color-orange.buttons-row .button, +.theme-orange .button:not(.button-fill) { + border-color: #ff9500; +} +html:not(.watch-active-state) .color-orange.button:not(.button-fill):active, +html:not(.watch-active-state) .color-orange.buttons-row .button:active, +html:not(.watch-active-state) .theme-orange .button:not(.button-fill):active, +.color-orange.button:not(.button-fill).active-state, +.color-orange.buttons-row .button.active-state, +.theme-orange .button:not(.button-fill).active-state { + background-color: rgba(255, 149, 0, 0.15); +} +.color-orange.button:not(.button-fill).active, +.color-orange.buttons-row .button.active, +.theme-orange .button:not(.button-fill).active { + background-color: #ff9500; + color: #fff; +} +.theme-orange .button.button-fill, +.button.button-fill.color-orange { + background: #ff9500; + color: #fff; +} +.progressbar.color-orange span, +.progressbar.theme-orange span, +.theme-orange .progressbar span, +.progressbar.bg-orange span { + background-color: #ff9500; +} +.progressbar-infinite.color-orange:before, +.progressbar-infinite.theme-orange:before, +.theme-orange .progressbar-infinite:before, +.progressbar-infinite.bg-orange:before { + background-color: #ff9500; +} +.color-orange i.icon, +.theme-orange i.icon, +i.icon.color-orange, +i.icon.theme-orange { + color: #ff9500; +} +i.icon-next.color-orange, +i.icon-next.theme-orange, +.theme-orange i.icon-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%23ff9500'%20d%3D'M1%2C1.6l11.8%2C5.8L1%2C13.4V1.6%20M0%2C0v15l15-7.6L0%2C0L0%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-orange, +i.icon-prev.theme-orange, +.theme-orange i.icon-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%23ff9500'%20d%3D'M14%2C1.6v11.8L2.2%2C7.6L14%2C1.6%20M15%2C0L0%2C7.6L15%2C15V0L15%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-orange, +i.icon-back.theme-orange, +.theme-orange i.icon-back { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M10%2C0l2%2C2l-8%2C8l8%2C8l-2%2C2L0%2C10L10%2C0z'%20fill%3D'%23ff9500'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-orange, +i.icon-forward.theme-orange, +.theme-orange i.icon-forward { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M2%2C20l-2-2l8-8L0%2C2l2-2l10%2C10L2%2C20z'%20fill%3D'%23ff9500'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-bars.color-orange, +i.icon-bars.theme-orange, +.theme-orange i.icon-bars { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2021%2014'%3E%3Cpath%20fill%3D'%23ff9500'%20d%3D'M0%2C0h2v2H0V0z%20M4%2C0h17v1H4V0z%20M0%2C6h2v2H0V6z%20M4%2C6h17v1H4V6z%20M0%2C12h2v2H0V12z%20M4%2C12h17v1H4V12z'%2F%3E%3C%2Fsvg%3E"); +} +@media (-webkit-min-device-pixel-ratio: 2) { + i.icon-bars.color-orange, + i.icon-bars.theme-orange, + .theme-orange i.icon-bars { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2042%2026'%3E%3Cpath%20fill%3D'%23ff9500'%20d%3D'M0%2C0h4v4H0V0z%20M8%2C1h34v2H8V1z%20M0%2C11h4v4H0V11z%20M8%2C12h34v2H8V12z%20M0%2C22h4v4H0V22z%20M8%2C23h34v2H8V23z'%2F%3E%3C%2Fsvg%3E"); + } +} +.theme-orange a, +.theme-orange .item-link.list-button { + color: #ff9500; +} +.theme-orange .tabbar a, +.tabbar.theme-orange a, +.theme-orange .tabbar a i, +.tabbar.theme-orange a i { + color: inherit; +} +.theme-orange .tabbar a.active, +.tabbar.theme-orange a.active, +.theme-orange .tabbar a.active i, +.tabbar.theme-orange a.active i { + color: #ff9500; +} +.theme-orange .range-slider input[type="range"]::-webkit-slider-thumb:before, +.range-slider.theme-orange input[type="range"]::-webkit-slider-thumb:before { + background-color: #ff9500; +} +.theme-orange .range-slider input[type="range"]::-ms-fill-lower, +.range-slider.theme-orange input[type="range"]::-ms-fill-lower { + background-color: #ff9500; +} +.theme-orange label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +.theme-orange label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox { + background-color: #ff9500; +} +.theme-orange label.label-radio input[type="checkbox"]:checked ~ .item-inner, +.theme-orange label.label-radio input[type="radio"]:checked ~ .item-inner { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2013%2010'%3E%3Cpolygon%20fill%3D'%23ff9500'%20points%3D'11.6%2C0%204.4%2C7.2%201.4%2C4.2%200%2C5.6%204.4%2C10%204.4%2C10%204.4%2C10%2013%2C1.4%20'%2F%3E%3C%2Fsvg%3E"); +} +.theme-orange .picker-calendar-day.picker-calendar-day-selected span { + background-color: #ff9500 !important; +} +.swiper-pagination.color-orange .swiper-pagination-bullet-active, +.theme-orange .swiper-pagination .swiper-pagination-bullet-active { + background-color: #ff9500; +} +.swiper-pagination.color-orange .swiper-pagination-progressbar, +.theme-orange .swiper-pagination .swiper-pagination-progressbar { + background-color: #ff9500; +} +.swiper-pagination.swiper-pagination-progress.bg-orange { + background-color: rgba(255, 149, 0, 0.25); +} +.swiper-button-next.color-orange, +.swiper-container-rtl .swiper-button-prev.color-orange, +.theme-orange .swiper-button-next, +.theme-orange .swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ff9500'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-prev.color-orange, +.swiper-container-rtl .swiper-button-next.color-orange, +.theme-orange .swiper-button-prev, +.theme-orange .swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ff9500'%2F%3E%3C%2Fsvg%3E"); +} +.bg-orange, +.button.button-fill.bg-orange, +a.bg-orange, +.list-block .swipeout-actions-left a.bg-orange, +.list-block .swipeout-actions-right a.bg-orange { + background-color: #ff9500; +} +.border-orange { + border-color: #ff9500; +} +.list-block .border-orange.item-inner:after, +.list-block ul.border-orange:after, +.border-orange:after, +.list-block .border-orange.item-inner:before, +.list-block ul.border-orange:before, +.border-orange:before { + background-color: #ff9500; +} +.badge.color-orange, +.badge.theme-orange { + background-color: #ff9500; + color: #fff; +} +.color-pink { + color: #ff2d55; +} +.list-block .item-link.list-button.color-pink, +.tabbar a.active.color-pink, +a.color-pink { + color: #ff2d55; +} +.label-switch input[type="checkbox"]:checked + .checkbox.color-pink, +.label-switch.color-pink input[type="checkbox"]:checked + .checkbox { + background-color: #ff2d55; +} +.color-pink.button:not(.button-fill), +.color-pink.buttons-row .button, +.theme-pink .button:not(.button-fill) { + border-color: #ff2d55; +} +html:not(.watch-active-state) .color-pink.button:not(.button-fill):active, +html:not(.watch-active-state) .color-pink.buttons-row .button:active, +html:not(.watch-active-state) .theme-pink .button:not(.button-fill):active, +.color-pink.button:not(.button-fill).active-state, +.color-pink.buttons-row .button.active-state, +.theme-pink .button:not(.button-fill).active-state { + background-color: rgba(255, 45, 85, 0.15); +} +.color-pink.button:not(.button-fill).active, +.color-pink.buttons-row .button.active, +.theme-pink .button:not(.button-fill).active { + background-color: #ff2d55; + color: #fff; +} +.theme-pink .button.button-fill, +.button.button-fill.color-pink { + background: #ff2d55; + color: #fff; +} +.progressbar.color-pink span, +.progressbar.theme-pink span, +.theme-pink .progressbar span, +.progressbar.bg-pink span { + background-color: #ff2d55; +} +.progressbar-infinite.color-pink:before, +.progressbar-infinite.theme-pink:before, +.theme-pink .progressbar-infinite:before, +.progressbar-infinite.bg-pink:before { + background-color: #ff2d55; +} +.color-pink i.icon, +.theme-pink i.icon, +i.icon.color-pink, +i.icon.theme-pink { + color: #ff2d55; +} +i.icon-next.color-pink, +i.icon-next.theme-pink, +.theme-pink i.icon-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%23ff2d55'%20d%3D'M1%2C1.6l11.8%2C5.8L1%2C13.4V1.6%20M0%2C0v15l15-7.6L0%2C0L0%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-pink, +i.icon-prev.theme-pink, +.theme-pink i.icon-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%23ff2d55'%20d%3D'M14%2C1.6v11.8L2.2%2C7.6L14%2C1.6%20M15%2C0L0%2C7.6L15%2C15V0L15%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-pink, +i.icon-back.theme-pink, +.theme-pink i.icon-back { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M10%2C0l2%2C2l-8%2C8l8%2C8l-2%2C2L0%2C10L10%2C0z'%20fill%3D'%23ff2d55'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-pink, +i.icon-forward.theme-pink, +.theme-pink i.icon-forward { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M2%2C20l-2-2l8-8L0%2C2l2-2l10%2C10L2%2C20z'%20fill%3D'%23ff2d55'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-bars.color-pink, +i.icon-bars.theme-pink, +.theme-pink i.icon-bars { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2021%2014'%3E%3Cpath%20fill%3D'%23ff2d55'%20d%3D'M0%2C0h2v2H0V0z%20M4%2C0h17v1H4V0z%20M0%2C6h2v2H0V6z%20M4%2C6h17v1H4V6z%20M0%2C12h2v2H0V12z%20M4%2C12h17v1H4V12z'%2F%3E%3C%2Fsvg%3E"); +} +@media (-webkit-min-device-pixel-ratio: 2) { + i.icon-bars.color-pink, + i.icon-bars.theme-pink, + .theme-pink i.icon-bars { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2042%2026'%3E%3Cpath%20fill%3D'%23ff2d55'%20d%3D'M0%2C0h4v4H0V0z%20M8%2C1h34v2H8V1z%20M0%2C11h4v4H0V11z%20M8%2C12h34v2H8V12z%20M0%2C22h4v4H0V22z%20M8%2C23h34v2H8V23z'%2F%3E%3C%2Fsvg%3E"); + } +} +.theme-pink a, +.theme-pink .item-link.list-button { + color: #ff2d55; +} +.theme-pink .tabbar a, +.tabbar.theme-pink a, +.theme-pink .tabbar a i, +.tabbar.theme-pink a i { + color: inherit; +} +.theme-pink .tabbar a.active, +.tabbar.theme-pink a.active, +.theme-pink .tabbar a.active i, +.tabbar.theme-pink a.active i { + color: #ff2d55; +} +.theme-pink .range-slider input[type="range"]::-webkit-slider-thumb:before, +.range-slider.theme-pink input[type="range"]::-webkit-slider-thumb:before { + background-color: #ff2d55; +} +.theme-pink .range-slider input[type="range"]::-ms-fill-lower, +.range-slider.theme-pink input[type="range"]::-ms-fill-lower { + background-color: #ff2d55; +} +.theme-pink label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +.theme-pink label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox { + background-color: #ff2d55; +} +.theme-pink label.label-radio input[type="checkbox"]:checked ~ .item-inner, +.theme-pink label.label-radio input[type="radio"]:checked ~ .item-inner { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2013%2010'%3E%3Cpolygon%20fill%3D'%23ff2d55'%20points%3D'11.6%2C0%204.4%2C7.2%201.4%2C4.2%200%2C5.6%204.4%2C10%204.4%2C10%204.4%2C10%2013%2C1.4%20'%2F%3E%3C%2Fsvg%3E"); +} +.theme-pink .picker-calendar-day.picker-calendar-day-selected span { + background-color: #ff2d55 !important; +} +.swiper-pagination.color-pink .swiper-pagination-bullet-active, +.theme-pink .swiper-pagination .swiper-pagination-bullet-active { + background-color: #ff2d55; +} +.swiper-pagination.color-pink .swiper-pagination-progressbar, +.theme-pink .swiper-pagination .swiper-pagination-progressbar { + background-color: #ff2d55; +} +.swiper-pagination.swiper-pagination-progress.bg-pink { + background-color: rgba(255, 45, 85, 0.25); +} +.swiper-button-next.color-pink, +.swiper-container-rtl .swiper-button-prev.color-pink, +.theme-pink .swiper-button-next, +.theme-pink .swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ff2d55'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-prev.color-pink, +.swiper-container-rtl .swiper-button-next.color-pink, +.theme-pink .swiper-button-prev, +.theme-pink .swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ff2d55'%2F%3E%3C%2Fsvg%3E"); +} +.bg-pink, +.button.button-fill.bg-pink, +a.bg-pink, +.list-block .swipeout-actions-left a.bg-pink, +.list-block .swipeout-actions-right a.bg-pink { + background-color: #ff2d55; +} +.border-pink { + border-color: #ff2d55; +} +.list-block .border-pink.item-inner:after, +.list-block ul.border-pink:after, +.border-pink:after, +.list-block .border-pink.item-inner:before, +.list-block ul.border-pink:before, +.border-pink:before { + background-color: #ff2d55; +} +.badge.color-pink, +.badge.theme-pink { + background-color: #ff2d55; + color: #fff; +} +.color-blue { + color: #007aff; +} +.list-block .item-link.list-button.color-blue, +.tabbar a.active.color-blue, +a.color-blue { + color: #007aff; +} +.label-switch input[type="checkbox"]:checked + .checkbox.color-blue, +.label-switch.color-blue input[type="checkbox"]:checked + .checkbox { + background-color: #007aff; +} +.color-blue.button:not(.button-fill), +.color-blue.buttons-row .button, +.theme-blue .button:not(.button-fill) { + border-color: #007aff; +} +html:not(.watch-active-state) .color-blue.button:not(.button-fill):active, +html:not(.watch-active-state) .color-blue.buttons-row .button:active, +html:not(.watch-active-state) .theme-blue .button:not(.button-fill):active, +.color-blue.button:not(.button-fill).active-state, +.color-blue.buttons-row .button.active-state, +.theme-blue .button:not(.button-fill).active-state { + background-color: rgba(0, 122, 255, 0.15); +} +.color-blue.button:not(.button-fill).active, +.color-blue.buttons-row .button.active, +.theme-blue .button:not(.button-fill).active { + background-color: #007aff; + color: #fff; +} +.theme-blue .button.button-fill, +.button.button-fill.color-blue { + background: #007aff; + color: #fff; +} +.progressbar.color-blue span, +.progressbar.theme-blue span, +.theme-blue .progressbar span, +.progressbar.bg-blue span { + background-color: #007aff; +} +.progressbar-infinite.color-blue:before, +.progressbar-infinite.theme-blue:before, +.theme-blue .progressbar-infinite:before, +.progressbar-infinite.bg-blue:before { + background-color: #007aff; +} +.color-blue i.icon, +.theme-blue i.icon, +i.icon.color-blue, +i.icon.theme-blue { + color: #007aff; +} +i.icon-next.color-blue, +i.icon-next.theme-blue, +.theme-blue i.icon-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%23007aff'%20d%3D'M1%2C1.6l11.8%2C5.8L1%2C13.4V1.6%20M0%2C0v15l15-7.6L0%2C0L0%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-blue, +i.icon-prev.theme-blue, +.theme-blue i.icon-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%23007aff'%20d%3D'M14%2C1.6v11.8L2.2%2C7.6L14%2C1.6%20M15%2C0L0%2C7.6L15%2C15V0L15%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-blue, +i.icon-back.theme-blue, +.theme-blue i.icon-back { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M10%2C0l2%2C2l-8%2C8l8%2C8l-2%2C2L0%2C10L10%2C0z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-blue, +i.icon-forward.theme-blue, +.theme-blue i.icon-forward { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M2%2C20l-2-2l8-8L0%2C2l2-2l10%2C10L2%2C20z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-bars.color-blue, +i.icon-bars.theme-blue, +.theme-blue i.icon-bars { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2021%2014'%3E%3Cpath%20fill%3D'%23007aff'%20d%3D'M0%2C0h2v2H0V0z%20M4%2C0h17v1H4V0z%20M0%2C6h2v2H0V6z%20M4%2C6h17v1H4V6z%20M0%2C12h2v2H0V12z%20M4%2C12h17v1H4V12z'%2F%3E%3C%2Fsvg%3E"); +} +@media (-webkit-min-device-pixel-ratio: 2) { + i.icon-bars.color-blue, + i.icon-bars.theme-blue, + .theme-blue i.icon-bars { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2042%2026'%3E%3Cpath%20fill%3D'%23007aff'%20d%3D'M0%2C0h4v4H0V0z%20M8%2C1h34v2H8V1z%20M0%2C11h4v4H0V11z%20M8%2C12h34v2H8V12z%20M0%2C22h4v4H0V22z%20M8%2C23h34v2H8V23z'%2F%3E%3C%2Fsvg%3E"); + } +} +.theme-blue a, +.theme-blue .item-link.list-button { + color: #007aff; +} +.theme-blue .tabbar a, +.tabbar.theme-blue a, +.theme-blue .tabbar a i, +.tabbar.theme-blue a i { + color: inherit; +} +.theme-blue .tabbar a.active, +.tabbar.theme-blue a.active, +.theme-blue .tabbar a.active i, +.tabbar.theme-blue a.active i { + color: #007aff; +} +.theme-blue .range-slider input[type="range"]::-webkit-slider-thumb:before, +.range-slider.theme-blue input[type="range"]::-webkit-slider-thumb:before { + background-color: #007aff; +} +.theme-blue .range-slider input[type="range"]::-ms-fill-lower, +.range-slider.theme-blue input[type="range"]::-ms-fill-lower { + background-color: #007aff; +} +.theme-blue label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +.theme-blue label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox { + background-color: #007aff; +} +.theme-blue label.label-radio input[type="checkbox"]:checked ~ .item-inner, +.theme-blue label.label-radio input[type="radio"]:checked ~ .item-inner { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2013%2010'%3E%3Cpolygon%20fill%3D'%23007aff'%20points%3D'11.6%2C0%204.4%2C7.2%201.4%2C4.2%200%2C5.6%204.4%2C10%204.4%2C10%204.4%2C10%2013%2C1.4%20'%2F%3E%3C%2Fsvg%3E"); +} +.theme-blue .picker-calendar-day.picker-calendar-day-selected span { + background-color: #007aff !important; +} +.swiper-pagination.color-blue .swiper-pagination-bullet-active, +.theme-blue .swiper-pagination .swiper-pagination-bullet-active { + background-color: #007aff; +} +.swiper-pagination.color-blue .swiper-pagination-progressbar, +.theme-blue .swiper-pagination .swiper-pagination-progressbar { + background-color: #007aff; +} +.swiper-pagination.swiper-pagination-progress.bg-blue { + background-color: rgba(0, 122, 255, 0.25); +} +.swiper-button-next.color-blue, +.swiper-container-rtl .swiper-button-prev.color-blue, +.theme-blue .swiper-button-next, +.theme-blue .swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-prev.color-blue, +.swiper-container-rtl .swiper-button-next.color-blue, +.theme-blue .swiper-button-prev, +.theme-blue .swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E"); +} +.bg-blue, +.button.button-fill.bg-blue, +a.bg-blue, +.list-block .swipeout-actions-left a.bg-blue, +.list-block .swipeout-actions-right a.bg-blue { + background-color: #007aff; +} +.border-blue { + border-color: #007aff; +} +.list-block .border-blue.item-inner:after, +.list-block ul.border-blue:after, +.border-blue:after, +.list-block .border-blue.item-inner:before, +.list-block ul.border-blue:before, +.border-blue:before { + background-color: #007aff; +} +.badge.color-blue, +.badge.theme-blue { + background-color: #007aff; + color: #fff; +} +.color-green { + color: #4cd964; +} +.list-block .item-link.list-button.color-green, +.tabbar a.active.color-green, +a.color-green { + color: #4cd964; +} +.label-switch input[type="checkbox"]:checked + .checkbox.color-green, +.label-switch.color-green input[type="checkbox"]:checked + .checkbox { + background-color: #4cd964; +} +.color-green.button:not(.button-fill), +.color-green.buttons-row .button, +.theme-green .button:not(.button-fill) { + border-color: #4cd964; +} +html:not(.watch-active-state) .color-green.button:not(.button-fill):active, +html:not(.watch-active-state) .color-green.buttons-row .button:active, +html:not(.watch-active-state) .theme-green .button:not(.button-fill):active, +.color-green.button:not(.button-fill).active-state, +.color-green.buttons-row .button.active-state, +.theme-green .button:not(.button-fill).active-state { + background-color: rgba(76, 217, 100, 0.15); +} +.color-green.button:not(.button-fill).active, +.color-green.buttons-row .button.active, +.theme-green .button:not(.button-fill).active { + background-color: #4cd964; + color: #fff; +} +.theme-green .button.button-fill, +.button.button-fill.color-green { + background: #4cd964; + color: #fff; +} +.progressbar.color-green span, +.progressbar.theme-green span, +.theme-green .progressbar span, +.progressbar.bg-green span { + background-color: #4cd964; +} +.progressbar-infinite.color-green:before, +.progressbar-infinite.theme-green:before, +.theme-green .progressbar-infinite:before, +.progressbar-infinite.bg-green:before { + background-color: #4cd964; +} +.color-green i.icon, +.theme-green i.icon, +i.icon.color-green, +i.icon.theme-green { + color: #4cd964; +} +i.icon-next.color-green, +i.icon-next.theme-green, +.theme-green i.icon-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%234cd964'%20d%3D'M1%2C1.6l11.8%2C5.8L1%2C13.4V1.6%20M0%2C0v15l15-7.6L0%2C0L0%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-green, +i.icon-prev.theme-green, +.theme-green i.icon-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%234cd964'%20d%3D'M14%2C1.6v11.8L2.2%2C7.6L14%2C1.6%20M15%2C0L0%2C7.6L15%2C15V0L15%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-green, +i.icon-back.theme-green, +.theme-green i.icon-back { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M10%2C0l2%2C2l-8%2C8l8%2C8l-2%2C2L0%2C10L10%2C0z'%20fill%3D'%234cd964'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-green, +i.icon-forward.theme-green, +.theme-green i.icon-forward { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M2%2C20l-2-2l8-8L0%2C2l2-2l10%2C10L2%2C20z'%20fill%3D'%234cd964'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-bars.color-green, +i.icon-bars.theme-green, +.theme-green i.icon-bars { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2021%2014'%3E%3Cpath%20fill%3D'%234cd964'%20d%3D'M0%2C0h2v2H0V0z%20M4%2C0h17v1H4V0z%20M0%2C6h2v2H0V6z%20M4%2C6h17v1H4V6z%20M0%2C12h2v2H0V12z%20M4%2C12h17v1H4V12z'%2F%3E%3C%2Fsvg%3E"); +} +@media (-webkit-min-device-pixel-ratio: 2) { + i.icon-bars.color-green, + i.icon-bars.theme-green, + .theme-green i.icon-bars { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2042%2026'%3E%3Cpath%20fill%3D'%234cd964'%20d%3D'M0%2C0h4v4H0V0z%20M8%2C1h34v2H8V1z%20M0%2C11h4v4H0V11z%20M8%2C12h34v2H8V12z%20M0%2C22h4v4H0V22z%20M8%2C23h34v2H8V23z'%2F%3E%3C%2Fsvg%3E"); + } +} +.theme-green a, +.theme-green .item-link.list-button { + color: #4cd964; +} +.theme-green .tabbar a, +.tabbar.theme-green a, +.theme-green .tabbar a i, +.tabbar.theme-green a i { + color: inherit; +} +.theme-green .tabbar a.active, +.tabbar.theme-green a.active, +.theme-green .tabbar a.active i, +.tabbar.theme-green a.active i { + color: #4cd964; +} +.theme-green .range-slider input[type="range"]::-webkit-slider-thumb:before, +.range-slider.theme-green input[type="range"]::-webkit-slider-thumb:before { + background-color: #4cd964; +} +.theme-green .range-slider input[type="range"]::-ms-fill-lower, +.range-slider.theme-green input[type="range"]::-ms-fill-lower { + background-color: #4cd964; +} +.theme-green label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +.theme-green label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox { + background-color: #4cd964; +} +.theme-green label.label-radio input[type="checkbox"]:checked ~ .item-inner, +.theme-green label.label-radio input[type="radio"]:checked ~ .item-inner { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2013%2010'%3E%3Cpolygon%20fill%3D'%234cd964'%20points%3D'11.6%2C0%204.4%2C7.2%201.4%2C4.2%200%2C5.6%204.4%2C10%204.4%2C10%204.4%2C10%2013%2C1.4%20'%2F%3E%3C%2Fsvg%3E"); +} +.theme-green .picker-calendar-day.picker-calendar-day-selected span { + background-color: #4cd964 !important; +} +.swiper-pagination.color-green .swiper-pagination-bullet-active, +.theme-green .swiper-pagination .swiper-pagination-bullet-active { + background-color: #4cd964; +} +.swiper-pagination.color-green .swiper-pagination-progressbar, +.theme-green .swiper-pagination .swiper-pagination-progressbar { + background-color: #4cd964; +} +.swiper-pagination.swiper-pagination-progress.bg-green { + background-color: rgba(76, 217, 100, 0.25); +} +.swiper-button-next.color-green, +.swiper-container-rtl .swiper-button-prev.color-green, +.theme-green .swiper-button-next, +.theme-green .swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%234cd964'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-prev.color-green, +.swiper-container-rtl .swiper-button-next.color-green, +.theme-green .swiper-button-prev, +.theme-green .swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%234cd964'%2F%3E%3C%2Fsvg%3E"); +} +.bg-green, +.button.button-fill.bg-green, +a.bg-green, +.list-block .swipeout-actions-left a.bg-green, +.list-block .swipeout-actions-right a.bg-green { + background-color: #4cd964; +} +.border-green { + border-color: #4cd964; +} +.list-block .border-green.item-inner:after, +.list-block ul.border-green:after, +.border-green:after, +.list-block .border-green.item-inner:before, +.list-block ul.border-green:before, +.border-green:before { + background-color: #4cd964; +} +.badge.color-green, +.badge.theme-green { + background-color: #4cd964; + color: #fff; +} +.color-red { + color: #ff3b30; +} +.list-block .item-link.list-button.color-red, +.tabbar a.active.color-red, +a.color-red { + color: #ff3b30; +} +.label-switch input[type="checkbox"]:checked + .checkbox.color-red, +.label-switch.color-red input[type="checkbox"]:checked + .checkbox { + background-color: #ff3b30; +} +.color-red.button:not(.button-fill), +.color-red.buttons-row .button, +.theme-red .button:not(.button-fill) { + border-color: #ff3b30; +} +html:not(.watch-active-state) .color-red.button:not(.button-fill):active, +html:not(.watch-active-state) .color-red.buttons-row .button:active, +html:not(.watch-active-state) .theme-red .button:not(.button-fill):active, +.color-red.button:not(.button-fill).active-state, +.color-red.buttons-row .button.active-state, +.theme-red .button:not(.button-fill).active-state { + background-color: rgba(255, 59, 48, 0.15); +} +.color-red.button:not(.button-fill).active, +.color-red.buttons-row .button.active, +.theme-red .button:not(.button-fill).active { + background-color: #ff3b30; + color: #fff; +} +.theme-red .button.button-fill, +.button.button-fill.color-red { + background: #ff3b30; + color: #fff; +} +.progressbar.color-red span, +.progressbar.theme-red span, +.theme-red .progressbar span, +.progressbar.bg-red span { + background-color: #ff3b30; +} +.progressbar-infinite.color-red:before, +.progressbar-infinite.theme-red:before, +.theme-red .progressbar-infinite:before, +.progressbar-infinite.bg-red:before { + background-color: #ff3b30; +} +.color-red i.icon, +.theme-red i.icon, +i.icon.color-red, +i.icon.theme-red { + color: #ff3b30; +} +i.icon-next.color-red, +i.icon-next.theme-red, +.theme-red i.icon-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%23ff3b30'%20d%3D'M1%2C1.6l11.8%2C5.8L1%2C13.4V1.6%20M0%2C0v15l15-7.6L0%2C0L0%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-red, +i.icon-prev.theme-red, +.theme-red i.icon-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%23ff3b30'%20d%3D'M14%2C1.6v11.8L2.2%2C7.6L14%2C1.6%20M15%2C0L0%2C7.6L15%2C15V0L15%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-red, +i.icon-back.theme-red, +.theme-red i.icon-back { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M10%2C0l2%2C2l-8%2C8l8%2C8l-2%2C2L0%2C10L10%2C0z'%20fill%3D'%23ff3b30'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-red, +i.icon-forward.theme-red, +.theme-red i.icon-forward { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M2%2C20l-2-2l8-8L0%2C2l2-2l10%2C10L2%2C20z'%20fill%3D'%23ff3b30'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-bars.color-red, +i.icon-bars.theme-red, +.theme-red i.icon-bars { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2021%2014'%3E%3Cpath%20fill%3D'%23ff3b30'%20d%3D'M0%2C0h2v2H0V0z%20M4%2C0h17v1H4V0z%20M0%2C6h2v2H0V6z%20M4%2C6h17v1H4V6z%20M0%2C12h2v2H0V12z%20M4%2C12h17v1H4V12z'%2F%3E%3C%2Fsvg%3E"); +} +@media (-webkit-min-device-pixel-ratio: 2) { + i.icon-bars.color-red, + i.icon-bars.theme-red, + .theme-red i.icon-bars { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2042%2026'%3E%3Cpath%20fill%3D'%23ff3b30'%20d%3D'M0%2C0h4v4H0V0z%20M8%2C1h34v2H8V1z%20M0%2C11h4v4H0V11z%20M8%2C12h34v2H8V12z%20M0%2C22h4v4H0V22z%20M8%2C23h34v2H8V23z'%2F%3E%3C%2Fsvg%3E"); + } +} +.theme-red a, +.theme-red .item-link.list-button { + color: #ff3b30; +} +.theme-red .tabbar a, +.tabbar.theme-red a, +.theme-red .tabbar a i, +.tabbar.theme-red a i { + color: inherit; +} +.theme-red .tabbar a.active, +.tabbar.theme-red a.active, +.theme-red .tabbar a.active i, +.tabbar.theme-red a.active i { + color: #ff3b30; +} +.theme-red .range-slider input[type="range"]::-webkit-slider-thumb:before, +.range-slider.theme-red input[type="range"]::-webkit-slider-thumb:before { + background-color: #ff3b30; +} +.theme-red .range-slider input[type="range"]::-ms-fill-lower, +.range-slider.theme-red input[type="range"]::-ms-fill-lower { + background-color: #ff3b30; +} +.theme-red label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +.theme-red label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox { + background-color: #ff3b30; +} +.theme-red label.label-radio input[type="checkbox"]:checked ~ .item-inner, +.theme-red label.label-radio input[type="radio"]:checked ~ .item-inner { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2013%2010'%3E%3Cpolygon%20fill%3D'%23ff3b30'%20points%3D'11.6%2C0%204.4%2C7.2%201.4%2C4.2%200%2C5.6%204.4%2C10%204.4%2C10%204.4%2C10%2013%2C1.4%20'%2F%3E%3C%2Fsvg%3E"); +} +.theme-red .picker-calendar-day.picker-calendar-day-selected span { + background-color: #ff3b30 !important; +} +.swiper-pagination.color-red .swiper-pagination-bullet-active, +.theme-red .swiper-pagination .swiper-pagination-bullet-active { + background-color: #ff3b30; +} +.swiper-pagination.color-red .swiper-pagination-progressbar, +.theme-red .swiper-pagination .swiper-pagination-progressbar { + background-color: #ff3b30; +} +.swiper-pagination.swiper-pagination-progress.bg-red { + background-color: rgba(255, 59, 48, 0.25); +} +.swiper-button-next.color-red, +.swiper-container-rtl .swiper-button-prev.color-red, +.theme-red .swiper-button-next, +.theme-red .swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ff3b30'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-prev.color-red, +.swiper-container-rtl .swiper-button-next.color-red, +.theme-red .swiper-button-prev, +.theme-red .swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ff3b30'%2F%3E%3C%2Fsvg%3E"); +} +.bg-red, +.button.button-fill.bg-red, +a.bg-red, +.list-block .swipeout-actions-left a.bg-red, +.list-block .swipeout-actions-right a.bg-red { + background-color: #ff3b30; +} +.border-red { + border-color: #ff3b30; +} +.list-block .border-red.item-inner:after, +.list-block ul.border-red:after, +.border-red:after, +.list-block .border-red.item-inner:before, +.list-block ul.border-red:before, +.border-red:before { + background-color: #ff3b30; +} +.badge.color-red, +.badge.theme-red { + background-color: #ff3b30; + color: #fff; +} +/*========================== +Framework7 Layouts Themes +==========================*/ +/* === Dark layout === */ +.layout-dark .navbar, +.navbar.layout-dark, +.layout-dark .subnavbar, +.subnavbar.layout-dark { + background-color: #131313; + color: #fff; +} +.layout-dark .navbar:after, +.navbar.layout-dark:after, +.layout-dark .subnavbar:after, +.subnavbar.layout-dark:after { + background-color: #333; +} +.layout-dark .toolbar, +.toolbar.layout-dark { + background-color: #131313; + color: #fff; +} +.layout-dark .toolbar:before, +.toolbar.layout-dark:before { + background-color: #333; +} +.layout-dark .picker-modal .toolbar { + background-color: #131313; +} +.layout-dark .popover .picker-modal .toolbar { + background: none; +} +.layout-dark .picker-calendar-week-days { + color: #fff; + background-color: #131313; +} +.layout-dark .popover .picker-modal .picker-center-highlight:before, +.layout-dark .picker-modal.picker-modal-inline .picker-center-highlight:before { + background-color: #333; +} +.layout-dark .popover .picker-modal .picker-center-highlight:after, +.layout-dark .picker-modal.picker-modal-inline .picker-center-highlight:after { + background-color: #333; +} +.layout-dark .popover .picker-modal .picker-item.picker-selected, +.layout-dark .picker-modal.picker-modal-inline .picker-item.picker-selected { + color: #fff; +} +.layout-dark .popover .picker-modal .picker-calendar-week-days, +.layout-dark .picker-modal.picker-modal-inline .picker-calendar-week-days { + color: #fff; +} +.layout-dark .popover .picker-modal .picker-calendar-day, +.layout-dark .picker-modal.picker-modal-inline .picker-calendar-day { + color: #fff; +} +.layout-dark .popover .picker-modal .picker-calendar-day.picker-calendar-day-prev, +.layout-dark .picker-modal.picker-modal-inline .picker-calendar-day.picker-calendar-day-prev, +.layout-dark .popover .picker-modal .picker-calendar-day.picker-calendar-day-next, +.layout-dark .picker-modal.picker-modal-inline .picker-calendar-day.picker-calendar-day-next { + color: #777; +} +.layout-dark .popover .picker-modal .picker-calendar-day.picker-calendar-day-disabled, +.layout-dark .picker-modal.picker-modal-inline .picker-calendar-day.picker-calendar-day-disabled { + color: #555; +} +.layout-dark .popover .picker-modal .picker-calendar-day.picker-calendar-day-today span, +.layout-dark .picker-modal.picker-modal-inline .picker-calendar-day.picker-calendar-day-today span { + background: #333; +} +.layout-dark .popover .picker-modal .picker-calendar-day.picker-calendar-day-has-events span:after, +.layout-dark .picker-modal.picker-modal-inline .picker-calendar-day.picker-calendar-day-has-events span:after { + background: #555; +} +.layout-dark .popover .picker-modal .picker-calendar-week-days:after, +.layout-dark .picker-modal.picker-modal-inline .picker-calendar-week-days:after, +.layout-dark .popover .picker-modal .picker-calendar-row:after, +.layout-dark .picker-modal.picker-modal-inline .picker-calendar-row:after { + background-color: #333; +} +.layout-dark .popover .picker-modal .toolbar ~ .picker-modal-inner .picker-calendar-months:before, +.layout-dark .picker-modal.picker-modal-inline .toolbar ~ .picker-modal-inner .picker-calendar-months:before, +.layout-dark .popover .picker-modal .picker-calendar-week-days ~ .picker-calendar-months:before, +.layout-dark .picker-modal.picker-modal-inline .picker-calendar-week-days ~ .picker-calendar-months:before { + background-color: #333; +} +.layout-dark .popover .picker-modal .toolbar:after { + background-color: #333; +} +.layout-dark .photo-browser .navbar, +.layout-dark .views .view[data-page="photo-browser-slides"] .navbar, +.layout-dark .photo-browser .toolbar, +.layout-dark .views .view[data-page="photo-browser-slides"] .toolbar { + color: #000; + background: rgba(247, 247, 247, 0.95); +} +.layout-dark .photo-browser-dark .navbar, +.layout-dark .photo-browser-dark .toolbar { + background: rgba(30, 30, 30, 0.8); + color: #fff; +} +.layout-dark .tabbar a:not(.active) { + color: #fff; +} +.layout-dark .page, +.layout-dark .login-screen-content, +.page.layout-dark, +.layout-dark .panel, +.panel.layout-dark { + background-color: #222426; + color: #ddd; +} +.layout-dark .content-block-title { + color: #fff; +} +.layout-dark .content-block, +.content-block.layout-dark { + color: #bbb; +} +.layout-dark .content-block-inner { + background: #1c1d1f; + color: #ddd; +} +.layout-dark .content-block-inner:before { + background-color: #393939; +} +.layout-dark .content-block-inner:after { + background-color: #393939; +} +.layout-dark .list-block ul, +.list-block.layout-dark ul { + background: #1c1d1f; +} +.layout-dark .list-block ul:before, +.list-block.layout-dark ul:before { + background-color: #393939; +} +.layout-dark .list-block ul:after, +.list-block.layout-dark ul:after { + background-color: #393939; +} +.layout-dark .list-block.inset ul, +.list-block.layout-dark.inset ul { + background: #1c1d1f; +} +.layout-dark .list-block.notifications > ul, +.list-block.layout-dark.notifications > ul { + background: none; +} +.layout-dark .autocomplete-dropdown { + background: #1c1d1f; +} +.layout-dark .autocomplete-dropdown .list-block b { + color: #fff; +} +.layout-dark .card { + background: #1c1d1f; +} +.layout-dark .card-header:after { + background-color: #393939; +} +.layout-dark .card-footer { + color: #bbb; +} +.layout-dark .card-footer:before { + background-color: #393939; +} +.layout-dark .popover, +.popover.layout-dark { + background: rgba(0, 0, 0, 0.8); +} +.layout-dark .popover .popover-angle:after, +.popover.layout-dark .popover-angle:after { + background: rgba(0, 0, 0, 0.8); +} +.layout-dark .popover .list-block ul, +.popover.layout-dark .list-block ul { + background: none; +} +.layout-dark .actions-popover .list-block ul:before { + background-color: #393939; +} +.layout-dark .actions-popover .list-block ul:after { + background-color: #393939; +} +.layout-dark .actions-popover .actions-popover-label:after { + background-color: #393939; +} +.layout-dark li.sorting { + background-color: #29292f; +} +.layout-dark .swipeout-actions-left a, +.layout-dark .swipeout-actions-right a { + background-color: #444; +} +.layout-dark .item-inner:after, +.layout-dark .list-block ul ul li:last-child .item-inner:after { + background-color: #393939; +} +.layout-dark .item-after { + color: #bbb; +} +html:not(.watch-active-state) .layout-dark .item-link:active, +html:not(.watch-active-state) .layout-dark label.label-checkbox:active, +html:not(.watch-active-state) .layout-dark label.label-radio:active, +.layout-dark .item-link.active-state, +.layout-dark label.label-checkbox.active-state, +.layout-dark label.label-radio.active-state { + background-color: #29292f; +} +.layout-dark .item-link.list-button:after { + background-color: #393939; +} +.layout-dark .list-block-label { + color: #bbb; +} +.layout-dark .item-divider, +.layout-dark .list-group-title { + background: #1a1a1a; + color: #bbb; +} +.layout-dark .item-divider:before, +.layout-dark .list-group-title:before { + background-color: #393939; +} +.layout-dark .searchbar { + background: #333; +} +.layout-dark .searchbar:after { + background-color: #333; +} +.layout-dark .list-block input[type="text"], +.list-block.layout-dark input[type="text"], +.layout-dark .list-block input[type="password"], +.list-block.layout-dark input[type="password"], +.layout-dark .list-block input[type="email"], +.list-block.layout-dark input[type="email"], +.layout-dark .list-block input[type="tel"], +.list-block.layout-dark input[type="tel"], +.layout-dark .list-block input[type="url"], +.list-block.layout-dark input[type="url"], +.layout-dark .list-block input[type="date"], +.list-block.layout-dark input[type="date"], +.layout-dark .list-block input[type="datetime-local"], +.list-block.layout-dark input[type="datetime-local"], +.layout-dark .list-block input[type="number"], +.list-block.layout-dark input[type="number"], +.layout-dark .list-block select, +.list-block.layout-dark select, +.layout-dark .list-block textarea, +.list-block.layout-dark textarea { + color: #fff; +} +.layout-dark .label-switch .checkbox { + background-color: #393939; +} +.layout-dark .label-switch .checkbox:before { + background-color: #1c1d1f; +} +.layout-dark .range-slider input[type="range"]:after { + background: #1c1d1f; +} +.layout-dark .range-slider input[type="range"]::-ms-thumb { + border: none; +} +/* === White layout === */ +.layout-white .navbar, +.navbar.layout-white, +.layout-white .subnavbar, +.subnavbar.layout-white { + background-color: #fff; + color: #000; +} +.layout-white .navbar:after, +.navbar.layout-white:after, +.layout-white .subnavbar:after, +.subnavbar.layout-white:after { + background-color: #ddd; +} +.layout-white .toolbar, +.toolbar.layout-white { + background-color: #fff; + color: #000; +} +.layout-white .toolbar:before, +.toolbar.layout-white:before { + background-color: #ddd; +} +.layout-white .picker-modal .toolbar { + background-color: #fff; +} +.layout-white .popover .picker-modal .toolbar { + background: none; +} +.layout-white .popover .picker-modal .picker-center-highlight:before, +.layout-white .picker-modal.picker-modal-inline .picker-center-highlight:before { + background-color: #ddd; +} +.layout-white .popover .picker-modal .picker-center-highlight:after, +.layout-white .picker-modal.picker-modal-inline .picker-center-highlight:after { + background-color: #ddd; +} +.layout-white .popover .picker-modal .picker-calendar-week-days:after, +.layout-white .picker-modal.picker-modal-inline .picker-calendar-week-days:after, +.layout-white .popover .picker-modal .picker-calendar-row:after, +.layout-white .picker-modal.picker-modal-inline .picker-calendar-row:after { + background-color: #ddd; +} +.layout-white .popover .picker-modal .toolbar ~ .picker-modal-inner .picker-calendar-months:before, +.layout-white .picker-modal.picker-modal-inline .toolbar ~ .picker-modal-inner .picker-calendar-months:before, +.layout-white .popover .picker-modal .picker-calendar-week-days ~ .picker-calendar-months:before, +.layout-white .picker-modal.picker-modal-inline .picker-calendar-week-days ~ .picker-calendar-months:before { + background-color: #ddd; +} +.layout-white .popover .picker-modal .toolbar:after { + background-color: #ddd; +} +.layout-white .photo-browser .navbar, +.layout-white .views .view[data-page="photo-browser-slides"] .navbar, +.layout-white .photo-browser .toolbar, +.layout-white .views .view[data-page="photo-browser-slides"] .toolbar { + color: #000; + background: rgba(247, 247, 247, 0.95); +} +.layout-white .photo-browser-dark .navbar, +.layout-white .photo-browser-dark .toolbar { + background: rgba(30, 30, 30, 0.8); + color: #fff; +} +.layout-white .tabbar a:not(.active) { + color: #777; +} +.layout-white .page, +.layout-white .login-screen-content, +.page.layout-white, +.layout-white .panel, +.panel.layout-white { + background-color: #fff; + color: #000; +} +.layout-white .content-block-title { + color: #777; +} +.layout-white .content-block, +.content-block.layout-white { + color: #777; +} +.layout-white .content-block-inner { + background: #fafafa; + color: #000; +} +.layout-white .content-block-inner:after { + background-color: #ddd; +} +.layout-white .content-block-inner:before { + background-color: #ddd; +} +.layout-white .list-block ul, +.list-block.layout-white ul { + background: #fff; +} +.layout-white .list-block ul:after, +.list-block.layout-white ul:after { + background-color: #ddd; +} +.layout-white .list-block ul:before, +.list-block.layout-white ul:before { + background-color: #ddd; +} +.layout-white .list-block.inset ul, +.list-block.layout-white.inset ul { + background: #fafafa; +} +.layout-white .list-block.notifications > ul, +.list-block.layout-white.notifications > ul { + background: none; +} +.layout-white .popover-inner > .list-block ul { + background: none; +} +.layout-white li.sorting { + background-color: #eee; +} +.layout-white .swipeout-actions-left a, +.layout-white .swipeout-actions-right a { + background-color: #c7c7cc; +} +.layout-white .item-inner, +.layout-white .list-block ul ul li:last-child .item-inner { + border-color: #ddd; +} +.layout-white .item-inner:after, +.layout-white .list-block ul ul li:last-child .item-inner:after { + background-color: #ddd; +} +.layout-white .item-after { + color: #8e8e93; +} +html:not(.watch-active-state) .layout-white .item-link:active, +html:not(.watch-active-state) .layout-white label.label-checkbox:active, +html:not(.watch-active-state) .layout-white label.label-radio:active, +.layout-white .item-link.active-state, +.layout-white label.label-checkbox.active-state, +.layout-white label.label-radio.active-state { + background-color: #eee; +} +.layout-white .item-link.list-button:after { + background-color: #ddd; +} +.layout-white .list-block-label { + color: #777; +} +.layout-white .item-divider, +.layout-white .list-group-title { + background: #f7f7f7; + color: #777; +} +.layout-white .item-divider:before, +.layout-white .list-group-title:before { + background-color: #ddd; +} +.layout-white .searchbar { + background: #c9c9ce; +} +.layout-white .searchbar:after { + background-color: #b4b4b4; +} +.layout-white .list-block input[type="text"], +.list-block.layout-white input[type="text"], +.layout-white .list-block input[type="password"], +.list-block.layout-white input[type="password"], +.layout-white .list-block input[type="email"], +.list-block.layout-white input[type="email"], +.layout-white .list-block input[type="tel"], +.list-block.layout-white input[type="tel"], +.layout-white .list-block input[type="url"], +.list-block.layout-white input[type="url"], +.layout-white .list-block input[type="date"], +.list-block.layout-white input[type="date"], +.layout-white .list-block input[type="datetime-local"], +.list-block.layout-white input[type="datetime-local"], +.layout-white .list-block input[type="number"], +.list-block.layout-white input[type="number"], +.layout-white .list-block select, +.list-block.layout-white select, +.layout-white .list-block textarea, +.list-block.layout-white textarea { + color: #777; +} +.layout-white .label-switch .checkbox { + background-color: #e5e5e5; +} +.layout-white .label-switch .checkbox:before { + background-color: #fff; +} +.layout-white .range-slider input[type="range"]:after { + background: #fff; +} diff --git a/www/libs/framework7/css/framework7.ios.css b/www/libs/framework7/css/framework7.ios.css new file mode 100644 index 0000000..b28381c --- /dev/null +++ b/www/libs/framework7/css/framework7.ios.css @@ -0,0 +1,6618 @@ +/** + * Framework7 1.4.2 + * Full Featured Mobile HTML Framework For Building iOS & Android Apps + * + * iOS Theme + * + * http://www.idangero.us/framework7 + * + * Copyright 2016, Vladimir Kharlampidi + * The iDangero.us + * http://www.idangero.us/ + * + * Licensed under MIT + * + * Released on: June 26, 2016 + */ +html, +body { + position: relative; + height: 100%; + width: 100%; + overflow-x: hidden; +} +body { + font-family: -apple-system, SF UI Text, Helvetica Neue, Helvetica, Arial, sans-serif; + margin: 0; + padding: 0; + color: #000; + font-size: 14px; + line-height: 1.4; + width: 100%; + -webkit-text-size-adjust: 100%; + background: #fff; + overflow: hidden; +} +@media all and (width: 1024px) and (height: 691px) and (orientation: landscape) { + html, + body { + height: 671px; + } +} +@media all and (width: 1024px) and (height: 692px) and (orientation: landscape) { + html, + body { + height: 672px; + } +} +* { + -webkit-tap-highlight-color: rgba(0, 0, 0, 0); + -webkit-touch-callout: none; +} +a, +input, +textarea, +select { + outline: 0; +} +a { + text-decoration: none; + color: #007aff; +} +p { + margin: 1em 0; +} +/* === Grid === */ +.row { + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: justify; + -ms-flex-pack: justify; + -webkit-justify-content: space-between; + justify-content: space-between; + -webkit-box-lines: multiple; + -moz-box-lines: multiple; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + -webkit-box-align: start; + -ms-flex-align: start; + -webkit-align-items: flex-start; + align-items: flex-start; +} +.row > [class*="col-"] { + box-sizing: border-box; +} +.row .col-auto { + width: 100%; +} +.row .col-100 { + width: 100%; + width: -webkit-calc((100% - 15px*0) / 1); + width: calc((100% - 15px*0) / 1); +} +.row.no-gutter .col-100 { + width: 100%; +} +.row .col-95 { + width: 95%; + width: -webkit-calc((100% - 15px*0.05263157894736836) / 1.0526315789473684); + width: calc((100% - 15px*0.05263157894736836) / 1.0526315789473684); +} +.row.no-gutter .col-95 { + width: 95%; +} +.row .col-90 { + width: 90%; + width: -webkit-calc((100% - 15px*0.11111111111111116) / 1.1111111111111112); + width: calc((100% - 15px*0.11111111111111116) / 1.1111111111111112); +} +.row.no-gutter .col-90 { + width: 90%; +} +.row .col-85 { + width: 85%; + width: -webkit-calc((100% - 15px*0.17647058823529416) / 1.1764705882352942); + width: calc((100% - 15px*0.17647058823529416) / 1.1764705882352942); +} +.row.no-gutter .col-85 { + width: 85%; +} +.row .col-80 { + width: 80%; + width: -webkit-calc((100% - 15px*0.25) / 1.25); + width: calc((100% - 15px*0.25) / 1.25); +} +.row.no-gutter .col-80 { + width: 80%; +} +.row .col-75 { + width: 75%; + width: -webkit-calc((100% - 15px*0.33333333333333326) / 1.3333333333333333); + width: calc((100% - 15px*0.33333333333333326) / 1.3333333333333333); +} +.row.no-gutter .col-75 { + width: 75%; +} +.row .col-70 { + width: 70%; + width: -webkit-calc((100% - 15px*0.4285714285714286) / 1.4285714285714286); + width: calc((100% - 15px*0.4285714285714286) / 1.4285714285714286); +} +.row.no-gutter .col-70 { + width: 70%; +} +.row .col-66 { + width: 66.66666666666666%; + width: -webkit-calc((100% - 15px*0.5000000000000002) / 1.5000000000000002); + width: calc((100% - 15px*0.5000000000000002) / 1.5000000000000002); +} +.row.no-gutter .col-66 { + width: 66.66666666666666%; +} +.row .col-65 { + width: 65%; + width: -webkit-calc((100% - 15px*0.5384615384615385) / 1.5384615384615385); + width: calc((100% - 15px*0.5384615384615385) / 1.5384615384615385); +} +.row.no-gutter .col-65 { + width: 65%; +} +.row .col-60 { + width: 60%; + width: -webkit-calc((100% - 15px*0.6666666666666667) / 1.6666666666666667); + width: calc((100% - 15px*0.6666666666666667) / 1.6666666666666667); +} +.row.no-gutter .col-60 { + width: 60%; +} +.row .col-55 { + width: 55%; + width: -webkit-calc((100% - 15px*0.8181818181818181) / 1.8181818181818181); + width: calc((100% - 15px*0.8181818181818181) / 1.8181818181818181); +} +.row.no-gutter .col-55 { + width: 55%; +} +.row .col-50 { + width: 50%; + width: -webkit-calc((100% - 15px*1) / 2); + width: calc((100% - 15px*1) / 2); +} +.row.no-gutter .col-50 { + width: 50%; +} +.row .col-45 { + width: 45%; + width: -webkit-calc((100% - 15px*1.2222222222222223) / 2.2222222222222223); + width: calc((100% - 15px*1.2222222222222223) / 2.2222222222222223); +} +.row.no-gutter .col-45 { + width: 45%; +} +.row .col-40 { + width: 40%; + width: -webkit-calc((100% - 15px*1.5) / 2.5); + width: calc((100% - 15px*1.5) / 2.5); +} +.row.no-gutter .col-40 { + width: 40%; +} +.row .col-35 { + width: 35%; + width: -webkit-calc((100% - 15px*1.8571428571428572) / 2.857142857142857); + width: calc((100% - 15px*1.8571428571428572) / 2.857142857142857); +} +.row.no-gutter .col-35 { + width: 35%; +} +.row .col-33 { + width: 33.333333333333336%; + width: -webkit-calc((100% - 15px*2) / 3); + width: calc((100% - 15px*2) / 3); +} +.row.no-gutter .col-33 { + width: 33.333333333333336%; +} +.row .col-30 { + width: 30%; + width: -webkit-calc((100% - 15px*2.3333333333333335) / 3.3333333333333335); + width: calc((100% - 15px*2.3333333333333335) / 3.3333333333333335); +} +.row.no-gutter .col-30 { + width: 30%; +} +.row .col-25 { + width: 25%; + width: -webkit-calc((100% - 15px*3) / 4); + width: calc((100% - 15px*3) / 4); +} +.row.no-gutter .col-25 { + width: 25%; +} +.row .col-20 { + width: 20%; + width: -webkit-calc((100% - 15px*4) / 5); + width: calc((100% - 15px*4) / 5); +} +.row.no-gutter .col-20 { + width: 20%; +} +.row .col-15 { + width: 15%; + width: -webkit-calc((100% - 15px*5.666666666666667) / 6.666666666666667); + width: calc((100% - 15px*5.666666666666667) / 6.666666666666667); +} +.row.no-gutter .col-15 { + width: 15%; +} +.row .col-10 { + width: 10%; + width: -webkit-calc((100% - 15px*9) / 10); + width: calc((100% - 15px*9) / 10); +} +.row.no-gutter .col-10 { + width: 10%; +} +.row .col-5 { + width: 5%; + width: -webkit-calc((100% - 15px*19) / 20); + width: calc((100% - 15px*19) / 20); +} +.row.no-gutter .col-5 { + width: 5%; +} +.row .col-auto:nth-last-child(1), +.row .col-auto:nth-last-child(1) ~ .col-auto { + width: 100%; + width: -webkit-calc((100% - 15px*0) / 1); + width: calc((100% - 15px*0) / 1); +} +.row.no-gutter .col-auto:nth-last-child(1), +.row.no-gutter .col-auto:nth-last-child(1) ~ .col-auto { + width: 100%; +} +.row .col-auto:nth-last-child(2), +.row .col-auto:nth-last-child(2) ~ .col-auto { + width: 50%; + width: -webkit-calc((100% - 15px*1) / 2); + width: calc((100% - 15px*1) / 2); +} +.row.no-gutter .col-auto:nth-last-child(2), +.row.no-gutter .col-auto:nth-last-child(2) ~ .col-auto { + width: 50%; +} +.row .col-auto:nth-last-child(3), +.row .col-auto:nth-last-child(3) ~ .col-auto { + width: 33.33333333%; + width: -webkit-calc((100% - 15px*2) / 3); + width: calc((100% - 15px*2) / 3); +} +.row.no-gutter .col-auto:nth-last-child(3), +.row.no-gutter .col-auto:nth-last-child(3) ~ .col-auto { + width: 33.33333333%; +} +.row .col-auto:nth-last-child(4), +.row .col-auto:nth-last-child(4) ~ .col-auto { + width: 25%; + width: -webkit-calc((100% - 15px*3) / 4); + width: calc((100% - 15px*3) / 4); +} +.row.no-gutter .col-auto:nth-last-child(4), +.row.no-gutter .col-auto:nth-last-child(4) ~ .col-auto { + width: 25%; +} +.row .col-auto:nth-last-child(5), +.row .col-auto:nth-last-child(5) ~ .col-auto { + width: 20%; + width: -webkit-calc((100% - 15px*4) / 5); + width: calc((100% - 15px*4) / 5); +} +.row.no-gutter .col-auto:nth-last-child(5), +.row.no-gutter .col-auto:nth-last-child(5) ~ .col-auto { + width: 20%; +} +.row .col-auto:nth-last-child(6), +.row .col-auto:nth-last-child(6) ~ .col-auto { + width: 16.66666667%; + width: -webkit-calc((100% - 15px*5) / 6); + width: calc((100% - 15px*5) / 6); +} +.row.no-gutter .col-auto:nth-last-child(6), +.row.no-gutter .col-auto:nth-last-child(6) ~ .col-auto { + width: 16.66666667%; +} +.row .col-auto:nth-last-child(7), +.row .col-auto:nth-last-child(7) ~ .col-auto { + width: 14.28571429%; + width: -webkit-calc((100% - 15px*6) / 7); + width: calc((100% - 15px*6) / 7); +} +.row.no-gutter .col-auto:nth-last-child(7), +.row.no-gutter .col-auto:nth-last-child(7) ~ .col-auto { + width: 14.28571429%; +} +.row .col-auto:nth-last-child(8), +.row .col-auto:nth-last-child(8) ~ .col-auto { + width: 12.5%; + width: -webkit-calc((100% - 15px*7) / 8); + width: calc((100% - 15px*7) / 8); +} +.row.no-gutter .col-auto:nth-last-child(8), +.row.no-gutter .col-auto:nth-last-child(8) ~ .col-auto { + width: 12.5%; +} +.row .col-auto:nth-last-child(9), +.row .col-auto:nth-last-child(9) ~ .col-auto { + width: 11.11111111%; + width: -webkit-calc((100% - 15px*8) / 9); + width: calc((100% - 15px*8) / 9); +} +.row.no-gutter .col-auto:nth-last-child(9), +.row.no-gutter .col-auto:nth-last-child(9) ~ .col-auto { + width: 11.11111111%; +} +.row .col-auto:nth-last-child(10), +.row .col-auto:nth-last-child(10) ~ .col-auto { + width: 10%; + width: -webkit-calc((100% - 15px*9) / 10); + width: calc((100% - 15px*9) / 10); +} +.row.no-gutter .col-auto:nth-last-child(10), +.row.no-gutter .col-auto:nth-last-child(10) ~ .col-auto { + width: 10%; +} +.row .col-auto:nth-last-child(11), +.row .col-auto:nth-last-child(11) ~ .col-auto { + width: 9.09090909%; + width: -webkit-calc((100% - 15px*10) / 11); + width: calc((100% - 15px*10) / 11); +} +.row.no-gutter .col-auto:nth-last-child(11), +.row.no-gutter .col-auto:nth-last-child(11) ~ .col-auto { + width: 9.09090909%; +} +.row .col-auto:nth-last-child(12), +.row .col-auto:nth-last-child(12) ~ .col-auto { + width: 8.33333333%; + width: -webkit-calc((100% - 15px*11) / 12); + width: calc((100% - 15px*11) / 12); +} +.row.no-gutter .col-auto:nth-last-child(12), +.row.no-gutter .col-auto:nth-last-child(12) ~ .col-auto { + width: 8.33333333%; +} +.row .col-auto:nth-last-child(13), +.row .col-auto:nth-last-child(13) ~ .col-auto { + width: 7.69230769%; + width: -webkit-calc((100% - 15px*12) / 13); + width: calc((100% - 15px*12) / 13); +} +.row.no-gutter .col-auto:nth-last-child(13), +.row.no-gutter .col-auto:nth-last-child(13) ~ .col-auto { + width: 7.69230769%; +} +.row .col-auto:nth-last-child(14), +.row .col-auto:nth-last-child(14) ~ .col-auto { + width: 7.14285714%; + width: -webkit-calc((100% - 15px*13) / 14); + width: calc((100% - 15px*13) / 14); +} +.row.no-gutter .col-auto:nth-last-child(14), +.row.no-gutter .col-auto:nth-last-child(14) ~ .col-auto { + width: 7.14285714%; +} +.row .col-auto:nth-last-child(15), +.row .col-auto:nth-last-child(15) ~ .col-auto { + width: 6.66666667%; + width: -webkit-calc((100% - 15px*14) / 15); + width: calc((100% - 15px*14) / 15); +} +.row.no-gutter .col-auto:nth-last-child(15), +.row.no-gutter .col-auto:nth-last-child(15) ~ .col-auto { + width: 6.66666667%; +} +.row .col-auto:nth-last-child(16), +.row .col-auto:nth-last-child(16) ~ .col-auto { + width: 6.25%; + width: -webkit-calc((100% - 15px*15) / 16); + width: calc((100% - 15px*15) / 16); +} +.row.no-gutter .col-auto:nth-last-child(16), +.row.no-gutter .col-auto:nth-last-child(16) ~ .col-auto { + width: 6.25%; +} +.row .col-auto:nth-last-child(17), +.row .col-auto:nth-last-child(17) ~ .col-auto { + width: 5.88235294%; + width: -webkit-calc((100% - 15px*16) / 17); + width: calc((100% - 15px*16) / 17); +} +.row.no-gutter .col-auto:nth-last-child(17), +.row.no-gutter .col-auto:nth-last-child(17) ~ .col-auto { + width: 5.88235294%; +} +.row .col-auto:nth-last-child(18), +.row .col-auto:nth-last-child(18) ~ .col-auto { + width: 5.55555556%; + width: -webkit-calc((100% - 15px*17) / 18); + width: calc((100% - 15px*17) / 18); +} +.row.no-gutter .col-auto:nth-last-child(18), +.row.no-gutter .col-auto:nth-last-child(18) ~ .col-auto { + width: 5.55555556%; +} +.row .col-auto:nth-last-child(19), +.row .col-auto:nth-last-child(19) ~ .col-auto { + width: 5.26315789%; + width: -webkit-calc((100% - 15px*18) / 19); + width: calc((100% - 15px*18) / 19); +} +.row.no-gutter .col-auto:nth-last-child(19), +.row.no-gutter .col-auto:nth-last-child(19) ~ .col-auto { + width: 5.26315789%; +} +.row .col-auto:nth-last-child(20), +.row .col-auto:nth-last-child(20) ~ .col-auto { + width: 5%; + width: -webkit-calc((100% - 15px*19) / 20); + width: calc((100% - 15px*19) / 20); +} +.row.no-gutter .col-auto:nth-last-child(20), +.row.no-gutter .col-auto:nth-last-child(20) ~ .col-auto { + width: 5%; +} +.row .col-auto:nth-last-child(21), +.row .col-auto:nth-last-child(21) ~ .col-auto { + width: 4.76190476%; + width: -webkit-calc((100% - 15px*20) / 21); + width: calc((100% - 15px*20) / 21); +} +.row.no-gutter .col-auto:nth-last-child(21), +.row.no-gutter .col-auto:nth-last-child(21) ~ .col-auto { + width: 4.76190476%; +} +@media all and (min-width: 768px) { + .row .tablet-100 { + width: 100%; + width: -webkit-calc((100% - 15px*0) / 1); + width: calc((100% - 15px*0) / 1); + } + .row.no-gutter .tablet-100 { + width: 100%; + } + .row .tablet-95 { + width: 95%; + width: -webkit-calc((100% - 15px*0.05263157894736836) / 1.0526315789473684); + width: calc((100% - 15px*0.05263157894736836) / 1.0526315789473684); + } + .row.no-gutter .tablet-95 { + width: 95%; + } + .row .tablet-90 { + width: 90%; + width: -webkit-calc((100% - 15px*0.11111111111111116) / 1.1111111111111112); + width: calc((100% - 15px*0.11111111111111116) / 1.1111111111111112); + } + .row.no-gutter .tablet-90 { + width: 90%; + } + .row .tablet-85 { + width: 85%; + width: -webkit-calc((100% - 15px*0.17647058823529416) / 1.1764705882352942); + width: calc((100% - 15px*0.17647058823529416) / 1.1764705882352942); + } + .row.no-gutter .tablet-85 { + width: 85%; + } + .row .tablet-80 { + width: 80%; + width: -webkit-calc((100% - 15px*0.25) / 1.25); + width: calc((100% - 15px*0.25) / 1.25); + } + .row.no-gutter .tablet-80 { + width: 80%; + } + .row .tablet-75 { + width: 75%; + width: -webkit-calc((100% - 15px*0.33333333333333326) / 1.3333333333333333); + width: calc((100% - 15px*0.33333333333333326) / 1.3333333333333333); + } + .row.no-gutter .tablet-75 { + width: 75%; + } + .row .tablet-70 { + width: 70%; + width: -webkit-calc((100% - 15px*0.4285714285714286) / 1.4285714285714286); + width: calc((100% - 15px*0.4285714285714286) / 1.4285714285714286); + } + .row.no-gutter .tablet-70 { + width: 70%; + } + .row .tablet-66 { + width: 66.66666666666666%; + width: -webkit-calc((100% - 15px*0.5000000000000002) / 1.5000000000000002); + width: calc((100% - 15px*0.5000000000000002) / 1.5000000000000002); + } + .row.no-gutter .tablet-66 { + width: 66.66666666666666%; + } + .row .tablet-65 { + width: 65%; + width: -webkit-calc((100% - 15px*0.5384615384615385) / 1.5384615384615385); + width: calc((100% - 15px*0.5384615384615385) / 1.5384615384615385); + } + .row.no-gutter .tablet-65 { + width: 65%; + } + .row .tablet-60 { + width: 60%; + width: -webkit-calc((100% - 15px*0.6666666666666667) / 1.6666666666666667); + width: calc((100% - 15px*0.6666666666666667) / 1.6666666666666667); + } + .row.no-gutter .tablet-60 { + width: 60%; + } + .row .tablet-55 { + width: 55%; + width: -webkit-calc((100% - 15px*0.8181818181818181) / 1.8181818181818181); + width: calc((100% - 15px*0.8181818181818181) / 1.8181818181818181); + } + .row.no-gutter .tablet-55 { + width: 55%; + } + .row .tablet-50 { + width: 50%; + width: -webkit-calc((100% - 15px*1) / 2); + width: calc((100% - 15px*1) / 2); + } + .row.no-gutter .tablet-50 { + width: 50%; + } + .row .tablet-45 { + width: 45%; + width: -webkit-calc((100% - 15px*1.2222222222222223) / 2.2222222222222223); + width: calc((100% - 15px*1.2222222222222223) / 2.2222222222222223); + } + .row.no-gutter .tablet-45 { + width: 45%; + } + .row .tablet-40 { + width: 40%; + width: -webkit-calc((100% - 15px*1.5) / 2.5); + width: calc((100% - 15px*1.5) / 2.5); + } + .row.no-gutter .tablet-40 { + width: 40%; + } + .row .tablet-35 { + width: 35%; + width: -webkit-calc((100% - 15px*1.8571428571428572) / 2.857142857142857); + width: calc((100% - 15px*1.8571428571428572) / 2.857142857142857); + } + .row.no-gutter .tablet-35 { + width: 35%; + } + .row .tablet-33 { + width: 33.333333333333336%; + width: -webkit-calc((100% - 15px*2) / 3); + width: calc((100% - 15px*2) / 3); + } + .row.no-gutter .tablet-33 { + width: 33.333333333333336%; + } + .row .tablet-30 { + width: 30%; + width: -webkit-calc((100% - 15px*2.3333333333333335) / 3.3333333333333335); + width: calc((100% - 15px*2.3333333333333335) / 3.3333333333333335); + } + .row.no-gutter .tablet-30 { + width: 30%; + } + .row .tablet-25 { + width: 25%; + width: -webkit-calc((100% - 15px*3) / 4); + width: calc((100% - 15px*3) / 4); + } + .row.no-gutter .tablet-25 { + width: 25%; + } + .row .tablet-20 { + width: 20%; + width: -webkit-calc((100% - 15px*4) / 5); + width: calc((100% - 15px*4) / 5); + } + .row.no-gutter .tablet-20 { + width: 20%; + } + .row .tablet-15 { + width: 15%; + width: -webkit-calc((100% - 15px*5.666666666666667) / 6.666666666666667); + width: calc((100% - 15px*5.666666666666667) / 6.666666666666667); + } + .row.no-gutter .tablet-15 { + width: 15%; + } + .row .tablet-10 { + width: 10%; + width: -webkit-calc((100% - 15px*9) / 10); + width: calc((100% - 15px*9) / 10); + } + .row.no-gutter .tablet-10 { + width: 10%; + } + .row .tablet-5 { + width: 5%; + width: -webkit-calc((100% - 15px*19) / 20); + width: calc((100% - 15px*19) / 20); + } + .row.no-gutter .tablet-5 { + width: 5%; + } + .row .tablet-auto:nth-last-child(1), + .row .tablet-auto:nth-last-child(1) ~ .col-auto { + width: 100%; + width: -webkit-calc((100% - 15px*0) / 1); + width: calc((100% - 15px*0) / 1); + } + .row.no-gutter .tablet-auto:nth-last-child(1), + .row.no-gutter .tablet-auto:nth-last-child(1) ~ .tablet-auto { + width: 100%; + } + .row .tablet-auto:nth-last-child(2), + .row .tablet-auto:nth-last-child(2) ~ .col-auto { + width: 50%; + width: -webkit-calc((100% - 15px*1) / 2); + width: calc((100% - 15px*1) / 2); + } + .row.no-gutter .tablet-auto:nth-last-child(2), + .row.no-gutter .tablet-auto:nth-last-child(2) ~ .tablet-auto { + width: 50%; + } + .row .tablet-auto:nth-last-child(3), + .row .tablet-auto:nth-last-child(3) ~ .col-auto { + width: 33.33333333%; + width: -webkit-calc((100% - 15px*2) / 3); + width: calc((100% - 15px*2) / 3); + } + .row.no-gutter .tablet-auto:nth-last-child(3), + .row.no-gutter .tablet-auto:nth-last-child(3) ~ .tablet-auto { + width: 33.33333333%; + } + .row .tablet-auto:nth-last-child(4), + .row .tablet-auto:nth-last-child(4) ~ .col-auto { + width: 25%; + width: -webkit-calc((100% - 15px*3) / 4); + width: calc((100% - 15px*3) / 4); + } + .row.no-gutter .tablet-auto:nth-last-child(4), + .row.no-gutter .tablet-auto:nth-last-child(4) ~ .tablet-auto { + width: 25%; + } + .row .tablet-auto:nth-last-child(5), + .row .tablet-auto:nth-last-child(5) ~ .col-auto { + width: 20%; + width: -webkit-calc((100% - 15px*4) / 5); + width: calc((100% - 15px*4) / 5); + } + .row.no-gutter .tablet-auto:nth-last-child(5), + .row.no-gutter .tablet-auto:nth-last-child(5) ~ .tablet-auto { + width: 20%; + } + .row .tablet-auto:nth-last-child(6), + .row .tablet-auto:nth-last-child(6) ~ .col-auto { + width: 16.66666667%; + width: -webkit-calc((100% - 15px*5) / 6); + width: calc((100% - 15px*5) / 6); + } + .row.no-gutter .tablet-auto:nth-last-child(6), + .row.no-gutter .tablet-auto:nth-last-child(6) ~ .tablet-auto { + width: 16.66666667%; + } + .row .tablet-auto:nth-last-child(7), + .row .tablet-auto:nth-last-child(7) ~ .col-auto { + width: 14.28571429%; + width: -webkit-calc((100% - 15px*6) / 7); + width: calc((100% - 15px*6) / 7); + } + .row.no-gutter .tablet-auto:nth-last-child(7), + .row.no-gutter .tablet-auto:nth-last-child(7) ~ .tablet-auto { + width: 14.28571429%; + } + .row .tablet-auto:nth-last-child(8), + .row .tablet-auto:nth-last-child(8) ~ .col-auto { + width: 12.5%; + width: -webkit-calc((100% - 15px*7) / 8); + width: calc((100% - 15px*7) / 8); + } + .row.no-gutter .tablet-auto:nth-last-child(8), + .row.no-gutter .tablet-auto:nth-last-child(8) ~ .tablet-auto { + width: 12.5%; + } + .row .tablet-auto:nth-last-child(9), + .row .tablet-auto:nth-last-child(9) ~ .col-auto { + width: 11.11111111%; + width: -webkit-calc((100% - 15px*8) / 9); + width: calc((100% - 15px*8) / 9); + } + .row.no-gutter .tablet-auto:nth-last-child(9), + .row.no-gutter .tablet-auto:nth-last-child(9) ~ .tablet-auto { + width: 11.11111111%; + } + .row .tablet-auto:nth-last-child(10), + .row .tablet-auto:nth-last-child(10) ~ .col-auto { + width: 10%; + width: -webkit-calc((100% - 15px*9) / 10); + width: calc((100% - 15px*9) / 10); + } + .row.no-gutter .tablet-auto:nth-last-child(10), + .row.no-gutter .tablet-auto:nth-last-child(10) ~ .tablet-auto { + width: 10%; + } + .row .tablet-auto:nth-last-child(11), + .row .tablet-auto:nth-last-child(11) ~ .col-auto { + width: 9.09090909%; + width: -webkit-calc((100% - 15px*10) / 11); + width: calc((100% - 15px*10) / 11); + } + .row.no-gutter .tablet-auto:nth-last-child(11), + .row.no-gutter .tablet-auto:nth-last-child(11) ~ .tablet-auto { + width: 9.09090909%; + } + .row .tablet-auto:nth-last-child(12), + .row .tablet-auto:nth-last-child(12) ~ .col-auto { + width: 8.33333333%; + width: -webkit-calc((100% - 15px*11) / 12); + width: calc((100% - 15px*11) / 12); + } + .row.no-gutter .tablet-auto:nth-last-child(12), + .row.no-gutter .tablet-auto:nth-last-child(12) ~ .tablet-auto { + width: 8.33333333%; + } + .row .tablet-auto:nth-last-child(13), + .row .tablet-auto:nth-last-child(13) ~ .col-auto { + width: 7.69230769%; + width: -webkit-calc((100% - 15px*12) / 13); + width: calc((100% - 15px*12) / 13); + } + .row.no-gutter .tablet-auto:nth-last-child(13), + .row.no-gutter .tablet-auto:nth-last-child(13) ~ .tablet-auto { + width: 7.69230769%; + } + .row .tablet-auto:nth-last-child(14), + .row .tablet-auto:nth-last-child(14) ~ .col-auto { + width: 7.14285714%; + width: -webkit-calc((100% - 15px*13) / 14); + width: calc((100% - 15px*13) / 14); + } + .row.no-gutter .tablet-auto:nth-last-child(14), + .row.no-gutter .tablet-auto:nth-last-child(14) ~ .tablet-auto { + width: 7.14285714%; + } + .row .tablet-auto:nth-last-child(15), + .row .tablet-auto:nth-last-child(15) ~ .col-auto { + width: 6.66666667%; + width: -webkit-calc((100% - 15px*14) / 15); + width: calc((100% - 15px*14) / 15); + } + .row.no-gutter .tablet-auto:nth-last-child(15), + .row.no-gutter .tablet-auto:nth-last-child(15) ~ .tablet-auto { + width: 6.66666667%; + } + .row .tablet-auto:nth-last-child(16), + .row .tablet-auto:nth-last-child(16) ~ .col-auto { + width: 6.25%; + width: -webkit-calc((100% - 15px*15) / 16); + width: calc((100% - 15px*15) / 16); + } + .row.no-gutter .tablet-auto:nth-last-child(16), + .row.no-gutter .tablet-auto:nth-last-child(16) ~ .tablet-auto { + width: 6.25%; + } + .row .tablet-auto:nth-last-child(17), + .row .tablet-auto:nth-last-child(17) ~ .col-auto { + width: 5.88235294%; + width: -webkit-calc((100% - 15px*16) / 17); + width: calc((100% - 15px*16) / 17); + } + .row.no-gutter .tablet-auto:nth-last-child(17), + .row.no-gutter .tablet-auto:nth-last-child(17) ~ .tablet-auto { + width: 5.88235294%; + } + .row .tablet-auto:nth-last-child(18), + .row .tablet-auto:nth-last-child(18) ~ .col-auto { + width: 5.55555556%; + width: -webkit-calc((100% - 15px*17) / 18); + width: calc((100% - 15px*17) / 18); + } + .row.no-gutter .tablet-auto:nth-last-child(18), + .row.no-gutter .tablet-auto:nth-last-child(18) ~ .tablet-auto { + width: 5.55555556%; + } + .row .tablet-auto:nth-last-child(19), + .row .tablet-auto:nth-last-child(19) ~ .col-auto { + width: 5.26315789%; + width: -webkit-calc((100% - 15px*18) / 19); + width: calc((100% - 15px*18) / 19); + } + .row.no-gutter .tablet-auto:nth-last-child(19), + .row.no-gutter .tablet-auto:nth-last-child(19) ~ .tablet-auto { + width: 5.26315789%; + } + .row .tablet-auto:nth-last-child(20), + .row .tablet-auto:nth-last-child(20) ~ .col-auto { + width: 5%; + width: -webkit-calc((100% - 15px*19) / 20); + width: calc((100% - 15px*19) / 20); + } + .row.no-gutter .tablet-auto:nth-last-child(20), + .row.no-gutter .tablet-auto:nth-last-child(20) ~ .tablet-auto { + width: 5%; + } + .row .tablet-auto:nth-last-child(21), + .row .tablet-auto:nth-last-child(21) ~ .col-auto { + width: 4.76190476%; + width: -webkit-calc((100% - 15px*20) / 21); + width: calc((100% - 15px*20) / 21); + } + .row.no-gutter .tablet-auto:nth-last-child(21), + .row.no-gutter .tablet-auto:nth-last-child(21) ~ .tablet-auto { + width: 4.76190476%; + } +} +/* === Views === */ +.views, +.view { + position: relative; + width: 100%; + height: 100%; + z-index: 5000; +} +.views { + overflow: auto; + -webkit-overflow-scrolling: touch; +} +.view { + overflow: hidden; + box-sizing: border-box; +} +/* === Pages === */ +.pages { + position: relative; + width: 100%; + height: 100%; + overflow: hidden; + background: #000; +} +.page { + box-sizing: border-box; + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + background: #efeff4; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +.page.cached { + display: none; +} +.page-on-left { + opacity: 0.9; + -webkit-transform: translate3d(-20%, 0, 0); + transform: translate3d(-20%, 0, 0); +} +.page-on-center .swipeback-page-shadow { + opacity: 1; +} +.page-on-right { + -webkit-transform: translate3d(100%, 0, 0); + transform: translate3d(100%, 0, 0); +} +.page-on-right .swipeback-page-shadow { + opacity: 0; +} +.page-content { + overflow: auto; + -webkit-overflow-scrolling: touch; + box-sizing: border-box; + height: 100%; + position: relative; + z-index: 1; +} +.swipeback-page-shadow { + position: absolute; + right: 100%; + top: 0; + width: 16px; + height: 100%; + background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0.01) 50%, rgba(0, 0, 0, 0.2) 100%); + background: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0.01) 50%, rgba(0, 0, 0, 0.2) 100%); + z-index: -1; + content: ''; +} +html.android .swipeback-page-shadow { + display: none; + -webkit-animation: none; + animation: none; +} +.page-transitioning, +.page-transitioning .swipeback-page-shadow { + -webkit-transition-duration: 400ms; + transition-duration: 400ms; +} +.page-from-right-to-center:before, +.page-from-center-to-right:before { + position: absolute; + right: 100%; + top: 0; + width: 16px; + height: 100%; + background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0.01) 50%, rgba(0, 0, 0, 0.2) 100%); + background: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0.01) 50%, rgba(0, 0, 0, 0.2) 100%); + z-index: -1; + content: ''; +} +html.android .page-from-right-to-center:before, +html.android .page-from-center-to-right:before { + display: none; + -webkit-animation: none; + animation: none; +} +.page-from-right-to-center { + -webkit-animation: pageFromRightToCenter 400ms forwards; + animation: pageFromRightToCenter 400ms forwards; +} +.page-from-right-to-center:before { + -webkit-animation: pageFromRightToCenterShadow 400ms forwards; + animation: pageFromRightToCenterShadow 400ms forwards; +} +.page-from-center-to-right { + -webkit-animation: pageFromCenterToRight 400ms forwards; + animation: pageFromCenterToRight 400ms forwards; +} +.page-from-center-to-right:before { + -webkit-animation: pageFromCenterToRightShadow 400ms forwards; + animation: pageFromCenterToRightShadow 400ms forwards; +} +@-webkit-keyframes pageFromRightToCenter { + from { + -webkit-transform: translate3d(100%, 0, 0); + } + to { + -webkit-transform: translate3d(0, 0, 0); + } +} +@keyframes pageFromRightToCenter { + from { + transform: translate3d(100%, 0, 0); + } + to { + transform: translate3d(0, 0, 0); + } +} +@-webkit-keyframes pageFromRightToCenterShadow { + from { + opacity: 0; + } + to { + opacity: 1; + } +} +@keyframes pageFromRightToCenterShadow { + from { + opacity: 0; + } + to { + opacity: 1; + } +} +@-webkit-keyframes pageFromCenterToRight { + from { + -webkit-transform: translate3d(0, 0, 0); + } + to { + -webkit-transform: translate3d(100%, 0, 0); + } +} +@keyframes pageFromCenterToRight { + from { + transform: translate3d(0, 0, 0); + } + to { + transform: translate3d(100%, 0, 0); + } +} +@-webkit-keyframes pageFromCenterToRightShadow { + from { + opacity: 1; + } + to { + opacity: 0; + } +} +@keyframes pageFromCenterToRightShadow { + from { + opacity: 1; + } + to { + opacity: 0; + } +} +.page-from-center-to-left { + -webkit-animation: pageFromCenterToLeft 400ms forwards; + animation: pageFromCenterToLeft 400ms forwards; +} +.page-from-left-to-center { + -webkit-animation: pageFromLeftToCenter 400ms forwards; + animation: pageFromLeftToCenter 400ms forwards; +} +@-webkit-keyframes pageFromCenterToLeft { + from { + opacity: 1; + -webkit-transform: translate3d(0, 0, 0); + } + to { + opacity: 0.9; + -webkit-transform: translate3d(-20%, 0, 0); + } +} +@keyframes pageFromCenterToLeft { + from { + transform: translate3d(0, 0, 0); + } + to { + opacity: 0.9; + transform: translate3d(-20%, 0, 0); + } +} +@-webkit-keyframes pageFromLeftToCenter { + from { + opacity: 0.9; + -webkit-transform: translate3d(-20%, 0, 0); + } + to { + opacity: 1; + -webkit-transform: translate3d(0, 0, 0); + } +} +@keyframes pageFromLeftToCenter { + from { + transform: translate3d(-20%, 0, 0); + } + to { + opacity: 1; + transform: translate3d(0, 0, 0); + } +} +/* === Toolbars === */ +.navbar-inner, +.toolbar-inner { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + padding: 0 8px; + box-sizing: border-box; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: justify; + -ms-flex-pack: justify; + -webkit-justify-content: space-between; + justify-content: space-between; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; +} +.navbar-inner.cached { + display: none; +} +.navbar, +.toolbar { + height: 44px; + width: 100%; + box-sizing: border-box; + font-size: 17px; + position: relative; + margin: 0; + z-index: 500; + -webkit-backface-visibility: hidden; + backface-visibility: hidden; +} +.navbar b, +.toolbar b { + font-weight: 500; +} +html.ios-gt-8 .navbar b, +html.ios-gt-8 .toolbar b { + font-weight: 600; +} +.navbar, +.toolbar, +.subnavbar { + background: #f7f7f8; +} +.navbar a.link, +.toolbar a.link, +.subnavbar a.link { + line-height: 44px; + height: 44px; + text-decoration: none; + position: relative; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: start; + -ms-flex-pack: start; + -webkit-justify-content: flex-start; + justify-content: flex-start; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + -webkit-transform: translateZ(0px); + transform: translateZ(0px); +} +html:not(.watch-active-state) .navbar a.link:active, +html:not(.watch-active-state) .toolbar a.link:active, +html:not(.watch-active-state) .subnavbar a.link:active, +.navbar a.link.active-state, +.toolbar a.link.active-state, +.subnavbar a.link.active-state { + opacity: 0.3; + -webkit-transition-duration: 0ms; + transition-duration: 0ms; +} +.navbar a.link i + span, +.toolbar a.link i + span, +.subnavbar a.link i + span, +.navbar a.link i + i, +.toolbar a.link i + i, +.subnavbar a.link i + i, +.navbar a.link span + i, +.toolbar a.link span + i, +.subnavbar a.link span + i, +.navbar a.link span + span, +.toolbar a.link span + span, +.subnavbar a.link span + span { + margin-left: 7px; +} +.navbar a.icon-only, +.toolbar a.icon-only, +.subnavbar a.icon-only { + min-width: 44px; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + margin: 0; +} +.navbar i.icon, +.toolbar i.icon, +.subnavbar i.icon { + display: block; +} +.navbar { + left: 0; + top: 0; +} +.navbar:after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + right: auto; + top: auto; + height: 1px; + width: 100%; + background-color: #c4c4c4; + display: block; + z-index: 15; + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; +} +html.pixel-ratio-2 .navbar:after { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .navbar:after { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.navbar:after { + backface-visibility: hidden; +} +.navbar.no-border:after { + display: none; +} +.navbar .center { + font-size: 17px; + font-weight: 500; + text-align: center; + margin: 0; + position: relative; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + line-height: 44px; + -webkit-flex-shrink: 10; + -ms-flex: 0 10 auto; + flex-shrink: 10; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; +} +html.ios-gt-8 .navbar .center { + font-weight: 600; +} +.navbar .left, +.navbar .right { + -webkit-flex-shrink: 0; + -ms-flex: 0 0 auto; + flex-shrink: 0; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: start; + -ms-flex-pack: start; + -webkit-justify-content: flex-start; + justify-content: flex-start; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +.navbar .left a + a, +.navbar .right a + a { + margin-left: 15px; +} +.navbar .left { + margin-right: 10px; +} +.navbar .right { + margin-left: 10px; +} +.navbar .right:first-child { + position: absolute; + right: 8px; + height: 100%; +} +.popup .navbar { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +.subnavbar { + height: 44px; + width: 100%; + position: absolute; + left: 0; + top: 100%; + margin-top: -1px; + z-index: 20; + box-sizing: border-box; + padding: 0 8px; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: justify; + -ms-flex-pack: justify; + -webkit-justify-content: space-between; + justify-content: space-between; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; +} +.subnavbar:after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + right: auto; + top: auto; + height: 1px; + width: 100%; + background-color: #c4c4c4; + display: block; + z-index: 15; + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; +} +html.pixel-ratio-2 .subnavbar:after { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .subnavbar:after { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.subnavbar.no-border:after { + display: none; +} +.navbar.no-border .subnavbar { + margin-top: 0; +} +.navbar-on-left .subnavbar, +.navbar-on-right .subnavbar { + pointer-events: none; +} +.navbar .subnavbar, +.page .subnavbar { + position: absolute; +} +.page > .subnavbar { + top: 0; + margin-top: 0; +} +.subnavbar > .buttons-row { + width: 100%; +} +.subnavbar .searchbar, +.subnavbar.searchbar { + position: absolute; +} +.subnavbar.searchbar, +.subnavbar .searchbar { + position: absolute; +} +.subnavbar .searchbar { + left: 0; + top: 0; +} +.toolbar { + left: 0; + bottom: 0; +} +.toolbar:before { + content: ''; + position: absolute; + left: 0; + top: 0; + bottom: auto; + right: auto; + height: 1px; + width: 100%; + background-color: #c4c4c4; + display: block; + z-index: 15; + -webkit-transform-origin: 50% 0%; + transform-origin: 50% 0%; +} +html.pixel-ratio-2 .toolbar:before { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .toolbar:before { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.toolbar.no-border:before { + display: none; +} +.toolbar a { + -webkit-flex-shrink: 1; + -ms-flex: 0 1 auto; + flex-shrink: 1; + position: relative; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; +} +.tabbar { + color: #929292; + z-index: 5001; +} +.tabbar a { + color: #929292; +} +.tabbar a.active { + color: #007aff; +} +.tabbar a.link { + line-height: 1.4; +} +.tabbar a.tab-link, +.tabbar a.link { + height: 100%; + width: 100%; + box-sizing: border-box; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + overflow: visible; + -webkit-box-flex: 1; + -ms-flex: 1; + -webkit-box-orient: vertical; + -moz-box-orient: vertical; + -ms-flex-direction: column; + -webkit-flex-direction: column; + flex-direction: column; +} +.tabbar i.icon { + height: 30px; +} +.tabbar-labels { + height: 50px; +} +.tabbar-labels a.tab-link, +.tabbar-labels a.link { + padding-top: 4px; + padding-bottom: 4px; + height: 100%; + -webkit-box-pack: justify; + -ms-flex-pack: justify; + -webkit-justify-content: space-between; + justify-content: space-between; +} +.tabbar-labels a.tab-link i + span, +.tabbar-labels a.link i + span { + margin: 0; +} +.tabbar-labels span.tabbar-label { + line-height: 1; + display: block; + margin: 0; + letter-spacing: 0.01em; + font-size: 10px; + position: relative; + text-overflow: ellipsis; + white-space: nowrap; +} +@media all and (min-width: 768px) { + .tabbar .toolbar-inner { + -webkit-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; + } + .tabbar a.tab-link, + .tabbar a.link { + width: auto; + min-width: 105px; + } + .tabbar-labels { + height: 56px; + } + .tabbar-labels span.tabbar-label { + font-size: 14px; + } +} +.navbar-from-right-to-center .left, +.navbar-from-right-to-center .right, +.navbar-from-right-to-center .center, +.navbar-from-right-to-center .subnavbar, +.navbar-from-right-to-center .fading { + -webkit-animation: navbarElementFadeIn 400ms forwards; + animation: navbarElementFadeIn 400ms forwards; +} +.navbar-from-right-to-center .sliding { + opacity: 1; +} +.navbar-from-center-to-right .left, +.navbar-from-center-to-right .right, +.navbar-from-center-to-right .center, +.navbar-from-center-to-right .subnavbar, +.navbar-from-center-to-right .fading { + -webkit-animation: navbarElementFadeOut 400ms forwards; + animation: navbarElementFadeOut 400ms forwards; +} +.navbar-from-center-to-right .sliding { + opacity: 0; +} +.navbar-from-center-to-right .subnavbar.sliding { + opacity: 1; +} +@-webkit-keyframes navbarElementFadeIn { + from { + opacity: 0; + } + to { + opacity: 1; + } +} +@keyframes navbarElementFadeIn { + from { + opacity: 0; + } + to { + opacity: 1; + } +} +.navbar-from-center-to-left .left, +.navbar-from-center-to-left .right, +.navbar-from-center-to-left .center, +.navbar-from-center-to-left .subnavbar, +.navbar-from-center-to-left .fading { + -webkit-animation: navbarElementFadeOut 400ms forwards; + animation: navbarElementFadeOut 400ms forwards; +} +.navbar-from-center-to-left .sliding { + opacity: 0; +} +.navbar-from-center-to-left .subnavbar.sliding { + opacity: 1; +} +.navbar-from-left-to-center .left, +.navbar-from-left-to-center .right, +.navbar-from-left-to-center .center, +.navbar-from-left-to-center .subnavbar, +.navbar-from-left-to-center .fading { + -webkit-animation: navbarElementFadeIn 400ms forwards; + animation: navbarElementFadeIn 400ms forwards; +} +.navbar-from-left-to-center .sliding { + opacity: 1; +} +.navbar-on-left .left, +.navbar-on-left .right, +.navbar-on-left .center, +.navbar-on-left .subnavbar, +.navbar-on-left .fading { + opacity: 0; +} +.navbar-on-left .sliding { + opacity: 0; +} +.navbar-on-left .subnavbar.sliding { + opacity: 1; + -webkit-transform: translate3d(-100%, 0, 0); + transform: translate3d(-100%, 0, 0); +} +.navbar-on-right .left, +.navbar-on-right .right, +.navbar-on-right .center, +.navbar-on-right .subnavbar, +.navbar-on-right .fading { + opacity: 0; +} +.navbar-on-right .sliding { + opacity: 0; +} +.navbar-on-right .subnavbar.sliding { + -webkit-transform: translate3d(100%, 0, 0); + transform: translate3d(100%, 0, 0); +} +@-webkit-keyframes navbarElementFadeOut { + from { + opacity: 1; + } + to { + opacity: 0; + } +} +@keyframes navbarElementFadeOut { + from { + opacity: 1; + } + to { + opacity: 0; + } +} +.navbar-from-right-to-center .left.sliding .back.link .icon, +.navbar-from-center-to-right .left.sliding .back.link .icon, +.navbar-from-center-to-left .left.sliding .back.link .icon, +.navbar-from-left-to-center .left.sliding .back.link .icon { + -webkit-transition-duration: 400ms; + transition-duration: 400ms; +} +.navbar-from-right-to-center .sliding, +.navbar-from-center-to-right .sliding, +.navbar-from-center-to-left .sliding, +.navbar-from-left-to-center .sliding { + -webkit-transition-duration: 400ms; + transition-duration: 400ms; + -webkit-animation: none; + animation: none; +} +/* === Relation between toolbar/navbar types and pages === */ +.page > .navbar, +.view > .navbar, +.views > .navbar, +.page > .toolbar, +.view > .toolbar, +.views > .toolbar { + position: absolute; +} +.subnavbar ~ .page-content { + padding-top: 44px; +} +.navbar-through .page-content, +.navbar-fixed .page-content { + padding-top: 44px; +} +.navbar-through .with-subnavbar .page-content, +.navbar-fixed .with-subnavbar .page-content, +.navbar-through .page-content.with-subnavbar, +.navbar-fixed .page-content.with-subnavbar, +.navbar-through .subnavbar ~ .page-content, +.navbar-fixed .subnavbar ~ .page-content { + padding-top: 88px; +} +.navbar-through .page .subnavbar, +.navbar-fixed .page .subnavbar, +.navbar-through.page .subnavbar, +.navbar-fixed.page .subnavbar { + top: 44px; +} +.toolbar-through .page-content, +.toolbar-fixed .page-content, +.tabbar-through .page-content, +.tabbar-fixed .page-content { + padding-bottom: 44px; +} +.tabbar-labels-fixed .page-content, +.tabbar-labels-through .page-content { + padding-bottom: 50px; +} +@media all and (min-width: 768px) { + .tabbar-labels-fixed .page-content, + .tabbar-labels-through .page-content { + padding-bottom: 56px; + } +} +.navbar.navbar-hiding { + -webkit-transition-duration: 400ms; + transition-duration: 400ms; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +.navbar.navbar-hiding ~ .page-content .list-group-title, +.navbar.navbar-hiding ~ .pages .list-group-title, +.navbar.navbar-hiding ~ .page .list-group-title { + -webkit-transition-duration: 400ms; + transition-duration: 400ms; +} +.navbar.navbar-hiding ~ .page-content .subnavbar, +.navbar.navbar-hiding ~ .pages .subnavbar, +.navbar.navbar-hiding ~ .page .subnavbar { + -webkit-transition-duration: 400ms; + transition-duration: 400ms; +} +.navbar.navbar-hidden { + -webkit-transition-duration: 400ms; + transition-duration: 400ms; + -webkit-transform: translate3d(0, -100%, 0); + transform: translate3d(0, -100%, 0); +} +.navbar.navbar-hidden ~ .page-content .list-group-title, +.navbar.navbar-hidden ~ .pages .list-group-title, +.navbar.navbar-hidden ~ .page .list-group-title { + -webkit-transition-duration: 400ms; + transition-duration: 400ms; + top: -44px; +} +.navbar.navbar-hidden ~ .page-content .subnavbar, +.navbar.navbar-hidden ~ .pages .subnavbar, +.navbar.navbar-hidden ~ .page .subnavbar { + -webkit-transform: translate3d(0, -100%, 0); + transform: translate3d(0, -100%, 0); + -webkit-transition-duration: 400ms; + transition-duration: 400ms; +} +.page.no-navbar .page-content { + padding-top: 0; +} +.page.no-navbar.with-subnavbar .page-content, +.with-subnavbar .page.no-navbar .page-content, +.page.no-navbar .page-content.with-subnavbar { + padding-top: 44px; +} +.toolbar.toolbar-hiding, +.tabbar.toolbar-hiding, +.toolbar.tabbar-hiding, +.tabbar.tabbar-hiding { + -webkit-transition-duration: 400ms; + transition-duration: 400ms; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +.toolbar.toolbar-hidden, +.tabbar.toolbar-hidden, +.toolbar.tabbar-hidden, +.tabbar.tabbar-hidden { + -webkit-transition-duration: 400ms; + transition-duration: 400ms; + -webkit-transform: translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0); +} +.page.no-toolbar .page-content, +.page.no-tabbar .page-content { + padding-bottom: 0; +} +/* === Search Bar === */ +.searchbar { + height: 44px; + width: 100%; + background: #c9c9ce; + box-sizing: border-box; + padding: 0 8px; + overflow: hidden; + position: relative; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; +} +.searchbar:after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + right: auto; + top: auto; + height: 1px; + width: 100%; + background-color: #b4b4b4; + display: block; + z-index: 15; + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; +} +html.pixel-ratio-2 .searchbar:after { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .searchbar:after { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.searchbar .searchbar-input { + width: 100%; + height: 28px; + position: relative; + -webkit-flex-shrink: 1; + -ms-flex: 0 1 auto; + flex-shrink: 1; +} +.searchbar input[type="search"] { + box-sizing: border-box; + width: 100%; + height: 100%; + display: block; + border: none; + -webkit-appearance: none; + -moz-appearance: none; + -ms-appearance: none; + appearance: none; + border-radius: 5px; + font-family: inherit; + color: #000; + font-size: 14px; + font-weight: normal; + padding: 0 28px; + background-color: #fff; + background-repeat: no-repeat; + background-position: 8px center; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2013%2013'%20enable-background%3D'new%200%200%2013%2013'%3E%3Cg%3E%3Cpath%20fill%3D'%23939398'%20d%3D'M5%2C1c2.2%2C0%2C4%2C1.8%2C4%2C4S7.2%2C9%2C5%2C9S1%2C7.2%2C1%2C5S2.8%2C1%2C5%2C1%20M5%2C0C2.2%2C0%2C0%2C2.2%2C0%2C5s2.2%2C5%2C5%2C5s5-2.2%2C5-5S7.8%2C0%2C5%2C0%20L5%2C0z'%2F%3E%3C%2Fg%3E%3Cline%20stroke%3D'%23939398'%20stroke-miterlimit%3D'10'%20x1%3D'12.6'%20y1%3D'12.6'%20x2%3D'8.2'%20y2%3D'8.2'%2F%3E%3C%2Fsvg%3E"); + -webkit-background-size: 13px 13px; + background-size: 13px 13px; +} +.searchbar input[type="search"]::-webkit-input-placeholder { + color: #939398; + opacity: 1; +} +.searchbar input[type="search"]::-webkit-search-cancel-button { + -webkit-appearance: none; +} +.searchbar .searchbar-clear { + position: absolute; + width: 28px; + height: 28px; + right: 0; + top: 0; + opacity: 0; + pointer-events: none; + background-position: center; + background-repeat: no-repeat; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2028%2028'%3E%3Ccircle%20cx%3D'14'%20cy%3D'14'%20r%3D'14'%20fill%3D'%238e8e93'%2F%3E%3Cline%20stroke%3D'%23ffffff'%20stroke-width%3D'2'%20stroke-miterlimit%3D'10'%20x1%3D'8'%20y1%3D'8'%20x2%3D'20'%20y2%3D'20'%2F%3E%3Cline%20fill%3D'none'%20stroke%3D'%23ffffff'%20stroke-width%3D'2'%20stroke-miterlimit%3D'10'%20x1%3D'20'%20y1%3D'8'%20x2%3D'8'%20y2%3D'20'%2F%3E%3C%2Fsvg%3E"); + -webkit-background-size: 14px 14px; + background-size: 14px 14px; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + cursor: pointer; +} +.searchbar .searchbar-cancel { + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + font-size: 17px; + cursor: pointer; + opacity: 0; + -webkit-flex-shrink: 0; + -ms-flex: 0 0 auto; + flex-shrink: 0; + margin-left: 0; + pointer-events: none; + display: none; +} +.searchbar.searchbar-active .searchbar-cancel { + margin-left: 8px; + opacity: 1; + pointer-events: auto; +} +html:not(.watch-active-state) .searchbar.searchbar-active .searchbar-cancel:active, +.searchbar.searchbar-active .searchbar-cancel.active-state { + opacity: 0.3; + -webkit-transition-duration: 0ms; + transition-duration: 0ms; +} +.searchbar.searchbar-not-empty .searchbar-clear { + pointer-events: auto; + opacity: 1; +} +.searchbar-overlay { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + z-index: 100; + opacity: 0; + pointer-events: none; + background: rgba(0, 0, 0, 0.4); + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +.searchbar-overlay.searchbar-overlay-active { + opacity: 1; + pointer-events: auto; +} +.searchbar-not-found { + display: none; +} +.hidden-by-searchbar, +.list-block .hidden-by-searchbar, +.list-block li.hidden-by-searchbar { + display: none; +} +.page > .searchbar { + position: absolute; + width: 100%; + left: 0; + top: 0; + z-index: 200; +} +.page > .searchbar ~ .page-content { + padding-top: 44px; +} +.navbar-fixed .page > .searchbar, +.navbar-through .page > .searchbar, +.navbar-fixed > .searchbar, +.navbar-through > .searchbar { + top: 44px; +} +.navbar-fixed .page > .searchbar ~ .page-content, +.navbar-through .page > .searchbar ~ .page-content, +.navbar-fixed > .searchbar ~ .page-content, +.navbar-through > .searchbar ~ .page-content { + padding-top: 88px; +} +/* === Message Bar === */ +.messagebar { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + -webkit-transition-duration: 0ms; + transition-duration: 0ms; +} +.messagebar textarea { + -webkit-appearance: none; + -moz-appearance: none; + -ms-appearance: none; + appearance: none; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; + border: 1px solid #c8c8cd; + background: #fff; + border-radius: 5px; + box-shadow: none; + display: block; + padding: 3px 8px 3px; + margin: 0; + width: 100%; + height: 28px; + color: #000; + font-size: 17px; + line-height: 20px; + font-family: inherit; + resize: none; + -webkit-flex-shrink: 1; + -ms-flex: 0 1 auto; + flex-shrink: 1; +} +.messagebar .link { + -ms-flex-item-align: flex-end; + -webkit-align-self: flex-end; + align-self: flex-end; +} +.messagebar .link.icon-only:first-child { + margin-left: -6px; +} +.messagebar .link:not(.icon-only) + textarea { + margin-left: 8px; +} +.messagebar textarea + .link { + margin-left: 8px; +} +.messagebar .link { + -webkit-flex-shrink: 0; + -ms-flex: 0 0 auto; + flex-shrink: 0; +} +.messagebar ~ .page-content { + padding-bottom: 44px; +} +.page.no-toolbar .messagebar ~ .page-content { + padding-bottom: 44px; +} +.hidden-toolbar .messagebar { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + -webkit-transition-duration: 0ms; + transition-duration: 0ms; +} +/* === Icons === */ +i.icon { + display: inline-block; + vertical-align: middle; + background-size: 100% auto; + background-position: center; + background-repeat: no-repeat; + font-style: normal; + position: relative; +} +i.icon.icon-back { + width: 12px; + height: 20px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M10%2C0l2%2C2l-8%2C8l8%2C8l-2%2C2L0%2C10L10%2C0z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-forward { + width: 12px; + height: 20px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M2%2C20l-2-2l8-8L0%2C2l2-2l10%2C10L2%2C20z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-bars { + width: 21px; + height: 14px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2021%2014'%3E%3Cpath%20fill%3D'%23007aff'%20d%3D'M0%2C0h2v2H0V0z%20M4%2C0h17v1H4V0z%20M0%2C6h2v2H0V6z%20M4%2C6h17v1H4V6z%20M0%2C12h2v2H0V12z%20M4%2C12h17v1H4V12z'%2F%3E%3C%2Fsvg%3E"); +} +@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2ddpx) { + i.icon.icon-bars { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2042%2026'%3E%3Cpath%20fill%3D'%23007aff'%20d%3D'M0%2C0h4v4H0V0z%20M8%2C1h34v2H8V1z%20M0%2C11h4v4H0V11z%20M8%2C12h34v2H8V12z%20M0%2C22h4v4H0V22z%20M8%2C23h34v2H8V23z'%2F%3E%3C%2Fsvg%3E"); + height: 13px; + } +} +i.icon.icon-camera { + width: 25px; + height: 20px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20x%3D'0px'%20y%3D'0px'%20viewBox%3D'0%200%2025%2020'%3E%3Cpath%20fill%3D'%238C8D92'%20d%3D'M13.3%2C5.5c-2.7%2C0-5%2C2.2-5%2C5s2.2%2C5%2C5%2C5c2.7%2C0%2C5-2.2%2C5-5S16%2C5.5%2C13.3%2C5.5z'%2F%3E%3Cpath%20fill%3D'%238C8D92'%20d%3D'M22.8%2C1.8h-3.3c-0.2-1.3-1-1.8-2-1.8H8.1c-1%2C0-1.8%2C0.4-2%2C1.8H2.8C1.4%2C1.8%2C0%2C2.8%2C0%2C4.2v12.6%20c0%2C1.4%2C1.4%2C2.5%2C2.8%2C2.5h20c1.4%2C0%2C2.2-1.1%2C2.2-2.5V4.2C25%2C2.8%2C24.2%2C1.8%2C22.8%2C1.8z%20M3.5%2C6.4C2.6%2C6.4%2C2%2C5.8%2C2%2C5c0-0.8%2C0.7-1.5%2C1.5-1.5%20S5%2C4.1%2C5%2C5C5%2C5.8%2C4.3%2C6.4%2C3.5%2C6.4z%20M13.3%2C16.8c-3.5%2C0-6.3-2.7-6.3-6.2c0-3.3%2C2.5-6.2%2C5.7-6.2h1.2c3.2%2C0%2C5.7%2C2.9%2C5.7%2C6.2%20C19.6%2C14.1%2C16.7%2C16.8%2C13.3%2C16.8z'%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-f7 { + width: 29px; + height: 29px; + background-image: url("../img/i-f7-ios.png"); + border-radius: 6px; +} +i.icon.icon-form-name { + width: 29px; + height: 29px; + background-image: url("../img/i-form-name-ios.svg"); +} +i.icon.icon-form-password { + width: 29px; + height: 29px; + background-image: url("../img/i-form-password-ios.svg"); +} +i.icon.icon-form-email { + width: 29px; + height: 29px; + background-image: url("../img/i-form-email-ios.svg"); +} +i.icon.icon-form-calendar { + width: 29px; + height: 29px; + background-image: url("../img/i-form-calendar-ios.svg"); +} +i.icon.icon-form-tel { + width: 29px; + height: 29px; + background-image: url("../img/i-form-tel-ios.svg"); +} +i.icon.icon-form-gender { + width: 29px; + height: 29px; + background-image: url("../img/i-form-gender-ios.svg"); +} +i.icon.icon-form-toggle { + width: 29px; + height: 29px; + background-image: url("../img/i-form-toggle-ios.svg"); +} +i.icon.icon-form-comment { + width: 29px; + height: 29px; + background-image: url("../img/i-form-comment-ios.svg"); +} +i.icon.icon-form-settings { + width: 29px; + height: 29px; + background-image: url("../img/i-form-settings-ios.svg"); +} +i.icon.icon-form-url { + width: 29px; + height: 29px; + background-image: url("../img/i-form-url-ios.svg"); +} +i.icon.icon-next, +i.icon.icon-prev { + width: 15px; + height: 15px; +} +i.icon.icon-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%23007aff'%20d%3D'M1%2C1.6l11.8%2C5.8L1%2C13.4V1.6%20M0%2C0v15l15-7.6L0%2C0L0%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon.icon-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%23007aff'%20d%3D'M14%2C1.6v11.8L2.2%2C7.6L14%2C1.6%20M15%2C0L0%2C7.6L15%2C15V0L15%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon.icon-plus { + width: 25px; + height: 25px; + font-size: 31px; + line-height: 20px; + text-align: center; + font-weight: 100; +} +.badge { + font-size: 13px; + display: inline-block; + color: #fff; + background: #8e8e93; + border-radius: 20px; + padding: 0px 6px; + height: 20px; + line-height: 20px; + box-sizing: border-box; + text-align: center; +} +.item-after .badge { + min-width: 20px; +} +.icon .badge { + position: absolute; + left: 100%; + margin-left: -10px; + top: -2px; + font-size: 10px; + line-height: 16px; + height: 16px; + border-radius: 16px; + padding: 0px 4px; + min-width: 16px; +} +/* === Content Block === */ +.content-block { + margin: 35px 0; + padding: 0 15px; + color: #6d6d72; + box-sizing: border-box; +} +.content-block-title { + position: relative; + overflow: hidden; + margin: 0; + white-space: nowrap; + text-overflow: ellipsis; + font-size: 14px; + text-transform: uppercase; + line-height: 1; + color: #6d6d72; + margin: 35px 15px 10px; +} +.content-block-title + .list-block, +.content-block-title + .content-block, +.content-block-title + .card { + margin-top: 10px; +} +.content-block-inner { + background: #fff; + padding: 10px 15px; + margin-left: -15px; + width: 100%; + position: relative; + color: #000; +} +.content-block-inner:before { + content: ''; + position: absolute; + left: 0; + top: 0; + bottom: auto; + right: auto; + height: 1px; + width: 100%; + background-color: #c8c7cc; + display: block; + z-index: 15; + -webkit-transform-origin: 50% 0%; + transform-origin: 50% 0%; +} +html.pixel-ratio-2 .content-block-inner:before { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .content-block-inner:before { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.content-block-inner:after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + right: auto; + top: auto; + height: 1px; + width: 100%; + background-color: #c8c7cc; + display: block; + z-index: 15; + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; +} +html.pixel-ratio-2 .content-block-inner:after { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .content-block-inner:after { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.content-block.inset { + margin-left: 15px; + margin-right: 15px; + border-radius: 7px; +} +.content-block.inset .content-block-inner { + border-radius: 7px; +} +.content-block.inset .content-block-inner:before { + display: none; +} +.content-block.inset .content-block-inner:after { + display: none; +} +@media all and (min-width: 768px) { + .content-block.tablet-inset { + margin-left: 15px; + margin-right: 15px; + border-radius: 7px; + } + .content-block.tablet-inset .content-block-inner { + border-radius: 7px; + } + .content-block.tablet-inset .content-block-inner:before { + display: none; + } + .content-block.tablet-inset .content-block-inner:after { + display: none; + } +} +/* === Lists === */ +.list-block { + margin: 35px 0; + font-size: 17px; +} +.list-block ul { + background: #fff; + list-style: none; + padding: 0; + margin: 0; + position: relative; +} +.list-block ul:before { + content: ''; + position: absolute; + left: 0; + top: 0; + bottom: auto; + right: auto; + height: 1px; + width: 100%; + background-color: #c8c7cc; + display: block; + z-index: 15; + -webkit-transform-origin: 50% 0%; + transform-origin: 50% 0%; +} +html.pixel-ratio-2 .list-block ul:before { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .list-block ul:before { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.list-block ul:after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + right: auto; + top: auto; + height: 1px; + width: 100%; + background-color: #c8c7cc; + display: block; + z-index: 15; + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; +} +html.pixel-ratio-2 .list-block ul:after { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .list-block ul:after { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.list-block ul ul { + padding-left: 45px; +} +.list-block ul ul:before { + display: none; +} +.list-block ul ul:after { + display: none; +} +.list-block .align-top, +.list-block .align-top .item-content, +.list-block .align-top .item-inner { + -webkit-box-align: start; + -ms-flex-align: start; + -webkit-align-items: flex-start; + align-items: flex-start; +} +.list-block.inset { + margin-left: 15px; + margin-right: 15px; + border-radius: 7px; +} +.list-block.inset .content-block-title { + margin-left: 0; + margin-right: 0; +} +.list-block.inset ul { + border-radius: 7px; +} +.list-block.inset ul:before { + display: none; +} +.list-block.inset ul:after { + display: none; +} +.list-block.inset li:first-child > a { + border-radius: 7px 7px 0 0; +} +.list-block.inset li:last-child > a { + border-radius: 0 0 7px 7px; +} +.list-block.inset li:first-child:last-child > a { + border-radius: 7px; +} +@media all and (min-width: 768px) { + .list-block.tablet-inset { + margin-left: 15px; + margin-right: 15px; + border-radius: 7px; + } + .list-block.tablet-inset .content-block-title { + margin-left: 0; + margin-right: 0; + } + .list-block.tablet-inset ul { + border-radius: 7px; + } + .list-block.tablet-inset ul:before { + display: none; + } + .list-block.tablet-inset ul:after { + display: none; + } + .list-block.tablet-inset li:first-child > a { + border-radius: 7px 7px 0 0; + } + .list-block.tablet-inset li:last-child > a { + border-radius: 0 0 7px 7px; + } + .list-block.tablet-inset li:first-child:last-child > a { + border-radius: 7px; + } + .list-block.tablet-inset .content-block-title { + margin-left: 0; + margin-right: 0; + } + .list-block.tablet-inset ul { + border-radius: 7px; + } + .list-block.tablet-inset ul:before { + display: none; + } + .list-block.tablet-inset ul:after { + display: none; + } + .list-block.tablet-inset li:first-child > a { + border-radius: 7px 7px 0 0; + } + .list-block.tablet-inset li:last-child > a { + border-radius: 0 0 7px 7px; + } + .list-block.tablet-inset li:first-child:last-child > a { + border-radius: 7px; + } +} +.list-block li { + box-sizing: border-box; + position: relative; +} +.list-block .item-media { + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-flex-shrink: 0; + -ms-flex: 0 0 auto; + flex-shrink: 0; + -webkit-box-lines: single; + -moz-box-lines: single; + -webkit-flex-wrap: nowrap; + -ms-flex-wrap: none; + -ms-flex-wrap: nowrap; + flex-wrap: nowrap; + box-sizing: border-box; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + padding-top: 7px; + padding-bottom: 8px; +} +.list-block .item-media i + i { + margin-left: 5px; +} +.list-block .item-media i + img { + margin-left: 5px; +} +.list-block .item-media + .item-inner { + margin-left: 15px; +} +.list-block .item-inner { + padding-right: 15px; + position: relative; + width: 100%; + padding-top: 8px; + padding-bottom: 7px; + min-height: 44px; + box-sizing: border-box; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-flex: 1; + -ms-flex: 1; + overflow: hidden; + -webkit-box-pack: justify; + -ms-flex-pack: justify; + -webkit-justify-content: space-between; + justify-content: space-between; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + -ms-flex-item-align: stretch; + -webkit-align-self: stretch; + align-self: stretch; +} +.list-block .item-inner:after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + right: auto; + top: auto; + height: 1px; + width: 100%; + background-color: #c8c7cc; + display: block; + z-index: 15; + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; +} +html.pixel-ratio-2 .list-block .item-inner:after { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .list-block .item-inner:after { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.list-block .item-title { + -webkit-flex-shrink: 1; + -ms-flex: 0 1 auto; + flex-shrink: 1; + min-width: 0; + white-space: nowrap; + position: relative; + overflow: hidden; + text-overflow: ellipsis; + max-width: 100%; +} +.list-block .item-after { + white-space: nowrap; + color: #8e8e93; + -webkit-flex-shrink: 0; + -ms-flex: 0 0 auto; + flex-shrink: 0; + margin-left: 5px; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + max-height: 28px; +} +.list-block .smart-select .item-after, +.list-block .autocomplete-opener .item-after { + max-width: 70%; + overflow: hidden; + text-overflow: ellipsis; + position: relative; + display: block; +} +.list-block .item-link { + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + display: block; + color: inherit; +} +.list-block .item-link .item-inner { + padding-right: 35px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%2060%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'm60%2061.5-38.25%2038.25-9.75-9.75%2029.25-28.5-29.25-28.5%209.75-9.75z'%20fill%3D'%23c7c7cc'%2F%3E%3C%2Fsvg%3E"); + background-size: 10px 20px; + background-repeat: no-repeat; + background-position: 95% center; + background-position: -webkit-calc(100% - 15px) center; + background-position: calc(100% - 15px) center; +} +html:not(.watch-active-state) .list-block .item-link:active, +.list-block .item-link.active-state { + -webkit-transition-duration: 0ms; + transition-duration: 0ms; + background-color: #d9d9d9; +} +html:not(.watch-active-state) .list-block .item-link:active .item-inner:after, +.list-block .item-link.active-state .item-inner:after { + background-color: transparent; +} +.list-block .item-link.list-button { + padding: 0 15px; + text-align: center; + color: #007aff; + display: block; + line-height: 43px; +} +.list-block .item-link.list-button:after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + right: auto; + top: auto; + height: 1px; + width: 100%; + background-color: #c8c7cc; + display: block; + z-index: 15; + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; +} +html.pixel-ratio-2 .list-block .item-link.list-button:after { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .list-block .item-link.list-button:after { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.list-block .item-content { + box-sizing: border-box; + padding-left: 15px; + min-height: 44px; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: justify; + -ms-flex-pack: justify; + -webkit-justify-content: space-between; + justify-content: space-between; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; +} +.list-block .list-block-label { + margin: 10px 0 35px; + padding: 0 15px; + font-size: 14px; + color: #8f8f94; +} +.list-block .swipeout { + overflow: hidden; + -webkit-transform-style: preserve-3d; + transform-style: preserve-3d; +} +.list-block .swipeout.deleting { + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +.list-block .swipeout.deleting .swipeout-content { + -webkit-transform: translateX(-100%); + transform: translateX(-100%); +} +.list-block .swipeout.transitioning .swipeout-content, +.list-block .swipeout.transitioning .swipeout-actions-right a, +.list-block .swipeout.transitioning .swipeout-actions-left a, +.list-block .swipeout.transitioning .swipeout-overswipe { + -webkit-transition: 300ms; + transition: 300ms; +} +.list-block .swipeout-content { + position: relative; + z-index: 10; +} +.list-block .swipeout-overswipe { + -webkit-transition: 200ms left; + transition: 200ms left; +} +.list-block .swipeout-actions-left, +.list-block .swipeout-actions-right { + position: absolute; + top: 0; + height: 100%; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; +} +.list-block .swipeout-actions-left a, +.list-block .swipeout-actions-right a { + padding: 0 30px; + color: #fff; + background: #c7c7cc; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + position: relative; + left: 0; +} +.list-block .swipeout-actions-left a:after, +.list-block .swipeout-actions-right a:after { + content: ''; + position: absolute; + top: 0; + width: 600%; + height: 100%; + background: inherit; + z-index: -1; +} +.list-block .swipeout-actions-left a.swipeout-delete, +.list-block .swipeout-actions-right a.swipeout-delete { + background: #ff3b30; +} +.list-block .swipeout-actions-right { + right: 0%; + -webkit-transform: translateX(100%); + transform: translateX(100%); +} +.list-block .swipeout-actions-right a:after { + left: 100%; + margin-left: -1px; +} +.list-block .swipeout-actions-left { + left: 0%; + -webkit-transform: translateX(-100%); + transform: translateX(-100%); +} +.list-block .swipeout-actions-left a:after { + right: 100%; + margin-right: -1px; +} +.list-block .item-subtitle { + font-size: 15px; + position: relative; + overflow: hidden; + white-space: nowrap; + max-width: 100%; + text-overflow: ellipsis; +} +.list-block .item-text { + font-size: 15px; + color: #8e8e93; + line-height: 21px; + position: relative; + overflow: hidden; + height: 42px; + text-overflow: ellipsis; + -webkit-line-clamp: 2; + -webkit-box-orient: vertical; + display: -webkit-box; +} +.list-block.media-list .item-title, +.list-block li.media-item .item-title { + font-weight: 500; +} +html.ios-gt-8 .list-block.media-list .item-title, +html.ios-gt-8 .list-block li.media-item .item-title { + font-weight: 600; +} +.list-block.media-list .item-inner, +.list-block li.media-item .item-inner { + display: block; + padding-top: 10px; + padding-bottom: 9px; + -ms-flex-item-align: stretch; + -webkit-align-self: stretch; + align-self: stretch; +} +.list-block.media-list .item-link .item-inner, +.list-block li.media-item .item-link .item-inner { + background: none; + padding-right: 15px; +} +.list-block.media-list .item-link .item-title-row, +.list-block li.media-item .item-link .item-title-row { + padding-right: 20px; + background: no-repeat right center; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%2060%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'm60%2061.5-38.25%2038.25-9.75-9.75%2029.25-28.5-29.25-28.5%209.75-9.75z'%20fill%3D'%23c7c7cc'%2F%3E%3C%2Fsvg%3E"); + background-size: 10px 20px; +} +.list-block.media-list .item-media, +.list-block li.media-item .item-media { + padding-top: 9px; + padding-bottom: 10px; +} +.list-block.media-list .item-media img, +.list-block li.media-item .item-media img { + display: block; +} +.list-block.media-list .item-title-row, +.list-block li.media-item .item-title-row { + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: justify; + -ms-flex-pack: justify; + -webkit-justify-content: space-between; + justify-content: space-between; +} +.list-block.media-list .item-content > .item-after, +.list-block li.media-item .item-content > .item-after { + margin-right: 15px; + margin-left: 15px; +} +.list-block .list-group ul:after, +.list-block .list-group ul:before { + z-index: 25; +} +.list-block .list-group + .list-group ul:before { + display: none; +} +.list-block .item-divider, +.list-block .list-group-title { + background: #F7F7F7; + margin-top: -1px; + padding: 4px 15px; + white-space: nowrap; + position: relative; + max-width: 100%; + text-overflow: ellipsis; + overflow: hidden; + color: #8e8e93; + z-index: 15; +} +.list-block .item-divider:before, +.list-block .list-group-title:before { + content: ''; + position: absolute; + left: 0; + top: 0; + bottom: auto; + right: auto; + height: 1px; + width: 100%; + background-color: #c8c7cc; + display: block; + z-index: 15; + -webkit-transform-origin: 50% 0%; + transform-origin: 50% 0%; +} +html.pixel-ratio-2 .list-block .item-divider:before, +html.pixel-ratio-2 .list-block .list-group-title:before { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .list-block .item-divider:before, +html.pixel-ratio-3 .list-block .list-group-title:before { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.list-block .list-group-title { + position: relative; + position: -webkit-sticky; + position: -moz-sticky; + position: sticky; + top: 0px; + z-index: 20; + margin-top: 0; +} +.list-block .list-group-title:before { + display: none; +} +.list-block .sortable-handler { + position: absolute; + right: 0; + top: 0; + bottom: 1px; + z-index: 10; + background-repeat: no-repeat; + background-size: 18px 12px; + background-position: center; + width: 35px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2018%2012'%20fill%3D'%23c7c7cc'%3E%3Cpath%20d%3D'M0%2C2V0h22v2H0z'%2F%3E%3Cpath%20d%3D'M0%2C7V5h22v2H0z'%2F%3E%3Cpath%20d%3D'M0%2C12v-2h22v2H0z'%2F%3E%3C%2Fsvg%3E"); + opacity: 0; + visibility: hidden; + cursor: pointer; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +.list-block.sortable .item-inner { + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +.list-block.sortable-opened .sortable-handler { + visibility: visible; + opacity: 1; +} +.list-block.sortable-opened .item-inner, +.list-block.sortable-opened .item-link .item-inner { + padding-right: 35px; +} +.list-block.sortable-opened .item-link .item-inner, +.list-block.sortable-opened .item-link .item-title-row { + background-image: none; +} +.list-block.sortable-sorting li { + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +.list-block li.sorting { + z-index: 50; + background: rgba(255, 255, 255, 0.8); + box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.6); + -webkit-transition-duration: 0ms; + transition-duration: 0ms; +} +.list-block li.sorting .item-inner:after { + display: none; +} +.list-block li:last-child .list-button:after { + display: none; +} +.list-block li:last-child .item-inner:after, +.list-block li:last-child li:last-child .item-inner:after { + display: none; +} +.list-block li li:last-child .item-inner:after, +.list-block li:last-child li .item-inner:after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + right: auto; + top: auto; + height: 1px; + width: 100%; + background-color: #c8c7cc; + display: block; + z-index: 15; + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; +} +html.pixel-ratio-2 .list-block li li:last-child .item-inner:after, +html.pixel-ratio-2 .list-block li:last-child li .item-inner:after { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .list-block li li:last-child .item-inner:after, +html.pixel-ratio-3 .list-block li:last-child li .item-inner:after { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +/* === Contacts === */ +.contacts-content { + background: #fff; +} +.contacts-block { + margin: 0; +} +.contacts-block .list-group-title { + padding: 0 15px; + background: #f7f7f7; + color: #000; + font-weight: 500; + line-height: 22px; + height: 22px; +} +html.ios-gt-8 .contacts-block .list-group-title { + font-weight: 600; +} +.contacts-block .list-group:first-child ul:before { + display: none; +} +.contacts-block .list-group:last-child ul:after { + display: none; +} +/* === Forms === */ +.list-block input[type="text"], +.list-block input[type="password"], +.list-block input[type="search"], +.list-block input[type="email"], +.list-block input[type="tel"], +.list-block input[type="url"], +.list-block input[type="date"], +.list-block input[type="datetime-local"], +.list-block input[type="time"], +.list-block input[type="number"], +.list-block select, +.list-block textarea { + -webkit-appearance: none; + -moz-appearance: none; + -ms-appearance: none; + appearance: none; + box-sizing: border-box; + border: none; + background: none; + border-radius: 0 0 0 0; + box-shadow: none; + display: block; + padding: 0px; + margin: 0; + width: 100%; + height: 43px; + color: #000; + font-size: 17px; + font-family: inherit; +} +.list-block .item-title.label { + vertical-align: top; +} +.list-block .item-title.label + .item-input { + margin-left: 5px; +} +.list-block input[type="date"], +.list-block input[type="datetime-local"] { + line-height: 44px; +} +.list-block select { + -webkit-appearance: none; + -moz-appearance: none; + -ms-appearance: none; + appearance: none; +} +.list-block textarea { + height: 100px; + resize: none; + line-height: 1.4; + padding-top: 8px; + padding-bottom: 7px; +} +.list-block textarea.resizable { + height: 43px; +} +.list-block .item-input { + width: 100%; + margin-top: -8px; + margin-bottom: -7px; + -webkit-box-flex: 1; + -ms-flex: 1; + -webkit-flex-shrink: 1; + -ms-flex: 0 1 auto; + flex-shrink: 1; +} +.list-block .item-title.label { + width: 35%; + -webkit-flex-shrink: 0; + -ms-flex: 0 0 auto; + flex-shrink: 0; +} +.label-switch { + display: inline-block; + vertical-align: middle; + width: 52px; + border-radius: 16px; + box-sizing: border-box; + height: 32px; + position: relative; + cursor: pointer; + -ms-flex-item-align: center; + -webkit-align-self: center; + align-self: center; +} +.label-switch .checkbox { + width: 52px; + border-radius: 16px; + box-sizing: border-box; + height: 32px; + background: #e5e5e5; + z-index: 0; + margin: 0; + padding: 0; + -webkit-appearance: none; + -moz-appearance: none; + -ms-appearance: none; + appearance: none; + border: none; + cursor: pointer; + position: relative; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +.label-switch .checkbox:before { + content: ' '; + position: absolute; + left: 2px; + top: 2px; + width: 48px; + border-radius: 16px; + box-sizing: border-box; + height: 28px; + background: #fff; + z-index: 1; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + -webkit-transform: scale(1); + transform: scale(1); +} +.label-switch .checkbox:after { + content: ' '; + height: 28px; + width: 28px; + border-radius: 28px; + background: #fff; + position: absolute; + z-index: 2; + top: 2px; + left: 2px; + box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4); + -webkit-transform: translateX(0px); + transform: translateX(0px); + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +.label-switch input[type="checkbox"] { + display: none; +} +.label-switch input[type="checkbox"]:checked + .checkbox { + background: #4cd964; +} +.label-switch input[type="checkbox"]:checked + .checkbox:before { + -webkit-transform: scale(0); + transform: scale(0); +} +.label-switch input[type="checkbox"]:checked + .checkbox:after { + -webkit-transform: translateX(20px); + transform: translateX(20px); +} +html.android .label-switch input[type="checkbox"] + .checkbox { + -webkit-transition-duration: 0; + transition-duration: 0; +} +html.android .label-switch input[type="checkbox"] + .checkbox:after, +html.android .label-switch input[type="checkbox"] + .checkbox:before { + -webkit-transition-duration: 0; + transition-duration: 0; +} +.button { + border: 1px solid #007aff; + color: #007aff; + text-decoration: none; + text-align: center; + display: block; + border-radius: 5px; + line-height: 27px; + box-sizing: border-box; + -webkit-appearance: none; + -moz-appearance: none; + -ms-appearance: none; + appearance: none; + background: none; + padding: 0 10px; + margin: 0; + height: 29px; + white-space: nowrap; + position: relative; + overflow: hidden; + text-overflow: ellipsis; + font-size: 14px; + font-family: inherit; + cursor: pointer; + outline: 0; +} +input[type="submit"].button, +input[type="button"].button { + width: 100%; +} +html:not(.watch-active-state) .button:active, +.button.active-state { + background: rgba(0, 122, 255, 0.15); +} +.button.button-round { + border-radius: 27px; +} +.button.active { + background: #007aff; + color: #fff; +} +.button.button-big { + font-size: 17px; + height: 44px; + line-height: 42px; +} +.button.button-fill { + color: #fff; + background: #007aff; + border: none; +} +html:not(.watch-active-state) .button.button-fill:active, +.button.button-fill.active-state { + opacity: 0.8; +} +.button i.icon:first-child { + margin-right: 10px; +} +.button i.icon:last-child { + margin-left: 10px; +} +.button i.icon:first-child:last-child { + margin-left: 0; + margin-right: 0; +} +.buttons-row { + -ms-flex-item-align: center; + -webkit-align-self: center; + align-self: center; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-lines: single; + -moz-box-lines: single; + -webkit-flex-wrap: nowrap; + -ms-flex-wrap: none; + -ms-flex-wrap: nowrap; + flex-wrap: nowrap; +} +.buttons-row .button { + border-radius: 0 0 0 0; + border-left-width: 0; + width: 100%; + -webkit-box-flex: 1; + -ms-flex: 1; +} +.buttons-row .button:first-child { + border-radius: 5px 0 0 5px; + border-left-width: 1px; + border-left-style: solid; +} +.buttons-row .button:last-child { + border-radius: 0 5px 5px 0; +} +.buttons-row .button:first-child:last-child { + border-radius: 5px; +} +.buttons-row .button.button-round:first-child { + border-radius: 27px 0 0 27px; +} +.buttons-row .button.button-round:last-child { + border-radius: 0 27px 27px 0; +} +.range-slider { + width: 100%; + position: relative; + overflow: hidden; + padding-left: 3px; + padding-right: 3px; + margin-left: -1px; + -ms-flex-item-align: center; + -webkit-align-self: center; + align-self: center; +} +.range-slider input[type="range"] { + position: relative; + height: 28px; + width: 100%; + margin: 4px 0 5px 0; + -webkit-appearance: none; + -moz-appearance: none; + -ms-appearance: none; + appearance: none; + background: -webkit-gradient(linear, 50% 0, 50% 100%, color-stop(0, #b7b8b7), color-stop(100%, #b7b8b7)); + background: linear-gradient(to right, #b7b8b7 0, #b7b8b7 100%); + background-position: center; + background-size: 100% 2px; + background-repeat: no-repeat; + outline: 0; + border: none; + box-sizing: content-box; + -ms-background-position-y: 500px; +} +.range-slider input[type="range"]:focus, +.range-slider input[type="range"]:active { + border: 0; + outline: 0; +} +.range-slider input[type="range"]:after { + height: 2px; + background: #fff; + content: ' '; + width: 5px; + top: 50%; + margin-top: -1px; + left: -5px; + z-index: 1; + position: absolute; +} +.range-slider input[type="range"]::-webkit-slider-thumb { + -webkit-appearance: none; + -moz-appearance: none; + -ms-appearance: none; + appearance: none; + border: none; + height: 28px; + width: 28px; + position: relative; + background: none; +} +.range-slider input[type="range"]::-webkit-slider-thumb:after { + height: 28px; + width: 28px; + border-radius: 28px; + background: #fff; + z-index: 10; + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4); + border: 0; + outline: 0; + position: absolute; + box-sizing: border-box; + content: ' '; + left: 0; + top: 0; +} +.range-slider input[type="range"]::-webkit-slider-thumb:before { + position: absolute; + top: 50%; + right: 100%; + width: 2000px; + height: 2px; + margin-top: -1px; + z-index: 1; + background: #007aff; + content: ' '; +} +.range-slider input[type="range"]::-moz-range-track { + width: 100%; + height: 2px; + background: #b7b8b7; + border: none; + outline: 0; +} +.range-slider input[type="range"]::-moz-range-thumb { + height: 28px; + width: 28px; + border-radius: 28px; + background: #fff; + z-index: 10; + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4); + border: 0; + outline: 0; + position: absolute; + box-sizing: border-box; + content: ' '; +} +.range-slider input[type="range"]::-ms-track { + width: 100%; + height: 2px; + cursor: pointer; + background: transparent; + border-color: transparent; + color: transparent; +} +.range-slider input[type="range"]::-ms-thumb { + height: 28px; + width: 28px; + border-radius: 28px; + background: #fff; + z-index: 10; + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4); + border: 0; + outline: 0; + position: absolute; + content: ' '; + box-shadow: none; + border: 1px solid rgba(0, 0, 0, 0.2); + box-sizing: border-box; + margin-top: 0; + top: 50%; +} +.range-slider input[type="range"]::-ms-fill-lower { + background: #007aff; +} +.range-slider input[type="range"]::-ms-fill-upper { + background: #b7b8b7; +} +label.label-checkbox { + cursor: pointer; +} +label.label-checkbox i.icon-form-checkbox { + width: 22px; + height: 22px; + position: relative; + border-radius: 22px; + border: 1px solid #c7c7cc; + box-sizing: border-box; +} +label.label-checkbox i.icon-form-checkbox:after { + content: ' '; + position: absolute; + left: 50%; + margin-left: -6px; + top: 50%; + margin-top: -4px; + width: 12px; + height: 9px; +} +label.label-checkbox input[type="checkbox"], +label.label-checkbox input[type="radio"] { + display: none; +} +label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox { + border: none; + background-color: #007aff; +} +label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox:after, +label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox:after { + background: no-repeat center; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20x%3D'0px'%20y%3D'0px'%20viewBox%3D'0%200%2012%209'%20xml%3Aspace%3D'preserve'%3E%3Cpolygon%20fill%3D'%23ffffff'%20points%3D'12%2C0.7%2011.3%2C0%203.9%2C7.4%200.7%2C4.2%200%2C4.9%203.9%2C8.8%203.9%2C8.8%203.9%2C8.8%20'%2F%3E%3C%2Fsvg%3E"); + -webkit-background-size: 12px 9px; + background-size: 12px 9px; +} +label.label-radio { + cursor: pointer; +} +label.label-radio input[type="checkbox"], +label.label-radio input[type="radio"] { + display: none; +} +label.label-radio input[type="checkbox"] ~ .item-inner, +label.label-radio input[type="radio"] ~ .item-inner { + padding-right: 35px; +} +label.label-radio input[type="checkbox"]:checked ~ .item-inner, +label.label-radio input[type="radio"]:checked ~ .item-inner { + background: no-repeat center; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2013%2010'%3E%3Cpolygon%20fill%3D'%23007aff'%20points%3D'11.6%2C0%204.4%2C7.2%201.4%2C4.2%200%2C5.6%204.4%2C10%204.4%2C10%204.4%2C10%2013%2C1.4%20'%2F%3E%3C%2Fsvg%3E"); + background-position: 90% center; + background-position: -webkit-calc(100% - 15px) center; + background-position: calc(100% - 15px) center; + -webkit-background-size: 13px 10px; + background-size: 13px 10px; +} +label.label-checkbox, +label.label-radio { + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +html:not(.watch-active-state) label.label-checkbox:active, +html:not(.watch-active-state) label.label-radio:active, +label.label-checkbox.active-state, +label.label-radio.active-state { + -webkit-transition-duration: 0ms; + transition-duration: 0ms; + background-color: #d9d9d9; +} +html:not(.watch-active-state) label.label-checkbox:active .item-inner:after, +html:not(.watch-active-state) label.label-radio:active .item-inner:after, +label.label-checkbox.active-state .item-inner:after, +label.label-radio.active-state .item-inner:after { + background-color: transparent; +} +.smart-select select { + display: none; +} +/* === Accordion === */ +.list-block .accordion-item-toggle { + cursor: pointer; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +.list-block .accordion-item-toggle .item-inner { + padding-right: 35px; + background: no-repeat -webkit-calc(100% - 15px) center; + background: no-repeat calc(100% - 15px) center; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%2060%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'm60%2061.5-38.25%2038.25-9.75-9.75%2029.25-28.5-29.25-28.5%209.75-9.75z'%20fill%3D'%23c7c7cc'%2F%3E%3C%2Fsvg%3E"); + background-size: 10px 20px; +} +html:not(.watch-active-state) .list-block .accordion-item-toggle:active, +.list-block .accordion-item-toggle.active-state { + -webkit-transition-duration: 0ms; + transition-duration: 0ms; + background-color: #d9d9d9; +} +html:not(.watch-active-state) .list-block .accordion-item-toggle:active > .item-inner:after, +.list-block .accordion-item-toggle.active-state > .item-inner:after { + background-color: transparent; +} +.list-block .accordion-item-toggle .item-inner, +.list-block .accordion-item > .item-link .item-inner { + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + -webkit-transition-property: background-color; + transition-property: background-color; +} +.list-block .accordion-item-toggle .item-inner:after, +.list-block .accordion-item > .item-link .item-inner:after { + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +.list-block:not(.media-list) .accordion-item-expanded:not(.media-item) .accordion-item-toggle .item-inner, +.list-block:not(.media-list) .accordion-item-expanded:not(.media-item) > .item-link .item-inner, +.list-block.media-list .accordion-item-expanded .accordion-item-toggle .item-title-row, +.list-block.media-list .accordion-item-expanded > .item-link .item-title-row, +.list-block .accordion-item-expanded.media-item .accordion-item-toggle .item-title-row, +.list-block .accordion-item-expanded.media-item > .item-link .item-title-row { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%2060%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'm60%2061.5-38.25%2038.25-9.75-9.75%2029.25-28.5-29.25-28.5%209.75-9.75z'%20transform%3D'translate(115%2C%2030)%20rotate(90)'%20fill%3D'%23c7c7cc'%2F%3E%3C%2Fsvg%3E"); + background-size: 20px 20px; +} +.list-block .accordion-item-expanded .accordion-item-toggle .item-inner:after, +.list-block .accordion-item-expanded > .item-link .item-inner:after { + background-color: transparent; +} +.list-block .accordion-item .content-block, +.list-block .accordion-item .list-block { + margin-top: 0; + margin-bottom: 0; +} +.list-block .accordion-item ul { + padding-left: 0; +} +.accordion-item-content { + position: relative; + overflow: hidden; + height: 0; + font-size: 14px; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +.accordion-item-expanded > .accordion-item-content { + height: auto; +} +html.android-4 .accordion-item-content { + -webkit-transform: none; + transform: none; +} +/* === Cards === */ +.cards-list ul, +.card .list-block ul { + background: none; +} +.cards-list > ul:before, +.card .list-block > ul:before { + display: none; +} +.cards-list > ul:after, +.card .list-block > ul:after { + display: none; +} +.card { + background: #fff; + box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3); + margin: 10px; + position: relative; + border-radius: 2px; + font-size: 14px; +} +.card .list-block, +.card .content-block { + margin: 0; +} +.row:not(.no-gutter) .col > .card { + margin-left: 0; + margin-right: 0; +} +.card-content { + position: relative; +} +.card-content-inner { + padding: 15px; + position: relative; +} +.card-content-inner > p:first-child { + margin-top: 0; +} +.card-content-inner > p:last-child { + margin-bottom: 0; +} +.card-content-inner > .list-block, +.card-content-inner > .content-block { + margin: -15px; +} +.card-header, +.card-footer { + min-height: 44px; + position: relative; + padding: 10px 15px; + box-sizing: border-box; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: justify; + -ms-flex-pack: justify; + -webkit-justify-content: space-between; + justify-content: space-between; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; +} +.card-header[valign="top"], +.card-footer[valign="top"] { + -webkit-box-align: start; + -ms-flex-align: start; + -webkit-align-items: flex-start; + align-items: flex-start; +} +.card-header[valign="bottom"], +.card-footer[valign="bottom"] { + -webkit-box-align: end; + -ms-flex-align: end; + -webkit-align-items: flex-end; + align-items: flex-end; +} +.card-header a.link, +.card-footer a.link { + line-height: 44px; + height: 44px; + text-decoration: none; + position: relative; + margin-top: -10px; + margin-bottom: -10px; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: start; + -ms-flex-pack: start; + -webkit-justify-content: flex-start; + justify-content: flex-start; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +html:not(.watch-active-state) .card-header a.link:active, +html:not(.watch-active-state) .card-footer a.link:active, +.card-header a.link.active-state, +.card-footer a.link.active-state { + opacity: 0.3; + -webkit-transition-duration: 0ms; + transition-duration: 0ms; +} +.card-header a.link i + span, +.card-footer a.link i + span, +.card-header a.link i + i, +.card-footer a.link i + i, +.card-header a.link span + i, +.card-footer a.link span + i, +.card-header a.link span + span, +.card-footer a.link span + span { + margin-left: 7px; +} +.card-header a.link i.icon, +.card-footer a.link i.icon { + display: block; +} +.card-header a.icon-only, +.card-footer a.icon-only { + min-width: 44px; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + margin: 0; +} +.card-header { + border-radius: 2px 2px 0 0; + font-size: 17px; +} +.card-header:after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + right: auto; + top: auto; + height: 1px; + width: 100%; + background-color: #e1e1e1; + display: block; + z-index: 15; + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; +} +html.pixel-ratio-2 .card-header:after { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .card-header:after { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.card-header.no-border:after { + display: none; +} +.card-footer { + border-radius: 0 0 2px 2px; + color: #6d6d72; +} +.card-footer:before { + content: ''; + position: absolute; + left: 0; + top: 0; + bottom: auto; + right: auto; + height: 1px; + width: 100%; + background-color: #e1e1e1; + display: block; + z-index: 15; + -webkit-transform-origin: 50% 0%; + transform-origin: 50% 0%; +} +html.pixel-ratio-2 .card-footer:before { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .card-footer:before { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.card-footer.no-border:before { + display: none; +} +/* === Modals === */ +.modal-overlay, +.preloader-indicator-overlay, +.popup-overlay { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + background: rgba(0, 0, 0, 0.4); + z-index: 13000; + visibility: hidden; + opacity: 0; + -webkit-transition-duration: 400ms; + transition-duration: 400ms; +} +.modal-overlay.modal-overlay-visible, +.preloader-indicator-overlay.modal-overlay-visible, +.popup-overlay.modal-overlay-visible { + visibility: visible; + opacity: 1; +} +.popup-overlay { + z-index: 10500; +} +.modal { + width: 270px; + position: absolute; + z-index: 13500; + left: 50%; + margin-left: -135px; + margin-top: 0; + top: 50%; + text-align: center; + border-radius: 13px; + overflow: hidden; + opacity: 0; + -webkit-transform: translate3d(0, 0, 0) scale(1.185); + transform: translate3d(0, 0, 0) scale(1.185); + -webkit-transition-property: -webkit-transform, opacity; + -moz-transition-property: -moz-transform, opacity; + -ms-transition-property: -ms-transform, opacity; + -o-transition-property: -o-transform, opacity; + transition-property: transform, opacity; + color: #000; + display: none; +} +.modal.modal-in { + opacity: 1; + -webkit-transition-duration: 400ms; + transition-duration: 400ms; + -webkit-transform: translate3d(0, 0, 0) scale(1); + transform: translate3d(0, 0, 0) scale(1); +} +.modal.modal-out { + opacity: 0; + z-index: 13499; + -webkit-transition-duration: 400ms; + transition-duration: 400ms; + -webkit-transform: translate3d(0, 0, 0) scale(1); + transform: translate3d(0, 0, 0) scale(1); +} +.modal-inner { + padding: 15px; + border-radius: 13px 13px 0 0; + position: relative; + background: rgba(255, 255, 255, 0.95); +} +.modal-inner:after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + right: auto; + top: auto; + height: 1px; + width: 100%; + background-color: rgba(0, 0, 0, 0.2); + display: block; + z-index: 15; + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; +} +html.pixel-ratio-2 .modal-inner:after { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .modal-inner:after { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.modal-title { + font-weight: 500; + font-size: 18px; + text-align: center; +} +html.ios-gt-8 .modal-title { + font-weight: 600; +} +.modal-title + .modal-text { + margin-top: 5px; +} +.modal-buttons { + height: 44px; + position: relative; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; +} +.modal-buttons.modal-buttons-vertical { + display: block; + height: auto; +} +.modal-button { + width: 100%; + padding: 0 5px; + height: 44px; + font-size: 17px; + line-height: 44px; + text-align: center; + color: #007aff; + display: block; + position: relative; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; + cursor: pointer; + box-sizing: border-box; + -webkit-box-flex: 1; + -ms-flex: 1; + background: rgba(255, 255, 255, 0.95); +} +.modal-button:after { + content: ''; + position: absolute; + right: 0; + top: 0; + left: auto; + bottom: auto; + width: 1px; + height: 100%; + background-color: rgba(0, 0, 0, 0.2); + display: block; + z-index: 15; + -webkit-transform-origin: 100% 50%; + transform-origin: 100% 50%; +} +html.pixel-ratio-2 .modal-button:after { + -webkit-transform: scaleX(0.5); + transform: scaleX(0.5); +} +html.pixel-ratio-3 .modal-button:after { + -webkit-transform: scaleX(0.33); + transform: scaleX(0.33); +} +.modal-button:first-child { + border-radius: 0 0 0 13px; +} +.modal-button:last-child { + border-radius: 0 0 13px 0; +} +.modal-button:last-child:after { + display: none; +} +.modal-button:first-child:last-child { + border-radius: 0 0 13px 13px; +} +.modal-button.modal-button-bold { + font-weight: 500; +} +html.ios-gt-8 .modal-button.modal-button-bold { + font-weight: 600; +} +html:not(.watch-active-state) .modal-button:active, +.modal-button.active-state { + background: rgba(230, 230, 230, 0.95); +} +.modal-buttons-vertical .modal-button { + border-radius: 0; +} +.modal-buttons-vertical .modal-button:after { + display: none; +} +.modal-buttons-vertical .modal-button:before { + display: none; +} +.modal-buttons-vertical .modal-button:after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + right: auto; + top: auto; + height: 1px; + width: 100%; + background-color: rgba(0, 0, 0, 0.2); + display: block; + z-index: 15; + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; +} +html.pixel-ratio-2 .modal-buttons-vertical .modal-button:after { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .modal-buttons-vertical .modal-button:after { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.modal-buttons-vertical .modal-button:last-child { + border-radius: 0 0 13px 13px; +} +.modal-buttons-vertical .modal-button:last-child:after { + display: none; +} +.modal-no-buttons .modal-inner { + border-radius: 13px; +} +.modal-no-buttons .modal-inner:after { + display: none; +} +.modal-no-buttons .modal-buttons { + display: none; +} +.actions-modal { + position: absolute; + left: 0; + bottom: 0; + z-index: 13500; + width: 100%; + -webkit-transform: translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0); +} +@media (min-width: 496px) { + .actions-modal { + width: 480px; + left: 50%; + margin-left: -240px; + } +} +.actions-modal.modal-in { + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +.actions-modal.modal-out { + z-index: 13499; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + -webkit-transform: translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0); +} +.actions-modal-group { + margin: 8px; + position: relative; + border-radius: 13px; + overflow: hidden; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +.actions-modal-button, +.actions-modal-label { + width: 100%; + text-align: center; + font-weight: normal; + margin: 0; + background: rgba(255, 255, 255, 0.95); + box-sizing: border-box; + display: block; + position: relative; + overflow: hidden; +} +.actions-modal-button:after, +.actions-modal-label:after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + right: auto; + top: auto; + height: 1px; + width: 100%; + background-color: rgba(0, 0, 0, 0.2); + display: block; + z-index: 15; + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; +} +html.pixel-ratio-2 .actions-modal-button:after, +html.pixel-ratio-2 .actions-modal-label:after { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .actions-modal-button:after, +html.pixel-ratio-3 .actions-modal-label:after { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.actions-modal-button a, +.actions-modal-label a { + text-decoration: none; + color: inherit; + display: block; +} +.actions-modal-button b, +.actions-modal-label b { + font-weight: 500; +} +html.ios-gt-8 .actions-modal-button b, +html.ios-gt-8 .actions-modal-label b { + font-weight: 600; +} +.actions-modal-button.actions-modal-button-bold, +.actions-modal-label.actions-modal-button-bold { + font-weight: 500; +} +html.ios-gt-8 .actions-modal-button.actions-modal-button-bold, +html.ios-gt-8 .actions-modal-label.actions-modal-button-bold { + font-weight: 600; +} +.actions-modal-button.actions-modal-button-red, +.actions-modal-label.actions-modal-button-red { + color: #ff3b30; +} +.actions-modal-button:first-child, +.actions-modal-label:first-child { + border-radius: 13px 13px 0 0; +} +.actions-modal-button:last-child, +.actions-modal-label:last-child { + border-radius: 0 0 13px 13px; +} +.actions-modal-button:last-child:after, +.actions-modal-label:last-child:after { + display: none; +} +.actions-modal-button:first-child:last-child, +.actions-modal-label:first-child:last-child { + border-radius: 13px; +} +.actions-modal-button.disabled, +.actions-modal-label.disabled { + opacity: 0.9; + color: #8e8e93; +} +.actions-modal-button { + cursor: pointer; + height: 57px; + line-height: 57px; + font-size: 20px; + color: #007aff; + white-space: normal; + text-overflow: ellipsis; +} +html:not(.watch-active-state) .actions-modal-button:active, +.actions-modal-button.active-state { + background: rgba(230, 230, 230, 0.9); +} +.actions-modal-label { + font-size: 13px; + line-height: 1.3; + min-height: 57px; + padding: 8px 10px; + color: #8a8a8a; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; +} +@media (orientation: landscape) { + .actions-modal-label { + min-height: 44px; + } + .actions-modal-button { + height: 44px; + line-height: 44px; + } +} +input.modal-text-input { + box-sizing: border-box; + height: 26px; + background: #fff; + margin: 0; + margin-top: 15px; + padding: 0 5px; + border: 1px solid rgba(0, 0, 0, 0.3); + border-radius: 0; + width: 100%; + font-size: 14px; + font-family: inherit; + display: block; + box-shadow: 0 0 0 rgba(0, 0, 0, 0); + -webkit-appearance: none; + -moz-appearance: none; + -ms-appearance: none; + appearance: none; +} +input.modal-text-input + input.modal-text-input { + margin-top: 5px; +} +.modal-input-double + .modal-input-double input.modal-text-input { + border-top: 0; + margin-top: 0; +} +.popover { + width: 320px; + background: rgba(255, 255, 255, 0.95); + z-index: 13500; + margin: 0; + top: 0; + opacity: 0; + left: 0; + border-radius: 13px; + position: absolute; + display: none; + -webkit-transform: none; + transform: none; + -webkit-transition-property: opacity; + -moz-transition-property: opacity; + -ms-transition-property: opacity; + -o-transition-property: opacity; + transition-property: opacity; +} +.popover.modal-in { + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + opacity: 1; +} +.popover .list-block { + margin: 0; +} +.popover .list-block ul { + background: none; +} +.popover .list-block:first-child ul { + border-radius: 13px 13px 0 0; +} +.popover .list-block:first-child ul:before { + display: none; +} +.popover .list-block:first-child li:first-child a { + border-radius: 13px 13px 0 0; +} +.popover .list-block:last-child ul { + border-radius: 0 0 13px 13px; +} +.popover .list-block:last-child ul:after { + display: none; +} +.popover .list-block:last-child li:last-child a { + border-radius: 0 0 13px 13px; +} +.popover .list-block:first-child:last-child li:first-child:last-child a, +.popover .list-block:first-child:last-child ul:first-child:last-child { + border-radius: 13px; +} +.popover .list-block + .list-block { + margin-top: 35px; +} +.popover-angle { + width: 26px; + height: 26px; + position: absolute; + left: -26px; + top: 0; + z-index: 100; + overflow: hidden; +} +.popover-angle:after { + content: ' '; + background: rgba(255, 255, 255, 0.95); + width: 26px; + height: 26px; + position: absolute; + left: 0; + top: 0; + border-radius: 3px; + -webkit-transform: rotate(45deg); + transform: rotate(45deg); +} +.popover-angle.on-left { + left: -26px; +} +.popover-angle.on-left:after { + left: 19px; + top: 0; +} +.popover-angle.on-right { + left: 100%; +} +.popover-angle.on-right:after { + left: -19px; + top: 0; +} +.popover-angle.on-top { + left: 0; + top: -26px; +} +.popover-angle.on-top:after { + left: 0; + top: 19px; +} +.popover-angle.on-bottom { + left: 0; + top: 100%; +} +.popover-angle.on-bottom:after { + left: 0; + top: -19px; +} +.popover-inner { + overflow: auto; + -webkit-overflow-scrolling: touch; +} +.actions-popover .list-block + .list-block { + margin-top: 20px; +} +.actions-popover .list-block ul { + background: #fff; +} +.actions-popover-label { + padding: 8px 10px; + color: #8a8a8a; + font-size: 13px; + line-height: 1.3; + text-align: center; + position: relative; +} +.actions-popover-label:after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + right: auto; + top: auto; + height: 1px; + width: 100%; + background-color: rgba(0, 0, 0, 0.2); + display: block; + z-index: 15; + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; +} +html.pixel-ratio-2 .actions-popover-label:after { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .actions-popover-label:after { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.actions-popover-label:last-child:after { + display: none; +} +.popup, +.login-screen { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + z-index: 11000; + background: #fff; + box-sizing: border-box; + display: none; + overflow: auto; + -webkit-overflow-scrolling: touch; + -webkit-transition-property: -webkit-transform; + -moz-transition-property: -moz-transform; + -ms-transition-property: -ms-transform; + -o-transition-property: -o-transform; + transition-property: transform; + -webkit-transform: translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0); +} +.popup.modal-in, +.login-screen.modal-in, +.popup.modal-out, +.login-screen.modal-out { + -webkit-transition-duration: 400ms; + transition-duration: 400ms; +} +.popup.modal-in, +.login-screen.modal-in { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +.popup.modal-out, +.login-screen.modal-out { + -webkit-transform: translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0); +} +.login-screen.modal-in, +.login-screen.modal-out { + display: block; +} +@media all and (min-width: 630px) and (min-height: 630px) { + .popup:not(.tablet-fullscreen) { + width: 630px; + height: 630px; + left: 50%; + top: 50%; + margin-left: -315px; + margin-top: -315px; + -webkit-transform: translate3d(0, 1024px, 0); + transform: translate3d(0, 1024px, 0); + } + .popup:not(.tablet-fullscreen).modal-in { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + } + .popup:not(.tablet-fullscreen).modal-out { + -webkit-transform: translate3d(0, 1024px, 0); + transform: translate3d(0, 1024px, 0); + } +} +@media all and (max-width: 629px), (max-height: 629px) { + html.with-statusbar-overlay .popup { + height: -webkit-calc(100% - 20px); + height: calc(100% - 20px); + top: 20px; + } + html.with-statusbar-overlay .popup-overlay { + z-index: 9500; + } +} +html.with-statusbar-overlay .login-screen, +html.with-statusbar-overlay .popup.tablet-fullscreen { + height: -webkit-calc(100% - 20px); + height: calc(100% - 20px); + top: 20px; +} +.modal .preloader { + width: 34px; + height: 34px; +} +.preloader-indicator-overlay { + visibility: visible; + opacity: 0; + background: none; +} +.preloader-indicator-modal { + position: absolute; + left: 50%; + top: 50%; + padding: 8px; + margin-left: -25px; + margin-top: -25px; + background: rgba(0, 0, 0, 0.8); + z-index: 13500; + border-radius: 5px; +} +.preloader-indicator-modal .preloader { + display: block; + width: 34px; + height: 34px; +} +.picker-modal { + position: absolute; + left: 0; + bottom: 0; + width: 100%; + height: 260px; + z-index: 12500; + display: none; + -webkit-transition-property: -webkit-transform; + -moz-transition-property: -moz-transform; + -ms-transition-property: -ms-transform; + -o-transition-property: -o-transform; + transition-property: transform; + background: #cfd5da; + -webkit-transform: translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0); +} +.picker-modal.modal-in, +.picker-modal.modal-out { + -webkit-transition-duration: 400ms; + transition-duration: 400ms; +} +.picker-modal.modal-in { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +.picker-modal.modal-out { + -webkit-transform: translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0); +} +.picker-modal .picker-modal-inner { + height: 100%; + position: relative; +} +.picker-modal .toolbar { + position: relative; + width: 100%; + background: #f7f7f8; +} +.picker-modal .toolbar:before { + content: ''; + position: absolute; + left: 0; + top: 0; + bottom: auto; + right: auto; + height: 1px; + width: 100%; + background-color: #929499; + display: block; + z-index: 15; + -webkit-transform-origin: 50% 0%; + transform-origin: 50% 0%; +} +html.pixel-ratio-2 .picker-modal .toolbar:before { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .picker-modal .toolbar:before { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.picker-modal .toolbar + .picker-modal-inner { + height: -webkit-calc(100% - 44px); + height: -moz-calc(100% - 44px); + height: calc(100% - 44px); +} +.picker-modal.picker-modal-inline, +.popover .picker-modal { + display: block; + position: relative; + background: none; + z-index: inherit; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +.picker-modal.picker-modal-inline .toolbar:before, +.popover .picker-modal .toolbar:before { + display: none; +} +.picker-modal.picker-modal-inline .toolbar:after, +.popover .picker-modal .toolbar:after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + right: auto; + top: auto; + height: 1px; + width: 100%; + background-color: #929499; + display: block; + z-index: 15; + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; +} +html.pixel-ratio-2 .picker-modal.picker-modal-inline .toolbar:after, +html.pixel-ratio-2 .popover .picker-modal .toolbar:after { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .picker-modal.picker-modal-inline .toolbar:after, +html.pixel-ratio-3 .popover .picker-modal .toolbar:after { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.popover .picker-modal { + width: auto; +} +.popover .picker-modal .toolbar { + background: none; +} +.picker-modal.smart-select-picker .page { + background: #fff; +} +.picker-modal.smart-select-picker .toolbar:after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + right: auto; + top: auto; + height: 1px; + width: 100%; + background-color: #c4c4c4; + display: block; + z-index: 15; + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; +} +html.pixel-ratio-2 .picker-modal.smart-select-picker .toolbar:after { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .picker-modal.smart-select-picker .toolbar:after { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.picker-modal.smart-select-picker .list-block { + margin: 0; +} +.picker-modal.smart-select-picker .list-block ul:before { + display: none; +} +.picker-modal.smart-select-picker .list-block ul:after { + display: none; +} +/* === Panels === */ +.panel-overlay { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + background: rgba(0, 0, 0, 0); + opacity: 0; + z-index: 5999; + display: none; +} +.panel { + z-index: 1000; + display: none; + background: #111; + box-sizing: border-box; + overflow: auto; + -webkit-overflow-scrolling: touch; + position: absolute; + width: 260px; + top: 0; + height: 100%; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + -webkit-transition-duration: 400ms; + transition-duration: 400ms; +} +.panel.panel-left.panel-cover { + z-index: 6000; + left: -260px; +} +.panel.panel-left.panel-reveal { + left: 0; +} +.panel.panel-right.panel-cover { + z-index: 6000; + right: -260px; +} +.panel.panel-right.panel-reveal { + right: 0; +} +body.with-panel-left-cover .views, +body.with-panel-right-cover .views { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +body.with-panel-left-cover .panel-overlay, +body.with-panel-right-cover .panel-overlay { + display: block; +} +body.with-panel-left-reveal .views, +body.with-panel-right-reveal .views { + -webkit-transition-duration: 400ms; + transition-duration: 400ms; + -webkit-transition-property: -webkit-transform; + -moz-transition-property: -moz-transform; + transition-property: transform; +} +body.with-panel-left-reveal .panel-overlay, +body.with-panel-right-reveal .panel-overlay { + display: block; +} +body.with-panel-left-reveal .views { + -webkit-transform: translate3d(260px, 0, 0); + transform: translate3d(260px, 0, 0); +} +body.with-panel-left-reveal .panel-overlay { + margin-left: 260px; +} +body.with-panel-left-cover .panel-left { + -webkit-transform: translate3d(260px, 0, 0); + transform: translate3d(260px, 0, 0); +} +body.with-panel-right-reveal .views { + -webkit-transform: translate3d(-260px, 0, 0); + transform: translate3d(-260px, 0, 0); +} +body.with-panel-right-reveal .panel-overlay { + margin-left: -260px; +} +body.with-panel-right-cover .panel-right { + -webkit-transform: translate3d(-260px, 0, 0); + transform: translate3d(-260px, 0, 0); +} +body.panel-closing .views { + -webkit-transition-duration: 400ms; + transition-duration: 400ms; + -webkit-transition-property: -webkit-transform; + -moz-transition-property: -moz-transform; + transition-property: transform; +} +/* === Images Lazy Loading === */ +.lazy-loaded.lazy-fadeIn { + -webkit-animation: lazyFadeIn 600ms; + animation: lazyFadeIn 600ms; +} +@-webkit-keyframes lazyFadeIn { + from { + opacity: 0; + } + to { + opacity: 1; + } +} +@keyframes lazyFadeIn { + from { + opacity: 0; + } + to { + opacity: 1; + } +} +/* === Tabs === */ +.tabs .tab { + display: none; +} +.tabs .tab.active { + display: block; +} +.tabs-animated-wrap { + position: relative; + width: 100%; + overflow: hidden; + height: 100%; +} +.tabs-animated-wrap > .tabs { + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + height: 100%; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +.tabs-animated-wrap > .tabs > .tab { + width: 100%; + display: block; + -webkit-flex-shrink: 0; + -ms-flex: 0 0 auto; + flex-shrink: 0; +} +.tabs-swipeable-wrap { + height: 100%; +} +.tabs-swipeable-wrap > .tabs > .tab { + display: block; +} +/* === Messages === */ +.messages-content { + background: #fff; +} +.messages { + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-orient: vertical; + -moz-box-orient: vertical; + -ms-flex-direction: column; + -webkit-flex-direction: column; + flex-direction: column; +} +.messages-date { + text-align: center; + font-weight: 500; + font-size: 11px; + line-height: 1; + margin: 10px 15px; + color: #8e8e93; +} +html.ios-gt-8 .messages-date { + font-weight: 600; +} +.messages-date span { + font-weight: 400; +} +.message { + box-sizing: border-box; + margin: 1px 10px 0; + max-width: 70%; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-orient: vertical; + -moz-box-orient: vertical; + -ms-flex-direction: column; + -webkit-flex-direction: column; + flex-direction: column; +} +.message:first-child { + margin-top: 10px; +} +.message .message-text { + box-sizing: border-box; + border-radius: 16px; + padding: 6px 16px 9px; + min-width: 48px; + min-height: 35px; + font-size: 17px; + line-height: 1.2; + word-break: break-word; +} +.message.message-pic .message-text { + padding: 0; + background: none; +} +.message.message-pic img { + display: block; + height: auto; + max-width: 100%; + border-radius: 16px; +} +.message-name { + font-size: 12px; + line-height: 1; + color: #8e8e93; + margin-bottom: 2px; + margin-top: 7px; +} +.message-hide-name .message-name { + display: none; +} +.message-label { + font-size: 12px; + line-height: 1; + color: #8e8e93; + margin-top: 4px; +} +.message-hide-label .message-label { + display: none; +} +.message-avatar { + width: 29px; + height: 29px; + border-radius: 100%; + margin-top: -29px; + position: relative; + top: 1px; + background-size: cover; + opacity: 1; + -webkit-transition-duration: 400ms; + transition-duration: 400ms; +} +.message-hide-avatar .message-avatar { + opacity: 0; +} +.message-sent { + -ms-flex-item-align: end; + -webkit-align-self: flex-end; + align-self: flex-end; + -webkit-box-align: end; + -ms-flex-align: end; + -webkit-align-items: flex-end; + align-items: flex-end; +} +.message-sent .message-name { + margin-right: 16px; +} +.message-sent .message-label { + margin-right: 6px; +} +.message-sent.message-with-avatar .message-text { + margin-right: 29px; +} +.message-sent.message-with-avatar .message-name { + margin-right: 45px; +} +.message-sent.message-with-avatar .message-label { + margin-right: 34px; +} +.message-sent .message-text { + padding-right: 22px; + background-color: #00d449; + color: white; + margin-left: auto; + -webkit-mask-box-image: url("data:image/svg+xml;charset=utf-8,") 50% 56% 46% 42%; +} +.message-sent.message-last .message-text, +.message-sent.message-with-tail .message-text { + border-radius: 16px 16px 0 16px; + -webkit-mask-box-image: url("data:image/svg+xml;charset=utf-8,") 50% 56% 46% 42%; +} +.message-sent.message-last.message-pic img, +.message-sent.message-with-tail.message-pic img { + border-radius: 16px 16px 0 16px; +} +.message-received { + -ms-flex-item-align: start; + -webkit-align-self: flex-start; + align-self: flex-start; + -webkit-box-align: start; + -ms-flex-align: start; + -webkit-align-items: flex-start; + align-items: flex-start; +} +.message-received .message-text { + padding-left: 22px; + background-color: #e5e5ea; + color: #000; + -webkit-mask-box-image: url("data:image/svg+xml;charset=utf-8,") 50% 42% 46% 56%; +} +.message-received .message-name { + margin-left: 16px; +} +.message-received .message-label { + margin-left: 6px; +} +.message-received.message-with-avatar .message-text { + margin-left: 29px; +} +.message-received.message-with-avatar .message-name { + margin-left: 45px; +} +.message-received.message-with-avatar .message-label { + margin-left: 34px; +} +.message-received.message-last .message-text, +.message-received.message-with-tail .message-text { + border-radius: 16px 16px 16px 0; + -webkit-mask-box-image: url("data:image/svg+xml;charset=utf-8,") 50% 42% 46% 56%; +} +.message-received.message-last.message-pic img, +.message-received.message-with-tail.message-pic img { + border-radius: 16px 16px 16px 0; +} +.message-last { + margin-bottom: 8px; +} +.message-appear-from-bottom { + -webkit-animation: messageAppearFromBottom 400ms; + animation: messageAppearFromBottom 400ms; +} +.message-appear-from-top { + -webkit-animation: messageAppearFromTop 400ms; + animation: messageAppearFromTop 400ms; +} +.messages-auto-layout .message-name, +.messages-auto-layout .message-label { + display: none; +} +.messages-auto-layout .message-avatar { + opacity: 0; +} +.messages-auto-layout .message-first .message-name { + display: block; +} +.messages-auto-layout .message-last .message-avatar { + opacity: 1; +} +.messages-auto-layout .message-last .message-label { + display: block; +} +html.retina.ios-6 .message, +html.retina.ios-6 .message.message-pic img { + -webkit-mask-box-image: none; + border-radius: 16px; +} +@-webkit-keyframes messageAppearFromBottom { + from { + -webkit-transform: translate3d(0, 100%, 0); + } + to { + -webkit-transform: translate3d(0, 0, 0); + } +} +@keyframes messageAppearFromBottom { + from { + transform: translate3d(0, 100%, 0); + } + to { + transform: translate3d(0, 0, 0); + } +} +@-webkit-keyframes messageAppearFromTop { + from { + -webkit-transform: translate3d(0, -100%, 0); + } + to { + -webkit-transform: translate3d(0, 0, 0); + } +} +@keyframes messageAppearFromTop { + from { + transform: translate3d(0, -100%, 0); + } + to { + transform: translate3d(0, 0, 0); + } +} +/* === Statusbar overlay === */ +html.with-statusbar-overlay body { + padding-top: 20px; + box-sizing: border-box; +} +html.with-statusbar-overlay body .statusbar-overlay { + display: block; +} +html.with-statusbar-overlay body .panel { + padding-top: 20px; +} +.statusbar-overlay { + background: #f7f7f8; + z-index: 10000; + position: absolute; + left: 0; + top: 0; + height: 20px; + width: 100%; + display: none; + -webkit-transition-duration: 400ms; + transition-duration: 400ms; +} +/* === Preloader === */ +.preloader { + display: inline-block; + width: 20px; + height: 20px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); + background-position: 50%; + background-size: 100%; + background-repeat: no-repeat; + -webkit-animation: preloader-spin 1s steps(12, end) infinite; + animation: preloader-spin 1s steps(12, end) infinite; +} +.preloader-white { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +@-webkit-keyframes preloader-spin { + 100% { + -webkit-transform: rotate(360deg); + } +} +@keyframes preloader-spin { + 100% { + transform: rotate(360deg); + } +} +/* === Progress Bar === */ +.progressbar, +.progressbar-infinite { + height: 2px; + width: 100%; + overflow: hidden; + position: relative; + display: block; + background: #b6b6b6; + border-radius: 2px; + -webkit-transform-origin: center top; + transform-origin: center top; + -webkit-transform-style: preserve-3d; + transform-style: preserve-3d; +} +.progressbar { + vertical-align: middle; +} +.progressbar span { + width: 100%; + background: #007aff; + height: 100%; + position: absolute; + left: 0; + top: 0; + -webkit-transform: translate3d(-100%, 0, 0); + transform: translate3d(-100%, 0, 0); + -webkit-transition-duration: 150ms; + transition-duration: 150ms; +} +.progressbar-infinite:before { + content: ''; + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + background: #007aff; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + -webkit-transform-origin: left center; + transform-origin: left center; + -webkit-animation: progressbar-infinite 1s linear infinite; + animation: progressbar-infinite 1s linear infinite; +} +html.with-statusbar-overlay body > .progressbar-infinite { + top: 20px; +} +.progressbar-infinite.color-multi { + background: none; +} +.progressbar-infinite.color-multi:before { + content: ''; + position: absolute; + left: 0; + top: 0; + width: 400%; + height: 100%; + background-image: -webkit-linear-gradient(left, #4cd964, #5ac8fa, #007aff, #34aadc, #5856d6, #ff2d55, #5856d6, #34aadc, #007aff, #5ac8fa, #4cd964); + background-image: linear-gradient(to right, #4cd964, #5ac8fa, #007aff, #34aadc, #5856d6, #ff2d55, #5856d6, #34aadc, #007aff, #5ac8fa, #4cd964); + background-size: 25% 100%; + background-repeat: repeat-x; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + -webkit-animation: progressbar-infinite-multicolor 3s linear infinite; + animation: progressbar-infinite-multicolor 3s linear infinite; +} +html.with-statusbar-overlay body > .progressbar-infinite.color-multi { + top: 20px; +} +body > .progressbar, +.view > .progressbar, +.views > .progressbar, +.page > .progressbar, +.panel > .progressbar, +.popup > .progressbar, +body > .progressbar-infinite, +.view > .progressbar-infinite, +.views > .progressbar-infinite, +.page > .progressbar-infinite, +.panel > .progressbar-infinite, +.popup > .progressbar-infinite { + position: absolute; + left: 0; + top: 0; + z-index: 15000; + border-radius: 0; +} +.progressbar-in { + -webkit-animation: progressbar-in 300ms forwards; + animation: progressbar-in 300ms forwards; +} +.progressbar-out { + -webkit-animation: progressbar-out 300ms forwards; + animation: progressbar-out 300ms forwards; +} +html.with-statusbar-overlay body > .progressbar { + top: 20px; +} +@-webkit-keyframes progressbar-in { + from { + opacity: 0; + -webkit-transform: scaleY(0); + } + to { + opacity: 1; + -webkit-transform: scaleY(1); + } +} +@keyframes progressbar-in { + from { + opacity: 0; + transform: scaleY(0); + } + to { + opacity: 1; + transform: scaleY(1); + } +} +@-webkit-keyframes progressbar-out { + from { + opacity: 1; + -webkit-transform: scaleY(1); + } + to { + opacity: 0; + -webkit-transform: scaleY(0); + } +} +@keyframes progressbar-out { + from { + opacity: 1; + transform: scaleY(1); + } + to { + opacity: 0; + transform: scaleY(0); + } +} +@-webkit-keyframes progressbar-infinite { + 0% { + -webkit-transform: translate3d(-50%, 0, 0) scaleX(0.5); + } + 100% { + -webkit-transform: translate3d(100%, 0, 0) scaleX(0.5); + } +} +@keyframes progressbar-infinite { + 0% { + transform: translate3d(-50%, 0, 0) scaleX(0.5); + } + 100% { + transform: translate3d(100%, 0, 0) scaleX(0.5); + } +} +@-webkit-keyframes progressbar-infinite-multicolor { + from { + -webkit-transform: translate3d(0%, 0, 0); + } + to { + -webkit-transform: translate3d(-50%, 0, 0); + } +} +@keyframes progressbar-infinite-multicolor { + from { + transform: translate3d(0%, 0, 0); + } + to { + transform: translate3d(-50%, 0, 0); + } +} +/* === Pull To Refresh === */ +.pull-to-refresh-layer { + position: absolute; + position: relative; + margin-top: -44px; + left: 0; + top: 0; + width: 100%; + height: 44px; +} +.pull-to-refresh-layer .preloader { + position: absolute; + left: 50%; + top: 50%; + margin-left: -10px; + margin-top: -10px; + visibility: hidden; +} +.pull-to-refresh-layer .pull-to-refresh-arrow { + width: 13px; + height: 20px; + position: absolute; + left: 50%; + top: 50%; + margin-left: -6px; + margin-top: -10px; + background: no-repeat center; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2026%2040'%3E%3Cpolygon%20points%3D'9%2C22%209%2C0%2017%2C0%2017%2C22%2026%2C22%2013.5%2C40%200%2C22'%20fill%3D'%238c8c8c'%2F%3E%3C%2Fsvg%3E"); + background-size: 13px 20px; + z-index: 10; + -webkit-transform: rotate(0deg) translate3d(0, 0, 0); + transform: rotate(0deg) translate3d(0, 0, 0); + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +.pull-to-refresh-content.pull-to-refresh-no-navbar { + margin-top: -44px; + height: -webkit-calc(100% + 44px); + height: -moz-calc(100% + 44px); + height: calc(100% + 44px); +} +.pull-to-refresh-content.pull-to-refresh-no-navbar .pull-to-refresh-layer { + margin-top: 0; +} +.pull-to-refresh-content.transitioning, +.pull-to-refresh-content.refreshing { + -webkit-transition-duration: 400ms; + transition-duration: 400ms; +} +.pull-to-refresh-content:not(.refreshing) .pull-to-refresh-layer .preloader { + -webkit-animation: none; + animation: none; +} +.pull-to-refresh-content.refreshing { + -webkit-transform: translate3d(0, 44px, 0); + transform: translate3d(0, 44px, 0); +} +.pull-to-refresh-content.refreshing .pull-to-refresh-arrow { + visibility: hidden; + -webkit-transition-duration: 0ms; + transition-duration: 0ms; +} +.pull-to-refresh-content.refreshing .preloader { + visibility: visible; +} +.pull-to-refresh-content.pull-up .pull-to-refresh-arrow { + -webkit-transform: rotate(180deg) translate3d(0, 0, 0); + transform: rotate(180deg) translate3d(0, 0, 0); +} +/* === Autocomplete === */ +.autocomplete-page .autocomplete-found { + display: block; +} +.autocomplete-page .autocomplete-not-found { + display: none; +} +.autocomplete-page .autocomplete-values { + display: block; +} +.autocomplete-page .list-block ul:empty { + display: none; +} +.autocomplete-preloader:not(.autocomplete-preloader-visible) { + -webkit-animation: none; + animation: none; + visibility: hidden; +} +.autocomplete-dropdown { + background: #fff; + box-sizing: border-box; + position: absolute; + z-index: 500; + box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.2); + width: 100%; + left: 0; +} +.autocomplete-dropdown .autocomplete-dropdown-inner { + position: relative; + overflow: auto; + -webkit-overflow-scrolling: touch; + height: 100%; + z-index: 1; +} +.autocomplete-dropdown .autocomplete-preloader { + display: none; + position: absolute; + right: 15px; + bottom: 100%; + margin-bottom: 12px; + width: 20px; + height: 20px; +} +.autocomplete-dropdown .autocomplete-preloader-visible { + display: block; +} +.autocomplete-dropdown .autocomplete-dropdown-placeholder { + color: #a9a9a9; +} +.autocomplete-dropdown .list-block { + margin: 0; +} +.autocomplete-dropdown .list-block ul { + background: none !important; +} +.autocomplete-dropdown .list-block ul:before { + display: none; +} +.autocomplete-dropdown .list-block ul:after { + display: none; +} +.autocomplete-dropdown .list-block b { + font-weight: 500; +} +html.ios-gt-8 .autocomplete-dropdown .list-block b { + font-weight: 600; +} +.list-block .item-content-dropdown-expand .item-title.label { + width: 0; + -webkit-flex-shrink: 10; + -ms-flex: 0 10 auto; + flex-shrink: 10; +} +.list-block .item-content-dropdown-expand .item-title.label + .item-input { + margin-left: 0; +} +.list-block .item-content-dropdown-expand .item-input { + width: 100%; +} +/* === Swiper === */ +.swiper-container { + margin: 0 auto; + position: relative; + overflow: hidden; + /* Fix of Webkit flickering */ + z-index: 1; +} +.swiper-container-no-flexbox .swiper-slide { + float: left; +} +.swiper-container-vertical > .swiper-wrapper { + -webkit-box-orient: vertical; + -moz-box-orient: vertical; + -ms-flex-direction: column; + -webkit-flex-direction: column; + flex-direction: column; +} +.swiper-wrapper { + position: relative; + width: 100%; + height: 100%; + z-index: 1; + display: -webkit-box; + display: -moz-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-transition-property: -webkit-transform; + -moz-transition-property: -moz-transform; + -o-transition-property: -o-transform; + -ms-transition-property: -ms-transform; + transition-property: transform; + -webkit-box-sizing: content-box; + -moz-box-sizing: content-box; + box-sizing: content-box; +} +.swiper-container-android .swiper-slide, +.swiper-wrapper { + -webkit-transform: translate3d(0px, 0, 0); + -moz-transform: translate3d(0px, 0, 0); + -o-transform: translate(0px, 0px); + -ms-transform: translate3d(0px, 0, 0); + transform: translate3d(0px, 0, 0); +} +.swiper-container-multirow > .swiper-wrapper { + -webkit-box-lines: multiple; + -moz-box-lines: multiple; + -ms-flex-wrap: wrap; + -webkit-flex-wrap: wrap; + flex-wrap: wrap; +} +.swiper-container-free-mode > .swiper-wrapper { + -webkit-transition-timing-function: ease-out; + -moz-transition-timing-function: ease-out; + -ms-transition-timing-function: ease-out; + -o-transition-timing-function: ease-out; + transition-timing-function: ease-out; + margin: 0 auto; +} +.swiper-slide { + -webkit-flex-shrink: 0; + -ms-flex: 0 0 auto; + flex-shrink: 0; + width: 100%; + height: 100%; + position: relative; +} +/* Auto Height */ +.swiper-container-autoheight, +.swiper-container-autoheight .swiper-slide { + height: auto; +} +.swiper-container-autoheight .swiper-wrapper { + -webkit-box-align: start; + -ms-flex-align: start; + -webkit-align-items: flex-start; + align-items: flex-start; + -webkit-transition-property: -webkit-transform, height; + -moz-transition-property: -moz-transform; + -o-transition-property: -o-transform; + -ms-transition-property: -ms-transform; + transition-property: transform, height; +} +/* a11y */ +.swiper-container .swiper-notification { + position: absolute; + left: 0; + top: 0; + pointer-events: none; + opacity: 0; + z-index: -1000; +} +/* IE10 Windows Phone 8 Fixes */ +.swiper-wp8-horizontal { + -ms-touch-action: pan-y; + touch-action: pan-y; +} +.swiper-wp8-vertical { + -ms-touch-action: pan-x; + touch-action: pan-x; +} +/* Arrows */ +.swiper-button-prev, +.swiper-button-next { + position: absolute; + top: 50%; + width: 27px; + height: 44px; + margin-top: -22px; + z-index: 10; + cursor: pointer; + -moz-background-size: 27px 44px; + -webkit-background-size: 27px 44px; + background-size: 27px 44px; + background-position: center; + background-repeat: no-repeat; +} +.swiper-button-prev.swiper-button-disabled, +.swiper-button-next.swiper-button-disabled { + opacity: 0.35; + cursor: auto; + pointer-events: none; +} +.swiper-button-prev, +.swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E"); + left: 10px; + right: auto; +} +.swiper-button-next, +.swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E"); + right: 10px; + left: auto; +} +/* Pagination Styles */ +.swiper-pagination { + position: absolute; + text-align: center; + -webkit-transition: 300ms; + -moz-transition: 300ms; + -o-transition: 300ms; + transition: 300ms; + -webkit-transform: translate3d(0, 0, 0); + -ms-transform: translate3d(0, 0, 0); + -o-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + z-index: 10; +} +.swiper-pagination.swiper-pagination-hidden { + opacity: 0; +} +/* Common Styles */ +.swiper-pagination-fraction, +.swiper-pagination-custom, +.swiper-container-horizontal > .swiper-pagination-bullets { + bottom: 10px; + left: 0; + width: 100%; +} +/* Bullets */ +.swiper-pagination-bullet { + width: 8px; + height: 8px; + display: inline-block; + border-radius: 100%; + background: #000; + opacity: 0.2; +} +button.swiper-pagination-bullet { + border: none; + margin: 0; + padding: 0; + box-shadow: none; + -moz-appearance: none; + -ms-appearance: none; + -webkit-appearance: none; + appearance: none; +} +.swiper-pagination-clickable .swiper-pagination-bullet { + cursor: pointer; +} +.swiper-pagination-bullet-active { + opacity: 1; + background: #007aff; +} +.swiper-container-vertical > .swiper-pagination-bullets { + right: 10px; + top: 50%; + -webkit-transform: translate3d(0px, -50%, 0); + -moz-transform: translate3d(0px, -50%, 0); + -o-transform: translate(0px, -50%); + -ms-transform: translate3d(0px, -50%, 0); + transform: translate3d(0px, -50%, 0); +} +.swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet { + margin: 5px 0; + display: block; +} +.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet { + margin: 0 5px; +} +/* Progress */ +.swiper-pagination-progress { + background: rgba(0, 0, 0, 0.25); + position: absolute; +} +.swiper-pagination-progress .swiper-pagination-progressbar { + background: #007aff; + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + -webkit-transform: scale(0); + -ms-transform: scale(0); + -o-transform: scale(0); + transform: scale(0); + -webkit-transform-origin: left top; + -moz-transform-origin: left top; + -ms-transform-origin: left top; + -o-transform-origin: left top; + transform-origin: left top; +} +.swiper-container-rtl .swiper-pagination-progress .swiper-pagination-progressbar { + -webkit-transform-origin: right top; + -moz-transform-origin: right top; + -ms-transform-origin: right top; + -o-transform-origin: right top; + transform-origin: right top; +} +.swiper-container-horizontal > .swiper-pagination-progress { + width: 100%; + height: 4px; + left: 0; + top: 0; +} +.swiper-container-vertical > .swiper-pagination-progress { + width: 4px; + height: 100%; + left: 0; + top: 0; +} +/* 3D Container */ +.swiper-container-3d { + -webkit-perspective: 1200px; + -moz-perspective: 1200px; + -o-perspective: 1200px; + perspective: 1200px; +} +.swiper-container-3d .swiper-wrapper, +.swiper-container-3d .swiper-slide, +.swiper-container-3d .swiper-slide-shadow-left, +.swiper-container-3d .swiper-slide-shadow-right, +.swiper-container-3d .swiper-slide-shadow-top, +.swiper-container-3d .swiper-slide-shadow-bottom, +.swiper-container-3d .swiper-cube-shadow { + -webkit-transform-style: preserve-3d; + -moz-transform-style: preserve-3d; + -ms-transform-style: preserve-3d; + transform-style: preserve-3d; +} +.swiper-container-3d .swiper-slide-shadow-left, +.swiper-container-3d .swiper-slide-shadow-right, +.swiper-container-3d .swiper-slide-shadow-top, +.swiper-container-3d .swiper-slide-shadow-bottom { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + pointer-events: none; + z-index: 10; +} +.swiper-container-3d .swiper-slide-shadow-left { + background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0))); + /* Safari 4+, Chrome */ + background-image: -webkit-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Chrome 10+, Safari 5.1+, iOS 5+ */ + background-image: -moz-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Firefox 3.6-15 */ + background-image: -o-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Opera 11.10-12.00 */ + background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Firefox 16+, IE10, Opera 12.50+ */ +} +.swiper-container-3d .swiper-slide-shadow-right { + background-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0))); + /* Safari 4+, Chrome */ + background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Chrome 10+, Safari 5.1+, iOS 5+ */ + background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Firefox 3.6-15 */ + background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Opera 11.10-12.00 */ + background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Firefox 16+, IE10, Opera 12.50+ */ +} +.swiper-container-3d .swiper-slide-shadow-top { + background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0))); + /* Safari 4+, Chrome */ + background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Chrome 10+, Safari 5.1+, iOS 5+ */ + background-image: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Firefox 3.6-15 */ + background-image: -o-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Opera 11.10-12.00 */ + background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Firefox 16+, IE10, Opera 12.50+ */ +} +.swiper-container-3d .swiper-slide-shadow-bottom { + background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0))); + /* Safari 4+, Chrome */ + background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Chrome 10+, Safari 5.1+, iOS 5+ */ + background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Firefox 3.6-15 */ + background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Opera 11.10-12.00 */ + background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Firefox 16+, IE10, Opera 12.50+ */ +} +/* Coverflow */ +.swiper-container-coverflow .swiper-wrapper, +.swiper-container-flip .swiper-wrapper { + /* Windows 8 IE 10 fix */ + -ms-perspective: 1200px; +} +/* Cube + Flip */ +.swiper-container-cube, +.swiper-container-flip { + overflow: visible; +} +.swiper-container-cube .swiper-slide, +.swiper-container-flip .swiper-slide { + pointer-events: none; + -webkit-backface-visibility: hidden; + -moz-backface-visibility: hidden; + -ms-backface-visibility: hidden; + backface-visibility: hidden; + z-index: 1; +} +.swiper-container-cube .swiper-slide .swiper-slide, +.swiper-container-flip .swiper-slide .swiper-slide { + pointer-events: none; +} +.swiper-container-cube .swiper-slide-active, +.swiper-container-flip .swiper-slide-active, +.swiper-container-cube .swiper-slide-active .swiper-slide-active, +.swiper-container-flip .swiper-slide-active .swiper-slide-active { + pointer-events: auto; +} +.swiper-container-cube .swiper-slide-shadow-top, +.swiper-container-flip .swiper-slide-shadow-top, +.swiper-container-cube .swiper-slide-shadow-bottom, +.swiper-container-flip .swiper-slide-shadow-bottom, +.swiper-container-cube .swiper-slide-shadow-left, +.swiper-container-flip .swiper-slide-shadow-left, +.swiper-container-cube .swiper-slide-shadow-right, +.swiper-container-flip .swiper-slide-shadow-right { + z-index: 0; + -webkit-backface-visibility: hidden; + -moz-backface-visibility: hidden; + -ms-backface-visibility: hidden; + backface-visibility: hidden; +} +/* Cube */ +.swiper-container-cube .swiper-slide { + visibility: hidden; + -webkit-transform-origin: 0 0; + -moz-transform-origin: 0 0; + -ms-transform-origin: 0 0; + transform-origin: 0 0; + width: 100%; + height: 100%; +} +.swiper-container-cube.swiper-container-rtl .swiper-slide { + -webkit-transform-origin: 100% 0; + -moz-transform-origin: 100% 0; + -ms-transform-origin: 100% 0; + transform-origin: 100% 0; +} +.swiper-container-cube .swiper-slide-active, +.swiper-container-cube .swiper-slide-next, +.swiper-container-cube .swiper-slide-prev, +.swiper-container-cube .swiper-slide-next + .swiper-slide { + pointer-events: auto; + visibility: visible; +} +.swiper-container-cube .swiper-cube-shadow { + position: absolute; + left: 0; + bottom: 0px; + width: 100%; + height: 100%; + background: #000; + opacity: 0.6; + -webkit-filter: blur(50px); + filter: blur(50px); + z-index: 0; +} +/* Fade */ +.swiper-container-fade.swiper-container-free-mode .swiper-slide { + -webkit-transition-timing-function: ease-out; + -moz-transition-timing-function: ease-out; + -ms-transition-timing-function: ease-out; + -o-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.swiper-container-fade .swiper-slide { + pointer-events: none; + -webkit-transition-property: opacity; + -moz-transition-property: opacity; + -o-transition-property: opacity; + transition-property: opacity; +} +.swiper-container-fade .swiper-slide .swiper-slide { + pointer-events: none; +} +.swiper-container-fade .swiper-slide-active, +.swiper-container-fade .swiper-slide-active .swiper-slide-active { + pointer-events: auto; +} +/* Scrollbar */ +.swiper-scrollbar { + border-radius: 10px; + position: relative; + -ms-touch-action: none; + background: rgba(0, 0, 0, 0.1); +} +.swiper-container-horizontal > .swiper-scrollbar { + position: absolute; + left: 1%; + bottom: 3px; + z-index: 50; + height: 5px; + width: 98%; +} +.swiper-container-vertical > .swiper-scrollbar { + position: absolute; + right: 3px; + top: 1%; + z-index: 50; + width: 5px; + height: 98%; +} +.swiper-scrollbar-drag { + height: 100%; + width: 100%; + position: relative; + background: rgba(0, 0, 0, 0.5); + border-radius: 10px; + left: 0; + top: 0; +} +.swiper-scrollbar-cursor-drag { + cursor: move; +} +/* Preloader */ +.swiper-slide .preloader { + width: 42px; + height: 42px; + position: absolute; + left: 50%; + top: 50%; + margin-left: -21px; + margin-top: -21px; + z-index: 10; +} +/* === Photo Browser === */ +.photo-browser { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + z-index: 11500; +} +body > .photo-browser { + opacity: 0; + display: none; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +body > .photo-browser.photo-browser-in { + display: block; + -webkit-animation: photoBrowserIn 400ms forwards; + animation: photoBrowserIn 400ms forwards; +} +body > .photo-browser.photo-browser-out { + display: block; + -webkit-animation: photoBrowserOut 400ms forwards; + animation: photoBrowserOut 400ms forwards; +} +html.with-statusbar-overlay body > .photo-browser { + height: -webkit-calc(100% - 20px); + height: calc(100% - 20px); + top: 20px; +} +.popup > .photo-browser .navbar, +body > .photo-browser .navbar, +.popup > .photo-browser .toolbar, +body > .photo-browser .toolbar { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +.photo-browser .page[data-page="photo-browser-slides"] { + background: none; +} +.photo-browser-popup { + background: none; +} +.photo-browser .navbar, +.views .view[data-page="photo-browser-slides"] .navbar, +.photo-browser .toolbar, +.views .view[data-page="photo-browser-slides"] .toolbar { + background: rgba(247, 247, 247, 0.95); + -webkit-transition-duration: 400ms; + transition-duration: 400ms; +} +.view[data-page="photo-browser-slides"] .page[data-page="photo-browser-slides"] .navbar, +.view[data-page="photo-browser-slides"] .page[data-page="photo-browser-slides"] .toolbar { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +.photo-browser-exposed .navbar, +.photo-browser-exposed .toolbar { + opacity: 0; + visibility: hidden; + pointer-events: none; +} +.photo-browser-exposed .photo-browser-swiper-container { + background: #000; +} +.photo-browser-of { + margin: 0 5px; +} +.photo-browser-captions { + pointer-events: none; + position: absolute; + left: 0; + width: 100%; + bottom: 0; + z-index: 10; + opacity: 1; + -webkit-transition-duration: 400ms; + transition-duration: 400ms; +} +.photo-browser-captions.photo-browser-captions-exposed { + opacity: 0; +} +.toolbar ~ .photo-browser-captions { + bottom: 44px; + -webkit-transform: translate3d(0, 0px, 0); + transform: translate3d(0, 0px, 0); +} +.photo-browser-exposed .toolbar ~ .photo-browser-captions { + -webkit-transform: translate3d(0, 44px, 0); + transform: translate3d(0, 44px, 0); +} +.toolbar ~ .photo-browser-captions.photo-browser-captions-exposed { + -webkit-transform: translate3d(0, 0px, 0); + transform: translate3d(0, 0px, 0); +} +.photo-browser-caption { + box-sizing: border-box; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + position: absolute; + bottom: 0; + left: 0; + opacity: 0; + padding: 4px 5px; + width: 100%; + text-align: center; + color: #fff; + background: rgba(0, 0, 0, 0.8); +} +.photo-browser-caption:empty { + display: none; +} +.photo-browser-caption.photo-browser-caption-active { + opacity: 1; +} +.photo-browser-captions-light .photo-browser-caption { + background: rgba(255, 255, 255, 0.8); + color: #000; +} +.photo-browser-exposed .photo-browser-caption { + color: #fff; + background: rgba(0, 0, 0, 0.8); +} +.photo-browser-swiper-container { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + overflow: hidden; + background: #fff; + -webkit-transition-duration: 400ms; + transition-duration: 400ms; +} +.photo-browser-swiper-wrapper { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + padding: 0; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; +} +.photo-browser-link-inactive { + opacity: 0.3; +} +.photo-browser-slide { + width: 100%; + height: 100%; + position: relative; + overflow: hidden; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + -webkit-flex-shrink: 0; + -ms-flex: 0 0 auto; + flex-shrink: 0; + box-sizing: border-box; +} +.photo-browser-slide.transitioning { + -webkit-transition-duration: 400ms; + transition-duration: 400ms; +} +.photo-browser-slide span.photo-browser-zoom-container { + width: 100%; + text-align: center; + display: none; +} +.photo-browser-slide img { + width: auto; + height: auto; + max-width: 100%; + max-height: 100%; + display: none; +} +.photo-browser-slide.swiper-slide-active span.photo-browser-zoom-container, +.photo-browser-slide.swiper-slide-next span.photo-browser-zoom-container, +.photo-browser-slide.swiper-slide-prev span.photo-browser-zoom-container { + display: block; +} +.photo-browser-slide.swiper-slide-active img, +.photo-browser-slide.swiper-slide-next img, +.photo-browser-slide.swiper-slide-prev img { + display: inline; +} +.photo-browser-slide.swiper-slide-active.photo-browser-slide-lazy .preloader, +.photo-browser-slide.swiper-slide-next.photo-browser-slide-lazy .preloader, +.photo-browser-slide.swiper-slide-prev.photo-browser-slide-lazy .preloader { + display: block; +} +.photo-browser-slide iframe { + width: 100%; + height: 100%; +} +.photo-browser-slide .preloader { + display: none; + position: absolute; + width: 42px; + height: 42px; + margin-left: -21px; + margin-top: -21px; + left: 50%; + top: 50%; +} +.photo-browser-dark .navbar, +.photo-browser-dark .toolbar { + background: rgba(30, 30, 30, 0.8); + color: #fff; +} +.photo-browser-dark .navbar:before, +.photo-browser-dark .toolbar:before { + display: none; +} +.photo-browser-dark .navbar:after, +.photo-browser-dark .toolbar:after { + display: none; +} +.photo-browser-dark .navbar a, +.photo-browser-dark .toolbar a { + color: #fff; +} +.photo-browser-dark .photo-browser-swiper-container { + background: #000; +} +@-webkit-keyframes photoBrowserIn { + 0% { + -webkit-transform: translate3d(0, 0, 0) scale(0.5); + opacity: 0; + } + 100% { + -webkit-transform: translate3d(0, 0, 0) scale(1); + opacity: 1; + } +} +@keyframes photoBrowserIn { + 0% { + transform: translate3d(0, 0, 0) scale(0.5); + opacity: 0; + } + 100% { + transform: translate3d(0, 0, 0) scale(1); + opacity: 1; + } +} +@-webkit-keyframes photoBrowserOut { + 0% { + -webkit-transform: translate3d(0, 0, 0) scale(1); + opacity: 1; + } + 100% { + -webkit-transform: translate3d(0, 0, 0) scale(0.5); + opacity: 0; + } +} +@keyframes photoBrowserOut { + 0% { + transform: translate3d(0, 0, 0) scale(1); + opacity: 1; + } + 100% { + transform: translate3d(0, 0, 0) scale(0.5); + opacity: 0; + } +} +/* === Columns Picker === */ +.picker-columns { + width: 100%; + height: 260px; + z-index: 11500; +} +.picker-columns.picker-modal-inline, +.popover .picker-columns { + height: 200px; +} +@media (orientation: landscape) and (max-height: 415px) { + .picker-columns:not(.picker-modal-inline) { + height: 200px; + } +} +.popover.popover-picker-columns { + width: 280px; +} +.picker-items { + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; + padding: 0; + text-align: right; + font-size: 24px; + -webkit-mask-box-image: -webkit-linear-gradient(bottom, transparent, transparent 5%, white 20%, white 80%, transparent 95%, transparent); + -webkit-mask-box-image: linear-gradient(to top, transparent, transparent 5%, white 20%, white 80%, transparent 95%, transparent); +} +.picker-items-col { + overflow: hidden; + position: relative; + max-height: 100%; +} +.picker-items-col.picker-items-col-left { + text-align: left; +} +.picker-items-col.picker-items-col-center { + text-align: center; +} +.picker-items-col.picker-items-col-right { + text-align: right; +} +.picker-items-col.picker-items-col-divider { + color: #000; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; +} +.picker-items-col-wrapper { + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.picker-item { + height: 36px; + line-height: 36px; + padding: 0 10px; + white-space: nowrap; + position: relative; + overflow: hidden; + text-overflow: ellipsis; + color: #707274; + left: 0; + top: 0; + width: 100%; + box-sizing: border-box; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +.picker-items-col-absolute .picker-item { + position: absolute; +} +.picker-item.picker-item-far { + pointer-events: none; +} +.picker-item.picker-selected { + color: #000; + -webkit-transform: translate3d(0, 0, 0) rotateX(0deg); + transform: translate3d(0, 0, 0) rotateX(0deg); +} +.picker-center-highlight { + height: 36px; + box-sizing: border-box; + position: absolute; + left: 0; + width: 100%; + top: 50%; + margin-top: -18px; + pointer-events: none; +} +.picker-center-highlight:before { + content: ''; + position: absolute; + left: 0; + top: 0; + bottom: auto; + right: auto; + height: 1px; + width: 100%; + background-color: #a8abb0; + display: block; + z-index: 15; + -webkit-transform-origin: 50% 0%; + transform-origin: 50% 0%; +} +html.pixel-ratio-2 .picker-center-highlight:before { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .picker-center-highlight:before { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.picker-center-highlight:after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + right: auto; + top: auto; + height: 1px; + width: 100%; + background-color: #a8abb0; + display: block; + z-index: 15; + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; +} +html.pixel-ratio-2 .picker-center-highlight:after { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .picker-center-highlight:after { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.picker-3d .picker-items { + overflow: hidden; + -webkit-perspective: 1200px; + perspective: 1200px; +} +.picker-3d .picker-items-col, +.picker-3d .picker-items-col-wrapper, +.picker-3d .picker-item { + -webkit-transform-style: preserve-3d; + transform-style: preserve-3d; +} +.picker-3d .picker-items-col { + overflow: visible; +} +.picker-3d .picker-item { + -webkit-transform-origin: center center -110px; + transform-origin: center center -110px; + -webkit-backface-visibility: hidden; + backface-visibility: hidden; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +/* === Calendar === */ +.picker-calendar { + background: #fff; + height: 320px; + width: 100%; + overflow: hidden; +} +@media (orientation: landscape) and (max-height: 415px) { + .picker-calendar:not(.picker-modal-inline) { + height: 220px; + } +} +.picker-calendar .picker-modal-inner { + overflow: hidden; +} +.popover-picker-calendar .picker-calendar { + height: 320px; +} +.popover.popover-picker-calendar { + width: 320px; +} +.picker-calendar-week-days { + height: 18px; + background: #f7f7f8; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + font-size: 11px; + box-sizing: border-box; + position: relative; +} +.picker-calendar-week-days:after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + right: auto; + top: auto; + height: 1px; + width: 100%; + background-color: #c4c4c4; + display: block; + z-index: 15; + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; +} +html.pixel-ratio-2 .picker-calendar-week-days:after { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .picker-calendar-week-days:after { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.picker-calendar-week-days .picker-calendar-week-day { + -webkit-flex-shrink: 1; + -ms-flex: 0 1 auto; + flex-shrink: 1; + width: 14.28571429%; + width: -webkit-calc(100% / 7); + width: -moz-calc(100% / 7); + width: calc(100% / 7); + line-height: 17px; + text-align: center; +} +.picker-calendar-week-days + .picker-calendar-months { + height: -webkit-calc(100% - 18px); + height: -moz-calc(100% - 18px); + height: calc(100% - 18px); +} +.picker-calendar-months { + width: 100%; + height: 100%; + overflow: hidden; + position: relative; +} +.picker-calendar-months-wrapper { + position: relative; + width: 100%; + height: 100%; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +.picker-calendar-month { + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-orient: vertical; + -moz-box-orient: vertical; + -ms-flex-direction: column; + -webkit-flex-direction: column; + flex-direction: column; + width: 100%; + height: 100%; + position: absolute; + left: 0; + top: 0; +} +.picker-calendar-row { + height: 16.66666667%; + height: -webkit-calc(100% / 6); + height: -moz-calc(100% / 6); + height: calc(100% / 6); + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-flex-shrink: 1; + -ms-flex: 0 1 auto; + flex-shrink: 1; + width: 100%; + position: relative; +} +.picker-calendar-row:after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + right: auto; + top: auto; + height: 1px; + width: 100%; + background-color: #ccc; + display: block; + z-index: 15; + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; +} +html.pixel-ratio-2 .picker-calendar-row:after { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .picker-calendar-row:after { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.picker-calendar-row:last-child:after { + display: none; +} +.picker-calendar-day { + -webkit-flex-shrink: 1; + -ms-flex: 0 1 auto; + flex-shrink: 1; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + box-sizing: border-box; + width: 14.28571429%; + width: -webkit-calc(100% / 7); + width: -moz-calc(100% / 7); + width: calc(100% / 7); + text-align: center; + color: #000; + font-size: 15px; + cursor: pointer; + z-index: 20; + height: 100%; +} +.picker-calendar-day.picker-calendar-day-prev, +.picker-calendar-day.picker-calendar-day-next { + color: #b8b8b8; +} +.picker-calendar-day.picker-calendar-day-disabled { + color: #d4d4d4; + cursor: auto; +} +.picker-calendar-day.picker-calendar-day-today span { + background: #e3e3e3; +} +.picker-calendar-day.picker-calendar-day-selected span { + background: #007aff; + color: #fff; +} +.picker-calendar-day.picker-calendar-day-has-events span:after { + content: ''; + width: 4px; + height: 4px; + border-radius: 50%; + background: #ccc; + position: absolute; + margin-left: -2px; + left: 50%; + bottom: 1px; +} +.picker-calendar-day.picker-calendar-day-has-events.picker-calendar-day-selected span:after { + display: none; +} +.picker-calendar-day span { + display: inline-block; + border-radius: 100%; + width: 30px; + height: 30px; + line-height: 30px; + position: relative; +} +.picker-calendar-range .picker-calendar-day.picker-calendar-day-selected { + -webkit-box-align: stretch; + -ms-flex-align: stretch; + -webkit-align-items: stretch; + align-items: stretch; + -ms-flex-line-pack: stretch; + -webkit-align-content: stretch; + align-content: stretch; +} +.picker-calendar-range .picker-calendar-day.picker-calendar-day-selected span { + width: 100%; + border-radius: 0; + height: auto; + text-align: center; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + -webkit-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; +} +.picker-calendar-month-picker, +.picker-calendar-year-picker { + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + -webkit-box-pack: justify; + -ms-flex-pack: justify; + -webkit-justify-content: space-between; + justify-content: space-between; + width: 50%; + max-width: 200px; + -webkit-flex-shrink: 10; + -ms-flex: 0 10 auto; + flex-shrink: 10; +} +.picker-calendar-month-picker a.icon-only, +.picker-calendar-year-picker a.icon-only { + min-width: 36px; +} +.picker-calendar-month-picker span, +.picker-calendar-year-picker span { + -webkit-flex-shrink: 1; + -ms-flex: 0 1 auto; + flex-shrink: 1; + position: relative; + overflow: hidden; + text-overflow: ellipsis; +} +.popover .picker-calendar .picker-calendar-week-days, +.picker-calendar.picker-modal-inline .picker-calendar-week-days { + background: none; +} +.popover .picker-calendar .toolbar:before, +.picker-calendar.picker-modal-inline .toolbar:before, +.popover .picker-calendar .picker-calendar-week-days:before, +.picker-calendar.picker-modal-inline .picker-calendar-week-days:before { + display: none; +} +.popover .picker-calendar .toolbar:after, +.picker-calendar.picker-modal-inline .toolbar:after, +.popover .picker-calendar .picker-calendar-week-days:after, +.picker-calendar.picker-modal-inline .picker-calendar-week-days:after { + display: none; +} +.popover .picker-calendar .toolbar ~ .picker-modal-inner .picker-calendar-months:before, +.picker-calendar.picker-modal-inline .toolbar ~ .picker-modal-inner .picker-calendar-months:before, +.popover .picker-calendar .picker-calendar-week-days ~ .picker-calendar-months:before, +.picker-calendar.picker-modal-inline .picker-calendar-week-days ~ .picker-calendar-months:before { + content: ''; + position: absolute; + left: 0; + top: 0; + bottom: auto; + right: auto; + height: 1px; + width: 100%; + background-color: #c4c4c4; + display: block; + z-index: 15; + -webkit-transform-origin: 50% 0%; + transform-origin: 50% 0%; +} +html.pixel-ratio-2 .popover .picker-calendar .toolbar ~ .picker-modal-inner .picker-calendar-months:before, +html.pixel-ratio-2 .picker-calendar.picker-modal-inline .toolbar ~ .picker-modal-inner .picker-calendar-months:before, +html.pixel-ratio-2 .popover .picker-calendar .picker-calendar-week-days ~ .picker-calendar-months:before, +html.pixel-ratio-2 .picker-calendar.picker-modal-inline .picker-calendar-week-days ~ .picker-calendar-months:before { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .popover .picker-calendar .toolbar ~ .picker-modal-inner .picker-calendar-months:before, +html.pixel-ratio-3 .picker-calendar.picker-modal-inline .toolbar ~ .picker-modal-inner .picker-calendar-months:before, +html.pixel-ratio-3 .popover .picker-calendar .picker-calendar-week-days ~ .picker-calendar-months:before, +html.pixel-ratio-3 .picker-calendar.picker-modal-inline .picker-calendar-week-days ~ .picker-calendar-months:before { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +/* === Notifications === */ +.notifications { + position: absolute; + left: 0; + top: 0; + width: 100%; + z-index: 20000; + color: #fff; + font-size: 14px; + margin: 0; + border: none; + display: none; + box-sizing: border-box; + max-height: 100%; + overflow: auto; + -webkit-overflow-scrolling: touch; + -webkit-transition-duration: 450ms; + transition-duration: 450ms; + background: rgba(0, 0, 0, 0.85); + -webkit-perspective: 1200px; + perspective: 1200px; +} +.notifications.list-block > ul { + background: none; + margin: 0; +} +.notifications.list-block > ul:before { + display: none; +} +.notifications.list-block > ul:after { + display: none; +} +.with-statusbar-overlay .notifications { + padding-top: 20px; + -webkit-transform: translate3d(0, -20px, 0); + transform: translate3d(0, -20px, 0); +} +.notifications .item-content { + -webkit-box-align: start; + -ms-flex-align: start; + -webkit-align-items: flex-start; + align-items: flex-start; +} +.notifications .item-text, +.notifications .item-subtitle, +.notifications .item-title { + font-size: 14px; +} +.notifications .item-title { + font-weight: 500; +} +html.ios-gt-8 .notifications .item-title { + font-weight: 600; +} +.notifications .item-text { + height: auto; + color: #d2d2d2; + line-height: inherit; +} +.notifications .item-text, +.notifications .item-subtitle { + font-weight: 300; +} +.notifications .item-inner:after { + background-color: rgba(255, 255, 255, 0.2); +} +.notifications .item-media i.icon { + width: 20px; + height: 20px; + -webkit-background-size: cover; + background-size: cover; + background-position: center; + background-repeat: no-repeat; +} +.notifications li.notification-item .item-media { + padding-top: 13px; +} +.notifications .close-notification { + width: 19px; + height: 19px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2019%2019'%3E%3Cg%3E%3Cpath%20fill%3D'%23bcbfc4'%20d%3D'M9.5%2C1C14.2%2C1%2C18%2C4.8%2C18%2C9.5S14.2%2C18%2C9.5%2C18S1%2C14.2%2C1%2C9.5S4.8%2C1%2C9.5%2C1%20M9.5%2C0C4.3%2C0%2C0%2C4.3%2C0%2C9.5%20S4.3%2C19%2C9.5%2C19S19%2C14.7%2C19%2C9.5S14.7%2C0%2C9.5%2C0L9.5%2C0z'%2F%3E%3C%2Fg%3E%3Cline%20stroke%3D'%23bcbfc4'%20stroke-miterlimit%3D'10'%20x1%3D'5.2'%20y1%3D'5.2'%20x2%3D'13.8'%20y2%3D'13.8'%2F%3E%3Cline%20stroke%3D'%23bcbfc4'%20stroke-miterlimit%3D'10'%20x1%3D'14.1'%20y1%3D'4.9'%20x2%3D'4.9'%20y2%3D'14.1'%2F%3E%3C%2Fsvg%3E"); + background-position: center top; + background-repeat: no-repeat; + -webkit-background-size: 100% auto; + background-size: 100% auto; + position: relative; +} +.notifications .close-notification span { + position: absolute; + width: 44px; + height: 44px; + left: 50%; + top: 50%; + margin-left: -22px; + margin-top: -22px; +} +.notifications .notification-item { + max-width: 568px; + margin: 0 auto; + -webkit-transition-duration: 450ms; + transition-duration: 450ms; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + opacity: 1; +} +.notifications .notification-hidden { + opacity: 0; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +/* === Login screen === */ +.login-screen-content { + background: #fff; +} +.login-screen-content .login-screen-title, +.login-screen-content .list-block, +.login-screen-content .content-block, +.login-screen-content .list-block-label { + max-width: 480px; + margin: 25px auto; +} +.login-screen-content .list-block ul { + background: none; +} +.login-screen-content .list-block ul:before { + display: none; +} +.login-screen-content .list-block ul:after { + display: none; +} +.login-screen-content .list-block-label { + text-align: center; +} +.login-screen-title { + text-align: center; + font-size: 30px; +} +/* === Disabled elements === */ +.disabled, +[disabled] { + opacity: 0.55; + pointer-events: none; +} +.disabled .disabled, +.disabled [disabled], +[disabled] .disabled, +[disabled] [disabled] { + opacity: 1; +} diff --git a/www/libs/framework7/css/framework7.ios.rtl.css b/www/libs/framework7/css/framework7.ios.rtl.css new file mode 100644 index 0000000..12c879c --- /dev/null +++ b/www/libs/framework7/css/framework7.ios.rtl.css @@ -0,0 +1,565 @@ +/** + * Framework7 1.4.2 + * Full Featured Mobile HTML Framework For Building iOS & Android Apps + * + * iOS Theme + * + * http://www.idangero.us/framework7 + * + * Copyright 2016, Vladimir Kharlampidi + * The iDangero.us + * http://www.idangero.us/ + * + * Licensed under MIT + * + * Released on: June 26, 2016 + */ +/*============= + Framework 7 RTL Additions +=============*/ +html { + direction: rtl; +} +/* === Lists === */ +.list-block ul ul { + padding-left: 0; + padding-right: 45px; +} +.list-block .item-content { + padding-left: 0; + padding-right: 15px; +} +.list-block .item-inner { + padding-right: 0; + padding-left: 15px; +} +.list-block .item-after { + margin-left: 0; + margin-right: 5px; +} +.list-block .item-media i + i, +.list-block .item-media i + img { + margin-left: 0; + margin-right: 5px; +} +.list-block .item-media + .item-inner { + margin-left: 0; + margin-right: 15px; +} +.list-block .item-link .item-inner { + padding-right: 0; + padding-left: 35px; + background-position: 15px center; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%2060%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'm60%2061.5-38.25%2038.25-9.75-9.75%2029.25-28.5-29.25-28.5%209.75-9.75z'%20fill%3D'%23c7c7cc'%20transform%3D'translate(60%2C120)%20rotate(180)'%2F%3E%3C%2Fsvg%3E"); +} +.list-block.media-list .item-link .item-inner, +.list-block li.media-item .item-link .item-inner { + padding-right: 0; + padding-left: 15px; +} +.list-block.media-list .item-link .item-title-row, +.list-block li.media-item .item-link .item-title-row { + padding-right: 0; + padding-left: 20px; + background-position: center left; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%2060%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'm60%2061.5-38.25%2038.25-9.75-9.75%2029.25-28.5-29.25-28.5%209.75-9.75z'%20fill%3D'%23c7c7cc'%20transform%3D'translate(60%2C120)%20rotate(180)'%2F%3E%3C%2Fsvg%3E"); +} +.list-block .sortable-handler { + right: auto; + left: 0; +} +.list-block.sortable-opened .item-inner, +.list-block.sortable-opened .item-link .item-inner { + padding-right: 0; + padding-left: 35px; +} +.list-block.sortable-opened .item-link .item-inner, +.list-block.sortable-opened .item-link .item-title-row { + background-image: none; +} +.list-block .swipeout-actions-left, +.list-block .swipeout-actions-right { + direction: ltr; +} +/* === Toolbars === */ +.navbar a.link i + span, +.toolbar a.link i + span, +.navbar a.link i + i, +.toolbar a.link i + i, +.navbar a.link span + i, +.toolbar a.link span + i, +.navbar a.link span + span, +.toolbar a.link span + span { + margin-left: 0; + margin-right: 7px; +} +.navbar .left a + a, +.navbar .right a + a { + margin-left: 0; + margin-right: 15px; +} +.navbar .left { + margin-right: 0px; + margin-left: 10px; +} +.navbar .right { + margin-left: 0px; + margin-right: 10px; +} +.navbar .right:first-child { + right: auto; + left: 8px; +} +/* === Forms === */ +.list-block input[type="text"], +.list-block input[type="password"], +.list-block input[type="email"], +.list-block input[type="tel"], +.list-block input[type="url"], +.list-block input[type="date"], +.list-block input[type="datetime-local"], +.list-block input[type="number"], +.list-block select, +.list-block textarea { + padding-left: 0; + padding-right: 5px; +} +.buttons-row .button:first-child { + border-radius: 0 5px 5px 0; + border-left: none; +} +.buttons-row .button:last-child { + border-radius: 5px 0 0 5px; + border-left-width: 1px; + border-left-style: solid; +} +.buttons-row .button.button-round:first-child { + border-radius: 0 27px 27px 0; +} +.buttons-row .button.button-round:last-child { + border-radius: 27px 0 0 27px; +} +.label-switch input[type="checkbox"] + .checkbox:before { + left: auto; + right: 2px; +} +.label-switch input[type="checkbox"] + .checkbox:after { + right: 2px; + left: auto; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +.label-switch input[type="checkbox"]:checked + .checkbox:after { + left: auto; + -webkit-transform: translateX(-20px); + transform: translateX(-20px); +} +.range-slider { + padding-left: 0; + padding-right: 0; + margin-left: 0; + padding-right: 3px; + padding-left: 3px; + margin-right: -1px; +} +.range-slider input[type="range"]:after { + left: auto; + right: -5px; +} +.range-slider input[type="range"]::-webkit-slider-thumb:after { + left: auto; + right: 0; +} +.range-slider input[type="range"]::-webkit-slider-thumb:before { + right: auto; + left: 100%; +} +label.label-radio input[type="checkbox"] ~ .item-inner, +label.label-radio input[type="radio"] ~ .item-inner { + padding-left: 35px; + padding-right: 0; +} +label.label-radio input[type="checkbox"]:checked ~ .item-inner, +label.label-radio input[type="radio"]:checked ~ .item-inner { + background-position: 15px center; +} +/* === Search Bar === */ +.searchbar input[type="search"] { + background-position: right center; + background-position: -webkit-calc(100% - 8px) center; + background-position: calc(100% - 8px) center; +} +.searchbar .searchbar-clear { + right: auto; + left: 0; +} +.searchbar.searchbar-active .searchbar-cancel { + margin-left: 0; + margin-right: 8px; +} +/* === Message Bar === */ +.messagebar .link + textarea { + margin-left: 0; + margin-right: 8px; +} +.messagebar textarea + .link { + margin-left: 0; + margin-right: 8px; +} +/* === Modals === */ +.modal-button:first-child { + border-radius: 0 0 7px 0; + border-right: none; +} +.modal-button:last-child { + border-right: 1px solid #b5b5b5; + border-radius: 0 0 0 7px; +} +.modal-button:first-child:last-child { + border-radius: 0 0 7px 7px; +} +/* === Content Block === */ +.content-block-inner { + margin-left: 0; + margin-right: -15px; +} +/* === Pages === */ +.page-from-right-to-center:before, +.page-from-center-to-right:before, +.page-fake-shadow { + right: auto; + left: 100%; + background: -webkit-linear-gradient(right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0.01) 50%, rgba(0, 0, 0, 0.2) 100%); + background: linear-gradient(to left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0.01) 50%, rgba(0, 0, 0, 0.2) 100%); +} +.page-on-left { + -webkit-transform: translate3d(20%, 0, 0); + transform: translate3d(20%, 0, 0); +} +.page-on-right { + -webkit-transform: translate3d(-100%, 0, 0); + transform: translate3d(-100%, 0, 0); +} +@-webkit-keyframes pageFromRightToCenter { + from { + -webkit-transform: translate3d(-100%, 0, 0); + } + to { + -webkit-transform: translate3d(0, 0, 0); + } +} +@-webkit-keyframes pageFromCenterToRight { + from { + -webkit-transform: translate3d(0, 0, 0); + } + to { + -webkit-transform: translate3d(-100%, 0, 0); + } +} +@keyframes pageFromRightToCenter { + from { + transform: translate3d(-100%, 0, 0); + } + to { + transform: translate3d(0, 0, 0); + } +} +@keyframes pageFromCenterToRight { + from { + transform: translate3d(0, 0, 0); + } + to { + transform: translate3d(-100%, 0, 0); + } +} +@-webkit-keyframes pageFromCenterToLeft { + from { + opacity: 1; + -webkit-transform: translate3d(0, 0, 0); + } + to { + opacity: 0.9; + -webkit-transform: translate3d(20%, 0, 0); + } +} +@-webkit-keyframes pageFromLeftToCenter { + from { + opacity: 0.9; + -webkit-transform: translate3d(20%, 0, 0); + } + to { + opacity: 1; + -webkit-transform: translate3d(0, 0, 0); + } +} +@keyframes pageFromCenterToLeft { + from { + opacity: 1; + transform: translate3d(0, 0, 0); + } + to { + opacity: 0.9; + transform: translate3d(20%, 0, 0); + } +} +@keyframes pageFromLeftToCenter { + from { + opacity: 0.9; + transform: translate3d(20%, 0, 0); + } + to { + opacity: 1; + transform: translate3d(0, 0, 0); + } +} +/* === Messages === */ +.message-received { + -ms-flex-item-align: end; + -webkit-align-self: flex-end; + align-self: flex-end; + -webkit-box-align: end; + -ms-flex-align: end; + -webkit-align-items: flex-end; + align-items: flex-end; +} +.message-sent { + -ms-flex-item-align: start; + -webkit-align-self: flex-start; + align-self: flex-start; + -webkit-box-align: start; + -ms-flex-align: start; + -webkit-align-items: flex-start; + align-items: flex-start; +} +/* === Back Icons === */ +i.icon.icon-back { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M2%2C20l-2-2l8-8L0%2C2l2-2l10%2C10L2%2C20z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-forward { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M10%2C0l2%2C2l-8%2C8l8%2C8l-2%2C2L0%2C10L10%2C0z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%23007aff'%20d%3D'M14%2C1.6v11.8L2.2%2C7.6L14%2C1.6%20M15%2C0L0%2C7.6L15%2C15V0L15%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon.icon-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%23007aff'%20d%3D'M1%2C1.6l11.8%2C5.8L1%2C13.4V1.6%20M0%2C0v15l15-7.6L0%2C0L0%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-gray, +i.icon-back.theme-gray, +.theme-gray i.icon-back { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M2%2C20l-2-2l8-8L0%2C2l2-2l10%2C10L2%2C20z'%20fill%3D'%238e8e93'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-gray, +i.icon-forward.theme-gray, +.theme-gray i.icon-forward { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M10%2C0l2%2C2l-8%2C8l8%2C8l-2%2C2L0%2C10L10%2C0z'%20fill%3D'%238e8e93'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-next.color-gray, +i.icon-next.theme-gray, +.theme-gray i.icon-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%238e8e93'%20d%3D'M14%2C1.6v11.8L2.2%2C7.6L14%2C1.6%20M15%2C0L0%2C7.6L15%2C15V0L15%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-gray, +i.icon-prev.theme-gray, +.theme-gray i.icon-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%238e8e93'%20d%3D'M1%2C1.6l11.8%2C5.8L1%2C13.4V1.6%20M0%2C0v15l15-7.6L0%2C0L0%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-white, +i.icon-back.theme-white, +.theme-white i.icon-back { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M2%2C20l-2-2l8-8L0%2C2l2-2l10%2C10L2%2C20z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-white, +i.icon-forward.theme-white, +.theme-white i.icon-forward { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M10%2C0l2%2C2l-8%2C8l8%2C8l-2%2C2L0%2C10L10%2C0z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-next.color-white, +i.icon-next.theme-white, +.theme-white i.icon-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%23ffffff'%20d%3D'M14%2C1.6v11.8L2.2%2C7.6L14%2C1.6%20M15%2C0L0%2C7.6L15%2C15V0L15%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-white, +i.icon-prev.theme-white, +.theme-white i.icon-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%23ffffff'%20d%3D'M1%2C1.6l11.8%2C5.8L1%2C13.4V1.6%20M0%2C0v15l15-7.6L0%2C0L0%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-black, +i.icon-back.theme-black, +.theme-black i.icon-back { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M2%2C20l-2-2l8-8L0%2C2l2-2l10%2C10L2%2C20z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-black, +i.icon-forward.theme-black, +.theme-black i.icon-forward { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M10%2C0l2%2C2l-8%2C8l8%2C8l-2%2C2L0%2C10L10%2C0z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-next.color-black, +i.icon-next.theme-black, +.theme-black i.icon-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%23000000'%20d%3D'M14%2C1.6v11.8L2.2%2C7.6L14%2C1.6%20M15%2C0L0%2C7.6L15%2C15V0L15%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-black, +i.icon-prev.theme-black, +.theme-black i.icon-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%23000000'%20d%3D'M1%2C1.6l11.8%2C5.8L1%2C13.4V1.6%20M0%2C0v15l15-7.6L0%2C0L0%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-lightblue, +i.icon-back.theme-lightblue, +.theme-lightblue i.icon-back { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M2%2C20l-2-2l8-8L0%2C2l2-2l10%2C10L2%2C20z'%20fill%3D'%235ac8fa'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-lightblue, +i.icon-forward.theme-lightblue, +.theme-lightblue i.icon-forward { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M10%2C0l2%2C2l-8%2C8l8%2C8l-2%2C2L0%2C10L10%2C0z'%20fill%3D'%235ac8fa'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-next.color-lightblue, +i.icon-next.theme-lightblue, +.theme-lightblue i.icon-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%235ac8fa'%20d%3D'M14%2C1.6v11.8L2.2%2C7.6L14%2C1.6%20M15%2C0L0%2C7.6L15%2C15V0L15%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-lightblue, +i.icon-prev.theme-lightblue, +.theme-lightblue i.icon-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%235ac8fa'%20d%3D'M1%2C1.6l11.8%2C5.8L1%2C13.4V1.6%20M0%2C0v15l15-7.6L0%2C0L0%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-yellow, +i.icon-back.theme-yellow, +.theme-yellow i.icon-back { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M2%2C20l-2-2l8-8L0%2C2l2-2l10%2C10L2%2C20z'%20fill%3D'%23ffcc00'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-yellow, +i.icon-forward.theme-yellow, +.theme-yellow i.icon-forward { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M10%2C0l2%2C2l-8%2C8l8%2C8l-2%2C2L0%2C10L10%2C0z'%20fill%3D'%23ffcc00'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-next.color-yellow, +i.icon-next.theme-yellow, +.theme-yellow i.icon-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%23ffcc00'%20d%3D'M14%2C1.6v11.8L2.2%2C7.6L14%2C1.6%20M15%2C0L0%2C7.6L15%2C15V0L15%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-yellow, +i.icon-prev.theme-yellow, +.theme-yellow i.icon-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%23ffcc00'%20d%3D'M1%2C1.6l11.8%2C5.8L1%2C13.4V1.6%20M0%2C0v15l15-7.6L0%2C0L0%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-orange, +i.icon-back.theme-orange, +.theme-orange i.icon-back { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M2%2C20l-2-2l8-8L0%2C2l2-2l10%2C10L2%2C20z'%20fill%3D'%23ff9500'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-orange, +i.icon-forward.theme-orange, +.theme-orange i.icon-forward { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M10%2C0l2%2C2l-8%2C8l8%2C8l-2%2C2L0%2C10L10%2C0z'%20fill%3D'%23ff9500'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-next.color-orange, +i.icon-next.theme-orange, +.theme-orange i.icon-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%23ff9500'%20d%3D'M14%2C1.6v11.8L2.2%2C7.6L14%2C1.6%20M15%2C0L0%2C7.6L15%2C15V0L15%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-orange, +i.icon-prev.theme-orange, +.theme-orange i.icon-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%23ff9500'%20d%3D'M1%2C1.6l11.8%2C5.8L1%2C13.4V1.6%20M0%2C0v15l15-7.6L0%2C0L0%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-pink, +i.icon-back.theme-pink, +.theme-pink i.icon-back { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M2%2C20l-2-2l8-8L0%2C2l2-2l10%2C10L2%2C20z'%20fill%3D'%23ff2d55'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-pink, +i.icon-forward.theme-pink, +.theme-pink i.icon-forward { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M10%2C0l2%2C2l-8%2C8l8%2C8l-2%2C2L0%2C10L10%2C0z'%20fill%3D'%23ff2d55'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-next.color-pink, +i.icon-next.theme-pink, +.theme-pink i.icon-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%23ff2d55'%20d%3D'M14%2C1.6v11.8L2.2%2C7.6L14%2C1.6%20M15%2C0L0%2C7.6L15%2C15V0L15%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-pink, +i.icon-prev.theme-pink, +.theme-pink i.icon-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%23ff2d55'%20d%3D'M1%2C1.6l11.8%2C5.8L1%2C13.4V1.6%20M0%2C0v15l15-7.6L0%2C0L0%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-blue, +i.icon-back.theme-blue, +.theme-blue i.icon-back { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M2%2C20l-2-2l8-8L0%2C2l2-2l10%2C10L2%2C20z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-blue, +i.icon-forward.theme-blue, +.theme-blue i.icon-forward { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M10%2C0l2%2C2l-8%2C8l8%2C8l-2%2C2L0%2C10L10%2C0z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-next.color-blue, +i.icon-next.theme-blue, +.theme-blue i.icon-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%23007aff'%20d%3D'M14%2C1.6v11.8L2.2%2C7.6L14%2C1.6%20M15%2C0L0%2C7.6L15%2C15V0L15%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-blue, +i.icon-prev.theme-blue, +.theme-blue i.icon-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%23007aff'%20d%3D'M1%2C1.6l11.8%2C5.8L1%2C13.4V1.6%20M0%2C0v15l15-7.6L0%2C0L0%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-green, +i.icon-back.theme-green, +.theme-green i.icon-back { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M2%2C20l-2-2l8-8L0%2C2l2-2l10%2C10L2%2C20z'%20fill%3D'%234cd964'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-green, +i.icon-forward.theme-green, +.theme-green i.icon-forward { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M10%2C0l2%2C2l-8%2C8l8%2C8l-2%2C2L0%2C10L10%2C0z'%20fill%3D'%234cd964'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-next.color-green, +i.icon-next.theme-green, +.theme-green i.icon-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%234cd964'%20d%3D'M14%2C1.6v11.8L2.2%2C7.6L14%2C1.6%20M15%2C0L0%2C7.6L15%2C15V0L15%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-green, +i.icon-prev.theme-green, +.theme-green i.icon-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%234cd964'%20d%3D'M1%2C1.6l11.8%2C5.8L1%2C13.4V1.6%20M0%2C0v15l15-7.6L0%2C0L0%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-red, +i.icon-back.theme-red, +.theme-red i.icon-back { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M2%2C20l-2-2l8-8L0%2C2l2-2l10%2C10L2%2C20z'%20fill%3D'%23ff3b30'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-red, +i.icon-forward.theme-red, +.theme-red i.icon-forward { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M10%2C0l2%2C2l-8%2C8l8%2C8l-2%2C2L0%2C10L10%2C0z'%20fill%3D'%23ff3b30'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-next.color-red, +i.icon-next.theme-red, +.theme-red i.icon-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%23ff3b30'%20d%3D'M14%2C1.6v11.8L2.2%2C7.6L14%2C1.6%20M15%2C0L0%2C7.6L15%2C15V0L15%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-red, +i.icon-prev.theme-red, +.theme-red i.icon-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%23ff3b30'%20d%3D'M1%2C1.6l11.8%2C5.8L1%2C13.4V1.6%20M0%2C0v15l15-7.6L0%2C0L0%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +/* === Accordion === */ +.list-block .accordion-toggle .item-inner { + padding-right: 0; + padding-left: 35px; + background-position: 15px center; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%2060%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'm60%2061.5-38.25%2038.25-9.75-9.75%2029.25-28.5-29.25-28.5%209.75-9.75z'%20fill%3D'%23c7c7cc'%20transform%3D'translate(60%2C120)%20rotate(180)'%2F%3E%3C%2Fsvg%3E"); +} +.list-block:not(.media-list) .accordion-item-expanded:not(.media-item) .accordion-item-toggle .item-inner, +.list-block:not(.media-list) .accordion-item-expanded:not(.media-item) > .item-link .item-inner, +.list-block.media-list .accordion-item-expanded .accordion-item-toggle .item-title-row, +.list-block.media-list .accordion-item-expanded > .item-link .item-title-row, +.list-block .accordion-item-expanded.media-item .accordion-item-toggle .item-title-row, +.list-block .accordion-item-expanded.media-item > .item-link .item-title-row { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%2060%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'm60%2061.5-38.25%2038.25-9.75-9.75%2029.25-28.5-29.25-28.5%209.75-9.75z'%20transform%3D'translate(70%2C%2030)%20rotate(90)'%20fill%3D'%23c7c7cc'%2F%3E%3C%2Fsvg%3E"); + background-size: 20px 20px; +} +.list-block .accordion-item ul { + padding-right: 0; +} diff --git a/www/libs/framework7/css/framework7.material.colors.css b/www/libs/framework7/css/framework7.material.colors.css new file mode 100644 index 0000000..8c55e3e --- /dev/null +++ b/www/libs/framework7/css/framework7.material.colors.css @@ -0,0 +1,7400 @@ +/** + * Framework7 1.4.2 + * Full Featured Mobile HTML Framework For Building iOS & Android Apps + * + * Google Material Theme + * + * http://www.idangero.us/framework7 + * + * Copyright 2016, Vladimir Kharlampidi + * The iDangero.us + * http://www.idangero.us/ + * + * Licensed under MIT + * + * Released on: June 26, 2016 + */ +/*========================== +Framework7 Layouts Themes +==========================*/ +/* === Dark layout === */ +.layout-dark .page, +.layout-dark .login-screen-content, +.page.layout-dark, +.layout-dark .panel, +.panel.layout-dark { + background-color: #222; + color: rgba(255, 255, 255, 0.87); +} +.layout-dark .content-block-title { + color: rgba(255, 255, 255, 0.87); +} +.layout-dark .content-block-inner:before { + background-color: #393939; +} +.layout-dark .content-block-inner:after { + background-color: #393939; +} +.layout-dark .popover .list-block ul { + background: none; +} +.layout-dark .card { + background: #1c1c1c; +} +.layout-dark .card-header:after { + background-color: #393939; +} +.layout-dark .card-footer { + color: #bbb; +} +.layout-dark .card-footer:before { + background-color: #393939; +} +.layout-dark .list-block ul:before, +.list-block.layout-dark ul:before { + background-color: #393939; +} +.layout-dark .list-block ul:after, +.list-block.layout-dark ul:after { + background-color: #393939; +} +.layout-dark .list-block.inset ul, +.list-block.layout-dark.inset ul { + background: #1c1c1c; +} +.layout-dark .list-block.notifications > ul, +.list-block.layout-dark.notifications > ul { + background: none; +} +.layout-dark li.sorting { + background-color: rgba(34, 34, 34, 0.8); +} +.layout-dark .swipeout-actions-left a, +.layout-dark .swipeout-actions-right a { + background-color: #444; +} +.layout-dark .item-inner:after, +.layout-dark .list-block ul ul li:last-child .item-inner:after { + background-color: #393939; +} +.layout-dark .item-after, +.layout-dark .item-text { + color: rgba(255, 255, 255, 0.7); +} +.layout-dark .list-block-label { + color: #bbb; +} +.layout-dark .item-divider, +.layout-dark .list-group-title { + background: #1a1a1a; + color: #bbb; +} +.layout-dark .item-divider:before, +.layout-dark .list-group-title:before { + background-color: #393939; +} +.layout-dark .contacts-block .list-group-title { + background: none; +} +.layout-dark .autocomplete-dropdown { + background: #1c1c1c; +} +.layout-dark .autocomplete-dropdown .list-block { + color: rgba(255, 255, 255, 0.54); +} +.layout-dark .autocomplete-dropdown .list-block b { + color: rgba(255, 255, 255, 0.87); +} +html:not(.watch-active-state) .layout-dark .item-link:active, +html:not(.watch-active-state) .layout-dark label.label-checkbox:active, +html:not(.watch-active-state) .layout-dark label.label-radio:active, +.layout-dark .item-link.active-state, +.layout-dark label.label-checkbox.active-state, +.layout-dark label.label-radio.active-state { + background-color: rgba(255, 255, 255, 0.05); +} +.layout-dark .list-block input[type="text"], +.layout-dark .list-block input[type="password"], +.layout-dark .list-block input[type="search"], +.layout-dark .list-block input[type="email"], +.layout-dark .list-block input[type="tel"], +.layout-dark .list-block input[type="url"], +.layout-dark .list-block input[type="date"], +.layout-dark .list-block input[type="datetime-local"], +.layout-dark .list-block input[type="time"], +.layout-dark .list-block input[type="number"], +.layout-dark .list-block select, +.layout-dark .list-block textarea { + color: #fff; +} +.layout-dark .list-block input[type="text"]::-webkit-input-placeholder, +.layout-dark .list-block input[type="password"]::-webkit-input-placeholder, +.layout-dark .list-block input[type="search"]::-webkit-input-placeholder, +.layout-dark .list-block input[type="email"]::-webkit-input-placeholder, +.layout-dark .list-block input[type="tel"]::-webkit-input-placeholder, +.layout-dark .list-block input[type="url"]::-webkit-input-placeholder, +.layout-dark .list-block input[type="date"]::-webkit-input-placeholder, +.layout-dark .list-block input[type="datetime-local"]::-webkit-input-placeholder, +.layout-dark .list-block input[type="time"]::-webkit-input-placeholder, +.layout-dark .list-block input[type="number"]::-webkit-input-placeholder, +.layout-dark .list-block select::-webkit-input-placeholder, +.layout-dark .list-block textarea::-webkit-input-placeholder { + color: rgba(255, 255, 255, 0.35); +} +.layout-dark .label-switch .checkbox { + background: rgba(255, 255, 255, 0.3); +} +.layout-dark .item-inner:not(.focus-state) .label, +.layout-dark .item-inner:not(.focus-state) .floating-label { + color: rgba(255, 255, 255, 0.7); +} +.layout-dark .item-inner:not(.focus-state):not(.not-empty-state) .item-input-field:after, +.layout-dark .item-inner:not(.focus-state):not(.not-empty-state) .input-field:after { + background-color: rgba(255, 255, 255, 0.12); +} +.layout-dark label.label-checkbox i.icon-form-checkbox { + border-color: rgba(255, 255, 255, 0.7); +} +.layout-dark label.label-radio i.icon-form-radio { + border-color: rgba(255, 255, 255, 0.7); +} +.layout-dark .item-link.list-button:after { + background-color: #393939; +} +.layout-dark .page-content .ripple-wave { + background: rgba(255, 255, 255, 0.3); +} +html:not(.watch-active-state) .layout-dark .button:not(.button-fill):active, +.layout-dark .button:not(.button-fill).active-state { + background: rgba(255, 255, 255, 0.1); +} +.layout-dark .chip { + background: rgba(255, 255, 255, 0.87); +} +/*========================== +Framework7 Color Themes +==========================*/ +.color-red { + color: #f44336; +} +.list-block .item-link.list-button.color-red, +.list-block .item-link.color-red, +.tabbar a.active.color-red, +a.color-red { + color: #f44336; +} +.label-switch input[type="checkbox"]:checked + .checkbox.color-red, +.label-switch.color-red input[type="checkbox"]:checked + .checkbox { + background-color: #f44336; +} +.theme-red .button:not(.button-fill) { + color: #f44336; +} +.theme-red .navbar .button:not(.button-fill), +.theme-red.navbar .button:not(.button-fill), +.theme-red .toolbar .button:not(.button-fill), +.theme-red.toolbar .button:not(.button-fill), +.theme-red .subnavbar .button:not(.button-fill), +.theme-red.subnavbar .button:not(.button-fill) { + color: #fff; +} +.button.color-red:not(.button-fill), +.color-red.buttons-row .button:not(.button-fill) { + color: #f44336 !important; +} +.theme-red .button.button-fill { + background: #f44336; + color: #fff; +} +html:not(.watch-active-state) .theme-red .button.button-fill:active, +.theme-red .button.button-fill.active-state { + background: #D32F2F; +} +.button.button-fill.bg-red, +.button.button-fill.color-red { + background: #f44336 !important; + color: #fff; +} +html:not(.watch-active-state) .button.button-fill.bg-red:active, +html:not(.watch-active-state) .button.button-fill.color-red:active, +.button.button-fill.bg-red.active-state, +.button.button-fill.color-red.active-state { + background: #D32F2F !important; +} +.progressbar.color-red, +.progressbar.theme-red, +.theme-red .progressbar, +.progressbar.bg-red { + background-color: rgba(244, 67, 54, 0.5); +} +.progressbar.color-red span, +.progressbar.theme-red span, +.theme-red .progressbar span, +.progressbar.bg-red span { + background-color: #f44336; +} +.progressbar-infinite.color-red, +.progressbar-infinite.theme-red, +.theme-red .progressbar-infinite, +.progressbar-infinite.bg-red { + background-color: rgba(244, 67, 54, 0.5); +} +.progressbar-infinite.color-red:after, +.progressbar-infinite.theme-red:after, +.theme-red .progressbar-infinite:after, +.progressbar-infinite.bg-red:after, +.progressbar-infinite.color-red:before, +.progressbar-infinite.theme-red:before, +.theme-red .progressbar-infinite:before, +.progressbar-infinite.bg-red:before { + background-color: #f44336; +} +.color-red i.icon, +i.icon.color-red { + color: #f44336; +} +i.icon-next.color-red, +i.icon-next.theme-red { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23f44336'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-red, +i.icon-prev.theme-red { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23f44336'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-red, +i.icon-back.theme-red { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23f44336'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-red, +i.icon-forward.theme-red { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23f44336'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-bars.color-red, +i.icon-bars.theme-red { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M3%2018h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z'%20fill%3D'%23f44336'%2F%3E%3C%2Fsvg%3E"); +} +.preloader.color-red svg circle, +.preloader.preloader-red svg circle { + stroke: #f44336; +} +.preloader.color-red .preloader-inner-gap, +.preloader.preloader-red .preloader-inner-gap, +.preloader.color-red .preloader-inner-half-circle, +.preloader.preloader-red .preloader-inner-half-circle { + border-color: #f44336; +} +.theme-red a { + color: #f44336; +} +.theme-red .navbar, +.navbar.theme-red, +.theme-red .toolbar, +.toolbar.theme-red, +.theme-red .subnavbar, +.subnavbar.theme-red, +.theme-red .searchbar, +.searchbar.theme-red { + background-color: #f44336; +} +.theme-red .range-slider input[type="range"]::-webkit-slider-thumb:before, +.range-slider.theme-red input[type="range"]::-webkit-slider-thumb:before { + background-color: #f44336; +} +.theme-red .range-slider input[type="range"]::-webkit-slider-thumb, +.range-slider.theme-red input[type="range"]::-webkit-slider-thumb { + background-color: #f44336; +} +.theme-red .range-slider input[type="range"]::-ms-thumb, +.range-slider.theme-red input[type="range"]::-ms-thumb { + background-color: #f44336; +} +.theme-red .range-slider input[type="range"]::-ms-fill-lower, +.range-slider.theme-red input[type="range"]::-ms-fill-lower { + background-color: #f44336; +} +.theme-red .range-slider input[type="range"]::-moz-range-thumb, +.range-slider.theme-red input[type="range"]::-moz-range-thumb { + background-color: #f44336; +} +.theme-red .label-switch input[type="checkbox"]:checked + .checkbox, +.label-switch.theme-red input[type="checkbox"]:checked + .checkbox { + background-color: rgba(244, 67, 54, 0.5); +} +.theme-red .label-switch input[type="checkbox"]:checked + .checkbox:after, +.label-switch.theme-red input[type="checkbox"]:checked + .checkbox:after { + background-color: #f44336; +} +.theme-red label.label-checkbox, +label.label-checkbox.theme-red { + cursor: pointer; +} +.theme-red label.label-checkbox i.icon-form-checkbox:after, +label.label-checkbox.theme-red i.icon-form-checkbox:after { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M9%2016.17L4.83%2012l-1.42%201.41L9%2019%2021%207l-1.41-1.41z'%2F%3E%3C%2Fsvg%3E"); +} +.theme-red label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-red input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +.theme-red label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-red input[type="radio"]:checked + .item-media i.icon-form-checkbox, +.theme-red label.label-checkbox input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-red input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +.theme-red label.label-checkbox input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-red input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +.theme-red label.label-checkbox input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-red input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +.theme-red label.label-checkbox input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-red input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox { + border-color: #f44336; + background-color: #f44336; +} +.theme-red label.label-radio i.icon-form-radio:after, +label.label-radio.theme-red i.icon-form-radio:after { + background-color: #f44336; +} +.theme-red label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-red input[type="checkbox"]:checked + .item-media i.icon-form-radio, +.theme-red label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-red input[type="radio"]:checked + .item-media i.icon-form-radio, +.theme-red label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-red input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +.theme-red label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-red input[type="radio"]:checked ~ .item-after i.icon-form-radio, +.theme-red label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-red input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +.theme-red label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-red input[type="radio"]:checked ~ .item-inner i.icon-form-radio { + border-color: #f44336; +} +.theme-red label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-red input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +.theme-red label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-red input[type="radio"]:checked + .item-media i.icon-form-radio:after, +.theme-red label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-red input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +.theme-red label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-red input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +.theme-red label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-red input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +.theme-red label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-red input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after { + background-color: #f44336; +} +.theme-red .focus-state .label, +.theme-red .focus-state .floating-label { + color: #f44336; +} +.theme-red .item-input-field.focus-state:after, +.theme-red .input-field.focus-state:after, +.theme-red .item-input-field.not-empty-state:after, +.theme-red .input-field.not-empty-state:after { + background: #f44336; +} +.theme-red .picker-calendar-day.picker-calendar-day-today span { + color: #f44336; +} +.theme-red .picker-calendar-day.picker-calendar-day-selected span { + background-color: #f44336; + color: #fff; +} +.theme-red .picker-calendar-day.picker-calendar-day-has-events span:after { + background-color: #f44336; +} +.theme-red .picker-header { + background-color: #f44336; +} +.theme-red .modal-button { + color: #f44336; +} +.swiper-pagination.color-red .swiper-pagination-bullet-active, +.theme-red .swiper-pagination .swiper-pagination-bullet-active { + background-color: #f44336; +} +.swiper-pagination.color-red .swiper-pagination-progressbar, +.theme-red .swiper-pagination .swiper-pagination-progressbar { + background-color: #f44336; +} +.swiper-pagination.swiper-pagination-progress.bg-red { + background-color: rgba(244, 67, 54, 0.25); +} +.swiper-button-next.color-red, +.swiper-container-rtl .swiper-button-prev.color-red, +.theme-red .swiper-button-next, +.theme-red .swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23f44336'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-prev.color-red, +.swiper-container-rtl .swiper-button-next.color-red, +.theme-red .swiper-button-prev, +.theme-red .swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23f44336'%2F%3E%3C%2Fsvg%3E"); +} +.bg-red, +a.bg-red, +.list-block .swipeout-actions-left a.bg-red, +.list-block .swipeout-actions-right a.bg-red { + background-color: #f44336; +} +html:not(.watch-active-state) .list-block .bg-red .item-link:active, +html:not(.watch-active-state) .list-block a.bg-red .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-left a.bg-red .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-right a.bg-red .item-link:active, +html:not(.watch-active-state) .list-block.bg-red .item-link:active, +html:not(.watch-active-state) .list-blocka.bg-red .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-left a.bg-red .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-right a.bg-red .item-link:active, +html:not(.watch-active-state) .list-block .item-link.bg-red:active, +html:not(.watch-active-state) .list-block .item-linka.bg-red:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-left a.bg-red:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-right a.bg-red:active, +.list-block .bg-red .item-link.active-state, +.list-block a.bg-red .item-link.active-state, +.list-block .list-block .swipeout-actions-left a.bg-red .item-link.active-state, +.list-block .list-block .swipeout-actions-right a.bg-red .item-link.active-state, +.list-block.bg-red .item-link.active-state, +.list-blocka.bg-red .item-link.active-state, +.list-block.list-block .swipeout-actions-left a.bg-red .item-link.active-state, +.list-block.list-block .swipeout-actions-right a.bg-red .item-link.active-state, +.list-block .item-link.bg-red.active-state, +.list-block .item-linka.bg-red.active-state, +.list-block .item-link.list-block .swipeout-actions-left a.bg-red.active-state, +.list-block .item-link.list-block .swipeout-actions-right a.bg-red.active-state { + background: #D32F2F; +} +.border-red { + border-color: #f44336; +} +.list-block .border-red.item-inner:after, +.list-block ul.border-red:after, +.border-red:after, +.list-block .border-red.item-inner:before, +.list-block ul.border-red:before, +.border-red:before { + background-color: #f44336; +} +.theme-red .floating-button, +.theme-red .speed-dial-buttons a, +.floating-button.theme-red, +.speed-dial-buttons a.theme-red, +.floating-button.color-red, +.speed-dial-buttons a.color-red, +.floating-button.bg-red, +.speed-dial-buttons a.bg-red { + color: #fff; + background: #f44336; +} +html:not(.watch-active-state) .theme-red .floating-button:active, +html:not(.watch-active-state) .theme-red .speed-dial-buttons a:active, +html:not(.watch-active-state) .floating-button.theme-red:active, +html:not(.watch-active-state) .speed-dial-buttons a.theme-red:active, +html:not(.watch-active-state) .floating-button.color-red:active, +html:not(.watch-active-state) .speed-dial-buttons a.color-red:active, +html:not(.watch-active-state) .floating-button.bg-red:active, +html:not(.watch-active-state) .speed-dial-buttons a.bg-red:active, +.theme-red .floating-button.active-state, +.theme-red .speed-dial-buttons a.active-state, +.floating-button.theme-red.active-state, +.speed-dial-buttons a.theme-red.active-state, +.floating-button.color-red.active-state, +.speed-dial-buttons a.color-red.active-state, +.floating-button.bg-red.active-state, +.speed-dial-buttons a.bg-red.active-state { + background: #D32F2F; +} +.theme-red .floating-button i, +.theme-red .speed-dial-buttons a i, +.floating-button.theme-red i, +.speed-dial-buttons a.theme-red i, +.floating-button.color-red i, +.speed-dial-buttons a.color-red i, +.floating-button.bg-red i, +.speed-dial-buttons a.bg-red i { + color: inherit; +} +.ripple-red .ripple-wave { + background-color: rgba(244, 67, 54, 0.3); +} +.badge.color-red, +.badge.theme-red { + background-color: #f44336; + color: #fff; +} +.color-pink { + color: #e91e63; +} +.list-block .item-link.list-button.color-pink, +.list-block .item-link.color-pink, +.tabbar a.active.color-pink, +a.color-pink { + color: #e91e63; +} +.label-switch input[type="checkbox"]:checked + .checkbox.color-pink, +.label-switch.color-pink input[type="checkbox"]:checked + .checkbox { + background-color: #e91e63; +} +.theme-pink .button:not(.button-fill) { + color: #e91e63; +} +.theme-pink .navbar .button:not(.button-fill), +.theme-pink.navbar .button:not(.button-fill), +.theme-pink .toolbar .button:not(.button-fill), +.theme-pink.toolbar .button:not(.button-fill), +.theme-pink .subnavbar .button:not(.button-fill), +.theme-pink.subnavbar .button:not(.button-fill) { + color: #fff; +} +.button.color-pink:not(.button-fill), +.color-pink.buttons-row .button:not(.button-fill) { + color: #e91e63 !important; +} +.theme-pink .button.button-fill { + background: #e91e63; + color: #fff; +} +html:not(.watch-active-state) .theme-pink .button.button-fill:active, +.theme-pink .button.button-fill.active-state { + background: #C2185B; +} +.button.button-fill.bg-pink, +.button.button-fill.color-pink { + background: #e91e63 !important; + color: #fff; +} +html:not(.watch-active-state) .button.button-fill.bg-pink:active, +html:not(.watch-active-state) .button.button-fill.color-pink:active, +.button.button-fill.bg-pink.active-state, +.button.button-fill.color-pink.active-state { + background: #C2185B !important; +} +.progressbar.color-pink, +.progressbar.theme-pink, +.theme-pink .progressbar, +.progressbar.bg-pink { + background-color: rgba(233, 30, 99, 0.5); +} +.progressbar.color-pink span, +.progressbar.theme-pink span, +.theme-pink .progressbar span, +.progressbar.bg-pink span { + background-color: #e91e63; +} +.progressbar-infinite.color-pink, +.progressbar-infinite.theme-pink, +.theme-pink .progressbar-infinite, +.progressbar-infinite.bg-pink { + background-color: rgba(233, 30, 99, 0.5); +} +.progressbar-infinite.color-pink:after, +.progressbar-infinite.theme-pink:after, +.theme-pink .progressbar-infinite:after, +.progressbar-infinite.bg-pink:after, +.progressbar-infinite.color-pink:before, +.progressbar-infinite.theme-pink:before, +.theme-pink .progressbar-infinite:before, +.progressbar-infinite.bg-pink:before { + background-color: #e91e63; +} +.color-pink i.icon, +i.icon.color-pink { + color: #e91e63; +} +i.icon-next.color-pink, +i.icon-next.theme-pink { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23e91e63'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-pink, +i.icon-prev.theme-pink { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23e91e63'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-pink, +i.icon-back.theme-pink { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23e91e63'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-pink, +i.icon-forward.theme-pink { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23e91e63'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-bars.color-pink, +i.icon-bars.theme-pink { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M3%2018h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z'%20fill%3D'%23e91e63'%2F%3E%3C%2Fsvg%3E"); +} +.preloader.color-pink svg circle, +.preloader.preloader-pink svg circle { + stroke: #e91e63; +} +.preloader.color-pink .preloader-inner-gap, +.preloader.preloader-pink .preloader-inner-gap, +.preloader.color-pink .preloader-inner-half-circle, +.preloader.preloader-pink .preloader-inner-half-circle { + border-color: #e91e63; +} +.theme-pink a { + color: #e91e63; +} +.theme-pink .navbar, +.navbar.theme-pink, +.theme-pink .toolbar, +.toolbar.theme-pink, +.theme-pink .subnavbar, +.subnavbar.theme-pink, +.theme-pink .searchbar, +.searchbar.theme-pink { + background-color: #e91e63; +} +.theme-pink .range-slider input[type="range"]::-webkit-slider-thumb:before, +.range-slider.theme-pink input[type="range"]::-webkit-slider-thumb:before { + background-color: #e91e63; +} +.theme-pink .range-slider input[type="range"]::-webkit-slider-thumb, +.range-slider.theme-pink input[type="range"]::-webkit-slider-thumb { + background-color: #e91e63; +} +.theme-pink .range-slider input[type="range"]::-ms-thumb, +.range-slider.theme-pink input[type="range"]::-ms-thumb { + background-color: #e91e63; +} +.theme-pink .range-slider input[type="range"]::-ms-fill-lower, +.range-slider.theme-pink input[type="range"]::-ms-fill-lower { + background-color: #e91e63; +} +.theme-pink .range-slider input[type="range"]::-moz-range-thumb, +.range-slider.theme-pink input[type="range"]::-moz-range-thumb { + background-color: #e91e63; +} +.theme-pink .label-switch input[type="checkbox"]:checked + .checkbox, +.label-switch.theme-pink input[type="checkbox"]:checked + .checkbox { + background-color: rgba(233, 30, 99, 0.5); +} +.theme-pink .label-switch input[type="checkbox"]:checked + .checkbox:after, +.label-switch.theme-pink input[type="checkbox"]:checked + .checkbox:after { + background-color: #e91e63; +} +.theme-pink label.label-checkbox, +label.label-checkbox.theme-pink { + cursor: pointer; +} +.theme-pink label.label-checkbox i.icon-form-checkbox:after, +label.label-checkbox.theme-pink i.icon-form-checkbox:after { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M9%2016.17L4.83%2012l-1.42%201.41L9%2019%2021%207l-1.41-1.41z'%2F%3E%3C%2Fsvg%3E"); +} +.theme-pink label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-pink input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +.theme-pink label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-pink input[type="radio"]:checked + .item-media i.icon-form-checkbox, +.theme-pink label.label-checkbox input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-pink input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +.theme-pink label.label-checkbox input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-pink input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +.theme-pink label.label-checkbox input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-pink input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +.theme-pink label.label-checkbox input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-pink input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox { + border-color: #e91e63; + background-color: #e91e63; +} +.theme-pink label.label-radio i.icon-form-radio:after, +label.label-radio.theme-pink i.icon-form-radio:after { + background-color: #e91e63; +} +.theme-pink label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-pink input[type="checkbox"]:checked + .item-media i.icon-form-radio, +.theme-pink label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-pink input[type="radio"]:checked + .item-media i.icon-form-radio, +.theme-pink label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-pink input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +.theme-pink label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-pink input[type="radio"]:checked ~ .item-after i.icon-form-radio, +.theme-pink label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-pink input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +.theme-pink label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-pink input[type="radio"]:checked ~ .item-inner i.icon-form-radio { + border-color: #e91e63; +} +.theme-pink label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-pink input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +.theme-pink label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-pink input[type="radio"]:checked + .item-media i.icon-form-radio:after, +.theme-pink label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-pink input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +.theme-pink label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-pink input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +.theme-pink label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-pink input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +.theme-pink label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-pink input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after { + background-color: #e91e63; +} +.theme-pink .focus-state .label, +.theme-pink .focus-state .floating-label { + color: #e91e63; +} +.theme-pink .item-input-field.focus-state:after, +.theme-pink .input-field.focus-state:after, +.theme-pink .item-input-field.not-empty-state:after, +.theme-pink .input-field.not-empty-state:after { + background: #e91e63; +} +.theme-pink .picker-calendar-day.picker-calendar-day-today span { + color: #e91e63; +} +.theme-pink .picker-calendar-day.picker-calendar-day-selected span { + background-color: #e91e63; + color: #fff; +} +.theme-pink .picker-calendar-day.picker-calendar-day-has-events span:after { + background-color: #e91e63; +} +.theme-pink .picker-header { + background-color: #e91e63; +} +.theme-pink .modal-button { + color: #e91e63; +} +.swiper-pagination.color-pink .swiper-pagination-bullet-active, +.theme-pink .swiper-pagination .swiper-pagination-bullet-active { + background-color: #e91e63; +} +.swiper-pagination.color-pink .swiper-pagination-progressbar, +.theme-pink .swiper-pagination .swiper-pagination-progressbar { + background-color: #e91e63; +} +.swiper-pagination.swiper-pagination-progress.bg-pink { + background-color: rgba(233, 30, 99, 0.25); +} +.swiper-button-next.color-pink, +.swiper-container-rtl .swiper-button-prev.color-pink, +.theme-pink .swiper-button-next, +.theme-pink .swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23e91e63'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-prev.color-pink, +.swiper-container-rtl .swiper-button-next.color-pink, +.theme-pink .swiper-button-prev, +.theme-pink .swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23e91e63'%2F%3E%3C%2Fsvg%3E"); +} +.bg-pink, +a.bg-pink, +.list-block .swipeout-actions-left a.bg-pink, +.list-block .swipeout-actions-right a.bg-pink { + background-color: #e91e63; +} +html:not(.watch-active-state) .list-block .bg-pink .item-link:active, +html:not(.watch-active-state) .list-block a.bg-pink .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-left a.bg-pink .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-right a.bg-pink .item-link:active, +html:not(.watch-active-state) .list-block.bg-pink .item-link:active, +html:not(.watch-active-state) .list-blocka.bg-pink .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-left a.bg-pink .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-right a.bg-pink .item-link:active, +html:not(.watch-active-state) .list-block .item-link.bg-pink:active, +html:not(.watch-active-state) .list-block .item-linka.bg-pink:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-left a.bg-pink:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-right a.bg-pink:active, +.list-block .bg-pink .item-link.active-state, +.list-block a.bg-pink .item-link.active-state, +.list-block .list-block .swipeout-actions-left a.bg-pink .item-link.active-state, +.list-block .list-block .swipeout-actions-right a.bg-pink .item-link.active-state, +.list-block.bg-pink .item-link.active-state, +.list-blocka.bg-pink .item-link.active-state, +.list-block.list-block .swipeout-actions-left a.bg-pink .item-link.active-state, +.list-block.list-block .swipeout-actions-right a.bg-pink .item-link.active-state, +.list-block .item-link.bg-pink.active-state, +.list-block .item-linka.bg-pink.active-state, +.list-block .item-link.list-block .swipeout-actions-left a.bg-pink.active-state, +.list-block .item-link.list-block .swipeout-actions-right a.bg-pink.active-state { + background: #C2185B; +} +.border-pink { + border-color: #e91e63; +} +.list-block .border-pink.item-inner:after, +.list-block ul.border-pink:after, +.border-pink:after, +.list-block .border-pink.item-inner:before, +.list-block ul.border-pink:before, +.border-pink:before { + background-color: #e91e63; +} +.theme-pink .floating-button, +.theme-pink .speed-dial-buttons a, +.floating-button.theme-pink, +.speed-dial-buttons a.theme-pink, +.floating-button.color-pink, +.speed-dial-buttons a.color-pink, +.floating-button.bg-pink, +.speed-dial-buttons a.bg-pink { + color: #fff; + background: #e91e63; +} +html:not(.watch-active-state) .theme-pink .floating-button:active, +html:not(.watch-active-state) .theme-pink .speed-dial-buttons a:active, +html:not(.watch-active-state) .floating-button.theme-pink:active, +html:not(.watch-active-state) .speed-dial-buttons a.theme-pink:active, +html:not(.watch-active-state) .floating-button.color-pink:active, +html:not(.watch-active-state) .speed-dial-buttons a.color-pink:active, +html:not(.watch-active-state) .floating-button.bg-pink:active, +html:not(.watch-active-state) .speed-dial-buttons a.bg-pink:active, +.theme-pink .floating-button.active-state, +.theme-pink .speed-dial-buttons a.active-state, +.floating-button.theme-pink.active-state, +.speed-dial-buttons a.theme-pink.active-state, +.floating-button.color-pink.active-state, +.speed-dial-buttons a.color-pink.active-state, +.floating-button.bg-pink.active-state, +.speed-dial-buttons a.bg-pink.active-state { + background: #C2185B; +} +.theme-pink .floating-button i, +.theme-pink .speed-dial-buttons a i, +.floating-button.theme-pink i, +.speed-dial-buttons a.theme-pink i, +.floating-button.color-pink i, +.speed-dial-buttons a.color-pink i, +.floating-button.bg-pink i, +.speed-dial-buttons a.bg-pink i { + color: inherit; +} +.ripple-pink .ripple-wave { + background-color: rgba(233, 30, 99, 0.3); +} +.badge.color-pink, +.badge.theme-pink { + background-color: #e91e63; + color: #fff; +} +.color-purple { + color: #9c27b0; +} +.list-block .item-link.list-button.color-purple, +.list-block .item-link.color-purple, +.tabbar a.active.color-purple, +a.color-purple { + color: #9c27b0; +} +.label-switch input[type="checkbox"]:checked + .checkbox.color-purple, +.label-switch.color-purple input[type="checkbox"]:checked + .checkbox { + background-color: #9c27b0; +} +.theme-purple .button:not(.button-fill) { + color: #9c27b0; +} +.theme-purple .navbar .button:not(.button-fill), +.theme-purple.navbar .button:not(.button-fill), +.theme-purple .toolbar .button:not(.button-fill), +.theme-purple.toolbar .button:not(.button-fill), +.theme-purple .subnavbar .button:not(.button-fill), +.theme-purple.subnavbar .button:not(.button-fill) { + color: #fff; +} +.button.color-purple:not(.button-fill), +.color-purple.buttons-row .button:not(.button-fill) { + color: #9c27b0 !important; +} +.theme-purple .button.button-fill { + background: #9c27b0; + color: #fff; +} +html:not(.watch-active-state) .theme-purple .button.button-fill:active, +.theme-purple .button.button-fill.active-state { + background: #7B1FA2; +} +.button.button-fill.bg-purple, +.button.button-fill.color-purple { + background: #9c27b0 !important; + color: #fff; +} +html:not(.watch-active-state) .button.button-fill.bg-purple:active, +html:not(.watch-active-state) .button.button-fill.color-purple:active, +.button.button-fill.bg-purple.active-state, +.button.button-fill.color-purple.active-state { + background: #7B1FA2 !important; +} +.progressbar.color-purple, +.progressbar.theme-purple, +.theme-purple .progressbar, +.progressbar.bg-purple { + background-color: rgba(156, 39, 176, 0.5); +} +.progressbar.color-purple span, +.progressbar.theme-purple span, +.theme-purple .progressbar span, +.progressbar.bg-purple span { + background-color: #9c27b0; +} +.progressbar-infinite.color-purple, +.progressbar-infinite.theme-purple, +.theme-purple .progressbar-infinite, +.progressbar-infinite.bg-purple { + background-color: rgba(156, 39, 176, 0.5); +} +.progressbar-infinite.color-purple:after, +.progressbar-infinite.theme-purple:after, +.theme-purple .progressbar-infinite:after, +.progressbar-infinite.bg-purple:after, +.progressbar-infinite.color-purple:before, +.progressbar-infinite.theme-purple:before, +.theme-purple .progressbar-infinite:before, +.progressbar-infinite.bg-purple:before { + background-color: #9c27b0; +} +.color-purple i.icon, +i.icon.color-purple { + color: #9c27b0; +} +i.icon-next.color-purple, +i.icon-next.theme-purple { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%239c27b0'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-purple, +i.icon-prev.theme-purple { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%239c27b0'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-purple, +i.icon-back.theme-purple { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%239c27b0'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-purple, +i.icon-forward.theme-purple { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%239c27b0'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-bars.color-purple, +i.icon-bars.theme-purple { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M3%2018h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z'%20fill%3D'%239c27b0'%2F%3E%3C%2Fsvg%3E"); +} +.preloader.color-purple svg circle, +.preloader.preloader-purple svg circle { + stroke: #9c27b0; +} +.preloader.color-purple .preloader-inner-gap, +.preloader.preloader-purple .preloader-inner-gap, +.preloader.color-purple .preloader-inner-half-circle, +.preloader.preloader-purple .preloader-inner-half-circle { + border-color: #9c27b0; +} +.theme-purple a { + color: #9c27b0; +} +.theme-purple .navbar, +.navbar.theme-purple, +.theme-purple .toolbar, +.toolbar.theme-purple, +.theme-purple .subnavbar, +.subnavbar.theme-purple, +.theme-purple .searchbar, +.searchbar.theme-purple { + background-color: #9c27b0; +} +.theme-purple .range-slider input[type="range"]::-webkit-slider-thumb:before, +.range-slider.theme-purple input[type="range"]::-webkit-slider-thumb:before { + background-color: #9c27b0; +} +.theme-purple .range-slider input[type="range"]::-webkit-slider-thumb, +.range-slider.theme-purple input[type="range"]::-webkit-slider-thumb { + background-color: #9c27b0; +} +.theme-purple .range-slider input[type="range"]::-ms-thumb, +.range-slider.theme-purple input[type="range"]::-ms-thumb { + background-color: #9c27b0; +} +.theme-purple .range-slider input[type="range"]::-ms-fill-lower, +.range-slider.theme-purple input[type="range"]::-ms-fill-lower { + background-color: #9c27b0; +} +.theme-purple .range-slider input[type="range"]::-moz-range-thumb, +.range-slider.theme-purple input[type="range"]::-moz-range-thumb { + background-color: #9c27b0; +} +.theme-purple .label-switch input[type="checkbox"]:checked + .checkbox, +.label-switch.theme-purple input[type="checkbox"]:checked + .checkbox { + background-color: rgba(156, 39, 176, 0.5); +} +.theme-purple .label-switch input[type="checkbox"]:checked + .checkbox:after, +.label-switch.theme-purple input[type="checkbox"]:checked + .checkbox:after { + background-color: #9c27b0; +} +.theme-purple label.label-checkbox, +label.label-checkbox.theme-purple { + cursor: pointer; +} +.theme-purple label.label-checkbox i.icon-form-checkbox:after, +label.label-checkbox.theme-purple i.icon-form-checkbox:after { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M9%2016.17L4.83%2012l-1.42%201.41L9%2019%2021%207l-1.41-1.41z'%2F%3E%3C%2Fsvg%3E"); +} +.theme-purple label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-purple input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +.theme-purple label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-purple input[type="radio"]:checked + .item-media i.icon-form-checkbox, +.theme-purple label.label-checkbox input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-purple input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +.theme-purple label.label-checkbox input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-purple input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +.theme-purple label.label-checkbox input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-purple input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +.theme-purple label.label-checkbox input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-purple input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox { + border-color: #9c27b0; + background-color: #9c27b0; +} +.theme-purple label.label-radio i.icon-form-radio:after, +label.label-radio.theme-purple i.icon-form-radio:after { + background-color: #9c27b0; +} +.theme-purple label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-purple input[type="checkbox"]:checked + .item-media i.icon-form-radio, +.theme-purple label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-purple input[type="radio"]:checked + .item-media i.icon-form-radio, +.theme-purple label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-purple input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +.theme-purple label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-purple input[type="radio"]:checked ~ .item-after i.icon-form-radio, +.theme-purple label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-purple input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +.theme-purple label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-purple input[type="radio"]:checked ~ .item-inner i.icon-form-radio { + border-color: #9c27b0; +} +.theme-purple label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-purple input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +.theme-purple label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-purple input[type="radio"]:checked + .item-media i.icon-form-radio:after, +.theme-purple label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-purple input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +.theme-purple label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-purple input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +.theme-purple label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-purple input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +.theme-purple label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-purple input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after { + background-color: #9c27b0; +} +.theme-purple .focus-state .label, +.theme-purple .focus-state .floating-label { + color: #9c27b0; +} +.theme-purple .item-input-field.focus-state:after, +.theme-purple .input-field.focus-state:after, +.theme-purple .item-input-field.not-empty-state:after, +.theme-purple .input-field.not-empty-state:after { + background: #9c27b0; +} +.theme-purple .picker-calendar-day.picker-calendar-day-today span { + color: #9c27b0; +} +.theme-purple .picker-calendar-day.picker-calendar-day-selected span { + background-color: #9c27b0; + color: #fff; +} +.theme-purple .picker-calendar-day.picker-calendar-day-has-events span:after { + background-color: #9c27b0; +} +.theme-purple .picker-header { + background-color: #9c27b0; +} +.theme-purple .modal-button { + color: #9c27b0; +} +.swiper-pagination.color-purple .swiper-pagination-bullet-active, +.theme-purple .swiper-pagination .swiper-pagination-bullet-active { + background-color: #9c27b0; +} +.swiper-pagination.color-purple .swiper-pagination-progressbar, +.theme-purple .swiper-pagination .swiper-pagination-progressbar { + background-color: #9c27b0; +} +.swiper-pagination.swiper-pagination-progress.bg-purple { + background-color: rgba(156, 39, 176, 0.25); +} +.swiper-button-next.color-purple, +.swiper-container-rtl .swiper-button-prev.color-purple, +.theme-purple .swiper-button-next, +.theme-purple .swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%239c27b0'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-prev.color-purple, +.swiper-container-rtl .swiper-button-next.color-purple, +.theme-purple .swiper-button-prev, +.theme-purple .swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%239c27b0'%2F%3E%3C%2Fsvg%3E"); +} +.bg-purple, +a.bg-purple, +.list-block .swipeout-actions-left a.bg-purple, +.list-block .swipeout-actions-right a.bg-purple { + background-color: #9c27b0; +} +html:not(.watch-active-state) .list-block .bg-purple .item-link:active, +html:not(.watch-active-state) .list-block a.bg-purple .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-left a.bg-purple .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-right a.bg-purple .item-link:active, +html:not(.watch-active-state) .list-block.bg-purple .item-link:active, +html:not(.watch-active-state) .list-blocka.bg-purple .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-left a.bg-purple .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-right a.bg-purple .item-link:active, +html:not(.watch-active-state) .list-block .item-link.bg-purple:active, +html:not(.watch-active-state) .list-block .item-linka.bg-purple:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-left a.bg-purple:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-right a.bg-purple:active, +.list-block .bg-purple .item-link.active-state, +.list-block a.bg-purple .item-link.active-state, +.list-block .list-block .swipeout-actions-left a.bg-purple .item-link.active-state, +.list-block .list-block .swipeout-actions-right a.bg-purple .item-link.active-state, +.list-block.bg-purple .item-link.active-state, +.list-blocka.bg-purple .item-link.active-state, +.list-block.list-block .swipeout-actions-left a.bg-purple .item-link.active-state, +.list-block.list-block .swipeout-actions-right a.bg-purple .item-link.active-state, +.list-block .item-link.bg-purple.active-state, +.list-block .item-linka.bg-purple.active-state, +.list-block .item-link.list-block .swipeout-actions-left a.bg-purple.active-state, +.list-block .item-link.list-block .swipeout-actions-right a.bg-purple.active-state { + background: #7B1FA2; +} +.border-purple { + border-color: #9c27b0; +} +.list-block .border-purple.item-inner:after, +.list-block ul.border-purple:after, +.border-purple:after, +.list-block .border-purple.item-inner:before, +.list-block ul.border-purple:before, +.border-purple:before { + background-color: #9c27b0; +} +.theme-purple .floating-button, +.theme-purple .speed-dial-buttons a, +.floating-button.theme-purple, +.speed-dial-buttons a.theme-purple, +.floating-button.color-purple, +.speed-dial-buttons a.color-purple, +.floating-button.bg-purple, +.speed-dial-buttons a.bg-purple { + color: #fff; + background: #9c27b0; +} +html:not(.watch-active-state) .theme-purple .floating-button:active, +html:not(.watch-active-state) .theme-purple .speed-dial-buttons a:active, +html:not(.watch-active-state) .floating-button.theme-purple:active, +html:not(.watch-active-state) .speed-dial-buttons a.theme-purple:active, +html:not(.watch-active-state) .floating-button.color-purple:active, +html:not(.watch-active-state) .speed-dial-buttons a.color-purple:active, +html:not(.watch-active-state) .floating-button.bg-purple:active, +html:not(.watch-active-state) .speed-dial-buttons a.bg-purple:active, +.theme-purple .floating-button.active-state, +.theme-purple .speed-dial-buttons a.active-state, +.floating-button.theme-purple.active-state, +.speed-dial-buttons a.theme-purple.active-state, +.floating-button.color-purple.active-state, +.speed-dial-buttons a.color-purple.active-state, +.floating-button.bg-purple.active-state, +.speed-dial-buttons a.bg-purple.active-state { + background: #7B1FA2; +} +.theme-purple .floating-button i, +.theme-purple .speed-dial-buttons a i, +.floating-button.theme-purple i, +.speed-dial-buttons a.theme-purple i, +.floating-button.color-purple i, +.speed-dial-buttons a.color-purple i, +.floating-button.bg-purple i, +.speed-dial-buttons a.bg-purple i { + color: inherit; +} +.ripple-purple .ripple-wave { + background-color: rgba(156, 39, 176, 0.3); +} +.badge.color-purple, +.badge.theme-purple { + background-color: #9c27b0; + color: #fff; +} +.color-deeppurple { + color: #673ab7; +} +.list-block .item-link.list-button.color-deeppurple, +.list-block .item-link.color-deeppurple, +.tabbar a.active.color-deeppurple, +a.color-deeppurple { + color: #673ab7; +} +.label-switch input[type="checkbox"]:checked + .checkbox.color-deeppurple, +.label-switch.color-deeppurple input[type="checkbox"]:checked + .checkbox { + background-color: #673ab7; +} +.theme-deeppurple .button:not(.button-fill) { + color: #673ab7; +} +.theme-deeppurple .navbar .button:not(.button-fill), +.theme-deeppurple.navbar .button:not(.button-fill), +.theme-deeppurple .toolbar .button:not(.button-fill), +.theme-deeppurple.toolbar .button:not(.button-fill), +.theme-deeppurple .subnavbar .button:not(.button-fill), +.theme-deeppurple.subnavbar .button:not(.button-fill) { + color: #fff; +} +.button.color-deeppurple:not(.button-fill), +.color-deeppurple.buttons-row .button:not(.button-fill) { + color: #673ab7 !important; +} +.theme-deeppurple .button.button-fill { + background: #673ab7; + color: #fff; +} +html:not(.watch-active-state) .theme-deeppurple .button.button-fill:active, +.theme-deeppurple .button.button-fill.active-state { + background: #512DA8; +} +.button.button-fill.bg-deeppurple, +.button.button-fill.color-deeppurple { + background: #673ab7 !important; + color: #fff; +} +html:not(.watch-active-state) .button.button-fill.bg-deeppurple:active, +html:not(.watch-active-state) .button.button-fill.color-deeppurple:active, +.button.button-fill.bg-deeppurple.active-state, +.button.button-fill.color-deeppurple.active-state { + background: #512DA8 !important; +} +.progressbar.color-deeppurple, +.progressbar.theme-deeppurple, +.theme-deeppurple .progressbar, +.progressbar.bg-deeppurple { + background-color: rgba(103, 58, 183, 0.5); +} +.progressbar.color-deeppurple span, +.progressbar.theme-deeppurple span, +.theme-deeppurple .progressbar span, +.progressbar.bg-deeppurple span { + background-color: #673ab7; +} +.progressbar-infinite.color-deeppurple, +.progressbar-infinite.theme-deeppurple, +.theme-deeppurple .progressbar-infinite, +.progressbar-infinite.bg-deeppurple { + background-color: rgba(103, 58, 183, 0.5); +} +.progressbar-infinite.color-deeppurple:after, +.progressbar-infinite.theme-deeppurple:after, +.theme-deeppurple .progressbar-infinite:after, +.progressbar-infinite.bg-deeppurple:after, +.progressbar-infinite.color-deeppurple:before, +.progressbar-infinite.theme-deeppurple:before, +.theme-deeppurple .progressbar-infinite:before, +.progressbar-infinite.bg-deeppurple:before { + background-color: #673ab7; +} +.color-deeppurple i.icon, +i.icon.color-deeppurple { + color: #673ab7; +} +i.icon-next.color-deeppurple, +i.icon-next.theme-deeppurple { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23673ab7'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-deeppurple, +i.icon-prev.theme-deeppurple { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23673ab7'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-deeppurple, +i.icon-back.theme-deeppurple { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23673ab7'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-deeppurple, +i.icon-forward.theme-deeppurple { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23673ab7'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-bars.color-deeppurple, +i.icon-bars.theme-deeppurple { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M3%2018h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z'%20fill%3D'%23673ab7'%2F%3E%3C%2Fsvg%3E"); +} +.preloader.color-deeppurple svg circle, +.preloader.preloader-deeppurple svg circle { + stroke: #673ab7; +} +.preloader.color-deeppurple .preloader-inner-gap, +.preloader.preloader-deeppurple .preloader-inner-gap, +.preloader.color-deeppurple .preloader-inner-half-circle, +.preloader.preloader-deeppurple .preloader-inner-half-circle { + border-color: #673ab7; +} +.theme-deeppurple a { + color: #673ab7; +} +.theme-deeppurple .navbar, +.navbar.theme-deeppurple, +.theme-deeppurple .toolbar, +.toolbar.theme-deeppurple, +.theme-deeppurple .subnavbar, +.subnavbar.theme-deeppurple, +.theme-deeppurple .searchbar, +.searchbar.theme-deeppurple { + background-color: #673ab7; +} +.theme-deeppurple .range-slider input[type="range"]::-webkit-slider-thumb:before, +.range-slider.theme-deeppurple input[type="range"]::-webkit-slider-thumb:before { + background-color: #673ab7; +} +.theme-deeppurple .range-slider input[type="range"]::-webkit-slider-thumb, +.range-slider.theme-deeppurple input[type="range"]::-webkit-slider-thumb { + background-color: #673ab7; +} +.theme-deeppurple .range-slider input[type="range"]::-ms-thumb, +.range-slider.theme-deeppurple input[type="range"]::-ms-thumb { + background-color: #673ab7; +} +.theme-deeppurple .range-slider input[type="range"]::-ms-fill-lower, +.range-slider.theme-deeppurple input[type="range"]::-ms-fill-lower { + background-color: #673ab7; +} +.theme-deeppurple .range-slider input[type="range"]::-moz-range-thumb, +.range-slider.theme-deeppurple input[type="range"]::-moz-range-thumb { + background-color: #673ab7; +} +.theme-deeppurple .label-switch input[type="checkbox"]:checked + .checkbox, +.label-switch.theme-deeppurple input[type="checkbox"]:checked + .checkbox { + background-color: rgba(103, 58, 183, 0.5); +} +.theme-deeppurple .label-switch input[type="checkbox"]:checked + .checkbox:after, +.label-switch.theme-deeppurple input[type="checkbox"]:checked + .checkbox:after { + background-color: #673ab7; +} +.theme-deeppurple label.label-checkbox, +label.label-checkbox.theme-deeppurple { + cursor: pointer; +} +.theme-deeppurple label.label-checkbox i.icon-form-checkbox:after, +label.label-checkbox.theme-deeppurple i.icon-form-checkbox:after { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M9%2016.17L4.83%2012l-1.42%201.41L9%2019%2021%207l-1.41-1.41z'%2F%3E%3C%2Fsvg%3E"); +} +.theme-deeppurple label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-deeppurple input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +.theme-deeppurple label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-deeppurple input[type="radio"]:checked + .item-media i.icon-form-checkbox, +.theme-deeppurple label.label-checkbox input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-deeppurple input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +.theme-deeppurple label.label-checkbox input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-deeppurple input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +.theme-deeppurple label.label-checkbox input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-deeppurple input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +.theme-deeppurple label.label-checkbox input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-deeppurple input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox { + border-color: #673ab7; + background-color: #673ab7; +} +.theme-deeppurple label.label-radio i.icon-form-radio:after, +label.label-radio.theme-deeppurple i.icon-form-radio:after { + background-color: #673ab7; +} +.theme-deeppurple label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-deeppurple input[type="checkbox"]:checked + .item-media i.icon-form-radio, +.theme-deeppurple label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-deeppurple input[type="radio"]:checked + .item-media i.icon-form-radio, +.theme-deeppurple label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-deeppurple input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +.theme-deeppurple label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-deeppurple input[type="radio"]:checked ~ .item-after i.icon-form-radio, +.theme-deeppurple label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-deeppurple input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +.theme-deeppurple label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-deeppurple input[type="radio"]:checked ~ .item-inner i.icon-form-radio { + border-color: #673ab7; +} +.theme-deeppurple label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-deeppurple input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +.theme-deeppurple label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-deeppurple input[type="radio"]:checked + .item-media i.icon-form-radio:after, +.theme-deeppurple label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-deeppurple input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +.theme-deeppurple label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-deeppurple input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +.theme-deeppurple label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-deeppurple input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +.theme-deeppurple label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-deeppurple input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after { + background-color: #673ab7; +} +.theme-deeppurple .focus-state .label, +.theme-deeppurple .focus-state .floating-label { + color: #673ab7; +} +.theme-deeppurple .item-input-field.focus-state:after, +.theme-deeppurple .input-field.focus-state:after, +.theme-deeppurple .item-input-field.not-empty-state:after, +.theme-deeppurple .input-field.not-empty-state:after { + background: #673ab7; +} +.theme-deeppurple .picker-calendar-day.picker-calendar-day-today span { + color: #673ab7; +} +.theme-deeppurple .picker-calendar-day.picker-calendar-day-selected span { + background-color: #673ab7; + color: #fff; +} +.theme-deeppurple .picker-calendar-day.picker-calendar-day-has-events span:after { + background-color: #673ab7; +} +.theme-deeppurple .picker-header { + background-color: #673ab7; +} +.theme-deeppurple .modal-button { + color: #673ab7; +} +.swiper-pagination.color-deeppurple .swiper-pagination-bullet-active, +.theme-deeppurple .swiper-pagination .swiper-pagination-bullet-active { + background-color: #673ab7; +} +.swiper-pagination.color-deeppurple .swiper-pagination-progressbar, +.theme-deeppurple .swiper-pagination .swiper-pagination-progressbar { + background-color: #673ab7; +} +.swiper-pagination.swiper-pagination-progress.bg-deeppurple { + background-color: rgba(103, 58, 183, 0.25); +} +.swiper-button-next.color-deeppurple, +.swiper-container-rtl .swiper-button-prev.color-deeppurple, +.theme-deeppurple .swiper-button-next, +.theme-deeppurple .swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23673ab7'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-prev.color-deeppurple, +.swiper-container-rtl .swiper-button-next.color-deeppurple, +.theme-deeppurple .swiper-button-prev, +.theme-deeppurple .swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23673ab7'%2F%3E%3C%2Fsvg%3E"); +} +.bg-deeppurple, +a.bg-deeppurple, +.list-block .swipeout-actions-left a.bg-deeppurple, +.list-block .swipeout-actions-right a.bg-deeppurple { + background-color: #673ab7; +} +html:not(.watch-active-state) .list-block .bg-deeppurple .item-link:active, +html:not(.watch-active-state) .list-block a.bg-deeppurple .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-left a.bg-deeppurple .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-right a.bg-deeppurple .item-link:active, +html:not(.watch-active-state) .list-block.bg-deeppurple .item-link:active, +html:not(.watch-active-state) .list-blocka.bg-deeppurple .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-left a.bg-deeppurple .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-right a.bg-deeppurple .item-link:active, +html:not(.watch-active-state) .list-block .item-link.bg-deeppurple:active, +html:not(.watch-active-state) .list-block .item-linka.bg-deeppurple:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-left a.bg-deeppurple:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-right a.bg-deeppurple:active, +.list-block .bg-deeppurple .item-link.active-state, +.list-block a.bg-deeppurple .item-link.active-state, +.list-block .list-block .swipeout-actions-left a.bg-deeppurple .item-link.active-state, +.list-block .list-block .swipeout-actions-right a.bg-deeppurple .item-link.active-state, +.list-block.bg-deeppurple .item-link.active-state, +.list-blocka.bg-deeppurple .item-link.active-state, +.list-block.list-block .swipeout-actions-left a.bg-deeppurple .item-link.active-state, +.list-block.list-block .swipeout-actions-right a.bg-deeppurple .item-link.active-state, +.list-block .item-link.bg-deeppurple.active-state, +.list-block .item-linka.bg-deeppurple.active-state, +.list-block .item-link.list-block .swipeout-actions-left a.bg-deeppurple.active-state, +.list-block .item-link.list-block .swipeout-actions-right a.bg-deeppurple.active-state { + background: #512DA8; +} +.border-deeppurple { + border-color: #673ab7; +} +.list-block .border-deeppurple.item-inner:after, +.list-block ul.border-deeppurple:after, +.border-deeppurple:after, +.list-block .border-deeppurple.item-inner:before, +.list-block ul.border-deeppurple:before, +.border-deeppurple:before { + background-color: #673ab7; +} +.theme-deeppurple .floating-button, +.theme-deeppurple .speed-dial-buttons a, +.floating-button.theme-deeppurple, +.speed-dial-buttons a.theme-deeppurple, +.floating-button.color-deeppurple, +.speed-dial-buttons a.color-deeppurple, +.floating-button.bg-deeppurple, +.speed-dial-buttons a.bg-deeppurple { + color: #fff; + background: #673ab7; +} +html:not(.watch-active-state) .theme-deeppurple .floating-button:active, +html:not(.watch-active-state) .theme-deeppurple .speed-dial-buttons a:active, +html:not(.watch-active-state) .floating-button.theme-deeppurple:active, +html:not(.watch-active-state) .speed-dial-buttons a.theme-deeppurple:active, +html:not(.watch-active-state) .floating-button.color-deeppurple:active, +html:not(.watch-active-state) .speed-dial-buttons a.color-deeppurple:active, +html:not(.watch-active-state) .floating-button.bg-deeppurple:active, +html:not(.watch-active-state) .speed-dial-buttons a.bg-deeppurple:active, +.theme-deeppurple .floating-button.active-state, +.theme-deeppurple .speed-dial-buttons a.active-state, +.floating-button.theme-deeppurple.active-state, +.speed-dial-buttons a.theme-deeppurple.active-state, +.floating-button.color-deeppurple.active-state, +.speed-dial-buttons a.color-deeppurple.active-state, +.floating-button.bg-deeppurple.active-state, +.speed-dial-buttons a.bg-deeppurple.active-state { + background: #512DA8; +} +.theme-deeppurple .floating-button i, +.theme-deeppurple .speed-dial-buttons a i, +.floating-button.theme-deeppurple i, +.speed-dial-buttons a.theme-deeppurple i, +.floating-button.color-deeppurple i, +.speed-dial-buttons a.color-deeppurple i, +.floating-button.bg-deeppurple i, +.speed-dial-buttons a.bg-deeppurple i { + color: inherit; +} +.ripple-deeppurple .ripple-wave { + background-color: rgba(103, 58, 183, 0.3); +} +.badge.color-deeppurple, +.badge.theme-deeppurple { + background-color: #673ab7; + color: #fff; +} +.color-indigo { + color: #3f51b5; +} +.list-block .item-link.list-button.color-indigo, +.list-block .item-link.color-indigo, +.tabbar a.active.color-indigo, +a.color-indigo { + color: #3f51b5; +} +.label-switch input[type="checkbox"]:checked + .checkbox.color-indigo, +.label-switch.color-indigo input[type="checkbox"]:checked + .checkbox { + background-color: #3f51b5; +} +.theme-indigo .button:not(.button-fill) { + color: #3f51b5; +} +.theme-indigo .navbar .button:not(.button-fill), +.theme-indigo.navbar .button:not(.button-fill), +.theme-indigo .toolbar .button:not(.button-fill), +.theme-indigo.toolbar .button:not(.button-fill), +.theme-indigo .subnavbar .button:not(.button-fill), +.theme-indigo.subnavbar .button:not(.button-fill) { + color: #fff; +} +.button.color-indigo:not(.button-fill), +.color-indigo.buttons-row .button:not(.button-fill) { + color: #3f51b5 !important; +} +.theme-indigo .button.button-fill { + background: #3f51b5; + color: #fff; +} +html:not(.watch-active-state) .theme-indigo .button.button-fill:active, +.theme-indigo .button.button-fill.active-state { + background: #303F9F; +} +.button.button-fill.bg-indigo, +.button.button-fill.color-indigo { + background: #3f51b5 !important; + color: #fff; +} +html:not(.watch-active-state) .button.button-fill.bg-indigo:active, +html:not(.watch-active-state) .button.button-fill.color-indigo:active, +.button.button-fill.bg-indigo.active-state, +.button.button-fill.color-indigo.active-state { + background: #303F9F !important; +} +.progressbar.color-indigo, +.progressbar.theme-indigo, +.theme-indigo .progressbar, +.progressbar.bg-indigo { + background-color: rgba(63, 81, 181, 0.5); +} +.progressbar.color-indigo span, +.progressbar.theme-indigo span, +.theme-indigo .progressbar span, +.progressbar.bg-indigo span { + background-color: #3f51b5; +} +.progressbar-infinite.color-indigo, +.progressbar-infinite.theme-indigo, +.theme-indigo .progressbar-infinite, +.progressbar-infinite.bg-indigo { + background-color: rgba(63, 81, 181, 0.5); +} +.progressbar-infinite.color-indigo:after, +.progressbar-infinite.theme-indigo:after, +.theme-indigo .progressbar-infinite:after, +.progressbar-infinite.bg-indigo:after, +.progressbar-infinite.color-indigo:before, +.progressbar-infinite.theme-indigo:before, +.theme-indigo .progressbar-infinite:before, +.progressbar-infinite.bg-indigo:before { + background-color: #3f51b5; +} +.color-indigo i.icon, +i.icon.color-indigo { + color: #3f51b5; +} +i.icon-next.color-indigo, +i.icon-next.theme-indigo { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%233f51b5'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-indigo, +i.icon-prev.theme-indigo { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%233f51b5'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-indigo, +i.icon-back.theme-indigo { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%233f51b5'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-indigo, +i.icon-forward.theme-indigo { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%233f51b5'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-bars.color-indigo, +i.icon-bars.theme-indigo { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M3%2018h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z'%20fill%3D'%233f51b5'%2F%3E%3C%2Fsvg%3E"); +} +.preloader.color-indigo svg circle, +.preloader.preloader-indigo svg circle { + stroke: #3f51b5; +} +.preloader.color-indigo .preloader-inner-gap, +.preloader.preloader-indigo .preloader-inner-gap, +.preloader.color-indigo .preloader-inner-half-circle, +.preloader.preloader-indigo .preloader-inner-half-circle { + border-color: #3f51b5; +} +.theme-indigo a { + color: #3f51b5; +} +.theme-indigo .navbar, +.navbar.theme-indigo, +.theme-indigo .toolbar, +.toolbar.theme-indigo, +.theme-indigo .subnavbar, +.subnavbar.theme-indigo, +.theme-indigo .searchbar, +.searchbar.theme-indigo { + background-color: #3f51b5; +} +.theme-indigo .range-slider input[type="range"]::-webkit-slider-thumb:before, +.range-slider.theme-indigo input[type="range"]::-webkit-slider-thumb:before { + background-color: #3f51b5; +} +.theme-indigo .range-slider input[type="range"]::-webkit-slider-thumb, +.range-slider.theme-indigo input[type="range"]::-webkit-slider-thumb { + background-color: #3f51b5; +} +.theme-indigo .range-slider input[type="range"]::-ms-thumb, +.range-slider.theme-indigo input[type="range"]::-ms-thumb { + background-color: #3f51b5; +} +.theme-indigo .range-slider input[type="range"]::-ms-fill-lower, +.range-slider.theme-indigo input[type="range"]::-ms-fill-lower { + background-color: #3f51b5; +} +.theme-indigo .range-slider input[type="range"]::-moz-range-thumb, +.range-slider.theme-indigo input[type="range"]::-moz-range-thumb { + background-color: #3f51b5; +} +.theme-indigo .label-switch input[type="checkbox"]:checked + .checkbox, +.label-switch.theme-indigo input[type="checkbox"]:checked + .checkbox { + background-color: rgba(63, 81, 181, 0.5); +} +.theme-indigo .label-switch input[type="checkbox"]:checked + .checkbox:after, +.label-switch.theme-indigo input[type="checkbox"]:checked + .checkbox:after { + background-color: #3f51b5; +} +.theme-indigo label.label-checkbox, +label.label-checkbox.theme-indigo { + cursor: pointer; +} +.theme-indigo label.label-checkbox i.icon-form-checkbox:after, +label.label-checkbox.theme-indigo i.icon-form-checkbox:after { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M9%2016.17L4.83%2012l-1.42%201.41L9%2019%2021%207l-1.41-1.41z'%2F%3E%3C%2Fsvg%3E"); +} +.theme-indigo label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-indigo input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +.theme-indigo label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-indigo input[type="radio"]:checked + .item-media i.icon-form-checkbox, +.theme-indigo label.label-checkbox input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-indigo input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +.theme-indigo label.label-checkbox input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-indigo input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +.theme-indigo label.label-checkbox input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-indigo input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +.theme-indigo label.label-checkbox input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-indigo input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox { + border-color: #3f51b5; + background-color: #3f51b5; +} +.theme-indigo label.label-radio i.icon-form-radio:after, +label.label-radio.theme-indigo i.icon-form-radio:after { + background-color: #3f51b5; +} +.theme-indigo label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-indigo input[type="checkbox"]:checked + .item-media i.icon-form-radio, +.theme-indigo label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-indigo input[type="radio"]:checked + .item-media i.icon-form-radio, +.theme-indigo label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-indigo input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +.theme-indigo label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-indigo input[type="radio"]:checked ~ .item-after i.icon-form-radio, +.theme-indigo label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-indigo input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +.theme-indigo label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-indigo input[type="radio"]:checked ~ .item-inner i.icon-form-radio { + border-color: #3f51b5; +} +.theme-indigo label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-indigo input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +.theme-indigo label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-indigo input[type="radio"]:checked + .item-media i.icon-form-radio:after, +.theme-indigo label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-indigo input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +.theme-indigo label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-indigo input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +.theme-indigo label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-indigo input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +.theme-indigo label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-indigo input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after { + background-color: #3f51b5; +} +.theme-indigo .focus-state .label, +.theme-indigo .focus-state .floating-label { + color: #3f51b5; +} +.theme-indigo .item-input-field.focus-state:after, +.theme-indigo .input-field.focus-state:after, +.theme-indigo .item-input-field.not-empty-state:after, +.theme-indigo .input-field.not-empty-state:after { + background: #3f51b5; +} +.theme-indigo .picker-calendar-day.picker-calendar-day-today span { + color: #3f51b5; +} +.theme-indigo .picker-calendar-day.picker-calendar-day-selected span { + background-color: #3f51b5; + color: #fff; +} +.theme-indigo .picker-calendar-day.picker-calendar-day-has-events span:after { + background-color: #3f51b5; +} +.theme-indigo .picker-header { + background-color: #3f51b5; +} +.theme-indigo .modal-button { + color: #3f51b5; +} +.swiper-pagination.color-indigo .swiper-pagination-bullet-active, +.theme-indigo .swiper-pagination .swiper-pagination-bullet-active { + background-color: #3f51b5; +} +.swiper-pagination.color-indigo .swiper-pagination-progressbar, +.theme-indigo .swiper-pagination .swiper-pagination-progressbar { + background-color: #3f51b5; +} +.swiper-pagination.swiper-pagination-progress.bg-indigo { + background-color: rgba(63, 81, 181, 0.25); +} +.swiper-button-next.color-indigo, +.swiper-container-rtl .swiper-button-prev.color-indigo, +.theme-indigo .swiper-button-next, +.theme-indigo .swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%233f51b5'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-prev.color-indigo, +.swiper-container-rtl .swiper-button-next.color-indigo, +.theme-indigo .swiper-button-prev, +.theme-indigo .swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%233f51b5'%2F%3E%3C%2Fsvg%3E"); +} +.bg-indigo, +a.bg-indigo, +.list-block .swipeout-actions-left a.bg-indigo, +.list-block .swipeout-actions-right a.bg-indigo { + background-color: #3f51b5; +} +html:not(.watch-active-state) .list-block .bg-indigo .item-link:active, +html:not(.watch-active-state) .list-block a.bg-indigo .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-left a.bg-indigo .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-right a.bg-indigo .item-link:active, +html:not(.watch-active-state) .list-block.bg-indigo .item-link:active, +html:not(.watch-active-state) .list-blocka.bg-indigo .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-left a.bg-indigo .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-right a.bg-indigo .item-link:active, +html:not(.watch-active-state) .list-block .item-link.bg-indigo:active, +html:not(.watch-active-state) .list-block .item-linka.bg-indigo:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-left a.bg-indigo:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-right a.bg-indigo:active, +.list-block .bg-indigo .item-link.active-state, +.list-block a.bg-indigo .item-link.active-state, +.list-block .list-block .swipeout-actions-left a.bg-indigo .item-link.active-state, +.list-block .list-block .swipeout-actions-right a.bg-indigo .item-link.active-state, +.list-block.bg-indigo .item-link.active-state, +.list-blocka.bg-indigo .item-link.active-state, +.list-block.list-block .swipeout-actions-left a.bg-indigo .item-link.active-state, +.list-block.list-block .swipeout-actions-right a.bg-indigo .item-link.active-state, +.list-block .item-link.bg-indigo.active-state, +.list-block .item-linka.bg-indigo.active-state, +.list-block .item-link.list-block .swipeout-actions-left a.bg-indigo.active-state, +.list-block .item-link.list-block .swipeout-actions-right a.bg-indigo.active-state { + background: #303F9F; +} +.border-indigo { + border-color: #3f51b5; +} +.list-block .border-indigo.item-inner:after, +.list-block ul.border-indigo:after, +.border-indigo:after, +.list-block .border-indigo.item-inner:before, +.list-block ul.border-indigo:before, +.border-indigo:before { + background-color: #3f51b5; +} +.theme-indigo .floating-button, +.theme-indigo .speed-dial-buttons a, +.floating-button.theme-indigo, +.speed-dial-buttons a.theme-indigo, +.floating-button.color-indigo, +.speed-dial-buttons a.color-indigo, +.floating-button.bg-indigo, +.speed-dial-buttons a.bg-indigo { + color: #fff; + background: #3f51b5; +} +html:not(.watch-active-state) .theme-indigo .floating-button:active, +html:not(.watch-active-state) .theme-indigo .speed-dial-buttons a:active, +html:not(.watch-active-state) .floating-button.theme-indigo:active, +html:not(.watch-active-state) .speed-dial-buttons a.theme-indigo:active, +html:not(.watch-active-state) .floating-button.color-indigo:active, +html:not(.watch-active-state) .speed-dial-buttons a.color-indigo:active, +html:not(.watch-active-state) .floating-button.bg-indigo:active, +html:not(.watch-active-state) .speed-dial-buttons a.bg-indigo:active, +.theme-indigo .floating-button.active-state, +.theme-indigo .speed-dial-buttons a.active-state, +.floating-button.theme-indigo.active-state, +.speed-dial-buttons a.theme-indigo.active-state, +.floating-button.color-indigo.active-state, +.speed-dial-buttons a.color-indigo.active-state, +.floating-button.bg-indigo.active-state, +.speed-dial-buttons a.bg-indigo.active-state { + background: #303F9F; +} +.theme-indigo .floating-button i, +.theme-indigo .speed-dial-buttons a i, +.floating-button.theme-indigo i, +.speed-dial-buttons a.theme-indigo i, +.floating-button.color-indigo i, +.speed-dial-buttons a.color-indigo i, +.floating-button.bg-indigo i, +.speed-dial-buttons a.bg-indigo i { + color: inherit; +} +.ripple-indigo .ripple-wave { + background-color: rgba(63, 81, 181, 0.3); +} +.badge.color-indigo, +.badge.theme-indigo { + background-color: #3f51b5; + color: #fff; +} +.color-blue { + color: #2196f3; +} +.list-block .item-link.list-button.color-blue, +.list-block .item-link.color-blue, +.tabbar a.active.color-blue, +a.color-blue { + color: #2196f3; +} +.label-switch input[type="checkbox"]:checked + .checkbox.color-blue, +.label-switch.color-blue input[type="checkbox"]:checked + .checkbox { + background-color: #2196f3; +} +.theme-blue .button:not(.button-fill) { + color: #2196f3; +} +.theme-blue .navbar .button:not(.button-fill), +.theme-blue.navbar .button:not(.button-fill), +.theme-blue .toolbar .button:not(.button-fill), +.theme-blue.toolbar .button:not(.button-fill), +.theme-blue .subnavbar .button:not(.button-fill), +.theme-blue.subnavbar .button:not(.button-fill) { + color: #fff; +} +.button.color-blue:not(.button-fill), +.color-blue.buttons-row .button:not(.button-fill) { + color: #2196f3 !important; +} +.theme-blue .button.button-fill { + background: #2196f3; + color: #fff; +} +html:not(.watch-active-state) .theme-blue .button.button-fill:active, +.theme-blue .button.button-fill.active-state { + background: #1976D2; +} +.button.button-fill.bg-blue, +.button.button-fill.color-blue { + background: #2196f3 !important; + color: #fff; +} +html:not(.watch-active-state) .button.button-fill.bg-blue:active, +html:not(.watch-active-state) .button.button-fill.color-blue:active, +.button.button-fill.bg-blue.active-state, +.button.button-fill.color-blue.active-state { + background: #1976D2 !important; +} +.progressbar.color-blue, +.progressbar.theme-blue, +.theme-blue .progressbar, +.progressbar.bg-blue { + background-color: rgba(33, 150, 243, 0.5); +} +.progressbar.color-blue span, +.progressbar.theme-blue span, +.theme-blue .progressbar span, +.progressbar.bg-blue span { + background-color: #2196f3; +} +.progressbar-infinite.color-blue, +.progressbar-infinite.theme-blue, +.theme-blue .progressbar-infinite, +.progressbar-infinite.bg-blue { + background-color: rgba(33, 150, 243, 0.5); +} +.progressbar-infinite.color-blue:after, +.progressbar-infinite.theme-blue:after, +.theme-blue .progressbar-infinite:after, +.progressbar-infinite.bg-blue:after, +.progressbar-infinite.color-blue:before, +.progressbar-infinite.theme-blue:before, +.theme-blue .progressbar-infinite:before, +.progressbar-infinite.bg-blue:before { + background-color: #2196f3; +} +.color-blue i.icon, +i.icon.color-blue { + color: #2196f3; +} +i.icon-next.color-blue, +i.icon-next.theme-blue { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%232196f3'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-blue, +i.icon-prev.theme-blue { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%232196f3'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-blue, +i.icon-back.theme-blue { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%232196f3'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-blue, +i.icon-forward.theme-blue { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%232196f3'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-bars.color-blue, +i.icon-bars.theme-blue { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M3%2018h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z'%20fill%3D'%232196f3'%2F%3E%3C%2Fsvg%3E"); +} +.preloader.color-blue svg circle, +.preloader.preloader-blue svg circle { + stroke: #2196f3; +} +.preloader.color-blue .preloader-inner-gap, +.preloader.preloader-blue .preloader-inner-gap, +.preloader.color-blue .preloader-inner-half-circle, +.preloader.preloader-blue .preloader-inner-half-circle { + border-color: #2196f3; +} +.theme-blue a { + color: #2196f3; +} +.theme-blue .navbar, +.navbar.theme-blue, +.theme-blue .toolbar, +.toolbar.theme-blue, +.theme-blue .subnavbar, +.subnavbar.theme-blue, +.theme-blue .searchbar, +.searchbar.theme-blue { + background-color: #2196f3; +} +.theme-blue .range-slider input[type="range"]::-webkit-slider-thumb:before, +.range-slider.theme-blue input[type="range"]::-webkit-slider-thumb:before { + background-color: #2196f3; +} +.theme-blue .range-slider input[type="range"]::-webkit-slider-thumb, +.range-slider.theme-blue input[type="range"]::-webkit-slider-thumb { + background-color: #2196f3; +} +.theme-blue .range-slider input[type="range"]::-ms-thumb, +.range-slider.theme-blue input[type="range"]::-ms-thumb { + background-color: #2196f3; +} +.theme-blue .range-slider input[type="range"]::-ms-fill-lower, +.range-slider.theme-blue input[type="range"]::-ms-fill-lower { + background-color: #2196f3; +} +.theme-blue .range-slider input[type="range"]::-moz-range-thumb, +.range-slider.theme-blue input[type="range"]::-moz-range-thumb { + background-color: #2196f3; +} +.theme-blue .label-switch input[type="checkbox"]:checked + .checkbox, +.label-switch.theme-blue input[type="checkbox"]:checked + .checkbox { + background-color: rgba(33, 150, 243, 0.5); +} +.theme-blue .label-switch input[type="checkbox"]:checked + .checkbox:after, +.label-switch.theme-blue input[type="checkbox"]:checked + .checkbox:after { + background-color: #2196f3; +} +.theme-blue label.label-checkbox, +label.label-checkbox.theme-blue { + cursor: pointer; +} +.theme-blue label.label-checkbox i.icon-form-checkbox:after, +label.label-checkbox.theme-blue i.icon-form-checkbox:after { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M9%2016.17L4.83%2012l-1.42%201.41L9%2019%2021%207l-1.41-1.41z'%2F%3E%3C%2Fsvg%3E"); +} +.theme-blue label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-blue input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +.theme-blue label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-blue input[type="radio"]:checked + .item-media i.icon-form-checkbox, +.theme-blue label.label-checkbox input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-blue input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +.theme-blue label.label-checkbox input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-blue input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +.theme-blue label.label-checkbox input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-blue input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +.theme-blue label.label-checkbox input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-blue input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox { + border-color: #2196f3; + background-color: #2196f3; +} +.theme-blue label.label-radio i.icon-form-radio:after, +label.label-radio.theme-blue i.icon-form-radio:after { + background-color: #2196f3; +} +.theme-blue label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-blue input[type="checkbox"]:checked + .item-media i.icon-form-radio, +.theme-blue label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-blue input[type="radio"]:checked + .item-media i.icon-form-radio, +.theme-blue label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-blue input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +.theme-blue label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-blue input[type="radio"]:checked ~ .item-after i.icon-form-radio, +.theme-blue label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-blue input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +.theme-blue label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-blue input[type="radio"]:checked ~ .item-inner i.icon-form-radio { + border-color: #2196f3; +} +.theme-blue label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-blue input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +.theme-blue label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-blue input[type="radio"]:checked + .item-media i.icon-form-radio:after, +.theme-blue label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-blue input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +.theme-blue label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-blue input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +.theme-blue label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-blue input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +.theme-blue label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-blue input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after { + background-color: #2196f3; +} +.theme-blue .focus-state .label, +.theme-blue .focus-state .floating-label { + color: #2196f3; +} +.theme-blue .item-input-field.focus-state:after, +.theme-blue .input-field.focus-state:after, +.theme-blue .item-input-field.not-empty-state:after, +.theme-blue .input-field.not-empty-state:after { + background: #2196f3; +} +.theme-blue .picker-calendar-day.picker-calendar-day-today span { + color: #2196f3; +} +.theme-blue .picker-calendar-day.picker-calendar-day-selected span { + background-color: #2196f3; + color: #fff; +} +.theme-blue .picker-calendar-day.picker-calendar-day-has-events span:after { + background-color: #2196f3; +} +.theme-blue .picker-header { + background-color: #2196f3; +} +.theme-blue .modal-button { + color: #2196f3; +} +.swiper-pagination.color-blue .swiper-pagination-bullet-active, +.theme-blue .swiper-pagination .swiper-pagination-bullet-active { + background-color: #2196f3; +} +.swiper-pagination.color-blue .swiper-pagination-progressbar, +.theme-blue .swiper-pagination .swiper-pagination-progressbar { + background-color: #2196f3; +} +.swiper-pagination.swiper-pagination-progress.bg-blue { + background-color: rgba(33, 150, 243, 0.25); +} +.swiper-button-next.color-blue, +.swiper-container-rtl .swiper-button-prev.color-blue, +.theme-blue .swiper-button-next, +.theme-blue .swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%232196f3'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-prev.color-blue, +.swiper-container-rtl .swiper-button-next.color-blue, +.theme-blue .swiper-button-prev, +.theme-blue .swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%232196f3'%2F%3E%3C%2Fsvg%3E"); +} +.bg-blue, +a.bg-blue, +.list-block .swipeout-actions-left a.bg-blue, +.list-block .swipeout-actions-right a.bg-blue { + background-color: #2196f3; +} +html:not(.watch-active-state) .list-block .bg-blue .item-link:active, +html:not(.watch-active-state) .list-block a.bg-blue .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-left a.bg-blue .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-right a.bg-blue .item-link:active, +html:not(.watch-active-state) .list-block.bg-blue .item-link:active, +html:not(.watch-active-state) .list-blocka.bg-blue .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-left a.bg-blue .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-right a.bg-blue .item-link:active, +html:not(.watch-active-state) .list-block .item-link.bg-blue:active, +html:not(.watch-active-state) .list-block .item-linka.bg-blue:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-left a.bg-blue:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-right a.bg-blue:active, +.list-block .bg-blue .item-link.active-state, +.list-block a.bg-blue .item-link.active-state, +.list-block .list-block .swipeout-actions-left a.bg-blue .item-link.active-state, +.list-block .list-block .swipeout-actions-right a.bg-blue .item-link.active-state, +.list-block.bg-blue .item-link.active-state, +.list-blocka.bg-blue .item-link.active-state, +.list-block.list-block .swipeout-actions-left a.bg-blue .item-link.active-state, +.list-block.list-block .swipeout-actions-right a.bg-blue .item-link.active-state, +.list-block .item-link.bg-blue.active-state, +.list-block .item-linka.bg-blue.active-state, +.list-block .item-link.list-block .swipeout-actions-left a.bg-blue.active-state, +.list-block .item-link.list-block .swipeout-actions-right a.bg-blue.active-state { + background: #1976D2; +} +.border-blue { + border-color: #2196f3; +} +.list-block .border-blue.item-inner:after, +.list-block ul.border-blue:after, +.border-blue:after, +.list-block .border-blue.item-inner:before, +.list-block ul.border-blue:before, +.border-blue:before { + background-color: #2196f3; +} +.theme-blue .floating-button, +.theme-blue .speed-dial-buttons a, +.floating-button.theme-blue, +.speed-dial-buttons a.theme-blue, +.floating-button.color-blue, +.speed-dial-buttons a.color-blue, +.floating-button.bg-blue, +.speed-dial-buttons a.bg-blue { + color: #fff; + background: #2196f3; +} +html:not(.watch-active-state) .theme-blue .floating-button:active, +html:not(.watch-active-state) .theme-blue .speed-dial-buttons a:active, +html:not(.watch-active-state) .floating-button.theme-blue:active, +html:not(.watch-active-state) .speed-dial-buttons a.theme-blue:active, +html:not(.watch-active-state) .floating-button.color-blue:active, +html:not(.watch-active-state) .speed-dial-buttons a.color-blue:active, +html:not(.watch-active-state) .floating-button.bg-blue:active, +html:not(.watch-active-state) .speed-dial-buttons a.bg-blue:active, +.theme-blue .floating-button.active-state, +.theme-blue .speed-dial-buttons a.active-state, +.floating-button.theme-blue.active-state, +.speed-dial-buttons a.theme-blue.active-state, +.floating-button.color-blue.active-state, +.speed-dial-buttons a.color-blue.active-state, +.floating-button.bg-blue.active-state, +.speed-dial-buttons a.bg-blue.active-state { + background: #1976D2; +} +.theme-blue .floating-button i, +.theme-blue .speed-dial-buttons a i, +.floating-button.theme-blue i, +.speed-dial-buttons a.theme-blue i, +.floating-button.color-blue i, +.speed-dial-buttons a.color-blue i, +.floating-button.bg-blue i, +.speed-dial-buttons a.bg-blue i { + color: inherit; +} +.ripple-blue .ripple-wave { + background-color: rgba(33, 150, 243, 0.3); +} +.badge.color-blue, +.badge.theme-blue { + background-color: #2196f3; + color: #fff; +} +.color-lightblue { + color: #03a9f4; +} +.list-block .item-link.list-button.color-lightblue, +.list-block .item-link.color-lightblue, +.tabbar a.active.color-lightblue, +a.color-lightblue { + color: #03a9f4; +} +.label-switch input[type="checkbox"]:checked + .checkbox.color-lightblue, +.label-switch.color-lightblue input[type="checkbox"]:checked + .checkbox { + background-color: #03a9f4; +} +.theme-lightblue .button:not(.button-fill) { + color: #03a9f4; +} +.theme-lightblue .navbar .button:not(.button-fill), +.theme-lightblue.navbar .button:not(.button-fill), +.theme-lightblue .toolbar .button:not(.button-fill), +.theme-lightblue.toolbar .button:not(.button-fill), +.theme-lightblue .subnavbar .button:not(.button-fill), +.theme-lightblue.subnavbar .button:not(.button-fill) { + color: #fff; +} +.button.color-lightblue:not(.button-fill), +.color-lightblue.buttons-row .button:not(.button-fill) { + color: #03a9f4 !important; +} +.theme-lightblue .button.button-fill { + background: #03a9f4; + color: #fff; +} +html:not(.watch-active-state) .theme-lightblue .button.button-fill:active, +.theme-lightblue .button.button-fill.active-state { + background: #0288D1; +} +.button.button-fill.bg-lightblue, +.button.button-fill.color-lightblue { + background: #03a9f4 !important; + color: #fff; +} +html:not(.watch-active-state) .button.button-fill.bg-lightblue:active, +html:not(.watch-active-state) .button.button-fill.color-lightblue:active, +.button.button-fill.bg-lightblue.active-state, +.button.button-fill.color-lightblue.active-state { + background: #0288D1 !important; +} +.progressbar.color-lightblue, +.progressbar.theme-lightblue, +.theme-lightblue .progressbar, +.progressbar.bg-lightblue { + background-color: rgba(3, 169, 244, 0.5); +} +.progressbar.color-lightblue span, +.progressbar.theme-lightblue span, +.theme-lightblue .progressbar span, +.progressbar.bg-lightblue span { + background-color: #03a9f4; +} +.progressbar-infinite.color-lightblue, +.progressbar-infinite.theme-lightblue, +.theme-lightblue .progressbar-infinite, +.progressbar-infinite.bg-lightblue { + background-color: rgba(3, 169, 244, 0.5); +} +.progressbar-infinite.color-lightblue:after, +.progressbar-infinite.theme-lightblue:after, +.theme-lightblue .progressbar-infinite:after, +.progressbar-infinite.bg-lightblue:after, +.progressbar-infinite.color-lightblue:before, +.progressbar-infinite.theme-lightblue:before, +.theme-lightblue .progressbar-infinite:before, +.progressbar-infinite.bg-lightblue:before { + background-color: #03a9f4; +} +.color-lightblue i.icon, +i.icon.color-lightblue { + color: #03a9f4; +} +i.icon-next.color-lightblue, +i.icon-next.theme-lightblue { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%2303a9f4'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-lightblue, +i.icon-prev.theme-lightblue { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%2303a9f4'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-lightblue, +i.icon-back.theme-lightblue { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%2303a9f4'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-lightblue, +i.icon-forward.theme-lightblue { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%2303a9f4'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-bars.color-lightblue, +i.icon-bars.theme-lightblue { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M3%2018h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z'%20fill%3D'%2303a9f4'%2F%3E%3C%2Fsvg%3E"); +} +.preloader.color-lightblue svg circle, +.preloader.preloader-lightblue svg circle { + stroke: #03a9f4; +} +.preloader.color-lightblue .preloader-inner-gap, +.preloader.preloader-lightblue .preloader-inner-gap, +.preloader.color-lightblue .preloader-inner-half-circle, +.preloader.preloader-lightblue .preloader-inner-half-circle { + border-color: #03a9f4; +} +.theme-lightblue a { + color: #03a9f4; +} +.theme-lightblue .navbar, +.navbar.theme-lightblue, +.theme-lightblue .toolbar, +.toolbar.theme-lightblue, +.theme-lightblue .subnavbar, +.subnavbar.theme-lightblue, +.theme-lightblue .searchbar, +.searchbar.theme-lightblue { + background-color: #03a9f4; +} +.theme-lightblue .range-slider input[type="range"]::-webkit-slider-thumb:before, +.range-slider.theme-lightblue input[type="range"]::-webkit-slider-thumb:before { + background-color: #03a9f4; +} +.theme-lightblue .range-slider input[type="range"]::-webkit-slider-thumb, +.range-slider.theme-lightblue input[type="range"]::-webkit-slider-thumb { + background-color: #03a9f4; +} +.theme-lightblue .range-slider input[type="range"]::-ms-thumb, +.range-slider.theme-lightblue input[type="range"]::-ms-thumb { + background-color: #03a9f4; +} +.theme-lightblue .range-slider input[type="range"]::-ms-fill-lower, +.range-slider.theme-lightblue input[type="range"]::-ms-fill-lower { + background-color: #03a9f4; +} +.theme-lightblue .range-slider input[type="range"]::-moz-range-thumb, +.range-slider.theme-lightblue input[type="range"]::-moz-range-thumb { + background-color: #03a9f4; +} +.theme-lightblue .label-switch input[type="checkbox"]:checked + .checkbox, +.label-switch.theme-lightblue input[type="checkbox"]:checked + .checkbox { + background-color: rgba(3, 169, 244, 0.5); +} +.theme-lightblue .label-switch input[type="checkbox"]:checked + .checkbox:after, +.label-switch.theme-lightblue input[type="checkbox"]:checked + .checkbox:after { + background-color: #03a9f4; +} +.theme-lightblue label.label-checkbox, +label.label-checkbox.theme-lightblue { + cursor: pointer; +} +.theme-lightblue label.label-checkbox i.icon-form-checkbox:after, +label.label-checkbox.theme-lightblue i.icon-form-checkbox:after { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M9%2016.17L4.83%2012l-1.42%201.41L9%2019%2021%207l-1.41-1.41z'%2F%3E%3C%2Fsvg%3E"); +} +.theme-lightblue label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-lightblue input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +.theme-lightblue label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-lightblue input[type="radio"]:checked + .item-media i.icon-form-checkbox, +.theme-lightblue label.label-checkbox input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-lightblue input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +.theme-lightblue label.label-checkbox input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-lightblue input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +.theme-lightblue label.label-checkbox input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-lightblue input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +.theme-lightblue label.label-checkbox input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-lightblue input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox { + border-color: #03a9f4; + background-color: #03a9f4; +} +.theme-lightblue label.label-radio i.icon-form-radio:after, +label.label-radio.theme-lightblue i.icon-form-radio:after { + background-color: #03a9f4; +} +.theme-lightblue label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-lightblue input[type="checkbox"]:checked + .item-media i.icon-form-radio, +.theme-lightblue label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-lightblue input[type="radio"]:checked + .item-media i.icon-form-radio, +.theme-lightblue label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-lightblue input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +.theme-lightblue label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-lightblue input[type="radio"]:checked ~ .item-after i.icon-form-radio, +.theme-lightblue label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-lightblue input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +.theme-lightblue label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-lightblue input[type="radio"]:checked ~ .item-inner i.icon-form-radio { + border-color: #03a9f4; +} +.theme-lightblue label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-lightblue input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +.theme-lightblue label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-lightblue input[type="radio"]:checked + .item-media i.icon-form-radio:after, +.theme-lightblue label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-lightblue input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +.theme-lightblue label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-lightblue input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +.theme-lightblue label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-lightblue input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +.theme-lightblue label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-lightblue input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after { + background-color: #03a9f4; +} +.theme-lightblue .focus-state .label, +.theme-lightblue .focus-state .floating-label { + color: #03a9f4; +} +.theme-lightblue .item-input-field.focus-state:after, +.theme-lightblue .input-field.focus-state:after, +.theme-lightblue .item-input-field.not-empty-state:after, +.theme-lightblue .input-field.not-empty-state:after { + background: #03a9f4; +} +.theme-lightblue .picker-calendar-day.picker-calendar-day-today span { + color: #03a9f4; +} +.theme-lightblue .picker-calendar-day.picker-calendar-day-selected span { + background-color: #03a9f4; + color: #fff; +} +.theme-lightblue .picker-calendar-day.picker-calendar-day-has-events span:after { + background-color: #03a9f4; +} +.theme-lightblue .picker-header { + background-color: #03a9f4; +} +.theme-lightblue .modal-button { + color: #03a9f4; +} +.swiper-pagination.color-lightblue .swiper-pagination-bullet-active, +.theme-lightblue .swiper-pagination .swiper-pagination-bullet-active { + background-color: #03a9f4; +} +.swiper-pagination.color-lightblue .swiper-pagination-progressbar, +.theme-lightblue .swiper-pagination .swiper-pagination-progressbar { + background-color: #03a9f4; +} +.swiper-pagination.swiper-pagination-progress.bg-lightblue { + background-color: rgba(3, 169, 244, 0.25); +} +.swiper-button-next.color-lightblue, +.swiper-container-rtl .swiper-button-prev.color-lightblue, +.theme-lightblue .swiper-button-next, +.theme-lightblue .swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%2303a9f4'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-prev.color-lightblue, +.swiper-container-rtl .swiper-button-next.color-lightblue, +.theme-lightblue .swiper-button-prev, +.theme-lightblue .swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%2303a9f4'%2F%3E%3C%2Fsvg%3E"); +} +.bg-lightblue, +a.bg-lightblue, +.list-block .swipeout-actions-left a.bg-lightblue, +.list-block .swipeout-actions-right a.bg-lightblue { + background-color: #03a9f4; +} +html:not(.watch-active-state) .list-block .bg-lightblue .item-link:active, +html:not(.watch-active-state) .list-block a.bg-lightblue .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-left a.bg-lightblue .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-right a.bg-lightblue .item-link:active, +html:not(.watch-active-state) .list-block.bg-lightblue .item-link:active, +html:not(.watch-active-state) .list-blocka.bg-lightblue .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-left a.bg-lightblue .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-right a.bg-lightblue .item-link:active, +html:not(.watch-active-state) .list-block .item-link.bg-lightblue:active, +html:not(.watch-active-state) .list-block .item-linka.bg-lightblue:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-left a.bg-lightblue:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-right a.bg-lightblue:active, +.list-block .bg-lightblue .item-link.active-state, +.list-block a.bg-lightblue .item-link.active-state, +.list-block .list-block .swipeout-actions-left a.bg-lightblue .item-link.active-state, +.list-block .list-block .swipeout-actions-right a.bg-lightblue .item-link.active-state, +.list-block.bg-lightblue .item-link.active-state, +.list-blocka.bg-lightblue .item-link.active-state, +.list-block.list-block .swipeout-actions-left a.bg-lightblue .item-link.active-state, +.list-block.list-block .swipeout-actions-right a.bg-lightblue .item-link.active-state, +.list-block .item-link.bg-lightblue.active-state, +.list-block .item-linka.bg-lightblue.active-state, +.list-block .item-link.list-block .swipeout-actions-left a.bg-lightblue.active-state, +.list-block .item-link.list-block .swipeout-actions-right a.bg-lightblue.active-state { + background: #0288D1; +} +.border-lightblue { + border-color: #03a9f4; +} +.list-block .border-lightblue.item-inner:after, +.list-block ul.border-lightblue:after, +.border-lightblue:after, +.list-block .border-lightblue.item-inner:before, +.list-block ul.border-lightblue:before, +.border-lightblue:before { + background-color: #03a9f4; +} +.theme-lightblue .floating-button, +.theme-lightblue .speed-dial-buttons a, +.floating-button.theme-lightblue, +.speed-dial-buttons a.theme-lightblue, +.floating-button.color-lightblue, +.speed-dial-buttons a.color-lightblue, +.floating-button.bg-lightblue, +.speed-dial-buttons a.bg-lightblue { + color: #fff; + background: #03a9f4; +} +html:not(.watch-active-state) .theme-lightblue .floating-button:active, +html:not(.watch-active-state) .theme-lightblue .speed-dial-buttons a:active, +html:not(.watch-active-state) .floating-button.theme-lightblue:active, +html:not(.watch-active-state) .speed-dial-buttons a.theme-lightblue:active, +html:not(.watch-active-state) .floating-button.color-lightblue:active, +html:not(.watch-active-state) .speed-dial-buttons a.color-lightblue:active, +html:not(.watch-active-state) .floating-button.bg-lightblue:active, +html:not(.watch-active-state) .speed-dial-buttons a.bg-lightblue:active, +.theme-lightblue .floating-button.active-state, +.theme-lightblue .speed-dial-buttons a.active-state, +.floating-button.theme-lightblue.active-state, +.speed-dial-buttons a.theme-lightblue.active-state, +.floating-button.color-lightblue.active-state, +.speed-dial-buttons a.color-lightblue.active-state, +.floating-button.bg-lightblue.active-state, +.speed-dial-buttons a.bg-lightblue.active-state { + background: #0288D1; +} +.theme-lightblue .floating-button i, +.theme-lightblue .speed-dial-buttons a i, +.floating-button.theme-lightblue i, +.speed-dial-buttons a.theme-lightblue i, +.floating-button.color-lightblue i, +.speed-dial-buttons a.color-lightblue i, +.floating-button.bg-lightblue i, +.speed-dial-buttons a.bg-lightblue i { + color: inherit; +} +.ripple-lightblue .ripple-wave { + background-color: rgba(3, 169, 244, 0.3); +} +.badge.color-lightblue, +.badge.theme-lightblue { + background-color: #03a9f4; + color: #fff; +} +.color-cyan { + color: #00bcd4; +} +.list-block .item-link.list-button.color-cyan, +.list-block .item-link.color-cyan, +.tabbar a.active.color-cyan, +a.color-cyan { + color: #00bcd4; +} +.label-switch input[type="checkbox"]:checked + .checkbox.color-cyan, +.label-switch.color-cyan input[type="checkbox"]:checked + .checkbox { + background-color: #00bcd4; +} +.theme-cyan .button:not(.button-fill) { + color: #00bcd4; +} +.theme-cyan .navbar .button:not(.button-fill), +.theme-cyan.navbar .button:not(.button-fill), +.theme-cyan .toolbar .button:not(.button-fill), +.theme-cyan.toolbar .button:not(.button-fill), +.theme-cyan .subnavbar .button:not(.button-fill), +.theme-cyan.subnavbar .button:not(.button-fill) { + color: #fff; +} +.button.color-cyan:not(.button-fill), +.color-cyan.buttons-row .button:not(.button-fill) { + color: #00bcd4 !important; +} +.theme-cyan .button.button-fill { + background: #00bcd4; + color: #fff; +} +html:not(.watch-active-state) .theme-cyan .button.button-fill:active, +.theme-cyan .button.button-fill.active-state { + background: #0097A7; +} +.button.button-fill.bg-cyan, +.button.button-fill.color-cyan { + background: #00bcd4 !important; + color: #fff; +} +html:not(.watch-active-state) .button.button-fill.bg-cyan:active, +html:not(.watch-active-state) .button.button-fill.color-cyan:active, +.button.button-fill.bg-cyan.active-state, +.button.button-fill.color-cyan.active-state { + background: #0097A7 !important; +} +.progressbar.color-cyan, +.progressbar.theme-cyan, +.theme-cyan .progressbar, +.progressbar.bg-cyan { + background-color: rgba(0, 188, 212, 0.5); +} +.progressbar.color-cyan span, +.progressbar.theme-cyan span, +.theme-cyan .progressbar span, +.progressbar.bg-cyan span { + background-color: #00bcd4; +} +.progressbar-infinite.color-cyan, +.progressbar-infinite.theme-cyan, +.theme-cyan .progressbar-infinite, +.progressbar-infinite.bg-cyan { + background-color: rgba(0, 188, 212, 0.5); +} +.progressbar-infinite.color-cyan:after, +.progressbar-infinite.theme-cyan:after, +.theme-cyan .progressbar-infinite:after, +.progressbar-infinite.bg-cyan:after, +.progressbar-infinite.color-cyan:before, +.progressbar-infinite.theme-cyan:before, +.theme-cyan .progressbar-infinite:before, +.progressbar-infinite.bg-cyan:before { + background-color: #00bcd4; +} +.color-cyan i.icon, +i.icon.color-cyan { + color: #00bcd4; +} +i.icon-next.color-cyan, +i.icon-next.theme-cyan { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%2300bcd4'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-cyan, +i.icon-prev.theme-cyan { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%2300bcd4'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-cyan, +i.icon-back.theme-cyan { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%2300bcd4'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-cyan, +i.icon-forward.theme-cyan { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%2300bcd4'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-bars.color-cyan, +i.icon-bars.theme-cyan { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M3%2018h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z'%20fill%3D'%2300bcd4'%2F%3E%3C%2Fsvg%3E"); +} +.preloader.color-cyan svg circle, +.preloader.preloader-cyan svg circle { + stroke: #00bcd4; +} +.preloader.color-cyan .preloader-inner-gap, +.preloader.preloader-cyan .preloader-inner-gap, +.preloader.color-cyan .preloader-inner-half-circle, +.preloader.preloader-cyan .preloader-inner-half-circle { + border-color: #00bcd4; +} +.theme-cyan a { + color: #00bcd4; +} +.theme-cyan .navbar, +.navbar.theme-cyan, +.theme-cyan .toolbar, +.toolbar.theme-cyan, +.theme-cyan .subnavbar, +.subnavbar.theme-cyan, +.theme-cyan .searchbar, +.searchbar.theme-cyan { + background-color: #00bcd4; +} +.theme-cyan .range-slider input[type="range"]::-webkit-slider-thumb:before, +.range-slider.theme-cyan input[type="range"]::-webkit-slider-thumb:before { + background-color: #00bcd4; +} +.theme-cyan .range-slider input[type="range"]::-webkit-slider-thumb, +.range-slider.theme-cyan input[type="range"]::-webkit-slider-thumb { + background-color: #00bcd4; +} +.theme-cyan .range-slider input[type="range"]::-ms-thumb, +.range-slider.theme-cyan input[type="range"]::-ms-thumb { + background-color: #00bcd4; +} +.theme-cyan .range-slider input[type="range"]::-ms-fill-lower, +.range-slider.theme-cyan input[type="range"]::-ms-fill-lower { + background-color: #00bcd4; +} +.theme-cyan .range-slider input[type="range"]::-moz-range-thumb, +.range-slider.theme-cyan input[type="range"]::-moz-range-thumb { + background-color: #00bcd4; +} +.theme-cyan .label-switch input[type="checkbox"]:checked + .checkbox, +.label-switch.theme-cyan input[type="checkbox"]:checked + .checkbox { + background-color: rgba(0, 188, 212, 0.5); +} +.theme-cyan .label-switch input[type="checkbox"]:checked + .checkbox:after, +.label-switch.theme-cyan input[type="checkbox"]:checked + .checkbox:after { + background-color: #00bcd4; +} +.theme-cyan label.label-checkbox, +label.label-checkbox.theme-cyan { + cursor: pointer; +} +.theme-cyan label.label-checkbox i.icon-form-checkbox:after, +label.label-checkbox.theme-cyan i.icon-form-checkbox:after { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M9%2016.17L4.83%2012l-1.42%201.41L9%2019%2021%207l-1.41-1.41z'%2F%3E%3C%2Fsvg%3E"); +} +.theme-cyan label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-cyan input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +.theme-cyan label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-cyan input[type="radio"]:checked + .item-media i.icon-form-checkbox, +.theme-cyan label.label-checkbox input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-cyan input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +.theme-cyan label.label-checkbox input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-cyan input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +.theme-cyan label.label-checkbox input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-cyan input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +.theme-cyan label.label-checkbox input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-cyan input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox { + border-color: #00bcd4; + background-color: #00bcd4; +} +.theme-cyan label.label-radio i.icon-form-radio:after, +label.label-radio.theme-cyan i.icon-form-radio:after { + background-color: #00bcd4; +} +.theme-cyan label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-cyan input[type="checkbox"]:checked + .item-media i.icon-form-radio, +.theme-cyan label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-cyan input[type="radio"]:checked + .item-media i.icon-form-radio, +.theme-cyan label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-cyan input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +.theme-cyan label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-cyan input[type="radio"]:checked ~ .item-after i.icon-form-radio, +.theme-cyan label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-cyan input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +.theme-cyan label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-cyan input[type="radio"]:checked ~ .item-inner i.icon-form-radio { + border-color: #00bcd4; +} +.theme-cyan label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-cyan input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +.theme-cyan label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-cyan input[type="radio"]:checked + .item-media i.icon-form-radio:after, +.theme-cyan label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-cyan input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +.theme-cyan label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-cyan input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +.theme-cyan label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-cyan input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +.theme-cyan label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-cyan input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after { + background-color: #00bcd4; +} +.theme-cyan .focus-state .label, +.theme-cyan .focus-state .floating-label { + color: #00bcd4; +} +.theme-cyan .item-input-field.focus-state:after, +.theme-cyan .input-field.focus-state:after, +.theme-cyan .item-input-field.not-empty-state:after, +.theme-cyan .input-field.not-empty-state:after { + background: #00bcd4; +} +.theme-cyan .picker-calendar-day.picker-calendar-day-today span { + color: #00bcd4; +} +.theme-cyan .picker-calendar-day.picker-calendar-day-selected span { + background-color: #00bcd4; + color: #fff; +} +.theme-cyan .picker-calendar-day.picker-calendar-day-has-events span:after { + background-color: #00bcd4; +} +.theme-cyan .picker-header { + background-color: #00bcd4; +} +.theme-cyan .modal-button { + color: #00bcd4; +} +.swiper-pagination.color-cyan .swiper-pagination-bullet-active, +.theme-cyan .swiper-pagination .swiper-pagination-bullet-active { + background-color: #00bcd4; +} +.swiper-pagination.color-cyan .swiper-pagination-progressbar, +.theme-cyan .swiper-pagination .swiper-pagination-progressbar { + background-color: #00bcd4; +} +.swiper-pagination.swiper-pagination-progress.bg-cyan { + background-color: rgba(0, 188, 212, 0.25); +} +.swiper-button-next.color-cyan, +.swiper-container-rtl .swiper-button-prev.color-cyan, +.theme-cyan .swiper-button-next, +.theme-cyan .swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%2300bcd4'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-prev.color-cyan, +.swiper-container-rtl .swiper-button-next.color-cyan, +.theme-cyan .swiper-button-prev, +.theme-cyan .swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%2300bcd4'%2F%3E%3C%2Fsvg%3E"); +} +.bg-cyan, +a.bg-cyan, +.list-block .swipeout-actions-left a.bg-cyan, +.list-block .swipeout-actions-right a.bg-cyan { + background-color: #00bcd4; +} +html:not(.watch-active-state) .list-block .bg-cyan .item-link:active, +html:not(.watch-active-state) .list-block a.bg-cyan .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-left a.bg-cyan .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-right a.bg-cyan .item-link:active, +html:not(.watch-active-state) .list-block.bg-cyan .item-link:active, +html:not(.watch-active-state) .list-blocka.bg-cyan .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-left a.bg-cyan .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-right a.bg-cyan .item-link:active, +html:not(.watch-active-state) .list-block .item-link.bg-cyan:active, +html:not(.watch-active-state) .list-block .item-linka.bg-cyan:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-left a.bg-cyan:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-right a.bg-cyan:active, +.list-block .bg-cyan .item-link.active-state, +.list-block a.bg-cyan .item-link.active-state, +.list-block .list-block .swipeout-actions-left a.bg-cyan .item-link.active-state, +.list-block .list-block .swipeout-actions-right a.bg-cyan .item-link.active-state, +.list-block.bg-cyan .item-link.active-state, +.list-blocka.bg-cyan .item-link.active-state, +.list-block.list-block .swipeout-actions-left a.bg-cyan .item-link.active-state, +.list-block.list-block .swipeout-actions-right a.bg-cyan .item-link.active-state, +.list-block .item-link.bg-cyan.active-state, +.list-block .item-linka.bg-cyan.active-state, +.list-block .item-link.list-block .swipeout-actions-left a.bg-cyan.active-state, +.list-block .item-link.list-block .swipeout-actions-right a.bg-cyan.active-state { + background: #0097A7; +} +.border-cyan { + border-color: #00bcd4; +} +.list-block .border-cyan.item-inner:after, +.list-block ul.border-cyan:after, +.border-cyan:after, +.list-block .border-cyan.item-inner:before, +.list-block ul.border-cyan:before, +.border-cyan:before { + background-color: #00bcd4; +} +.theme-cyan .floating-button, +.theme-cyan .speed-dial-buttons a, +.floating-button.theme-cyan, +.speed-dial-buttons a.theme-cyan, +.floating-button.color-cyan, +.speed-dial-buttons a.color-cyan, +.floating-button.bg-cyan, +.speed-dial-buttons a.bg-cyan { + color: #fff; + background: #00bcd4; +} +html:not(.watch-active-state) .theme-cyan .floating-button:active, +html:not(.watch-active-state) .theme-cyan .speed-dial-buttons a:active, +html:not(.watch-active-state) .floating-button.theme-cyan:active, +html:not(.watch-active-state) .speed-dial-buttons a.theme-cyan:active, +html:not(.watch-active-state) .floating-button.color-cyan:active, +html:not(.watch-active-state) .speed-dial-buttons a.color-cyan:active, +html:not(.watch-active-state) .floating-button.bg-cyan:active, +html:not(.watch-active-state) .speed-dial-buttons a.bg-cyan:active, +.theme-cyan .floating-button.active-state, +.theme-cyan .speed-dial-buttons a.active-state, +.floating-button.theme-cyan.active-state, +.speed-dial-buttons a.theme-cyan.active-state, +.floating-button.color-cyan.active-state, +.speed-dial-buttons a.color-cyan.active-state, +.floating-button.bg-cyan.active-state, +.speed-dial-buttons a.bg-cyan.active-state { + background: #0097A7; +} +.theme-cyan .floating-button i, +.theme-cyan .speed-dial-buttons a i, +.floating-button.theme-cyan i, +.speed-dial-buttons a.theme-cyan i, +.floating-button.color-cyan i, +.speed-dial-buttons a.color-cyan i, +.floating-button.bg-cyan i, +.speed-dial-buttons a.bg-cyan i { + color: inherit; +} +.ripple-cyan .ripple-wave { + background-color: rgba(0, 188, 212, 0.3); +} +.badge.color-cyan, +.badge.theme-cyan { + background-color: #00bcd4; + color: #fff; +} +.color-teal { + color: #009688; +} +.list-block .item-link.list-button.color-teal, +.list-block .item-link.color-teal, +.tabbar a.active.color-teal, +a.color-teal { + color: #009688; +} +.label-switch input[type="checkbox"]:checked + .checkbox.color-teal, +.label-switch.color-teal input[type="checkbox"]:checked + .checkbox { + background-color: #009688; +} +.theme-teal .button:not(.button-fill) { + color: #009688; +} +.theme-teal .navbar .button:not(.button-fill), +.theme-teal.navbar .button:not(.button-fill), +.theme-teal .toolbar .button:not(.button-fill), +.theme-teal.toolbar .button:not(.button-fill), +.theme-teal .subnavbar .button:not(.button-fill), +.theme-teal.subnavbar .button:not(.button-fill) { + color: #fff; +} +.button.color-teal:not(.button-fill), +.color-teal.buttons-row .button:not(.button-fill) { + color: #009688 !important; +} +.theme-teal .button.button-fill { + background: #009688; + color: #fff; +} +html:not(.watch-active-state) .theme-teal .button.button-fill:active, +.theme-teal .button.button-fill.active-state { + background: #00897B; +} +.button.button-fill.bg-teal, +.button.button-fill.color-teal { + background: #009688 !important; + color: #fff; +} +html:not(.watch-active-state) .button.button-fill.bg-teal:active, +html:not(.watch-active-state) .button.button-fill.color-teal:active, +.button.button-fill.bg-teal.active-state, +.button.button-fill.color-teal.active-state { + background: #00897B !important; +} +.progressbar.color-teal, +.progressbar.theme-teal, +.theme-teal .progressbar, +.progressbar.bg-teal { + background-color: rgba(0, 150, 136, 0.5); +} +.progressbar.color-teal span, +.progressbar.theme-teal span, +.theme-teal .progressbar span, +.progressbar.bg-teal span { + background-color: #009688; +} +.progressbar-infinite.color-teal, +.progressbar-infinite.theme-teal, +.theme-teal .progressbar-infinite, +.progressbar-infinite.bg-teal { + background-color: rgba(0, 150, 136, 0.5); +} +.progressbar-infinite.color-teal:after, +.progressbar-infinite.theme-teal:after, +.theme-teal .progressbar-infinite:after, +.progressbar-infinite.bg-teal:after, +.progressbar-infinite.color-teal:before, +.progressbar-infinite.theme-teal:before, +.theme-teal .progressbar-infinite:before, +.progressbar-infinite.bg-teal:before { + background-color: #009688; +} +.color-teal i.icon, +i.icon.color-teal { + color: #009688; +} +i.icon-next.color-teal, +i.icon-next.theme-teal { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23009688'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-teal, +i.icon-prev.theme-teal { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23009688'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-teal, +i.icon-back.theme-teal { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23009688'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-teal, +i.icon-forward.theme-teal { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23009688'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-bars.color-teal, +i.icon-bars.theme-teal { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M3%2018h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z'%20fill%3D'%23009688'%2F%3E%3C%2Fsvg%3E"); +} +.preloader.color-teal svg circle, +.preloader.preloader-teal svg circle { + stroke: #009688; +} +.preloader.color-teal .preloader-inner-gap, +.preloader.preloader-teal .preloader-inner-gap, +.preloader.color-teal .preloader-inner-half-circle, +.preloader.preloader-teal .preloader-inner-half-circle { + border-color: #009688; +} +.theme-teal a { + color: #009688; +} +.theme-teal .navbar, +.navbar.theme-teal, +.theme-teal .toolbar, +.toolbar.theme-teal, +.theme-teal .subnavbar, +.subnavbar.theme-teal, +.theme-teal .searchbar, +.searchbar.theme-teal { + background-color: #009688; +} +.theme-teal .range-slider input[type="range"]::-webkit-slider-thumb:before, +.range-slider.theme-teal input[type="range"]::-webkit-slider-thumb:before { + background-color: #009688; +} +.theme-teal .range-slider input[type="range"]::-webkit-slider-thumb, +.range-slider.theme-teal input[type="range"]::-webkit-slider-thumb { + background-color: #009688; +} +.theme-teal .range-slider input[type="range"]::-ms-thumb, +.range-slider.theme-teal input[type="range"]::-ms-thumb { + background-color: #009688; +} +.theme-teal .range-slider input[type="range"]::-ms-fill-lower, +.range-slider.theme-teal input[type="range"]::-ms-fill-lower { + background-color: #009688; +} +.theme-teal .range-slider input[type="range"]::-moz-range-thumb, +.range-slider.theme-teal input[type="range"]::-moz-range-thumb { + background-color: #009688; +} +.theme-teal .label-switch input[type="checkbox"]:checked + .checkbox, +.label-switch.theme-teal input[type="checkbox"]:checked + .checkbox { + background-color: rgba(0, 150, 136, 0.5); +} +.theme-teal .label-switch input[type="checkbox"]:checked + .checkbox:after, +.label-switch.theme-teal input[type="checkbox"]:checked + .checkbox:after { + background-color: #009688; +} +.theme-teal label.label-checkbox, +label.label-checkbox.theme-teal { + cursor: pointer; +} +.theme-teal label.label-checkbox i.icon-form-checkbox:after, +label.label-checkbox.theme-teal i.icon-form-checkbox:after { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M9%2016.17L4.83%2012l-1.42%201.41L9%2019%2021%207l-1.41-1.41z'%2F%3E%3C%2Fsvg%3E"); +} +.theme-teal label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-teal input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +.theme-teal label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-teal input[type="radio"]:checked + .item-media i.icon-form-checkbox, +.theme-teal label.label-checkbox input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-teal input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +.theme-teal label.label-checkbox input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-teal input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +.theme-teal label.label-checkbox input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-teal input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +.theme-teal label.label-checkbox input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-teal input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox { + border-color: #009688; + background-color: #009688; +} +.theme-teal label.label-radio i.icon-form-radio:after, +label.label-radio.theme-teal i.icon-form-radio:after { + background-color: #009688; +} +.theme-teal label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-teal input[type="checkbox"]:checked + .item-media i.icon-form-radio, +.theme-teal label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-teal input[type="radio"]:checked + .item-media i.icon-form-radio, +.theme-teal label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-teal input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +.theme-teal label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-teal input[type="radio"]:checked ~ .item-after i.icon-form-radio, +.theme-teal label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-teal input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +.theme-teal label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-teal input[type="radio"]:checked ~ .item-inner i.icon-form-radio { + border-color: #009688; +} +.theme-teal label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-teal input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +.theme-teal label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-teal input[type="radio"]:checked + .item-media i.icon-form-radio:after, +.theme-teal label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-teal input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +.theme-teal label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-teal input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +.theme-teal label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-teal input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +.theme-teal label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-teal input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after { + background-color: #009688; +} +.theme-teal .focus-state .label, +.theme-teal .focus-state .floating-label { + color: #009688; +} +.theme-teal .item-input-field.focus-state:after, +.theme-teal .input-field.focus-state:after, +.theme-teal .item-input-field.not-empty-state:after, +.theme-teal .input-field.not-empty-state:after { + background: #009688; +} +.theme-teal .picker-calendar-day.picker-calendar-day-today span { + color: #009688; +} +.theme-teal .picker-calendar-day.picker-calendar-day-selected span { + background-color: #009688; + color: #fff; +} +.theme-teal .picker-calendar-day.picker-calendar-day-has-events span:after { + background-color: #009688; +} +.theme-teal .picker-header { + background-color: #009688; +} +.theme-teal .modal-button { + color: #009688; +} +.swiper-pagination.color-teal .swiper-pagination-bullet-active, +.theme-teal .swiper-pagination .swiper-pagination-bullet-active { + background-color: #009688; +} +.swiper-pagination.color-teal .swiper-pagination-progressbar, +.theme-teal .swiper-pagination .swiper-pagination-progressbar { + background-color: #009688; +} +.swiper-pagination.swiper-pagination-progress.bg-teal { + background-color: rgba(0, 150, 136, 0.25); +} +.swiper-button-next.color-teal, +.swiper-container-rtl .swiper-button-prev.color-teal, +.theme-teal .swiper-button-next, +.theme-teal .swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23009688'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-prev.color-teal, +.swiper-container-rtl .swiper-button-next.color-teal, +.theme-teal .swiper-button-prev, +.theme-teal .swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23009688'%2F%3E%3C%2Fsvg%3E"); +} +.bg-teal, +a.bg-teal, +.list-block .swipeout-actions-left a.bg-teal, +.list-block .swipeout-actions-right a.bg-teal { + background-color: #009688; +} +html:not(.watch-active-state) .list-block .bg-teal .item-link:active, +html:not(.watch-active-state) .list-block a.bg-teal .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-left a.bg-teal .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-right a.bg-teal .item-link:active, +html:not(.watch-active-state) .list-block.bg-teal .item-link:active, +html:not(.watch-active-state) .list-blocka.bg-teal .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-left a.bg-teal .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-right a.bg-teal .item-link:active, +html:not(.watch-active-state) .list-block .item-link.bg-teal:active, +html:not(.watch-active-state) .list-block .item-linka.bg-teal:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-left a.bg-teal:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-right a.bg-teal:active, +.list-block .bg-teal .item-link.active-state, +.list-block a.bg-teal .item-link.active-state, +.list-block .list-block .swipeout-actions-left a.bg-teal .item-link.active-state, +.list-block .list-block .swipeout-actions-right a.bg-teal .item-link.active-state, +.list-block.bg-teal .item-link.active-state, +.list-blocka.bg-teal .item-link.active-state, +.list-block.list-block .swipeout-actions-left a.bg-teal .item-link.active-state, +.list-block.list-block .swipeout-actions-right a.bg-teal .item-link.active-state, +.list-block .item-link.bg-teal.active-state, +.list-block .item-linka.bg-teal.active-state, +.list-block .item-link.list-block .swipeout-actions-left a.bg-teal.active-state, +.list-block .item-link.list-block .swipeout-actions-right a.bg-teal.active-state { + background: #00897B; +} +.border-teal { + border-color: #009688; +} +.list-block .border-teal.item-inner:after, +.list-block ul.border-teal:after, +.border-teal:after, +.list-block .border-teal.item-inner:before, +.list-block ul.border-teal:before, +.border-teal:before { + background-color: #009688; +} +.theme-teal .floating-button, +.theme-teal .speed-dial-buttons a, +.floating-button.theme-teal, +.speed-dial-buttons a.theme-teal, +.floating-button.color-teal, +.speed-dial-buttons a.color-teal, +.floating-button.bg-teal, +.speed-dial-buttons a.bg-teal { + color: #fff; + background: #009688; +} +html:not(.watch-active-state) .theme-teal .floating-button:active, +html:not(.watch-active-state) .theme-teal .speed-dial-buttons a:active, +html:not(.watch-active-state) .floating-button.theme-teal:active, +html:not(.watch-active-state) .speed-dial-buttons a.theme-teal:active, +html:not(.watch-active-state) .floating-button.color-teal:active, +html:not(.watch-active-state) .speed-dial-buttons a.color-teal:active, +html:not(.watch-active-state) .floating-button.bg-teal:active, +html:not(.watch-active-state) .speed-dial-buttons a.bg-teal:active, +.theme-teal .floating-button.active-state, +.theme-teal .speed-dial-buttons a.active-state, +.floating-button.theme-teal.active-state, +.speed-dial-buttons a.theme-teal.active-state, +.floating-button.color-teal.active-state, +.speed-dial-buttons a.color-teal.active-state, +.floating-button.bg-teal.active-state, +.speed-dial-buttons a.bg-teal.active-state { + background: #00897B; +} +.theme-teal .floating-button i, +.theme-teal .speed-dial-buttons a i, +.floating-button.theme-teal i, +.speed-dial-buttons a.theme-teal i, +.floating-button.color-teal i, +.speed-dial-buttons a.color-teal i, +.floating-button.bg-teal i, +.speed-dial-buttons a.bg-teal i { + color: inherit; +} +.ripple-teal .ripple-wave { + background-color: rgba(0, 150, 136, 0.3); +} +.badge.color-teal, +.badge.theme-teal { + background-color: #009688; + color: #fff; +} +.color-green { + color: #4caf50; +} +.list-block .item-link.list-button.color-green, +.list-block .item-link.color-green, +.tabbar a.active.color-green, +a.color-green { + color: #4caf50; +} +.label-switch input[type="checkbox"]:checked + .checkbox.color-green, +.label-switch.color-green input[type="checkbox"]:checked + .checkbox { + background-color: #4caf50; +} +.theme-green .button:not(.button-fill) { + color: #4caf50; +} +.theme-green .navbar .button:not(.button-fill), +.theme-green.navbar .button:not(.button-fill), +.theme-green .toolbar .button:not(.button-fill), +.theme-green.toolbar .button:not(.button-fill), +.theme-green .subnavbar .button:not(.button-fill), +.theme-green.subnavbar .button:not(.button-fill) { + color: #fff; +} +.button.color-green:not(.button-fill), +.color-green.buttons-row .button:not(.button-fill) { + color: #4caf50 !important; +} +.theme-green .button.button-fill { + background: #4caf50; + color: #fff; +} +html:not(.watch-active-state) .theme-green .button.button-fill:active, +.theme-green .button.button-fill.active-state { + background: #388E3C; +} +.button.button-fill.bg-green, +.button.button-fill.color-green { + background: #4caf50 !important; + color: #fff; +} +html:not(.watch-active-state) .button.button-fill.bg-green:active, +html:not(.watch-active-state) .button.button-fill.color-green:active, +.button.button-fill.bg-green.active-state, +.button.button-fill.color-green.active-state { + background: #388E3C !important; +} +.progressbar.color-green, +.progressbar.theme-green, +.theme-green .progressbar, +.progressbar.bg-green { + background-color: rgba(76, 175, 80, 0.5); +} +.progressbar.color-green span, +.progressbar.theme-green span, +.theme-green .progressbar span, +.progressbar.bg-green span { + background-color: #4caf50; +} +.progressbar-infinite.color-green, +.progressbar-infinite.theme-green, +.theme-green .progressbar-infinite, +.progressbar-infinite.bg-green { + background-color: rgba(76, 175, 80, 0.5); +} +.progressbar-infinite.color-green:after, +.progressbar-infinite.theme-green:after, +.theme-green .progressbar-infinite:after, +.progressbar-infinite.bg-green:after, +.progressbar-infinite.color-green:before, +.progressbar-infinite.theme-green:before, +.theme-green .progressbar-infinite:before, +.progressbar-infinite.bg-green:before { + background-color: #4caf50; +} +.color-green i.icon, +i.icon.color-green { + color: #4caf50; +} +i.icon-next.color-green, +i.icon-next.theme-green { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%234caf50'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-green, +i.icon-prev.theme-green { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%234caf50'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-green, +i.icon-back.theme-green { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%234caf50'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-green, +i.icon-forward.theme-green { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%234caf50'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-bars.color-green, +i.icon-bars.theme-green { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M3%2018h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z'%20fill%3D'%234caf50'%2F%3E%3C%2Fsvg%3E"); +} +.preloader.color-green svg circle, +.preloader.preloader-green svg circle { + stroke: #4caf50; +} +.preloader.color-green .preloader-inner-gap, +.preloader.preloader-green .preloader-inner-gap, +.preloader.color-green .preloader-inner-half-circle, +.preloader.preloader-green .preloader-inner-half-circle { + border-color: #4caf50; +} +.theme-green a { + color: #4caf50; +} +.theme-green .navbar, +.navbar.theme-green, +.theme-green .toolbar, +.toolbar.theme-green, +.theme-green .subnavbar, +.subnavbar.theme-green, +.theme-green .searchbar, +.searchbar.theme-green { + background-color: #4caf50; +} +.theme-green .range-slider input[type="range"]::-webkit-slider-thumb:before, +.range-slider.theme-green input[type="range"]::-webkit-slider-thumb:before { + background-color: #4caf50; +} +.theme-green .range-slider input[type="range"]::-webkit-slider-thumb, +.range-slider.theme-green input[type="range"]::-webkit-slider-thumb { + background-color: #4caf50; +} +.theme-green .range-slider input[type="range"]::-ms-thumb, +.range-slider.theme-green input[type="range"]::-ms-thumb { + background-color: #4caf50; +} +.theme-green .range-slider input[type="range"]::-ms-fill-lower, +.range-slider.theme-green input[type="range"]::-ms-fill-lower { + background-color: #4caf50; +} +.theme-green .range-slider input[type="range"]::-moz-range-thumb, +.range-slider.theme-green input[type="range"]::-moz-range-thumb { + background-color: #4caf50; +} +.theme-green .label-switch input[type="checkbox"]:checked + .checkbox, +.label-switch.theme-green input[type="checkbox"]:checked + .checkbox { + background-color: rgba(76, 175, 80, 0.5); +} +.theme-green .label-switch input[type="checkbox"]:checked + .checkbox:after, +.label-switch.theme-green input[type="checkbox"]:checked + .checkbox:after { + background-color: #4caf50; +} +.theme-green label.label-checkbox, +label.label-checkbox.theme-green { + cursor: pointer; +} +.theme-green label.label-checkbox i.icon-form-checkbox:after, +label.label-checkbox.theme-green i.icon-form-checkbox:after { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M9%2016.17L4.83%2012l-1.42%201.41L9%2019%2021%207l-1.41-1.41z'%2F%3E%3C%2Fsvg%3E"); +} +.theme-green label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-green input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +.theme-green label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-green input[type="radio"]:checked + .item-media i.icon-form-checkbox, +.theme-green label.label-checkbox input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-green input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +.theme-green label.label-checkbox input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-green input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +.theme-green label.label-checkbox input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-green input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +.theme-green label.label-checkbox input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-green input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox { + border-color: #4caf50; + background-color: #4caf50; +} +.theme-green label.label-radio i.icon-form-radio:after, +label.label-radio.theme-green i.icon-form-radio:after { + background-color: #4caf50; +} +.theme-green label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-green input[type="checkbox"]:checked + .item-media i.icon-form-radio, +.theme-green label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-green input[type="radio"]:checked + .item-media i.icon-form-radio, +.theme-green label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-green input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +.theme-green label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-green input[type="radio"]:checked ~ .item-after i.icon-form-radio, +.theme-green label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-green input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +.theme-green label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-green input[type="radio"]:checked ~ .item-inner i.icon-form-radio { + border-color: #4caf50; +} +.theme-green label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-green input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +.theme-green label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-green input[type="radio"]:checked + .item-media i.icon-form-radio:after, +.theme-green label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-green input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +.theme-green label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-green input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +.theme-green label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-green input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +.theme-green label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-green input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after { + background-color: #4caf50; +} +.theme-green .focus-state .label, +.theme-green .focus-state .floating-label { + color: #4caf50; +} +.theme-green .item-input-field.focus-state:after, +.theme-green .input-field.focus-state:after, +.theme-green .item-input-field.not-empty-state:after, +.theme-green .input-field.not-empty-state:after { + background: #4caf50; +} +.theme-green .picker-calendar-day.picker-calendar-day-today span { + color: #4caf50; +} +.theme-green .picker-calendar-day.picker-calendar-day-selected span { + background-color: #4caf50; + color: #fff; +} +.theme-green .picker-calendar-day.picker-calendar-day-has-events span:after { + background-color: #4caf50; +} +.theme-green .picker-header { + background-color: #4caf50; +} +.theme-green .modal-button { + color: #4caf50; +} +.swiper-pagination.color-green .swiper-pagination-bullet-active, +.theme-green .swiper-pagination .swiper-pagination-bullet-active { + background-color: #4caf50; +} +.swiper-pagination.color-green .swiper-pagination-progressbar, +.theme-green .swiper-pagination .swiper-pagination-progressbar { + background-color: #4caf50; +} +.swiper-pagination.swiper-pagination-progress.bg-green { + background-color: rgba(76, 175, 80, 0.25); +} +.swiper-button-next.color-green, +.swiper-container-rtl .swiper-button-prev.color-green, +.theme-green .swiper-button-next, +.theme-green .swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%234caf50'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-prev.color-green, +.swiper-container-rtl .swiper-button-next.color-green, +.theme-green .swiper-button-prev, +.theme-green .swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%234caf50'%2F%3E%3C%2Fsvg%3E"); +} +.bg-green, +a.bg-green, +.list-block .swipeout-actions-left a.bg-green, +.list-block .swipeout-actions-right a.bg-green { + background-color: #4caf50; +} +html:not(.watch-active-state) .list-block .bg-green .item-link:active, +html:not(.watch-active-state) .list-block a.bg-green .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-left a.bg-green .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-right a.bg-green .item-link:active, +html:not(.watch-active-state) .list-block.bg-green .item-link:active, +html:not(.watch-active-state) .list-blocka.bg-green .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-left a.bg-green .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-right a.bg-green .item-link:active, +html:not(.watch-active-state) .list-block .item-link.bg-green:active, +html:not(.watch-active-state) .list-block .item-linka.bg-green:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-left a.bg-green:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-right a.bg-green:active, +.list-block .bg-green .item-link.active-state, +.list-block a.bg-green .item-link.active-state, +.list-block .list-block .swipeout-actions-left a.bg-green .item-link.active-state, +.list-block .list-block .swipeout-actions-right a.bg-green .item-link.active-state, +.list-block.bg-green .item-link.active-state, +.list-blocka.bg-green .item-link.active-state, +.list-block.list-block .swipeout-actions-left a.bg-green .item-link.active-state, +.list-block.list-block .swipeout-actions-right a.bg-green .item-link.active-state, +.list-block .item-link.bg-green.active-state, +.list-block .item-linka.bg-green.active-state, +.list-block .item-link.list-block .swipeout-actions-left a.bg-green.active-state, +.list-block .item-link.list-block .swipeout-actions-right a.bg-green.active-state { + background: #388E3C; +} +.border-green { + border-color: #4caf50; +} +.list-block .border-green.item-inner:after, +.list-block ul.border-green:after, +.border-green:after, +.list-block .border-green.item-inner:before, +.list-block ul.border-green:before, +.border-green:before { + background-color: #4caf50; +} +.theme-green .floating-button, +.theme-green .speed-dial-buttons a, +.floating-button.theme-green, +.speed-dial-buttons a.theme-green, +.floating-button.color-green, +.speed-dial-buttons a.color-green, +.floating-button.bg-green, +.speed-dial-buttons a.bg-green { + color: #fff; + background: #4caf50; +} +html:not(.watch-active-state) .theme-green .floating-button:active, +html:not(.watch-active-state) .theme-green .speed-dial-buttons a:active, +html:not(.watch-active-state) .floating-button.theme-green:active, +html:not(.watch-active-state) .speed-dial-buttons a.theme-green:active, +html:not(.watch-active-state) .floating-button.color-green:active, +html:not(.watch-active-state) .speed-dial-buttons a.color-green:active, +html:not(.watch-active-state) .floating-button.bg-green:active, +html:not(.watch-active-state) .speed-dial-buttons a.bg-green:active, +.theme-green .floating-button.active-state, +.theme-green .speed-dial-buttons a.active-state, +.floating-button.theme-green.active-state, +.speed-dial-buttons a.theme-green.active-state, +.floating-button.color-green.active-state, +.speed-dial-buttons a.color-green.active-state, +.floating-button.bg-green.active-state, +.speed-dial-buttons a.bg-green.active-state { + background: #388E3C; +} +.theme-green .floating-button i, +.theme-green .speed-dial-buttons a i, +.floating-button.theme-green i, +.speed-dial-buttons a.theme-green i, +.floating-button.color-green i, +.speed-dial-buttons a.color-green i, +.floating-button.bg-green i, +.speed-dial-buttons a.bg-green i { + color: inherit; +} +.ripple-green .ripple-wave { + background-color: rgba(76, 175, 80, 0.3); +} +.badge.color-green, +.badge.theme-green { + background-color: #4caf50; + color: #fff; +} +.color-lightgreen { + color: #8bc34a; +} +.list-block .item-link.list-button.color-lightgreen, +.list-block .item-link.color-lightgreen, +.tabbar a.active.color-lightgreen, +a.color-lightgreen { + color: #8bc34a; +} +.label-switch input[type="checkbox"]:checked + .checkbox.color-lightgreen, +.label-switch.color-lightgreen input[type="checkbox"]:checked + .checkbox { + background-color: #8bc34a; +} +.theme-lightgreen .button:not(.button-fill) { + color: #8bc34a; +} +.theme-lightgreen .navbar .button:not(.button-fill), +.theme-lightgreen.navbar .button:not(.button-fill), +.theme-lightgreen .toolbar .button:not(.button-fill), +.theme-lightgreen.toolbar .button:not(.button-fill), +.theme-lightgreen .subnavbar .button:not(.button-fill), +.theme-lightgreen.subnavbar .button:not(.button-fill) { + color: #fff; +} +.button.color-lightgreen:not(.button-fill), +.color-lightgreen.buttons-row .button:not(.button-fill) { + color: #8bc34a !important; +} +.theme-lightgreen .button.button-fill { + background: #8bc34a; + color: #fff; +} +html:not(.watch-active-state) .theme-lightgreen .button.button-fill:active, +.theme-lightgreen .button.button-fill.active-state { + background: #689F38; +} +.button.button-fill.bg-lightgreen, +.button.button-fill.color-lightgreen { + background: #8bc34a !important; + color: #fff; +} +html:not(.watch-active-state) .button.button-fill.bg-lightgreen:active, +html:not(.watch-active-state) .button.button-fill.color-lightgreen:active, +.button.button-fill.bg-lightgreen.active-state, +.button.button-fill.color-lightgreen.active-state { + background: #689F38 !important; +} +.progressbar.color-lightgreen, +.progressbar.theme-lightgreen, +.theme-lightgreen .progressbar, +.progressbar.bg-lightgreen { + background-color: rgba(139, 195, 74, 0.5); +} +.progressbar.color-lightgreen span, +.progressbar.theme-lightgreen span, +.theme-lightgreen .progressbar span, +.progressbar.bg-lightgreen span { + background-color: #8bc34a; +} +.progressbar-infinite.color-lightgreen, +.progressbar-infinite.theme-lightgreen, +.theme-lightgreen .progressbar-infinite, +.progressbar-infinite.bg-lightgreen { + background-color: rgba(139, 195, 74, 0.5); +} +.progressbar-infinite.color-lightgreen:after, +.progressbar-infinite.theme-lightgreen:after, +.theme-lightgreen .progressbar-infinite:after, +.progressbar-infinite.bg-lightgreen:after, +.progressbar-infinite.color-lightgreen:before, +.progressbar-infinite.theme-lightgreen:before, +.theme-lightgreen .progressbar-infinite:before, +.progressbar-infinite.bg-lightgreen:before { + background-color: #8bc34a; +} +.color-lightgreen i.icon, +i.icon.color-lightgreen { + color: #8bc34a; +} +i.icon-next.color-lightgreen, +i.icon-next.theme-lightgreen { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%238bc34a'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-lightgreen, +i.icon-prev.theme-lightgreen { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%238bc34a'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-lightgreen, +i.icon-back.theme-lightgreen { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%238bc34a'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-lightgreen, +i.icon-forward.theme-lightgreen { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%238bc34a'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-bars.color-lightgreen, +i.icon-bars.theme-lightgreen { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M3%2018h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z'%20fill%3D'%238bc34a'%2F%3E%3C%2Fsvg%3E"); +} +.preloader.color-lightgreen svg circle, +.preloader.preloader-lightgreen svg circle { + stroke: #8bc34a; +} +.preloader.color-lightgreen .preloader-inner-gap, +.preloader.preloader-lightgreen .preloader-inner-gap, +.preloader.color-lightgreen .preloader-inner-half-circle, +.preloader.preloader-lightgreen .preloader-inner-half-circle { + border-color: #8bc34a; +} +.theme-lightgreen a { + color: #8bc34a; +} +.theme-lightgreen .navbar, +.navbar.theme-lightgreen, +.theme-lightgreen .toolbar, +.toolbar.theme-lightgreen, +.theme-lightgreen .subnavbar, +.subnavbar.theme-lightgreen, +.theme-lightgreen .searchbar, +.searchbar.theme-lightgreen { + background-color: #8bc34a; +} +.theme-lightgreen .range-slider input[type="range"]::-webkit-slider-thumb:before, +.range-slider.theme-lightgreen input[type="range"]::-webkit-slider-thumb:before { + background-color: #8bc34a; +} +.theme-lightgreen .range-slider input[type="range"]::-webkit-slider-thumb, +.range-slider.theme-lightgreen input[type="range"]::-webkit-slider-thumb { + background-color: #8bc34a; +} +.theme-lightgreen .range-slider input[type="range"]::-ms-thumb, +.range-slider.theme-lightgreen input[type="range"]::-ms-thumb { + background-color: #8bc34a; +} +.theme-lightgreen .range-slider input[type="range"]::-ms-fill-lower, +.range-slider.theme-lightgreen input[type="range"]::-ms-fill-lower { + background-color: #8bc34a; +} +.theme-lightgreen .range-slider input[type="range"]::-moz-range-thumb, +.range-slider.theme-lightgreen input[type="range"]::-moz-range-thumb { + background-color: #8bc34a; +} +.theme-lightgreen .label-switch input[type="checkbox"]:checked + .checkbox, +.label-switch.theme-lightgreen input[type="checkbox"]:checked + .checkbox { + background-color: rgba(139, 195, 74, 0.5); +} +.theme-lightgreen .label-switch input[type="checkbox"]:checked + .checkbox:after, +.label-switch.theme-lightgreen input[type="checkbox"]:checked + .checkbox:after { + background-color: #8bc34a; +} +.theme-lightgreen label.label-checkbox, +label.label-checkbox.theme-lightgreen { + cursor: pointer; +} +.theme-lightgreen label.label-checkbox i.icon-form-checkbox:after, +label.label-checkbox.theme-lightgreen i.icon-form-checkbox:after { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M9%2016.17L4.83%2012l-1.42%201.41L9%2019%2021%207l-1.41-1.41z'%2F%3E%3C%2Fsvg%3E"); +} +.theme-lightgreen label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-lightgreen input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +.theme-lightgreen label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-lightgreen input[type="radio"]:checked + .item-media i.icon-form-checkbox, +.theme-lightgreen label.label-checkbox input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-lightgreen input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +.theme-lightgreen label.label-checkbox input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-lightgreen input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +.theme-lightgreen label.label-checkbox input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-lightgreen input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +.theme-lightgreen label.label-checkbox input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-lightgreen input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox { + border-color: #8bc34a; + background-color: #8bc34a; +} +.theme-lightgreen label.label-radio i.icon-form-radio:after, +label.label-radio.theme-lightgreen i.icon-form-radio:after { + background-color: #8bc34a; +} +.theme-lightgreen label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-lightgreen input[type="checkbox"]:checked + .item-media i.icon-form-radio, +.theme-lightgreen label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-lightgreen input[type="radio"]:checked + .item-media i.icon-form-radio, +.theme-lightgreen label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-lightgreen input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +.theme-lightgreen label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-lightgreen input[type="radio"]:checked ~ .item-after i.icon-form-radio, +.theme-lightgreen label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-lightgreen input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +.theme-lightgreen label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-lightgreen input[type="radio"]:checked ~ .item-inner i.icon-form-radio { + border-color: #8bc34a; +} +.theme-lightgreen label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-lightgreen input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +.theme-lightgreen label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-lightgreen input[type="radio"]:checked + .item-media i.icon-form-radio:after, +.theme-lightgreen label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-lightgreen input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +.theme-lightgreen label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-lightgreen input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +.theme-lightgreen label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-lightgreen input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +.theme-lightgreen label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-lightgreen input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after { + background-color: #8bc34a; +} +.theme-lightgreen .focus-state .label, +.theme-lightgreen .focus-state .floating-label { + color: #8bc34a; +} +.theme-lightgreen .item-input-field.focus-state:after, +.theme-lightgreen .input-field.focus-state:after, +.theme-lightgreen .item-input-field.not-empty-state:after, +.theme-lightgreen .input-field.not-empty-state:after { + background: #8bc34a; +} +.theme-lightgreen .picker-calendar-day.picker-calendar-day-today span { + color: #8bc34a; +} +.theme-lightgreen .picker-calendar-day.picker-calendar-day-selected span { + background-color: #8bc34a; + color: #fff; +} +.theme-lightgreen .picker-calendar-day.picker-calendar-day-has-events span:after { + background-color: #8bc34a; +} +.theme-lightgreen .picker-header { + background-color: #8bc34a; +} +.theme-lightgreen .modal-button { + color: #8bc34a; +} +.swiper-pagination.color-lightgreen .swiper-pagination-bullet-active, +.theme-lightgreen .swiper-pagination .swiper-pagination-bullet-active { + background-color: #8bc34a; +} +.swiper-pagination.color-lightgreen .swiper-pagination-progressbar, +.theme-lightgreen .swiper-pagination .swiper-pagination-progressbar { + background-color: #8bc34a; +} +.swiper-pagination.swiper-pagination-progress.bg-lightgreen { + background-color: rgba(139, 195, 74, 0.25); +} +.swiper-button-next.color-lightgreen, +.swiper-container-rtl .swiper-button-prev.color-lightgreen, +.theme-lightgreen .swiper-button-next, +.theme-lightgreen .swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%238bc34a'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-prev.color-lightgreen, +.swiper-container-rtl .swiper-button-next.color-lightgreen, +.theme-lightgreen .swiper-button-prev, +.theme-lightgreen .swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%238bc34a'%2F%3E%3C%2Fsvg%3E"); +} +.bg-lightgreen, +a.bg-lightgreen, +.list-block .swipeout-actions-left a.bg-lightgreen, +.list-block .swipeout-actions-right a.bg-lightgreen { + background-color: #8bc34a; +} +html:not(.watch-active-state) .list-block .bg-lightgreen .item-link:active, +html:not(.watch-active-state) .list-block a.bg-lightgreen .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-left a.bg-lightgreen .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-right a.bg-lightgreen .item-link:active, +html:not(.watch-active-state) .list-block.bg-lightgreen .item-link:active, +html:not(.watch-active-state) .list-blocka.bg-lightgreen .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-left a.bg-lightgreen .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-right a.bg-lightgreen .item-link:active, +html:not(.watch-active-state) .list-block .item-link.bg-lightgreen:active, +html:not(.watch-active-state) .list-block .item-linka.bg-lightgreen:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-left a.bg-lightgreen:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-right a.bg-lightgreen:active, +.list-block .bg-lightgreen .item-link.active-state, +.list-block a.bg-lightgreen .item-link.active-state, +.list-block .list-block .swipeout-actions-left a.bg-lightgreen .item-link.active-state, +.list-block .list-block .swipeout-actions-right a.bg-lightgreen .item-link.active-state, +.list-block.bg-lightgreen .item-link.active-state, +.list-blocka.bg-lightgreen .item-link.active-state, +.list-block.list-block .swipeout-actions-left a.bg-lightgreen .item-link.active-state, +.list-block.list-block .swipeout-actions-right a.bg-lightgreen .item-link.active-state, +.list-block .item-link.bg-lightgreen.active-state, +.list-block .item-linka.bg-lightgreen.active-state, +.list-block .item-link.list-block .swipeout-actions-left a.bg-lightgreen.active-state, +.list-block .item-link.list-block .swipeout-actions-right a.bg-lightgreen.active-state { + background: #689F38; +} +.border-lightgreen { + border-color: #8bc34a; +} +.list-block .border-lightgreen.item-inner:after, +.list-block ul.border-lightgreen:after, +.border-lightgreen:after, +.list-block .border-lightgreen.item-inner:before, +.list-block ul.border-lightgreen:before, +.border-lightgreen:before { + background-color: #8bc34a; +} +.theme-lightgreen .floating-button, +.theme-lightgreen .speed-dial-buttons a, +.floating-button.theme-lightgreen, +.speed-dial-buttons a.theme-lightgreen, +.floating-button.color-lightgreen, +.speed-dial-buttons a.color-lightgreen, +.floating-button.bg-lightgreen, +.speed-dial-buttons a.bg-lightgreen { + color: #fff; + background: #8bc34a; +} +html:not(.watch-active-state) .theme-lightgreen .floating-button:active, +html:not(.watch-active-state) .theme-lightgreen .speed-dial-buttons a:active, +html:not(.watch-active-state) .floating-button.theme-lightgreen:active, +html:not(.watch-active-state) .speed-dial-buttons a.theme-lightgreen:active, +html:not(.watch-active-state) .floating-button.color-lightgreen:active, +html:not(.watch-active-state) .speed-dial-buttons a.color-lightgreen:active, +html:not(.watch-active-state) .floating-button.bg-lightgreen:active, +html:not(.watch-active-state) .speed-dial-buttons a.bg-lightgreen:active, +.theme-lightgreen .floating-button.active-state, +.theme-lightgreen .speed-dial-buttons a.active-state, +.floating-button.theme-lightgreen.active-state, +.speed-dial-buttons a.theme-lightgreen.active-state, +.floating-button.color-lightgreen.active-state, +.speed-dial-buttons a.color-lightgreen.active-state, +.floating-button.bg-lightgreen.active-state, +.speed-dial-buttons a.bg-lightgreen.active-state { + background: #689F38; +} +.theme-lightgreen .floating-button i, +.theme-lightgreen .speed-dial-buttons a i, +.floating-button.theme-lightgreen i, +.speed-dial-buttons a.theme-lightgreen i, +.floating-button.color-lightgreen i, +.speed-dial-buttons a.color-lightgreen i, +.floating-button.bg-lightgreen i, +.speed-dial-buttons a.bg-lightgreen i { + color: inherit; +} +.ripple-lightgreen .ripple-wave { + background-color: rgba(139, 195, 74, 0.3); +} +.badge.color-lightgreen, +.badge.theme-lightgreen { + background-color: #8bc34a; + color: #fff; +} +.color-lime { + color: #cddc39; +} +.list-block .item-link.list-button.color-lime, +.list-block .item-link.color-lime, +.tabbar a.active.color-lime, +a.color-lime { + color: #cddc39; +} +.label-switch input[type="checkbox"]:checked + .checkbox.color-lime, +.label-switch.color-lime input[type="checkbox"]:checked + .checkbox { + background-color: #cddc39; +} +.theme-lime .button:not(.button-fill) { + color: #cddc39; +} +.theme-lime .navbar .button:not(.button-fill), +.theme-lime.navbar .button:not(.button-fill), +.theme-lime .toolbar .button:not(.button-fill), +.theme-lime.toolbar .button:not(.button-fill), +.theme-lime .subnavbar .button:not(.button-fill), +.theme-lime.subnavbar .button:not(.button-fill) { + color: #fff; +} +.button.color-lime:not(.button-fill), +.color-lime.buttons-row .button:not(.button-fill) { + color: #cddc39 !important; +} +.theme-lime .button.button-fill { + background: #cddc39; + color: #fff; +} +html:not(.watch-active-state) .theme-lime .button.button-fill:active, +.theme-lime .button.button-fill.active-state { + background: #AFB42B; +} +.button.button-fill.bg-lime, +.button.button-fill.color-lime { + background: #cddc39 !important; + color: #fff; +} +html:not(.watch-active-state) .button.button-fill.bg-lime:active, +html:not(.watch-active-state) .button.button-fill.color-lime:active, +.button.button-fill.bg-lime.active-state, +.button.button-fill.color-lime.active-state { + background: #AFB42B !important; +} +.progressbar.color-lime, +.progressbar.theme-lime, +.theme-lime .progressbar, +.progressbar.bg-lime { + background-color: rgba(205, 220, 57, 0.5); +} +.progressbar.color-lime span, +.progressbar.theme-lime span, +.theme-lime .progressbar span, +.progressbar.bg-lime span { + background-color: #cddc39; +} +.progressbar-infinite.color-lime, +.progressbar-infinite.theme-lime, +.theme-lime .progressbar-infinite, +.progressbar-infinite.bg-lime { + background-color: rgba(205, 220, 57, 0.5); +} +.progressbar-infinite.color-lime:after, +.progressbar-infinite.theme-lime:after, +.theme-lime .progressbar-infinite:after, +.progressbar-infinite.bg-lime:after, +.progressbar-infinite.color-lime:before, +.progressbar-infinite.theme-lime:before, +.theme-lime .progressbar-infinite:before, +.progressbar-infinite.bg-lime:before { + background-color: #cddc39; +} +.color-lime i.icon, +i.icon.color-lime { + color: #cddc39; +} +i.icon-next.color-lime, +i.icon-next.theme-lime { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23cddc39'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-lime, +i.icon-prev.theme-lime { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23cddc39'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-lime, +i.icon-back.theme-lime { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23cddc39'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-lime, +i.icon-forward.theme-lime { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23cddc39'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-bars.color-lime, +i.icon-bars.theme-lime { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M3%2018h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z'%20fill%3D'%23cddc39'%2F%3E%3C%2Fsvg%3E"); +} +.preloader.color-lime svg circle, +.preloader.preloader-lime svg circle { + stroke: #cddc39; +} +.preloader.color-lime .preloader-inner-gap, +.preloader.preloader-lime .preloader-inner-gap, +.preloader.color-lime .preloader-inner-half-circle, +.preloader.preloader-lime .preloader-inner-half-circle { + border-color: #cddc39; +} +.theme-lime a { + color: #cddc39; +} +.theme-lime .navbar, +.navbar.theme-lime, +.theme-lime .toolbar, +.toolbar.theme-lime, +.theme-lime .subnavbar, +.subnavbar.theme-lime, +.theme-lime .searchbar, +.searchbar.theme-lime { + background-color: #cddc39; +} +.theme-lime .range-slider input[type="range"]::-webkit-slider-thumb:before, +.range-slider.theme-lime input[type="range"]::-webkit-slider-thumb:before { + background-color: #cddc39; +} +.theme-lime .range-slider input[type="range"]::-webkit-slider-thumb, +.range-slider.theme-lime input[type="range"]::-webkit-slider-thumb { + background-color: #cddc39; +} +.theme-lime .range-slider input[type="range"]::-ms-thumb, +.range-slider.theme-lime input[type="range"]::-ms-thumb { + background-color: #cddc39; +} +.theme-lime .range-slider input[type="range"]::-ms-fill-lower, +.range-slider.theme-lime input[type="range"]::-ms-fill-lower { + background-color: #cddc39; +} +.theme-lime .range-slider input[type="range"]::-moz-range-thumb, +.range-slider.theme-lime input[type="range"]::-moz-range-thumb { + background-color: #cddc39; +} +.theme-lime .label-switch input[type="checkbox"]:checked + .checkbox, +.label-switch.theme-lime input[type="checkbox"]:checked + .checkbox { + background-color: rgba(205, 220, 57, 0.5); +} +.theme-lime .label-switch input[type="checkbox"]:checked + .checkbox:after, +.label-switch.theme-lime input[type="checkbox"]:checked + .checkbox:after { + background-color: #cddc39; +} +.theme-lime label.label-checkbox, +label.label-checkbox.theme-lime { + cursor: pointer; +} +.theme-lime label.label-checkbox i.icon-form-checkbox:after, +label.label-checkbox.theme-lime i.icon-form-checkbox:after { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M9%2016.17L4.83%2012l-1.42%201.41L9%2019%2021%207l-1.41-1.41z'%2F%3E%3C%2Fsvg%3E"); +} +.theme-lime label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-lime input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +.theme-lime label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-lime input[type="radio"]:checked + .item-media i.icon-form-checkbox, +.theme-lime label.label-checkbox input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-lime input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +.theme-lime label.label-checkbox input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-lime input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +.theme-lime label.label-checkbox input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-lime input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +.theme-lime label.label-checkbox input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-lime input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox { + border-color: #cddc39; + background-color: #cddc39; +} +.theme-lime label.label-radio i.icon-form-radio:after, +label.label-radio.theme-lime i.icon-form-radio:after { + background-color: #cddc39; +} +.theme-lime label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-lime input[type="checkbox"]:checked + .item-media i.icon-form-radio, +.theme-lime label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-lime input[type="radio"]:checked + .item-media i.icon-form-radio, +.theme-lime label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-lime input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +.theme-lime label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-lime input[type="radio"]:checked ~ .item-after i.icon-form-radio, +.theme-lime label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-lime input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +.theme-lime label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-lime input[type="radio"]:checked ~ .item-inner i.icon-form-radio { + border-color: #cddc39; +} +.theme-lime label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-lime input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +.theme-lime label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-lime input[type="radio"]:checked + .item-media i.icon-form-radio:after, +.theme-lime label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-lime input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +.theme-lime label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-lime input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +.theme-lime label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-lime input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +.theme-lime label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-lime input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after { + background-color: #cddc39; +} +.theme-lime .focus-state .label, +.theme-lime .focus-state .floating-label { + color: #cddc39; +} +.theme-lime .item-input-field.focus-state:after, +.theme-lime .input-field.focus-state:after, +.theme-lime .item-input-field.not-empty-state:after, +.theme-lime .input-field.not-empty-state:after { + background: #cddc39; +} +.theme-lime .picker-calendar-day.picker-calendar-day-today span { + color: #cddc39; +} +.theme-lime .picker-calendar-day.picker-calendar-day-selected span { + background-color: #cddc39; + color: #fff; +} +.theme-lime .picker-calendar-day.picker-calendar-day-has-events span:after { + background-color: #cddc39; +} +.theme-lime .picker-header { + background-color: #cddc39; +} +.theme-lime .modal-button { + color: #cddc39; +} +.swiper-pagination.color-lime .swiper-pagination-bullet-active, +.theme-lime .swiper-pagination .swiper-pagination-bullet-active { + background-color: #cddc39; +} +.swiper-pagination.color-lime .swiper-pagination-progressbar, +.theme-lime .swiper-pagination .swiper-pagination-progressbar { + background-color: #cddc39; +} +.swiper-pagination.swiper-pagination-progress.bg-lime { + background-color: rgba(205, 220, 57, 0.25); +} +.swiper-button-next.color-lime, +.swiper-container-rtl .swiper-button-prev.color-lime, +.theme-lime .swiper-button-next, +.theme-lime .swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23cddc39'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-prev.color-lime, +.swiper-container-rtl .swiper-button-next.color-lime, +.theme-lime .swiper-button-prev, +.theme-lime .swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23cddc39'%2F%3E%3C%2Fsvg%3E"); +} +.bg-lime, +a.bg-lime, +.list-block .swipeout-actions-left a.bg-lime, +.list-block .swipeout-actions-right a.bg-lime { + background-color: #cddc39; +} +html:not(.watch-active-state) .list-block .bg-lime .item-link:active, +html:not(.watch-active-state) .list-block a.bg-lime .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-left a.bg-lime .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-right a.bg-lime .item-link:active, +html:not(.watch-active-state) .list-block.bg-lime .item-link:active, +html:not(.watch-active-state) .list-blocka.bg-lime .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-left a.bg-lime .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-right a.bg-lime .item-link:active, +html:not(.watch-active-state) .list-block .item-link.bg-lime:active, +html:not(.watch-active-state) .list-block .item-linka.bg-lime:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-left a.bg-lime:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-right a.bg-lime:active, +.list-block .bg-lime .item-link.active-state, +.list-block a.bg-lime .item-link.active-state, +.list-block .list-block .swipeout-actions-left a.bg-lime .item-link.active-state, +.list-block .list-block .swipeout-actions-right a.bg-lime .item-link.active-state, +.list-block.bg-lime .item-link.active-state, +.list-blocka.bg-lime .item-link.active-state, +.list-block.list-block .swipeout-actions-left a.bg-lime .item-link.active-state, +.list-block.list-block .swipeout-actions-right a.bg-lime .item-link.active-state, +.list-block .item-link.bg-lime.active-state, +.list-block .item-linka.bg-lime.active-state, +.list-block .item-link.list-block .swipeout-actions-left a.bg-lime.active-state, +.list-block .item-link.list-block .swipeout-actions-right a.bg-lime.active-state { + background: #AFB42B; +} +.border-lime { + border-color: #cddc39; +} +.list-block .border-lime.item-inner:after, +.list-block ul.border-lime:after, +.border-lime:after, +.list-block .border-lime.item-inner:before, +.list-block ul.border-lime:before, +.border-lime:before { + background-color: #cddc39; +} +.theme-lime .floating-button, +.theme-lime .speed-dial-buttons a, +.floating-button.theme-lime, +.speed-dial-buttons a.theme-lime, +.floating-button.color-lime, +.speed-dial-buttons a.color-lime, +.floating-button.bg-lime, +.speed-dial-buttons a.bg-lime { + color: #fff; + background: #cddc39; +} +html:not(.watch-active-state) .theme-lime .floating-button:active, +html:not(.watch-active-state) .theme-lime .speed-dial-buttons a:active, +html:not(.watch-active-state) .floating-button.theme-lime:active, +html:not(.watch-active-state) .speed-dial-buttons a.theme-lime:active, +html:not(.watch-active-state) .floating-button.color-lime:active, +html:not(.watch-active-state) .speed-dial-buttons a.color-lime:active, +html:not(.watch-active-state) .floating-button.bg-lime:active, +html:not(.watch-active-state) .speed-dial-buttons a.bg-lime:active, +.theme-lime .floating-button.active-state, +.theme-lime .speed-dial-buttons a.active-state, +.floating-button.theme-lime.active-state, +.speed-dial-buttons a.theme-lime.active-state, +.floating-button.color-lime.active-state, +.speed-dial-buttons a.color-lime.active-state, +.floating-button.bg-lime.active-state, +.speed-dial-buttons a.bg-lime.active-state { + background: #AFB42B; +} +.theme-lime .floating-button i, +.theme-lime .speed-dial-buttons a i, +.floating-button.theme-lime i, +.speed-dial-buttons a.theme-lime i, +.floating-button.color-lime i, +.speed-dial-buttons a.color-lime i, +.floating-button.bg-lime i, +.speed-dial-buttons a.bg-lime i { + color: inherit; +} +.ripple-lime .ripple-wave { + background-color: rgba(205, 220, 57, 0.3); +} +.badge.color-lime, +.badge.theme-lime { + background-color: #cddc39; + color: #fff; +} +.color-yellow { + color: #ffeb3b; +} +.list-block .item-link.list-button.color-yellow, +.list-block .item-link.color-yellow, +.tabbar a.active.color-yellow, +a.color-yellow { + color: #ffeb3b; +} +.label-switch input[type="checkbox"]:checked + .checkbox.color-yellow, +.label-switch.color-yellow input[type="checkbox"]:checked + .checkbox { + background-color: #ffeb3b; +} +.theme-yellow .button:not(.button-fill) { + color: #ffeb3b; +} +.theme-yellow .navbar .button:not(.button-fill), +.theme-yellow.navbar .button:not(.button-fill), +.theme-yellow .toolbar .button:not(.button-fill), +.theme-yellow.toolbar .button:not(.button-fill), +.theme-yellow .subnavbar .button:not(.button-fill), +.theme-yellow.subnavbar .button:not(.button-fill) { + color: #fff; +} +.button.color-yellow:not(.button-fill), +.color-yellow.buttons-row .button:not(.button-fill) { + color: #ffeb3b !important; +} +.theme-yellow .button.button-fill { + background: #ffeb3b; + color: #fff; +} +html:not(.watch-active-state) .theme-yellow .button.button-fill:active, +.theme-yellow .button.button-fill.active-state { + background: #FBC02D; +} +.button.button-fill.bg-yellow, +.button.button-fill.color-yellow { + background: #ffeb3b !important; + color: #fff; +} +html:not(.watch-active-state) .button.button-fill.bg-yellow:active, +html:not(.watch-active-state) .button.button-fill.color-yellow:active, +.button.button-fill.bg-yellow.active-state, +.button.button-fill.color-yellow.active-state { + background: #FBC02D !important; +} +.progressbar.color-yellow, +.progressbar.theme-yellow, +.theme-yellow .progressbar, +.progressbar.bg-yellow { + background-color: rgba(255, 235, 59, 0.5); +} +.progressbar.color-yellow span, +.progressbar.theme-yellow span, +.theme-yellow .progressbar span, +.progressbar.bg-yellow span { + background-color: #ffeb3b; +} +.progressbar-infinite.color-yellow, +.progressbar-infinite.theme-yellow, +.theme-yellow .progressbar-infinite, +.progressbar-infinite.bg-yellow { + background-color: rgba(255, 235, 59, 0.5); +} +.progressbar-infinite.color-yellow:after, +.progressbar-infinite.theme-yellow:after, +.theme-yellow .progressbar-infinite:after, +.progressbar-infinite.bg-yellow:after, +.progressbar-infinite.color-yellow:before, +.progressbar-infinite.theme-yellow:before, +.theme-yellow .progressbar-infinite:before, +.progressbar-infinite.bg-yellow:before { + background-color: #ffeb3b; +} +.color-yellow i.icon, +i.icon.color-yellow { + color: #ffeb3b; +} +i.icon-next.color-yellow, +i.icon-next.theme-yellow { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffeb3b'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-yellow, +i.icon-prev.theme-yellow { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffeb3b'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-yellow, +i.icon-back.theme-yellow { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23ffeb3b'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-yellow, +i.icon-forward.theme-yellow { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23ffeb3b'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-bars.color-yellow, +i.icon-bars.theme-yellow { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M3%2018h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z'%20fill%3D'%23ffeb3b'%2F%3E%3C%2Fsvg%3E"); +} +.preloader.color-yellow svg circle, +.preloader.preloader-yellow svg circle { + stroke: #ffeb3b; +} +.preloader.color-yellow .preloader-inner-gap, +.preloader.preloader-yellow .preloader-inner-gap, +.preloader.color-yellow .preloader-inner-half-circle, +.preloader.preloader-yellow .preloader-inner-half-circle { + border-color: #ffeb3b; +} +.theme-yellow a { + color: #ffeb3b; +} +.theme-yellow .navbar, +.navbar.theme-yellow, +.theme-yellow .toolbar, +.toolbar.theme-yellow, +.theme-yellow .subnavbar, +.subnavbar.theme-yellow, +.theme-yellow .searchbar, +.searchbar.theme-yellow { + background-color: #ffeb3b; +} +.theme-yellow .range-slider input[type="range"]::-webkit-slider-thumb:before, +.range-slider.theme-yellow input[type="range"]::-webkit-slider-thumb:before { + background-color: #ffeb3b; +} +.theme-yellow .range-slider input[type="range"]::-webkit-slider-thumb, +.range-slider.theme-yellow input[type="range"]::-webkit-slider-thumb { + background-color: #ffeb3b; +} +.theme-yellow .range-slider input[type="range"]::-ms-thumb, +.range-slider.theme-yellow input[type="range"]::-ms-thumb { + background-color: #ffeb3b; +} +.theme-yellow .range-slider input[type="range"]::-ms-fill-lower, +.range-slider.theme-yellow input[type="range"]::-ms-fill-lower { + background-color: #ffeb3b; +} +.theme-yellow .range-slider input[type="range"]::-moz-range-thumb, +.range-slider.theme-yellow input[type="range"]::-moz-range-thumb { + background-color: #ffeb3b; +} +.theme-yellow .label-switch input[type="checkbox"]:checked + .checkbox, +.label-switch.theme-yellow input[type="checkbox"]:checked + .checkbox { + background-color: rgba(255, 235, 59, 0.5); +} +.theme-yellow .label-switch input[type="checkbox"]:checked + .checkbox:after, +.label-switch.theme-yellow input[type="checkbox"]:checked + .checkbox:after { + background-color: #ffeb3b; +} +.theme-yellow label.label-checkbox, +label.label-checkbox.theme-yellow { + cursor: pointer; +} +.theme-yellow label.label-checkbox i.icon-form-checkbox:after, +label.label-checkbox.theme-yellow i.icon-form-checkbox:after { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M9%2016.17L4.83%2012l-1.42%201.41L9%2019%2021%207l-1.41-1.41z'%2F%3E%3C%2Fsvg%3E"); +} +.theme-yellow label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-yellow input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +.theme-yellow label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-yellow input[type="radio"]:checked + .item-media i.icon-form-checkbox, +.theme-yellow label.label-checkbox input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-yellow input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +.theme-yellow label.label-checkbox input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-yellow input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +.theme-yellow label.label-checkbox input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-yellow input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +.theme-yellow label.label-checkbox input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-yellow input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox { + border-color: #ffeb3b; + background-color: #ffeb3b; +} +.theme-yellow label.label-radio i.icon-form-radio:after, +label.label-radio.theme-yellow i.icon-form-radio:after { + background-color: #ffeb3b; +} +.theme-yellow label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-yellow input[type="checkbox"]:checked + .item-media i.icon-form-radio, +.theme-yellow label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-yellow input[type="radio"]:checked + .item-media i.icon-form-radio, +.theme-yellow label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-yellow input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +.theme-yellow label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-yellow input[type="radio"]:checked ~ .item-after i.icon-form-radio, +.theme-yellow label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-yellow input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +.theme-yellow label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-yellow input[type="radio"]:checked ~ .item-inner i.icon-form-radio { + border-color: #ffeb3b; +} +.theme-yellow label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-yellow input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +.theme-yellow label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-yellow input[type="radio"]:checked + .item-media i.icon-form-radio:after, +.theme-yellow label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-yellow input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +.theme-yellow label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-yellow input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +.theme-yellow label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-yellow input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +.theme-yellow label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-yellow input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after { + background-color: #ffeb3b; +} +.theme-yellow .focus-state .label, +.theme-yellow .focus-state .floating-label { + color: #ffeb3b; +} +.theme-yellow .item-input-field.focus-state:after, +.theme-yellow .input-field.focus-state:after, +.theme-yellow .item-input-field.not-empty-state:after, +.theme-yellow .input-field.not-empty-state:after { + background: #ffeb3b; +} +.theme-yellow .picker-calendar-day.picker-calendar-day-today span { + color: #ffeb3b; +} +.theme-yellow .picker-calendar-day.picker-calendar-day-selected span { + background-color: #ffeb3b; + color: #fff; +} +.theme-yellow .picker-calendar-day.picker-calendar-day-has-events span:after { + background-color: #ffeb3b; +} +.theme-yellow .picker-header { + background-color: #ffeb3b; +} +.theme-yellow .modal-button { + color: #ffeb3b; +} +.swiper-pagination.color-yellow .swiper-pagination-bullet-active, +.theme-yellow .swiper-pagination .swiper-pagination-bullet-active { + background-color: #ffeb3b; +} +.swiper-pagination.color-yellow .swiper-pagination-progressbar, +.theme-yellow .swiper-pagination .swiper-pagination-progressbar { + background-color: #ffeb3b; +} +.swiper-pagination.swiper-pagination-progress.bg-yellow { + background-color: rgba(255, 235, 59, 0.25); +} +.swiper-button-next.color-yellow, +.swiper-container-rtl .swiper-button-prev.color-yellow, +.theme-yellow .swiper-button-next, +.theme-yellow .swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffeb3b'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-prev.color-yellow, +.swiper-container-rtl .swiper-button-next.color-yellow, +.theme-yellow .swiper-button-prev, +.theme-yellow .swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffeb3b'%2F%3E%3C%2Fsvg%3E"); +} +.bg-yellow, +a.bg-yellow, +.list-block .swipeout-actions-left a.bg-yellow, +.list-block .swipeout-actions-right a.bg-yellow { + background-color: #ffeb3b; +} +html:not(.watch-active-state) .list-block .bg-yellow .item-link:active, +html:not(.watch-active-state) .list-block a.bg-yellow .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-left a.bg-yellow .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-right a.bg-yellow .item-link:active, +html:not(.watch-active-state) .list-block.bg-yellow .item-link:active, +html:not(.watch-active-state) .list-blocka.bg-yellow .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-left a.bg-yellow .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-right a.bg-yellow .item-link:active, +html:not(.watch-active-state) .list-block .item-link.bg-yellow:active, +html:not(.watch-active-state) .list-block .item-linka.bg-yellow:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-left a.bg-yellow:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-right a.bg-yellow:active, +.list-block .bg-yellow .item-link.active-state, +.list-block a.bg-yellow .item-link.active-state, +.list-block .list-block .swipeout-actions-left a.bg-yellow .item-link.active-state, +.list-block .list-block .swipeout-actions-right a.bg-yellow .item-link.active-state, +.list-block.bg-yellow .item-link.active-state, +.list-blocka.bg-yellow .item-link.active-state, +.list-block.list-block .swipeout-actions-left a.bg-yellow .item-link.active-state, +.list-block.list-block .swipeout-actions-right a.bg-yellow .item-link.active-state, +.list-block .item-link.bg-yellow.active-state, +.list-block .item-linka.bg-yellow.active-state, +.list-block .item-link.list-block .swipeout-actions-left a.bg-yellow.active-state, +.list-block .item-link.list-block .swipeout-actions-right a.bg-yellow.active-state { + background: #FBC02D; +} +.border-yellow { + border-color: #ffeb3b; +} +.list-block .border-yellow.item-inner:after, +.list-block ul.border-yellow:after, +.border-yellow:after, +.list-block .border-yellow.item-inner:before, +.list-block ul.border-yellow:before, +.border-yellow:before { + background-color: #ffeb3b; +} +.theme-yellow .floating-button, +.theme-yellow .speed-dial-buttons a, +.floating-button.theme-yellow, +.speed-dial-buttons a.theme-yellow, +.floating-button.color-yellow, +.speed-dial-buttons a.color-yellow, +.floating-button.bg-yellow, +.speed-dial-buttons a.bg-yellow { + color: #fff; + background: #ffeb3b; +} +html:not(.watch-active-state) .theme-yellow .floating-button:active, +html:not(.watch-active-state) .theme-yellow .speed-dial-buttons a:active, +html:not(.watch-active-state) .floating-button.theme-yellow:active, +html:not(.watch-active-state) .speed-dial-buttons a.theme-yellow:active, +html:not(.watch-active-state) .floating-button.color-yellow:active, +html:not(.watch-active-state) .speed-dial-buttons a.color-yellow:active, +html:not(.watch-active-state) .floating-button.bg-yellow:active, +html:not(.watch-active-state) .speed-dial-buttons a.bg-yellow:active, +.theme-yellow .floating-button.active-state, +.theme-yellow .speed-dial-buttons a.active-state, +.floating-button.theme-yellow.active-state, +.speed-dial-buttons a.theme-yellow.active-state, +.floating-button.color-yellow.active-state, +.speed-dial-buttons a.color-yellow.active-state, +.floating-button.bg-yellow.active-state, +.speed-dial-buttons a.bg-yellow.active-state { + background: #FBC02D; +} +.theme-yellow .floating-button i, +.theme-yellow .speed-dial-buttons a i, +.floating-button.theme-yellow i, +.speed-dial-buttons a.theme-yellow i, +.floating-button.color-yellow i, +.speed-dial-buttons a.color-yellow i, +.floating-button.bg-yellow i, +.speed-dial-buttons a.bg-yellow i { + color: inherit; +} +.ripple-yellow .ripple-wave { + background-color: rgba(255, 235, 59, 0.3); +} +.badge.color-yellow, +.badge.theme-yellow { + background-color: #ffeb3b; + color: #fff; +} +.color-amber { + color: #ffc107; +} +.list-block .item-link.list-button.color-amber, +.list-block .item-link.color-amber, +.tabbar a.active.color-amber, +a.color-amber { + color: #ffc107; +} +.label-switch input[type="checkbox"]:checked + .checkbox.color-amber, +.label-switch.color-amber input[type="checkbox"]:checked + .checkbox { + background-color: #ffc107; +} +.theme-amber .button:not(.button-fill) { + color: #ffc107; +} +.theme-amber .navbar .button:not(.button-fill), +.theme-amber.navbar .button:not(.button-fill), +.theme-amber .toolbar .button:not(.button-fill), +.theme-amber.toolbar .button:not(.button-fill), +.theme-amber .subnavbar .button:not(.button-fill), +.theme-amber.subnavbar .button:not(.button-fill) { + color: #fff; +} +.button.color-amber:not(.button-fill), +.color-amber.buttons-row .button:not(.button-fill) { + color: #ffc107 !important; +} +.theme-amber .button.button-fill { + background: #ffc107; + color: #fff; +} +html:not(.watch-active-state) .theme-amber .button.button-fill:active, +.theme-amber .button.button-fill.active-state { + background: #FFA000; +} +.button.button-fill.bg-amber, +.button.button-fill.color-amber { + background: #ffc107 !important; + color: #fff; +} +html:not(.watch-active-state) .button.button-fill.bg-amber:active, +html:not(.watch-active-state) .button.button-fill.color-amber:active, +.button.button-fill.bg-amber.active-state, +.button.button-fill.color-amber.active-state { + background: #FFA000 !important; +} +.progressbar.color-amber, +.progressbar.theme-amber, +.theme-amber .progressbar, +.progressbar.bg-amber { + background-color: rgba(255, 193, 7, 0.5); +} +.progressbar.color-amber span, +.progressbar.theme-amber span, +.theme-amber .progressbar span, +.progressbar.bg-amber span { + background-color: #ffc107; +} +.progressbar-infinite.color-amber, +.progressbar-infinite.theme-amber, +.theme-amber .progressbar-infinite, +.progressbar-infinite.bg-amber { + background-color: rgba(255, 193, 7, 0.5); +} +.progressbar-infinite.color-amber:after, +.progressbar-infinite.theme-amber:after, +.theme-amber .progressbar-infinite:after, +.progressbar-infinite.bg-amber:after, +.progressbar-infinite.color-amber:before, +.progressbar-infinite.theme-amber:before, +.theme-amber .progressbar-infinite:before, +.progressbar-infinite.bg-amber:before { + background-color: #ffc107; +} +.color-amber i.icon, +i.icon.color-amber { + color: #ffc107; +} +i.icon-next.color-amber, +i.icon-next.theme-amber { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffc107'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-amber, +i.icon-prev.theme-amber { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffc107'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-amber, +i.icon-back.theme-amber { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23ffc107'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-amber, +i.icon-forward.theme-amber { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23ffc107'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-bars.color-amber, +i.icon-bars.theme-amber { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M3%2018h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z'%20fill%3D'%23ffc107'%2F%3E%3C%2Fsvg%3E"); +} +.preloader.color-amber svg circle, +.preloader.preloader-amber svg circle { + stroke: #ffc107; +} +.preloader.color-amber .preloader-inner-gap, +.preloader.preloader-amber .preloader-inner-gap, +.preloader.color-amber .preloader-inner-half-circle, +.preloader.preloader-amber .preloader-inner-half-circle { + border-color: #ffc107; +} +.theme-amber a { + color: #ffc107; +} +.theme-amber .navbar, +.navbar.theme-amber, +.theme-amber .toolbar, +.toolbar.theme-amber, +.theme-amber .subnavbar, +.subnavbar.theme-amber, +.theme-amber .searchbar, +.searchbar.theme-amber { + background-color: #ffc107; +} +.theme-amber .range-slider input[type="range"]::-webkit-slider-thumb:before, +.range-slider.theme-amber input[type="range"]::-webkit-slider-thumb:before { + background-color: #ffc107; +} +.theme-amber .range-slider input[type="range"]::-webkit-slider-thumb, +.range-slider.theme-amber input[type="range"]::-webkit-slider-thumb { + background-color: #ffc107; +} +.theme-amber .range-slider input[type="range"]::-ms-thumb, +.range-slider.theme-amber input[type="range"]::-ms-thumb { + background-color: #ffc107; +} +.theme-amber .range-slider input[type="range"]::-ms-fill-lower, +.range-slider.theme-amber input[type="range"]::-ms-fill-lower { + background-color: #ffc107; +} +.theme-amber .range-slider input[type="range"]::-moz-range-thumb, +.range-slider.theme-amber input[type="range"]::-moz-range-thumb { + background-color: #ffc107; +} +.theme-amber .label-switch input[type="checkbox"]:checked + .checkbox, +.label-switch.theme-amber input[type="checkbox"]:checked + .checkbox { + background-color: rgba(255, 193, 7, 0.5); +} +.theme-amber .label-switch input[type="checkbox"]:checked + .checkbox:after, +.label-switch.theme-amber input[type="checkbox"]:checked + .checkbox:after { + background-color: #ffc107; +} +.theme-amber label.label-checkbox, +label.label-checkbox.theme-amber { + cursor: pointer; +} +.theme-amber label.label-checkbox i.icon-form-checkbox:after, +label.label-checkbox.theme-amber i.icon-form-checkbox:after { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M9%2016.17L4.83%2012l-1.42%201.41L9%2019%2021%207l-1.41-1.41z'%2F%3E%3C%2Fsvg%3E"); +} +.theme-amber label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-amber input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +.theme-amber label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-amber input[type="radio"]:checked + .item-media i.icon-form-checkbox, +.theme-amber label.label-checkbox input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-amber input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +.theme-amber label.label-checkbox input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-amber input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +.theme-amber label.label-checkbox input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-amber input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +.theme-amber label.label-checkbox input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-amber input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox { + border-color: #ffc107; + background-color: #ffc107; +} +.theme-amber label.label-radio i.icon-form-radio:after, +label.label-radio.theme-amber i.icon-form-radio:after { + background-color: #ffc107; +} +.theme-amber label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-amber input[type="checkbox"]:checked + .item-media i.icon-form-radio, +.theme-amber label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-amber input[type="radio"]:checked + .item-media i.icon-form-radio, +.theme-amber label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-amber input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +.theme-amber label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-amber input[type="radio"]:checked ~ .item-after i.icon-form-radio, +.theme-amber label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-amber input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +.theme-amber label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-amber input[type="radio"]:checked ~ .item-inner i.icon-form-radio { + border-color: #ffc107; +} +.theme-amber label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-amber input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +.theme-amber label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-amber input[type="radio"]:checked + .item-media i.icon-form-radio:after, +.theme-amber label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-amber input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +.theme-amber label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-amber input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +.theme-amber label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-amber input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +.theme-amber label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-amber input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after { + background-color: #ffc107; +} +.theme-amber .focus-state .label, +.theme-amber .focus-state .floating-label { + color: #ffc107; +} +.theme-amber .item-input-field.focus-state:after, +.theme-amber .input-field.focus-state:after, +.theme-amber .item-input-field.not-empty-state:after, +.theme-amber .input-field.not-empty-state:after { + background: #ffc107; +} +.theme-amber .picker-calendar-day.picker-calendar-day-today span { + color: #ffc107; +} +.theme-amber .picker-calendar-day.picker-calendar-day-selected span { + background-color: #ffc107; + color: #fff; +} +.theme-amber .picker-calendar-day.picker-calendar-day-has-events span:after { + background-color: #ffc107; +} +.theme-amber .picker-header { + background-color: #ffc107; +} +.theme-amber .modal-button { + color: #ffc107; +} +.swiper-pagination.color-amber .swiper-pagination-bullet-active, +.theme-amber .swiper-pagination .swiper-pagination-bullet-active { + background-color: #ffc107; +} +.swiper-pagination.color-amber .swiper-pagination-progressbar, +.theme-amber .swiper-pagination .swiper-pagination-progressbar { + background-color: #ffc107; +} +.swiper-pagination.swiper-pagination-progress.bg-amber { + background-color: rgba(255, 193, 7, 0.25); +} +.swiper-button-next.color-amber, +.swiper-container-rtl .swiper-button-prev.color-amber, +.theme-amber .swiper-button-next, +.theme-amber .swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffc107'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-prev.color-amber, +.swiper-container-rtl .swiper-button-next.color-amber, +.theme-amber .swiper-button-prev, +.theme-amber .swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffc107'%2F%3E%3C%2Fsvg%3E"); +} +.bg-amber, +a.bg-amber, +.list-block .swipeout-actions-left a.bg-amber, +.list-block .swipeout-actions-right a.bg-amber { + background-color: #ffc107; +} +html:not(.watch-active-state) .list-block .bg-amber .item-link:active, +html:not(.watch-active-state) .list-block a.bg-amber .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-left a.bg-amber .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-right a.bg-amber .item-link:active, +html:not(.watch-active-state) .list-block.bg-amber .item-link:active, +html:not(.watch-active-state) .list-blocka.bg-amber .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-left a.bg-amber .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-right a.bg-amber .item-link:active, +html:not(.watch-active-state) .list-block .item-link.bg-amber:active, +html:not(.watch-active-state) .list-block .item-linka.bg-amber:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-left a.bg-amber:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-right a.bg-amber:active, +.list-block .bg-amber .item-link.active-state, +.list-block a.bg-amber .item-link.active-state, +.list-block .list-block .swipeout-actions-left a.bg-amber .item-link.active-state, +.list-block .list-block .swipeout-actions-right a.bg-amber .item-link.active-state, +.list-block.bg-amber .item-link.active-state, +.list-blocka.bg-amber .item-link.active-state, +.list-block.list-block .swipeout-actions-left a.bg-amber .item-link.active-state, +.list-block.list-block .swipeout-actions-right a.bg-amber .item-link.active-state, +.list-block .item-link.bg-amber.active-state, +.list-block .item-linka.bg-amber.active-state, +.list-block .item-link.list-block .swipeout-actions-left a.bg-amber.active-state, +.list-block .item-link.list-block .swipeout-actions-right a.bg-amber.active-state { + background: #FFA000; +} +.border-amber { + border-color: #ffc107; +} +.list-block .border-amber.item-inner:after, +.list-block ul.border-amber:after, +.border-amber:after, +.list-block .border-amber.item-inner:before, +.list-block ul.border-amber:before, +.border-amber:before { + background-color: #ffc107; +} +.theme-amber .floating-button, +.theme-amber .speed-dial-buttons a, +.floating-button.theme-amber, +.speed-dial-buttons a.theme-amber, +.floating-button.color-amber, +.speed-dial-buttons a.color-amber, +.floating-button.bg-amber, +.speed-dial-buttons a.bg-amber { + color: #fff; + background: #ffc107; +} +html:not(.watch-active-state) .theme-amber .floating-button:active, +html:not(.watch-active-state) .theme-amber .speed-dial-buttons a:active, +html:not(.watch-active-state) .floating-button.theme-amber:active, +html:not(.watch-active-state) .speed-dial-buttons a.theme-amber:active, +html:not(.watch-active-state) .floating-button.color-amber:active, +html:not(.watch-active-state) .speed-dial-buttons a.color-amber:active, +html:not(.watch-active-state) .floating-button.bg-amber:active, +html:not(.watch-active-state) .speed-dial-buttons a.bg-amber:active, +.theme-amber .floating-button.active-state, +.theme-amber .speed-dial-buttons a.active-state, +.floating-button.theme-amber.active-state, +.speed-dial-buttons a.theme-amber.active-state, +.floating-button.color-amber.active-state, +.speed-dial-buttons a.color-amber.active-state, +.floating-button.bg-amber.active-state, +.speed-dial-buttons a.bg-amber.active-state { + background: #FFA000; +} +.theme-amber .floating-button i, +.theme-amber .speed-dial-buttons a i, +.floating-button.theme-amber i, +.speed-dial-buttons a.theme-amber i, +.floating-button.color-amber i, +.speed-dial-buttons a.color-amber i, +.floating-button.bg-amber i, +.speed-dial-buttons a.bg-amber i { + color: inherit; +} +.ripple-amber .ripple-wave { + background-color: rgba(255, 193, 7, 0.3); +} +.badge.color-amber, +.badge.theme-amber { + background-color: #ffc107; + color: #fff; +} +.color-orange { + color: #ff9800; +} +.list-block .item-link.list-button.color-orange, +.list-block .item-link.color-orange, +.tabbar a.active.color-orange, +a.color-orange { + color: #ff9800; +} +.label-switch input[type="checkbox"]:checked + .checkbox.color-orange, +.label-switch.color-orange input[type="checkbox"]:checked + .checkbox { + background-color: #ff9800; +} +.theme-orange .button:not(.button-fill) { + color: #ff9800; +} +.theme-orange .navbar .button:not(.button-fill), +.theme-orange.navbar .button:not(.button-fill), +.theme-orange .toolbar .button:not(.button-fill), +.theme-orange.toolbar .button:not(.button-fill), +.theme-orange .subnavbar .button:not(.button-fill), +.theme-orange.subnavbar .button:not(.button-fill) { + color: #fff; +} +.button.color-orange:not(.button-fill), +.color-orange.buttons-row .button:not(.button-fill) { + color: #ff9800 !important; +} +.theme-orange .button.button-fill { + background: #ff9800; + color: #fff; +} +html:not(.watch-active-state) .theme-orange .button.button-fill:active, +.theme-orange .button.button-fill.active-state { + background: #F57C00; +} +.button.button-fill.bg-orange, +.button.button-fill.color-orange { + background: #ff9800 !important; + color: #fff; +} +html:not(.watch-active-state) .button.button-fill.bg-orange:active, +html:not(.watch-active-state) .button.button-fill.color-orange:active, +.button.button-fill.bg-orange.active-state, +.button.button-fill.color-orange.active-state { + background: #F57C00 !important; +} +.progressbar.color-orange, +.progressbar.theme-orange, +.theme-orange .progressbar, +.progressbar.bg-orange { + background-color: rgba(255, 152, 0, 0.5); +} +.progressbar.color-orange span, +.progressbar.theme-orange span, +.theme-orange .progressbar span, +.progressbar.bg-orange span { + background-color: #ff9800; +} +.progressbar-infinite.color-orange, +.progressbar-infinite.theme-orange, +.theme-orange .progressbar-infinite, +.progressbar-infinite.bg-orange { + background-color: rgba(255, 152, 0, 0.5); +} +.progressbar-infinite.color-orange:after, +.progressbar-infinite.theme-orange:after, +.theme-orange .progressbar-infinite:after, +.progressbar-infinite.bg-orange:after, +.progressbar-infinite.color-orange:before, +.progressbar-infinite.theme-orange:before, +.theme-orange .progressbar-infinite:before, +.progressbar-infinite.bg-orange:before { + background-color: #ff9800; +} +.color-orange i.icon, +i.icon.color-orange { + color: #ff9800; +} +i.icon-next.color-orange, +i.icon-next.theme-orange { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ff9800'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-orange, +i.icon-prev.theme-orange { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ff9800'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-orange, +i.icon-back.theme-orange { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23ff9800'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-orange, +i.icon-forward.theme-orange { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23ff9800'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-bars.color-orange, +i.icon-bars.theme-orange { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M3%2018h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z'%20fill%3D'%23ff9800'%2F%3E%3C%2Fsvg%3E"); +} +.preloader.color-orange svg circle, +.preloader.preloader-orange svg circle { + stroke: #ff9800; +} +.preloader.color-orange .preloader-inner-gap, +.preloader.preloader-orange .preloader-inner-gap, +.preloader.color-orange .preloader-inner-half-circle, +.preloader.preloader-orange .preloader-inner-half-circle { + border-color: #ff9800; +} +.theme-orange a { + color: #ff9800; +} +.theme-orange .navbar, +.navbar.theme-orange, +.theme-orange .toolbar, +.toolbar.theme-orange, +.theme-orange .subnavbar, +.subnavbar.theme-orange, +.theme-orange .searchbar, +.searchbar.theme-orange { + background-color: #ff9800; +} +.theme-orange .range-slider input[type="range"]::-webkit-slider-thumb:before, +.range-slider.theme-orange input[type="range"]::-webkit-slider-thumb:before { + background-color: #ff9800; +} +.theme-orange .range-slider input[type="range"]::-webkit-slider-thumb, +.range-slider.theme-orange input[type="range"]::-webkit-slider-thumb { + background-color: #ff9800; +} +.theme-orange .range-slider input[type="range"]::-ms-thumb, +.range-slider.theme-orange input[type="range"]::-ms-thumb { + background-color: #ff9800; +} +.theme-orange .range-slider input[type="range"]::-ms-fill-lower, +.range-slider.theme-orange input[type="range"]::-ms-fill-lower { + background-color: #ff9800; +} +.theme-orange .range-slider input[type="range"]::-moz-range-thumb, +.range-slider.theme-orange input[type="range"]::-moz-range-thumb { + background-color: #ff9800; +} +.theme-orange .label-switch input[type="checkbox"]:checked + .checkbox, +.label-switch.theme-orange input[type="checkbox"]:checked + .checkbox { + background-color: rgba(255, 152, 0, 0.5); +} +.theme-orange .label-switch input[type="checkbox"]:checked + .checkbox:after, +.label-switch.theme-orange input[type="checkbox"]:checked + .checkbox:after { + background-color: #ff9800; +} +.theme-orange label.label-checkbox, +label.label-checkbox.theme-orange { + cursor: pointer; +} +.theme-orange label.label-checkbox i.icon-form-checkbox:after, +label.label-checkbox.theme-orange i.icon-form-checkbox:after { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M9%2016.17L4.83%2012l-1.42%201.41L9%2019%2021%207l-1.41-1.41z'%2F%3E%3C%2Fsvg%3E"); +} +.theme-orange label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-orange input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +.theme-orange label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-orange input[type="radio"]:checked + .item-media i.icon-form-checkbox, +.theme-orange label.label-checkbox input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-orange input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +.theme-orange label.label-checkbox input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-orange input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +.theme-orange label.label-checkbox input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-orange input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +.theme-orange label.label-checkbox input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-orange input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox { + border-color: #ff9800; + background-color: #ff9800; +} +.theme-orange label.label-radio i.icon-form-radio:after, +label.label-radio.theme-orange i.icon-form-radio:after { + background-color: #ff9800; +} +.theme-orange label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-orange input[type="checkbox"]:checked + .item-media i.icon-form-radio, +.theme-orange label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-orange input[type="radio"]:checked + .item-media i.icon-form-radio, +.theme-orange label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-orange input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +.theme-orange label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-orange input[type="radio"]:checked ~ .item-after i.icon-form-radio, +.theme-orange label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-orange input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +.theme-orange label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-orange input[type="radio"]:checked ~ .item-inner i.icon-form-radio { + border-color: #ff9800; +} +.theme-orange label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-orange input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +.theme-orange label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-orange input[type="radio"]:checked + .item-media i.icon-form-radio:after, +.theme-orange label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-orange input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +.theme-orange label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-orange input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +.theme-orange label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-orange input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +.theme-orange label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-orange input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after { + background-color: #ff9800; +} +.theme-orange .focus-state .label, +.theme-orange .focus-state .floating-label { + color: #ff9800; +} +.theme-orange .item-input-field.focus-state:after, +.theme-orange .input-field.focus-state:after, +.theme-orange .item-input-field.not-empty-state:after, +.theme-orange .input-field.not-empty-state:after { + background: #ff9800; +} +.theme-orange .picker-calendar-day.picker-calendar-day-today span { + color: #ff9800; +} +.theme-orange .picker-calendar-day.picker-calendar-day-selected span { + background-color: #ff9800; + color: #fff; +} +.theme-orange .picker-calendar-day.picker-calendar-day-has-events span:after { + background-color: #ff9800; +} +.theme-orange .picker-header { + background-color: #ff9800; +} +.theme-orange .modal-button { + color: #ff9800; +} +.swiper-pagination.color-orange .swiper-pagination-bullet-active, +.theme-orange .swiper-pagination .swiper-pagination-bullet-active { + background-color: #ff9800; +} +.swiper-pagination.color-orange .swiper-pagination-progressbar, +.theme-orange .swiper-pagination .swiper-pagination-progressbar { + background-color: #ff9800; +} +.swiper-pagination.swiper-pagination-progress.bg-orange { + background-color: rgba(255, 152, 0, 0.25); +} +.swiper-button-next.color-orange, +.swiper-container-rtl .swiper-button-prev.color-orange, +.theme-orange .swiper-button-next, +.theme-orange .swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ff9800'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-prev.color-orange, +.swiper-container-rtl .swiper-button-next.color-orange, +.theme-orange .swiper-button-prev, +.theme-orange .swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ff9800'%2F%3E%3C%2Fsvg%3E"); +} +.bg-orange, +a.bg-orange, +.list-block .swipeout-actions-left a.bg-orange, +.list-block .swipeout-actions-right a.bg-orange { + background-color: #ff9800; +} +html:not(.watch-active-state) .list-block .bg-orange .item-link:active, +html:not(.watch-active-state) .list-block a.bg-orange .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-left a.bg-orange .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-right a.bg-orange .item-link:active, +html:not(.watch-active-state) .list-block.bg-orange .item-link:active, +html:not(.watch-active-state) .list-blocka.bg-orange .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-left a.bg-orange .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-right a.bg-orange .item-link:active, +html:not(.watch-active-state) .list-block .item-link.bg-orange:active, +html:not(.watch-active-state) .list-block .item-linka.bg-orange:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-left a.bg-orange:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-right a.bg-orange:active, +.list-block .bg-orange .item-link.active-state, +.list-block a.bg-orange .item-link.active-state, +.list-block .list-block .swipeout-actions-left a.bg-orange .item-link.active-state, +.list-block .list-block .swipeout-actions-right a.bg-orange .item-link.active-state, +.list-block.bg-orange .item-link.active-state, +.list-blocka.bg-orange .item-link.active-state, +.list-block.list-block .swipeout-actions-left a.bg-orange .item-link.active-state, +.list-block.list-block .swipeout-actions-right a.bg-orange .item-link.active-state, +.list-block .item-link.bg-orange.active-state, +.list-block .item-linka.bg-orange.active-state, +.list-block .item-link.list-block .swipeout-actions-left a.bg-orange.active-state, +.list-block .item-link.list-block .swipeout-actions-right a.bg-orange.active-state { + background: #F57C00; +} +.border-orange { + border-color: #ff9800; +} +.list-block .border-orange.item-inner:after, +.list-block ul.border-orange:after, +.border-orange:after, +.list-block .border-orange.item-inner:before, +.list-block ul.border-orange:before, +.border-orange:before { + background-color: #ff9800; +} +.theme-orange .floating-button, +.theme-orange .speed-dial-buttons a, +.floating-button.theme-orange, +.speed-dial-buttons a.theme-orange, +.floating-button.color-orange, +.speed-dial-buttons a.color-orange, +.floating-button.bg-orange, +.speed-dial-buttons a.bg-orange { + color: #fff; + background: #ff9800; +} +html:not(.watch-active-state) .theme-orange .floating-button:active, +html:not(.watch-active-state) .theme-orange .speed-dial-buttons a:active, +html:not(.watch-active-state) .floating-button.theme-orange:active, +html:not(.watch-active-state) .speed-dial-buttons a.theme-orange:active, +html:not(.watch-active-state) .floating-button.color-orange:active, +html:not(.watch-active-state) .speed-dial-buttons a.color-orange:active, +html:not(.watch-active-state) .floating-button.bg-orange:active, +html:not(.watch-active-state) .speed-dial-buttons a.bg-orange:active, +.theme-orange .floating-button.active-state, +.theme-orange .speed-dial-buttons a.active-state, +.floating-button.theme-orange.active-state, +.speed-dial-buttons a.theme-orange.active-state, +.floating-button.color-orange.active-state, +.speed-dial-buttons a.color-orange.active-state, +.floating-button.bg-orange.active-state, +.speed-dial-buttons a.bg-orange.active-state { + background: #F57C00; +} +.theme-orange .floating-button i, +.theme-orange .speed-dial-buttons a i, +.floating-button.theme-orange i, +.speed-dial-buttons a.theme-orange i, +.floating-button.color-orange i, +.speed-dial-buttons a.color-orange i, +.floating-button.bg-orange i, +.speed-dial-buttons a.bg-orange i { + color: inherit; +} +.ripple-orange .ripple-wave { + background-color: rgba(255, 152, 0, 0.3); +} +.badge.color-orange, +.badge.theme-orange { + background-color: #ff9800; + color: #fff; +} +.color-deeporange { + color: #ff5722; +} +.list-block .item-link.list-button.color-deeporange, +.list-block .item-link.color-deeporange, +.tabbar a.active.color-deeporange, +a.color-deeporange { + color: #ff5722; +} +.label-switch input[type="checkbox"]:checked + .checkbox.color-deeporange, +.label-switch.color-deeporange input[type="checkbox"]:checked + .checkbox { + background-color: #ff5722; +} +.theme-deeporange .button:not(.button-fill) { + color: #ff5722; +} +.theme-deeporange .navbar .button:not(.button-fill), +.theme-deeporange.navbar .button:not(.button-fill), +.theme-deeporange .toolbar .button:not(.button-fill), +.theme-deeporange.toolbar .button:not(.button-fill), +.theme-deeporange .subnavbar .button:not(.button-fill), +.theme-deeporange.subnavbar .button:not(.button-fill) { + color: #fff; +} +.button.color-deeporange:not(.button-fill), +.color-deeporange.buttons-row .button:not(.button-fill) { + color: #ff5722 !important; +} +.theme-deeporange .button.button-fill { + background: #ff5722; + color: #fff; +} +html:not(.watch-active-state) .theme-deeporange .button.button-fill:active, +.theme-deeporange .button.button-fill.active-state { + background: #E64A19; +} +.button.button-fill.bg-deeporange, +.button.button-fill.color-deeporange { + background: #ff5722 !important; + color: #fff; +} +html:not(.watch-active-state) .button.button-fill.bg-deeporange:active, +html:not(.watch-active-state) .button.button-fill.color-deeporange:active, +.button.button-fill.bg-deeporange.active-state, +.button.button-fill.color-deeporange.active-state { + background: #E64A19 !important; +} +.progressbar.color-deeporange, +.progressbar.theme-deeporange, +.theme-deeporange .progressbar, +.progressbar.bg-deeporange { + background-color: rgba(255, 87, 34, 0.5); +} +.progressbar.color-deeporange span, +.progressbar.theme-deeporange span, +.theme-deeporange .progressbar span, +.progressbar.bg-deeporange span { + background-color: #ff5722; +} +.progressbar-infinite.color-deeporange, +.progressbar-infinite.theme-deeporange, +.theme-deeporange .progressbar-infinite, +.progressbar-infinite.bg-deeporange { + background-color: rgba(255, 87, 34, 0.5); +} +.progressbar-infinite.color-deeporange:after, +.progressbar-infinite.theme-deeporange:after, +.theme-deeporange .progressbar-infinite:after, +.progressbar-infinite.bg-deeporange:after, +.progressbar-infinite.color-deeporange:before, +.progressbar-infinite.theme-deeporange:before, +.theme-deeporange .progressbar-infinite:before, +.progressbar-infinite.bg-deeporange:before { + background-color: #ff5722; +} +.color-deeporange i.icon, +i.icon.color-deeporange { + color: #ff5722; +} +i.icon-next.color-deeporange, +i.icon-next.theme-deeporange { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ff5722'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-deeporange, +i.icon-prev.theme-deeporange { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ff5722'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-deeporange, +i.icon-back.theme-deeporange { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23ff5722'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-deeporange, +i.icon-forward.theme-deeporange { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23ff5722'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-bars.color-deeporange, +i.icon-bars.theme-deeporange { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M3%2018h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z'%20fill%3D'%23ff5722'%2F%3E%3C%2Fsvg%3E"); +} +.preloader.color-deeporange svg circle, +.preloader.preloader-deeporange svg circle { + stroke: #ff5722; +} +.preloader.color-deeporange .preloader-inner-gap, +.preloader.preloader-deeporange .preloader-inner-gap, +.preloader.color-deeporange .preloader-inner-half-circle, +.preloader.preloader-deeporange .preloader-inner-half-circle { + border-color: #ff5722; +} +.theme-deeporange a { + color: #ff5722; +} +.theme-deeporange .navbar, +.navbar.theme-deeporange, +.theme-deeporange .toolbar, +.toolbar.theme-deeporange, +.theme-deeporange .subnavbar, +.subnavbar.theme-deeporange, +.theme-deeporange .searchbar, +.searchbar.theme-deeporange { + background-color: #ff5722; +} +.theme-deeporange .range-slider input[type="range"]::-webkit-slider-thumb:before, +.range-slider.theme-deeporange input[type="range"]::-webkit-slider-thumb:before { + background-color: #ff5722; +} +.theme-deeporange .range-slider input[type="range"]::-webkit-slider-thumb, +.range-slider.theme-deeporange input[type="range"]::-webkit-slider-thumb { + background-color: #ff5722; +} +.theme-deeporange .range-slider input[type="range"]::-ms-thumb, +.range-slider.theme-deeporange input[type="range"]::-ms-thumb { + background-color: #ff5722; +} +.theme-deeporange .range-slider input[type="range"]::-ms-fill-lower, +.range-slider.theme-deeporange input[type="range"]::-ms-fill-lower { + background-color: #ff5722; +} +.theme-deeporange .range-slider input[type="range"]::-moz-range-thumb, +.range-slider.theme-deeporange input[type="range"]::-moz-range-thumb { + background-color: #ff5722; +} +.theme-deeporange .label-switch input[type="checkbox"]:checked + .checkbox, +.label-switch.theme-deeporange input[type="checkbox"]:checked + .checkbox { + background-color: rgba(255, 87, 34, 0.5); +} +.theme-deeporange .label-switch input[type="checkbox"]:checked + .checkbox:after, +.label-switch.theme-deeporange input[type="checkbox"]:checked + .checkbox:after { + background-color: #ff5722; +} +.theme-deeporange label.label-checkbox, +label.label-checkbox.theme-deeporange { + cursor: pointer; +} +.theme-deeporange label.label-checkbox i.icon-form-checkbox:after, +label.label-checkbox.theme-deeporange i.icon-form-checkbox:after { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M9%2016.17L4.83%2012l-1.42%201.41L9%2019%2021%207l-1.41-1.41z'%2F%3E%3C%2Fsvg%3E"); +} +.theme-deeporange label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-deeporange input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +.theme-deeporange label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-deeporange input[type="radio"]:checked + .item-media i.icon-form-checkbox, +.theme-deeporange label.label-checkbox input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-deeporange input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +.theme-deeporange label.label-checkbox input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-deeporange input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +.theme-deeporange label.label-checkbox input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-deeporange input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +.theme-deeporange label.label-checkbox input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-deeporange input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox { + border-color: #ff5722; + background-color: #ff5722; +} +.theme-deeporange label.label-radio i.icon-form-radio:after, +label.label-radio.theme-deeporange i.icon-form-radio:after { + background-color: #ff5722; +} +.theme-deeporange label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-deeporange input[type="checkbox"]:checked + .item-media i.icon-form-radio, +.theme-deeporange label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-deeporange input[type="radio"]:checked + .item-media i.icon-form-radio, +.theme-deeporange label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-deeporange input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +.theme-deeporange label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-deeporange input[type="radio"]:checked ~ .item-after i.icon-form-radio, +.theme-deeporange label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-deeporange input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +.theme-deeporange label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-deeporange input[type="radio"]:checked ~ .item-inner i.icon-form-radio { + border-color: #ff5722; +} +.theme-deeporange label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-deeporange input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +.theme-deeporange label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-deeporange input[type="radio"]:checked + .item-media i.icon-form-radio:after, +.theme-deeporange label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-deeporange input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +.theme-deeporange label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-deeporange input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +.theme-deeporange label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-deeporange input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +.theme-deeporange label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-deeporange input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after { + background-color: #ff5722; +} +.theme-deeporange .focus-state .label, +.theme-deeporange .focus-state .floating-label { + color: #ff5722; +} +.theme-deeporange .item-input-field.focus-state:after, +.theme-deeporange .input-field.focus-state:after, +.theme-deeporange .item-input-field.not-empty-state:after, +.theme-deeporange .input-field.not-empty-state:after { + background: #ff5722; +} +.theme-deeporange .picker-calendar-day.picker-calendar-day-today span { + color: #ff5722; +} +.theme-deeporange .picker-calendar-day.picker-calendar-day-selected span { + background-color: #ff5722; + color: #fff; +} +.theme-deeporange .picker-calendar-day.picker-calendar-day-has-events span:after { + background-color: #ff5722; +} +.theme-deeporange .picker-header { + background-color: #ff5722; +} +.theme-deeporange .modal-button { + color: #ff5722; +} +.swiper-pagination.color-deeporange .swiper-pagination-bullet-active, +.theme-deeporange .swiper-pagination .swiper-pagination-bullet-active { + background-color: #ff5722; +} +.swiper-pagination.color-deeporange .swiper-pagination-progressbar, +.theme-deeporange .swiper-pagination .swiper-pagination-progressbar { + background-color: #ff5722; +} +.swiper-pagination.swiper-pagination-progress.bg-deeporange { + background-color: rgba(255, 87, 34, 0.25); +} +.swiper-button-next.color-deeporange, +.swiper-container-rtl .swiper-button-prev.color-deeporange, +.theme-deeporange .swiper-button-next, +.theme-deeporange .swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ff5722'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-prev.color-deeporange, +.swiper-container-rtl .swiper-button-next.color-deeporange, +.theme-deeporange .swiper-button-prev, +.theme-deeporange .swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ff5722'%2F%3E%3C%2Fsvg%3E"); +} +.bg-deeporange, +a.bg-deeporange, +.list-block .swipeout-actions-left a.bg-deeporange, +.list-block .swipeout-actions-right a.bg-deeporange { + background-color: #ff5722; +} +html:not(.watch-active-state) .list-block .bg-deeporange .item-link:active, +html:not(.watch-active-state) .list-block a.bg-deeporange .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-left a.bg-deeporange .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-right a.bg-deeporange .item-link:active, +html:not(.watch-active-state) .list-block.bg-deeporange .item-link:active, +html:not(.watch-active-state) .list-blocka.bg-deeporange .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-left a.bg-deeporange .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-right a.bg-deeporange .item-link:active, +html:not(.watch-active-state) .list-block .item-link.bg-deeporange:active, +html:not(.watch-active-state) .list-block .item-linka.bg-deeporange:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-left a.bg-deeporange:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-right a.bg-deeporange:active, +.list-block .bg-deeporange .item-link.active-state, +.list-block a.bg-deeporange .item-link.active-state, +.list-block .list-block .swipeout-actions-left a.bg-deeporange .item-link.active-state, +.list-block .list-block .swipeout-actions-right a.bg-deeporange .item-link.active-state, +.list-block.bg-deeporange .item-link.active-state, +.list-blocka.bg-deeporange .item-link.active-state, +.list-block.list-block .swipeout-actions-left a.bg-deeporange .item-link.active-state, +.list-block.list-block .swipeout-actions-right a.bg-deeporange .item-link.active-state, +.list-block .item-link.bg-deeporange.active-state, +.list-block .item-linka.bg-deeporange.active-state, +.list-block .item-link.list-block .swipeout-actions-left a.bg-deeporange.active-state, +.list-block .item-link.list-block .swipeout-actions-right a.bg-deeporange.active-state { + background: #E64A19; +} +.border-deeporange { + border-color: #ff5722; +} +.list-block .border-deeporange.item-inner:after, +.list-block ul.border-deeporange:after, +.border-deeporange:after, +.list-block .border-deeporange.item-inner:before, +.list-block ul.border-deeporange:before, +.border-deeporange:before { + background-color: #ff5722; +} +.theme-deeporange .floating-button, +.theme-deeporange .speed-dial-buttons a, +.floating-button.theme-deeporange, +.speed-dial-buttons a.theme-deeporange, +.floating-button.color-deeporange, +.speed-dial-buttons a.color-deeporange, +.floating-button.bg-deeporange, +.speed-dial-buttons a.bg-deeporange { + color: #fff; + background: #ff5722; +} +html:not(.watch-active-state) .theme-deeporange .floating-button:active, +html:not(.watch-active-state) .theme-deeporange .speed-dial-buttons a:active, +html:not(.watch-active-state) .floating-button.theme-deeporange:active, +html:not(.watch-active-state) .speed-dial-buttons a.theme-deeporange:active, +html:not(.watch-active-state) .floating-button.color-deeporange:active, +html:not(.watch-active-state) .speed-dial-buttons a.color-deeporange:active, +html:not(.watch-active-state) .floating-button.bg-deeporange:active, +html:not(.watch-active-state) .speed-dial-buttons a.bg-deeporange:active, +.theme-deeporange .floating-button.active-state, +.theme-deeporange .speed-dial-buttons a.active-state, +.floating-button.theme-deeporange.active-state, +.speed-dial-buttons a.theme-deeporange.active-state, +.floating-button.color-deeporange.active-state, +.speed-dial-buttons a.color-deeporange.active-state, +.floating-button.bg-deeporange.active-state, +.speed-dial-buttons a.bg-deeporange.active-state { + background: #E64A19; +} +.theme-deeporange .floating-button i, +.theme-deeporange .speed-dial-buttons a i, +.floating-button.theme-deeporange i, +.speed-dial-buttons a.theme-deeporange i, +.floating-button.color-deeporange i, +.speed-dial-buttons a.color-deeporange i, +.floating-button.bg-deeporange i, +.speed-dial-buttons a.bg-deeporange i { + color: inherit; +} +.ripple-deeporange .ripple-wave { + background-color: rgba(255, 87, 34, 0.3); +} +.badge.color-deeporange, +.badge.theme-deeporange { + background-color: #ff5722; + color: #fff; +} +.color-brown { + color: #795548; +} +.list-block .item-link.list-button.color-brown, +.list-block .item-link.color-brown, +.tabbar a.active.color-brown, +a.color-brown { + color: #795548; +} +.label-switch input[type="checkbox"]:checked + .checkbox.color-brown, +.label-switch.color-brown input[type="checkbox"]:checked + .checkbox { + background-color: #795548; +} +.theme-brown .button:not(.button-fill) { + color: #795548; +} +.theme-brown .navbar .button:not(.button-fill), +.theme-brown.navbar .button:not(.button-fill), +.theme-brown .toolbar .button:not(.button-fill), +.theme-brown.toolbar .button:not(.button-fill), +.theme-brown .subnavbar .button:not(.button-fill), +.theme-brown.subnavbar .button:not(.button-fill) { + color: #fff; +} +.button.color-brown:not(.button-fill), +.color-brown.buttons-row .button:not(.button-fill) { + color: #795548 !important; +} +.theme-brown .button.button-fill { + background: #795548; + color: #fff; +} +html:not(.watch-active-state) .theme-brown .button.button-fill:active, +.theme-brown .button.button-fill.active-state { + background: #5D4037; +} +.button.button-fill.bg-brown, +.button.button-fill.color-brown { + background: #795548 !important; + color: #fff; +} +html:not(.watch-active-state) .button.button-fill.bg-brown:active, +html:not(.watch-active-state) .button.button-fill.color-brown:active, +.button.button-fill.bg-brown.active-state, +.button.button-fill.color-brown.active-state { + background: #5D4037 !important; +} +.progressbar.color-brown, +.progressbar.theme-brown, +.theme-brown .progressbar, +.progressbar.bg-brown { + background-color: rgba(121, 85, 72, 0.5); +} +.progressbar.color-brown span, +.progressbar.theme-brown span, +.theme-brown .progressbar span, +.progressbar.bg-brown span { + background-color: #795548; +} +.progressbar-infinite.color-brown, +.progressbar-infinite.theme-brown, +.theme-brown .progressbar-infinite, +.progressbar-infinite.bg-brown { + background-color: rgba(121, 85, 72, 0.5); +} +.progressbar-infinite.color-brown:after, +.progressbar-infinite.theme-brown:after, +.theme-brown .progressbar-infinite:after, +.progressbar-infinite.bg-brown:after, +.progressbar-infinite.color-brown:before, +.progressbar-infinite.theme-brown:before, +.theme-brown .progressbar-infinite:before, +.progressbar-infinite.bg-brown:before { + background-color: #795548; +} +.color-brown i.icon, +i.icon.color-brown { + color: #795548; +} +i.icon-next.color-brown, +i.icon-next.theme-brown { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23795548'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-brown, +i.icon-prev.theme-brown { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23795548'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-brown, +i.icon-back.theme-brown { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23795548'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-brown, +i.icon-forward.theme-brown { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23795548'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-bars.color-brown, +i.icon-bars.theme-brown { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M3%2018h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z'%20fill%3D'%23795548'%2F%3E%3C%2Fsvg%3E"); +} +.preloader.color-brown svg circle, +.preloader.preloader-brown svg circle { + stroke: #795548; +} +.preloader.color-brown .preloader-inner-gap, +.preloader.preloader-brown .preloader-inner-gap, +.preloader.color-brown .preloader-inner-half-circle, +.preloader.preloader-brown .preloader-inner-half-circle { + border-color: #795548; +} +.theme-brown a { + color: #795548; +} +.theme-brown .navbar, +.navbar.theme-brown, +.theme-brown .toolbar, +.toolbar.theme-brown, +.theme-brown .subnavbar, +.subnavbar.theme-brown, +.theme-brown .searchbar, +.searchbar.theme-brown { + background-color: #795548; +} +.theme-brown .range-slider input[type="range"]::-webkit-slider-thumb:before, +.range-slider.theme-brown input[type="range"]::-webkit-slider-thumb:before { + background-color: #795548; +} +.theme-brown .range-slider input[type="range"]::-webkit-slider-thumb, +.range-slider.theme-brown input[type="range"]::-webkit-slider-thumb { + background-color: #795548; +} +.theme-brown .range-slider input[type="range"]::-ms-thumb, +.range-slider.theme-brown input[type="range"]::-ms-thumb { + background-color: #795548; +} +.theme-brown .range-slider input[type="range"]::-ms-fill-lower, +.range-slider.theme-brown input[type="range"]::-ms-fill-lower { + background-color: #795548; +} +.theme-brown .range-slider input[type="range"]::-moz-range-thumb, +.range-slider.theme-brown input[type="range"]::-moz-range-thumb { + background-color: #795548; +} +.theme-brown .label-switch input[type="checkbox"]:checked + .checkbox, +.label-switch.theme-brown input[type="checkbox"]:checked + .checkbox { + background-color: rgba(121, 85, 72, 0.5); +} +.theme-brown .label-switch input[type="checkbox"]:checked + .checkbox:after, +.label-switch.theme-brown input[type="checkbox"]:checked + .checkbox:after { + background-color: #795548; +} +.theme-brown label.label-checkbox, +label.label-checkbox.theme-brown { + cursor: pointer; +} +.theme-brown label.label-checkbox i.icon-form-checkbox:after, +label.label-checkbox.theme-brown i.icon-form-checkbox:after { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M9%2016.17L4.83%2012l-1.42%201.41L9%2019%2021%207l-1.41-1.41z'%2F%3E%3C%2Fsvg%3E"); +} +.theme-brown label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-brown input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +.theme-brown label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-brown input[type="radio"]:checked + .item-media i.icon-form-checkbox, +.theme-brown label.label-checkbox input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-brown input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +.theme-brown label.label-checkbox input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-brown input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +.theme-brown label.label-checkbox input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-brown input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +.theme-brown label.label-checkbox input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-brown input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox { + border-color: #795548; + background-color: #795548; +} +.theme-brown label.label-radio i.icon-form-radio:after, +label.label-radio.theme-brown i.icon-form-radio:after { + background-color: #795548; +} +.theme-brown label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-brown input[type="checkbox"]:checked + .item-media i.icon-form-radio, +.theme-brown label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-brown input[type="radio"]:checked + .item-media i.icon-form-radio, +.theme-brown label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-brown input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +.theme-brown label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-brown input[type="radio"]:checked ~ .item-after i.icon-form-radio, +.theme-brown label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-brown input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +.theme-brown label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-brown input[type="radio"]:checked ~ .item-inner i.icon-form-radio { + border-color: #795548; +} +.theme-brown label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-brown input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +.theme-brown label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-brown input[type="radio"]:checked + .item-media i.icon-form-radio:after, +.theme-brown label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-brown input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +.theme-brown label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-brown input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +.theme-brown label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-brown input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +.theme-brown label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-brown input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after { + background-color: #795548; +} +.theme-brown .focus-state .label, +.theme-brown .focus-state .floating-label { + color: #795548; +} +.theme-brown .item-input-field.focus-state:after, +.theme-brown .input-field.focus-state:after, +.theme-brown .item-input-field.not-empty-state:after, +.theme-brown .input-field.not-empty-state:after { + background: #795548; +} +.theme-brown .picker-calendar-day.picker-calendar-day-today span { + color: #795548; +} +.theme-brown .picker-calendar-day.picker-calendar-day-selected span { + background-color: #795548; + color: #fff; +} +.theme-brown .picker-calendar-day.picker-calendar-day-has-events span:after { + background-color: #795548; +} +.theme-brown .picker-header { + background-color: #795548; +} +.theme-brown .modal-button { + color: #795548; +} +.swiper-pagination.color-brown .swiper-pagination-bullet-active, +.theme-brown .swiper-pagination .swiper-pagination-bullet-active { + background-color: #795548; +} +.swiper-pagination.color-brown .swiper-pagination-progressbar, +.theme-brown .swiper-pagination .swiper-pagination-progressbar { + background-color: #795548; +} +.swiper-pagination.swiper-pagination-progress.bg-brown { + background-color: rgba(121, 85, 72, 0.25); +} +.swiper-button-next.color-brown, +.swiper-container-rtl .swiper-button-prev.color-brown, +.theme-brown .swiper-button-next, +.theme-brown .swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23795548'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-prev.color-brown, +.swiper-container-rtl .swiper-button-next.color-brown, +.theme-brown .swiper-button-prev, +.theme-brown .swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23795548'%2F%3E%3C%2Fsvg%3E"); +} +.bg-brown, +a.bg-brown, +.list-block .swipeout-actions-left a.bg-brown, +.list-block .swipeout-actions-right a.bg-brown { + background-color: #795548; +} +html:not(.watch-active-state) .list-block .bg-brown .item-link:active, +html:not(.watch-active-state) .list-block a.bg-brown .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-left a.bg-brown .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-right a.bg-brown .item-link:active, +html:not(.watch-active-state) .list-block.bg-brown .item-link:active, +html:not(.watch-active-state) .list-blocka.bg-brown .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-left a.bg-brown .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-right a.bg-brown .item-link:active, +html:not(.watch-active-state) .list-block .item-link.bg-brown:active, +html:not(.watch-active-state) .list-block .item-linka.bg-brown:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-left a.bg-brown:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-right a.bg-brown:active, +.list-block .bg-brown .item-link.active-state, +.list-block a.bg-brown .item-link.active-state, +.list-block .list-block .swipeout-actions-left a.bg-brown .item-link.active-state, +.list-block .list-block .swipeout-actions-right a.bg-brown .item-link.active-state, +.list-block.bg-brown .item-link.active-state, +.list-blocka.bg-brown .item-link.active-state, +.list-block.list-block .swipeout-actions-left a.bg-brown .item-link.active-state, +.list-block.list-block .swipeout-actions-right a.bg-brown .item-link.active-state, +.list-block .item-link.bg-brown.active-state, +.list-block .item-linka.bg-brown.active-state, +.list-block .item-link.list-block .swipeout-actions-left a.bg-brown.active-state, +.list-block .item-link.list-block .swipeout-actions-right a.bg-brown.active-state { + background: #5D4037; +} +.border-brown { + border-color: #795548; +} +.list-block .border-brown.item-inner:after, +.list-block ul.border-brown:after, +.border-brown:after, +.list-block .border-brown.item-inner:before, +.list-block ul.border-brown:before, +.border-brown:before { + background-color: #795548; +} +.theme-brown .floating-button, +.theme-brown .speed-dial-buttons a, +.floating-button.theme-brown, +.speed-dial-buttons a.theme-brown, +.floating-button.color-brown, +.speed-dial-buttons a.color-brown, +.floating-button.bg-brown, +.speed-dial-buttons a.bg-brown { + color: #fff; + background: #795548; +} +html:not(.watch-active-state) .theme-brown .floating-button:active, +html:not(.watch-active-state) .theme-brown .speed-dial-buttons a:active, +html:not(.watch-active-state) .floating-button.theme-brown:active, +html:not(.watch-active-state) .speed-dial-buttons a.theme-brown:active, +html:not(.watch-active-state) .floating-button.color-brown:active, +html:not(.watch-active-state) .speed-dial-buttons a.color-brown:active, +html:not(.watch-active-state) .floating-button.bg-brown:active, +html:not(.watch-active-state) .speed-dial-buttons a.bg-brown:active, +.theme-brown .floating-button.active-state, +.theme-brown .speed-dial-buttons a.active-state, +.floating-button.theme-brown.active-state, +.speed-dial-buttons a.theme-brown.active-state, +.floating-button.color-brown.active-state, +.speed-dial-buttons a.color-brown.active-state, +.floating-button.bg-brown.active-state, +.speed-dial-buttons a.bg-brown.active-state { + background: #5D4037; +} +.theme-brown .floating-button i, +.theme-brown .speed-dial-buttons a i, +.floating-button.theme-brown i, +.speed-dial-buttons a.theme-brown i, +.floating-button.color-brown i, +.speed-dial-buttons a.color-brown i, +.floating-button.bg-brown i, +.speed-dial-buttons a.bg-brown i { + color: inherit; +} +.ripple-brown .ripple-wave { + background-color: rgba(121, 85, 72, 0.3); +} +.badge.color-brown, +.badge.theme-brown { + background-color: #795548; + color: #fff; +} +.color-gray { + color: #9e9e9e; +} +.list-block .item-link.list-button.color-gray, +.list-block .item-link.color-gray, +.tabbar a.active.color-gray, +a.color-gray { + color: #9e9e9e; +} +.label-switch input[type="checkbox"]:checked + .checkbox.color-gray, +.label-switch.color-gray input[type="checkbox"]:checked + .checkbox { + background-color: #9e9e9e; +} +.theme-gray .button:not(.button-fill) { + color: #9e9e9e; +} +.theme-gray .navbar .button:not(.button-fill), +.theme-gray.navbar .button:not(.button-fill), +.theme-gray .toolbar .button:not(.button-fill), +.theme-gray.toolbar .button:not(.button-fill), +.theme-gray .subnavbar .button:not(.button-fill), +.theme-gray.subnavbar .button:not(.button-fill) { + color: #fff; +} +.button.color-gray:not(.button-fill), +.color-gray.buttons-row .button:not(.button-fill) { + color: #9e9e9e !important; +} +.theme-gray .button.button-fill { + background: #9e9e9e; + color: #fff; +} +html:not(.watch-active-state) .theme-gray .button.button-fill:active, +.theme-gray .button.button-fill.active-state { + background: #616161; +} +.button.button-fill.bg-gray, +.button.button-fill.color-gray { + background: #9e9e9e !important; + color: #fff; +} +html:not(.watch-active-state) .button.button-fill.bg-gray:active, +html:not(.watch-active-state) .button.button-fill.color-gray:active, +.button.button-fill.bg-gray.active-state, +.button.button-fill.color-gray.active-state { + background: #616161 !important; +} +.progressbar.color-gray, +.progressbar.theme-gray, +.theme-gray .progressbar, +.progressbar.bg-gray { + background-color: rgba(158, 158, 158, 0.5); +} +.progressbar.color-gray span, +.progressbar.theme-gray span, +.theme-gray .progressbar span, +.progressbar.bg-gray span { + background-color: #9e9e9e; +} +.progressbar-infinite.color-gray, +.progressbar-infinite.theme-gray, +.theme-gray .progressbar-infinite, +.progressbar-infinite.bg-gray { + background-color: rgba(158, 158, 158, 0.5); +} +.progressbar-infinite.color-gray:after, +.progressbar-infinite.theme-gray:after, +.theme-gray .progressbar-infinite:after, +.progressbar-infinite.bg-gray:after, +.progressbar-infinite.color-gray:before, +.progressbar-infinite.theme-gray:before, +.theme-gray .progressbar-infinite:before, +.progressbar-infinite.bg-gray:before { + background-color: #9e9e9e; +} +.color-gray i.icon, +i.icon.color-gray { + color: #9e9e9e; +} +i.icon-next.color-gray, +i.icon-next.theme-gray { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%239e9e9e'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-gray, +i.icon-prev.theme-gray { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%239e9e9e'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-gray, +i.icon-back.theme-gray { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%239e9e9e'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-gray, +i.icon-forward.theme-gray { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%239e9e9e'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-bars.color-gray, +i.icon-bars.theme-gray { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M3%2018h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z'%20fill%3D'%239e9e9e'%2F%3E%3C%2Fsvg%3E"); +} +.preloader.color-gray svg circle, +.preloader.preloader-gray svg circle { + stroke: #9e9e9e; +} +.preloader.color-gray .preloader-inner-gap, +.preloader.preloader-gray .preloader-inner-gap, +.preloader.color-gray .preloader-inner-half-circle, +.preloader.preloader-gray .preloader-inner-half-circle { + border-color: #9e9e9e; +} +.theme-gray a { + color: #9e9e9e; +} +.theme-gray .navbar, +.navbar.theme-gray, +.theme-gray .toolbar, +.toolbar.theme-gray, +.theme-gray .subnavbar, +.subnavbar.theme-gray, +.theme-gray .searchbar, +.searchbar.theme-gray { + background-color: #9e9e9e; +} +.theme-gray .range-slider input[type="range"]::-webkit-slider-thumb:before, +.range-slider.theme-gray input[type="range"]::-webkit-slider-thumb:before { + background-color: #9e9e9e; +} +.theme-gray .range-slider input[type="range"]::-webkit-slider-thumb, +.range-slider.theme-gray input[type="range"]::-webkit-slider-thumb { + background-color: #9e9e9e; +} +.theme-gray .range-slider input[type="range"]::-ms-thumb, +.range-slider.theme-gray input[type="range"]::-ms-thumb { + background-color: #9e9e9e; +} +.theme-gray .range-slider input[type="range"]::-ms-fill-lower, +.range-slider.theme-gray input[type="range"]::-ms-fill-lower { + background-color: #9e9e9e; +} +.theme-gray .range-slider input[type="range"]::-moz-range-thumb, +.range-slider.theme-gray input[type="range"]::-moz-range-thumb { + background-color: #9e9e9e; +} +.theme-gray .label-switch input[type="checkbox"]:checked + .checkbox, +.label-switch.theme-gray input[type="checkbox"]:checked + .checkbox { + background-color: rgba(158, 158, 158, 0.5); +} +.theme-gray .label-switch input[type="checkbox"]:checked + .checkbox:after, +.label-switch.theme-gray input[type="checkbox"]:checked + .checkbox:after { + background-color: #9e9e9e; +} +.theme-gray label.label-checkbox, +label.label-checkbox.theme-gray { + cursor: pointer; +} +.theme-gray label.label-checkbox i.icon-form-checkbox:after, +label.label-checkbox.theme-gray i.icon-form-checkbox:after { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M9%2016.17L4.83%2012l-1.42%201.41L9%2019%2021%207l-1.41-1.41z'%2F%3E%3C%2Fsvg%3E"); +} +.theme-gray label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-gray input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +.theme-gray label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-gray input[type="radio"]:checked + .item-media i.icon-form-checkbox, +.theme-gray label.label-checkbox input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-gray input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +.theme-gray label.label-checkbox input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-gray input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +.theme-gray label.label-checkbox input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-gray input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +.theme-gray label.label-checkbox input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-gray input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox { + border-color: #9e9e9e; + background-color: #9e9e9e; +} +.theme-gray label.label-radio i.icon-form-radio:after, +label.label-radio.theme-gray i.icon-form-radio:after { + background-color: #9e9e9e; +} +.theme-gray label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-gray input[type="checkbox"]:checked + .item-media i.icon-form-radio, +.theme-gray label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-gray input[type="radio"]:checked + .item-media i.icon-form-radio, +.theme-gray label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-gray input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +.theme-gray label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-gray input[type="radio"]:checked ~ .item-after i.icon-form-radio, +.theme-gray label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-gray input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +.theme-gray label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-gray input[type="radio"]:checked ~ .item-inner i.icon-form-radio { + border-color: #9e9e9e; +} +.theme-gray label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-gray input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +.theme-gray label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-gray input[type="radio"]:checked + .item-media i.icon-form-radio:after, +.theme-gray label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-gray input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +.theme-gray label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-gray input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +.theme-gray label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-gray input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +.theme-gray label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-gray input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after { + background-color: #9e9e9e; +} +.theme-gray .focus-state .label, +.theme-gray .focus-state .floating-label { + color: #9e9e9e; +} +.theme-gray .item-input-field.focus-state:after, +.theme-gray .input-field.focus-state:after, +.theme-gray .item-input-field.not-empty-state:after, +.theme-gray .input-field.not-empty-state:after { + background: #9e9e9e; +} +.theme-gray .picker-calendar-day.picker-calendar-day-today span { + color: #9e9e9e; +} +.theme-gray .picker-calendar-day.picker-calendar-day-selected span { + background-color: #9e9e9e; + color: #fff; +} +.theme-gray .picker-calendar-day.picker-calendar-day-has-events span:after { + background-color: #9e9e9e; +} +.theme-gray .picker-header { + background-color: #9e9e9e; +} +.theme-gray .modal-button { + color: #9e9e9e; +} +.swiper-pagination.color-gray .swiper-pagination-bullet-active, +.theme-gray .swiper-pagination .swiper-pagination-bullet-active { + background-color: #9e9e9e; +} +.swiper-pagination.color-gray .swiper-pagination-progressbar, +.theme-gray .swiper-pagination .swiper-pagination-progressbar { + background-color: #9e9e9e; +} +.swiper-pagination.swiper-pagination-progress.bg-gray { + background-color: rgba(158, 158, 158, 0.25); +} +.swiper-button-next.color-gray, +.swiper-container-rtl .swiper-button-prev.color-gray, +.theme-gray .swiper-button-next, +.theme-gray .swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%239e9e9e'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-prev.color-gray, +.swiper-container-rtl .swiper-button-next.color-gray, +.theme-gray .swiper-button-prev, +.theme-gray .swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%239e9e9e'%2F%3E%3C%2Fsvg%3E"); +} +.bg-gray, +a.bg-gray, +.list-block .swipeout-actions-left a.bg-gray, +.list-block .swipeout-actions-right a.bg-gray { + background-color: #9e9e9e; +} +html:not(.watch-active-state) .list-block .bg-gray .item-link:active, +html:not(.watch-active-state) .list-block a.bg-gray .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-left a.bg-gray .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-right a.bg-gray .item-link:active, +html:not(.watch-active-state) .list-block.bg-gray .item-link:active, +html:not(.watch-active-state) .list-blocka.bg-gray .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-left a.bg-gray .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-right a.bg-gray .item-link:active, +html:not(.watch-active-state) .list-block .item-link.bg-gray:active, +html:not(.watch-active-state) .list-block .item-linka.bg-gray:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-left a.bg-gray:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-right a.bg-gray:active, +.list-block .bg-gray .item-link.active-state, +.list-block a.bg-gray .item-link.active-state, +.list-block .list-block .swipeout-actions-left a.bg-gray .item-link.active-state, +.list-block .list-block .swipeout-actions-right a.bg-gray .item-link.active-state, +.list-block.bg-gray .item-link.active-state, +.list-blocka.bg-gray .item-link.active-state, +.list-block.list-block .swipeout-actions-left a.bg-gray .item-link.active-state, +.list-block.list-block .swipeout-actions-right a.bg-gray .item-link.active-state, +.list-block .item-link.bg-gray.active-state, +.list-block .item-linka.bg-gray.active-state, +.list-block .item-link.list-block .swipeout-actions-left a.bg-gray.active-state, +.list-block .item-link.list-block .swipeout-actions-right a.bg-gray.active-state { + background: #616161; +} +.border-gray { + border-color: #9e9e9e; +} +.list-block .border-gray.item-inner:after, +.list-block ul.border-gray:after, +.border-gray:after, +.list-block .border-gray.item-inner:before, +.list-block ul.border-gray:before, +.border-gray:before { + background-color: #9e9e9e; +} +.theme-gray .floating-button, +.theme-gray .speed-dial-buttons a, +.floating-button.theme-gray, +.speed-dial-buttons a.theme-gray, +.floating-button.color-gray, +.speed-dial-buttons a.color-gray, +.floating-button.bg-gray, +.speed-dial-buttons a.bg-gray { + color: #fff; + background: #9e9e9e; +} +html:not(.watch-active-state) .theme-gray .floating-button:active, +html:not(.watch-active-state) .theme-gray .speed-dial-buttons a:active, +html:not(.watch-active-state) .floating-button.theme-gray:active, +html:not(.watch-active-state) .speed-dial-buttons a.theme-gray:active, +html:not(.watch-active-state) .floating-button.color-gray:active, +html:not(.watch-active-state) .speed-dial-buttons a.color-gray:active, +html:not(.watch-active-state) .floating-button.bg-gray:active, +html:not(.watch-active-state) .speed-dial-buttons a.bg-gray:active, +.theme-gray .floating-button.active-state, +.theme-gray .speed-dial-buttons a.active-state, +.floating-button.theme-gray.active-state, +.speed-dial-buttons a.theme-gray.active-state, +.floating-button.color-gray.active-state, +.speed-dial-buttons a.color-gray.active-state, +.floating-button.bg-gray.active-state, +.speed-dial-buttons a.bg-gray.active-state { + background: #616161; +} +.theme-gray .floating-button i, +.theme-gray .speed-dial-buttons a i, +.floating-button.theme-gray i, +.speed-dial-buttons a.theme-gray i, +.floating-button.color-gray i, +.speed-dial-buttons a.color-gray i, +.floating-button.bg-gray i, +.speed-dial-buttons a.bg-gray i { + color: inherit; +} +.ripple-gray .ripple-wave { + background-color: rgba(158, 158, 158, 0.3); +} +.badge.color-gray, +.badge.theme-gray { + background-color: #9e9e9e; + color: #fff; +} +.color-bluegray { + color: #607d8b; +} +.list-block .item-link.list-button.color-bluegray, +.list-block .item-link.color-bluegray, +.tabbar a.active.color-bluegray, +a.color-bluegray { + color: #607d8b; +} +.label-switch input[type="checkbox"]:checked + .checkbox.color-bluegray, +.label-switch.color-bluegray input[type="checkbox"]:checked + .checkbox { + background-color: #607d8b; +} +.theme-bluegray .button:not(.button-fill) { + color: #607d8b; +} +.theme-bluegray .navbar .button:not(.button-fill), +.theme-bluegray.navbar .button:not(.button-fill), +.theme-bluegray .toolbar .button:not(.button-fill), +.theme-bluegray.toolbar .button:not(.button-fill), +.theme-bluegray .subnavbar .button:not(.button-fill), +.theme-bluegray.subnavbar .button:not(.button-fill) { + color: #fff; +} +.button.color-bluegray:not(.button-fill), +.color-bluegray.buttons-row .button:not(.button-fill) { + color: #607d8b !important; +} +.theme-bluegray .button.button-fill { + background: #607d8b; + color: #fff; +} +html:not(.watch-active-state) .theme-bluegray .button.button-fill:active, +.theme-bluegray .button.button-fill.active-state { + background: #455A64; +} +.button.button-fill.bg-bluegray, +.button.button-fill.color-bluegray { + background: #607d8b !important; + color: #fff; +} +html:not(.watch-active-state) .button.button-fill.bg-bluegray:active, +html:not(.watch-active-state) .button.button-fill.color-bluegray:active, +.button.button-fill.bg-bluegray.active-state, +.button.button-fill.color-bluegray.active-state { + background: #455A64 !important; +} +.progressbar.color-bluegray, +.progressbar.theme-bluegray, +.theme-bluegray .progressbar, +.progressbar.bg-bluegray { + background-color: rgba(96, 125, 139, 0.5); +} +.progressbar.color-bluegray span, +.progressbar.theme-bluegray span, +.theme-bluegray .progressbar span, +.progressbar.bg-bluegray span { + background-color: #607d8b; +} +.progressbar-infinite.color-bluegray, +.progressbar-infinite.theme-bluegray, +.theme-bluegray .progressbar-infinite, +.progressbar-infinite.bg-bluegray { + background-color: rgba(96, 125, 139, 0.5); +} +.progressbar-infinite.color-bluegray:after, +.progressbar-infinite.theme-bluegray:after, +.theme-bluegray .progressbar-infinite:after, +.progressbar-infinite.bg-bluegray:after, +.progressbar-infinite.color-bluegray:before, +.progressbar-infinite.theme-bluegray:before, +.theme-bluegray .progressbar-infinite:before, +.progressbar-infinite.bg-bluegray:before { + background-color: #607d8b; +} +.color-bluegray i.icon, +i.icon.color-bluegray { + color: #607d8b; +} +i.icon-next.color-bluegray, +i.icon-next.theme-bluegray { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23607d8b'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-bluegray, +i.icon-prev.theme-bluegray { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23607d8b'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-bluegray, +i.icon-back.theme-bluegray { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23607d8b'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-bluegray, +i.icon-forward.theme-bluegray { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23607d8b'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-bars.color-bluegray, +i.icon-bars.theme-bluegray { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M3%2018h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z'%20fill%3D'%23607d8b'%2F%3E%3C%2Fsvg%3E"); +} +.preloader.color-bluegray svg circle, +.preloader.preloader-bluegray svg circle { + stroke: #607d8b; +} +.preloader.color-bluegray .preloader-inner-gap, +.preloader.preloader-bluegray .preloader-inner-gap, +.preloader.color-bluegray .preloader-inner-half-circle, +.preloader.preloader-bluegray .preloader-inner-half-circle { + border-color: #607d8b; +} +.theme-bluegray a { + color: #607d8b; +} +.theme-bluegray .navbar, +.navbar.theme-bluegray, +.theme-bluegray .toolbar, +.toolbar.theme-bluegray, +.theme-bluegray .subnavbar, +.subnavbar.theme-bluegray, +.theme-bluegray .searchbar, +.searchbar.theme-bluegray { + background-color: #607d8b; +} +.theme-bluegray .range-slider input[type="range"]::-webkit-slider-thumb:before, +.range-slider.theme-bluegray input[type="range"]::-webkit-slider-thumb:before { + background-color: #607d8b; +} +.theme-bluegray .range-slider input[type="range"]::-webkit-slider-thumb, +.range-slider.theme-bluegray input[type="range"]::-webkit-slider-thumb { + background-color: #607d8b; +} +.theme-bluegray .range-slider input[type="range"]::-ms-thumb, +.range-slider.theme-bluegray input[type="range"]::-ms-thumb { + background-color: #607d8b; +} +.theme-bluegray .range-slider input[type="range"]::-ms-fill-lower, +.range-slider.theme-bluegray input[type="range"]::-ms-fill-lower { + background-color: #607d8b; +} +.theme-bluegray .range-slider input[type="range"]::-moz-range-thumb, +.range-slider.theme-bluegray input[type="range"]::-moz-range-thumb { + background-color: #607d8b; +} +.theme-bluegray .label-switch input[type="checkbox"]:checked + .checkbox, +.label-switch.theme-bluegray input[type="checkbox"]:checked + .checkbox { + background-color: rgba(96, 125, 139, 0.5); +} +.theme-bluegray .label-switch input[type="checkbox"]:checked + .checkbox:after, +.label-switch.theme-bluegray input[type="checkbox"]:checked + .checkbox:after { + background-color: #607d8b; +} +.theme-bluegray label.label-checkbox, +label.label-checkbox.theme-bluegray { + cursor: pointer; +} +.theme-bluegray label.label-checkbox i.icon-form-checkbox:after, +label.label-checkbox.theme-bluegray i.icon-form-checkbox:after { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M9%2016.17L4.83%2012l-1.42%201.41L9%2019%2021%207l-1.41-1.41z'%2F%3E%3C%2Fsvg%3E"); +} +.theme-bluegray label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-bluegray input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +.theme-bluegray label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-bluegray input[type="radio"]:checked + .item-media i.icon-form-checkbox, +.theme-bluegray label.label-checkbox input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-bluegray input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +.theme-bluegray label.label-checkbox input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-bluegray input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +.theme-bluegray label.label-checkbox input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-bluegray input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +.theme-bluegray label.label-checkbox input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-bluegray input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox { + border-color: #607d8b; + background-color: #607d8b; +} +.theme-bluegray label.label-radio i.icon-form-radio:after, +label.label-radio.theme-bluegray i.icon-form-radio:after { + background-color: #607d8b; +} +.theme-bluegray label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-bluegray input[type="checkbox"]:checked + .item-media i.icon-form-radio, +.theme-bluegray label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-bluegray input[type="radio"]:checked + .item-media i.icon-form-radio, +.theme-bluegray label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-bluegray input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +.theme-bluegray label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-bluegray input[type="radio"]:checked ~ .item-after i.icon-form-radio, +.theme-bluegray label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-bluegray input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +.theme-bluegray label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-bluegray input[type="radio"]:checked ~ .item-inner i.icon-form-radio { + border-color: #607d8b; +} +.theme-bluegray label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-bluegray input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +.theme-bluegray label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-bluegray input[type="radio"]:checked + .item-media i.icon-form-radio:after, +.theme-bluegray label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-bluegray input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +.theme-bluegray label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-bluegray input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +.theme-bluegray label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-bluegray input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +.theme-bluegray label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-bluegray input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after { + background-color: #607d8b; +} +.theme-bluegray .focus-state .label, +.theme-bluegray .focus-state .floating-label { + color: #607d8b; +} +.theme-bluegray .item-input-field.focus-state:after, +.theme-bluegray .input-field.focus-state:after, +.theme-bluegray .item-input-field.not-empty-state:after, +.theme-bluegray .input-field.not-empty-state:after { + background: #607d8b; +} +.theme-bluegray .picker-calendar-day.picker-calendar-day-today span { + color: #607d8b; +} +.theme-bluegray .picker-calendar-day.picker-calendar-day-selected span { + background-color: #607d8b; + color: #fff; +} +.theme-bluegray .picker-calendar-day.picker-calendar-day-has-events span:after { + background-color: #607d8b; +} +.theme-bluegray .picker-header { + background-color: #607d8b; +} +.theme-bluegray .modal-button { + color: #607d8b; +} +.swiper-pagination.color-bluegray .swiper-pagination-bullet-active, +.theme-bluegray .swiper-pagination .swiper-pagination-bullet-active { + background-color: #607d8b; +} +.swiper-pagination.color-bluegray .swiper-pagination-progressbar, +.theme-bluegray .swiper-pagination .swiper-pagination-progressbar { + background-color: #607d8b; +} +.swiper-pagination.swiper-pagination-progress.bg-bluegray { + background-color: rgba(96, 125, 139, 0.25); +} +.swiper-button-next.color-bluegray, +.swiper-container-rtl .swiper-button-prev.color-bluegray, +.theme-bluegray .swiper-button-next, +.theme-bluegray .swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23607d8b'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-prev.color-bluegray, +.swiper-container-rtl .swiper-button-next.color-bluegray, +.theme-bluegray .swiper-button-prev, +.theme-bluegray .swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23607d8b'%2F%3E%3C%2Fsvg%3E"); +} +.bg-bluegray, +a.bg-bluegray, +.list-block .swipeout-actions-left a.bg-bluegray, +.list-block .swipeout-actions-right a.bg-bluegray { + background-color: #607d8b; +} +html:not(.watch-active-state) .list-block .bg-bluegray .item-link:active, +html:not(.watch-active-state) .list-block a.bg-bluegray .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-left a.bg-bluegray .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-right a.bg-bluegray .item-link:active, +html:not(.watch-active-state) .list-block.bg-bluegray .item-link:active, +html:not(.watch-active-state) .list-blocka.bg-bluegray .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-left a.bg-bluegray .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-right a.bg-bluegray .item-link:active, +html:not(.watch-active-state) .list-block .item-link.bg-bluegray:active, +html:not(.watch-active-state) .list-block .item-linka.bg-bluegray:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-left a.bg-bluegray:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-right a.bg-bluegray:active, +.list-block .bg-bluegray .item-link.active-state, +.list-block a.bg-bluegray .item-link.active-state, +.list-block .list-block .swipeout-actions-left a.bg-bluegray .item-link.active-state, +.list-block .list-block .swipeout-actions-right a.bg-bluegray .item-link.active-state, +.list-block.bg-bluegray .item-link.active-state, +.list-blocka.bg-bluegray .item-link.active-state, +.list-block.list-block .swipeout-actions-left a.bg-bluegray .item-link.active-state, +.list-block.list-block .swipeout-actions-right a.bg-bluegray .item-link.active-state, +.list-block .item-link.bg-bluegray.active-state, +.list-block .item-linka.bg-bluegray.active-state, +.list-block .item-link.list-block .swipeout-actions-left a.bg-bluegray.active-state, +.list-block .item-link.list-block .swipeout-actions-right a.bg-bluegray.active-state { + background: #455A64; +} +.border-bluegray { + border-color: #607d8b; +} +.list-block .border-bluegray.item-inner:after, +.list-block ul.border-bluegray:after, +.border-bluegray:after, +.list-block .border-bluegray.item-inner:before, +.list-block ul.border-bluegray:before, +.border-bluegray:before { + background-color: #607d8b; +} +.theme-bluegray .floating-button, +.theme-bluegray .speed-dial-buttons a, +.floating-button.theme-bluegray, +.speed-dial-buttons a.theme-bluegray, +.floating-button.color-bluegray, +.speed-dial-buttons a.color-bluegray, +.floating-button.bg-bluegray, +.speed-dial-buttons a.bg-bluegray { + color: #fff; + background: #607d8b; +} +html:not(.watch-active-state) .theme-bluegray .floating-button:active, +html:not(.watch-active-state) .theme-bluegray .speed-dial-buttons a:active, +html:not(.watch-active-state) .floating-button.theme-bluegray:active, +html:not(.watch-active-state) .speed-dial-buttons a.theme-bluegray:active, +html:not(.watch-active-state) .floating-button.color-bluegray:active, +html:not(.watch-active-state) .speed-dial-buttons a.color-bluegray:active, +html:not(.watch-active-state) .floating-button.bg-bluegray:active, +html:not(.watch-active-state) .speed-dial-buttons a.bg-bluegray:active, +.theme-bluegray .floating-button.active-state, +.theme-bluegray .speed-dial-buttons a.active-state, +.floating-button.theme-bluegray.active-state, +.speed-dial-buttons a.theme-bluegray.active-state, +.floating-button.color-bluegray.active-state, +.speed-dial-buttons a.color-bluegray.active-state, +.floating-button.bg-bluegray.active-state, +.speed-dial-buttons a.bg-bluegray.active-state { + background: #455A64; +} +.theme-bluegray .floating-button i, +.theme-bluegray .speed-dial-buttons a i, +.floating-button.theme-bluegray i, +.speed-dial-buttons a.theme-bluegray i, +.floating-button.color-bluegray i, +.speed-dial-buttons a.color-bluegray i, +.floating-button.bg-bluegray i, +.speed-dial-buttons a.bg-bluegray i { + color: inherit; +} +.ripple-bluegray .ripple-wave { + background-color: rgba(96, 125, 139, 0.3); +} +.badge.color-bluegray, +.badge.theme-bluegray { + background-color: #607d8b; + color: #fff; +} +.color-white { + color: #ffffff; +} +.list-block .item-link.list-button.color-white, +.list-block .item-link.color-white, +.tabbar a.active.color-white, +a.color-white { + color: #ffffff; +} +.label-switch input[type="checkbox"]:checked + .checkbox.color-white, +.label-switch.color-white input[type="checkbox"]:checked + .checkbox { + background-color: #ffffff; +} +.theme-white .button:not(.button-fill) { + color: #ffffff; +} +.theme-white .navbar .button:not(.button-fill), +.theme-white.navbar .button:not(.button-fill), +.theme-white .toolbar .button:not(.button-fill), +.theme-white.toolbar .button:not(.button-fill), +.theme-white .subnavbar .button:not(.button-fill), +.theme-white.subnavbar .button:not(.button-fill) { + color: #fff; +} +.button.color-white:not(.button-fill), +.color-white.buttons-row .button:not(.button-fill) { + color: #ffffff !important; +} +.theme-white .button.button-fill { + background: #ffffff; + color: #fff; +} +html:not(.watch-active-state) .theme-white .button.button-fill:active, +.theme-white .button.button-fill.active-state { + background: rgba(0, 0, 0, 0.1); +} +.button.button-fill.bg-white, +.button.button-fill.color-white { + background: #ffffff !important; + color: #fff; +} +html:not(.watch-active-state) .button.button-fill.bg-white:active, +html:not(.watch-active-state) .button.button-fill.color-white:active, +.button.button-fill.bg-white.active-state, +.button.button-fill.color-white.active-state { + background: rgba(0, 0, 0, 0.1) !important; +} +.progressbar.color-white, +.progressbar.theme-white, +.theme-white .progressbar, +.progressbar.bg-white { + background-color: rgba(255, 255, 255, 0.5); +} +.progressbar.color-white span, +.progressbar.theme-white span, +.theme-white .progressbar span, +.progressbar.bg-white span { + background-color: #ffffff; +} +.progressbar-infinite.color-white, +.progressbar-infinite.theme-white, +.theme-white .progressbar-infinite, +.progressbar-infinite.bg-white { + background-color: rgba(255, 255, 255, 0.5); +} +.progressbar-infinite.color-white:after, +.progressbar-infinite.theme-white:after, +.theme-white .progressbar-infinite:after, +.progressbar-infinite.bg-white:after, +.progressbar-infinite.color-white:before, +.progressbar-infinite.theme-white:before, +.theme-white .progressbar-infinite:before, +.progressbar-infinite.bg-white:before { + background-color: #ffffff; +} +.color-white i.icon, +i.icon.color-white { + color: #ffffff; +} +i.icon-next.color-white, +i.icon-next.theme-white { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-white, +i.icon-prev.theme-white { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-white, +i.icon-back.theme-white { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-white, +i.icon-forward.theme-white { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-bars.color-white, +i.icon-bars.theme-white { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M3%2018h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); +} +.preloader.color-white svg circle, +.preloader.preloader-white svg circle { + stroke: #ffffff; +} +.preloader.color-white .preloader-inner-gap, +.preloader.preloader-white .preloader-inner-gap, +.preloader.color-white .preloader-inner-half-circle, +.preloader.preloader-white .preloader-inner-half-circle { + border-color: #ffffff; +} +.theme-white a { + color: #ffffff; +} +.theme-white .navbar, +.navbar.theme-white, +.theme-white .toolbar, +.toolbar.theme-white, +.theme-white .subnavbar, +.subnavbar.theme-white, +.theme-white .searchbar, +.searchbar.theme-white { + background-color: #ffffff; +} +.theme-white .range-slider input[type="range"]::-webkit-slider-thumb:before, +.range-slider.theme-white input[type="range"]::-webkit-slider-thumb:before { + background-color: #ffffff; +} +.theme-white .range-slider input[type="range"]::-webkit-slider-thumb, +.range-slider.theme-white input[type="range"]::-webkit-slider-thumb { + background-color: #ffffff; +} +.theme-white .range-slider input[type="range"]::-ms-thumb, +.range-slider.theme-white input[type="range"]::-ms-thumb { + background-color: #ffffff; +} +.theme-white .range-slider input[type="range"]::-ms-fill-lower, +.range-slider.theme-white input[type="range"]::-ms-fill-lower { + background-color: #ffffff; +} +.theme-white .range-slider input[type="range"]::-moz-range-thumb, +.range-slider.theme-white input[type="range"]::-moz-range-thumb { + background-color: #ffffff; +} +.theme-white .label-switch input[type="checkbox"]:checked + .checkbox, +.label-switch.theme-white input[type="checkbox"]:checked + .checkbox { + background-color: rgba(255, 255, 255, 0.5); +} +.theme-white .label-switch input[type="checkbox"]:checked + .checkbox:after, +.label-switch.theme-white input[type="checkbox"]:checked + .checkbox:after { + background-color: #ffffff; +} +.theme-white label.label-checkbox, +label.label-checkbox.theme-white { + cursor: pointer; +} +.theme-white label.label-checkbox i.icon-form-checkbox:after, +label.label-checkbox.theme-white i.icon-form-checkbox:after { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M9%2016.17L4.83%2012l-1.42%201.41L9%2019%2021%207l-1.41-1.41z'%2F%3E%3C%2Fsvg%3E"); +} +.theme-white label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-white input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +.theme-white label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-white input[type="radio"]:checked + .item-media i.icon-form-checkbox, +.theme-white label.label-checkbox input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-white input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +.theme-white label.label-checkbox input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-white input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +.theme-white label.label-checkbox input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-white input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +.theme-white label.label-checkbox input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-white input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox { + border-color: #ffffff; + background-color: #ffffff; +} +.theme-white label.label-radio i.icon-form-radio:after, +label.label-radio.theme-white i.icon-form-radio:after { + background-color: #ffffff; +} +.theme-white label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-white input[type="checkbox"]:checked + .item-media i.icon-form-radio, +.theme-white label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-white input[type="radio"]:checked + .item-media i.icon-form-radio, +.theme-white label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-white input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +.theme-white label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-white input[type="radio"]:checked ~ .item-after i.icon-form-radio, +.theme-white label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-white input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +.theme-white label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-white input[type="radio"]:checked ~ .item-inner i.icon-form-radio { + border-color: #ffffff; +} +.theme-white label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-white input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +.theme-white label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-white input[type="radio"]:checked + .item-media i.icon-form-radio:after, +.theme-white label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-white input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +.theme-white label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-white input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +.theme-white label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-white input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +.theme-white label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-white input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after { + background-color: #ffffff; +} +.theme-white .focus-state .label, +.theme-white .focus-state .floating-label { + color: #ffffff; +} +.theme-white .item-input-field.focus-state:after, +.theme-white .input-field.focus-state:after, +.theme-white .item-input-field.not-empty-state:after, +.theme-white .input-field.not-empty-state:after { + background: #ffffff; +} +.theme-white .picker-calendar-day.picker-calendar-day-today span { + color: #ffffff; +} +.theme-white .picker-calendar-day.picker-calendar-day-selected span { + background-color: #ffffff; + color: #fff; +} +.theme-white .picker-calendar-day.picker-calendar-day-has-events span:after { + background-color: #ffffff; +} +.theme-white .picker-header { + background-color: #ffffff; +} +.theme-white .modal-button { + color: #ffffff; +} +.swiper-pagination.color-white .swiper-pagination-bullet-active, +.theme-white .swiper-pagination .swiper-pagination-bullet-active { + background-color: #ffffff; +} +.swiper-pagination.color-white .swiper-pagination-progressbar, +.theme-white .swiper-pagination .swiper-pagination-progressbar { + background-color: #ffffff; +} +.swiper-pagination.swiper-pagination-progress.bg-white { + background-color: rgba(255, 255, 255, 0.25); +} +.swiper-button-next.color-white, +.swiper-container-rtl .swiper-button-prev.color-white, +.theme-white .swiper-button-next, +.theme-white .swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-prev.color-white, +.swiper-container-rtl .swiper-button-next.color-white, +.theme-white .swiper-button-prev, +.theme-white .swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); +} +.bg-white, +a.bg-white, +.list-block .swipeout-actions-left a.bg-white, +.list-block .swipeout-actions-right a.bg-white { + background-color: #ffffff; +} +html:not(.watch-active-state) .list-block .bg-white .item-link:active, +html:not(.watch-active-state) .list-block a.bg-white .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-left a.bg-white .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-right a.bg-white .item-link:active, +html:not(.watch-active-state) .list-block.bg-white .item-link:active, +html:not(.watch-active-state) .list-blocka.bg-white .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-left a.bg-white .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-right a.bg-white .item-link:active, +html:not(.watch-active-state) .list-block .item-link.bg-white:active, +html:not(.watch-active-state) .list-block .item-linka.bg-white:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-left a.bg-white:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-right a.bg-white:active, +.list-block .bg-white .item-link.active-state, +.list-block a.bg-white .item-link.active-state, +.list-block .list-block .swipeout-actions-left a.bg-white .item-link.active-state, +.list-block .list-block .swipeout-actions-right a.bg-white .item-link.active-state, +.list-block.bg-white .item-link.active-state, +.list-blocka.bg-white .item-link.active-state, +.list-block.list-block .swipeout-actions-left a.bg-white .item-link.active-state, +.list-block.list-block .swipeout-actions-right a.bg-white .item-link.active-state, +.list-block .item-link.bg-white.active-state, +.list-block .item-linka.bg-white.active-state, +.list-block .item-link.list-block .swipeout-actions-left a.bg-white.active-state, +.list-block .item-link.list-block .swipeout-actions-right a.bg-white.active-state { + background: rgba(0, 0, 0, 0.1); +} +.border-white { + border-color: #ffffff; +} +.list-block .border-white.item-inner:after, +.list-block ul.border-white:after, +.border-white:after, +.list-block .border-white.item-inner:before, +.list-block ul.border-white:before, +.border-white:before { + background-color: #ffffff; +} +.theme-white .floating-button, +.theme-white .speed-dial-buttons a, +.floating-button.theme-white, +.speed-dial-buttons a.theme-white, +.floating-button.color-white, +.speed-dial-buttons a.color-white, +.floating-button.bg-white, +.speed-dial-buttons a.bg-white { + color: #fff; + background: #ffffff; +} +html:not(.watch-active-state) .theme-white .floating-button:active, +html:not(.watch-active-state) .theme-white .speed-dial-buttons a:active, +html:not(.watch-active-state) .floating-button.theme-white:active, +html:not(.watch-active-state) .speed-dial-buttons a.theme-white:active, +html:not(.watch-active-state) .floating-button.color-white:active, +html:not(.watch-active-state) .speed-dial-buttons a.color-white:active, +html:not(.watch-active-state) .floating-button.bg-white:active, +html:not(.watch-active-state) .speed-dial-buttons a.bg-white:active, +.theme-white .floating-button.active-state, +.theme-white .speed-dial-buttons a.active-state, +.floating-button.theme-white.active-state, +.speed-dial-buttons a.theme-white.active-state, +.floating-button.color-white.active-state, +.speed-dial-buttons a.color-white.active-state, +.floating-button.bg-white.active-state, +.speed-dial-buttons a.bg-white.active-state { + background: rgba(0, 0, 0, 0.1); +} +.theme-white .floating-button i, +.theme-white .speed-dial-buttons a i, +.floating-button.theme-white i, +.speed-dial-buttons a.theme-white i, +.floating-button.color-white i, +.speed-dial-buttons a.color-white i, +.floating-button.bg-white i, +.speed-dial-buttons a.bg-white i { + color: inherit; +} +.ripple-white .ripple-wave { + background-color: rgba(255, 255, 255, 0.3); +} +.badge.color-white, +.badge.theme-white { + background-color: #ffffff; + color: #fff; +} +.color-black { + color: #000000; +} +.list-block .item-link.list-button.color-black, +.list-block .item-link.color-black, +.tabbar a.active.color-black, +a.color-black { + color: #000000; +} +.label-switch input[type="checkbox"]:checked + .checkbox.color-black, +.label-switch.color-black input[type="checkbox"]:checked + .checkbox { + background-color: #000000; +} +.theme-black .button:not(.button-fill) { + color: #000000; +} +.theme-black .navbar .button:not(.button-fill), +.theme-black.navbar .button:not(.button-fill), +.theme-black .toolbar .button:not(.button-fill), +.theme-black.toolbar .button:not(.button-fill), +.theme-black .subnavbar .button:not(.button-fill), +.theme-black.subnavbar .button:not(.button-fill) { + color: #fff; +} +.button.color-black:not(.button-fill), +.color-black.buttons-row .button:not(.button-fill) { + color: #000000 !important; +} +.theme-black .button.button-fill { + background: #000000; + color: #fff; +} +html:not(.watch-active-state) .theme-black .button.button-fill:active, +.theme-black .button.button-fill.active-state { + background: #333; +} +.button.button-fill.bg-black, +.button.button-fill.color-black { + background: #000000 !important; + color: #fff; +} +html:not(.watch-active-state) .button.button-fill.bg-black:active, +html:not(.watch-active-state) .button.button-fill.color-black:active, +.button.button-fill.bg-black.active-state, +.button.button-fill.color-black.active-state { + background: #333 !important; +} +.progressbar.color-black, +.progressbar.theme-black, +.theme-black .progressbar, +.progressbar.bg-black { + background-color: rgba(0, 0, 0, 0.5); +} +.progressbar.color-black span, +.progressbar.theme-black span, +.theme-black .progressbar span, +.progressbar.bg-black span { + background-color: #000000; +} +.progressbar-infinite.color-black, +.progressbar-infinite.theme-black, +.theme-black .progressbar-infinite, +.progressbar-infinite.bg-black { + background-color: rgba(0, 0, 0, 0.5); +} +.progressbar-infinite.color-black:after, +.progressbar-infinite.theme-black:after, +.theme-black .progressbar-infinite:after, +.progressbar-infinite.bg-black:after, +.progressbar-infinite.color-black:before, +.progressbar-infinite.theme-black:before, +.theme-black .progressbar-infinite:before, +.progressbar-infinite.bg-black:before { + background-color: #000000; +} +.color-black i.icon, +i.icon.color-black { + color: #000000; +} +i.icon-next.color-black, +i.icon-next.theme-black { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23000000'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-black, +i.icon-prev.theme-black { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23000000'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-black, +i.icon-back.theme-black { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-black, +i.icon-forward.theme-black { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-bars.color-black, +i.icon-bars.theme-black { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M3%2018h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E"); +} +.preloader.color-black svg circle, +.preloader.preloader-black svg circle { + stroke: #000000; +} +.preloader.color-black .preloader-inner-gap, +.preloader.preloader-black .preloader-inner-gap, +.preloader.color-black .preloader-inner-half-circle, +.preloader.preloader-black .preloader-inner-half-circle { + border-color: #000000; +} +.theme-black a { + color: #000000; +} +.theme-black .navbar, +.navbar.theme-black, +.theme-black .toolbar, +.toolbar.theme-black, +.theme-black .subnavbar, +.subnavbar.theme-black, +.theme-black .searchbar, +.searchbar.theme-black { + background-color: #000000; +} +.theme-black .range-slider input[type="range"]::-webkit-slider-thumb:before, +.range-slider.theme-black input[type="range"]::-webkit-slider-thumb:before { + background-color: #000000; +} +.theme-black .range-slider input[type="range"]::-webkit-slider-thumb, +.range-slider.theme-black input[type="range"]::-webkit-slider-thumb { + background-color: #000000; +} +.theme-black .range-slider input[type="range"]::-ms-thumb, +.range-slider.theme-black input[type="range"]::-ms-thumb { + background-color: #000000; +} +.theme-black .range-slider input[type="range"]::-ms-fill-lower, +.range-slider.theme-black input[type="range"]::-ms-fill-lower { + background-color: #000000; +} +.theme-black .range-slider input[type="range"]::-moz-range-thumb, +.range-slider.theme-black input[type="range"]::-moz-range-thumb { + background-color: #000000; +} +.theme-black .label-switch input[type="checkbox"]:checked + .checkbox, +.label-switch.theme-black input[type="checkbox"]:checked + .checkbox { + background-color: rgba(0, 0, 0, 0.5); +} +.theme-black .label-switch input[type="checkbox"]:checked + .checkbox:after, +.label-switch.theme-black input[type="checkbox"]:checked + .checkbox:after { + background-color: #000000; +} +.theme-black label.label-checkbox, +label.label-checkbox.theme-black { + cursor: pointer; +} +.theme-black label.label-checkbox i.icon-form-checkbox:after, +label.label-checkbox.theme-black i.icon-form-checkbox:after { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M9%2016.17L4.83%2012l-1.42%201.41L9%2019%2021%207l-1.41-1.41z'%2F%3E%3C%2Fsvg%3E"); +} +.theme-black label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-black input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +.theme-black label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox.theme-black input[type="radio"]:checked + .item-media i.icon-form-checkbox, +.theme-black label.label-checkbox input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-black input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +.theme-black label.label-checkbox input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox.theme-black input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +.theme-black label.label-checkbox input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-black input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +.theme-black label.label-checkbox input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox.theme-black input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox { + border-color: #000000; + background-color: #000000; +} +.theme-black label.label-radio i.icon-form-radio:after, +label.label-radio.theme-black i.icon-form-radio:after { + background-color: #000000; +} +.theme-black label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-black input[type="checkbox"]:checked + .item-media i.icon-form-radio, +.theme-black label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio, +label.label-radio.theme-black input[type="radio"]:checked + .item-media i.icon-form-radio, +.theme-black label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-black input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +.theme-black label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio, +label.label-radio.theme-black input[type="radio"]:checked ~ .item-after i.icon-form-radio, +.theme-black label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-black input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +.theme-black label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio.theme-black input[type="radio"]:checked ~ .item-inner i.icon-form-radio { + border-color: #000000; +} +.theme-black label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-black input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +.theme-black label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio:after, +label.label-radio.theme-black input[type="radio"]:checked + .item-media i.icon-form-radio:after, +.theme-black label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-black input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +.theme-black label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio.theme-black input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +.theme-black label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-black input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +.theme-black label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio.theme-black input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after { + background-color: #000000; +} +.theme-black .focus-state .label, +.theme-black .focus-state .floating-label { + color: #000000; +} +.theme-black .item-input-field.focus-state:after, +.theme-black .input-field.focus-state:after, +.theme-black .item-input-field.not-empty-state:after, +.theme-black .input-field.not-empty-state:after { + background: #000000; +} +.theme-black .picker-calendar-day.picker-calendar-day-today span { + color: #000000; +} +.theme-black .picker-calendar-day.picker-calendar-day-selected span { + background-color: #000000; + color: #fff; +} +.theme-black .picker-calendar-day.picker-calendar-day-has-events span:after { + background-color: #000000; +} +.theme-black .picker-header { + background-color: #000000; +} +.theme-black .modal-button { + color: #000000; +} +.swiper-pagination.color-black .swiper-pagination-bullet-active, +.theme-black .swiper-pagination .swiper-pagination-bullet-active { + background-color: #000000; +} +.swiper-pagination.color-black .swiper-pagination-progressbar, +.theme-black .swiper-pagination .swiper-pagination-progressbar { + background-color: #000000; +} +.swiper-pagination.swiper-pagination-progress.bg-black { + background-color: rgba(0, 0, 0, 0.25); +} +.swiper-button-next.color-black, +.swiper-container-rtl .swiper-button-prev.color-black, +.theme-black .swiper-button-next, +.theme-black .swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-prev.color-black, +.swiper-container-rtl .swiper-button-next.color-black, +.theme-black .swiper-button-prev, +.theme-black .swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E"); +} +.bg-black, +a.bg-black, +.list-block .swipeout-actions-left a.bg-black, +.list-block .swipeout-actions-right a.bg-black { + background-color: #000000; +} +html:not(.watch-active-state) .list-block .bg-black .item-link:active, +html:not(.watch-active-state) .list-block a.bg-black .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-left a.bg-black .item-link:active, +html:not(.watch-active-state) .list-block .list-block .swipeout-actions-right a.bg-black .item-link:active, +html:not(.watch-active-state) .list-block.bg-black .item-link:active, +html:not(.watch-active-state) .list-blocka.bg-black .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-left a.bg-black .item-link:active, +html:not(.watch-active-state) .list-block.list-block .swipeout-actions-right a.bg-black .item-link:active, +html:not(.watch-active-state) .list-block .item-link.bg-black:active, +html:not(.watch-active-state) .list-block .item-linka.bg-black:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-left a.bg-black:active, +html:not(.watch-active-state) .list-block .item-link.list-block .swipeout-actions-right a.bg-black:active, +.list-block .bg-black .item-link.active-state, +.list-block a.bg-black .item-link.active-state, +.list-block .list-block .swipeout-actions-left a.bg-black .item-link.active-state, +.list-block .list-block .swipeout-actions-right a.bg-black .item-link.active-state, +.list-block.bg-black .item-link.active-state, +.list-blocka.bg-black .item-link.active-state, +.list-block.list-block .swipeout-actions-left a.bg-black .item-link.active-state, +.list-block.list-block .swipeout-actions-right a.bg-black .item-link.active-state, +.list-block .item-link.bg-black.active-state, +.list-block .item-linka.bg-black.active-state, +.list-block .item-link.list-block .swipeout-actions-left a.bg-black.active-state, +.list-block .item-link.list-block .swipeout-actions-right a.bg-black.active-state { + background: #333; +} +.border-black { + border-color: #000000; +} +.list-block .border-black.item-inner:after, +.list-block ul.border-black:after, +.border-black:after, +.list-block .border-black.item-inner:before, +.list-block ul.border-black:before, +.border-black:before { + background-color: #000000; +} +.theme-black .floating-button, +.theme-black .speed-dial-buttons a, +.floating-button.theme-black, +.speed-dial-buttons a.theme-black, +.floating-button.color-black, +.speed-dial-buttons a.color-black, +.floating-button.bg-black, +.speed-dial-buttons a.bg-black { + color: #fff; + background: #000000; +} +html:not(.watch-active-state) .theme-black .floating-button:active, +html:not(.watch-active-state) .theme-black .speed-dial-buttons a:active, +html:not(.watch-active-state) .floating-button.theme-black:active, +html:not(.watch-active-state) .speed-dial-buttons a.theme-black:active, +html:not(.watch-active-state) .floating-button.color-black:active, +html:not(.watch-active-state) .speed-dial-buttons a.color-black:active, +html:not(.watch-active-state) .floating-button.bg-black:active, +html:not(.watch-active-state) .speed-dial-buttons a.bg-black:active, +.theme-black .floating-button.active-state, +.theme-black .speed-dial-buttons a.active-state, +.floating-button.theme-black.active-state, +.speed-dial-buttons a.theme-black.active-state, +.floating-button.color-black.active-state, +.speed-dial-buttons a.color-black.active-state, +.floating-button.bg-black.active-state, +.speed-dial-buttons a.bg-black.active-state { + background: #333; +} +.theme-black .floating-button i, +.theme-black .speed-dial-buttons a i, +.floating-button.theme-black i, +.speed-dial-buttons a.theme-black i, +.floating-button.color-black i, +.speed-dial-buttons a.color-black i, +.floating-button.bg-black i, +.speed-dial-buttons a.bg-black i { + color: inherit; +} +.ripple-black .ripple-wave { + background-color: rgba(0, 0, 0, 0.3); +} +.badge.color-black, +.badge.theme-black { + background-color: #000000; + color: #fff; +} diff --git a/www/libs/framework7/css/framework7.material.css b/www/libs/framework7/css/framework7.material.css new file mode 100644 index 0000000..cd79ca1 --- /dev/null +++ b/www/libs/framework7/css/framework7.material.css @@ -0,0 +1,7187 @@ +/** + * Framework7 1.4.2 + * Full Featured Mobile HTML Framework For Building iOS & Android Apps + * + * Google Material Theme + * + * http://www.idangero.us/framework7 + * + * Copyright 2016, Vladimir Kharlampidi + * The iDangero.us + * http://www.idangero.us/ + * + * Licensed under MIT + * + * Released on: June 26, 2016 + */ +html, +body { + position: relative; + height: 100%; + width: 100%; + overflow-x: hidden; +} +body { + font-family: Roboto, Noto, Helvetica, Arial, sans-serif; + margin: 0; + padding: 0; + color: #212121; + font-size: 14px; + line-height: 1.5; + width: 100%; + -webkit-text-size-adjust: 100%; + background: #fff; + overflow: hidden; +} +* { + -webkit-tap-highlight-color: rgba(0, 0, 0, 0); + -webkit-touch-callout: none; +} +a, +input, +textarea, +select { + outline: 0; +} +a { + text-decoration: none; + color: #2196f3; +} +p { + margin: 1em 0; +} +/* === Grid === */ +.row { + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: justify; + -ms-flex-pack: justify; + -webkit-justify-content: space-between; + justify-content: space-between; + -webkit-box-lines: multiple; + -moz-box-lines: multiple; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + -webkit-box-align: start; + -ms-flex-align: start; + -webkit-align-items: flex-start; + align-items: flex-start; +} +.row > [class*="col-"] { + box-sizing: border-box; +} +.row .col-auto { + width: 100%; +} +.row .col-100 { + width: 100%; + width: -webkit-calc((100% - 16px*0) / 1); + width: calc((100% - 16px*0) / 1); +} +.row.no-gutter .col-100 { + width: 100%; +} +.row .col-95 { + width: 95%; + width: -webkit-calc((100% - 16px*0.05263157894736836) / 1.0526315789473684); + width: calc((100% - 16px*0.05263157894736836) / 1.0526315789473684); +} +.row.no-gutter .col-95 { + width: 95%; +} +.row .col-90 { + width: 90%; + width: -webkit-calc((100% - 16px*0.11111111111111116) / 1.1111111111111112); + width: calc((100% - 16px*0.11111111111111116) / 1.1111111111111112); +} +.row.no-gutter .col-90 { + width: 90%; +} +.row .col-85 { + width: 85%; + width: -webkit-calc((100% - 16px*0.17647058823529416) / 1.1764705882352942); + width: calc((100% - 16px*0.17647058823529416) / 1.1764705882352942); +} +.row.no-gutter .col-85 { + width: 85%; +} +.row .col-80 { + width: 80%; + width: -webkit-calc((100% - 16px*0.25) / 1.25); + width: calc((100% - 16px*0.25) / 1.25); +} +.row.no-gutter .col-80 { + width: 80%; +} +.row .col-75 { + width: 75%; + width: -webkit-calc((100% - 16px*0.33333333333333326) / 1.3333333333333333); + width: calc((100% - 16px*0.33333333333333326) / 1.3333333333333333); +} +.row.no-gutter .col-75 { + width: 75%; +} +.row .col-70 { + width: 70%; + width: -webkit-calc((100% - 16px*0.4285714285714286) / 1.4285714285714286); + width: calc((100% - 16px*0.4285714285714286) / 1.4285714285714286); +} +.row.no-gutter .col-70 { + width: 70%; +} +.row .col-66 { + width: 66.66666666666666%; + width: -webkit-calc((100% - 16px*0.5000000000000002) / 1.5000000000000002); + width: calc((100% - 16px*0.5000000000000002) / 1.5000000000000002); +} +.row.no-gutter .col-66 { + width: 66.66666666666666%; +} +.row .col-65 { + width: 65%; + width: -webkit-calc((100% - 16px*0.5384615384615385) / 1.5384615384615385); + width: calc((100% - 16px*0.5384615384615385) / 1.5384615384615385); +} +.row.no-gutter .col-65 { + width: 65%; +} +.row .col-60 { + width: 60%; + width: -webkit-calc((100% - 16px*0.6666666666666667) / 1.6666666666666667); + width: calc((100% - 16px*0.6666666666666667) / 1.6666666666666667); +} +.row.no-gutter .col-60 { + width: 60%; +} +.row .col-55 { + width: 55%; + width: -webkit-calc((100% - 16px*0.8181818181818181) / 1.8181818181818181); + width: calc((100% - 16px*0.8181818181818181) / 1.8181818181818181); +} +.row.no-gutter .col-55 { + width: 55%; +} +.row .col-50 { + width: 50%; + width: -webkit-calc((100% - 16px*1) / 2); + width: calc((100% - 16px*1) / 2); +} +.row.no-gutter .col-50 { + width: 50%; +} +.row .col-45 { + width: 45%; + width: -webkit-calc((100% - 16px*1.2222222222222223) / 2.2222222222222223); + width: calc((100% - 16px*1.2222222222222223) / 2.2222222222222223); +} +.row.no-gutter .col-45 { + width: 45%; +} +.row .col-40 { + width: 40%; + width: -webkit-calc((100% - 16px*1.5) / 2.5); + width: calc((100% - 16px*1.5) / 2.5); +} +.row.no-gutter .col-40 { + width: 40%; +} +.row .col-35 { + width: 35%; + width: -webkit-calc((100% - 16px*1.8571428571428572) / 2.857142857142857); + width: calc((100% - 16px*1.8571428571428572) / 2.857142857142857); +} +.row.no-gutter .col-35 { + width: 35%; +} +.row .col-33 { + width: 33.333333333333336%; + width: -webkit-calc((100% - 16px*2) / 3); + width: calc((100% - 16px*2) / 3); +} +.row.no-gutter .col-33 { + width: 33.333333333333336%; +} +.row .col-30 { + width: 30%; + width: -webkit-calc((100% - 16px*2.3333333333333335) / 3.3333333333333335); + width: calc((100% - 16px*2.3333333333333335) / 3.3333333333333335); +} +.row.no-gutter .col-30 { + width: 30%; +} +.row .col-25 { + width: 25%; + width: -webkit-calc((100% - 16px*3) / 4); + width: calc((100% - 16px*3) / 4); +} +.row.no-gutter .col-25 { + width: 25%; +} +.row .col-20 { + width: 20%; + width: -webkit-calc((100% - 16px*4) / 5); + width: calc((100% - 16px*4) / 5); +} +.row.no-gutter .col-20 { + width: 20%; +} +.row .col-15 { + width: 15%; + width: -webkit-calc((100% - 16px*5.666666666666667) / 6.666666666666667); + width: calc((100% - 16px*5.666666666666667) / 6.666666666666667); +} +.row.no-gutter .col-15 { + width: 15%; +} +.row .col-10 { + width: 10%; + width: -webkit-calc((100% - 16px*9) / 10); + width: calc((100% - 16px*9) / 10); +} +.row.no-gutter .col-10 { + width: 10%; +} +.row .col-5 { + width: 5%; + width: -webkit-calc((100% - 16px*19) / 20); + width: calc((100% - 16px*19) / 20); +} +.row.no-gutter .col-5 { + width: 5%; +} +.row .col-auto:nth-last-child(1), +.row .col-auto:nth-last-child(1) ~ .col-auto { + width: 100%; + width: -webkit-calc((100% - 16px*0) / 1); + width: calc((100% - 16px*0) / 1); +} +.row.no-gutter .col-auto:nth-last-child(1), +.row.no-gutter .col-auto:nth-last-child(1) ~ .col-auto { + width: 100%; +} +.row .col-auto:nth-last-child(2), +.row .col-auto:nth-last-child(2) ~ .col-auto { + width: 50%; + width: -webkit-calc((100% - 16px*1) / 2); + width: calc((100% - 16px*1) / 2); +} +.row.no-gutter .col-auto:nth-last-child(2), +.row.no-gutter .col-auto:nth-last-child(2) ~ .col-auto { + width: 50%; +} +.row .col-auto:nth-last-child(3), +.row .col-auto:nth-last-child(3) ~ .col-auto { + width: 33.33333333%; + width: -webkit-calc((100% - 16px*2) / 3); + width: calc((100% - 16px*2) / 3); +} +.row.no-gutter .col-auto:nth-last-child(3), +.row.no-gutter .col-auto:nth-last-child(3) ~ .col-auto { + width: 33.33333333%; +} +.row .col-auto:nth-last-child(4), +.row .col-auto:nth-last-child(4) ~ .col-auto { + width: 25%; + width: -webkit-calc((100% - 16px*3) / 4); + width: calc((100% - 16px*3) / 4); +} +.row.no-gutter .col-auto:nth-last-child(4), +.row.no-gutter .col-auto:nth-last-child(4) ~ .col-auto { + width: 25%; +} +.row .col-auto:nth-last-child(5), +.row .col-auto:nth-last-child(5) ~ .col-auto { + width: 20%; + width: -webkit-calc((100% - 16px*4) / 5); + width: calc((100% - 16px*4) / 5); +} +.row.no-gutter .col-auto:nth-last-child(5), +.row.no-gutter .col-auto:nth-last-child(5) ~ .col-auto { + width: 20%; +} +.row .col-auto:nth-last-child(6), +.row .col-auto:nth-last-child(6) ~ .col-auto { + width: 16.66666667%; + width: -webkit-calc((100% - 16px*5) / 6); + width: calc((100% - 16px*5) / 6); +} +.row.no-gutter .col-auto:nth-last-child(6), +.row.no-gutter .col-auto:nth-last-child(6) ~ .col-auto { + width: 16.66666667%; +} +.row .col-auto:nth-last-child(7), +.row .col-auto:nth-last-child(7) ~ .col-auto { + width: 14.28571429%; + width: -webkit-calc((100% - 16px*6) / 7); + width: calc((100% - 16px*6) / 7); +} +.row.no-gutter .col-auto:nth-last-child(7), +.row.no-gutter .col-auto:nth-last-child(7) ~ .col-auto { + width: 14.28571429%; +} +.row .col-auto:nth-last-child(8), +.row .col-auto:nth-last-child(8) ~ .col-auto { + width: 12.5%; + width: -webkit-calc((100% - 16px*7) / 8); + width: calc((100% - 16px*7) / 8); +} +.row.no-gutter .col-auto:nth-last-child(8), +.row.no-gutter .col-auto:nth-last-child(8) ~ .col-auto { + width: 12.5%; +} +.row .col-auto:nth-last-child(9), +.row .col-auto:nth-last-child(9) ~ .col-auto { + width: 11.11111111%; + width: -webkit-calc((100% - 16px*8) / 9); + width: calc((100% - 16px*8) / 9); +} +.row.no-gutter .col-auto:nth-last-child(9), +.row.no-gutter .col-auto:nth-last-child(9) ~ .col-auto { + width: 11.11111111%; +} +.row .col-auto:nth-last-child(10), +.row .col-auto:nth-last-child(10) ~ .col-auto { + width: 10%; + width: -webkit-calc((100% - 16px*9) / 10); + width: calc((100% - 16px*9) / 10); +} +.row.no-gutter .col-auto:nth-last-child(10), +.row.no-gutter .col-auto:nth-last-child(10) ~ .col-auto { + width: 10%; +} +.row .col-auto:nth-last-child(11), +.row .col-auto:nth-last-child(11) ~ .col-auto { + width: 9.09090909%; + width: -webkit-calc((100% - 16px*10) / 11); + width: calc((100% - 16px*10) / 11); +} +.row.no-gutter .col-auto:nth-last-child(11), +.row.no-gutter .col-auto:nth-last-child(11) ~ .col-auto { + width: 9.09090909%; +} +.row .col-auto:nth-last-child(12), +.row .col-auto:nth-last-child(12) ~ .col-auto { + width: 8.33333333%; + width: -webkit-calc((100% - 16px*11) / 12); + width: calc((100% - 16px*11) / 12); +} +.row.no-gutter .col-auto:nth-last-child(12), +.row.no-gutter .col-auto:nth-last-child(12) ~ .col-auto { + width: 8.33333333%; +} +.row .col-auto:nth-last-child(13), +.row .col-auto:nth-last-child(13) ~ .col-auto { + width: 7.69230769%; + width: -webkit-calc((100% - 16px*12) / 13); + width: calc((100% - 16px*12) / 13); +} +.row.no-gutter .col-auto:nth-last-child(13), +.row.no-gutter .col-auto:nth-last-child(13) ~ .col-auto { + width: 7.69230769%; +} +.row .col-auto:nth-last-child(14), +.row .col-auto:nth-last-child(14) ~ .col-auto { + width: 7.14285714%; + width: -webkit-calc((100% - 16px*13) / 14); + width: calc((100% - 16px*13) / 14); +} +.row.no-gutter .col-auto:nth-last-child(14), +.row.no-gutter .col-auto:nth-last-child(14) ~ .col-auto { + width: 7.14285714%; +} +.row .col-auto:nth-last-child(15), +.row .col-auto:nth-last-child(15) ~ .col-auto { + width: 6.66666667%; + width: -webkit-calc((100% - 16px*14) / 15); + width: calc((100% - 16px*14) / 15); +} +.row.no-gutter .col-auto:nth-last-child(15), +.row.no-gutter .col-auto:nth-last-child(15) ~ .col-auto { + width: 6.66666667%; +} +.row .col-auto:nth-last-child(16), +.row .col-auto:nth-last-child(16) ~ .col-auto { + width: 6.25%; + width: -webkit-calc((100% - 16px*15) / 16); + width: calc((100% - 16px*15) / 16); +} +.row.no-gutter .col-auto:nth-last-child(16), +.row.no-gutter .col-auto:nth-last-child(16) ~ .col-auto { + width: 6.25%; +} +.row .col-auto:nth-last-child(17), +.row .col-auto:nth-last-child(17) ~ .col-auto { + width: 5.88235294%; + width: -webkit-calc((100% - 16px*16) / 17); + width: calc((100% - 16px*16) / 17); +} +.row.no-gutter .col-auto:nth-last-child(17), +.row.no-gutter .col-auto:nth-last-child(17) ~ .col-auto { + width: 5.88235294%; +} +.row .col-auto:nth-last-child(18), +.row .col-auto:nth-last-child(18) ~ .col-auto { + width: 5.55555556%; + width: -webkit-calc((100% - 16px*17) / 18); + width: calc((100% - 16px*17) / 18); +} +.row.no-gutter .col-auto:nth-last-child(18), +.row.no-gutter .col-auto:nth-last-child(18) ~ .col-auto { + width: 5.55555556%; +} +.row .col-auto:nth-last-child(19), +.row .col-auto:nth-last-child(19) ~ .col-auto { + width: 5.26315789%; + width: -webkit-calc((100% - 16px*18) / 19); + width: calc((100% - 16px*18) / 19); +} +.row.no-gutter .col-auto:nth-last-child(19), +.row.no-gutter .col-auto:nth-last-child(19) ~ .col-auto { + width: 5.26315789%; +} +.row .col-auto:nth-last-child(20), +.row .col-auto:nth-last-child(20) ~ .col-auto { + width: 5%; + width: -webkit-calc((100% - 16px*19) / 20); + width: calc((100% - 16px*19) / 20); +} +.row.no-gutter .col-auto:nth-last-child(20), +.row.no-gutter .col-auto:nth-last-child(20) ~ .col-auto { + width: 5%; +} +.row .col-auto:nth-last-child(21), +.row .col-auto:nth-last-child(21) ~ .col-auto { + width: 4.76190476%; + width: -webkit-calc((100% - 16px*20) / 21); + width: calc((100% - 16px*20) / 21); +} +.row.no-gutter .col-auto:nth-last-child(21), +.row.no-gutter .col-auto:nth-last-child(21) ~ .col-auto { + width: 4.76190476%; +} +@media all and (min-width: 768px) { + .row .tablet-100 { + width: 100%; + width: -webkit-calc((100% - 16px*0) / 1); + width: calc((100% - 16px*0) / 1); + } + .row.no-gutter .tablet-100 { + width: 100%; + } + .row .tablet-95 { + width: 95%; + width: -webkit-calc((100% - 16px*0.05263157894736836) / 1.0526315789473684); + width: calc((100% - 16px*0.05263157894736836) / 1.0526315789473684); + } + .row.no-gutter .tablet-95 { + width: 95%; + } + .row .tablet-90 { + width: 90%; + width: -webkit-calc((100% - 16px*0.11111111111111116) / 1.1111111111111112); + width: calc((100% - 16px*0.11111111111111116) / 1.1111111111111112); + } + .row.no-gutter .tablet-90 { + width: 90%; + } + .row .tablet-85 { + width: 85%; + width: -webkit-calc((100% - 16px*0.17647058823529416) / 1.1764705882352942); + width: calc((100% - 16px*0.17647058823529416) / 1.1764705882352942); + } + .row.no-gutter .tablet-85 { + width: 85%; + } + .row .tablet-80 { + width: 80%; + width: -webkit-calc((100% - 16px*0.25) / 1.25); + width: calc((100% - 16px*0.25) / 1.25); + } + .row.no-gutter .tablet-80 { + width: 80%; + } + .row .tablet-75 { + width: 75%; + width: -webkit-calc((100% - 16px*0.33333333333333326) / 1.3333333333333333); + width: calc((100% - 16px*0.33333333333333326) / 1.3333333333333333); + } + .row.no-gutter .tablet-75 { + width: 75%; + } + .row .tablet-70 { + width: 70%; + width: -webkit-calc((100% - 16px*0.4285714285714286) / 1.4285714285714286); + width: calc((100% - 16px*0.4285714285714286) / 1.4285714285714286); + } + .row.no-gutter .tablet-70 { + width: 70%; + } + .row .tablet-66 { + width: 66.66666666666666%; + width: -webkit-calc((100% - 16px*0.5000000000000002) / 1.5000000000000002); + width: calc((100% - 16px*0.5000000000000002) / 1.5000000000000002); + } + .row.no-gutter .tablet-66 { + width: 66.66666666666666%; + } + .row .tablet-65 { + width: 65%; + width: -webkit-calc((100% - 16px*0.5384615384615385) / 1.5384615384615385); + width: calc((100% - 16px*0.5384615384615385) / 1.5384615384615385); + } + .row.no-gutter .tablet-65 { + width: 65%; + } + .row .tablet-60 { + width: 60%; + width: -webkit-calc((100% - 16px*0.6666666666666667) / 1.6666666666666667); + width: calc((100% - 16px*0.6666666666666667) / 1.6666666666666667); + } + .row.no-gutter .tablet-60 { + width: 60%; + } + .row .tablet-55 { + width: 55%; + width: -webkit-calc((100% - 16px*0.8181818181818181) / 1.8181818181818181); + width: calc((100% - 16px*0.8181818181818181) / 1.8181818181818181); + } + .row.no-gutter .tablet-55 { + width: 55%; + } + .row .tablet-50 { + width: 50%; + width: -webkit-calc((100% - 16px*1) / 2); + width: calc((100% - 16px*1) / 2); + } + .row.no-gutter .tablet-50 { + width: 50%; + } + .row .tablet-45 { + width: 45%; + width: -webkit-calc((100% - 16px*1.2222222222222223) / 2.2222222222222223); + width: calc((100% - 16px*1.2222222222222223) / 2.2222222222222223); + } + .row.no-gutter .tablet-45 { + width: 45%; + } + .row .tablet-40 { + width: 40%; + width: -webkit-calc((100% - 16px*1.5) / 2.5); + width: calc((100% - 16px*1.5) / 2.5); + } + .row.no-gutter .tablet-40 { + width: 40%; + } + .row .tablet-35 { + width: 35%; + width: -webkit-calc((100% - 16px*1.8571428571428572) / 2.857142857142857); + width: calc((100% - 16px*1.8571428571428572) / 2.857142857142857); + } + .row.no-gutter .tablet-35 { + width: 35%; + } + .row .tablet-33 { + width: 33.333333333333336%; + width: -webkit-calc((100% - 16px*2) / 3); + width: calc((100% - 16px*2) / 3); + } + .row.no-gutter .tablet-33 { + width: 33.333333333333336%; + } + .row .tablet-30 { + width: 30%; + width: -webkit-calc((100% - 16px*2.3333333333333335) / 3.3333333333333335); + width: calc((100% - 16px*2.3333333333333335) / 3.3333333333333335); + } + .row.no-gutter .tablet-30 { + width: 30%; + } + .row .tablet-25 { + width: 25%; + width: -webkit-calc((100% - 16px*3) / 4); + width: calc((100% - 16px*3) / 4); + } + .row.no-gutter .tablet-25 { + width: 25%; + } + .row .tablet-20 { + width: 20%; + width: -webkit-calc((100% - 16px*4) / 5); + width: calc((100% - 16px*4) / 5); + } + .row.no-gutter .tablet-20 { + width: 20%; + } + .row .tablet-15 { + width: 15%; + width: -webkit-calc((100% - 16px*5.666666666666667) / 6.666666666666667); + width: calc((100% - 16px*5.666666666666667) / 6.666666666666667); + } + .row.no-gutter .tablet-15 { + width: 15%; + } + .row .tablet-10 { + width: 10%; + width: -webkit-calc((100% - 16px*9) / 10); + width: calc((100% - 16px*9) / 10); + } + .row.no-gutter .tablet-10 { + width: 10%; + } + .row .tablet-5 { + width: 5%; + width: -webkit-calc((100% - 16px*19) / 20); + width: calc((100% - 16px*19) / 20); + } + .row.no-gutter .tablet-5 { + width: 5%; + } + .row .tablet-auto:nth-last-child(1), + .row .tablet-auto:nth-last-child(1) ~ .col-auto { + width: 100%; + width: -webkit-calc((100% - 16px*0) / 1); + width: calc((100% - 16px*0) / 1); + } + .row.no-gutter .tablet-auto:nth-last-child(1), + .row.no-gutter .tablet-auto:nth-last-child(1) ~ .tablet-auto { + width: 100%; + } + .row .tablet-auto:nth-last-child(2), + .row .tablet-auto:nth-last-child(2) ~ .col-auto { + width: 50%; + width: -webkit-calc((100% - 16px*1) / 2); + width: calc((100% - 16px*1) / 2); + } + .row.no-gutter .tablet-auto:nth-last-child(2), + .row.no-gutter .tablet-auto:nth-last-child(2) ~ .tablet-auto { + width: 50%; + } + .row .tablet-auto:nth-last-child(3), + .row .tablet-auto:nth-last-child(3) ~ .col-auto { + width: 33.33333333%; + width: -webkit-calc((100% - 16px*2) / 3); + width: calc((100% - 16px*2) / 3); + } + .row.no-gutter .tablet-auto:nth-last-child(3), + .row.no-gutter .tablet-auto:nth-last-child(3) ~ .tablet-auto { + width: 33.33333333%; + } + .row .tablet-auto:nth-last-child(4), + .row .tablet-auto:nth-last-child(4) ~ .col-auto { + width: 25%; + width: -webkit-calc((100% - 16px*3) / 4); + width: calc((100% - 16px*3) / 4); + } + .row.no-gutter .tablet-auto:nth-last-child(4), + .row.no-gutter .tablet-auto:nth-last-child(4) ~ .tablet-auto { + width: 25%; + } + .row .tablet-auto:nth-last-child(5), + .row .tablet-auto:nth-last-child(5) ~ .col-auto { + width: 20%; + width: -webkit-calc((100% - 16px*4) / 5); + width: calc((100% - 16px*4) / 5); + } + .row.no-gutter .tablet-auto:nth-last-child(5), + .row.no-gutter .tablet-auto:nth-last-child(5) ~ .tablet-auto { + width: 20%; + } + .row .tablet-auto:nth-last-child(6), + .row .tablet-auto:nth-last-child(6) ~ .col-auto { + width: 16.66666667%; + width: -webkit-calc((100% - 16px*5) / 6); + width: calc((100% - 16px*5) / 6); + } + .row.no-gutter .tablet-auto:nth-last-child(6), + .row.no-gutter .tablet-auto:nth-last-child(6) ~ .tablet-auto { + width: 16.66666667%; + } + .row .tablet-auto:nth-last-child(7), + .row .tablet-auto:nth-last-child(7) ~ .col-auto { + width: 14.28571429%; + width: -webkit-calc((100% - 16px*6) / 7); + width: calc((100% - 16px*6) / 7); + } + .row.no-gutter .tablet-auto:nth-last-child(7), + .row.no-gutter .tablet-auto:nth-last-child(7) ~ .tablet-auto { + width: 14.28571429%; + } + .row .tablet-auto:nth-last-child(8), + .row .tablet-auto:nth-last-child(8) ~ .col-auto { + width: 12.5%; + width: -webkit-calc((100% - 16px*7) / 8); + width: calc((100% - 16px*7) / 8); + } + .row.no-gutter .tablet-auto:nth-last-child(8), + .row.no-gutter .tablet-auto:nth-last-child(8) ~ .tablet-auto { + width: 12.5%; + } + .row .tablet-auto:nth-last-child(9), + .row .tablet-auto:nth-last-child(9) ~ .col-auto { + width: 11.11111111%; + width: -webkit-calc((100% - 16px*8) / 9); + width: calc((100% - 16px*8) / 9); + } + .row.no-gutter .tablet-auto:nth-last-child(9), + .row.no-gutter .tablet-auto:nth-last-child(9) ~ .tablet-auto { + width: 11.11111111%; + } + .row .tablet-auto:nth-last-child(10), + .row .tablet-auto:nth-last-child(10) ~ .col-auto { + width: 10%; + width: -webkit-calc((100% - 16px*9) / 10); + width: calc((100% - 16px*9) / 10); + } + .row.no-gutter .tablet-auto:nth-last-child(10), + .row.no-gutter .tablet-auto:nth-last-child(10) ~ .tablet-auto { + width: 10%; + } + .row .tablet-auto:nth-last-child(11), + .row .tablet-auto:nth-last-child(11) ~ .col-auto { + width: 9.09090909%; + width: -webkit-calc((100% - 16px*10) / 11); + width: calc((100% - 16px*10) / 11); + } + .row.no-gutter .tablet-auto:nth-last-child(11), + .row.no-gutter .tablet-auto:nth-last-child(11) ~ .tablet-auto { + width: 9.09090909%; + } + .row .tablet-auto:nth-last-child(12), + .row .tablet-auto:nth-last-child(12) ~ .col-auto { + width: 8.33333333%; + width: -webkit-calc((100% - 16px*11) / 12); + width: calc((100% - 16px*11) / 12); + } + .row.no-gutter .tablet-auto:nth-last-child(12), + .row.no-gutter .tablet-auto:nth-last-child(12) ~ .tablet-auto { + width: 8.33333333%; + } + .row .tablet-auto:nth-last-child(13), + .row .tablet-auto:nth-last-child(13) ~ .col-auto { + width: 7.69230769%; + width: -webkit-calc((100% - 16px*12) / 13); + width: calc((100% - 16px*12) / 13); + } + .row.no-gutter .tablet-auto:nth-last-child(13), + .row.no-gutter .tablet-auto:nth-last-child(13) ~ .tablet-auto { + width: 7.69230769%; + } + .row .tablet-auto:nth-last-child(14), + .row .tablet-auto:nth-last-child(14) ~ .col-auto { + width: 7.14285714%; + width: -webkit-calc((100% - 16px*13) / 14); + width: calc((100% - 16px*13) / 14); + } + .row.no-gutter .tablet-auto:nth-last-child(14), + .row.no-gutter .tablet-auto:nth-last-child(14) ~ .tablet-auto { + width: 7.14285714%; + } + .row .tablet-auto:nth-last-child(15), + .row .tablet-auto:nth-last-child(15) ~ .col-auto { + width: 6.66666667%; + width: -webkit-calc((100% - 16px*14) / 15); + width: calc((100% - 16px*14) / 15); + } + .row.no-gutter .tablet-auto:nth-last-child(15), + .row.no-gutter .tablet-auto:nth-last-child(15) ~ .tablet-auto { + width: 6.66666667%; + } + .row .tablet-auto:nth-last-child(16), + .row .tablet-auto:nth-last-child(16) ~ .col-auto { + width: 6.25%; + width: -webkit-calc((100% - 16px*15) / 16); + width: calc((100% - 16px*15) / 16); + } + .row.no-gutter .tablet-auto:nth-last-child(16), + .row.no-gutter .tablet-auto:nth-last-child(16) ~ .tablet-auto { + width: 6.25%; + } + .row .tablet-auto:nth-last-child(17), + .row .tablet-auto:nth-last-child(17) ~ .col-auto { + width: 5.88235294%; + width: -webkit-calc((100% - 16px*16) / 17); + width: calc((100% - 16px*16) / 17); + } + .row.no-gutter .tablet-auto:nth-last-child(17), + .row.no-gutter .tablet-auto:nth-last-child(17) ~ .tablet-auto { + width: 5.88235294%; + } + .row .tablet-auto:nth-last-child(18), + .row .tablet-auto:nth-last-child(18) ~ .col-auto { + width: 5.55555556%; + width: -webkit-calc((100% - 16px*17) / 18); + width: calc((100% - 16px*17) / 18); + } + .row.no-gutter .tablet-auto:nth-last-child(18), + .row.no-gutter .tablet-auto:nth-last-child(18) ~ .tablet-auto { + width: 5.55555556%; + } + .row .tablet-auto:nth-last-child(19), + .row .tablet-auto:nth-last-child(19) ~ .col-auto { + width: 5.26315789%; + width: -webkit-calc((100% - 16px*18) / 19); + width: calc((100% - 16px*18) / 19); + } + .row.no-gutter .tablet-auto:nth-last-child(19), + .row.no-gutter .tablet-auto:nth-last-child(19) ~ .tablet-auto { + width: 5.26315789%; + } + .row .tablet-auto:nth-last-child(20), + .row .tablet-auto:nth-last-child(20) ~ .col-auto { + width: 5%; + width: -webkit-calc((100% - 16px*19) / 20); + width: calc((100% - 16px*19) / 20); + } + .row.no-gutter .tablet-auto:nth-last-child(20), + .row.no-gutter .tablet-auto:nth-last-child(20) ~ .tablet-auto { + width: 5%; + } + .row .tablet-auto:nth-last-child(21), + .row .tablet-auto:nth-last-child(21) ~ .col-auto { + width: 4.76190476%; + width: -webkit-calc((100% - 16px*20) / 21); + width: calc((100% - 16px*20) / 21); + } + .row.no-gutter .tablet-auto:nth-last-child(21), + .row.no-gutter .tablet-auto:nth-last-child(21) ~ .tablet-auto { + width: 4.76190476%; + } +} +/* === Views === */ +.views, +.view { + position: relative; + width: 100%; + height: 100%; + z-index: 5000; +} +.views { + overflow: auto; + -webkit-overflow-scrolling: touch; +} +.view { + overflow: hidden; + box-sizing: border-box; +} +/* === Pages === */ +.pages { + position: relative; + width: 100%; + height: 100%; + overflow: hidden; +} +.page { + box-sizing: border-box; + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + background: #fff; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +.page.cached { + display: none; +} +.page-on-left { + opacity: 1; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +.page-on-right { + opacity: 0; + pointer-events: none; + -webkit-transform: translate3d(0, 56px, 0); + transform: translate3d(0, 56px, 0); +} +.page-content { + overflow: auto; + -webkit-overflow-scrolling: touch; + box-sizing: border-box; + height: 100%; + position: relative; + z-index: 1; +} +.page-transitioning { + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +.page-from-right-to-center { + pointer-events: none; + -webkit-animation: pageFromRightToCenter 300ms forwards; + animation: pageFromRightToCenter 300ms forwards; +} +.page-from-center-to-right { + pointer-events: none; + -webkit-animation: pageFromCenterToRight 300ms forwards; + animation: pageFromCenterToRight 300ms forwards; +} +@-webkit-keyframes pageFromRightToCenter { + from { + opacity: 0; + -webkit-transform: translate3d(0, 56px, 0); + } + to { + opacity: 1; + -webkit-transform: translate3d(0, 0, 0); + } +} +@keyframes pageFromRightToCenter { + from { + opacity: 0; + transform: translate3d(0, 56px, 0); + } + to { + opacity: 1; + transform: translate3d(0, 0, 0); + } +} +@-webkit-keyframes pageFromCenterToRight { + from { + opacity: 1; + -webkit-transform: translate3d(0, 0, 0); + } + to { + opacity: 0; + -webkit-transform: translate3d(0, 56px, 0); + } +} +@keyframes pageFromCenterToRight { + from { + opacity: 1; + transform: translate3d(0, 0, 0); + } + to { + opacity: 0; + transform: translate3d(0, 56px, 0); + } +} +.page-from-center-to-left { + -webkit-animation: pageFromCenterToLeft 300ms forwards; + animation: pageFromCenterToLeft 300ms forwards; +} +.page-from-left-to-center { + -webkit-animation: pageFromLeftToCenter 300ms forwards; + animation: pageFromLeftToCenter 300ms forwards; +} +@-webkit-keyframes pageFromCenterToLeft { + from { + opacity: 1; + } + to { + opacity: 1; + } +} +@keyframes pageFromCenterToLeft { + from { + opacity: 1; + } + to { + opacity: 1; + } +} +@-webkit-keyframes pageFromLeftToCenter { + from { + opacity: 1; + } + to { + opacity: 1; + } +} +@keyframes pageFromLeftToCenter { + from { + opacity: 1; + } + to { + opacity: 1; + } +} +/* === Toolbars === */ +.navbar-inner, +.toolbar-inner { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + box-sizing: border-box; + overflow: hidden; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; +} +.navbar-inner { + -webkit-box-pack: start; + -ms-flex-pack: start; + -webkit-justify-content: flex-start; + justify-content: flex-start; +} +.toolbar-inner { + -webkit-box-pack: justify; + -ms-flex-pack: justify; + -webkit-justify-content: space-between; + justify-content: space-between; +} +.navbar-inner.cached { + display: none; +} +.navbar, +.toolbar { + width: 100%; + box-sizing: border-box; + position: relative; + margin: 0; + z-index: 500; + -webkit-backface-visibility: hidden; + backface-visibility: hidden; + color: #fff; +} +.navbar b, +.toolbar b { + font-weight: 500; +} +.navbar ~ .toolbar { + z-index: 499; +} +.navbar, +.toolbar, +.subnavbar { + background: #2196f3; +} +.navbar a.link, +.toolbar a.link, +.subnavbar a.link { + text-decoration: none; + position: relative; + color: #fff; + box-sizing: border-box; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + padding: 0 16px; + min-width: 48px; +} +.navbar a.link:before, +.toolbar a.link:before, +.subnavbar a.link:before { + content: ''; + width: 152%; + height: 152%; + position: absolute; + left: -26%; + top: -26%; + background-image: -webkit-radial-gradient(center, circle cover, rgba(255, 255, 255, 0.15) 66%, rgba(255, 255, 255, 0) 66%); + background-image: radial-gradient(circle at center, rgba(255, 255, 255, 0.15) 66%, rgba(255, 255, 255, 0) 66%); + background-repeat: no-repeat; + background-position: center; + background-size: 100% 100%; + opacity: 0; + pointer-events: none; + -webkit-transition-duration: 600ms; + transition-duration: 600ms; +} +html:not(.watch-active-state) .navbar a.link:active:before, +html:not(.watch-active-state) .toolbar a.link:active:before, +html:not(.watch-active-state) .subnavbar a.link:active:before, +.navbar a.link.active-state:before, +.toolbar a.link.active-state:before, +.subnavbar a.link.active-state:before { + opacity: 1; + -webkit-transition-duration: 150ms; + transition-duration: 150ms; +} +.navbar a.link i + span, +.toolbar a.link i + span, +.subnavbar a.link i + span, +.navbar a.link i + i, +.toolbar a.link i + i, +.subnavbar a.link i + i, +.navbar a.link span + i, +.toolbar a.link span + i, +.subnavbar a.link span + i, +.navbar a.link span + span, +.toolbar a.link span + span, +.subnavbar a.link span + span { + margin-left: 8px; +} +.navbar a.icon-only, +.toolbar a.icon-only, +.subnavbar a.icon-only { + min-width: 0; + -webkit-box-flex: 0; + -webkit-flex-shrink: 0; + -ms-flex: 0 0 auto; + flex-shrink: 0; +} +.navbar i.icon, +.toolbar i.icon, +.subnavbar i.icon { + display: block; +} +.navbar .center, +.subnavbar .center { + font-size: 20px; + font-weight: 500; + text-align: center; + margin: 0 16px; + position: relative; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + line-height: 56px; + display: inline-block; + text-align: left; +} +.navbar .left, +.subnavbar .left, +.navbar .right, +.subnavbar .right { + -webkit-box-flex: 0; + -webkit-flex-shrink: 0; + -ms-flex: 0 0 auto; + flex-shrink: 0; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: start; + -ms-flex-pack: start; + -webkit-justify-content: flex-start; + justify-content: flex-start; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +.navbar .right, +.subnavbar .right { + margin-left: auto; +} +.navbar .right:first-child, +.subnavbar .right:first-child { + position: absolute; + right: 16px; + height: 100%; +} +.navbar { + left: 0; + top: 0; + height: 56px; + font-size: 20px; +} +.navbar a.link { + line-height: 56px; + height: 56px; +} +.popup .navbar { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +.subnavbar { + height: 48px; + width: 100%; + position: absolute; + left: 0; + top: 100%; + z-index: 20; + box-sizing: border-box; + padding: 0 16px; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: justify; + -ms-flex-pack: justify; + -webkit-justify-content: space-between; + justify-content: space-between; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + overflow: hidden; +} +.subnavbar a.link { + line-height: 48px; + height: 48px; +} +.subnavbar .center { + line-height: 48px; +} +.subnavbar .center:first-child { + margin-left: 56px; +} +.navbar.no-border .subnavbar { + margin-top: 0; +} +.navbar-on-left .subnavbar, +.navbar-on-right .subnavbar { + pointer-events: none; +} +.navbar .subnavbar, +.page .subnavbar { + position: absolute; +} +.page > .subnavbar { + top: 0; + margin-top: 0; +} +.subnavbar > .buttons-row { + width: 100%; +} +.subnavbar .searchbar, +.subnavbar.searchbar { + position: absolute; +} +.subnavbar.searchbar, +.subnavbar .searchbar { + position: absolute; +} +.subnavbar .searchbar { + left: 0; + top: 0; +} +.toolbar { + left: 0; + bottom: 0; + height: 48px; + font-size: 14px; +} +.toolbar a.link { + line-height: 48px; + height: 48px; +} +.toolbar a { + -webkit-box-flex: 1; + -webkit-flex-shrink: 1; + -ms-flex: 0 1 auto; + flex-shrink: 1; + position: relative; + white-space: nowrap; + text-overflow: ellipsis; +} +.tabbar { + z-index: 5001; + overflow: hidden; + bottom: auto; + top: 0; +} +.tabbar .toolbar-inner { + padding-left: 0; + padding-right: 0; +} +.tabbar a.link { + line-height: 1.4; +} +.tabbar a.tab-link, +.tabbar a.link { + height: 100%; + width: 100%; + box-sizing: border-box; + padding-left: 0; + padding-right: 0; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + -ms-flex: 1; + -webkit-box-orient: vertical; + -moz-box-orient: vertical; + -ms-flex-direction: column; + -webkit-flex-direction: column; + flex-direction: column; + font-size: 14px; + text-transform: uppercase; +} +.tabbar i.icon { + height: 24px; +} +.tabbar a.tab-link { + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + overflow: hidden; + color: rgba(255, 255, 255, 0.7); + position: relative; +} +.tabbar a.tab-link.active, +html:not(.watch-active-state) .tabbar a.tab-link:active, +.tabbar a.tab-link.active-state { + color: #ffffff; +} +.tabbar .tab-link-highlight { + position: absolute; + left: 0; + bottom: 0; + height: 3px; + background: #0a6ebd; + background: rgba(255, 255, 255, 0.5); + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +.tabbar-labels { + height: 72px; +} +.tabbar-labels a.tab-link, +.tabbar-labels a.link { + padding-top: 12px; + padding-bottom: 12px; + height: 100%; + -webkit-box-pack: justify; + -ms-flex-pack: justify; + -webkit-justify-content: space-between; + justify-content: space-between; +} +.tabbar-labels span.tabbar-label { + line-height: 1; + display: block; + margin: 0; + margin-top: 10px; + position: relative; + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; + max-width: 100%; +} +.tabbar-scrollable .toolbar-inner { + -webkit-box-pack: start; + -ms-flex-pack: start; + -webkit-justify-content: flex-start; + justify-content: flex-start; + overflow: auto; +} +.tabbar-scrollable .toolbar-inner::-webkit-scrollbar { + display: none !important; + width: 0 !important; + height: 0 !important; + -webkit-appearance: none; + opacity: 0 !important; +} +.tabbar-scrollable a.tab-link, +.tabbar-scrollable a.link { + width: auto; + -webkit-box-flex: 0; + -webkit-flex-shrink: 0; + -ms-flex: 0 0 auto; + flex-shrink: 0; + -ms-flex: 0; + padding: 0 16px; +} +.toolbar-bottom { + bottom: 0; + top: auto; +} +.toolbar-bottom .tab-link-highlight { + bottom: auto; + top: 0; +} +/* === Relation between toolbar/navbar types and pages === */ +.page > .navbar, +.view > .navbar, +.views > .navbar, +.page > .toolbar, +.view > .toolbar, +.views > .toolbar { + position: absolute; +} +.subnavbar ~ .page-content { + padding-top: 48px; +} +.toolbar-fixed .page-content, +.tabbar-fixed .page-content { + padding-top: 48px; +} +.tabbar-labels-fixed .page-content { + padding-top: 72px; +} +.toolbar ~ .page-content { + padding-top: 48px; +} +.tabbar-labels ~ .page-content { + padding-top: 72px; +} +.toolbar-bottom ~ .page-content, +.messagebar ~ .page-content { + padding-top: 0; + padding-bottom: 48px; +} +.tabbar-labels.toolbar-bottom ~ .page-content { + padding-bottom: 72px; +} +.navbar-fixed .page-content { + padding-top: 56px; +} +.navbar-fixed.toolbar-fixed .page-content, +.navbar-fixed.tabbar-fixed .page-content, +.navbar-fixed .toolbar-fixed .page-content, +.navbar-fixed .tabbar-fixed .page-content, +.toolbar-fixed .navbar-fixed .page-content, +.tabbar-fixed .navbar-fixed .page-content { + padding-top: 104px; +} +.navbar-fixed.tabbar-labels-fixed .page-content, +.navbar-fixed .tabbar-labels-fixed .page-content, +.tabbar-labels-fixed .navbar-fixed .page-content { + padding-top: 128px; +} +.navbar-fixed .toolbar ~ .page-content { + padding-top: 104px; +} +.navbar-fixed .messagebar ~ .page-content, +.navbar-fixed .toolbar-bottom ~ .page-content { + padding-top: 56px; +} +.navbar-fixed .tabbar-labels ~ .page-content { + padding-top: 128px; +} +.navbar-fixed .tabbar-labels.toolbar-bottom ~ .page-content { + padding-top: 56px; +} +.navbar-fixed .with-subnavbar .page-content, +.navbar-fixed .page-content.with-subnavbar, +.navbar-fixed .subnavbar ~ .page-content { + padding-top: 104px; +} +.navbar-fixed .page .subnavbar, +.navbar-fixed.page .subnavbar { + top: 56px; +} +.navbar-fixed .toolbar { + top: 56px; +} +.navbar-fixed .messagebar, +.navbar-fixed .toolbar-bottom { + top: auto; +} +.navbar.navbar-hiding { + -webkit-transition-duration: 400ms; + transition-duration: 400ms; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +.navbar.navbar-hiding ~ .page-content .list-group-title, +.navbar.navbar-hiding ~ .pages .list-group-title, +.navbar.navbar-hiding ~ .page .list-group-title { + -webkit-transition-duration: 400ms; + transition-duration: 400ms; +} +.navbar.navbar-hiding ~ .page-content .subnavbar, +.navbar.navbar-hiding ~ .pages .subnavbar, +.navbar.navbar-hiding ~ .page .subnavbar { + -webkit-transition-duration: 400ms; + transition-duration: 400ms; +} +.navbar.navbar-hiding ~ .subnavbar, +.navbar.navbar-hiding ~ .toolbar { + -webkit-transition-duration: 400ms; + transition-duration: 400ms; +} +.navbar.navbar-hidden { + -webkit-transition-duration: 400ms; + transition-duration: 400ms; + -webkit-transform: translate3d(0, -100%, 0); + transform: translate3d(0, -100%, 0); +} +.navbar.navbar-hidden ~ .page-content .list-group-title, +.navbar.navbar-hidden ~ .pages .list-group-title, +.navbar.navbar-hidden ~ .page .list-group-title { + -webkit-transition-duration: 400ms; + transition-duration: 400ms; + top: -56px; +} +.navbar.navbar-hidden ~ .page-content .subnavbar, +.navbar.navbar-hidden ~ .pages .subnavbar, +.navbar.navbar-hidden ~ .page .subnavbar { + -webkit-transform: translate3d(0, -56px, 0); + transform: translate3d(0, -56px, 0); + -webkit-transition-duration: 400ms; + transition-duration: 400ms; +} +.navbar.navbar-hidden ~ .subnavbar, +.navbar.navbar-hidden ~ .toolbar:not(.messagebar):not(.toolbar-bottom) { + -webkit-transform: translate3d(0, -56px, 0); + transform: translate3d(0, -56px, 0); + -webkit-transition-duration: 400ms; + transition-duration: 400ms; +} +.page.no-navbar .page-content { + padding-top: 0; +} +.page.no-navbar.with-subnavbar .page-content, +.with-subnavbar .page.no-navbar .page-content, +.page.no-navbar .page-content.with-subnavbar { + padding-top: 48px; +} +.toolbar.toolbar-hiding, +.tabbar.toolbar-hiding, +.toolbar.tabbar-hiding, +.tabbar.tabbar-hiding { + -webkit-transition-duration: 400ms; + transition-duration: 400ms; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +.toolbar.toolbar-hidden, +.tabbar.toolbar-hidden, +.toolbar.tabbar-hidden, +.tabbar.tabbar-hidden { + -webkit-transition-duration: 400ms; + transition-duration: 400ms; +} +.toolbar.toolbar-hidden, +.tabbar.toolbar-hidden, +.toolbar.tabbar-hidden, +.tabbar.tabbar-hidden { + -webkit-transform: translate3d(0, -100%, 0); + transform: translate3d(0, -100%, 0); +} +.navbar ~ .toolbar.toolbar-hidden, +.navbar ~ .tabbar.toolbar-hidden, +.navbar ~ .toolbar.tabbar-hidden, +.navbar ~ .tabbar.tabbar-hidden { + -webkit-transform: translate3d(0, -104px, 0); + transform: translate3d(0, -104px, 0); +} +.navbar ~ .toolbar.tabbar-labels.toolbar-hidden, +.navbar ~ .tabbar.tabbar-labels.toolbar-hidden { + -webkit-transform: translate3d(0, -128px, 0); + transform: translate3d(0, -128px, 0); +} +.toolbar.toolbar-hidden.messagebar, +.tabbar.toolbar-hidden.messagebar, +.toolbar.toolbar-hidden.toolbar-bottom, +.tabbar.toolbar-hidden.toolbar-bottom { + -webkit-transform: translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0); +} +.page.no-toolbar .page-content, +.page.no-tabbar .page-content { + padding-bottom: 0; +} +/* === Search Bar === */ +.searchbar { + height: 48px; + width: 100%; + background: #2196f3; + box-sizing: border-box; + padding: 0 16px; + overflow: hidden; + position: relative; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + color: #fff; +} +.searchbar a { + position: relative; + color: #fff; +} +.searchbar a:before { + content: ''; + width: 152%; + height: 152%; + position: absolute; + left: -26%; + top: -26%; + background-image: -webkit-radial-gradient(center, circle cover, rgba(255, 255, 255, 0.15) 66%, rgba(255, 255, 255, 0) 66%); + background-image: radial-gradient(circle at center, rgba(255, 255, 255, 0.15) 66%, rgba(255, 255, 255, 0) 66%); + background-repeat: no-repeat; + background-position: center; + background-size: 100% 100%; + opacity: 0; + pointer-events: none; + -webkit-transition-duration: 600ms; + transition-duration: 600ms; +} +html:not(.watch-active-state) .searchbar a:active:before, +.searchbar a.active-state:before { + opacity: 1; + -webkit-transition-duration: 150ms; + transition-duration: 150ms; +} +.searchbar .searchbar-input { + width: 100%; + height: 32px; + position: relative; + -webkit-box-flex: 1; + -webkit-flex-shrink: 1; + -ms-flex: 0 1 auto; + flex-shrink: 1; +} +.searchbar input[type="search"] { + box-sizing: border-box; + width: 100%; + height: 100%; + display: block; + border: none; + -webkit-appearance: none; + -moz-appearance: none; + -ms-appearance: none; + appearance: none; + border-radius: 0; + font-family: inherit; + color: #fff; + font-size: 16px; + font-weight: 400; + padding: 0 36px 0 24px; + background-color: transparent; + background-repeat: no-repeat; + background-position: 0 center; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20fill%3D'%23FFFFFF'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%20width%3D'24'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M15.5%2014h-.79l-.28-.27C15.41%2012.59%2016%2011.11%2016%209.5%2016%205.91%2013.09%203%209.5%203S3%205.91%203%209.5%205.91%2016%209.5%2016c1.61%200%203.09-.59%204.23-1.57l.27.28v.79l5%204.99L20.49%2019l-4.99-5zm-6%200C7.01%2014%205%2011.99%205%209.5S7.01%205%209.5%205%2014%207.01%2014%209.5%2011.99%2014%209.5%2014z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); + -webkit-background-size: 24px 24px; + background-size: 24px 24px; + border-bottom: 1px solid #fff; + opacity: 0.6; +} +.searchbar input[type="search"]::-webkit-input-placeholder { + color: #ffffff; + opacity: 1; +} +.searchbar input[type="search"]::-webkit-search-cancel-button { + -webkit-appearance: none; +} +.searchbar .searchbar-clear { + position: absolute; + width: 56px; + height: 100%; + right: -16px; + top: 0; + opacity: 0; + pointer-events: none; + background-position: center; + background-repeat: no-repeat; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20fill%3D'%23fff'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%20width%3D'24'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M19%206.41L17.59%205%2012%2010.59%206.41%205%205%206.41%2010.59%2012%205%2017.59%206.41%2019%2012%2013.41%2017.59%2019%2019%2017.59%2013.41%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); + -webkit-background-size: 24px 24px; + background-size: 24px 24px; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + cursor: pointer; +} +.searchbar .searchbar-cancel { + display: none; +} +.searchbar.searchbar-active input[type="search"] { + opacity: 1; +} +.searchbar.searchbar-active .searchbar-clear { + pointer-events: auto; + opacity: 1; +} +.searchbar.searchbar-not-empty .searchbar-clear { + pointer-events: auto; + opacity: 1; +} +.searchbar-overlay { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + z-index: 100; + opacity: 0; + pointer-events: none; + background: rgba(0, 0, 0, 0.25); + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +.searchbar-overlay.searchbar-overlay-active { + opacity: 1; + pointer-events: auto; +} +.searchbar-not-found { + display: none; +} +.hidden-by-searchbar, +.list-block .hidden-by-searchbar, +.list-block li.hidden-by-searchbar { + display: none; +} +.page > .searchbar { + position: absolute; + width: 100%; + left: 0; + top: 0; + z-index: 200; +} +.page > .searchbar ~ .page-content { + padding-top: 48px; +} +.navbar-fixed .page > .searchbar, +.navbar-through .page > .searchbar, +.navbar-fixed > .searchbar, +.navbar-through > .searchbar { + top: 56px; +} +.navbar-fixed .page > .searchbar ~ .page-content, +.navbar-through .page > .searchbar ~ .page-content, +.navbar-fixed > .searchbar ~ .page-content, +.navbar-through > .searchbar ~ .page-content { + padding-top: 104px; +} +/* === Message Bar === */ +.toolbar.messagebar { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + background: #fff; + height: 48px; + top: auto; + bottom: 0; + font-size: 16px; + overflow: hidden; +} +.toolbar.messagebar:before { + content: ''; + position: absolute; + left: 0; + top: 0; + bottom: auto; + right: auto; + height: 1px; + width: 100%; + background-color: #d1d1d1; + display: block; + z-index: 15; + -webkit-transform-origin: 50% 0%; + transform-origin: 50% 0%; +} +html.pixel-ratio-2 .toolbar.messagebar:before { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .toolbar.messagebar:before { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.toolbar.messagebar textarea { + -webkit-appearance: none; + -moz-appearance: none; + -ms-appearance: none; + appearance: none; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; + border: none; + background: none; + border-radius: 0; + box-shadow: none; + display: block; + padding: 3px 8px 3px; + margin: 0; + width: 100%; + height: 28px; + color: #333; + font-size: 16px; + line-height: 22px; + font-family: inherit; + resize: none; + -webkit-box-flex: 1; + -webkit-flex-shrink: 1; + -ms-flex: 0 1 auto; + flex-shrink: 1; +} +.toolbar.messagebar a.link { + color: #333; + -ms-flex-item-align: flex-end; + -webkit-align-self: flex-end; + align-self: flex-end; + height: 48px; + line-height: 48px; +} +.toolbar.messagebar a.link:before { + background-image: -webkit-radial-gradient(center, circle cover, rgba(0, 0, 0, 0.1) 66%, rgba(0, 0, 0, 0) 66%); + background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0.1) 66%, rgba(0, 0, 0, 0) 66%); +} +.toolbar.messagebar .link { + -webkit-box-flex: 0; + -webkit-flex-shrink: 0; + -ms-flex: 0 0 auto; + flex-shrink: 0; +} +.toolbar.messagebar ~ .page-content { + padding-bottom: 48px; +} +.page.no-toolbar .toolbar.messagebar ~ .page-content { + padding-bottom: 48px; +} +.hidden-toolbar .toolbar.messagebar { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + -webkit-transition-duration: 0ms; + transition-duration: 0ms; +} +/* === Icons === */ +i.icon { + display: inline-block; + vertical-align: middle; + background-size: 100% auto; + background-position: center; + background-repeat: no-repeat; + font-style: normal; + position: relative; + /* Material Icons http://google.github.io/material-design-icons/ */ +} +i.icon.icon-back { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-forward { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-bars { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M3%2018h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-camera { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20fill%3D'%23333'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%20width%3D'24'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Ccircle%20cx%3D'12'%20cy%3D'12'%20r%3D'3.2'%2F%3E%3Cpath%20d%3D'M9%202L7.17%204H4c-1.1%200-2%20.9-2%202v12c0%201.1.9%202%202%202h16c1.1%200%202-.9%202-2V6c0-1.1-.9-2-2-2h-3.17L15%202H9zm3%2015c-2.76%200-5-2.24-5-5s2.24-5%205-5%205%202.24%205%205-2.24%205-5%205z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-f7 { + width: 24px; + height: 24px; + background-image: url("../img/i-f7-material.png"); + border-radius: 3px; +} +i.icon.icon-form-name { + width: 24px; + height: 24px; + background-image: url("../img/i-form-name-material.svg"); +} +i.icon.icon-form-password { + width: 24px; + height: 24px; + background-image: url("../img/i-form-password-material.svg"); +} +i.icon.icon-form-email { + width: 24px; + height: 24px; + background-image: url("../img/i-form-email-material.svg"); +} +i.icon.icon-form-calendar { + width: 24px; + height: 24px; + background-image: url("../img/i-form-calendar-material.svg"); +} +i.icon.icon-form-tel { + width: 24px; + height: 24px; + background-image: url("../img/i-form-tel-material.svg"); +} +i.icon.icon-form-gender { + width: 24px; + height: 24px; + background-image: url("../img/i-form-gender-material.svg"); +} +i.icon.icon-form-toggle { + width: 24px; + height: 24px; + background-image: url("../img/i-form-toggle-material.svg"); +} +i.icon.icon-form-comment { + width: 24px; + height: 24px; + background-image: url("../img/i-form-comment-material.svg"); +} +i.icon.icon-form-settings { + width: 24px; + height: 24px; + background-image: url("../img/i-form-settings-material.svg"); +} +i.icon.icon-form-url { + width: 24px; + height: 24px; + background-image: url("../img/i-form-url-material.svg"); +} +i.icon.icon-next, +i.icon.icon-prev { + width: 24px; + height: 24px; +} +i.icon.icon-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-plus { + width: 24px; + height: 24px; + font-size: 0; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20fill%3D'%23FFFFFF'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%20width%3D'24'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M19%2013h-6v6h-2v-6H5v-2h6V5h2v6h6v2z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-close { + width: 24px; + height: 24px; + font-size: 0; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20fill%3D'%23FFFFFF'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%20width%3D'24'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M19%206.41L17.59%205%2012%2010.59%206.41%205%205%206.41%2010.59%2012%205%2017.59%206.41%2019%2012%2013.41%2017.59%2019%2019%2017.59%2013.41%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +.badge { + font-size: 10px; + display: inline-block; + color: #fff; + background: #8e8e93; + border-radius: 3px; + padding: 1px 6px; + box-sizing: border-box; + vertical-align: middle; +} +.icon .badge { + position: absolute; + left: 100%; + margin-left: -10px; + top: -2px; + font-size: 10px; + line-height: 1.4; + padding: 1px 5px; +} +/* === Chips === */ +.chip { + font-size: 13px; + font-weight: normal; + color: rgba(0, 0, 0, 0.87); + background: rgba(0, 0, 0, 0.12); + display: inline-block; + height: 32px; + line-height: 32px; + border-radius: 16px; + padding: 0 12px; + box-sizing: border-box; + vertical-align: middle; + display: -webkit-inline-box; + display: -ms-inline-flexbox; + display: -webkit-inline-flex; + display: inline-flex; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + margin: 2px 0; +} +.chip .chip-media { + width: 32px; + height: 32px; + margin-left: -12px; + vertical-align: top; + border-radius: 50%; + text-align: center; + line-height: 32px; + color: #fff; + -webkit-box-flex: 0; + -webkit-flex-shrink: 0; + -ms-flex: 0 0 auto; + flex-shrink: 0; + font-size: 16px; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + -webkit-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; +} +.chip .chip-media img { + max-width: 100%; + max-height: 100%; + width: auto; + height: auto; + border-radius: 50%; + display: block; +} +.chip .chip-media + .chip-label { + margin-left: 8px; +} +.chip .chip-label { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + position: relative; + -webkit-box-flex: 1; + -webkit-flex-shrink: 1; + -ms-flex: 0 1 auto; + flex-shrink: 1; + min-width: 0; +} +.chip .chip-label + .chip-delete { + margin-left: 4px; +} +.chip .chip-delete { + margin-right: -8px; + width: 24px; + height: 24px; + text-align: center; + line-height: 24px; + cursor: pointer; + -webkit-box-flex: 0; + -webkit-flex-shrink: 0; + -ms-flex: 0 0 auto; + flex-shrink: 0; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20fill%3D'%23000'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%20width%3D'24'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M12%202C6.47%202%202%206.47%202%2012s4.47%2010%2010%2010%2010-4.47%2010-10S17.53%202%2012%202zm5%2013.59L15.59%2017%2012%2013.41%208.41%2017%207%2015.59%2010.59%2012%207%208.41%208.41%207%2012%2010.59%2015.59%207%2017%208.41%2013.41%2012%2017%2015.59z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); + background-repeat: no-repeat; + background-position: center; + background-size: 20px 20px; + opacity: 0.54; +} +html:not(.watch-active-state) .chip .chip-delete:active, +.chip .chip-delete.active-state { + opacity: 1; +} +/* === Content Block === */ +.content-block { + margin: 32px 0; + padding: 0 16px; + box-sizing: border-box; +} +.content-block-title { + position: relative; + overflow: hidden; + margin: 0; + white-space: nowrap; + text-overflow: ellipsis; + font-size: 14px; + line-height: 1; + margin: 16px 16px 16px; + padding-top: 16px; + line-height: 16px; + font-weight: 500; + color: rgba(0, 0, 0, 0.54); +} +.content-block-title + .list-block, +.content-block-title + .content-block, +.content-block-title + .card { + margin-top: 0px; +} +.content-block-inner { + padding: 16px 16px; + margin-left: -16px; + width: 100%; + position: relative; +} +.content-block-inner:before { + content: ''; + position: absolute; + left: 0; + top: 0; + bottom: auto; + right: auto; + height: 1px; + width: 100%; + background-color: rgba(0, 0, 0, 0.12); + display: block; + z-index: 15; + -webkit-transform-origin: 50% 0%; + transform-origin: 50% 0%; +} +html.pixel-ratio-2 .content-block-inner:before { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .content-block-inner:before { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.content-block-inner:after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + right: auto; + top: auto; + height: 1px; + width: 100%; + background-color: rgba(0, 0, 0, 0.12); + display: block; + z-index: 15; + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; +} +html.pixel-ratio-2 .content-block-inner:after { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .content-block-inner:after { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.content-block-inner > p:first-child { + margin-top: 0; +} +.content-block-inner > p:last-child { + margin-bottom: 0; +} +.content-block.inset { + margin-left: 16px; + margin-right: 16px; + border-radius: 7px; +} +.content-block.inset .content-block-inner { + border-radius: 4px; +} +.content-block.inset .content-block-inner:before { + display: none; +} +.content-block.inset .content-block-inner:after { + display: none; +} +@media all and (min-width: 768px) { + .content-block.tablet-inset { + margin-left: 16px; + margin-right: 16px; + border-radius: 4px; + } + .content-block.tablet-inset .content-block-inner { + border-radius: 4px; + } + .content-block.tablet-inset .content-block-inner:before { + display: none; + } + .content-block.tablet-inset .content-block-inner:after { + display: none; + } +} +/* === Lists === */ +.list-block { + margin: 32px 0; + font-size: 16px; +} +.list-block ul { + list-style: none; + padding: 0; + margin: 0; + position: relative; +} +.list-block ul:before { + content: ''; + position: absolute; + left: 0; + top: 0; + bottom: auto; + right: auto; + height: 1px; + width: 100%; + background-color: rgba(0, 0, 0, 0.12); + display: block; + z-index: 15; + -webkit-transform-origin: 50% 0%; + transform-origin: 50% 0%; +} +html.pixel-ratio-2 .list-block ul:before { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .list-block ul:before { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.list-block ul:after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + right: auto; + top: auto; + height: 1px; + width: 100%; + background-color: rgba(0, 0, 0, 0.12); + display: block; + z-index: 15; + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; +} +html.pixel-ratio-2 .list-block ul:after { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .list-block ul:after { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.list-block ul ul { + padding-left: 56px; +} +.list-block ul ul:before { + display: none; +} +.list-block ul ul:after { + display: none; +} +.list-block .align-top, +.list-block .align-top .item-content, +.list-block .align-top .item-inner { + -webkit-box-align: start; + -ms-flex-align: start; + -webkit-align-items: flex-start; + align-items: flex-start; +} +.list-block.inset { + margin-left: 16px; + margin-right: 16px; + border-radius: 4px; +} +.list-block.inset .content-block-title { + margin-left: 0; + margin-right: 0; +} +.list-block.inset ul { + border-radius: 4px; +} +.list-block.inset ul:before { + display: none; +} +.list-block.inset ul:after { + display: none; +} +.list-block.inset li:first-child > a { + border-radius: 4px 4px 0 0; +} +.list-block.inset li:last-child > a { + border-radius: 0 0 4px 4px; +} +.list-block.inset li:first-child:last-child > a { + border-radius: 4px; +} +@media all and (min-width: 768px) { + .list-block.tablet-inset { + margin-left: 16px; + margin-right: 16px; + border-radius: 4px; + } + .list-block.tablet-inset .content-block-title { + margin-left: 0; + margin-right: 0; + } + .list-block.tablet-inset ul { + border-radius: 4px; + } + .list-block.tablet-inset ul:before { + display: none; + } + .list-block.tablet-inset ul:after { + display: none; + } + .list-block.tablet-inset li:first-child > a { + border-radius: 4px 4px 0 0; + } + .list-block.tablet-inset li:last-child > a { + border-radius: 0 0 4px 4px; + } + .list-block.tablet-inset li:first-child:last-child > a { + border-radius: 4px; + } + .list-block.tablet-inset .content-block-title { + margin-left: 0; + margin-right: 0; + } + .list-block.tablet-inset ul { + border-radius: 4px; + } + .list-block.tablet-inset ul:before { + display: none; + } + .list-block.tablet-inset ul:after { + display: none; + } + .list-block.tablet-inset li:first-child > a { + border-radius: 4px 4px 0 0; + } + .list-block.tablet-inset li:last-child > a { + border-radius: 0 0 4px 4px; + } + .list-block.tablet-inset li:first-child:last-child > a { + border-radius: 4px; + } +} +.list-block li { + box-sizing: border-box; + position: relative; +} +.list-block .item-media { + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-flex: 0; + -webkit-flex-shrink: 0; + -ms-flex: 0 0 auto; + flex-shrink: 0; + -webkit-box-lines: single; + -moz-box-lines: single; + -webkit-flex-wrap: nowrap; + -ms-flex-wrap: none; + -ms-flex-wrap: nowrap; + flex-wrap: nowrap; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + box-sizing: border-box; + padding-top: 8px; + padding-bottom: 8px; + min-width: 40px; +} +.list-block .item-media i + i { + margin-left: 8px; +} +.list-block .item-media i + img { + margin-left: 8px; +} +.list-block .item-media + .item-inner { + margin-left: 16px; +} +.list-block .item-inner { + padding-right: 16px; + position: relative; + width: 100%; + padding-top: 8px; + padding-bottom: 8px; + min-height: 48px; + box-sizing: border-box; + -webkit-box-flex: 1; + -ms-flex: 1; + min-width: 0; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: justify; + -ms-flex-pack: justify; + -webkit-justify-content: space-between; + justify-content: space-between; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + -ms-flex-item-align: stretch; + -webkit-align-self: stretch; + align-self: stretch; +} +.list-block .item-inner:after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + right: auto; + top: auto; + height: 1px; + width: 100%; + background-color: rgba(0, 0, 0, 0.12); + display: block; + z-index: 15; + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; +} +html.pixel-ratio-2 .list-block .item-inner:after { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .list-block .item-inner:after { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.list-block .item-title { + min-width: 0; + -webkit-box-flex: 1; + -webkit-flex-shrink: 1; + -ms-flex: 0 1 auto; + flex-shrink: 1; + white-space: nowrap; + position: relative; + overflow: hidden; + text-overflow: ellipsis; + max-width: 100%; +} +.list-block .item-after { + white-space: nowrap; + color: #757575; + -webkit-box-flex: 0; + -webkit-flex-shrink: 0; + -ms-flex: 0 0 auto; + flex-shrink: 0; + margin-left: 8px; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + max-height: 28px; + font-size: 14px; +} +.list-block .smart-select .item-after, +.list-block .autocomplete-opener .item-after { + max-width: 70%; + overflow: hidden; + text-overflow: ellipsis; + position: relative; + display: block; +} +.list-block .item-link { + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + display: block; + color: inherit; + position: relative; + overflow: hidden; + z-index: 0; +} +.list-block .item-link .item-inner { + padding-right: 42px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%2060%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'm60%2061.5-38.25%2038.25-9.75-9.75%2029.25-28.5-29.25-28.5%209.75-9.75z'%20fill%3D'%23c7c7cc'%2F%3E%3C%2Fsvg%3E"); + background-size: 10px 20px; + background-repeat: no-repeat; + background-position: 95% center; + background-position: -webkit-calc(100% - 16px) center; + background-position: calc(100% - 16px) center; +} +html:not(.watch-active-state) .list-block .item-link:active, +.list-block .item-link.active-state { + background-color: rgba(0, 0, 0, 0.1); +} +.list-block .item-link.list-button { + padding: 0 16px; + font-size: 16px; + display: block; + line-height: 48px; +} +.list-block .item-content { + box-sizing: border-box; + padding-left: 16px; + min-height: 48px; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: justify; + -ms-flex-pack: justify; + -webkit-justify-content: space-between; + justify-content: space-between; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; +} +.list-block .list-block-label { + margin: 10px 0 35px; + padding: 0 16px; + font-size: 14px; + color: rgba(0, 0, 0, 0.54); +} +.list-block .swipeout { + overflow: hidden; + -webkit-transform-style: preserve-3d; + transform-style: preserve-3d; +} +.list-block .swipeout.deleting { + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +.list-block .swipeout.deleting .swipeout-content { + -webkit-transform: translateX(-100%); + transform: translateX(-100%); +} +.list-block .swipeout.transitioning .swipeout-content, +.list-block .swipeout.transitioning .swipeout-actions-right a, +.list-block .swipeout.transitioning .swipeout-actions-left a, +.list-block .swipeout.transitioning .swipeout-overswipe { + -webkit-transition: 300ms; + transition: 300ms; +} +.list-block .swipeout-content { + position: relative; + z-index: 10; +} +.list-block .swipeout-overswipe { + -webkit-transition: 200ms left; + transition: 200ms left; +} +.list-block .swipeout-actions-left, +.list-block .swipeout-actions-right { + position: absolute; + top: 0; + height: 100%; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; +} +.list-block .swipeout-actions-left a, +.list-block .swipeout-actions-right a { + padding: 0 24px; + color: #fff; + background: #c7c7cc; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + position: relative; + left: 0; +} +.list-block .swipeout-actions-left a:after, +.list-block .swipeout-actions-right a:after { + content: ''; + position: absolute; + top: 0; + width: 600%; + height: 100%; + background: inherit; + z-index: -1; +} +.list-block .swipeout-actions-left a.swipeout-delete, +.list-block .swipeout-actions-right a.swipeout-delete { + background: #f44336; +} +.list-block .swipeout-actions-right { + right: 0%; + -webkit-transform: translateX(100%); + transform: translateX(100%); +} +.list-block .swipeout-actions-right a:after { + left: 100%; + margin-left: -1px; +} +.list-block .swipeout-actions-left { + left: 0%; + -webkit-transform: translateX(-100%); + transform: translateX(-100%); +} +.list-block .swipeout-actions-left a:after { + right: 100%; + margin-right: -1px; +} +.list-block .item-subtitle { + font-size: 14px; + position: relative; + overflow: hidden; + white-space: nowrap; + max-width: 100%; + text-overflow: ellipsis; +} +.list-block .item-text { + font-size: 14px; + color: #757575; + line-height: 20px; + position: relative; + overflow: hidden; + max-height: 40px; + text-overflow: ellipsis; + -webkit-line-clamp: 2; + -webkit-box-orient: vertical; + display: -webkit-box; +} +.list-block.media-list .item-inner, +.list-block li.media-item .item-inner { + display: block; + padding-top: 14px; + padding-bottom: 14px; + -ms-flex-item-align: stretch; + -webkit-align-self: stretch; + align-self: stretch; +} +.list-block.media-list .item-link .item-inner, +.list-block li.media-item .item-link .item-inner { + background: none; + padding-right: 16px; +} +.list-block.media-list .item-link .item-title-row, +.list-block li.media-item .item-link .item-title-row { + padding-right: 26px; + background: no-repeat right top; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%2060%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'm60%2061.5-38.25%2038.25-9.75-9.75%2029.25-28.5-29.25-28.5%209.75-9.75z'%20fill%3D'%23c7c7cc'%2F%3E%3C%2Fsvg%3E"); + background-size: 10px 20px; +} +.list-block.media-list .item-media, +.list-block li.media-item .item-media { + padding-top: 14px; + padding-bottom: 14px; + -ms-flex-item-align: flex-start; + -webkit-align-self: flex-start; + align-self: flex-start; +} +.list-block.media-list .item-media img, +.list-block li.media-item .item-media img { + display: block; +} +.list-block.media-list .item-title-row, +.list-block li.media-item .item-title-row { + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: justify; + -ms-flex-pack: justify; + -webkit-justify-content: space-between; + justify-content: space-between; +} +.list-block.media-list .item-content > .item-after, +.list-block li.media-item .item-content > .item-after { + padding-top: 14px; + padding-bottom: 14px; + -ms-flex-item-align: flex-start; + -webkit-align-self: flex-start; + align-self: flex-start; +} +.list-block .list-group ul:after, +.list-block .list-group ul:before { + z-index: 11; +} +.list-block .list-group + .list-group ul:before { + display: none; +} +.list-block .item-divider, +.list-block .list-group-title { + background: #f4f4f4; + padding: 0px 16px; + white-space: nowrap; + position: relative; + max-width: 100%; + text-overflow: ellipsis; + overflow: hidden; + color: rgba(0, 0, 0, 0.54); + height: 48px; + box-sizing: border-box; + line-height: 48px; + font-size: 14px; +} +.list-block .item-divider:before, +.list-block .list-group-title:before { + display: none; +} +.list-block .list-group-title { + position: relative; + position: -webkit-sticky; + position: -moz-sticky; + position: sticky; + top: 0px; + z-index: 10; + margin-top: 0; +} +.list-block .sortable-handler { + position: absolute; + right: 0; + top: 0; + bottom: 1px; + z-index: 10; + background-repeat: no-repeat; + background-size: 18px 12px; + background-position: center; + width: 50px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2018%2012'%20fill%3D'%23c7c7cc'%3E%3Cpath%20d%3D'M0%2C2V0h22v2H0z'%2F%3E%3Cpath%20d%3D'M0%2C7V5h22v2H0z'%2F%3E%3Cpath%20d%3D'M0%2C12v-2h22v2H0z'%2F%3E%3C%2Fsvg%3E"); + opacity: 0; + visibility: hidden; + cursor: pointer; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +.list-block.sortable .item-inner { + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +.list-block.sortable-opened .sortable-handler { + visibility: visible; + opacity: 1; +} +.list-block.sortable-opened .item-inner, +.list-block.sortable-opened .item-link .item-inner { + padding-right: 50px; +} +.list-block.sortable-opened .item-link .item-inner, +.list-block.sortable-opened .item-link .item-title-row { + background-image: none; +} +.list-block.sortable-sorting li { + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +.list-block li.sorting { + z-index: 50; + background: rgba(255, 255, 255, 0.8); + box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23); + -webkit-transition-duration: 0ms; + transition-duration: 0ms; +} +.list-block li.sorting .item-inner:after { + display: none; +} +.list-block li:last-child .list-button:after { + display: none; +} +.list-block li:last-child .item-inner:after, +.list-block li:last-child li:last-child .item-inner:after { + display: none; +} +.list-block li li:last-child .item-inner:after, +.list-block li:last-child li .item-inner:after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + right: auto; + top: auto; + height: 1px; + width: 100%; + background-color: rgba(0, 0, 0, 0.12); + display: block; + z-index: 15; + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; +} +html.pixel-ratio-2 .list-block li li:last-child .item-inner:after, +html.pixel-ratio-2 .list-block li:last-child li .item-inner:after { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .list-block li li:last-child .item-inner:after, +html.pixel-ratio-3 .list-block li:last-child li .item-inner:after { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +/* === Contacts === */ +.contacts-block { + margin: 0; +} +.contacts-block .list-group-title { + padding: 0 16px; + pointer-events: none; + background: none; + color: #888888; + line-height: 48px; + height: 48px; + font-size: 20px; + font-weight: 500; + overflow: visible; + width: 56px; + top: 0; +} +.contacts-block .list-group-title + li { + margin-top: -48px; +} +.contacts-block .list-group:first-child ul:before { + display: none; +} +.contacts-block .list-group:last-child ul:after { + display: none; +} +.contacts-block li:not(.list-group-title) { + padding-left: 56px; +} +/* === Forms === */ +.list-block input[type="text"], +.list-block input[type="password"], +.list-block input[type="search"], +.list-block input[type="email"], +.list-block input[type="tel"], +.list-block input[type="url"], +.list-block input[type="date"], +.list-block input[type="datetime-local"], +.list-block input[type="time"], +.list-block input[type="number"], +.list-block select, +.list-block textarea { + -webkit-appearance: none; + -moz-appearance: none; + -ms-appearance: none; + appearance: none; + box-sizing: border-box; + border: none; + background: none; + border-radius: 0 0 0 0; + box-shadow: none; + display: block; + padding: 0; + margin: 0; + width: 100%; + height: 36px; + color: #212121; + font-size: 16px; + font-family: inherit; +} +.list-block input[type="text"]::-webkit-input-placeholder, +.list-block input[type="password"]::-webkit-input-placeholder, +.list-block input[type="search"]::-webkit-input-placeholder, +.list-block input[type="email"]::-webkit-input-placeholder, +.list-block input[type="tel"]::-webkit-input-placeholder, +.list-block input[type="url"]::-webkit-input-placeholder, +.list-block input[type="date"]::-webkit-input-placeholder, +.list-block input[type="datetime-local"]::-webkit-input-placeholder, +.list-block input[type="time"]::-webkit-input-placeholder, +.list-block input[type="number"]::-webkit-input-placeholder, +.list-block select::-webkit-input-placeholder, +.list-block textarea::-webkit-input-placeholder { + color: rgba(0, 0, 0, 0.35); +} +.list-block .label, +.list-block .floating-label { + vertical-align: top; + color: rgba(0, 0, 0, 0.65); + -webkit-transition-duration: 200ms; + transition-duration: 200ms; + width: 35%; + -webkit-box-flex: 0; + -webkit-flex-shrink: 0; + -ms-flex: 0 0 auto; + flex-shrink: 0; +} +.list-block input[type="date"], +.list-block input[type="datetime-local"] { + line-height: 44px; +} +.list-block select { + -webkit-appearance: none; + -moz-appearance: none; + -ms-appearance: none; + appearance: none; +} +.list-block textarea { + resize: none; + line-height: 1.4; + padding-top: 8px; + padding-bottom: 7px; + height: 100px; +} +.list-block textarea.resizable { + height: 36px; +} +.list-block .item-input { + width: 100%; + -ms-flex: 1; + -webkit-box-flex: 1; + -webkit-flex-shrink: 1; + -ms-flex: 0 1 auto; + flex-shrink: 1; + font-size: 0; + position: relative; + margin-bottom: 4px; + min-height: 36px; +} +.list-block .input-item ul:after, +.list-block.inputs-list ul:after { + display: none; +} +.list-block .input-item .item-media, +.list-block.inputs-list .item-media { + -ms-flex-item-align: flex-end; + -webkit-align-self: flex-end; + align-self: flex-end; + min-height: 36px; + margin-bottom: 8px; + padding: 0; +} +.list-block .input-item .item-inner, +.list-block.inputs-list .item-inner { + display: block; + margin-bottom: 4px; + padding-bottom: 0; +} +.list-block .input-item .item-inner:after, +.list-block.inputs-list .item-inner:after { + display: none; +} +.list-block .input-item .label, +.list-block.inputs-list .label, +.list-block .input-item .floating-label, +.list-block.inputs-list .floating-label { + width: 100%; + font-size: 12px; +} +.list-block .input-item .floating-label, +.list-block.inputs-list .floating-label { + -webkit-transform-origin: left; + transform-origin: left; + -webkit-transform: scale(1.33333333) translateY(21px); + transform: scale(1.33333333) translateY(21px); + color: rgba(0, 0, 0, 0.35); + width: auto; + max-width: 75%; +} +.list-block .input-item .floating-label ~ .item-input input::-webkit-input-placeholder, +.list-block.inputs-list .floating-label ~ .item-input input::-webkit-input-placeholder { + color: transparent; +} +.list-block .focus-state .floating-label, +.list-block .not-empty-state .floating-label { + color: rgba(0, 0, 0, 0.65); + -webkit-transform: scale(1) translateY(0); + transform: scale(1) translateY(0); +} +.list-block .focus-state .label, +.list-block .focus-state .floating-label { + color: #2196f3; +} +.item-input-field, +.input-field { + position: relative; +} +.item-input-field:after, +.input-field:after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + right: auto; + top: auto; + height: 1px; + width: 100%; + background-color: rgba(0, 0, 0, 0.12); + display: block; + z-index: 15; + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; +} +html.pixel-ratio-2 .item-input-field:after, +html.pixel-ratio-2 .input-field:after { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .item-input-field:after, +html.pixel-ratio-3 .input-field:after { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.item-input-field:after, +.input-field:after { + -webkit-transition-duration: 200ms; + transition-duration: 200ms; +} +.item-input-field.focus-state:after, +.input-field.focus-state:after, +.item-input-field.not-empty-state:after, +.input-field.not-empty-state:after, +.focus-state .item-input-field:after, +.focus-state .input-field:after, +.not-empty-state .item-input-field:after, +.not-empty-state .input-field:after { + background: #2196f3; + -webkit-transform: scaleY(2) !important; + transform: scaleY(2) !important; +} +textarea.resizable { + overflow: hidden; +} +.label-switch { + display: inline-block; + vertical-align: middle; + width: 36px; + height: 14px; + position: relative; + cursor: pointer; + -ms-flex-item-align: center; + -webkit-align-self: center; + align-self: center; +} +.label-switch .checkbox { + width: 36px; + border-radius: 36px; + box-sizing: border-box; + height: 14px; + background: #b0afaf; + z-index: 0; + margin: 0; + padding: 0; + -webkit-appearance: none; + -moz-appearance: none; + -ms-appearance: none; + appearance: none; + border: none; + cursor: pointer; + position: relative; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +.label-switch .checkbox:after { + content: ' '; + height: 20px; + width: 20px; + border-radius: 20px; + background: #fff; + position: absolute; + z-index: 2; + top: -3px; + left: 0px; + box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4); + -webkit-transform: translateX(0px); + transform: translateX(0px); + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +.label-switch input[type="checkbox"] { + display: none; +} +.label-switch input[type="checkbox"]:checked + .checkbox { + background: rgba(33, 150, 243, 0.5); +} +.label-switch input[type="checkbox"]:checked + .checkbox:after { + -webkit-transform: translateX(16px); + transform: translateX(16px); + background: #2196f3; +} +.item-input .label-switch { + top: 11px; +} +.button { + color: #2196f3; + text-decoration: none; + text-align: center; + display: block; + border-radius: 2px; + line-height: 36px; + box-sizing: border-box; + -webkit-appearance: none; + -moz-appearance: none; + -ms-appearance: none; + appearance: none; + background: none; + padding: 0 10px; + margin: 0; + height: 36px; + white-space: nowrap; + text-overflow: ellipsis; + font-size: 14px; + text-transform: uppercase; + font-family: inherit; + cursor: pointer; + min-width: 64px; + padding: 0 8px; + position: relative; + overflow: hidden; + outline: 0; + border: none; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +input[type="submit"].button, +input[type="button"].button { + width: 100%; +} +html:not(.watch-active-state) .button:active, +.button.active-state { + background: rgba(0, 0, 0, 0.1); +} +.button.button-fill { + background-color: #2196f3; + color: #fff; +} +html:not(.watch-active-state) .button.button-fill:active, +.button.button-fill.active-state { + background: #0c82df; +} +.button.button-big { + height: 48px; + line-height: 48px; + border-radius: 3px; +} +.button i.icon + span, +.button span:not(.ripple-wave) + span, +.button span:not(.ripple-wave) + i.icon, +.button i.icon + i.icon { + margin-left: 8px; +} +.navbar .button:not(.button-fill), +.toolbar .button:not(.button-fill), +.subnavbar .button:not(.button-fill), +.notifications .button:not(.button-fill) { + color: #fff; +} +html:not(.watch-active-state) .navbar .button:not(.button-fill):active, +html:not(.watch-active-state) .toolbar .button:not(.button-fill):active, +html:not(.watch-active-state) .subnavbar .button:not(.button-fill):active, +html:not(.watch-active-state) .notifications .button:not(.button-fill):active, +.navbar .button:not(.button-fill).active-state, +.toolbar .button:not(.button-fill).active-state, +.subnavbar .button:not(.button-fill).active-state, +.notifications .button:not(.button-fill).active-state { + background: rgba(255, 255, 255, 0.15); +} +.button-raised { + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); +} +html:not(.watch-active-state) .button-raised:active, +.button-raised.active-state { + box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23); +} +.buttons-row { + -ms-flex-item-align: center; + -webkit-align-self: center; + align-self: center; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-lines: single; + -moz-box-lines: single; + -webkit-flex-wrap: nowrap; + -ms-flex-wrap: none; + -ms-flex-wrap: nowrap; + flex-wrap: nowrap; +} +.buttons-row .button { + margin-left: 16px; + width: 100%; + -webkit-box-flex: 1; + -ms-flex: 1; +} +.buttons-row .button:first-child { + margin-left: 0; +} +.range-slider { + width: 100%; + position: relative; + overflow: hidden; + -ms-flex-item-align: center; + -webkit-align-self: center; + align-self: center; +} +.range-slider input[type="range"] { + position: relative; + height: 20px; + width: 100%; + margin: 0; + -webkit-appearance: none; + -moz-appearance: none; + -ms-appearance: none; + appearance: none; + background: -webkit-gradient(linear, 50% 0, 50% 100%, color-stop(0, #b9b9b9), color-stop(100%, #b9b9b9)); + background: linear-gradient(to right, #b9b9b9 0, #b9b9b9 100%); + background-position: center; + background-size: 100% 2px; + background-repeat: no-repeat; + outline: 0; + -ms-background-position-y: 500px; +} +.range-slider input[type="range"]:focus, +.range-slider input[type="range"]:active { + border: 0; + outline: 0 none; +} +.range-slider input[type="range"]::-webkit-slider-thumb { + -webkit-appearance: none; + -moz-appearance: none; + -ms-appearance: none; + appearance: none; + border: none; + outline: 0; + height: 20px; + width: 20px; + position: relative; + background: #2196f3; + border-radius: 20px; +} +.range-slider input[type="range"]::-webkit-slider-thumb:before { + position: absolute; + top: 50%; + right: 100%; + width: 2000px; + height: 2px; + margin-top: -1px; + z-index: 1; + background: #2196f3; + content: ' '; +} +.range-slider input[type="range"]::-moz-range-track { + width: 100%; + height: 2px; + background: #b7b8b7; + border: none; + outline: 0; +} +.range-slider input[type="range"]::-moz-range-thumb { + -webkit-appearance: none; + -moz-appearance: none; + -ms-appearance: none; + appearance: none; + border: none; + outline: 0; + height: 20px; + width: 20px; + position: relative; + background: #2196f3; + border-radius: 20px; +} +.range-slider input[type="range"]::-ms-track { + width: 100%; + height: 2px; + cursor: pointer; + background: transparent; + border-color: transparent; + color: transparent; +} +.range-slider input[type="range"]::-ms-thumb { + -webkit-appearance: none; + -moz-appearance: none; + -ms-appearance: none; + appearance: none; + border: none; + outline: 0; + height: 20px; + width: 20px; + position: relative; + background: #2196f3; + border-radius: 20px; +} +.range-slider input[type="range"]::-ms-fill-lower { + background: #2196f3; +} +.range-slider input[type="range"]::-ms-fill-upper { + background: #b7b8b7; +} +.item-input .range-slider { + top: 8px; +} +label.label-checkbox { + cursor: pointer; +} +label.label-checkbox i.icon-form-checkbox { + width: 18px; + height: 18px; + position: relative; + border-radius: 2px; + border: 2px solid #6d6d6d; + box-sizing: border-box; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + background: transparent; +} +label.label-checkbox i.icon-form-checkbox:after { + content: ' '; + position: absolute; + width: 18px; + height: 18px; + left: -2px; + top: -2px; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + opacity: 0; + background: no-repeat center; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M9%2016.17L4.83%2012l-1.42%201.41L9%2019%2021%207l-1.41-1.41z'%2F%3E%3C%2Fsvg%3E"); + -webkit-background-size: 100% auto; + background-size: 100% auto; +} +label.label-checkbox input[type="checkbox"], +label.label-checkbox input[type="radio"] { + display: none; +} +label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox, +label.label-checkbox input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox input[type="radio"]:checked ~ .item-after i.icon-form-checkbox, +label.label-checkbox input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox, +label.label-checkbox input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox { + border-color: #2196f3; + background-color: #2196f3; +} +label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox:after, +label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox:after, +label.label-checkbox input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox:after, +label.label-checkbox input[type="radio"]:checked ~ .item-after i.icon-form-checkbox:after, +label.label-checkbox input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox:after, +label.label-checkbox input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox:after { + opacity: 1; +} +label.label-radio { + cursor: pointer; +} +label.label-radio i.icon-form-radio { + width: 20px; + height: 20px; + position: relative; + border-radius: 20px; + border: 2px solid #6d6d6d; + box-sizing: border-box; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +label.label-radio i.icon-form-radio:after { + content: ' '; + position: absolute; + width: 10px; + height: 10px; + left: 50%; + top: 50%; + margin-left: -5px; + margin-top: -5px; + background-color: #2196f3; + border-radius: 100%; + -webkit-transform: scale(0); + transform: scale(0); + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +label.label-radio input[type="checkbox"], +label.label-radio input[type="radio"] { + display: none; +} +label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio, +label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio, +label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio, +label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio, +label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio, +label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio { + border-color: #2196f3; +} +label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio:after, +label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio:after, +label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio:after, +label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after, +label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after { + background-color: #2196f3; + -webkit-transform: scale(1); + transform: scale(1); +} +label.label-checkbox, +label.label-radio { + position: relative; + overflow: hidden; + z-index: 0; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +label.label-checkbox .item-after i.icon-form-checkbox, +label.label-radio .item-after i.icon-form-checkbox, +label.label-checkbox .item-after i.icon-form-radio, +label.label-radio .item-after i.icon-form-radio { + margin-left: 8px; + margin-right: 16px; +} +.media-list label.label-checkbox .item-media i.icon-form-checkbox, +.media-list label.label-radio .item-media i.icon-form-checkbox, +.media-item label.label-checkbox .item-media i.icon-form-checkbox, +.media-item label.label-radio .item-media i.icon-form-checkbox, +.media-list label.label-checkbox .item-media i.icon-form-radio, +.media-list label.label-radio .item-media i.icon-form-radio, +.media-item label.label-checkbox .item-media i.icon-form-radio, +.media-item label.label-radio .item-media i.icon-form-radio { + margin-top: 4px; +} +html:not(.watch-active-state) label.label-checkbox:active, +html:not(.watch-active-state) label.label-radio:active, +label.label-checkbox.active-state, +label.label-radio.active-state { + background-color: rgba(0, 0, 0, 0.1); +} +html:not(.watch-active-state) label.label-checkbox:active .item-inner:after, +html:not(.watch-active-state) label.label-radio:active .item-inner:after, +label.label-checkbox.active-state .item-inner:after, +label.label-radio.active-state .item-inner:after { + background-color: transparent; +} +.smart-select select { + display: none; +} +/* === Floating Action Button === */ +.floating-button { + position: absolute; + right: 16px; + bottom: 16px; + width: 56px; + height: 56px; + border-radius: 50%; + z-index: 1500; + box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); + background-color: #2196f3; + color: #fff; + overflow: hidden; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + -webkit-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; +} +html:not(.watch-active-state) .floating-button:active, +.floating-button.active-state { + background: #0c82df; +} +.floating-button-toolbar, +.speed-dial { + position: absolute; + right: 16px; + bottom: 16px; + z-index: 1500; +} +.floating-button-toolbar .floating-button, +.speed-dial .floating-button { + right: 0; + bottom: 0; + position: relative; +} +.speed-dial .floating-button i { + position: absolute; + left: 50%; + top: 50%; + -webkit-transform: translate3d(-50%, -50%, 0) rotate(0deg) scale(1); + transform: translate3d(-50%, -50%, 0) rotate(0deg) scale(1); + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +.speed-dial .floating-button i + i { + -webkit-transform: translate3d(-50%, -50%, 0) rotate(-90deg) scale(0.5); + transform: translate3d(-50%, -50%, 0) rotate(-90deg) scale(0.5); + opacity: 0; +} +.speed-dial.speed-dial-opened .floating-button i { + -webkit-transform: translate3d(-50%, -50%, 0) rotate(90deg) scale(0.5); + transform: translate3d(-50%, -50%, 0) rotate(90deg) scale(0.5); + opacity: 0; +} +.speed-dial.speed-dial-opened .floating-button i + i { + -webkit-transform: translate3d(-50%, -50%, 0) rotate(0deg) scale(1); + transform: translate3d(-50%, -50%, 0) rotate(0deg) scale(1); + opacity: 1; +} +.speed-dial-buttons { + position: absolute; + width: 40px; + left: 50%; + margin-left: -20px; + bottom: 100%; + margin-bottom: 16px; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-orient: vertical; + -webkit-box-direction: reverse; + -moz-box-orient: vertical; + -moz-box-direction: reverse; + -ms-flex-direction: column-reverse; + -webkit-flex-direction: column-reverse; + flex-direction: column-reverse; + visibility: hidden; + pointer-events: none; +} +.speed-dial-buttons a { + width: 40px; + height: 40px; + opacity: 0; + color: #fff; + border-radius: 50%; + position: relative; + z-index: 1; + overflow: hidden; + background-color: #2196f3; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + -webkit-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; + -webkit-transform: translate3d(0, 8px, 0) scale(0.3); + transform: translate3d(0, 8px, 0) scale(0.3); + -webkit-transform-origin: center bottom; + transform-origin: center bottom; +} +html:not(.watch-active-state) .speed-dial-buttons a:active, +.speed-dial-buttons a.active-state { + background: #0c82df; +} +.speed-dial-buttons a + a { + margin-bottom: 16px; +} +.speed-dial-opened .speed-dial-buttons { + visibility: visible; + pointer-events: auto; +} +.speed-dial-opened .speed-dial-buttons a { + opacity: 1; + -webkit-transform: translate3d(0, 0, 0) scaleY(1); + transform: translate3d(0, 0, 0) scaleY(1); + box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); +} +.speed-dial-opened .speed-dial-buttons a:nth-child(2) { + -webkit-transition-delay: 50ms; + transition-delay: 50ms; +} +.speed-dial-opened .speed-dial-buttons a:nth-child(3) { + -webkit-transition-delay: 100ms; + transition-delay: 100ms; +} +.speed-dial-opened .speed-dial-buttons a:nth-child(4) { + -webkit-transition-delay: 150ms; + transition-delay: 150ms; +} +.speed-dial-opened .speed-dial-buttons a:nth-child(5) { + -webkit-transition-delay: 200ms; + transition-delay: 200ms; +} +.speed-dial-opened .speed-dial-buttons a:nth-child(6) { + -webkit-transition-delay: 250ms; + transition-delay: 250ms; +} +.floating-button-to-popover.floating-button-to-popover { + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +.floating-button-to-popover.floating-button-to-popover-in { + -webkit-transition-duration: 100ms; + transition-duration: 100ms; +} +.floating-button-to-popover.floating-button-to-popover-in i { + opacity: 0; + -webkit-transition-duration: 100ms; + transition-duration: 100ms; +} +.floating-button-to-popover.floating-button-to-popover-scale { + border-radius: 0; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + box-shadow: none; +} +.floating-button-to-popover.floating-button-to-popover-out { + -webkit-transition-delay: 0ms; + transition-delay: 0ms; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +.floating-button-to-popover.floating-button-to-popover-out i { + opacity: 1; + -webkit-transition-duration: 100ms; + transition-duration: 100ms; + -webkit-transition-delay: 200ms; + transition-delay: 200ms; +} +/* === Accordion === */ +.list-block .accordion-item-toggle { + cursor: pointer; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +.list-block .accordion-item-toggle .item-inner { + padding-right: 42px; + background: no-repeat -webkit-calc(100% - 15px) center; + background: no-repeat calc(100% - 15px) center; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%2060%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'm60%2061.5-38.25%2038.25-9.75-9.75%2029.25-28.5-29.25-28.5%209.75-9.75z'%20fill%3D'%23c7c7cc'%2F%3E%3C%2Fsvg%3E"); + background-size: 10px 20px; +} +html:not(.watch-active-state) .list-block .accordion-item-toggle:active, +.list-block .accordion-item-toggle.active-state { + -webkit-transition-duration: 0ms; + transition-duration: 0ms; + background-color: #d9d9d9; +} +html:not(.watch-active-state) .list-block .accordion-item-toggle:active > .item-inner:after, +.list-block .accordion-item-toggle.active-state > .item-inner:after { + background-color: transparent; +} +.list-block .accordion-item-toggle .item-inner, +.list-block .accordion-item > .item-link .item-inner { + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + -webkit-transition-property: background-color; + transition-property: background-color; +} +.list-block .accordion-item-toggle .item-inner:after, +.list-block .accordion-item > .item-link .item-inner:after { + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +.list-block:not(.media-list) .accordion-item-expanded:not(.media-item) .accordion-item-toggle .item-inner, +.list-block:not(.media-list) .accordion-item-expanded:not(.media-item) > .item-link .item-inner, +.list-block.media-list .accordion-item-expanded .accordion-item-toggle .item-title-row, +.list-block.media-list .accordion-item-expanded > .item-link .item-title-row, +.list-block .accordion-item-expanded.media-item .accordion-item-toggle .item-title-row, +.list-block .accordion-item-expanded.media-item > .item-link .item-title-row { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%2060%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'm60%2061.5-38.25%2038.25-9.75-9.75%2029.25-28.5-29.25-28.5%209.75-9.75z'%20transform%3D'translate(115%2C%2030)%20rotate(90)'%20fill%3D'%23c7c7cc'%2F%3E%3C%2Fsvg%3E"); + background-size: 20px 20px; +} +.list-block .accordion-item-expanded .accordion-item-toggle .item-inner:after, +.list-block .accordion-item-expanded > .item-link .item-inner:after { + background-color: transparent; +} +.list-block .accordion-item .content-block, +.list-block .accordion-item .list-block { + margin-top: 0; + margin-bottom: 0; +} +.list-block .accordion-item ul { + padding-left: 0; +} +.accordion-item-content { + position: relative; + overflow: hidden; + height: 0; + font-size: 14px; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +.accordion-item-expanded > .accordion-item-content { + height: auto; +} +html.android-4 .accordion-item-content { + -webkit-transform: none; + transform: none; +} +/* === Cards === */ +.cards-list ul, +.card .list-block ul { + background: none; +} +.cards-list > ul:before, +.card .list-block > ul:before { + display: none; +} +.cards-list > ul:after, +.card .list-block > ul:after { + display: none; +} +.card { + background: #fff; + margin: 8px; + position: relative; + border-radius: 2px; + font-size: 14px; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); +} +.card .list-block, +.card .content-block { + margin: 0; +} +.row:not(.no-gutter) .col > .card { + margin-left: 0; + margin-right: 0; +} +.page-content > .card:last-child { + margin-bottom: 32px; +} +.card-content { + position: relative; +} +.card-content-inner { + padding: 16px; + position: relative; +} +.card-content-inner > p:first-child { + margin-top: 0; +} +.card-content-inner > p:last-child { + margin-bottom: 0; +} +.card-content-inner > .list-block, +.card-content-inner > .content-block { + margin: -15px; +} +.card-header, +.card-footer { + min-height: 48px; + position: relative; + padding: 4px 16px; + box-sizing: border-box; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: justify; + -ms-flex-pack: justify; + -webkit-justify-content: space-between; + justify-content: space-between; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; +} +.card-header[valign="top"], +.card-footer[valign="top"] { + -webkit-box-align: start; + -ms-flex-align: start; + -webkit-align-items: flex-start; + align-items: flex-start; +} +.card-header[valign="bottom"], +.card-footer[valign="bottom"] { + -webkit-box-align: end; + -ms-flex-align: end; + -webkit-align-items: flex-end; + align-items: flex-end; +} +.card-header a.link, +.card-footer a.link { + color: #2196f3; + text-decoration: none; + text-align: center; + display: block; + border-radius: 2px; + line-height: 36px; + box-sizing: border-box; + -webkit-appearance: none; + -moz-appearance: none; + -ms-appearance: none; + appearance: none; + background: none; + padding: 0 10px; + margin: 0; + height: 36px; + white-space: nowrap; + text-overflow: ellipsis; + font-size: 14px; + text-transform: uppercase; + font-family: inherit; + cursor: pointer; + min-width: 64px; + padding: 0 8px; + position: relative; + overflow: hidden; + outline: 0; + border: none; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + -webkit-user-select: none; + user-select: none; +} +input[type="submit"].card-header a.link, +input[type="submit"].card-footer a.link, +input[type="button"].card-header a.link, +input[type="button"].card-footer a.link { + width: 100%; +} +html:not(.watch-active-state) .card-header a.link:active, +html:not(.watch-active-state) .card-footer a.link:active, +.card-header a.link.active-state, +.card-footer a.link.active-state { + background: rgba(0, 0, 0, 0.1); +} +.card-header a.link.button-fill, +.card-footer a.link.button-fill { + background-color: #2196f3; + color: #fff; +} +html:not(.watch-active-state) .card-header a.link.button-fill:active, +html:not(.watch-active-state) .card-footer a.link.button-fill:active, +.card-header a.link.button-fill.active-state, +.card-footer a.link.button-fill.active-state { + background: #0c82df; +} +.card-header a.link.button-big, +.card-footer a.link.button-big { + height: 48px; + line-height: 48px; + border-radius: 3px; +} +.card-header a.link i.icon + span, +.card-footer a.link i.icon + span, +.card-header a.link span:not(.ripple-wave) + span, +.card-footer a.link span:not(.ripple-wave) + span, +.card-header a.link span:not(.ripple-wave) + i.icon, +.card-footer a.link span:not(.ripple-wave) + i.icon, +.card-header a.link i.icon + i.icon, +.card-footer a.link i.icon + i.icon { + margin-left: 8px; +} +.navbar .card-header a.link:not(.button-fill), +.navbar .card-footer a.link:not(.button-fill), +.toolbar .card-header a.link:not(.button-fill), +.toolbar .card-footer a.link:not(.button-fill), +.subnavbar .card-header a.link:not(.button-fill), +.subnavbar .card-footer a.link:not(.button-fill), +.notifications .card-header a.link:not(.button-fill), +.notifications .card-footer a.link:not(.button-fill) { + color: #fff; +} +html:not(.watch-active-state) .navbar .card-header a.link:not(.button-fill):active, +html:not(.watch-active-state) .navbar .card-footer a.link:not(.button-fill):active, +html:not(.watch-active-state) .toolbar .card-header a.link:not(.button-fill):active, +html:not(.watch-active-state) .toolbar .card-footer a.link:not(.button-fill):active, +html:not(.watch-active-state) .subnavbar .card-header a.link:not(.button-fill):active, +html:not(.watch-active-state) .subnavbar .card-footer a.link:not(.button-fill):active, +html:not(.watch-active-state) .notifications .card-header a.link:not(.button-fill):active, +html:not(.watch-active-state) .notifications .card-footer a.link:not(.button-fill):active, +.navbar .card-header a.link:not(.button-fill).active-state, +.navbar .card-footer a.link:not(.button-fill).active-state, +.toolbar .card-header a.link:not(.button-fill).active-state, +.toolbar .card-footer a.link:not(.button-fill).active-state, +.subnavbar .card-header a.link:not(.button-fill).active-state, +.subnavbar .card-footer a.link:not(.button-fill).active-state, +.notifications .card-header a.link:not(.button-fill).active-state, +.notifications .card-footer a.link:not(.button-fill).active-state { + background: rgba(255, 255, 255, 0.15); +} +.card-header a.link i + span, +.card-footer a.link i + span, +.card-header a.link i + i, +.card-footer a.link i + i, +.card-header a.link span + i, +.card-footer a.link span + i, +.card-header a.link span + span, +.card-footer a.link span + span { + margin-left: 7px; +} +.card-header a.link i.icon, +.card-footer a.link i.icon { + display: block; +} +.card-header a.icon-only, +.card-footer a.icon-only { + min-width: 48px; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + margin: 0; +} +.card-header { + border-radius: 2px 2px 0 0; + font-size: 16px; +} +.card-header:after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + right: auto; + top: auto; + height: 1px; + width: 100%; + background-color: #e1e1e1; + display: block; + z-index: 15; + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; +} +html.pixel-ratio-2 .card-header:after { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .card-header:after { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.card-header.no-border:after { + display: none; +} +.card-footer { + border-radius: 0 0 2px 2px; + color: #757575; +} +.card-footer:before { + content: ''; + position: absolute; + left: 0; + top: 0; + bottom: auto; + right: auto; + height: 1px; + width: 100%; + background-color: #e1e1e1; + display: block; + z-index: 15; + -webkit-transform-origin: 50% 0%; + transform-origin: 50% 0%; +} +html.pixel-ratio-2 .card-footer:before { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .card-footer:before { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.card-footer.no-border:before { + display: none; +} +/* === Modals === */ +.modal-overlay, +.preloader-indicator-overlay, +.popup-overlay, +.picker-modal-overlay { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + background: rgba(0, 0, 0, 0.4); + z-index: 13000; + visibility: hidden; + opacity: 0; + -webkit-transition-duration: 400ms; + transition-duration: 400ms; +} +.modal-overlay.modal-overlay-visible, +.preloader-indicator-overlay.modal-overlay-visible, +.popup-overlay.modal-overlay-visible, +.picker-modal-overlay.modal-overlay-visible { + visibility: visible; + opacity: 1; +} +.popup-overlay { + z-index: 10500; +} +.picker-modal-overlay { + z-index: 12000; +} +.modal { + width: 280px; + position: absolute; + z-index: 13500; + left: 50%; + margin-left: -140px; + margin-top: 0; + top: 50%; + border-radius: 3px; + opacity: 0; + -webkit-transform: translate3d(0, 0, 0) scale(1.185); + transform: translate3d(0, 0, 0) scale(1.185); + -webkit-transition-property: -webkit-transform, opacity; + -moz-transition-property: -moz-transform, opacity; + -ms-transition-property: -ms-transform, opacity; + -o-transition-property: -o-transform, opacity; + transition-property: transform, opacity; + color: #757575; + display: none; + background: #fff; + font-size: 16px; + box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.22); +} +.modal.modal-in { + opacity: 1; + -webkit-transition-duration: 400ms; + transition-duration: 400ms; + -webkit-transform: translate3d(0, 0, 0) scale(1); + transform: translate3d(0, 0, 0) scale(1); +} +.modal.modal-out { + opacity: 0; + z-index: 13499; + -webkit-transition-duration: 400ms; + transition-duration: 400ms; + -webkit-transform: translate3d(0, 0, 0) scale(0.815); + transform: translate3d(0, 0, 0) scale(0.815); +} +.modal-inner { + padding: 24px 24px 20px; + position: relative; +} +.modal-title { + font-weight: 500; + font-size: 20px; + color: #212121; + line-height: 1.3; +} +.modal-title + .modal-text { + margin-top: 20px; +} +.modal-text { + line-height: 1.5; +} +.modal-buttons { + height: 48px; + padding: 6px 8px; + overflow: hidden; + box-sizing: border-box; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: end; + -ms-flex-pack: end; + -webkit-justify-content: flex-end; + justify-content: flex-end; +} +.modal-buttons.modal-buttons-vertical { + display: block; + height: auto; + padding: 0 0 8px 0; +} +.modal-buttons.modal-buttons-vertical .modal-button { + margin-left: 0; + text-align: right; + height: 48px; + line-height: 48px; + border-radius: 0; + padding-left: 16px; + padding-right: 16px; +} +.modal-button, +.modal-buttons .button { + color: #2196f3; + text-decoration: none; + text-align: center; + display: block; + border-radius: 2px; + line-height: 36px; + box-sizing: border-box; + -webkit-appearance: none; + -moz-appearance: none; + -ms-appearance: none; + appearance: none; + background: none; + padding: 0 10px; + margin: 0; + height: 36px; + white-space: nowrap; + text-overflow: ellipsis; + font-size: 14px; + text-transform: uppercase; + font-family: inherit; + cursor: pointer; + min-width: 64px; + padding: 0 8px; + position: relative; + overflow: hidden; + outline: 0; + border: none; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + -webkit-user-select: none; + user-select: none; +} +input[type="submit"].modal-button, +input[type="submit"].modal-buttons .button, +input[type="button"].modal-button, +input[type="button"].modal-buttons .button { + width: 100%; +} +html:not(.watch-active-state) .modal-button:active, +html:not(.watch-active-state) .modal-buttons .button:active, +.modal-button.active-state, +.modal-buttons .button.active-state { + background: rgba(0, 0, 0, 0.1); +} +.modal-button.button-fill, +.modal-buttons .button.button-fill { + background-color: #2196f3; + color: #fff; +} +html:not(.watch-active-state) .modal-button.button-fill:active, +html:not(.watch-active-state) .modal-buttons .button.button-fill:active, +.modal-button.button-fill.active-state, +.modal-buttons .button.button-fill.active-state { + background: #0c82df; +} +.modal-button.button-big, +.modal-buttons .button.button-big { + height: 48px; + line-height: 48px; + border-radius: 3px; +} +.modal-button i.icon + span, +.modal-buttons .button i.icon + span, +.modal-button span:not(.ripple-wave) + span, +.modal-buttons .button span:not(.ripple-wave) + span, +.modal-button span:not(.ripple-wave) + i.icon, +.modal-buttons .button span:not(.ripple-wave) + i.icon, +.modal-button i.icon + i.icon, +.modal-buttons .button i.icon + i.icon { + margin-left: 8px; +} +.navbar .modal-button:not(.button-fill), +.navbar .modal-buttons .button:not(.button-fill), +.toolbar .modal-button:not(.button-fill), +.toolbar .modal-buttons .button:not(.button-fill), +.subnavbar .modal-button:not(.button-fill), +.subnavbar .modal-buttons .button:not(.button-fill), +.notifications .modal-button:not(.button-fill), +.notifications .modal-buttons .button:not(.button-fill) { + color: #fff; +} +html:not(.watch-active-state) .navbar .modal-button:not(.button-fill):active, +html:not(.watch-active-state) .navbar .modal-buttons .button:not(.button-fill):active, +html:not(.watch-active-state) .toolbar .modal-button:not(.button-fill):active, +html:not(.watch-active-state) .toolbar .modal-buttons .button:not(.button-fill):active, +html:not(.watch-active-state) .subnavbar .modal-button:not(.button-fill):active, +html:not(.watch-active-state) .subnavbar .modal-buttons .button:not(.button-fill):active, +html:not(.watch-active-state) .notifications .modal-button:not(.button-fill):active, +html:not(.watch-active-state) .notifications .modal-buttons .button:not(.button-fill):active, +.navbar .modal-button:not(.button-fill).active-state, +.navbar .modal-buttons .button:not(.button-fill).active-state, +.toolbar .modal-button:not(.button-fill).active-state, +.toolbar .modal-buttons .button:not(.button-fill).active-state, +.subnavbar .modal-button:not(.button-fill).active-state, +.subnavbar .modal-buttons .button:not(.button-fill).active-state, +.notifications .modal-button:not(.button-fill).active-state, +.notifications .modal-buttons .button:not(.button-fill).active-state { + background: rgba(255, 255, 255, 0.15); +} +.modal-button.modal-button-bold, +.modal-buttons .button.modal-button-bold { + font-weight: 700; +} +.modal-button + .modal-button, +.modal-buttons .button + .modal-button { + margin-left: 4px; +} +.modal-no-buttons .modal-buttons { + display: none; +} +.actions-modal { + position: absolute; + left: 0; + bottom: 0; + z-index: 13500; + width: 100%; + background: #fff; + -webkit-transform: translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0); +} +.actions-modal.modal-in { + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +.actions-modal.modal-out { + z-index: 13499; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + -webkit-transform: translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0); +} +.actions-modal-group { + position: relative; +} +.actions-modal-group:after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + right: auto; + top: auto; + height: 1px; + width: 100%; + background-color: #d2d2d6; + display: block; + z-index: 15; + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; +} +html.pixel-ratio-2 .actions-modal-group:after { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .actions-modal-group:after { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.actions-modal-group:last-child:after { + display: none; +} +.actions-modal-button, +.actions-modal-label { + width: 100%; + font-weight: normal; + margin: 0; + box-sizing: border-box; + display: block; + position: relative; + padding: 0 16px; +} +.actions-modal-button a, +.actions-modal-label a { + text-decoration: none; + color: inherit; + display: block; +} +.actions-modal-button b, +.actions-modal-label b { + font-weight: 500; +} +.actions-modal-button.actions-modal-button-bold, +.actions-modal-label.actions-modal-button-bold { + font-weight: 500; +} +.actions-modal-button.actions-modal-button-red, +.actions-modal-label.actions-modal-button-red { + color: #f44336; +} +.actions-modal-button.disabled, +.actions-modal-label.disabled { + opacity: 0.95; + color: #9e9e9e; +} +.actions-modal-button { + cursor: pointer; + line-height: 48px; + font-size: 16px; + color: rgba(0, 0, 0, 0.87); + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +.actions-modal-button a, +.actions-modal-button { + position: relative; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; +} +html:not(.watch-active-state) .actions-modal-button:active, +.actions-modal-button.active-state { + background: rgba(0, 0, 0, 0.1); +} +.actions-modal-label { + font-size: 16px; + color: rgba(0, 0, 0, 0.54); + min-height: 56px; + line-height: 1.3; + padding-top: 12px; + padding-bottom: 12px; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: start; + -ms-flex-pack: start; + -webkit-justify-content: flex-start; + justify-content: flex-start; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; +} +input.modal-text-input { + box-sizing: border-box; + height: 36px; + background: #fff; + margin: 0; + margin-top: 15px; + padding: 0; + border: none; + width: 100%; + font-size: 16px; + font-family: inherit; + display: block; + box-shadow: none; + -webkit-appearance: none; + -moz-appearance: none; + -ms-appearance: none; + appearance: none; + -webkit-transition-duration: 200ms; + transition-duration: 200ms; +} +input.modal-text-input::-webkit-input-placeholder { + color: rgba(0, 0, 0, 0.35); +} +input.modal-text-input + input.modal-text-input { + margin-top: 16px; +} +.popover { + width: 320px; + background: #fff; + z-index: 13500; + margin: 0; + top: 0; + opacity: 0; + left: 0; + border-radius: 3px; + position: absolute; + display: none; + box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23); + -webkit-transform: scale(0.85, 0.6); + transform: scale(0.85, 0.6); + -webkit-transition-property: opacity, -webkit-transform, border-radius; + -moz-transition-property: opacity, -moz-transform, border-radius; + transition-property: opacity, transform, border-radius; +} +.popover.popover-on-top { + -webkit-transform-origin: center bottom; + transform-origin: center bottom; +} +.popover.popover-on-bottom { + -webkit-transform-origin: center top; + transform-origin: center top; +} +.popover.modal-in { + -webkit-transform: scale(1); + transform: scale(1); + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + opacity: 1; +} +.popover.modal-out { + -webkit-transform: scale(1); + transform: scale(1); + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + opacity: 0; +} +.popover .list-block { + margin: 0; +} +.popover .list-block:first-child:last-child ul:before { + display: none; +} +.popover .list-block:first-child:last-child ul:after { + display: none; +} +.popover .list-block ul { + background: none; +} +.popover .list-block ul:before { + display: none; +} +.popover .list-block:first-child ul { + border-radius: 3px 3px 0 0; +} +.popover .list-block:first-child li:first-child a { + border-radius: 3px 3px 0 0; +} +.popover .list-block:last-child ul { + border-radius: 0 0 3px 3px; +} +.popover .list-block:last-child ul:after { + display: none; +} +.popover .list-block:last-child li:last-child a { + border-radius: 0 0 3px 3px; +} +.popover .list-block:first-child:last-child li:first-child:last-child a, +.popover .list-block:first-child:last-child ul:first-child:last-child { + border-radius: 3px; +} +.popover.popover-floating-button { + -webkit-transform-origin: center center; + transform-origin: center center; + -webkit-transform: scale(0.7); + transform: scale(0.7); + border-radius: 50%; + box-shadow: none; + box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); +} +.popover.popover-floating-button.modal-in { + border-radius: 0%; + -webkit-transform: scale(1); + transform: scale(1); + -webkit-transition-delay: 200ms; + transition-delay: 200ms; + -webkit-transition-duration: 200ms; + transition-duration: 200ms; +} +.popover.popover-floating-button.modal-out { + border-radius: 50%; + -webkit-transform: scale(0.7); + transform: scale(0.7); + -webkit-transition-delay: 0ms; + transition-delay: 0ms; + -webkit-transition-duration: 100ms; + transition-duration: 100ms; +} +.popover.popover-floating-button .list-block { + margin: 0; +} +.popover.popover-floating-button .list-block:first-child ul { + border-radius: 0; +} +.popover.popover-floating-button .list-block:first-child li:first-child a { + border-radius: 0; +} +.popover.popover-floating-button .list-block:last-child ul { + border-radius: 0; +} +.popover.popover-floating-button .list-block:last-child li:last-child a { + border-radius: 0; +} +.popover.popover-floating-button .list-block:first-child:last-child li:first-child:last-child a, +.popover.popover-floating-button .list-block:first-child:last-child ul:first-child:last-child { + border-radius: 0; +} +.popover-inner { + overflow: auto; + -webkit-overflow-scrolling: touch; +} +.actions-popover .list-block { + margin: 0; +} +.actions-popover-label { + padding: 8px 16px; + color: rgba(0, 0, 0, 0.54); + font-size: 16px; + line-height: 1.3; + padding-top: 12px; + padding-bottom: 12px; + position: relative; +} +.actions-popover-label:after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + right: auto; + top: auto; + height: 1px; + width: 100%; + background-color: #d2d2d6; + display: block; + z-index: 15; + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; +} +html.pixel-ratio-2 .actions-popover-label:after { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .actions-popover-label:after { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.actions-popover-label:last-child:after { + display: none; +} +.popup, +.login-screen { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + z-index: 11000; + background: #fff; + box-sizing: border-box; + display: none; + overflow: auto; + -webkit-overflow-scrolling: touch; + -webkit-transition-property: -webkit-transform; + -moz-transition-property: -moz-transform; + -ms-transition-property: -ms-transform; + -o-transition-property: -o-transform; + transition-property: transform; + -webkit-transform: translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0); +} +.popup.modal-in, +.login-screen.modal-in, +.popup.modal-out, +.login-screen.modal-out { + -webkit-transition-duration: 400ms; + transition-duration: 400ms; +} +.popup.modal-in, +.login-screen.modal-in { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +.popup.modal-out, +.login-screen.modal-out { + -webkit-transform: translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0); +} +.login-screen.modal-in, +.login-screen.modal-out { + display: block; +} +@media all and (min-width: 630px) and (min-height: 630px) { + .popup:not(.tablet-fullscreen) { + width: 630px; + height: 630px; + left: 50%; + top: 50%; + margin-left: -315px; + margin-top: -315px; + box-shadow: 0px 20px 44px rgba(0, 0, 0, 0.5); + border-radius: 3px; + -webkit-transform: translate3d(0, 1024px, 0); + transform: translate3d(0, 1024px, 0); + } + .popup:not(.tablet-fullscreen).modal-in { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + } + .popup:not(.tablet-fullscreen).modal-out { + -webkit-transform: translate3d(0, 1024px, 0); + transform: translate3d(0, 1024px, 0); + } +} +@media all and (max-width: 629px), (max-height: 629px) { + html.with-statusbar-overlay .popup { + height: -webkit-calc(100% - 20px); + height: calc(100% - 20px); + top: 20px; + } + html.with-statusbar-overlay .popup-overlay { + z-index: 9500; + } +} +html.with-statusbar-overlay .login-screen, +html.with-statusbar-overlay .popup.tablet-fullscreen { + height: -webkit-calc(100% - 20px); + height: calc(100% - 20px); + top: 20px; +} +.modal-preloader .modal-title, +.modal-preloader .modal-inner { + text-align: center; +} +.preloader-indicator-overlay { + visibility: visible; + opacity: 0; + background: none; +} +.preloader-indicator-modal { + position: absolute; + left: 50%; + top: 50%; + padding: 8px; + margin-left: -24px; + margin-top: -24px; + background: rgba(0, 0, 0, 0.8); + z-index: 13500; + border-radius: 4px; +} +.preloader-indicator-modal .preloader { + display: block; +} +.picker-modal { + position: absolute; + left: 0; + bottom: 0; + width: 100%; + height: 260px; + z-index: 12000; + display: none; + -webkit-transition-property: -webkit-transform; + -moz-transition-property: -moz-transform; + -ms-transition-property: -ms-transform; + -o-transition-property: -o-transform; + transition-property: transform; + background: #fff; + -webkit-transform: translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0); +} +.picker-modal.modal-in, +.picker-modal.modal-out { + -webkit-transition-duration: 400ms; + transition-duration: 400ms; +} +.picker-modal.modal-in { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +.picker-modal.modal-out { + -webkit-transform: translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0); +} +.picker-modal .picker-modal-inner { + height: 100%; + position: relative; +} +.picker-modal .toolbar { + position: relative; + width: 100%; + top: 0; +} +.picker-modal .toolbar + .picker-modal-inner { + height: -webkit-calc(100% - 48px); + height: -moz-calc(100% - 48px); + height: calc(100% - 48px); +} +.picker-modal .toolbar a.link { + -webkit-box-flex: 0; + -webkit-flex-shrink: 0; + -ms-flex: 0 0 auto; + flex-shrink: 0; +} +.picker-modal .picker-header, +.picker-modal .picker-footer { + height: 48px; +} +.picker-modal .picker-header { + background: #2196f3; +} +.picker-modal .picker-header + .toolbar .toolbar-inner { + overflow: visible; +} +.picker-modal .picker-header + .picker-footer + .toolbar + .picker-modal-inner { + height: -webkit-calc(100% - 48px * 3); + height: -moz-calc(100% - 48px * 3); + height: calc(100% - 48px * 3); +} +.picker-modal .picker-footer { + position: absolute; + left: 0; + bottom: 0; + width: 100%; + height: 48px; + padding: 6px 8px; + overflow: hidden; + box-sizing: border-box; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: end; + -ms-flex-pack: end; + -webkit-justify-content: flex-end; + justify-content: flex-end; +} +.picker-modal .picker-footer.modal-buttons-vertical { + display: block; + height: auto; + padding: 0 0 8px 0; +} +.picker-modal .picker-footer.modal-buttons-vertical .modal-button { + margin-left: 0; + text-align: right; + height: 48px; + line-height: 48px; + border-radius: 0; + padding-left: 16px; + padding-right: 16px; +} +.picker-modal .picker-header + .picker-modal-inner, +.picker-modal .picker-footer + .picker-modal-inner { + height: -webkit-calc(100% - 48px); + height: -moz-calc(100% - 48px); + height: calc(100% - 48px); +} +.picker-modal .picker-header + .toolbar + .picker-modal-inner, +.picker-modal .picker-footer + .toolbar + .picker-modal-inner { + height: -webkit-calc(100% - 48px * 2); + height: -moz-calc(100% - 48px * 2); + height: calc(100% - 48px * 2); +} +.picker-modal.picker-modal-inline, +.popover .picker-modal { + display: block; + position: relative; + background: none; + z-index: inherit; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +.picker-modal.picker-modal-inline .toolbar, +.popover .picker-modal .toolbar { + top: 0; +} +.popover .picker-modal { + width: auto; +} +.popover .picker-modal .toolbar:first-child, +.popover .picker-modal .picker-header:first-child { + border-radius: 2px 2px 0 0; +} +.picker-modal.smart-select-picker .list-block { + margin: 0; +} +.picker-modal.smart-select-picker .list-block ul:before { + display: none; +} +.picker-modal.smart-select-picker .list-block ul:after { + display: none; +} +/* === Panels === */ +.panel-overlay { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + background: rgba(0, 0, 0, 0.2); + opacity: 0; + z-index: 5999; + display: none; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +.panel { + z-index: 1000; + display: none; + background: #fff; + box-sizing: border-box; + overflow: auto; + -webkit-overflow-scrolling: touch; + position: absolute; + width: 260px; + top: 0; + height: 100%; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +.panel.panel-left.panel-cover { + z-index: 6000; + left: -260px; +} +.panel.panel-left.panel-reveal { + left: 0; +} +.panel.panel-right.panel-cover { + z-index: 6000; + right: -260px; +} +.panel.panel-right.panel-reveal { + right: 0; +} +body.with-panel-left-cover .panel, +body.with-panel-right-cover .panel { + box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.5); +} +body.with-panel-left-cover .views, +body.with-panel-right-cover .views { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +body.with-panel-left-cover .panel-overlay, +body.with-panel-right-cover .panel-overlay { + display: block; + opacity: 1; +} +body.with-panel-left-reveal .views, +body.with-panel-right-reveal .views { + box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.5); + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + -webkit-transition-property: -webkit-transform, box-shadow; + -moz-transition-property: -moz-transform, box-shadow; + transition-property: transform, box-shadow; +} +body.with-panel-left-reveal .panel-overlay, +body.with-panel-right-reveal .panel-overlay { + background: rgba(0, 0, 0, 0); + display: block; + opacity: 0; +} +body.with-panel-left-reveal .views { + -webkit-transform: translate3d(260px, 0, 0); + transform: translate3d(260px, 0, 0); +} +body.with-panel-left-reveal .panel-overlay { + -webkit-transform: translate3d(260px, 0, 0); + transform: translate3d(260px, 0, 0); +} +body.with-panel-left-cover .panel-left { + -webkit-transform: translate3d(260px, 0, 0); + transform: translate3d(260px, 0, 0); +} +body.with-panel-right-reveal .views { + -webkit-transform: translate3d(-260px, 0, 0); + transform: translate3d(-260px, 0, 0); +} +body.with-panel-right-reveal .panel-overlay { + -webkit-transform: translate3d(-260px, 0, 0); + transform: translate3d(-260px, 0, 0); +} +body.with-panel-right-cover .panel-right { + -webkit-transform: translate3d(-260px, 0, 0); + transform: translate3d(-260px, 0, 0); +} +body.panel-closing .panel-overlay { + display: block; +} +body.panel-closing .views { + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + -webkit-transition-property: -webkit-transform, box-shadow; + -moz-transition-property: -moz-transform, box-shadow; + transition-property: transform, box-shadow; +} +/* === Images Lazy Loading === */ +.lazy-loaded.lazy-fadeIn { + -webkit-animation: lazyFadeIn 600ms; + animation: lazyFadeIn 600ms; +} +@-webkit-keyframes lazyFadeIn { + from { + opacity: 0; + } + to { + opacity: 1; + } +} +@keyframes lazyFadeIn { + from { + opacity: 0; + } + to { + opacity: 1; + } +} +/* === Tabs === */ +.tabs .tab { + display: none; +} +.tabs .tab.active { + display: block; +} +.tabs-animated-wrap { + position: relative; + width: 100%; + overflow: hidden; + height: 100%; +} +.tabs-animated-wrap > .tabs { + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + height: 100%; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +.tabs-animated-wrap > .tabs > .tab { + width: 100%; + display: block; + -webkit-box-flex: 0; + -webkit-flex-shrink: 0; + -ms-flex: 0 0 auto; + flex-shrink: 0; +} +.tabs-swipeable-wrap { + height: 100%; +} +.tabs-swipeable-wrap > .tabs > .tab { + display: block; +} +/* === Messages === */ +.messages-content { + background: #eee; +} +.messages { + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-orient: vertical; + -moz-box-orient: vertical; + -ms-flex-direction: column; + -webkit-flex-direction: column; + flex-direction: column; +} +.messages-date { + text-align: center; + font-weight: 500; + font-size: 12px; + line-height: 1; + margin: 10px 15px; +} +.messages-date span { + font-weight: 400; +} +.message { + box-sizing: border-box; + margin: 0px 8px 8px 8px; + max-width: 80%; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-orient: vertical; + -moz-box-orient: vertical; + -ms-flex-direction: column; + -webkit-flex-direction: column; + flex-direction: column; +} +.message:first-child { + margin-top: 8px; +} +.message.message-pic img { + display: block; + height: auto; + max-width: 100%; +} +.message-name, +.message-label, +.message-date, +.messages-date { + color: rgba(0, 0, 0, 0.51); +} +.message-name { + font-size: 12px; + line-height: 1; + margin-bottom: 2px; + margin-top: 7px; +} +.message-hide-name .message-name { + display: none; +} +.message-label { + font-size: 12px; + line-height: 1; + margin-top: 4px; +} +.message-hide-label .message-label { + display: none; +} +.message-avatar { + width: 48px; + height: 48px; + border-radius: 100%; + margin-top: -48px; + position: relative; + top: 1px; + background-size: cover; + opacity: 1; + -webkit-transition-duration: 400ms; + transition-duration: 400ms; +} +.message-hide-avatar .message-avatar { + opacity: 0; +} +.message-text { + box-sizing: border-box; + border-radius: 2px; + padding: 6px 8px; + min-width: 48px; + font-size: 16px; + line-height: 1.2; + word-break: break-word; + color: #333; + min-height: 48px; + position: relative; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +.message-pic .message-text { + padding: 8px; +} +.message-date { + font-size: 12px; + margin-top: 4px; +} +.message-pic img + .message-date { + margin-top: 8px; +} +.message-sent { + -ms-flex-item-align: end; + -webkit-align-self: flex-end; + align-self: flex-end; + -webkit-box-align: end; + -ms-flex-align: end; + -webkit-align-items: flex-end; + align-items: flex-end; +} +.message-sent .message-name, +.message-sent .message-label { + margin-right: 8px; +} +.message-sent .message-text { + background-color: #C8E6C9; + margin-left: auto; + border-radius: 2px 2px 0 2px; + margin-right: 8px; +} +.message-sent .message-text:before { + position: absolute; + content: ''; + border-left: 0px solid transparent; + border-right: 8px solid transparent; + border-bottom: 8px solid #C8E6C9; + left: 100%; + bottom: 0; + width: 0; + height: 0; +} +.message-sent.message-with-avatar .message-text, +.message-sent.message-with-avatar .message-name, +.message-sent.message-with-avatar .message-label { + margin-right: 56px; +} +.message-received { + -ms-flex-item-align: start; + -webkit-align-self: flex-start; + align-self: flex-start; + -webkit-box-align: start; + -ms-flex-align: start; + -webkit-align-items: flex-start; + align-items: flex-start; +} +.message-received .message-text { + background-color: #fff; + border-radius: 2px 2px 2px 0px; + margin-left: 8px; +} +.message-received .message-text:before { + position: absolute; + content: ''; + border-left: 8px solid transparent; + border-right: 0px solid transparent; + border-bottom: 8px solid #fff; + right: 100%; + bottom: 0; + width: 0; + height: 0; +} +.message-received .message-name, +.message-received .message-label { + margin-left: 8px; +} +.message-received.message-with-avatar .message-text, +.message-received.message-with-avatar .message-name, +.message-received.message-with-avatar .message-label { + margin-left: 56px; +} +.message-appear-from-bottom { + -webkit-animation: messageAppearFromBottom 400ms; + animation: messageAppearFromBottom 400ms; +} +.message-appear-from-top { + -webkit-animation: messageAppearFromTop 400ms; + animation: messageAppearFromTop 400ms; +} +@-webkit-keyframes messageAppearFromBottom { + from { + -webkit-transform: translate3d(0, 100%, 0); + } + to { + -webkit-transform: translate3d(0, 0, 0); + } +} +@keyframes messageAppearFromBottom { + from { + transform: translate3d(0, 100%, 0); + } + to { + transform: translate3d(0, 0, 0); + } +} +@-webkit-keyframes messageAppearFromTop { + from { + -webkit-transform: translate3d(0, -100%, 0); + } + to { + -webkit-transform: translate3d(0, 0, 0); + } +} +@keyframes messageAppearFromTop { + from { + transform: translate3d(0, -100%, 0); + } + to { + transform: translate3d(0, 0, 0); + } +} +/* === Statusbar overlay === */ +html.with-statusbar-overlay body { + padding-top: 20px; + box-sizing: border-box; +} +html.with-statusbar-overlay body .statusbar-overlay { + display: block; +} +html.with-statusbar-overlay body .panel { + padding-top: 20px; +} +.statusbar-overlay { + background: #2196f3; + z-index: 10000; + position: absolute; + left: 0; + top: 0; + height: 20px; + width: 100%; + display: none; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +/* === + Preloader + By Rudi Theunissen (https://github.com/rtheunissen/md-preloader) +=== */ +.preloader { + font-size: 0; + display: inline-block; + width: 32px; + height: 32px; + -webkit-animation: preloader-outer 3300ms linear infinite; + animation: preloader-outer 3300ms linear infinite; +} +.preloader svg { + width: 100%; + height: 100%; + -webkit-animation: preloader-inner 1320ms linear infinite; + animation: preloader-inner 1320ms linear infinite; +} +.preloader svg circle { + fill: none; + stroke: #757575; + stroke-linecap: square; + -webkit-animation: preloader-arc 1320ms cubic-bezier(0.8, 0, 0.4, 0.8) infinite; + animation: preloader-arc 1320ms cubic-bezier(0.8, 0, 0.4, 0.8) infinite; +} +.preloader.preloader-white svg circle { + stroke: #fff; +} +@-webkit-keyframes preloader-outer { + 0% { + -webkit-transform: rotate(0); + } + 100% { + -webkit-transform: rotate(360deg); + } +} +@keyframes preloader-outer { + 0% { + transform: rotate(0); + } + 100% { + transform: rotate(360deg); + } +} +@-webkit-keyframes preloader-inner { + 0% { + -webkit-transform: rotate(-100.8deg); + } + 100% { + -webkit-transform: rotate(0); + } +} +@keyframes preloader-inner { + 0% { + transform: rotate(-100.8deg); + } + 100% { + transform: rotate(0); + } +} +@-webkit-keyframes preloader-arc { + 0% { + stroke-dasharray: 1 210.48670779px; + stroke-dashoffset: 0; + } + 40% { + stroke-dasharray: 151.55042961px, 210.48670779px; + stroke-dashoffset: 0; + } + 100% { + stroke-dasharray: 1 210.48670779px; + stroke-dashoffset: -151.55042961px; + } +} +@keyframes preloader-arc { + 0% { + stroke-dasharray: 1 210.48670779px; + stroke-dashoffset: 0; + } + 40% { + stroke-dasharray: 151.55042961px, 210.48670779px; + stroke-dashoffset: 0; + } + 100% { + stroke-dasharray: 1 210.48670779px; + stroke-dashoffset: -151.55042961px; + } +} +.preloader-inner { + position: relative; + display: block; + width: 100%; + height: 100%; + -webkit-animation: preloader-inner-rotate 5.25s cubic-bezier(0.35, 0, 0.25, 1) infinite; + animation: preloader-inner-rotate 5.25s cubic-bezier(0.35, 0, 0.25, 1) infinite; +} +.preloader-inner .preloader-inner-gap { + position: absolute; + width: 2px; + left: 50%; + margin-left: -1px; + top: 0; + bottom: 0; + box-sizing: border-box; + border-top: 4px solid #757575; +} +.preloader-inner .preloader-inner-left, +.preloader-inner .preloader-inner-right { + position: absolute; + top: 0; + height: 100%; + width: 50%; + overflow: hidden; +} +.preloader-inner .preloader-inner-half-circle { + position: absolute; + top: 0; + height: 100%; + width: 200%; + box-sizing: border-box; + border: 4px solid #757575; + border-bottom-color: transparent !important; + border-radius: 50%; + -webkit-animation-iteration-count: infinite; + -webkit-animation-duration: 1.3125s; + -webkit-animation-timing-function: cubic-bezier(0.35, 0, 0.25, 1); + animation-iteration-count: infinite; + animation-duration: 1.3125s; + animation-timing-function: cubic-bezier(0.35, 0, 0.25, 1); +} +.preloader-white .preloader-inner .preloader-inner-gap, +.preloader-white .preloader-inner .preloader-inner-half-circle { + border-color: #fff; +} +.preloader-inner .preloader-inner-left { + left: 0; +} +.preloader-inner .preloader-inner-left .preloader-inner-half-circle { + left: 0; + border-right-color: transparent !important; + -webkit-animation-name: preloader-left-rotate; + animation-name: preloader-left-rotate; +} +.preloader-inner .preloader-inner-right { + right: 0; +} +.preloader-inner .preloader-inner-right .preloader-inner-half-circle { + right: 0; + border-left-color: transparent !important; + -webkit-animation-name: preloader-right-rotate; + animation-name: preloader-right-rotate; +} +@-webkit-keyframes preloader-left-rotate { + 0%, + 100% { + -webkit-transform: rotate(130deg); + } + 50% { + -webkit-transform: rotate(-5deg); + } +} +@keyframes preloader-left-rotate { + 0%, + 100% { + transform: rotate(130deg); + } + 50% { + transform: rotate(-5deg); + } +} +@-webkit-keyframes preloader-right-rotate { + 0%, + 100% { + -webkit-transform: rotate(-130deg); + } + 50% { + -webkit-transform: rotate(5deg); + } +} +@keyframes preloader-right-rotate { + 0%, + 100% { + transform: rotate(-130deg); + } + 50% { + transform: rotate(5deg); + } +} +@-webkit-keyframes preloader-inner-rotate { + 12.5% { + -webkit-transform: rotate(135deg); + } + 25% { + -webkit-transform: rotate(270deg); + } + 37.5% { + -webkit-transform: rotate(405deg); + } + 50% { + -webkit-transform: rotate(540deg); + } + 62.5% { + -webkit-transform: rotate(675deg); + } + 75% { + -webkit-transform: rotate(810deg); + } + 87.5% { + -webkit-transform: rotate(945deg); + } + 100% { + -webkit-transform: rotate(1080deg); + } +} +@keyframes preloader-inner-rotate { + 12.5% { + transform: rotate(135deg); + } + 25% { + transform: rotate(270deg); + } + 37.5% { + transform: rotate(405deg); + } + 50% { + transform: rotate(540deg); + } + 62.5% { + transform: rotate(675deg); + } + 75% { + transform: rotate(810deg); + } + 87.5% { + transform: rotate(945deg); + } + 100% { + transform: rotate(1080deg); + } +} +/* === Progress Bar === */ +.progressbar, +.progressbar-infinite { + height: 4px; + width: 100%; + overflow: hidden; + display: block; + position: relative; + -webkit-transform-origin: center bottom; + transform-origin: center bottom; + background: rgba(33, 150, 243, 0.5); +} +.progressbar { + display: block; + vertical-align: middle; + -webkit-transform-style: preserve-3d; + transform-style: preserve-3d; +} +.progressbar span { + content: ''; + width: 100%; + background: #2196f3; + height: 100%; + position: absolute; + left: 0; + top: 0; + -webkit-transform: translate3d(-100%, 0, 0); + transform: translate3d(-100%, 0, 0); + -webkit-transition-duration: 150ms; + transition-duration: 150ms; +} +.progressbar-infinite { + z-index: 15000; +} +.progressbar-infinite:before, +.progressbar-infinite:after { + content: ''; + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + background: #2196f3; + -webkit-transform-origin: left center; + transform-origin: left center; +} +.progressbar-infinite:before { + -webkit-animation: progressbar-infinite-1 2s linear infinite; + animation: progressbar-infinite-1 2s linear infinite; +} +.progressbar-infinite:after { + -webkit-animation: progressbar-infinite-2 2s linear infinite; + animation: progressbar-infinite-2 2s linear infinite; +} +html.with-statusbar-overlay body > .progressbar-infinite { + top: 20px; +} +.progressbar-infinite.color-multi { + background: none !important; +} +.progressbar-infinite.color-multi:before, +.progressbar-infinite.color-multi:after { + width: 100%; + animation: none; +} +.progressbar-infinite.color-multi:before { + background: none; + -webkit-animation: progressbar-infinite-multicolor-bg 3s step-end infinite; + animation: progressbar-infinite-multicolor-bg 3s step-end infinite; +} +.progressbar-infinite.color-multi:after { + background: none; + -webkit-animation: progressbar-infinite-multicolor-fill 3s linear infinite; + animation: progressbar-infinite-multicolor-fill 3s linear infinite; + -webkit-transform-origin: center center; + transform-origin: center center; +} +body > .progressbar, +.view > .progressbar, +.views > .progressbar, +.page > .progressbar, +.panel > .progressbar, +.popup > .progressbar, +body > .progressbar-infinite, +.view > .progressbar-infinite, +.views > .progressbar-infinite, +.page > .progressbar-infinite, +.panel > .progressbar-infinite, +.popup > .progressbar-infinite { + position: absolute; + left: 0; + top: 0; + z-index: 15000; + -webkit-transform-origin: center top; + transform-origin: center top; +} +.progressbar-in { + -webkit-animation: progressbar-in 300ms forwards; + animation: progressbar-in 300ms forwards; +} +.progressbar-out { + -webkit-animation: progressbar-out 300ms forwards; + animation: progressbar-out 300ms forwards; +} +html.with-statusbar-overlay body > .progressbar { + top: 20px; +} +@-webkit-keyframes progressbar-in { + from { + opacity: 0; + -webkit-transform: scaleY(0); + } + to { + opacity: 1; + -webkit-transform: scaleY(1); + } +} +@keyframes progressbar-in { + from { + opacity: 0; + transform: scaleY(0); + } + to { + opacity: 1; + transform: scaleY(1); + } +} +@-webkit-keyframes progressbar-out { + from { + opacity: 1; + -webkit-transform: scaleY(1); + } + to { + opacity: 0; + -webkit-transform: scaleY(0); + } +} +@keyframes progressbar-out { + from { + opacity: 1; + transform: scaleY(1); + } + to { + opacity: 0; + transform: scaleY(0); + } +} +@-webkit-keyframes progressbar-infinite-1 { + 0% { + -webkit-transform: translateX(-10%) scaleX(0.1); + } + 25% { + -webkit-transform: translateX(30%) scaleX(0.6); + } + 50% { + -webkit-transform: translateX(100%) scaleX(1); + } + 100% { + -webkit-transform: translateX(100%) scaleX(1); + } +} +@keyframes progressbar-infinite-1 { + 0% { + transform: translateX(-10%) scaleX(0.1); + } + 25% { + transform: translateX(30%) scaleX(0.6); + } + 50% { + transform: translateX(100%) scaleX(1); + } + 100% { + transform: translateX(100%) scaleX(1); + } +} +@-webkit-keyframes progressbar-infinite-2 { + 0% { + -webkit-transform: translateX(-100%) scaleX(1); + } + 40% { + -webkit-transform: translateX(-100%) scaleX(1); + } + 75% { + -webkit-transform: translateX(60%) scaleX(0.35); + } + 90% { + -webkit-transform: translateX(100%) scaleX(0.1); + } + 100% { + -webkit-transform: translateX(100%) scaleX(0.1); + } +} +@keyframes progressbar-infinite-2 { + 0% { + transform: translateX(-100%) scaleX(1); + } + 40% { + transform: translateX(-100%) scaleX(1); + } + 75% { + transform: translateX(60%) scaleX(0.35); + } + 90% { + transform: translateX(100%) scaleX(0.1); + } + 100% { + transform: translateX(100%) scaleX(0.1); + } +} +@-webkit-keyframes progressbar-infinite-multicolor-bg { + 0% { + background-color: #4caf50; + } + 25% { + background-color: #f44336; + } + 50% { + background-color: #2196f3; + } + 75% { + background-color: #ffeb3b; + } +} +@keyframes progressbar-infinite-multicolor-bg { + 0% { + background-color: #4caf50; + } + 25% { + background-color: #f44336; + } + 50% { + background-color: #2196f3; + } + 75% { + background-color: #ffeb3b; + } +} +@-webkit-keyframes progressbar-infinite-multicolor-fill { + 0% { + -webkit-transform: scaleX(0); + background-color: #f44336; + } + 24.9% { + -webkit-transform: scaleX(1); + background-color: #f44336; + } + 25% { + -webkit-transform: scaleX(0); + background-color: #2196f3; + } + 49.9% { + -webkit-transform: scaleX(1); + background-color: #2196f3; + } + 50% { + -webkit-transform: scaleX(0); + background-color: #ffeb3b; + } + 74.9% { + -webkit-transform: scaleX(1); + background-color: #ffeb3b; + } + 75% { + -webkit-transform: scaleX(0); + background-color: #4caf50; + } + 100% { + -webkit-transform: scaleX(1); + background-color: #4caf50; + } +} +@keyframes progressbar-infinite-multicolor-fill { + 0% { + transform: scaleX(0); + background-color: #f44336; + } + 24.9% { + transform: scaleX(1); + background-color: #f44336; + } + 25% { + transform: scaleX(0); + background-color: #2196f3; + } + 49.9% { + transform: scaleX(1); + background-color: #2196f3; + } + 50% { + transform: scaleX(0); + background-color: #ffeb3b; + } + 74.9% { + transform: scaleX(1); + background-color: #ffeb3b; + } + 75% { + transform: scaleX(0); + background-color: #4caf50; + } + 100% { + transform: scaleX(1); + background-color: #4caf50; + } +} +/* === Pull To Refresh === */ +.pull-to-refresh-layer { + position: absolute; + position: relative; + margin-top: -48px; + left: 0; + top: 0; + width: 100%; + height: 48px; +} +.pull-to-refresh-layer .preloader { + position: absolute; + left: 50%; + top: 50%; + margin-left: -16px; + margin-top: -16px; + visibility: hidden; +} +.pull-to-refresh-layer .pull-to-refresh-arrow { + width: 24px; + height: 24px; + position: absolute; + left: 50%; + top: 50%; + margin-left: -12px; + margin-top: -12px; + background: no-repeat center; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'-80%204%2024%2024'%3E%3Cpath%20d%3D'M-69%2C8v12.2l-5.6-5.6L-76%2C16l8%2C8l8-8l-1.4-1.4l-5.6%2C5.6V8H-69z'%20fill%3D'%238c8c8c'%2F%3E%3C%2Fsvg%3E"); + z-index: 10; + -webkit-transform: rotate(0deg) translate3d(0, 0, 0); + transform: rotate(0deg) translate3d(0, 0, 0); + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +.pull-to-refresh-content.pull-to-refresh-no-navbar { + margin-top: -48px; + height: -webkit-calc(100% + 48px); + height: -moz-calc(100% + 48px); + height: calc(100% + 48px); +} +.pull-to-refresh-content.pull-to-refresh-no-navbar .pull-to-refresh-layer { + margin-top: 0; +} +.pull-to-refresh-content.transitioning, +.pull-to-refresh-content.refreshing { + -webkit-transition-duration: 400ms; + transition-duration: 400ms; +} +.pull-to-refresh-content:not(.refreshing) .pull-to-refresh-layer .preloader { + -webkit-animation: none; + animation: none; +} +.pull-to-refresh-content.refreshing { + -webkit-transform: translate3d(0, 48px, 0); + transform: translate3d(0, 48px, 0); +} +.pull-to-refresh-content.refreshing .pull-to-refresh-arrow { + visibility: hidden; + -webkit-transition-duration: 0ms; + transition-duration: 0ms; +} +.pull-to-refresh-content.refreshing .preloader { + visibility: visible; +} +.pull-to-refresh-content.pull-up .pull-to-refresh-arrow { + -webkit-transform: rotate(180deg) translate3d(0, 0, 0); + transform: rotate(180deg) translate3d(0, 0, 0); +} +/* === Autocomplete === */ +.autocomplete-page .autocomplete-found { + display: block; +} +.autocomplete-page .autocomplete-not-found { + display: none; +} +.autocomplete-page .autocomplete-values { + display: block; +} +.autocomplete-page .list-block ul:empty { + display: none; +} +.autocomplete-page .navbar .autocomplete-preloader { + margin-right: 16px; +} +.autocomplete-preloader:not(.autocomplete-preloader-visible) { + -webkit-animation: none; + animation: none; + visibility: hidden; +} +.autocomplete-dropdown { + background: #fff; + box-sizing: border-box; + position: absolute; + z-index: 500; + box-shadow: 0 2px 2px rgba(0, 0, 0, 0.25); + width: 100%; + left: 0; +} +.autocomplete-dropdown .autocomplete-dropdown-inner { + position: relative; + overflow: auto; + -webkit-overflow-scrolling: touch; + height: 100%; + z-index: 1; +} +.autocomplete-dropdown .autocomplete-preloader { + display: none; + position: absolute; + right: 16px; + bottom: 100%; + margin-bottom: 8px; + width: 20px; + height: 20px; +} +.autocomplete-dropdown .autocomplete-preloader .preloader-inner-gap, +.autocomplete-dropdown .autocomplete-preloader .preloader-inner-half-circle { + border-width: 3px; +} +.autocomplete-dropdown .autocomplete-preloader-visible { + display: block; +} +.autocomplete-dropdown .autocomplete-dropdown-placeholder { + color: #a9a9a9; +} +.autocomplete-dropdown .list-block { + margin: 0; + color: rgba(0, 0, 0, 0.54); +} +.autocomplete-dropdown .list-block ul { + background: none !important; +} +.autocomplete-dropdown .list-block ul:before { + display: none; +} +.autocomplete-dropdown .list-block ul:after { + display: none; +} +.autocomplete-dropdown .list-block b { + font-weight: normal; + color: #212121; +} +/* === Swiper === */ +.swiper-container { + margin: 0 auto; + position: relative; + overflow: hidden; + /* Fix of Webkit flickering */ + z-index: 1; +} +.swiper-container-no-flexbox .swiper-slide { + float: left; +} +.swiper-container-vertical > .swiper-wrapper { + -webkit-box-orient: vertical; + -moz-box-orient: vertical; + -ms-flex-direction: column; + -webkit-flex-direction: column; + flex-direction: column; +} +.swiper-wrapper { + position: relative; + width: 100%; + height: 100%; + z-index: 1; + display: -webkit-box; + display: -moz-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-transition-property: -webkit-transform; + -moz-transition-property: -moz-transform; + -o-transition-property: -o-transform; + -ms-transition-property: -ms-transform; + transition-property: transform; + -webkit-box-sizing: content-box; + -moz-box-sizing: content-box; + box-sizing: content-box; +} +.swiper-container-android .swiper-slide, +.swiper-wrapper { + -webkit-transform: translate3d(0px, 0, 0); + -moz-transform: translate3d(0px, 0, 0); + -o-transform: translate(0px, 0px); + -ms-transform: translate3d(0px, 0, 0); + transform: translate3d(0px, 0, 0); +} +.swiper-container-multirow > .swiper-wrapper { + -webkit-box-lines: multiple; + -moz-box-lines: multiple; + -ms-flex-wrap: wrap; + -webkit-flex-wrap: wrap; + flex-wrap: wrap; +} +.swiper-container-free-mode > .swiper-wrapper { + -webkit-transition-timing-function: ease-out; + -moz-transition-timing-function: ease-out; + -ms-transition-timing-function: ease-out; + -o-transition-timing-function: ease-out; + transition-timing-function: ease-out; + margin: 0 auto; +} +.swiper-slide { + -webkit-flex-shrink: 0; + -ms-flex: 0 0 auto; + flex-shrink: 0; + width: 100%; + height: 100%; + position: relative; +} +/* Auto Height */ +.swiper-container-autoheight, +.swiper-container-autoheight .swiper-slide { + height: auto; +} +.swiper-container-autoheight .swiper-wrapper { + -webkit-box-align: start; + -ms-flex-align: start; + -webkit-align-items: flex-start; + align-items: flex-start; + -webkit-transition-property: -webkit-transform, height; + -moz-transition-property: -moz-transform; + -o-transition-property: -o-transform; + -ms-transition-property: -ms-transform; + transition-property: transform, height; +} +/* a11y */ +.swiper-container .swiper-notification { + position: absolute; + left: 0; + top: 0; + pointer-events: none; + opacity: 0; + z-index: -1000; +} +/* IE10 Windows Phone 8 Fixes */ +.swiper-wp8-horizontal { + -ms-touch-action: pan-y; + touch-action: pan-y; +} +.swiper-wp8-vertical { + -ms-touch-action: pan-x; + touch-action: pan-x; +} +/* Arrows */ +.swiper-button-prev, +.swiper-button-next { + position: absolute; + top: 50%; + width: 27px; + height: 44px; + margin-top: -22px; + z-index: 10; + cursor: pointer; + -moz-background-size: 27px 44px; + -webkit-background-size: 27px 44px; + background-size: 27px 44px; + background-position: center; + background-repeat: no-repeat; +} +.swiper-button-prev.swiper-button-disabled, +.swiper-button-next.swiper-button-disabled { + opacity: 0.35; + cursor: auto; + pointer-events: none; +} +.swiper-button-prev, +.swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E"); + left: 10px; + right: auto; +} +.swiper-button-next, +.swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E"); + right: 10px; + left: auto; +} +/* Pagination Styles */ +.swiper-pagination { + position: absolute; + text-align: center; + -webkit-transition: 300ms; + -moz-transition: 300ms; + -o-transition: 300ms; + transition: 300ms; + -webkit-transform: translate3d(0, 0, 0); + -ms-transform: translate3d(0, 0, 0); + -o-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + z-index: 10; +} +.swiper-pagination.swiper-pagination-hidden { + opacity: 0; +} +/* Common Styles */ +.swiper-pagination-fraction, +.swiper-pagination-custom, +.swiper-container-horizontal > .swiper-pagination-bullets { + bottom: 10px; + left: 0; + width: 100%; +} +/* Bullets */ +.swiper-pagination-bullet { + width: 8px; + height: 8px; + display: inline-block; + border-radius: 100%; + background: #000; + opacity: 0.2; +} +button.swiper-pagination-bullet { + border: none; + margin: 0; + padding: 0; + box-shadow: none; + -moz-appearance: none; + -ms-appearance: none; + -webkit-appearance: none; + appearance: none; +} +.swiper-pagination-clickable .swiper-pagination-bullet { + cursor: pointer; +} +.swiper-pagination-bullet-active { + opacity: 1; + background: #007aff; +} +.swiper-container-vertical > .swiper-pagination-bullets { + right: 10px; + top: 50%; + -webkit-transform: translate3d(0px, -50%, 0); + -moz-transform: translate3d(0px, -50%, 0); + -o-transform: translate(0px, -50%); + -ms-transform: translate3d(0px, -50%, 0); + transform: translate3d(0px, -50%, 0); +} +.swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet { + margin: 5px 0; + display: block; +} +.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet { + margin: 0 5px; +} +/* Progress */ +.swiper-pagination-progress { + background: rgba(0, 0, 0, 0.25); + position: absolute; +} +.swiper-pagination-progress .swiper-pagination-progressbar { + background: #007aff; + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + -webkit-transform: scale(0); + -ms-transform: scale(0); + -o-transform: scale(0); + transform: scale(0); + -webkit-transform-origin: left top; + -moz-transform-origin: left top; + -ms-transform-origin: left top; + -o-transform-origin: left top; + transform-origin: left top; +} +.swiper-container-rtl .swiper-pagination-progress .swiper-pagination-progressbar { + -webkit-transform-origin: right top; + -moz-transform-origin: right top; + -ms-transform-origin: right top; + -o-transform-origin: right top; + transform-origin: right top; +} +.swiper-container-horizontal > .swiper-pagination-progress { + width: 100%; + height: 4px; + left: 0; + top: 0; +} +.swiper-container-vertical > .swiper-pagination-progress { + width: 4px; + height: 100%; + left: 0; + top: 0; +} +/* 3D Container */ +.swiper-container-3d { + -webkit-perspective: 1200px; + -moz-perspective: 1200px; + -o-perspective: 1200px; + perspective: 1200px; +} +.swiper-container-3d .swiper-wrapper, +.swiper-container-3d .swiper-slide, +.swiper-container-3d .swiper-slide-shadow-left, +.swiper-container-3d .swiper-slide-shadow-right, +.swiper-container-3d .swiper-slide-shadow-top, +.swiper-container-3d .swiper-slide-shadow-bottom, +.swiper-container-3d .swiper-cube-shadow { + -webkit-transform-style: preserve-3d; + -moz-transform-style: preserve-3d; + -ms-transform-style: preserve-3d; + transform-style: preserve-3d; +} +.swiper-container-3d .swiper-slide-shadow-left, +.swiper-container-3d .swiper-slide-shadow-right, +.swiper-container-3d .swiper-slide-shadow-top, +.swiper-container-3d .swiper-slide-shadow-bottom { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + pointer-events: none; + z-index: 10; +} +.swiper-container-3d .swiper-slide-shadow-left { + background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0))); + /* Safari 4+, Chrome */ + background-image: -webkit-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Chrome 10+, Safari 5.1+, iOS 5+ */ + background-image: -moz-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Firefox 3.6-15 */ + background-image: -o-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Opera 11.10-12.00 */ + background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Firefox 16+, IE10, Opera 12.50+ */ +} +.swiper-container-3d .swiper-slide-shadow-right { + background-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0))); + /* Safari 4+, Chrome */ + background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Chrome 10+, Safari 5.1+, iOS 5+ */ + background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Firefox 3.6-15 */ + background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Opera 11.10-12.00 */ + background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Firefox 16+, IE10, Opera 12.50+ */ +} +.swiper-container-3d .swiper-slide-shadow-top { + background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0))); + /* Safari 4+, Chrome */ + background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Chrome 10+, Safari 5.1+, iOS 5+ */ + background-image: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Firefox 3.6-15 */ + background-image: -o-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Opera 11.10-12.00 */ + background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Firefox 16+, IE10, Opera 12.50+ */ +} +.swiper-container-3d .swiper-slide-shadow-bottom { + background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0))); + /* Safari 4+, Chrome */ + background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Chrome 10+, Safari 5.1+, iOS 5+ */ + background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Firefox 3.6-15 */ + background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Opera 11.10-12.00 */ + background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Firefox 16+, IE10, Opera 12.50+ */ +} +/* Coverflow */ +.swiper-container-coverflow .swiper-wrapper, +.swiper-container-flip .swiper-wrapper { + /* Windows 8 IE 10 fix */ + -ms-perspective: 1200px; +} +/* Cube + Flip */ +.swiper-container-cube, +.swiper-container-flip { + overflow: visible; +} +.swiper-container-cube .swiper-slide, +.swiper-container-flip .swiper-slide { + pointer-events: none; + -webkit-backface-visibility: hidden; + -moz-backface-visibility: hidden; + -ms-backface-visibility: hidden; + backface-visibility: hidden; + z-index: 1; +} +.swiper-container-cube .swiper-slide .swiper-slide, +.swiper-container-flip .swiper-slide .swiper-slide { + pointer-events: none; +} +.swiper-container-cube .swiper-slide-active, +.swiper-container-flip .swiper-slide-active, +.swiper-container-cube .swiper-slide-active .swiper-slide-active, +.swiper-container-flip .swiper-slide-active .swiper-slide-active { + pointer-events: auto; +} +.swiper-container-cube .swiper-slide-shadow-top, +.swiper-container-flip .swiper-slide-shadow-top, +.swiper-container-cube .swiper-slide-shadow-bottom, +.swiper-container-flip .swiper-slide-shadow-bottom, +.swiper-container-cube .swiper-slide-shadow-left, +.swiper-container-flip .swiper-slide-shadow-left, +.swiper-container-cube .swiper-slide-shadow-right, +.swiper-container-flip .swiper-slide-shadow-right { + z-index: 0; + -webkit-backface-visibility: hidden; + -moz-backface-visibility: hidden; + -ms-backface-visibility: hidden; + backface-visibility: hidden; +} +/* Cube */ +.swiper-container-cube .swiper-slide { + visibility: hidden; + -webkit-transform-origin: 0 0; + -moz-transform-origin: 0 0; + -ms-transform-origin: 0 0; + transform-origin: 0 0; + width: 100%; + height: 100%; +} +.swiper-container-cube.swiper-container-rtl .swiper-slide { + -webkit-transform-origin: 100% 0; + -moz-transform-origin: 100% 0; + -ms-transform-origin: 100% 0; + transform-origin: 100% 0; +} +.swiper-container-cube .swiper-slide-active, +.swiper-container-cube .swiper-slide-next, +.swiper-container-cube .swiper-slide-prev, +.swiper-container-cube .swiper-slide-next + .swiper-slide { + pointer-events: auto; + visibility: visible; +} +.swiper-container-cube .swiper-cube-shadow { + position: absolute; + left: 0; + bottom: 0px; + width: 100%; + height: 100%; + background: #000; + opacity: 0.6; + -webkit-filter: blur(50px); + filter: blur(50px); + z-index: 0; +} +/* Fade */ +.swiper-container-fade.swiper-container-free-mode .swiper-slide { + -webkit-transition-timing-function: ease-out; + -moz-transition-timing-function: ease-out; + -ms-transition-timing-function: ease-out; + -o-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.swiper-container-fade .swiper-slide { + pointer-events: none; + -webkit-transition-property: opacity; + -moz-transition-property: opacity; + -o-transition-property: opacity; + transition-property: opacity; +} +.swiper-container-fade .swiper-slide .swiper-slide { + pointer-events: none; +} +.swiper-container-fade .swiper-slide-active, +.swiper-container-fade .swiper-slide-active .swiper-slide-active { + pointer-events: auto; +} +/* Scrollbar */ +.swiper-scrollbar { + border-radius: 10px; + position: relative; + -ms-touch-action: none; + background: rgba(0, 0, 0, 0.1); +} +.swiper-container-horizontal > .swiper-scrollbar { + position: absolute; + left: 1%; + bottom: 3px; + z-index: 50; + height: 5px; + width: 98%; +} +.swiper-container-vertical > .swiper-scrollbar { + position: absolute; + right: 3px; + top: 1%; + z-index: 50; + width: 5px; + height: 98%; +} +.swiper-scrollbar-drag { + height: 100%; + width: 100%; + position: relative; + background: rgba(0, 0, 0, 0.5); + border-radius: 10px; + left: 0; + top: 0; +} +.swiper-scrollbar-cursor-drag { + cursor: move; +} +/* Preloader */ +.swiper-slide .preloader { + width: 42px; + height: 42px; + position: absolute; + left: 50%; + top: 50%; + margin-left: -21px; + margin-top: -21px; + z-index: 10; +} +/* === Photo Browser === */ +.photo-browser { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + z-index: 11500; +} +body > .photo-browser { + opacity: 0; + display: none; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +body > .photo-browser.photo-browser-in { + display: block; + -webkit-animation: photoBrowserIn 400ms forwards; + animation: photoBrowserIn 400ms forwards; +} +body > .photo-browser.photo-browser-out { + display: block; + -webkit-animation: photoBrowserOut 400ms forwards; + animation: photoBrowserOut 400ms forwards; +} +html.with-statusbar-overlay body > .photo-browser { + height: -webkit-calc(100% - 20px); + height: calc(100% - 20px); + top: 20px; +} +.popup > .photo-browser .navbar, +body > .photo-browser .navbar, +.popup > .photo-browser .toolbar, +body > .photo-browser .toolbar { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +.photo-browser .page[data-page="photo-browser-slides"] { + background: none; +} +.photo-browser-popup { + background: none; +} +.photo-browser .navbar, +.views .view[data-page="photo-browser-slides"] .navbar, +.photo-browser .toolbar, +.views .view[data-page="photo-browser-slides"] .toolbar { + background: rgba(33, 150, 243, 0.95); + -webkit-transition-duration: 400ms; + transition-duration: 400ms; +} +.view[data-page="photo-browser-slides"] .page[data-page="photo-browser-slides"] .navbar, +.view[data-page="photo-browser-slides"] .page[data-page="photo-browser-slides"] .toolbar { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +.view[data-page="photo-browser-slides"] .page[data-page="photo-browser-slides"] .toolbar, +.photo-browser .page[data-page="photo-browser-slides"] .toolbar { + bottom: 0; + top: auto; +} +.photo-browser-exposed .navbar, +.photo-browser-exposed .toolbar { + opacity: 0; + visibility: hidden; + pointer-events: none; +} +.photo-browser-exposed .photo-browser-swiper-container { + background: #000; +} +.photo-browser-of { + margin: 0 5px; +} +.photo-browser-captions { + pointer-events: none; + position: absolute; + left: 0; + width: 100%; + bottom: 0; + z-index: 10; + opacity: 1; + -webkit-transition-duration: 400ms; + transition-duration: 400ms; +} +.photo-browser-captions.photo-browser-captions-exposed { + opacity: 0; +} +.toolbar ~ .photo-browser-captions { + bottom: 48px; + -webkit-transform: translate3d(0, 0px, 0); + transform: translate3d(0, 0px, 0); +} +.photo-browser-exposed .toolbar ~ .photo-browser-captions { + -webkit-transform: translate3d(0, 48px, 0); + transform: translate3d(0, 48px, 0); +} +.toolbar ~ .photo-browser-captions.photo-browser-captions-exposed { + -webkit-transform: translate3d(0, 0px, 0); + transform: translate3d(0, 0px, 0); +} +.photo-browser-caption { + box-sizing: border-box; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + position: absolute; + bottom: 0; + left: 0; + opacity: 0; + padding: 4px 5px; + width: 100%; + text-align: center; + background: rgba(0, 0, 0, 0.8); +} +.photo-browser-caption:empty { + display: none; +} +.photo-browser-caption.photo-browser-caption-active { + opacity: 1; +} +.photo-browser-captions-light .photo-browser-caption { + background: rgba(255, 255, 255, 0.8); +} +.photo-browser-captions-dark .photo-browser-caption { + color: #fff; +} +.photo-browser-exposed .photo-browser-caption { + color: #fff; + background: rgba(0, 0, 0, 0.8); +} +.photo-browser-swiper-container { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + overflow: hidden; + background: #fff; + -webkit-transition-duration: 400ms; + transition-duration: 400ms; +} +.photo-browser-swiper-wrapper { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + padding: 0; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; +} +.photo-browser-link-inactive { + opacity: 0.3; +} +.photo-browser-slide { + width: 100%; + height: 100%; + position: relative; + overflow: hidden; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + -webkit-box-flex: 0; + -webkit-flex-shrink: 0; + -ms-flex: 0 0 auto; + flex-shrink: 0; + box-sizing: border-box; +} +.photo-browser-slide.transitioning { + -webkit-transition-duration: 400ms; + transition-duration: 400ms; +} +.photo-browser-slide span.photo-browser-zoom-container { + width: 100%; + text-align: center; + display: none; +} +.photo-browser-slide img { + width: auto; + height: auto; + max-width: 100%; + max-height: 100%; + display: none; +} +.photo-browser-slide.swiper-slide-active span.photo-browser-zoom-container, +.photo-browser-slide.swiper-slide-next span.photo-browser-zoom-container, +.photo-browser-slide.swiper-slide-prev span.photo-browser-zoom-container { + display: block; +} +.photo-browser-slide.swiper-slide-active img, +.photo-browser-slide.swiper-slide-next img, +.photo-browser-slide.swiper-slide-prev img { + display: inline; +} +.photo-browser-slide.swiper-slide-active.photo-browser-slide-lazy .preloader, +.photo-browser-slide.swiper-slide-next.photo-browser-slide-lazy .preloader, +.photo-browser-slide.swiper-slide-prev.photo-browser-slide-lazy .preloader { + display: block; +} +.photo-browser-slide iframe { + width: 100%; + height: 100%; +} +.photo-browser-slide .preloader { + display: none; + position: absolute; + width: 42px; + height: 42px; + margin-left: -21px; + margin-top: -21px; + left: 50%; + top: 50%; +} +.photo-browser.photo-browser-dark .navbar, +.photo-browser.photo-browser-dark .toolbar { + background: rgba(30, 30, 30, 0.8); + color: #fff; +} +.photo-browser.photo-browser-dark .navbar:before, +.photo-browser.photo-browser-dark .toolbar:before { + display: none; +} +.photo-browser.photo-browser-dark .navbar:after, +.photo-browser.photo-browser-dark .toolbar:after { + display: none; +} +.photo-browser.photo-browser-dark .navbar a, +.photo-browser.photo-browser-dark .toolbar a { + color: #fff; +} +.photo-browser.photo-browser-dark .photo-browser-swiper-container { + background: #000; +} +@-webkit-keyframes photoBrowserIn { + 0% { + -webkit-transform: translate3d(0, 0, 0) scale(0.5); + opacity: 0; + } + 100% { + -webkit-transform: translate3d(0, 0, 0) scale(1); + opacity: 1; + } +} +@keyframes photoBrowserIn { + 0% { + transform: translate3d(0, 0, 0) scale(0.5); + opacity: 0; + } + 100% { + transform: translate3d(0, 0, 0) scale(1); + opacity: 1; + } +} +@-webkit-keyframes photoBrowserOut { + 0% { + -webkit-transform: translate3d(0, 0, 0) scale(1); + opacity: 1; + } + 100% { + -webkit-transform: translate3d(0, 0, 0) scale(0.5); + opacity: 0; + } +} +@keyframes photoBrowserOut { + 0% { + transform: translate3d(0, 0, 0) scale(1); + opacity: 1; + } + 100% { + transform: translate3d(0, 0, 0) scale(0.5); + opacity: 0; + } +} +/* === Columns Picker === */ +.picker-columns { + width: 100%; + height: 260px; + z-index: 11500; +} +.picker-columns.picker-modal-inline { + height: 200px; +} +@media (orientation: landscape) and (max-height: 415px) { + .picker-columns:not(.picker-modal-inline) { + height: 200px; + } +} +.popover.popover-picker-columns { + width: 280px; +} +.popover.popover-picker-columns .toolbar { + border-radius: 2px 2px 0 0; +} +.picker-items { + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; + padding: 0; + text-align: right; + font-size: 20px; + -webkit-mask-box-image: -webkit-linear-gradient(bottom, transparent, transparent 5%, white 20%, white 80%, transparent 95%, transparent); + -webkit-mask-box-image: linear-gradient(to top, transparent, transparent 5%, white 20%, white 80%, transparent 95%, transparent); +} +.picker-items-col { + overflow: hidden; + position: relative; + max-height: 100%; +} +.picker-items-col.picker-items-col-left { + text-align: left; +} +.picker-items-col.picker-items-col-center { + text-align: center; +} +.picker-items-col.picker-items-col-right { + text-align: right; +} +.picker-items-col.picker-items-col-divider { + color: rgba(0, 0, 0, 0.87); + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; +} +.picker-items-col-wrapper { + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.picker-item { + height: 36px; + line-height: 36px; + padding: 0 10px; + white-space: nowrap; + position: relative; + overflow: hidden; + text-overflow: ellipsis; + color: rgba(0, 0, 0, 0.54); + left: 0; + top: 0; + width: 100%; + box-sizing: border-box; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +.picker-items-col-absolute .picker-item { + position: absolute; +} +.picker-item.picker-item-far { + pointer-events: none; +} +.picker-item.picker-selected { + color: rgba(0, 0, 0, 0.87); + -webkit-transform: translate3d(0, 0, 0) rotateX(0deg); + transform: translate3d(0, 0, 0) rotateX(0deg); +} +.picker-center-highlight { + height: 36px; + box-sizing: border-box; + position: absolute; + left: 0; + width: 100%; + top: 50%; + margin-top: -18px; + pointer-events: none; +} +.picker-center-highlight:before { + content: ''; + position: absolute; + left: 0; + top: 0; + bottom: auto; + right: auto; + height: 1px; + width: 100%; + background-color: rgba(0, 0, 0, 0.15); + display: block; + z-index: 15; + -webkit-transform-origin: 50% 0%; + transform-origin: 50% 0%; +} +html.pixel-ratio-2 .picker-center-highlight:before { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .picker-center-highlight:before { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.picker-center-highlight:after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + right: auto; + top: auto; + height: 1px; + width: 100%; + background-color: rgba(0, 0, 0, 0.15); + display: block; + z-index: 15; + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; +} +html.pixel-ratio-2 .picker-center-highlight:after { + -webkit-transform: scaleY(0.5); + transform: scaleY(0.5); +} +html.pixel-ratio-3 .picker-center-highlight:after { + -webkit-transform: scaleY(0.33); + transform: scaleY(0.33); +} +.picker-3d .picker-items { + overflow: hidden; + -webkit-perspective: 1200px; + perspective: 1200px; +} +.picker-3d .picker-items-col, +.picker-3d .picker-items-col-wrapper, +.picker-3d .picker-item { + -webkit-transform-style: preserve-3d; + transform-style: preserve-3d; +} +.picker-3d .picker-items-col { + overflow: visible; +} +.picker-3d .picker-item { + -webkit-transform-origin: center center -110px; + transform-origin: center center -110px; + -webkit-backface-visibility: hidden; + backface-visibility: hidden; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +/* === Calendar === */ +.picker-calendar { + background: #fff; + height: 420px; + overflow: hidden; + bottom: auto; + width: 90%; + left: 50%; + top: 50%; + min-width: 300px; + max-width: 380px; + -webkit-transform: translate3d(-50%, 100%, 0); + transform: translate3d(-50%, 100%, 0); + box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.22); +} +@media (orientation: landscape) and (max-height: 460px) { + .picker-calendar:not(.picker-modal-inline) { + height: -webkit-calc(100% - 40px); + height: calc(100% - 40px); + } +} +.popover-picker-calendar .picker-calendar { + height: 420px; +} +.picker-calendar .picker-modal-inner { + overflow: hidden; +} +.picker-calendar.modal-in { + -webkit-transform: translate3d(-50%, -50%, 0); + transform: translate3d(-50%, -50%, 0); +} +.picker-calendar.modal-out { + -webkit-transform: translate3d(-50%, 100%, 0); + transform: translate3d(-50%, 100%, 0); +} +.picker-calendar.picker-modal-inline { + height: 300px; +} +.picker-calendar.picker-modal-inline, +.popover-picker-calendar .picker-calendar { + -webkit-transform: translate3d(0%, 0%, 0); + transform: translate3d(0%, 0%, 0); + width: auto; + max-width: none; + left: 0; + top: 0; + box-shadow: none; +} +.picker-calendar.picker-modal { + z-index: 12500; +} +.popover.popover-picker-calendar { + width: 320px; +} +.picker-calendar-selected-date { + line-height: 48px; + color: #fff; + padding: 0 24px; + font-size: 20px; + position: relative; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} +.picker-calendar-week-days { + height: 14.28571429%; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + font-size: 12px; + box-sizing: border-box; + position: relative; + color: rgba(0, 0, 0, 0.54); +} +.picker-calendar-week-days .picker-calendar-week-day { + -webkit-box-flex: 1; + -webkit-flex-shrink: 1; + -ms-flex: 0 1 auto; + flex-shrink: 1; + width: 14.28571429%; + width: -webkit-calc(100% / 7); + width: -moz-calc(100% / 7); + width: calc(100% / 7); + text-align: center; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; +} +.picker-calendar-week-days + .picker-calendar-months { + height: -webkit-calc(100% - 100% / 7); + height: -moz-calc(100% - 100% / 7); + height: calc(100% - 100% / 7); +} +.picker-calendar-months { + width: 100%; + height: 100%; + overflow: hidden; + position: relative; +} +.picker-calendar-months-wrapper { + position: relative; + width: 100%; + height: 100%; + -webkit-transition-duration: 300ms; + transition-duration: 300ms; +} +.picker-calendar-month { + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-orient: vertical; + -moz-box-orient: vertical; + -ms-flex-direction: column; + -webkit-flex-direction: column; + flex-direction: column; + width: 100%; + height: 100%; + position: absolute; + left: 0; + top: 0; +} +.picker-calendar-row { + height: 16.66666667%; + height: -webkit-calc(100% / 6); + height: -moz-calc(100% / 6); + height: calc(100% / 6); + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-flex: 1; + -webkit-flex-shrink: 1; + -ms-flex: 0 1 auto; + flex-shrink: 1; + width: 100%; + position: relative; +} +.picker-calendar-day { + -webkit-box-flex: 1; + -webkit-flex-shrink: 1; + -ms-flex: 0 1 auto; + flex-shrink: 1; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + box-sizing: border-box; + width: 14.28571429%; + width: -webkit-calc(100% / 7); + width: -moz-calc(100% / 7); + width: calc(100% / 7); + text-align: center; + font-size: 12px; + cursor: pointer; +} +.picker-calendar-day.picker-calendar-day-prev, +.picker-calendar-day.picker-calendar-day-next { + color: #b8b8b8; +} +.picker-calendar-day.picker-calendar-day-disabled { + color: #d4d4d4; + cursor: auto; +} +.picker-calendar-day.picker-calendar-day-today span { + color: #2196f3; +} +.picker-calendar-day.picker-calendar-day-selected span { + background: #2196f3; + color: #fff; +} +.picker-calendar-range .picker-calendar-day.picker-calendar-day-selected span { + border-radius: 0; + width: 100%; +} +.picker-calendar-day.picker-calendar-day-has-events span:after { + content: ''; + width: 4px; + height: 4px; + border-radius: 50%; + background: #2196f3; + position: absolute; + margin-left: -2px; + left: 50%; + bottom: 2px; +} +.picker-calendar-day.picker-calendar-day-has-events.picker-calendar-day-selected span:after { + display: none; +} +.picker-calendar-day span { + display: inline-block; + border-radius: 100%; + width: 36px; + height: 36px; + line-height: 36px; + position: relative; +} +.picker-calendar-month-picker, +.picker-calendar-year-picker { + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + -webkit-box-pack: justify; + -ms-flex-pack: justify; + -webkit-justify-content: space-between; + justify-content: space-between; + width: 50%; + max-width: 200px; + -webkit-box-flex: 10; + -webkit-flex-shrink: 10; + -ms-flex: 0 10 auto; + flex-shrink: 10; +} +.picker-calendar-month-picker span, +.picker-calendar-year-picker span { + -webkit-box-flex: 1; + -webkit-flex-shrink: 1; + -ms-flex: 0 1 auto; + flex-shrink: 1; + position: relative; + overflow: hidden; + text-overflow: ellipsis; + width: 100%; + text-align: center; +} +/* === Notifications === */ +.notifications { + position: absolute; + left: 0; + bottom: 0; + width: 100%; + z-index: 10900; + color: #fff; + font-size: 14px; + margin: 0; + border: none; + display: none; + box-sizing: border-box; + max-height: 100%; + overflow: auto; + -webkit-overflow-scrolling: touch; + -webkit-transition-duration: 450ms; + transition-duration: 450ms; + -webkit-perspective: 1200px; + perspective: 1200px; +} +.notifications.list-block > ul { + max-width: 568px; + background: #323232; + margin: 0 auto; +} +.notifications.list-block > ul:before { + display: none; +} +.notifications.list-block > ul:after { + display: none; +} +.notifications .item-content { + -webkit-box-align: start; + -ms-flex-align: start; + -webkit-align-items: flex-start; + align-items: flex-start; + padding-left: 24px; +} +.notifications .item-title { + font-size: 14px; + font-weight: normal; + white-space: normal; + padding-top: 14px; + padding-bottom: 14px; +} +.notifications .item-inner { + padding-right: 24px; + padding-top: 0; + padding-bottom: 0; +} +.notifications .item-inner:after { + display: none; +} +.notifications .item-after { + max-height: none; + margin-left: 16px; +} +.notifications .button.close-notification { + color: #48aeff; +} +.notifications .notification-item { + margin: 0 auto; + -webkit-transition-duration: 450ms; + transition-duration: 450ms; + -webkit-transition-delay: 100ms; + transition-delay: 100ms; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + opacity: 1; +} +.notifications .notification-hidden { + opacity: 0; + -webkit-transition-delay: 0ms; + transition-delay: 0ms; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +.notifications .notification-item-removing { + -webkit-transition-delay: 0ms; + transition-delay: 0ms; +} +@media (min-width: 569px) { + .notifications.list-block > ul { + border-radius: 2px; + width: auto; + min-width: 288px; + } +} +/* === Login screen === */ +.login-screen-content { + background: #fff; +} +.login-screen-content .login-screen-title, +.login-screen-content .list-block, +.login-screen-content .content-block, +.login-screen-content .list-block-label { + max-width: 480px; + margin: 24px auto; +} +.login-screen-content .list-block ul { + background: none; +} +.login-screen-content .list-block ul:before { + display: none; +} +.login-screen-content .list-block ul:after { + display: none; +} +.login-screen-content .list-block-label { + text-align: center; +} +.navbar-fixed .page .login-screen-content { + padding-top: 0; +} +.login-screen-title { + text-align: center; + font-size: 34px; +} +/* === Touch ripple === */ +.ripple, +a.floating-button, +.floating-button > a, +a.link, +a.item-link, +.button, +.modal-button, +.tab-link, +.label-radio, +.label-checkbox, +.actions-modal-button, +.speed-dial-buttons a { + -webkit-user-select: none; + user-select: none; +} +.ripple-wave { + left: 0; + top: 0; + position: absolute !important; + border-radius: 50%; + pointer-events: none; + z-index: -1; + background: rgba(0, 0, 0, 0.1); + padding: 0; + margin: 0; + font-size: 0; + -webkit-transform: translate3d(0px, 0px, 0) scale(0); + transform: translate3d(0px, 0px, 0) scale(0); + -webkit-transition-duration: 1400ms; + transition-duration: 1400ms; +} +.ripple-wave.ripple-wave-fill { + -webkit-transition-duration: 300ms; + transition-duration: 300ms; + opacity: 0.35; +} +.ripple-wave.ripple-wave-out { + -webkit-transition-duration: 600ms; + transition-duration: 600ms; + opacity: 0; +} +.button-fill .ripple-wave, +.picker-calendar-day .ripple-wave { + z-index: 1; +} +.button-fill .ripple-wave, +.navbar .ripple-wave, +.toolbar .ripple-wave, +.subnavbar .ripple-wave, +.searchbar .ripple-wave, +.notifications .ripple-wave, +.floating-button .ripple-wave, +.speed-dial-buttons a .ripple-wave { + background: rgba(255, 255, 255, 0.3); +} +.messagebar .ripple-wave { + background: rgba(0, 0, 0, 0.1); +} +/* === Disabled elements === */ +.disabled, +[disabled] { + opacity: 0.55; + pointer-events: none; +} +.disabled .disabled, +.disabled [disabled], +[disabled] .disabled, +[disabled] [disabled] { + opacity: 1; +} diff --git a/www/libs/framework7/css/framework7.material.rtl.css b/www/libs/framework7/css/framework7.material.rtl.css new file mode 100644 index 0000000..d86b7ae --- /dev/null +++ b/www/libs/framework7/css/framework7.material.rtl.css @@ -0,0 +1,555 @@ +/** + * Framework7 1.4.2 + * Full Featured Mobile HTML Framework For Building iOS & Android Apps + * + * Google Material Theme + * + * http://www.idangero.us/framework7 + * + * Copyright 2016, Vladimir Kharlampidi + * The iDangero.us + * http://www.idangero.us/ + * + * Licensed under MIT + * + * Released on: June 26, 2016 + */ +/*============= + Framework 7 RTL Additions +=============*/ +html { + direction: rtl; +} +/* === Lists === */ +.list-block ul ul { + padding-left: 0; + padding-right: 56px; +} +.list-block .item-content { + padding-left: 0; + padding-right: 16px; +} +.list-block .item-inner { + padding-right: 0; + padding-left: 16px; +} +.list-block .item-after { + margin-left: 0; + margin-right: 8px; +} +.list-block .item-media i + i, +.list-block .item-media i + img { + margin-left: 0; + margin-right: 8px; +} +.list-block .item-media + .item-inner { + margin-left: 0; + margin-right: 16px; +} +.list-block .item-link .item-inner { + padding-right: 0; + padding-left: 42px; + background-position: 16px center; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%2060%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'm60%2061.5-38.25%2038.25-9.75-9.75%2029.25-28.5-29.25-28.5%209.75-9.75z'%20fill%3D'%23c7c7cc'%20transform%3D'translate(60%2C120)%20rotate(180)'%2F%3E%3C%2Fsvg%3E"); +} +.list-block.media-list .item-link .item-inner, +.list-block li.media-item .item-link .item-inner { + padding-right: 0; + padding-left: 16px; +} +.list-block.media-list .item-link .item-title-row, +.list-block li.media-item .item-link .item-title-row { + padding-right: 0; + padding-left: 26px; + background-position: center left; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%2060%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'm60%2061.5-38.25%2038.25-9.75-9.75%2029.25-28.5-29.25-28.5%209.75-9.75z'%20fill%3D'%23c7c7cc'%20transform%3D'translate(60%2C120)%20rotate(180)'%2F%3E%3C%2Fsvg%3E"); +} +.list-block .sortable-handler { + right: auto; + left: 0; +} +.list-block.sortable-opened .item-inner, +.list-block.sortable-opened .item-link .item-inner { + padding-right: 0; + padding-left: 50px; +} +.list-block.sortable-opened .item-link .item-inner, +.list-block.sortable-opened .item-link .item-title-row { + background-image: none; +} +.list-block .swipeout-actions-left, +.list-block .swipeout-actions-right { + direction: ltr; +} +/* === Toolbars === */ +.navbar a.link i + span, +.toolbar a.link i + span, +.navbar a.link i + i, +.toolbar a.link i + i, +.navbar a.link span + i, +.toolbar a.link span + i, +.navbar a.link span + span, +.toolbar a.link span + span { + margin-left: 0; + margin-right: 8px; +} +.navbar .right { + margin-left: 0; + margin-right: auto; +} +.tabbar .tab-link-highlight { + left: auto; + right: 0; +} +/* === Forms === */ +.list-block input[type="text"], +.list-block input[type="password"], +.list-block input[type="search"], +.list-block input[type="email"], +.list-block input[type="tel"], +.list-block input[type="url"], +.list-block input[type="date"], +.list-block input[type="datetime-local"], +.list-block input[type="time"], +.list-block input[type="number"], +.list-block select, +.list-block textarea { + text-align: right; +} +.buttons-row .button { + margin-left: 0; + margin-right: 8px; +} +.buttons-row .button:first-child { + margin-right: 0; +} +.label-switch .checkbox:after { + left: auto; + right: 0; +} +.label-switch input[type="checkbox"]:checked + .checkbox:after { + -webkit-transform: translateX(-16px); + transform: translateX(-16px); +} +.range-slider input[type="range"]::-webkit-slider-thumb:before { + right: auto; + left: 100%; +} +label.label-checkbox .item-after i.icon-form-checkbox, +label.label-radio .item-after i.icon-form-checkbox, +label.label-checkbox .item-after i.icon-form-radio, +label.label-radio .item-after i.icon-form-radio { + margin-left: 16px; + margin-right: 8px; +} +/* === Search Bar === */ +.searchbar input[type="search"] { + background-position: right center; + padding: 0 24px 0 36px; +} +.searchbar .searchbar-clear { + right: auto; + left: -16px; +} +/* === Modals === */ +.modal-button + .modal-button { + margin-left: 0; + margin-right: 4px; +} +/* === Content Block === */ +.content-block-inner { + margin-left: 0; + margin-right: -16px; +} +/* === Messages === */ +.message-received { + -ms-flex-item-align: end; + -webkit-align-self: flex-end; + align-self: flex-end; + -webkit-box-align: end; + -ms-flex-align: end; + -webkit-align-items: flex-end; + align-items: flex-end; +} +.message-sent { + -ms-flex-item-align: start; + -webkit-align-self: flex-start; + align-self: flex-start; + -webkit-box-align: start; + -ms-flex-align: start; + -webkit-align-items: flex-start; + align-items: flex-start; +} +/* === Accordion === */ +.list-block .accordion-toggle .item-inner { + padding-right: 0; + padding-left: 42px; + background-position: 16px center; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%2060%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'm60%2061.5-38.25%2038.25-9.75-9.75%2029.25-28.5-29.25-28.5%209.75-9.75z'%20fill%3D'%23c7c7cc'%20transform%3D'translate(60%2C120)%20rotate(180)'%2F%3E%3C%2Fsvg%3E"); +} +.list-block:not(.media-list) .accordion-item-expanded:not(.media-item) .accordion-item-toggle .item-inner, +.list-block:not(.media-list) .accordion-item-expanded:not(.media-item) > .item-link .item-inner, +.list-block.media-list .accordion-item-expanded .accordion-item-toggle .item-title-row, +.list-block.media-list .accordion-item-expanded > .item-link .item-title-row, +.list-block .accordion-item-expanded.media-item .accordion-item-toggle .item-title-row, +.list-block .accordion-item-expanded.media-item > .item-link .item-title-row { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%2060%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'm60%2061.5-38.25%2038.25-9.75-9.75%2029.25-28.5-29.25-28.5%209.75-9.75z'%20transform%3D'translate(70%2C%2030)%20rotate(90)'%20fill%3D'%23c7c7cc'%2F%3E%3C%2Fsvg%3E"); + background-size: 20px 20px; +} +.list-block .accordion-item ul { + padding-right: 0; +} +/* === Icons === */ +.contacts-block li:not(.list-group-title) { + padding-left: 0; + padding-right: 56px; +} +/* === Icons === */ +i.icon.icon-back { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-forward { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-red, +i.icon-back.theme-red { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23f44336'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-red, +i.icon-forward.theme-red { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23f44336'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-next.color-red, +i.icon-next.theme-red { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23f44336'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-red, +i.icon-prev.theme-red { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23f44336'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-pink, +i.icon-back.theme-pink { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23e91e63'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-pink, +i.icon-forward.theme-pink { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23e91e63'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-next.color-pink, +i.icon-next.theme-pink { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23e91e63'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-pink, +i.icon-prev.theme-pink { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23e91e63'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-purple, +i.icon-back.theme-purple { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%239c27b0'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-purple, +i.icon-forward.theme-purple { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%239c27b0'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-next.color-purple, +i.icon-next.theme-purple { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%239c27b0'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-purple, +i.icon-prev.theme-purple { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%239c27b0'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-deeppurple, +i.icon-back.theme-deeppurple { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23673ab7'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-deeppurple, +i.icon-forward.theme-deeppurple { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23673ab7'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-next.color-deeppurple, +i.icon-next.theme-deeppurple { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23673ab7'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-deeppurple, +i.icon-prev.theme-deeppurple { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23673ab7'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-indigo, +i.icon-back.theme-indigo { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%233f51b5'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-indigo, +i.icon-forward.theme-indigo { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%233f51b5'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-next.color-indigo, +i.icon-next.theme-indigo { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%233f51b5'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-indigo, +i.icon-prev.theme-indigo { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%233f51b5'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-blue, +i.icon-back.theme-blue { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%232196f3'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-blue, +i.icon-forward.theme-blue { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%232196f3'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-next.color-blue, +i.icon-next.theme-blue { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%232196f3'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-blue, +i.icon-prev.theme-blue { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%232196f3'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-lightblue, +i.icon-back.theme-lightblue { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%2303a9f4'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-lightblue, +i.icon-forward.theme-lightblue { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%2303a9f4'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-next.color-lightblue, +i.icon-next.theme-lightblue { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%2303a9f4'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-lightblue, +i.icon-prev.theme-lightblue { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%2303a9f4'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-cyan, +i.icon-back.theme-cyan { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%2300bcd4'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-cyan, +i.icon-forward.theme-cyan { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%2300bcd4'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-next.color-cyan, +i.icon-next.theme-cyan { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%2300bcd4'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-cyan, +i.icon-prev.theme-cyan { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%2300bcd4'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-teal, +i.icon-back.theme-teal { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23009688'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-teal, +i.icon-forward.theme-teal { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23009688'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-next.color-teal, +i.icon-next.theme-teal { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23009688'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-teal, +i.icon-prev.theme-teal { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23009688'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-green, +i.icon-back.theme-green { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%234caf50'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-green, +i.icon-forward.theme-green { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%234caf50'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-next.color-green, +i.icon-next.theme-green { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%234caf50'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-green, +i.icon-prev.theme-green { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%234caf50'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-lightgreen, +i.icon-back.theme-lightgreen { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%238bc34a'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-lightgreen, +i.icon-forward.theme-lightgreen { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%238bc34a'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-next.color-lightgreen, +i.icon-next.theme-lightgreen { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%238bc34a'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-lightgreen, +i.icon-prev.theme-lightgreen { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%238bc34a'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-lime, +i.icon-back.theme-lime { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23cddc39'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-lime, +i.icon-forward.theme-lime { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23cddc39'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-next.color-lime, +i.icon-next.theme-lime { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23cddc39'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-lime, +i.icon-prev.theme-lime { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23cddc39'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-yellow, +i.icon-back.theme-yellow { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23ffeb3b'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-yellow, +i.icon-forward.theme-yellow { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23ffeb3b'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-next.color-yellow, +i.icon-next.theme-yellow { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffeb3b'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-yellow, +i.icon-prev.theme-yellow { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffeb3b'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-amber, +i.icon-back.theme-amber { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23ffc107'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-amber, +i.icon-forward.theme-amber { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23ffc107'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-next.color-amber, +i.icon-next.theme-amber { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffc107'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-amber, +i.icon-prev.theme-amber { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffc107'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-orange, +i.icon-back.theme-orange { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23ff9800'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-orange, +i.icon-forward.theme-orange { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23ff9800'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-next.color-orange, +i.icon-next.theme-orange { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ff9800'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-orange, +i.icon-prev.theme-orange { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ff9800'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-deeporange, +i.icon-back.theme-deeporange { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23ff5722'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-deeporange, +i.icon-forward.theme-deeporange { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23ff5722'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-next.color-deeporange, +i.icon-next.theme-deeporange { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ff5722'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-deeporange, +i.icon-prev.theme-deeporange { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ff5722'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-brown, +i.icon-back.theme-brown { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23795548'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-brown, +i.icon-forward.theme-brown { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23795548'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-next.color-brown, +i.icon-next.theme-brown { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23795548'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-brown, +i.icon-prev.theme-brown { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23795548'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-gray, +i.icon-back.theme-gray { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%239e9e9e'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-gray, +i.icon-forward.theme-gray { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%239e9e9e'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-next.color-gray, +i.icon-next.theme-gray { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%239e9e9e'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-gray, +i.icon-prev.theme-gray { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%239e9e9e'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-bluegray, +i.icon-back.theme-bluegray { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23607d8b'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-bluegray, +i.icon-forward.theme-bluegray { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23607d8b'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-next.color-bluegray, +i.icon-next.theme-bluegray { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23607d8b'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-bluegray, +i.icon-prev.theme-bluegray { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23607d8b'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-white, +i.icon-back.theme-white { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-white, +i.icon-forward.theme-white { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-next.color-white, +i.icon-next.theme-white { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-white, +i.icon-prev.theme-white { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-back.color-black, +i.icon-back.theme-black { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-forward.color-black, +i.icon-forward.theme-black { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-next.color-black, +i.icon-next.theme-black { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23000000'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} +i.icon-prev.color-black, +i.icon-prev.theme-black { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23000000'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E"); +} diff --git a/www/libs/framework7/css/my-app.css b/www/libs/framework7/css/my-app.css new file mode 100644 index 0000000..e69de29 diff --git a/www/libs/framework7/form.html b/www/libs/framework7/form.html new file mode 100644 index 0000000..8ca2497 --- /dev/null +++ b/www/libs/framework7/form.html @@ -0,0 +1,229 @@ + + + + +
+ +
+ +
+
Form Example
+
+
    +
  • +
    +
    +
    +
    Name
    +
    + +
    +
    +
    +
  • +
  • +
    +
    +
    +
    E-mail
    +
    + +
    +
    +
    +
  • +
  • +
    +
    +
    +
    URL
    +
    + +
    +
    +
    +
  • +
  • +
    +
    +
    +
    Password
    +
    + +
    +
    +
    +
  • +
  • +
    +
    +
    +
    Phone
    +
    + +
    +
    +
    +
  • +
  • +
    +
    +
    +
    Gender
    +
    + +
    +
    +
    +
  • +
  • +
    +
    +
    +
    Birth date
    +
    + +
    +
    +
    +
  • +
  • +
    +
    +
    +
    Switch
    +
    + +
    +
    +
    +
  • +
  • +
    +
    +
    +
    Slider
    +
    +
    + +
    +
    +
    +
    +
  • +
  • +
    +
    +
    +
    Textarea
    +
    + +
    +
    +
    +
  • +
+
+
+
+ +
+ +
+
+
+
Checkbox group
+
+
    +
  • + +
  • +
  • + +
  • +
  • + +
  • +
  • + +
  • +
+
+
Radio buttons group
+
+
    +
  • + +
  • +
  • + +
  • +
  • + +
  • +
  • + +
  • +
+
+
+
+
\ No newline at end of file diff --git a/www/libs/framework7/img/i-f7-ios.png b/www/libs/framework7/img/i-f7-ios.png new file mode 100644 index 0000000..1075355 Binary files /dev/null and b/www/libs/framework7/img/i-f7-ios.png differ diff --git a/www/libs/framework7/img/i-f7-material.png b/www/libs/framework7/img/i-f7-material.png new file mode 100644 index 0000000..aa306df Binary files /dev/null and b/www/libs/framework7/img/i-f7-material.png differ diff --git a/www/libs/framework7/img/i-form-calendar-ios.svg b/www/libs/framework7/img/i-form-calendar-ios.svg new file mode 100644 index 0000000..3f1a490 --- /dev/null +++ b/www/libs/framework7/img/i-form-calendar-ios.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/www/libs/framework7/img/i-form-calendar-material.svg b/www/libs/framework7/img/i-form-calendar-material.svg new file mode 100644 index 0000000..71199bc --- /dev/null +++ b/www/libs/framework7/img/i-form-calendar-material.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/www/libs/framework7/img/i-form-comment-ios.svg b/www/libs/framework7/img/i-form-comment-ios.svg new file mode 100644 index 0000000..da90b56 --- /dev/null +++ b/www/libs/framework7/img/i-form-comment-ios.svg @@ -0,0 +1,10 @@ + + + + + + + + + + \ No newline at end of file diff --git a/www/libs/framework7/img/i-form-comment-material.svg b/www/libs/framework7/img/i-form-comment-material.svg new file mode 100644 index 0000000..e442a26 --- /dev/null +++ b/www/libs/framework7/img/i-form-comment-material.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/www/libs/framework7/img/i-form-email-ios.svg b/www/libs/framework7/img/i-form-email-ios.svg new file mode 100644 index 0000000..6e909db --- /dev/null +++ b/www/libs/framework7/img/i-form-email-ios.svg @@ -0,0 +1,13 @@ + + + + + + + + + + + + + \ No newline at end of file diff --git a/www/libs/framework7/img/i-form-email-material.svg b/www/libs/framework7/img/i-form-email-material.svg new file mode 100644 index 0000000..5f65bf2 --- /dev/null +++ b/www/libs/framework7/img/i-form-email-material.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/www/libs/framework7/img/i-form-gender-ios.svg b/www/libs/framework7/img/i-form-gender-ios.svg new file mode 100644 index 0000000..665683a --- /dev/null +++ b/www/libs/framework7/img/i-form-gender-ios.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/www/libs/framework7/img/i-form-gender-material.svg b/www/libs/framework7/img/i-form-gender-material.svg new file mode 100644 index 0000000..bff9246 --- /dev/null +++ b/www/libs/framework7/img/i-form-gender-material.svg @@ -0,0 +1,8 @@ + + + diff --git a/www/libs/framework7/img/i-form-name-ios.svg b/www/libs/framework7/img/i-form-name-ios.svg new file mode 100644 index 0000000..2f68f7c --- /dev/null +++ b/www/libs/framework7/img/i-form-name-ios.svg @@ -0,0 +1,10 @@ + + + + + + + + + + \ No newline at end of file diff --git a/www/libs/framework7/img/i-form-name-material.svg b/www/libs/framework7/img/i-form-name-material.svg new file mode 100644 index 0000000..b131a49 --- /dev/null +++ b/www/libs/framework7/img/i-form-name-material.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/www/libs/framework7/img/i-form-password-ios.svg b/www/libs/framework7/img/i-form-password-ios.svg new file mode 100644 index 0000000..2c2ada7 --- /dev/null +++ b/www/libs/framework7/img/i-form-password-ios.svg @@ -0,0 +1,13 @@ + + + + + + + + + + + + + \ No newline at end of file diff --git a/www/libs/framework7/img/i-form-password-material.svg b/www/libs/framework7/img/i-form-password-material.svg new file mode 100644 index 0000000..91aa484 --- /dev/null +++ b/www/libs/framework7/img/i-form-password-material.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/www/libs/framework7/img/i-form-settings-ios.svg b/www/libs/framework7/img/i-form-settings-ios.svg new file mode 100644 index 0000000..027e357 --- /dev/null +++ b/www/libs/framework7/img/i-form-settings-ios.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + \ No newline at end of file diff --git a/www/libs/framework7/img/i-form-settings-material.svg b/www/libs/framework7/img/i-form-settings-material.svg new file mode 100644 index 0000000..5cbbfce --- /dev/null +++ b/www/libs/framework7/img/i-form-settings-material.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/www/libs/framework7/img/i-form-tel-ios.svg b/www/libs/framework7/img/i-form-tel-ios.svg new file mode 100644 index 0000000..17b4313 --- /dev/null +++ b/www/libs/framework7/img/i-form-tel-ios.svg @@ -0,0 +1,10 @@ + + + + + + + + + + \ No newline at end of file diff --git a/www/libs/framework7/img/i-form-tel-material.svg b/www/libs/framework7/img/i-form-tel-material.svg new file mode 100644 index 0000000..7967a0b --- /dev/null +++ b/www/libs/framework7/img/i-form-tel-material.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/www/libs/framework7/img/i-form-toggle-ios.svg b/www/libs/framework7/img/i-form-toggle-ios.svg new file mode 100644 index 0000000..7d9022f --- /dev/null +++ b/www/libs/framework7/img/i-form-toggle-ios.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/www/libs/framework7/img/i-form-toggle-material.svg b/www/libs/framework7/img/i-form-toggle-material.svg new file mode 100644 index 0000000..18fa019 --- /dev/null +++ b/www/libs/framework7/img/i-form-toggle-material.svg @@ -0,0 +1,5 @@ + + + diff --git a/www/libs/framework7/img/i-form-url-ios.svg b/www/libs/framework7/img/i-form-url-ios.svg new file mode 100644 index 0000000..0aec9fc --- /dev/null +++ b/www/libs/framework7/img/i-form-url-ios.svg @@ -0,0 +1,28 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/www/libs/framework7/img/i-form-url-material.svg b/www/libs/framework7/img/i-form-url-material.svg new file mode 100644 index 0000000..729fc46 --- /dev/null +++ b/www/libs/framework7/img/i-form-url-material.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/www/libs/framework7/index.html b/www/libs/framework7/index.html new file mode 100644 index 0000000..ae9754e --- /dev/null +++ b/www/libs/framework7/index.html @@ -0,0 +1,103 @@ + + + + + + + + My App + + + + + + + + +
+ +
+ +
+
+

Left panel content goes here

+
+
+ +
+
+

Right panel content goes here

+
+
+ +
+ +
+ + + + + + +
+
+ + + + + + \ No newline at end of file diff --git a/www/libs/framework7/js/framework7.js b/www/libs/framework7/js/framework7.js new file mode 100644 index 0000000..3162fa1 --- /dev/null +++ b/www/libs/framework7/js/framework7.js @@ -0,0 +1,16755 @@ +/** + * Framework7 1.4.2 + * Full Featured Mobile HTML Framework For Building iOS & Android Apps + * + * http://www.idangero.us/framework7 + * + * Copyright 2016, Vladimir Kharlampidi + * The iDangero.us + * http://www.idangero.us/ + * + * Licensed under MIT + * + * Released on: June 26, 2016 + */ +(function () { + + 'use strict'; + /*=========================== + Framework 7 + ===========================*/ + window.Framework7 = function (params) { + // App + var app = this; + + // Version + app.version = '1.4.2'; + + // Default Parameters + app.params = { + cache: true, + cacheIgnore: [], + cacheIgnoreGetParameters: false, + cacheDuration: 1000 * 60 * 10, // Ten minutes + preloadPreviousPage: true, + uniqueHistory: false, + uniqueHistoryIgnoreGetParameters: false, + dynamicPageUrl: 'content-{{index}}', + allowDuplicateUrls: false, + router: true, + // Push State + pushState: false, + pushStateRoot: undefined, + pushStateNoAnimation: false, + pushStateSeparator: '#!/', + pushStateOnLoad: true, + // Fast clicks + fastClicks: true, + fastClicksDistanceThreshold: 10, + fastClicksDelayBetweenClicks: 50, + fastClicksExclude: '', // CSS selector + // Tap Hold + tapHold: false, + tapHoldDelay: 750, + tapHoldPreventClicks: true, + // Active State + activeState: true, + activeStateElements: 'a, button, label, span', + // Animate Nav Back Icon + animateNavBackIcon: false, + // Swipe Back + swipeBackPage: true, + swipeBackPageThreshold: 0, + swipeBackPageActiveArea: 30, + swipeBackPageAnimateShadow: true, + swipeBackPageAnimateOpacity: true, + // Ajax + ajaxLinks: undefined, // or CSS selector + // External Links + externalLinks: '.external', // CSS selector + // Sortable + sortable: true, + // Scroll toolbars + hideNavbarOnPageScroll: false, + hideToolbarOnPageScroll: false, + hideTabbarOnPageScroll: false, + showBarsOnPageScrollEnd: true, + showBarsOnPageScrollTop: true, + // Swipeout + swipeout: true, + swipeoutActionsNoFold: false, + swipeoutNoFollow: false, + // Smart Select Back link template + smartSelectOpenIn: 'page', // or 'popup' or 'picker' + smartSelectBackText: 'Back', + smartSelectPopupCloseText: 'Close', + smartSelectPickerCloseText: 'Done', + smartSelectSearchbar: false, + smartSelectBackOnSelect: false, + // Tap Navbar or Statusbar to scroll to top + scrollTopOnNavbarClick: false, + scrollTopOnStatusbarClick: false, + // Panels + swipePanel: false, // or 'left' or 'right' + swipePanelActiveArea: 0, + swipePanelCloseOpposite: true, + swipePanelOnlyClose: false, + swipePanelNoFollow: false, + swipePanelThreshold: 0, + panelsCloseByOutside: true, + // Modals + modalButtonOk: 'OK', + modalButtonCancel: 'Cancel', + modalUsernamePlaceholder: 'Username', + modalPasswordPlaceholder: 'Password', + modalTitle: 'Framework7', + modalCloseByOutside: false, + actionsCloseByOutside: true, + popupCloseByOutside: true, + modalPreloaderTitle: 'Loading... ', + modalStack: true, + // Lazy Load + imagesLazyLoadThreshold: 0, + imagesLazyLoadSequential: true, + // Name space + viewClass: 'view', + viewMainClass: 'view-main', + viewsClass: 'views', + // Notifications defaults + notificationCloseOnClick: false, + notificationCloseIcon: true, + notificationCloseButtonText: 'Close', + // Animate Pages + animatePages: true, + // Template7 + templates: {}, + template7Data: {}, + template7Pages: false, + precompileTemplates: false, + // Material + material: false, + materialPageLoadDelay: 0, + materialPreloaderSvg: '', + materialPreloaderHtml: + '' + + '' + + '' + + '' + + '' + + '' + + '' + + '' + + '', + materialRipple: true, + materialRippleElements: '.ripple, a.link, a.item-link, .button, .modal-button, .tab-link, .label-radio, .label-checkbox, .actions-modal-button, a.searchbar-clear, a.floating-button, .floating-button > a, .speed-dial-buttons a', + // Auto init + init: true, + }; + + // Extend defaults with parameters + for (var param in params) { + app.params[param] = params[param]; + } + + // DOM lib + var $ = Dom7; + + // Template7 lib + var t7 = Template7; + app._compiledTemplates = {}; + + // Touch events + app.touchEvents = { + start: app.support.touch ? 'touchstart' : 'mousedown', + move: app.support.touch ? 'touchmove' : 'mousemove', + end: app.support.touch ? 'touchend' : 'mouseup' + }; + + // Link to local storage + app.ls = window.localStorage; + + // RTL + app.rtl = $('body').css('direction') === 'rtl'; + if (app.rtl) $('html').attr('dir', 'rtl'); + + // Overwrite statusbar overlay + if (typeof app.params.statusbarOverlay !== 'undefined') { + if (app.params.statusbarOverlay) $('html').addClass('with-statusbar-overlay'); + else $('html').removeClass('with-statusbar-overlay'); + } + + /*====================================================== + ************ Views ************ + ======================================================*/ + app.views = []; + var View = function (selector, params) { + var defaults = { + dynamicNavbar: false, + domCache: false, + linksView: undefined, + reloadPages: false, + uniqueHistory: app.params.uniqueHistory, + uniqueHistoryIgnoreGetParameters: app.params.uniqueHistoryIgnoreGetParameters, + allowDuplicateUrls: app.params.allowDuplicateUrls, + swipeBackPage: app.params.swipeBackPage, + swipeBackPageAnimateShadow: app.params.swipeBackPageAnimateShadow, + swipeBackPageAnimateOpacity: app.params.swipeBackPageAnimateOpacity, + swipeBackPageActiveArea: app.params.swipeBackPageActiveArea, + swipeBackPageThreshold: app.params.swipeBackPageThreshold, + animatePages: app.params.animatePages, + preloadPreviousPage: app.params.preloadPreviousPage + }; + var i; + + // Params + params = params || {}; + + // Disable dynamic navbar for material theme + if (params.dynamicNavbar && app.params.material) params.dynamicNavbar = false; + + // Extend params with defaults + for (var def in defaults) { + if (typeof params[def] === 'undefined') { + params[def] = defaults[def]; + } + } + // View + var view = this; + view.params = params; + + // Selector + view.selector = selector; + + // Container + var container = $(selector); + view.container = container[0]; + + // Fix Selector + + if (typeof selector !== 'string') { + // Supposed to be HTMLElement or Dom7 + selector = (container.attr('id') ? '#' + container.attr('id') : '') + (container.attr('class') ? '.' + container.attr('class').replace(/ /g, '.').replace('.active', '') : ''); + view.selector = selector; + } + + // Is main + view.main = container.hasClass(app.params.viewMainClass); + + // Content cache + view.contentCache = {}; + + // Pages cache + view.pagesCache = {}; + + // Store View in element for easy access + container[0].f7View = view; + + // Pages + view.pagesContainer = container.find('.pages')[0]; + view.initialPages = []; + view.initialPagesUrl = []; + view.initialNavbars = []; + if (view.params.domCache) { + var initialPages = container.find('.page'); + for (i = 0; i < initialPages.length; i++) { + view.initialPages.push(initialPages[i]); + view.initialPagesUrl.push('#' + initialPages.eq(i).attr('data-page')); + } + if (view.params.dynamicNavbar) { + var initialNavbars = container.find('.navbar-inner'); + for (i = 0; i < initialNavbars.length; i++) { + view.initialNavbars.push(initialNavbars[i]); + } + } + + } + + view.allowPageChange = true; + + // Location + var docLocation = document.location.href; + + // History + view.history = []; + var viewURL = docLocation; + var pushStateSeparator = app.params.pushStateSeparator; + var pushStateRoot = app.params.pushStateRoot; + if (app.params.pushState && view.main) { + if (pushStateRoot) { + viewURL = pushStateRoot; + } + else { + if (viewURL.indexOf(pushStateSeparator) >= 0 && viewURL.indexOf(pushStateSeparator + '#') < 0) viewURL = viewURL.split(pushStateSeparator)[0]; + } + + } + + // Active Page + var currentPage, currentPageData; + if (!view.activePage) { + currentPage = $(view.pagesContainer).find('.page-on-center'); + if (currentPage.length === 0) { + currentPage = $(view.pagesContainer).find('.page:not(.cached)'); + currentPage = currentPage.eq(currentPage.length - 1); + } + if (currentPage.length > 0) { + currentPageData = currentPage[0].f7PageData; + } + } + + // View startup URL + if (view.params.domCache && currentPage) { + view.url = container.attr('data-url') || view.params.url || '#' + currentPage.attr('data-page'); + view.pagesCache[view.url] = currentPage.attr('data-page'); + } + else view.url = container.attr('data-url') || view.params.url || viewURL; + + // Update current page Data + if (currentPageData) { + currentPageData.view = view; + currentPageData.url = view.url; + if (view.params.domCache && view.params.dynamicNavbar && !currentPageData.navbarInnerContainer) { + currentPageData.navbarInnerContainer = view.initialNavbars[view.initialPages.indexOf(currentPageData.container)]; + } + view.activePage = currentPageData; + currentPage[0].f7PageData = currentPageData; + } + + // Store to history main view's url + if (view.url) { + view.history.push(view.url); + } + + // Touch events + var isTouched = false, + isMoved = false, + touchesStart = {}, + isScrolling, + activePage = [], + previousPage = [], + viewContainerWidth, + touchesDiff, + allowViewTouchMove = true, + touchStartTime, + activeNavbar = [], + previousNavbar = [], + activeNavElements, + previousNavElements, + activeNavBackIcon, + previousNavBackIcon, + dynamicNavbar, + pageShadow, + el; + + view.handleTouchStart = function (e) { + if (!allowViewTouchMove || !view.params.swipeBackPage || isTouched || app.swipeoutOpenedEl || !view.allowPageChange) return; + isMoved = false; + isTouched = true; + isScrolling = undefined; + touchesStart.x = e.type === 'touchstart' ? e.targetTouches[0].pageX : e.pageX; + touchesStart.y = e.type === 'touchstart' ? e.targetTouches[0].pageY : e.pageY; + touchStartTime = (new Date()).getTime(); + dynamicNavbar = view.params.dynamicNavbar && container.find('.navbar-inner').length > 1; + }; + + view.handleTouchMove = function (e) { + if (!isTouched) return; + var pageX = e.type === 'touchmove' ? e.targetTouches[0].pageX : e.pageX; + var pageY = e.type === 'touchmove' ? e.targetTouches[0].pageY : e.pageY; + if (typeof isScrolling === 'undefined') { + isScrolling = !!(isScrolling || Math.abs(pageY - touchesStart.y) > Math.abs(pageX - touchesStart.x)); + } + if (isScrolling || e.f7PreventSwipeBack || app.preventSwipeBack) { + isTouched = false; + return; + } + if (!isMoved) { + var cancel = false; + // Calc values during first move fired + viewContainerWidth = container.width(); + var target = $(e.target); + var swipeout = target.hasClass('swipeout') ? target : target.parents('.swipeout'); + if (swipeout.length > 0) { + if (!app.rtl && swipeout.find('.swipeout-actions-left').length > 0) cancel = true; + if (app.rtl && swipeout.find('.swipeout-actions-right').length > 0) cancel = true; + } + activePage = target.is('.page') ? target : target.parents('.page'); + if (activePage.hasClass('no-swipeback')) cancel = true; + previousPage = container.find('.page-on-left:not(.cached)'); + var notFromBorder = touchesStart.x - container.offset().left > view.params.swipeBackPageActiveArea; + if (app.rtl) { + notFromBorder = touchesStart.x < container.offset().left - container[0].scrollLeft + viewContainerWidth - view.params.swipeBackPageActiveArea; + } + else { + notFromBorder = touchesStart.x - container.offset().left > view.params.swipeBackPageActiveArea; + } + if (notFromBorder) cancel = true; + if (previousPage.length === 0 || activePage.length === 0) cancel = true; + if (cancel) { + isTouched = false; + return; + } + + if (view.params.swipeBackPageAnimateShadow && !app.device.android) { + pageShadow = activePage.find('.swipeback-page-shadow'); + if (pageShadow.length === 0) { + pageShadow = $('
'); + activePage.append(pageShadow); + } + } + + if (dynamicNavbar) { + activeNavbar = container.find('.navbar-on-center:not(.cached)'); + previousNavbar = container.find('.navbar-on-left:not(.cached)'); + activeNavElements = activeNavbar.find('.left, .center, .right, .subnavbar, .fading'); + previousNavElements = previousNavbar.find('.left, .center, .right, .subnavbar, .fading'); + if (app.params.animateNavBackIcon) { + activeNavBackIcon = activeNavbar.find('.left.sliding .back .icon'); + previousNavBackIcon = previousNavbar.find('.left.sliding .back .icon'); + } + } + + // Close/Hide Any Picker + if ($('.picker-modal.modal-in').length > 0) { + app.closeModal($('.picker-modal.modal-in')); + } + } + e.f7PreventPanelSwipe = true; + isMoved = true; + e.preventDefault(); + + // RTL inverter + var inverter = app.rtl ? -1 : 1; + + // Touches diff + touchesDiff = (pageX - touchesStart.x - view.params.swipeBackPageThreshold) * inverter; + if (touchesDiff < 0) touchesDiff = 0; + var percentage = touchesDiff / viewContainerWidth; + + // Swipe Back Callback + var callbackData = { + percentage: percentage, + activePage: activePage[0], + previousPage: previousPage[0], + activeNavbar: activeNavbar[0], + previousNavbar: previousNavbar[0] + }; + if (view.params.onSwipeBackMove) { + view.params.onSwipeBackMove(callbackData); + } + container.trigger('swipeBackMove', callbackData); + + // Transform pages + var activePageTranslate = touchesDiff * inverter; + var previousPageTranslate = (touchesDiff / 5 - viewContainerWidth / 5) * inverter; + if (app.device.pixelRatio === 1) { + activePageTranslate = Math.round(activePageTranslate); + previousPageTranslate = Math.round(previousPageTranslate); + } + + activePage.transform('translate3d(' + activePageTranslate + 'px,0,0)'); + if (view.params.swipeBackPageAnimateShadow && !app.device.android) pageShadow[0].style.opacity = 1 - 1 * percentage; + + previousPage.transform('translate3d(' + previousPageTranslate + 'px,0,0)'); + if (view.params.swipeBackPageAnimateOpacity) previousPage[0].style.opacity = 0.9 + 0.1 * percentage; + + // Dynamic Navbars Animation + if (dynamicNavbar) { + var i; + for (i = 0; i < activeNavElements.length; i++) { + el = $(activeNavElements[i]); + if (!el.is('.subnavbar.sliding')) el[0].style.opacity = (1 - percentage * 1.3); + if (el[0].className.indexOf('sliding') >= 0) { + var activeNavTranslate = percentage * el[0].f7NavbarRightOffset; + if (app.device.pixelRatio === 1) activeNavTranslate = Math.round(activeNavTranslate); + el.transform('translate3d(' + activeNavTranslate + 'px,0,0)'); + if (app.params.animateNavBackIcon) { + if (el[0].className.indexOf('left') >= 0 && activeNavBackIcon.length > 0) { + activeNavBackIcon.transform('translate3d(' + -activeNavTranslate + 'px,0,0)'); + } + } + } + } + for (i = 0; i < previousNavElements.length; i++) { + el = $(previousNavElements[i]); + if (!el.is('.subnavbar.sliding')) el[0].style.opacity = percentage * 1.3 - 0.3; + if (el[0].className.indexOf('sliding') >= 0) { + var previousNavTranslate = el[0].f7NavbarLeftOffset * (1 - percentage); + if (app.device.pixelRatio === 1) previousNavTranslate = Math.round(previousNavTranslate); + el.transform('translate3d(' + previousNavTranslate + 'px,0,0)'); + if (app.params.animateNavBackIcon) { + if (el[0].className.indexOf('left') >= 0 && previousNavBackIcon.length > 0) { + previousNavBackIcon.transform('translate3d(' + -previousNavTranslate + 'px,0,0)'); + } + } + } + } + } + }; + + view.handleTouchEnd = function (e) { + if (!isTouched || !isMoved) { + isTouched = false; + isMoved = false; + return; + } + isTouched = false; + isMoved = false; + if (touchesDiff === 0) { + $([activePage[0], previousPage[0]]).transform('').css({opacity: '', boxShadow: ''}); + if (dynamicNavbar) { + activeNavElements.transform('').css({opacity: ''}); + previousNavElements.transform('').css({opacity: ''}); + if (activeNavBackIcon && activeNavBackIcon.length > 0) activeNavBackIcon.transform(''); + if (previousNavBackIcon && activeNavBackIcon.length > 0) previousNavBackIcon.transform(''); + } + return; + } + var timeDiff = (new Date()).getTime() - touchStartTime; + var pageChanged = false; + // Swipe back to previous page + if ( + timeDiff < 300 && touchesDiff > 10 || + timeDiff >= 300 && touchesDiff > viewContainerWidth / 2 + ) { + activePage.removeClass('page-on-center').addClass('page-on-right'); + previousPage.removeClass('page-on-left').addClass('page-on-center'); + if (dynamicNavbar) { + activeNavbar.removeClass('navbar-on-center').addClass('navbar-on-right'); + previousNavbar.removeClass('navbar-on-left').addClass('navbar-on-center'); + } + pageChanged = true; + } + // Reset custom styles + // Add transitioning class for transition-duration + $([activePage[0], previousPage[0]]).transform('').css({opacity: '', boxShadow: ''}).addClass('page-transitioning'); + if (dynamicNavbar) { + activeNavElements.css({opacity: ''}) + .each(function () { + var translate = pageChanged ? this.f7NavbarRightOffset : 0; + var sliding = $(this); + sliding.transform('translate3d(' + translate + 'px,0,0)'); + if (app.params.animateNavBackIcon) { + if (sliding.hasClass('left') && activeNavBackIcon.length > 0) { + activeNavBackIcon.addClass('page-transitioning').transform('translate3d(' + -translate + 'px,0,0)'); + } + } + + }).addClass('page-transitioning'); + + previousNavElements.transform('').css({opacity: ''}).each(function () { + var translate = pageChanged ? 0 : this.f7NavbarLeftOffset; + var sliding = $(this); + sliding.transform('translate3d(' + translate + 'px,0,0)'); + if (app.params.animateNavBackIcon) { + if (sliding.hasClass('left') && previousNavBackIcon.length > 0) { + previousNavBackIcon.addClass('page-transitioning').transform('translate3d(' + -translate + 'px,0,0)'); + } + } + }).addClass('page-transitioning'); + } + allowViewTouchMove = false; + view.allowPageChange = false; + // Swipe Back Callback + var callbackData = { + activePage: activePage[0], + previousPage: previousPage[0], + activeNavbar: activeNavbar[0], + previousNavbar: previousNavbar[0] + }; + if (pageChanged) { + // Update View's URL + var url = view.history[view.history.length - 2]; + view.url = url; + + // Page before animation callback + app.pageBackCallback('before', view, {pageContainer: activePage[0], url: url, position: 'center', newPage: previousPage, oldPage: activePage, swipeBack: true}); + app.pageAnimCallback('before', view, {pageContainer: previousPage[0], url: url, position: 'left', newPage: previousPage, oldPage: activePage, swipeBack: true}); + + if (view.params.onSwipeBackBeforeChange) { + view.params.onSwipeBackBeforeChange(callbackData); + } + container.trigger('swipeBackBeforeChange', callbackData); + } + else { + if (view.params.onSwipeBackBeforeReset) { + view.params.onSwipeBackBeforeReset(callbackData); + } + container.trigger('swipeBackBeforeReset', callbackData); + } + + activePage.transitionEnd(function () { + $([activePage[0], previousPage[0]]).removeClass('page-transitioning'); + if (dynamicNavbar) { + activeNavElements.removeClass('page-transitioning').css({opacity: ''}); + previousNavElements.removeClass('page-transitioning').css({opacity: ''}); + if (activeNavBackIcon && activeNavBackIcon.length > 0) activeNavBackIcon.removeClass('page-transitioning'); + if (previousNavBackIcon && previousNavBackIcon.length > 0) previousNavBackIcon.removeClass('page-transitioning'); + } + allowViewTouchMove = true; + view.allowPageChange = true; + if (pageChanged) { + if (app.params.pushState && view.main) history.back(); + // Page after animation callback + app.pageBackCallback('after', view, {pageContainer: activePage[0], url: url, position: 'center', newPage: previousPage, oldPage: activePage, swipeBack: true}); + app.pageAnimCallback('after', view, {pageContainer: previousPage[0], url: url, position: 'left', newPage: previousPage, oldPage: activePage, swipeBack: true}); + app.router.afterBack(view, activePage, previousPage); + + if (view.params.onSwipeBackAfterChange) { + view.params.onSwipeBackAfterChange(callbackData); + } + container.trigger('swipeBackAfterChange', callbackData); + } + else { + if (view.params.onSwipeBackAfterReset) { + view.params.onSwipeBackAfterReset(callbackData); + } + container.trigger('swipeBackAfterReset', callbackData); + } + if (pageShadow && pageShadow.length > 0) pageShadow.remove(); + }); + }; + view.attachEvents = function (detach) { + var action = detach ? 'off' : 'on'; + container[action](app.touchEvents.start, view.handleTouchStart); + container[action](app.touchEvents.move, view.handleTouchMove); + container[action](app.touchEvents.end, view.handleTouchEnd); + }; + view.detachEvents = function () { + view.attachEvents(true); + }; + + // Init + if (view.params.swipeBackPage && !app.params.material) { + view.attachEvents(); + } + + // Add view to app + app.views.push(view); + if (view.main) app.mainView = view; + + // Router + view.router = { + load: function (options) { + return app.router.load(view, options); + }, + back: function (options) { + return app.router.back(view, options); + }, + // Shortcuts + loadPage: function (options) { + options = options || {}; + if (typeof options === 'string') { + var url = options; + options = {}; + if (url && url.indexOf('#') === 0 && view.params.domCache) { + options.pageName = url.split('#')[1]; + } + else options.url = url; + } + return app.router.load(view, options); + }, + loadContent: function (content) { + return app.router.load(view, {content: content}); + }, + reloadPage: function (url) { + return app.router.load(view, {url: url, reload: true}); + }, + reloadContent: function (content) { + return app.router.load(view, {content: content, reload: true}); + }, + reloadPreviousPage: function (url) { + return app.router.load(view, {url: url, reloadPrevious: true, reload: true}); + }, + reloadPreviousContent: function (content) { + return app.router.load(view, {content: content, reloadPrevious: true, reload: true}); + }, + refreshPage: function () { + var options = { + url: view.url, + reload: true, + ignoreCache: true + }; + if (options.url && options.url.indexOf('#') === 0) { + if (view.params.domCache && view.pagesCache[options.url]) { + options.pageName = view.pagesCache[options.url]; + options.url = undefined; + delete options.url; + } + else if (view.contentCache[options.url]) { + options.content = view.contentCache[options.url]; + options.url = undefined; + delete options.url; + } + } + return app.router.load(view, options); + }, + refreshPreviousPage: function () { + var options = { + url: view.history[view.history.length - 2], + reload: true, + reloadPrevious: true, + ignoreCache: true + }; + if (options.url && options.url.indexOf('#') === 0 && view.params.domCache && view.pagesCache[options.url]) { + options.pageName = view.pagesCache[options.url]; + options.url = undefined; + delete options.url; + } + return app.router.load(view, options); + } + }; + + // Aliases for temporary backward compatibility + view.loadPage = view.router.loadPage; + view.loadContent = view.router.loadContent; + view.reloadPage = view.router.reloadPage; + view.reloadContent = view.router.reloadContent; + view.reloadPreviousPage = view.router.reloadPreviousPage; + view.reloadPreviousContent = view.router.reloadPreviousContent; + view.refreshPage = view.router.refreshPage; + view.refreshPreviousPage = view.router.refreshPreviousPage; + view.back = view.router.back; + + // Bars methods + view.hideNavbar = function () { + return app.hideNavbar(container.find('.navbar')); + }; + view.showNavbar = function () { + return app.showNavbar(container.find('.navbar')); + }; + view.hideToolbar = function () { + return app.hideToolbar(container.find('.toolbar')); + }; + view.showToolbar = function () { + return app.showToolbar(container.find('.toolbar')); + }; + + // Push State on load + if (app.params.pushState && app.params.pushStateOnLoad && view.main) { + var pushStateUrl; + var pushStateUrlSplit = docLocation.split(pushStateSeparator)[1]; + if (pushStateRoot) { + pushStateUrl = docLocation.split(app.params.pushStateRoot + pushStateSeparator)[1]; + } + else if (pushStateSeparator && docLocation.indexOf(pushStateSeparator) >= 0 && docLocation.indexOf(pushStateSeparator + '#') < 0) { + pushStateUrl = pushStateUrlSplit; + } + var pushStateAnimatePages = app.params.pushStateNoAnimation ? false : undefined; + var historyState = history.state; + if (pushStateUrl) { + if (pushStateUrl.indexOf('#') >= 0 && view.params.domCache && historyState && historyState.pageName && 'viewIndex' in historyState) { + app.router.load(view, {pageName: historyState.pageName, url: historyState.url, animatePages: pushStateAnimatePages, pushState: false}); + } + else if (pushStateUrl.indexOf('#') >= 0 && view.params.domCache && view.initialPagesUrl.indexOf(pushStateUrl) >= 0) { + app.router.load(view, {pageName: pushStateUrl.replace('#',''), animatePages: pushStateAnimatePages, pushState: false}); + } + else app.router.load(view, {url: pushStateUrl, animatePages: pushStateAnimatePages, pushState: false}); + } + else if (view.params.domCache && docLocation.indexOf(pushStateSeparator + '#') >= 0) { + if (historyState && historyState.pageName && 'viewIndex' in historyState) { + app.router.load(view, {pageName: historyState.pageName, url: historyState.url, animatePages: pushStateAnimatePages, pushState: false}); + } + else if (pushStateSeparator && pushStateUrlSplit.indexOf('#') === 0) { + if (view.initialPagesUrl.indexOf(pushStateUrlSplit)) { + app.router.load(view, {pageName: pushStateUrlSplit.replace('#', ''), animatePages: pushStateAnimatePages, pushState: false}); + } + } + } + } + + // Destroy + view.destroy = function () { + view.detachEvents(); + view = undefined; + }; + + // Plugin hook + app.pluginHook('addView', view); + + // Return view + return view; + }; + + app.addView = function (selector, params) { + return new View(selector, params); + }; + + app.getCurrentView = function (index) { + var popoverView = $('.popover.modal-in .view'); + var popupView = $('.popup.modal-in .view'); + var panelView = $('.panel.active .view'); + var appViews = $('.views'); + // Find active view as tab + var appView = appViews.children('.view'); + // Propably in tabs or split view + if (appView.length > 1) { + if (appView.hasClass('tab')) { + // Tabs + appView = appViews.children('.view.active'); + } + else { + // Split View, leave appView intact + } + } + if (popoverView.length > 0 && popoverView[0].f7View) return popoverView[0].f7View; + if (popupView.length > 0 && popupView[0].f7View) return popupView[0].f7View; + if (panelView.length > 0 && panelView[0].f7View) return panelView[0].f7View; + if (appView.length > 0) { + if (appView.length === 1 && appView[0].f7View) return appView[0].f7View; + if (appView.length > 1) { + var currentViews = []; + for (var i = 0; i < appView.length; i++) { + if (appView[i].f7View) currentViews.push(appView[i].f7View); + } + if (currentViews.length > 0 && typeof index !== 'undefined') return currentViews[index]; + if (currentViews.length > 1) return currentViews; + if (currentViews.length === 1) return currentViews[0]; + return undefined; + } + } + return undefined; + }; + + + /*====================================================== + ************ Navbars && Toolbars ************ + ======================================================*/ + // On Navbar Init Callback + app.navbarInitCallback = function (view, pageContainer, navbarContainer, navbarInnerContainer) { + if (!navbarContainer && navbarInnerContainer) navbarContainer = $(navbarInnerContainer).parent('.navbar')[0]; + if (navbarInnerContainer.f7NavbarInitialized && view && !view.params.domCache) return; + var navbarData = { + container: navbarContainer, + innerContainer: navbarInnerContainer + }; + var pageData = pageContainer && pageContainer.f7PageData; + + var eventData = { + page: pageData, + navbar: navbarData + }; + + if (navbarInnerContainer.f7NavbarInitialized && ((view && view.params.domCache) || (!view && $(navbarContainer).parents('.popup, .popover, .login-screen, .modal, .actions-modal, .picker-modal').length > 0))) { + // Reinit Navbar + app.reinitNavbar(navbarContainer, navbarInnerContainer); + + // Plugin hook + app.pluginHook('navbarReinit', eventData); + + // Event + $(navbarInnerContainer).trigger('navbarReinit', eventData); + return; + } + navbarInnerContainer.f7NavbarInitialized = true; + // Before Init + app.pluginHook('navbarBeforeInit', navbarData, pageData); + $(navbarInnerContainer).trigger('navbarBeforeInit', eventData); + + // Initialize Navbar + app.initNavbar(navbarContainer, navbarInnerContainer); + + // On init + app.pluginHook('navbarInit', navbarData, pageData); + $(navbarInnerContainer).trigger('navbarInit', eventData); + }; + // Navbar Remove Callback + app.navbarRemoveCallback = function (view, pageContainer, navbarContainer, navbarInnerContainer) { + if (!navbarContainer && navbarInnerContainer) navbarContainer = $(navbarInnerContainer).parent('.navbar')[0]; + var navbarData = { + container: navbarContainer, + innerContainer: navbarInnerContainer + }; + var pageData = pageContainer.f7PageData; + + var eventData = { + page: pageData, + navbar: navbarData + }; + app.pluginHook('navbarBeforeRemove', navbarData, pageData); + $(navbarInnerContainer).trigger('navbarBeforeRemove', eventData); + }; + app.initNavbar = function (navbarContainer, navbarInnerContainer) { + // Init Subnavbar Searchbar + if (app.initSearchbar) app.initSearchbar(navbarInnerContainer); + }; + app.reinitNavbar = function (navbarContainer, navbarInnerContainer) { + // Re init navbar methods + }; + app.initNavbarWithCallback = function (navbarContainer) { + navbarContainer = $(navbarContainer); + var viewContainer = navbarContainer.parents('.' + app.params.viewClass); + var view; + if (viewContainer.length === 0) return; + if (navbarContainer.parents('.navbar-through').length === 0 && viewContainer.find('.navbar-through').length === 0) return; + view = viewContainer[0].f7View || undefined; + + navbarContainer.find('.navbar-inner').each(function () { + var navbarInnerContainer = this; + var pageContainer; + if ($(navbarInnerContainer).attr('data-page')) { + // For dom cache + pageContainer = viewContainer.find('.page[data-page="' + $(navbarInnerContainer).attr('data-page') + '"]')[0]; + } + if (!pageContainer) { + var pages = viewContainer.find('.page'); + if (pages.length === 1) { + pageContainer = pages[0]; + } + else { + viewContainer.find('.page').each(function () { + if (this.f7PageData && this.f7PageData.navbarInnerContainer === navbarInnerContainer) { + pageContainer = this; + } + }); + } + } + app.navbarInitCallback(view, pageContainer, navbarContainer[0], navbarInnerContainer); + }); + }; + + // Size Navbars + app.sizeNavbars = function (viewContainer) { + if (app.params.material) return; + var navbarInner = viewContainer ? $(viewContainer).find('.navbar .navbar-inner:not(.cached)') : $('.navbar .navbar-inner:not(.cached)'); + navbarInner.each(function () { + var n = $(this); + if (n.hasClass('cached')) return; + var left = app.rtl ? n.find('.right') : n.find('.left'), + right = app.rtl ? n.find('.left') : n.find('.right'), + center = n.find('.center'), + subnavbar = n.find('.subnavbar'), + noLeft = left.length === 0, + noRight = right.length === 0, + leftWidth = noLeft ? 0 : left.outerWidth(true), + rightWidth = noRight ? 0 : right.outerWidth(true), + centerWidth = center.outerWidth(true), + navbarStyles = n.styles(), + navbarWidth = n[0].offsetWidth - parseInt(navbarStyles.paddingLeft, 10) - parseInt(navbarStyles.paddingRight, 10), + onLeft = n.hasClass('navbar-on-left'), + currLeft, diff; + + if (noRight) { + currLeft = navbarWidth - centerWidth; + } + if (noLeft) { + currLeft = 0; + } + if (!noLeft && !noRight) { + currLeft = (navbarWidth - rightWidth - centerWidth + leftWidth) / 2; + } + var requiredLeft = (navbarWidth - centerWidth) / 2; + if (navbarWidth - leftWidth - rightWidth > centerWidth) { + if (requiredLeft < leftWidth) { + requiredLeft = leftWidth; + } + if (requiredLeft + centerWidth > navbarWidth - rightWidth) { + requiredLeft = navbarWidth - rightWidth - centerWidth; + } + diff = requiredLeft - currLeft; + } + else { + diff = 0; + } + // RTL inverter + var inverter = app.rtl ? -1 : 1; + + if (center.hasClass('sliding')) { + center[0].f7NavbarLeftOffset = -(currLeft + diff) * inverter; + center[0].f7NavbarRightOffset = (navbarWidth - currLeft - diff - centerWidth) * inverter; + if (onLeft) { + if (app.params.animateNavBackIcon) { + var activeNavbarBackLink = n.parent().find('.navbar-on-center').find('.left.sliding .back .icon ~ span'); + if (activeNavbarBackLink.length > 0) { + center[0].f7NavbarLeftOffset += activeNavbarBackLink[0].offsetLeft; + } + } + center.transform('translate3d(' + center[0].f7NavbarLeftOffset + 'px, 0, 0)'); + } + } + if (!noLeft && left.hasClass('sliding')) { + if (app.rtl) { + left[0].f7NavbarLeftOffset = -(navbarWidth - left[0].offsetWidth) / 2 * inverter; + left[0].f7NavbarRightOffset = leftWidth * inverter; + } + else { + left[0].f7NavbarLeftOffset = -leftWidth; + left[0].f7NavbarRightOffset = (navbarWidth - left[0].offsetWidth) / 2; + if (app.params.animateNavBackIcon && left.find('.back .icon').length > 0) { + left[0].f7NavbarRightOffset -= left.find('.back .icon')[0].offsetWidth; + } + } + if (onLeft) left.transform('translate3d(' + left[0].f7NavbarLeftOffset + 'px, 0, 0)'); + } + if (!noRight && right.hasClass('sliding')) { + if (app.rtl) { + right[0].f7NavbarLeftOffset = -rightWidth * inverter; + right[0].f7NavbarRightOffset = (navbarWidth - right[0].offsetWidth) / 2 * inverter; + } + else { + right[0].f7NavbarLeftOffset = -(navbarWidth - right[0].offsetWidth) / 2; + right[0].f7NavbarRightOffset = rightWidth; + } + if (onLeft) right.transform('translate3d(' + right[0].f7NavbarLeftOffset + 'px, 0, 0)'); + } + if (subnavbar.length && subnavbar.hasClass('sliding')) { + subnavbar[0].f7NavbarLeftOffset = app.rtl ? subnavbar[0].offsetWidth : -subnavbar[0].offsetWidth; + subnavbar[0].f7NavbarRightOffset = -subnavbar[0].f7NavbarLeftOffset; + } + + // Center left + var centerLeft = diff; + if (app.rtl && noLeft && noRight && center.length > 0) centerLeft = -centerLeft; + center.css({left: centerLeft + 'px'}); + + }); + }; + + // Hide/Show Navbars/Toolbars + app.hideNavbar = function (navbarContainer) { + $(navbarContainer).addClass('navbar-hidden'); + return true; + }; + app.showNavbar = function (navbarContainer) { + var navbar = $(navbarContainer); + navbar.addClass('navbar-hiding').removeClass('navbar-hidden').transitionEnd(function () { + navbar.removeClass('navbar-hiding'); + }); + return true; + }; + app.hideToolbar = function (toolbarContainer) { + $(toolbarContainer).addClass('toolbar-hidden'); + return true; + }; + app.showToolbar = function (toolbarContainer) { + var toolbar = $(toolbarContainer); + toolbar.addClass('toolbar-hiding').removeClass('toolbar-hidden').transitionEnd(function () { + toolbar.removeClass('toolbar-hiding'); + }); + }; + + + /*====================================================== + ************ Searchbar ************ + ======================================================*/ + var Searchbar = function (container, params) { + var defaults = { + input: null, + clearButton: null, + cancelButton: null, + searchList: null, + searchIn: '.item-title', + searchBy: '', + found: null, + notFound: null, + overlay: null, + ignore: '.searchbar-ignore', + customSearch: false, + removeDiacritics: false, + hideDividers: true, + hideGroups: true, + /* Callbacks + onSearch + onEnable + onDisable + onClear + */ + + }; + params = params || {}; + for (var def in defaults) { + if (typeof params[def] === 'undefined' || params[def] === null) { + params[def] = defaults[def]; + } + } + + // Instance + var s = this; + + // Material + s.material = app.params.material; + + // Params + s.params = params; + + // Container + container = $(container); + s.container = container; + + // Active + s.active = false; + + // Input + s.input = s.params.input ? $(s.params.input) : s.container.find('input[type="search"]'); + s.clearButton = s.params.clearButton ? $(s.params.clearButton) : s.container.find('.searchbar-clear'); + s.cancelButton = s.params.cancelButton ? $(s.params.cancelButton) : s.container.find('.searchbar-cancel'); + + // Search List + s.searchList = $(s.params.searchList); + + // Is Virtual List + s.isVirtualList = s.searchList.hasClass('virtual-list'); + + // Is In Page + s.pageContainer = s.container.parents('.page').eq(0); + + // Overlay + if (!s.params.overlay) { + s.overlay = s.pageContainer.length > 0 ? s.pageContainer.find('.searchbar-overlay') : $('.searchbar-overlay'); + } + else { + s.overlay = $(s.params.overlay); + } + // Found and not found + if (!s.params.found) { + s.found = s.pageContainer.length > 0 ? s.pageContainer.find('.searchbar-found') : $('.searchbar-found'); + } + else { + s.found = $(s.params.found); + } + if (!s.params.notFound) { + s.notFound = s.pageContainer.length > 0 ? s.pageContainer.find('.searchbar-not-found') : $('.searchbar-not-found'); + } + else { + s.notFound = $(s.params.notFound); + } + + + + // Diacritics + var defaultDiacriticsRemovalap = [ + {base:'A', letters:'\u0041\u24B6\uFF21\u00C0\u00C1\u00C2\u1EA6\u1EA4\u1EAA\u1EA8\u00C3\u0100\u0102\u1EB0\u1EAE\u1EB4\u1EB2\u0226\u01E0\u00C4\u01DE\u1EA2\u00C5\u01FA\u01CD\u0200\u0202\u1EA0\u1EAC\u1EB6\u1E00\u0104\u023A\u2C6F'}, + {base:'AA',letters:'\uA732'}, + {base:'AE',letters:'\u00C6\u01FC\u01E2'}, + {base:'AO',letters:'\uA734'}, + {base:'AU',letters:'\uA736'}, + {base:'AV',letters:'\uA738\uA73A'}, + {base:'AY',letters:'\uA73C'}, + {base:'B', letters:'\u0042\u24B7\uFF22\u1E02\u1E04\u1E06\u0243\u0182\u0181'}, + {base:'C', letters:'\u0043\u24B8\uFF23\u0106\u0108\u010A\u010C\u00C7\u1E08\u0187\u023B\uA73E'}, + {base:'D', letters:'\u0044\u24B9\uFF24\u1E0A\u010E\u1E0C\u1E10\u1E12\u1E0E\u0110\u018B\u018A\u0189\uA779'}, + {base:'DZ',letters:'\u01F1\u01C4'}, + {base:'Dz',letters:'\u01F2\u01C5'}, + {base:'E', letters:'\u0045\u24BA\uFF25\u00C8\u00C9\u00CA\u1EC0\u1EBE\u1EC4\u1EC2\u1EBC\u0112\u1E14\u1E16\u0114\u0116\u00CB\u1EBA\u011A\u0204\u0206\u1EB8\u1EC6\u0228\u1E1C\u0118\u1E18\u1E1A\u0190\u018E'}, + {base:'F', letters:'\u0046\u24BB\uFF26\u1E1E\u0191\uA77B'}, + {base:'G', letters:'\u0047\u24BC\uFF27\u01F4\u011C\u1E20\u011E\u0120\u01E6\u0122\u01E4\u0193\uA7A0\uA77D\uA77E'}, + {base:'H', letters:'\u0048\u24BD\uFF28\u0124\u1E22\u1E26\u021E\u1E24\u1E28\u1E2A\u0126\u2C67\u2C75\uA78D'}, + {base:'I', letters:'\u0049\u24BE\uFF29\u00CC\u00CD\u00CE\u0128\u012A\u012C\u0130\u00CF\u1E2E\u1EC8\u01CF\u0208\u020A\u1ECA\u012E\u1E2C\u0197'}, + {base:'J', letters:'\u004A\u24BF\uFF2A\u0134\u0248'}, + {base:'K', letters:'\u004B\u24C0\uFF2B\u1E30\u01E8\u1E32\u0136\u1E34\u0198\u2C69\uA740\uA742\uA744\uA7A2'}, + {base:'L', letters:'\u004C\u24C1\uFF2C\u013F\u0139\u013D\u1E36\u1E38\u013B\u1E3C\u1E3A\u0141\u023D\u2C62\u2C60\uA748\uA746\uA780'}, + {base:'LJ',letters:'\u01C7'}, + {base:'Lj',letters:'\u01C8'}, + {base:'M', letters:'\u004D\u24C2\uFF2D\u1E3E\u1E40\u1E42\u2C6E\u019C'}, + {base:'N', letters:'\u004E\u24C3\uFF2E\u01F8\u0143\u00D1\u1E44\u0147\u1E46\u0145\u1E4A\u1E48\u0220\u019D\uA790\uA7A4'}, + {base:'NJ',letters:'\u01CA'}, + {base:'Nj',letters:'\u01CB'}, + {base:'O', letters:'\u004F\u24C4\uFF2F\u00D2\u00D3\u00D4\u1ED2\u1ED0\u1ED6\u1ED4\u00D5\u1E4C\u022C\u1E4E\u014C\u1E50\u1E52\u014E\u022E\u0230\u00D6\u022A\u1ECE\u0150\u01D1\u020C\u020E\u01A0\u1EDC\u1EDA\u1EE0\u1EDE\u1EE2\u1ECC\u1ED8\u01EA\u01EC\u00D8\u01FE\u0186\u019F\uA74A\uA74C'}, + {base:'OI',letters:'\u01A2'}, + {base:'OO',letters:'\uA74E'}, + {base:'OU',letters:'\u0222'}, + {base:'OE',letters:'\u008C\u0152'}, + {base:'oe',letters:'\u009C\u0153'}, + {base:'P', letters:'\u0050\u24C5\uFF30\u1E54\u1E56\u01A4\u2C63\uA750\uA752\uA754'}, + {base:'Q', letters:'\u0051\u24C6\uFF31\uA756\uA758\u024A'}, + {base:'R', letters:'\u0052\u24C7\uFF32\u0154\u1E58\u0158\u0210\u0212\u1E5A\u1E5C\u0156\u1E5E\u024C\u2C64\uA75A\uA7A6\uA782'}, + {base:'S', letters:'\u0053\u24C8\uFF33\u1E9E\u015A\u1E64\u015C\u1E60\u0160\u1E66\u1E62\u1E68\u0218\u015E\u2C7E\uA7A8\uA784'}, + {base:'T', letters:'\u0054\u24C9\uFF34\u1E6A\u0164\u1E6C\u021A\u0162\u1E70\u1E6E\u0166\u01AC\u01AE\u023E\uA786'}, + {base:'TZ',letters:'\uA728'}, + {base:'U', letters:'\u0055\u24CA\uFF35\u00D9\u00DA\u00DB\u0168\u1E78\u016A\u1E7A\u016C\u00DC\u01DB\u01D7\u01D5\u01D9\u1EE6\u016E\u0170\u01D3\u0214\u0216\u01AF\u1EEA\u1EE8\u1EEE\u1EEC\u1EF0\u1EE4\u1E72\u0172\u1E76\u1E74\u0244'}, + {base:'V', letters:'\u0056\u24CB\uFF36\u1E7C\u1E7E\u01B2\uA75E\u0245'}, + {base:'VY',letters:'\uA760'}, + {base:'W', letters:'\u0057\u24CC\uFF37\u1E80\u1E82\u0174\u1E86\u1E84\u1E88\u2C72'}, + {base:'X', letters:'\u0058\u24CD\uFF38\u1E8A\u1E8C'}, + {base:'Y', letters:'\u0059\u24CE\uFF39\u1EF2\u00DD\u0176\u1EF8\u0232\u1E8E\u0178\u1EF6\u1EF4\u01B3\u024E\u1EFE'}, + {base:'Z', letters:'\u005A\u24CF\uFF3A\u0179\u1E90\u017B\u017D\u1E92\u1E94\u01B5\u0224\u2C7F\u2C6B\uA762'}, + {base:'a', letters:'\u0061\u24D0\uFF41\u1E9A\u00E0\u00E1\u00E2\u1EA7\u1EA5\u1EAB\u1EA9\u00E3\u0101\u0103\u1EB1\u1EAF\u1EB5\u1EB3\u0227\u01E1\u00E4\u01DF\u1EA3\u00E5\u01FB\u01CE\u0201\u0203\u1EA1\u1EAD\u1EB7\u1E01\u0105\u2C65\u0250'}, + {base:'aa',letters:'\uA733'}, + {base:'ae',letters:'\u00E6\u01FD\u01E3'}, + {base:'ao',letters:'\uA735'}, + {base:'au',letters:'\uA737'}, + {base:'av',letters:'\uA739\uA73B'}, + {base:'ay',letters:'\uA73D'}, + {base:'b', letters:'\u0062\u24D1\uFF42\u1E03\u1E05\u1E07\u0180\u0183\u0253'}, + {base:'c', letters:'\u0063\u24D2\uFF43\u0107\u0109\u010B\u010D\u00E7\u1E09\u0188\u023C\uA73F\u2184'}, + {base:'d', letters:'\u0064\u24D3\uFF44\u1E0B\u010F\u1E0D\u1E11\u1E13\u1E0F\u0111\u018C\u0256\u0257\uA77A'}, + {base:'dz',letters:'\u01F3\u01C6'}, + {base:'e', letters:'\u0065\u24D4\uFF45\u00E8\u00E9\u00EA\u1EC1\u1EBF\u1EC5\u1EC3\u1EBD\u0113\u1E15\u1E17\u0115\u0117\u00EB\u1EBB\u011B\u0205\u0207\u1EB9\u1EC7\u0229\u1E1D\u0119\u1E19\u1E1B\u0247\u025B\u01DD'}, + {base:'f', letters:'\u0066\u24D5\uFF46\u1E1F\u0192\uA77C'}, + {base:'g', letters:'\u0067\u24D6\uFF47\u01F5\u011D\u1E21\u011F\u0121\u01E7\u0123\u01E5\u0260\uA7A1\u1D79\uA77F'}, + {base:'h', letters:'\u0068\u24D7\uFF48\u0125\u1E23\u1E27\u021F\u1E25\u1E29\u1E2B\u1E96\u0127\u2C68\u2C76\u0265'}, + {base:'hv',letters:'\u0195'}, + {base:'i', letters:'\u0069\u24D8\uFF49\u00EC\u00ED\u00EE\u0129\u012B\u012D\u00EF\u1E2F\u1EC9\u01D0\u0209\u020B\u1ECB\u012F\u1E2D\u0268\u0131'}, + {base:'j', letters:'\u006A\u24D9\uFF4A\u0135\u01F0\u0249'}, + {base:'k', letters:'\u006B\u24DA\uFF4B\u1E31\u01E9\u1E33\u0137\u1E35\u0199\u2C6A\uA741\uA743\uA745\uA7A3'}, + {base:'l', letters:'\u006C\u24DB\uFF4C\u0140\u013A\u013E\u1E37\u1E39\u013C\u1E3D\u1E3B\u017F\u0142\u019A\u026B\u2C61\uA749\uA781\uA747'}, + {base:'lj',letters:'\u01C9'}, + {base:'m', letters:'\u006D\u24DC\uFF4D\u1E3F\u1E41\u1E43\u0271\u026F'}, + {base:'n', letters:'\u006E\u24DD\uFF4E\u01F9\u0144\u00F1\u1E45\u0148\u1E47\u0146\u1E4B\u1E49\u019E\u0272\u0149\uA791\uA7A5'}, + {base:'nj',letters:'\u01CC'}, + {base:'o', letters:'\u006F\u24DE\uFF4F\u00F2\u00F3\u00F4\u1ED3\u1ED1\u1ED7\u1ED5\u00F5\u1E4D\u022D\u1E4F\u014D\u1E51\u1E53\u014F\u022F\u0231\u00F6\u022B\u1ECF\u0151\u01D2\u020D\u020F\u01A1\u1EDD\u1EDB\u1EE1\u1EDF\u1EE3\u1ECD\u1ED9\u01EB\u01ED\u00F8\u01FF\u0254\uA74B\uA74D\u0275'}, + {base:'oi',letters:'\u01A3'}, + {base:'ou',letters:'\u0223'}, + {base:'oo',letters:'\uA74F'}, + {base:'p',letters:'\u0070\u24DF\uFF50\u1E55\u1E57\u01A5\u1D7D\uA751\uA753\uA755'}, + {base:'q',letters:'\u0071\u24E0\uFF51\u024B\uA757\uA759'}, + {base:'r',letters:'\u0072\u24E1\uFF52\u0155\u1E59\u0159\u0211\u0213\u1E5B\u1E5D\u0157\u1E5F\u024D\u027D\uA75B\uA7A7\uA783'}, + {base:'s',letters:'\u0073\u24E2\uFF53\u00DF\u015B\u1E65\u015D\u1E61\u0161\u1E67\u1E63\u1E69\u0219\u015F\u023F\uA7A9\uA785\u1E9B'}, + {base:'t',letters:'\u0074\u24E3\uFF54\u1E6B\u1E97\u0165\u1E6D\u021B\u0163\u1E71\u1E6F\u0167\u01AD\u0288\u2C66\uA787'}, + {base:'tz',letters:'\uA729'}, + {base:'u',letters: '\u0075\u24E4\uFF55\u00F9\u00FA\u00FB\u0169\u1E79\u016B\u1E7B\u016D\u00FC\u01DC\u01D8\u01D6\u01DA\u1EE7\u016F\u0171\u01D4\u0215\u0217\u01B0\u1EEB\u1EE9\u1EEF\u1EED\u1EF1\u1EE5\u1E73\u0173\u1E77\u1E75\u0289'}, + {base:'v',letters:'\u0076\u24E5\uFF56\u1E7D\u1E7F\u028B\uA75F\u028C'}, + {base:'vy',letters:'\uA761'}, + {base:'w',letters:'\u0077\u24E6\uFF57\u1E81\u1E83\u0175\u1E87\u1E85\u1E98\u1E89\u2C73'}, + {base:'x',letters:'\u0078\u24E7\uFF58\u1E8B\u1E8D'}, + {base:'y',letters:'\u0079\u24E8\uFF59\u1EF3\u00FD\u0177\u1EF9\u0233\u1E8F\u00FF\u1EF7\u1E99\u1EF5\u01B4\u024F\u1EFF'}, + {base:'z',letters:'\u007A\u24E9\uFF5A\u017A\u1E91\u017C\u017E\u1E93\u1E95\u01B6\u0225\u0240\u2C6C\uA763'} + ]; + + var diacriticsMap = {}; + for (var i=0; i < defaultDiacriticsRemovalap.length; i++){ + var letters = defaultDiacriticsRemovalap[i].letters; + for (var j=0; j < letters.length ; j++){ + diacriticsMap[letters[j]] = defaultDiacriticsRemovalap[i].base; + } + } + + function removeDiacritics (str) { + return str.replace(/[^\u0000-\u007E]/g, function(a){ + return diacriticsMap[a] || a; + }); + } + + // Set Cancel button + var cancelMarginProp = app.rtl ? 'margin-left' : 'margin-right'; + var cancelButtonHasMargin = false; + s.setCancelButtonMargin = function () { + s.cancelButton.transition(0).show(); + s.cancelButton.css(cancelMarginProp, -s.cancelButton[0].offsetWidth + 'px'); + var clientLeft = s.cancelButton[0].clientLeft; + s.cancelButton.transition(''); + cancelButtonHasMargin = true; + }; + + // Trigger + s.triggerEvent = function (eventName, callbackName, eventData) { + s.container.trigger(eventName, eventData); + if (s.searchList.length > 0) s.searchList.trigger(eventName, eventData); + if (callbackName && s.params[callbackName]) s.params[callbackName](s, eventData); + }; + + // Enable/disalbe + s.enable = function (e) { + function _enable() { + if ((s.searchList.length || s.params.customSearch) && !s.container.hasClass('searchbar-active') && !s.query) s.overlay.addClass('searchbar-overlay-active'); + s.container.addClass('searchbar-active'); + if (s.cancelButton.length > 0 && !s.material) { + if (!cancelButtonHasMargin) { + s.setCancelButtonMargin(); + } + s.cancelButton.css(cancelMarginProp, '0px'); + } + s.triggerEvent('enableSearch', 'onEnable'); + s.active = true; + } + if (app.device.ios && !app.params.material && e && e.type === 'focus') { + setTimeout(function () { + _enable(); + }, 400); + } + else { + _enable(); + } + }; + + s.disable = function () { + s.input.val('').trigger('change'); + s.container.removeClass('searchbar-active searchbar-not-empty'); + if (s.cancelButton.length > 0 && !s.material) s.cancelButton.css(cancelMarginProp, -s.cancelButton[0].offsetWidth + 'px'); + + if (s.searchList.length || s.params.customSearch) s.overlay.removeClass('searchbar-overlay-active'); + + s.active = false; + function _disable() { + s.input.blur(); + } + if (app.device.ios) { + setTimeout(function () { + _disable(); + }, 400); + } + else { + _disable(); + } + s.triggerEvent('disableSearch', 'onDisable'); + }; + + // Clear + s.clear = function (e) { + if (!s.query && e && $(e.target).hasClass('searchbar-clear')) { + s.disable(); + return; + } + s.input.val('').trigger('change').focus(); + s.triggerEvent('clearSearch', 'onClear'); + }; + + // Search + s.handleInput = function () { + setTimeout(function () { + var value = s.input.val().trim(); + if ((s.searchList.length > 0 || s.params.customSearch) && (s.params.searchIn || s.isVirtualList)) s.search(value, true); + }, 0); + }; + + var previousQuery = ''; + var virtualList; + s.search = function (query, internal) { + if (query.trim() === previousQuery) return; + previousQuery = query.trim(); + + if (!internal) { + if (!s.active) { + s.enable(); + } + s.input.val(query); + } + s.query = s.value = query; + // Add active/inactive classes on overlay + if (query.length === 0) { + s.container.removeClass('searchbar-not-empty'); + if (s.searchList.length && s.container.hasClass('searchbar-active')) s.overlay.addClass('searchbar-overlay-active'); + } + else { + s.container.addClass('searchbar-not-empty'); + if (s.searchList.length && s.container.hasClass('searchbar-active')) s.overlay.removeClass('searchbar-overlay-active'); + } + + if (s.params.customSearch) { + s.triggerEvent('search', 'onSearch', {query: query}); + return; + } + + var foundItems = []; + if (s.isVirtualList) { + virtualList = s.searchList[0].f7VirtualList; + if (query.trim() === '') { + virtualList.resetFilter(); + s.notFound.hide(); + s.found.show(); + return; + } + if (virtualList.params.searchAll) { + foundItems = virtualList.params.searchAll(query, virtualList.items) || []; + } + else if (virtualList.params.searchByItem) { + for (var i = 0; i < virtualList.items.length; i++) { + if(virtualList.params.searchByItem(query, i, virtualList.params.items[i])) { + foundItems.push(i); + } + } + } + } + else { + var values; + if (s.params.removeDiacritics) values = removeDiacritics(query.trim().toLowerCase()).split(' '); + else { + values = query.trim().toLowerCase().split(' '); + } + s.searchList.find('li').removeClass('hidden-by-searchbar').each(function (index, el) { + el = $(el); + var compareWithText = []; + el.find(s.params.searchIn).each(function () { + var itemText = $(this).text().trim().toLowerCase(); + if (s.params.removeDiacritics) itemText = removeDiacritics(itemText); + compareWithText.push(itemText); + }); + compareWithText = compareWithText.join(' '); + var wordsMatch = 0; + for (var i = 0; i < values.length; i++) { + if (compareWithText.indexOf(values[i]) >= 0) wordsMatch++; + } + if (wordsMatch !== values.length && !(s.params.ignore && el.is(s.params.ignore))) { + el.addClass('hidden-by-searchbar'); + } + else { + foundItems.push(el[0]); + } + }); + + if (s.params.hideDividers) { + s.searchList.find('.item-divider, .list-group-title').each(function () { + var title = $(this); + var nextElements = title.nextAll('li'); + var hide = true; + for (var i = 0; i < nextElements.length; i++) { + var nextEl = $(nextElements[i]); + if (nextEl.hasClass('list-group-title') || nextEl.hasClass('item-divider')) break; + if (!nextEl.hasClass('hidden-by-searchbar')) { + hide = false; + } + } + var ignore = s.params.ignore && title.is(s.params.ignore); + if (hide && !ignore) title.addClass('hidden-by-searchbar'); + else title.removeClass('hidden-by-searchbar'); + }); + } + if (s.params.hideGroups) { + s.searchList.find('.list-group').each(function () { + var group = $(this); + var ignore = s.params.ignore && group.is(s.params.ignore); + var notHidden = group.find('li:not(.hidden-by-searchbar)'); + if (notHidden.length === 0 && !ignore) { + group.addClass('hidden-by-searchbar'); + } + else { + group.removeClass('hidden-by-searchbar'); + } + }); + } + } + s.triggerEvent('search', 'onSearch', {query: query, foundItems: foundItems}); + if (foundItems.length === 0) { + s.notFound.show(); + s.found.hide(); + } + else { + s.notFound.hide(); + s.found.show(); + } + if (s.isVirtualList) { + virtualList.filterItems(foundItems); + } + }; + + // Events + function preventSubmit(e) { + e.preventDefault(); + } + + s.attachEvents = function (destroy) { + var method = destroy ? 'off' : 'on'; + s.container[method]('submit', preventSubmit); + if (!s.material) s.cancelButton[method]('click', s.disable); + s.overlay[method]('click', s.disable); + s.input[method]('focus', s.enable); + s.input[method]('change keydown keypress keyup', s.handleInput); + s.clearButton[method]('click', s.clear); + + }; + s.detachEvents = function() { + s.attachEvents(true); + }; + + // Init Destroy + s.init = function () { + s.attachEvents(); + }; + s.destroy = function () { + if (!s) return; + s.detachEvents(); + s = null; + }; + + // Init + s.init(); + + s.container[0].f7Searchbar = s; + return s; + + }; + app.searchbar = function (container, params) { + return new Searchbar(container, params); + }; + app.initSearchbar = function (container) { + container = $(container); + var searchbar = container.hasClass('searchbar') ? container : container.find('.searchbar'); + if (searchbar.length === 0) return; + if (!searchbar.hasClass('searchbar-init')) return; + + var sb = app.searchbar(searchbar, searchbar.dataset()); + + function onBeforeRemove() { + if (sb) sb.destroy(); + } + if (container.hasClass('page')) { + container.once('pageBeforeRemove', onBeforeRemove); + } + else if (container.hasClass('navbar-inner')) { + container.once('navbarBeforeRemove', onBeforeRemove); + } + }; + + /*====================================================== + ************ Messagebar ************ + ======================================================*/ + var Messagebar = function (container, params) { + var defaults = { + textarea: null, + maxHeight: null, + }; + params = params || {}; + for (var def in defaults) { + if (typeof params[def] === 'undefined' || params[def] === null) { + params[def] = defaults[def]; + } + } + + // Instance + var m = this; + + // Params + m.params = params; + + // Container + m.container = $(container); + if (m.container.length === 0) return; + + // Textarea + m.textarea = m.params.textarea ? $(m.params.textarea) : m.container.find('textarea'); + + // Is In Page + m.pageContainer = m.container.parents('.page').eq(0); + m.pageContent = m.pageContainer.find('.page-content'); + + // Initial Sizes + m.pageContentPadding = parseInt(m.pageContent.css('padding-bottom')); + m.initialBarHeight = m.container[0].offsetHeight; + m.initialAreaHeight = m.textarea[0].offsetHeight; + + + // Resize textarea + m.sizeTextarea = function () { + // Reset + m.textarea.css({'height': ''}); + + var height = m.textarea[0].offsetHeight; + var diff = height - m.textarea[0].clientHeight; + var scrollHeight = m.textarea[0].scrollHeight; + + // Update + if (scrollHeight + diff > height) { + var newAreaHeight = scrollHeight + diff; + var newBarHeight = m.initialBarHeight + (newAreaHeight - m.initialAreaHeight); + var maxBarHeight = m.params.maxHeight || m.container.parents('.view')[0].offsetHeight - 88; + if (newBarHeight > maxBarHeight) { + newBarHeight = parseInt(maxBarHeight, 10); + newAreaHeight = newBarHeight - m.initialBarHeight + m.initialAreaHeight; + } + m.textarea.css('height', newAreaHeight + 'px'); + m.container.css('height', newBarHeight + 'px'); + var onBottom = (m.pageContent[0].scrollTop === m.pageContent[0].scrollHeight - m.pageContent[0].offsetHeight); + if (m.pageContent.length > 0) { + m.pageContent.css('padding-bottom', newBarHeight + 'px'); + if (m.pageContent.find('.messages-new-first').length === 0 && onBottom) { + m.pageContent.scrollTop(m.pageContent[0].scrollHeight - m.pageContent[0].offsetHeight); + } + } + } + else { + if (m.pageContent.length > 0) { + m.container.css({'height': '', 'bottom': ''}); + m.pageContent.css({'padding-bottom': ''}); + } + } + }; + + // Clear + m.clear = function () { + m.textarea.val('').trigger('change'); + }; + m.value = function (value) { + if (typeof value === 'undefined') return m.textarea.val(); + else m.textarea.val(value).trigger('change'); + }; + + // Handle textarea + m.textareaTimeout = undefined; + m.handleTextarea = function (e) { + clearTimeout(m.textareaTimeout); + m.textareaTimeout = setTimeout(function () { + m.sizeTextarea(); + }, 0); + }; + + //Events + function preventSubmit(e) { + e.preventDefault(); + } + + m.attachEvents = function (destroy) { + var method = destroy ? 'off' : 'on'; + m.container[method]('submit', preventSubmit); + m.textarea[method]('change keydown keypress keyup paste cut', m.handleTextarea); + }; + m.detachEvents = function () { + m.attachEvents(true); + }; + + // Init Destroy + m.init = function () { + m.attachEvents(); + }; + m.destroy = function () { + m.detachEvents(); + m = null; + }; + + // Init + m.init(); + + m.container[0].f7Messagebar = m; + return m; + }; + app.messagebar = function (container, params) { + return new Messagebar(container, params); + }; + app.initPageMessagebar = function (pageContainer) { + pageContainer = $(pageContainer); + var messagebar = pageContainer.hasClass('messagebar') ? pageContainer : pageContainer.find('.messagebar'); + if (messagebar.length === 0) return; + if (!messagebar.hasClass('messagebar-init')) return; + var mb = app.messagebar(messagebar, messagebar.dataset()); + + // Destroy on page remove + function pageBeforeRemove() { + mb.destroy(); + pageContainer.off('pageBeforeRemove', pageBeforeRemove); + } + if (pageContainer.hasClass('page')) { + pageContainer.on('pageBeforeRemove', pageBeforeRemove); + } + }; + + /*====================================================== + ************ XHR ************ + ======================================================*/ + // XHR Caching + app.cache = []; + app.removeFromCache = function (url) { + var index = false; + for (var i = 0; i < app.cache.length; i++) { + if (app.cache[i].url === url) index = i; + } + if (index !== false) app.cache.splice(index, 1); + }; + + // XHR + app.xhr = false; + app.get = function (url, view, ignoreCache, callback) { + // should we ignore get params or not + var _url = url; + if (app.params.cacheIgnoreGetParameters && url.indexOf('?') >= 0) { + _url = url.split('?')[0]; + } + if (app.params.cache && !ignoreCache && url.indexOf('nocache') < 0 && app.params.cacheIgnore.indexOf(_url) < 0) { + // Check is the url cached + for (var i = 0; i < app.cache.length; i++) { + if (app.cache[i].url === _url) { + // Check expiration + if ((new Date()).getTime() - app.cache[i].time < app.params.cacheDuration) { + // Load from cache + callback(app.cache[i].content); + return false; + } + } + } + } + + app.xhr = $.ajax({ + url: url, + method: 'GET', + beforeSend: app.params.onAjaxStart, + complete: function (xhr) { + if ((xhr.status >= 200 && xhr.status < 300) || xhr.status === 0) { + if (app.params.cache) { + app.removeFromCache(_url); + app.cache.push({ + url: _url, + time: (new Date()).getTime(), + content: xhr.responseText + }); + } + callback(xhr.responseText, false); + } + else { + callback(xhr.responseText, true); + } + if (app.params.onAjaxComplete) app.params.onAjaxComplete(xhr); + }, + error: function (xhr) { + callback(xhr.responseText, true); + if (app.params.onAjaxError) app.params.onAjaxError(xhr); + } + }); + if (view) view.xhr = app.xhr; + + return app.xhr; + }; + + + /*====================================================== + ************ Pages ************ + ======================================================*/ + // Page Callbacks API + app.pageCallbacks = {}; + + app.onPage = function (callbackName, pageName, callback) { + if (pageName && pageName.split(' ').length > 1) { + var pageNames = pageName.split(' '); + var returnCallbacks = []; + for (var i = 0; i < pageNames.length; i++) { + returnCallbacks.push(app.onPage(callbackName, pageNames[i], callback)); + } + returnCallbacks.remove = function () { + for (var i = 0; i < returnCallbacks.length; i++) { + returnCallbacks[i].remove(); + } + }; + returnCallbacks.trigger = function () { + for (var i = 0; i < returnCallbacks.length; i++) { + returnCallbacks[i].trigger(); + } + }; + return returnCallbacks; + } + var callbacks = app.pageCallbacks[callbackName][pageName]; + if (!callbacks) { + callbacks = app.pageCallbacks[callbackName][pageName] = []; + } + app.pageCallbacks[callbackName][pageName].push(callback); + return { + remove: function () { + var removeIndex; + for (var i = 0; i < callbacks.length; i++) { + if (callbacks[i].toString() === callback.toString()) { + removeIndex = i; + } + } + if (typeof removeIndex !== 'undefined') callbacks.splice(removeIndex, 1); + }, + trigger: callback + }; + }; + + //Create callbacks methods dynamically + function createPageCallback(callbackName) { + var capitalized = callbackName.replace(/^./, function (match) { + return match.toUpperCase(); + }); + app['onPage' + capitalized] = function (pageName, callback) { + return app.onPage(callbackName, pageName, callback); + }; + } + + var pageCallbacksNames = ('beforeInit init reinit beforeAnimation afterAnimation back afterBack beforeRemove').split(' '); + for (var i = 0; i < pageCallbacksNames.length; i++) { + app.pageCallbacks[pageCallbacksNames[i]] = {}; + createPageCallback(pageCallbacksNames[i]); + } + + app.triggerPageCallbacks = function (callbackName, pageName, pageData) { + var allPagesCallbacks = app.pageCallbacks[callbackName]['*']; + if (allPagesCallbacks) { + for (var j = 0; j < allPagesCallbacks.length; j++) { + allPagesCallbacks[j](pageData); + } + } + var callbacks = app.pageCallbacks[callbackName][pageName]; + if (!callbacks || callbacks.length === 0) return; + for (var i = 0; i < callbacks.length; i++) { + callbacks[i](pageData); + } + }; + + // On Page Init Callback + app.pageInitCallback = function (view, params) { + var pageContainer = params.pageContainer; + if (pageContainer.f7PageInitialized && view && !view.params.domCache) return; + + var pageQuery = params.query; + if (!pageQuery) { + if (params.url && params.url.indexOf('?') > 0) { + pageQuery = $.parseUrlQuery(params.url || ''); + } + else if (pageContainer.f7PageData && pageContainer.f7PageData.query) { + pageQuery = pageContainer.f7PageData.query; + } + else { + pageQuery = {}; + } + } + + // Page Data + var pageData = { + container: pageContainer, + url: params.url, + query: pageQuery, + name: $(pageContainer).attr('data-page'), + view: view, + from: params.position, + context: params.context, + navbarInnerContainer: params.navbarInnerContainer, + fromPage: params.fromPage + }; + if (params.fromPage && !params.fromPage.navbarInnerContainer && params.oldNavbarInnerContainer) { + params.fromPage.navbarInnerContainer = params.oldNavbarInnerContainer; + } + + if (pageContainer.f7PageInitialized && ((view && view.params.domCache) || (!view && $(pageContainer).parents('.popup, .popover, .login-screen, .modal, .actions-modal, .picker-modal').length > 0))) { + // Reinit Page + app.reinitPage(pageContainer); + + // Callbacks + app.pluginHook('pageReinit', pageData); + if (app.params.onPageReinit) app.params.onPageReinit(app, pageData); + app.triggerPageCallbacks('reinit', pageData.name, pageData); + $(pageData.container).trigger('pageReinit', {page: pageData}); + return; + } + pageContainer.f7PageInitialized = true; + + // Store pagedata in page + pageContainer.f7PageData = pageData; + + // Update View's activePage + if (view && !params.preloadOnly && !params.reloadPrevious) { + // Add data-page on view + $(view.container).attr('data-page', pageData.name); + // Update View active page data + view.activePage = pageData; + } + + // Before Init Callbacks + app.pluginHook('pageBeforeInit', pageData); + if (app.params.onPageBeforeInit) app.params.onPageBeforeInit(app, pageData); + app.triggerPageCallbacks('beforeInit', pageData.name, pageData); + $(pageData.container).trigger('pageBeforeInit', {page: pageData}); + + // Init page + app.initPage(pageContainer); + + // Init Callback + app.pluginHook('pageInit', pageData); + if (app.params.onPageInit) app.params.onPageInit(app, pageData); + app.triggerPageCallbacks('init', pageData.name, pageData); + $(pageData.container).trigger('pageInit', {page: pageData}); + }; + app.pageRemoveCallback = function (view, pageContainer, position) { + var pageContext; + if (pageContainer.f7PageData) pageContext = pageContainer.f7PageData.context; + // Page Data + var pageData = { + container: pageContainer, + name: $(pageContainer).attr('data-page'), + view: view, + url: pageContainer.f7PageData && pageContainer.f7PageData.url, + query: pageContainer.f7PageData && pageContainer.f7PageData.query, + navbarInnerContainer: pageContainer.f7PageData && pageContainer.f7PageData.navbarInnerContainer, + from: position, + context: pageContext + }; + // Before Init Callback + app.pluginHook('pageBeforeRemove', pageData); + if (app.params.onPageBeforeRemove) app.params.onPageBeforeRemove(app, pageData); + app.triggerPageCallbacks('beforeRemove', pageData.name, pageData); + $(pageData.container).trigger('pageBeforeRemove', {page: pageData}); + }; + app.pageBackCallback = function (callback, view, params) { + // Page Data + var pageContainer = params.pageContainer; + var pageContext; + if (pageContainer.f7PageData) pageContext = pageContainer.f7PageData.context; + + var pageData = { + container: pageContainer, + name: $(pageContainer).attr('data-page'), + url: pageContainer.f7PageData && pageContainer.f7PageData.url, + query: pageContainer.f7PageData && pageContainer.f7PageData.query, + view: view, + from: params.position, + context: pageContext, + navbarInnerContainer: pageContainer.f7PageData && pageContainer.f7PageData.navbarInnerContainer, + swipeBack: params.swipeBack + }; + + if (callback === 'after') { + app.pluginHook('pageAfterBack', pageData); + if (app.params.onPageAfterBack) app.params.onPageAfterBack(app, pageData); + app.triggerPageCallbacks('afterBack', pageData.name, pageData); + $(pageContainer).trigger('pageAfterBack', {page: pageData}); + + } + if (callback === 'before') { + app.pluginHook('pageBack', pageData); + if (app.params.onPageBack) app.params.onPageBack(app, pageData); + app.triggerPageCallbacks('back', pageData.name, pageData); + $(pageData.container).trigger('pageBack', {page: pageData}); + } + }; + app.pageAnimCallback = function (callback, view, params) { + var pageContainer = params.pageContainer; + var pageContext; + if (pageContainer.f7PageData) pageContext = pageContainer.f7PageData.context; + + var pageQuery = params.query; + if (!pageQuery) { + if (params.url && params.url.indexOf('?') > 0) { + pageQuery = $.parseUrlQuery(params.url || ''); + } + else if (pageContainer.f7PageData && pageContainer.f7PageData.query) { + pageQuery = pageContainer.f7PageData.query; + } + else { + pageQuery = {}; + } + } + // Page Data + var pageData = { + container: pageContainer, + url: params.url, + query: pageQuery, + name: $(pageContainer).attr('data-page'), + view: view, + from: params.position, + context: pageContext, + swipeBack: params.swipeBack, + navbarInnerContainer: pageContainer.f7PageData && pageContainer.f7PageData.navbarInnerContainer, + fromPage: params.fromPage + }; + var oldPage = params.oldPage, + newPage = params.newPage; + + // Update page date + pageContainer.f7PageData = pageData; + + if (callback === 'after') { + app.pluginHook('pageAfterAnimation', pageData); + if (app.params.onPageAfterAnimation) app.params.onPageAfterAnimation(app, pageData); + app.triggerPageCallbacks('afterAnimation', pageData.name, pageData); + $(pageData.container).trigger('pageAfterAnimation', {page: pageData}); + + } + if (callback === 'before') { + // Add data-page on view + $(view.container).attr('data-page', pageData.name); + + // Update View's activePage + if (view) view.activePage = pageData; + + // Hide/show navbar dynamically + if (newPage.hasClass('no-navbar') && !oldPage.hasClass('no-navbar')) { + view.hideNavbar(); + } + if (!newPage.hasClass('no-navbar') && (oldPage.hasClass('no-navbar') || oldPage.hasClass('no-navbar-by-scroll'))) { + view.showNavbar(); + } + // Hide/show navbar toolbar + if (newPage.hasClass('no-toolbar') && !oldPage.hasClass('no-toolbar')) { + view.hideToolbar(); + } + if (!newPage.hasClass('no-toolbar') && (oldPage.hasClass('no-toolbar') || oldPage.hasClass('no-toolbar-by-scroll'))) { + view.showToolbar(); + } + // Hide/show tabbar + var tabBar; + if (newPage.hasClass('no-tabbar') && !oldPage.hasClass('no-tabbar')) { + tabBar = $(view.container).find('.tabbar'); + if (tabBar.length === 0) tabBar = $(view.container).parents('.' + app.params.viewsClass).find('.tabbar'); + app.hideToolbar(tabBar); + } + if (!newPage.hasClass('no-tabbar') && (oldPage.hasClass('no-tabbar') || oldPage.hasClass('no-tabbar-by-scroll'))) { + tabBar = $(view.container).find('.tabbar'); + if (tabBar.length === 0) tabBar = $(view.container).parents('.' + app.params.viewsClass).find('.tabbar'); + app.showToolbar(tabBar); + } + + oldPage.removeClass('no-navbar-by-scroll no-toolbar-by-scroll'); + // Callbacks + app.pluginHook('pageBeforeAnimation', pageData); + if (app.params.onPageBeforeAnimation) app.params.onPageBeforeAnimation(app, pageData); + app.triggerPageCallbacks('beforeAnimation', pageData.name, pageData); + $(pageData.container).trigger('pageBeforeAnimation', {page: pageData}); + } + }; + + // Init Page Events and Manipulations + app.initPage = function (pageContainer) { + pageContainer = $(pageContainer); + if (pageContainer.length === 0) return; + // Size navbars on page load + if (app.sizeNavbars) app.sizeNavbars(pageContainer.parents('.' + app.params.viewClass)[0]); + // Init messages + if (app.initPageMessages) app.initPageMessages(pageContainer); + // Init forms storage + if (app.initFormsStorage) app.initFormsStorage(pageContainer); + // Init smart select + if (app.initSmartSelects) app.initSmartSelects(pageContainer); + // Init slider + if (app.initPageSwiper) app.initPageSwiper(pageContainer); + // Init pull to refres + if (app.initPullToRefresh) app.initPullToRefresh(pageContainer); + // Init infinite scroll + if (app.initPageInfiniteScroll) app.initPageInfiniteScroll(pageContainer); + // Init searchbar + if (app.initSearchbar) app.initSearchbar(pageContainer); + // Init message bar + if (app.initPageMessagebar) app.initPageMessagebar(pageContainer); + // Init scroll toolbars + if (app.initPageScrollToolbars) app.initPageScrollToolbars(pageContainer); + // Init lazy images + if (app.initImagesLazyLoad) app.initImagesLazyLoad(pageContainer); + // Init progress bars + if (app.initPageProgressbar) app.initPageProgressbar(pageContainer); + // Init resizeable textareas + if (app.initPageResizableTextarea) app.initPageResizableTextarea(pageContainer); + // Init Material Preloader + if (app.params.material && app.initPageMaterialPreloader) app.initPageMaterialPreloader(pageContainer); + // Init Material Inputs + if (app.params.material && app.initPageMaterialInputs) app.initPageMaterialInputs(pageContainer); + // Init Material Tabbar + if (app.params.material && app.initPageMaterialTabbar) app.initPageMaterialTabbar(pageContainer); + }; + app.reinitPage = function (pageContainer) { + pageContainer = $(pageContainer); + if (pageContainer.length === 0) return; + // Size navbars on page reinit + if (app.sizeNavbars) app.sizeNavbars(pageContainer.parents('.' + app.params.viewClass)[0]); + // Reinit slider + if (app.reinitPageSwiper) app.reinitPageSwiper(pageContainer); + // Reinit lazy load + if (app.reinitLazyLoad) app.reinitLazyLoad(pageContainer); + }; + app.initPageWithCallback = function (pageContainer) { + pageContainer = $(pageContainer); + var viewContainer = pageContainer.parents('.' + app.params.viewClass); + if (viewContainer.length === 0) return; + var view = viewContainer[0].f7View || undefined; + var url = view && view.url ? view.url : undefined; + if (viewContainer && pageContainer.attr('data-page')) { + viewContainer.attr('data-page', pageContainer.attr('data-page')); + } + app.pageInitCallback(view, {pageContainer: pageContainer[0], url: url, position: 'center'}); + }; + + /*====================================================== + ************ Navigation / Router ************ + ======================================================*/ + app.router = { + // Temporary DOM Element + temporaryDom: document.createElement('div'), + + // Find page or navbar in passed container which are related to View + findElement: function (selector, container, view, notCached) { + container = $(container); + if (notCached) selector = selector + ':not(.cached)'; + var found = container.find(selector); + if (found.length > 1) { + if (typeof view.selector === 'string') { + // Search in related view + found = container.find(view.selector + ' ' + selector); + } + if (found.length > 1) { + // Search in main view + found = container.find('.' + app.params.viewMainClass + ' ' + selector); + } + } + if (found.length === 1) return found; + else { + // Try to find non cached + if (!notCached) found = app.router.findElement(selector, container, view, true); + if (found && found.length === 1) return found; + else return undefined; + } + }, + + // Set pages classess for animationEnd + animatePages: function (leftPage, rightPage, direction, view) { + // Loading new page + var removeClasses = 'page-on-center page-on-right page-on-left'; + if (direction === 'to-left') { + leftPage.removeClass(removeClasses).addClass('page-from-center-to-left'); + rightPage.removeClass(removeClasses).addClass('page-from-right-to-center'); + } + // Go back + if (direction === 'to-right') { + leftPage.removeClass(removeClasses).addClass('page-from-left-to-center'); + rightPage.removeClass(removeClasses).addClass('page-from-center-to-right'); + + } + }, + + // Prepare navbar before animarion + prepareNavbar: function (newNavbarInner, oldNavbarInner, newNavbarPosition) { + $(newNavbarInner).find('.sliding').each(function () { + var sliding = $(this); + var slidingOffset = newNavbarPosition === 'right' ? this.f7NavbarRightOffset : this.f7NavbarLeftOffset; + + if (app.params.animateNavBackIcon) { + if (sliding.hasClass('left') && sliding.find('.back .icon').length > 0) { + sliding.find('.back .icon').transform('translate3d(' + (-slidingOffset) + 'px,0,0)'); + } + } + sliding.transform('translate3d(' + slidingOffset + 'px,0,0)'); + }); + }, + + // Set navbars classess for animation + animateNavbars: function (leftNavbarInner, rightNavbarInner, direction, view) { + // Loading new page + var removeClasses = 'navbar-on-right navbar-on-center navbar-on-left'; + if (direction === 'to-left') { + rightNavbarInner.removeClass(removeClasses).addClass('navbar-from-right-to-center'); + rightNavbarInner.find('.sliding').each(function () { + var sliding = $(this); + sliding.transform('translate3d(0px,0,0)'); + if (app.params.animateNavBackIcon) { + if (sliding.hasClass('left') && sliding.find('.back .icon').length > 0) { + sliding.find('.back .icon').transform('translate3d(0px,0,0)'); + } + } + }); + + leftNavbarInner.removeClass(removeClasses).addClass('navbar-from-center-to-left'); + leftNavbarInner.find('.sliding').each(function () { + var sliding = $(this); + var rightText; + if (app.params.animateNavBackIcon) { + if (sliding.hasClass('center') && rightNavbarInner.find('.sliding.left .back .icon').length > 0) { + rightText = rightNavbarInner.find('.sliding.left .back span'); + if (rightText.length > 0) this.f7NavbarLeftOffset += rightText[0].offsetLeft; + } + if (sliding.hasClass('left') && sliding.find('.back .icon').length > 0) { + sliding.find('.back .icon').transform('translate3d(' + (-this.f7NavbarLeftOffset) + 'px,0,0)'); + } + } + sliding.transform('translate3d(' + (this.f7NavbarLeftOffset) + 'px,0,0)'); + }); + } + // Go back + if (direction === 'to-right') { + leftNavbarInner.removeClass(removeClasses).addClass('navbar-from-left-to-center'); + leftNavbarInner.find('.sliding').each(function () { + var sliding = $(this); + sliding.transform('translate3d(0px,0,0)'); + if (app.params.animateNavBackIcon) { + if (sliding.hasClass('left') && sliding.find('.back .icon').length > 0) { + sliding.find('.back .icon').transform('translate3d(0px,0,0)'); + } + } + }); + + rightNavbarInner.removeClass(removeClasses).addClass('navbar-from-center-to-right'); + rightNavbarInner.find('.sliding').each(function () { + var sliding = $(this); + if (app.params.animateNavBackIcon) { + if (sliding.hasClass('left') && sliding.find('.back .icon').length > 0) { + sliding.find('.back .icon').transform('translate3d(' + (-this.f7NavbarRightOffset) + 'px,0,0)'); + } + } + sliding.transform('translate3d(' + (this.f7NavbarRightOffset) + 'px,0,0)'); + }); + } + }, + + preprocess: function(view, content, url, next) { + // Plugin hook + app.pluginHook('routerPreprocess', view, content, url, next); + + // Preprocess by plugin + content = app.pluginProcess('preprocess', content); + + if (view && view.params && view.params.preprocess) { + content = view.params.preprocess(content, url, next); + if (typeof content !== 'undefined') { + next(content); + } + } + else if (app.params.preprocess) { + content = app.params.preprocess(content, url, next); + if (typeof content !== 'undefined') { + next(content); + } + } + else { + next(content); + } + }, + preroute: function(view, options, isBack) { + if (isBack) options.isBack = true; + app.pluginHook('routerPreroute', view, options); + if ((app.params.preroute && app.params.preroute(view, options) === false) || (view && view.params.preroute && view.params.preroute(view, options) === false)) { + return true; + } + else { + return false; + } + }, + + template7Render: function (view, options) { + var url = options.url, + content = options.content, //initial content + t7_rendered_content = options.content, // will be rendered using Template7 + context = options.context, // Context data for Template7 + contextName = options.contextName, + template = options.template, // Template 7 compiled template + pageName = options.pageName; + + var t7_ctx, t7_template; + if (typeof content === 'string') { + if (url) { + if (app.template7Cache[url] && !options.ignoreCache) t7_template = t7.cache[url]; + else { + t7_template = t7.compile(content); + t7.cache[url] = t7_template; + } + } + else t7_template = t7.compile(content); + } + else if (template) { + t7_template = template; + } + + if (context) t7_ctx = context; + else { + if (contextName) { + if (contextName.indexOf('.') >= 0) { + var _ctx_path = contextName.split('.'); + var _ctx = t7.data[_ctx_path[0]]; + for (var i = 1; i < _ctx_path.length; i++) { + if (_ctx_path[i]) _ctx = _ctx[_ctx_path[i]]; + } + t7_ctx = _ctx; + } + else t7_ctx = t7.data[contextName]; + } + if (!t7_ctx && url) { + t7_ctx = t7.data['url:' + url]; + } + if (!t7_ctx && typeof content === 'string' && !template) { + //try to find by page name in content + var pageNameMatch = content.match(/(data-page=["'][^"^']*["'])/); + if (pageNameMatch) { + var page = pageNameMatch[0].split('data-page=')[1].replace(/['"]/g, ''); + if (page) t7_ctx = t7.data['page:' + page]; + } + } + if (!t7_ctx && template && t7.templates) { + // Try to find matched template name in t7.templates + for (var templateName in t7.templates) { + if (t7.templates[templateName] === template) t7_ctx = t7.data[templateName]; + } + } + if (!t7_ctx) t7_ctx = {}; + } + + if (t7_template && t7_ctx) { + if (typeof t7_ctx === 'function') t7_ctx = t7_ctx(); + if (url) { + // Extend data with URL query + var query = $.parseUrlQuery(url); + t7_ctx.url_query = {}; + for (var key in query) { + t7_ctx.url_query[key] = query[key]; + } + } + t7_rendered_content = t7_template(t7_ctx); + } + + return {content: t7_rendered_content, context: t7_ctx}; + } + }; + + + app.router._load = function (view, options) { + options = options || {}; + + var url = options.url, + content = options.content, //initial content + t7_rendered = {content: options.content}, + template = options.template, // Template 7 compiled template + pageName = options.pageName, + viewContainer = $(view.container), + pagesContainer = $(view.pagesContainer), + animatePages = options.animatePages, + newPage, oldPage, pagesInView, i, oldNavbarInner, newNavbarInner, navbar, dynamicNavbar, reloadPosition, + isDynamicPage = typeof url === 'undefined' && content || template, + pushState = options.pushState; + + if (typeof animatePages === 'undefined') animatePages = view.params.animatePages; + // Plugin hook + app.pluginHook('routerLoad', view, options); + + // Render with Template7 + if (app.params.template7Pages && typeof content === 'string' || template) { + t7_rendered = app.router.template7Render(view, options); + if (t7_rendered.content && !content) { + content = t7_rendered.content; + } + } + + app.router.temporaryDom.innerHTML = ''; + + // Parse DOM + if (!pageName) { + if ((typeof content === 'string') || (url && (typeof content === 'string'))) { + app.router.temporaryDom.innerHTML = t7_rendered.content; + } else { + if ('length' in content && content.length > 1) { + for (var ci = 0; ci < content.length; ci++) { + $(app.router.temporaryDom).append(content[ci]); + } + } else { + $(app.router.temporaryDom).append(content); + } + } + } + + // Reload position + reloadPosition = options.reload && (options.reloadPrevious ? 'left' : 'center'); + + // Find new page + if (pageName) newPage = pagesContainer.find('.page[data-page="' + pageName + '"]'); + else { + newPage = app.router.findElement('.page', app.router.temporaryDom, view); + } + + // If page not found exit + if (!newPage || newPage.length === 0 || (pageName && view.activePage && view.activePage.name === pageName)) { + view.allowPageChange = true; + return; + } + + newPage.addClass(options.reload ? 'page-on-' + reloadPosition : 'page-on-right'); + + // Find old page (should be the last one) and remove older pages + pagesInView = pagesContainer.children('.page:not(.cached)'); + + if (options.reload && options.reloadPrevious && pagesInView.length === 1) { + view.allowPageChange = true; + return; + } + + if (options.reload) { + oldPage = pagesInView.eq(pagesInView.length - 1); + } + else { + if (pagesInView.length > 1) { + for (i = 0; i < pagesInView.length - 2; i++) { + if (!view.params.domCache) { + app.pageRemoveCallback(view, pagesInView[i], 'left'); + $(pagesInView[i]).remove(); + } + else { + $(pagesInView[i]).addClass('cached'); + } + } + if (!view.params.domCache) { + app.pageRemoveCallback(view, pagesInView[i], 'left'); + $(pagesInView[i]).remove(); + } + else { + $(pagesInView[i]).addClass('cached'); + } + } + oldPage = pagesContainer.children('.page:not(.cached)'); + } + if(view.params.domCache) newPage.removeClass('cached'); + + // Dynamic navbar + if (view.params.dynamicNavbar) { + dynamicNavbar = true; + // Find navbar + if (pageName) { + newNavbarInner = viewContainer.find('.navbar-inner[data-page="' + pageName + '"]'); + } + else { + newNavbarInner = app.router.findElement('.navbar-inner', app.router.temporaryDom, view); + } + if (!newNavbarInner || newNavbarInner.length === 0) { + dynamicNavbar = false; + } + navbar = viewContainer.find('.navbar'); + if (options.reload) { + oldNavbarInner = navbar.find('.navbar-inner:not(.cached):last-child'); + } + else { + oldNavbarInner = navbar.find('.navbar-inner:not(.cached)'); + + if (oldNavbarInner.length > 0) { + for (i = 0; i < oldNavbarInner.length - 1; i++) { + if (!view.params.domCache) { + app.navbarRemoveCallback(view, pagesInView[i], navbar[0], oldNavbarInner[i]); + $(oldNavbarInner[i]).remove(); + } + else + $(oldNavbarInner[i]).addClass('cached'); + } + if (!newNavbarInner && oldNavbarInner.length === 1) { + if (!view.params.domCache) { + app.navbarRemoveCallback(view, pagesInView[0], navbar[0], oldNavbarInner[0]); + $(oldNavbarInner[0]).remove(); + } + else + $(oldNavbarInner[0]).addClass('cached'); + } + oldNavbarInner = navbar.find('.navbar-inner:not(.cached)'); + } + } + } + if (dynamicNavbar) { + newNavbarInner.addClass(options.reload ? 'navbar-on-' + reloadPosition : 'navbar-on-right'); + if(view.params.domCache) newNavbarInner.removeClass('cached'); + newPage[0].f7RelatedNavbar = newNavbarInner[0]; + newNavbarInner[0].f7RelatedPage = newPage[0]; + } + + // save content areas into view's cache + if (!url) { + var newPageName = pageName || newPage.attr('data-page'); + if (isDynamicPage) url = '#' + app.params.dynamicPageUrl.replace(/{{name}}/g, newPageName).replace(/{{index}}/g, view.history.length - (options.reload ? 1 : 0)); + else url = '#' + newPageName; + if (!view.params.domCache) { + view.contentCache[url] = content; + } + if (view.params.domCache && pageName) { + view.pagesCache[url] = pageName; + } + } + + // Push State + if (app.params.pushState && !options.reloadPrevious && view.main) { + if (typeof pushState === 'undefined') pushState = true; + var pushStateRoot = app.params.pushStateRoot || ''; + var method = options.reload ? 'replaceState' : 'pushState'; + if (pushState) { + if (!isDynamicPage && !pageName) { + history[method]({url: url, viewIndex: app.views.indexOf(view)}, '', pushStateRoot + app.params.pushStateSeparator + url); + } + else if (isDynamicPage && content) { + history[method]({content: typeof content === 'string' ? content : '', url: url, viewIndex: app.views.indexOf(view)}, '', pushStateRoot + app.params.pushStateSeparator + url); + } + else if (pageName) { + history[method]({pageName: pageName, url: url, viewIndex: app.views.indexOf(view)}, '', pushStateRoot + app.params.pushStateSeparator + url); + } + } + } + + // Update View history + view.url = url; + if (options.reload) { + var lastUrl = view.history[view.history.length - (options.reloadPrevious ? 2 : 1)]; + if (lastUrl && + lastUrl.indexOf('#') === 0 && + lastUrl in view.contentCache && + lastUrl !== url && + view.history.indexOf(lastUrl) === -1) { + view.contentCache[lastUrl] = null; + delete view.contentCache[lastUrl]; + } + view.history[view.history.length - (options.reloadPrevious ? 2 : 1)] = url; + } + else { + view.history.push(url); + } + + // Unique history + var historyBecameUnique = false; + if (view.params.uniqueHistory) { + var _history = view.history; + var _url = url; + if (view.params.uniqueHistoryIgnoreGetParameters) { + _history = []; + _url = url.split('?')[0]; + for (i = 0; i < view.history.length; i++) { + _history.push(view.history[i].split('?')[0]); + } + } + + if (_history.indexOf(_url) !== _history.lastIndexOf(_url)) { + view.history = view.history.slice(0, _history.indexOf(_url)); + view.history.push(url); + historyBecameUnique = true; + } + } + // Dom manipulations + if (options.reloadPrevious) { + oldPage = oldPage.prev('.page'); + newPage.insertBefore(oldPage); + if (dynamicNavbar) { + oldNavbarInner = oldNavbarInner.prev('.navbar-inner'); + newNavbarInner.insertAfter(oldNavbarInner); + } + } + else { + pagesContainer.append(newPage[0]); + if (dynamicNavbar) navbar.append(newNavbarInner[0]); + } + // Remove Old Page And Navbar + if (options.reload) { + if (view.params.domCache && view.initialPages.indexOf(oldPage[0]) >= 0) { + oldPage.addClass('cached'); + if (dynamicNavbar) oldNavbarInner.addClass('cached'); + } + else { + app.pageRemoveCallback(view, oldPage[0], reloadPosition); + if (dynamicNavbar) app.navbarRemoveCallback(view, oldPage[0], navbar[0], oldNavbarInner[0]); + oldPage.remove(); + if (dynamicNavbar) oldNavbarInner.remove(); + } + } + + // Page Init Events + app.pageInitCallback(view, { + pageContainer: newPage[0], + url: url, + position: options.reload ? reloadPosition : 'right', + navbarInnerContainer: dynamicNavbar ? newNavbarInner && newNavbarInner[0] : undefined, + oldNavbarInnerContainer: dynamicNavbar ? oldNavbarInner && oldNavbarInner[0] : undefined, + context: t7_rendered.context, + query: options.query, + fromPage: oldPage && oldPage.length && oldPage[0].f7PageData, + reload: options.reload, + reloadPrevious: options.reloadPrevious + }); + + // Navbar init event + if (dynamicNavbar) { + app.navbarInitCallback(view, newPage[0], navbar[0], newNavbarInner[0], url, options.reload ? reloadPosition : 'right'); + } + + if (options.reload) { + view.allowPageChange = true; + if (historyBecameUnique) view.refreshPreviousPage(); + return; + } + + if (dynamicNavbar && animatePages) { + app.router.prepareNavbar(newNavbarInner, oldNavbarInner, 'right'); + } + // Force reLayout + var clientLeft = newPage[0].clientLeft; + + // Before Anim Callback + app.pageAnimCallback('before', view, { + pageContainer: newPage[0], + url: url, + position: 'right', + oldPage: oldPage, + newPage: newPage, + query: options.query, + fromPage: oldPage && oldPage.length && oldPage[0].f7PageData + }); + + function afterAnimation() { + view.allowPageChange = true; + newPage.removeClass('page-from-right-to-center page-on-right page-on-left').addClass('page-on-center'); + oldPage.removeClass('page-from-center-to-left page-on-center page-on-right').addClass('page-on-left'); + if (dynamicNavbar) { + newNavbarInner.removeClass('navbar-from-right-to-center navbar-on-left navbar-on-right').addClass('navbar-on-center'); + oldNavbarInner.removeClass('navbar-from-center-to-left navbar-on-center navbar-on-right').addClass('navbar-on-left'); + } + app.pageAnimCallback('after', view, { + pageContainer: newPage[0], + url: url, + position: 'right', + oldPage: oldPage, + newPage: newPage, + query: options.query, + fromPage: oldPage && oldPage.length && oldPage[0].f7PageData + }); + if (app.params.pushState && view.main) app.pushStateClearQueue(); + if (!(view.params.swipeBackPage || view.params.preloadPreviousPage)) { + if (view.params.domCache) { + oldPage.addClass('cached'); + if (dynamicNavbar) oldNavbarInner.addClass('cached'); + } + else { + if (!(url.indexOf('#') === 0 && newPage.attr('data-page').indexOf('smart-select-') === 0)) { + app.pageRemoveCallback(view, oldPage[0], 'left'); + if (dynamicNavbar) app.navbarRemoveCallback(view, oldPage[0], navbar[0], oldNavbarInner[0]); + oldPage.remove(); + if (dynamicNavbar) oldNavbarInner.remove(); + } + } + } + if (view.params.uniqueHistory && historyBecameUnique) { + view.refreshPreviousPage(); + } + } + if (animatePages) { + // Set pages before animation + if (app.params.material && app.params.materialPageLoadDelay) { + setTimeout(function () { + app.router.animatePages(oldPage, newPage, 'to-left', view); + }, app.params.materialPageLoadDelay); + } + else { + app.router.animatePages(oldPage, newPage, 'to-left', view); + } + + // Dynamic navbar animation + if (dynamicNavbar) { + setTimeout(function() { + app.router.animateNavbars(oldNavbarInner, newNavbarInner, 'to-left', view); + }, 0); + } + newPage.animationEnd(function (e) { + afterAnimation(); + }); + } + else { + if (dynamicNavbar) newNavbarInner.find('.sliding, .sliding .back .icon').transform(''); + afterAnimation(); + } + + }; + + app.router.load = function (view, options) { + options = options || {}; + if (app.router.preroute(view, options)) { + return false; + } + var url = options.url; + var content = options.content; + var pageName = options.pageName; + if (pageName) { + if (pageName.indexOf('?') > 0) { + options.query = $.parseUrlQuery(pageName); + options.pageName = pageName = pageName.split('?')[0]; + } + } + var template = options.template; + if (view.params.reloadPages === true) options.reload = true; + + if (!view.allowPageChange) return false; + if (url && view.url === url && !options.reload && !view.params.allowDuplicateUrls) return false; + view.allowPageChange = false; + if (app.xhr && view.xhr && view.xhr === app.xhr) { + app.xhr.abort(); + app.xhr = false; + } + function proceed(content) { + app.router.preprocess(view, content, url, function (content) { + options.content = content; + app.router._load(view, options); + }); + } + if (content || pageName) { + proceed(content); + return; + } + else if (template) { + app.router._load(view, options); + return; + } + + if (!options.url || options.url === '#') { + view.allowPageChange = true; + return; + } + app.get(options.url, view, options.ignoreCache, function (content, error) { + if (error) { + view.allowPageChange = true; + return; + } + proceed(content); + }); + }; + + app.router._back = function (view, options) { + options = options || {}; + var url = options.url, + content = options.content, + t7_rendered = {content: options.content}, // will be rendered using Template7 + template = options.template, // Template 7 compiled template + animatePages = options.animatePages, + preloadOnly = options.preloadOnly, + pushState = options.pushState, + ignoreCache = options.ignoreCache, + force = options.force, + pageName = options.pageName; + + var viewContainer = $(view.container), + pagesContainer = $(view.pagesContainer), + pagesInView = pagesContainer.children('.page:not(.cached)'), + oldPage, newPage, oldNavbarInner, newNavbarInner, navbar, navbarInners, dynamicNavbar, manipulateDom = true; + + if (typeof animatePages === 'undefined') animatePages = view.params.animatePages; + + app.pluginHook('routerBack', view, options); + + // Render with Template7 + if (app.params.template7Pages && typeof content === 'string' || template) { + t7_rendered = app.router.template7Render(view, options); + if (t7_rendered.content && !content) { + content = t7_rendered.content; + } + } + + // Animation + function afterAnimation() { + app.pageBackCallback('after', view, { + pageContainer: oldPage[0], + url: url, + position: 'center', + oldPage: oldPage, + newPage: newPage, + }); + app.pageAnimCallback('after', view, { + pageContainer: newPage[0], + url: url, + position: 'left', + oldPage: oldPage, + newPage: newPage, + query: options.query, + fromPage: oldPage && oldPage.length && oldPage[0].f7PageData + }); + app.router.afterBack(view, oldPage[0], newPage[0]); + } + function animateBack() { + // Page before animation callback + app.pageBackCallback('before', view, { + pageContainer: oldPage[0], + url: url, + position: 'center', + oldPage: oldPage, + newPage: newPage, + }); + app.pageAnimCallback('before', view, { + pageContainer: newPage[0], + url: url, + position: 'left', + oldPage: oldPage, + newPage: newPage, + query: options.query, + fromPage: oldPage && oldPage.length && oldPage[0].f7PageData + }); + + if (animatePages) { + // Set pages before animation + app.router.animatePages(newPage, oldPage, 'to-right', view); + + // Dynamic navbar animation + if (dynamicNavbar) { + setTimeout(function () { + app.router.animateNavbars(newNavbarInner, oldNavbarInner, 'to-right', view); + }, 0); + } + + newPage.animationEnd(function () { + afterAnimation(); + }); + } + else { + if (dynamicNavbar) newNavbarInner.find('.sliding, .sliding .back .icon').transform(''); + afterAnimation(); + } + } + + function parseNewPage() { + app.router.temporaryDom.innerHTML = ''; + // Parse DOM + if ((typeof content === 'string') || (url && (typeof content === 'string'))) { + app.router.temporaryDom.innerHTML = t7_rendered.content; + } else { + if ('length' in content && content.length > 1) { + for (var ci = 0; ci < content.length; ci++) { + $(app.router.temporaryDom).append(content[ci]); + } + } else { + $(app.router.temporaryDom).append(content); + } + } + newPage = app.router.findElement('.page', app.router.temporaryDom, view); + + if (view.params.dynamicNavbar) { + // Find navbar + newNavbarInner = app.router.findElement('.navbar-inner', app.router.temporaryDom, view); + } + } + function setPages() { + // If pages not found or there are still more than one, exit + if (!newPage || newPage.length === 0) { + view.allowPageChange = true; + return; + } + if (view.params.dynamicNavbar && typeof dynamicNavbar === 'undefined') { + if (!newNavbarInner || newNavbarInner.length === 0) { + dynamicNavbar = false; + } + else { + dynamicNavbar = true; + } + } + + newPage.addClass('page-on-left').removeClass('cached'); + if (dynamicNavbar) { + navbar = viewContainer.find('.navbar'); + navbarInners = viewContainer.find('.navbar-inner:not(.cached)'); + newNavbarInner.addClass('navbar-on-left').removeClass('cached'); + } + // Remove/hide previous page in force mode + if (force) { + var pageToRemove, navbarToRemove; + pageToRemove = $(pagesInView[pagesInView.length - 2]); + + if (dynamicNavbar) navbarToRemove = $(pageToRemove[0] && pageToRemove[0].f7RelatedNavbar || navbarInners[navbarInners.length - 2]); + if (view.params.domCache && view.initialPages.indexOf(pageToRemove[0]) >= 0) { + if (pageToRemove.length && pageToRemove[0] !== newPage[0]) pageToRemove.addClass('cached'); + if (dynamicNavbar && navbarToRemove.length && navbarToRemove[0] !== newNavbarInner[0]) { + navbarToRemove.addClass('cached'); + } + } + else { + var removeNavbar = dynamicNavbar && navbarToRemove.length; + if (pageToRemove.length) { + app.pageRemoveCallback(view, pageToRemove[0], 'right'); + if (removeNavbar) { + app.navbarRemoveCallback(view, pageToRemove[0], navbar[0], navbarToRemove[0]); + } + pageToRemove.remove(); + if (removeNavbar) navbarToRemove.remove(); + } + else if (removeNavbar) { + app.navbarRemoveCallback(view, pageToRemove[0], navbar[0], navbarToRemove[0]); + navbarToRemove.remove(); + } + } + pagesInView = pagesContainer.children('.page:not(.cached)'); + if (dynamicNavbar) { + navbarInners = viewContainer.find('.navbar-inner:not(.cached)'); + } + if (view.history.indexOf(url) >= 0) { + view.history = view.history.slice(0, view.history.indexOf(url) + 2); + } + else { + if (view.history[[view.history.length - 2]]) { + view.history[view.history.length - 2] = url; + } + else { + view.history.unshift(url); + } + } + } + + oldPage = $(pagesInView[pagesInView.length - 1]); + if (view.params.domCache) { + if (oldPage[0] === newPage[0]) { + oldPage = pagesContainer.children('.page.page-on-center'); + if (oldPage.length === 0 && view.activePage) oldPage = $(view.activePage.container); + } + } + + if (dynamicNavbar && !oldNavbarInner) { + oldNavbarInner = $(navbarInners[navbarInners.length - 1]); + if (view.params.domCache) { + if (oldNavbarInner[0] === newNavbarInner[0]) { + oldNavbarInner = navbar.children('.navbar-inner.navbar-on-center:not(.cached)'); + } + if (oldNavbarInner.length === 0) { + oldNavbarInner = navbar.children('.navbar-inner[data-page="'+oldPage.attr('data-page')+'"]'); + } + } + if (oldNavbarInner.length === 0 || newNavbarInner[0] === oldNavbarInner[0]) dynamicNavbar = false; + } + + if (dynamicNavbar) { + if (manipulateDom) newNavbarInner.insertBefore(oldNavbarInner); + newNavbarInner[0].f7RelatedPage = newPage[0]; + newPage[0].f7RelatedNavbar = newNavbarInner[0]; + } + if (manipulateDom) newPage.insertBefore(oldPage); + + // Page Init Events + app.pageInitCallback(view, { + pageContainer: newPage[0], + url: url, + position: 'left', + navbarInnerContainer: dynamicNavbar ? newNavbarInner[0] : undefined, + oldNavbarInnerContainer: dynamicNavbar ? oldNavbarInner && oldNavbarInner[0] : undefined, + context: t7_rendered.context, + query: options.query, + fromPage: oldPage && oldPage.length && oldPage[0].f7PageData, + preloadOnly: preloadOnly + }); + if (dynamicNavbar) { + app.navbarInitCallback(view, newPage[0], navbar[0], newNavbarInner[0], url, 'right'); + } + + if (dynamicNavbar && newNavbarInner.hasClass('navbar-on-left') && animatePages) { + app.router.prepareNavbar(newNavbarInner, oldNavbarInner, 'left'); + } + + if (preloadOnly) { + view.allowPageChange = true; + return; + } + + // Update View's URL + view.url = url; + + // Force reLayout + var clientLeft = newPage[0].clientLeft; + + animateBack(); + + // Push state + if (app.params.pushState && view.main) { + if (typeof pushState === 'undefined') pushState = true; + if (!preloadOnly && history.state && pushState) { + history.back(); + } + } + return; + } + + // Simple go back when we have pages on left + if (pagesInView.length > 1 && !force) { + // Exit if only preloadOnly + if (preloadOnly) { + view.allowPageChange = true; + return; + } + // Update View's URL + view.url = view.history[view.history.length - 2]; + url = view.url; + + // Define old and new pages + newPage = $(pagesInView[pagesInView.length - 2]); + oldPage = $(pagesInView[pagesInView.length - 1]); + + // Dynamic navbar + if (view.params.dynamicNavbar) { + dynamicNavbar = true; + // Find navbar + navbarInners = viewContainer.find('.navbar-inner:not(.cached)'); + newNavbarInner = $(navbarInners[0]); + oldNavbarInner = $(navbarInners[1]); + if (newNavbarInner.length === 0 || oldNavbarInner.length === 0 || oldNavbarInner[0] === newNavbarInner[0]) { + dynamicNavbar = false; + } + } + manipulateDom = false; + setPages(); + return; + } + + if (!force) { + // Go back when there is no pages on left + if (!preloadOnly) { + view.url = view.history[view.history.length - 2]; + url = view.url; + } + + if (content) { + parseNewPage(); + setPages(); + return; + } + else if (pageName) { + // Get dom cached pages + newPage = $(viewContainer).find('.page[data-page="' + pageName + '"]'); + if (view.params.dynamicNavbar) { + newNavbarInner = $(viewContainer).find('.navbar-inner[data-page="' + pageName + '"]'); + if (newNavbarInner.length === 0 && newPage[0].f7RelatedNavbar) { + newNavbarInner = $(newPage[0].f7RelatedNavbar); + } + if (newNavbarInner.length === 0 && newPage[0].f7PageData) { + newNavbarInner = $(newPage[0].f7PageData.navbarInnerContainer); + } + } + setPages(); + return; + } + else { + view.allowPageChange = true; + return; + } + } + else { + if (url && url === view.url || pageName && view.activePage && view.activePage.name === pageName) { + view.allowPageChange = true; + return; + } + // Go back with force url + if (content) { + parseNewPage(); + setPages(); + return; + } + else if (pageName && view.params.domCache) { + if (pageName) url = '#' + pageName; + + newPage = $(viewContainer).find('.page[data-page="' + pageName + '"]'); + if (newPage[0].f7PageData && newPage[0].f7PageData.url) { + url = newPage[0].f7PageData.url; + } + if (view.params.dynamicNavbar) { + newNavbarInner = $(viewContainer).find('.navbar-inner[data-page="' + pageName + '"]'); + if (newNavbarInner.length === 0 && newPage[0].f7RelatedNavbar) { + newNavbarInner = $(newPage[0].f7RelatedNavbar); + } + if (newNavbarInner.length === 0 && newPage[0].f7PageData) { + newNavbarInner = $(newPage[0].f7PageData.navbarInnerContainer); + } + } + setPages(); + return; + } + else { + view.allowPageChange = true; + return; + } + } + + }; + app.router.back = function (view, options) { + options = options || {}; + if (app.router.preroute(view, options, true)) { + return false; + } + var url = options.url; + var content = options.content; + var pageName = options.pageName; + if (pageName) { + if (pageName.indexOf('?') > 0) { + options.query = $.parseUrlQuery(pageName); + options.pageName = pageName = pageName.split('?')[0]; + } + } + var force = options.force; + if (!view.allowPageChange) return false; + view.allowPageChange = false; + if (app.xhr && view.xhr && view.xhr === app.xhr) { + app.xhr.abort(); + app.xhr = false; + } + var pagesInView = $(view.pagesContainer).find('.page:not(.cached)'); + + function proceed(content) { + app.router.preprocess(view, content, url, function (content) { + options.content = content; + app.router._back(view, options); + }); + } + if (pagesInView.length > 1 && !force) { + // Simple go back to previos page in view + app.router._back(view, options); + return; + } + if (!force) { + url = options.url = view.history[view.history.length - 2]; + if (!url) { + view.allowPageChange = true; + return; + } + if (url.indexOf('#') === 0 && view.contentCache[url]) { + proceed(view.contentCache[url]); + return; + } + else if (url.indexOf('#') === 0 && view.params.domCache) { + if (!pageName) options.pageName = url.split('#')[1]; + proceed(); + return; + } + else if (url.indexOf('#') !== 0) { + // Load ajax page + app.get(options.url, view, options.ignoreCache, function (content, error) { + if (error) { + view.allowPageChange = true; + return; + } + proceed(content); + }); + return; + } + } + else { + // Go back with force url + if (!url && content) { + proceed(content); + return; + } + else if (!url && pageName) { + if (pageName) url = '#' + pageName; + proceed(); + return; + } + else if (url) { + app.get(options.url, view, options.ignoreCache, function (content, error) { + if (error) { + view.allowPageChange = true; + return; + } + proceed(content); + }); + return; + } + } + view.allowPageChange = true; + return; + }; + + app.router.afterBack = function (view, oldPage, newPage) { + // Remove old page and set classes on new one + oldPage = $(oldPage); + newPage = $(newPage); + + if (view.params.domCache && view.initialPages.indexOf(oldPage[0]) >= 0) { + oldPage.removeClass('page-from-center-to-right').addClass('cached'); + } + else { + app.pageRemoveCallback(view, oldPage[0], 'right'); + oldPage.remove(); + } + + newPage.removeClass('page-from-left-to-center page-on-left').addClass('page-on-center'); + view.allowPageChange = true; + + // Update View's History + var previousURL = view.history.pop(); + + var newNavbar; + + // Updated dynamic navbar + if (view.params.dynamicNavbar) { + var inners = $(view.container).find('.navbar-inner:not(.cached)'); + var oldNavbar = $(oldPage[0].f7RelatedNavbar || inners[1]); + if (view.params.domCache && view.initialNavbars.indexOf(oldNavbar[0]) >= 0) { + oldNavbar.removeClass('navbar-from-center-to-right').addClass('cached'); + } + else { + app.navbarRemoveCallback(view, oldPage[0], undefined, oldNavbar[0]); + oldNavbar.remove(); + } + newNavbar = $(inners[0]).removeClass('navbar-on-left navbar-from-left-to-center').addClass('navbar-on-center'); + } + + // Remove pages in dom cache + if (view.params.domCache) { + $(view.container).find('.page.cached').each(function () { + var page = $(this); + var index = page.index(); + var pageUrl = page[0].f7PageData && page[0].f7PageData.url; + if (pageUrl && view.history.indexOf(pageUrl) < 0 && view.initialPages.indexOf(this) < 0) { + app.pageRemoveCallback(view, page[0], 'right'); + if (page[0].f7RelatedNavbar && view.params.dynamicNavbar) app.navbarRemoveCallback(view, page[0], undefined, page[0].f7RelatedNavbar); + page.remove(); + if (page[0].f7RelatedNavbar && view.params.dynamicNavbar) $(page[0].f7RelatedNavbar).remove(); + } + }); + } + + // Check previous page is content based only and remove it from content cache + if (!view.params.domCache && + previousURL && + previousURL.indexOf('#') > -1 && + (previousURL in view.contentCache) && + // If the same page is in the history multiple times, don't remove it. + view.history.indexOf(previousURL) === -1) { + view.contentCache[previousURL] = null; + delete view.contentCache[previousURL]; + } + + if (app.params.pushState && view.main) app.pushStateClearQueue(); + + // Preload previous page + if (view.params.preloadPreviousPage) { + if (view.params.domCache && view.history.length > 1) { + var preloadUrl = view.history[view.history.length - 2]; + var previousPage; + var previousNavbar; + if (preloadUrl && view.pagesCache[preloadUrl]) { + // Load by page name + previousPage = $(view.container).find('.page[data-page="' + view.pagesCache[preloadUrl] + '"]'); + if (previousPage.next('.page')[0] !== newPage[0]) previousPage.insertBefore(newPage); + if (newNavbar) { + previousNavbar = $(view.container).find('.navbar-inner[data-page="' + view.pagesCache[preloadUrl] + '"]'); + if(!previousNavbar || previousNavbar.length === 0) previousNavbar = newNavbar.prev('.navbar-inner.cached'); + if (previousNavbar.next('.navbar-inner')[0] !== newNavbar[0]) previousNavbar.insertBefore(newNavbar); + } + } + else { + // Just load previous page + previousPage = newPage.prev('.page.cached'); + if (newNavbar) previousNavbar = newNavbar.prev('.navbar-inner.cached'); + } + if (previousPage && previousPage.length > 0) previousPage.removeClass('cached page-on-right page-on-center').addClass('page-on-left'); + if (previousNavbar && previousNavbar.length > 0) previousNavbar.removeClass('cached navbar-on-right navbar-on-center').addClass('navbar-on-left'); + } + else { + app.router.back(view, {preloadOnly: true}); + } + } + }; + + + /*====================================================== + ************ Modals ************ + ======================================================*/ + var _modalTemplateTempDiv = document.createElement('div'); + app.modalStack = []; + app.modalStackClearQueue = function () { + if (app.modalStack.length) { + (app.modalStack.shift())(); + } + }; + app.modal = function (params) { + params = params || {}; + var modalHTML = ''; + if (app.params.modalTemplate) { + if (!app._compiledTemplates.modal) app._compiledTemplates.modal = t7.compile(app.params.modalTemplate); + modalHTML = app._compiledTemplates.modal(params); + } + else { + var buttonsHTML = ''; + if (params.buttons && params.buttons.length > 0) { + for (var i = 0; i < params.buttons.length; i++) { + buttonsHTML += '' + params.buttons[i].text + ''; + } + } + var titleHTML = params.title ? '' : ''; + var textHTML = params.text ? '' : ''; + var afterTextHTML = params.afterText ? params.afterText : ''; + var noButtons = !params.buttons || params.buttons.length === 0 ? 'modal-no-buttons' : ''; + var verticalButtons = params.verticalButtons ? 'modal-buttons-vertical': ''; + var modalButtonsHTML = params.buttons && params.buttons.length > 0 ? '' : ''; + modalHTML = ''; + } + + _modalTemplateTempDiv.innerHTML = modalHTML; + + var modal = $(_modalTemplateTempDiv).children(); + + $('body').append(modal[0]); + + // Add events on buttons + modal.find('.modal-button').each(function (index, el) { + $(el).on('click', function (e) { + if (params.buttons[index].close !== false) app.closeModal(modal); + if (params.buttons[index].onClick) params.buttons[index].onClick(modal, e); + if (params.onClick) params.onClick(modal, index); + }); + }); + app.openModal(modal); + return modal[0]; + }; + app.alert = function (text, title, callbackOk) { + if (typeof title === 'function') { + callbackOk = arguments[1]; + title = undefined; + } + return app.modal({ + text: text || '', + title: typeof title === 'undefined' ? app.params.modalTitle : title, + buttons: [ {text: app.params.modalButtonOk, bold: true, onClick: callbackOk} ] + }); + }; + app.confirm = function (text, title, callbackOk, callbackCancel) { + if (typeof title === 'function') { + callbackCancel = arguments[2]; + callbackOk = arguments[1]; + title = undefined; + } + return app.modal({ + text: text || '', + title: typeof title === 'undefined' ? app.params.modalTitle : title, + buttons: [ + {text: app.params.modalButtonCancel, onClick: callbackCancel}, + {text: app.params.modalButtonOk, bold: true, onClick: callbackOk} + ] + }); + }; + app.prompt = function (text, title, callbackOk, callbackCancel) { + if (typeof title === 'function') { + callbackCancel = arguments[2]; + callbackOk = arguments[1]; + title = undefined; + } + return app.modal({ + text: text || '', + title: typeof title === 'undefined' ? app.params.modalTitle : title, + afterText: '
', + buttons: [ + { + text: app.params.modalButtonCancel + }, + { + text: app.params.modalButtonOk, + bold: true + } + ], + onClick: function (modal, index) { + if (index === 0 && callbackCancel) callbackCancel($(modal).find('.modal-text-input').val()); + if (index === 1 && callbackOk) callbackOk($(modal).find('.modal-text-input').val()); + } + }); + }; + app.modalLogin = function (text, title, callbackOk, callbackCancel) { + if (typeof title === 'function') { + callbackCancel = arguments[2]; + callbackOk = arguments[1]; + title = undefined; + } + return app.modal({ + text: text || '', + title: typeof title === 'undefined' ? app.params.modalTitle : title, + afterText: '', + buttons: [ + { + text: app.params.modalButtonCancel + }, + { + text: app.params.modalButtonOk, + bold: true + } + ], + onClick: function (modal, index) { + var username = $(modal).find('.modal-text-input[name="modal-username"]').val(); + var password = $(modal).find('.modal-text-input[name="modal-password"]').val(); + if (index === 0 && callbackCancel) callbackCancel(username, password); + if (index === 1 && callbackOk) callbackOk(username, password); + } + }); + }; + app.modalPassword = function (text, title, callbackOk, callbackCancel) { + if (typeof title === 'function') { + callbackCancel = arguments[2]; + callbackOk = arguments[1]; + title = undefined; + } + return app.modal({ + text: text || '', + title: typeof title === 'undefined' ? app.params.modalTitle : title, + afterText: '
', + buttons: [ + { + text: app.params.modalButtonCancel + }, + { + text: app.params.modalButtonOk, + bold: true + } + ], + onClick: function (modal, index) { + var password = $(modal).find('.modal-text-input[name="modal-password"]').val(); + if (index === 0 && callbackCancel) callbackCancel(password); + if (index === 1 && callbackOk) callbackOk(password); + } + }); + }; + app.showPreloader = function (title) { + return app.modal({ + title: title || app.params.modalPreloaderTitle, + text: '
' + (app.params.material ? app.params.materialPreloaderHtml : '') + '
', + cssClass: 'modal-preloader' + }); + }; + app.hidePreloader = function () { + app.closeModal('.modal.modal-in'); + }; + app.showIndicator = function () { + $('body').append('
' + (app.params.material ? app.params.materialPreloaderHtml : '') + '
'); + }; + app.hideIndicator = function () { + $('.preloader-indicator-overlay, .preloader-indicator-modal').remove(); + }; + // Action Sheet + app.actions = function (target, params) { + var toPopover = false, modal, groupSelector, buttonSelector; + if (arguments.length === 1) { + // Actions + params = target; + } + else { + // Popover + if (app.device.ios) { + if (app.device.ipad) toPopover = true; + } + else { + if ($(window).width() >= 768) toPopover = true; + } + } + params = params || []; + + if (params.length > 0 && !$.isArray(params[0])) { + params = [params]; + } + var modalHTML; + if (toPopover) { + var actionsToPopoverTemplate = app.params.modalActionsToPopoverTemplate || + '
' + + '
' + + '{{#each this}}' + + '
' + + '
    ' + + '{{#each this}}' + + '{{#if label}}' + + '
  • {{text}}
  • ' + + '{{else}}' + + '
  • {{text}}
  • ' + + '{{/if}}' + + '{{/each}}' + + '
' + + '
' + + '{{/each}}' + + '
' + + '
'; + if (!app._compiledTemplates.actionsToPopover) { + app._compiledTemplates.actionsToPopover = t7.compile(actionsToPopoverTemplate); + } + var popoverHTML = app._compiledTemplates.actionsToPopover(params); + modal = $(app.popover(popoverHTML, target, true)); + groupSelector = '.list-block ul'; + buttonSelector = '.list-button'; + } + else { + if (app.params.modalActionsTemplate) { + if (!app._compiledTemplates.actions) app._compiledTemplates.actions = t7.compile(app.params.modalActionsTemplate); + modalHTML = app._compiledTemplates.actions(params); + } + else { + var buttonsHTML = ''; + for (var i = 0; i < params.length; i++) { + for (var j = 0; j < params[i].length; j++) { + if (j === 0) buttonsHTML += '
'; + var button = params[i][j]; + var buttonClass = button.label ? 'actions-modal-label' : 'actions-modal-button'; + if (button.bold) buttonClass += ' actions-modal-button-bold'; + if (button.color) buttonClass += ' color-' + button.color; + if (button.bg) buttonClass += ' bg-' + button.bg; + if (button.disabled) buttonClass += ' disabled'; + buttonsHTML += '
' + button.text + '
'; + if (j === params[i].length - 1) buttonsHTML += '
'; + } + } + modalHTML = '
' + buttonsHTML + '
'; + } + _modalTemplateTempDiv.innerHTML = modalHTML; + modal = $(_modalTemplateTempDiv).children(); + $('body').append(modal[0]); + groupSelector = '.actions-modal-group'; + buttonSelector = '.actions-modal-button'; + } + + var groups = modal.find(groupSelector); + groups.each(function (index, el) { + var groupIndex = index; + $(el).children().each(function (index, el) { + var buttonIndex = index; + var buttonParams = params[groupIndex][buttonIndex]; + var clickTarget; + if (!toPopover && $(el).is(buttonSelector)) clickTarget = $(el); + if (toPopover && $(el).find(buttonSelector).length > 0) clickTarget = $(el).find(buttonSelector); + + if (clickTarget) { + clickTarget.on('click', function (e) { + if (buttonParams.close !== false) app.closeModal(modal); + if (buttonParams.onClick) buttonParams.onClick(modal, e); + }); + } + }); + }); + if (!toPopover) app.openModal(modal); + return modal[0]; + }; + app.popover = function (modal, target, removeOnClose) { + if (typeof removeOnClose === 'undefined') removeOnClose = true; + if (typeof modal === 'string' && modal.indexOf('<') >= 0) { + var _modal = document.createElement('div'); + _modal.innerHTML = modal.trim(); + if (_modal.childNodes.length > 0) { + modal = _modal.childNodes[0]; + if (removeOnClose) modal.classList.add('remove-on-close'); + $('body').append(modal); + } + else return false; //nothing found + } + modal = $(modal); + target = $(target); + if (modal.length === 0 || target.length === 0) return false; + if (modal.parents('body').length === 0) { + if (removeOnClose) modal.addClass('remove-on-close'); + $('body').append(modal[0]); + } + if (modal.find('.popover-angle').length === 0 && !app.params.material) { + modal.append('
'); + } + modal.show(); + + var material = app.params.material; + + function sizePopover() { + modal.css({left: '', top: ''}); + var modalWidth = modal.width(); + var modalHeight = modal.height(); // 13 - height of angle + var modalAngle, modalAngleSize = 0, modalAngleLeft, modalAngleTop; + if (!material) { + modalAngle = modal.find('.popover-angle'); + modalAngleSize = modalAngle.width() / 2; + modalAngle.removeClass('on-left on-right on-top on-bottom').css({left: '', top: ''}); + } + else { + modal.removeClass('popover-on-left popover-on-right popover-on-top popover-on-bottom').css({left: '', top: ''}); + } + + var targetWidth = target.outerWidth(); + var targetHeight = target.outerHeight(); + var targetOffset = target.offset(); + var targetParentPage = target.parents('.page'); + if (targetParentPage.length > 0) { + targetOffset.top = targetOffset.top - targetParentPage[0].scrollTop; + } + + var windowHeight = $(window).height(); + var windowWidth = $(window).width(); + + var modalTop = 0; + var modalLeft = 0; + var diff = 0; + // Top Position + var modalPosition = material ? 'bottom' : 'top'; + if (material) { + if (modalHeight < windowHeight - targetOffset.top - targetHeight) { + // On bottom + modalPosition = 'bottom'; + modalTop = targetOffset.top; + } + else if (modalHeight < targetOffset.top) { + // On top + modalTop = targetOffset.top - modalHeight + targetHeight; + modalPosition = 'top'; + } + else { + // On middle + modalPosition = 'bottom'; + modalTop = targetOffset.top; + } + + if (modalTop <= 0) { + modalTop = 8; + } + else if (modalTop + modalHeight >= windowHeight) { + modalTop = windowHeight - modalHeight - 8; + } + + // Horizontal Position + modalLeft = targetOffset.left; + if (modalLeft + modalWidth >= windowWidth - 8) { + modalLeft = targetOffset.left + targetWidth - modalWidth - 8; + } + if (modalLeft < 8) { + modalLeft = 8; + } + if (modalPosition === 'top') { + modal.addClass('popover-on-top'); + } + if (modalPosition === 'bottom') { + modal.addClass('popover-on-bottom'); + } + if (target.hasClass('floating-button-to-popover') && !modal.hasClass('modal-in')) { + modal.addClass('popover-floating-button'); + var diffX = (modalLeft + modalWidth / 2) - (targetOffset.left + targetWidth / 2), + diffY = (modalTop + modalHeight / 2) - (targetOffset.top + targetHeight / 2); + target + .addClass('floating-button-to-popover-in') + .transform('translate3d(' + diffX + 'px, ' + diffY + 'px,0)') + .transitionEnd(function (e) { + if (!target.hasClass('floating-button-to-popover-in')) return; + target + .addClass('floating-button-to-popover-scale') + .transform('translate3d(' + diffX + 'px, ' + diffY + 'px,0) scale(' + (modalWidth/targetWidth) + ', ' + (modalHeight/targetHeight) + ')'); + }); + + modal.once('close', function () { + target + .removeClass('floating-button-to-popover-in floating-button-to-popover-scale') + .addClass('floating-button-to-popover-out') + .transform('') + .transitionEnd(function (e) { + target.removeClass('floating-button-to-popover-out'); + }); + }); + modal.once('closed', function () { + modal.removeClass('popover-floating-button'); + }); + } + + } + else { + if ((modalHeight + modalAngleSize) < targetOffset.top) { + // On top + modalTop = targetOffset.top - modalHeight - modalAngleSize; + } + else if ((modalHeight + modalAngleSize) < windowHeight - targetOffset.top - targetHeight) { + // On bottom + modalPosition = 'bottom'; + modalTop = targetOffset.top + targetHeight + modalAngleSize; + } + else { + // On middle + modalPosition = 'middle'; + modalTop = targetHeight / 2 + targetOffset.top - modalHeight / 2; + diff = modalTop; + if (modalTop <= 0) { + modalTop = 5; + } + else if (modalTop + modalHeight >= windowHeight) { + modalTop = windowHeight - modalHeight - 5; + } + diff = diff - modalTop; + } + + // Horizontal Position + if (modalPosition === 'top' || modalPosition === 'bottom') { + modalLeft = targetWidth / 2 + targetOffset.left - modalWidth / 2; + diff = modalLeft; + if (modalLeft < 5) modalLeft = 5; + if (modalLeft + modalWidth > windowWidth) modalLeft = windowWidth - modalWidth - 5; + if (modalPosition === 'top') { + modalAngle.addClass('on-bottom'); + } + if (modalPosition === 'bottom') { + modalAngle.addClass('on-top'); + } + diff = diff - modalLeft; + modalAngleLeft = (modalWidth / 2 - modalAngleSize + diff); + modalAngleLeft = Math.max(Math.min(modalAngleLeft, modalWidth - modalAngleSize * 2 - 13), 13); + modalAngle.css({left: modalAngleLeft + 'px'}); + + } + else if (modalPosition === 'middle') { + modalLeft = targetOffset.left - modalWidth - modalAngleSize; + modalAngle.addClass('on-right'); + if (modalLeft < 5 || (modalLeft + modalWidth > windowWidth)) { + if (modalLeft < 5) modalLeft = targetOffset.left + targetWidth + modalAngleSize; + if (modalLeft + modalWidth > windowWidth) modalLeft = windowWidth - modalWidth - 5; + modalAngle.removeClass('on-right').addClass('on-left'); + } + modalAngleTop = (modalHeight / 2 - modalAngleSize + diff); + modalAngleTop = Math.max(Math.min(modalAngleTop, modalHeight - modalAngleSize * 2 - 13), 13); + modalAngle.css({top: modalAngleTop + 'px'}); + } + } + + + // Apply Styles + modal.css({top: modalTop + 'px', left: modalLeft + 'px'}); + } + + sizePopover(); + + $(window).on('resize', sizePopover); + + modal.on('close', function () { + $(window).off('resize', sizePopover); + }); + + app.openModal(modal); + return modal[0]; + }; + app.popup = function (modal, removeOnClose) { + if (typeof removeOnClose === 'undefined') removeOnClose = true; + if (typeof modal === 'string' && modal.indexOf('<') >= 0) { + var _modal = document.createElement('div'); + _modal.innerHTML = modal.trim(); + if (_modal.childNodes.length > 0) { + modal = _modal.childNodes[0]; + if (removeOnClose) modal.classList.add('remove-on-close'); + $('body').append(modal); + } + else return false; //nothing found + } + modal = $(modal); + if (modal.length === 0) return false; + if (modal.parents('body').length === 0) { + if (removeOnClose) modal.addClass('remove-on-close'); + $('body').append(modal[0]); + } + modal.show(); + + app.openModal(modal); + return modal[0]; + }; + app.pickerModal = function (modal, removeOnClose) { + if (typeof removeOnClose === 'undefined') removeOnClose = true; + if (typeof modal === 'string' && modal.indexOf('<') >= 0) { + modal = $(modal); + if (modal.length > 0) { + if (removeOnClose) modal.addClass('remove-on-close'); + $('body').append(modal[0]); + } + else return false; //nothing found + } + modal = $(modal); + if (modal.length === 0) return false; + if (modal.parents('body').length === 0) { + if (removeOnClose) modal.addClass('remove-on-close'); + $('body').append(modal[0]); + } + if ($('.picker-modal.modal-in:not(.modal-out)').length > 0 && !modal.hasClass('modal-in')) { + app.closeModal('.picker-modal.modal-in:not(.modal-out)'); + } + modal.show(); + app.openModal(modal); + return modal[0]; + }; + app.loginScreen = function (modal) { + if (!modal) modal = '.login-screen'; + modal = $(modal); + if (modal.length === 0) return false; + if ($('.login-screen.modal-in:not(.modal-out)').length > 0 && !modal.hasClass('modal-in')) { + app.closeModal('.login-screen.modal-in:not(.modal-out)'); + } + modal.show(); + + app.openModal(modal); + return modal[0]; + }; + app.openModal = function (modal) { + modal = $(modal); + var isModal = modal.hasClass('modal'); + if ($('.modal.modal-in:not(.modal-out)').length && app.params.modalStack && isModal) { + app.modalStack.push(function () { + app.openModal(modal); + }); + return; + } + // do nothing if this modal already shown + if (true === modal.data('f7-modal-shown')) { + return; + } + modal.data('f7-modal-shown', true); + modal.once('close', function() { + modal.removeData('f7-modal-shown'); + }); + var isPopover = modal.hasClass('popover'); + var isPopup = modal.hasClass('popup'); + var isLoginScreen = modal.hasClass('login-screen'); + var isPickerModal = modal.hasClass('picker-modal'); + if (isModal) { + modal.show(); + modal.css({ + marginTop: - Math.round(modal.outerHeight() / 2) + 'px' + }); + } + + var overlay; + if (!isLoginScreen && !isPickerModal) { + if ($('.modal-overlay').length === 0 && !isPopup) { + $('body').append(''); + } + if ($('.popup-overlay').length === 0 && isPopup) { + $('body').append(''); + } + overlay = isPopup ? $('.popup-overlay') : $('.modal-overlay'); + } + if (app.params.material && isPickerModal) { + if (modal.hasClass('picker-calendar')) { + if ($('.picker-modal-overlay').length === 0 && !isPopup) { + $('body').append('
'); + } + overlay = $('.picker-modal-overlay'); + } + } + + //Make sure that styles are applied, trigger relayout; + var clientLeft = modal[0].clientLeft; + + // Trugger open event + modal.trigger('open'); + + // Picker modal body class + if (isPickerModal) { + $('body').addClass('with-picker-modal'); + } + + // Init Pages and Navbars in modal + if (modal.find('.' + app.params.viewClass).length > 0) { + modal.find('.page').each(function () { + app.initPageWithCallback(this); + }); + modal.find('.navbar').each(function () { + app.initNavbarWithCallback(this); + }); + } + + // Classes for transition in + if (!isLoginScreen && !isPickerModal) overlay.addClass('modal-overlay-visible'); + if (app.params.material && isPickerModal && overlay) overlay.addClass('modal-overlay-visible'); + modal.removeClass('modal-out').addClass('modal-in').transitionEnd(function (e) { + if (modal.hasClass('modal-out')) modal.trigger('closed'); + else modal.trigger('opened'); + }); + return true; + }; + app.closeModal = function (modal) { + modal = $(modal || '.modal-in'); + if (typeof modal !== 'undefined' && modal.length === 0) { + return; + } + var isModal = modal.hasClass('modal'); + var isPopover = modal.hasClass('popover'); + var isPopup = modal.hasClass('popup'); + var isLoginScreen = modal.hasClass('login-screen'); + var isPickerModal = modal.hasClass('picker-modal'); + + var removeOnClose = modal.hasClass('remove-on-close'); + + var overlay; + + if (isPopup) overlay = $('.popup-overlay'); + else { + if (isPickerModal && app.params.material) overlay = $('.picker-modal-overlay'); + else if (!isPickerModal) overlay = $('.modal-overlay'); + } + + if (isPopup){ + if (modal.length === $('.popup.modal-in').length) { + overlay.removeClass('modal-overlay-visible'); + } + } + else if (overlay && overlay.length > 0) { + overlay.removeClass('modal-overlay-visible'); + } + + modal.trigger('close'); + + // Picker modal body class + if (isPickerModal) { + $('body').removeClass('with-picker-modal'); + $('body').addClass('picker-modal-closing'); + } + + if (!(isPopover && !app.params.material)) { + modal.removeClass('modal-in').addClass('modal-out').transitionEnd(function (e) { + if (modal.hasClass('modal-out')) modal.trigger('closed'); + else { + modal.trigger('opened'); + if (isPopover) return; + } + + if (isPickerModal) { + $('body').removeClass('picker-modal-closing'); + } + if (isPopup || isLoginScreen || isPickerModal || isPopover) { + modal.removeClass('modal-out').hide(); + if (removeOnClose && modal.length > 0) { + modal.remove(); + } + } + else { + modal.remove(); + } + }); + if (isModal && app.params.modalStack) { + app.modalStackClearQueue(); + } + } + else { + modal.removeClass('modal-in modal-out').trigger('closed').hide(); + if (removeOnClose) { + modal.remove(); + } + } + return true; + }; + + + /*=============================================================================== + ************ Progress Bar ************ + ===============================================================================*/ + app.setProgressbar = function (container, progress, speed) { + container = $(container || 'body'); + if (container.length === 0) return; + if (progress) progress = Math.min(Math.max(progress, 0), 100); + var progressbar; + if (container.hasClass('progressbar')) progressbar = container; + else { + progressbar = container.children('.progressbar'); + } + if (progressbar.length === 0 || progressbar.hasClass('progressbar-infinite')) return; + var clientLeft = progressbar[0].clientLeft; + progressbar.children('span').transform('translate3d(' + (-100 + progress) + '%,0,0)'); + if (typeof speed !== 'undefined') { + progressbar.children('span').transition(speed); + } + else { + progressbar.children('span').transition(''); + } + return progressbar[0]; + }; + app.showProgressbar = function (container, progress, color) { + if (typeof container === 'number') { + container = 'body'; + progress = arguments[0]; + color = arguments[1]; + } + if (progress && typeof progress === 'string' && parseFloat(progress) !== progress * 1) { + color = progress; + progress = undefined; + } + container = $(container || 'body'); + if (container.length === 0) return; + var progressbar; + if (container.hasClass('progressbar')) progressbar = container; + else { + progressbar = container.children('.progressbar:not(.progressbar-out), .progressbar-infinite:not(.progressbar-out)'); + if (progressbar.length === 0) { + // Create one + if (typeof progress !== 'undefined') { + // Determined + progressbar = $(''); + } + else { + // Infinite + progressbar = $(''); + } + container.append(progressbar); + } + } + if (progress) app.setProgressbar(container, progress); + return progressbar[0]; + }; + app.hideProgressbar = function (container) { + container = $(container || 'body'); + if (container.length === 0) return; + var progressbar; + if (container.hasClass('progressbar')) progressbar = container; + else { + progressbar = container.children('.progressbar, .progressbar-infinite'); + } + if (progressbar.length === 0 || !progressbar.hasClass('progressbar-in') || progressbar.hasClass('progressbar-out')) return; + progressbar.removeClass('progressbar-in').addClass('progressbar-out').animationEnd(function () { + progressbar.remove(); + progressbar = null; + }); + return; + }; + app.initPageProgressbar = function (pageContainer) { + pageContainer = $(pageContainer); + pageContainer.find('.progressbar').each(function () { + var p = $(this); + if (p.children('span').length === 0) p.append(''); + if (p.attr('data-progress')) app.setProgressbar(p, p.attr('data-progress')); + }); + }; + + /*====================================================== + ************ Panels ************ + ======================================================*/ + app.allowPanelOpen = true; + app.openPanel = function (panelPosition) { + if (!app.allowPanelOpen) return false; + var panel = $('.panel-' + panelPosition); + if (panel.length === 0 || panel.hasClass('active')) return false; + app.closePanel(); // Close if some panel is opened + app.allowPanelOpen = false; + var effect = panel.hasClass('panel-reveal') ? 'reveal' : 'cover'; + panel.css({display: 'block'}).addClass('active'); + panel.trigger('open'); + if (app.params.material) { + $('.panel-overlay').show(); + } + if (panel.find('.' + app.params.viewClass).length > 0) { + if (app.sizeNavbars) app.sizeNavbars(panel.find('.' + app.params.viewClass)[0]); + } + + // Trigger reLayout + var clientLeft = panel[0].clientLeft; + + // Transition End; + var transitionEndTarget = effect === 'reveal' ? $('.' + app.params.viewsClass) : panel; + var openedTriggered = false; + + function panelTransitionEnd() { + transitionEndTarget.transitionEnd(function (e) { + if ($(e.target).is(transitionEndTarget)) { + if (panel.hasClass('active')) { + panel.trigger('opened'); + } + else { + panel.trigger('closed'); + } + if (app.params.material) $('.panel-overlay').css({display: ''}); + app.allowPanelOpen = true; + } + else panelTransitionEnd(); + }); + } + panelTransitionEnd(); + + $('body').addClass('with-panel-' + panelPosition + '-' + effect); + return true; + }; + app.closePanel = function () { + var activePanel = $('.panel.active'); + if (activePanel.length === 0) return false; + var effect = activePanel.hasClass('panel-reveal') ? 'reveal' : 'cover'; + var panelPosition = activePanel.hasClass('panel-left') ? 'left' : 'right'; + activePanel.removeClass('active'); + var transitionEndTarget = effect === 'reveal' ? $('.' + app.params.viewsClass) : activePanel; + activePanel.trigger('close'); + app.allowPanelOpen = false; + + transitionEndTarget.transitionEnd(function () { + if (activePanel.hasClass('active')) return; + activePanel.css({display: ''}); + activePanel.trigger('closed'); + $('body').removeClass('panel-closing'); + app.allowPanelOpen = true; + }); + + $('body').addClass('panel-closing').removeClass('with-panel-' + panelPosition + '-' + effect); + }; + /*====================================================== + ************ Swipe panels ************ + ======================================================*/ + app.initSwipePanels = function () { + var panel, side; + if (app.params.swipePanel) { + panel = $('.panel.panel-' + app.params.swipePanel); + side = app.params.swipePanel; + if (panel.length === 0) return; + } + else { + if (app.params.swipePanelOnlyClose) { + if ($('.panel').length === 0) return; + } + else return; + } + + var panelOverlay = $('.panel-overlay'); + var isTouched, isMoved, isScrolling, touchesStart = {}, touchStartTime, touchesDiff, translate, overlayOpacity, opened, panelWidth, effect, direction; + var views = $('.' + app.params.viewsClass); + + function handleTouchStart(e) { + if (!app.allowPanelOpen || (!app.params.swipePanel && !app.params.swipePanelOnlyClose) || isTouched) return; + if ($('.modal-in, .photo-browser-in').length > 0) return; + if (!(app.params.swipePanelCloseOpposite || app.params.swipePanelOnlyClose)) { + if ($('.panel.active').length > 0 && !panel.hasClass('active')) return; + } + touchesStart.x = e.type === 'touchstart' ? e.targetTouches[0].pageX : e.pageX; + touchesStart.y = e.type === 'touchstart' ? e.targetTouches[0].pageY : e.pageY; + if (app.params.swipePanelCloseOpposite || app.params.swipePanelOnlyClose) { + if ($('.panel.active').length > 0) { + side = $('.panel.active').hasClass('panel-left') ? 'left' : 'right'; + } + else { + if (app.params.swipePanelOnlyClose) return; + side = app.params.swipePanel; + } + if (!side) return; + } + panel = $('.panel.panel-' + side); + opened = panel.hasClass('active'); + if (app.params.swipePanelActiveArea && !opened) { + if (side === 'left') { + if (touchesStart.x > app.params.swipePanelActiveArea) return; + } + if (side === 'right') { + if (touchesStart.x < window.innerWidth - app.params.swipePanelActiveArea) return; + } + } + isMoved = false; + isTouched = true; + isScrolling = undefined; + + touchStartTime = (new Date()).getTime(); + direction = undefined; + } + function handleTouchMove(e) { + if (!isTouched) return; + if (e.f7PreventPanelSwipe) return; + var pageX = e.type === 'touchmove' ? e.targetTouches[0].pageX : e.pageX; + var pageY = e.type === 'touchmove' ? e.targetTouches[0].pageY : e.pageY; + if (typeof isScrolling === 'undefined') { + isScrolling = !!(isScrolling || Math.abs(pageY - touchesStart.y) > Math.abs(pageX - touchesStart.x)); + } + if (isScrolling) { + isTouched = false; + return; + } + if (!direction) { + if (pageX > touchesStart.x) { + direction = 'to-right'; + } + else { + direction = 'to-left'; + } + + if ( + side === 'left' && + ( + direction === 'to-left' && !panel.hasClass('active') + ) || + side === 'right' && + ( + direction === 'to-right' && !panel.hasClass('active') + ) + ) + { + isTouched = false; + return; + } + } + + if (app.params.swipePanelNoFollow) { + var timeDiff = (new Date()).getTime() - touchStartTime; + if (timeDiff < 300) { + if (direction === 'to-left') { + if (side === 'right') app.openPanel(side); + if (side === 'left' && panel.hasClass('active')) app.closePanel(); + } + if (direction === 'to-right') { + if (side === 'left') app.openPanel(side); + if (side === 'right' && panel.hasClass('active')) app.closePanel(); + } + } + isTouched = false; + isMoved = false; + return; + } + + if (!isMoved) { + effect = panel.hasClass('panel-cover') ? 'cover' : 'reveal'; + if (!opened) { + panel.show(); + panelOverlay.show(); + } + panelWidth = panel[0].offsetWidth; + panel.transition(0); + if (panel.find('.' + app.params.viewClass).length > 0) { + if (app.sizeNavbars) app.sizeNavbars(panel.find('.' + app.params.viewClass)[0]); + } + } + + isMoved = true; + + e.preventDefault(); + var threshold = opened ? 0 : -app.params.swipePanelThreshold; + if (side === 'right') threshold = -threshold; + + touchesDiff = pageX - touchesStart.x + threshold; + + if (side === 'right') { + translate = touchesDiff - (opened ? panelWidth : 0); + if (translate > 0) translate = 0; + if (translate < -panelWidth) { + translate = -panelWidth; + } + } + else { + translate = touchesDiff + (opened ? panelWidth : 0); + if (translate < 0) translate = 0; + if (translate > panelWidth) { + translate = panelWidth; + } + } + if (effect === 'reveal') { + views.transform('translate3d(' + translate + 'px,0,0)').transition(0); + panelOverlay.transform('translate3d(' + translate + 'px,0,0)').transition(0); + + app.pluginHook('swipePanelSetTransform', views[0], panel[0], Math.abs(translate / panelWidth)); + } + else { + panel.transform('translate3d(' + translate + 'px,0,0)').transition(0); + if (app.params.material) { + panelOverlay.transition(0); + overlayOpacity = Math.abs(translate/panelWidth); + panelOverlay.css({opacity: overlayOpacity}); + } + app.pluginHook('swipePanelSetTransform', views[0], panel[0], Math.abs(translate / panelWidth)); + } + } + function handleTouchEnd(e) { + if (!isTouched || !isMoved) { + isTouched = false; + isMoved = false; + return; + } + isTouched = false; + isMoved = false; + var timeDiff = (new Date()).getTime() - touchStartTime; + var action; + var edge = (translate === 0 || Math.abs(translate) === panelWidth); + + if (!opened) { + if (translate === 0) { + action = 'reset'; + } + else if ( + timeDiff < 300 && Math.abs(translate) > 0 || + timeDiff >= 300 && (Math.abs(translate) >= panelWidth / 2) + ) { + action = 'swap'; + } + else { + action = 'reset'; + } + } + else { + if (translate === -panelWidth) { + action = 'reset'; + } + else if ( + timeDiff < 300 && Math.abs(translate) >= 0 || + timeDiff >= 300 && (Math.abs(translate) <= panelWidth / 2) + ) { + if (side === 'left' && translate === panelWidth) action = 'reset'; + else action = 'swap'; + } + else { + action = 'reset'; + } + } + if (action === 'swap') { + app.allowPanelOpen = true; + if (opened) { + app.closePanel(); + if (edge) { + panel.css({display: ''}); + $('body').removeClass('panel-closing'); + } + } + else { + app.openPanel(side); + } + if (edge) app.allowPanelOpen = true; + } + if (action === 'reset') { + if (opened) { + app.allowPanelOpen = true; + app.openPanel(side); + } + else { + app.closePanel(); + if (edge) { + app.allowPanelOpen = true; + panel.css({display: ''}); + } + else { + var target = effect === 'reveal' ? views : panel; + panel.trigger('close'); + $('body').addClass('panel-closing'); + target.transitionEnd(function () { + panel.trigger('closed'); + panel.css({display: ''}); + $('body').removeClass('panel-closing'); + app.allowPanelOpen = true; + }); + } + } + } + if (effect === 'reveal') { + views.transition(''); + views.transform(''); + } + panel.transition('').transform(''); + panelOverlay.css({display: ''}).transform('').transition('').css('opacity', ''); + } + $(document).on(app.touchEvents.start, handleTouchStart); + $(document).on(app.touchEvents.move, handleTouchMove); + $(document).on(app.touchEvents.end, handleTouchEnd); + }; + + + /*====================================================== + ************ Image Lazy Loading ************ + ************ Based on solution by Marc Godard, https://github.com/MarcGodard ************ + ======================================================*/ + app.initImagesLazyLoad = function (pageContainer) { + pageContainer = $(pageContainer); + + // Lazy images + var lazyLoadImages; + if (pageContainer.hasClass('lazy')) { + lazyLoadImages = pageContainer; + pageContainer = lazyLoadImages.parents('.page'); + } + else { + lazyLoadImages = pageContainer.find('.lazy'); + } + if (lazyLoadImages.length === 0) return; + + // Scrollable page content + var pageContent; + if (pageContainer.hasClass('page-content')) { + pageContent = pageContainer; + pageContainer = pageContainer.parents('.page'); + } + else { + pageContent = pageContainer.find('.page-content'); + } + if (pageContent.length === 0) return; + + // Placeholder + var placeholderSrc = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABAQMAAAAl21bKAAAAA1BMVEXCwsK592mkAAAACklEQVQI12NgAAAAAgAB4iG8MwAAAABJRU5ErkJggg=='; + if (typeof app.params.imagesLazyLoadPlaceholder === 'string') { + placeholderSrc = app.params.imagesLazyLoadPlaceholder; + } + if (app.params.imagesLazyLoadPlaceholder !== false) lazyLoadImages.each(function(){ + if ($(this).attr('data-src')) $(this).attr('src', placeholderSrc); + }); + + // load image + var imagesSequence = []; + var imageIsLoading = false; + function loadImage(el) { + el = $(el); + + var bg = el.attr('data-background'); + var src = bg ? bg : el.attr('data-src'); + if (!src) return; + + function onLoad() { + el.removeClass('lazy').addClass('lazy-loaded'); + if (bg) { + el.css('background-image', 'url(' + src + ')'); + } + else { + el.attr('src', src); + } + + if (app.params.imagesLazyLoadSequential) { + imageIsLoading = false; + if (imagesSequence.length > 0) { + loadImage(imagesSequence.shift()); + } + } + } + + if (app.params.imagesLazyLoadSequential) { + if (imageIsLoading) { + if (imagesSequence.indexOf(el[0]) < 0) imagesSequence.push(el[0]); + return; + } + } + + // Loading flag + imageIsLoading = true; + + var image = new Image(); + image.onload = onLoad; + image.onerror = onLoad; + image.src =src; + } + function lazyHandler() { + lazyLoadImages = pageContainer.find('.lazy'); + lazyLoadImages.each(function(index, el) { + el = $(el); + if (el.parents('.tab:not(.active)').length > 0) { + return; + } + if (isElementInViewport(el[0])) { + loadImage(el); + } + }); + } + + function isElementInViewport (el) { + var rect = el.getBoundingClientRect(); + var threshold = app.params.imagesLazyLoadThreshold || 0; + return ( + rect.top >= (0 - threshold) && + rect.left >= (0 - threshold) && + rect.top <= (window.innerHeight + threshold) && + rect.left <= (window.innerWidth + threshold) + ); + } + + function attachEvents(destroy) { + var method = destroy ? 'off' : 'on'; + lazyLoadImages[method]('lazy', lazyHandler); + lazyLoadImages.parents('.tab')[method]('show', lazyHandler); + pageContainer[method]('lazy', lazyHandler); + pageContent[method]('lazy', lazyHandler); + pageContent[method]('scroll', lazyHandler); + $(window)[method]('resize', lazyHandler); + } + function detachEvents() { + attachEvents(true); + } + + // Store detach function + pageContainer[0].f7DestroyImagesLazyLoad = detachEvents; + + // Attach events + attachEvents(); + + // Destroy on page remove + if (pageContainer.hasClass('page')) { + pageContainer.once('pageBeforeRemove', detachEvents); + } + + // Run loader on page load/init + lazyHandler(); + + // Run after page animation + pageContainer.once('pageAfterAnimation', lazyHandler); + }; + app.destroyImagesLazyLoad = function (pageContainer) { + pageContainer = $(pageContainer); + if (pageContainer.length > 0 && pageContainer[0].f7DestroyImagesLazyLoad) { + pageContainer[0].f7DestroyImagesLazyLoad(); + } + }; + app.reinitImagesLazyLoad = function (pageContainer) { + pageContainer = $(pageContainer); + if (pageContainer.length > 0) { + pageContainer.trigger('lazy'); + } + }; + + /*====================================================== + ************ Material Preloader ************ + ======================================================*/ + app.initPageMaterialPreloader = function (pageContainer) { + $(pageContainer).find('.preloader').each(function () { + if ($(this).children().length === 0) { + $(this).html(app.params.materialPreloaderHtml); + } + }); + }; + + /*====================================================== + ************ Messages ************ + ======================================================*/ + var Messages = function (container, params) { + var defaults = { + autoLayout: true, + newMessagesFirst: false, + messageTemplate: + '{{#if day}}' + + '
{{day}} {{#if time}}, {{time}}{{/if}}
' + + '{{/if}}' + + '
' + + '{{#if name}}
{{name}}
{{/if}}' + + '
{{text}}{{#if date}}
{{date}}
{{/if}}
' + + '{{#if avatar}}
{{/if}}' + + '{{#if label}}
{{label}}
{{/if}}' + + '
' + }; + params = params || {}; + for (var def in defaults) { + if (typeof params[def] === 'undefined' || params[def] === null) { + params[def] = defaults[def]; + } + } + + // Instance + var m = this; + + // Params + m.params = params; + + // Container + m.container = $(container); + if (m.container.length === 0) return; + + // Autolayout + if (m.params.autoLayout) m.container.addClass('messages-auto-layout'); + + // New messages first + if (m.params.newMessagesFirst) m.container.addClass('messages-new-first'); + + // Is In Page + m.pageContainer = m.container.parents('.page').eq(0); + m.pageContent = m.pageContainer.find('.page-content'); + + // Compiled template + m.template = Template7.compile(m.params.messageTemplate); + + // Auto Layout + m.layout = function () { + if (!m.container.hasClass('messages-auto-layout')) m.container.addClass('messages-auto-layout'); + m.container.find('.message').each(function () { + var message = $(this); + if (message.find('.message-text img').length > 0) message.addClass('message-pic'); + if (message.find('.message-avatar').length > 0) message.addClass('message-with-avatar'); + }); + m.container.find('.message').each(function () { + var message = $(this); + var isSent = message.hasClass('message-sent'); + var next = message.next('.message-' + (isSent ? 'sent' : 'received')); + var prev = message.prev('.message-' + (isSent ? 'sent' : 'received')); + if (next.length === 0) { + message.addClass('message-last message-with-tail'); + } + else message.removeClass('message-last message-with-tail'); + + if (prev.length === 0) { + message.addClass('message-first'); + } + else message.removeClass('message-first'); + + if (prev.length > 0 && prev.find('.message-name').length > 0 && message.find('.message-name').length > 0) { + if (prev.find('.message-name').text() !== message.find('.message-name').text()) { + prev.addClass('message-last message-with-tail'); + message.addClass('message-first'); + } + } + }); + + }; + + // Add Message + m.appendMessage = function (props, animate) { + return m.addMessage(props, 'append', animate); + }; + m.prependMessage = function (props, animate) { + return m.addMessage(props, 'prepend', animate); + }; + m.addMessage = function (props, method, animate) { + return m.addMessages([props], method, animate); + }; + m.addMessages = function (newMessages, method, animate) { + if (typeof animate === 'undefined') { + animate = true; + } + if (typeof method === 'undefined') { + method = m.params.newMessagesFirst ? 'prepend' : 'append'; + } + var newMessagesHTML = '', i; + for (i = 0; i < newMessages.length; i++) { + var props = newMessages[i] || {}; + props.type = props.type || 'sent'; + if (!props.text) continue; + props.hasImage = props.text.indexOf('= 0; + if (animate) props.position = method === 'append' ? 'bottom' : 'top'; + + newMessagesHTML += m.template(props); + } + var heightBefore, scrollBefore; + if (method === 'prepend') { + heightBefore = m.pageContent[0].scrollHeight; + scrollBefore = m.pageContent[0].scrollTop; + } + m.container[method](newMessagesHTML); + if (m.params.autoLayout) m.layout(); + if (method === 'prepend') { + m.pageContent[0].scrollTop = scrollBefore + (m.pageContent[0].scrollHeight - heightBefore); + } + if ((method === 'append' && !m.params.newMessagesFirst) || (method === 'prepend' && m.params.newMessagesFirst)) { + m.scrollMessages(animate ? undefined : 0); + } + var messages = m.container.find('.message'); + if (newMessages.length === 1) { + return method === 'append' ? messages[messages.length - 1] : messages[0]; + } + else { + var messagesToReturn = []; + if (method === 'append') { + for (i = messages.length - newMessages.length; i < messages.length; i++) { + messagesToReturn.push(messages[i]); + } + } + else { + for (i = 0; i < newMessages.length; i++) { + messagesToReturn.push(messages[i]); + } + } + return messagesToReturn; + } + + }; + m.removeMessage = function (message) { + message = $(message); + if (message.length === 0) { + return false; + } + else { + message.remove(); + if (m.params.autoLayout) m.layout(); + return true; + } + }; + m.removeMessages = function (messages) { + m.removeMessage(messages); + }; + m.clean = function () { + m.container.html(''); + }; + + // Scroll + m.scrollMessages = function (duration, scrollTop) { + if (typeof duration === 'undefined') duration = 400; + var currentScroll = m.pageContent[0].scrollTop; + var newScroll; + if (typeof scrollTop !== 'undefined') newScroll = scrollTop; + else { + newScroll = m.params.newMessagesFirst ? 0 : m.pageContent[0].scrollHeight - m.pageContent[0].offsetHeight; + if (newScroll === currentScroll) return; + } + m.pageContent.scrollTop(newScroll, duration); + }; + + // Init Destroy + m.init = function () { + if (m.params.messages) { + m.addMessages(m.params.messages, undefined, false); + } + else { + if (m.params.autoLayout) m.layout(); + m.scrollMessages(0); + } + + }; + m.destroy = function () { + m = null; + }; + + // Init + m.init(); + + m.container[0].f7Messages = m; + return m; + }; + app.messages = function (container, params) { + return new Messages (container, params); + }; + app.initPageMessages = function (pageContainer) { + pageContainer = $(pageContainer); + var messages = pageContainer.find('.messages'); + if (messages.length === 0) return; + if (!messages.hasClass('messages-init')) { + return; + } + var m = app.messages(messages, messages.dataset()); + + // Destroy on page remove + function pageBeforeRemove() { + m.destroy(); + pageContainer.off('pageBeforeRemove', pageBeforeRemove); + } + if (pageContainer.hasClass('page')) { + pageContainer.on('pageBeforeRemove', pageBeforeRemove); + } + }; + + + /*=============================================================================== + ************ Swipeout Actions (Swipe to delete) ************ + ===============================================================================*/ + app.swipeoutOpenedEl = undefined; + app.allowSwipeout = true; + app.initSwipeout = function (swipeoutEl) { + var isTouched, isMoved, isScrolling, touchesStart = {}, touchStartTime, touchesDiff, swipeOutEl, swipeOutContent, actionsRight, actionsLeft, actionsLeftWidth, actionsRightWidth, translate, opened, openedActions, buttonsLeft, buttonsRight, direction, overswipeLeftButton, overswipeRightButton, overswipeLeft, overswipeRight, noFoldLeft, noFoldRight; + $(document).on(app.touchEvents.start, function (e) { + if (app.swipeoutOpenedEl) { + var target = $(e.target); + if (!( + app.swipeoutOpenedEl.is(target[0]) || + target.parents('.swipeout').is(app.swipeoutOpenedEl) || + target.hasClass('modal-in') || + target.hasClass('modal-overlay') || + target.hasClass('actions-modal') || + target.parents('.actions-modal.modal-in, .modal.modal-in').length > 0 + )) { + app.swipeoutClose(app.swipeoutOpenedEl); + } + } + }); + + function handleTouchStart(e) { + if (!app.allowSwipeout) return; + isMoved = false; + isTouched = true; + isScrolling = undefined; + touchesStart.x = e.type === 'touchstart' ? e.targetTouches[0].pageX : e.pageX; + touchesStart.y = e.type === 'touchstart' ? e.targetTouches[0].pageY : e.pageY; + touchStartTime = (new Date()).getTime(); + } + function handleTouchMove(e) { + if (!isTouched) return; + var pageX = e.type === 'touchmove' ? e.targetTouches[0].pageX : e.pageX; + var pageY = e.type === 'touchmove' ? e.targetTouches[0].pageY : e.pageY; + if (typeof isScrolling === 'undefined') { + isScrolling = !!(isScrolling || Math.abs(pageY - touchesStart.y) > Math.abs(pageX - touchesStart.x)); + } + if (isScrolling) { + isTouched = false; + return; + } + + if (!isMoved) { + if ($('.list-block.sortable-opened').length > 0) return; + /*jshint validthis:true */ + swipeOutEl = $(this); + swipeOutContent = swipeOutEl.find('.swipeout-content'); + actionsRight = swipeOutEl.find('.swipeout-actions-right'); + actionsLeft = swipeOutEl.find('.swipeout-actions-left'); + actionsLeftWidth = actionsRightWidth = buttonsLeft = buttonsRight = overswipeRightButton = overswipeLeftButton = null; + noFoldLeft = actionsLeft.hasClass('swipeout-actions-no-fold') || app.params.swipeoutActionsNoFold; + noFoldRight = actionsRight.hasClass('swipeout-actions-no-fold') || app.params.swipeoutActionsNoFold; + if (actionsLeft.length > 0) { + actionsLeftWidth = actionsLeft.outerWidth(); + buttonsLeft = actionsLeft.children('a'); + overswipeLeftButton = actionsLeft.find('.swipeout-overswipe'); + } + if (actionsRight.length > 0) { + actionsRightWidth = actionsRight.outerWidth(); + buttonsRight = actionsRight.children('a'); + overswipeRightButton = actionsRight.find('.swipeout-overswipe'); + } + opened = swipeOutEl.hasClass('swipeout-opened'); + if (opened) { + openedActions = swipeOutEl.find('.swipeout-actions-left.swipeout-actions-opened').length > 0 ? 'left' : 'right'; + } + swipeOutEl.removeClass('transitioning'); + if (!app.params.swipeoutNoFollow) { + swipeOutEl.find('.swipeout-actions-opened').removeClass('swipeout-actions-opened'); + swipeOutEl.removeClass('swipeout-opened'); + } + } + isMoved = true; + e.preventDefault(); + + touchesDiff = pageX - touchesStart.x; + translate = touchesDiff; + + if (opened) { + if (openedActions === 'right') translate = translate - actionsRightWidth; + else translate = translate + actionsLeftWidth; + } + + if (translate > 0 && actionsLeft.length === 0 || translate < 0 && actionsRight.length === 0) { + if (!opened) { + isTouched = isMoved = false; + swipeOutContent.transform(''); + if (buttonsRight && buttonsRight.length > 0) { + buttonsRight.transform(''); + } + if (buttonsLeft && buttonsLeft.length > 0) { + buttonsLeft.transform(''); + } + return; + } + translate = 0; + } + + if (translate < 0) direction = 'to-left'; + else if (translate > 0) direction = 'to-right'; + else { + if (direction) direction = direction; + else direction = 'to-left'; + } + + var i, buttonOffset, progress; + + e.f7PreventPanelSwipe = true; + if (app.params.swipeoutNoFollow) { + if (opened) { + if (openedActions === 'right' && touchesDiff > 0) { + app.swipeoutClose(swipeOutEl); + } + if (openedActions === 'left' && touchesDiff < 0) { + app.swipeoutClose(swipeOutEl); + } + } + else { + if (touchesDiff < 0 && actionsRight.length > 0) { + app.swipeoutOpen(swipeOutEl, 'right'); + } + if (touchesDiff > 0 && actionsLeft.length > 0) { + app.swipeoutOpen(swipeOutEl, 'left'); + } + } + isTouched = false; + isMoved = false; + return; + } + overswipeLeft = false; + overswipeRight = false; + var $button; + if (actionsRight.length > 0) { + // Show right actions + progress = translate / actionsRightWidth; + if (translate < -actionsRightWidth) { + translate = -actionsRightWidth - Math.pow(-translate - actionsRightWidth, 0.8); + if (overswipeRightButton.length > 0) { + overswipeRight = true; + } + } + for (i = 0; i < buttonsRight.length; i++) { + if (typeof buttonsRight[i]._buttonOffset === 'undefined') { + buttonsRight[i]._buttonOffset = buttonsRight[i].offsetLeft; + } + buttonOffset = buttonsRight[i]._buttonOffset; + $button = $(buttonsRight[i]); + if (overswipeRightButton.length > 0 && $button.hasClass('swipeout-overswipe')) { + $button.css({left: (overswipeRight ? -buttonOffset : 0) + 'px'}); + if (overswipeRight) { + $button.addClass('swipeout-overswipe-active'); + } + else { + $button.removeClass('swipeout-overswipe-active'); + } + } + $button.transform('translate3d(' + (translate - buttonOffset * (1 + Math.max(progress, -1))) + 'px,0,0)'); + } + } + if (actionsLeft.length > 0) { + // Show left actions + progress = translate / actionsLeftWidth; + if (translate > actionsLeftWidth) { + translate = actionsLeftWidth + Math.pow(translate - actionsLeftWidth, 0.8); + if (overswipeLeftButton.length > 0) { + overswipeLeft = true; + } + } + for (i = 0; i < buttonsLeft.length; i++) { + if (typeof buttonsLeft[i]._buttonOffset === 'undefined') { + buttonsLeft[i]._buttonOffset = actionsLeftWidth - buttonsLeft[i].offsetLeft - buttonsLeft[i].offsetWidth; + } + buttonOffset = buttonsLeft[i]._buttonOffset; + $button = $(buttonsLeft[i]); + if (overswipeLeftButton.length > 0 && $button.hasClass('swipeout-overswipe')) { + $button.css({left: (overswipeLeft ? buttonOffset : 0) + 'px'}); + if (overswipeLeft) { + $button.addClass('swipeout-overswipe-active'); + } + else { + $button.removeClass('swipeout-overswipe-active'); + } + } + if (buttonsLeft.length > 1) { + $button.css('z-index', buttonsLeft.length - i); + } + $button.transform('translate3d(' + (translate + buttonOffset * (1 - Math.min(progress, 1))) + 'px,0,0)'); + } + } + swipeOutContent.transform('translate3d(' + translate + 'px,0,0)'); + } + function handleTouchEnd(e) { + if (!isTouched || !isMoved) { + isTouched = false; + isMoved = false; + return; + } + + isTouched = false; + isMoved = false; + var timeDiff = (new Date()).getTime() - touchStartTime; + var action, actionsWidth, actions, buttons, i, noFold; + + noFold = direction === 'to-left' ? noFoldRight : noFoldLeft; + actions = direction === 'to-left' ? actionsRight : actionsLeft; + actionsWidth = direction === 'to-left' ? actionsRightWidth : actionsLeftWidth; + + if ( + timeDiff < 300 && (touchesDiff < -10 && direction === 'to-left' || touchesDiff > 10 && direction === 'to-right') || + timeDiff >= 300 && Math.abs(translate) > actionsWidth / 2 + ) { + action = 'open'; + } + else { + action = 'close'; + } + if (timeDiff < 300) { + if (Math.abs(translate) === 0) action = 'close'; + if (Math.abs(translate) === actionsWidth) action = 'open'; + } + + if (action === 'open') { + app.swipeoutOpenedEl = swipeOutEl; + swipeOutEl.trigger('open'); + swipeOutEl.addClass('swipeout-opened transitioning'); + var newTranslate = direction === 'to-left' ? -actionsWidth : actionsWidth; + swipeOutContent.transform('translate3d(' + newTranslate + 'px,0,0)'); + actions.addClass('swipeout-actions-opened'); + buttons = direction === 'to-left' ? buttonsRight : buttonsLeft; + if (buttons) { + for (i = 0; i < buttons.length; i++) { + $(buttons[i]).transform('translate3d(' + newTranslate + 'px,0,0)'); + } + } + if (overswipeRight) { + actionsRight.find('.swipeout-overswipe')[0].click(); + } + if (overswipeLeft) { + actionsLeft.find('.swipeout-overswipe')[0].click(); + } + } + else { + swipeOutEl.trigger('close'); + app.swipeoutOpenedEl = undefined; + swipeOutEl.addClass('transitioning').removeClass('swipeout-opened'); + swipeOutContent.transform(''); + actions.removeClass('swipeout-actions-opened'); + } + + var buttonOffset; + if (buttonsLeft && buttonsLeft.length > 0 && buttonsLeft !== buttons) { + for (i = 0; i < buttonsLeft.length; i++) { + buttonOffset = buttonsLeft[i]._buttonOffset; + if (typeof buttonOffset === 'undefined') { + buttonsLeft[i]._buttonOffset = actionsLeftWidth - buttonsLeft[i].offsetLeft - buttonsLeft[i].offsetWidth; + } + $(buttonsLeft[i]).transform('translate3d(' + (buttonOffset) + 'px,0,0)'); + } + } + if (buttonsRight && buttonsRight.length > 0 && buttonsRight !== buttons) { + for (i = 0; i < buttonsRight.length; i++) { + buttonOffset = buttonsRight[i]._buttonOffset; + if (typeof buttonOffset === 'undefined') { + buttonsRight[i]._buttonOffset = buttonsRight[i].offsetLeft; + } + $(buttonsRight[i]).transform('translate3d(' + (-buttonOffset) + 'px,0,0)'); + } + } + swipeOutContent.transitionEnd(function (e) { + if (opened && action === 'open' || closed && action === 'close') return; + swipeOutEl.trigger(action === 'open' ? 'opened' : 'closed'); + if (opened && action === 'close') { + if (actionsRight.length > 0) { + buttonsRight.transform(''); + } + if (actionsLeft.length > 0) { + buttonsLeft.transform(''); + } + } + }); + } + if (swipeoutEl) { + $(swipeoutEl).on(app.touchEvents.start, handleTouchStart); + $(swipeoutEl).on(app.touchEvents.move, handleTouchMove); + $(swipeoutEl).on(app.touchEvents.end, handleTouchEnd); + } + else { + $(document).on(app.touchEvents.start, '.list-block li.swipeout', handleTouchStart); + $(document).on(app.touchEvents.move, '.list-block li.swipeout', handleTouchMove); + $(document).on(app.touchEvents.end, '.list-block li.swipeout', handleTouchEnd); + } + + }; + app.swipeoutOpen = function (el, dir, callback) { + el = $(el); + if (arguments.length === 2) { + if (typeof arguments[1] === 'function') { + callback = dir; + } + } + + if (el.length === 0) return; + if (el.length > 1) el = $(el[0]); + if (!el.hasClass('swipeout') || el.hasClass('swipeout-opened')) return; + if (!dir) { + if (el.find('.swipeout-actions-right').length > 0) dir = 'right'; + else dir = 'left'; + } + var swipeOutActions = el.find('.swipeout-actions-' + dir); + if (swipeOutActions.length === 0) return; + var noFold = swipeOutActions.hasClass('swipeout-actions-no-fold') || app.params.swipeoutActionsNoFold; + el.trigger('open').addClass('swipeout-opened').removeClass('transitioning'); + swipeOutActions.addClass('swipeout-actions-opened'); + var buttons = swipeOutActions.children('a'); + var swipeOutActionsWidth = swipeOutActions.outerWidth(); + var translate = dir === 'right' ? -swipeOutActionsWidth : swipeOutActionsWidth; + var i; + if (buttons.length > 1) { + for (i = 0; i < buttons.length; i++) { + if (dir === 'right') { + $(buttons[i]).transform('translate3d(' + (- buttons[i].offsetLeft) + 'px,0,0)'); + } + else { + $(buttons[i]).css('z-index', buttons.length - i).transform('translate3d(' + (swipeOutActionsWidth - buttons[i].offsetWidth - buttons[i].offsetLeft) + 'px,0,0)'); + } + } + var clientLeft = buttons[1].clientLeft; + } + el.addClass('transitioning'); + for (i = 0; i < buttons.length; i++) { + $(buttons[i]).transform('translate3d(' + (translate) + 'px,0,0)'); + } + el.find('.swipeout-content').transform('translate3d(' + translate + 'px,0,0)').transitionEnd(function () { + el.trigger('opened'); + if (callback) callback.call(el[0]); + }); + app.swipeoutOpenedEl = el; + }; + app.swipeoutClose = function (el, callback) { + el = $(el); + if (el.length === 0) return; + if (!el.hasClass('swipeout-opened')) return; + var dir = el.find('.swipeout-actions-opened').hasClass('swipeout-actions-right') ? 'right' : 'left'; + var swipeOutActions = el.find('.swipeout-actions-opened').removeClass('swipeout-actions-opened'); + var noFold = swipeOutActions.hasClass('swipeout-actions-no-fold') || app.params.swipeoutActionsNoFold; + var buttons = swipeOutActions.children('a'); + var swipeOutActionsWidth = swipeOutActions.outerWidth(); + app.allowSwipeout = false; + el.trigger('close'); + el.removeClass('swipeout-opened').addClass('transitioning'); + + var closeTO; + function onSwipeoutClose() { + app.allowSwipeout = true; + if (el.hasClass('swipeout-opened')) return; + el.removeClass('transitioning'); + buttons.transform(''); + el.trigger('closed'); + if (callback) callback.call(el[0]); + if (closeTO) clearTimeout(closeTO); + } + el.find('.swipeout-content').transform('').transitionEnd(onSwipeoutClose); + closeTO = setTimeout(onSwipeoutClose, 500); + + for (var i = 0; i < buttons.length; i++) { + if (dir === 'right') { + $(buttons[i]).transform('translate3d(' + (-buttons[i].offsetLeft) + 'px,0,0)'); + } + else { + $(buttons[i]).transform('translate3d(' + (swipeOutActionsWidth - buttons[i].offsetWidth - buttons[i].offsetLeft) + 'px,0,0)'); + } + $(buttons[i]).css({left:0 + 'px'}).removeClass('swipeout-overswipe-active'); + } + if (app.swipeoutOpenedEl && app.swipeoutOpenedEl[0] === el[0]) app.swipeoutOpenedEl = undefined; + }; + app.swipeoutDelete = function (el, callback) { + el = $(el); + if (el.length === 0) return; + if (el.length > 1) el = $(el[0]); + app.swipeoutOpenedEl = undefined; + el.trigger('delete'); + el.css({height: el.outerHeight() + 'px'}); + var clientLeft = el[0].clientLeft; + el.css({height: 0 + 'px'}).addClass('deleting transitioning').transitionEnd(function () { + el.trigger('deleted'); + if (callback) callback.call(el[0]); + if (el.parents('.virtual-list').length > 0) { + var virtualList = el.parents('.virtual-list')[0].f7VirtualList; + var virtualIndex = el[0].f7VirtualListIndex; + if (virtualList && typeof virtualIndex !== 'undefined') virtualList.deleteItem(virtualIndex); + } + else { + el.remove(); + } + }); + var translate = '-100%'; + el.find('.swipeout-content').transform('translate3d(' + translate + ',0,0)'); + }; + + + /*=============================================================================== + ************ Sortable ************ + ===============================================================================*/ + app.sortableToggle = function (sortableContainer) { + sortableContainer = $(sortableContainer); + if (sortableContainer.length === 0) sortableContainer = $('.list-block.sortable'); + sortableContainer.toggleClass('sortable-opened'); + if (sortableContainer.hasClass('sortable-opened')) { + sortableContainer.trigger('open'); + } + else { + sortableContainer.trigger('close'); + } + return sortableContainer; + }; + app.sortableOpen = function (sortableContainer) { + sortableContainer = $(sortableContainer); + if (sortableContainer.length === 0) sortableContainer = $('.list-block.sortable'); + sortableContainer.addClass('sortable-opened'); + sortableContainer.trigger('open'); + return sortableContainer; + }; + app.sortableClose = function (sortableContainer) { + sortableContainer = $(sortableContainer); + if (sortableContainer.length === 0) sortableContainer = $('.list-block.sortable'); + sortableContainer.removeClass('sortable-opened'); + sortableContainer.trigger('close'); + return sortableContainer; + }; + app.initSortable = function () { + var isTouched, isMoved, touchStartY, touchesDiff, sortingEl, sortingElHeight, sortingItems, minTop, maxTop, insertAfter, insertBefore, sortableContainer; + + function handleTouchStart(e) { + isMoved = false; + isTouched = true; + touchStartY = e.type === 'touchstart' ? e.targetTouches[0].pageY : e.pageY; + /*jshint validthis:true */ + sortingEl = $(this).parent(); + sortingItems = sortingEl.parent().find('li'); + sortableContainer = sortingEl.parents('.sortable'); + e.preventDefault(); + app.allowPanelOpen = app.allowSwipeout = false; + } + function handleTouchMove(e) { + if (!isTouched || !sortingEl) return; + var pageX = e.type === 'touchmove' ? e.targetTouches[0].pageX : e.pageX; + var pageY = e.type === 'touchmove' ? e.targetTouches[0].pageY : e.pageY; + if (!isMoved) { + sortingEl.addClass('sorting'); + sortableContainer.addClass('sortable-sorting'); + minTop = sortingEl[0].offsetTop; + maxTop = sortingEl.parent().height() - sortingEl[0].offsetTop - sortingEl.height(); + sortingElHeight = sortingEl[0].offsetHeight; + } + isMoved = true; + + e.preventDefault(); + e.f7PreventPanelSwipe = true; + touchesDiff = pageY - touchStartY; + var translate = touchesDiff; + if (translate < -minTop) translate = -minTop; + if (translate > maxTop) translate = maxTop; + sortingEl.transform('translate3d(0,' + translate + 'px,0)'); + + insertBefore = insertAfter = undefined; + + sortingItems.each(function () { + var currentEl = $(this); + if (currentEl[0] === sortingEl[0]) return; + var currentElOffset = currentEl[0].offsetTop; + var currentElHeight = currentEl.height(); + var sortingElOffset = sortingEl[0].offsetTop + translate; + + if ((sortingElOffset >= currentElOffset - currentElHeight / 2) && sortingEl.index() < currentEl.index()) { + currentEl.transform('translate3d(0, '+(-sortingElHeight)+'px,0)'); + insertAfter = currentEl; + insertBefore = undefined; + } + else if ((sortingElOffset <= currentElOffset + currentElHeight / 2) && sortingEl.index() > currentEl.index()) { + currentEl.transform('translate3d(0, '+(sortingElHeight)+'px,0)'); + insertAfter = undefined; + if (!insertBefore) insertBefore = currentEl; + } + else { + $(this).transform('translate3d(0, 0%,0)'); + } + }); + } + function handleTouchEnd(e) { + app.allowPanelOpen = app.allowSwipeout = true; + if (!isTouched || !isMoved) { + isTouched = false; + isMoved = false; + return; + } + e.preventDefault(); + sortingItems.transform(''); + sortingEl.removeClass('sorting'); + sortableContainer.removeClass('sortable-sorting'); + var virtualList, oldIndex, newIndex; + if (insertAfter) { + sortingEl.insertAfter(insertAfter); + sortingEl.trigger('sort'); + } + if (insertBefore) { + sortingEl.insertBefore(insertBefore); + sortingEl.trigger('sort'); + } + if ((insertAfter || insertBefore) && sortableContainer.hasClass('virtual-list')) { + virtualList = sortableContainer[0].f7VirtualList; + oldIndex = sortingEl[0].f7VirtualListIndex; + newIndex = insertBefore ? insertBefore[0].f7VirtualListIndex : insertAfter[0].f7VirtualListIndex; + if (virtualList) virtualList.moveItem(oldIndex, newIndex); + } + insertAfter = insertBefore = undefined; + isTouched = false; + isMoved = false; + } + $(document).on(app.touchEvents.start, '.list-block.sortable .sortable-handler', handleTouchStart); + if (app.support.touch) { + $(document).on(app.touchEvents.move, '.list-block.sortable .sortable-handler', handleTouchMove); + $(document).on(app.touchEvents.end, '.list-block.sortable .sortable-handler', handleTouchEnd); + } + else { + $(document).on(app.touchEvents.move, handleTouchMove); + $(document).on(app.touchEvents.end, handleTouchEnd); + } + + }; + + + /*=============================================================================== + ************ Smart Select ************ + ===============================================================================*/ + app.initSmartSelects = function (pageContainer) { + pageContainer = $(pageContainer); + var selects; + if (pageContainer.is('.smart-select')) { + selects = pageContainer; + } + else { + selects = pageContainer.find('.smart-select'); + } + if (selects.length === 0) return; + + selects.each(function () { + var smartSelect = $(this); + + var $select = smartSelect.find('select'); + if ($select.length === 0) return; + + var select = $select[0]; + if (select.length === 0) return; + + var valueText = []; + for (var i = 0; i < select.length; i++) { + if (select[i].selected) valueText.push(select[i].textContent.trim()); + } + + var itemAfter = smartSelect.find('.item-after'); + if (itemAfter.length === 0) { + smartSelect.find('.item-inner').append('
' + valueText.join(', ') + '
'); + } + else { + var selectedText = itemAfter.text(); + if (itemAfter.hasClass('smart-select-value')) { + for (i = 0; i < select.length; i++) { + select[i].selected = select[i].textContent.trim() === selectedText.trim(); + } + } else { + itemAfter.text(valueText.join(', ')); + } + } + + }); + + }; + app.smartSelectAddOption = function (select, option, index) { + select = $(select); + var smartSelect = select.parents('.smart-select'); + if (typeof index === 'undefined') { + select.append(option); + } + else { + $(option).insertBefore(select.find('option').eq(index)); + } + app.initSmartSelects(smartSelect); + var selectName = smartSelect.find('select').attr('name'); + var opened = $('.page.smart-select-page[data-select-name="' + selectName + '"]').length > 0; + if (opened) { + app.smartSelectOpen(smartSelect, true); + } + }; + app.smartSelectOpen = function (smartSelect, reLayout) { + smartSelect = $(smartSelect); + if (smartSelect.length === 0) return; + + // Find related view + var view = smartSelect.parents('.' + app.params.viewClass); + if (view.length === 0) return; + view = view[0].f7View; + + // Parameters + var openIn = smartSelect.attr('data-open-in') || app.params.smartSelectOpenIn; + if (openIn === 'popup') { + if ($('.popup.smart-select-popup').length > 0) return; + } + else if (openIn === 'picker') { + if ($('.picker-modal.modal-in').length > 0 && !reLayout){ + if (smartSelect[0].f7SmartSelectPicker !== $('.picker-modal.modal-in:not(.modal-out)')[0]) app.closeModal($('.picker-modal.modal-in:not(.modal-out)')); + else return; + } + } + else { + if (!view) return; + } + + var smartSelectData = smartSelect.dataset(); + var pageTitle = smartSelectData.pageTitle || smartSelect.find('.item-title').text(); + var backText = smartSelectData.backText || app.params.smartSelectBackText; + var closeText; + if (openIn === 'picker') { + closeText = smartSelectData.pickerCloseText || smartSelectData.backText || app.params.smartSelectPickerCloseText ; + } + else { + closeText = smartSelectData.popupCloseText || smartSelectData.backText || app.params.smartSelectPopupCloseText ; + } + var backOnSelect = smartSelectData.backOnSelect !== undefined ? smartSelectData.backOnSelect : app.params.smartSelectBackOnSelect; + var formTheme = smartSelectData.formTheme || app.params.smartSelectFormTheme; + var navbarTheme = smartSelectData.navbarTheme || app.params.smartSelectNavbarTheme; + var toolbarTheme = smartSelectData.toolbarTheme || app.params.smartSelectToolbarTheme; + var virtualList = smartSelectData.virtualList; + var virtualListHeight = smartSelectData.virtualListHeight; + var material = app.params.material; + var pickerHeight = smartSelectData.pickerHeight || app.params.smartSelectPickerHeight; + + // Collect all options/values + var select = smartSelect.find('select')[0]; + var $select = $(select); + var $selectData = $select.dataset(); + if (select.disabled || smartSelect.hasClass('disabled') || $select.hasClass('disabled')) { + return; + } + var values = []; + var id = (new Date()).getTime(); + var inputType = select.multiple ? 'checkbox' : 'radio'; + var inputName = inputType + '-' + id; + var maxLength = $select.attr('maxlength'); + var selectName = select.name; + var option, optionHasMedia, optionImage, optionIcon, optionGroup, optionGroupLabel, optionPreviousGroup, optionIsLabel, previousGroup, optionColor, optionClassName, optionData; + for (var i = 0; i < select.length; i++) { + option = $(select[i]); + optionData = option.dataset(); + optionImage = optionData.optionImage || $selectData.optionImage || smartSelectData.optionImage; + optionIcon = optionData.optionIcon || $selectData.optionIcon || smartSelectData.optionIcon; + optionHasMedia = optionImage || optionIcon || inputType === 'checkbox'; + if (material) optionHasMedia = optionImage || optionIcon; + optionColor = optionData.optionColor; + optionClassName = optionData.optionClass; + if (option[0].disabled) optionClassName += ' disabled'; + optionGroup = option.parent('optgroup')[0]; + optionGroupLabel = optionGroup && optionGroup.label; + optionIsLabel = false; + if (optionGroup) { + if (optionGroup !== previousGroup) { + optionIsLabel = true; + previousGroup = optionGroup; + values.push({ + groupLabel: optionGroupLabel, + isLabel: optionIsLabel + }); + } + } + values.push({ + value: option[0].value, + text: option[0].textContent.trim(), + selected: option[0].selected, + group: optionGroup, + groupLabel: optionGroupLabel, + image: optionImage, + icon: optionIcon, + color: optionColor, + className: optionClassName, + disabled: option[0].disabled, + inputType: inputType, + id: id, + hasMedia: optionHasMedia, + checkbox: inputType === 'checkbox', + inputName: inputName, + material: app.params.material + }); + } + + + // Item template/HTML + if (!app._compiledTemplates.smartSelectItem) { + app._compiledTemplates.smartSelectItem = t7.compile(app.params.smartSelectItemTemplate || + '{{#if isLabel}}' + + '
  • {{groupLabel}}
  • ' + + '{{else}}' + + '' + + '' + + '' + + '{{/if}}' + ); + } + var smartSelectItemTemplate = app._compiledTemplates.smartSelectItem; + + var inputsHTML = ''; + if (!virtualList) { + for (var j = 0; j < values.length; j++) { + inputsHTML += smartSelectItemTemplate(values[j]); + } + } + + // Toolbar / Navbar + var toolbarHTML = '', navbarHTML; + var noNavbar = '', noToolbar = '', noTabbar = '', navbarLayout; + + if (openIn === 'picker') { + if (!app._compiledTemplates.smartSelectToolbar) { + app._compiledTemplates.smartSelectToolbar = t7.compile(app.params.smartSelectToolbarTemplate || + '
    ' + + '
    ' + + '
    ' + + '' + + '
    ' + + '
    ' + ); + } + + toolbarHTML = app._compiledTemplates.smartSelectToolbar({ + pageTitle: pageTitle, + closeText: closeText, + openIn: openIn, + toolbarTheme: toolbarTheme, + inPicker: openIn === 'picker' + }); + } + else { + // Navbar HTML + if (!app._compiledTemplates.smartSelectNavbar) { + app._compiledTemplates.smartSelectNavbar = t7.compile(app.params.smartSelectNavbarTemplate || + '' + ); + } + navbarHTML = app._compiledTemplates.smartSelectNavbar({ + pageTitle: pageTitle, + backText: backText, + closeText: closeText, + openIn: openIn, + navbarTheme: navbarTheme, + inPopup: openIn === 'popup', + inPage: openIn === 'page', + leftTemplate: openIn === 'popup' ? + (app.params.smartSelectPopupCloseTemplate || (material ? '
    ' : '')).replace(/{{closeText}}/g, closeText) : + (app.params.smartSelectBackTemplate || (material ? '
    ' : '')).replace(/{{backText}}/g, backText) + }); + // Determine navbar layout type - static/fixed/through + if (openIn === 'page') { + navbarLayout = 'static'; + if (smartSelect.parents('.navbar-through').length > 0) navbarLayout = 'through'; + if (smartSelect.parents('.navbar-fixed').length > 0) navbarLayout = 'fixed'; + noToolbar = smartSelect.parents('.page').hasClass('no-toolbar') ? 'no-toolbar' : ''; + noNavbar = smartSelect.parents('.page').hasClass('no-navbar') ? 'no-navbar' : 'navbar-' + navbarLayout; + noTabbar = smartSelect.parents('.page').hasClass('no-tabbar') ? 'no-tabbar' : ''; + } + else { + navbarLayout = 'fixed'; + } + } + + + // Page Layout + var pageName = 'smart-select-' + inputName; + + var useSearchbar = typeof smartSelect.data('searchbar') === 'undefined' ? app.params.smartSelectSearchbar : (smartSelect.data('searchbar') === 'true' ? true : false); + var searchbarPlaceholder, searchbarCancel; + + if (useSearchbar) { + searchbarPlaceholder = smartSelect.data('searchbar-placeholder') || 'Search'; + searchbarCancel = smartSelect.data('searchbar-cancel') || 'Cancel'; + } + + var searchbarHTML = '' + + '
    '; + + var pageHTML = + (openIn !== 'picker' && navbarLayout === 'through' ? navbarHTML : '') + + '
    ' + + '
    ' + + (openIn !== 'picker' && navbarLayout === 'fixed' ? navbarHTML : '') + + (useSearchbar ? searchbarHTML : '') + + '
    ' + + (openIn !== 'picker' && navbarLayout === 'static' ? navbarHTML : '') + + '
    ' + + '
      ' + + (virtualList ? '' : inputsHTML) + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    '; + + // Define popup and picker + var popup, picker; + + // Scroll SS Picker To Input + function scrollToInput() { + var pageContent = smartSelect.parents('.page-content'); + if (pageContent.length === 0) return; + var paddingTop = parseInt(pageContent.css('padding-top'), 10), + paddingBottom = parseInt(pageContent.css('padding-bottom'), 10), + pageHeight = pageContent[0].offsetHeight - paddingTop - picker.height(), + pageScrollHeight = pageContent[0].scrollHeight - paddingTop - picker.height(), + newPaddingBottom; + var inputTop = smartSelect.offset().top - paddingTop + smartSelect[0].offsetHeight; + if (inputTop > pageHeight) { + var scrollTop = pageContent.scrollTop() + inputTop - pageHeight; + if (scrollTop + pageHeight > pageScrollHeight) { + newPaddingBottom = scrollTop + pageHeight - pageScrollHeight + paddingBottom; + if (pageHeight === pageScrollHeight) { + newPaddingBottom = picker.height(); + } + pageContent.css({'padding-bottom': (newPaddingBottom) + 'px'}); + } + pageContent.scrollTop(scrollTop, 300); + } + } + // Close SS Picker on HTML Click + function closeOnHTMLClick(e) { + var close = true; + if (e.target === smartSelect[0] || $(e.target).parents(smartSelect[0]).length > 0) { + close = false; + } + if ($(e.target).parents('.picker-modal').length > 0) { + close = false; + } + if (close) { + app.closeModal('.smart-select-picker.modal-in'); + } + } + + // Check max length + function checkMaxLength(container) { + if (select.selectedOptions.length >= maxLength) { + container.find('input[type="checkbox"]').each(function () { + if (!this.checked) { + $(this).parents('li').addClass('disabled'); + } + else { + $(this).parents('li').removeClass('disabled'); + } + }); + } + else { + container.find('.disabled').removeClass('disabled'); + } + } + // Event Listeners on new page + function handleInputs(container) { + container = $(container); + if (virtualList) { + var virtualListInstance = app.virtualList(container.find('.virtual-list'), { + items: values, + template: smartSelectItemTemplate, + height: virtualListHeight || undefined, + searchByItem: function (query, index, item) { + if (item.text.toLowerCase().indexOf(query.trim().toLowerCase()) >=0 ) return true; + return false; + } + }); + container.once(openIn === 'popup' || openIn === 'picker' ? 'closed': 'pageBeforeRemove', function () { + if (virtualListInstance && virtualListInstance.destroy) virtualListInstance.destroy(); + }); + } + if (maxLength) { + checkMaxLength(container); + } + container.on('change', 'input[name="' + inputName + '"]', function () { + var input = this; + var value = input.value; + var optionText = []; + if (input.type === 'checkbox') { + var values = []; + for (var i = 0; i < select.options.length; i++) { + var option = select.options[i]; + if (option.value === value) { + option.selected = input.checked; + } + if (option.selected) { + optionText.push(option.textContent.trim()); + } + } + if (maxLength) { + checkMaxLength(container); + } + } + else { + optionText = [smartSelect.find('option[value="' + value + '"]').text()]; + select.value = value; + } + + $select.trigger('change'); + smartSelect.find('.item-after').text(optionText.join(', ')); + if (backOnSelect && inputType === 'radio') { + if (openIn === 'popup') app.closeModal(popup); + else if (openIn === 'picker') app.closeModal(picker); + else view.router.back(); + } + }); + } + function pageInit(e) { + var page = e.detail.page; + if (page.name === pageName) { + handleInputs(page.container); + } + } + if (openIn === 'popup') { + if (reLayout) { + popup = $('.popup.smart-select-popup .view'); + popup.html(pageHTML); + } + else { + popup = app.popup( + '' + ); + popup = $(popup); + } + app.initPage(popup.find('.page')); + handleInputs(popup); + } + else if (openIn === 'picker') { + if (reLayout) { + picker = $('.picker-modal.smart-select-picker .view'); + picker.html(pageHTML); + } + else { + picker = app.pickerModal( + '
    ' + + toolbarHTML + + '
    ' + + '
    ' + + pageHTML + + '
    ' + + '
    ' + + '
    ' + ); + picker = $(picker); + + // Scroll To Input + scrollToInput(); + + // Close On Click + $('html').on('click', closeOnHTMLClick); + + // On Close + picker.once('close', function () { + // Reset linked picker + smartSelect[0].f7SmartSelectPicker = undefined; + + // Detach html click + $('html').off('click', closeOnHTMLClick); + + // Restore page padding bottom + smartSelect.parents('.page-content').css({paddingBottom: ''}); + }); + + // Link Picker + smartSelect[0].f7SmartSelectPicker = picker[0]; + } + + // Init Page + app.initPage(picker.find('.page')); + + // Attach events + handleInputs(picker); + } + else { + $(document).once('pageInit', '.smart-select-page', pageInit); + view.router.load({ + content: pageHTML, + reload: reLayout ? true : undefined + }); + } + }; + + + /*=============================================================================== + ************ Virtual List ************ + ===============================================================================*/ + var VirtualList = function (listBlock, params) { + var defaults = { + cols: 1, + height: app.params.material ? 48 : 44, + cache: true, + dynamicHeightBufferSize: 1, + showFilteredItemsOnly: false + }; + params = params || {}; + for (var def in defaults) { + if (typeof params[def] === 'undefined') { + params[def] = defaults[def]; + } + } + + // Preparation + var vl = this; + vl.listBlock = $(listBlock); + vl.params = params; + vl.items = vl.params.items; + if (vl.params.showFilteredItemsOnly) { + vl.filteredItems = []; + } + if (vl.params.template) { + if (typeof vl.params.template === 'string') vl.template = t7.compile(vl.params.template); + else if (typeof vl.params.template === 'function') vl.template = vl.params.template; + } + vl.pageContent = vl.listBlock.parents('.page-content'); + + // Bad scroll + var updatableScroll; + if (typeof vl.params.updatableScroll !== 'undefined') { + updatableScroll = vl.params.updatableScroll; + } + else { + updatableScroll = true; + if (app.device.ios && app.device.osVersion.split('.')[0] < 8) { + updatableScroll = false; + } + } + + // Append