@charset "UTF-8"; /* * Copay Distribution SCSS overrides */ /* Colors */ /* Theme */ /* Slide */ /* Onboarding */ /* Main tabs */ @font-face { font-family: 'Roboto-Black'; src: url("../roboto-font/roboto-black-webfont.woff2") format("woff2"), url("roboto-black-webfont.woff") format("woff"); font-weight: normal; font-style: normal; } @font-face { font-family: 'Roboto-Black-Italic'; src: url("../roboto-font/roboto-blackitalic-webfont.woff2") format("woff2"), url("roboto-blackitalic-webfont.woff") format("woff"); font-weight: normal; font-style: normal; } @font-face { font-family: 'Roboto-Bold'; src: url("../roboto-font/roboto-bold-webfont.woff2") format("woff2"), url("roboto-bold-webfont.woff") format("woff"); font-weight: normal; font-style: normal; } @font-face { font-family: 'Roboto-Bold-Italic'; src: url("../roboto-font/roboto-bolditalic-webfont.woff2") format("woff2"), url("roboto-bolditalic-webfont.woff") format("woff"); font-weight: normal; font-style: normal; } @font-face { font-family: 'Roboto-Italic'; src: url("../roboto-font/roboto-italic-webfont.woff2") format("woff2"), url("roboto-italic-webfont.woff") format("woff"); font-weight: normal; font-style: normal; } @font-face { font-family: 'Roboto-Light'; src: url("../roboto-font/roboto-light-webfont.woff2") format("woff2"), url("roboto-light-webfont.woff") format("woff"); font-weight: normal; font-style: normal; } @font-face { font-family: 'Roboto-Light-Italic'; src: url("../roboto-font/roboto-lightitalic-webfont.woff2") format("woff2"), url("roboto-lightitalic-webfont.woff") format("woff"); font-weight: normal; font-style: normal; } @font-face { font-family: 'Roboto-Medium'; src: url("../roboto-font/roboto-medium-webfont.woff2") format("woff2"), url("roboto-medium-webfont.woff") format("woff"); font-weight: normal; font-style: normal; } @font-face { font-family: 'Roboto-Medium-Italic'; src: url("../roboto-font/roboto-mediumitalic-webfont.woff2") format("woff2"), url("roboto-mediumitalic-webfont.woff") format("woff"); font-weight: normal; font-style: normal; } @font-face { font-family: 'Roboto'; src: url("../roboto-font/roboto-regular-webfont.woff2") format("woff2"), url("roboto-regular-webfont.woff") format("woff"); font-weight: normal; font-style: normal; } @font-face { font-family: 'Roboto-Thin'; src: url("../roboto-font/roboto-thin-webfont.woff2") format("woff2"), url("roboto-thin-webfont.woff") format("woff"); font-weight: normal; font-style: normal; } @font-face { font-family: 'Roboto-Thin-Italic'; src: url("../roboto-font/roboto-thinitalic-webfont.woff2") format("woff2"), url("roboto-thinitalic-webfont.woff") format("woff"); font-weight: normal; font-style: normal; } /* * App variables */ /* Fonts */ /* Colors */ /* Theme */ /* Slide */ /* Onboarding */ /* Main tabs */ /* * Ionic variables */ /*! Ionicons, v2.0.1 Created by Ben Sperry for the Ionic Framework, http://ionicons.com/ https://twitter.com/benjsperry https://twitter.com/ionicframework MIT License: https://github.com/ionic-team/ionicons Android-style icons originally built by Google’s Material Design Icons: https://github.com/google/material-design-icons used under CC BY http://creativecommons.org/licenses/by/4.0/ Modified icons to fit ionicon’s grid from original. */ @font-face { font-family: "Ionicons"; src: url("../fonts/ionicons.eot?v=2.0.1"); src: url("../fonts/ionicons.eot?v=2.0.1#iefix") format("embedded-opentype"), url("../fonts/ionicons.ttf?v=2.0.1") format("truetype"), url("../fonts/ionicons.woff?v=2.0.1") format("woff"), url("../fonts/ionicons.woff") format("woff"), url("../fonts/ionicons.svg?v=2.0.1#Ionicons") format("svg"); font-weight: normal; font-style: normal; } .ion, .ionicons, .ion-alert:before, .ion-alert-circled:before, .ion-android-add:before, .ion-android-add-circle:before, .ion-android-alarm-clock:before, .ion-android-alert:before, .ion-android-apps:before, .ion-android-archive:before, .ion-android-arrow-back:before, .ion-android-arrow-down:before, .ion-android-arrow-dropdown:before, .ion-android-arrow-dropdown-circle:before, .ion-android-arrow-dropleft:before, .ion-android-arrow-dropleft-circle:before, .ion-android-arrow-dropright:before, .ion-android-arrow-dropright-circle:before, .ion-android-arrow-dropup:before, .ion-android-arrow-dropup-circle:before, .ion-android-arrow-forward:before, .ion-android-arrow-up:before, .ion-android-attach:before, .ion-android-bar:before, .ion-android-bicycle:before, .ion-android-boat:before, .ion-android-bookmark:before, .ion-android-bulb:before, .ion-android-bus:before, .ion-android-calendar:before, .ion-android-call:before, .ion-android-camera:before, .ion-android-cancel:before, .ion-android-car:before, .ion-android-cart:before, .ion-android-chat:before, .ion-android-checkbox:before, .ion-android-checkbox-blank:before, .ion-android-checkbox-outline:before, .ion-android-checkbox-outline-blank:before, .ion-android-checkmark-circle:before, .ion-android-clipboard:before, .ion-android-close:before, .ion-android-cloud:before, .ion-android-cloud-circle:before, .ion-android-cloud-done:before, .ion-android-cloud-outline:before, .ion-android-color-palette:before, .ion-android-compass:before, .ion-android-contact:before, .ion-android-contacts:before, .ion-android-contract:before, .ion-android-create:before, .ion-android-delete:before, .ion-android-desktop:before, .ion-android-document:before, .ion-android-done:before, .ion-android-done-all:before, .ion-android-download:before, .ion-android-drafts:before, .ion-android-exit:before, .ion-android-expand:before, .ion-android-favorite:before, .ion-android-favorite-outline:before, .ion-android-film:before, .ion-android-folder:before, .ion-android-folder-open:before, .ion-android-funnel:before, .ion-android-globe:before, .ion-android-hand:before, .ion-android-hangout:before, .ion-android-happy:before, .ion-android-home:before, .ion-android-image:before, .ion-android-laptop:before, .ion-android-list:before, .ion-android-locate:before, .ion-android-lock:before, .ion-android-mail:before, .ion-android-map:before, .ion-android-menu:before, .ion-android-microphone:before, .ion-android-microphone-off:before, .ion-android-more-horizontal:before, .ion-android-more-vertical:before, .ion-android-navigate:before, .ion-android-notifications:before, .ion-android-notifications-none:before, .ion-android-notifications-off:before, .ion-android-open:before, .ion-android-options:before, .ion-android-people:before, .ion-android-person:before, .ion-android-person-add:before, .ion-android-phone-landscape:before, .ion-android-phone-portrait:before, .ion-android-pin:before, .ion-android-plane:before, .ion-android-playstore:before, .ion-android-print:before, .ion-android-radio-button-off:before, .ion-android-radio-button-on:before, .ion-android-refresh:before, .ion-android-remove:before, .ion-android-remove-circle:before, .ion-android-restaurant:before, .ion-android-sad:before, .ion-android-search:before, .ion-android-send:before, .ion-android-settings:before, .ion-android-share:before, .ion-android-share-alt:before, .ion-android-star:before, .ion-android-star-half:before, .ion-android-star-outline:before, .ion-android-stopwatch:before, .ion-android-subway:before, .ion-android-sunny:before, .ion-android-sync:before, .ion-android-textsms:before, .ion-android-time:before, .ion-android-train:before, .ion-android-unlock:before, .ion-android-upload:before, .ion-android-volume-down:before, .ion-android-volume-mute:before, .ion-android-volume-off:before, .ion-android-volume-up:before, .ion-android-walk:before, .ion-android-warning:before, .ion-android-watch:before, .ion-android-wifi:before, .ion-aperture:before, .ion-archive:before, .ion-arrow-down-a:before, .ion-arrow-down-b:before, .ion-arrow-down-c:before, .ion-arrow-expand:before, .ion-arrow-graph-down-left:before, .ion-arrow-graph-down-right:before, .ion-arrow-graph-up-left:before, .ion-arrow-graph-up-right:before, .ion-arrow-left-a:before, .ion-arrow-left-b:before, .ion-arrow-left-c:before, .ion-arrow-move:before, .ion-arrow-resize:before, .ion-arrow-return-left:before, .ion-arrow-return-right:before, .ion-arrow-right-a:before, .ion-arrow-right-b:before, .ion-arrow-right-c:before, .ion-arrow-shrink:before, .ion-arrow-swap:before, .ion-arrow-up-a:before, .ion-arrow-up-b:before, .ion-arrow-up-c:before, .ion-asterisk:before, .ion-at:before, .ion-backspace:before, .ion-backspace-outline:before, .ion-bag:before, .ion-battery-charging:before, .ion-battery-empty:before, .ion-battery-full:before, .ion-battery-half:before, .ion-battery-low:before, .ion-beaker:before, .ion-beer:before, .ion-bluetooth:before, .ion-bonfire:before, .ion-bookmark:before, .ion-bowtie:before, .ion-briefcase:before, .ion-bug:before, .ion-calculator:before, .ion-calendar:before, .ion-camera:before, .ion-card:before, .ion-cash:before, .ion-chatbox:before, .ion-chatbox-working:before, .ion-chatboxes:before, .ion-chatbubble:before, .ion-chatbubble-working:before, .ion-chatbubbles:before, .ion-checkmark:before, .ion-checkmark-circled:before, .ion-checkmark-round:before, .ion-chevron-down:before, .ion-chevron-left:before, .ion-chevron-right:before, .ion-chevron-up:before, .ion-clipboard:before, .ion-clock:before, .ion-close:before, .ion-close-circled:before, .ion-close-round:before, .ion-closed-captioning:before, .ion-cloud:before, .ion-code:before, .ion-code-download:before, .ion-code-working:before, .ion-coffee:before, .ion-compass:before, .ion-compose:before, .ion-connection-bars:before, .ion-contrast:before, .ion-crop:before, .ion-cube:before, .ion-disc:before, .ion-document:before, .ion-document-text:before, .ion-drag:before, .ion-earth:before, .ion-easel:before, .ion-edit:before, .ion-egg:before, .ion-eject:before, .ion-email:before, .ion-email-unread:before, .ion-erlenmeyer-flask:before, .ion-erlenmeyer-flask-bubbles:before, .ion-eye:before, .ion-eye-disabled:before, .ion-female:before, .ion-filing:before, .ion-film-marker:before, .ion-fireball:before, .ion-flag:before, .ion-flame:before, .ion-flash:before, .ion-flash-off:before, .ion-folder:before, .ion-fork:before, .ion-fork-repo:before, .ion-forward:before, .ion-funnel:before, .ion-gear-a:before, .ion-gear-b:before, .ion-grid:before, .ion-hammer:before, .ion-happy:before, .ion-happy-outline:before, .ion-headphone:before, .ion-heart:before, .ion-heart-broken:before, .ion-help:before, .ion-help-buoy:before, .ion-help-circled:before, .ion-home:before, .ion-icecream:before, .ion-image:before, .ion-images:before, .ion-information:before, .ion-information-circled:before, .ion-ionic:before, .ion-ios-alarm:before, .ion-ios-alarm-outline:before, .ion-ios-albums:before, .ion-ios-albums-outline:before, .ion-ios-americanfootball:before, .ion-ios-americanfootball-outline:before, .ion-ios-analytics:before, .ion-ios-analytics-outline:before, .ion-ios-arrow-back:before, .ion-ios-arrow-down:before, .icon.bp-arrow-down:before, .ion-ios-arrow-forward:before, .ion-ios-arrow-left:before, .ion-ios-arrow-right:before, .icon.bp-arrow-right:before, .ion-ios-arrow-thin-down:before, .ion-ios-arrow-thin-left:before, .ion-ios-arrow-thin-right:before, .ion-ios-arrow-thin-up:before, .ion-ios-arrow-up:before, .icon.bp-arrow-up:before, .ion-ios-at:before, .ion-ios-at-outline:before, .ion-ios-barcode:before, .ion-ios-barcode-outline:before, .ion-ios-baseball:before, .ion-ios-baseball-outline:before, .ion-ios-basketball:before, .ion-ios-basketball-outline:before, .ion-ios-bell:before, .ion-ios-bell-outline:before, .ion-ios-body:before, .ion-ios-body-outline:before, .ion-ios-bolt:before, .ion-ios-bolt-outline:before, .ion-ios-book:before, .ion-ios-book-outline:before, .ion-ios-bookmarks:before, .ion-ios-bookmarks-outline:before, .ion-ios-box:before, .ion-ios-box-outline:before, .ion-ios-briefcase:before, .ion-ios-briefcase-outline:before, .ion-ios-browsers:before, .ion-ios-browsers-outline:before, .ion-ios-calculator:before, .ion-ios-calculator-outline:before, .ion-ios-calendar:before, .ion-ios-calendar-outline:before, .ion-ios-camera:before, .ion-ios-camera-outline:before, .ion-ios-cart:before, .ion-ios-cart-outline:before, .ion-ios-chatboxes:before, .ion-ios-chatboxes-outline:before, .ion-ios-chatbubble:before, .ion-ios-chatbubble-outline:before, .ion-ios-checkmark:before, .ion-ios-checkmark-empty:before, .ion-ios-checkmark-outline:before, .ion-ios-circle-filled:before, .ion-ios-circle-outline:before, .ion-ios-clock:before, .ion-ios-clock-outline:before, .ion-ios-close:before, .ion-ios-close-empty:before, .ion-ios-close-outline:before, .ion-ios-cloud:before, .ion-ios-cloud-download:before, .ion-ios-cloud-download-outline:before, .ion-ios-cloud-outline:before, .ion-ios-cloud-upload:before, .ion-ios-cloud-upload-outline:before, .ion-ios-cloudy:before, .ion-ios-cloudy-night:before, .ion-ios-cloudy-night-outline:before, .ion-ios-cloudy-outline:before, .ion-ios-cog:before, .ion-ios-cog-outline:before, .ion-ios-color-filter:before, .ion-ios-color-filter-outline:before, .ion-ios-color-wand:before, .ion-ios-color-wand-outline:before, .ion-ios-compose:before, .ion-ios-compose-outline:before, .ion-ios-contact:before, .ion-ios-contact-outline:before, .ion-ios-copy:before, .ion-ios-copy-outline:before, .ion-ios-crop:before, .ion-ios-crop-strong:before, .ion-ios-download:before, .ion-ios-download-outline:before, .ion-ios-drag:before, .ion-ios-email:before, .ion-ios-email-outline:before, .ion-ios-eye:before, .ion-ios-eye-outline:before, .ion-ios-fastforward:before, .ion-ios-fastforward-outline:before, .ion-ios-filing:before, .ion-ios-filing-outline:before, .ion-ios-film:before, .ion-ios-film-outline:before, .ion-ios-flag:before, .ion-ios-flag-outline:before, .ion-ios-flame:before, .ion-ios-flame-outline:before, .ion-ios-flask:before, .ion-ios-flask-outline:before, .ion-ios-flower:before, .ion-ios-flower-outline:before, .ion-ios-folder:before, .ion-ios-folder-outline:before, .ion-ios-football:before, .ion-ios-football-outline:before, .ion-ios-game-controller-a:before, .ion-ios-game-controller-a-outline:before, .ion-ios-game-controller-b:before, .ion-ios-game-controller-b-outline:before, .ion-ios-gear:before, .ion-ios-gear-outline:before, .ion-ios-glasses:before, .ion-ios-glasses-outline:before, .ion-ios-grid-view:before, .ion-ios-grid-view-outline:before, .ion-ios-heart:before, .ion-ios-heart-outline:before, .ion-ios-help:before, .ion-ios-help-empty:before, .ion-ios-help-outline:before, .ion-ios-home:before, .ion-ios-home-outline:before, .ion-ios-infinite:before, .ion-ios-infinite-outline:before, .ion-ios-information:before, .ion-ios-information-empty:before, .ion-ios-information-outline:before, .ion-ios-ionic-outline:before, .ion-ios-keypad:before, .ion-ios-keypad-outline:before, .ion-ios-lightbulb:before, .ion-ios-lightbulb-outline:before, .ion-ios-list:before, .ion-ios-list-outline:before, .ion-ios-location:before, .ion-ios-location-outline:before, .ion-ios-locked:before, .ion-ios-locked-outline:before, .ion-ios-loop:before, .ion-ios-loop-strong:before, .ion-ios-medical:before, .ion-ios-medical-outline:before, .ion-ios-medkit:before, .ion-ios-medkit-outline:before, .ion-ios-mic:before, .ion-ios-mic-off:before, .ion-ios-mic-outline:before, .ion-ios-minus:before, .ion-ios-minus-empty:before, .ion-ios-minus-outline:before, .ion-ios-monitor:before, .ion-ios-monitor-outline:before, .ion-ios-moon:before, .ion-ios-moon-outline:before, .ion-ios-more:before, .ion-ios-more-outline:before, .ion-ios-musical-note:before, .ion-ios-musical-notes:before, .ion-ios-navigate:before, .ion-ios-navigate-outline:before, .ion-ios-nutrition:before, .ion-ios-nutrition-outline:before, .ion-ios-paper:before, .ion-ios-paper-outline:before, .ion-ios-paperplane:before, .ion-ios-paperplane-outline:before, .ion-ios-partlysunny:before, .ion-ios-partlysunny-outline:before, .ion-ios-pause:before, .ion-ios-pause-outline:before, .ion-ios-paw:before, .ion-ios-paw-outline:before, .ion-ios-people:before, .ion-ios-people-outline:before, .ion-ios-person:before, .ion-ios-person-outline:before, .ion-ios-personadd:before, .ion-ios-personadd-outline:before, .ion-ios-photos:before, .ion-ios-photos-outline:before, .ion-ios-pie:before, .ion-ios-pie-outline:before, .ion-ios-pint:before, .ion-ios-pint-outline:before, .ion-ios-play:before, .ion-ios-play-outline:before, .ion-ios-plus:before, .ion-ios-plus-empty:before, .ion-ios-plus-outline:before, .ion-ios-pricetag:before, .ion-ios-pricetag-outline:before, .ion-ios-pricetags:before, .ion-ios-pricetags-outline:before, .ion-ios-printer:before, .ion-ios-printer-outline:before, .ion-ios-pulse:before, .ion-ios-pulse-strong:before, .ion-ios-rainy:before, .ion-ios-rainy-outline:before, .ion-ios-recording:before, .ion-ios-recording-outline:before, .ion-ios-redo:before, .ion-ios-redo-outline:before, .ion-ios-refresh:before, .ion-ios-refresh-empty:before, .ion-ios-refresh-outline:before, .ion-ios-reload:before, .ion-ios-reverse-camera:before, .ion-ios-reverse-camera-outline:before, .ion-ios-rewind:before, .ion-ios-rewind-outline:before, .ion-ios-rose:before, .ion-ios-rose-outline:before, .ion-ios-search:before, .ion-ios-search-strong:before, .ion-ios-settings:before, .ion-ios-settings-strong:before, .ion-ios-shuffle:before, .ion-ios-shuffle-strong:before, .ion-ios-skipbackward:before, .ion-ios-skipbackward-outline:before, .ion-ios-skipforward:before, .ion-ios-skipforward-outline:before, .ion-ios-snowy:before, .ion-ios-speedometer:before, .ion-ios-speedometer-outline:before, .ion-ios-star:before, .ion-ios-star-half:before, .ion-ios-star-outline:before, .ion-ios-stopwatch:before, .ion-ios-stopwatch-outline:before, .ion-ios-sunny:before, .ion-ios-sunny-outline:before, .ion-ios-telephone:before, .ion-ios-telephone-outline:before, .ion-ios-tennisball:before, .ion-ios-tennisball-outline:before, .ion-ios-thunderstorm:before, .ion-ios-thunderstorm-outline:before, .ion-ios-time:before, .ion-ios-time-outline:before, .ion-ios-timer:before, .ion-ios-timer-outline:before, .ion-ios-toggle:before, .ion-ios-toggle-outline:before, .ion-ios-trash:before, .ion-ios-trash-outline:before, .ion-ios-undo:before, .ion-ios-undo-outline:before, .ion-ios-unlocked:before, .ion-ios-unlocked-outline:before, .ion-ios-upload:before, .ion-ios-upload-outline:before, .ion-ios-videocam:before, .ion-ios-videocam-outline:before, .ion-ios-volume-high:before, .ion-ios-volume-low:before, .ion-ios-wineglass:before, .ion-ios-wineglass-outline:before, .ion-ios-world:before, .ion-ios-world-outline:before, .ion-ipad:before, .ion-iphone:before, .ion-ipod:before, .ion-jet:before, .ion-key:before, .ion-knife:before, .ion-laptop:before, .ion-leaf:before, .ion-levels:before, .ion-lightbulb:before, .ion-link:before, .ion-load-a:before, .ion-load-b:before, .ion-load-c:before, .ion-load-d:before, .ion-location:before, .ion-lock-combination:before, .ion-locked:before, .ion-log-in:before, .ion-log-out:before, .ion-loop:before, .ion-magnet:before, .ion-male:before, .ion-man:before, .ion-map:before, .ion-medkit:before, .ion-merge:before, .ion-mic-a:before, .ion-mic-b:before, .ion-mic-c:before, .ion-minus:before, .ion-minus-circled:before, .ion-minus-round:before, .ion-model-s:before, .ion-monitor:before, .ion-more:before, .ion-mouse:before, .ion-music-note:before, .ion-navicon:before, .ion-navicon-round:before, .ion-navigate:before, .ion-network:before, .ion-no-smoking:before, .ion-nuclear:before, .ion-outlet:before, .ion-paintbrush:before, .ion-paintbucket:before, .ion-paper-airplane:before, .ion-paperclip:before, .ion-pause:before, .ion-person:before, .ion-person-add:before, .ion-person-stalker:before, .ion-pie-graph:before, .ion-pin:before, .ion-pinpoint:before, .ion-pizza:before, .ion-plane:before, .ion-planet:before, .ion-play:before, .ion-playstation:before, .ion-plus:before, .ion-plus-circled:before, .ion-plus-round:before, .ion-podium:before, .ion-pound:before, .ion-power:before, .ion-pricetag:before, .ion-pricetags:before, .ion-printer:before, .ion-pull-request:before, .ion-qr-scanner:before, .ion-quote:before, .ion-radio-waves:before, .ion-record:before, .ion-refresh:before, .ion-reply:before, .ion-reply-all:before, .ion-ribbon-a:before, .ion-ribbon-b:before, .ion-sad:before, .ion-sad-outline:before, .ion-scissors:before, .ion-search:before, .ion-settings:before, .ion-share:before, .ion-shuffle:before, .ion-skip-backward:before, .ion-skip-forward:before, .ion-social-android:before, .ion-social-android-outline:before, .ion-social-angular:before, .ion-social-angular-outline:before, .ion-social-apple:before, .ion-social-apple-outline:before, .ion-social-bitcoin:before, .ion-social-bitcoin-outline:before, .ion-social-buffer:before, .ion-social-buffer-outline:before, .ion-social-chrome:before, .ion-social-chrome-outline:before, .ion-social-codepen:before, .ion-social-codepen-outline:before, .ion-social-css3:before, .ion-social-css3-outline:before, .ion-social-designernews:before, .ion-social-designernews-outline:before, .ion-social-dribbble:before, .ion-social-dribbble-outline:before, .ion-social-dropbox:before, .ion-social-dropbox-outline:before, .ion-social-euro:before, .ion-social-euro-outline:before, .ion-social-facebook:before, .ion-social-facebook-outline:before, .ion-social-foursquare:before, .ion-social-foursquare-outline:before, .ion-social-freebsd-devil:before, .ion-social-github:before, .ion-social-github-outline:before, .ion-social-google:before, .ion-social-google-outline:before, .ion-social-googleplus:before, .ion-social-googleplus-outline:before, .ion-social-hackernews:before, .ion-social-hackernews-outline:before, .ion-social-html5:before, .ion-social-html5-outline:before, .ion-social-instagram:before, .ion-social-instagram-outline:before, .ion-social-javascript:before, .ion-social-javascript-outline:before, .ion-social-linkedin:before, .ion-social-linkedin-outline:before, .ion-social-markdown:before, .ion-social-nodejs:before, .ion-social-octocat:before, .ion-social-pinterest:before, .ion-social-pinterest-outline:before, .ion-social-python:before, .ion-social-reddit:before, .ion-social-reddit-outline:before, .ion-social-rss:before, .ion-social-rss-outline:before, .ion-social-sass:before, .ion-social-skype:before, .ion-social-skype-outline:before, .ion-social-snapchat:before, .ion-social-snapchat-outline:before, .ion-social-tumblr:before, .ion-social-tumblr-outline:before, .ion-social-tux:before, .ion-social-twitch:before, .ion-social-twitch-outline:before, .ion-social-twitter:before, .ion-social-twitter-outline:before, .ion-social-usd:before, .ion-social-usd-outline:before, .ion-social-vimeo:before, .ion-social-vimeo-outline:before, .ion-social-whatsapp:before, .ion-social-whatsapp-outline:before, .ion-social-windows:before, .ion-social-windows-outline:before, .ion-social-wordpress:before, .ion-social-wordpress-outline:before, .ion-social-yahoo:before, .ion-social-yahoo-outline:before, .ion-social-yen:before, .ion-social-yen-outline:before, .ion-social-youtube:before, .ion-social-youtube-outline:before, .ion-soup-can:before, .ion-soup-can-outline:before, .ion-speakerphone:before, .ion-speedometer:before, .ion-spoon:before, .ion-star:before, .ion-stats-bars:before, .ion-steam:before, .ion-stop:before, .ion-thermometer:before, .ion-thumbsdown:before, .ion-thumbsup:before, .ion-toggle:before, .ion-toggle-filled:before, .ion-transgender:before, .ion-trash-a:before, .ion-trash-b:before, .ion-trophy:before, .ion-tshirt:before, .ion-tshirt-outline:before, .ion-umbrella:before, .ion-university:before, .ion-unlocked:before, .ion-upload:before, .ion-usb:before, .ion-videocamera:before, .ion-volume-high:before, .ion-volume-low:before, .ion-volume-medium:before, .ion-volume-mute:before, .ion-wand:before, .ion-waterdrop:before, .ion-wifi:before, .ion-wineglass:before, .ion-woman:before, .ion-wrench:before, .ion-xbox:before { display: inline-block; font-family: "Ionicons"; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; text-rendering: auto; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .ion-alert:before { content: ""; } .ion-alert-circled:before { content: ""; } .ion-android-add:before { content: ""; } .ion-android-add-circle:before { content: ""; } .ion-android-alarm-clock:before { content: ""; } .ion-android-alert:before { content: ""; } .ion-android-apps:before { content: ""; } .ion-android-archive:before { content: ""; } .ion-android-arrow-back:before { content: ""; } .ion-android-arrow-down:before { content: ""; } .ion-android-arrow-dropdown:before { content: ""; } .ion-android-arrow-dropdown-circle:before { content: ""; } .ion-android-arrow-dropleft:before { content: ""; } .ion-android-arrow-dropleft-circle:before { content: ""; } .ion-android-arrow-dropright:before { content: ""; } .ion-android-arrow-dropright-circle:before { content: ""; } .ion-android-arrow-dropup:before { content: ""; } .ion-android-arrow-dropup-circle:before { content: ""; } .ion-android-arrow-forward:before { content: ""; } .ion-android-arrow-up:before { content: ""; } .ion-android-attach:before { content: ""; } .ion-android-bar:before { content: ""; } .ion-android-bicycle:before { content: ""; } .ion-android-boat:before { content: ""; } .ion-android-bookmark:before { content: ""; } .ion-android-bulb:before { content: ""; } .ion-android-bus:before { content: ""; } .ion-android-calendar:before { content: ""; } .ion-android-call:before { content: ""; } .ion-android-camera:before { content: ""; } .ion-android-cancel:before { content: ""; } .ion-android-car:before { content: ""; } .ion-android-cart:before { content: ""; } .ion-android-chat:before { content: ""; } .ion-android-checkbox:before { content: ""; } .ion-android-checkbox-blank:before { content: ""; } .ion-android-checkbox-outline:before { content: ""; } .ion-android-checkbox-outline-blank:before { content: ""; } .ion-android-checkmark-circle:before { content: ""; } .ion-android-clipboard:before { content: ""; } .ion-android-close:before { content: ""; } .ion-android-cloud:before { content: ""; } .ion-android-cloud-circle:before { content: ""; } .ion-android-cloud-done:before { content: ""; } .ion-android-cloud-outline:before { content: ""; } .ion-android-color-palette:before { content: ""; } .ion-android-compass:before { content: ""; } .ion-android-contact:before { content: ""; } .ion-android-contacts:before { content: ""; } .ion-android-contract:before { content: ""; } .ion-android-create:before { content: ""; } .ion-android-delete:before { content: ""; } .ion-android-desktop:before { content: ""; } .ion-android-document:before { content: ""; } .ion-android-done:before { content: ""; } .ion-android-done-all:before { content: ""; } .ion-android-download:before { content: ""; } .ion-android-drafts:before { content: ""; } .ion-android-exit:before { content: ""; } .ion-android-expand:before { content: ""; } .ion-android-favorite:before { content: ""; } .ion-android-favorite-outline:before { content: ""; } .ion-android-film:before { content: ""; } .ion-android-folder:before { content: ""; } .ion-android-folder-open:before { content: ""; } .ion-android-funnel:before { content: ""; } .ion-android-globe:before { content: ""; } .ion-android-hand:before { content: ""; } .ion-android-hangout:before { content: ""; } .ion-android-happy:before { content: ""; } .ion-android-home:before { content: ""; } .ion-android-image:before { content: ""; } .ion-android-laptop:before { content: ""; } .ion-android-list:before { content: ""; } .ion-android-locate:before { content: ""; } .ion-android-lock:before { content: ""; } .ion-android-mail:before { content: ""; } .ion-android-map:before { content: ""; } .ion-android-menu:before { content: ""; } .ion-android-microphone:before { content: ""; } .ion-android-microphone-off:before { content: ""; } .ion-android-more-horizontal:before { content: ""; } .ion-android-more-vertical:before { content: ""; } .ion-android-navigate:before { content: ""; } .ion-android-notifications:before { content: ""; } .ion-android-notifications-none:before { content: ""; } .ion-android-notifications-off:before { content: ""; } .ion-android-open:before { content: ""; } .ion-android-options:before { content: ""; } .ion-android-people:before { content: ""; } .ion-android-person:before { content: ""; } .ion-android-person-add:before { content: ""; } .ion-android-phone-landscape:before { content: ""; } .ion-android-phone-portrait:before { content: ""; } .ion-android-pin:before { content: ""; } .ion-android-plane:before { content: ""; } .ion-android-playstore:before { content: ""; } .ion-android-print:before { content: ""; } .ion-android-radio-button-off:before { content: ""; } .ion-android-radio-button-on:before { content: ""; } .ion-android-refresh:before { content: ""; } .ion-android-remove:before { content: ""; } .ion-android-remove-circle:before { content: ""; } .ion-android-restaurant:before { content: ""; } .ion-android-sad:before { content: ""; } .ion-android-search:before { content: ""; } .ion-android-send:before { content: ""; } .ion-android-settings:before { content: ""; } .ion-android-share:before { content: ""; } .ion-android-share-alt:before { content: ""; } .ion-android-star:before { content: ""; } .ion-android-star-half:before { content: ""; } .ion-android-star-outline:before { content: ""; } .ion-android-stopwatch:before { content: ""; } .ion-android-subway:before { content: ""; } .ion-android-sunny:before { content: ""; } .ion-android-sync:before { content: ""; } .ion-android-textsms:before { content: ""; } .ion-android-time:before { content: ""; } .ion-android-train:before { content: ""; } .ion-android-unlock:before { content: ""; } .ion-android-upload:before { content: ""; } .ion-android-volume-down:before { content: ""; } .ion-android-volume-mute:before { content: ""; } .ion-android-volume-off:before { content: ""; } .ion-android-volume-up:before { content: ""; } .ion-android-walk:before { content: ""; } .ion-android-warning:before { content: ""; } .ion-android-watch:before { content: ""; } .ion-android-wifi:before { content: ""; } .ion-aperture:before { content: ""; } .ion-archive:before { content: ""; } .ion-arrow-down-a:before { content: ""; } .ion-arrow-down-b:before { content: ""; } .ion-arrow-down-c:before { content: ""; } .ion-arrow-expand:before { content: ""; } .ion-arrow-graph-down-left:before { content: ""; } .ion-arrow-graph-down-right:before { content: ""; } .ion-arrow-graph-up-left:before { content: ""; } .ion-arrow-graph-up-right:before { content: ""; } .ion-arrow-left-a:before { content: ""; } .ion-arrow-left-b:before { content: ""; } .ion-arrow-left-c:before { content: ""; } .ion-arrow-move:before { content: ""; } .ion-arrow-resize:before { content: ""; } .ion-arrow-return-left:before { content: ""; } .ion-arrow-return-right:before { content: ""; } .ion-arrow-right-a:before { content: ""; } .ion-arrow-right-b:before { content: ""; } .ion-arrow-right-c:before { content: ""; } .ion-arrow-shrink:before { content: ""; } .ion-arrow-swap:before { content: ""; } .ion-arrow-up-a:before { content: ""; } .ion-arrow-up-b:before { content: ""; } .ion-arrow-up-c:before { content: ""; } .ion-asterisk:before { content: ""; } .ion-at:before { content: ""; } .ion-backspace:before { content: ""; } .ion-backspace-outline:before { content: ""; } .ion-bag:before { content: ""; } .ion-battery-charging:before { content: ""; } .ion-battery-empty:before { content: ""; } .ion-battery-full:before { content: ""; } .ion-battery-half:before { content: ""; } .ion-battery-low:before { content: ""; } .ion-beaker:before { content: ""; } .ion-beer:before { content: ""; } .ion-bluetooth:before { content: ""; } .ion-bonfire:before { content: ""; } .ion-bookmark:before { content: ""; } .ion-bowtie:before { content: ""; } .ion-briefcase:before { content: ""; } .ion-bug:before { content: ""; } .ion-calculator:before { content: ""; } .ion-calendar:before { content: ""; } .ion-camera:before { content: ""; } .ion-card:before { content: ""; } .ion-cash:before { content: ""; } .ion-chatbox:before { content: ""; } .ion-chatbox-working:before { content: ""; } .ion-chatboxes:before { content: ""; } .ion-chatbubble:before { content: ""; } .ion-chatbubble-working:before { content: ""; } .ion-chatbubbles:before { content: ""; } .ion-checkmark:before { content: ""; } .ion-checkmark-circled:before { content: ""; } .ion-checkmark-round:before { content: ""; } .ion-chevron-down:before { content: ""; } .ion-chevron-left:before { content: ""; } .ion-chevron-right:before { content: ""; } .ion-chevron-up:before { content: ""; } .ion-clipboard:before { content: ""; } .ion-clock:before { content: ""; } .ion-close:before { content: ""; } .ion-close-circled:before { content: ""; } .ion-close-round:before { content: ""; } .ion-closed-captioning:before { content: ""; } .ion-cloud:before { content: ""; } .ion-code:before { content: ""; } .ion-code-download:before { content: ""; } .ion-code-working:before { content: ""; } .ion-coffee:before { content: ""; } .ion-compass:before { content: ""; } .ion-compose:before { content: ""; } .ion-connection-bars:before { content: ""; } .ion-contrast:before { content: ""; } .ion-crop:before { content: ""; } .ion-cube:before { content: ""; } .ion-disc:before { content: ""; } .ion-document:before { content: ""; } .ion-document-text:before { content: ""; } .ion-drag:before { content: ""; } .ion-earth:before { content: ""; } .ion-easel:before { content: ""; } .ion-edit:before { content: ""; } .ion-egg:before { content: ""; } .ion-eject:before { content: ""; } .ion-email:before { content: ""; } .ion-email-unread:before { content: ""; } .ion-erlenmeyer-flask:before { content: ""; } .ion-erlenmeyer-flask-bubbles:before { content: ""; } .ion-eye:before { content: ""; } .ion-eye-disabled:before { content: ""; } .ion-female:before { content: ""; } .ion-filing:before { content: ""; } .ion-film-marker:before { content: ""; } .ion-fireball:before { content: ""; } .ion-flag:before { content: ""; } .ion-flame:before { content: ""; } .ion-flash:before { content: ""; } .ion-flash-off:before { content: ""; } .ion-folder:before { content: ""; } .ion-fork:before { content: ""; } .ion-fork-repo:before { content: ""; } .ion-forward:before { content: ""; } .ion-funnel:before { content: ""; } .ion-gear-a:before { content: ""; } .ion-gear-b:before { content: ""; } .ion-grid:before { content: ""; } .ion-hammer:before { content: ""; } .ion-happy:before { content: ""; } .ion-happy-outline:before { content: ""; } .ion-headphone:before { content: ""; } .ion-heart:before { content: ""; } .ion-heart-broken:before { content: ""; } .ion-help:before { content: ""; } .ion-help-buoy:before { content: ""; } .ion-help-circled:before { content: ""; } .ion-home:before { content: ""; } .ion-icecream:before { content: ""; } .ion-image:before { content: ""; } .ion-images:before { content: ""; } .ion-information:before { content: ""; } .ion-information-circled:before { content: ""; } .ion-ionic:before { content: ""; } .ion-ios-alarm:before { content: ""; } .ion-ios-alarm-outline:before { content: ""; } .ion-ios-albums:before { content: ""; } .ion-ios-albums-outline:before { content: ""; } .ion-ios-americanfootball:before { content: ""; } .ion-ios-americanfootball-outline:before { content: ""; } .ion-ios-analytics:before { content: ""; } .ion-ios-analytics-outline:before { content: ""; } .ion-ios-arrow-back:before { content: ""; } .ion-ios-arrow-down:before, .icon.bp-arrow-down:before { content: ""; } .ion-ios-arrow-forward:before { content: ""; } .ion-ios-arrow-left:before { content: ""; } .ion-ios-arrow-right:before, .icon.bp-arrow-right:before { content: ""; } .ion-ios-arrow-thin-down:before { content: ""; } .ion-ios-arrow-thin-left:before { content: ""; } .ion-ios-arrow-thin-right:before { content: ""; } .ion-ios-arrow-thin-up:before { content: ""; } .ion-ios-arrow-up:before, .icon.bp-arrow-up:before { content: ""; } .ion-ios-at:before { content: ""; } .ion-ios-at-outline:before { content: ""; } .ion-ios-barcode:before { content: ""; } .ion-ios-barcode-outline:before { content: ""; } .ion-ios-baseball:before { content: ""; } .ion-ios-baseball-outline:before { content: ""; } .ion-ios-basketball:before { content: ""; } .ion-ios-basketball-outline:before { content: ""; } .ion-ios-bell:before { content: ""; } .ion-ios-bell-outline:before { content: ""; } .ion-ios-body:before { content: ""; } .ion-ios-body-outline:before { content: ""; } .ion-ios-bolt:before { content: ""; } .ion-ios-bolt-outline:before { content: ""; } .ion-ios-book:before { content: ""; } .ion-ios-book-outline:before { content: ""; } .ion-ios-bookmarks:before { content: ""; } .ion-ios-bookmarks-outline:before { content: ""; } .ion-ios-box:before { content: ""; } .ion-ios-box-outline:before { content: ""; } .ion-ios-briefcase:before { content: ""; } .ion-ios-briefcase-outline:before { content: ""; } .ion-ios-browsers:before { content: ""; } .ion-ios-browsers-outline:before { content: ""; } .ion-ios-calculator:before { content: ""; } .ion-ios-calculator-outline:before { content: ""; } .ion-ios-calendar:before { content: ""; } .ion-ios-calendar-outline:before { content: ""; } .ion-ios-camera:before { content: ""; } .ion-ios-camera-outline:before { content: ""; } .ion-ios-cart:before { content: ""; } .ion-ios-cart-outline:before { content: ""; } .ion-ios-chatboxes:before { content: ""; } .ion-ios-chatboxes-outline:before { content: ""; } .ion-ios-chatbubble:before { content: ""; } .ion-ios-chatbubble-outline:before { content: ""; } .ion-ios-checkmark:before { content: ""; } .ion-ios-checkmark-empty:before { content: ""; } .ion-ios-checkmark-outline:before { content: ""; } .ion-ios-circle-filled:before { content: ""; } .ion-ios-circle-outline:before { content: ""; } .ion-ios-clock:before { content: ""; } .ion-ios-clock-outline:before { content: ""; } .ion-ios-close:before { content: ""; } .ion-ios-close-empty:before { content: ""; } .ion-ios-close-outline:before { content: ""; } .ion-ios-cloud:before { content: ""; } .ion-ios-cloud-download:before { content: ""; } .ion-ios-cloud-download-outline:before { content: ""; } .ion-ios-cloud-outline:before { content: ""; } .ion-ios-cloud-upload:before { content: ""; } .ion-ios-cloud-upload-outline:before { content: ""; } .ion-ios-cloudy:before { content: ""; } .ion-ios-cloudy-night:before { content: ""; } .ion-ios-cloudy-night-outline:before { content: ""; } .ion-ios-cloudy-outline:before { content: ""; } .ion-ios-cog:before { content: ""; } .ion-ios-cog-outline:before { content: ""; } .ion-ios-color-filter:before { content: ""; } .ion-ios-color-filter-outline:before { content: ""; } .ion-ios-color-wand:before { content: ""; } .ion-ios-color-wand-outline:before { content: ""; } .ion-ios-compose:before { content: ""; } .ion-ios-compose-outline:before { content: ""; } .ion-ios-contact:before { content: ""; } .ion-ios-contact-outline:before { content: ""; } .ion-ios-copy:before { content: ""; } .ion-ios-copy-outline:before { content: ""; } .ion-ios-crop:before { content: ""; } .ion-ios-crop-strong:before { content: ""; } .ion-ios-download:before { content: ""; } .ion-ios-download-outline:before { content: ""; } .ion-ios-drag:before { content: ""; } .ion-ios-email:before { content: ""; } .ion-ios-email-outline:before { content: ""; } .ion-ios-eye:before { content: ""; } .ion-ios-eye-outline:before { content: ""; } .ion-ios-fastforward:before { content: ""; } .ion-ios-fastforward-outline:before { content: ""; } .ion-ios-filing:before { content: ""; } .ion-ios-filing-outline:before { content: ""; } .ion-ios-film:before { content: ""; } .ion-ios-film-outline:before { content: ""; } .ion-ios-flag:before { content: ""; } .ion-ios-flag-outline:before { content: ""; } .ion-ios-flame:before { content: ""; } .ion-ios-flame-outline:before { content: ""; } .ion-ios-flask:before { content: ""; } .ion-ios-flask-outline:before { content: ""; } .ion-ios-flower:before { content: ""; } .ion-ios-flower-outline:before { content: ""; } .ion-ios-folder:before { content: ""; } .ion-ios-folder-outline:before { content: ""; } .ion-ios-football:before { content: ""; } .ion-ios-football-outline:before { content: ""; } .ion-ios-game-controller-a:before { content: ""; } .ion-ios-game-controller-a-outline:before { content: ""; } .ion-ios-game-controller-b:before { content: ""; } .ion-ios-game-controller-b-outline:before { content: ""; } .ion-ios-gear:before { content: ""; } .ion-ios-gear-outline:before { content: ""; } .ion-ios-glasses:before { content: ""; } .ion-ios-glasses-outline:before { content: ""; } .ion-ios-grid-view:before { content: ""; } .ion-ios-grid-view-outline:before { content: ""; } .ion-ios-heart:before { content: ""; } .ion-ios-heart-outline:before { content: ""; } .ion-ios-help:before { content: ""; } .ion-ios-help-empty:before { content: ""; } .ion-ios-help-outline:before { content: ""; } .ion-ios-home:before { content: ""; } .ion-ios-home-outline:before { content: ""; } .ion-ios-infinite:before { content: ""; } .ion-ios-infinite-outline:before { content: ""; } .ion-ios-information:before { content: ""; } .ion-ios-information-empty:before { content: ""; } .ion-ios-information-outline:before { content: ""; } .ion-ios-ionic-outline:before { content: ""; } .ion-ios-keypad:before { content: ""; } .ion-ios-keypad-outline:before { content: ""; } .ion-ios-lightbulb:before { content: ""; } .ion-ios-lightbulb-outline:before { content: ""; } .ion-ios-list:before { content: ""; } .ion-ios-list-outline:before { content: ""; } .ion-ios-location:before { content: ""; } .ion-ios-location-outline:before { content: ""; } .ion-ios-locked:before { content: ""; } .ion-ios-locked-outline:before { content: ""; } .ion-ios-loop:before { content: ""; } .ion-ios-loop-strong:before { content: ""; } .ion-ios-medical:before { content: ""; } .ion-ios-medical-outline:before { content: ""; } .ion-ios-medkit:before { content: ""; } .ion-ios-medkit-outline:before { content: ""; } .ion-ios-mic:before { content: ""; } .ion-ios-mic-off:before { content: ""; } .ion-ios-mic-outline:before { content: ""; } .ion-ios-minus:before { content: ""; } .ion-ios-minus-empty:before { content: ""; } .ion-ios-minus-outline:before { content: ""; } .ion-ios-monitor:before { content: ""; } .ion-ios-monitor-outline:before { content: ""; } .ion-ios-moon:before { content: ""; } .ion-ios-moon-outline:before { content: ""; } .ion-ios-more:before { content: ""; } .ion-ios-more-outline:before { content: ""; } .ion-ios-musical-note:before { content: ""; } .ion-ios-musical-notes:before { content: ""; } .ion-ios-navigate:before { content: ""; } .ion-ios-navigate-outline:before { content: ""; } .ion-ios-nutrition:before { content: ""; } .ion-ios-nutrition-outline:before { content: ""; } .ion-ios-paper:before { content: ""; } .ion-ios-paper-outline:before { content: ""; } .ion-ios-paperplane:before { content: ""; } .ion-ios-paperplane-outline:before { content: ""; } .ion-ios-partlysunny:before { content: ""; } .ion-ios-partlysunny-outline:before { content: ""; } .ion-ios-pause:before { content: ""; } .ion-ios-pause-outline:before { content: ""; } .ion-ios-paw:before { content: ""; } .ion-ios-paw-outline:before { content: ""; } .ion-ios-people:before { content: ""; } .ion-ios-people-outline:before { content: ""; } .ion-ios-person:before { content: ""; } .ion-ios-person-outline:before { content: ""; } .ion-ios-personadd:before { content: ""; } .ion-ios-personadd-outline:before { content: ""; } .ion-ios-photos:before { content: ""; } .ion-ios-photos-outline:before { content: ""; } .ion-ios-pie:before { content: ""; } .ion-ios-pie-outline:before { content: ""; } .ion-ios-pint:before { content: ""; } .ion-ios-pint-outline:before { content: ""; } .ion-ios-play:before { content: ""; } .ion-ios-play-outline:before { content: ""; } .ion-ios-plus:before { content: ""; } .ion-ios-plus-empty:before { content: ""; } .ion-ios-plus-outline:before { content: ""; } .ion-ios-pricetag:before { content: ""; } .ion-ios-pricetag-outline:before { content: ""; } .ion-ios-pricetags:before { content: ""; } .ion-ios-pricetags-outline:before { content: ""; } .ion-ios-printer:before { content: ""; } .ion-ios-printer-outline:before { content: ""; } .ion-ios-pulse:before { content: ""; } .ion-ios-pulse-strong:before { content: ""; } .ion-ios-rainy:before { content: ""; } .ion-ios-rainy-outline:before { content: ""; } .ion-ios-recording:before { content: ""; } .ion-ios-recording-outline:before { content: ""; } .ion-ios-redo:before { content: ""; } .ion-ios-redo-outline:before { content: ""; } .ion-ios-refresh:before { content: ""; } .ion-ios-refresh-empty:before { content: ""; } .ion-ios-refresh-outline:before { content: ""; } .ion-ios-reload:before { content: ""; } .ion-ios-reverse-camera:before { content: ""; } .ion-ios-reverse-camera-outline:before { content: ""; } .ion-ios-rewind:before { content: ""; } .ion-ios-rewind-outline:before { content: ""; } .ion-ios-rose:before { content: ""; } .ion-ios-rose-outline:before { content: ""; } .ion-ios-search:before { content: ""; } .ion-ios-search-strong:before { content: ""; } .ion-ios-settings:before { content: ""; } .ion-ios-settings-strong:before { content: ""; } .ion-ios-shuffle:before { content: ""; } .ion-ios-shuffle-strong:before { content: ""; } .ion-ios-skipbackward:before { content: ""; } .ion-ios-skipbackward-outline:before { content: ""; } .ion-ios-skipforward:before { content: ""; } .ion-ios-skipforward-outline:before { content: ""; } .ion-ios-snowy:before { content: ""; } .ion-ios-speedometer:before { content: ""; } .ion-ios-speedometer-outline:before { content: ""; } .ion-ios-star:before { content: ""; } .ion-ios-star-half:before { content: ""; } .ion-ios-star-outline:before { content: ""; } .ion-ios-stopwatch:before { content: ""; } .ion-ios-stopwatch-outline:before { content: ""; } .ion-ios-sunny:before { content: ""; } .ion-ios-sunny-outline:before { content: ""; } .ion-ios-telephone:before { content: ""; } .ion-ios-telephone-outline:before { content: ""; } .ion-ios-tennisball:before { content: ""; } .ion-ios-tennisball-outline:before { content: ""; } .ion-ios-thunderstorm:before { content: ""; } .ion-ios-thunderstorm-outline:before { content: ""; } .ion-ios-time:before { content: ""; } .ion-ios-time-outline:before { content: ""; } .ion-ios-timer:before { content: ""; } .ion-ios-timer-outline:before { content: ""; } .ion-ios-toggle:before { content: ""; } .ion-ios-toggle-outline:before { content: ""; } .ion-ios-trash:before { content: ""; } .ion-ios-trash-outline:before { content: ""; } .ion-ios-undo:before { content: ""; } .ion-ios-undo-outline:before { content: ""; } .ion-ios-unlocked:before { content: ""; } .ion-ios-unlocked-outline:before { content: ""; } .ion-ios-upload:before { content: ""; } .ion-ios-upload-outline:before { content: ""; } .ion-ios-videocam:before { content: ""; } .ion-ios-videocam-outline:before { content: ""; } .ion-ios-volume-high:before { content: ""; } .ion-ios-volume-low:before { content: ""; } .ion-ios-wineglass:before { content: ""; } .ion-ios-wineglass-outline:before { content: ""; } .ion-ios-world:before { content: ""; } .ion-ios-world-outline:before { content: ""; } .ion-ipad:before { content: ""; } .ion-iphone:before { content: ""; } .ion-ipod:before { content: ""; } .ion-jet:before { content: ""; } .ion-key:before { content: ""; } .ion-knife:before { content: ""; } .ion-laptop:before { content: ""; } .ion-leaf:before { content: ""; } .ion-levels:before { content: ""; } .ion-lightbulb:before { content: ""; } .ion-link:before { content: ""; } .ion-load-a:before { content: ""; } .ion-load-b:before { content: ""; } .ion-load-c:before { content: ""; } .ion-load-d:before { content: ""; } .ion-location:before { content: ""; } .ion-lock-combination:before { content: ""; } .ion-locked:before { content: ""; } .ion-log-in:before { content: ""; } .ion-log-out:before { content: ""; } .ion-loop:before { content: ""; } .ion-magnet:before { content: ""; } .ion-male:before { content: ""; } .ion-man:before { content: ""; } .ion-map:before { content: ""; } .ion-medkit:before { content: ""; } .ion-merge:before { content: ""; } .ion-mic-a:before { content: ""; } .ion-mic-b:before { content: ""; } .ion-mic-c:before { content: ""; } .ion-minus:before { content: ""; } .ion-minus-circled:before { content: ""; } .ion-minus-round:before { content: ""; } .ion-model-s:before { content: ""; } .ion-monitor:before { content: ""; } .ion-more:before { content: ""; } .ion-mouse:before { content: ""; } .ion-music-note:before { content: ""; } .ion-navicon:before { content: ""; } .ion-navicon-round:before { content: ""; } .ion-navigate:before { content: ""; } .ion-network:before { content: ""; } .ion-no-smoking:before { content: ""; } .ion-nuclear:before { content: ""; } .ion-outlet:before { content: ""; } .ion-paintbrush:before { content: ""; } .ion-paintbucket:before { content: ""; } .ion-paper-airplane:before { content: ""; } .ion-paperclip:before { content: ""; } .ion-pause:before { content: ""; } .ion-person:before { content: ""; } .ion-person-add:before { content: ""; } .ion-person-stalker:before { content: ""; } .ion-pie-graph:before { content: ""; } .ion-pin:before { content: ""; } .ion-pinpoint:before { content: ""; } .ion-pizza:before { content: ""; } .ion-plane:before { content: ""; } .ion-planet:before { content: ""; } .ion-play:before { content: ""; } .ion-playstation:before { content: ""; } .ion-plus:before { content: ""; } .ion-plus-circled:before { content: ""; } .ion-plus-round:before { content: ""; } .ion-podium:before { content: ""; } .ion-pound:before { content: ""; } .ion-power:before { content: ""; } .ion-pricetag:before { content: ""; } .ion-pricetags:before { content: ""; } .ion-printer:before { content: ""; } .ion-pull-request:before { content: ""; } .ion-qr-scanner:before { content: ""; } .ion-quote:before { content: ""; } .ion-radio-waves:before { content: ""; } .ion-record:before { content: ""; } .ion-refresh:before { content: ""; } .ion-reply:before { content: ""; } .ion-reply-all:before { content: ""; } .ion-ribbon-a:before { content: ""; } .ion-ribbon-b:before { content: ""; } .ion-sad:before { content: ""; } .ion-sad-outline:before { content: ""; } .ion-scissors:before { content: ""; } .ion-search:before { content: ""; } .ion-settings:before { content: ""; } .ion-share:before { content: ""; } .ion-shuffle:before { content: ""; } .ion-skip-backward:before { content: ""; } .ion-skip-forward:before { content: ""; } .ion-social-android:before { content: ""; } .ion-social-android-outline:before { content: ""; } .ion-social-angular:before { content: ""; } .ion-social-angular-outline:before { content: ""; } .ion-social-apple:before { content: ""; } .ion-social-apple-outline:before { content: ""; } .ion-social-bitcoin:before { content: ""; } .ion-social-bitcoin-outline:before { content: ""; } .ion-social-buffer:before { content: ""; } .ion-social-buffer-outline:before { content: ""; } .ion-social-chrome:before { content: ""; } .ion-social-chrome-outline:before { content: ""; } .ion-social-codepen:before { content: ""; } .ion-social-codepen-outline:before { content: ""; } .ion-social-css3:before { content: ""; } .ion-social-css3-outline:before { content: ""; } .ion-social-designernews:before { content: ""; } .ion-social-designernews-outline:before { content: ""; } .ion-social-dribbble:before { content: ""; } .ion-social-dribbble-outline:before { content: ""; } .ion-social-dropbox:before { content: ""; } .ion-social-dropbox-outline:before { content: ""; } .ion-social-euro:before { content: ""; } .ion-social-euro-outline:before { content: ""; } .ion-social-facebook:before { content: ""; } .ion-social-facebook-outline:before { content: ""; } .ion-social-foursquare:before { content: ""; } .ion-social-foursquare-outline:before { content: ""; } .ion-social-freebsd-devil:before { content: ""; } .ion-social-github:before { content: ""; } .ion-social-github-outline:before { content: ""; } .ion-social-google:before { content: ""; } .ion-social-google-outline:before { content: ""; } .ion-social-googleplus:before { content: ""; } .ion-social-googleplus-outline:before { content: ""; } .ion-social-hackernews:before { content: ""; } .ion-social-hackernews-outline:before { content: ""; } .ion-social-html5:before { content: ""; } .ion-social-html5-outline:before { content: ""; } .ion-social-instagram:before { content: ""; } .ion-social-instagram-outline:before { content: ""; } .ion-social-javascript:before { content: ""; } .ion-social-javascript-outline:before { content: ""; } .ion-social-linkedin:before { content: ""; } .ion-social-linkedin-outline:before { content: ""; } .ion-social-markdown:before { content: ""; } .ion-social-nodejs:before { content: ""; } .ion-social-octocat:before { content: ""; } .ion-social-pinterest:before { content: ""; } .ion-social-pinterest-outline:before { content: ""; } .ion-social-python:before { content: ""; } .ion-social-reddit:before { content: ""; } .ion-social-reddit-outline:before { content: ""; } .ion-social-rss:before { content: ""; } .ion-social-rss-outline:before { content: ""; } .ion-social-sass:before { content: ""; } .ion-social-skype:before { content: ""; } .ion-social-skype-outline:before { content: ""; } .ion-social-snapchat:before { content: ""; } .ion-social-snapchat-outline:before { content: ""; } .ion-social-tumblr:before { content: ""; } .ion-social-tumblr-outline:before { content: ""; } .ion-social-tux:before { content: ""; } .ion-social-twitch:before { content: ""; } .ion-social-twitch-outline:before { content: ""; } .ion-social-twitter:before { content: ""; } .ion-social-twitter-outline:before { content: ""; } .ion-social-usd:before { content: ""; } .ion-social-usd-outline:before { content: ""; } .ion-social-vimeo:before { content: ""; } .ion-social-vimeo-outline:before { content: ""; } .ion-social-whatsapp:before { content: ""; } .ion-social-whatsapp-outline:before { content: ""; } .ion-social-windows:before { content: ""; } .ion-social-windows-outline:before { content: ""; } .ion-social-wordpress:before { content: ""; } .ion-social-wordpress-outline:before { content: ""; } .ion-social-yahoo:before { content: ""; } .ion-social-yahoo-outline:before { content: ""; } .ion-social-yen:before { content: ""; } .ion-social-yen-outline:before { content: ""; } .ion-social-youtube:before { content: ""; } .ion-social-youtube-outline:before { content: ""; } .ion-soup-can:before { content: ""; } .ion-soup-can-outline:before { content: ""; } .ion-speakerphone:before { content: ""; } .ion-speedometer:before { content: ""; } .ion-spoon:before { content: ""; } .ion-star:before { content: ""; } .ion-stats-bars:before { content: ""; } .ion-steam:before { content: ""; } .ion-stop:before { content: ""; } .ion-thermometer:before { content: ""; } .ion-thumbsdown:before { content: ""; } .ion-thumbsup:before { content: ""; } .ion-toggle:before { content: ""; } .ion-toggle-filled:before { content: ""; } .ion-transgender:before { content: ""; } .ion-trash-a:before { content: ""; } .ion-trash-b:before { content: ""; } .ion-trophy:before { content: ""; } .ion-tshirt:before { content: ""; } .ion-tshirt-outline:before { content: ""; } .ion-umbrella:before { content: ""; } .ion-university:before { content: ""; } .ion-unlocked:before { content: ""; } .ion-upload:before { content: ""; } .ion-usb:before { content: ""; } .ion-videocamera:before { content: ""; } .ion-volume-high:before { content: ""; } .ion-volume-low:before { content: ""; } .ion-volume-medium:before { content: ""; } .ion-volume-mute:before { content: ""; } .ion-wand:before { content: ""; } .ion-waterdrop:before { content: ""; } .ion-wifi:before { content: ""; } .ion-wineglass:before { content: ""; } .ion-woman:before { content: ""; } .ion-wrench:before { content: ""; } .ion-xbox:before { content: ""; } /** * Resets * -------------------------------------------------- * Adapted from normalize.css and some reset.css. We don't care even one * bit about old IE, so we don't need any hacks for that in here. * * There are probably other things we could remove here, as well. * * normalize.css v2.1.2 | MIT License | git.io/normalize * Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/) * http://cssreset.com */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, i, u, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, fieldset, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; vertical-align: baseline; font: inherit; font-size: 100%; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } /** * Prevent modern browsers from displaying `audio` without controls. * Remove excess height in iOS 5 devices. */ audio:not([controls]) { display: none; height: 0; } /** * Hide the `template` element in IE, Safari, and Firefox < 22. */ [hidden], template { display: none; } script { display: none !important; } /* ========================================================================== Base ========================================================================== */ /** * 1. Set default font family to sans-serif. * 2. Prevent iOS text size adjust after orientation change, without disabling * user zoom. */ html { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; font-family: sans-serif; /* 1 */ -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; /* 2 */ -webkit-text-size-adjust: 100%; /* 2 */ } /** * Remove default margin. */ body { margin: 0; line-height: 1; } /** * Remove default outlines. */ a, button, :focus, a:focus, button:focus, a:active, a:hover { outline: 0; } /* * * Remove tap highlight color */ a { -webkit-user-drag: none; -webkit-tap-highlight-color: transparent; -webkit-tap-highlight-color: transparent; } a[href]:hover { cursor: pointer; } /* ========================================================================== Typography ========================================================================== */ /** * Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome. */ b, strong { font-weight: bold; } /** * Address styling not present in Safari 5 and Chrome. */ dfn { font-style: italic; } /** * Address differences between Firefox and other browsers. */ hr { -moz-box-sizing: content-box; box-sizing: content-box; height: 0; } /** * Correct font family set oddly in Safari 5 and Chrome. */ code, kbd, pre, samp { font-size: 1em; font-family: monospace, serif; } /** * Improve readability of pre-formatted text in all browsers. */ pre { white-space: pre-wrap; } /** * Set consistent quote types. */ q { quotes: "\201C" "\201D" "\2018" "\2019"; } /** * Address inconsistent and variable font size in all browsers. */ small { font-size: 80%; } /** * Prevent `sub` and `sup` affecting `line-height` in all browsers. */ sub, sup { position: relative; vertical-align: baseline; font-size: 75%; line-height: 0; } sup { top: -0.5em; } sub { bottom: -0.25em; } /** * Define consistent border, margin, and padding. */ fieldset { margin: 0 2px; padding: 0.35em 0.625em 0.75em; border: 1px solid #c0c0c0; } /** * 1. Correct `color` not being inherited in IE 8/9. * 2. Remove padding so people aren't caught out if they zero out fieldsets. */ legend { padding: 0; /* 2 */ border: 0; /* 1 */ } /** * 1. Correct font family not being inherited in all browsers. * 2. Correct font size not being inherited in all browsers. * 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome. * 4. Remove any default :focus styles * 5. Make sure webkit font smoothing is being inherited * 6. Remove default gradient in Android Firefox / FirefoxOS */ button, input, select, textarea { margin: 0; /* 3 */ font-size: 100%; /* 2 */ font-family: inherit; /* 1 */ outline-offset: 0; /* 4 */ outline-style: none; /* 4 */ outline-width: 0; /* 4 */ -webkit-font-smoothing: inherit; /* 5 */ background-image: none; /* 6 */ } /** * Address Firefox 4+ setting `line-height` on `input` using `importnt` in * the UA stylesheet. */ button, input { line-height: normal; } /** * Address inconsistent `text-transform` inheritance for `button` and `select`. * All other form control elements do not inherit `text-transform` values. * Correct `button` style inheritance in Chrome, Safari 5+, and IE 8+. * Correct `select` style inheritance in Firefox 4+ and Opera. */ button, select { text-transform: none; } /** * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` * and `video` controls. * 2. Correct inability to style clickable `input` types in iOS. * 3. Improve usability and consistency of cursor style between image-type * `input` and others. */ button, html input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; /* 3 */ -webkit-appearance: button; /* 2 */ } /** * Re-set default cursor for disabled elements. */ button[disabled], html input[disabled] { cursor: default; } /** * 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome. * 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome * (include `-moz` to future-proof). */ input[type="search"] { -webkit-box-sizing: content-box; /* 2 */ -moz-box-sizing: content-box; box-sizing: content-box; -webkit-appearance: textfield; /* 1 */ } /** * Remove inner padding and search cancel button in Safari 5 and Chrome * on OS X. */ input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } /** * Remove inner padding and border in Firefox 4+. */ button::-moz-focus-inner, input::-moz-focus-inner { padding: 0; border: 0; } /** * 1. Remove default vertical scrollbar in IE 8/9. * 2. Improve readability and alignment in all browsers. */ textarea { overflow: auto; /* 1 */ vertical-align: top; /* 2 */ } img { -webkit-user-drag: none; } /* ========================================================================== Tables ========================================================================== */ /** * Remove most spacing between table cells. */ table { border-spacing: 0; border-collapse: collapse; } /** * Scaffolding * -------------------------------------------------- */ *, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } html { overflow: hidden; -ms-touch-action: pan-y; touch-action: pan-y; } body, .ionic-body { -webkit-touch-callout: none; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; -webkit-text-size-adjust: none; -moz-text-size-adjust: none; text-size-adjust: none; -webkit-tap-highlight-color: transparent; -webkit-tap-highlight-color: transparent; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; top: 0; right: 0; bottom: 0; left: 0; overflow: hidden; margin: 0; padding: 0; color: #000; word-wrap: break-word; font-size: 16px; font-family: -apple-system; font-family: "Roboto", sans-serif; line-height: 22px; text-rendering: optimizeLegibility; -webkit-backface-visibility: hidden; -webkit-user-drag: none; -ms-content-zooming: none; } body.grade-b, body.grade-c { text-rendering: auto; } .content { position: relative; } .scroll-content { position: absolute; top: 0; right: 0; bottom: 0; left: 0; overflow: hidden; margin-top: -1px; padding-top: 1px; margin-bottom: -1px; width: auto; height: auto; } .menu .scroll-content.scroll-content-false { z-index: 11; } .scroll-view { position: relative; display: block; overflow: hidden; margin-top: -1px; } .scroll-view.overflow-scroll { position: relative; } .scroll-view.scroll-x { overflow-x: scroll; overflow-y: hidden; } .scroll-view.scroll-y { overflow-x: hidden; overflow-y: scroll; } .scroll-view.scroll-xy { overflow-x: scroll; overflow-y: scroll; } /** * Scroll is the scroll view component available for complex and custom * scroll view functionality. */ .scroll { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -webkit-text-size-adjust: none; -moz-text-size-adjust: none; text-size-adjust: none; -webkit-transform-origin: left top; transform-origin: left top; } /** * Set ms-viewport to prevent MS "page squish" and allow fluid scrolling * https://msdn.microsoft.com/en-us/library/ie/hh869615(v=vs.85).aspx */ @-ms-viewport { width: device-width; } .scroll-bar { position: absolute; z-index: 9999; } .ng-animate .scroll-bar { visibility: hidden; } .scroll-bar-h { right: 2px; bottom: 3px; left: 2px; height: 3px; } .scroll-bar-h .scroll-bar-indicator { height: 100%; } .scroll-bar-v { top: 2px; right: 3px; bottom: 2px; width: 3px; } .scroll-bar-v .scroll-bar-indicator { width: 100%; } .scroll-bar-indicator { position: absolute; border-radius: 4px; background: rgba(0, 0, 0, 0.3); opacity: 1; -webkit-transition: opacity 0.3s linear; transition: opacity 0.3s linear; } .scroll-bar-indicator.scroll-bar-fade-out { opacity: 0; } .platform-android .scroll-bar-indicator { border-radius: 0; } .grade-b .scroll-bar-indicator, .grade-c .scroll-bar-indicator { background: #aaa; } .grade-b .scroll-bar-indicator.scroll-bar-fade-out, .grade-c .scroll-bar-indicator.scroll-bar-fade-out { -webkit-transition: none; transition: none; } ion-infinite-scroll { height: 60px; width: 100%; display: block; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-direction: normal; -webkit-box-orient: horizontal; -webkit-flex-direction: row; -moz-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; } ion-infinite-scroll .icon { color: #666666; font-size: 30px; color: #666666; } ion-infinite-scroll:not(.active) .spinner, ion-infinite-scroll:not(.active) .icon:before { display: none; } .overflow-scroll { overflow-x: hidden; overflow-y: scroll; -webkit-overflow-scrolling: touch; -ms-overflow-style: -ms-autohiding-scrollbar; top: 0; right: 0; bottom: 0; left: 0; position: absolute; } .overflow-scroll.pane { overflow-x: hidden; overflow-y: scroll; } .overflow-scroll .scroll { position: static; height: 100%; -webkit-transform: translate3d(0, 0, 0); } /* If you change these, change platform.scss as well */ .has-header { top: 44px; } .no-header { top: 0; } .has-subheader { top: 88px; } .has-tabs-top { top: 93px; } .has-header.has-subheader.has-tabs-top { top: 137px; } .has-footer { bottom: 44px; } .has-subfooter { bottom: 88px; } .has-tabs, .bar-footer.has-tabs { bottom: 49px; } .has-tabs.pane, .bar-footer.has-tabs.pane { bottom: 49px; height: auto; } .bar-subfooter.has-tabs { bottom: 93px; } .has-footer.has-tabs { bottom: 93px; } .pane { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); -webkit-transition-duration: 0; transition-duration: 0; z-index: 1; } .view { z-index: 1; } .pane, .view { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; background-color: #f2f2f2; overflow: hidden; } .view-container { position: absolute; display: block; width: 100%; height: 100%; } /** * Typography * -------------------------------------------------- */ p { margin: 0 0 11px; } small { font-size: 85%; } cite { font-style: normal; } .text-left { text-align: left; } .text-right { text-align: right; } .text-center { text-align: center; } h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { color: #000; font-weight: 500; font-family: "Roboto", sans-serif; line-height: 1.2; } h1 small, h2 small, h3 small, h4 small, h5 small, h6 small, .h1 small, .h2 small, .h3 small, .h4 small, .h5 small, .h6 small { font-weight: normal; line-height: 1; } h1, .h1, h2, .h2, h3, .h3 { margin-top: 22px; margin-bottom: 11px; } h1:first-child, .h1:first-child, h2:first-child, .h2:first-child, h3:first-child, .h3:first-child { margin-top: 0; } h1 + h1, h1 + .h1, h1 + h2, h1 + .h2, h1 + h3, h1 + .h3, .h1 + h1, .h1 + .h1, .h1 + h2, .h1 + .h2, .h1 + h3, .h1 + .h3, h2 + h1, h2 + .h1, h2 + h2, h2 + .h2, h2 + h3, h2 + .h3, .h2 + h1, .h2 + .h1, .h2 + h2, .h2 + .h2, .h2 + h3, .h2 + .h3, h3 + h1, h3 + .h1, h3 + h2, h3 + .h2, h3 + h3, h3 + .h3, .h3 + h1, .h3 + .h1, .h3 + h2, .h3 + .h2, .h3 + h3, .h3 + .h3 { margin-top: 11px; } h4, .h4, h5, .h5, h6, .h6 { margin-top: 11px; margin-bottom: 11px; } h1, .h1 { font-size: 41px; } h2, .h2 { font-size: 34px; } h3, .h3 { font-size: 28px; } h4, .h4 { font-size: 20px; } h5, .h5 { font-size: 16px; } h6, .h6 { font-size: 14px; } h1 small, .h1 small { font-size: 28px; } h2 small, .h2 small { font-size: 20px; } h3 small, .h3 small, h4 small, .h4 small { font-size: 16px; } dl { margin-bottom: 22px; } dt, dd { line-height: 1.428571429; } dt { font-weight: bold; } blockquote { margin: 0 0 22px; padding: 11px 22px; border-left: 5px solid gray; } blockquote p { font-weight: 300; font-size: 20px; line-height: 1.25; } blockquote p:last-child { margin-bottom: 0; } blockquote small { display: block; line-height: 1.428571429; } blockquote small:before { content: '\2014 \00A0'; } q:before, q:after, blockquote:before, blockquote:after { content: ""; } address { display: block; margin-bottom: 22px; font-style: normal; line-height: 1.428571429; } a { color: #494949; } a.subdued { padding-right: 10px; color: #888; text-decoration: none; } a.subdued:hover { text-decoration: none; } a.subdued:last-child { padding-right: 0; } /** * Action Sheets * -------------------------------------------------- */ .action-sheet-backdrop { -webkit-transition: background-color 150ms ease-in-out; transition: background-color 150ms ease-in-out; position: fixed; top: 0; left: 0; z-index: 11; width: 100%; height: 100%; background-color: transparent; } .action-sheet-backdrop.active { background-color: rgba(0, 0, 0, 0.4); } .action-sheet-wrapper { -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); -webkit-transition: all cubic-bezier(0.36, 0.66, 0.04, 1) 500ms; transition: all cubic-bezier(0.36, 0.66, 0.04, 1) 500ms; position: absolute; bottom: 0; left: 0; right: 0; width: 100%; max-width: 500px; margin: auto; } .action-sheet-up { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .action-sheet { margin-left: 8px; margin-right: 8px; width: auto; z-index: 11; overflow: hidden; } .action-sheet .button { display: block; padding: 1px; width: 100%; border-radius: 0; border-color: #d1d3d6; background-color: transparent; color: #007aff; font-size: 21px; } .action-sheet .button:hover { color: #007aff; } .action-sheet .button.destructive { color: #ff3b30; } .action-sheet .button.destructive:hover { color: #ff3b30; } .action-sheet .button.active, .action-sheet .button.activated { box-shadow: none; border-color: #d1d3d6; color: #007aff; background: #e4e5e7; } .action-sheet-has-icons .icon { position: absolute; left: 16px; } .action-sheet-title { padding: 16px; color: #8f8f8f; text-align: center; font-size: 13px; } .action-sheet-group { margin-bottom: 8px; border-radius: 4px; background-color: #fff; overflow: hidden; } .action-sheet-group .button { border-width: 1px 0px 0px 0px; } .action-sheet-group .button:first-child:last-child { border-width: 0; } .action-sheet-options { background: #f1f2f3; } .action-sheet-cancel .button { font-weight: 500; } .action-sheet-open { pointer-events: none; } .action-sheet-open.modal-open .modal { pointer-events: none; } .action-sheet-open .action-sheet-backdrop { pointer-events: auto; } .platform-android .action-sheet-backdrop.active { background-color: rgba(0, 0, 0, 0.2); } .platform-android .action-sheet { margin: 0; } .platform-android .action-sheet .action-sheet-title, .platform-android .action-sheet .button { text-align: left; border-color: transparent; font-size: 16px; color: inherit; } .platform-android .action-sheet .action-sheet-title { font-size: 14px; padding: 16px; color: #666; } .platform-android .action-sheet .button.active, .platform-android .action-sheet .button.activated { background: #e8e8e8; } .platform-android .action-sheet-group { margin: 0; border-radius: 0; background-color: #fafafa; } .platform-android .action-sheet-cancel { display: none; } .platform-android .action-sheet-has-icons .button { padding-left: 56px; } .backdrop { position: fixed; top: 0; left: 0; z-index: 11; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.4); visibility: hidden; opacity: 0; -webkit-transition: 0.1s opacity linear; transition: 0.1s opacity linear; } .backdrop.visible { visibility: visible; } .backdrop.active { opacity: 1; } /** * Bar (Headers and Footers) * -------------------------------------------------- */ .bar { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; position: absolute; right: 0; left: 0; z-index: 9; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 5px; width: 100%; height: 44px; border-width: 0; border-style: solid; border-top: 1px solid transparent; border-bottom: 1px solid #f2f2f2; background-color: white; /* border-width: 1px will actually create 2 device pixels on retina */ /* this nifty trick sets an actual 1px border on hi-res displays */ background-size: 0; } @media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) { .bar { border: none; background-image: linear-gradient(0deg, #f2f2f2, #f2f2f2 50%, transparent 50%); background-position: bottom; background-size: 100% 1px; background-repeat: no-repeat; } } .bar.bar-clear { border: none; background: none; color: #fff; } .bar.bar-clear .button { color: #fff; } .bar.bar-clear .title { color: #fff; } .bar.item-input-inset .item-input-wrapper { margin-top: -1px; } .bar.item-input-inset .item-input-wrapper input { padding-left: 8px; width: 94%; height: 28px; background: transparent; } .bar.bar-light { border-color: #ddd; background-color: white; background-image: linear-gradient(0deg, #ddd, #ddd 50%, transparent 50%); color: #444; } .bar.bar-light .title { color: #444; } .bar.bar-light.bar-footer { background-image: linear-gradient(180deg, #ddd, #ddd 50%, transparent 50%); } .bar.bar-stable { border-color: #b2b2b2; background-color: #f8f8f8; background-image: linear-gradient(0deg, #b2b2b2, #b2b2b2 50%, transparent 50%); color: #444; } .bar.bar-stable .title { color: #444; } .bar.bar-stable.bar-footer { background-image: linear-gradient(180deg, #b2b2b2, #b2b2b2 50%, transparent 50%); } .bar.bar-positive { border-color: #303030; background-color: #494949; background-image: linear-gradient(0deg, #303030, #303030 50%, transparent 50%); color: #fff; } .bar.bar-positive .title { color: #fff; } .bar.bar-positive.bar-footer { background-image: linear-gradient(180deg, #303030, #303030 50%, transparent 50%); } .bar.bar-calm { border-color: #0a9dc7; background-color: #11c1f3; background-image: linear-gradient(0deg, #0a9dc7, #0a9dc7 50%, transparent 50%); color: #fff; } .bar.bar-calm .title { color: #fff; } .bar.bar-calm.bar-footer { background-image: linear-gradient(180deg, #0a9dc7, #0a9dc7 50%, transparent 50%); } .bar.bar-assertive { border-color: #e42112; background-color: #ef473a; background-image: linear-gradient(0deg, #e42112, #e42112 50%, transparent 50%); color: #fff; } .bar.bar-assertive .title { color: #fff; } .bar.bar-assertive.bar-footer { background-image: linear-gradient(180deg, #e42112, #e42112 50%, transparent 50%); } .bar.bar-balanced { border-color: #28a54c; background-color: #33cd5f; background-image: linear-gradient(0deg, #28a54c, #28a54c 50%, transparent 50%); color: #fff; } .bar.bar-balanced .title { color: #fff; } .bar.bar-balanced.bar-footer { background-image: linear-gradient(180deg, #28a54c, #28a54c 50%, transparent 50%); } .bar.bar-energized { border-color: #e6b500; background-color: #ffc900; background-image: linear-gradient(0deg, #e6b500, #e6b500 50%, transparent 50%); color: #fff; } .bar.bar-energized .title { color: #fff; } .bar.bar-energized.bar-footer { background-image: linear-gradient(180deg, #e6b500, #e6b500 50%, transparent 50%); } .bar.bar-royal { border-color: #fab915; background-color: #fab915; background-image: linear-gradient(0deg, #fab915, #fab915 50%, transparent 50%); color: #ffffff; } .bar.bar-royal .title { color: #ffffff; } .bar.bar-royal.bar-footer { background-image: linear-gradient(180deg, #fab915, #fab915 50%, transparent 50%); } .bar.bar-dark { border-color: #111; background-color: #444444; background-image: linear-gradient(0deg, #111, #111 50%, transparent 50%); color: #fff; } .bar.bar-dark .title { color: #fff; } .bar.bar-dark.bar-footer { background-image: linear-gradient(180deg, #111, #111 50%, transparent 50%); } .bar .title { display: block; position: absolute; top: 0; right: 0; left: 0; z-index: 0; overflow: hidden; margin: 0 10px; min-width: 30px; height: 43px; text-align: center; text-overflow: ellipsis; white-space: nowrap; font-size: 17px; font-weight: 500; line-height: 44px; } .bar .title.title-left { text-align: left; } .bar .title.title-right { text-align: right; } .bar .title a { color: inherit; } .bar .button, .bar button { z-index: 1; padding: 0 8px; min-width: initial; min-height: 31px; font-weight: 400; font-size: 13px; line-height: 32px; } .bar .button.button-icon:before, .bar .button .icon:before, .bar .button.icon:before, .bar .button.icon-left:before, .bar .button.icon-right:before, .bar button.button-icon:before, .bar button .icon:before, .bar button.icon:before, .bar button.icon-left:before, .bar button.icon-right:before { padding-right: 2px; padding-left: 2px; font-size: 20px; line-height: 32px; } .bar .button.button-icon, .bar button.button-icon { font-size: 17px; } .bar .button.button-icon .icon:before, .bar .button.button-icon:before, .bar .button.button-icon.icon-left:before, .bar .button.button-icon.icon-right:before, .bar button.button-icon .icon:before, .bar button.button-icon:before, .bar button.button-icon.icon-left:before, .bar button.button-icon.icon-right:before { vertical-align: top; font-size: 32px; line-height: 32px; } .bar .button.button-clear, .bar button.button-clear { padding-right: 2px; padding-left: 2px; font-weight: 300; font-size: 17px; } .bar .button.button-clear .icon:before, .bar .button.button-clear.icon:before, .bar .button.button-clear.icon-left:before, .bar .button.button-clear.icon-right:before, .bar button.button-clear .icon:before, .bar button.button-clear.icon:before, .bar button.button-clear.icon-left:before, .bar button.button-clear.icon-right:before { font-size: 32px; line-height: 32px; } .bar .button.back-button, .bar button.back-button { display: block; margin-right: 5px; padding: 0; white-space: nowrap; font-weight: 400; } .bar .button.back-button.active, .bar .button.back-button.activated, .bar button.back-button.active, .bar button.back-button.activated { opacity: 0.2; } .bar .button-bar > .button, .bar .buttons > .button { min-height: 31px; line-height: 32px; } .bar .button-bar + .button, .bar .button + .button-bar { margin-left: 5px; } .bar .buttons, .bar .buttons.primary-buttons, .bar .buttons.secondary-buttons { display: inherit; } .bar .buttons span { display: inline-block; } .bar .buttons-left span { margin-right: 5px; display: inherit; } .bar .buttons-right span { margin-left: 5px; display: inherit; } .bar .title + .button:last-child, .bar > .button + .button:last-child, .bar > .button.pull-right, .bar .buttons.pull-right, .bar .title + .buttons { position: absolute; top: 5px; right: 5px; bottom: 5px; } .platform-android .nav-bar-has-subheader .bar { background-image: none; } .platform-android .bar .back-button .icon:before { font-size: 24px; } .platform-android .bar .title { font-size: 19px; line-height: 44px; } .bar-light .button { border-color: #ddd; background-color: white; color: #444; } .bar-light .button:hover { color: #444; text-decoration: none; } .bar-light .button.active, .bar-light .button.activated { border-color: #ccc; background-color: #fafafa; } .bar-light .button.button-clear { border-color: transparent; background: none; box-shadow: none; color: #444; font-size: 17px; } .bar-light .button.button-icon { border-color: transparent; background: none; } .bar-stable .button { border-color: #b2b2b2; background-color: #f8f8f8; color: #444; } .bar-stable .button:hover { color: #444; text-decoration: none; } .bar-stable .button.active, .bar-stable .button.activated { border-color: #a2a2a2; background-color: #e5e5e5; } .bar-stable .button.button-clear { border-color: transparent; background: none; box-shadow: none; color: #444; font-size: 17px; } .bar-stable .button.button-icon { border-color: transparent; background: none; } .bar-positive .button { border-color: #303030; background-color: #494949; color: #fff; } .bar-positive .button:hover { color: #fff; text-decoration: none; } .bar-positive .button.active, .bar-positive .button.activated { border-color: #303030; background-color: #303030; } .bar-positive .button.button-clear { border-color: transparent; background: none; box-shadow: none; color: #fff; font-size: 17px; } .bar-positive .button.button-icon { border-color: transparent; background: none; } .bar-calm .button { border-color: #0a9dc7; background-color: #11c1f3; color: #fff; } .bar-calm .button:hover { color: #fff; text-decoration: none; } .bar-calm .button.active, .bar-calm .button.activated { border-color: #0a9dc7; background-color: #0a9dc7; } .bar-calm .button.button-clear { border-color: transparent; background: none; box-shadow: none; color: #fff; font-size: 17px; } .bar-calm .button.button-icon { border-color: transparent; background: none; } .bar-assertive .button { border-color: #e42112; background-color: #ef473a; color: #fff; } .bar-assertive .button:hover { color: #fff; text-decoration: none; } .bar-assertive .button.active, .bar-assertive .button.activated { border-color: #e42112; background-color: #e42112; } .bar-assertive .button.button-clear { border-color: transparent; background: none; box-shadow: none; color: #fff; font-size: 17px; } .bar-assertive .button.button-icon { border-color: transparent; background: none; } .bar-balanced .button { border-color: #28a54c; background-color: #33cd5f; color: #fff; } .bar-balanced .button:hover { color: #fff; text-decoration: none; } .bar-balanced .button.active, .bar-balanced .button.activated { border-color: #28a54c; background-color: #28a54c; } .bar-balanced .button.button-clear { border-color: transparent; background: none; box-shadow: none; color: #fff; font-size: 17px; } .bar-balanced .button.button-icon { border-color: transparent; background: none; } .bar-energized .button { border-color: #e6b500; background-color: #ffc900; color: #fff; } .bar-energized .button:hover { color: #fff; text-decoration: none; } .bar-energized .button.active, .bar-energized .button.activated { border-color: #e6b500; background-color: #e6b500; } .bar-energized .button.button-clear { border-color: transparent; background: none; box-shadow: none; color: #fff; font-size: 17px; } .bar-energized .button.button-icon { border-color: transparent; background: none; } .bar-royal .button { border-color: #fab915; background-color: #fab915; color: #ffffff; } .bar-royal .button:hover { color: #ffffff; text-decoration: none; } .bar-royal .button.active, .bar-royal .button.activated { border-color: #e1a305; background-color: #e1a305; } .bar-royal .button.button-clear { border-color: transparent; background: none; box-shadow: none; color: #fff; font-size: 17px; } .bar-royal .button.button-icon { border-color: transparent; background: none; } .bar-dark .button { border-color: #111; background-color: #444444; color: #fff; } .bar-dark .button:hover { color: #fff; text-decoration: none; } .bar-dark .button.active, .bar-dark .button.activated { border-color: #000; background-color: #262626; } .bar-dark .button.button-clear { border-color: transparent; background: none; box-shadow: none; color: #fff; font-size: 17px; } .bar-dark .button.button-icon { border-color: transparent; background: none; } .bar-header { top: 0; border-top-width: 0; border-bottom-width: 1px; } .bar-header.has-tabs-top { border-bottom-width: 0px; background-image: none; } .tabs-top .bar-header { border-bottom-width: 0px; background-image: none; } .bar-footer { bottom: 0; border-top-width: 1px; border-bottom-width: 0; background-position: top; height: 44px; } .bar-footer.item-input-inset { position: absolute; } .bar-footer .title { height: 43px; line-height: 44px; } .bar-tabs { padding: 0; } .bar-subheader { top: 44px; height: 44px; } .bar-subheader .title { height: 43px; line-height: 44px; } .bar-subfooter { bottom: 44px; height: 44px; } .bar-subfooter .title { height: 43px; line-height: 44px; } .nav-bar-block { position: absolute; top: 0; right: 0; left: 0; z-index: 9; } .bar .back-button.hide, .bar .buttons .hide { display: none; } .nav-bar-tabs-top .bar { background-image: none; } /** * Tabs * -------------------------------------------------- * A navigation bar with any number of tab items supported. */ .tabs { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-direction: normal; -webkit-box-orient: horizontal; -webkit-flex-direction: horizontal; -moz-flex-direction: horizontal; -ms-flex-direction: horizontal; flex-direction: horizontal; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; justify-content: center; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); border-color: #b2b2b2; background-color: #f8f8f8; background-image: linear-gradient(0deg, #b2b2b2, #b2b2b2 50%, transparent 50%); color: #444; position: absolute; bottom: 0; z-index: 5; width: 100%; height: 49px; border-style: solid; border-top-width: 1px; background-size: 0; line-height: 49px; } .tabs .tab-item .badge { background-color: #444; color: #f8f8f8; } @media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) { .tabs { padding-top: 2px; border-top: none !important; border-bottom: none; background-position: top; background-size: 100% 1px; background-repeat: no-repeat; } } /* Allow parent element of tabs to define color, or just the tab itself */ .tabs-light > .tabs, .tabs.tabs-light { border-color: #ddd; background-color: #fff; background-image: linear-gradient(0deg, #ddd, #ddd 50%, transparent 50%); color: #444; } .tabs-light > .tabs .tab-item .badge, .tabs.tabs-light .tab-item .badge { background-color: #444; color: #fff; } .tabs-stable > .tabs, .tabs.tabs-stable { border-color: #b2b2b2; background-color: #f8f8f8; background-image: linear-gradient(0deg, #b2b2b2, #b2b2b2 50%, transparent 50%); color: #444; } .tabs-stable > .tabs .tab-item .badge, .tabs.tabs-stable .tab-item .badge { background-color: #444; color: #f8f8f8; } .tabs-positive > .tabs, .tabs.tabs-positive { border-color: #303030; background-color: #494949; background-image: linear-gradient(0deg, #303030, #303030 50%, transparent 50%); color: #fff; } .tabs-positive > .tabs .tab-item .badge, .tabs.tabs-positive .tab-item .badge { background-color: #fff; color: #494949; } .tabs-calm > .tabs, .tabs.tabs-calm { border-color: #0a9dc7; background-color: #11c1f3; background-image: linear-gradient(0deg, #0a9dc7, #0a9dc7 50%, transparent 50%); color: #fff; } .tabs-calm > .tabs .tab-item .badge, .tabs.tabs-calm .tab-item .badge { background-color: #fff; color: #11c1f3; } .tabs-assertive > .tabs, .tabs.tabs-assertive { border-color: #e42112; background-color: #ef473a; background-image: linear-gradient(0deg, #e42112, #e42112 50%, transparent 50%); color: #fff; } .tabs-assertive > .tabs .tab-item .badge, .tabs.tabs-assertive .tab-item .badge { background-color: #fff; color: #ef473a; } .tabs-balanced > .tabs, .tabs.tabs-balanced { border-color: #28a54c; background-color: #33cd5f; background-image: linear-gradient(0deg, #28a54c, #28a54c 50%, transparent 50%); color: #fff; } .tabs-balanced > .tabs .tab-item .badge, .tabs.tabs-balanced .tab-item .badge { background-color: #fff; color: #33cd5f; } .tabs-energized > .tabs, .tabs.tabs-energized { border-color: #e6b500; background-color: #ffc900; background-image: linear-gradient(0deg, #e6b500, #e6b500 50%, transparent 50%); color: #fff; } .tabs-energized > .tabs .tab-item .badge, .tabs.tabs-energized .tab-item .badge { background-color: #fff; color: #ffc900; } .tabs-royal > .tabs, .tabs.tabs-royal { border-color: #e1a305; background-color: #fab915; background-image: linear-gradient(0deg, #e1a305, #e1a305 50%, transparent 50%); color: #fff; } .tabs-royal > .tabs .tab-item .badge, .tabs.tabs-royal .tab-item .badge { background-color: #fff; color: #fab915; } .tabs-dark > .tabs, .tabs.tabs-dark { border-color: #111; background-color: #444; background-image: linear-gradient(0deg, #111, #111 50%, transparent 50%); color: #fff; } .tabs-dark > .tabs .tab-item .badge, .tabs.tabs-dark .tab-item .badge { background-color: #fff; color: #444; } .tabs-striped .tabs { background-color: white; background-image: none; border: none; border-bottom: 1px solid #ddd; padding-top: 2px; } .tabs-striped .tab-item.tab-item-active, .tabs-striped .tab-item.active, .tabs-striped .tab-item.activated { margin-top: -2px; border-style: solid; border-width: 2px 0 0 0; border-color: #444; } .tabs-striped .tab-item.tab-item-active .badge, .tabs-striped .tab-item.active .badge, .tabs-striped .tab-item.activated .badge { top: 2px; opacity: 1; } .tabs-striped.tabs-light .tabs { background-color: #fff; } .tabs-striped.tabs-light .tab-item { color: rgba(68, 68, 68, 0.4); opacity: 1; } .tabs-striped.tabs-light .tab-item .badge { opacity: 0.4; } .tabs-striped.tabs-light .tab-item.tab-item-active, .tabs-striped.tabs-light .tab-item.active, .tabs-striped.tabs-light .tab-item.activated { margin-top: -2px; color: #444; border-style: solid; border-width: 2px 0 0 0; border-color: #444; } .tabs-striped.tabs-top .tab-item.tab-item-active .badge, .tabs-striped.tabs-top .tab-item.active .badge, .tabs-striped.tabs-top .tab-item.activated .badge { top: 4%; } .tabs-striped.tabs-stable .tabs { background-color: #f8f8f8; } .tabs-striped.tabs-stable .tab-item { color: rgba(68, 68, 68, 0.4); opacity: 1; } .tabs-striped.tabs-stable .tab-item .badge { opacity: 0.4; } .tabs-striped.tabs-stable .tab-item.tab-item-active, .tabs-striped.tabs-stable .tab-item.active, .tabs-striped.tabs-stable .tab-item.activated { margin-top: -2px; color: #444; border-style: solid; border-width: 2px 0 0 0; border-color: #444; } .tabs-striped.tabs-top .tab-item.tab-item-active .badge, .tabs-striped.tabs-top .tab-item.active .badge, .tabs-striped.tabs-top .tab-item.activated .badge { top: 4%; } .tabs-striped.tabs-positive .tabs { background-color: #494949; } .tabs-striped.tabs-positive .tab-item { color: rgba(255, 255, 255, 0.4); opacity: 1; } .tabs-striped.tabs-positive .tab-item .badge { opacity: 0.4; } .tabs-striped.tabs-positive .tab-item.tab-item-active, .tabs-striped.tabs-positive .tab-item.active, .tabs-striped.tabs-positive .tab-item.activated { margin-top: -2px; color: #fff; border-style: solid; border-width: 2px 0 0 0; border-color: #fff; } .tabs-striped.tabs-top .tab-item.tab-item-active .badge, .tabs-striped.tabs-top .tab-item.active .badge, .tabs-striped.tabs-top .tab-item.activated .badge { top: 4%; } .tabs-striped.tabs-calm .tabs { background-color: #11c1f3; } .tabs-striped.tabs-calm .tab-item { color: rgba(255, 255, 255, 0.4); opacity: 1; } .tabs-striped.tabs-calm .tab-item .badge { opacity: 0.4; } .tabs-striped.tabs-calm .tab-item.tab-item-active, .tabs-striped.tabs-calm .tab-item.active, .tabs-striped.tabs-calm .tab-item.activated { margin-top: -2px; color: #fff; border-style: solid; border-width: 2px 0 0 0; border-color: #fff; } .tabs-striped.tabs-top .tab-item.tab-item-active .badge, .tabs-striped.tabs-top .tab-item.active .badge, .tabs-striped.tabs-top .tab-item.activated .badge { top: 4%; } .tabs-striped.tabs-assertive .tabs { background-color: #ef473a; } .tabs-striped.tabs-assertive .tab-item { color: rgba(255, 255, 255, 0.4); opacity: 1; } .tabs-striped.tabs-assertive .tab-item .badge { opacity: 0.4; } .tabs-striped.tabs-assertive .tab-item.tab-item-active, .tabs-striped.tabs-assertive .tab-item.active, .tabs-striped.tabs-assertive .tab-item.activated { margin-top: -2px; color: #fff; border-style: solid; border-width: 2px 0 0 0; border-color: #fff; } .tabs-striped.tabs-top .tab-item.tab-item-active .badge, .tabs-striped.tabs-top .tab-item.active .badge, .tabs-striped.tabs-top .tab-item.activated .badge { top: 4%; } .tabs-striped.tabs-balanced .tabs { background-color: #33cd5f; } .tabs-striped.tabs-balanced .tab-item { color: rgba(255, 255, 255, 0.4); opacity: 1; } .tabs-striped.tabs-balanced .tab-item .badge { opacity: 0.4; } .tabs-striped.tabs-balanced .tab-item.tab-item-active, .tabs-striped.tabs-balanced .tab-item.active, .tabs-striped.tabs-balanced .tab-item.activated { margin-top: -2px; color: #fff; border-style: solid; border-width: 2px 0 0 0; border-color: #fff; } .tabs-striped.tabs-top .tab-item.tab-item-active .badge, .tabs-striped.tabs-top .tab-item.active .badge, .tabs-striped.tabs-top .tab-item.activated .badge { top: 4%; } .tabs-striped.tabs-energized .tabs { background-color: #ffc900; } .tabs-striped.tabs-energized .tab-item { color: rgba(255, 255, 255, 0.4); opacity: 1; } .tabs-striped.tabs-energized .tab-item .badge { opacity: 0.4; } .tabs-striped.tabs-energized .tab-item.tab-item-active, .tabs-striped.tabs-energized .tab-item.active, .tabs-striped.tabs-energized .tab-item.activated { margin-top: -2px; color: #fff; border-style: solid; border-width: 2px 0 0 0; border-color: #fff; } .tabs-striped.tabs-top .tab-item.tab-item-active .badge, .tabs-striped.tabs-top .tab-item.active .badge, .tabs-striped.tabs-top .tab-item.activated .badge { top: 4%; } .tabs-striped.tabs-royal .tabs { background-color: #fab915; } .tabs-striped.tabs-royal .tab-item { color: rgba(255, 255, 255, 0.4); opacity: 1; } .tabs-striped.tabs-royal .tab-item .badge { opacity: 0.4; } .tabs-striped.tabs-royal .tab-item.tab-item-active, .tabs-striped.tabs-royal .tab-item.active, .tabs-striped.tabs-royal .tab-item.activated { margin-top: -2px; color: #fff; border-style: solid; border-width: 2px 0 0 0; border-color: #fff; } .tabs-striped.tabs-top .tab-item.tab-item-active .badge, .tabs-striped.tabs-top .tab-item.active .badge, .tabs-striped.tabs-top .tab-item.activated .badge { top: 4%; } .tabs-striped.tabs-dark .tabs { background-color: #444; } .tabs-striped.tabs-dark .tab-item { color: rgba(255, 255, 255, 0.4); opacity: 1; } .tabs-striped.tabs-dark .tab-item .badge { opacity: 0.4; } .tabs-striped.tabs-dark .tab-item.tab-item-active, .tabs-striped.tabs-dark .tab-item.active, .tabs-striped.tabs-dark .tab-item.activated { margin-top: -2px; color: #fff; border-style: solid; border-width: 2px 0 0 0; border-color: #fff; } .tabs-striped.tabs-top .tab-item.tab-item-active .badge, .tabs-striped.tabs-top .tab-item.active .badge, .tabs-striped.tabs-top .tab-item.activated .badge { top: 4%; } .tabs-striped.tabs-background-light .tabs { background-color: #fff; background-image: none; } .tabs-striped.tabs-background-stable .tabs { background-color: #f8f8f8; background-image: none; } .tabs-striped.tabs-background-positive .tabs { background-color: #494949; background-image: none; } .tabs-striped.tabs-background-calm .tabs { background-color: #11c1f3; background-image: none; } .tabs-striped.tabs-background-assertive .tabs { background-color: #ef473a; background-image: none; } .tabs-striped.tabs-background-balanced .tabs { background-color: #33cd5f; background-image: none; } .tabs-striped.tabs-background-energized .tabs { background-color: #ffc900; background-image: none; } .tabs-striped.tabs-background-royal .tabs { background-color: #fab915; background-image: none; } .tabs-striped.tabs-background-dark .tabs { background-color: #444; background-image: none; } .tabs-striped.tabs-color-light .tab-item { color: rgba(255, 255, 255, 0.4); opacity: 1; } .tabs-striped.tabs-color-light .tab-item .badge { opacity: 0.4; } .tabs-striped.tabs-color-light .tab-item.tab-item-active, .tabs-striped.tabs-color-light .tab-item.active, .tabs-striped.tabs-color-light .tab-item.activated { margin-top: -2px; color: #fff; border: 0 solid #fff; border-top-width: 2px; } .tabs-striped.tabs-color-light .tab-item.tab-item-active .badge, .tabs-striped.tabs-color-light .tab-item.active .badge, .tabs-striped.tabs-color-light .tab-item.activated .badge { top: 2px; opacity: 1; } .tabs-striped.tabs-color-stable .tab-item { color: rgba(248, 248, 248, 0.4); opacity: 1; } .tabs-striped.tabs-color-stable .tab-item .badge { opacity: 0.4; } .tabs-striped.tabs-color-stable .tab-item.tab-item-active, .tabs-striped.tabs-color-stable .tab-item.active, .tabs-striped.tabs-color-stable .tab-item.activated { margin-top: -2px; color: #f8f8f8; border: 0 solid #f8f8f8; border-top-width: 2px; } .tabs-striped.tabs-color-stable .tab-item.tab-item-active .badge, .tabs-striped.tabs-color-stable .tab-item.active .badge, .tabs-striped.tabs-color-stable .tab-item.activated .badge { top: 2px; opacity: 1; } .tabs-striped.tabs-color-positive .tab-item { color: rgba(73, 73, 73, 0.4); opacity: 1; } .tabs-striped.tabs-color-positive .tab-item .badge { opacity: 0.4; } .tabs-striped.tabs-color-positive .tab-item.tab-item-active, .tabs-striped.tabs-color-positive .tab-item.active, .tabs-striped.tabs-color-positive .tab-item.activated { margin-top: -2px; color: #494949; border: 0 solid #494949; border-top-width: 2px; } .tabs-striped.tabs-color-positive .tab-item.tab-item-active .badge, .tabs-striped.tabs-color-positive .tab-item.active .badge, .tabs-striped.tabs-color-positive .tab-item.activated .badge { top: 2px; opacity: 1; } .tabs-striped.tabs-color-calm .tab-item { color: rgba(17, 193, 243, 0.4); opacity: 1; } .tabs-striped.tabs-color-calm .tab-item .badge { opacity: 0.4; } .tabs-striped.tabs-color-calm .tab-item.tab-item-active, .tabs-striped.tabs-color-calm .tab-item.active, .tabs-striped.tabs-color-calm .tab-item.activated { margin-top: -2px; color: #11c1f3; border: 0 solid #11c1f3; border-top-width: 2px; } .tabs-striped.tabs-color-calm .tab-item.tab-item-active .badge, .tabs-striped.tabs-color-calm .tab-item.active .badge, .tabs-striped.tabs-color-calm .tab-item.activated .badge { top: 2px; opacity: 1; } .tabs-striped.tabs-color-assertive .tab-item { color: rgba(239, 71, 58, 0.4); opacity: 1; } .tabs-striped.tabs-color-assertive .tab-item .badge { opacity: 0.4; } .tabs-striped.tabs-color-assertive .tab-item.tab-item-active, .tabs-striped.tabs-color-assertive .tab-item.active, .tabs-striped.tabs-color-assertive .tab-item.activated { margin-top: -2px; color: #ef473a; border: 0 solid #ef473a; border-top-width: 2px; } .tabs-striped.tabs-color-assertive .tab-item.tab-item-active .badge, .tabs-striped.tabs-color-assertive .tab-item.active .badge, .tabs-striped.tabs-color-assertive .tab-item.activated .badge { top: 2px; opacity: 1; } .tabs-striped.tabs-color-balanced .tab-item { color: rgba(51, 205, 95, 0.4); opacity: 1; } .tabs-striped.tabs-color-balanced .tab-item .badge { opacity: 0.4; } .tabs-striped.tabs-color-balanced .tab-item.tab-item-active, .tabs-striped.tabs-color-balanced .tab-item.active, .tabs-striped.tabs-color-balanced .tab-item.activated { margin-top: -2px; color: #33cd5f; border: 0 solid #33cd5f; border-top-width: 2px; } .tabs-striped.tabs-color-balanced .tab-item.tab-item-active .badge, .tabs-striped.tabs-color-balanced .tab-item.active .badge, .tabs-striped.tabs-color-balanced .tab-item.activated .badge { top: 2px; opacity: 1; } .tabs-striped.tabs-color-energized .tab-item { color: rgba(255, 201, 0, 0.4); opacity: 1; } .tabs-striped.tabs-color-energized .tab-item .badge { opacity: 0.4; } .tabs-striped.tabs-color-energized .tab-item.tab-item-active, .tabs-striped.tabs-color-energized .tab-item.active, .tabs-striped.tabs-color-energized .tab-item.activated { margin-top: -2px; color: #ffc900; border: 0 solid #ffc900; border-top-width: 2px; } .tabs-striped.tabs-color-energized .tab-item.tab-item-active .badge, .tabs-striped.tabs-color-energized .tab-item.active .badge, .tabs-striped.tabs-color-energized .tab-item.activated .badge { top: 2px; opacity: 1; } .tabs-striped.tabs-color-royal .tab-item { color: rgba(250, 185, 21, 0.4); opacity: 1; } .tabs-striped.tabs-color-royal .tab-item .badge { opacity: 0.4; } .tabs-striped.tabs-color-royal .tab-item.tab-item-active, .tabs-striped.tabs-color-royal .tab-item.active, .tabs-striped.tabs-color-royal .tab-item.activated { margin-top: -2px; color: #fab915; border: 0 solid #fab915; border-top-width: 2px; } .tabs-striped.tabs-color-royal .tab-item.tab-item-active .badge, .tabs-striped.tabs-color-royal .tab-item.active .badge, .tabs-striped.tabs-color-royal .tab-item.activated .badge { top: 2px; opacity: 1; } .tabs-striped.tabs-color-dark .tab-item { color: rgba(68, 68, 68, 0.4); opacity: 1; } .tabs-striped.tabs-color-dark .tab-item .badge { opacity: 0.4; } .tabs-striped.tabs-color-dark .tab-item.tab-item-active, .tabs-striped.tabs-color-dark .tab-item.active, .tabs-striped.tabs-color-dark .tab-item.activated { margin-top: -2px; color: #444; border: 0 solid #444; border-top-width: 2px; } .tabs-striped.tabs-color-dark .tab-item.tab-item-active .badge, .tabs-striped.tabs-color-dark .tab-item.active .badge, .tabs-striped.tabs-color-dark .tab-item.activated .badge { top: 2px; opacity: 1; } .tabs-background-light .tabs, .tabs-background-light > .tabs { background-color: #fff; background-image: linear-gradient(0deg, #ddd, #ddd 50%, transparent 50%); border-color: #ddd; } .tabs-background-stable .tabs, .tabs-background-stable > .tabs { background-color: #f8f8f8; background-image: linear-gradient(0deg, #b2b2b2, #b2b2b2 50%, transparent 50%); border-color: #b2b2b2; } .tabs-background-positive .tabs, .tabs-background-positive > .tabs { background-color: #494949; background-image: linear-gradient(0deg, #303030, #303030 50%, transparent 50%); border-color: #303030; } .tabs-background-calm .tabs, .tabs-background-calm > .tabs { background-color: #11c1f3; background-image: linear-gradient(0deg, #0a9dc7, #0a9dc7 50%, transparent 50%); border-color: #0a9dc7; } .tabs-background-assertive .tabs, .tabs-background-assertive > .tabs { background-color: #ef473a; background-image: linear-gradient(0deg, #e42112, #e42112 50%, transparent 50%); border-color: #e42112; } .tabs-background-balanced .tabs, .tabs-background-balanced > .tabs { background-color: #33cd5f; background-image: linear-gradient(0deg, #28a54c, #28a54c 50%, transparent 50%); border-color: #28a54c; } .tabs-background-energized .tabs, .tabs-background-energized > .tabs { background-color: #ffc900; background-image: linear-gradient(0deg, #e6b500, #e6b500 50%, transparent 50%); border-color: #e6b500; } .tabs-background-royal .tabs, .tabs-background-royal > .tabs { background-color: #fab915; background-image: linear-gradient(0deg, #fab915, #fab915 50%, transparent 50%); border-color: #fab915; } .tabs-background-dark .tabs, .tabs-background-dark > .tabs { background-color: #444; background-image: linear-gradient(0deg, #111, #111 50%, transparent 50%); border-color: #111; } .tabs-color-light .tab-item { color: rgba(255, 255, 255, 0.4); opacity: 1; } .tabs-color-light .tab-item .badge { opacity: 0.4; } .tabs-color-light .tab-item.tab-item-active, .tabs-color-light .tab-item.active, .tabs-color-light .tab-item.activated { color: #fff; border: 0 solid #fff; } .tabs-color-light .tab-item.tab-item-active .badge, .tabs-color-light .tab-item.active .badge, .tabs-color-light .tab-item.activated .badge { opacity: 1; } .tabs-color-stable .tab-item { color: rgba(248, 248, 248, 0.4); opacity: 1; } .tabs-color-stable .tab-item .badge { opacity: 0.4; } .tabs-color-stable .tab-item.tab-item-active, .tabs-color-stable .tab-item.active, .tabs-color-stable .tab-item.activated { color: #f8f8f8; border: 0 solid #f8f8f8; } .tabs-color-stable .tab-item.tab-item-active .badge, .tabs-color-stable .tab-item.active .badge, .tabs-color-stable .tab-item.activated .badge { opacity: 1; } .tabs-color-positive .tab-item { color: rgba(73, 73, 73, 0.4); opacity: 1; } .tabs-color-positive .tab-item .badge { opacity: 0.4; } .tabs-color-positive .tab-item.tab-item-active, .tabs-color-positive .tab-item.active, .tabs-color-positive .tab-item.activated { color: #494949; border: 0 solid #494949; } .tabs-color-positive .tab-item.tab-item-active .badge, .tabs-color-positive .tab-item.active .badge, .tabs-color-positive .tab-item.activated .badge { opacity: 1; } .tabs-color-calm .tab-item { color: rgba(17, 193, 243, 0.4); opacity: 1; } .tabs-color-calm .tab-item .badge { opacity: 0.4; } .tabs-color-calm .tab-item.tab-item-active, .tabs-color-calm .tab-item.active, .tabs-color-calm .tab-item.activated { color: #11c1f3; border: 0 solid #11c1f3; } .tabs-color-calm .tab-item.tab-item-active .badge, .tabs-color-calm .tab-item.active .badge, .tabs-color-calm .tab-item.activated .badge { opacity: 1; } .tabs-color-assertive .tab-item { color: rgba(239, 71, 58, 0.4); opacity: 1; } .tabs-color-assertive .tab-item .badge { opacity: 0.4; } .tabs-color-assertive .tab-item.tab-item-active, .tabs-color-assertive .tab-item.active, .tabs-color-assertive .tab-item.activated { color: #ef473a; border: 0 solid #ef473a; } .tabs-color-assertive .tab-item.tab-item-active .badge, .tabs-color-assertive .tab-item.active .badge, .tabs-color-assertive .tab-item.activated .badge { opacity: 1; } .tabs-color-balanced .tab-item { color: rgba(51, 205, 95, 0.4); opacity: 1; } .tabs-color-balanced .tab-item .badge { opacity: 0.4; } .tabs-color-balanced .tab-item.tab-item-active, .tabs-color-balanced .tab-item.active, .tabs-color-balanced .tab-item.activated { color: #33cd5f; border: 0 solid #33cd5f; } .tabs-color-balanced .tab-item.tab-item-active .badge, .tabs-color-balanced .tab-item.active .badge, .tabs-color-balanced .tab-item.activated .badge { opacity: 1; } .tabs-color-energized .tab-item { color: rgba(255, 201, 0, 0.4); opacity: 1; } .tabs-color-energized .tab-item .badge { opacity: 0.4; } .tabs-color-energized .tab-item.tab-item-active, .tabs-color-energized .tab-item.active, .tabs-color-energized .tab-item.activated { color: #ffc900; border: 0 solid #ffc900; } .tabs-color-energized .tab-item.tab-item-active .badge, .tabs-color-energized .tab-item.active .badge, .tabs-color-energized .tab-item.activated .badge { opacity: 1; } .tabs-color-royal .tab-item { color: rgba(250, 185, 21, 0.4); opacity: 1; } .tabs-color-royal .tab-item .badge { opacity: 0.4; } .tabs-color-royal .tab-item.tab-item-active, .tabs-color-royal .tab-item.active, .tabs-color-royal .tab-item.activated { color: #fab915; border: 0 solid #fab915; } .tabs-color-royal .tab-item.tab-item-active .badge, .tabs-color-royal .tab-item.active .badge, .tabs-color-royal .tab-item.activated .badge { opacity: 1; } .tabs-color-dark .tab-item { color: rgba(68, 68, 68, 0.4); opacity: 1; } .tabs-color-dark .tab-item .badge { opacity: 0.4; } .tabs-color-dark .tab-item.tab-item-active, .tabs-color-dark .tab-item.active, .tabs-color-dark .tab-item.activated { color: #444; border: 0 solid #444; } .tabs-color-dark .tab-item.tab-item-active .badge, .tabs-color-dark .tab-item.active .badge, .tabs-color-dark .tab-item.activated .badge { opacity: 1; } ion-tabs.tabs-color-active-light .tab-item { color: #444; } ion-tabs.tabs-color-active-light .tab-item.tab-item-active, ion-tabs.tabs-color-active-light .tab-item.active, ion-tabs.tabs-color-active-light .tab-item.activated { color: #fff; } ion-tabs.tabs-striped.tabs-color-active-light .tab-item.tab-item-active, ion-tabs.tabs-striped.tabs-color-active-light .tab-item.active, ion-tabs.tabs-striped.tabs-color-active-light .tab-item.activated { border-color: #fff; color: #fff; } ion-tabs.tabs-color-active-stable .tab-item { color: #444; } ion-tabs.tabs-color-active-stable .tab-item.tab-item-active, ion-tabs.tabs-color-active-stable .tab-item.active, ion-tabs.tabs-color-active-stable .tab-item.activated { color: #f8f8f8; } ion-tabs.tabs-striped.tabs-color-active-stable .tab-item.tab-item-active, ion-tabs.tabs-striped.tabs-color-active-stable .tab-item.active, ion-tabs.tabs-striped.tabs-color-active-stable .tab-item.activated { border-color: #f8f8f8; color: #f8f8f8; } ion-tabs.tabs-color-active-positive .tab-item { color: #444; } ion-tabs.tabs-color-active-positive .tab-item.tab-item-active, ion-tabs.tabs-color-active-positive .tab-item.active, ion-tabs.tabs-color-active-positive .tab-item.activated { color: #494949; } ion-tabs.tabs-striped.tabs-color-active-positive .tab-item.tab-item-active, ion-tabs.tabs-striped.tabs-color-active-positive .tab-item.active, ion-tabs.tabs-striped.tabs-color-active-positive .tab-item.activated { border-color: #494949; color: #494949; } ion-tabs.tabs-color-active-calm .tab-item { color: #444; } ion-tabs.tabs-color-active-calm .tab-item.tab-item-active, ion-tabs.tabs-color-active-calm .tab-item.active, ion-tabs.tabs-color-active-calm .tab-item.activated { color: #11c1f3; } ion-tabs.tabs-striped.tabs-color-active-calm .tab-item.tab-item-active, ion-tabs.tabs-striped.tabs-color-active-calm .tab-item.active, ion-tabs.tabs-striped.tabs-color-active-calm .tab-item.activated { border-color: #11c1f3; color: #11c1f3; } ion-tabs.tabs-color-active-assertive .tab-item { color: #444; } ion-tabs.tabs-color-active-assertive .tab-item.tab-item-active, ion-tabs.tabs-color-active-assertive .tab-item.active, ion-tabs.tabs-color-active-assertive .tab-item.activated { color: #ef473a; } ion-tabs.tabs-striped.tabs-color-active-assertive .tab-item.tab-item-active, ion-tabs.tabs-striped.tabs-color-active-assertive .tab-item.active, ion-tabs.tabs-striped.tabs-color-active-assertive .tab-item.activated { border-color: #ef473a; color: #ef473a; } ion-tabs.tabs-color-active-balanced .tab-item { color: #444; } ion-tabs.tabs-color-active-balanced .tab-item.tab-item-active, ion-tabs.tabs-color-active-balanced .tab-item.active, ion-tabs.tabs-color-active-balanced .tab-item.activated { color: #33cd5f; } ion-tabs.tabs-striped.tabs-color-active-balanced .tab-item.tab-item-active, ion-tabs.tabs-striped.tabs-color-active-balanced .tab-item.active, ion-tabs.tabs-striped.tabs-color-active-balanced .tab-item.activated { border-color: #33cd5f; color: #33cd5f; } ion-tabs.tabs-color-active-energized .tab-item { color: #444; } ion-tabs.tabs-color-active-energized .tab-item.tab-item-active, ion-tabs.tabs-color-active-energized .tab-item.active, ion-tabs.tabs-color-active-energized .tab-item.activated { color: #ffc900; } ion-tabs.tabs-striped.tabs-color-active-energized .tab-item.tab-item-active, ion-tabs.tabs-striped.tabs-color-active-energized .tab-item.active, ion-tabs.tabs-striped.tabs-color-active-energized .tab-item.activated { border-color: #ffc900; color: #ffc900; } ion-tabs.tabs-color-active-royal .tab-item { color: #444; } ion-tabs.tabs-color-active-royal .tab-item.tab-item-active, ion-tabs.tabs-color-active-royal .tab-item.active, ion-tabs.tabs-color-active-royal .tab-item.activated { color: #fab915; } ion-tabs.tabs-striped.tabs-color-active-royal .tab-item.tab-item-active, ion-tabs.tabs-striped.tabs-color-active-royal .tab-item.active, ion-tabs.tabs-striped.tabs-color-active-royal .tab-item.activated { border-color: #fab915; color: #fab915; } ion-tabs.tabs-color-active-dark .tab-item { color: #fff; } ion-tabs.tabs-color-active-dark .tab-item.tab-item-active, ion-tabs.tabs-color-active-dark .tab-item.active, ion-tabs.tabs-color-active-dark .tab-item.activated { color: #444; } ion-tabs.tabs-striped.tabs-color-active-dark .tab-item.tab-item-active, ion-tabs.tabs-striped.tabs-color-active-dark .tab-item.active, ion-tabs.tabs-striped.tabs-color-active-dark .tab-item.activated { border-color: #444; color: #444; } .tabs-top.tabs-striped { padding-bottom: 0; } .tabs-top.tabs-striped .tab-item { background: transparent; -webkit-transition: color .1s ease; -moz-transition: color .1s ease; -ms-transition: color .1s ease; -o-transition: color .1s ease; transition: color .1s ease; } .tabs-top.tabs-striped .tab-item.tab-item-active, .tabs-top.tabs-striped .tab-item.active, .tabs-top.tabs-striped .tab-item.activated { margin-top: 1px; border-width: 0px 0px 2px 0px !important; border-style: solid; } .tabs-top.tabs-striped .tab-item.tab-item-active > .badge, .tabs-top.tabs-striped .tab-item.tab-item-active > i, .tabs-top.tabs-striped .tab-item.active > .badge, .tabs-top.tabs-striped .tab-item.active > i, .tabs-top.tabs-striped .tab-item.activated > .badge, .tabs-top.tabs-striped .tab-item.activated > i { margin-top: -1px; } .tabs-top.tabs-striped .tab-item .badge { -webkit-transition: color .2s ease; -moz-transition: color .2s ease; -ms-transition: color .2s ease; -o-transition: color .2s ease; transition: color .2s ease; } .tabs-top.tabs-striped:not(.tabs-icon-left):not(.tabs-icon-top) .tab-item.tab-item-active .tab-title, .tabs-top.tabs-striped:not(.tabs-icon-left):not(.tabs-icon-top) .tab-item.tab-item-active i, .tabs-top.tabs-striped:not(.tabs-icon-left):not(.tabs-icon-top) .tab-item.active .tab-title, .tabs-top.tabs-striped:not(.tabs-icon-left):not(.tabs-icon-top) .tab-item.active i, .tabs-top.tabs-striped:not(.tabs-icon-left):not(.tabs-icon-top) .tab-item.activated .tab-title, .tabs-top.tabs-striped:not(.tabs-icon-left):not(.tabs-icon-top) .tab-item.activated i { display: block; margin-top: -1px; } .tabs-top.tabs-striped.tabs-icon-left .tab-item { margin-top: 1px; } .tabs-top.tabs-striped.tabs-icon-left .tab-item.tab-item-active .tab-title, .tabs-top.tabs-striped.tabs-icon-left .tab-item.tab-item-active i, .tabs-top.tabs-striped.tabs-icon-left .tab-item.active .tab-title, .tabs-top.tabs-striped.tabs-icon-left .tab-item.active i, .tabs-top.tabs-striped.tabs-icon-left .tab-item.activated .tab-title, .tabs-top.tabs-striped.tabs-icon-left .tab-item.activated i { margin-top: -0.1em; } /* Allow parent element to have tabs-top */ /* If you change this, change platform.scss as well */ .tabs-top > .tabs, .tabs.tabs-top { top: 44px; padding-top: 0; background-position: bottom; border-top-width: 0; border-bottom-width: 1px; } .tabs-top > .tabs .tab-item.tab-item-active .badge, .tabs-top > .tabs .tab-item.active .badge, .tabs-top > .tabs .tab-item.activated .badge, .tabs.tabs-top .tab-item.tab-item-active .badge, .tabs.tabs-top .tab-item.active .badge, .tabs.tabs-top .tab-item.activated .badge { top: 4%; } .tabs-top ~ .bar-header { border-bottom-width: 0; } .tab-item { -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -moz-flex: 1; -ms-flex: 1; flex: 1; display: block; overflow: hidden; max-width: 150px; height: 100%; color: inherit; text-align: center; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; font-weight: 400; font-size: 14px; font-family: "Roboto", sans-serif; opacity: 0.7; } .tab-item:hover { cursor: pointer; } .tab-item.tab-hidden { display: none; } .tabs-item-hide > .tabs, .tabs.tabs-item-hide { display: none; } .tabs-icon-top > .tabs .tab-item, .tabs-icon-top.tabs .tab-item, .tabs-icon-bottom > .tabs .tab-item, .tabs-icon-bottom.tabs .tab-item { font-size: 10px; line-height: 14px; } .tab-item .icon { display: block; margin: 0 auto; height: 22px; font-size: 22px; } .tabs-icon-left.tabs .tab-item, .tabs-icon-left > .tabs .tab-item, .tabs-icon-right.tabs .tab-item, .tabs-icon-right > .tabs .tab-item { font-size: 10px; } .tabs-icon-left.tabs .tab-item .icon, .tabs-icon-left.tabs .tab-item .tab-title, .tabs-icon-left > .tabs .tab-item .icon, .tabs-icon-left > .tabs .tab-item .tab-title, .tabs-icon-right.tabs .tab-item .icon, .tabs-icon-right.tabs .tab-item .tab-title, .tabs-icon-right > .tabs .tab-item .icon, .tabs-icon-right > .tabs .tab-item .tab-title { display: inline-block; vertical-align: top; margin-top: -.1em; } .tabs-icon-left.tabs .tab-item .icon:before, .tabs-icon-left.tabs .tab-item .tab-title:before, .tabs-icon-left > .tabs .tab-item .icon:before, .tabs-icon-left > .tabs .tab-item .tab-title:before, .tabs-icon-right.tabs .tab-item .icon:before, .tabs-icon-right.tabs .tab-item .tab-title:before, .tabs-icon-right > .tabs .tab-item .icon:before, .tabs-icon-right > .tabs .tab-item .tab-title:before { font-size: 14px; line-height: 49px; } .tabs-icon-left > .tabs .tab-item .icon, .tabs-icon-left.tabs .tab-item .icon { padding-right: 3px; } .tabs-icon-right > .tabs .tab-item .icon, .tabs-icon-right.tabs .tab-item .icon { padding-left: 3px; } .tabs-icon-only > .tabs .icon, .tabs-icon-only.tabs .icon { line-height: inherit; } .tab-item.has-badge { position: relative; } .tab-item .badge { position: absolute; top: 4%; right: 33%; right: calc(50% - 26px); padding: 1px 6px; height: auto; font-size: 12px; line-height: 16px; } /* Navigational tab */ /* Active state for tab */ .tab-item.tab-item-active, .tab-item.active, .tab-item.activated { opacity: 1; } .tab-item.tab-item-active.tab-item-light, .tab-item.active.tab-item-light, .tab-item.activated.tab-item-light { color: #fff; } .tab-item.tab-item-active.tab-item-stable, .tab-item.active.tab-item-stable, .tab-item.activated.tab-item-stable { color: #f8f8f8; } .tab-item.tab-item-active.tab-item-positive, .tab-item.active.tab-item-positive, .tab-item.activated.tab-item-positive { color: #494949; } .tab-item.tab-item-active.tab-item-calm, .tab-item.active.tab-item-calm, .tab-item.activated.tab-item-calm { color: #11c1f3; } .tab-item.tab-item-active.tab-item-assertive, .tab-item.active.tab-item-assertive, .tab-item.activated.tab-item-assertive { color: #ef473a; } .tab-item.tab-item-active.tab-item-balanced, .tab-item.active.tab-item-balanced, .tab-item.activated.tab-item-balanced { color: #33cd5f; } .tab-item.tab-item-active.tab-item-energized, .tab-item.active.tab-item-energized, .tab-item.activated.tab-item-energized { color: #ffc900; } .tab-item.tab-item-active.tab-item-royal, .tab-item.active.tab-item-royal, .tab-item.activated.tab-item-royal { color: #fab915; } .tab-item.tab-item-active.tab-item-dark, .tab-item.active.tab-item-dark, .tab-item.activated.tab-item-dark { color: #444; } .item.tabs { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -moz-flex; display: -ms-flexbox; display: flex; padding: 0; } .item.tabs .icon:before { position: relative; } .tab-item.disabled, .tab-item[disabled] { opacity: .4; cursor: default; pointer-events: none; } .nav-bar-tabs-top.hide ~ .view-container .tabs-top .tabs { top: 0; } .pane[hide-nav-bar="true"] .has-tabs-top { top: 49px; } /** * Menus * -------------------------------------------------- * Side panel structure */ .menu { position: absolute; top: 0; bottom: 0; z-index: 0; overflow: hidden; min-height: 100%; max-height: 100%; width: 275px; background-color: #fff; } .menu .scroll-content { z-index: 10; } .menu .bar-header { z-index: 11; } .menu-content { -webkit-transform: none; transform: none; box-shadow: -1px 0px 2px rgba(0, 0, 0, 0.2), 1px 0px 2px rgba(0, 0, 0, 0.2); } .menu-open .menu-content .pane, .menu-open .menu-content .scroll-content { pointer-events: none; } .menu-open .menu-content .scroll-content .scroll { pointer-events: none; } .menu-open .menu-content .scroll-content:not(.overflow-scroll) { overflow: hidden; } .grade-b .menu-content, .grade-c .menu-content { -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; right: -1px; left: -1px; border-right: 1px solid #ccc; border-left: 1px solid #ccc; box-shadow: none; } .menu-left { left: 0; } .menu-right { right: 0; } .aside-open.aside-resizing .menu-right { display: none; } .menu-animated { -webkit-transition: -webkit-transform 200ms ease; transition: transform 200ms ease; } /** * Modals * -------------------------------------------------- * Modals are independent windows that slide in from off-screen. */ .modal-backdrop, .modal-backdrop-bg { position: fixed; top: 0; left: 0; z-index: 10; width: 100%; height: 100%; } .modal-backdrop-bg { pointer-events: none; } .modal { display: block; position: absolute; top: 0; z-index: 10; overflow: hidden; min-height: 100%; width: 100%; background-color: #fff; } @media (min-width: 680px) { .modal { top: 20%; right: 20%; bottom: 20%; left: 20%; min-height: 240px; width: 60%; } .modal.ng-leave-active { bottom: 0; } .platform-ios.platform-cordova .modal-wrapper .modal .bar-header:not(.bar-subheader) { height: 44px; } .platform-ios.platform-cordova .modal-wrapper .modal .bar-header:not(.bar-subheader) > * { margin-top: 0; } .platform-ios.platform-cordova .modal-wrapper .modal .tabs-top > .tabs, .platform-ios.platform-cordova .modal-wrapper .modal .tabs.tabs-top { top: 44px; } .platform-ios.platform-cordova .modal-wrapper .modal .has-header, .platform-ios.platform-cordova .modal-wrapper .modal .bar-subheader { top: 44px; } .platform-ios.platform-cordova .modal-wrapper .modal .has-subheader { top: 88px; } .platform-ios.platform-cordova .modal-wrapper .modal .has-header.has-tabs-top { top: 93px; } .platform-ios.platform-cordova .modal-wrapper .modal .has-header.has-subheader.has-tabs-top { top: 137px; } .modal-backdrop-bg { -webkit-transition: opacity 300ms ease-in-out; transition: opacity 300ms ease-in-out; background-color: #000; opacity: 0; } .active .modal-backdrop-bg { opacity: 0.5; } } .modal-open { pointer-events: none; } .modal-open .modal, .modal-open .modal-backdrop { pointer-events: auto; } .modal-open.loading-active .modal, .modal-open.loading-active .modal-backdrop { pointer-events: none; } /** * Popovers * -------------------------------------------------- * Popovers are independent views which float over content */ .popover-backdrop { position: fixed; top: 0; left: 0; z-index: 10; width: 100%; height: 100%; background-color: transparent; } .popover-backdrop.active { background-color: rgba(0, 0, 0, 0.1); } .popover { position: absolute; top: 25%; left: 50%; z-index: 10; display: block; margin-top: 12px; margin-left: -110px; height: 280px; width: 220px; background-color: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4); opacity: 0; } .popover .item:first-child { border-top: 0; } .popover .item:last-child { border-bottom: 0; } .popover.popover-bottom { margin-top: -12px; } .popover, .popover .bar-header { border-radius: 2px; } .popover .scroll-content { z-index: 1; margin: 2px 0; } .popover .bar-header { border-bottom-right-radius: 0; border-bottom-left-radius: 0; } .popover .has-header { border-top-right-radius: 0; border-top-left-radius: 0; } .popover-arrow { display: none; } .platform-ios .popover { box-shadow: 0 0 40px rgba(0, 0, 0, 0.08); border-radius: 10px; } .platform-ios .popover .bar-header { -webkit-border-top-right-radius: 10px; border-top-right-radius: 10px; -webkit-border-top-left-radius: 10px; border-top-left-radius: 10px; } .platform-ios .popover .scroll-content { margin: 8px 0; border-radius: 10px; } .platform-ios .popover .scroll-content.has-header { margin-top: 0; } .platform-ios .popover-arrow { position: absolute; display: block; top: -17px; width: 30px; height: 19px; overflow: hidden; } .platform-ios .popover-arrow:after { position: absolute; top: 12px; left: 5px; width: 20px; height: 20px; background-color: #fff; border-radius: 3px; content: ''; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); } .platform-ios .popover-bottom .popover-arrow { top: auto; bottom: -10px; } .platform-ios .popover-bottom .popover-arrow:after { top: -6px; } .platform-android .popover { margin-top: -32px; background-color: #fafafa; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.35); } .platform-android .popover .item { border-color: #fafafa; background-color: #fafafa; color: #4d4d4d; } .platform-android .popover.popover-bottom { margin-top: 32px; } .platform-android .popover-backdrop, .platform-android .popover-backdrop.active { background-color: transparent; } .popover-open { pointer-events: none; } .popover-open .popover, .popover-open .popover-backdrop { pointer-events: auto; } .popover-open.loading-active .popover, .popover-open.loading-active .popover-backdrop { pointer-events: none; } @media (min-width: 680px) { .popover { width: 360px; margin-left: -180px; } } /** * Popups * -------------------------------------------------- */ .popup-container { position: absolute; top: 0; left: 0; bottom: 0; right: 0; background: transparent; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; z-index: 12; visibility: hidden; } .popup-container.popup-showing { visibility: visible; } .popup-container.popup-hidden .popup { -webkit-animation-name: scaleOut; animation-name: scaleOut; -webkit-animation-duration: 0.1s; animation-duration: 0.1s; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-fill-mode: both; animation-fill-mode: both; } .popup-container.active .popup { -webkit-animation-name: superScaleIn; animation-name: superScaleIn; -webkit-animation-duration: 0.2s; animation-duration: 0.2s; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-fill-mode: both; animation-fill-mode: both; } .popup-container .popup { width: 250px; max-width: 100%; max-height: 90%; border-radius: 0px; background-color: rgba(255, 255, 255, 0.9); display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } .popup-container input, .popup-container textarea { width: 100%; } .popup-head { padding: 15px 10px; border-bottom: 1px solid #eee; text-align: center; } .popup-title { margin: 0; padding: 0; font-size: 15px; } .popup-sub-title { margin: 5px 0 0 0; padding: 0; font-weight: normal; font-size: 11px; } .popup-body { padding: 10px; overflow: auto; } .popup-buttons { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-direction: normal; -webkit-box-orient: horizontal; -webkit-flex-direction: row; -moz-flex-direction: row; -ms-flex-direction: row; flex-direction: row; padding: 10px; min-height: 65px; } .popup-buttons .button { -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -moz-flex: 1; -ms-flex: 1; flex: 1; display: block; min-height: 45px; border-radius: 2px; line-height: 20px; margin-right: 5px; } .popup-buttons .button:last-child { margin-right: 0px; } .popup-open { pointer-events: none; } .popup-open.modal-open .modal { pointer-events: none; } .popup-open .popup-backdrop, .popup-open .popup { pointer-events: auto; } /** * Loading * -------------------------------------------------- */ .loading-container { position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: 13; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; -webkit-transition: 0.2s opacity linear; transition: 0.2s opacity linear; visibility: hidden; opacity: 0; } .loading-container:not(.visible) .icon, .loading-container:not(.visible) .spinner { display: none; } .loading-container.visible { visibility: visible; } .loading-container.active { opacity: 1; } .loading-container .loading { padding: 20px; border-radius: 5px; background-color: rgba(0, 0, 0, 0.7); color: #fff; text-align: center; text-overflow: ellipsis; font-size: 15px; } .loading-container .loading h1, .loading-container .loading h2, .loading-container .loading h3, .loading-container .loading h4, .loading-container .loading h5, .loading-container .loading h6 { color: #fff; } /** * Items * -------------------------------------------------- */ .item { border-color: #f2f2f2; background-color: #ffffff; color: #445; position: relative; z-index: 2; display: block; margin: -1px; padding: 16px; border-width: 1px; border-style: solid; font-size: 16px; } .item h2 { margin: 0 0 2px 0; font-size: 16px; font-weight: normal; } .item h3 { margin: 0 0 4px 0; font-size: 14px; } .item h4 { margin: 0 0 4px 0; font-size: 12px; } .item h5, .item h6 { margin: 0 0 3px 0; font-size: 10px; } .item p { color: #666; font-size: 14px; margin-bottom: 2px; } .item h1:last-child, .item h2:last-child, .item h3:last-child, .item h4:last-child, .item h5:last-child, .item h6:last-child, .item p:last-child { margin-bottom: 0; } .item .badge { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -moz-flex; display: -ms-flexbox; display: flex; position: absolute; top: 16px; right: 32px; } .item.item-button-right .badge { right: 67px; } .item.item-divider .badge { top: 8px; } .item .badge + .badge { margin-right: 5px; } .item.item-light { border-color: #ddd; background-color: #fff; color: #444; } .item.item-stable { border-color: #b2b2b2; background-color: #f8f8f8; color: #444; } .item.item-positive { border-color: #303030; background-color: #494949; color: #fff; } .item.item-calm { border-color: #0a9dc7; background-color: #11c1f3; color: #fff; } .item.item-assertive { border-color: #e42112; background-color: #ef473a; color: #fff; } .item.item-balanced { border-color: #28a54c; background-color: #33cd5f; color: #fff; } .item.item-energized { border-color: #e6b500; background-color: #ffc900; color: #fff; } .item.item-royal { border-color: #e1a305; background-color: #fab915; color: #fff; } .item.item-dark { border-color: #111; background-color: #444; color: #fff; } .item[ng-click]:hover { cursor: pointer; } .list-borderless .item, .item-borderless { border-width: 0; } .item.active, .item.activated, .item-complex.active .item-content, .item-complex.activated .item-content, .item .item-content.active, .item .item-content.activated { border-color: #e0e0e0; background-color: #f2f2f2; } .item.active.item-complex > .item-content, .item.activated.item-complex > .item-content, .item-complex.active .item-content.item-complex > .item-content, .item-complex.activated .item-content.item-complex > .item-content, .item .item-content.active.item-complex > .item-content, .item .item-content.activated.item-complex > .item-content { border-color: #e0e0e0; background-color: #f2f2f2; } .item.active.item-light, .item.activated.item-light, .item-complex.active .item-content.item-light, .item-complex.activated .item-content.item-light, .item .item-content.active.item-light, .item .item-content.activated.item-light { border-color: #ccc; background-color: #fafafa; } .item.active.item-light.item-complex > .item-content, .item.activated.item-light.item-complex > .item-content, .item-complex.active .item-content.item-light.item-complex > .item-content, .item-complex.activated .item-content.item-light.item-complex > .item-content, .item .item-content.active.item-light.item-complex > .item-content, .item .item-content.activated.item-light.item-complex > .item-content { border-color: #ccc; background-color: #fafafa; } .item.active.item-stable, .item.activated.item-stable, .item-complex.active .item-content.item-stable, .item-complex.activated .item-content.item-stable, .item .item-content.active.item-stable, .item .item-content.activated.item-stable { border-color: #a2a2a2; background-color: #e5e5e5; } .item.active.item-stable.item-complex > .item-content, .item.activated.item-stable.item-complex > .item-content, .item-complex.active .item-content.item-stable.item-complex > .item-content, .item-complex.activated .item-content.item-stable.item-complex > .item-content, .item .item-content.active.item-stable.item-complex > .item-content, .item .item-content.activated.item-stable.item-complex > .item-content { border-color: #a2a2a2; background-color: #e5e5e5; } .item.active.item-positive, .item.activated.item-positive, .item-complex.active .item-content.item-positive, .item-complex.activated .item-content.item-positive, .item .item-content.active.item-positive, .item .item-content.activated.item-positive { border-color: #303030; background-color: #303030; } .item.active.item-positive.item-complex > .item-content, .item.activated.item-positive.item-complex > .item-content, .item-complex.active .item-content.item-positive.item-complex > .item-content, .item-complex.activated .item-content.item-positive.item-complex > .item-content, .item .item-content.active.item-positive.item-complex > .item-content, .item .item-content.activated.item-positive.item-complex > .item-content { border-color: #303030; background-color: #303030; } .item.active.item-calm, .item.activated.item-calm, .item-complex.active .item-content.item-calm, .item-complex.activated .item-content.item-calm, .item .item-content.active.item-calm, .item .item-content.activated.item-calm { border-color: #0a9dc7; background-color: #0a9dc7; } .item.active.item-calm.item-complex > .item-content, .item.activated.item-calm.item-complex > .item-content, .item-complex.active .item-content.item-calm.item-complex > .item-content, .item-complex.activated .item-content.item-calm.item-complex > .item-content, .item .item-content.active.item-calm.item-complex > .item-content, .item .item-content.activated.item-calm.item-complex > .item-content { border-color: #0a9dc7; background-color: #0a9dc7; } .item.active.item-assertive, .item.activated.item-assertive, .item-complex.active .item-content.item-assertive, .item-complex.activated .item-content.item-assertive, .item .item-content.active.item-assertive, .item .item-content.activated.item-assertive { border-color: #e42112; background-color: #e42112; } .item.active.item-assertive.item-complex > .item-content, .item.activated.item-assertive.item-complex > .item-content, .item-complex.active .item-content.item-assertive.item-complex > .item-content, .item-complex.activated .item-content.item-assertive.item-complex > .item-content, .item .item-content.active.item-assertive.item-complex > .item-content, .item .item-content.activated.item-assertive.item-complex > .item-content { border-color: #e42112; background-color: #e42112; } .item.active.item-balanced, .item.activated.item-balanced, .item-complex.active .item-content.item-balanced, .item-complex.activated .item-content.item-balanced, .item .item-content.active.item-balanced, .item .item-content.activated.item-balanced { border-color: #28a54c; background-color: #28a54c; } .item.active.item-balanced.item-complex > .item-content, .item.activated.item-balanced.item-complex > .item-content, .item-complex.active .item-content.item-balanced.item-complex > .item-content, .item-complex.activated .item-content.item-balanced.item-complex > .item-content, .item .item-content.active.item-balanced.item-complex > .item-content, .item .item-content.activated.item-balanced.item-complex > .item-content { border-color: #28a54c; background-color: #28a54c; } .item.active.item-energized, .item.activated.item-energized, .item-complex.active .item-content.item-energized, .item-complex.activated .item-content.item-energized, .item .item-content.active.item-energized, .item .item-content.activated.item-energized { border-color: #e6b500; background-color: #e6b500; } .item.active.item-energized.item-complex > .item-content, .item.activated.item-energized.item-complex > .item-content, .item-complex.active .item-content.item-energized.item-complex > .item-content, .item-complex.activated .item-content.item-energized.item-complex > .item-content, .item .item-content.active.item-energized.item-complex > .item-content, .item .item-content.activated.item-energized.item-complex > .item-content { border-color: #e6b500; background-color: #e6b500; } .item.active.item-royal, .item.activated.item-royal, .item-complex.active .item-content.item-royal, .item-complex.activated .item-content.item-royal, .item .item-content.active.item-royal, .item .item-content.activated.item-royal { border-color: #e1a305; background-color: #e1a305; } .item.active.item-royal.item-complex > .item-content, .item.activated.item-royal.item-complex > .item-content, .item-complex.active .item-content.item-royal.item-complex > .item-content, .item-complex.activated .item-content.item-royal.item-complex > .item-content, .item .item-content.active.item-royal.item-complex > .item-content, .item .item-content.activated.item-royal.item-complex > .item-content { border-color: #e1a305; background-color: #e1a305; } .item.active.item-dark, .item.activated.item-dark, .item-complex.active .item-content.item-dark, .item-complex.activated .item-content.item-dark, .item .item-content.active.item-dark, .item .item-content.activated.item-dark { border-color: #000; background-color: #262626; } .item.active.item-dark.item-complex > .item-content, .item.activated.item-dark.item-complex > .item-content, .item-complex.active .item-content.item-dark.item-complex > .item-content, .item-complex.activated .item-content.item-dark.item-complex > .item-content, .item .item-content.active.item-dark.item-complex > .item-content, .item .item-content.activated.item-dark.item-complex > .item-content { border-color: #000; background-color: #262626; } .item, .item h1, .item h2, .item h3, .item h4, .item h5, .item h6, .item p, .item-content, .item-content h1, .item-content h2, .item-content h3, .item-content h4, .item-content h5, .item-content h6, .item-content p { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } a.item { color: inherit; text-decoration: none; } a.item:hover, a.item:focus { text-decoration: none; } /** * Complex Items * -------------------------------------------------- * Adding .item-complex allows the .item to be slidable and * have options underneath the button, but also requires an * additional .item-content element inside .item. * Basically .item-complex removes any default settings which * .item added, so that .item-content looks them as just .item. */ .item-complex, a.item.item-complex, button.item.item-complex { padding: 0; } .item-complex .item-content, .item-radio .item-content { position: relative; z-index: 2; padding: 16px 49px 16px 16px; border: none; background-color: #ffffff; } a.item-content { display: block; color: inherit; text-decoration: none; } .item-text-wrap .item, .item-text-wrap .item-content, .item-text-wrap, .item-text-wrap h1, .item-text-wrap h2, .item-text-wrap h3, .item-text-wrap h4, .item-text-wrap h5, .item-text-wrap h6, .item-text-wrap p, .item-complex.item-text-wrap .item-content, .item-body h1, .item-body h2, .item-body h3, .item-body h4, .item-body h5, .item-body h6, .item-body p { overflow: visible; white-space: normal; } .item-complex.item-text-wrap, .item-complex.item-text-wrap h1, .item-complex.item-text-wrap h2, .item-complex.item-text-wrap h3, .item-complex.item-text-wrap h4, .item-complex.item-text-wrap h5, .item-complex.item-text-wrap h6, .item-complex.item-text-wrap p { overflow: visible; white-space: normal; } .item-complex.item-light > .item-content { border-color: #ddd; background-color: #fff; color: #444; } .item-complex.item-light > .item-content.active, .item-complex.item-light > .item-content:active { border-color: #ccc; background-color: #fafafa; } .item-complex.item-light > .item-content.active.item-complex > .item-content, .item-complex.item-light > .item-content:active.item-complex > .item-content { border-color: #ccc; background-color: #fafafa; } .item-complex.item-stable > .item-content { border-color: #b2b2b2; background-color: #f8f8f8; color: #444; } .item-complex.item-stable > .item-content.active, .item-complex.item-stable > .item-content:active { border-color: #a2a2a2; background-color: #e5e5e5; } .item-complex.item-stable > .item-content.active.item-complex > .item-content, .item-complex.item-stable > .item-content:active.item-complex > .item-content { border-color: #a2a2a2; background-color: #e5e5e5; } .item-complex.item-positive > .item-content { border-color: #303030; background-color: #494949; color: #fff; } .item-complex.item-positive > .item-content.active, .item-complex.item-positive > .item-content:active { border-color: #303030; background-color: #303030; } .item-complex.item-positive > .item-content.active.item-complex > .item-content, .item-complex.item-positive > .item-content:active.item-complex > .item-content { border-color: #303030; background-color: #303030; } .item-complex.item-calm > .item-content { border-color: #0a9dc7; background-color: #11c1f3; color: #fff; } .item-complex.item-calm > .item-content.active, .item-complex.item-calm > .item-content:active { border-color: #0a9dc7; background-color: #0a9dc7; } .item-complex.item-calm > .item-content.active.item-complex > .item-content, .item-complex.item-calm > .item-content:active.item-complex > .item-content { border-color: #0a9dc7; background-color: #0a9dc7; } .item-complex.item-assertive > .item-content { border-color: #e42112; background-color: #ef473a; color: #fff; } .item-complex.item-assertive > .item-content.active, .item-complex.item-assertive > .item-content:active { border-color: #e42112; background-color: #e42112; } .item-complex.item-assertive > .item-content.active.item-complex > .item-content, .item-complex.item-assertive > .item-content:active.item-complex > .item-content { border-color: #e42112; background-color: #e42112; } .item-complex.item-balanced > .item-content { border-color: #28a54c; background-color: #33cd5f; color: #fff; } .item-complex.item-balanced > .item-content.active, .item-complex.item-balanced > .item-content:active { border-color: #28a54c; background-color: #28a54c; } .item-complex.item-balanced > .item-content.active.item-complex > .item-content, .item-complex.item-balanced > .item-content:active.item-complex > .item-content { border-color: #28a54c; background-color: #28a54c; } .item-complex.item-energized > .item-content { border-color: #e6b500; background-color: #ffc900; color: #fff; } .item-complex.item-energized > .item-content.active, .item-complex.item-energized > .item-content:active { border-color: #e6b500; background-color: #e6b500; } .item-complex.item-energized > .item-content.active.item-complex > .item-content, .item-complex.item-energized > .item-content:active.item-complex > .item-content { border-color: #e6b500; background-color: #e6b500; } .item-complex.item-royal > .item-content { border-color: #e1a305; background-color: #fab915; color: #fff; } .item-complex.item-royal > .item-content.active, .item-complex.item-royal > .item-content:active { border-color: #e1a305; background-color: #e1a305; } .item-complex.item-royal > .item-content.active.item-complex > .item-content, .item-complex.item-royal > .item-content:active.item-complex > .item-content { border-color: #e1a305; background-color: #e1a305; } .item-complex.item-dark > .item-content { border-color: #111; background-color: #444; color: #fff; } .item-complex.item-dark > .item-content.active, .item-complex.item-dark > .item-content:active { border-color: #000; background-color: #262626; } .item-complex.item-dark > .item-content.active.item-complex > .item-content, .item-complex.item-dark > .item-content:active.item-complex > .item-content { border-color: #000; background-color: #262626; } /** * Item Icons * -------------------------------------------------- */ .item-icon-left .icon, .item-icon-right .icon { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; position: absolute; top: 0; height: 100%; font-size: 24px; } .item-icon-left .icon:before, .item-icon-right .icon:before { display: block; width: 24px; text-align: center; } .item .fill-icon { min-width: 30px; min-height: 30px; font-size: 28px; } .item-icon-left { padding-left: 54px; } .item-icon-left .icon { left: 11px; } .item-complex.item-icon-left { padding-left: 0; } .item-complex.item-icon-left .item-content { padding-left: 54px; } .item-icon-right { padding-right: 54px; } .item-icon-right .icon { right: 11px; } .item-complex.item-icon-right { padding-right: 0; } .item-complex.item-icon-right .item-content { padding-right: 54px; } .item-icon-left.item-icon-right .icon:first-child { right: auto; } .item-icon-left.item-icon-right .icon:last-child, .item-icon-left .item-delete .icon { left: auto; } .item-icon-left .icon-accessory, .item-icon-right .icon-accessory { color: #ccc; font-size: 16px; } .item-icon-left .icon-accessory { left: 3px; } .item-icon-right .icon-accessory { right: 3px; } /** * Item Button * -------------------------------------------------- * An item button is a child button inside an .item (not the entire .item) */ .item-button-left { padding-left: 72px; } .item-button-left > .button, .item-button-left .item-content > .button { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; position: absolute; top: 8px; left: 11px; min-width: 26px; min-height: 26px; font-size: 18px; line-height: 32px; } .item-button-left > .button .icon:before, .item-button-left .item-content > .button .icon:before { position: relative; left: auto; width: auto; line-height: 23px; } .item-button-left > .button > .button, .item-button-left .item-content > .button > .button { margin: 0px 2px; min-height: 26px; font-size: 18px; line-height: 32px; } .item-button-right, a.item.item-button-right, button.item.item-button-right { padding-right: 80px; } .item-button-right > .button, .item-button-right .item-content > .button, .item-button-right > .buttons, .item-button-right .item-content > .buttons { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; position: absolute; top: 8px; right: 16px; min-width: 26px; min-height: 26px; font-size: 18px; line-height: 32px; } .item-button-right > .button .icon:before, .item-button-right .item-content > .button .icon:before, .item-button-right > .buttons .icon:before, .item-button-right .item-content > .buttons .icon:before { position: relative; left: auto; width: auto; line-height: 23px; } .item-button-right > .button > .button, .item-button-right .item-content > .button > .button, .item-button-right > .buttons > .button, .item-button-right .item-content > .buttons > .button { margin: 0px 2px; min-width: 26px; min-height: 26px; font-size: 18px; line-height: 32px; } .item-button-left.item-button-right .button:first-child { right: auto; } .item-button-left.item-button-right .button:last-child { left: auto; } .item-avatar, .item-avatar .item-content, .item-avatar-left, .item-avatar-left .item-content { padding-left: 72px; min-height: 72px; } .item-avatar > img:first-child, .item-avatar .item-image, .item-avatar .item-content > img:first-child, .item-avatar .item-content .item-image, .item-avatar-left > img:first-child, .item-avatar-left .item-image, .item-avatar-left .item-content > img:first-child, .item-avatar-left .item-content .item-image { position: absolute; top: 16px; left: 16px; max-width: 40px; max-height: 40px; width: 100%; height: 100%; border-radius: 50%; } .item-avatar-right, .item-avatar-right .item-content { padding-right: 72px; min-height: 72px; } .item-avatar-right > img:first-child, .item-avatar-right .item-image, .item-avatar-right .item-content > img:first-child, .item-avatar-right .item-content .item-image { position: absolute; top: 16px; right: 16px; max-width: 40px; max-height: 40px; width: 100%; height: 100%; border-radius: 50%; } .item-thumbnail-left, .item-thumbnail-left .item-content { padding-top: 8px; padding-left: 106px; min-height: 100px; } .item-thumbnail-left > img:first-child, .item-thumbnail-left .item-image, .item-thumbnail-left .item-content > img:first-child, .item-thumbnail-left .item-content .item-image { position: absolute; top: 10px; left: 10px; max-width: 80px; max-height: 80px; width: 100%; height: 100%; } .item-avatar.item-complex, .item-avatar-left.item-complex, .item-thumbnail-left.item-complex { padding-top: 0; padding-left: 0; } .item-thumbnail-right, .item-thumbnail-right .item-content { padding-top: 8px; padding-right: 106px; min-height: 100px; } .item-thumbnail-right > img:first-child, .item-thumbnail-right .item-image, .item-thumbnail-right .item-content > img:first-child, .item-thumbnail-right .item-content .item-image { position: absolute; top: 10px; right: 10px; max-width: 80px; max-height: 80px; width: 100%; height: 100%; } .item-avatar-right.item-complex, .item-thumbnail-right.item-complex { padding-top: 0; padding-right: 0; } .item-image { padding: 0; text-align: center; } .item-image img:first-child, .item-image .list-img { width: 100%; vertical-align: middle; } .item-body { overflow: auto; padding: 16px; text-overflow: inherit; white-space: normal; } .item-body h1, .item-body h2, .item-body h3, .item-body h4, .item-body h5, .item-body h6, .item-body p { margin-top: 16px; margin-bottom: 16px; } .item-divider { padding-top: 8px; padding-bottom: 8px; min-height: 30px; background-color: #f2f2f2; color: #222; font-weight: 500; } .platform-ios .item-divider-platform, .item-divider-ios { padding-top: 26px; text-transform: uppercase; font-weight: 300; font-size: 13px; background-color: #efeff4; color: #555; } .platform-android .item-divider-platform, .item-divider-android { font-weight: 300; font-size: 13px; } .item-note { float: right; color: #aaa; font-size: 14px; } .item-left-editable .item-content, .item-right-editable .item-content { -webkit-transition-duration: 250ms; transition-duration: 250ms; -webkit-transition-timing-function: ease-in-out; transition-timing-function: ease-in-out; -webkit-transition-property: -webkit-transform; -moz-transition-property: -moz-transform; transition-property: transform; } .list-left-editing .item-left-editable .item-content, .item-left-editing.item-left-editable .item-content { -webkit-transform: translate3d(50px, 0, 0); transform: translate3d(50px, 0, 0); } .item-remove-animate.ng-leave { -webkit-transition-duration: 300ms; transition-duration: 300ms; } .item-remove-animate.ng-leave .item-content, .item-remove-animate.ng-leave:last-of-type { -webkit-transition-duration: 300ms; transition-duration: 300ms; -webkit-transition-timing-function: ease-in; transition-timing-function: ease-in; -webkit-transition-property: all; transition-property: all; } .item-remove-animate.ng-leave.ng-leave-active .item-content { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0) !important; transform: translate3d(-100%, 0, 0) !important; } .item-remove-animate.ng-leave.ng-leave-active:last-of-type { opacity: 0; } .item-remove-animate.ng-leave.ng-leave-active ~ ion-item:not(.ng-leave) { -webkit-transform: translate3d(0, -webkit-calc(-100% + 1px), 0); transform: translate3d(0, calc(-100% + 1px), 0); -webkit-transition-duration: 300ms; transition-duration: 300ms; -webkit-transition-timing-function: cubic-bezier(0.25, 0.81, 0.24, 1); transition-timing-function: cubic-bezier(0.25, 0.81, 0.24, 1); -webkit-transition-property: all; transition-property: all; } .item-left-edit { -webkit-transition: all ease-in-out 125ms; transition: all ease-in-out 125ms; position: absolute; top: 0; left: 0; z-index: 0; width: 50px; height: 100%; line-height: 100%; display: none; opacity: 0; -webkit-transform: translate3d(-21px, 0, 0); transform: translate3d(-21px, 0, 0); } .item-left-edit .button { height: 100%; } .item-left-edit .button.icon { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; position: absolute; top: 0; height: 100%; } .item-left-edit.visible { display: block; } .item-left-edit.visible.active { opacity: 1; -webkit-transform: translate3d(8px, 0, 0); transform: translate3d(8px, 0, 0); } .list-left-editing .item-left-edit { -webkit-transition-delay: 125ms; transition-delay: 125ms; } .item-delete .button.icon { color: #ef473a; font-size: 24px; } .item-delete .button.icon:hover { opacity: .7; } .item-right-edit { -webkit-transition: all ease-in-out 250ms; transition: all ease-in-out 250ms; position: absolute; top: 0; right: 0; z-index: 3; width: 75px; height: 100%; background: inherit; padding-left: 20px; display: block; opacity: 0; -webkit-transform: translate3d(75px, 0, 0); transform: translate3d(75px, 0, 0); } .item-right-edit .button { min-width: 50px; height: 100%; } .item-right-edit .button.icon { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; position: absolute; top: 0; height: 100%; font-size: 32px; } .item-right-edit.visible { display: block; } .item-right-edit.visible.active { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .item-reorder .button.icon { color: #444; font-size: 32px; } .item-reordering { position: absolute; left: 0; top: 0; z-index: 9; width: 100%; box-shadow: 0px 0px 10px 0px #aaa; } .item-reordering .item-reorder { z-index: 9; } .item-placeholder { opacity: 0.7; } /** * The hidden right-side buttons that can be exposed under a list item * with dragging. */ .item-options { position: absolute; top: 0; right: 0; z-index: 1; height: 100%; } .item-options .button { height: 100%; border: none; border-radius: 0; display: -webkit-inline-box; display: -webkit-inline-flex; display: -moz-inline-flex; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; } .item-options .button:before { margin: 0 auto; } .item-options ion-option-button:last-child { padding-right: calc(constant(safe-area-inset-right) + 16px); padding-right: calc(env(safe-area-inset-right) + 16px); } /** * Lists * -------------------------------------------------- */ .list { position: relative; padding-top: 1px; padding-bottom: 1px; padding-left: 0; margin-bottom: 20px; } .list:last-child { margin-bottom: 0px; } .list:last-child.card { margin-bottom: 40px; } /** * List Header * -------------------------------------------------- */ .list-header { margin-top: 20px; padding: 5px 15px; background-color: transparent; color: #222; font-weight: bold; } .card.list .list-item { padding-right: 1px; padding-left: 1px; } /** * Cards and Inset Lists * -------------------------------------------------- * A card and list-inset are close to the same thing, except a card as a box shadow. */ .card, .list-inset { overflow: hidden; margin: 20px 10px; border-radius: 2px; background-color: #fff; } .card { padding-top: 1px; padding-bottom: 1px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25); } .card .item { border-left: 0; border-right: 0; } .card .item:first-child { border-top: 0; } .card .item:last-child { border-bottom: 0; } .padding .card, .padding .list-inset { margin-left: 0; margin-right: 0; } .card .item:first-child, .list-inset .item:first-child, .padding > .list .item:first-child { border-top-left-radius: 2px; border-top-right-radius: 2px; } .card .item:first-child .item-content, .list-inset .item:first-child .item-content, .padding > .list .item:first-child .item-content { border-top-left-radius: 2px; border-top-right-radius: 2px; } .card .item:last-child, .list-inset .item:last-child, .padding > .list .item:last-child { border-bottom-right-radius: 2px; border-bottom-left-radius: 2px; } .card .item:last-child .item-content, .list-inset .item:last-child .item-content, .padding > .list .item:last-child .item-content { border-bottom-right-radius: 2px; border-bottom-left-radius: 2px; } .card .item:last-child, .list-inset .item:last-child { margin-bottom: -1px; } .card .item, .list-inset .item, .padding > .list .item, .padding-horizontal > .list .item { margin-right: 0; margin-left: 0; } .card .item.item-input input, .list-inset .item.item-input input, .padding > .list .item.item-input input, .padding-horizontal > .list .item.item-input input { padding-right: 44px; } .padding-left > .list .item { margin-left: 0; } .padding-right > .list .item { margin-right: 0; } /** * Badges * -------------------------------------------------- */ .badge { background-color: transparent; color: #AAAAAA; z-index: 1; display: inline-block; padding: 3px 8px; min-width: 10px; border-radius: 10px; vertical-align: baseline; text-align: center; white-space: nowrap; font-weight: bold; font-size: 14px; line-height: 16px; } .badge:empty { display: none; } .tabs .tab-item .badge.badge-light, .badge.badge-light { background-color: #fff; color: #444; } .tabs .tab-item .badge.badge-stable, .badge.badge-stable { background-color: #f8f8f8; color: #444; } .tabs .tab-item .badge.badge-positive, .badge.badge-positive { background-color: #494949; color: #fff; } .tabs .tab-item .badge.badge-calm, .badge.badge-calm { background-color: #11c1f3; color: #fff; } .tabs .tab-item .badge.badge-assertive, .badge.badge-assertive { background-color: #ef473a; color: #fff; } .tabs .tab-item .badge.badge-balanced, .badge.badge-balanced { background-color: #33cd5f; color: #fff; } .tabs .tab-item .badge.badge-energized, .badge.badge-energized { background-color: #ffc900; color: #fff; } .tabs .tab-item .badge.badge-royal, .badge.badge-royal { background-color: #fab915; color: #fff; } .tabs .tab-item .badge.badge-dark, .badge.badge-dark { background-color: #444; color: #fff; } .button .badge { position: relative; top: -1px; } /** * Slide Box * -------------------------------------------------- */ .slider { position: relative; visibility: hidden; overflow: hidden; } .slider-slides { position: relative; height: 100%; } .slider-slide { position: relative; display: block; float: left; width: 100%; height: 100%; vertical-align: top; } .slider-slide-image > img { width: 100%; } .slider-pager { position: absolute; bottom: 20px; z-index: 1; width: 100%; height: 15px; text-align: center; } .slider-pager .slider-pager-page { display: inline-block; margin: 0px 3px; width: 15px; color: #000; text-decoration: none; opacity: 0.3; } .slider-pager .slider-pager-page.active { -webkit-transition: opacity 0.4s ease-in; transition: opacity 0.4s ease-in; opacity: 1; } .slider-slide.ng-enter, .slider-slide.ng-leave, .slider-slide.ng-animate, .slider-pager-page.ng-enter, .slider-pager-page.ng-leave, .slider-pager-page.ng-animate { -webkit-transition: none !important; transition: none !important; } .slider-slide.ng-animate, .slider-pager-page.ng-animate { -webkit-animation: none 0s; animation: none 0s; } /** * Swiper 3.2.7 * Most modern mobile touch slider and framework with hardware accelerated transitions * * http://www.idangero.us/swiper/ * * Copyright 2015, Vladimir Kharlampidi * The iDangero.us * http://www.idangero.us/ * * Licensed under MIT * * Released on: December 7, 2015 */ .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 { display: block; -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-prev.swiper-button-black, .swiper-container-rtl .swiper-button-next.swiper-button-black { 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"); } .swiper-button-prev.swiper-button-white, .swiper-container-rtl .swiper-button-next.swiper-button-white { 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"); } .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; } .swiper-button-next.swiper-button-black, .swiper-container-rtl .swiper-button-prev.swiper-button-black { 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-next.swiper-button-white, .swiper-container-rtl .swiper-button-prev.swiper-button-white { 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"); } /* 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; } .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-white .swiper-pagination-bullet { background: #fff; } .swiper-pagination-bullet-active { opacity: 1; } .swiper-pagination-white .swiper-pagination-bullet-active { background: #fff; } .swiper-pagination-black .swiper-pagination-bullet-active { background: #000; } .swiper-container-vertical > .swiper-pagination { 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 .swiper-pagination-bullet { margin: 5px 0; display: block; } .swiper-container-horizontal > .swiper-pagination { bottom: 10px; left: 0; width: 100%; } .swiper-container-horizontal > .swiper-pagination .swiper-pagination-bullet { margin: 0 5px; } /* 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(transparent)); /* Safari 4+, Chrome */ background-image: -webkit-linear-gradient(right, rgba(0, 0, 0, 0.5), transparent); /* Chrome 10+, Safari 5.1+, iOS 5+ */ background-image: -moz-linear-gradient(right, rgba(0, 0, 0, 0.5), transparent); /* Firefox 3.6-15 */ background-image: -o-linear-gradient(right, rgba(0, 0, 0, 0.5), transparent); /* Opera 11.10-12.00 */ background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), transparent); /* 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(transparent)); /* Safari 4+, Chrome */ background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.5), transparent); /* Chrome 10+, Safari 5.1+, iOS 5+ */ background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0.5), transparent); /* Firefox 3.6-15 */ background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.5), transparent); /* Opera 11.10-12.00 */ background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), transparent); /* 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(transparent)); /* Safari 4+, Chrome */ background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.5), transparent); /* Chrome 10+, Safari 5.1+, iOS 5+ */ background-image: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0.5), transparent); /* Firefox 3.6-15 */ background-image: -o-linear-gradient(bottom, rgba(0, 0, 0, 0.5), transparent); /* Opera 11.10-12.00 */ background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), transparent); /* 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(transparent)); /* Safari 4+, Chrome */ background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.5), transparent); /* Chrome 10+, Safari 5.1+, iOS 5+ */ background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.5), transparent); /* Firefox 3.6-15 */ background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.5), transparent); /* Opera 11.10-12.00 */ background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), transparent); /* Firefox 16+, IE10, Opera 12.50+ */ } /* Coverflow */ .swiper-container-coverflow .swiper-wrapper { /* Windows 8 IE 10 fix */ -ms-perspective: 1200px; } /* 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; } .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; } /* Cube */ .swiper-container-cube { overflow: visible; } .swiper-container-cube .swiper-slide { pointer-events: none; visibility: hidden; -webkit-transform-origin: 0 0; -moz-transform-origin: 0 0; -ms-transform-origin: 0 0; transform-origin: 0 0; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; backface-visibility: hidden; width: 100%; height: 100%; z-index: 1; } .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-slide-shadow-top, .swiper-container-cube .swiper-slide-shadow-bottom, .swiper-container-cube .swiper-slide-shadow-left, .swiper-container-cube .swiper-slide-shadow-right { z-index: 0; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; backface-visibility: hidden; } .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; } /* 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-lazy-preloader { width: 42px; height: 42px; position: absolute; left: 50%; top: 50%; margin-left: -21px; margin-top: -21px; z-index: 10; -webkit-transform-origin: 50%; -moz-transform-origin: 50%; transform-origin: 50%; -webkit-animation: swiper-preloader-spin 1s steps(12, end) infinite; -moz-animation: swiper-preloader-spin 1s steps(12, end) infinite; animation: swiper-preloader-spin 1s steps(12, end) infinite; } .swiper-lazy-preloader:after { display: block; content: ""; width: 100%; height: 100%; 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%; -webkit-background-size: 100%; background-size: 100%; background-repeat: no-repeat; } .swiper-lazy-preloader-white:after { 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 swiper-preloader-spin { 100% { -webkit-transform: rotate(360deg); } } @keyframes swiper-preloader-spin { 100% { transform: rotate(360deg); } } ion-slides { width: 100%; height: 100%; display: block; } .slide-zoom { display: block; width: 100%; text-align: center; } .swiper-container { width: 100%; height: 100%; padding: 0; overflow: hidden; } .swiper-wrapper { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 0; } .swiper-slide { width: 100%; height: 100%; box-sizing: border-box; /* Center slide text vertically */ } .swiper-slide img { width: auto; height: auto; max-width: 100%; max-height: 100%; } .scroll-refresher { position: absolute; top: -60px; right: 0; left: 0; overflow: hidden; margin: auto; height: 60px; } .scroll-refresher .ionic-refresher-content { position: absolute; bottom: 15px; left: 0; width: 100%; color: #666666; text-align: center; font-size: 30px; } .scroll-refresher .ionic-refresher-content .text-refreshing, .scroll-refresher .ionic-refresher-content .text-pulling { font-size: 16px; line-height: 16px; } .scroll-refresher .ionic-refresher-content.ionic-refresher-with-text { bottom: 10px; } .scroll-refresher .icon-refreshing, .scroll-refresher .icon-pulling { width: 100%; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; } .scroll-refresher .icon-pulling { -webkit-animation-name: refresh-spin-back; animation-name: refresh-spin-back; -webkit-animation-duration: 200ms; animation-duration: 200ms; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-fill-mode: none; animation-fill-mode: none; -webkit-transform: translate3d(0, 0, 0) rotate(0deg); transform: translate3d(0, 0, 0) rotate(0deg); } .scroll-refresher .icon-refreshing, .scroll-refresher .text-refreshing { display: none; } .scroll-refresher .icon-refreshing { -webkit-animation-duration: 1.5s; animation-duration: 1.5s; } .scroll-refresher.active .icon-pulling:not(.pulling-rotation-disabled) { -webkit-animation-name: refresh-spin; animation-name: refresh-spin; -webkit-transform: translate3d(0, 0, 0) rotate(-180deg); transform: translate3d(0, 0, 0) rotate(-180deg); } .scroll-refresher.active.refreshing { -webkit-transition: -webkit-transform 0.2s; transition: -webkit-transform 0.2s; -webkit-transition: transform 0.2s; transition: transform 0.2s; -webkit-transform: scale(1, 1); transform: scale(1, 1); } .scroll-refresher.active.refreshing .icon-pulling, .scroll-refresher.active.refreshing .text-pulling { display: none; } .scroll-refresher.active.refreshing .icon-refreshing, .scroll-refresher.active.refreshing .text-refreshing { display: block; } .scroll-refresher.active.refreshing.refreshing-tail { -webkit-transform: scale(0, 0); transform: scale(0, 0); } .overflow-scroll > .scroll { -webkit-overflow-scrolling: touch; width: 100%; } .overflow-scroll > .scroll.overscroll { position: fixed; right: 0; left: 0; } .overflow-scroll.padding > .scroll.overscroll { padding: 10px; } @-webkit-keyframes refresh-spin { 0% { -webkit-transform: translate3d(0, 0, 0) rotate(0); } 100% { -webkit-transform: translate3d(0, 0, 0) rotate(180deg); } } @keyframes refresh-spin { 0% { transform: translate3d(0, 0, 0) rotate(0); } 100% { transform: translate3d(0, 0, 0) rotate(180deg); } } @-webkit-keyframes refresh-spin-back { 0% { -webkit-transform: translate3d(0, 0, 0) rotate(180deg); } 100% { -webkit-transform: translate3d(0, 0, 0) rotate(0); } } @keyframes refresh-spin-back { 0% { transform: translate3d(0, 0, 0) rotate(180deg); } 100% { transform: translate3d(0, 0, 0) rotate(0); } } /** * Spinners * -------------------------------------------------- */ .spinner { stroke: #444; fill: #444; } .spinner svg { width: 28px; height: 28px; } .spinner.spinner-light { stroke: #fff; fill: #fff; } .spinner.spinner-stable { stroke: #f8f8f8; fill: #f8f8f8; } .spinner.spinner-positive { stroke: #494949; fill: #494949; } .spinner.spinner-calm { stroke: #11c1f3; fill: #11c1f3; } .spinner.spinner-balanced { stroke: #33cd5f; fill: #33cd5f; } .spinner.spinner-assertive { stroke: #ef473a; fill: #ef473a; } .spinner.spinner-energized { stroke: #ffc900; fill: #ffc900; } .spinner.spinner-royal { stroke: #fab915; fill: #fab915; } .spinner.spinner-dark { stroke: #444; fill: #444; } .spinner-android { stroke: #4b8bf4; } .spinner-ios, .spinner-ios-small { stroke: #69717d; } .spinner-spiral .stop1 { stop-color: #fff; stop-opacity: 0; } .spinner-spiral.spinner-light .stop1 { stop-color: #444; } .spinner-spiral.spinner-light .stop2 { stop-color: #fff; } .spinner-spiral.spinner-stable .stop2 { stop-color: #f8f8f8; } .spinner-spiral.spinner-positive .stop2 { stop-color: #494949; } .spinner-spiral.spinner-calm .stop2 { stop-color: #11c1f3; } .spinner-spiral.spinner-balanced .stop2 { stop-color: #33cd5f; } .spinner-spiral.spinner-assertive .stop2 { stop-color: #ef473a; } .spinner-spiral.spinner-energized .stop2 { stop-color: #ffc900; } .spinner-spiral.spinner-royal .stop2 { stop-color: #fab915; } .spinner-spiral.spinner-dark .stop2 { stop-color: #444; } /** * Forms * -------------------------------------------------- */ form { margin: 0 0 1.428571429; } legend { display: block; margin-bottom: 1.428571429; padding: 0; width: 100%; border: 1px solid #9b9bab; color: #444; font-size: 24px; line-height: 2.857142858; } legend small { color: #f8f8f8; font-size: 1.0714285718; } label, input, button, select, textarea { font-weight: normal; font-size: 16px; line-height: 1.428571429; } input, button, select, textarea { font-family: "Roboto", sans-serif; } .item-input { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; position: relative; overflow: hidden; padding: 6px 0 5px 16px; } .item-input input { -webkit-border-radius: 0; border-radius: 0; -webkit-box-flex: 1; -webkit-flex: 1 220px; -moz-box-flex: 1; -moz-flex: 1 220px; -ms-flex: 1 220px; flex: 1 220px; -webkit-appearance: none; -moz-appearance: none; appearance: none; margin: 0; padding-right: 24px; background-color: transparent; } .item-input .button .icon { -webkit-box-flex: 0; -webkit-flex: 0 0 24px; -moz-box-flex: 0; -moz-flex: 0 0 24px; -ms-flex: 0 0 24px; flex: 0 0 24px; position: static; display: inline-block; height: auto; text-align: center; font-size: 16px; } .item-input .button-bar { -webkit-border-radius: 0; border-radius: 0; -webkit-box-flex: 1; -webkit-flex: 1 0 220px; -moz-box-flex: 1; -moz-flex: 1 0 220px; -ms-flex: 1 0 220px; flex: 1 0 220px; -webkit-appearance: none; -moz-appearance: none; appearance: none; } .item-input .icon { min-width: 14px; } .platform-windowsphone .item-input input { flex-shrink: 1; } .item-input-inset { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; position: relative; overflow: hidden; padding: 10.6666666667px; } .item-input-wrapper { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-flex: 1; -webkit-flex: 1 0; -moz-box-flex: 1; -moz-flex: 1 0; -ms-flex: 1 0; flex: 1 0; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; -webkit-border-radius: 4px; border-radius: 4px; padding-right: 8px; padding-left: 8px; background: #eee; } .item-input-inset .item-input-wrapper input { padding-left: 4px; height: 29px; background: transparent; line-height: 18px; } .item-input-wrapper ~ .button { margin-left: 10.6666666667px; } .input-label { display: table; padding: 7px 10px 7px 0px; max-width: 200px; width: 35%; color: #667; font-size: 16px; } .placeholder-icon { color: #aaa; } .placeholder-icon:first-child { padding-right: 6px; } .placeholder-icon:last-child { padding-left: 6px; } .item-stacked-label { display: block; background-color: transparent; box-shadow: none; } .item-stacked-label .input-label, .item-stacked-label .icon { display: inline-block; padding: 4px 0 0 0px; vertical-align: middle; } .item-stacked-label input, .item-stacked-label textarea { -webkit-border-radius: 2px; border-radius: 2px; padding: 4px 8px 3px 0; border: none; background-color: #fff; } .item-stacked-label input { overflow: hidden; height: 50px; } .item-select.item-stacked-label select { position: relative; padding: 0px; max-width: 90%; direction: ltr; white-space: pre-wrap; margin: -3px; } .item-floating-label { display: block; background-color: transparent; box-shadow: none; } .item-floating-label .input-label { position: relative; padding: 5px 0 0 0; opacity: 0; top: 10px; -webkit-transition: opacity 0.15s ease-in, top 0.2s linear; transition: opacity 0.15s ease-in, top 0.2s linear; } .item-floating-label .input-label.has-input { opacity: 1; top: 0; -webkit-transition: opacity 0.15s ease-in, top 0.2s linear; transition: opacity 0.15s ease-in, top 0.2s linear; } textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"] { display: block; padding-top: 2px; padding-left: 0; height: 38px; color: #445; vertical-align: middle; font-size: 16px; line-height: 18px; } .platform-ios input[type="datetime-local"], .platform-ios input[type="date"], .platform-ios input[type="month"], .platform-ios input[type="time"], .platform-ios input[type="week"], .platform-android input[type="datetime-local"], .platform-android input[type="date"], .platform-android input[type="month"], .platform-android input[type="time"], .platform-android input[type="week"] { padding-top: 8px; } .item-input input, .item-input textarea { width: 100%; } textarea { padding-left: 0; } textarea::-moz-placeholder { color: #aaaabb; } textarea:-ms-input-placeholder { color: #aaaabb; } textarea::-webkit-input-placeholder { color: #aaaabb; text-indent: -3px; } textarea { height: auto; } textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"] { border: 0; } input[type="radio"], input[type="checkbox"] { margin: 0; line-height: normal; } .item-input input[type="file"], .item-input input[type="image"], .item-input input[type="submit"], .item-input input[type="reset"], .item-input input[type="button"], .item-input input[type="radio"], .item-input input[type="checkbox"] { width: auto; } input[type="file"] { line-height: 36px; } .previous-input-focus, .cloned-text-input + input, .cloned-text-input + textarea { position: absolute !important; left: -9999px; width: 200px; } input::-moz-placeholder, textarea::-moz-placeholder { color: #aaaabb; } input:-ms-input-placeholder, textarea:-ms-input-placeholder { color: #aaaabb; } input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color: #aaaabb; text-indent: 0; } input[disabled], select[disabled], textarea[disabled], input[readonly]:not(.cloned-text-input), textarea[readonly]:not(.cloned-text-input), select[readonly] { background-color: #f8f8f8; cursor: not-allowed; } input[type="radio"][disabled], input[type="checkbox"][disabled], input[type="radio"][readonly], input[type="checkbox"][readonly] { background-color: transparent; } /** * Checkbox * -------------------------------------------------- */ .checkbox { position: relative; display: inline-block; padding: 7px 7px; cursor: pointer; } .checkbox input:before, .checkbox .checkbox-icon:before { border-color: #ddd; } .checkbox input:checked:before, .checkbox input:checked + .checkbox-icon:before { background: #494949; border-color: #494949; } .checkbox-light input:before, .checkbox-light .checkbox-icon:before { border-color: #ddd; } .checkbox-light input:checked:before, .checkbox-light input:checked + .checkbox-icon:before { background: #ddd; border-color: #ddd; } .checkbox-stable input:before, .checkbox-stable .checkbox-icon:before { border-color: #b2b2b2; } .checkbox-stable input:checked:before, .checkbox-stable input:checked + .checkbox-icon:before { background: #b2b2b2; border-color: #b2b2b2; } .checkbox-positive input:before, .checkbox-positive .checkbox-icon:before { border-color: #494949; } .checkbox-positive input:checked:before, .checkbox-positive input:checked + .checkbox-icon:before { background: #494949; border-color: #494949; } .checkbox-calm input:before, .checkbox-calm .checkbox-icon:before { border-color: #11c1f3; } .checkbox-calm input:checked:before, .checkbox-calm input:checked + .checkbox-icon:before { background: #11c1f3; border-color: #11c1f3; } .checkbox-assertive input:before, .checkbox-assertive .checkbox-icon:before { border-color: #ef473a; } .checkbox-assertive input:checked:before, .checkbox-assertive input:checked + .checkbox-icon:before { background: #ef473a; border-color: #ef473a; } .checkbox-balanced input:before, .checkbox-balanced .checkbox-icon:before { border-color: #33cd5f; } .checkbox-balanced input:checked:before, .checkbox-balanced input:checked + .checkbox-icon:before { background: #33cd5f; border-color: #33cd5f; } .checkbox-energized input:before, .checkbox-energized .checkbox-icon:before { border-color: #ffc900; } .checkbox-energized input:checked:before, .checkbox-energized input:checked + .checkbox-icon:before { background: #ffc900; border-color: #ffc900; } .checkbox-royal input:before, .checkbox-royal .checkbox-icon:before { border-color: #fab915; } .checkbox-royal input:checked:before, .checkbox-royal input:checked + .checkbox-icon:before { background: #fab915; border-color: #fab915; } .checkbox-dark input:before, .checkbox-dark .checkbox-icon:before { border-color: #444; } .checkbox-dark input:checked:before, .checkbox-dark input:checked + .checkbox-icon:before { background: #444; border-color: #444; } .checkbox input:disabled:before, .checkbox input:disabled + .checkbox-icon:before { border-color: #ddd; } .checkbox input:disabled:checked:before, .checkbox input:disabled:checked + .checkbox-icon:before { background: #ddd; } .checkbox.checkbox-input-hidden input { display: none !important; } .checkbox input, .checkbox-icon { position: relative; width: 28px; height: 28px; display: block; border: 0; background: transparent; cursor: pointer; -webkit-appearance: none; } .checkbox input:before, .checkbox-icon:before { display: table; width: 100%; height: 100%; border-width: 1px; border-style: solid; border-radius: 28px; background: #fff; content: ' '; -webkit-transition: background-color 20ms ease-in-out; transition: background-color 20ms ease-in-out; } .checkbox input:checked:before, input:checked + .checkbox-icon:before { border-width: 2px; } .checkbox input:after, .checkbox-icon:after { -webkit-transition: opacity 0.05s ease-in-out; transition: opacity 0.05s ease-in-out; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); position: absolute; top: 33%; left: 25%; display: table; width: 14px; height: 6px; border: 1px solid #fff; border-top: 0; border-right: 0; content: ' '; opacity: 0; } .platform-android .checkbox-platform input:before, .platform-android .checkbox-platform .checkbox-icon:before, .checkbox-square input:before, .checkbox-square .checkbox-icon:before { border-radius: 2px; width: 72%; height: 72%; margin-top: 14%; margin-left: 14%; border-width: 2px; } .platform-android .checkbox-platform input:after, .platform-android .checkbox-platform .checkbox-icon:after, .checkbox-square input:after, .checkbox-square .checkbox-icon:after { border-width: 2px; top: 19%; left: 25%; width: 13px; height: 7px; } .platform-android .item-checkbox-right .checkbox-square .checkbox-icon::after { top: 31%; } .grade-c .checkbox input:after, .grade-c .checkbox-icon:after { -webkit-transform: rotate(0); transform: rotate(0); top: 3px; left: 4px; border: none; color: #fff; content: '\2713'; font-weight: bold; font-size: 20px; } .checkbox input:checked:after, input:checked + .checkbox-icon:after { opacity: 1; } .item-checkbox { padding-left: 60px; } .item-checkbox.active { box-shadow: none; } .item-checkbox .checkbox { position: absolute; top: 50%; right: 8px; left: 8px; z-index: 3; margin-top: -21px; } .item-checkbox.item-checkbox-right { padding-right: 60px; padding-left: 16px; } .item-checkbox-right .checkbox input, .item-checkbox-right .checkbox-icon { float: right; } /** * Toggle * -------------------------------------------------- */ .item-toggle { pointer-events: none; } .toggle { position: relative; display: inline-block; pointer-events: auto; margin: -5px; padding: 5px; } .toggle input:checked + .track { border-color: #4cd964; background-color: #4cd964; } .toggle.dragging .handle { background-color: #f2f2f2 !important; } .toggle.toggle-light input:checked + .track { border-color: #ddd; background-color: #ddd; } .toggle.toggle-stable input:checked + .track { border-color: #b2b2b2; background-color: #b2b2b2; } .toggle.toggle-positive input:checked + .track { border-color: #494949; background-color: #494949; } .toggle.toggle-calm input:checked + .track { border-color: #11c1f3; background-color: #11c1f3; } .toggle.toggle-assertive input:checked + .track { border-color: #ef473a; background-color: #ef473a; } .toggle.toggle-balanced input:checked + .track { border-color: #33cd5f; background-color: #33cd5f; } .toggle.toggle-energized input:checked + .track { border-color: #ffc900; background-color: #ffc900; } .toggle.toggle-royal input:checked + .track { border-color: #fab915; background-color: #fab915; } .toggle.toggle-dark input:checked + .track { border-color: #444; background-color: #444; } .toggle input { display: none; } /* the track appearance when the toggle is "off" */ .toggle .track { -webkit-transition-timing-function: ease-in-out; transition-timing-function: ease-in-out; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-property: background-color, border; transition-property: background-color, border; display: inline-block; box-sizing: border-box; width: 51px; height: 31px; border: solid 2px #e6e6e6; border-radius: 20px; background-color: #fff; content: ' '; cursor: pointer; pointer-events: none; } /* Fix to avoid background color bleeding */ /* (occurred on (at least) Android 4.2, Asus MeMO Pad HD7 ME173X) */ .platform-android4_2 .toggle .track { -webkit-background-clip: padding-box; } /* the handle (circle) thats inside the toggle's track area */ /* also the handle's appearance when it is "off" */ .toggle .handle { -webkit-transition: 0.3s cubic-bezier(0, 1.1, 1, 1.1); transition: 0.3s cubic-bezier(0, 1.1, 1, 1.1); -webkit-transition-property: background-color, transform; transition-property: background-color, transform; position: absolute; display: block; width: 27px; height: 27px; border-radius: 27px; background-color: #fff; top: 7px; left: 7px; box-shadow: 0 2px 7px rgba(0, 0, 0, 0.35), 0 1px 1px rgba(0, 0, 0, 0.15); } .toggle .handle:before { position: absolute; top: -4px; left: -21.5px; padding: 18.5px 34px; content: " "; } .toggle input:checked + .track .handle { -webkit-transform: translate3d(20px, 0, 0); transform: translate3d(20px, 0, 0); background-color: #fff; } .item-toggle.active { box-shadow: none; } .item-toggle, .item-toggle.item-complex .item-content { padding-right: 99px; } .item-toggle.item-complex { padding-right: 0; } .item-toggle .toggle { position: absolute; top: 10px; right: 16px; z-index: 3; } .toggle input:disabled + .track { opacity: .6; } .toggle-small .track { border: 0; width: 34px; height: 15px; background: #9e9e9e; } .toggle-small input:checked + .track { background: rgba(0, 150, 137, 0.5); } .toggle-small .handle { top: 2px; left: 4px; width: 21px; height: 21px; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25); } .toggle-small input:checked + .track .handle { -webkit-transform: translate3d(16px, 0, 0); transform: translate3d(16px, 0, 0); background: #009689; } .toggle-small.item-toggle .toggle { top: 19px; } .toggle-small .toggle-light input:checked + .track { background-color: rgba(221, 221, 221, 0.5); } .toggle-small .toggle-light input:checked + .track .handle { background-color: #ddd; } .toggle-small .toggle-stable input:checked + .track { background-color: rgba(178, 178, 178, 0.5); } .toggle-small .toggle-stable input:checked + .track .handle { background-color: #b2b2b2; } .toggle-small .toggle-positive input:checked + .track { background-color: rgba(73, 73, 73, 0.5); } .toggle-small .toggle-positive input:checked + .track .handle { background-color: #494949; } .toggle-small .toggle-calm input:checked + .track { background-color: rgba(17, 193, 243, 0.5); } .toggle-small .toggle-calm input:checked + .track .handle { background-color: #11c1f3; } .toggle-small .toggle-assertive input:checked + .track { background-color: rgba(239, 71, 58, 0.5); } .toggle-small .toggle-assertive input:checked + .track .handle { background-color: #ef473a; } .toggle-small .toggle-balanced input:checked + .track { background-color: rgba(51, 205, 95, 0.5); } .toggle-small .toggle-balanced input:checked + .track .handle { background-color: #33cd5f; } .toggle-small .toggle-energized input:checked + .track { background-color: rgba(255, 201, 0, 0.5); } .toggle-small .toggle-energized input:checked + .track .handle { background-color: #ffc900; } .toggle-small .toggle-royal input:checked + .track { background-color: rgba(250, 185, 21, 0.5); } .toggle-small .toggle-royal input:checked + .track .handle { background-color: #fab915; } .toggle-small .toggle-dark input:checked + .track { background-color: rgba(68, 68, 68, 0.5); } .toggle-small .toggle-dark input:checked + .track .handle { background-color: #444; } /** * Radio Button Inputs * -------------------------------------------------- */ .item-radio { padding: 0; } .item-radio:hover { cursor: pointer; } .item-radio .item-content { /* give some room to the right for the checkmark icon */ padding-right: 64px; } .item-radio .radio-icon { /* checkmark icon will be hidden by default */ position: absolute; top: 0; right: 0; z-index: 3; visibility: hidden; padding: 14px; height: 100%; font-size: 24px; } .item-radio input { /* hide any radio button inputs elements (the ugly circles) */ position: absolute; left: -9999px; } .item-radio input:checked + .radio-content .item-content { /* style the item content when its checked */ background: #f7f7f7; } .item-radio input:checked + .radio-content .radio-icon { /* show the checkmark icon when its checked */ visibility: visible; } /** * Range * -------------------------------------------------- */ .range input { display: inline-block; overflow: hidden; margin-top: 5px; margin-bottom: 5px; padding-right: 2px; padding-left: 1px; width: auto; height: 43px; outline: none; background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ccc), color-stop(100%, #ccc)); background: linear-gradient(to right, #ccc 0%, #ccc 100%); background-position: center; background-size: 99% 2px; background-repeat: no-repeat; -webkit-appearance: none; /* &::-ms-track{ background: transparent; border-color: transparent; border-width: 11px 0 16px; color:transparent; margin-top:20px; } &::-ms-thumb { width: $range-slider-width; height: $range-slider-height; border-radius: $range-slider-border-radius; background-color: $toggle-handle-off-bg-color; border-color:$toggle-handle-off-bg-color; box-shadow: $range-slider-box-shadow; margin-left:1px; margin-right:1px; outline:none; } &::-ms-fill-upper { height: $range-track-height; background:$range-default-track-bg; } */ } .range input::-moz-focus-outer { /* hide the focus outline in Firefox */ border: 0; } .range input::-webkit-slider-thumb { position: relative; width: 28px; height: 28px; border-radius: 50%; background-color: #fff; box-shadow: 0 0 2px rgba(0, 0, 0, 0.3), 0 3px 5px rgba(0, 0, 0, 0.2); cursor: pointer; -webkit-appearance: none; border: 0; } .range input::-webkit-slider-thumb:before { /* what creates the colorful line on the left side of the slider */ position: absolute; top: 13px; left: -2001px; width: 2000px; height: 2px; background: #444; content: ' '; } .range input::-webkit-slider-thumb:after { /* create a larger (but hidden) hit area */ position: absolute; top: -15px; left: -15px; padding: 30px; content: ' '; } .range input::-ms-fill-lower { height: 2px; background: #444; } .range { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; padding: 2px 11px; } .range.range-light input::-webkit-slider-thumb:before { background: #ddd; } .range.range-light input::-ms-fill-lower { background: #ddd; } .range.range-stable input::-webkit-slider-thumb:before { background: #b2b2b2; } .range.range-stable input::-ms-fill-lower { background: #b2b2b2; } .range.range-positive input::-webkit-slider-thumb:before { background: #494949; } .range.range-positive input::-ms-fill-lower { background: #494949; } .range.range-calm input::-webkit-slider-thumb:before { background: #11c1f3; } .range.range-calm input::-ms-fill-lower { background: #11c1f3; } .range.range-balanced input::-webkit-slider-thumb:before { background: #33cd5f; } .range.range-balanced input::-ms-fill-lower { background: #33cd5f; } .range.range-assertive input::-webkit-slider-thumb:before { background: #ef473a; } .range.range-assertive input::-ms-fill-lower { background: #ef473a; } .range.range-energized input::-webkit-slider-thumb:before { background: #ffc900; } .range.range-energized input::-ms-fill-lower { background: #ffc900; } .range.range-royal input::-webkit-slider-thumb:before { background: #fab915; } .range.range-royal input::-ms-fill-lower { background: #fab915; } .range.range-dark input::-webkit-slider-thumb:before { background: #444; } .range.range-dark input::-ms-fill-lower { background: #444; } .range .icon { -webkit-box-flex: 0; -webkit-flex: 0; -moz-box-flex: 0; -moz-flex: 0; -ms-flex: 0; flex: 0; display: block; min-width: 24px; text-align: center; font-size: 24px; } .range input { -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -moz-flex: 1; -ms-flex: 1; flex: 1; display: block; margin-right: 10px; margin-left: 10px; } .range-label { -webkit-box-flex: 0; -webkit-flex: 0 0 auto; -moz-box-flex: 0; -moz-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto; display: block; white-space: nowrap; } .range-label:first-child { padding-left: 5px; } .range input + .range-label { padding-right: 5px; padding-left: 0; } .platform-windowsphone .range input { height: auto; } /** * Select * -------------------------------------------------- */ .item-select { position: relative; } .item-select select { -webkit-appearance: none; -moz-appearance: none; appearance: none; position: absolute; top: 0; bottom: 0; right: 0; padding: 0 48px 0 16px; max-width: 65%; border: none; background: #ffffff; color: #333; text-indent: .01px; text-overflow: ''; white-space: nowrap; font-size: 16px; cursor: pointer; direction: rtl; } .item-select select::-ms-expand { display: none; } .item-select option { direction: ltr; } .item-select:after { position: absolute; top: 50%; right: 16px; margin-top: -3px; width: 0; height: 0; border-top: 5px solid; border-right: 5px solid transparent; border-left: 5px solid transparent; color: #999; content: ""; pointer-events: none; } .item-select.item-light select { background: #fff; color: #444; } .item-select.item-stable select { background: #f8f8f8; color: #444; } .item-select.item-stable:after, .item-select.item-stable .input-label { color: #666666; } .item-select.item-positive select { background: #494949; color: #fff; } .item-select.item-positive:after, .item-select.item-positive .input-label { color: #fff; } .item-select.item-calm select { background: #11c1f3; color: #fff; } .item-select.item-calm:after, .item-select.item-calm .input-label { color: #fff; } .item-select.item-assertive select { background: #ef473a; color: #fff; } .item-select.item-assertive:after, .item-select.item-assertive .input-label { color: #fff; } .item-select.item-balanced select { background: #33cd5f; color: #fff; } .item-select.item-balanced:after, .item-select.item-balanced .input-label { color: #fff; } .item-select.item-energized select { background: #ffc900; color: #fff; } .item-select.item-energized:after, .item-select.item-energized .input-label { color: #fff; } .item-select.item-royal select { background: #fab915; color: #fff; } .item-select.item-royal:after, .item-select.item-royal .input-label { color: #fff; } .item-select.item-dark select { background: #444; color: #fff; } .item-select.item-dark:after, .item-select.item-dark .input-label { color: #fff; } select[multiple], select[size] { height: auto; } /** * Progress * -------------------------------------------------- */ progress { display: block; margin: 15px auto; width: 100%; } /** * Buttons * -------------------------------------------------- */ .button { border-color: transparent; background-color: #f8f8f8; color: #444; position: relative; display: inline-block; margin: 0; padding: 0 16px; min-width: 64px; min-height: 57px; border-width: 1px; border-style: solid; border-radius: 3px; vertical-align: top; text-align: center; text-overflow: ellipsis; font-size: 16px; line-height: 52px; cursor: pointer; } .button:hover { color: #444; text-decoration: none; } .button.active, .button.activated { border-color: #a2a2a2; background-color: #e5e5e5; } .button:after { position: absolute; top: -6px; right: -6px; bottom: -6px; left: -6px; content: ' '; } .button .icon { vertical-align: top; pointer-events: none; } .button .icon:before, .button.icon:before, .button.icon-left:before, .button.icon-right:before { display: inline-block; padding: 0 0 1px 0; vertical-align: inherit; font-size: 24px; line-height: 51px; pointer-events: none; } .button.icon-left:before { float: left; padding-right: .2em; padding-left: 0; } .button.icon-right:before { float: right; padding-right: 0; padding-left: .2em; } .button.button-block, .button.button-full { margin-top: 10px; margin-bottom: 10px; } .button.button-light { border-color: transparent; background-color: #fff; color: #444; } .button.button-light:hover { color: #444; text-decoration: none; } .button.button-light.active, .button.button-light.activated { border-color: #a2a2a2; background-color: #fafafa; } .button.button-light.button-clear { border-color: transparent; background: none; box-shadow: none; color: #ddd; } .button.button-light.button-icon { border-color: transparent; background: none; } .button.button-light.button-outline { border-color: #ddd; background: transparent; color: #ddd; } .button.button-light.button-outline.active, .button.button-light.button-outline.activated { background-color: #ddd; box-shadow: none; color: #fff; } .button.button-stable { border-color: transparent; background-color: #f8f8f8; color: #444; } .button.button-stable:hover { color: #444; text-decoration: none; } .button.button-stable.active, .button.button-stable.activated { border-color: #a2a2a2; background-color: #e5e5e5; } .button.button-stable.button-clear { border-color: transparent; background: none; box-shadow: none; color: #b2b2b2; } .button.button-stable.button-icon { border-color: transparent; background: none; } .button.button-stable.button-outline { border-color: #b2b2b2; background: transparent; color: #b2b2b2; } .button.button-stable.button-outline.active, .button.button-stable.button-outline.activated { background-color: #b2b2b2; box-shadow: none; color: #fff; } .button.button-positive { border-color: transparent; background-color: #494949; color: #fff; } .button.button-positive:hover { color: #fff; text-decoration: none; } .button.button-positive.active, .button.button-positive.activated { border-color: #a2a2a2; background-color: #303030; } .button.button-positive.button-clear { border-color: transparent; background: none; box-shadow: none; color: #494949; } .button.button-positive.button-icon { border-color: transparent; background: none; } .button.button-positive.button-outline { border-color: #494949; background: transparent; color: #494949; } .button.button-positive.button-outline.active, .button.button-positive.button-outline.activated { background-color: #494949; box-shadow: none; color: #fff; } .button.button-calm { border-color: transparent; background-color: #11c1f3; color: #fff; } .button.button-calm:hover { color: #fff; text-decoration: none; } .button.button-calm.active, .button.button-calm.activated { border-color: #a2a2a2; background-color: #0a9dc7; } .button.button-calm.button-clear { border-color: transparent; background: none; box-shadow: none; color: #11c1f3; } .button.button-calm.button-icon { border-color: transparent; background: none; } .button.button-calm.button-outline { border-color: #11c1f3; background: transparent; color: #11c1f3; } .button.button-calm.button-outline.active, .button.button-calm.button-outline.activated { background-color: #11c1f3; box-shadow: none; color: #fff; } .button.button-assertive { border-color: transparent; background-color: #ef473a; color: #fff; } .button.button-assertive:hover { color: #fff; text-decoration: none; } .button.button-assertive.active, .button.button-assertive.activated { border-color: #a2a2a2; background-color: #e42112; } .button.button-assertive.button-clear { border-color: transparent; background: none; box-shadow: none; color: #ef473a; } .button.button-assertive.button-icon { border-color: transparent; background: none; } .button.button-assertive.button-outline { border-color: #ef473a; background: transparent; color: #ef473a; } .button.button-assertive.button-outline.active, .button.button-assertive.button-outline.activated { background-color: #ef473a; box-shadow: none; color: #fff; } .button.button-balanced { border-color: transparent; background-color: #33cd5f; color: #fff; } .button.button-balanced:hover { color: #fff; text-decoration: none; } .button.button-balanced.active, .button.button-balanced.activated { border-color: #a2a2a2; background-color: #28a54c; } .button.button-balanced.button-clear { border-color: transparent; background: none; box-shadow: none; color: #33cd5f; } .button.button-balanced.button-icon { border-color: transparent; background: none; } .button.button-balanced.button-outline { border-color: #33cd5f; background: transparent; color: #33cd5f; } .button.button-balanced.button-outline.active, .button.button-balanced.button-outline.activated { background-color: #33cd5f; box-shadow: none; color: #fff; } .button.button-energized { border-color: transparent; background-color: #ffc900; color: #fff; } .button.button-energized:hover { color: #fff; text-decoration: none; } .button.button-energized.active, .button.button-energized.activated { border-color: #a2a2a2; background-color: #e6b500; } .button.button-energized.button-clear { border-color: transparent; background: none; box-shadow: none; color: #ffc900; } .button.button-energized.button-icon { border-color: transparent; background: none; } .button.button-energized.button-outline { border-color: #ffc900; background: transparent; color: #ffc900; } .button.button-energized.button-outline.active, .button.button-energized.button-outline.activated { background-color: #ffc900; box-shadow: none; color: #fff; } .button.button-royal { border-color: transparent; background-color: #fab915; color: #fff; } .button.button-royal:hover { color: #fff; text-decoration: none; } .button.button-royal.active, .button.button-royal.activated { border-color: #a2a2a2; background-color: #e1a305; } .button.button-royal.button-clear { border-color: transparent; background: none; box-shadow: none; color: #fab915; } .button.button-royal.button-icon { border-color: transparent; background: none; } .button.button-royal.button-outline { border-color: #fab915; background: transparent; color: #fab915; } .button.button-royal.button-outline.active, .button.button-royal.button-outline.activated { background-color: #fab915; box-shadow: none; color: #fff; } .button.button-dark { border-color: transparent; background-color: #444; color: #fff; } .button.button-dark:hover { color: #fff; text-decoration: none; } .button.button-dark.active, .button.button-dark.activated { border-color: #a2a2a2; background-color: #262626; } .button.button-dark.button-clear { border-color: transparent; background: none; box-shadow: none; color: #444; } .button.button-dark.button-icon { border-color: transparent; background: none; } .button.button-dark.button-outline { border-color: #444; background: transparent; color: #444; } .button.button-dark.button-outline.active, .button.button-dark.button-outline.activated { background-color: #444; box-shadow: none; color: #fff; } .button-small { padding: 2px 4px 1px; min-width: 28px; min-height: 30px; font-size: 12px; line-height: 26px; } .button-small .icon:before, .button-small.icon:before, .button-small.icon-left:before, .button-small.icon-right:before { font-size: 16px; line-height: 19px; margin-top: 3px; } .button-large { padding: 0 16px; min-width: 68px; min-height: 59px; font-size: 20px; line-height: 53px; } .button-large .icon:before, .button-large.icon:before, .button-large.icon-left:before, .button-large.icon-right:before { padding-bottom: 2px; font-size: 32px; line-height: 51px; } .button-icon { -webkit-transition: opacity 0.1s; transition: opacity 0.1s; padding: 0 6px; min-width: initial; border-color: transparent; background: none; } .button-icon.button.active, .button-icon.button.activated { border-color: transparent; background: none; box-shadow: none; opacity: 0.3; } .button-icon .icon:before, .button-icon.icon:before { font-size: 32px; } .button-clear { -webkit-transition: opacity 0.1s; transition: opacity 0.1s; padding: 0 6px; max-height: 52px; border-color: transparent; background: none; box-shadow: none; } .button-clear.button-clear { border-color: transparent; background: none; box-shadow: none; color: transparent; } .button-clear.button-icon { border-color: transparent; background: none; } .button-clear.active, .button-clear.activated { opacity: 0.3; } .button-outline { -webkit-transition: opacity 0.1s; transition: opacity 0.1s; background: none; box-shadow: none; } .button-outline.button-outline { border-color: transparent; background: transparent; color: transparent; } .button-outline.button-outline.active, .button-outline.button-outline.activated { background-color: transparent; box-shadow: none; color: #fff; } .padding > .button.button-block:first-child { margin-top: 0; } .button-block { display: block; clear: both; } .button-block:after { clear: both; } .button-full, .button-full > .button { display: block; margin-right: 0; margin-left: 0; border-right-width: 0; border-left-width: 0; border-radius: 0; } button.button-block, button.button-full, .button-full > button.button, input.button.button-block { width: 100%; } a.button { text-decoration: none; } a.button .icon:before, a.button.icon:before, a.button.icon-left:before, a.button.icon-right:before { margin-top: 2px; } .button.disabled, .button[disabled] { opacity: .4; cursor: default !important; pointer-events: none; } /** * Button Bar * -------------------------------------------------- */ .button-bar { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -moz-flex: 1; -ms-flex: 1; flex: 1; width: 100%; } .button-bar.button-bar-inline { display: block; width: auto; *zoom: 1; } .button-bar.button-bar-inline:before, .button-bar.button-bar-inline:after { display: table; content: ""; line-height: 0; } .button-bar.button-bar-inline:after { clear: both; } .button-bar.button-bar-inline > .button { width: auto; display: inline-block; float: left; } .button-bar.bar-light > .button { border-color: #ddd; } .button-bar.bar-stable > .button { border-color: #b2b2b2; } .button-bar.bar-positive > .button { border-color: #303030; } .button-bar.bar-calm > .button { border-color: #0a9dc7; } .button-bar.bar-assertive > .button { border-color: #e42112; } .button-bar.bar-balanced > .button { border-color: #28a54c; } .button-bar.bar-energized > .button { border-color: #e6b500; } .button-bar.bar-royal > .button { border-color: #e1a305; } .button-bar.bar-dark > .button { border-color: #111; } .button-bar > .button { -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -moz-flex: 1; -ms-flex: 1; flex: 1; display: block; overflow: hidden; padding: 0 16px; width: 0; border-width: 1px 0px 1px 1px; border-radius: 0; text-align: center; text-overflow: ellipsis; white-space: nowrap; } .button-bar > .button:before, .button-bar > .button .icon:before { line-height: 44px; } .button-bar > .button:first-child { border-radius: 3px 0px 0px 3px; } .button-bar > .button:last-child { border-right-width: 1px; border-radius: 0px 3px 3px 0px; } .button-bar > .button:only-child { border-radius: 3px; } .button-bar > .button-small:before, .button-bar > .button-small .icon:before { line-height: 28px; } /** * Grid * -------------------------------------------------- * Using flexbox for the grid, inspired by Philip Walton: * http://philipwalton.github.io/solved-by-flexbox/demos/grids/ * By default each .col within a .row will evenly take up * available width, and the height of each .col with take * up the height of the tallest .col in the same .row. */ .row { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -moz-flex; display: -ms-flexbox; display: flex; padding: 5px; width: 100%; } .row-wrap { -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .row-no-padding { padding: 0; } .row-no-padding > .col { padding: 0; } .row + .row { margin-top: -5px; padding-top: 0; } .col { -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -moz-flex: 1; -ms-flex: 1; flex: 1; display: block; padding: 5px; width: 100%; } /* Vertically Align Columns */ /* .row-* vertically aligns every .col in the .row */ .row-top { -webkit-box-align: start; -ms-flex-align: start; -webkit-align-items: flex-start; -moz-align-items: flex-start; align-items: flex-start; } .row-bottom { -webkit-box-align: end; -ms-flex-align: end; -webkit-align-items: flex-end; -moz-align-items: flex-end; align-items: flex-end; } .row-center { -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; } .row-stretch { -webkit-box-align: stretch; -ms-flex-align: stretch; -webkit-align-items: stretch; -moz-align-items: stretch; align-items: stretch; } .row-baseline { -webkit-box-align: baseline; -ms-flex-align: baseline; -webkit-align-items: baseline; -moz-align-items: baseline; align-items: baseline; } /* .col-* vertically aligns an individual .col */ .col-top { -webkit-align-self: flex-start; -moz-align-self: flex-start; -ms-flex-item-align: start; align-self: flex-start; } .col-bottom { -webkit-align-self: flex-end; -moz-align-self: flex-end; -ms-flex-item-align: end; align-self: flex-end; } .col-center { -webkit-align-self: center; -moz-align-self: center; -ms-flex-item-align: center; align-self: center; } /* Column Offsets */ .col-offset-10 { margin-left: 10%; } .col-offset-20 { margin-left: 20%; } .col-offset-25 { margin-left: 25%; } .col-offset-33, .col-offset-34 { margin-left: 33.3333%; } .col-offset-50 { margin-left: 50%; } .col-offset-66, .col-offset-67 { margin-left: 66.6666%; } .col-offset-75 { margin-left: 75%; } .col-offset-80 { margin-left: 80%; } .col-offset-90 { margin-left: 90%; } /* Explicit Column Percent Sizes */ /* By default each grid column will evenly distribute */ /* across the grid. However, you can specify individual */ /* columns to take up a certain size of the available area */ .col-10 { -webkit-box-flex: 0; -webkit-flex: 0 0 10%; -moz-box-flex: 0; -moz-flex: 0 0 10%; -ms-flex: 0 0 10%; flex: 0 0 10%; max-width: 10%; } .col-20 { -webkit-box-flex: 0; -webkit-flex: 0 0 20%; -moz-box-flex: 0; -moz-flex: 0 0 20%; -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .col-25 { -webkit-box-flex: 0; -webkit-flex: 0 0 25%; -moz-box-flex: 0; -moz-flex: 0 0 25%; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .col-33, .col-34 { -webkit-box-flex: 0; -webkit-flex: 0 0 33.3333%; -moz-box-flex: 0; -moz-flex: 0 0 33.3333%; -ms-flex: 0 0 33.3333%; flex: 0 0 33.3333%; max-width: 33.3333%; } .col-40 { -webkit-box-flex: 0; -webkit-flex: 0 0 40%; -moz-box-flex: 0; -moz-flex: 0 0 40%; -ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%; } .col-50 { -webkit-box-flex: 0; -webkit-flex: 0 0 50%; -moz-box-flex: 0; -moz-flex: 0 0 50%; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .col-60 { -webkit-box-flex: 0; -webkit-flex: 0 0 60%; -moz-box-flex: 0; -moz-flex: 0 0 60%; -ms-flex: 0 0 60%; flex: 0 0 60%; max-width: 60%; } .col-66, .col-67 { -webkit-box-flex: 0; -webkit-flex: 0 0 66.6666%; -moz-box-flex: 0; -moz-flex: 0 0 66.6666%; -ms-flex: 0 0 66.6666%; flex: 0 0 66.6666%; max-width: 66.6666%; } .col-75 { -webkit-box-flex: 0; -webkit-flex: 0 0 75%; -moz-box-flex: 0; -moz-flex: 0 0 75%; -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .col-80 { -webkit-box-flex: 0; -webkit-flex: 0 0 80%; -moz-box-flex: 0; -moz-flex: 0 0 80%; -ms-flex: 0 0 80%; flex: 0 0 80%; max-width: 80%; } .col-90 { -webkit-box-flex: 0; -webkit-flex: 0 0 90%; -moz-box-flex: 0; -moz-flex: 0 0 90%; -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%; } /* Responsive Grid Classes */ /* Adding a class of responsive-X to a row */ /* will trigger the flex-direction to */ /* change to column and add some margin */ /* to any columns in the row for clearity */ @media (max-width: 567px) { .responsive-sm { -webkit-box-direction: normal; -moz-box-direction: normal; -webkit-box-orient: vertical; -moz-box-orient: vertical; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } .responsive-sm .col, .responsive-sm .col-10, .responsive-sm .col-20, .responsive-sm .col-25, .responsive-sm .col-33, .responsive-sm .col-34, .responsive-sm .col-50, .responsive-sm .col-66, .responsive-sm .col-67, .responsive-sm .col-75, .responsive-sm .col-80, .responsive-sm .col-90 { -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -moz-flex: 1; -ms-flex: 1; flex: 1; margin-bottom: 15px; margin-left: 0; max-width: 100%; width: 100%; } } @media (max-width: 767px) { .responsive-md { -webkit-box-direction: normal; -moz-box-direction: normal; -webkit-box-orient: vertical; -moz-box-orient: vertical; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } .responsive-md .col, .responsive-md .col-10, .responsive-md .col-20, .responsive-md .col-25, .responsive-md .col-33, .responsive-md .col-34, .responsive-md .col-50, .responsive-md .col-66, .responsive-md .col-67, .responsive-md .col-75, .responsive-md .col-80, .responsive-md .col-90 { -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -moz-flex: 1; -ms-flex: 1; flex: 1; margin-bottom: 15px; margin-left: 0; max-width: 100%; width: 100%; } } @media (max-width: 1023px) { .responsive-lg { -webkit-box-direction: normal; -moz-box-direction: normal; -webkit-box-orient: vertical; -moz-box-orient: vertical; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } .responsive-lg .col, .responsive-lg .col-10, .responsive-lg .col-20, .responsive-lg .col-25, .responsive-lg .col-33, .responsive-lg .col-34, .responsive-lg .col-50, .responsive-lg .col-66, .responsive-lg .col-67, .responsive-lg .col-75, .responsive-lg .col-80, .responsive-lg .col-90 { -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -moz-flex: 1; -ms-flex: 1; flex: 1; margin-bottom: 15px; margin-left: 0; max-width: 100%; width: 100%; } } /** * Utility Classes * -------------------------------------------------- */ .hide { display: none; } .opacity-hide { opacity: 0; } .grade-b .opacity-hide, .grade-c .opacity-hide { opacity: 1; display: none; } .show { display: block; } .opacity-show { opacity: 1; } .invisible { visibility: hidden; } .keyboard-open .hide-on-keyboard-open { display: none; } .keyboard-open .tabs.hide-on-keyboard-open + .pane .has-tabs, .keyboard-open .bar-footer.hide-on-keyboard-open + .pane .has-footer { bottom: 0; } .inline { display: inline-block; } .disable-pointer-events { pointer-events: none; } .enable-pointer-events { pointer-events: auto; } .disable-user-behavior { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -webkit-tap-highlight-color: transparent; -webkit-tap-highlight-color: transparent; -webkit-user-drag: none; -ms-touch-action: none; -ms-content-zooming: none; } .click-block { position: absolute; top: 0; right: 0; bottom: 0; left: 0; opacity: 0; z-index: 99999; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); overflow: hidden; } .click-block-hide { -webkit-transform: translate3d(-9999px, 0, 0); transform: translate3d(-9999px, 0, 0); } .no-resize { resize: none; } .block { display: block; clear: both; } .block:after { display: block; visibility: hidden; clear: both; height: 0; content: "."; } .full-image { width: 100%; } .clearfix { *zoom: 1; } .clearfix:before, .clearfix:after { display: table; content: ""; line-height: 0; } .clearfix:after { clear: both; } /** * Content Padding * -------------------------------------------------- */ .padding { padding: 10px; } .padding-top, .padding-vertical { padding-top: 10px; } .padding-right, .padding-horizontal { padding-right: 10px; } .padding-bottom, .padding-vertical { padding-bottom: 10px; } .padding-left, .padding-horizontal { padding-left: 10px; } /** * Scrollable iFrames * -------------------------------------------------- */ .iframe-wrapper { position: fixed; -webkit-overflow-scrolling: touch; overflow: scroll; } .iframe-wrapper iframe { height: 100%; width: 100%; } /** * Rounded * -------------------------------------------------- */ .rounded { border-radius: 4px; } /** * Utility Colors * -------------------------------------------------- * Utility colors are added to help set a naming convention. You'll * notice we purposely do not use words like "red" or "blue", but * instead have colors which represent an emotion or generic theme. */ .light, a.light { color: #fff; } .light-bg { background-color: #fff; } .light-border { border-color: #ddd; } .stable, a.stable { color: #f8f8f8; } .stable-bg { background-color: #f8f8f8; } .stable-border { border-color: #b2b2b2; } .positive, a.positive { color: #494949; } .positive-bg { background-color: #494949; } .positive-border { border-color: #303030; } .calm, a.calm { color: #11c1f3; } .calm-bg { background-color: #11c1f3; } .calm-border { border-color: #0a9dc7; } .assertive, a.assertive { color: #ef473a; } .assertive-bg { background-color: #ef473a; } .assertive-border { border-color: #e42112; } .balanced, a.balanced { color: #33cd5f; } .balanced-bg { background-color: #33cd5f; } .balanced-border { border-color: #28a54c; } .energized, a.energized { color: #ffc900; } .energized-bg { background-color: #ffc900; } .energized-border { border-color: #e6b500; } .royal, a.royal { color: #fab915; } .royal-bg { background-color: #fab915; } .royal-border { border-color: #e1a305; } .dark, a.dark { color: #444; } .dark-bg { background-color: #444; } .dark-border { border-color: #111; } [collection-repeat] { /* Position is set by transforms */ left: 0 !important; top: 0 !important; position: absolute !important; z-index: 1; } .collection-repeat-container { position: relative; z-index: 1; } .collection-repeat-after-container { z-index: 0; display: block; /* when scrolling horizontally, make sure the after container doesn't take up 100% width */ } .collection-repeat-after-container.horizontal { display: inline-block; } [ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak, .ng-hide:not(.ng-hide-animate) { display: none !important; } /** * Platform * -------------------------------------------------- * Platform specific tweaks */ .platform-ios.platform-cordova:not(.fullscreen) .bar-header:not(.bar-subheader) { height: 64px; height: calc(constant(safe-area-inset-top) + 44px); height: calc(env(safe-area-inset-top) + 44px); } .platform-ios.platform-cordova:not(.fullscreen) .bar-header:not(.bar-subheader).item-input-inset .item-input-wrapper { margin-top: 19px !important; } .platform-ios.platform-cordova:not(.fullscreen) .bar-header:not(.bar-subheader) > * { margin-top: 20px; margin-top: constant(safe-area-inset-top); margin-top: env(safe-area-inset-top); } .platform-ios.platform-cordova:not(.fullscreen) .bar-header { padding-left: calc( constant(safe-area-inset-left) + 5px); padding-left: calc(env(safe-area-inset-left) + 5px); padding-right: calc(constant(safe-area-inset-right) + 5px); padding-right: calc(env(safe-area-inset-right) + 5px); } .platform-ios.platform-cordova:not(.fullscreen) .bar-header .buttons:last-child { right: calc(constant(safe-area-inset-right) + 5px); right: calc(env(safe-area-inset-right) + 5px); } .platform-ios.platform-cordova:not(.fullscreen) .has-tabs, .platform-ios.platform-cordova:not(.fullscreen) .bar-footer.has-tabs { bottom: calc(constant(safe-area-inset-bottom) + 49px); bottom: calc(env(safe-area-inset-bottom) + 49px); } .platform-ios.platform-cordova:not(.fullscreen) .tabs-top > .tabs, .platform-ios.platform-cordova:not(.fullscreen) .tabs.tabs-top { top: 64px; } .platform-ios.platform-cordova:not(.fullscreen) .tabs { padding-bottom: constant(safe-area-inset-bottom); padding-bottom: env(safe-area-inset-bottom); height: calc(constant(safe-area-inset-bottom) + 49px); height: calc(env(safe-area-inset-bottom) + 49px); } .platform-ios.platform-cordova:not(.fullscreen) .has-header, .platform-ios.platform-cordova:not(.fullscreen) .bar-subheader { top: 64px; top: calc(constant(safe-area-inset-top) + 44px); top: calc(env(safe-area-inset-top) + 44px); } .platform-ios.platform-cordova:not(.fullscreen) .has-subheader { top: 108px; top: calc(constant(safe-area-inset-top) + 88px); top: calc(env(safe-area-inset-top) + 88px); } .platform-ios.platform-cordova:not(.fullscreen) .has-header.has-tabs-top { top: 113px; top: calc(93px + constant(safe-area-inset-top)); top: calc(93px + env(safe-area-inset-top)); } .platform-ios.platform-cordova:not(.fullscreen) .has-header.has-subheader.has-tabs-top { top: 157px; top: calc(137px + constant(safe-area-inset-right)); top: calc(137px + env(safe-area-inset-right)); } .platform-ios.platform-cordova .popover .bar-header:not(.bar-subheader) { height: 44px; } .platform-ios.platform-cordova .popover .bar-header:not(.bar-subheader).item-input-inset .item-input-wrapper { margin-top: -1px; } .platform-ios.platform-cordova .popover .bar-header:not(.bar-subheader) > * { margin-top: 0; } .platform-ios.platform-cordova .popover .has-header, .platform-ios.platform-cordova .popover .bar-subheader { top: 44px; } .platform-ios.platform-cordova .popover .has-subheader { top: 88px; } .platform-ios.platform-cordova.status-bar-hide { margin-bottom: 20px; } @media (orientation: landscape) { .item { padding: 16px calc(constant(safe-area-inset-right) + 16px); } .item .badge { right: calc(constant(safe-area-inset-right) + 32px); } .item-icon-left { padding-left: calc(constant(safe-area-inset-left) + 54px); } .item-icon-left .icon { left: calc(constant(safe-area-inset-left) + 11px); } .item-icon-right { padding-right: calc(constant(safe-area-inset-right) + 54px); } .item-icon-right .icon { right: calc(constant(safe-area-inset-right) + 11px); } .item-complex, a.item.item-complex, button.item.item-complex { padding: 0; } .item-complex .item-content, a.item.item-complex .item-content, button.item.item-complex .item-content { padding: 16px calc(constant(safe-area-inset-right) + 49px) 16px calc(constant(safe-area-inset-left) + 16px); } .item-left-edit.visible.active { -webkit-transform: translate3d(calc(constant(safe-area-inset-left) + 8px), 0, 0); transform: translate3d(calc(constant(safe-area-inset-left) + 8px), 0, 0); } .list-left-editing .item-left-editable .item-content, .item-left-editing.item-left-editable .item-content { -webkit-transform: translate3d(calc(constant(safe-area-inset-left) + 50px), 0, 0); transform: translate3d(calc(constant(safe-area-inset-left) + 50px), 0, 0); } .item-right-edit { right: constant(safe-area-inset-right); right: env(safe-area-inset-right); } .platform-ios.platform-browser.platform-ipad { position: fixed; } } .platform-c:not(.enable-transitions) * { -webkit-transition: none !important; transition: none !important; } .slide-in-up { -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } .slide-in-up.ng-enter, .slide-in-up > .ng-enter { -webkit-transition: all cubic-bezier(0.1, 0.7, 0.1, 1) 400ms; transition: all cubic-bezier(0.1, 0.7, 0.1, 1) 400ms; } .slide-in-up.ng-enter-active, .slide-in-up > .ng-enter-active { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slide-in-up.ng-leave, .slide-in-up > .ng-leave { -webkit-transition: all ease-in-out 250ms; transition: all ease-in-out 250ms; } @-webkit-keyframes scaleOut { from { -webkit-transform: scale(1); opacity: 1; } to { -webkit-transform: scale(0.8); opacity: 0; } } @keyframes scaleOut { from { transform: scale(1); opacity: 1; } to { transform: scale(0.8); opacity: 0; } } @-webkit-keyframes superScaleIn { from { -webkit-transform: scale(1.2); opacity: 0; } to { -webkit-transform: scale(1); opacity: 1; } } @keyframes superScaleIn { from { transform: scale(1.2); opacity: 0; } to { transform: scale(1); opacity: 1; } } [nav-view-transition="ios"] [nav-view="entering"], [nav-view-transition="ios"] [nav-view="leaving"] { -webkit-transition-duration: 200ms; transition-duration: 200ms; -webkit-transition-timing-function: cubic-bezier(0.36, 0.66, 0.04, 1); transition-timing-function: cubic-bezier(0.36, 0.66, 0.04, 1); -webkit-transition-property: opacity, -webkit-transform, box-shadow; transition-property: opacity, transform, box-shadow; } [nav-view-transition="ios"][nav-view-direction="forward"], [nav-view-transition="ios"][nav-view-direction="back"] { background-color: #000; } [nav-view-transition="ios"] [nav-view="active"], [nav-view-transition="ios"][nav-view-direction="forward"] [nav-view="entering"], [nav-view-transition="ios"][nav-view-direction="back"] [nav-view="leaving"] { z-index: 3; } [nav-view-transition="ios"][nav-view-direction="back"] [nav-view="entering"], [nav-view-transition="ios"][nav-view-direction="forward"] [nav-view="leaving"] { z-index: 2; } [nav-bar-transition="ios"] .title, [nav-bar-transition="ios"] .buttons, [nav-bar-transition="ios"] .back-text { -webkit-transition-duration: 200ms; transition-duration: 200ms; -webkit-transition-timing-function: cubic-bezier(0.36, 0.66, 0.04, 1); transition-timing-function: cubic-bezier(0.36, 0.66, 0.04, 1); -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, transform; } [nav-bar-transition="ios"] [nav-bar="active"], [nav-bar-transition="ios"] [nav-bar="entering"] { z-index: 10; } [nav-bar-transition="ios"] [nav-bar="active"] .bar, [nav-bar-transition="ios"] [nav-bar="entering"] .bar { background: transparent; } [nav-bar-transition="ios"] [nav-bar="cached"] { display: block; } [nav-bar-transition="ios"] [nav-bar="cached"] .header-item { display: none; } [nav-view-transition="android"] [nav-view="entering"], [nav-view-transition="android"] [nav-view="leaving"] { -webkit-transition-duration: 200ms; transition-duration: 200ms; -webkit-transition-timing-function: cubic-bezier(0.4, 0.6, 0.2, 1); transition-timing-function: cubic-bezier(0.4, 0.6, 0.2, 1); -webkit-transition-property: -webkit-transform; transition-property: transform; } [nav-view-transition="android"] [nav-view="active"], [nav-view-transition="android"][nav-view-direction="forward"] [nav-view="entering"], [nav-view-transition="android"][nav-view-direction="back"] [nav-view="leaving"] { z-index: 3; } [nav-view-transition="android"][nav-view-direction="back"] [nav-view="entering"], [nav-view-transition="android"][nav-view-direction="forward"] [nav-view="leaving"] { z-index: 2; } [nav-bar-transition="android"] .title, [nav-bar-transition="android"] .buttons { -webkit-transition-duration: 200ms; transition-duration: 200ms; -webkit-transition-timing-function: cubic-bezier(0.4, 0.6, 0.2, 1); transition-timing-function: cubic-bezier(0.4, 0.6, 0.2, 1); -webkit-transition-property: opacity; transition-property: opacity; } [nav-bar-transition="android"] [nav-bar="active"], [nav-bar-transition="android"] [nav-bar="entering"] { z-index: 10; } [nav-bar-transition="android"] [nav-bar="active"] .bar, [nav-bar-transition="android"] [nav-bar="entering"] .bar { background: transparent; } [nav-bar-transition="android"] [nav-bar="cached"] { display: block; } [nav-bar-transition="android"] [nav-bar="cached"] .header-item { display: none; } [nav-swipe="fast"] [nav-view], [nav-swipe="fast"] .title, [nav-swipe="fast"] .buttons, [nav-swipe="fast"] .back-text { -webkit-transition-duration: 50ms; transition-duration: 50ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; } [nav-swipe="slow"] [nav-view], [nav-swipe="slow"] .title, [nav-swipe="slow"] .buttons, [nav-swipe="slow"] .back-text { -webkit-transition-duration: 160ms; transition-duration: 160ms; -webkit-transition-timing-function: linear; transition-timing-function: linear; } [nav-view="cached"], [nav-bar="cached"] { display: none; } [nav-view="stage"] { opacity: 0; -webkit-transition-duration: 0; transition-duration: 0; } [nav-bar="stage"] .title, [nav-bar="stage"] .buttons, [nav-bar="stage"] .back-text { position: absolute; opacity: 0; -webkit-transition-duration: 0s; transition-duration: 0s; } /* Ionic Overrides and Workarounds */ ion-tabs.ion-tabs-transparent { background: none transparent; } ion-nav-bar.hide { display: block !important; } .placeholder-icon:first-child { padding-right: 10px; } .placeholder-icon:last-child { padding-left: 10px; } .item-input-wrapper { background: none transparent; } .item p { color: #667; } .card { margin: 20px 14px; } ion-view.deflash-blue:before, ion-view#view-amount:before, ion-view#view-confirm:before, ion-view#copayers-invitation:before, ion-view#tab-home:before, ion-view#tab-receive:before, ion-view#tab-send:before, ion-view.settings:before, ion-view#bitpayCard:before, ion-view#bitpayCard-intro:before, ion-view#view-address-book:before, ion-view#addresses:before, ion-view#send-feedback:before, ion-view#choose-fee-level:before, ion-view#txp-details:before, ion-view#coinbase:before, ion-view#glidera:before, ion-view#amazon:before, ion-view#mercadolibre:before, ion-view#custom-amount:before { content: " "; display: block; position: absolute; top: 0; left: 0; right: 0; height: 44px; background-color: #fab915; } .platform-ios.platform-cordova:not(.fullscreen) ion-view.deflash-blue:before, .platform-ios.platform-cordova:not(.fullscreen) ion-view#view-amount:before, .platform-ios.platform-cordova:not(.fullscreen) ion-view#view-confirm:before, .platform-ios.platform-cordova:not(.fullscreen) ion-view#copayers-invitation:before, .platform-ios.platform-cordova:not(.fullscreen) ion-view#tab-home:before, .platform-ios.platform-cordova:not(.fullscreen) ion-view#tab-receive:before, .platform-ios.platform-cordova:not(.fullscreen) ion-view#tab-send:before, .platform-ios.platform-cordova:not(.fullscreen) ion-view.settings:before, .platform-ios.platform-cordova:not(.fullscreen) ion-view#bitpayCard:before, .platform-ios.platform-cordova:not(.fullscreen) ion-view#bitpayCard-intro:before, .platform-ios.platform-cordova:not(.fullscreen) ion-view#view-address-book:before, .platform-ios.platform-cordova:not(.fullscreen) ion-view#addresses:before, .platform-ios.platform-cordova:not(.fullscreen) ion-view#send-feedback:before, .platform-ios.platform-cordova:not(.fullscreen) ion-view#choose-fee-level:before, .platform-ios.platform-cordova:not(.fullscreen) ion-view#txp-details:before, .platform-ios.platform-cordova:not(.fullscreen) ion-view#coinbase:before, .platform-ios.platform-cordova:not(.fullscreen) ion-view#glidera:before, .platform-ios.platform-cordova:not(.fullscreen) ion-view#amazon:before, .platform-ios.platform-cordova:not(.fullscreen) ion-view#mercadolibre:before, .platform-ios.platform-cordova:not(.fullscreen) ion-view#custom-amount:before { height: 64px; } .just-a-hint, .icon.bp-arrow-right, .icon.bp-arrow-down, .icon.bp-arrow-up { opacity: 0.2; } .item.item-big-icon-left { padding-left: 74px; } .icon-svg { display: flex; justify-content: center; align-items: center; } .icon-svg > img { background-repeat: no-repeat; background-clip: padding-box; background-size: contain; height: 18px; } .big-icon-svg { padding: 0 7px; } .big-icon-svg > .bg { border-radius: 3px; width: 40px; height: 40px; box-shadow: 0px 6px 12px 0px rgba(0, 0, 0, 0.3); background-repeat: no-repeat; background-clip: padding-box; background-size: 103%; } .big-icon-svg > .bg.green { background: #01d1a2; } .big-icon-svg.theme-circle > .bg { border-radius: 50%; background-size: 85%; background-position: 50%; background-color: #FFFFFF; box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.3); border: 1px solid #faba13; text-align: center; font-size: 30px; } .big-icon-svg.theme-circle > .bg:before { vertical-align: middle; } .big-icon-svg.theme-circle > .bg.icon-shapeshift { background-color: #263e5c; } .big-icon-svg.theme-circle > .bg.icon-buy-bitcoin2 { background-color: #494949; } .big-icon-svg.theme-circle > .bg.icon-reddit-white { background-image: url("../img/icon-reddit-white.svg"); background-color: #ff4500; background-size: 60%; } .big-icon-svg.theme-circle > .bg.icon-twitter-white { background-image: url("../img/icon-twitter-white.svg"); background-color: #1da1f2; background-size: 60%; } .big-icon-svg.theme-circle > .bg.icon-faucet { background-image: url("../img/icon-faucet.svg"); background-size: 70%; } .big-icon-svg.theme-circle-services > .bg { border: 1px solid #191919; } .big-icon-svg.theme-circle-community > .bg { border: 1px solid #FFFFFF; } .wallet-item { padding: 1rem 0 2rem 0; } .wallet-item .name { color: #445; text-align: center; } .wallet-item .big-icon-svg.circle { left: 8px; } .wallet-item .big-icon-svg.circle .bg { border-radius: 3px; width: 70px; height: 70px; padding: .1rem; margin: 0.2rem; box-shadow: 0px 1px 5px rgba(102, 102, 119, 0.1); display: flex; margin: auto; } .wallet-item:before { display: block; position: absolute; width: 100%; height: 1px; background: rgba(221, 221, 221, 0.3); top: 0; right: 0; content: ''; } .loading .spinner svg { margin-top: 0; } .button.button-primary.button-standard, .button.button-secondary.button-standard, .button.button-light.button-standard, .button.button-assertive.button-standard, .onboarding .button.button-primary.button-standard, .onboarding .button.button-secondary.button-standard, .onboarding .button.button-light.button-standard, .onboarding .button.button-assertive.button-standard { width: 85%; max-width: 300px; margin-left: auto; margin-right: auto; display: block; } .button.button-primary, .onboarding .button.button-primary { border-color: transparent; background-color: #494949; color: #ffffff; } .button.button-primary:hover, .onboarding .button.button-primary:hover { color: #ffffff; text-decoration: none; } .button.button-primary.active, .button.button-primary.activated, .onboarding .button.button-primary.active, .onboarding .button.button-primary.activated { border-color: transparent; background-color: #303030; } .button.button-primary.button-clear, .onboarding .button.button-primary.button-clear { border-color: transparent; background: none; box-shadow: none; color: #494949; } .button.button-primary.button-icon, .onboarding .button.button-primary.button-icon { border-color: transparent; background: none; } .button.button-primary.button-outline, .onboarding .button.button-primary.button-outline { border-color: #494949; background: transparent; color: #494949; } .button.button-primary.button-outline.active, .button.button-primary.button-outline.activated, .onboarding .button.button-primary.button-outline.active, .onboarding .button.button-primary.button-outline.activated { background-color: #494949; box-shadow: none; color: #fff; } .button.button-primary.button-standard + .button-standard, .button.button-secondary.button-standard + .button-standard, .button.button-light.button-standard + .button-standard, .button.button-assertive.button-standard + .button-standard, .onboarding .button.button-primary.button-standard + .button-standard, .onboarding .button.button-secondary.button-standard + .button-standard, .onboarding .button.button-light.button-standard + .button-standard, .onboarding .button.button-assertive.button-standard + .button-standard { margin-top: 1rem; } .onboarding .button.button-secondary { border-color: transparent; background-color: #fab915; color: #494949; } .onboarding .button.button-secondary:hover { color: #494949; text-decoration: none; } .onboarding .button.button-secondary.active, .onboarding .button.button-secondary.activated { border-color: transparent; background-color: #d79c05; } .onboarding .button.button-secondary.button-clear { border-color: transparent; background: none; box-shadow: none; color: #494949; } .onboarding .button.button-secondary.button-icon { border-color: transparent; background: none; } .onboarding .button.button-secondary.button-outline { border-color: #494949; background: transparent; color: #494949; } .onboarding .button.button-secondary.button-outline.active, .onboarding .button.button-secondary.button-outline.activated { background-color: #494949; box-shadow: none; color: #fff; } .button.button-secondary { border-color: transparent; background-color: #fab915; color: #494949; } .button.button-secondary:hover { color: #494949; text-decoration: none; } .button.button-secondary.active, .button.button-secondary.activated { border-color: transparent; background-color: #d79c05; } .button.button-secondary.button-clear { border-color: transparent; background: none; box-shadow: none; color: #494949; } .button.button-secondary.button-icon { border-color: transparent; background: none; } .button.button-secondary.button-outline { border-color: #494949; background: transparent; color: #494949; } .button.button-secondary.button-outline.active, .button.button-secondary.button-outline.activated { background-color: #494949; box-shadow: none; color: #fff; } .button-sendmax { font-size: 0.7em !important; display: inline !important; } .button.button-full { display: block; } .button-clear { background: none !important; } .button-skip { padding-top: 15px !important; font-size: 24px !important; } textarea.d-block { display: block; width: 100%; } .center-block { float: none; margin: 0 auto; } .absolute-center { position: absolute; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); top: 50%; left: 50%; } .tabs .tab-item .icon { background-repeat: no-repeat; background-position: center; margin: 6px 0 2px; } .tabs .tab-item .icon.ico-home { background-image: url("../img/tab-icons/ico-home.svg"); } .tabs .tab-item .icon.ico-home-selected { background-image: url("../img/app/tab-icons/ico-home-selected.svg"); } .tabs .tab-item .icon.ico-receive { background-image: url("../img/tab-icons/ico-receive.svg"); } .tabs .tab-item .icon.ico-receive-selected { background-image: url("../img/app/tab-icons/ico-receive-selected.svg"); } .tabs .tab-item .icon.ico-settings { background-image: url("../img/tab-icons/ico-settings.svg"); } .tabs .tab-item .icon.ico-settings-selected { background-image: url("../img/app/tab-icons/ico-settings-selected.svg"); } .tabs .tab-item .icon.ico-scan { background-image: url("../img/tab-icons/ico-scan.svg"); } .tabs .tab-item .icon.ico-scan-selected { background-image: url("../img/app/tab-icons/ico-scan-selected.svg"); } .tabs .tab-item .icon.ico-send { background-image: url("../img/tab-icons/ico-send.svg"); } .tabs .tab-item .icon.ico-send-selected { background-image: url("../img/app/tab-icons/ico-send-selected.svg"); } #tab-home .card > .item-heading, #tab-home .list > .item-heading, #tab-send .card > .item-heading, #tab-send .list > .item-heading { font-weight: 700; } #tab-home .card > .item-heading .icon, #tab-home .list > .item-heading .icon, #tab-send .card > .item-heading .icon, #tab-send .list > .item-heading .icon { color: #667; } #view-add .item { margin-bottom: 10px; margin-left: 10px; margin-right: 10px; padding-top: 2rem; padding-bottom: 2rem; border: none; padding-left: 90px; } #view-add .item:first-child { margin-top: 25px; } #view-add .add-type { color: #445; } #view-add .bg { background-color: #494949; height: 50px; width: 50px; padding: 4px; } #view-add .bg.join { padding: 10px; } #view-amount .recipient-label { font-size: 14px; padding-bottom: 0; color: #667; } #view-amount .item-no-bottom-border + .item { border-top: 0; } #view-amount .icon-bitpay-card { background-image: url("../img/icon-bitpay.svg"); } #view-amount .icon-amazon { background-image: url("../img/icon-amazon.svg"); } @media (max-width: 480px) { #view-amount .bitcoin-address { font-size: 13px; padding-left: 48px; } #view-amount .bitcoin-address .icon { left: 8px; font-size: 24px; } #view-amount .bitcoin-address .big-icon-svg { left: 5px; } #view-amount .bitcoin-address .big-icon-svg > .bg { width: 30px; height: 30px; box-shadow: none; } } @media (max-width: 320px) { #view-amount .bitcoin-address > span:last-child { margin-left: -2px; } } #view-amount .send-gravatar { left: 11px; position: absolute; top: 10px; } #view-amount .amount span input { display: inline; width: 120px; } #view-amount .amount-pane-recipient { position: absolute; top: 95px; bottom: 0; width: 100%; background-color: #fff; padding: 0 16px; } #view-amount .amount-pane-recipient .amount-bar { padding: 24px 0; font-size: 18px; } @media (max-height: 480px) { #view-amount .amount-pane-recipient .amount-bar { padding: 0px; } } @media (max-width: 320px) { #view-amount .amount-pane-recipient .amount-bar { padding: 0px; } } #view-amount .amount-pane-recipient .amount-bar .title { float: left; padding-top: 10px; color: #445; font-weight: bold; } @media (max-height: 480px) { #view-amount .amount-pane-recipient .amount-bar .title { padding: 0px; } } @media (max-height: 480px) { #view-amount .amount-pane-recipient .amount-bar { padding-top: 3px; } } #view-amount .amount-pane-recipient .amount { display: flex; flex-direction: column; justify-content: center; flex-grow: 1; position: absolute; bottom: 254px; top: 66px; } #view-amount .amount-pane-recipient .amount .light { color: #9b9bab; } @media (max-height: 480px) { #view-amount .amount-pane-recipient .amount { top: 45px; } } @media (max-width: 320px) { #view-amount .amount-pane-recipient .amount { bottom: 276px; top: 60px; } #view-amount .amount-pane-recipient .amount > div { display: inline-block; } #view-amount .amount-pane-recipient .amount > div:first-child { display: inherit; } } #view-amount .amount-pane-no-recipient { position: absolute; top: 0; bottom: 0; width: 100%; background-color: #fff; padding: 0 16px; } #view-amount .amount-pane-no-recipient .amount-bar { padding: 24px 0; font-size: 18px; } #view-amount .amount-pane-no-recipient .amount-bar .title { padding-top: 10px; color: #445; font-weight: bold; } #view-amount .amount-pane-no-recipient .amount-bar .title .limits { margin-top: 10px; color: #9b9bab; font-size: 12px; } #view-amount .amount-pane-no-recipient .amount-bar .title .select { margin: 10px 1px; } #view-amount .amount-pane-no-recipient .amount { display: flex; flex-direction: column; justify-content: center; flex-grow: 1; position: absolute; bottom: 254px; top: 66px; } #view-amount .amount-pane-no-recipient .amount .light { color: #9b9bab; } #view-amount .amount { padding-top: 10px; padding-bottom: 10px; } #view-amount .amount .icon-toggle { font-size: 1.2em; width: auto; margin: 0.8em auto; border: 1px solid #f2f2f2; color: #445; border-radius: 3px; padding: 0 10px; cursor: pointer; } @media (max-height: 280px) { #view-amount .amount .icon-toggle { margin: 0.1em auto; } } #view-amount .amount__editable--minimize { font-size: 22px; } #view-amount .amount__editable--standard { font-size: 42px; } @media (max-height: 480px) { #view-amount .amount__editable--standard { font-size: 26px; padding-top: 10px; } } #view-amount .amount__editable--placeholder { color: #9b9bab; } #view-amount .amount__number { color: #445; } #view-amount .amount__currency-toggle { border: 1px solid #f2f2f2; color: #445; border-radius: 3px; padding: 0 10px; cursor: pointer; font-size: .6em; position: relative; top: -3px; line-height: 1; } @media (max-width: 320px) { #view-amount .amount__currency-toggle { line-height: 30px; height: 30px; } } #view-amount .amount__currency-toggle-mobile { border: 1px solid #f2f2f2; color: #445; border-radius: 3px; cursor: pointer; position: relative; line-height: 1; } @media (max-width: 320px) { #view-amount .amount__currency-toggle-mobile { line-height: 30px; height: 30px; } } #view-amount .amount__results--minimize { font-size: 12px; } #view-amount .amount__results--standard { font-size: 18px; padding: 10px 0; } #view-amount .amount__results--placeholder { color: #9b9bab; } #view-amount .amount__result { color: #9b9bab; font-size: .9em; line-height: 1; } @media (max-height: 480px) { #view-amount .amount__result { margin-bottom: 0; } } #view-amount .amount__result-equiv { color: #667; font-size: 1.2em; } @media (max-height: 480px) { #view-amount .amount__result-equiv { margin-top: 0; font-size: 16px; } } #view-amount .scroll-content { display: flex; flex-direction: column; } #view-amount .scroll-content .send-amount { flex: 1 1 auto; display: flex; flex-direction: column; justify-content: center; } #view-amount .scroll-content .send-amount .send-amount-tool { flex: 0 1 auto; } #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input { text-align: center; position: relative; padding: 10px 30px; } #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .text-selectable { -webkit-user-select: text; -moz-user-select: text; -ms-user-select: text; user-select: text; } #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .primary-amount input, #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .primary-amount .unit, #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .primary-amount .primary-amount-display { font-size: 1.8em; } @media (min-width: 375px) { #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .primary-amount input, #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .primary-amount .unit, #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .primary-amount .primary-amount-display { font-size: 2.1em; } } @media (min-width: 414px) { #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .primary-amount input, #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .primary-amount .unit, #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .primary-amount .primary-amount-display { font-size: 2.4em; } } #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .primary-amount.long input, #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .primary-amount.long .unit, #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .primary-amount.long .primary-amount-display { font-size: 1.6em; } @media (min-width: 375px) { #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .primary-amount.long input, #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .primary-amount.long .unit, #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .primary-amount.long .primary-amount-display { font-size: 1.8em; } } @media (min-width: 414px) { #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .primary-amount.long input, #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .primary-amount.long .unit, #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .primary-amount.long .primary-amount-display { font-size: 2em; } } #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .primary-amount.very-long input, #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .primary-amount.very-long .unit, #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .primary-amount.very-long .primary-amount-display { font-size: 0.9em; } @media (min-width: 375px) { #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .primary-amount.very-long input, #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .primary-amount.very-long .unit, #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .primary-amount.very-long .primary-amount-display { font-size: 1.3em; } } @media (min-width: 414px) { #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .primary-amount.very-long input, #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .primary-amount.very-long .unit, #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .primary-amount.very-long .primary-amount-display { font-size: 1.4em; } } #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .primary-amount input { border: 0; padding: 0; white-space: normal; background: none; line-height: 1; box-sizing: content-box; display: inline-block; vertical-align: middle; margin: 0; height: 1em; margin-right: 5px; font-family: 'ProximaNova'; } #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .primary-amount .unit, #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .primary-amount .primary-amount-display { display: inline-block; vertical-align: middle; line-height: 1em; } #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .primary-amount .unit { font-weight: bold; } #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .primary-amount .primary-amount-display { margin-right: 5px; word-break: break-all; } #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .switch-currencies { position: absolute; right: 0; top: 50%; transform: translate(0, -50%); padding: 15px; } #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-tool-input .switch-currencies img { width: 18px; } #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-actions { margin-top: 15px; display: flex; align-items: center; justify-content: center; } #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-actions .button { flex: 1 1 auto; line-height: 1.2em; } #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-actions .button + .button { margin-left: 10px; } #view-amount .scroll-content .send-amount .send-amount-tool .send-amount-actions .button span { display: flex; align-items: center; justify-content: center; } #view-amount .scroll-content .button.no-margin { margin: 0; } #view-amount .scroll-content .notification-warning { display: block; padding: .75rem 1.25rem; color: #856404; background-color: #fff3cd; border: 1px solid #ffeeba; line-height: 1.4em; margin-bottom: 20px; } #view-amount .scroll-content .keypad-container { position: relative; } #view-amount .scroll-content .keypad-container .keypad { text-align: center; font-size: 18px; font-weight: lighter; position: absolute; bottom: 0; width: 100%; color: #667; } @media (min-height: 667px) { #view-amount .scroll-content .keypad-container .keypad { font-size: 24px; } } #view-amount .scroll-content .keypad-container .keypad .row { padding: 0 !important; margin: 0 !important; } #view-amount .scroll-content .keypad-container .keypad .col { line-height: 38px; } @media (min-height: 667px) { #view-amount .scroll-content .keypad-container .keypad .col { line-height: 45px; } } #view-amount .scroll-content .keypad-container .keypad .row:last-child .col { padding-bottom: 10px; } #view-amount .scroll-content .keypad-container .keypad .operator { background-color: #f2f2f2; font-weight: normal; cursor: pointer; } #view-amount .scroll-content .keypad-container .keypad .operator:active { background-color: #9b9bab; } #view-amount .scroll-content .keypad-container .keypad .operator-send { font-weight: bolder; color: #fff; background-color: #494949; font-size: 36px; cursor: pointer; } #view-amount .scroll-content .keypad-container .keypad .operator-send:active { background-color: #eaeaea; } #view-amount .scroll-content .keypad-container .keypad .digit { cursor: pointer; border-top: 1px solid #f2f2f2; border-left: 1px solid #f2f2f2; transition: all 0.1s ease; } #view-amount .scroll-content .keypad-container .keypad .digit:active { background-color: #f2f2f2; } @media (max-height: 480px) { #view-amount .scroll-content .keypad-container .keypad { font-size: 12px; } } #view-confirm { background-color: #ffffff; } #view-confirm .item-note { float: none; } #view-confirm .item-note .fee-rate { display: inline-block; } #view-confirm .item-note .fee-rate .warn { color: red; } #view-confirm .icon-amazon { background-image: url("../img/icon-amazon.svg"); } #view-confirm .tx-details-content > .scroll { padding-bottom: .25rem; } #view-confirm .gravatar-contact { display: flex; margin-left: -3px; } #view-confirm .gravatar-contact span { margin: 5px 0 0 8px; } #view-confirm .wallet-name { margin-top: -3px; } #view-confirm .toggle { cursor: pointer; } #copayers-invitation .button-share { color: #fff; box-shadow: none; border-color: transparent; background: transparent; padding: 0 10px; } #copayers-invitation .button-share .icon:before { font-size: 26px; } #copayers-invitation .button-cancel { margin-top: 15px; background: transparent; border: none; font-size: 12px; color: #ef473a; } #copayers-invitation .button-cancel i.icon { vertical-align: middle; padding-left: 5px; } #copayers-invitation .copayers-secret { text-align: center; font-size: 12px; margin: 10px; white-space: -moz-pre-wrap !important; white-space: -pre-wrap; white-space: -o-pre-wrap; white-space: pre-wrap; word-wrap: break-word; white-space: -webkit-pre-wrap; word-break: break-all; white-space: normal; } #starting { background: #fab915; background: -moz-linear-gradient(top, #fab915 0%, #fab915 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, #fab915), color-stop(100%, #fab915)); background: -webkit-linear-gradient(top, #fab915 0%, #fab915 100%); background: -o-linear-gradient(top, #fab915 0%, #fab915 100%); background: -ms-linear-gradient(top, #fab915 0%, #fab915 100%); background: linear-gradient(to bottom, #fab915 0%, #fab915 100%); color: #fff; height: 100%; } #starting .scroll-content { display: table !important; width: 100% !important; height: 100% !important; } #starting .scroll { display: table-cell; vertical-align: middle; text-align: center; } #starting .block-spinner { display: block; } #tab-home .icon-create-wallet { background-color: #4A90E2; } #tab-home .icon-buy-bitcoin { background-image: url("../img/app/icon-bitcoin.png"); background-color: #fab915; } #tab-home .icon-bitpay-card { background-image: url("../img/icon-card.svg"); background-color: #1e3186; } #tab-home .icon-gift { background-image: url("../img/icon-gift.svg"); } #tab-home .icon-amazon { background-image: url("../img/icon-amazon.svg"); } #tab-home .icon-ml { background-image: url("../img/mercado-libre/icon-ml.svg"); background-position: center; background-size: 85%; } #tab-home .bg.wallet { padding: .25rem; } #tab-home .card .item { color: #444; border-top: none; padding-bottom: 1rem; padding-top: 1rem; } #tab-home .card .item.item-extra-padding { padding-top: 1.5rem; padding-bottom: 1.5rem; } #tab-home .card .item-sub:first-child:before { width: 95%; } #tab-home .card .item-sub:before { display: block; position: absolute; width: 75%; height: 1px; background: rgba(221, 221, 221, 0.3); top: 0; right: 0; content: ''; } @media (min-width: 450px) { #tab-home .card .item-sub:before { width: 90%; } } #tab-home .wallet-coin-logo { vertical-align: middle; margin-right: 5px; } #tab-home .wallet-details__item.item { padding-top: 0; padding-bottom: 0; } #tab-home .wallet-details__item.item .wallet-details__tx-icon { background: #fff; border-radius: 50px; } #tab-home .next-step.item, #tab-home .service.item { padding-top: 27px; padding-bottom: 27px; } #tab-home .homeTip { text-align: center; } #tab-home .homeTip > .item-heading { background: 0 none; } #tab-home .homeTip .item { border-style: none; } #tab-home .homeTip .title { font-size: 20px; font-weight: bold; color: #445; } #tab-home .homeTip > .subtitle { font-size: 1rem; line-height: 1.5em; font-weight: 300; color: #445; margin: 20px 3em 2.5em; } #tab-home .homeTip .big-icon-svg .bg.green { padding: 0 10px; box-shadow: none; } #tab-home .icon.close-home-tip { color: #666; font-size: 38px; height: auto; top: 8px; } #tab-home .tab-home__logo { height: 18px; position: relative; top: 3px; } #tab-home .tab-home__wallet__multisig-number { font-size: .8rem; font-weight: 300; color: #9b9bab; } #tab-home .tab-home__wallet__status-icon { font-size: 18px; margin-left: 5px; position: relative; top: 1px; color: #9b9bab; } #tab-home .release { text-align: center; } #tab-home .release .item { width: 100%; } #tab-home .release .title { font-weight: 700; color: #444; } #tab-home .release .button { width: 100%; border: none; } #tab-home .release .big-icon-svg { padding-top: 2rem; padding-bottom: 0; } #tab-home .release .big-icon-svg > .bg { box-shadow: none; } #tab-home .badge { top: 11px; } #tab-receive .button-share { color: #fff; box-shadow: none; border-color: transparent; background: transparent; padding: 0 10px; } #tab-receive .button-share .icon:before { font-size: 26px; } #tab-receive .button-request { margin-top: 10px; background: transparent; border: none; font-size: 12px; color: #aaa; } #tab-receive .button-request i.icon { vertical-align: middle; padding-left: 5px; } #tab-receive .button-address { margin-top: 10px; background: transparent; border: none; font-size: 12px; color: #aaa; } #tab-receive .address { background: #fff; overflow: auto; height: 100%; } #tab-receive .address-info { padding-top: 22vh; padding-bottom: 17vh; text-align: center; } @media (max-height: 800px) { #tab-receive .address-info { padding-top: 17vh; } } @media (max-height: 700px) { #tab-receive .address-info { padding-top: 14vh; } } @media (max-height: 600px) { #tab-receive .address-info { padding-top: 7vh; } } #tab-receive .address-info .address-label { margin-top: 5%; font-size: 13px; } #tab-receive .address .incomplete .title { padding-top: 10%; font-size: 25px; color: #444; text-align: center; } #tab-receive .address .incomplete .subtitle { padding: 20px; color: #444; margin-top: 10%; text-align: center; } #tab-receive .backup { position: absolute; top: 0; width: 100%; cursor: pointer; background-color: orange; color: #fff; text-align: center; padding: 5px 0; } #tab-receive .backup i { margin: 0 10px; } #tab-receive .wallet-selector { position: absolute; bottom: 0; width: 100%; } #tab-receive .payment-received-container { margin: 0 20px; } #tab-receive .payment-received-container .payment-received-amount { font-size: 1.8em; display: block; margin: 20px auto; } #tab-receive .payment-received-container .payment-received-currency { text-transform: uppercase; } #tab-scan { color: #fff; text-align: center; background: transparent none; } #tab-scan .bar-header { opacity: .9; } #tab-scan svg#QR-scanner-guides path.st1 { stroke: #494949; } #tab-scan .zero-state-cta { padding-bottom: 6vh; } #tab-scan-has-problems, #tab-scan-loading-camera { background-color: #fab915; } #tab-scan-loading-camera { height: 100%; width: 100%; } #tab-scan-camera-ready { background: none transparent; } #tab-scan-camera-ready .scanner-controls { width: 100%; text-align: center; bottom: 0; position: absolute; } #tab-scan-camera-ready .guides { display: flex; position: absolute; height: 100%; width: 100%; align-items: center; justify-content: center; top: 0; left: 0; } #tab-scan-camera-ready .qr-scan-guides { width: 60%; max-width: 400px; margin-bottom: 8em; max-height: 50%; } #tab-scan-camera-ready .icon-flash, #tab-scan-camera-ready .icon-camera-toggle { border-radius: 50%; width: 4em; height: 4em; background-color: rgba(13, 13, 13, 0.79); background-repeat: no-repeat; background-clip: padding-box; background-size: 100%; display: inline-block; margin: 2em 1em; cursor: pointer; } body:not(.platform-cordova) #tab-scan-camera-ready .icon-flash:hover, body:not(.platform-cordova) #tab-scan-camera-ready .icon-camera-toggle:hover { background-color: rgba(31, 40, 78, 0.79); } #tab-scan-camera-ready .icon-flash.active, #tab-scan-camera-ready .icon-flash:active, #tab-scan-camera-ready .icon-camera-toggle.active, #tab-scan-camera-ready .icon-camera-toggle:active { background-color: rgba(100, 124, 232, 0.79); } #tab-scan-camera-ready .icon-flash { background-image: url("../img/icon-flash.svg"); } #tab-scan-camera-ready .icon-camera-toggle { background-image: url("../img/icon-camera-toggle.svg"); } #cordova-plugin-qrscanner-still, #cordova-plugin-qrscanner-video-preview { background-color: #fab915 !important; } #tab-send .input input { width: 100%; height: auto; } #tab-send .input.item { height: 55px; } #tab-send .input i.left { padding-left: 15px; } #tab-send .input i.qr { cursor: pointer; cursor: hand; padding-right: 5px; } #tab-send .qr-scan-icon { cursor: pointer; cursor: hand; border-left: 1px solid #e4e4e4; padding-left: 10px; } #tab-send .qr-icon { line-height: 20px; } #tab-send .zero-state-cta { padding-bottom: 3vh; left: 0; } #tab-send .send-heading { font-size: 14px; font-weight: bold; padding: 0 0 16px 0; border: none; } #tab-send .send-header-wrapper { padding: 10px; background-color: white; box-shadow: 0px 5px 10px 0px #cccccc; } #tab-send .search-wrapper { background-color: #f2f2f2; border-radius: 3px; border: none; } #tab-send .search-wrapper .svg#Bitcoin_Symbol { width: 14px; } #tab-send .search-wrapper .svg#Bitcoin_Symbol .st0 { fill: #cccccc; } #tab-send .search-wrapper.focus { background: none; } #tab-send .search-wrapper.focus .svg#Bitcoin_Symbol { display: none; } #tab-send .search-wrapper.focus .search-input { padding-left: 30px; } #tab-send .search-wrapper.focus .search-input:focus::-webkit-input-placeholder { opacity: 0; } #tab-send .abs-v-center { position: absolute; top: 50%; transform: translateY(-50%); } #tab-send .search-input { background-color: transparent; padding-left: 30px; } #tab-send .separator-left { border-left: 1px solid #d9d9df; padding-left: 10px; height: 70%; } #tab-send .bitcoin-address { border-top: none; padding-bottom: .5rem; } @media (max-width: 480px) { #tab-send .bitcoin-address input { font-size: 14px; } } #tab-send .bitcoin-address .icon { line-height: 31px; padding-top: 2px; padding-bottom: 1px; } #tab-send .show-more { text-align: center; padding: 20px; font-size: 16px; color: #387ef5; font-weight: bold; } #tab-send .sendTip { text-align: center; } #tab-send .sendTip > .item-heading { margin-top: 10px; background: 0 none; } #tab-send .sendTip img { content: url("../img/app/tab-icons/ico-send-selected.svg"); } #tab-send .sendTip .item { border-style: none; } #tab-send .sendTip > .title { font-size: 20px; font-weight: bold; color: #445; margin: 20px 10px; } #tab-send .sendTip > .subtitle { font-size: 1rem; line-height: 1.5em; font-weight: 300; color: #445; margin: 20px 1em 2.5em; } #tab-send .sendTip .big-icon-svg .bg.green { padding: 0 10px; box-shadow: none; } #tab-send .list .item { color: #444; border-top: none; padding-top: 1.5rem; padding-bottom: 1.5rem; } #tab-send .list .item .big-icon-svg { left: 5px; } #tab-send .list .item .big-icon-svg > .bg { width: 30px; height: 30px; box-shadow: none; } #tab-send .list .item:before { display: block; position: absolute; width: 80%; height: 1px; background: rgba(221, 221, 221, 0.3); top: 0; right: 0; content: ''; } #tab-send .list .item.item-divider { color: rgba(74, 74, 74, 0.8); } #tab-send .list .item.item-heading:before { top: 99%; width: 100%; } #tab-send .list .item:nth-child(2):before { width: 0; } #tab-send .list .item .item-note { color: #3a3a3a; } #tab-send .scroll { height: 100%; } .settings .icon-bitpay { background-image: url("../img/icon-bitpay.svg"); } .settings .warning { color: #bb331a; } .settings .centered { width: 100%; text-align: center; } .settings .disabled { color: #9b9bab; } .settings .item { color: #445; border-color: rgba(221, 221, 221, 0.3); } .settings .has-comment { border-bottom: 0 none; } .settings .scan-label { cursor: pointer; cursor: hand; color: #494949; font-weight: bold; } .settings .comment { padding: 15px; background-color: #fff; font-size: 0.9em; color: #667; } .settings .comment .text { padding-left: 25px; } .settings .comment .icon { position: absolute; } .settings .comment .icon img { width: 20px; } .settings .comment a { cursor: pointer; } .settings-explanation, .settings-button-group { padding: 0 1rem; margin: 1rem 0; } .settings-heading { font-size: 17px; color: #445; margin: 1rem 0; } .settings-description { color: #667; margin: 1rem 0; font-size: 0.9em; } .settings-description-disabled { font-size: 0.9em; color: cadetblue; text-decoration: none; } .settings .setting-title, .settings .setting-value { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .settings .setting-value { color: #9b9bab; font-size: 14px; } .settings .settings-input-group { background-color: #fff; } .settings .settings-input-group .item-stacked-label { padding: 1rem; } .settings .settings-input-group .input-label { text-transform: uppercase; font-size: 12px; font-weight: bold; } .settings .settings-list .item { color: #445; padding-top: 1.3rem; padding-bottom: 1.3rem; } .settings .settings-list .item.has-setting-value { padding-top: .65rem; padding-bottom: .65rem; } .settings .settings-list .item.item-divider { color: #667; padding-bottom: .5rem; font-size: .9rem; } .settings .settings-list .item .icon { color: #9b9bab; } .settings .settings-list .item-note { color: #9b9bab; } .settings .settings-list .item-toggle .toggle, .settings .settings-list .item-button-right > .button { top: 16px; } .settings .settings-list .toggle-small.item-toggle .toggle, .settings .settings-list .item-button-right > .button { top: 25px; } .settings .settings-list .item-button-right > .button { font-size: 16px; } .settings input[type="password"] { border: none; margin-left: -5px; padding-left: 4px; } .settings input[type="password"].incorrect { margin-right: 10px; border: 1px solid; color: #C90505; } .settings input[type="password"].correct { margin-right: 10px; border: 1px solid; color: #00901B; } .settings .log-bg { background: white; } .settings .log-entry { font-size: 12px; line-height: 18px; border: none; } .settings .log-timestamp { font-weight: bold; } .settings .log-level { font-weight: bold; } .settings .alt-currency-radio .item-content { padding-right: 16px; } .settings .alt-currency-radio .radio-icon { display: none; } #tab-settings .list .item .big-icon-svg > .bg { width: 20px; height: 20px; border-radius: 0; box-shadow: none; } #tab-settings .list .item .big-icon-svg > .bch { background-color: #9b9bab; border-radius: 1rem; } #tab-settings .list .item .big-icon-svg > .bch-enabled { background-color: #ff9900 !important; } #tab-settings .list .item .big-icon-svg.circle { left: 8px; } #tab-settings .list .item .big-icon-svg.circle .bg { border-radius: 3px; width: 25px; height: 25px; padding: .1rem; box-shadow: 0px 1px 5px rgba(102, 102, 119, 0.1); } #tab-settings .list .item:before { display: block; position: absolute; width: 100%; height: 1px; background: rgba(221, 221, 221, 0.3); top: 0; right: 0; content: ''; } #tab-settings .list .item.item-heading:before { top: 99%; } #tab-settings .list .item:nth-child(2):before { width: 0; } #tab-settings .item-radio .radio-icon { font-size: 18px; } #settings-fee .estimates { min-height: 6rem; font-size: 15px; color: #445; margin-bottom: .5rem; } #settings-fee .fee-minutes, #settings-fee .fee-rate { font-weight: bold; } #settings-fee .fee-policies { border-color: #fff; border-style: solid; } .settings-color-name { margin-left: 1rem; } .settings-color-block { display: inline-block; width: 24px; height: 24px; border-radius: 50%; box-shadow: 0px 0px 10px; float: left; } #settings-tos p { margin-bottom: 1rem; } /* * Generate wallet colors from color map */ .wallet-color-count { content: "15"; } /* background-color and color defaults should be the same */ .wallet-background-color-default { background-color: #fab915; } .wallet-color-default { color: #fab915; } .cashwallet-color-default { color: #26B03C; } /* generate classes for all colors */ .wallet-color-0 { background: #dd4b39; } .wallet-color-0:before { content: "Cinnabar"; margin-left: 2.4rem; } .wallet-color-1 { background: #f38f12; } .wallet-color-1:before { content: "Carrot Orange"; margin-left: 2.4rem; } .wallet-color-2 { background: #faa77f; } .wallet-color-2:before { content: "Light Salmon"; margin-left: 2.4rem; } .wallet-color-3 { background: #d0b136; } .wallet-color-3:before { content: "Metallic Gold"; margin-left: 2.4rem; } .wallet-color-4 { background: #9edd72; } .wallet-color-4:before { content: "Feijoa"; margin-left: 2.4rem; } .wallet-color-5 { background: #29bb9c; } .wallet-color-5:before { content: "Shamrock"; margin-left: 2.4rem; } .wallet-color-6 { background: #26B03C; } .wallet-color-6:before { content: "Dollar Green"; margin-left: 2.4rem; } .wallet-color-7 { background: #fab915; } .wallet-color-7:before { content: "Observatory"; margin-left: 2.4rem; } .wallet-color-8 { background: #77dada; } .wallet-color-8:before { content: "Turquoise Blue"; margin-left: 2.4rem; } .wallet-color-9 { background: #4a90e2; } .wallet-color-9:before { content: "Cornflower Blue"; margin-left: 2.4rem; } .wallet-color-10 { background: #484ed3; } .wallet-color-10:before { content: "Free Speech Blue"; margin-left: 2.4rem; } .wallet-color-11 { background: #9b59b6; } .wallet-color-11:before { content: "Deep Lilac"; margin-left: 2.4rem; } .wallet-color-12 { background: #e856ef; } .wallet-color-12:before { content: "Free Speech Magenta"; margin-left: 2.4rem; } .wallet-color-13 { background: #ff599e; } .wallet-color-13:before { content: "Brilliant Rose"; margin-left: 2.4rem; } .wallet-color-14 { background: #7a8c9e; } .wallet-color-14:before { content: "Light Slate Grey"; margin-left: 2.4rem; } .wallet-balance__amount { font-size: 16px; } .wallet-balance__amount--total { color: #667; } .wallet-balance__amount--available { color: #09C286; } .wallet-balance__amount--confirming { color: #FF9900; } .wallet-balance__amount--locked { color: #FF9900; } .wallet-balance__amount--alternative { color: #9b9bab; font-size: 14px; } .wallet-balance__title { flex-grow: 1; color: #445; overflow: hidden; } .wallet-balance__icon { float: left; margin-right: 1rem; color: #9b9bab; font-size: 24px; } .wallet-balance__list { background: #f5f5f5; } .wallet-balance .item { display: flex; align-items: center; background: #fff; padding-left: 1rem; } .wallet-balance__item { display: flex; align-items: center; background: #fff; padding: 0; margin: 0; border: 0; padding-left: 1rem; } .wallet-balance__content { display: flex; align-items: center; flex-grow: 1; padding: 0.6rem 0; padding-right: 1rem; border-bottom: 1px solid whitesmoke; overflow: hidden; } .wallet-balance__content.no-border { border: 0; } .wallet-balance__amount { white-space: nowrap; } .wallet-balance__heading { font-size: 17px; color: #445; margin: 1rem 1rem 1rem 1rem; } .wallet-balance__description { font-size: 12.5px; color: #667; margin: 0.7rem; line-height: 16px; } #wallet-balance .bar-header { border: 0; } #wallet-balance .bar-header .title, #wallet-balance .bar-header .button { color: #fff; } #wallet-balance .bar-header .button { background-color: transparent; } #wallet-balance ion-content { background: #F5F5F5; } .wallet-details__tx-amount { font-size: 16px; } .wallet-details__tx-amount--recent { color: #667; font-weight: bold; } .wallet-details__tx-amount--received { color: #09C286; } .wallet-details__tx-amount--sent { color: #445; } .wallet-details__tx-time { white-space: nowrap; color: #9b9bab; font-size: 12.5px; } .wallet-details__tx-title { flex-grow: 1; color: #445; overflow: hidden; } .wallet-details__tx-icon { float: left; margin-right: 25px; } .wallet-details__tx-message { margin-right: 1rem; } .wallet-details .item { display: flex; align-items: center; background: #fff; padding-left: 1rem; } .wallet-details__item { display: flex; align-items: center; background: #fff; padding: 0; margin: 0; border: 0; padding-left: 1rem; } .wallet-details__item.proposal { position: relative; } .wallet-details__item__marker { position: absolute; height: 100%; width: 3px; background: #F5A623; left: 0; } .wallet-details__tx-content { display: flex; align-items: center; flex-grow: 1; padding: 1rem 0; padding-right: 1rem; border-bottom: 1px solid whitesmoke; overflow: hidden; } .wallet-details__tx-content.no-border { border: 0; } .wallet-details__tx-amount { white-space: nowrap; } .wallet-details__group-label { font-size: 14px; font-weight: 300; color: #727272; padding: 1rem; background: #f8f8f9; } .wallet-details__no-transaction { color: #667; font-size: 12.5px; text-align: center; padding-top: 2rem; } .wallet-details__no-update-history { color: #ef473a; font-size: 12.5px; text-align: center; padding-top: 2rem; } .wallet-details__updating-history { color: #667; font-size: 12.5px; text-align: center; padding-top: 1rem; } #walletDetails { background: #F8F8F9; } #walletDetails .scroll-refresher { z-index: 1; margin-top: 3.5rem; } #walletDetails .ionic-refresher-content { color: white !important; } #walletDetails .ionic-refresher-content .spinner svg { stroke: white; fill: white; } #walletDetails .bp-content { position: relative; height: 100%; } #walletDetails .bp-content.status-bar { margin-top: 20px; } #walletDetails .bar-header { border: 0; background: none; } #walletDetails .bar-header .title, #walletDetails .bar-header .button { color: #fff; } #walletDetails .bar-header .button { background-color: transparent; } #walletDetails .nav-bar-block, #walletDetails .bar { background-color: inherit !important; } #walletDetails ion-content { padding-top: 0; top: 0; } #walletDetails ion-content.collapsible { margin-top: 210px; } #walletDetails ion-content .scroll { background: #f8f8f9; min-height: 300px; } #walletDetails .amount-wrapper { position: relative; overflow: visible; } #walletDetails .amount-wrapper .amount-bg { content: ''; top: 0; left: 0; position: absolute; width: 100%; height: 500px; -webkit-transform: translateY(-499px); transform: translateY(-499px); } #walletDetails .amount-wrapper .amount-bg.collapsible { top: initial; bottom: 0; left: 0; position: absolute; width: 100%; height: 200px; -webkit-transform: translateY(100px); transform: translateY(100px); } #walletDetails .amount { width: 100%; text-align: center; color: #fff; height: 210px; padding-top: 40px; display: block; align-items: center; justify-content: center; } #walletDetails .amount__balance { -webkit-transform: scale3d(1, 1, 1) translateY(45px); transform: scale3d(1, 1, 1) translateY(45px); } #walletDetails .amount__updating { z-index: 999; margin-top: -2.1rem; } #walletDetails .amount-alternative { line-height: 36px; } #walletDetails .amount__button-balance { background-color: transparent; border: 1px solid rgba(255, 255, 255, 0.25); margin-top: 10px; } #walletDetails .amount__button-balance i.icon { margin-right: 7px; vertical-align: middle; } #walletDetails .amount__error { font-size: 14px; padding: 35px 20px; } #walletDetails .no-alternative { padding-top: 45px; } #walletDetails .item.item-footer { font-weight: lighter; } #walletDetails .tx-search:before { font-size: 22px !important; } #walletDetails .description { background-color: #f2f2f2; text-align: center; font-size: 13px; color: #667; } #walletDetails .low-fees .comment { color: #667; font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-left: 25px; } #walletDetails .low-fees img { position: absolute; margin-top: 3px; } .wallet-details-wallet-info { position: absolute; top: inherit; left: 10px; bottom: 5px; font-size: 20px; color: #fff; width: 95%; } .wallet-details-wallet-info .actions { float: right; } .wallet-details-wallet-info .actions a { color: white; font-size: 14px; cursor: pointer; padding: 5px; line-height: 16px; } .wallet-not-backed-up-warning { background: orange; text-align: center; color: white; font-size: 14px; display: block; text-decoration: none; z-index: 9999; position: relative; padding: 2px 5px; } a.item { cursor: pointer; } .recent svg { margin-left: 5px; width: 0.7em; height: 0.7em; stroke: #eee; } .updatingHistory { color: #445; font-size: 0.9em; } .loading-wallet svg { margin-top: 0; } #advanced-settings .list .item:before { display: block; position: absolute; width: 100%; height: 1px; background: rgba(221, 221, 221, 0.3); top: 0; right: 0; content: ''; } #advanced-settings .list .item.item-divider { color: #445; } #advanced-settings .list .item .item-note { color: #445; } #advanced-settings .list .has-comment { border-bottom: 0 none; } #advanced-settings .list .comment { padding: 15px; background-color: #fff; color: #667; font-size: 0.9em; } #bitpayCard { background: white; } #bitpayCard .status-label { font-size: 14px; font-weight: 300; color: #727272; padding: 1rem; background: #f8f8f9; } #bitpayCard .status-label i { position: absolute; padding-left: 5px; } #bitpayCard .comment { padding: 15px; background: #f8f8f9; font-weight: bold; font-size: 0.9em; color: #667; display: inline-block; } #bitpayCard .spinner svg { stroke: #0067c8; fill: #0067c8; } #bitpayCard .add-bottom-for-cta { bottom: 92px; } #bitpayCard .head { padding: 30px 20px 4rem; border-top: 0; } #bitpayCard .head .sending-label { display: flex; font-size: 18px; align-items: center; margin-bottom: 1.5rem; } #bitpayCard .head .sending-label img { margin-right: 1rem; height: 35px; width: 35px; } #bitpayCard .head .sending-label .big-icon-svg { padding: 0 12px 0 0; } #bitpayCard .head .amount-label { line-height: 30px; } #bitpayCard .head .amount-label .amount-final { font-size: 38px; margin-bottom: .5rem; } #bitpayCard .head .amount-label .amount-final > .unit { font-family: "Roboto-Light"; } #bitpayCard .head .amount-label .alternative { font-size: 16px; font-family: "Roboto-Light"; color: #9B9B9B; } #bitpayCard .item { border-color: #EFEFEF; } #bitpayCard .item.activity-header { z-index: 3; border: 0; border-bottom: 1px solid #EFEFEF; } #bitpayCard .item.activity { display: flex; align-items: center; background: #fff; padding: 0 0 0 1rem; margin: 0; border: 0; } #bitpayCard .item.activity.receive svg .nc-icon-wrapper g, #bitpayCard .item.activity.receive svg .nc-icon-wrapper path, #bitpayCard .item.activity.receive .tx-icon .houston { stroke: #09C286; color: #09C286; } #bitpayCard .item.activity.pending svg .nc-icon-wrapper g, #bitpayCard .item.activity.pending svg .nc-icon-wrapper path, #bitpayCard .item.activity.pending .tx-icon .houston { stroke: #fab915; color: #fab915; } #bitpayCard .item .total { font-weight: bold; } #bitpayCard .tx-icon { margin-right: 25px; } #bitpayCard .tx-icon .houston { width: 40px; height: 40px; border-radius: 40px; border: 1px solid; color: #9b9bab; } #bitpayCard .tx-icon .houston.no-border { border: none; } #bitpayCard .tx-icon .houston.no-border .svg { width: 40px; height: 40px; display: block; margin: 0 auto; position: relative; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } #bitpayCard .tx-icon .houston .svg { width: 23px; height: 23px; display: block; margin: 0 auto; position: relative; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } #bitpayCard .tx-content { display: flex; align-items: center; flex-grow: 1; padding: 1rem 0; padding-right: 1rem; border-bottom: 1px solid whitesmoke; overflow: hidden; } #bitpayCard .tx-title { flex-grow: 1; color: #445; overflow: hidden; } #bitpayCard .tx-message { margin-right: 1rem; text-transform: capitalize; } #bitpayCard .tx-location { margin-right: 1rem; font-size: 12.5px; color: #9b9bab; text-transform: capitalize; } #bitpayCard .tx-amount { font-size: 16px; white-space: nowrap; } #bitpayCard .tx-amount--received { color: #09C286; } #bitpayCard .tx-amount--sent { color: #445; } #bitpayCard .tx-amount--pending { color: #fab915; } #bitpayCard .tx-time { white-space: nowrap; color: #9b9bab; font-size: 12.5px; } #bitpayCard .info .badge { border-radius: 0; padding: .5rem; } #bitpayCard .info .item { color: #4A4A4A; padding-top: 10px; padding-bottom: 10px; padding-left: 20px; } #bitpayCard .info .item:not(.item-icon-right) { padding-right: 20px; } #bitpayCard .info .item .label { font-size: 14px; color: #6C6C6E; margin-bottom: 8px; } #bitpayCard .info .item .capitalized { text-transform: capitalize; } #bitpayCard .info .item .wallet .big-icon-svg > .bg { height: 24px; width: 24px; padding: 2px; box-shadow: none; vertical-align: middle; } #bitpayCard .info .item .total-amount { font-weight: bold; } #bitpayCard .info .item.single-line { display: flex; align-items: center; padding-top: 17px; padding-bottom: 17px; } #bitpayCard .info .item.single-line .label { margin: 0; flex-grow: 1; } #bitpayCard .info .item-divider { padding-top: 1.2rem; color: #6C6C6E; font-size: 15px; } #bitpayCard .info .wallet { display: flex; align-items: center; padding: .2rem 0; margin-bottom: 5px; } #bitpayCard .info .wallet ~ .bp-arrow-right { top: 14px; } #bitpayCard .info .wallet > i { padding: 0; position: static; } #bitpayCard .info .wallet > i > img { height: 24px; width: 24px; padding: 2px; margin-right: .7rem; box-shadow: none; } #bitpayCard .disclosure { color: #9b9bab; font-size: 12px; text-align: left; margin: 1rem; } #bitpayCard .icon-bitpay-card { background-image: url("../img/icon-bitpay.svg"); } #bitpayCard .bar-header { border: 0; background: #1e3186; } #bitpayCard .bar-header .title, #bitpayCard .bar-header .button { color: #fff; } #bitpayCard .bar-header .button { background-color: transparent; } #bitpayCard .amount-wrapper { position: relative; overflow: visible; } #bitpayCard .amount-wrapper .amount-bg { content: ''; top: -1000px; left: 0; position: absolute; height: 1000px; width: 100%; background-color: #1e3186; } #bitpayCard .amount { width: 100%; text-align: center; padding: 2rem 1rem 1.5rem 1rem; height: 160px; border-color: #172565; background-color: #1e3186; background-image: linear-gradient(0deg, #172565, #172565 0%, transparent 0%); color: #fff; } #bitpayCard .amount__balance { margin-bottom: 25px; font-weight: 600; font-size: 34px; } #bitpayCard .wallet-details-wallet-info { bottom: 5px; } #bitpayCard strong { line-height: 100%; } #bitpayCard .select-style { border: none; box-shadow: none; background-color: transparent; background-image: none; margin: 0; padding: 0; width: 100%; } #bitpayCard .item-select select { color: #667; } #bitpayCard .get-started { margin-top: 20px; } #bitpayCard .get-started__arrow { font-size: 56px; opacity: .2; } #bitpayCard .get-started h1 { font-size: 28px; color: #4A4A4A; } #bitpayCard .get-started__text { font-weight: 300; color: #8e8e8e; max-width: 300px; margin: 0 auto; } #bitpayCard .spinner svg { stroke: white; fill: white; } #bitpayCard-intro { background: url(../img/onboarding-welcome-bg.png), linear-gradient(to bottom, #1e3186 0%, #111b49 100%); background-position: top center; background-size: contain; background-repeat: no-repeat; color: #fff; color: #fff; height: 100%; } #bitpayCard-intro .cta-button { text-align: center; position: absolute; bottom: 55px; padding: 0 1.5rem; width: 100%; } #bitpayCard-intro .bar.bar-header { background: transparent none; border: 0 none transparent; } #bitpayCard-intro .bar.bar-stable { border-color: transparent; border: none; } #bitpayCard-intro .bitpayCard__illustration { padding: 2rem; } #bitpayCard-intro .bitpayCard__illustration__img { width: 100%; max-width: 400px; } #bitpayCard-intro .bitpayCard__info:before { font-size: 22px; line-height: 22px; margin-top: 6px; } #bitpayCard-intro ion-content { height: 100%; } #bitpayCard-intro ion-content .scroll { height: 100%; } #bitpayCard-intro .slider__text { text-align: center; margin: 40px 20px; font-size: 1rem; color: rgba(255, 255, 255, 0.7); } #bitpayCard-intro .slider-pager .slider-pager-page { color: #494949; font-size: 8px; margin: 0; } #buy-and-sell .explain { text-align: center; margin-top: 1em; } #buy-and-sell .buy-and-sell-icon { display: inline-block; width: 50px; height: 50px; border-radius: 3px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25); background-color: #fa912b; } #buy-and-sell .buy-and-sell-icon img { height: 100%; width: 100%; content: url("../img/app/icon-bitcoin.png"); background-color: #fab915; border-radius: 3px; } #buy-and-sell .explain-heading { font-size: 20px; margin: 1rem; } #buy-and-sell .explain-description { margin-left: auto; margin-right: auto; opacity: .6; max-width: 300px; padding: 0 1em; font-size: 0.9em; } #buy-and-sell .item-note { color: #9b9bab; } #bitpayServicesPreferences .item .item-title { display: block; } #bitpayServicesPreferences .item .item-subtitle { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #9b9bab; font-size: 14px; } #bitpayServicesPreferences .item.item-icon-right .icon-hotspot { right: 0px; padding-left: 50px; } #bitpayServicesPreferences .item .icon-unlink { background-image: url("../img/icon-unlink.svg"); background-repeat: no-repeat; background-position: center; } #add-address .zero-state-cta { padding-bottom: 3vh; } #add-address .list { background-color: #fff; } #add-address .qr-scan-icon a { z-index: 10; display: block; position: absolute; top: 164px; right: 0; padding: 0 10px; font-size: 24px; cursor: pointer; line-height: 155px; } #add-address .icon.valid { padding-top: 3px; color: #fab915; } #add-address .icon.invalid { padding-top: 3px; color: #DF2121; } #add-address .add-address-input-group { background-color: #fff; } #add-address .add-address-input-group .item-stacked-label { padding: 1rem; } #add-address .add-address-input-group .input-label { text-transform: uppercase; font-size: 12px; font-weight: bold; } #add-address .add-address-list .item { color: #445; padding-top: 1.3rem; padding-bottom: 1.3rem; } #add-address .add-address-list .item.item-divider { color: #667; padding-bottom: .5rem; font-size: .9rem; } #add-address .add-address-list .item-note { color: #9b9bab; } #view-address-book .scroll { height: 100%; } #view-address-book i.icon > svg#Add_Contact path.st0 { stroke: #494949; } #view-address-book .list .item { color: #444; border-top: none; } #view-address-book .list .item:before { display: block; position: absolute; width: 100%; height: 1px; background: rgba(221, 221, 221, 0.3); top: 0; right: 0; content: ''; } #view-address-book .list .item.item-divider { color: rgba(74, 74, 74, 0.8); } #view-address-book .list .item.item-heading:before { top: 99%; } #view-address-book .list .item.item-icon-left { padding-left: 80px; } #view-address-book .list .item:nth-child(2):before { width: 0; } #view-address-book .list .item .item-note { color: #3a3a3a; } #view-address-book .list .item .big-icon-svg { padding: 0 7px; } #view-address-book .list .item .big-icon-svg > .bg { border-radius: 3px; width: 40px; height: 40px; box-shadow: none; background-repeat: no-repeat; background-clip: padding-box; background-size: 103%; } #view-address-book .list .item .big-icon-svg > .bg.green { background: #01d1a2; } #address-book-view .has-click { cursor: pointer; } #address-book-view .bar.bar-royal { border: 0 transparent; } #address-book-view .gravatar-content { position: relative; height: 70px; border-color: #fab915; background-color: #fab915; padding-top: 20px; margin-bottom: 50px; text-align: center; } #address-book-view .address-book-field-label { text-transform: uppercase; font-weight: bold; font-size: 12px; display: block; color: #667; } #address-book-view .big-icon-svg { padding: 0 7px; } #address-book-view .big-icon-svg > .bg { background-color: #f2f2f2; border-radius: 3px; width: 70px; height: 70px; box-shadow: 0px 1px 5px rgba(102, 102, 119, 0.1); background-repeat: no-repeat; background-clip: padding-box; background-size: 103%; } #address-book-view .big-icon-svg > .bg.green { background: #01d1a2; } #addresses .updating { text-align: center; font-size: 0.9em; color: #667; padding-top: 1.3rem; } #addresses .updating .spinner svg { stroke: #111; fill: #111; } #addresses .addr-explanation, #addresses .addr-button-group { padding: 0 1rem; margin: 1rem 0; } #addresses .addr-description { text-align: center; font-size: 0.9em; color: #667; margin: 1rem 0; } #addresses .addr-description a { font-weight: bold; cursor: pointer; cursor: hand; } #addresses .addr-balance { margin-top: 4px; color: #5DD263; } #addresses .addr-path { margin-top: 4px; color: #B8B8B8; } #addresses .banner-icon { margin-top: 25px; } #addresses .banner-icon i { box-shadow: 0px 6px 12px 0px rgba(0, 0, 0, 0.3); } #addresses .banner-icon i img { content: url("../img/app/tab-icons/ico-receive-selected.svg"); } #addresses .addr-list .item { color: #445; padding-top: 1.3rem; padding-bottom: 1.3rem; } #addresses .addr-list .item.has-addr-value { padding-top: .65rem; padding-bottom: .65rem; } #addresses .addr-list .item.item-divider { color: #667; padding-bottom: .5rem; font-size: .9rem; } #addresses .addr-list .item.view-all { cursor: pointer; cursor: hand; } #addresses .addr-list .item.view-all i { font-size: 35px; margin-right: 5px; color: #494949; } #addresses .addr-list .item.view-all span { color: #494949; font-weight: bold; } #addresses .addr-list .item i { font-size: 35px; margin-right: 2px; } #addresses .addr-list .box-error { padding: 25px; background-color: #E65555; color: #F4F4F4; } #addresses .addr-list .box-error h5 { margin: 5px; color: #F4F4F4; text-align: center; font-weight: bold; } #addresses .addr-list .box-error a { font-weight: bold; color: #F4F4F4; cursor: pointer; cursor: hand; } #addresses .addr-list .item-note { color: #9b9bab; } #wallet-backup-phrase { background: #ffffff; text-align: center; } #wallet-backup-phrase .comment { color: #667; font-size: 0.9em; } #wallet-backup-phrase .item { color: #445; padding-top: 1.3rem; padding-bottom: 1.3rem; border: none; } #wallet-backup-phrase .heading { font-size: 17px; color: #445; margin: 1rem 0; padding-top: 5px; padding-bottom: 5px; border: none; } #wallet-backup-phrase h3 { padding: 15px; } #wallet-backup-phrase .button-confirm { margin-top: 1rem; } #wallet-backup-phrase .password-required { padding: 1rem; } #wallet-backup-phrase .password-prompt { background-color: #f2f2f2; padding: 2rem; } #wallet-backup-phrase .password-prompt .explanation { padding: 0 1rem; margin: 1rem 0; } #wallet-backup-phrase .password-prompt .description { text-align: center; font-size: 15px; color: #000; margin: 1rem 0; } #wallet-backup-phrase .password-prompt input { width: 100%; padding: 1rem; } #wallet-backup-phrase .bar.bar-royal .title { font-size: 1rem; } #wallet-backup-phrase .backup-phrase { background: #f2f2f2; margin: auto; border: 2px dashed #d9d9d9; border-radius: 3px; color: #fff; text-align: center; max-width: 500px; min-height: 9rem; display: flex; justify-content: center; align-items: center; } #wallet-backup-phrase .backup-phrase-content { font-weight: bold; line-height: 2; font-size: 16px; letter-spacing: 1px; } @media (min-width: 575px) { #wallet-backup-phrase .backup-phrase-content { font-size: 18px; padding: 3rem; } } #wallet-backup-phrase .backup-phrase-content-word-readonly { padding: 0 1px; } @media (min-width: 575px) { #wallet-backup-phrase .backup-phrase-content-word-readonly { padding: 0 6px; } } #wallet-backup-phrase-step-1 { height: 70%; color: #445; } #wallet-backup-phrase-step-1 .initial-prompt { padding: 2.3rem; } @media (max-height: 480px) { #wallet-backup-phrase-step-1 .initial-prompt { padding: 2rem; } } #wallet-backup-phrase-step-1 .tldr-prompt { padding-bottom: 3rem; } @media (max-height: 480px) { #wallet-backup-phrase-step-1 .tldr-prompt { height: 30%; padding-bottom: 1rem; font-size: 14px; } } @media (max-height: 550px) { #wallet-backup-phrase-step-1 .tldr-prompt { padding-bottom: 1rem; } } #wallet-backup-phrase-step-2 { display: block; height: 70%; width: 100%; justify-content: center; align-items: center; } #wallet-backup-phrase-step-2 .confirmation-prompt { padding: 3rem; } @media (max-height: 480px) { #wallet-backup-phrase-step-2 .confirmation-prompt { padding: 1rem; } } #wallet-backup-phrase-step-2 #select-phrase { background: #f2f2f2; } #wallet-backup-phrase-step-2 #select-phrase .select-word.button[disabled] { background: transparent !important; box-shadow: none !important; color: transparent; border: 1px solid #494949; } #wallet-backup-phrase-step-2 #select-phrase-content { max-width: 500px; margin-left: auto; margin-right: auto; } #wallet-backup-phrase-step-2 #select-phrase-content .tldr-prompt { font-weight: bold; padding: 1rem; } @media (max-height: 480px) { #wallet-backup-phrase-step-2 #select-phrase-content .tldr-prompt { padding: 0.5rem; font-size: 14px; } } #wallet-backup-phrase-step-2 #select-phrase .cta-buttons { padding-bottom: 0; } #wallet-backup-phrase-step-2 .select-word { background: #494949; color: #fff; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25); display: inline-block; margin: 3px 0; min-height: 35px; line-height: 33px; padding: 0 8px; } @media (min-width: 400px) { #wallet-backup-phrase-step-2 .select-word { margin: 4px 3px; padding: 0 16px; } } @media (max-height: 480px) { #wallet-backup-phrase-step-2 .select-word { font-size: 14px; } } #wallet-backup-phrase-step-2 .tldr-prompt { padding-bottom: 3rem; } @media (max-height: 480px) { #wallet-backup-phrase-step-2 .tldr-prompt { height: 30%; padding-bottom: 1rem; font-size: 14px; } } #wallet-backup-phrase .cta-buttons { padding-bottom: 5vh; } @media (max-height: 480px) { #wallet-backup-phrase .cta-buttons { padding-bottom: 3vh; } } #wallet-backup-phrase ion-content.has-tabs .cta-buttons { bottom: 110px; } #wallet-backup-phrase ion-content.has-tabs .cta-buttons, #wallet-backup-phrase ion-content.has-tabs #select-phrase { bottom: 110px; } .zero-state { height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; } .zero-state-icon { display: inline-block; width: 50px; height: 50px; border-radius: 3px; padding: 13px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25); background-color: #fff; } .zero-state-icon img { height: 100%; width: 100%; } .zero-state-heading { font-size: 20px; margin: 1rem; } .zero-state-description { font-size: 0.9em; margin-top: 0; margin-left: 2rem; margin-right: 2rem; margin-bottom: 120px; opacity: .6; max-width: 300px; } .zero-state-tldr { margin: 1rem auto; } .zero-state-description, .zero-state-tldr { max-width: 300px; } .zero-state-cta { position: absolute; bottom: 0; width: 100%; } .onboarding { background: #fab915; color: #f8ecd0; background-image: linear-gradient(to bottom, #fab915 0%, #fab915 100%); height: 100%; text-align: center; } .onboarding .bar.bar-header { background: none; border: 0 none transparent; color: #fff; } .onboarding .bar.bar-header button { color: #494949; } .onboarding .onboarding-topic, .onboarding .onboarding-description, .onboarding .onboarding-tldr { margin-left: 3rem; margin-right: 3rem; } .onboarding .onboarding-topic { font-size: 24px; margin-top: .5rem; line-height: 1.3; } @media (max-width: 350px) { .onboarding .onboarding-topic { font-size: 20px; } } .onboarding .onboarding-description { margin-top: 1rem; font-size: 16px; color: rgba(255, 255, 255, 0.5); line-height: 1.5; } @media (max-width: 350px) { .onboarding .onboarding-description { line-height: 1.3; } } @media (max-height: 480px) { .onboarding .onboarding-description { font-size: 16px; } } .onboarding .onboarding-tldr { font-size: 18px; margin-top: 1rem; margin-bottom: 1em; line-height: 1.3; } @media (max-width: 350px) { .onboarding .onboarding-tldr { font-size: 16px; } } @media (max-height: 480px) { .onboarding .onboarding-tldr { font-size: 14px; } } .onboarding svg#alert-icon g { stroke: #494949; } .onboarding #arrow-down { color: #494949 !important; } .onboarding .back-button .icon:before { color: #494949; } #wallet-backup-phrase .cta-buttons, #onboard-welcome #cta-buttons, #onboarding-tour .cta-buttons, #onboarding-backup-request .cta-buttons, #backup-warning #cta-buttons { position: absolute; bottom: 0; left: 0; width: 100%; } .pane-onboarding { background: #fab915; } #terms .terms__heading { font-weight: bold; color: #445; } #terms-of-use ion-header-bar { background: #fab915; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25); color: #ffffff; } #terms-of-use ion-header-bar .primary-buttons .button { color: #ffffff; font-size: 2rem; } #terms-of-use ion-content { padding-top: 1.5rem; color: #445; margin-bottom: 210px; } #terms-of-use ion-content p { padding: 0 2.5%; margin: 2rem auto; } #terms-of-use ion-content p:first-child { margin-top: 0; } #onboard-welcome > ion-content { background: none; background-position: top center; background-size: contain; background-repeat: no-repeat; } #onboard-welcome #qrcode { content: url("../img/onboarding-welcome-qrcode.png"); position: absolute; top: 5%; right: 5%; width: 20px; height: auto; } #onboard-welcome #logo-tagline { width: 100%; height: 70%; display: flex; flex-direction: column; justify-content: space-around; } #onboard-welcome #logo { width: 40%; max-width: 200px; margin: auto 0; } #onboard-welcome #lead { line-height: 1.6; font-size: 18px; } #onboard-welcome #cta-buttons { padding-bottom: 4vw; } #onboarding-tour-currency .next-slide { margin-top: 3rem; } #onboarding-tour .cta-buttons { padding-bottom: 12vh; } #onboarding-tour #onboarding-illustration-currency-exchange-rate { font-size: 14px; font-weight: normal; height: 40px; line-height: 38px; margin: 10px auto 0; position: relative; width: 140px; z-index: 1; } #onboarding-tour .swiper-pagination-bullet { background: #494949; } #onboarding-tour .swiper-pagination-bullet-active { background: #494949; } #onboarding-collect-email { background: #11d1a6; } #onboarding-collect-email #success-container { top: 41vh; position: relative; animation-name: emailCollectSlideUp; animation-iteration-count: 1; animation-timing-function: ease-in; animation-duration: .5s; animation-delay: 1.3s; animation-fill-mode: forwards; } #onboarding-collect-email #success-image { width: 13vh; margin: 0 auto 2vh; } #onboarding-collect-email #success-message { font-size: 3vh; } #onboarding-collect-email .collect-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.4); z-index: 4; animation-name: emailCollectOpacity; animation-iteration-count: 1; animation-timing-function: ease-in; animation-duration: .2s; animation-delay: 1.3s; animation-fill-mode: forwards; opacity: 0; } #onboarding-collect-email .collect-overlay button { position: absolute; right: 0; } #onboarding-collect-email .heading { color: #445; font-size: 1.2rem; font-weight: bold; margin: 2rem 0 1rem; } #onboarding-collect-email .prompt { margin: 1rem 1.5rem; color: #667; } #onboarding-collect-email #email-form { margin: 0 1.5rem 1rem; } #onboarding-collect-email #email-label { border-radius: 6px; background: rgba(200, 200, 200, 0.2); height: 3rem; margin-top: 0; } #onboarding-collect-email #collect-email { opacity: 1; background: #fff; animation-name: topBottom; animation-iteration-count: 1; animation-timing-function: ease-in; animation-duration: .4s; animation-delay: 1.5s; position: absolute; bottom: -100%; animation-fill-mode: forwards; z-index: 5; margin-top: 0; width: 100%; } #onboarding-collect-email #collect-email-inner { max-width: 400px; margin: 0 auto; } #onboarding-collect-email #collect-email-confirm p.confirm { margin: 2rem 0; color: #667; } #onboarding-collect-email #collect-email-confirm p.user-email { color: #445; margin-bottom: 2rem; } #onboarding-collect-email #collect-email-confirm .row, #onboarding-collect-email #collect-email-confirm .col { padding: 0; } #onboarding-collect-email #collect-email-confirm .button { padding: 0.5rem; margin-bottom: 0; } #onboarding-collect-email #news-updates { padding-top: 0; } #onboarding-collect-email .item { border: none; } #onboarding-collect-email .item label { background: none; } #onboarding-collect-email .item .checkbox input:before, #onboarding-collect-email .item .checkbox .checkbox-icon:before { border-radius: 50% !important; background: none; border-width: 2px; padding: 12px; position: relative; right: 2px; bottom: 2px; } #onboarding-collect-email .item .checkbox input:checked:after, #onboarding-collect-email .item input:checked + .checkbox-icon:after { border-color: #494949; top: 8px; left: 6px; } #onboarding-collect-email .item .item-content { color: #667; text-align: left; margin-left: 75px; white-space: initial; } #onboarding-collect-email .item-checkbox { padding: 1rem 0; margin: 1rem 0; } #onboarding-collect-email .item-checkbox .checkbox { margin-left: 15px; } #onboarding-collect-email .checkbox input:before, #onboarding-collect-email .checkbox .checkbox-icon:before { border-color: #494949; } #onboarding-collect-email .checkbox input:checked:before, #onboarding-collect-email .checkbox input:checked + .checkbox-icon:before { border-color: #494949; } @keyframes topBottom { 0% { bottom: -100%; } 100% { bottom: 0; } } @keyframes emailCollectOpacity { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes emailCollectSlideUp { 0% { top: 41vh; } 100% { top: calc((100vh - 20rem) / 2 - 11vh); } } #onboarding-backup-request #warning { padding-top: 15%; display: block; flex-direction: column; height: calc(100vh - 320px); justify-content: center; align-content: center; } #onboarding-backup-request #alert-icon { margin: 20px auto 5px; height: 10vh; } #onboarding-backup-request #arrow-down { font-size: 4.2rem; color: #494949; } #onboarding-backup-request #backup-tldr { font-size: 16px; } #onboarding-backup-request #backup-description { max-width: 500px; margin: auto; padding: 1rem 0.5rem 0 1rem; } @media (max-height: 480px) { #onboarding-backup-request #backup-description { padding-top: 40px; } } #onboarding-backup-request .cta-buttons { padding-bottom: 4vw; } @media (max-height: 568px) { #onboarding-backup-request #warning { padding-top: 5%; } #onboarding-backup-request #backup-description { font-size: 14px; } #onboarding-backup-request #backup-tldr { font-size: 14px; } } @media (max-height: 480px) { #onboarding-backup-request #warning { padding-top: 5%; } #onboarding-backup-request #backup-description { font-size: 14px; } #onboarding-backup-request #backup-tldr { font-size: 14px; } #onboarding-backup-request #arrow-down { display: none; } } #backup-warning #cta-buttons { padding-bottom: 10vh; } #onboarding-disclaimer { color: #f8ecd0; height: 100%; transition: transform 2.5s ease; } #onboarding-disclaimer .checkbox input, #onboarding-disclaimer .checkbox-icon { position: relative; width: 28px; height: 28px; display: block; border: 0; background: transparent; cursor: pointer; -webkit-appearance: none; } #onboarding-disclaimer.shrink { -webkit-transform: scale(0.8); transform: scale(0.8); } #onboarding-disclaimer-container { max-width: 450px; justify-content: center; margin-left: auto; margin-right: auto; padding-top: 3rem; } @media (max-height: 480px) { #onboarding-disclaimer-container { padding-top: 1.5rem; } } .has-header > #onboarding-disclaimer-container { height: calc(100vh - 210px); } #onboarding-disclaimer #disclaimer-topic { margin: 0 1rem; } #onboarding-disclaimer #disclaimer-description { margin: 1rem 1rem 2rem; } @media (max-height: 480px) { #onboarding-disclaimer #disclaimer-description { font-size: 14px; } } #onboarding-disclaimer ion-content { height: 101%; } #onboarding-disclaimer ion-content.has-header { top: 40px !important; } #onboarding-disclaimer ion-content .scroll { height: 100%; } #onboarding-disclaimer ion-content h3 { margin-top: 1.5rem; } #onboarding-disclaimer .tag { padding-bottom: 0; } #onboarding-disclaimer .list { max-width: 600px; float: none; margin: 0 auto; } #onboarding-disclaimer .list .item:first-child { padding-top: 0; } @media (max-height: 480px) { #onboarding-disclaimer .list .item { font-size: 14px; } } #onboarding-disclaimer .item { background: transparent; border: none; color: #fff; text-align: left; } #onboarding-disclaimer .item .checkbox input:before, #onboarding-disclaimer .item .checkbox .checkbox-icon:before { border-color: #494949; background: transparent; } #onboarding-disclaimer .item .checkbox input:after, #onboarding-disclaimer .item .checkbox .checkbox-icon:after { border-color: #494949; } #onboarding-disclaimer .item .checkbox input:checked:before, #onboarding-disclaimer .item .checkbox input:checked + .checkbox-icon:before { border-color: #494949; } #onboarding-disclaimer .item .item-content { width: 90%; margin-left: 6%; white-space: normal; } #onboarding-disclaimer .item-checkbox .checkbox { margin-left: 3%; top: 30%; left: 0; } #terms-of-use { position: absolute; top: 100%; left: 0; z-index: 10; transition: top 1s ease; transition-delay: .25s; width: 100%; overflow: scroll; background: #fff; height: 100%; } #terms-of-use ion-nav-bar { position: fixed; background: #fff; width: 100%; z-index: 15; } #terms-of-use .has-header { width: 100%; background: #fff; overflow-y: scroll; position: relative; } #terms-of-use .has-header #terms { max-width: 400px; padding-top: .5rem; position: relative; margin: 0 auto; padding-bottom: 165px; width: 90%; } #terms-of-use.slideUp { top: 0; } #agree-to-terms { background: #fab915; padding: 1rem; position: absolute; bottom: 0; width: 100%; z-index: 10; box-shadow: 0 1px 10px rgba(0, 0, 0, 0.25); } #agree-to-terms-content { max-width: 450px; float: none; margin: 0 auto; } #agree-to-terms .item { background-color: transparent; padding-bottom: 2.5rem; float: left; border: none; } #agree-to-terms .item .item-content { white-space: normal; } #agree-to-terms p { color: #f8ecd0; text-align: left; } @media (min-width: 450px) { #agree-to-terms p { position: relative; top: .6rem; } } #agree-to-terms .checkbox input:before, #agree-to-terms .checkbox .checkbox-icon:before { border-color: #494949; background: transparent; } #agree-to-terms .checkbox input:after, #agree-to-terms .checkbox .checkbox-icon:after { border-color: #494949; } #agree-to-terms .checkbox input:checked:before, #agree-to-terms .checkbox input:checked + .checkbox-icon:before { border-color: #494949; } #agree-to-terms button { margin-top: 1.5rem; position: relative; } @media (max-height: 480px) { #agree-to-terms { padding: 0.5rem; } } @media (max-height: 460px) { #agree-to-terms { position: relative; float: left; } } .onboarding-illustration-secure, .onboarding-illustration-currency, .onboarding-illustration-control, .onboarding-illustration-backup-warning { width: 100%; margin-top: 1rem; background-position: center; background-repeat: no-repeat; background-size: contain; z-index: -1; } @media (max-height: 600px) { .onboarding-illustration-secure, .onboarding-illustration-currency, .onboarding-illustration-control, .onboarding-illustration-backup-warning { height: 35%; } } @media (max-height: 480px) { .onboarding-illustration-secure, .onboarding-illustration-currency, .onboarding-illustration-control, .onboarding-illustration-backup-warning { height: 23%; } } @media (min-height: 600px) { .onboarding-illustration-secure, .onboarding-illustration-currency, .onboarding-illustration-control, .onboarding-illustration-backup-warning { height: 40%; } } .onboarding-illustration-secure { background-image: url(../img/app/onboarding/tour-phone.svg); } .onboarding-illustration-currency { background-image: url(../img/app/onboarding/tour-currency.svg); } .onboarding-illustration-control { background-image: url(../img/app/onboarding/tour-control.svg); } .onboarding-illustration-backup-warning { background-image: url(../img/app/backup-warning.svg); } #rate-card .item-heading { font-weight: 700; } #rate-card .row { border: none; } #rate-card .item-icon-right { margin: 0; } #rate-card .feedback-flow-button { margin-bottom: 20px; } #rate-card .icon-svg > img { height: 1.8rem; margin-bottom: 5px; } #send-feedback { background-color: #ffffff; } #send-feedback .row { border: none; } #send-feedback .skip { color: rgba(255, 255, 255, 0.3); } #send-feedback .feedback-heading { padding-top: 20px; } #send-feedback .feedback-title { padding-left: 10px; font-size: 20px; font-weight: bold; color: #445; } #send-feedback .rating { text-align: right; padding-right: 15px; } #send-feedback .comment { padding: 0 20px 20px; font-size: 1rem; line-height: 1.5em; font-weight: 300; color: #445; } #send-feedback .user-feedback { border-top: 1px solid #f2f2f2; border-bottom: 1px solid #f2f2f2; padding: 20px; width: 100%; margin-bottom: 20px; -webkit-appearance: none; } #send-feedback .send-feedback-star { height: 1rem; margin-left: 5px; } #send-feedback .form-fade-in { opacity: 0; animation-name: fadeIn; animation-duration: .5s; animation-fill-mode: forwards; animation-timing-function: ease-in; } @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } #complete { background-color: #fff; } #complete .complete-layout { display: flex; flex-direction: column; height: 100%; } #complete .complete-layout__expand { display: flex; flex-direction: column; flex-grow: 1; align-items: center; justify-content: center; text-align: center; opacity: 0; transition: opacity .3s; } #complete .complete-layout__expand.fade-in { opacity: 1; } #complete .share-the-love-illustration { width: 5rem; margin: 1rem; } #complete .send-feedback-illustration { height: 16rem; margin: 1rem; } #complete .feedback-title { font-size: 20px; font-weight: bold; color: #445; margin: 20px 10px; text-align: center; } #complete .subtitle { padding: 10px 30px 20px; text-align: center; color: #667; } #complete .icon-svg > img { height: 16rem; width: 16rem; margin: 10px; } #complete .socialsharing-icon { display: inline-block; width: 60px; } #complete .addressbook-icon-svg { display: inline-block; width: 50px; height: 50px; } #complete .share-buttons { padding: 50px 10px 30px; background-color: #f2f2f2; text-align: center; -webkit-transform: translateY(100%); transform: translateY(100%); opacity: 0; animation-name: slideUpFadeIn; animation-duration: .3s; animation-fill-mode: forwards; animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); animation-delay: .2s; } #complete .share-buttons__action { display: inline-block; color: #667; font-size: .9rem; width: 90px; height: 90px; margin-bottom: 20px; } @keyframes slideUpFadeIn { from { -webkit-transform: translateY(100%); transform: translateY(100%); opacity: 0; } to { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } } #rate-app { background-color: #ffffff; text-align: center; } #rate-app .skip-rating { color: #445; position: absolute; top: 5px; right: 10px; padding: 15px; } #rate-app .icon-svg > img { width: 80px; height: 80px; margin-top: 15px; } #rate-app .feedback-title { font-size: 20px; font-weight: bold; color: #445; margin: 80px 50px 10px; text-align: center; } #rate-app .share-the-love-illustration { width: 5rem; margin: 1rem; } #rate-app .subtitle { padding: 10px 30px 20px 40px; color: #667; } #rate-app .rate-buttons { bottom: 0; width: 100%; position: absolute; background-color: #f2f2f2; padding: 30px 0 15px; } action-sheet .bp-action-sheet__sheet { background: #fff; width: calc(100% + 1px); position: fixed; bottom: 0; left: 50%; -webkit-transform: translateY(100%) translateX(-50%); transform: translateY(100%) translateX(-50%); transition: transform 250ms cubic-bezier(0.4, 0, 0.2, 1); z-index: 100; padding-top: 1.75rem; padding-left: 1.25rem; padding-right: 1.25rem; color: #2f2f2f; padding-bottom: 3.5rem; max-width: 550px; max-height: 100vh; overflow: scroll; } action-sheet .bp-action-sheet__sheet.slide-up { -webkit-transform: translateY(0) translateX(-50%); transform: translateY(0) translateX(-50%); box-shadow: 0px 2px 13px 3px rgba(0, 0, 0, 0.3); } action-sheet .bp-action-sheet__sheet .back-arrow { padding-bottom: 1.25rem; cursor: pointer; } action-sheet .bp-action-sheet__sheet .header { font-weight: 600; padding-bottom: 1rem; border-bottom: 1px solid #EFEFEF; margin-bottom: 1px; } action-sheet .bp-action-sheet__backdrop { height: 100%; width: 100%; position: fixed; top: 0; left: 0; background: transparent; transition: background 250ms cubic-bezier(0.4, 0, 0.2, 1); pointer-events: none; z-index: 99; } action-sheet .bp-action-sheet__backdrop.fade-in { background: rgba(0, 0, 0, 0.4); pointer-events: all; } #export .list { background-color: #fff; } #export .top-tabs.row { padding: 0; } #export .top-tabs .col { font-size: 14px; cursor: pointer; padding: 10px 5px; border-bottom-width: 2px; border-bottom-color: #494949; } #export input[type="password"] { border: none; margin-left: -5px; padding-left: 4px; } #export input[type="password"].incorrect { padding-left: 3px; border: 1px solid; color: #C90505; } #export input[type="password"].correct { padding-left: 3px; border: 1px solid; color: #00901B; } #import .top-tabs.row { padding: 0; } #import .top-tabs .col { font-size: 14px; cursor: pointer; padding: 10px 5px; border-bottom-width: 2px; border-bottom-color: #494949; } #import .qr-scan-icon a { z-index: 10; display: block; position: absolute; top: 14px; right: 0; padding: 0 10px; font-size: 24px; cursor: pointer; } #import .qr-icon { line-height: 45px; } #join .qr-scan-icon a { z-index: 10; display: block; position: absolute; top: 115px; right: 0; padding: 0 10px; font-size: 24px; cursor: pointer; line-height: 45px; } #join .item-stacked-label .icon { padding: 0px; margin: 0px; } #join .icon.valid { padding-top: 3px; color: #fab915; } #join .icon.invalid { padding-top: 3px; color: #DF2121; } #menu-popover { border-radius: 5px; } #menu-popover .list .item { cursor: pointer; cursor: hand; } #menu-popover .list .item:hover { background-color: #E4E2E2; } .wallet-activity-not-pending { opacity: 0.6; filter: alpha(opacity=60); /* For IE8 and earlier */ } .wallet-activity-amount { float: right; font-size: 18px; } @media (max-width: 320px) { .wallet-activity-amount { text-align: right; } } .wallet-activity-note { margin-top: 3px; font-size: 12px !important; } .wallet-activity-note-child { line-height: 30px; vertical-align: middle; } .wallet-activity-note > i { font-size: 21px; margin-right: 8px; } .wallet-activity-note > time { float: right; } .wallets .slides .swiper-container { width: 85% !important; overflow: visible; } .wallets .slides .card { max-width: 350px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25); padding: 0; border-radius: 6px; margin: 0 auto; } @media (min-width: 500px) { .wallets .slides .card { width: 350px; position: relative; margin: 1.5rem auto 0; } } .wallets .slides .card .item { padding: 3vh 3vw 3vh 3vw; } .wallets .slides .card .item span { clear: both; width: 100%; display: inline-block; } .wallets .slides .card .item span.wallet-name { font-size: 16px; width: 70%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; font-weight: 600; } .wallets .slides .card .item span.wallet-number { visibility: hidden; } .wallets .slides .card .item span.visible { visibility: visible !important; } .wallets .slides .card .item .big-icon-svg > .bg { padding: .3rem; width: 40px; height: 40px; } .wallets .slides .swiper-slide { width: 100% !important; max-width: 450px; } @media (min-width: 500px) { .wallets .slides .swiper-slide { margin: 0 auto; display: block; float: none; max-width: none; } .wallets .slides .swiper-slide.swiper-slide-next .card { float: left; } .wallets .slides .swiper-slide.swiper-slide-prev .card { float: right; } } .wallets .slides .swiper-slide.swiper-slide-prev, .wallets .slides .swiper-slide.swiper-slide-next { opacity: .3; -webkit-transform: scale(0.8); transform: scale(0.8); } .wallets .slides .swiper-slide.swiper-slide-prev { left: 5vw; } .wallets .slides .swiper-slide.swiper-slide-next { left: -5vw; } .wallets .swiper-pagination { visibility: hidden; } .platform-browser .wallets .slides .swiper-slide.swiper-slide-prev:hover, .platform-browser .wallets .slides .swiper-slide.swiper-slide-next:hover { opacity: 1; } .popup-modal { background: #fff; top: 50%; left: 50%; position: absolute; z-index: 10; width: 90%; max-width: 350px; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); border-radius: 12px; text-align: center; } .popup-modal-header { padding: 1rem; border-radius: 12px 12px 0 0; min-height: 120px; } .popup-modal-header-success { background: #fab915; } .popup-modal-header-warning { background: #bb331a; } .popup-modal-header-img { height: 6rem; background-size: contain; margin-top: .3rem; background-repeat: no-repeat; background-position: center; } .popup-modal-header-img-success { background-image: url("../img/onboarding-success.svg"); height: 6rem; background-size: contain; margin-top: .3rem; } .popup-modal-header-img-warning { background-image: url("../img/warning.svg"); height: 6rem; background-size: contain; margin-top: .3rem; } .popup-modal-content { padding: 0rem 1rem; } .popup-modal-heading { margin: 0 0 1rem; color: #445; font-weight: bold; font-size: 1.3rem; margin-top: 1rem; line-height: 1.3; } .popup-modal-message { color: #667; font-weight: 200; } .popup-modal .button { margin-top: 1rem; } .popup-modal-content-success .button { color: #fab915 !important; } .popup-modal-content-warning .button { color: #bb331a !important; } .modal-backdrop.active { background: rgba(0, 0, 0, 0.8); } #backup-needed-modal .button.button-secondary { font-size: 14px; margin-top: 0; } #backup-needed-modal .button { display: block; margin-right: auto; margin-left: auto; margin-top: 1rem; } #screenshot-warning-modal .popup-modal-header-img { background-image: url("../img/no-screenshot.svg"); } #choose-fee-level .selected-fee-level { text-align: center; background: #f9f9f9; font-size: 11px; height: 140px; padding-top: 25px; } #choose-fee-level .selected-fee-level .row { padding: 0; } #choose-fee-level .selected-fee-level .col { padding-top: 15px; } #choose-fee-level .selected-fee-level .separator { border-left: 1px solid #d9d9df; height: 75%; } #choose-fee-level .selected-fee-level .value { font-size: 20px; margin-bottom: 10px; } #choose-fee-level .selected-fee-level .rate .list { margin-bottom: 0; } #choose-fee-level .selected-fee-level .item-input input[type="number"] { text-align: right; padding-right: 90px; } #choose-fee-level .selected-fee-level .item-input .unit { color: #9c9c9c; background: #f2f2f2; position: absolute; right: 0; top: 0; padding: 15px 10px 12px 10px; } #choose-fee-level .error-fee { padding: 8px 10px; color: #ef473a; font-size: 12px; text-align: center; } #choose-fee-level .error-fee i { margin-right: 8px; } #choose-fee-level .box-notification { margin: 0; padding: 1px; text-align: center; } click-to-accept { position: fixed; bottom: 0; height: 92px; width: 100%; } click-to-accept .click-to-accept__button.button.button-primary.button-standard { height: 100%; max-width: 9999px; width: 100%; } click-to-accept .click-to-accept__button.disable { pointer-events: none; } click-to-accept .click-to-accept__status-text { position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 4; -webkit-transform: translateY(2rem); transform: translateY(2rem); opacity: 0; pointer-events: none; display: flex; align-items: center; justify-content: center; } click-to-accept .click-to-accept__status-text.enter { transition: transform 250ms ease, opacity 250ms ease; -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } click-to-accept .click-to-accept__status-text > img { margin-right: 10px; animation-name: spin; animation-duration: 500ms; animation-iteration-count: infinite; animation-timing-function: linear; } @keyframes spin { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } incoming-data-menu .bp-action-sheet__sheet { padding-left: 0; padding-right: 0; padding-top: 0; padding: 0; } incoming-data-menu .incoming-data-menu__header { padding-bottom: 1rem; font-size: 16px; } incoming-data-menu .incoming-data-menu__item { border-top: 1px solid #f7f4f4; font-size: 14px; padding: 1rem 1.25rem; color: #4A4A4A; display: flex; align-items: center; } incoming-data-menu .incoming-data-menu__item.head { display: block; padding-top: 1.5rem; } incoming-data-menu .incoming-data-menu__item:first-child { border: 0; } incoming-data-menu .incoming-data-menu__item > img { margin-left: .2rem; position: absolute; } incoming-data-menu .incoming-data-menu__item__text { padding-left: 2.7rem; } incoming-data-menu .incoming-data-menu__cancel { background: #EDEDED; font-size: 18px; height: 66px; display: flex; align-items: center; justify-content: center; color: #3A3A3A; border-top: 1px solid #e4e4e4; } incoming-data-menu .incoming-data-menu__cancel:active { background: #dadada; } incoming-data-menu .incoming-data-menu__url { background: rgba(203, 203, 203, 0.13); padding: .5rem; padding-left: 0; border-radius: 4px; display: flex; align-items: center; margin-bottom: .5rem; } incoming-data-menu .incoming-data-menu__url__icon { padding: 0 9px 0 10px; display: flex; align-items: center; } incoming-data-menu .incoming-data-menu__url__text { color: #4A4A4A; font-size: 14px; border-left: 1px solid #E4E4E4; padding-left: .7rem; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } slide-to-accept { position: fixed; bottom: 0; height: 92px; width: 100%; background: #494949; } slide-to-accept .slide__listener { height: 100%; width: 100%; overflow: hidden; position: relative; } slide-to-accept .slide__slider { display: flex; align-items: center; height: 100%; position: absolute; height: 100%; width: 100%; background: #fab915; -webkit-transform: translateX(0); transform: translateX(0); margin-left: -100%; z-index: 2; } slide-to-accept .slide__slider::before { display: flex; align-items: center; height: 100%; position: absolute; content: ''; width: 10000px; left: -9999px; background: #fab915; } slide-to-accept .slide__slider::after { display: flex; align-items: center; height: 100%; position: absolute; content: ''; width: 15px; right: -10px; background: #fab915; } slide-to-accept .slide__slider__tip { display: flex; align-items: center; height: 100%; position: absolute; width: 124px; height: 116px; background: #fab915; right: -71px; border-radius: 50%; top: 50%; -webkit-transform: translateY(-47%); transform: translateY(-47%); } slide-to-accept .slide__bitcoin { display: flex; align-items: center; height: 100%; position: absolute; left: 20px; z-index: 3; } slide-to-accept .slide__bitcoin > img { -webkit-transform: rotateZ(-5deg); transform: rotateZ(-5deg); } slide-to-accept .slide__button-text { display: flex; align-items: center; height: 100%; position: absolute; justify-content: center; top: 0; left: 0; width: 100%; color: #FFFFFF; font-size: 18px; font-weight: 600; letter-spacing: .03rem; z-index: 1; } slide-to-accept .slide__button-text .justify { width: 50%; text-align: center; } slide-to-accept .slide__status-text { display: flex; align-items: center; height: 100%; position: absolute; justify-content: center; color: #FFFFFF; z-index: 4; width: 100%; font-size: 17px; letter-spacing: 0.02rem; -webkit-transform: translateY(2rem); transform: translateY(2rem); opacity: 0; } slide-to-accept .slide__status-text.enter { transition: transform 250ms ease, opacity 250ms ease; -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } slide-to-accept .slide__status-text > img { margin-right: 10px; animation-name: spin; animation-duration: 500ms; animation-iteration-count: infinite; animation-timing-function: linear; } slide-to-accept .slide__arrow { display: flex; align-items: center; height: 100%; position: absolute; right: 20px; } @keyframes spin { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } slide-to-accept-success { height: 100%; width: 100%; position: fixed; top: 0; left: 0; z-index: 99999; text-align: center; display: flex; align-items: center; justify-content: center; } slide-to-accept-success .slide-success__windows-background { background: #11D1A6; height: 100%; width: 100%; position: fixed; } slide-to-accept-success .slide-success__background { height: 10vmax; width: 10vmax; background: #fab915; bottom: 0; position: absolute; left: calc(50% - 5vmax); border-radius: 50%; transition: transform 600ms ease, background 600ms ease; } slide-to-accept-success .slide-success__background.fill-screen { -webkit-transform: scale3d(20, 20, 1) translateY(-40%); transform: scale3d(20, 20, 1) translateY(-40%); background: #11D1A6; } slide-to-accept-success .slide-success__content { position: relative; z-index: 1; margin-top: -20vh; } slide-to-accept-success .slide-success__content > img { margin-bottom: 1.8rem; -webkit-transform: translateY(5rem); transform: translateY(5rem); opacity: 0; transition: transform 400ms ease, opacity 400ms ease; transition-delay: 200ms; } slide-to-accept-success .slide-success__content > img.reveal { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } slide-to-accept-success .slide-success__content__header { color: #FFFFFF; font-size: 26px; -webkit-transform: translateY(5rem); transform: translateY(5rem); opacity: 0; transition: transform 400ms ease, opacity 400ms ease; transition-delay: 250ms; } slide-to-accept-success .slide-success__content__header.reveal { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } slide-to-accept-success .slide-success__footer { position: absolute; left: 0; bottom: 0; padding: 0 1.75rem; width: 100%; -webkit-transform: translateY(5rem); transform: translateY(5rem); opacity: 0; transition: transform 400ms ease, opacity 400ms ease; transition-delay: 250ms; } slide-to-accept-success .slide-success__footer.reveal { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } slide-to-accept-success .slide-success__footer__btn { display: block; color: #FFFFFF; font-size: 18px; font-weight: 600; letter-spacing: 2.86px; padding: 1rem 0 1.1rem; border-top: 1px solid rgba(255, 255, 255, 0.45); cursor: pointer; } #tx-details .action-created.action-accepted { color: green; } #tx-details .action-rejected { color: red; } #txp-details, #view-confirm { /* Helper classes for .label. Will have to relook into the whole CSS structure for potential optimisations. */ } #txp-details .item-note, #view-confirm .item-note { float: none; } #txp-details .item-note .fee-rate, #view-confirm .item-note .fee-rate { display: inline-block; } #txp-details .list, #view-confirm .list { background: #f5f5f5; } #txp-details .add-bottom-for-cta, #view-confirm .add-bottom-for-cta { bottom: 92px; } #txp-details .head, #view-confirm .head { padding: 30px 20px 3rem; border-top: 0; } #txp-details .head .sending-label, #view-confirm .head .sending-label { display: flex; font-size: 18px; align-items: center; margin-bottom: 1.5rem; } #txp-details .head .sending-label img, #view-confirm .head .sending-label img { margin-right: 1rem; height: 35px; width: 35px; } #txp-details .head .amount-label, #view-confirm .head .amount-label { line-height: 30px; } #txp-details .head .amount-label .amount, #view-confirm .head .amount-label .amount { font-size: 38px; margin-bottom: .5rem; } #txp-details .head .amount-label .amount > .unit, #view-confirm .head .amount-label .amount > .unit { font-family: "Roboto-Light"; } #txp-details .head .amount-label .alternative, #view-confirm .head .amount-label .alternative { font-size: 16px; font-family: "Roboto-Light"; color: #9B9B9B; } #txp-details .item, #view-confirm .item { border-color: #EFEFEF; } #txp-details .item-note, #view-confirm .item-note { word-break: keep-all; } #txp-details .info span, #view-confirm .info span { display: inline-block; } #txp-details .info .badge, #view-confirm .info .badge { border-radius: 0; padding: .5rem; } #txp-details .info .item, #view-confirm .info .item { color: #4A4A4A; padding-top: 10px; padding-bottom: 10px; padding-left: 20px; } #txp-details .info .item:not(.item-icon-right), #view-confirm .info .item:not(.item-icon-right) { padding-right: 20px; } #txp-details .info .item .label, #view-confirm .info .item .label { font-size: 14px; color: #6C6C6E; margin-bottom: 8px; } #txp-details .info .item.single-line, #view-confirm .info .item.single-line { display: flex; align-items: center; padding-top: 17px; padding-bottom: 17px; } #txp-details .info .item.single-line .label, #view-confirm .info .item.single-line .label { margin: 0; flex-grow: 1; } #txp-details .info .item.low-fees, #view-confirm .info .item.low-fees { display: flex; font-size: 14px; color: #777; align-items: center; } #txp-details .info .item.low-fees i, #view-confirm .info .item.low-fees i { padding-right: 20px; } #txp-details .info .item.low-fees span, #view-confirm .info .item.low-fees span { display: inline; } #txp-details .info .toggle-unconfirmed, #view-confirm .info .toggle-unconfirmed { padding-bottom: 15px; } #txp-details .info .toggle-label, #view-confirm .info .toggle-label { margin-top: 5px; font-size: 14px; color: #6C6C6E; } #txp-details .info .item-divider, #view-confirm .info .item-divider { padding-top: 1.2rem; color: #6C6C6E; font-size: 15px; } #txp-details .info .payment-proposal-to, #view-confirm .info .payment-proposal-to { width: 100%; display: inline-block; padding: 8px 13px; background-color: rgba(203, 203, 203, 0.13); margin-top: 10px; margin-bottom: 5px; display: flex; align-items: center; border-radius: 4px; } #txp-details .info .payment-proposal-to img, #view-confirm .info .payment-proposal-to img { padding: .2rem; padding-left: 0; border-right: 1px solid #e4e4e4; padding-right: 12px; } #txp-details .info .payment-proposal-to i, #view-confirm .info .payment-proposal-to i { color: grey; position: inherit; padding: 0 10px; float: right; } #txp-details .info .payment-proposal-to contact, #view-confirm .info .payment-proposal-to contact { margin-left: 15px; font-size: 14px; display: inline-block; } #txp-details .info .wallet, #view-confirm .info .wallet { display: flex; align-items: center; padding: .2rem 0; margin-bottom: 5px; } #txp-details .info .wallet > i, #view-confirm .info .wallet > i { padding: 0; position: static; } #txp-details .info .wallet > i > img, #view-confirm .info .wallet > i > img { height: 24px; width: 24px; padding: 2px; margin-right: .7rem; box-shadow: none; } #txp-details .info .timeline-item, #view-confirm .info .timeline-item { border: 0; padding: 17px 20px; } #txp-details .info .timeline-item:nth-child(2), #view-confirm .info .timeline-item:nth-child(2) { border-top: 1px solid #EFEFEF; } #txp-details .info .timeline-item:last-child, #view-confirm .info .timeline-item:last-child { border-bottom: 1px solid #EFEFEF; } #txp-details .info .timeline-item > *, #view-confirm .info .timeline-item > * { padding-right: 0; } #txp-details .info .timeline-content, #view-confirm .info .timeline-content { display: flex; align-items: center; } #txp-details .info .timeline-content__icon, #view-confirm .info .timeline-content__icon { display: flex; align-items: center; min-width: 40px; padding-right: 1rem; padding-left: 1rem; margin-right: .5rem; position: relative; } #txp-details .info .timeline-content__icon::before, #view-confirm .info .timeline-content__icon::before { content: ''; background: #e8e8e8; height: 100px; width: 1px; position: absolute; left: 50%; -webkit-transform: translateX(-50%) translateY(-100%); transform: translateX(-50%) translateY(-100%); top: 0; } #txp-details .info .timeline-content__icon::after, #view-confirm .info .timeline-content__icon::after { content: ''; background: #e8e8e8; height: 100px; width: 1px; position: absolute; left: 50%; -webkit-transform: translateX(-50%) translateY(100%); transform: translateX(-50%) translateY(100%); bottom: 0; } #txp-details .info .timeline-content__icon > div, #view-confirm .info .timeline-content__icon > div { border: 3px solid #fab915; border-radius: 3px; display: flex; height: 26px; width: 26px; font-size: 13px; align-items: center; justify-content: center; font-weight: 600; vertical-align: middle; color: #fab915; } #txp-details .info .timeline-content__icon > div.rejected, #view-confirm .info .timeline-content__icon > div.rejected { background: #E15061; border-color: #E15061; color: #FFFFFF; font-family: "Roboto-Bold"; font-size: 19px; } #txp-details .info .timeline-content__label, #view-confirm .info .timeline-content__label { flex-grow: 1; } #txp-details .info .timeline-content__label > .action, #view-confirm .info .timeline-content__label > .action { font-size: 16px; } #txp-details .info .timeline-content__label > .name, #view-confirm .info .timeline-content__label > .name { color: #aaa; font-size: 14px; } #txp-details .proposal-deletion-help, #view-confirm .proposal-deletion-help { color: #6C6C6E; padding: 1rem 2rem; } #txp-details .view-on-blockchain-btn, #view-confirm .view-on-blockchain-btn { background: #e8e7e7; color: rgba(58, 58, 58, 0.6); margin-bottom: 1.5rem; } #txp-details .glidera-success, #view-confirm .glidera-success { padding: 20px; margin-top: 15px; } #txp-details .glidera-success span, #view-confirm .glidera-success span { font-size: 15px; display: block; } #txp-details .glidera-explanation, #view-confirm .glidera-explanation { padding: 0 1rem; white-space: normal; } #txp-details .glidera-description, #view-confirm .glidera-description { text-align: center; font-size: 12px; color: #667; } #txp-details .button-address, #view-confirm .button-address { margin-top: 10px; background: transparent; border: none; font-size: 12px; color: #aaa; } #txp-details .label.flex, #view-confirm .label.flex { display: flex; } #txp-details .label.flex textarea, #view-confirm .label.flex textarea { flex: 1 1 auto; } #txp-details .label.align-items-center, #view-confirm .label.align-items-center { align-items: center; } #tx-status .popup-txsent { font-size: 5rem; color: #4A90E2; } #tx-status .popup-txsigned i, #tx-status .popup-txrejected i { font-size: 5rem; color: #4A90E2; } item-selector .bp-action-sheet__sheet { padding-left: 2rem; padding-right: .75rem; } item-selector .item-selector .option { border: 0; padding-right: 0; padding-top: 0; padding-bottom: 0; margin-bottom: 1px; overflow: visible; } item-selector .item-selector .option > i { color: #494949; padding: 0 0 5px 0; margin-left: -5px; } item-selector .item-selector .option > i > img { height: 39px; width: 39px; padding: 4px; } item-selector .item-selector .item-selector-inner { display: flex; position: relative; padding-top: 16px; padding-bottom: 16px; } item-selector .item-selector .item-selector-inner::after { display: block; position: absolute; width: 100%; height: 1px; background: #EFEFEF; bottom: 0; right: 0; content: ''; } item-selector .item-selector .item-selector-inner .check { padding: 0 1.2rem; } item-selector .item-selector .item-selector-details { flex-grow: 1; } item-selector .item-selector .item-selector-details .item-selector-name { padding-bottom: 5px; } wallet-selector .bp-action-sheet__sheet { padding-left: 2rem; padding-right: .75rem; } wallet-selector .subheader { margin: 20px 0 10px 0; font-weight: bold; padding-bottom: 10px; border-bottom: 1px solid #EFEFEF; } wallet-selector .subheader .wallet-coin-logo { vertical-align: middle; margin-right: 5px; } wallet-selector .wallet-selector .wallet { border: 0; padding-right: 0; padding-top: 0; padding-left: 65px; padding-bottom: 0; margin-bottom: 1px; overflow: visible; } wallet-selector .wallet-selector .wallet > i { padding: 0; margin-left: -5px; } wallet-selector .wallet-selector .wallet > i > img { height: 39px; width: 39px; padding: 4px; } wallet-selector .wallet-selector .wallet-inner { display: flex; position: relative; padding-top: 16px; padding-bottom: 16px; } wallet-selector .wallet-selector .wallet-inner::after { display: block; position: absolute; width: 100%; height: 1px; background: #EFEFEF; bottom: 0; right: 0; content: ''; } wallet-selector .wallet-selector .wallet-inner .check { padding: 0 1.2rem; } wallet-selector .wallet-selector .wallet-details { flex-grow: 1; } wallet-selector .wallet-selector .wallet-details .wallet-name { padding-bottom: 5px; } wallet-selector .wallet-selector .wallet-details .wallet-balance { color: #3A3A3A; font-family: "Roboto-Light"; } account-selector { text-align: left; } account-selector .bp-action-sheet__sheet { padding-left: 2rem; padding-right: .75rem; } account-selector .account-selector .account { border: 0; padding-right: 0; padding-top: 0; padding-left: 65px; padding-bottom: 0; margin-bottom: 1px; overflow: visible; } account-selector .account-selector .account > i { padding: 0; margin-left: -5px; } account-selector .account-selector .account > i > img { height: 39px; width: 39px; padding: 4px; background-color: #fab915; } account-selector .account-selector .account > i > img.icon-add { background-color: #9b9bab; } account-selector .account-selector .account-inner { display: flex; position: relative; padding-top: 16px; padding-bottom: 16px; } account-selector .account-selector .account-inner::after { display: block; position: absolute; width: 100%; height: 1px; background: #EFEFEF; bottom: 0; right: 0; content: ''; } account-selector .account-selector .account-inner .check { padding: 0 1.2rem; } account-selector .account-selector .account-details { flex-grow: 1; } account-selector .account-selector .account-details .account-name { padding-bottom: 5px; } account-selector .account-selector .account-details .account-email { color: #3A3A3A; font-family: "Roboto-Light"; } account-selector .account-selector .account-details .account-add { padding-bottom: 16px; padding-top: 11px; } #coinbase .spinner svg { stroke: #0067c8; fill: #0067c8; } #coinbase .add-bottom-for-cta { bottom: 92px; } #coinbase .head { padding: 30px 20px 4rem; border-top: 0; } #coinbase .head .sending-label { display: flex; font-size: 18px; align-items: center; margin-bottom: 1.5rem; } #coinbase .head .sending-label img { margin-right: 1rem; height: 35px; width: 35px; } #coinbase .head .amount-label { line-height: 30px; } #coinbase .head .amount-label .amount { font-size: 38px; margin-bottom: .5rem; } #coinbase .head .amount-label .amount > .unit { font-family: "Roboto-Light"; } #coinbase .head .amount-label .alternative { font-size: 16px; font-family: "Roboto-Light"; color: #9B9B9B; } #coinbase .item { border-color: #EFEFEF; } #coinbase .info .badge { border-radius: 0; padding: .5rem; } #coinbase .info .item { color: #4A4A4A; padding-top: 10px; padding-bottom: 10px; padding-left: 20px; } #coinbase .info .item:not(.item-icon-right) { padding-right: 20px; } #coinbase .info .item .label { font-size: 14px; color: #6C6C6E; margin-bottom: 8px; } #coinbase .info .item .capitalized { text-transform: capitalize; } #coinbase .info .item .wallet .big-icon-svg > .bg { height: 24px; width: 24px; padding: 2px; box-shadow: none; vertical-align: middle; } #coinbase .info .item .total-amount { font-weight: bold; } #coinbase .info .item.single-line { display: flex; align-items: center; padding-top: 17px; padding-bottom: 17px; } #coinbase .info .item.single-line .label { margin: 0; flex-grow: 1; } #coinbase .info .item-divider { padding-top: 1.2rem; color: #6C6C6E; font-size: 15px; } #coinbase .info .wallet { display: flex; align-items: center; padding: .2rem 0; margin-bottom: 5px; } #coinbase .info .wallet ~ .bp-arrow-right { top: 14px; } #coinbase .info .wallet > i { padding: 0; position: static; } #coinbase .info .wallet > i > img { height: 24px; width: 24px; padding: 2px; margin-right: .7rem; box-shadow: none; } #glidera .spinner svg { stroke: #0067c8; fill: #0067c8; } #glidera .add-bottom-for-cta { bottom: 92px; } #glidera .head { padding: 30px 20px 4rem; border-top: 0; } #glidera .head .sending-label { display: flex; font-size: 18px; align-items: center; margin-bottom: 1.5rem; } #glidera .head .sending-label img { margin-right: 1rem; height: 35px; width: 35px; } #glidera .head .amount-label { line-height: 30px; } #glidera .head .amount-label .amount { font-size: 38px; margin-bottom: .5rem; } #glidera .head .amount-label .amount > .unit { font-family: "Roboto-Light"; } #glidera .head .amount-label .alternative { font-size: 16px; font-family: "Roboto-Light"; color: #9B9B9B; } #glidera .item { border-color: #EFEFEF; } #glidera .info .badge { border-radius: 0; padding: .5rem; } #glidera .info .item { color: #4A4A4A; padding-top: 10px; padding-bottom: 10px; padding-left: 20px; } #glidera .info .item:not(.item-icon-right) { padding-right: 20px; } #glidera .info .item .label { font-size: 14px; color: #6C6C6E; margin-bottom: 8px; } #glidera .info .item .capitalized { text-transform: capitalize; } #glidera .info .item .wallet .big-icon-svg > .bg { height: 24px; width: 24px; padding: 2px; box-shadow: none; vertical-align: middle; } #glidera .info .item .total-amount { font-weight: bold; } #glidera .info .item.single-line { display: flex; align-items: center; padding-top: 17px; padding-bottom: 17px; } #glidera .info .item.single-line .label { margin: 0; flex-grow: 1; } #glidera .info .item-divider { padding-top: 1.2rem; color: #6C6C6E; font-size: 15px; } #glidera .info .wallet { display: flex; align-items: center; padding: .2rem 0; margin-bottom: 5px; } #glidera .info .wallet ~ .bp-arrow-right { top: 14px; } #glidera .info .wallet > i { padding: 0; position: static; } #glidera .info .wallet > i > img { height: 24px; width: 24px; padding: 2px; margin-right: .7rem; box-shadow: none; } #glidera .glidera-lead { margin: 2rem 1rem; color: #445; font-size: 20px; line-height: 1.4; text-align: center; } #glidera .glidera-text { margin: 2rem 1rem; color: #667; font-size: 16px; line-height: 1.4; text-align: center; } #glidera .disclosure { color: #9b9bab; font-size: 12px; text-align: left; margin: 1rem; } #glidera .item-img-buy, #glidera .item-img-sell { vertical-align: middle; margin-right: 10px; } #amazon .icon-amazon { background-image: url("../img/icon-amazon.svg"); } #amazon .spinner svg { stroke: black; fill: black; } #amazon .add-bottom-for-cta { bottom: 92px; } #amazon .head { padding: 30px 20px 4rem; border-top: 0; } #amazon .head .sending-label { display: flex; font-size: 18px; align-items: center; margin-bottom: 1.8rem; } #amazon .head .sending-label img { margin-right: 1rem; height: 35px; width: 35px; } #amazon .head .sending-label .big-icon-svg { margin-right: 0.6rem; } #amazon .head .amount-label { line-height: 30px; } #amazon .head .amount-label .amount { font-size: 38px; margin-bottom: .5rem; } #amazon .head .amount-label .amount > .unit { font-family: "Roboto-Light"; } #amazon .head .amount-label .alternative { font-size: 12px; font-family: "Roboto-Light"; color: #9B9B9B; } #amazon .item { border-color: #EFEFEF; } #amazon .info .badge { border-radius: 0; padding: .5rem; } #amazon .info .item { color: #4A4A4A; padding-top: 10px; padding-bottom: 10px; padding-left: 20px; } #amazon .info .item:not(.item-icon-right) { padding-right: 20px; } #amazon .info .item .label { font-size: 14px; color: #6C6C6E; margin-bottom: 8px; } #amazon .info .item .capitalized { text-transform: capitalize; } #amazon .info .item .wallet .big-icon-svg > .bg { height: 24px; width: 24px; padding: 2px; box-shadow: none; vertical-align: middle; } #amazon .info .item .total-amount { font-weight: bold; } #amazon .info .item.single-line { display: flex; align-items: center; padding-top: 17px; padding-bottom: 17px; } #amazon .info .item.single-line .label { margin: 0; flex-grow: 1; } #amazon .info .item-divider { padding-top: 1.2rem; color: #6C6C6E; font-size: 15px; } #amazon .info .wallet { display: flex; align-items: center; padding: .2rem 0; margin-bottom: 5px; } #amazon .info .wallet ~ .bp-arrow-right { top: 14px; } #amazon .info .wallet > i { padding: 0; position: static; } #amazon .info .wallet > i > img { height: 24px; width: 24px; padding: 2px; margin-right: .7rem; box-shadow: none; } #mercadolibre .icon-amazon { background-image: url("../img/mercado-libre/icon-ml.svg"); } #mercadolibre .spinner svg { stroke: black; fill: black; } #mercadolibre .add-bottom-for-cta { bottom: 92px; } #mercadolibre .head { padding: 30px 20px 4rem; border-top: 0; } #mercadolibre .head .sending-label { display: flex; font-size: 18px; align-items: center; margin-bottom: 1.8rem; } #mercadolibre .head .sending-label img { margin-right: 1rem; height: 35px; width: 35px; } #mercadolibre .head .sending-label span { text-transform: capitalize; } #mercadolibre .head .sending-label .big-icon-svg { padding: 0 7px 0 0; margin-right: 0.6rem; } #mercadolibre .head .sending-label .big-icon-svg > .bg { height: 28px; box-shadow: none; } #mercadolibre .head .amount-label { line-height: 30px; } #mercadolibre .head .amount-label .amount { font-size: 38px; margin-bottom: .5rem; } #mercadolibre .head .amount-label .amount > .unit { font-family: "Roboto-Light"; } #mercadolibre .head .amount-label .alternative { font-size: 12px; font-family: "Roboto-Light"; color: #9B9B9B; } #mercadolibre .item { border-color: #EFEFEF; } #mercadolibre .info .badge { border-radius: 0; padding: .5rem; } #mercadolibre .info .item { color: #4A4A4A; padding-top: 10px; padding-bottom: 10px; padding-left: 20px; } #mercadolibre .info .item:not(.item-icon-right) { padding-right: 20px; } #mercadolibre .info .item .label { font-size: 14px; color: #6C6C6E; margin-bottom: 8px; } #mercadolibre .info .item .capitalized { text-transform: capitalize; } #mercadolibre .info .item .wallet .big-icon-svg > .bg { height: 24px; width: 24px; padding: 2px; box-shadow: none; vertical-align: middle; } #mercadolibre .info .item .total-amount { font-weight: bold; } #mercadolibre .info .item.single-line { display: flex; align-items: center; padding-top: 17px; padding-bottom: 17px; } #mercadolibre .info .item.single-line .label { margin: 0; flex-grow: 1; } #mercadolibre .info .item-divider { padding-top: 1.2rem; color: #6C6C6E; font-size: 15px; } #mercadolibre .info .wallet { display: flex; align-items: center; padding: .2rem 0; margin-bottom: 5px; } #mercadolibre .info .wallet ~ .bp-arrow-right { top: 14px; } #mercadolibre .info .wallet > i { padding: 0; position: static; } #mercadolibre .info .wallet > i > img { height: 24px; width: 24px; padding: 2px; margin-right: .7rem; box-shadow: none; } #meli-list-cards img.item-logo { width: auto; height: auto; border-radius: 0; } #meli-card .card-head { margin: 20px 0; text-align: center; } #meli-card .card-head .date { font-size: 12px; margin: 10px 0; } #meli-card .card-head .amount { font-size: 16px; font-weight: bold; } #meli-card .card-status { text-align: center; margin-bottom: 25px; } #meli-card .card-status .card-status-desc { margin-top: 5px; font-size: 12px; color: #f8ecd0; } #meli-card .card-status .redeem-pin { font-weight: bold; font-size: 22px; } #meli-card .card-status .button-redeem { margin-top: 10px; background: transparent; border: none; font-size: 12px; color: #aaa; } #meli-card .card-remove { text-align: center; margin-top: 30px; } #meli-card .card-remove .button-remove { margin-top: 10px; background: transparent; border: none; font-size: 12px; color: red; } #coinbase .button-small, #glidera .button-small { font-size: 13px; } .integration-onboarding { height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; } .integration-onboarding-logo { display: inline-block; margin-bottom: 1em; } .integration-onboarding-logo img { max-width: 170px; } .integration-onboarding-description { margin-top: 0; margin-left: 2rem; margin-right: 2rem; margin-bottom: 130px; opacity: .6; max-width: 300px; } .integration-onboarding-cta, .integration-onboarding-oauthform { position: absolute; bottom: 5vh; width: 100%; } .integration-onboarding-oauthform .item { border: 0 none; } .integration-onboarding-oauthform .item-floating-label { padding-left: 0; margin-left: 2em; margin-right: 2em; } .integration-onboarding-oauthform input { border-bottom: 2px solid #9b9bab; } #custom-amount .button-share { color: #fff; box-shadow: none; border-color: transparent; background: transparent; padding: 0 10px; } #custom-amount .button-share .icon:before { font-size: 26px; } #custom-amount .button-address { margin-top: 10px; background: transparent; border: none; font-size: 12px; color: #aaa; } #custom-amount .address { background: #fff; overflow: auto; height: 100%; } #custom-amount .address .qr-code { text-align: center; margin-top: 24vh; margin-bottom: 7vh; } @media (max-height: 800px) { #custom-amount .address .qr-code { margin-top: 18vh; } } @media (max-height: 700px) { #custom-amount .address .qr-code { margin-top: 14vh; } } @media (max-height: 600px) { #custom-amount .address .qr-code { margin-top: 8vh; } } #custom-amount .address .info { position: absolute; width: 100%; bottom: 0; } #custom-amount .address .info .badge { border-radius: 0; padding: .5rem; } #custom-amount .address .info .item { color: #4A4A4A; padding-top: 10px; padding-bottom: 10px; padding-left: 20px; } #custom-amount .address .info .item:not(.item-icon-right) { padding-right: 20px; } #custom-amount .address .info .item .item-note { width: 75%; text-align: right; } #custom-amount .address .info .item .label { font-size: 14px; color: #6C6C6E; margin-bottom: 8px; } #custom-amount .address .info .item .wallet { float: right; overflow: hidden; } #custom-amount .address .info .item .wallet .big-icon-svg > .bg { height: 20px; width: 20px; padding: 1px; box-shadow: none; vertical-align: text-bottom; } #custom-amount .address .info .item .single-line { display: flex; align-items: center; padding-top: 17px; padding-bottom: 17px; } #custom-amount .address .info .item .single-line .item-note { margin-left: 10px; } #custom-amount .address .address-types { text-align: center; } #pin { background-color: #FAFAFA; width: 100%; height: 100%; top: 0; left: 0; } #pin .content { text-align: center; position: fixed; width: 100%; height: 100%; } #pin .content .app-icon { margin-top: -55px; } #pin .content .app-icon .big-icon-svg > .bg { background-image: url("../img/app/icon.png"); height: 60px; width: 60px; margin: auto; } #pin .content .block-text { align-items: center; background-color: #F1F1F1; height: 30%; border-bottom: 1px solid #c5c5c5; } #pin .content .block-text .message { margin: auto; } #pin .content .block-text span { width: 60%; margin: 10% auto; } @media (min-width: 480px) { #pin .content .block-text span { font-size: 30px; width: 90%; } } #pin .content .block-code { width: 50%; margin: auto; } @media (min-width: 480px) { #pin .content .block-code { width: 25%; } } #pin .content .block-buttons { color: #445; font-size: 1.7rem; font-family: "Roboto-Light", sans-serif-light; cursor: pointer; position: absolute; bottom: 3%; left: 5%; width: 90%; } #pin .content .block-buttons .col { padding: 5%; } @media (min-width: 480px) { #pin .content .block-buttons { left: 15%; width: 70%; max-height: 55%; } } #pin .circle-copay { border-radius: 50%; box-shadow: 0 0 3px 0px #5b5b5b; transition: background-color .2s ease-in-out; padding: 7%; margin: 5%; border: 1px solid #494949; } #pin .circle-bitpay { border-radius: 50%; box-shadow: 0 0 3px 0px #5b5b5b; transition: background-color .2s ease-in-out; padding: 7%; margin: 5%; border: 1px solid #fab915; } #pin .filled-copay { background-color: #494949; } #pin .filled-bitpay { background-color: #1f3598; } #pin .error { color: #f13333; max-width: 70%; } log-options .bp-action-sheet__sheet { padding-left: 2rem; padding-right: .75rem; } log-options .entry { border: 0; padding-right: 0; padding-top: 0; padding-bottom: 0; margin-bottom: 1px; overflow: visible; } log-options .entry > i { color: #494949; padding: 0 0 5px 0; margin-left: -5px; } log-options .entry > i > img { height: 39px; width: 39px; padding: 4px; } log-options .entry-inner { display: flex; position: relative; padding-top: 16px; padding-bottom: 16px; } log-options .entry-inner::after { display: block; position: absolute; width: 100%; height: 1px; background: #EFEFEF; bottom: 0; right: 0; content: ''; } log-options .entry-details { flex-grow: 1; } log-options .entry-details .entry-name { padding-bottom: 5px; } log-options #check-bar .check-bar .initial-bar { border: 2px solid #494949; } log-options #check-bar .check-bar .fill-bar-error { width: 10% !important; } log-options #check-bar .check-bar .fill-bar-warn { width: 35% !important; } log-options #check-bar .check-bar .fill-bar-info { width: 65% !important; } log-options #check-bar .check-bar .fill-bar-debug { width: 90% !important; } log-options #check-bar .head .checkbox-icon { width: 22px; height: 22px; top: 0; } log-options #check-bar .checkbox-icon { width: 10px; height: 10px; top: 6px; } #check-bar .item { padding: 40px; } #check-bar .checkbox-icon { width: 22px; height: 22px; } #check-bar .checkbox-icon:after { border: none; } #check-bar .check-bar { position: relative; } #check-bar .check-bar .initial-bar-default { border: 2px solid #fab915; width: 0%; top: 40px; z-index: 99; border-radius: 10px; position: absolute; } #check-bar .check-bar .base-bar { position: absolute; width: 100%; border-bottom: 2px solid #f2f2f2; top: 41px; z-index: 98; left: 0px; } #check-bar .check-bar.list { margin-top: 20px; display: flex; justify-content: space-between; } #check-bar .check-bar.list .custom-checkbox { text-align: -webkit-center; } #check-bar .check-bar.list .custom-checkbox .item { border-style: none; z-index: 999; background-color: inherit; } #check-bar .check-bar.list .custom-checkbox label { padding-top: 5px; } #cash-scan .comment { color: #667; font-size: 0.9em; } #cash-scan .item { color: #445; padding-top: 1.3rem; padding-bottom: 1.3rem; } #cash-scan .heading { font-size: 17px; color: #445; margin: 1rem 0; padding-top: 5px; padding-bottom: 5px; border: none; } #cash-scan .text-disabled { color: #9b9bab; } #cash-scan .supported { display: flex; } #cash-scan .supported .wallet-content { padding-left: 7px; } #cash-scan .duplicate-button { position: absolute; right: 15px; padding-top: .5rem; } #cash-scan a { cursor: pointer; } .gravatar { border-radius: 3px; display: inline-block; } /* This is for rules that don't yet have a home. * Our goal is to delete this file. Search the regex: /class=".*CLASS.*?"/ */ .enable_text_select { -webkit-user-select: auto; -moz-user-select: auto; -ms-user-select: auto; user-select: auto; } .box-notification { padding: 0.5rem; border: 1px solid; margin: 10px; } .box-notification a { color: #fff; } .box-notification.notice { border-color: #b2b2b2; background-color: #f8f8f8; color: #444; } .box-notification.warning { border-color: #e6b500; background-color: #ffc900; color: #fff; } .box-notification.warning.warning-red { border-color: #EB475A; background-color: #bb331a; } .box-notification.error { background-color: #ef473a; border-color: #e42112; color: #fff; } .text-warn .popup-sub-title { margin-top: 15px; color: #e42112 !important; } .item-toggle, .item { white-space: normal; } .input-label { max-width: none; width: inherit; } .wallets { height: 110px; } input[type="number"][readonly] { background-color: #F6F7F9; padding-left: 0; } /* Turn Off Number Input Spinners */ input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } /* Spinner */ .item-icon-left ion-spinner { float: left; margin-left: -3.2em; margin-right: 1em; margin-top: -0.2em; height: 24px; } /* Wrap text from item-note */ .item-note { white-space: -moz-pre-wrap !important; white-space: -pre-wrap; white-space: -o-pre-wrap; white-space: pre-wrap; word-wrap: break-word; white-space: -webkit-pre-wrap; word-break: break-all; white-space: normal; } .back-button { border: 0; } .back-button .icon:before { color: #fff; font-size: 30px !important; font-weight: bold; margin-left: 5px; } .search-button .icon:before { color: #fff; font-size: 30px !important; margin-left: 5px; } .name-wallet { font-size: 14px; font-weight: 400; padding-top: 0 !important; line-height: 14px; } .header-modal { background: #fff; width: 100%; padding-top: 20px; padding-bottom: 20px; position: relative; } .ellipsis { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .updating div { text-align: center; } .updating .spinner { margin: auto; height: 2em; text-align: center; } .postfix { position: absolute; font-size: 20px; right: 10px; background-color: #f2f2f2; color: #445; border-radius: 4px; padding: 2px 10px; cursor: pointer; top: 21px; z-index: 10; } label .postfix { top: 38px; padding: 0 5px; } .postfix:active { opacity: 0.2; } #qr-canvas { display: none; } #qrcode-scanner-video { display: block; margin: 0 auto; } .input-notification { float: right; margin-right: 25px; } .pr { position: relative; } .m0 { margin: 0; } .p0i { padding: 0 !important; } .db { display: block; } .dib { display: inline-block; } .size-10 { font-size: 10px; } .size-12 { font-size: 12px; } .size-14 { font-size: 14px; } .size-16 { font-size: 16px; } .size-18 { font-size: 18px; } .size-20 { font-size: 21px; } .size-21 { font-size: 21px; } .size-24 { font-size: 24px; } .size-28 { font-size: 28px; } .size-36 { font-size: 36px; } .size-42 { font-size: 42px; } .m5t { margin-top: 5px; } .m5b { margin-bottom: 5px; } .m5r { margin-right: 5px; } .m10 { margin: 10px; } .m10b { margin-bottom: 10px; } .m10t { margin-top: 10px; } .m15b { margin-bottom: 15px; } .m15r { margin-right: 15px; } .m20b { margin-bottom: 20px; } .m10r { margin-right: 10px; } .m55r { margin-right: 55px; } .m10l { margin-left: 10px; } .m15l { margin-left: 15px; } .m15t { margin-top: 15px; } .m20t { margin-top: 20px; } .m20ti { margin-top: 20px !important; } .m20tp { margin-top: 20%; } .m30tp { margin-top: 30%; } .p10t { padding-top: 10px; } .p10h { padding-right: 10px; padding-left: 10px; } .p15h { padding: 0 15px; } .p20h { padding: 0 20px; } .p20v { padding: 20px 0; } .p20b { padding-bottom: 20px; } .p15 { padding: 15px; } .p20 { padding: 20px; } .p10 { padding: 10px; } .p60b { padding-bottom: 60px; } .m30v { margin: 30px 0; } .m10h { margin: 0 10px; } .m10v { margin: 10px 0; } .m20v { margin: 20px 0; } .m30v { margin: 30px 0; } .oh { overflow: hidden; } .vm { vertical-align: middle; } .ma { margin: 0 auto; } .tu { text-transform: uppercase; } .tl { text-transform: lowercase; } .text-center { text-align: center; } .text-light { font-weight: 200; } .text-bold { font-weight: 700; } .text-gray { color: gray; } .text-italic { font-style: italic; } .no-border { border-style: none; background-color: transparent !important; } input[type=file] { margin-top: 10px; margin-bottom: -10px; line-height: 0px; } .w100p { width: 100%; } .pointer { cursor: pointer; } .text-right { text-align: right; } .text-left { text-align: left; } .right { float: right; } .left { float: left; } .keyboard-open .tabs { display: none; } .keyboard-open .has-tabs { bottom: 0; } .white-space-initial { white-space: initial; }